oolib 2.5.3 → 2.5.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -18,7 +18,7 @@ var SIZES = {
|
|
|
18
18
|
S: "3rem",
|
|
19
19
|
M: "4rem",
|
|
20
20
|
};
|
|
21
|
-
var ButtonPrimary = (0, styled_components_2.css)(
|
|
21
|
+
var ButtonPrimary = (0, styled_components_2.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n border: none; // $none;\n background-color: ", "; // primaryColor40: primaryColor100\n color: ", "; // greyColor100: white\n ", "\n ", "\n &:hover {\n background-color: ", "; // $primaryColor10 : $primaryColor40\n color: ", "; // greyColor100 : $primaryColorText;\n }\n"], ["\n border: none; // $none;\n background-color: ", "; // primaryColor40: primaryColor100\n color: ", "; // greyColor100: white\n ", "\n ", "\n &:hover {\n background-color: ", "; // $primaryColor10 : $primaryColor40\n color: ", "; // greyColor100 : $primaryColorText;\n }\n"])), function (_a) {
|
|
22
22
|
var invert = _a.invert, colors = _a.theme.colors;
|
|
23
23
|
return invert
|
|
24
24
|
? colors.primaryColor40
|
|
@@ -26,9 +26,12 @@ var ButtonPrimary = (0, styled_components_2.css)(templateObject_2 || (templateOb
|
|
|
26
26
|
}, function (_a) {
|
|
27
27
|
var invert = _a.invert;
|
|
28
28
|
return invert ? greyColor100 : white;
|
|
29
|
+
}, function (_a) {
|
|
30
|
+
var color = _a.color;
|
|
31
|
+
return color && (0, styled_components_2.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), color);
|
|
29
32
|
}, function (_a) {
|
|
30
33
|
var disabled = _a.disabled;
|
|
31
|
-
return disabled && (0, styled_components_2.css)(
|
|
34
|
+
return disabled && (0, styled_components_2.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", "; //greyColor70 : $greyColor15;\n color: ", "; //$greyColor40;\n pointer-events: none;\n "], ["\n background-color: ", "; //greyColor70 : $greyColor15;\n color: ", "; //$greyColor40;\n pointer-events: none;\n "])), function (_a) {
|
|
32
35
|
var invert = _a.invert;
|
|
33
36
|
return invert ? greyColor70 : greyColor15;
|
|
34
37
|
}, greyColor40);
|
|
@@ -43,7 +46,7 @@ var ButtonPrimary = (0, styled_components_2.css)(templateObject_2 || (templateOb
|
|
|
43
46
|
? greyColor100
|
|
44
47
|
: colors.primaryColorText;
|
|
45
48
|
});
|
|
46
|
-
var ButtonSecondary = (0, styled_components_2.css)(
|
|
49
|
+
var ButtonSecondary = (0, styled_components_2.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n border: 2px solid\n ", "; // primaryColor40 : $primaryColor100;\n background-color: ", "; // greyColor100: white\n color: ", "; // primaryColor40: primaryColorText\n ", "\n ", "\n ", "\n &:hover {\n background-color: ", "; // $primaryColor10 : $primaryColor40\n color: ", "; // $primaryColorText;\n }\n"], ["\n border: 2px solid\n ", "; // primaryColor40 : $primaryColor100;\n background-color: ", "; // greyColor100: white\n color: ", "; // primaryColor40: primaryColorText\n ", "\n ", "\n ", "\n &:hover {\n background-color: ", "; // $primaryColor10 : $primaryColor40\n color: ", "; // $primaryColorText;\n }\n"])), function (_a) {
|
|
47
50
|
var invert = _a.invert, colors = _a.theme.colors;
|
|
48
51
|
return invert
|
|
49
52
|
? colors.primaryColor40
|
|
@@ -56,9 +59,12 @@ var ButtonSecondary = (0, styled_components_2.css)(templateObject_5 || (template
|
|
|
56
59
|
return invert
|
|
57
60
|
? colors.primaryColor40
|
|
58
61
|
: colors.primaryColorText;
|
|
62
|
+
}, function (_a) {
|
|
63
|
+
var color = _a.color;
|
|
64
|
+
return color && (0, styled_components_2.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), color);
|
|
59
65
|
}, function (_a) {
|
|
60
66
|
var active = _a.active;
|
|
61
|
-
return active && (0, styled_components_2.css)(
|
|
67
|
+
return active && (0, styled_components_2.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), function (_a) {
|
|
62
68
|
var invert = _a.invert, colors = _a.theme.colors;
|
|
63
69
|
return invert ? colors.primaryColor40 : colors.primaryColor10;
|
|
64
70
|
}, function (_a) {
|
|
@@ -67,7 +73,7 @@ var ButtonSecondary = (0, styled_components_2.css)(templateObject_5 || (template
|
|
|
67
73
|
});
|
|
68
74
|
}, function (_a) {
|
|
69
75
|
var disabled = _a.disabled;
|
|
70
|
-
return disabled && (0, styled_components_2.css)(
|
|
76
|
+
return disabled && (0, styled_components_2.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n background-color: ", "; //greyColor80 : $white;\n border: 2px solid ", ";\n color: ", "; //$greyColor40;\n pointer-events: none;\n "], ["\n background-color: ", "; //greyColor80 : $white;\n border: 2px solid ", ";\n color: ", "; //$greyColor40;\n pointer-events: none;\n "])), function (_a) {
|
|
71
77
|
var invert = _a.invert;
|
|
72
78
|
return invert ? greyColor80 : white;
|
|
73
79
|
}, greyColor15, greyColor40);
|
|
@@ -82,7 +88,7 @@ var ButtonSecondary = (0, styled_components_2.css)(templateObject_5 || (template
|
|
|
82
88
|
var colors = _a.theme.colors;
|
|
83
89
|
return colors.primaryColorText;
|
|
84
90
|
});
|
|
85
|
-
var ButtonCustom = (0, styled_components_2.css)(
|
|
91
|
+
var ButtonCustom = (0, styled_components_2.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n border: 2px solid\n ", "; // $primaryColor100;\n box-shadow: -4px 4px 1px\n ", "; //$lightShadowColor;\n background-color: ", "; //greyColor100 : $white;\n color: ", "; // primaryColor40 : $primaryColorText;\n ", "\n ", "\n &:hover {\n background-color: ", "; // $greyColor80 : $primaryColor40\n }\n"], ["\n border: 2px solid\n ", "; // $primaryColor100;\n box-shadow: -4px 4px 1px\n ", "; //$lightShadowColor;\n background-color: ", "; //greyColor100 : $white;\n color: ", "; // primaryColor40 : $primaryColorText;\n ", "\n ", "\n &:hover {\n background-color: ", "; // $greyColor80 : $primaryColor40\n }\n"])), function (_a) {
|
|
86
92
|
var invert = _a.invert, colors = _a.theme.colors;
|
|
87
93
|
return invert
|
|
88
94
|
? colors.primaryColor40
|
|
@@ -100,9 +106,12 @@ var ButtonCustom = (0, styled_components_2.css)(templateObject_7 || (templateObj
|
|
|
100
106
|
return invert
|
|
101
107
|
? colors.primaryColor40
|
|
102
108
|
: colors.primaryColorText;
|
|
109
|
+
}, function (_a) {
|
|
110
|
+
var color = _a.color;
|
|
111
|
+
return color && (0, styled_components_2.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), color);
|
|
103
112
|
}, function (_a) {
|
|
104
113
|
var disabled = _a.disabled;
|
|
105
|
-
return disabled && (0, styled_components_2.css)(
|
|
114
|
+
return disabled && (0, styled_components_2.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n color: ", "; //$greyColor40;\n border: 2px solid ", "; // $darkShadowColor : $greyColor15;\n box-shadow: -4px 4px 1px ", "; // $darkShadowColor;\n pointer-events: none;\n background-color: ", "; //greyColor80 : white\n "], ["\n color: ", "; //$greyColor40;\n border: 2px solid ", "; // $darkShadowColor : $greyColor15;\n box-shadow: -4px 4px 1px ", "; // $darkShadowColor;\n pointer-events: none;\n background-color: ", "; //greyColor80 : white\n "])), greyColor40, function (_a) {
|
|
106
115
|
var invert = _a.invert;
|
|
107
116
|
return (invert ? greyColor40 : greyColor15);
|
|
108
117
|
}, greyColor40, function (_a) {
|
|
@@ -115,28 +124,28 @@ var ButtonCustom = (0, styled_components_2.css)(templateObject_7 || (templateObj
|
|
|
115
124
|
? greyColor80
|
|
116
125
|
: colors.primaryColor40;
|
|
117
126
|
});
|
|
118
|
-
var ButtonGhost = (0, styled_components_2.css)(
|
|
127
|
+
var ButtonGhost = (0, styled_components_2.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n background-color: ", "; //$white;\n color: ", "; //primaryColor40 : greyColor100\n ", "\n ", "\n\n ", "\n &:hover {\n background-color: ", "; // $greyColor70 : $primaryColor10\n }\n"], ["\n background-color: ", "; //$white;\n color: ", "; //primaryColor40 : greyColor100\n ", "\n ", "\n\n ", "\n &:hover {\n background-color: ", "; // $greyColor70 : $primaryColor10\n }\n"])), function (_a) {
|
|
119
128
|
var active = _a.active, colors = _a.theme.colors;
|
|
120
|
-
return active ? colors.primaryColor40 :
|
|
129
|
+
return active ? colors.primaryColor40 : "inherit";
|
|
121
130
|
}, function (_a) {
|
|
122
131
|
var invert = _a.invert, composition = _a.composition, colors = _a.theme.colors;
|
|
123
132
|
return invert
|
|
124
133
|
? colors.primaryColor40
|
|
125
|
-
: composition ===
|
|
134
|
+
: composition === "iconOnly"
|
|
126
135
|
? greyColor100
|
|
127
136
|
: colors.primaryColorText;
|
|
128
137
|
}, function (_a) {
|
|
129
138
|
var color = _a.color;
|
|
130
|
-
return color && (0, styled_components_2.css)(
|
|
139
|
+
return color && (0, styled_components_2.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), color);
|
|
131
140
|
}, function (_a) {
|
|
132
141
|
var invert = _a.invert;
|
|
133
|
-
return invert && (0, styled_components_2.css)(
|
|
142
|
+
return invert && (0, styled_components_2.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n background-color: ", ";\n "], ["\n background-color: ", ";\n "])), function (_a) {
|
|
134
143
|
var active = _a.active;
|
|
135
144
|
return active ? greyColor80 : greyColor100;
|
|
136
145
|
});
|
|
137
146
|
}, function (_a) {
|
|
138
147
|
var disabled = _a.disabled;
|
|
139
|
-
return disabled && (0, styled_components_2.css)(
|
|
148
|
+
return disabled && (0, styled_components_2.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n color: ", "; //$greyColor40;\n pointer-events: none;\n "], ["\n color: ", "; //$greyColor40;\n pointer-events: none;\n "])), greyColor40);
|
|
140
149
|
}, function (_a) {
|
|
141
150
|
var invert = _a.invert, active = _a.active, colors = _a.theme.colors;
|
|
142
151
|
return active
|
|
@@ -145,9 +154,9 @@ var ButtonGhost = (0, styled_components_2.css)(templateObject_11 || (templateObj
|
|
|
145
154
|
? greyColor70
|
|
146
155
|
: colors.primaryColor10;
|
|
147
156
|
});
|
|
148
|
-
var GoogleButton = (0, styled_components_2.css)(
|
|
157
|
+
var GoogleButton = (0, styled_components_2.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n color: #4285f4;\n border: 2px solid #4285f4;\n background-color: ", ";\n ", "\n"], ["\n color: #4285f4;\n border: 2px solid #4285f4;\n background-color: ", ";\n ", "\n"])), white, function (_a) {
|
|
149
158
|
var disabled = _a.disabled;
|
|
150
|
-
return disabled && (0, styled_components_2.css)(
|
|
159
|
+
return disabled && (0, styled_components_2.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n pointer-events: none;\n "], ["\n pointer-events: none;\n "])));
|
|
151
160
|
});
|
|
152
161
|
var buttonVariantSetting = {
|
|
153
162
|
primary: ButtonPrimary,
|
|
@@ -156,21 +165,21 @@ var buttonVariantSetting = {
|
|
|
156
165
|
custom: ButtonCustom,
|
|
157
166
|
googleAuth: GoogleButton,
|
|
158
167
|
};
|
|
159
|
-
exports.ButtonStyled = styled_components_1.default.button(
|
|
168
|
+
exports.ButtonStyled = styled_components_1.default.button(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n ", "\n\n ", "\n\n white-space: nowrap;\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 1rem;\n cursor: pointer;\n border: none;\n border-radius: 2px;\n\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n\n white-space: nowrap;\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 1rem;\n cursor: pointer;\n border: none;\n border-radius: 2px;\n\n ", "\n\n ", "\n"])), function (_a) {
|
|
160
169
|
var composition = _a.composition, size = _a.size;
|
|
161
170
|
switch (composition) {
|
|
162
|
-
case
|
|
163
|
-
return (0, styled_components_2.css)(
|
|
164
|
-
case
|
|
165
|
-
return (0, styled_components_2.css)(
|
|
171
|
+
case "iconOnly":
|
|
172
|
+
return (0, styled_components_2.css)(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n padding: 0;\n height: ", ";\n width: ", ";\n "], ["\n padding: 0;\n height: ", ";\n width: ", ";\n "])), SIZES[size], SIZES[size]);
|
|
173
|
+
case "icon+text":
|
|
174
|
+
return (0, styled_components_2.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n padding: 0 2rem 0 1.5rem;\n height: ", ";\n "], ["\n padding: 0 2rem 0 1.5rem;\n height: ", ";\n "])), SIZES[size]);
|
|
166
175
|
default:
|
|
167
|
-
return (0, styled_components_2.css)(
|
|
176
|
+
return (0, styled_components_2.css)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n padding: 0 2rem;\n height: ", ";\n "], ["\n padding: 0 2rem;\n height: ", ";\n "])), SIZES[size]);
|
|
168
177
|
}
|
|
169
178
|
}, function (_a) {
|
|
170
179
|
var width = _a.width;
|
|
171
|
-
return width && (0, styled_components_2.css)(
|
|
172
|
-
}, (0, mixins_1.transition)(
|
|
180
|
+
return width && (0, styled_components_2.css)(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n width: ", ";\n "], ["\n width: ", ";\n "])), width);
|
|
181
|
+
}, (0, mixins_1.transition)("background-color"), function (_a) {
|
|
173
182
|
var variant = _a.variant;
|
|
174
183
|
return buttonVariantSetting[variant];
|
|
175
184
|
});
|
|
176
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18;
|
|
185
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21;
|
|
@@ -193,7 +193,7 @@ var PhoneInput = function (props) {
|
|
|
193
193
|
exports.PhoneInput = PhoneInput;
|
|
194
194
|
var URLInput = function (props) {
|
|
195
195
|
var handleValidation = function (value) { return __awaiter(void 0, void 0, void 0, function () {
|
|
196
|
-
var response,
|
|
196
|
+
var response, err_1;
|
|
197
197
|
return __generator(this, function (_a) {
|
|
198
198
|
switch (_a.label) {
|
|
199
199
|
case 0:
|
|
@@ -210,7 +210,10 @@ var URLInput = function (props) {
|
|
|
210
210
|
throw new Error('');
|
|
211
211
|
return [2 /*return*/, { type: 'success', msg: 'valid url' }];
|
|
212
212
|
case 3:
|
|
213
|
-
|
|
213
|
+
err_1 = _a.sent();
|
|
214
|
+
if (/\b(([\w-]+:\/\/?|www[.])[^\s()<>]+(?:\([\w\d]+\)|([^[:punct:]\s]|\/)))/.test(value)) {
|
|
215
|
+
return [2 /*return*/, { type: 'success', msg: 'valid url' }];
|
|
216
|
+
}
|
|
214
217
|
return [2 /*return*/, { type: 'error', msg: 'Enter a valid url...' }];
|
|
215
218
|
case 4: return [2 /*return*/];
|
|
216
219
|
}
|
package/dist/themes/typo.js
CHANGED
|
@@ -234,7 +234,7 @@ var LABEL = (0, styled_components_1.css)(templateObject_17 || (templateObject_17
|
|
|
234
234
|
var color = _a.color, invert = _a.invert;
|
|
235
235
|
return (invert ? white : color);
|
|
236
236
|
}, sansSerif);
|
|
237
|
-
var BLOCKQUOTE = (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n padding: 2rem;\n border-left: 4px solid\n ", ";\n ", "
|
|
237
|
+
var BLOCKQUOTE = (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n padding: 2rem;\n border-left: 4px solid\n ", ";\n ", ";\n font-style: italic;\n color: ", ";\n"], ["\n padding: 2rem;\n border-left: 4px solid\n ", ";\n ", ";\n font-style: italic;\n color: ", ";\n"])), function (_a) {
|
|
238
238
|
var invert = _a.invert, colors = _a.theme.colors;
|
|
239
239
|
return invert ? greyColor40 : colors === null || colors === void 0 ? void 0 : colors.primaryColor100;
|
|
240
240
|
}, SERIF_4_5, greyColor80);
|