@mirai/ui 2.1.13 → 2.1.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -3
- package/build/components/InputOption/__tests__/__snapshots__/InputOption.test.js.snap +3 -3
- package/build/components/InputPhone/__tests__/__snapshots__/InputPhone.test.js.snap +3 -3
- package/build/components/InputSelect/__tests__/__snapshots__/InputSelect.test.js.snap +3 -3
- package/build/components/InputText/InputText.module.css +10 -8
- package/build/components/InputText/__tests__/__snapshots__/InputText.test.js.snap +3 -3
- package/build/components/InputText/partials/InputText.Label.js +3 -8
- package/build/components/InputText/partials/InputText.Label.js.map +1 -1
- package/build/theme/default.theme.css +2 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -122,10 +122,10 @@ const MyComponent = () => (
|
|
|
122
122
|
--mirai-ui-input-background: var(--mirai-ui-base);
|
|
123
123
|
--mirai-ui-input-color: var(--mirai-ui-content);
|
|
124
124
|
--mirai-ui-input-disabled: var(--mirai-ui-content-light);
|
|
125
|
-
--mirai-ui-input-focus-color: var(--mirai-ui-
|
|
126
|
-
--mirai-ui-input-focus-shadow:
|
|
125
|
+
--mirai-ui-input-focus-color: var(--mirai-ui-focus-color);
|
|
126
|
+
--mirai-ui-input-focus-shadow: var(--mirai-ui-focus-shadow);
|
|
127
127
|
--mirai-ui-input-focus-shadow-error: 0 0 0 var(--mirai-ui-focus-width) var(--mirai-ui-error-border);
|
|
128
|
-
--mirai-ui-input-focus-shadow-warning: 0 0 0 var(--mirai-ui-focus-width) var(--mirai-ui-error-background);
|
|
128
|
+
--mirai-ui-input-focus-shadow-warning: 0 0 0 calc(var(--mirai-ui-focus-width) * 0.66) var(--mirai-ui-error-background);
|
|
129
129
|
--mirai-ui-input-focus-shadow-success: 0 0 0 var(--mirai-ui-focus-width) var(--mirai-ui-success-border);
|
|
130
130
|
```
|
|
131
131
|
|
|
@@ -278,11 +278,11 @@ exports[`primitive:<InputOption> prop:required & prop:showRequired 1`] = `
|
|
|
278
278
|
htmlfor="name"
|
|
279
279
|
>
|
|
280
280
|
label
|
|
281
|
-
<
|
|
282
|
-
class="
|
|
281
|
+
<span
|
|
282
|
+
class="required error"
|
|
283
283
|
>
|
|
284
284
|
✱
|
|
285
|
-
</
|
|
285
|
+
</span>
|
|
286
286
|
</ui-label>
|
|
287
287
|
</ui-input-option>
|
|
288
288
|
</DocumentFragment>
|
|
@@ -893,11 +893,11 @@ exports[`component:<InputPhone> prop:required & prop:showRequired (true) 1`] = `
|
|
|
893
893
|
htmlfor="name"
|
|
894
894
|
>
|
|
895
895
|
label
|
|
896
|
-
<
|
|
897
|
-
class="
|
|
896
|
+
<span
|
|
897
|
+
class="required error"
|
|
898
898
|
>
|
|
899
899
|
✱
|
|
900
|
-
</
|
|
900
|
+
</span>
|
|
901
901
|
</ui-label>
|
|
902
902
|
<input
|
|
903
903
|
class="input input withLabel"
|
|
@@ -426,11 +426,11 @@ exports[`component:<InputSelect> prop:required & prop:showRequired (true) 1`] =
|
|
|
426
426
|
htmlfor="name"
|
|
427
427
|
>
|
|
428
428
|
label
|
|
429
|
-
<
|
|
430
|
-
class="
|
|
429
|
+
<span
|
|
430
|
+
class="required error"
|
|
431
431
|
>
|
|
432
432
|
✱
|
|
433
|
-
</
|
|
433
|
+
</span>
|
|
434
434
|
</ui-label>
|
|
435
435
|
<select
|
|
436
436
|
class="select empty input withLabel empty"
|
|
@@ -136,14 +136,14 @@
|
|
|
136
136
|
}
|
|
137
137
|
|
|
138
138
|
.text .required {
|
|
139
|
-
border-radius: var(--mirai-ui-border-radius);
|
|
140
|
-
bottom: calc(var(--mirai-ui-space-XXS) / 4);
|
|
139
|
+
/* border-radius: var(--mirai-ui-border-radius); */
|
|
140
|
+
/* bottom: calc(var(--mirai-ui-space-XXS) / 4); */
|
|
141
141
|
margin-left: var(--mirai-ui-space-XXS);
|
|
142
|
-
position: relative;
|
|
143
|
-
text-align: center;
|
|
142
|
+
/* position: relative; */
|
|
143
|
+
/* text-align: center; */
|
|
144
144
|
}
|
|
145
145
|
|
|
146
|
-
.text .required:not(.square) {
|
|
146
|
+
/* .text .required:not(.square) {
|
|
147
147
|
padding: calc(var(--mirai-ui-space-XXS) / 4) calc(var(--mirai-ui-space-XXS) / 2);
|
|
148
148
|
}
|
|
149
149
|
|
|
@@ -151,14 +151,16 @@
|
|
|
151
151
|
height: var(--mirai-ui-space-S);
|
|
152
152
|
width: var(--mirai-ui-space-S);
|
|
153
153
|
line-height: var(--mirai-ui-space-S);
|
|
154
|
-
}
|
|
154
|
+
} */
|
|
155
155
|
|
|
156
156
|
.text .required.error {
|
|
157
|
-
background-color: var(--mirai-ui-error-background);
|
|
157
|
+
/* background-color: var(--mirai-ui-error-background); */
|
|
158
|
+
color: var(--mirai-ui-error);
|
|
158
159
|
}
|
|
159
160
|
|
|
160
161
|
.text .required.success {
|
|
161
|
-
background-color: var(--mirai-ui-success-background);
|
|
162
|
+
/* background-color: var(--mirai-ui-success-background); */
|
|
163
|
+
color: var(--mirai-ui-success);
|
|
162
164
|
}
|
|
163
165
|
|
|
164
166
|
.caption {
|
|
@@ -303,11 +303,11 @@ exports[`component:<InputText> prop:required & prop:showRequired (true) 1`] = `
|
|
|
303
303
|
htmlfor="name"
|
|
304
304
|
>
|
|
305
305
|
label
|
|
306
|
-
<
|
|
307
|
-
class="
|
|
306
|
+
<span
|
|
307
|
+
class="required error"
|
|
308
308
|
>
|
|
309
309
|
✱
|
|
310
|
-
</
|
|
310
|
+
</span>
|
|
311
311
|
</ui-label>
|
|
312
312
|
<input
|
|
313
313
|
class="input input withLabel"
|
|
@@ -30,14 +30,9 @@ var Label = function Label(_ref) {
|
|
|
30
30
|
return /*#__PURE__*/_react["default"].createElement(_primitives.Text, _extends({}, others, {
|
|
31
31
|
tag: "label",
|
|
32
32
|
className: (0, _helpers.styles)(_InputTextModule["default"].text, others.className || _InputTextModule["default"].label, disabled && _InputTextModule["default"].disabled, focus && _InputTextModule["default"].focus, error && _InputTextModule["default"].error, (focus || error || value !== undefined && ((value === null || value === void 0 ? void 0 : value.length) > 0 || typeof value === 'number')) && _InputTextModule["default"].withValue)
|
|
33
|
-
}), label, required && !disabled && !(!focus && success) && /*#__PURE__*/_react["default"].createElement(
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
success: success,
|
|
37
|
-
tiny: true,
|
|
38
|
-
upperCase: true,
|
|
39
|
-
className: (0, _helpers.styles)(_InputTextModule["default"].required, requiredText === DEFAULT_REQUIRED_TEXT && _InputTextModule["default"].square, focus && _InputTextModule["default"].focus, success ? _InputTextModule["default"].success : _InputTextModule["default"].error)
|
|
40
|
-
}, requiredText));
|
|
33
|
+
}), label, required && !disabled && !(!focus && success) && /*#__PURE__*/_react["default"].createElement("span", {
|
|
34
|
+
className: (0, _helpers.styles)(_InputTextModule["default"].required, success ? _InputTextModule["default"].success : _InputTextModule["default"].error)
|
|
35
|
+
}, requiredText !== DEFAULT_REQUIRED_TEXT ? "(".concat(requiredText, ")") : requiredText));
|
|
41
36
|
};
|
|
42
37
|
exports.Label = Label;
|
|
43
38
|
Label.displayName = 'Component:InputText.Label';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputText.Label.js","names":["_propTypes","_interopRequireDefault","require","_react","_helpers","_primitives","_InputTextModule","_excluded","e","__esModule","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","_objectWithoutProperties","o","i","_objectWithoutPropertiesLoose","getOwnPropertySymbols","s","includes","propertyIsEnumerable","DEFAULT_REQUIRED_TEXT","Label","_ref","disabled","error","focus","label","_ref$required","required","_ref$requiredText","requiredText","success","value","others","createElement","Text","tag","className","styles","style","text","undefined","withValue","
|
|
1
|
+
{"version":3,"file":"InputText.Label.js","names":["_propTypes","_interopRequireDefault","require","_react","_helpers","_primitives","_InputTextModule","_excluded","e","__esModule","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","_objectWithoutProperties","o","i","_objectWithoutPropertiesLoose","getOwnPropertySymbols","s","includes","propertyIsEnumerable","DEFAULT_REQUIRED_TEXT","Label","_ref","disabled","error","focus","label","_ref$required","required","_ref$requiredText","requiredText","success","value","others","createElement","Text","tag","className","styles","style","text","undefined","withValue","concat","exports","displayName","propTypes","PropTypes","bool","string"],"sources":["../../../../src/components/InputText/partials/InputText.Label.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../../helpers';\nimport { Text } from '../../../primitives';\nimport style from '../InputText.module.css';\n\nconst DEFAULT_REQUIRED_TEXT = '✱';\n\nconst Label = ({\n disabled,\n error,\n focus,\n label,\n required = false,\n requiredText = DEFAULT_REQUIRED_TEXT,\n success,\n value,\n ...others\n}) => (\n <Text\n {...others}\n tag=\"label\"\n className={styles(\n style.text,\n others.className || style.label,\n disabled && style.disabled,\n focus && style.focus,\n error && style.error,\n (focus || error || (value !== undefined && (value?.length > 0 || typeof value === 'number'))) && style.withValue,\n )}\n >\n {label}\n\n {/* {required && !disabled && !(!focus && success) && (\n <Text\n bold={requiredText !== DEFAULT_REQUIRED_TEXT}\n error={!success}\n success={success}\n tiny\n className={styles(\n style.required,\n requiredText === DEFAULT_REQUIRED_TEXT && style.square,\n focus && style.focus,\n success ? style.success : style.error,\n )}\n >\n {requiredText !== DEFAULT_REQUIRED_TEXT ? `(${requiredText})` : requiredText}\n </Text>\n )} */}\n\n {required && !disabled && !(!focus && success) && (\n <span className={styles(style.required, success ? style.success : style.error)}>\n {requiredText !== DEFAULT_REQUIRED_TEXT ? `(${requiredText})` : requiredText}\n </span>\n )}\n </Text>\n);\n\nLabel.displayName = 'Component:InputText.Label';\n\nLabel.propTypes = {\n disabled: PropTypes.bool,\n error: PropTypes.bool,\n focus: PropTypes.bool,\n label: PropTypes.string,\n required: PropTypes.bool,\n requiredText: PropTypes.bool,\n success: PropTypes.bool,\n value: PropTypes.string,\n};\n\nexport { Label };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -126,8 +126,8 @@
|
|
|
126
126
|
--mirai-ui-input-background: var(--mirai-ui-base);
|
|
127
127
|
--mirai-ui-input-color: var(--mirai-ui-content);
|
|
128
128
|
--mirai-ui-input-disabled: var(--mirai-ui-content-light);
|
|
129
|
-
--mirai-ui-input-focus-color: var(--mirai-ui-
|
|
130
|
-
--mirai-ui-input-focus-shadow:
|
|
129
|
+
--mirai-ui-input-focus-color: var(--mirai-ui-focus-color);
|
|
130
|
+
--mirai-ui-input-focus-shadow: var(--mirai-ui-focus-shadow);
|
|
131
131
|
--mirai-ui-input-focus-shadow-error: 0 0 0 var(--mirai-ui-focus-width) var(--mirai-ui-error-border);
|
|
132
132
|
--mirai-ui-input-focus-shadow-warning: 0 0 0 calc(var(--mirai-ui-focus-width) * 0.66) var(--mirai-ui-error-background);
|
|
133
133
|
--mirai-ui-input-focus-shadow-success: 0 0 0 var(--mirai-ui-focus-width) var(--mirai-ui-success-border);
|