impact-ui 0.1.13 → 0.1.15

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.
Files changed (16) hide show
  1. package/README.md +6 -6
  2. package/dist/error~ilVgTQBJ.svg +3 -0
  3. package/dist/home-disabled~QJrTaDXz.svg +3 -0
  4. package/dist/home-primary~eDtuJqft.svg +3 -0
  5. package/dist/home-secondary~UwsNJnOa.svg +3 -0
  6. package/dist/home-white~dYfNYyQZ.svg +3 -0
  7. package/dist/index.js +176 -26
  8. package/dist/index.js.map +1 -1
  9. package/dist/index.modern.js +157 -22
  10. package/dist/index.modern.js.map +1 -1
  11. package/dist/info~mklxCoQJ.svg +3 -0
  12. package/dist/notification-close~cTWnqbeV.svg +3 -0
  13. package/dist/success~jvzflZSL.svg +3 -0
  14. package/dist/warning~efleniph.svg +3 -0
  15. package/package.json +21 -5
  16. package/dist/index.css +0 -9
package/README.md CHANGED
@@ -1,13 +1,13 @@
1
- # impact-ui-poc
1
+ # impact-ui
2
2
 
3
- > Made with create-react-library
3
+ > Impact analytics UI library
4
4
 
5
- [![NPM](https://img.shields.io/npm/v/impact-ui-poc.svg)](https://www.npmjs.com/package/impact-ui-poc) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
5
+ [![NPM](https://img.shields.io/npm/v/impact-ui.svg)](https://www.npmjs.com/package/impact-ui) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
6
6
 
7
7
  ## Install
8
8
 
9
9
  ```bash
10
- npm install --save impact-ui-poc
10
+ npm install --save impact-ui
11
11
  ```
12
12
 
13
13
  ## Usage
@@ -15,8 +15,8 @@ npm install --save impact-ui-poc
15
15
  ```jsx
16
16
  import React, { Component } from 'react'
17
17
 
18
- import MyComponent from 'impact-ui-poc'
19
- import 'impact-ui-poc/dist/index.css'
18
+ import MyComponent from 'impact-ui'
19
+ import 'impact-ui/dist/index.css'
20
20
 
21
21
  class Example extends Component {
22
22
  render() {
package/dist/error~ilVgTQBJ.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="12" height="13" viewBox="0 0 12 13" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M8.48667 0.5H3.51333L0 4.01333V8.98667L3.51333 12.5H8.48667L12 8.98667V4.01333L8.48667 0.5ZM10.6667 8.43333L7.93333 11.1667H4.06667L1.33333 8.43333V4.56667L4.06667 1.83333H7.93333L10.6667 4.56667V8.43333ZM7.88667 3.67333L6 5.56L4.11333 3.67333L3.17333 4.61333L5.06 6.5L3.17333 8.38667L4.11333 9.32667L6 7.44L7.88667 9.32667L8.82667 8.38667L6.94 6.5L8.82667 4.61333L7.88667 3.67333Z" fill="#DA1E28"/>
3
+ </svg>
package/dist/home-disabled~QJrTaDXz.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="18" height="16" viewBox="0 0 18 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M7.33333 15.0832V10.0832H10.6667V15.0832H14.8333V8.4165H17.3333L9 0.916504L0.666664 8.4165H3.16666V15.0832H7.33333Z" fill="#ACACAC"/>
3
+ </svg>
package/dist/home-primary~eDtuJqft.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="18" height="16" viewBox="0 0 18 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M7.33335 15.0832V10.0832H10.6667V15.0832H14.8334V8.4165H17.3334L9.00002 0.916504L0.666687 8.4165H3.16669V15.0832H7.33335Z" fill="#0055AF"/>
3
+ </svg>
package/dist/home-secondary~UwsNJnOa.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="18" height="16" viewBox="0 0 18 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M7.33332 15.0832V10.0832H10.6667V15.0832H14.8333V8.4165H17.3333L8.99999 0.916504L0.666656 8.4165H3.16666V15.0832H7.33332Z" fill="#033162"/>
3
+ </svg>
package/dist/home-white~dYfNYyQZ.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="18" height="16" viewBox="0 0 18 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M7.33335 15.0832V10.0832H10.6667V15.0832H14.8334V8.4165H17.3334L9.00002 0.916504L0.666687 8.4165H3.16669V15.0832H7.33335Z" fill="white"/>
3
+ </svg>
package/dist/index.js CHANGED
@@ -1,6 +1,9 @@
1
1
  function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
2
2
 
3
- var styled = _interopDefault(require('styled-components'));
3
+ var color = require('components/color');
4
+ var styled = require('styled-components');
5
+ var styled__default = _interopDefault(styled);
6
+ require('react');
4
7
 
5
8
  function _taggedTemplateLiteralLoose(strings, raw) {
6
9
  if (!raw) {
@@ -10,40 +13,187 @@ function _taggedTemplateLiteralLoose(strings, raw) {
10
13
  return strings;
11
14
  }
12
15
 
13
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
14
- var StyledButton = styled.button(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n background: #1d1d1d;\n color: #fff;\n border: none;\n cursor: pointer;\n border-radius: 3px;\n height: 35px;\n box-sizing: border-box;\n padding: 0 20px;\n font-size: 14px;\n transition: all 300ms ease-in-out 0s;\n"])));
15
- var StyledPrimaryButton = styled(StyledButton)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n background: #0055AF;\n &:hover{\n background: #033162;\n }\n"])));
16
- var StyledSecondaryDiasabledButton = styled(StyledButton)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n background: #fff;\n border: 1px solid #afafaf;\n color: #AFAFAF;\n cursor: default;\n"])));
17
- var StyledSecondaryButton = styled(StyledButton)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n background: #fff;\n border: 1px solid #0055AF;\n color: #0055AF;\n &:hover{\n border: 1px solid #033162;\n color: #033162;\n }\n"])));
18
- var StyledDisabledButton = styled(StyledButton)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n background: #AFAFAF;\n cursor: default;\n"])));
19
- var StyledURLButton = styled(StyledButton)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n background: #fff;\n color: #0055AF;\n font-size: 16px;\n font-weight: 500;\n padding: 0px;\n height: auto;\n &:hover{\n color: #033162;\n }\n"])));
20
- var StyledDisabledURLButton = styled(StyledButton)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n background: #fff;\n color: #afafaf;\n font-size: 16px;\n font-weight: 500;\n padding: 0px;\n height: auto;\n cursor: default;\n"])));
21
-
22
- var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7$1, _templateObject8, _templateObject9;
23
- var StyledInputBoxContainer = styled.div(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n position: relative;\n"])));
24
- var StyledInputLabelContainer = styled.label(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n font-size: 12px;\n color: #758490;\n margin-bottom: 5px;\n text-align: left;\n"])));
25
- var StyledInputBox = styled.input(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteralLoose(["\n border: 1px solid #ACACAC;\n border-radius: 3px;\n padding: 0px 15px;\n box-sizing: border-box;\n height: 35px;\n font-size: 14px;\n color: #1d1d1d;\n &:focus{\n border: 1px solid #0055AF;\n }\n"])));
26
- var StyledInputBoxError = styled(StyledInputBox)(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n border: 1px solid #DA1E28;\n &:focus{\n border: 1px solid #DA1E28;\n }\n"])));
27
- var StyledInputBoxSuccess = styled(StyledInputBox)(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteralLoose(["\n border: 1px solid #24A148;\n &:focus{\n border: 1px solid #24A148;\n }\n"])));
28
- var StyledInputBoxDisabled = styled(StyledInputBox)(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n background: #EFEFEF;\n border: none;\n cursor: no-drop;\n pointer-events: none;\n &:focus{\n border: none;\n }\n"])));
29
- var StyledHelperText = styled.span(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n color: #758498;\n font-size: 12px;\n text-align: left;\n margin-top: 2px;\n position: absolute;\n bottom: -15px;\n left: 15px;\n font-style: italic;\n"])));
30
- var StyledErrorText = styled(StyledHelperText)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n color: #DA1E28;\n font-style: normal;\n"])));
31
- var StyledSuccessText = styled(StyledHelperText)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n color: #24A148;\n font-style: normal;\n"])));
16
+ var AlertIcon = "error~ilVgTQBJ.svg";
32
17
 
18
+ var InfoIcon = "info~mklxCoQJ.svg";
19
+
20
+ var NotificationClose = "notification-close~cTWnqbeV.svg";
21
+
22
+ var SuccessIcon = "success~jvzflZSL.svg";
23
+
24
+ var Warning = "warning~efleniph.svg";
25
+
26
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
27
+ var StyledNotification = styled__default.div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n height: 37px;\n background: #d4d4d4;\n border: 1px solid #1d1d1d;\n padding: 0px 50px;\n font-size: 14px;\n line-height: 21px;\n color: ", ";\n display: flex;\n align-items: center;\n position: relative;\n min-width: 339px;\n border-radius: 3px;\n ", "\n ", "\n ", "\n ", "\n &::before {\n content: ' ';\n width: 13.33px;\n height: 13.33px;\n background: red;\n position: absolute;\n left: 17px;\n top: 12px;\n\n ", "\n ", "\n ", "\n ", "\n }\n"])), color.BodyFontColor, function (props) {
28
+ return props.success && styled.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n "])), color.AlertGreenSuccessBackground, color.AlertGreenSuccessStroke);
29
+ }, function (props) {
30
+ return props.error && styled.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n "])), color.AlertRedErrorBackground, color.AlertRedErrorStroke);
31
+ }, function (props) {
32
+ return props.warning && styled.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n "])), color.AlertOrangeWarningBackground, color.AlertOrangeWarningStroke);
33
+ }, function (props) {
34
+ return props.info && styled.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n "])), color.AlertBlueInfoBackground, color.AlertBlueInfoStroke);
35
+ }, function (props) {
36
+ return props.success && styled.css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n background: url(", ");\n background-size: cover;\n "])), SuccessIcon);
37
+ }, function (props) {
38
+ return props.error && styled.css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n background: url(", ");\n background-size: cover;\n "])), AlertIcon);
39
+ }, function (props) {
40
+ return props.warning && styled.css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n background: url(", ");\n background-size: cover;\n background-size: 15px;\n "])), Warning);
41
+ }, function (props) {
42
+ return props.info && styled.css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n background: url(", ");\n background-size: cover;\n "])), InfoIcon);
43
+ });
44
+ var StyledNotificationContainer = styled__default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n"])));
45
+ var StyledInfoCloseIcon = styled__default.i(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n background: url(", ");\n background-size: cover;\n width: 10px;\n height: 10px;\n position: absolute;\n cursor: pointer;\n right: 15px;\n top: 0;\n bottom: 0;\n margin: auto;\n"])), NotificationClose);
46
+
47
+ var PrimaryBlueColor = '#0055AF';
48
+ var DefaultColorButton = '#ACACAC';
49
+ var CheckBoxBorder = '#394960';
50
+ var AvatarBgColor = '#EBECF0';
51
+ var BodyFontColor = '#1d1d1d';
52
+
53
+ var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7$1, _templateObject8$1;
54
+ var StyledAvatar = styled__default.span(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose(["\n width: 64px;\n height: 64px;\n background: ", ";\n display: flex;\n border-radius: 50%;\n font-size: 32px;\n font-weight: 600;\n color: #758490;\n justify-content: center;\n align-items: center;\n\n ", "\n\n ", "\n ", "\n"])), AvatarBgColor, function (props) {
55
+ return props.medium && styled.css(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n width: 48px;\n height: 48px;\n font-size: 16px;\n "])));
56
+ }, function (props) {
57
+ return props.small && styled.css(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteralLoose(["\n width: 36px;\n height: 36px;\n font-size: 14px;\n "])));
58
+ }, function (props) {
59
+ return props.exsmall && styled.css(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n font-size: 12px;\n "])));
60
+ });
61
+ var StyledAvatarImage = styled__default.img(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n ", "\n"])), function (props) {
62
+ return props.medium && styled.css(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n width: 48px;\n height: 48px;\n "])));
63
+ }, function (props) {
64
+ return props.small && styled.css(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n width: 36px;\n height: 36px;\n "])));
65
+ }, function (props) {
66
+ return props.exsmall && styled.css(_templateObject8$1 || (_templateObject8$1 = _taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n "])));
67
+ });
68
+
69
+ var _templateObject$2, _templateObject2$2, _templateObject3$2;
70
+ var StyledBreadcrumbContainer = styled__default.ul(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n"])));
71
+ var StyledBreadCrumbList = styled__default.li(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 300;\n color: ", ";\n cursor: pointer;\n ", "\n &::after {\n content: ' / ';\n padding: 0 4px;\n display: inline-block;\n color: #394960;\n }\n &:last-child {\n &::after {\n display: none;\n }\n }\n"])), color.PrimaryBlueColor, function (props) {
72
+ return props.active && styled.css(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 400;\n cursor: default;\n "])), color.CheckBoxBorder);
73
+ });
74
+
75
+ var HomeIconDisabled = "home-disabled~QJrTaDXz.svg";
76
+
77
+ var HomeIconSecondary = "home-primary~eDtuJqft.svg";
78
+
79
+ var HomeIconSecondaryHover = "home-secondary~UwsNJnOa.svg";
80
+
81
+ var HomeIconWhite = "home-white~dYfNYyQZ.svg";
82
+
83
+ var _templateObject$3, _templateObject2$3, _templateObject3$3, _templateObject4$2, _templateObject5$2, _templateObject6$2, _templateObject7$2, _templateObject8$2, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12, _templateObject13, _templateObject14;
84
+ var StyledButton = styled__default.button(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteralLoose(["\n background: #1d1d1d;\n color: ", ";\n border: none;\n cursor: pointer;\n border-radius: 3px;\n box-sizing: border-box;\n padding: 8px 20px;\n font-size: 14px;\n transition: all 300ms ease-in-out 0s;\n line-height: 21px;\n font-family: 'Poppins', sans-serif;\n\n // Primary Button\n\n ", "\n\n // Secondary Button\n\n ", "\n\n // Disabled Button\n\n ", "\n\n // Disabled secondary Button\n\n ", "\n \n //URL Button\n \n ", "\n\n //url button disabled\n\n ", "\n\n // Small Button\n\n ", "\n\n //small url\n\n ", "\n //Icon button height width property\n\n ", "\n\n //Icon button Primary\n\n ", "\n\n //Icon Button Secondary\n\n ", "\n //Icon Button Disabled Secondary \n\n ", "\n\n //Icon Button Disabled Primary\n \n ", "\n"])), color.WhiteColor, function (props) {
85
+ return props.primary && styled.css(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteralLoose(["\n background: ", ";\n &:hover {\n background: ", ";\n }\n "])), color.PrimaryBlueColor, color.SecondaryBlueColor);
86
+ }, function (props) {
87
+ return props.secondary && styled.css(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n color: ", ";\n &:hover {\n border: 1px solid ", ";\n color: ", ";\n background: ", ";\n }\n "])), color.WhiteColor, color.PrimaryBlueColor, color.PrimaryBlueColor, color.SecondaryBlueColor, color.SecondaryBlueColor, color.LightBgColorButton);
88
+ }, function (props) {
89
+ return props.disabled && styled.css(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n\n color: ", ";\n &:hover {\n cursor: default;\n background: ", ";\n }\n "])), color.DefaultColorButton, color.WhiteColor, color.DefaultColorButton);
90
+ }, function (props) {
91
+ return props.disabledSecondary && styled.css(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n color: ", ";\n cursor: default;\n &:hover {\n background: ", ";\n border: 1px solid ", ";\n color: ", ";\n }\n "])), color.WhiteColor, color.DefaultColorButton, color.DefaultColorButton, color.WhiteColor, color.DefaultColorButton, color.DefaultColorButton);
92
+ }, function (props) {
93
+ return props.url && styled.css(_templateObject6$2 || (_templateObject6$2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: none;\n color: ", ";\n padding: 0px;\n font-weight: 500;\n &:hover {\n background: ", ";\n border: none;\n color: ", ";\n }\n "])), color.WhiteColor, color.PrimaryBlueColor, color.WhiteColor, color.SecondaryBlueColor);
94
+ }, function (props) {
95
+ return props.disabledurl && styled.css(_templateObject7$2 || (_templateObject7$2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: none;\n color: ", ";\n padding: 0px;\n font-weight: 500;\n cursor: default;\n &:hover {\n background: ", ";\n border: none;\n color: ", ";\n }\n "])), color.WhiteColor, color.DefaultColorButton, color.WhiteColor, color.DefaultColorButton);
96
+ }, function (props) {
97
+ return props.smallBtn && styled.css(_templateObject8$2 || (_templateObject8$2 = _taggedTemplateLiteralLoose(["\n padding: 4px 12px;\n line-height: 18px;\n font-size: 12px;\n "])));
98
+ }, function (props) {
99
+ return props.smallUrl && styled.css(_templateObject9$1 || (_templateObject9$1 = _taggedTemplateLiteralLoose(["\n font-size: 12px;\n line-height: 18px;\n "])));
100
+ }, function (props) {
101
+ return props.iconBtn && styled.css(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteralLoose(["\n width: 36px;\n height: 36px;\n padding: 0px;\n "])));
102
+ }, function (props) {
103
+ return props.iconBtnPrimary && styled.css(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteralLoose(["\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n "])), HomeIconWhite, HomeIconWhite);
104
+ }, function (props) {
105
+ return props.iconBtnSecondary && styled.css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n "])), HomeIconSecondary, HomeIconSecondaryHover);
106
+ }, function (props) {
107
+ return props.iconBtnDisableSecondary && styled.css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n "])), HomeIconDisabled, HomeIconDisabled);
108
+ }, function (props) {
109
+ return props.iconBtnDisablePrimary && styled.css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n "])), HomeIconWhite, HomeIconWhite);
110
+ });
111
+
112
+ var _templateObject$4, _templateObject2$4, _templateObject3$4, _templateObject4$3, _templateObject5$3, _templateObject6$3, _templateObject7$3, _templateObject8$3, _templateObject9$2;
113
+ var StyledCheckboxLabel = styled__default.label(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n color: ", ";\n line-height: 21px;\n margin-left: 8px;\n cursor: pointer;\n position: relative;\n ", "\n ", "\n &::before {\n content: '';\n -webkit-appearance: none;\n background-color: transparent;\n border: 1px solid ", ";\n /* padding: 10px; */\n display: inline-block;\n position: relative;\n vertical-align: middle;\n cursor: pointer;\n margin-right: 5px;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n border-radius: 3px;\n ", "\n ", "\n }\n &::after {\n ", "\n }\n"])), BodyFontColor, function (props) {
114
+ return props.disabled && styled.css(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n cursor: default;\n pointer-events: none;\n "])));
115
+ }, function (props) {
116
+ return props.disabledChecked && styled.css(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n pointer-events: none;\n pointer-events: none;\n "])));
117
+ }, CheckBoxBorder, function (props) {
118
+ return props.disabled && styled.css(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n border: 1px solid ", ";\n cursor: default;\n "])), DefaultColorButton);
119
+ }, function (props) {
120
+ return props.disabledChecked && styled.css(_templateObject5$3 || (_templateObject5$3 = _taggedTemplateLiteralLoose(["\n border: 1px solid ", ";\n cursor: default;\n background: ", ";\n "])), DefaultColorButton, DefaultColorButton);
121
+ }, function (props) {
122
+ return props.disabledChecked && styled.css(_templateObject6$3 || (_templateObject6$3 = _taggedTemplateLiteralLoose(["\n content: '';\n display: block;\n position: absolute;\n top: 5px;\n left: 6px;\n width: 3px;\n height: 8px;\n border: solid #fff;\n border-width: 0 2px 2px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n "])));
123
+ });
124
+ var StyledCheckbox = styled__default.input(_templateObject7$3 || (_templateObject7$3 = _taggedTemplateLiteralLoose(["\n padding: 0;\n height: initial;\n width: initial;\n margin-bottom: 0;\n display: none;\n cursor: pointer;\n\n &:checked + ", "::after {\n content: '';\n display: block;\n position: absolute;\n top: 5px;\n left: 6px;\n width: 3px;\n height: 8px;\n border: solid #fff;\n border-width: 0 2px 2px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n }\n &:checked + ", "::before {\n background-color: ", ";\n border: 1px solid ", ";\n }\n"])), StyledCheckboxLabel, StyledCheckboxLabel, PrimaryBlueColor, PrimaryBlueColor);
125
+ var StyledHoverBg = styled__default.div(_templateObject8$3 || (_templateObject8$3 = _taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n background: #e5edf7;\n position: absolute;\n left: 4px;\n border-radius: 50%;\n top: -1px;\n display: none;\n"])));
126
+ var StyledCheckBoxContainer = styled__default.div(_templateObject9$2 || (_templateObject9$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n &:hover ", " {\n display: block;\n }\n"])), StyledHoverBg);
127
+
128
+ var _templateObject$5, _templateObject2$5, _templateObject3$5, _templateObject4$4, _templateObject5$4, _templateObject6$4, _templateObject7$4, _templateObject8$4, _templateObject9$3;
129
+ var StyledInputBoxContainer = styled__default.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n position: relative;\n"])));
130
+ var StyledInputLabelContainer = styled__default.label(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteralLoose(["\n font-size: 12px;\n color: #758490;\n margin-bottom: 5px;\n text-align: left;\n"])));
131
+ var StyledInputBox = styled__default.input(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteralLoose(["\n border: 1px solid #acacac;\n\n border-radius: 3px;\n padding: 0px 15px;\n box-sizing: border-box;\n height: 35px;\n font-size: 14px;\n color: #1d1d1d;\n &:focus {\n border: 1px solid #0055af;\n }\n"])));
132
+ var StyledInputBoxError = styled__default(StyledInputBox)(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n border: 1px solid #da1e28;\n &:focus {\n border: 1px solid #da1e28;\n }\n"])));
133
+ var StyledInputBoxSuccess = styled__default(StyledInputBox)(_templateObject5$4 || (_templateObject5$4 = _taggedTemplateLiteralLoose(["\n border: 1px solid #24a148;\n &:focus {\n border: 1px solid #24a148;\n }\n"])));
134
+ var StyledInputBoxDisabled = styled__default(StyledInputBox)(_templateObject6$4 || (_templateObject6$4 = _taggedTemplateLiteralLoose(["\n background: #efefef;\n border: none;\n cursor: no-drop;\n pointer-events: none;\n &:focus {\n border: none;\n }\n"])));
135
+ var StyledHelperText = styled__default.span(_templateObject7$4 || (_templateObject7$4 = _taggedTemplateLiteralLoose(["\n color: #758498;\n font-size: 12px;\n text-align: left;\n margin-top: 2px;\n position: absolute;\n bottom: -15px;\n left: 15px;\n font-style: italic;\n"])));
136
+ var StyledErrorText = styled__default(StyledHelperText)(_templateObject8$4 || (_templateObject8$4 = _taggedTemplateLiteralLoose(["\n color: #da1e28;\n font-style: normal;\n"])));
137
+ var StyledSuccessText = styled__default(StyledHelperText)(_templateObject9$3 || (_templateObject9$3 = _taggedTemplateLiteralLoose(["\n color: #24a148;\n font-style: normal;\n"])));
138
+
139
+ var _templateObject$6, _templateObject2$6, _templateObject3$6, _templateObject4$5, _templateObject5$5, _templateObject6$5, _templateObject7$5, _templateObject8$5, _templateObject9$4;
140
+ var StyledRadioButtonLabel = styled__default.label(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n color: ", ";\n line-height: 21px;\n cursor: pointer;\n position: relative;\n padding-left: 26px;\n\n ", "\n ", "\n &::before {\n content: '';\n position: absolute;\n width: 16px;\n height: 16px;\n background-color: #fff;\n border: 1px solid ", ";\n border-radius: 50%;\n top: 50%;\n transform: translateY(-50%);\n transition: border-color 400ms ease;\n left: 0px;\n\n ", "\n ", "\n }\n &::after {\n content: '';\n position: absolute;\n width: 16px;\n height: 16px;\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 50%;\n top: 50%;\n transform: translateY(-50%) scale(0);\n transition: transform 400ms ease;\n left: 0px;\n ", "\n }\n"])), color.BodyFontColor, function (props) {
141
+ return props.disabled && styled.css(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteralLoose(["\n cursor: default;\n pointer-events: none;\n "])));
142
+ }, function (props) {
143
+ return props.disabledChecked && styled.css(_templateObject3$6 || (_templateObject3$6 = _taggedTemplateLiteralLoose(["\n cursor: default;\n pointer-events: none;\n "])));
144
+ }, color.CheckBoxBorder, function (props) {
145
+ return props.disabled && styled.css(_templateObject4$5 || (_templateObject4$5 = _taggedTemplateLiteralLoose(["\n border: 1px solid ", ";\n "])), color.DefaultColorButton);
146
+ }, function (props) {
147
+ return props.disabledChecked && styled.css(_templateObject5$5 || (_templateObject5$5 = _taggedTemplateLiteralLoose(["\n border: 1px solid ", " !important;\n "])), color.DefaultColorButton);
148
+ }, color.PrimaryBlueColor, color.PrimaryBlueColor, function (props) {
149
+ return props.disabledChecked && styled.css(_templateObject6$5 || (_templateObject6$5 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n border: 1px solid ", ";\n "])), color.DefaultColorButton, color.DefaultColorButton);
150
+ });
151
+ var StyledRadioButton = styled__default.input(_templateObject7$5 || (_templateObject7$5 = _taggedTemplateLiteralLoose(["\n &:checked + ", "::before {\n border: 1px solid ", ";\n }\n &:checked + ", "::after {\n transform: translateY(-50%) scale(0.55);\n }\n"])), StyledRadioButtonLabel, color.PrimaryBlueColor, StyledRadioButtonLabel);
152
+ var StyledHoverBg$1 = styled__default.div(_templateObject8$5 || (_templateObject8$5 = _taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n background: #e5edf7;\n position: absolute;\n left: -3px;\n border-radius: 50%;\n top: -1px;\n display: none;\n"])));
153
+ var StyledRadioButtonContainer = styled__default.div(_templateObject9$4 || (_templateObject9$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n &:hover {\n ", " {\n display: block;\n }\n }\n"])), StyledHoverBg$1);
154
+
155
+ var _templateObject$7, _templateObject2$7, _templateObject3$7;
156
+ var StyledTabContainer = styled__default.ul(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteralLoose(["\n display: flex;\n border-bottom: 1px solid ", ";\n width: 100%;\n box-sizing: border-box;\n cursor: pointer;\n"])), color.DefaultColorButton);
157
+ var StyledTablist = styled__default.li(_templateObject2$7 || (_templateObject2$7 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n color: ", ";\n line-height: 21px;\n padding: 12px 16px;\n position: relative;\n ", "\n"])), color.BodyFontColor, function (props) {
158
+ return props.active && styled.css(_templateObject3$7 || (_templateObject3$7 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 600;\n cursor: default;\n &::after {\n content: ' ';\n height: 2px;\n background: ", ";\n position: absolute;\n left: 16px;\n right: 16px;\n bottom: 0;\n }\n "])), color.PrimaryBlueColor, color.PrimaryBlueColor);
159
+ });
160
+
161
+ var _templateObject$8, _templateObject2$8, _templateObject3$8, _templateObject4$6, _templateObject5$6;
162
+ var StyledLabelText = styled__default.label(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n color: ", ";\n line-height: 21px;\n display: block;\n text-align: left;\n"])), color.LabelColor);
163
+ var StyledTextArea = styled__default.textarea(_templateObject2$8 || (_templateObject2$8 = _taggedTemplateLiteralLoose(["\n min-height: 70px;\n padding: 15px;\n margin-top: 8px;\n resize: none;\n min-width: 800px;\n box-sizing: border-box;\n font-size: 14px;\n line-height: 21px;\n border: 1px solid ", ";\n border-radius: 4px;\n\n ", "\n\n &:focus {\n border: 1px solid ", ";\n }\n"])), color.CheckBoxBorder, function (props) {
164
+ return props.disabled && styled.css(_templateObject3$8 || (_templateObject3$8 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n "])), color.DisabledTextareaBg, color.DefaultColorButton);
165
+ }, color.PrimaryBlueColor);
166
+ var StyledTextAreaContainer = styled__default.div(_templateObject4$6 || (_templateObject4$6 = _taggedTemplateLiteralLoose([""])));
167
+ var StyledRemainingText = styled__default.div(_templateObject5$6 || (_templateObject5$6 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size: 14px;\n font-weight: 300;\n line-height: 21px;\n text-align: right;\n margin-top: 8px;\n"])), color.DefaultButtonText);
168
+
169
+ exports.StyledAvatar = StyledAvatar;
170
+ exports.StyledAvatarImage = StyledAvatarImage;
171
+ exports.StyledBreadCrumbList = StyledBreadCrumbList;
172
+ exports.StyledBreadcrumbContainer = StyledBreadcrumbContainer;
33
173
  exports.StyledButton = StyledButton;
34
- exports.StyledDisabledButton = StyledDisabledButton;
35
- exports.StyledDisabledURLButton = StyledDisabledURLButton;
174
+ exports.StyledCheckBoxContainer = StyledCheckBoxContainer;
175
+ exports.StyledCheckbox = StyledCheckbox;
176
+ exports.StyledCheckboxLabel = StyledCheckboxLabel;
36
177
  exports.StyledErrorText = StyledErrorText;
37
178
  exports.StyledHelperText = StyledHelperText;
179
+ exports.StyledHoverBg = StyledHoverBg;
180
+ exports.StyledInfoCloseIcon = StyledInfoCloseIcon;
38
181
  exports.StyledInputBox = StyledInputBox;
39
182
  exports.StyledInputBoxContainer = StyledInputBoxContainer;
40
183
  exports.StyledInputBoxDisabled = StyledInputBoxDisabled;
41
184
  exports.StyledInputBoxError = StyledInputBoxError;
42
185
  exports.StyledInputBoxSuccess = StyledInputBoxSuccess;
43
186
  exports.StyledInputLabelContainer = StyledInputLabelContainer;
44
- exports.StyledPrimaryButton = StyledPrimaryButton;
45
- exports.StyledSecondaryButton = StyledSecondaryButton;
46
- exports.StyledSecondaryDiasabledButton = StyledSecondaryDiasabledButton;
187
+ exports.StyledLabelText = StyledLabelText;
188
+ exports.StyledNotification = StyledNotification;
189
+ exports.StyledNotificationContainer = StyledNotificationContainer;
190
+ exports.StyledRadioButton = StyledRadioButton;
191
+ exports.StyledRadioButtonContainer = StyledRadioButtonContainer;
192
+ exports.StyledRadioButtonLabel = StyledRadioButtonLabel;
193
+ exports.StyledRemainingText = StyledRemainingText;
47
194
  exports.StyledSuccessText = StyledSuccessText;
48
- exports.StyledURLButton = StyledURLButton;
195
+ exports.StyledTabContainer = StyledTabContainer;
196
+ exports.StyledTablist = StyledTablist;
197
+ exports.StyledTextArea = StyledTextArea;
198
+ exports.StyledTextAreaContainer = StyledTextAreaContainer;
49
199
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../src/components/global-components/button/button-style.js","../src/components/global-components/inputbox/inputbox-style.js"],"sourcesContent":["import styled from 'styled-components';\n\n// export const StyledPrimaryButton = styled.button`\n// background: red;\n// border: none;\n// `\n\nexport const StyledButton = styled.button`\n background: #1d1d1d;\n color: #fff;\n border: none;\n cursor: pointer;\n border-radius: 3px;\n height: 35px;\n box-sizing: border-box;\n padding: 0 20px;\n font-size: 14px;\n transition: all 300ms ease-in-out 0s;\n`\n\nexport const StyledPrimaryButton = styled(StyledButton)`\n background: #0055AF;\n &:hover{\n background: #033162;\n }\n`;\n\nexport const StyledSecondaryDiasabledButton = styled(StyledButton)`\n background: #fff;\n border: 1px solid #afafaf;\n color: #AFAFAF;\n cursor: default;\n`;\n\nexport const StyledSecondaryButton = styled(StyledButton)`\n background: #fff;\n border: 1px solid #0055AF;\n color: #0055AF;\n &:hover{\n border: 1px solid #033162;\n color: #033162;\n }\n`;\n\nexport const StyledDisabledButton = styled(StyledButton)`\n background: #AFAFAF;\n cursor: default;\n`;\n\nexport const StyledURLButton = styled(StyledButton)`\n background: #fff;\n color: #0055AF;\n font-size: 16px;\n font-weight: 500;\n padding: 0px;\n height: auto;\n &:hover{\n color: #033162;\n }\n`;\n\nexport const StyledDisabledURLButton = styled(StyledButton)`\n background: #fff;\n color: #afafaf;\n font-size: 16px;\n font-weight: 500;\n padding: 0px;\n height: auto;\n cursor: default;\n`;\n\n","import styled from 'styled-components';\n\nexport const StyledInputBoxContainer = styled.div`\n display: flex;\n flex-direction: column;\n position: relative;\n`;\nexport const StyledInputLabelContainer = styled.label`\n font-size: 12px;\n color: #758490;\n margin-bottom: 5px;\n text-align: left;\n`;\n\nexport const StyledInputBox = styled.input`\n border: 1px solid #ACACAC;\n border-radius: 3px;\n padding: 0px 15px;\n box-sizing: border-box;\n height: 35px;\n font-size: 14px;\n color: #1d1d1d;\n &:focus{\n border: 1px solid #0055AF;\n }\n`;\nexport const StyledInputBoxError = styled(StyledInputBox)`\n border: 1px solid #DA1E28;\n &:focus{\n border: 1px solid #DA1E28;\n }\n`;\n\nexport const StyledInputBoxSuccess = styled(StyledInputBox)`\n border: 1px solid #24A148;\n &:focus{\n border: 1px solid #24A148;\n }\n`;\n\nexport const StyledInputBoxDisabled = styled(StyledInputBox)`\n background: #EFEFEF;\n border: none;\n cursor: no-drop;\n pointer-events: none;\n &:focus{\n border: none;\n }\n`;\n\nexport const StyledHelperText = styled.span`\n color: #758498;\n font-size: 12px;\n text-align: left;\n margin-top: 2px;\n position: absolute;\n bottom: -15px;\n left: 15px;\n font-style: italic;\n`;\n\nexport const StyledErrorText = styled(StyledHelperText)`\n color: #DA1E28;\n font-style: normal;\n`;\n\nexport const StyledSuccessText = styled(StyledHelperText)`\n color: #24A148;\n font-style: normal;\n`;"],"names":["StyledButton","styled","button","StyledPrimaryButton","StyledSecondaryDiasabledButton","StyledSecondaryButton","StyledDisabledButton","StyledURLButton","StyledDisabledURLButton","StyledInputBoxContainer","div","StyledInputLabelContainer","label","StyledInputBox","input","StyledInputBoxError","StyledInputBoxSuccess","StyledInputBoxDisabled","StyledHelperText","span","StyledErrorText","StyledSuccessText"],"mappings":";;;;;;;;;;;;;IAOaA,YAAY,GAAGC,MAAM,CAACC,MAAM;IAa5BC,mBAAmB,GAAGF,MAAM,CAACD,YAAY,CAAC;IAO1CI,8BAA8B,GAAGH,MAAM,CAACD,YAAY,CAAC;IAOrDK,qBAAqB,GAAGJ,MAAM,CAACD,YAAY,CAAC;IAU5CM,oBAAoB,GAAGL,MAAM,CAACD,YAAY,CAAC;IAK3CO,eAAe,GAAGN,MAAM,CAACD,YAAY,CAAC;IAYtCQ,uBAAuB,GAAGP,MAAM,CAACD,YAAY,CAAC;;;AC7D3D,IAEaS,uBAAuB,GAAGR,MAAM,CAACS,GAAG,0JAIhD;AACD,IAAaC,yBAAyB,GAAGV,MAAM,CAACW,KAAK,6KAKpD;AAED,IAAaC,cAAc,GAAGZ,MAAM,CAACa,KAAK,uTAWzC;AACD,IAAaC,mBAAmB,GAAGd,MAAM,CAACY,cAAc,CAAC,2KAKxD;AAED,IAAaG,qBAAqB,GAAGf,MAAM,CAACY,cAAc,CAAC,4KAK1D;AAED,IAAaI,sBAAsB,GAAGhB,MAAM,CAACY,cAAc,CAAC,4NAQ3D;AAED,IAAaK,gBAAgB,GAAGjB,MAAM,CAACkB,IAAI,iQAS1C;AAED,IAAaC,eAAe,GAAGnB,MAAM,CAACiB,gBAAgB,CAAC,4HAGtD;AAED,IAAaG,iBAAiB,GAAGpB,MAAM,CAACiB,gBAAgB,CAAC,4HAGxD;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":["../src/components/global-components/alerts/alerts-styles.js","../src/components/color.js","../src/components/global-components/avatar/avatar-styles.js","../src/components/global-components/breadcrumb/breadcrumb-style.js","../src/components/global-components/button/button-style.js","../src/components/global-components/checkbox/checkbox-style.js","../src/components/global-components/inputbox/inputbox-style.js","../src/components/global-components/radio/radio-styles.js","../src/components/global-components/tabs/tabs-style.js","../src/components/global-components/textarea/textarea-styles.js"],"sourcesContent":["import {\n AlertBlueInfoBackground, AlertBlueInfoStroke, AlertGreenSuccessBackground,\n AlertGreenSuccessStroke, AlertOrangeWarningBackground,\n AlertOrangeWarningStroke, AlertRedErrorBackground,\n AlertRedErrorStroke, BodyFontColor\n} from 'components/color'\nimport styled, { css } from 'styled-components'\nimport AlertIcon from './../../../assets/images/error.svg'\nimport InfoIcon from './../../../assets/images/info.svg'\nimport NotificationClose from './../../../assets/images/notification-close.svg'\nimport SuccessIcon from './../../../assets/images/success.svg'\nimport Warning from './../../../assets/images/warning.svg'\nexport const StyledNotification = styled.div`\n height: 37px;\n background: #d4d4d4;\n border: 1px solid #1d1d1d;\n padding: 0px 50px;\n font-size: 14px;\n line-height: 21px;\n color: ${BodyFontColor};\n display: flex;\n align-items: center;\n position: relative;\n min-width: 339px;\n border-radius: 3px;\n ${(props) =>\n props.success &&\n css`\n background: ${AlertGreenSuccessBackground};\n border: 1px solid ${AlertGreenSuccessStroke};\n `}\n ${(props) =>\n props.error &&\n css`\n background: ${AlertRedErrorBackground};\n border: 1px solid ${AlertRedErrorStroke};\n `}\n ${(props) =>\n props.warning &&\n css`\n background: ${AlertOrangeWarningBackground};\n border: 1px solid ${AlertOrangeWarningStroke};\n `}\n ${(props) =>\n props.info &&\n css`\n background: ${AlertBlueInfoBackground};\n border: 1px solid ${AlertBlueInfoStroke};\n `}\n &::before {\n content: ' ';\n width: 13.33px;\n height: 13.33px;\n background: red;\n position: absolute;\n left: 17px;\n top: 12px;\n\n ${(props) =>\n props.success &&\n css`\n background: url(${SuccessIcon});\n background-size: cover;\n `}\n ${(props) =>\n props.error &&\n css`\n background: url(${AlertIcon});\n background-size: cover;\n `}\n ${(props) =>\n props.warning &&\n css`\n background: url(${Warning});\n background-size: cover;\n background-size: 15px;\n `}\n ${(props) =>\n props.info &&\n css`\n background: url(${InfoIcon});\n background-size: cover;\n `}\n }\n`\nexport const StyledNotificationContainer = styled.div`\n display: flex;\n position: relative;\n`\nexport const StyledInfoCloseIcon = styled.i`\n background: url(${NotificationClose});\n background-size: cover;\n width: 10px;\n height: 10px;\n position: absolute;\n cursor: pointer;\n right: 15px;\n top: 0;\n bottom: 0;\n margin: auto;\n`\n","export const PrimaryBlueColor = '#0055AF'\nexport const SecondaryBlueColor = '#033162'\nexport const DefaultColorButton = '#ACACAC'\nexport const LightBgColorButton = '#E5EDF7'\nexport const CheckBoxBorder = '#394960'\nexport const AlertGreenSuccessStroke = '#24A148'\nexport const AlertGreenSuccessBackground = '#E8F5EC'\nexport const AlertRedErrorStroke = '#DA1E28'\nexport const AlertRedErrorBackground = '#FCE9EA'\nexport const DefaultButtonText = '#AFAFAF'\nexport const AlertOrangeWarningStroke = '#FF832B'\nexport const AlertOrangeWarningBackground = '#FFF3EA'\nexport const AlertBlueInfoBackground = '#E5EDF7'\nexport const AlertBlueInfoStroke = '#0055AF'\nexport const WhiteColor = '#ffffff'\nexport const AvatarBgColor = '#EBECF0'\nexport const BodyFontColor = '#1d1d1d'\nexport const LabelColor = '#758490'\nexport const DisabledTextareaBg = '#EFEFEF'\n","import styled, { css } from 'styled-components'\nimport { AvatarBgColor } from '../../color'\n\nexport const StyledAvatar = styled.span`\n width: 64px;\n height: 64px;\n background: ${AvatarBgColor};\n display: flex;\n border-radius: 50%;\n font-size: 32px;\n font-weight: 600;\n color: #758490;\n justify-content: center;\n align-items: center;\n\n ${(props) =>\n props.medium &&\n css`\n width: 48px;\n height: 48px;\n font-size: 16px;\n `}\n\n ${(props) =>\n props.small &&\n css`\n width: 36px;\n height: 36px;\n font-size: 14px;\n `}\n ${(props) =>\n props.exsmall &&\n css`\n width: 24px;\n height: 24px;\n font-size: 12px;\n `}\n`\n\nexport const StyledAvatarImage = styled.img`\n ${(props) =>\n props.medium &&\n css`\n width: 48px;\n height: 48px;\n `}\n ${(props) =>\n props.small &&\n css`\n width: 36px;\n height: 36px;\n `}\n ${(props) =>\n props.exsmall &&\n css`\n width: 24px;\n height: 24px;\n `}\n`\n","import { CheckBoxBorder, PrimaryBlueColor } from 'components/color'\nimport styled, { css } from 'styled-components'\n\nexport const StyledBreadcrumbContainer = styled.ul`\n display: flex;\n`\nexport const StyledBreadCrumbList = styled.li`\n font-size: 14px;\n font-weight: 300;\n color: ${PrimaryBlueColor};\n cursor: pointer;\n ${(props) =>\n props.active &&\n css`\n color: ${CheckBoxBorder};\n font-weight: 400;\n cursor: default;\n `}\n &::after {\n content: ' / ';\n padding: 0 4px;\n display: inline-block;\n color: #394960;\n }\n &:last-child {\n &::after {\n display: none;\n }\n }\n`\n","import {\n DefaultColorButton, LightBgColorButton, PrimaryBlueColor,\n SecondaryBlueColor,\n WhiteColor\n} from 'components/color'\nimport styled, { css } from 'styled-components'\nimport HomeIconDisabled from './../../../assets/images/home-disabled.svg'\nimport HomeIconSecondary from './../../../assets/images/home-primary.svg'\nimport HomeIconSecondaryHover from './../../../assets/images/home-secondary.svg'\nimport HomeIconWhite from './../../../assets/images/home-white.svg'\n// Common Button\n\nexport const StyledButton = styled.button`\n background: #1d1d1d;\n color: ${WhiteColor};\n border: none;\n cursor: pointer;\n border-radius: 3px;\n box-sizing: border-box;\n padding: 8px 20px;\n font-size: 14px;\n transition: all 300ms ease-in-out 0s;\n line-height: 21px;\n font-family: 'Poppins', sans-serif;\n\n // Primary Button\n\n ${(props) =>\n props.primary &&\n css`\n background: ${PrimaryBlueColor};\n &:hover {\n background: ${SecondaryBlueColor};\n }\n `}\n\n // Secondary Button\n\n ${(props) =>\n props.secondary &&\n css`\n background: ${WhiteColor};\n border: 1px solid ${PrimaryBlueColor};\n color: ${PrimaryBlueColor};\n &:hover {\n border: 1px solid ${SecondaryBlueColor};\n color: ${SecondaryBlueColor};\n background: ${LightBgColorButton};\n }\n `}\n\n // Disabled Button\n\n ${(props) =>\n props.disabled &&\n css`\n background: ${DefaultColorButton};\n\n color: ${WhiteColor};\n &:hover {\n cursor: default;\n background: ${DefaultColorButton};\n }\n `}\n\n // Disabled secondary Button\n\n ${(props) =>\n props.disabledSecondary &&\n css`\n background: ${WhiteColor};\n border: 1px solid ${DefaultColorButton};\n color: ${DefaultColorButton};\n cursor: default;\n &:hover {\n background: ${WhiteColor};\n border: 1px solid ${DefaultColorButton};\n color: ${DefaultColorButton};\n }\n `}\n \n //URL Button\n \n ${(props) =>\n props.url &&\n css`\n background: ${WhiteColor};\n border: none;\n color: ${PrimaryBlueColor};\n padding: 0px;\n font-weight: 500;\n &:hover {\n background: ${WhiteColor};\n border: none;\n color: ${SecondaryBlueColor};\n }\n `}\n\n //url button disabled\n\n ${(props) =>\n props.disabledurl &&\n css`\n background: ${WhiteColor};\n border: none;\n color: ${DefaultColorButton};\n padding: 0px;\n font-weight: 500;\n cursor: default;\n &:hover {\n background: ${WhiteColor};\n border: none;\n color: ${DefaultColorButton};\n }\n `}\n\n // Small Button\n\n ${(props) =>\n props.smallBtn &&\n css`\n padding: 4px 12px;\n line-height: 18px;\n font-size: 12px;\n `}\n\n //small url\n\n ${(props) =>\n props.smallUrl &&\n css`\n font-size: 12px;\n line-height: 18px;\n `}\n //Icon button height width property\n\n ${(props) =>\n props.iconBtn &&\n css`\n width: 36px;\n height: 36px;\n padding: 0px;\n `}\n\n //Icon button Primary\n\n ${(props) =>\n props.iconBtnPrimary &&\n css`\n background-image: url(${HomeIconWhite});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(${HomeIconWhite});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n `}\n\n //Icon Button Secondary\n\n ${(props) =>\n props.iconBtnSecondary &&\n css`\n background-image: url(${HomeIconSecondary});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(${HomeIconSecondaryHover});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n `}\n //Icon Button Disabled Secondary \n\n ${(props) =>\n props.iconBtnDisableSecondary &&\n css`\n background-image: url(${HomeIconDisabled});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(${HomeIconDisabled});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n `}\n\n //Icon Button Disabled Primary\n \n ${(props) =>\n props.iconBtnDisablePrimary &&\n css`\n background-image: url(${HomeIconWhite});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(${HomeIconWhite});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n `}\n`\n","import styled, { css } from 'styled-components'\nimport {\n BodyFontColor,\n CheckBoxBorder,\n DefaultColorButton,\n PrimaryBlueColor\n} from '../../color'\n\nexport const StyledCheckboxLabel = styled.label`\n font-size: 14px;\n color: ${BodyFontColor};\n line-height: 21px;\n margin-left: 8px;\n cursor: pointer;\n position: relative;\n ${(props) =>\n props.disabled &&\n css`\n cursor: default;\n pointer-events: none;\n `}\n ${(props) =>\n props.disabledChecked &&\n css`\n pointer-events: none;\n pointer-events: none;\n `}\n &::before {\n content: '';\n -webkit-appearance: none;\n background-color: transparent;\n border: 1px solid ${CheckBoxBorder};\n /* padding: 10px; */\n display: inline-block;\n position: relative;\n vertical-align: middle;\n cursor: pointer;\n margin-right: 5px;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n border-radius: 3px;\n ${(props) =>\n props.disabled &&\n css`\n border: 1px solid ${DefaultColorButton};\n cursor: default;\n `}\n ${(props) =>\n props.disabledChecked &&\n css`\n border: 1px solid ${DefaultColorButton};\n cursor: default;\n background: ${DefaultColorButton};\n `}\n }\n &::after {\n ${(props) =>\n props.disabledChecked &&\n css`\n content: '';\n display: block;\n position: absolute;\n top: 5px;\n left: 6px;\n width: 3px;\n height: 8px;\n border: solid #fff;\n border-width: 0 2px 2px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n `}\n }\n`\n\nexport const StyledCheckbox = styled.input`\n padding: 0;\n height: initial;\n width: initial;\n margin-bottom: 0;\n display: none;\n cursor: pointer;\n\n &:checked + ${StyledCheckboxLabel}::after {\n content: '';\n display: block;\n position: absolute;\n top: 5px;\n left: 6px;\n width: 3px;\n height: 8px;\n border: solid #fff;\n border-width: 0 2px 2px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n }\n &:checked + ${StyledCheckboxLabel}::before {\n background-color: ${PrimaryBlueColor};\n border: 1px solid ${PrimaryBlueColor};\n }\n`\n\nexport const StyledHoverBg = styled.div`\n width: 24px;\n height: 24px;\n background: #e5edf7;\n position: absolute;\n left: 4px;\n border-radius: 50%;\n top: -1px;\n display: none;\n`\n\nexport const StyledCheckBoxContainer = styled.div`\n display: flex;\n align-items: center;\n position: relative;\n &:hover ${StyledHoverBg} {\n display: block;\n }\n`\n","import styled from 'styled-components'\n\nexport const StyledInputBoxContainer = styled.div`\n display: flex;\n flex-direction: column;\n position: relative;\n`\nexport const StyledInputLabelContainer = styled.label`\n font-size: 12px;\n color: #758490;\n margin-bottom: 5px;\n text-align: left;\n`\n\nexport const StyledInputBox = styled.input`\n border: 1px solid #acacac;\n\n border-radius: 3px;\n padding: 0px 15px;\n box-sizing: border-box;\n height: 35px;\n font-size: 14px;\n color: #1d1d1d;\n &:focus {\n border: 1px solid #0055af;\n }\n`\nexport const StyledInputBoxError = styled(StyledInputBox)`\n border: 1px solid #da1e28;\n &:focus {\n border: 1px solid #da1e28;\n }\n`\n\nexport const StyledInputBoxSuccess = styled(StyledInputBox)`\n border: 1px solid #24a148;\n &:focus {\n border: 1px solid #24a148;\n }\n`\n\nexport const StyledInputBoxDisabled = styled(StyledInputBox)`\n background: #efefef;\n border: none;\n cursor: no-drop;\n pointer-events: none;\n &:focus {\n border: none;\n }\n`\n\nexport const StyledHelperText = styled.span`\n color: #758498;\n font-size: 12px;\n text-align: left;\n margin-top: 2px;\n position: absolute;\n bottom: -15px;\n left: 15px;\n font-style: italic;\n`\n\nexport const StyledErrorText = styled(StyledHelperText)`\n color: #da1e28;\n font-style: normal;\n`\n\nexport const StyledSuccessText = styled(StyledHelperText)`\n color: #24a148;\n font-style: normal;\n`\n","import {\n BodyFontColor,\n CheckBoxBorder, DefaultColorButton, PrimaryBlueColor\n} from 'components/color'\nimport styled, { css } from 'styled-components'\n\nexport const StyledRadioButtonLabel = styled.label`\n font-size: 14px;\n color: ${BodyFontColor};\n line-height: 21px;\n cursor: pointer;\n position: relative;\n padding-left: 26px;\n\n ${(props) =>\n props.disabled &&\n css`\n cursor: default;\n pointer-events: none;\n `}\n ${(props) =>\n props.disabledChecked &&\n css`\n cursor: default;\n pointer-events: none;\n `}\n &::before {\n content: '';\n position: absolute;\n width: 16px;\n height: 16px;\n background-color: #fff;\n border: 1px solid ${CheckBoxBorder};\n border-radius: 50%;\n top: 50%;\n transform: translateY(-50%);\n transition: border-color 400ms ease;\n left: 0px;\n\n ${(props) =>\n props.disabled &&\n css`\n border: 1px solid ${DefaultColorButton};\n `}\n ${(props) =>\n props.disabledChecked &&\n css`\n border: 1px solid ${DefaultColorButton} !important;\n `}\n }\n &::after {\n content: '';\n position: absolute;\n width: 16px;\n height: 16px;\n background-color: ${PrimaryBlueColor};\n border: 1px solid ${PrimaryBlueColor};\n border-radius: 50%;\n top: 50%;\n transform: translateY(-50%) scale(0);\n transition: transform 400ms ease;\n left: 0px;\n ${(props) =>\n props.disabledChecked &&\n css`\n background-color: ${DefaultColorButton};\n border: 1px solid ${DefaultColorButton};\n `}\n }\n`\n\nexport const StyledRadioButton = styled.input`\n &:checked + ${StyledRadioButtonLabel}::before {\n border: 1px solid ${PrimaryBlueColor};\n }\n &:checked + ${StyledRadioButtonLabel}::after {\n transform: translateY(-50%) scale(0.55);\n }\n`\n\nexport const StyledHoverBg = styled.div`\n width: 24px;\n height: 24px;\n background: #e5edf7;\n position: absolute;\n left: -3px;\n border-radius: 50%;\n top: -1px;\n display: none;\n`\nexport const StyledRadioButtonContainer = styled.div`\n display: flex;\n align-items: center;\n position: relative;\n &:hover {\n ${StyledHoverBg} {\n display: block;\n }\n }\n`\n","import {\n BodyFontColor,\n DefaultColorButton,\n PrimaryBlueColor\n} from 'components/color'\nimport styled, { css } from 'styled-components'\nexport const StyledTabContainer = styled.ul`\n display: flex;\n border-bottom: 1px solid ${DefaultColorButton};\n width: 100%;\n box-sizing: border-box;\n cursor: pointer;\n`\nexport const StyledTablist = styled.li`\n font-size: 14px;\n color: ${BodyFontColor};\n line-height: 21px;\n padding: 12px 16px;\n position: relative;\n ${(props) =>\n props.active &&\n css`\n color: ${PrimaryBlueColor};\n font-weight: 600;\n cursor: default;\n &::after {\n content: ' ';\n height: 2px;\n background: ${PrimaryBlueColor};\n position: absolute;\n left: 16px;\n right: 16px;\n bottom: 0;\n }\n `}\n`\n","import {\n CheckBoxBorder,\n DefaultButtonText,\n DefaultColorButton,\n DisabledTextareaBg,\n LabelColor,\n PrimaryBlueColor\n} from 'components/color'\nimport styled, { css } from 'styled-components'\n\nexport const StyledLabelText = styled.label`\n font-size: 14px;\n color: ${LabelColor};\n line-height: 21px;\n display: block;\n text-align: left;\n`\nexport const StyledTextArea = styled.textarea`\n min-height: 70px;\n padding: 15px;\n margin-top: 8px;\n resize: none;\n min-width: 800px;\n box-sizing: border-box;\n font-size: 14px;\n line-height: 21px;\n border: 1px solid ${CheckBoxBorder};\n border-radius: 4px;\n\n ${(props) =>\n props.disabled &&\n css`\n background: ${DisabledTextareaBg};\n border: 1px solid ${DefaultColorButton};\n `}\n\n &:focus {\n border: 1px solid ${PrimaryBlueColor};\n }\n`\nexport const StyledTextAreaContainer = styled.div``\nexport const StyledRemainingText = styled.div`\n color: ${DefaultButtonText};\n font-size: 14px;\n font-weight: 300;\n line-height: 21px;\n text-align: right;\n margin-top: 8px;\n`\n"],"names":["StyledNotification","styled","div","BodyFontColor","props","success","css","AlertGreenSuccessBackground","AlertGreenSuccessStroke","error","AlertRedErrorBackground","AlertRedErrorStroke","warning","AlertOrangeWarningBackground","AlertOrangeWarningStroke","info","AlertBlueInfoBackground","AlertBlueInfoStroke","SuccessIcon","AlertIcon","Warning","InfoIcon","StyledNotificationContainer","StyledInfoCloseIcon","i","NotificationClose","PrimaryBlueColor","DefaultColorButton","CheckBoxBorder","AvatarBgColor","StyledAvatar","span","medium","small","exsmall","StyledAvatarImage","img","StyledBreadcrumbContainer","ul","StyledBreadCrumbList","li","active","StyledButton","button","WhiteColor","primary","SecondaryBlueColor","secondary","LightBgColorButton","disabled","disabledSecondary","url","disabledurl","smallBtn","smallUrl","iconBtn","iconBtnPrimary","HomeIconWhite","iconBtnSecondary","HomeIconSecondary","HomeIconSecondaryHover","iconBtnDisableSecondary","HomeIconDisabled","iconBtnDisablePrimary","StyledCheckboxLabel","label","disabledChecked","StyledCheckbox","input","StyledHoverBg","StyledCheckBoxContainer","StyledInputBoxContainer","StyledInputLabelContainer","StyledInputBox","StyledInputBoxError","StyledInputBoxSuccess","StyledInputBoxDisabled","StyledHelperText","StyledErrorText","StyledSuccessText","StyledRadioButtonLabel","StyledRadioButton","StyledRadioButtonContainer","StyledTabContainer","StyledTablist","StyledLabelText","LabelColor","StyledTextArea","textarea","DisabledTextareaBg","StyledTextAreaContainer","StyledRemainingText","DefaultButtonText"],"mappings":"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"}
package/dist/index.modern.js CHANGED
@@ -1,4 +1,6 @@
1
- import styled from 'styled-components';
1
+ import { BodyFontColor as BodyFontColor$1, AlertGreenSuccessBackground, AlertGreenSuccessStroke, AlertRedErrorBackground, AlertRedErrorStroke, AlertOrangeWarningBackground, AlertOrangeWarningStroke, AlertBlueInfoBackground, AlertBlueInfoStroke, PrimaryBlueColor as PrimaryBlueColor$1, CheckBoxBorder as CheckBoxBorder$1, WhiteColor, SecondaryBlueColor, LightBgColorButton, DefaultColorButton as DefaultColorButton$1, LabelColor, DisabledTextareaBg, DefaultButtonText } from 'components/color';
2
+ import styled, { css } from 'styled-components';
3
+ import 'react';
2
4
 
3
5
  function _taggedTemplateLiteralLoose(strings, raw) {
4
6
  if (!raw) {
@@ -8,25 +10,158 @@ function _taggedTemplateLiteralLoose(strings, raw) {
8
10
  return strings;
9
11
  }
10
12
 
11
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
12
- var StyledButton = styled.button(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n background: #1d1d1d;\n color: #fff;\n border: none;\n cursor: pointer;\n border-radius: 3px;\n height: 35px;\n box-sizing: border-box;\n padding: 0 20px;\n font-size: 14px;\n transition: all 300ms ease-in-out 0s;\n"])));
13
- var StyledPrimaryButton = styled(StyledButton)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n background: #0055AF;\n &:hover{\n background: #033162;\n }\n"])));
14
- var StyledSecondaryDiasabledButton = styled(StyledButton)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n background: #fff;\n border: 1px solid #afafaf;\n color: #AFAFAF;\n cursor: default;\n"])));
15
- var StyledSecondaryButton = styled(StyledButton)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n background: #fff;\n border: 1px solid #0055AF;\n color: #0055AF;\n &:hover{\n border: 1px solid #033162;\n color: #033162;\n }\n"])));
16
- var StyledDisabledButton = styled(StyledButton)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n background: #AFAFAF;\n cursor: default;\n"])));
17
- var StyledURLButton = styled(StyledButton)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n background: #fff;\n color: #0055AF;\n font-size: 16px;\n font-weight: 500;\n padding: 0px;\n height: auto;\n &:hover{\n color: #033162;\n }\n"])));
18
- var StyledDisabledURLButton = styled(StyledButton)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n background: #fff;\n color: #afafaf;\n font-size: 16px;\n font-weight: 500;\n padding: 0px;\n height: auto;\n cursor: default;\n"])));
19
-
20
- var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7$1, _templateObject8, _templateObject9;
21
- var StyledInputBoxContainer = styled.div(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n position: relative;\n"])));
22
- var StyledInputLabelContainer = styled.label(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n font-size: 12px;\n color: #758490;\n margin-bottom: 5px;\n text-align: left;\n"])));
23
- var StyledInputBox = styled.input(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteralLoose(["\n border: 1px solid #ACACAC;\n border-radius: 3px;\n padding: 0px 15px;\n box-sizing: border-box;\n height: 35px;\n font-size: 14px;\n color: #1d1d1d;\n &:focus{\n border: 1px solid #0055AF;\n }\n"])));
24
- var StyledInputBoxError = styled(StyledInputBox)(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n border: 1px solid #DA1E28;\n &:focus{\n border: 1px solid #DA1E28;\n }\n"])));
25
- var StyledInputBoxSuccess = styled(StyledInputBox)(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteralLoose(["\n border: 1px solid #24A148;\n &:focus{\n border: 1px solid #24A148;\n }\n"])));
26
- var StyledInputBoxDisabled = styled(StyledInputBox)(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n background: #EFEFEF;\n border: none;\n cursor: no-drop;\n pointer-events: none;\n &:focus{\n border: none;\n }\n"])));
27
- var StyledHelperText = styled.span(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n color: #758498;\n font-size: 12px;\n text-align: left;\n margin-top: 2px;\n position: absolute;\n bottom: -15px;\n left: 15px;\n font-style: italic;\n"])));
28
- var StyledErrorText = styled(StyledHelperText)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n color: #DA1E28;\n font-style: normal;\n"])));
29
- var StyledSuccessText = styled(StyledHelperText)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n color: #24A148;\n font-style: normal;\n"])));
30
-
31
- export { StyledButton, StyledDisabledButton, StyledDisabledURLButton, StyledErrorText, StyledHelperText, StyledInputBox, StyledInputBoxContainer, StyledInputBoxDisabled, StyledInputBoxError, StyledInputBoxSuccess, StyledInputLabelContainer, StyledPrimaryButton, StyledSecondaryButton, StyledSecondaryDiasabledButton, StyledSuccessText, StyledURLButton };
13
+ var AlertIcon = "error~ilVgTQBJ.svg";
14
+
15
+ var InfoIcon = "info~mklxCoQJ.svg";
16
+
17
+ var NotificationClose = "notification-close~cTWnqbeV.svg";
18
+
19
+ var SuccessIcon = "success~jvzflZSL.svg";
20
+
21
+ var Warning = "warning~efleniph.svg";
22
+
23
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
24
+ var StyledNotification = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n height: 37px;\n background: #d4d4d4;\n border: 1px solid #1d1d1d;\n padding: 0px 50px;\n font-size: 14px;\n line-height: 21px;\n color: ", ";\n display: flex;\n align-items: center;\n position: relative;\n min-width: 339px;\n border-radius: 3px;\n ", "\n ", "\n ", "\n ", "\n &::before {\n content: ' ';\n width: 13.33px;\n height: 13.33px;\n background: red;\n position: absolute;\n left: 17px;\n top: 12px;\n\n ", "\n ", "\n ", "\n ", "\n }\n"])), BodyFontColor$1, function (props) {
25
+ return props.success && css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n "])), AlertGreenSuccessBackground, AlertGreenSuccessStroke);
26
+ }, function (props) {
27
+ return props.error && css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n "])), AlertRedErrorBackground, AlertRedErrorStroke);
28
+ }, function (props) {
29
+ return props.warning && css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n "])), AlertOrangeWarningBackground, AlertOrangeWarningStroke);
30
+ }, function (props) {
31
+ return props.info && css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n "])), AlertBlueInfoBackground, AlertBlueInfoStroke);
32
+ }, function (props) {
33
+ return props.success && css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n background: url(", ");\n background-size: cover;\n "])), SuccessIcon);
34
+ }, function (props) {
35
+ return props.error && css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n background: url(", ");\n background-size: cover;\n "])), AlertIcon);
36
+ }, function (props) {
37
+ return props.warning && css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n background: url(", ");\n background-size: cover;\n background-size: 15px;\n "])), Warning);
38
+ }, function (props) {
39
+ return props.info && css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n background: url(", ");\n background-size: cover;\n "])), InfoIcon);
40
+ });
41
+ var StyledNotificationContainer = styled.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n"])));
42
+ var StyledInfoCloseIcon = styled.i(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n background: url(", ");\n background-size: cover;\n width: 10px;\n height: 10px;\n position: absolute;\n cursor: pointer;\n right: 15px;\n top: 0;\n bottom: 0;\n margin: auto;\n"])), NotificationClose);
43
+
44
+ var PrimaryBlueColor = '#0055AF';
45
+ var DefaultColorButton = '#ACACAC';
46
+ var CheckBoxBorder = '#394960';
47
+ var AvatarBgColor = '#EBECF0';
48
+ var BodyFontColor = '#1d1d1d';
49
+
50
+ var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7$1, _templateObject8$1;
51
+ var StyledAvatar = styled.span(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose(["\n width: 64px;\n height: 64px;\n background: ", ";\n display: flex;\n border-radius: 50%;\n font-size: 32px;\n font-weight: 600;\n color: #758490;\n justify-content: center;\n align-items: center;\n\n ", "\n\n ", "\n ", "\n"])), AvatarBgColor, function (props) {
52
+ return props.medium && css(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n width: 48px;\n height: 48px;\n font-size: 16px;\n "])));
53
+ }, function (props) {
54
+ return props.small && css(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteralLoose(["\n width: 36px;\n height: 36px;\n font-size: 14px;\n "])));
55
+ }, function (props) {
56
+ return props.exsmall && css(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n font-size: 12px;\n "])));
57
+ });
58
+ var StyledAvatarImage = styled.img(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n ", "\n"])), function (props) {
59
+ return props.medium && css(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n width: 48px;\n height: 48px;\n "])));
60
+ }, function (props) {
61
+ return props.small && css(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n width: 36px;\n height: 36px;\n "])));
62
+ }, function (props) {
63
+ return props.exsmall && css(_templateObject8$1 || (_templateObject8$1 = _taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n "])));
64
+ });
65
+
66
+ var _templateObject$2, _templateObject2$2, _templateObject3$2;
67
+ var StyledBreadcrumbContainer = styled.ul(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n"])));
68
+ var StyledBreadCrumbList = styled.li(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 300;\n color: ", ";\n cursor: pointer;\n ", "\n &::after {\n content: ' / ';\n padding: 0 4px;\n display: inline-block;\n color: #394960;\n }\n &:last-child {\n &::after {\n display: none;\n }\n }\n"])), PrimaryBlueColor$1, function (props) {
69
+ return props.active && css(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 400;\n cursor: default;\n "])), CheckBoxBorder$1);
70
+ });
71
+
72
+ var HomeIconDisabled = "home-disabled~QJrTaDXz.svg";
73
+
74
+ var HomeIconSecondary = "home-primary~eDtuJqft.svg";
75
+
76
+ var HomeIconSecondaryHover = "home-secondary~UwsNJnOa.svg";
77
+
78
+ var HomeIconWhite = "home-white~dYfNYyQZ.svg";
79
+
80
+ var _templateObject$3, _templateObject2$3, _templateObject3$3, _templateObject4$2, _templateObject5$2, _templateObject6$2, _templateObject7$2, _templateObject8$2, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12, _templateObject13, _templateObject14;
81
+ var StyledButton = styled.button(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteralLoose(["\n background: #1d1d1d;\n color: ", ";\n border: none;\n cursor: pointer;\n border-radius: 3px;\n box-sizing: border-box;\n padding: 8px 20px;\n font-size: 14px;\n transition: all 300ms ease-in-out 0s;\n line-height: 21px;\n font-family: 'Poppins', sans-serif;\n\n // Primary Button\n\n ", "\n\n // Secondary Button\n\n ", "\n\n // Disabled Button\n\n ", "\n\n // Disabled secondary Button\n\n ", "\n \n //URL Button\n \n ", "\n\n //url button disabled\n\n ", "\n\n // Small Button\n\n ", "\n\n //small url\n\n ", "\n //Icon button height width property\n\n ", "\n\n //Icon button Primary\n\n ", "\n\n //Icon Button Secondary\n\n ", "\n //Icon Button Disabled Secondary \n\n ", "\n\n //Icon Button Disabled Primary\n \n ", "\n"])), WhiteColor, function (props) {
82
+ return props.primary && css(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteralLoose(["\n background: ", ";\n &:hover {\n background: ", ";\n }\n "])), PrimaryBlueColor$1, SecondaryBlueColor);
83
+ }, function (props) {
84
+ return props.secondary && css(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n color: ", ";\n &:hover {\n border: 1px solid ", ";\n color: ", ";\n background: ", ";\n }\n "])), WhiteColor, PrimaryBlueColor$1, PrimaryBlueColor$1, SecondaryBlueColor, SecondaryBlueColor, LightBgColorButton);
85
+ }, function (props) {
86
+ return props.disabled && css(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n\n color: ", ";\n &:hover {\n cursor: default;\n background: ", ";\n }\n "])), DefaultColorButton$1, WhiteColor, DefaultColorButton$1);
87
+ }, function (props) {
88
+ return props.disabledSecondary && css(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n color: ", ";\n cursor: default;\n &:hover {\n background: ", ";\n border: 1px solid ", ";\n color: ", ";\n }\n "])), WhiteColor, DefaultColorButton$1, DefaultColorButton$1, WhiteColor, DefaultColorButton$1, DefaultColorButton$1);
89
+ }, function (props) {
90
+ return props.url && css(_templateObject6$2 || (_templateObject6$2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: none;\n color: ", ";\n padding: 0px;\n font-weight: 500;\n &:hover {\n background: ", ";\n border: none;\n color: ", ";\n }\n "])), WhiteColor, PrimaryBlueColor$1, WhiteColor, SecondaryBlueColor);
91
+ }, function (props) {
92
+ return props.disabledurl && css(_templateObject7$2 || (_templateObject7$2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: none;\n color: ", ";\n padding: 0px;\n font-weight: 500;\n cursor: default;\n &:hover {\n background: ", ";\n border: none;\n color: ", ";\n }\n "])), WhiteColor, DefaultColorButton$1, WhiteColor, DefaultColorButton$1);
93
+ }, function (props) {
94
+ return props.smallBtn && css(_templateObject8$2 || (_templateObject8$2 = _taggedTemplateLiteralLoose(["\n padding: 4px 12px;\n line-height: 18px;\n font-size: 12px;\n "])));
95
+ }, function (props) {
96
+ return props.smallUrl && css(_templateObject9$1 || (_templateObject9$1 = _taggedTemplateLiteralLoose(["\n font-size: 12px;\n line-height: 18px;\n "])));
97
+ }, function (props) {
98
+ return props.iconBtn && css(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteralLoose(["\n width: 36px;\n height: 36px;\n padding: 0px;\n "])));
99
+ }, function (props) {
100
+ return props.iconBtnPrimary && css(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteralLoose(["\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n "])), HomeIconWhite, HomeIconWhite);
101
+ }, function (props) {
102
+ return props.iconBtnSecondary && css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n "])), HomeIconSecondary, HomeIconSecondaryHover);
103
+ }, function (props) {
104
+ return props.iconBtnDisableSecondary && css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n "])), HomeIconDisabled, HomeIconDisabled);
105
+ }, function (props) {
106
+ return props.iconBtnDisablePrimary && css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(", ");\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n "])), HomeIconWhite, HomeIconWhite);
107
+ });
108
+
109
+ var _templateObject$4, _templateObject2$4, _templateObject3$4, _templateObject4$3, _templateObject5$3, _templateObject6$3, _templateObject7$3, _templateObject8$3, _templateObject9$2;
110
+ var StyledCheckboxLabel = styled.label(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n color: ", ";\n line-height: 21px;\n margin-left: 8px;\n cursor: pointer;\n position: relative;\n ", "\n ", "\n &::before {\n content: '';\n -webkit-appearance: none;\n background-color: transparent;\n border: 1px solid ", ";\n /* padding: 10px; */\n display: inline-block;\n position: relative;\n vertical-align: middle;\n cursor: pointer;\n margin-right: 5px;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n border-radius: 3px;\n ", "\n ", "\n }\n &::after {\n ", "\n }\n"])), BodyFontColor, function (props) {
111
+ return props.disabled && css(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n cursor: default;\n pointer-events: none;\n "])));
112
+ }, function (props) {
113
+ return props.disabledChecked && css(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n pointer-events: none;\n pointer-events: none;\n "])));
114
+ }, CheckBoxBorder, function (props) {
115
+ return props.disabled && css(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n border: 1px solid ", ";\n cursor: default;\n "])), DefaultColorButton);
116
+ }, function (props) {
117
+ return props.disabledChecked && css(_templateObject5$3 || (_templateObject5$3 = _taggedTemplateLiteralLoose(["\n border: 1px solid ", ";\n cursor: default;\n background: ", ";\n "])), DefaultColorButton, DefaultColorButton);
118
+ }, function (props) {
119
+ return props.disabledChecked && css(_templateObject6$3 || (_templateObject6$3 = _taggedTemplateLiteralLoose(["\n content: '';\n display: block;\n position: absolute;\n top: 5px;\n left: 6px;\n width: 3px;\n height: 8px;\n border: solid #fff;\n border-width: 0 2px 2px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n "])));
120
+ });
121
+ var StyledCheckbox = styled.input(_templateObject7$3 || (_templateObject7$3 = _taggedTemplateLiteralLoose(["\n padding: 0;\n height: initial;\n width: initial;\n margin-bottom: 0;\n display: none;\n cursor: pointer;\n\n &:checked + ", "::after {\n content: '';\n display: block;\n position: absolute;\n top: 5px;\n left: 6px;\n width: 3px;\n height: 8px;\n border: solid #fff;\n border-width: 0 2px 2px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n }\n &:checked + ", "::before {\n background-color: ", ";\n border: 1px solid ", ";\n }\n"])), StyledCheckboxLabel, StyledCheckboxLabel, PrimaryBlueColor, PrimaryBlueColor);
122
+ var StyledHoverBg = styled.div(_templateObject8$3 || (_templateObject8$3 = _taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n background: #e5edf7;\n position: absolute;\n left: 4px;\n border-radius: 50%;\n top: -1px;\n display: none;\n"])));
123
+ var StyledCheckBoxContainer = styled.div(_templateObject9$2 || (_templateObject9$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n &:hover ", " {\n display: block;\n }\n"])), StyledHoverBg);
124
+
125
+ var _templateObject$5, _templateObject2$5, _templateObject3$5, _templateObject4$4, _templateObject5$4, _templateObject6$4, _templateObject7$4, _templateObject8$4, _templateObject9$3;
126
+ var StyledInputBoxContainer = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n position: relative;\n"])));
127
+ var StyledInputLabelContainer = styled.label(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteralLoose(["\n font-size: 12px;\n color: #758490;\n margin-bottom: 5px;\n text-align: left;\n"])));
128
+ var StyledInputBox = styled.input(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteralLoose(["\n border: 1px solid #acacac;\n\n border-radius: 3px;\n padding: 0px 15px;\n box-sizing: border-box;\n height: 35px;\n font-size: 14px;\n color: #1d1d1d;\n &:focus {\n border: 1px solid #0055af;\n }\n"])));
129
+ var StyledInputBoxError = styled(StyledInputBox)(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n border: 1px solid #da1e28;\n &:focus {\n border: 1px solid #da1e28;\n }\n"])));
130
+ var StyledInputBoxSuccess = styled(StyledInputBox)(_templateObject5$4 || (_templateObject5$4 = _taggedTemplateLiteralLoose(["\n border: 1px solid #24a148;\n &:focus {\n border: 1px solid #24a148;\n }\n"])));
131
+ var StyledInputBoxDisabled = styled(StyledInputBox)(_templateObject6$4 || (_templateObject6$4 = _taggedTemplateLiteralLoose(["\n background: #efefef;\n border: none;\n cursor: no-drop;\n pointer-events: none;\n &:focus {\n border: none;\n }\n"])));
132
+ var StyledHelperText = styled.span(_templateObject7$4 || (_templateObject7$4 = _taggedTemplateLiteralLoose(["\n color: #758498;\n font-size: 12px;\n text-align: left;\n margin-top: 2px;\n position: absolute;\n bottom: -15px;\n left: 15px;\n font-style: italic;\n"])));
133
+ var StyledErrorText = styled(StyledHelperText)(_templateObject8$4 || (_templateObject8$4 = _taggedTemplateLiteralLoose(["\n color: #da1e28;\n font-style: normal;\n"])));
134
+ var StyledSuccessText = styled(StyledHelperText)(_templateObject9$3 || (_templateObject9$3 = _taggedTemplateLiteralLoose(["\n color: #24a148;\n font-style: normal;\n"])));
135
+
136
+ var _templateObject$6, _templateObject2$6, _templateObject3$6, _templateObject4$5, _templateObject5$5, _templateObject6$5, _templateObject7$5, _templateObject8$5, _templateObject9$4;
137
+ var StyledRadioButtonLabel = styled.label(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n color: ", ";\n line-height: 21px;\n cursor: pointer;\n position: relative;\n padding-left: 26px;\n\n ", "\n ", "\n &::before {\n content: '';\n position: absolute;\n width: 16px;\n height: 16px;\n background-color: #fff;\n border: 1px solid ", ";\n border-radius: 50%;\n top: 50%;\n transform: translateY(-50%);\n transition: border-color 400ms ease;\n left: 0px;\n\n ", "\n ", "\n }\n &::after {\n content: '';\n position: absolute;\n width: 16px;\n height: 16px;\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 50%;\n top: 50%;\n transform: translateY(-50%) scale(0);\n transition: transform 400ms ease;\n left: 0px;\n ", "\n }\n"])), BodyFontColor$1, function (props) {
138
+ return props.disabled && css(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteralLoose(["\n cursor: default;\n pointer-events: none;\n "])));
139
+ }, function (props) {
140
+ return props.disabledChecked && css(_templateObject3$6 || (_templateObject3$6 = _taggedTemplateLiteralLoose(["\n cursor: default;\n pointer-events: none;\n "])));
141
+ }, CheckBoxBorder$1, function (props) {
142
+ return props.disabled && css(_templateObject4$5 || (_templateObject4$5 = _taggedTemplateLiteralLoose(["\n border: 1px solid ", ";\n "])), DefaultColorButton$1);
143
+ }, function (props) {
144
+ return props.disabledChecked && css(_templateObject5$5 || (_templateObject5$5 = _taggedTemplateLiteralLoose(["\n border: 1px solid ", " !important;\n "])), DefaultColorButton$1);
145
+ }, PrimaryBlueColor$1, PrimaryBlueColor$1, function (props) {
146
+ return props.disabledChecked && css(_templateObject6$5 || (_templateObject6$5 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n border: 1px solid ", ";\n "])), DefaultColorButton$1, DefaultColorButton$1);
147
+ });
148
+ var StyledRadioButton = styled.input(_templateObject7$5 || (_templateObject7$5 = _taggedTemplateLiteralLoose(["\n &:checked + ", "::before {\n border: 1px solid ", ";\n }\n &:checked + ", "::after {\n transform: translateY(-50%) scale(0.55);\n }\n"])), StyledRadioButtonLabel, PrimaryBlueColor$1, StyledRadioButtonLabel);
149
+ var StyledHoverBg$1 = styled.div(_templateObject8$5 || (_templateObject8$5 = _taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n background: #e5edf7;\n position: absolute;\n left: -3px;\n border-radius: 50%;\n top: -1px;\n display: none;\n"])));
150
+ var StyledRadioButtonContainer = styled.div(_templateObject9$4 || (_templateObject9$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n &:hover {\n ", " {\n display: block;\n }\n }\n"])), StyledHoverBg$1);
151
+
152
+ var _templateObject$7, _templateObject2$7, _templateObject3$7;
153
+ var StyledTabContainer = styled.ul(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteralLoose(["\n display: flex;\n border-bottom: 1px solid ", ";\n width: 100%;\n box-sizing: border-box;\n cursor: pointer;\n"])), DefaultColorButton$1);
154
+ var StyledTablist = styled.li(_templateObject2$7 || (_templateObject2$7 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n color: ", ";\n line-height: 21px;\n padding: 12px 16px;\n position: relative;\n ", "\n"])), BodyFontColor$1, function (props) {
155
+ return props.active && css(_templateObject3$7 || (_templateObject3$7 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 600;\n cursor: default;\n &::after {\n content: ' ';\n height: 2px;\n background: ", ";\n position: absolute;\n left: 16px;\n right: 16px;\n bottom: 0;\n }\n "])), PrimaryBlueColor$1, PrimaryBlueColor$1);
156
+ });
157
+
158
+ var _templateObject$8, _templateObject2$8, _templateObject3$8, _templateObject4$6, _templateObject5$6;
159
+ var StyledLabelText = styled.label(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n color: ", ";\n line-height: 21px;\n display: block;\n text-align: left;\n"])), LabelColor);
160
+ var StyledTextArea = styled.textarea(_templateObject2$8 || (_templateObject2$8 = _taggedTemplateLiteralLoose(["\n min-height: 70px;\n padding: 15px;\n margin-top: 8px;\n resize: none;\n min-width: 800px;\n box-sizing: border-box;\n font-size: 14px;\n line-height: 21px;\n border: 1px solid ", ";\n border-radius: 4px;\n\n ", "\n\n &:focus {\n border: 1px solid ", ";\n }\n"])), CheckBoxBorder$1, function (props) {
161
+ return props.disabled && css(_templateObject3$8 || (_templateObject3$8 = _taggedTemplateLiteralLoose(["\n background: ", ";\n border: 1px solid ", ";\n "])), DisabledTextareaBg, DefaultColorButton$1);
162
+ }, PrimaryBlueColor$1);
163
+ var StyledTextAreaContainer = styled.div(_templateObject4$6 || (_templateObject4$6 = _taggedTemplateLiteralLoose([""])));
164
+ var StyledRemainingText = styled.div(_templateObject5$6 || (_templateObject5$6 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size: 14px;\n font-weight: 300;\n line-height: 21px;\n text-align: right;\n margin-top: 8px;\n"])), DefaultButtonText);
165
+
166
+ export { StyledAvatar, StyledAvatarImage, StyledBreadCrumbList, StyledBreadcrumbContainer, StyledButton, StyledCheckBoxContainer, StyledCheckbox, StyledCheckboxLabel, StyledErrorText, StyledHelperText, StyledHoverBg, StyledInfoCloseIcon, StyledInputBox, StyledInputBoxContainer, StyledInputBoxDisabled, StyledInputBoxError, StyledInputBoxSuccess, StyledInputLabelContainer, StyledLabelText, StyledNotification, StyledNotificationContainer, StyledRadioButton, StyledRadioButtonContainer, StyledRadioButtonLabel, StyledRemainingText, StyledSuccessText, StyledTabContainer, StyledTablist, StyledTextArea, StyledTextAreaContainer };
32
167
  //# sourceMappingURL=index.modern.js.map
package/dist/index.modern.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.modern.js","sources":["../src/components/global-components/button/button-style.js","../src/components/global-components/inputbox/inputbox-style.js"],"sourcesContent":["import styled from 'styled-components';\n\n// export const StyledPrimaryButton = styled.button`\n// background: red;\n// border: none;\n// `\n\nexport const StyledButton = styled.button`\n background: #1d1d1d;\n color: #fff;\n border: none;\n cursor: pointer;\n border-radius: 3px;\n height: 35px;\n box-sizing: border-box;\n padding: 0 20px;\n font-size: 14px;\n transition: all 300ms ease-in-out 0s;\n`\n\nexport const StyledPrimaryButton = styled(StyledButton)`\n background: #0055AF;\n &:hover{\n background: #033162;\n }\n`;\n\nexport const StyledSecondaryDiasabledButton = styled(StyledButton)`\n background: #fff;\n border: 1px solid #afafaf;\n color: #AFAFAF;\n cursor: default;\n`;\n\nexport const StyledSecondaryButton = styled(StyledButton)`\n background: #fff;\n border: 1px solid #0055AF;\n color: #0055AF;\n &:hover{\n border: 1px solid #033162;\n color: #033162;\n }\n`;\n\nexport const StyledDisabledButton = styled(StyledButton)`\n background: #AFAFAF;\n cursor: default;\n`;\n\nexport const StyledURLButton = styled(StyledButton)`\n background: #fff;\n color: #0055AF;\n font-size: 16px;\n font-weight: 500;\n padding: 0px;\n height: auto;\n &:hover{\n color: #033162;\n }\n`;\n\nexport const StyledDisabledURLButton = styled(StyledButton)`\n background: #fff;\n color: #afafaf;\n font-size: 16px;\n font-weight: 500;\n padding: 0px;\n height: auto;\n cursor: default;\n`;\n\n","import styled from 'styled-components';\n\nexport const StyledInputBoxContainer = styled.div`\n display: flex;\n flex-direction: column;\n position: relative;\n`;\nexport const StyledInputLabelContainer = styled.label`\n font-size: 12px;\n color: #758490;\n margin-bottom: 5px;\n text-align: left;\n`;\n\nexport const StyledInputBox = styled.input`\n border: 1px solid #ACACAC;\n border-radius: 3px;\n padding: 0px 15px;\n box-sizing: border-box;\n height: 35px;\n font-size: 14px;\n color: #1d1d1d;\n &:focus{\n border: 1px solid #0055AF;\n }\n`;\nexport const StyledInputBoxError = styled(StyledInputBox)`\n border: 1px solid #DA1E28;\n &:focus{\n border: 1px solid #DA1E28;\n }\n`;\n\nexport const StyledInputBoxSuccess = styled(StyledInputBox)`\n border: 1px solid #24A148;\n &:focus{\n border: 1px solid #24A148;\n }\n`;\n\nexport const StyledInputBoxDisabled = styled(StyledInputBox)`\n background: #EFEFEF;\n border: none;\n cursor: no-drop;\n pointer-events: none;\n &:focus{\n border: none;\n }\n`;\n\nexport const StyledHelperText = styled.span`\n color: #758498;\n font-size: 12px;\n text-align: left;\n margin-top: 2px;\n position: absolute;\n bottom: -15px;\n left: 15px;\n font-style: italic;\n`;\n\nexport const StyledErrorText = styled(StyledHelperText)`\n color: #DA1E28;\n font-style: normal;\n`;\n\nexport const StyledSuccessText = styled(StyledHelperText)`\n color: #24A148;\n font-style: normal;\n`;"],"names":["StyledButton","styled","button","StyledPrimaryButton","StyledSecondaryDiasabledButton","StyledSecondaryButton","StyledDisabledButton","StyledURLButton","StyledDisabledURLButton","StyledInputBoxContainer","div","StyledInputLabelContainer","label","StyledInputBox","input","StyledInputBoxError","StyledInputBoxSuccess","StyledInputBoxDisabled","StyledHelperText","span","StyledErrorText","StyledSuccessText"],"mappings":";;;;;;;;;;;IAOaA,YAAY,GAAGC,MAAM,CAACC,MAAM;IAa5BC,mBAAmB,GAAGF,MAAM,CAACD,YAAY,CAAC;IAO1CI,8BAA8B,GAAGH,MAAM,CAACD,YAAY,CAAC;IAOrDK,qBAAqB,GAAGJ,MAAM,CAACD,YAAY,CAAC;IAU5CM,oBAAoB,GAAGL,MAAM,CAACD,YAAY,CAAC;IAK3CO,eAAe,GAAGN,MAAM,CAACD,YAAY,CAAC;IAYtCQ,uBAAuB,GAAGP,MAAM,CAACD,YAAY,CAAC;;;AC7D3D,IAEaS,uBAAuB,GAAGR,MAAM,CAACS,GAAG,0JAIhD;AACD,IAAaC,yBAAyB,GAAGV,MAAM,CAACW,KAAK,6KAKpD;AAED,IAAaC,cAAc,GAAGZ,MAAM,CAACa,KAAK,uTAWzC;AACD,IAAaC,mBAAmB,GAAGd,MAAM,CAACY,cAAc,CAAC,2KAKxD;AAED,IAAaG,qBAAqB,GAAGf,MAAM,CAACY,cAAc,CAAC,4KAK1D;AAED,IAAaI,sBAAsB,GAAGhB,MAAM,CAACY,cAAc,CAAC,4NAQ3D;AAED,IAAaK,gBAAgB,GAAGjB,MAAM,CAACkB,IAAI,iQAS1C;AAED,IAAaC,eAAe,GAAGnB,MAAM,CAACiB,gBAAgB,CAAC,4HAGtD;AAED,IAAaG,iBAAiB,GAAGpB,MAAM,CAACiB,gBAAgB,CAAC,4HAGxD;;;;"}
1
+ {"version":3,"file":"index.modern.js","sources":["../src/components/global-components/alerts/alerts-styles.js","../src/components/color.js","../src/components/global-components/avatar/avatar-styles.js","../src/components/global-components/breadcrumb/breadcrumb-style.js","../src/components/global-components/button/button-style.js","../src/components/global-components/checkbox/checkbox-style.js","../src/components/global-components/inputbox/inputbox-style.js","../src/components/global-components/radio/radio-styles.js","../src/components/global-components/tabs/tabs-style.js","../src/components/global-components/textarea/textarea-styles.js"],"sourcesContent":["import {\n AlertBlueInfoBackground, AlertBlueInfoStroke, AlertGreenSuccessBackground,\n AlertGreenSuccessStroke, AlertOrangeWarningBackground,\n AlertOrangeWarningStroke, AlertRedErrorBackground,\n AlertRedErrorStroke, BodyFontColor\n} from 'components/color'\nimport styled, { css } from 'styled-components'\nimport AlertIcon from './../../../assets/images/error.svg'\nimport InfoIcon from './../../../assets/images/info.svg'\nimport NotificationClose from './../../../assets/images/notification-close.svg'\nimport SuccessIcon from './../../../assets/images/success.svg'\nimport Warning from './../../../assets/images/warning.svg'\nexport const StyledNotification = styled.div`\n height: 37px;\n background: #d4d4d4;\n border: 1px solid #1d1d1d;\n padding: 0px 50px;\n font-size: 14px;\n line-height: 21px;\n color: ${BodyFontColor};\n display: flex;\n align-items: center;\n position: relative;\n min-width: 339px;\n border-radius: 3px;\n ${(props) =>\n props.success &&\n css`\n background: ${AlertGreenSuccessBackground};\n border: 1px solid ${AlertGreenSuccessStroke};\n `}\n ${(props) =>\n props.error &&\n css`\n background: ${AlertRedErrorBackground};\n border: 1px solid ${AlertRedErrorStroke};\n `}\n ${(props) =>\n props.warning &&\n css`\n background: ${AlertOrangeWarningBackground};\n border: 1px solid ${AlertOrangeWarningStroke};\n `}\n ${(props) =>\n props.info &&\n css`\n background: ${AlertBlueInfoBackground};\n border: 1px solid ${AlertBlueInfoStroke};\n `}\n &::before {\n content: ' ';\n width: 13.33px;\n height: 13.33px;\n background: red;\n position: absolute;\n left: 17px;\n top: 12px;\n\n ${(props) =>\n props.success &&\n css`\n background: url(${SuccessIcon});\n background-size: cover;\n `}\n ${(props) =>\n props.error &&\n css`\n background: url(${AlertIcon});\n background-size: cover;\n `}\n ${(props) =>\n props.warning &&\n css`\n background: url(${Warning});\n background-size: cover;\n background-size: 15px;\n `}\n ${(props) =>\n props.info &&\n css`\n background: url(${InfoIcon});\n background-size: cover;\n `}\n }\n`\nexport const StyledNotificationContainer = styled.div`\n display: flex;\n position: relative;\n`\nexport const StyledInfoCloseIcon = styled.i`\n background: url(${NotificationClose});\n background-size: cover;\n width: 10px;\n height: 10px;\n position: absolute;\n cursor: pointer;\n right: 15px;\n top: 0;\n bottom: 0;\n margin: auto;\n`\n","export const PrimaryBlueColor = '#0055AF'\nexport const SecondaryBlueColor = '#033162'\nexport const DefaultColorButton = '#ACACAC'\nexport const LightBgColorButton = '#E5EDF7'\nexport const CheckBoxBorder = '#394960'\nexport const AlertGreenSuccessStroke = '#24A148'\nexport const AlertGreenSuccessBackground = '#E8F5EC'\nexport const AlertRedErrorStroke = '#DA1E28'\nexport const AlertRedErrorBackground = '#FCE9EA'\nexport const DefaultButtonText = '#AFAFAF'\nexport const AlertOrangeWarningStroke = '#FF832B'\nexport const AlertOrangeWarningBackground = '#FFF3EA'\nexport const AlertBlueInfoBackground = '#E5EDF7'\nexport const AlertBlueInfoStroke = '#0055AF'\nexport const WhiteColor = '#ffffff'\nexport const AvatarBgColor = '#EBECF0'\nexport const BodyFontColor = '#1d1d1d'\nexport const LabelColor = '#758490'\nexport const DisabledTextareaBg = '#EFEFEF'\n","import styled, { css } from 'styled-components'\nimport { AvatarBgColor } from '../../color'\n\nexport const StyledAvatar = styled.span`\n width: 64px;\n height: 64px;\n background: ${AvatarBgColor};\n display: flex;\n border-radius: 50%;\n font-size: 32px;\n font-weight: 600;\n color: #758490;\n justify-content: center;\n align-items: center;\n\n ${(props) =>\n props.medium &&\n css`\n width: 48px;\n height: 48px;\n font-size: 16px;\n `}\n\n ${(props) =>\n props.small &&\n css`\n width: 36px;\n height: 36px;\n font-size: 14px;\n `}\n ${(props) =>\n props.exsmall &&\n css`\n width: 24px;\n height: 24px;\n font-size: 12px;\n `}\n`\n\nexport const StyledAvatarImage = styled.img`\n ${(props) =>\n props.medium &&\n css`\n width: 48px;\n height: 48px;\n `}\n ${(props) =>\n props.small &&\n css`\n width: 36px;\n height: 36px;\n `}\n ${(props) =>\n props.exsmall &&\n css`\n width: 24px;\n height: 24px;\n `}\n`\n","import { CheckBoxBorder, PrimaryBlueColor } from 'components/color'\nimport styled, { css } from 'styled-components'\n\nexport const StyledBreadcrumbContainer = styled.ul`\n display: flex;\n`\nexport const StyledBreadCrumbList = styled.li`\n font-size: 14px;\n font-weight: 300;\n color: ${PrimaryBlueColor};\n cursor: pointer;\n ${(props) =>\n props.active &&\n css`\n color: ${CheckBoxBorder};\n font-weight: 400;\n cursor: default;\n `}\n &::after {\n content: ' / ';\n padding: 0 4px;\n display: inline-block;\n color: #394960;\n }\n &:last-child {\n &::after {\n display: none;\n }\n }\n`\n","import {\n DefaultColorButton, LightBgColorButton, PrimaryBlueColor,\n SecondaryBlueColor,\n WhiteColor\n} from 'components/color'\nimport styled, { css } from 'styled-components'\nimport HomeIconDisabled from './../../../assets/images/home-disabled.svg'\nimport HomeIconSecondary from './../../../assets/images/home-primary.svg'\nimport HomeIconSecondaryHover from './../../../assets/images/home-secondary.svg'\nimport HomeIconWhite from './../../../assets/images/home-white.svg'\n// Common Button\n\nexport const StyledButton = styled.button`\n background: #1d1d1d;\n color: ${WhiteColor};\n border: none;\n cursor: pointer;\n border-radius: 3px;\n box-sizing: border-box;\n padding: 8px 20px;\n font-size: 14px;\n transition: all 300ms ease-in-out 0s;\n line-height: 21px;\n font-family: 'Poppins', sans-serif;\n\n // Primary Button\n\n ${(props) =>\n props.primary &&\n css`\n background: ${PrimaryBlueColor};\n &:hover {\n background: ${SecondaryBlueColor};\n }\n `}\n\n // Secondary Button\n\n ${(props) =>\n props.secondary &&\n css`\n background: ${WhiteColor};\n border: 1px solid ${PrimaryBlueColor};\n color: ${PrimaryBlueColor};\n &:hover {\n border: 1px solid ${SecondaryBlueColor};\n color: ${SecondaryBlueColor};\n background: ${LightBgColorButton};\n }\n `}\n\n // Disabled Button\n\n ${(props) =>\n props.disabled &&\n css`\n background: ${DefaultColorButton};\n\n color: ${WhiteColor};\n &:hover {\n cursor: default;\n background: ${DefaultColorButton};\n }\n `}\n\n // Disabled secondary Button\n\n ${(props) =>\n props.disabledSecondary &&\n css`\n background: ${WhiteColor};\n border: 1px solid ${DefaultColorButton};\n color: ${DefaultColorButton};\n cursor: default;\n &:hover {\n background: ${WhiteColor};\n border: 1px solid ${DefaultColorButton};\n color: ${DefaultColorButton};\n }\n `}\n \n //URL Button\n \n ${(props) =>\n props.url &&\n css`\n background: ${WhiteColor};\n border: none;\n color: ${PrimaryBlueColor};\n padding: 0px;\n font-weight: 500;\n &:hover {\n background: ${WhiteColor};\n border: none;\n color: ${SecondaryBlueColor};\n }\n `}\n\n //url button disabled\n\n ${(props) =>\n props.disabledurl &&\n css`\n background: ${WhiteColor};\n border: none;\n color: ${DefaultColorButton};\n padding: 0px;\n font-weight: 500;\n cursor: default;\n &:hover {\n background: ${WhiteColor};\n border: none;\n color: ${DefaultColorButton};\n }\n `}\n\n // Small Button\n\n ${(props) =>\n props.smallBtn &&\n css`\n padding: 4px 12px;\n line-height: 18px;\n font-size: 12px;\n `}\n\n //small url\n\n ${(props) =>\n props.smallUrl &&\n css`\n font-size: 12px;\n line-height: 18px;\n `}\n //Icon button height width property\n\n ${(props) =>\n props.iconBtn &&\n css`\n width: 36px;\n height: 36px;\n padding: 0px;\n `}\n\n //Icon button Primary\n\n ${(props) =>\n props.iconBtnPrimary &&\n css`\n background-image: url(${HomeIconWhite});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(${HomeIconWhite});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n `}\n\n //Icon Button Secondary\n\n ${(props) =>\n props.iconBtnSecondary &&\n css`\n background-image: url(${HomeIconSecondary});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(${HomeIconSecondaryHover});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n `}\n //Icon Button Disabled Secondary \n\n ${(props) =>\n props.iconBtnDisableSecondary &&\n css`\n background-image: url(${HomeIconDisabled});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(${HomeIconDisabled});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n `}\n\n //Icon Button Disabled Primary\n \n ${(props) =>\n props.iconBtnDisablePrimary &&\n css`\n background-image: url(${HomeIconWhite});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n &:hover {\n background-image: url(${HomeIconWhite});\n background-repeat: no-repeat;\n background-size: 16px;\n background-position: center;\n }\n `}\n`\n","import styled, { css } from 'styled-components'\nimport {\n BodyFontColor,\n CheckBoxBorder,\n DefaultColorButton,\n PrimaryBlueColor\n} from '../../color'\n\nexport const StyledCheckboxLabel = styled.label`\n font-size: 14px;\n color: ${BodyFontColor};\n line-height: 21px;\n margin-left: 8px;\n cursor: pointer;\n position: relative;\n ${(props) =>\n props.disabled &&\n css`\n cursor: default;\n pointer-events: none;\n `}\n ${(props) =>\n props.disabledChecked &&\n css`\n pointer-events: none;\n pointer-events: none;\n `}\n &::before {\n content: '';\n -webkit-appearance: none;\n background-color: transparent;\n border: 1px solid ${CheckBoxBorder};\n /* padding: 10px; */\n display: inline-block;\n position: relative;\n vertical-align: middle;\n cursor: pointer;\n margin-right: 5px;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n border-radius: 3px;\n ${(props) =>\n props.disabled &&\n css`\n border: 1px solid ${DefaultColorButton};\n cursor: default;\n `}\n ${(props) =>\n props.disabledChecked &&\n css`\n border: 1px solid ${DefaultColorButton};\n cursor: default;\n background: ${DefaultColorButton};\n `}\n }\n &::after {\n ${(props) =>\n props.disabledChecked &&\n css`\n content: '';\n display: block;\n position: absolute;\n top: 5px;\n left: 6px;\n width: 3px;\n height: 8px;\n border: solid #fff;\n border-width: 0 2px 2px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n `}\n }\n`\n\nexport const StyledCheckbox = styled.input`\n padding: 0;\n height: initial;\n width: initial;\n margin-bottom: 0;\n display: none;\n cursor: pointer;\n\n &:checked + ${StyledCheckboxLabel}::after {\n content: '';\n display: block;\n position: absolute;\n top: 5px;\n left: 6px;\n width: 3px;\n height: 8px;\n border: solid #fff;\n border-width: 0 2px 2px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n }\n &:checked + ${StyledCheckboxLabel}::before {\n background-color: ${PrimaryBlueColor};\n border: 1px solid ${PrimaryBlueColor};\n }\n`\n\nexport const StyledHoverBg = styled.div`\n width: 24px;\n height: 24px;\n background: #e5edf7;\n position: absolute;\n left: 4px;\n border-radius: 50%;\n top: -1px;\n display: none;\n`\n\nexport const StyledCheckBoxContainer = styled.div`\n display: flex;\n align-items: center;\n position: relative;\n &:hover ${StyledHoverBg} {\n display: block;\n }\n`\n","import styled from 'styled-components'\n\nexport const StyledInputBoxContainer = styled.div`\n display: flex;\n flex-direction: column;\n position: relative;\n`\nexport const StyledInputLabelContainer = styled.label`\n font-size: 12px;\n color: #758490;\n margin-bottom: 5px;\n text-align: left;\n`\n\nexport const StyledInputBox = styled.input`\n border: 1px solid #acacac;\n\n border-radius: 3px;\n padding: 0px 15px;\n box-sizing: border-box;\n height: 35px;\n font-size: 14px;\n color: #1d1d1d;\n &:focus {\n border: 1px solid #0055af;\n }\n`\nexport const StyledInputBoxError = styled(StyledInputBox)`\n border: 1px solid #da1e28;\n &:focus {\n border: 1px solid #da1e28;\n }\n`\n\nexport const StyledInputBoxSuccess = styled(StyledInputBox)`\n border: 1px solid #24a148;\n &:focus {\n border: 1px solid #24a148;\n }\n`\n\nexport const StyledInputBoxDisabled = styled(StyledInputBox)`\n background: #efefef;\n border: none;\n cursor: no-drop;\n pointer-events: none;\n &:focus {\n border: none;\n }\n`\n\nexport const StyledHelperText = styled.span`\n color: #758498;\n font-size: 12px;\n text-align: left;\n margin-top: 2px;\n position: absolute;\n bottom: -15px;\n left: 15px;\n font-style: italic;\n`\n\nexport const StyledErrorText = styled(StyledHelperText)`\n color: #da1e28;\n font-style: normal;\n`\n\nexport const StyledSuccessText = styled(StyledHelperText)`\n color: #24a148;\n font-style: normal;\n`\n","import {\n BodyFontColor,\n CheckBoxBorder, DefaultColorButton, PrimaryBlueColor\n} from 'components/color'\nimport styled, { css } from 'styled-components'\n\nexport const StyledRadioButtonLabel = styled.label`\n font-size: 14px;\n color: ${BodyFontColor};\n line-height: 21px;\n cursor: pointer;\n position: relative;\n padding-left: 26px;\n\n ${(props) =>\n props.disabled &&\n css`\n cursor: default;\n pointer-events: none;\n `}\n ${(props) =>\n props.disabledChecked &&\n css`\n cursor: default;\n pointer-events: none;\n `}\n &::before {\n content: '';\n position: absolute;\n width: 16px;\n height: 16px;\n background-color: #fff;\n border: 1px solid ${CheckBoxBorder};\n border-radius: 50%;\n top: 50%;\n transform: translateY(-50%);\n transition: border-color 400ms ease;\n left: 0px;\n\n ${(props) =>\n props.disabled &&\n css`\n border: 1px solid ${DefaultColorButton};\n `}\n ${(props) =>\n props.disabledChecked &&\n css`\n border: 1px solid ${DefaultColorButton} !important;\n `}\n }\n &::after {\n content: '';\n position: absolute;\n width: 16px;\n height: 16px;\n background-color: ${PrimaryBlueColor};\n border: 1px solid ${PrimaryBlueColor};\n border-radius: 50%;\n top: 50%;\n transform: translateY(-50%) scale(0);\n transition: transform 400ms ease;\n left: 0px;\n ${(props) =>\n props.disabledChecked &&\n css`\n background-color: ${DefaultColorButton};\n border: 1px solid ${DefaultColorButton};\n `}\n }\n`\n\nexport const StyledRadioButton = styled.input`\n &:checked + ${StyledRadioButtonLabel}::before {\n border: 1px solid ${PrimaryBlueColor};\n }\n &:checked + ${StyledRadioButtonLabel}::after {\n transform: translateY(-50%) scale(0.55);\n }\n`\n\nexport const StyledHoverBg = styled.div`\n width: 24px;\n height: 24px;\n background: #e5edf7;\n position: absolute;\n left: -3px;\n border-radius: 50%;\n top: -1px;\n display: none;\n`\nexport const StyledRadioButtonContainer = styled.div`\n display: flex;\n align-items: center;\n position: relative;\n &:hover {\n ${StyledHoverBg} {\n display: block;\n }\n }\n`\n","import {\n BodyFontColor,\n DefaultColorButton,\n PrimaryBlueColor\n} from 'components/color'\nimport styled, { css } from 'styled-components'\nexport const StyledTabContainer = styled.ul`\n display: flex;\n border-bottom: 1px solid ${DefaultColorButton};\n width: 100%;\n box-sizing: border-box;\n cursor: pointer;\n`\nexport const StyledTablist = styled.li`\n font-size: 14px;\n color: ${BodyFontColor};\n line-height: 21px;\n padding: 12px 16px;\n position: relative;\n ${(props) =>\n props.active &&\n css`\n color: ${PrimaryBlueColor};\n font-weight: 600;\n cursor: default;\n &::after {\n content: ' ';\n height: 2px;\n background: ${PrimaryBlueColor};\n position: absolute;\n left: 16px;\n right: 16px;\n bottom: 0;\n }\n `}\n`\n","import {\n CheckBoxBorder,\n DefaultButtonText,\n DefaultColorButton,\n DisabledTextareaBg,\n LabelColor,\n PrimaryBlueColor\n} from 'components/color'\nimport styled, { css } from 'styled-components'\n\nexport const StyledLabelText = styled.label`\n font-size: 14px;\n color: ${LabelColor};\n line-height: 21px;\n display: block;\n text-align: left;\n`\nexport const StyledTextArea = styled.textarea`\n min-height: 70px;\n padding: 15px;\n margin-top: 8px;\n resize: none;\n min-width: 800px;\n box-sizing: border-box;\n font-size: 14px;\n line-height: 21px;\n border: 1px solid ${CheckBoxBorder};\n border-radius: 4px;\n\n ${(props) =>\n props.disabled &&\n css`\n background: ${DisabledTextareaBg};\n border: 1px solid ${DefaultColorButton};\n `}\n\n &:focus {\n border: 1px solid ${PrimaryBlueColor};\n }\n`\nexport const StyledTextAreaContainer = styled.div``\nexport const StyledRemainingText = styled.div`\n color: ${DefaultButtonText};\n font-size: 14px;\n font-weight: 300;\n line-height: 21px;\n text-align: right;\n margin-top: 8px;\n`\n"],"names":["StyledNotification","styled","div","BodyFontColor","props","success","css","AlertGreenSuccessBackground","AlertGreenSuccessStroke","error","AlertRedErrorBackground","AlertRedErrorStroke","warning","AlertOrangeWarningBackground","AlertOrangeWarningStroke","info","AlertBlueInfoBackground","AlertBlueInfoStroke","SuccessIcon","AlertIcon","Warning","InfoIcon","StyledNotificationContainer","StyledInfoCloseIcon","i","NotificationClose","PrimaryBlueColor","DefaultColorButton","CheckBoxBorder","AvatarBgColor","StyledAvatar","span","medium","small","exsmall","StyledAvatarImage","img","StyledBreadcrumbContainer","ul","StyledBreadCrumbList","li","active","StyledButton","button","WhiteColor","primary","SecondaryBlueColor","secondary","LightBgColorButton","disabled","disabledSecondary","url","disabledurl","smallBtn","smallUrl","iconBtn","iconBtnPrimary","HomeIconWhite","iconBtnSecondary","HomeIconSecondary","HomeIconSecondaryHover","iconBtnDisableSecondary","HomeIconDisabled","iconBtnDisablePrimary","StyledCheckboxLabel","label","disabledChecked","StyledCheckbox","input","StyledHoverBg","StyledCheckBoxContainer","StyledInputBoxContainer","StyledInputLabelContainer","StyledInputBox","StyledInputBoxError","StyledInputBoxSuccess","StyledInputBoxDisabled","StyledHelperText","StyledErrorText","StyledSuccessText","StyledRadioButtonLabel","StyledRadioButton","StyledRadioButtonContainer","StyledTabContainer","StyledTablist","StyledLabelText","LabelColor","StyledTextArea","textarea","DisabledTextareaBg","StyledTextAreaContainer","StyledRemainingText","DefaultButtonText"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA,IAYaA,kBAAkB,GAAGC,MAAM,CAACC,GAAG,2kBAOjCC,eAAa,EAMpB,UAACC,KAAK;EAAA,OACNA,KAAK,CAACC,OAAO,IACbC,GAAG,2IACaC,2BAA2B,EACrBC,uBAAuB,CAC5C;AAAA,GACD,UAACJ,KAAK;EAAA,OACNA,KAAK,CAACK,KAAK,IACXH,GAAG,2IACaI,uBAAuB,EACjBC,mBAAmB,CACxC;AAAA,GACC,UAACP,KAAK;EAAA,OACRA,KAAK,CAACQ,OAAO,IACbN,GAAG,2IACaO,4BAA4B,EACtBC,wBAAwB,CAC7C;AAAA,GACC,UAACV,KAAK;EAAA,OACRA,KAAK,CAACW,IAAI,IACVT,GAAG,2IACaU,uBAAuB,EACjBC,mBAAmB,CACxC;AAAA,GAUC,UAACb,KAAK;EAAA,OACNA,KAAK,CAACC,OAAO,IACbC,GAAG,sJACiBY,WAAW,CAE9B;AAAA,GACD,UAACd,KAAK;EAAA,OACNA,KAAK,CAACK,KAAK,IACXH,GAAG,sJACiBa,SAAS,CAE5B;AAAA,GACG,UAACf,KAAK;EAAA,OACVA,KAAK,CAACQ,OAAO,IACbN,GAAG,sLACiBc,OAAO,CAG1B;AAAA,GACG,UAAChB,KAAK;EAAA,OACVA,KAAK,CAACW,IAAI,IACVT,GAAG,sJACiBe,QAAQ,CAE3B;AAAA,EAEN;AACD,IAAaC,2BAA2B,GAAGrB,MAAM,CAACC,GAAG,yHAGpD;AACD,IAAaqB,mBAAmB,GAAGtB,MAAM,CAACuB,CAAC,4QACvBC,iBAAiB,CAUpC;;ACpGM,IAAMC,gBAAgB,GAAG,SAAS;AACzC,AACO,IAAMC,kBAAkB,GAAG,SAAS;AAC3C,AACO,IAAMC,cAAc,GAAG,SAAS;AACvC,AAUO,IAAMC,aAAa,GAAG,SAAS;AACtC,AAAO,IAAM1B,aAAa,GAAG,SAAS;;;AChBtC,IAGa2B,YAAY,GAAG7B,MAAM,CAAC8B,IAAI,8TAGvBF,aAAa,EASzB,UAACzB,KAAK;EAAA,OACNA,KAAK,CAAC4B,MAAM,IACZ1B,GAAG,uJAIF;AAAA,GAED,UAACF,KAAK;EAAA,OACNA,KAAK,CAAC6B,KAAK,IACX3B,GAAG,uJAIF;AAAA,GACC,UAACF,KAAK;EAAA,OACRA,KAAK,CAAC8B,OAAO,IACb5B,GAAG,uJAIF;AAAA,EACJ;AAED,IAAa6B,iBAAiB,GAAGlC,MAAM,CAACmC,GAAG,6GACvC,UAAChC,KAAK;EAAA,OACNA,KAAK,CAAC4B,MAAM,IACZ1B,GAAG,+HAGF;AAAA,GACD,UAACF,KAAK;EAAA,OACNA,KAAK,CAAC6B,KAAK,IACX3B,GAAG,+HAGF;AAAA,GACC,UAACF,KAAK;EAAA,OACRA,KAAK,CAAC8B,OAAO,IACb5B,GAAG,+HAGF;AAAA,EACJ;;;AC1DD,IAGa+B,yBAAyB,GAAGpC,MAAM,CAACqC,EAAE,kGAEjD;AACD,IAAaC,oBAAoB,GAAGtC,MAAM,CAACuC,EAAE,0VAGlCd,kBAAgB,EAEvB,UAACtB,KAAK;EAAA,OACNA,KAAK,CAACqC,MAAM,IACZnC,GAAG,4JACQsB,gBAAc,CAGxB;AAAA,EAYJ;;;;;;;;;;;AC7BD,IAYac,YAAY,GAAGzC,MAAM,CAAC0C,MAAM,w1BAE9BC,UAAU,EAajB,UAACxC,KAAK;EAAA,OACNA,KAAK,CAACyC,OAAO,IACbvC,GAAG,qKACaoB,kBAAgB,EAEdoB,kBAAkB,CAEnC;AAAA,GAID,UAAC1C,KAAK;EAAA,OACNA,KAAK,CAAC2C,SAAS,IACfzC,GAAG,+QACasC,UAAU,EACJlB,kBAAgB,EAC3BA,kBAAgB,EAEHoB,kBAAkB,EAC7BA,kBAAkB,EACbE,kBAAkB,CAEnC;AAAA,GAID,UAAC5C,KAAK;EAAA,OACNA,KAAK,CAAC6C,QAAQ,IACd3C,GAAG,qNACaqB,oBAAkB,EAEvBiB,UAAU,EAGHjB,oBAAkB,CAEnC;AAAA,GAID,UAACvB,KAAK;EAAA,OACNA,KAAK,CAAC8C,iBAAiB,IACvB5C,GAAG,uSACasC,UAAU,EACJjB,oBAAkB,EAC7BA,oBAAkB,EAGXiB,UAAU,EACJjB,oBAAkB,EAC7BA,oBAAkB,CAE9B;AAAA,GAID,UAACvB,KAAK;EAAA,OACNA,KAAK,CAAC+C,GAAG,IACT7C,GAAG,ySACasC,UAAU,EAEflB,kBAAgB,EAITkB,UAAU,EAEfE,kBAAkB,CAE9B;AAAA,GAID,UAAC1C,KAAK;EAAA,OACNA,KAAK,CAACgD,WAAW,IACjB9C,GAAG,iUACasC,UAAU,EAEfjB,oBAAkB,EAKXiB,UAAU,EAEfjB,oBAAkB,CAE9B;AAAA,GAID,UAACvB,KAAK;EAAA,OACNA,KAAK,CAACiD,QAAQ,IACd/C,GAAG,kKAIF;AAAA,GAID,UAACF,KAAK;EAAA,OACNA,KAAK,CAACkD,QAAQ,IACdhD,GAAG,wIAGF;AAAA,GAGD,UAACF,KAAK;EAAA,OACNA,KAAK,CAACmD,OAAO,IACbjD,GAAG,sJAIF;AAAA,GAIA,UAACF,KAAK;EAAA,OACPA,KAAK,CAACoD,cAAc,IACpBlD,GAAG,iZACuBmD,aAAa,EAKXA,aAAa,CAKxC;AAAA,GAID,UAACrD,KAAK;EAAA,OACNA,KAAK,CAACsD,gBAAgB,IACtBpD,GAAG,6YACuBqD,iBAAiB,EAKfC,sBAAsB,CAKjD;AAAA,GAGA,UAACxD,KAAK;EAAA,OACPA,KAAK,CAACyD,uBAAuB,IAC7BvD,GAAG,6YACuBwD,gBAAgB,EAKdA,gBAAgB,CAK3C;AAAA,GAIC,UAAC1D,KAAK;EAAA,OACRA,KAAK,CAAC2D,qBAAqB,IAC3BzD,GAAG,6YACuBmD,aAAa,EAKXA,aAAa,CAKxC;AAAA,EACJ;;;AClND,IAQaO,mBAAmB,GAAG/D,MAAM,CAACgE,KAAK,yoBAEpC9D,aAAa,EAKpB,UAACC,KAAK;EAAA,OACNA,KAAK,CAAC6C,QAAQ,IACd3C,GAAG,2IAGF;AAAA,GACD,UAACF,KAAK;EAAA,OACNA,KAAK,CAAC8D,eAAe,IACrB5D,GAAG,gJAGF;AAAA,GAKmBsB,cAAc,EAWhC,UAACxB,KAAK;EAAA,OACNA,KAAK,CAAC6C,QAAQ,IACd3C,GAAG,oJACmBqB,kBAAkB,CAEvC;AAAA,GACD,UAACvB,KAAK;EAAA,OACNA,KAAK,CAAC8D,eAAe,IACrB5D,GAAG,+KACmBqB,kBAAkB,EAExBA,kBAAkB,CACjC;AAAA,GAGD,UAACvB,KAAK;EAAA,OACNA,KAAK,CAAC8D,eAAe,IACrB5D,GAAG,4aAaF;AAAA,EAEN;AAED,IAAa6D,cAAc,GAAGlE,MAAM,CAACmE,KAAK,ymBAQ1BJ,mBAAmB,EAcnBA,mBAAmB,EACXtC,gBAAgB,EAChBA,gBAAgB,CAEvC;AAED,IAAa2C,aAAa,GAAGpE,MAAM,CAACC,GAAG,uOAStC;AAED,IAAaoE,uBAAuB,GAAGrE,MAAM,CAACC,GAAG,gMAIrCmE,aAAa,CAGxB;;;AC1HD,IAEaE,uBAAuB,GAAGtE,MAAM,CAACC,GAAG,oJAIhD;AACD,IAAasE,yBAAyB,GAAGvE,MAAM,CAACgE,KAAK,qKAKpD;AAED,IAAaQ,cAAc,GAAGxE,MAAM,CAACmE,KAAK,oSAYzC;AACD,IAAaM,mBAAmB,GAAGzE,MAAM,CAACwE,cAAc,CAAC,kKAKxD;AAED,IAAaE,qBAAqB,GAAG1E,MAAM,CAACwE,cAAc,CAAC,kKAK1D;AAED,IAAaG,sBAAsB,GAAG3E,MAAM,CAACwE,cAAc,CAAC,6MAQ3D;AAED,IAAaI,gBAAgB,GAAG5E,MAAM,CAAC8B,IAAI,iPAS1C;AAED,IAAa+C,eAAe,GAAG7E,MAAM,CAAC4E,gBAAgB,CAAC,4HAGtD;AAED,IAAaE,iBAAiB,GAAG9E,MAAM,CAAC4E,gBAAgB,CAAC,4HAGxD;;;ACtED,IAMaG,sBAAsB,GAAG/E,MAAM,CAACgE,KAAK,00BAEvC9D,eAAa,EAMpB,UAACC,KAAK;EAAA,OACNA,KAAK,CAAC6C,QAAQ,IACd3C,GAAG,2IAGF;AAAA,GACD,UAACF,KAAK;EAAA,OACNA,KAAK,CAAC8D,eAAe,IACrB5D,GAAG,2IAGF;AAAA,GAOmBsB,gBAAc,EAOhC,UAACxB,KAAK;EAAA,OACNA,KAAK,CAAC6C,QAAQ,IACd3C,GAAG,0HACmBqB,oBAAkB,CACvC;AAAA,GACD,UAACvB,KAAK;EAAA,OACNA,KAAK,CAAC8D,eAAe,IACrB5D,GAAG,qIACmBqB,oBAAkB,CACvC;AAAA,GAOiBD,kBAAgB,EAChBA,kBAAgB,EAMlC,UAACtB,KAAK;EAAA,OACNA,KAAK,CAAC8D,eAAe,IACrB5D,GAAG,2JACmBqB,oBAAkB,EAClBA,oBAAkB,CACvC;AAAA,EAEN;AAED,IAAasD,iBAAiB,GAAGhF,MAAM,CAACmE,KAAK,mOAC7BY,sBAAsB,EACdtD,kBAAgB,EAExBsD,sBAAsB,CAGrC;AAED,AAAO,IAAMX,eAAa,GAAGpE,MAAM,CAACC,GAAG,wOAStC;AACD,IAAagF,0BAA0B,GAAGjF,MAAM,CAACC,GAAG,gNAK9CmE,eAAa,CAIlB;;;ACnGD,IAMac,kBAAkB,GAAGlF,MAAM,CAACqC,EAAE,oMAEdX,oBAAkB,CAI9C;AACD,IAAayD,aAAa,GAAGnF,MAAM,CAACuC,EAAE,mMAE3BrC,eAAa,EAIpB,UAACC,KAAK;EAAA,OACNA,KAAK,CAACqC,MAAM,IACZnC,GAAG,2VACQoB,kBAAgB,EAMTA,kBAAgB,CAMjC;AAAA,EACJ;;;ACnCD,IAUa2D,eAAe,GAAGpF,MAAM,CAACgE,KAAK,mLAEhCqB,UAAU,CAIpB;AACD,IAAaC,cAAc,GAAGtF,MAAM,CAACuF,QAAQ,sWASvB5D,gBAAc,EAGhC,UAACxB,KAAK;EAAA,OACNA,KAAK,CAAC6C,QAAQ,IACd3C,GAAG,+IACamF,kBAAkB,EACZ9D,oBAAkB,CACvC;AAAA,GAGmBD,kBAAgB,CAEvC;AACD,IAAagE,uBAAuB,GAAGzF,MAAM,CAACC,GAAG,gFAAE;AACnD,IAAayF,mBAAmB,GAAG1F,MAAM,CAACC,GAAG,4MAClC0F,iBAAiB,CAM3B;;;;"}
package/dist/info~mklxCoQJ.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="14" height="15" viewBox="0 0 14 15" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M6.33333 4.16683H7.66666V5.50016H6.33333V4.16683ZM6.33333 6.8335H7.66666V10.8335H6.33333V6.8335ZM7 0.833496C3.31999 0.833496 0.333328 3.82016 0.333328 7.50016C0.333328 11.1802 3.31999 14.1668 7 14.1668C10.68 14.1668 13.6667 11.1802 13.6667 7.50016C13.6667 3.82016 10.68 0.833496 7 0.833496ZM7 12.8335C4.06 12.8335 1.66666 10.4402 1.66666 7.50016C1.66666 4.56016 4.06 2.16683 7 2.16683C9.93999 2.16683 12.3333 4.56016 12.3333 7.50016C12.3333 10.4402 9.93999 12.8335 7 12.8335Z" fill="#0055AF"/>
3
+ </svg>
package/dist/notification-close~cTWnqbeV.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="10" height="11" viewBox="0 0 10 11" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M9.66668 1.7735L8.72668 0.833496L5.00001 4.56016L1.27334 0.833496L0.333344 1.7735L4.06001 5.50016L0.333344 9.22683L1.27334 10.1668L5.00001 6.44016L8.72668 10.1668L9.66668 9.22683L5.94001 5.50016L9.66668 1.7735Z" fill="#758490"/>
3
+ </svg>
package/dist/success~jvzflZSL.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="14" height="15" viewBox="0 0 14 15" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M7.00001 0.833496C3.32001 0.833496 0.333344 3.82016 0.333344 7.50016C0.333344 11.1802 3.32001 14.1668 7.00001 14.1668C10.68 14.1668 13.6667 11.1802 13.6667 7.50016C13.6667 3.82016 10.68 0.833496 7.00001 0.833496ZM7.00001 12.8335C4.06001 12.8335 1.66668 10.4402 1.66668 7.50016C1.66668 4.56016 4.06001 2.16683 7.00001 2.16683C9.94001 2.16683 12.3333 4.56016 12.3333 7.50016C12.3333 10.4402 9.94001 12.8335 7.00001 12.8335ZM10.06 4.5535L5.66668 8.94683L3.94001 7.22683L3.00001 8.16683L5.66668 10.8335L11 5.50016L10.06 4.5535Z" fill="#24A148"/>
3
+ </svg>
package/dist/warning~efleniph.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="16" height="13" viewBox="0 0 16 13" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M7.99999 2.8265L13.02 11.4998H2.97999L7.99999 2.8265ZM7.99999 0.166504L0.666656 12.8332H15.3333L7.99999 0.166504ZM8.66666 9.49984H7.33332V10.8332H8.66666V9.49984ZM8.66666 5.49984H7.33332V8.1665H8.66666V5.49984Z" fill="#FF832B"/>
3
+ </svg>
package/package.json CHANGED
@@ -1,18 +1,20 @@
1
1
  {
2
2
  "name": "impact-ui",
3
- "version": "0.1.13",
3
+ "version": "0.1.15",
4
+ "description": "Impact analytics UI library",
4
5
  "author": "",
5
6
  "license": "MIT",
6
7
  "repository": "/impact-ui",
7
8
  "main": "dist/index.js",
8
9
  "module": "dist/index.modern.js",
9
- "source": "src/index.js",
10
+ "source": "src/components/index.js",
10
11
  "engines": {
11
12
  "node": ">=10"
12
13
  },
13
14
  "scripts": {
14
15
  "build": "microbundle-crl --no-compress --format modern,cjs",
15
16
  "start": "microbundle-crl watch --no-compress --format modern,cjs",
17
+ "start:docs": "react-scripts start",
16
18
  "prepare": "run-s build",
17
19
  "test": "run-s test:unit test:lint test:build",
18
20
  "test:build": "run-s build",
@@ -23,7 +25,7 @@
23
25
  "deploy": "gh-pages -d example/build"
24
26
  },
25
27
  "peerDependencies": {
26
- "react": "^18.2.0"
28
+ "react": "^16.0.0"
27
29
  },
28
30
  "devDependencies": {
29
31
  "babel-eslint": "^10.0.3",
@@ -42,13 +44,27 @@
42
44
  "microbundle-crl": "^0.13.10",
43
45
  "npm-run-all": "^4.1.5",
44
46
  "prettier": "^2.0.4",
45
- "react": "^18.2.0",
46
- "react-dom": "^18.2.0"
47
+ "react": "^16.13.1",
48
+ "react-dom": "^16.13.1",
49
+ "react-scripts": "^3.4.1"
47
50
  },
48
51
  "files": [
49
52
  "dist"
50
53
  ],
54
+ "browserslist": {
55
+ "production": [
56
+ ">0.2%",
57
+ "not dead",
58
+ "not op_mini all"
59
+ ],
60
+ "development": [
61
+ "last 1 chrome version",
62
+ "last 1 firefox version",
63
+ "last 1 safari version"
64
+ ]
65
+ },
51
66
  "dependencies": {
67
+ "react-select": "^5.7.0",
52
68
  "styled-components": "^5.3.6"
53
69
  }
54
70
  }
package/dist/index.css DELETED
@@ -1,9 +0,0 @@
1
- /* add css module styles here (optional) */
2
-
3
- ._3ybTi {
4
- margin: 2em;
5
- padding: 0.5em;
6
- border: 2px solid #000;
7
- font-size: 2em;
8
- text-align: center;
9
- }