glints-aries 4.1.81 → 4.1.82
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/@next/Input/InputStyle.js +3 -4
- package/es/@next/Select/components/Activator/ActivatorStyle.js +2 -3
- package/es/@next/Select/components/SearchableSelectInput/SearchableSelectInputStyle.js +2 -3
- package/lib/@next/Input/InputStyle.js +3 -6
- package/lib/@next/Select/components/Activator/ActivatorStyle.js +2 -5
- package/lib/@next/Select/components/SearchableSelectInput/SearchableSelectInputStyle.js +2 -5
- package/package.json +1 -1
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import styled from 'styled-components';
|
|
2
|
-
import * as Breakpoints from '../utilities/breakpoints';
|
|
3
2
|
import { Neutral, Red } from '../utilities/colors';
|
|
4
3
|
import { space12, space4, space8 } from '../utilities/spacing';
|
|
5
4
|
import { NotoSans } from '../utilities/fonts';
|
|
@@ -8,7 +7,7 @@ import { Greyscale } from '../../Utils/Colors';
|
|
|
8
7
|
export var StyledContainer = styled.div.withConfig({
|
|
9
8
|
displayName: "InputStyle__StyledContainer",
|
|
10
9
|
componentId: "sc-15z2mnd-0"
|
|
11
|
-
})(["position:relative;display:flex;flex-direction:column;flex:1;flex-basis:100%;font-family:'Noto Sans',sans-serif;font-style:normal;font-weight:400;font-size:
|
|
10
|
+
})(["position:relative;display:flex;flex-direction:column;flex:1;flex-basis:100%;font-family:'Noto Sans',sans-serif;font-style:normal;font-weight:400;font-size:14px;line-height:150%;&[data-prefix='true'] input{padding-left:", "px;}&[data-suffix='true'] input{padding-right:", "px;}&[data-error='true'] input{border:1px solid ", ";}&[data-error='true'] input:focus{box-shadow:none;}&[data-disabled='true'] input{border:none;background:", ";color:", ";cursor:not-allowed;}&[data-disabled='true'] svg{fill:", ";}&[data-disabled='true'] div{color:", ";}"], function (props) {
|
|
12
11
|
return props.prefixWidth;
|
|
13
12
|
}, function (props) {
|
|
14
13
|
return props.suffixWidth;
|
|
@@ -43,7 +42,7 @@ export var FloatingLabel = styled.label.withConfig({
|
|
|
43
42
|
export var StyledInput = styled.input.withConfig({
|
|
44
43
|
displayName: "InputStyle__StyledInput",
|
|
45
44
|
componentId: "sc-15z2mnd-4"
|
|
46
|
-
})(["background:", ";box-sizing:border-box;border:", ";border-radius:", ";padding:0 12px;font-family:", ",sans-serif;font-style:normal;font-weight:400;font-size:
|
|
45
|
+
})(["background:", ";box-sizing:border-box;border:", ";border-radius:", ";padding:0 12px;font-family:", ",sans-serif;font-style:normal;font-weight:400;font-size:14px;line-height:150%;color:", ";flex:none;order:1;align-self:stretch;flex-grow:0;height:", ";&::placeholder{color:", ";}&:focus{outline:none;box-shadow:0px 0px 0px 1px ", ",0px 0px 0px 3px #6ac9ec;}"], Neutral.B100, function (_ref6) {
|
|
47
46
|
var border = _ref6.border;
|
|
48
47
|
return border != null ? border : "1px solid " + Neutral.B68;
|
|
49
48
|
}, function (_ref7) {
|
|
@@ -52,7 +51,7 @@ export var StyledInput = styled.input.withConfig({
|
|
|
52
51
|
}, NotoSans, Neutral.B18, function (_ref8) {
|
|
53
52
|
var height = _ref8.height;
|
|
54
53
|
return height != null ? height : "36px";
|
|
55
|
-
}, Neutral.B68, Neutral.B100
|
|
54
|
+
}, Neutral.B68, Neutral.B100);
|
|
56
55
|
export var AsteriskIcon = styled.span.withConfig({
|
|
57
56
|
displayName: "InputStyle__AsteriskIcon",
|
|
58
57
|
componentId: "sc-15z2mnd-5"
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import styled from 'styled-components';
|
|
2
|
-
import * as Breakpoints from '../../../utilities/breakpoints/Breakpoints';
|
|
3
2
|
import { borderRadius4 } from '../../../utilities/borderRadius';
|
|
4
3
|
import { Neutral, Red } from '../../../utilities/colors';
|
|
5
4
|
import { NotoSans } from '../../../utilities/fonts';
|
|
@@ -12,7 +11,7 @@ import { StyledSuffixContainer } from '../../../Input/InputStyle';
|
|
|
12
11
|
export var StyledSelect = styled.button.withConfig({
|
|
13
12
|
displayName: "ActivatorStyle__StyledSelect",
|
|
14
13
|
componentId: "sc-rui73p-0"
|
|
15
|
-
})(["position:relative;display:flex;align-items:center;justify-content:space-between;height:", ";cursor:pointer;padding:0px 8px 0px 12px;border:", ";box-shadow:0px 1px 0px rgba(0,0,0,0.05);border-radius:", ";background:", ";width:", ";color:", ";font-family:", ",sans-serif;font-weight:400;font-size:
|
|
14
|
+
})(["position:relative;display:flex;align-items:center;justify-content:space-between;height:", ";cursor:pointer;padding:0px 8px 0px 12px;border:", ";box-shadow:0px 1px 0px rgba(0,0,0,0.05);border-radius:", ";background:", ";width:", ";color:", ";font-family:", ",sans-serif;font-weight:400;font-size:14px;line-height:150%;letter-spacing:0px;&:focus{outline:none;box-shadow:0px 0px 0px 1px #ffffff,0px 0px 0px 3px #6cc9ec;}&:disabled{background:", ";pointer-events:none;cursor:default;border:1px solid ", ";}&[data-error='true']{border:1px solid ", ";border-radius:", ";}"], function (props) {
|
|
16
15
|
var _props$height;
|
|
17
16
|
return (_props$height = props.height) != null ? _props$height : '36px';
|
|
18
17
|
}, function (_ref) {
|
|
@@ -23,7 +22,7 @@ export var StyledSelect = styled.button.withConfig({
|
|
|
23
22
|
return borderRadius != null ? borderRadius : borderRadius4;
|
|
24
23
|
}, Neutral.B100, function (props) {
|
|
25
24
|
return props.width;
|
|
26
|
-
}, Neutral.B18, NotoSans,
|
|
25
|
+
}, Neutral.B18, NotoSans, Neutral.B95, Neutral.B85, Red.B93, borderRadius4);
|
|
27
26
|
export var TagsContainer = styled.div.withConfig({
|
|
28
27
|
displayName: "ActivatorStyle__TagsContainer",
|
|
29
28
|
componentId: "sc-rui73p-1"
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import styled from 'styled-components';
|
|
2
|
-
import * as Breakpoints from '../../../utilities/breakpoints';
|
|
3
2
|
import { Neutral, Red } from '../../../utilities/colors';
|
|
4
3
|
import { NotoSans } from '../../../utilities/fonts';
|
|
5
4
|
import { StyledContainer as StyledInputContainer, StyledSuffixContainer } from '../../../Input/InputStyle';
|
|
@@ -26,13 +25,13 @@ export var StyledSelected = styled.span.withConfig({
|
|
|
26
25
|
export var StyledSelectedValue = styled.div.withConfig({
|
|
27
26
|
displayName: "SearchableSelectInputStyle__StyledSelectedValue",
|
|
28
27
|
componentId: "sc-1oj168h-2"
|
|
29
|
-
})(["border:", ";border-radius:", ";background:transparent;box-sizing:border-box;padding:0 12px;height:36px;display:flex;align-items:center;grid-column:1 / 1;grid-row:1 / 1;font-family:", ",sans-serif;font-style:normal;font-weight:400;font-size:
|
|
28
|
+
})(["border:", ";border-radius:", ";background:transparent;box-sizing:border-box;padding:0 12px;height:36px;display:flex;align-items:center;grid-column:1 / 1;grid-row:1 / 1;font-family:", ",sans-serif;font-style:normal;font-weight:400;font-size:14px;line-height:150%;color:", ";"], function (_ref) {
|
|
30
29
|
var border = _ref.border;
|
|
31
30
|
return border != null ? border : "1px solid " + Neutral.B68;
|
|
32
31
|
}, function (_ref2) {
|
|
33
32
|
var borderRadius = _ref2.borderRadius;
|
|
34
33
|
return borderRadius != null ? borderRadius : borderRadius4;
|
|
35
|
-
}, NotoSans, Neutral.B18
|
|
34
|
+
}, NotoSans, Neutral.B18);
|
|
36
35
|
export var InputContainer = styled.div.withConfig({
|
|
37
36
|
displayName: "SearchableSelectInputStyle__InputContainer",
|
|
38
37
|
componentId: "sc-1oj168h-3"
|
|
@@ -4,18 +4,15 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
exports.__esModule = true;
|
|
5
5
|
exports.StyledSuffixContainer = exports.StyledPrefixContainer = exports.StyledInput = exports.StyledContainer = exports.FloatingLabel = exports.AsteriskIcon = void 0;
|
|
6
6
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
7
|
-
var Breakpoints = _interopRequireWildcard(require("../utilities/breakpoints"));
|
|
8
7
|
var _colors = require("../utilities/colors");
|
|
9
8
|
var _spacing = require("../utilities/spacing");
|
|
10
9
|
var _fonts = require("../utilities/fonts");
|
|
11
10
|
var _borderRadius = require("../utilities/borderRadius");
|
|
12
11
|
var _Colors = require("../../Utils/Colors");
|
|
13
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
14
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
15
12
|
var StyledContainer = _styledComponents["default"].div.withConfig({
|
|
16
13
|
displayName: "InputStyle__StyledContainer",
|
|
17
14
|
componentId: "sc-15z2mnd-0"
|
|
18
|
-
})(["position:relative;display:flex;flex-direction:column;flex:1;flex-basis:100%;font-family:'Noto Sans',sans-serif;font-style:normal;font-weight:400;font-size:
|
|
15
|
+
})(["position:relative;display:flex;flex-direction:column;flex:1;flex-basis:100%;font-family:'Noto Sans',sans-serif;font-style:normal;font-weight:400;font-size:14px;line-height:150%;&[data-prefix='true'] input{padding-left:", "px;}&[data-suffix='true'] input{padding-right:", "px;}&[data-error='true'] input{border:1px solid ", ";}&[data-error='true'] input:focus{box-shadow:none;}&[data-disabled='true'] input{border:none;background:", ";color:", ";cursor:not-allowed;}&[data-disabled='true'] svg{fill:", ";}&[data-disabled='true'] div{color:", ";}"], function (props) {
|
|
19
16
|
return props.prefixWidth;
|
|
20
17
|
}, function (props) {
|
|
21
18
|
return props.suffixWidth;
|
|
@@ -54,7 +51,7 @@ exports.FloatingLabel = FloatingLabel;
|
|
|
54
51
|
var StyledInput = _styledComponents["default"].input.withConfig({
|
|
55
52
|
displayName: "InputStyle__StyledInput",
|
|
56
53
|
componentId: "sc-15z2mnd-4"
|
|
57
|
-
})(["background:", ";box-sizing:border-box;border:", ";border-radius:", ";padding:0 12px;font-family:", ",sans-serif;font-style:normal;font-weight:400;font-size:
|
|
54
|
+
})(["background:", ";box-sizing:border-box;border:", ";border-radius:", ";padding:0 12px;font-family:", ",sans-serif;font-style:normal;font-weight:400;font-size:14px;line-height:150%;color:", ";flex:none;order:1;align-self:stretch;flex-grow:0;height:", ";&::placeholder{color:", ";}&:focus{outline:none;box-shadow:0px 0px 0px 1px ", ",0px 0px 0px 3px #6ac9ec;}"], _colors.Neutral.B100, function (_ref6) {
|
|
58
55
|
var border = _ref6.border;
|
|
59
56
|
return border != null ? border : "1px solid " + _colors.Neutral.B68;
|
|
60
57
|
}, function (_ref7) {
|
|
@@ -63,7 +60,7 @@ var StyledInput = _styledComponents["default"].input.withConfig({
|
|
|
63
60
|
}, _fonts.NotoSans, _colors.Neutral.B18, function (_ref8) {
|
|
64
61
|
var height = _ref8.height;
|
|
65
62
|
return height != null ? height : "36px";
|
|
66
|
-
}, _colors.Neutral.B68, _colors.Neutral.B100
|
|
63
|
+
}, _colors.Neutral.B68, _colors.Neutral.B100);
|
|
67
64
|
exports.StyledInput = StyledInput;
|
|
68
65
|
var AsteriskIcon = _styledComponents["default"].span.withConfig({
|
|
69
66
|
displayName: "InputStyle__AsteriskIcon",
|
|
@@ -4,7 +4,6 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
exports.__esModule = true;
|
|
5
5
|
exports.WithPrefixContainer = exports.TagsContainer = exports.SuffixContainer = exports.StyledTextInput = exports.StyledTag = exports.StyledSelectTypography = exports.StyledSelect = exports.StyledPrefixContainer = exports.StyledIcon = void 0;
|
|
6
6
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
7
|
-
var Breakpoints = _interopRequireWildcard(require("../../../utilities/breakpoints/Breakpoints"));
|
|
8
7
|
var _borderRadius = require("../../../utilities/borderRadius");
|
|
9
8
|
var _colors = require("../../../utilities/colors");
|
|
10
9
|
var _fonts = require("../../../utilities/fonts");
|
|
@@ -14,12 +13,10 @@ var _Tag = require("../../../Tag");
|
|
|
14
13
|
var _Typography = require("../../../Typography");
|
|
15
14
|
var _Icon = require("../../../Icon");
|
|
16
15
|
var _InputStyle = require("../../../Input/InputStyle");
|
|
17
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
18
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
19
16
|
var StyledSelect = _styledComponents["default"].button.withConfig({
|
|
20
17
|
displayName: "ActivatorStyle__StyledSelect",
|
|
21
18
|
componentId: "sc-rui73p-0"
|
|
22
|
-
})(["position:relative;display:flex;align-items:center;justify-content:space-between;height:", ";cursor:pointer;padding:0px 8px 0px 12px;border:", ";box-shadow:0px 1px 0px rgba(0,0,0,0.05);border-radius:", ";background:", ";width:", ";color:", ";font-family:", ",sans-serif;font-weight:400;font-size:
|
|
19
|
+
})(["position:relative;display:flex;align-items:center;justify-content:space-between;height:", ";cursor:pointer;padding:0px 8px 0px 12px;border:", ";box-shadow:0px 1px 0px rgba(0,0,0,0.05);border-radius:", ";background:", ";width:", ";color:", ";font-family:", ",sans-serif;font-weight:400;font-size:14px;line-height:150%;letter-spacing:0px;&:focus{outline:none;box-shadow:0px 0px 0px 1px #ffffff,0px 0px 0px 3px #6cc9ec;}&:disabled{background:", ";pointer-events:none;cursor:default;border:1px solid ", ";}&[data-error='true']{border:1px solid ", ";border-radius:", ";}"], function (props) {
|
|
23
20
|
var _props$height;
|
|
24
21
|
return (_props$height = props.height) != null ? _props$height : '36px';
|
|
25
22
|
}, function (_ref) {
|
|
@@ -30,7 +27,7 @@ var StyledSelect = _styledComponents["default"].button.withConfig({
|
|
|
30
27
|
return borderRadius != null ? borderRadius : _borderRadius.borderRadius4;
|
|
31
28
|
}, _colors.Neutral.B100, function (props) {
|
|
32
29
|
return props.width;
|
|
33
|
-
}, _colors.Neutral.B18, _fonts.NotoSans,
|
|
30
|
+
}, _colors.Neutral.B18, _fonts.NotoSans, _colors.Neutral.B95, _colors.Neutral.B85, _colors.Red.B93, _borderRadius.borderRadius4);
|
|
34
31
|
exports.StyledSelect = StyledSelect;
|
|
35
32
|
var TagsContainer = _styledComponents["default"].div.withConfig({
|
|
36
33
|
displayName: "ActivatorStyle__TagsContainer",
|
|
@@ -4,13 +4,10 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
exports.__esModule = true;
|
|
5
5
|
exports.StyledSelectedValue = exports.StyledSelected = exports.StyledContainer = exports.InputContainer = exports.ClearSelectedContainer = void 0;
|
|
6
6
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
7
|
-
var Breakpoints = _interopRequireWildcard(require("../../../utilities/breakpoints"));
|
|
8
7
|
var _colors = require("../../../utilities/colors");
|
|
9
8
|
var _fonts = require("../../../utilities/fonts");
|
|
10
9
|
var _InputStyle = require("../../../Input/InputStyle");
|
|
11
10
|
var _borderRadius = require("../../../utilities/borderRadius");
|
|
12
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
13
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
14
11
|
var StyledContainer = (0, _styledComponents["default"])(_InputStyle.StyledContainer).withConfig({
|
|
15
12
|
displayName: "SearchableSelectInputStyle__StyledContainer",
|
|
16
13
|
componentId: "sc-1oj168h-0"
|
|
@@ -35,13 +32,13 @@ exports.StyledSelected = StyledSelected;
|
|
|
35
32
|
var StyledSelectedValue = _styledComponents["default"].div.withConfig({
|
|
36
33
|
displayName: "SearchableSelectInputStyle__StyledSelectedValue",
|
|
37
34
|
componentId: "sc-1oj168h-2"
|
|
38
|
-
})(["border:", ";border-radius:", ";background:transparent;box-sizing:border-box;padding:0 12px;height:36px;display:flex;align-items:center;grid-column:1 / 1;grid-row:1 / 1;font-family:", ",sans-serif;font-style:normal;font-weight:400;font-size:
|
|
35
|
+
})(["border:", ";border-radius:", ";background:transparent;box-sizing:border-box;padding:0 12px;height:36px;display:flex;align-items:center;grid-column:1 / 1;grid-row:1 / 1;font-family:", ",sans-serif;font-style:normal;font-weight:400;font-size:14px;line-height:150%;color:", ";"], function (_ref) {
|
|
39
36
|
var border = _ref.border;
|
|
40
37
|
return border != null ? border : "1px solid " + _colors.Neutral.B68;
|
|
41
38
|
}, function (_ref2) {
|
|
42
39
|
var borderRadius = _ref2.borderRadius;
|
|
43
40
|
return borderRadius != null ? borderRadius : _borderRadius.borderRadius4;
|
|
44
|
-
}, _fonts.NotoSans, _colors.Neutral.B18
|
|
41
|
+
}, _fonts.NotoSans, _colors.Neutral.B18);
|
|
45
42
|
exports.StyledSelectedValue = StyledSelectedValue;
|
|
46
43
|
var InputContainer = _styledComponents["default"].div.withConfig({
|
|
47
44
|
displayName: "SearchableSelectInputStyle__InputContainer",
|