@mirai/ui 1.0.85 → 1.0.86
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/build/components/Form/__tests__/__snapshots__/Form.test.jsx.snap +6 -6
- package/build/components/InputDate/InputDate.js +8 -10
- package/build/components/InputDate/InputDate.js.map +1 -1
- package/build/components/InputDate/InputDate.module.css +6 -14
- package/build/components/InputDate/InputDate.stories.js +2 -2
- package/build/components/InputDate/InputDate.stories.js.map +1 -1
- package/build/components/InputDate/__tests__/__snapshots__/InputDate.test.js.snap +322 -139
- package/build/components/InputSelect/InputSelect.js +8 -5
- package/build/components/InputSelect/InputSelect.js.map +1 -1
- package/build/components/InputSelect/__tests__/__snapshots__/InputSelect.test.js.snap +6 -6
- package/build/components/InputText/InputText.js +6 -5
- package/build/components/InputText/InputText.js.map +1 -1
- package/build/components/InputText/InputText.module.css +17 -26
- package/build/components/InputText/__tests__/__snapshots__/InputText.test.js.snap +6 -6
- package/build/theme/default.theme.css +2 -2
- package/package.json +1 -1
|
@@ -14,16 +14,16 @@ exports[`component:<Form> prop:children 1`] = `
|
|
|
14
14
|
<div
|
|
15
15
|
class="view inputContainer"
|
|
16
16
|
>
|
|
17
|
-
<span
|
|
18
|
-
class="text paragraph text label"
|
|
19
|
-
>
|
|
20
|
-
label
|
|
21
|
-
</span>
|
|
22
17
|
<div
|
|
23
18
|
class="view row inputBorder"
|
|
24
19
|
>
|
|
20
|
+
<span
|
|
21
|
+
class="text paragraph text label"
|
|
22
|
+
>
|
|
23
|
+
label
|
|
24
|
+
</span>
|
|
25
25
|
<input
|
|
26
|
-
class="input input"
|
|
26
|
+
class="input input withLabel"
|
|
27
27
|
name="name"
|
|
28
28
|
type="text"
|
|
29
29
|
value=""
|
|
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.InputDate = void 0;
|
|
8
|
+
var _locale = require("@mirai/locale");
|
|
8
9
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
11
|
var _helpers = require("../../helpers");
|
|
@@ -12,7 +13,7 @@ var _primitives = require("../../primitives");
|
|
|
12
13
|
var _InputText = require("../InputText");
|
|
13
14
|
var _InputTextModule = _interopRequireDefault(require("../InputText/InputText.module.css"));
|
|
14
15
|
var _InputDateModule = _interopRequireDefault(require("./InputDate.module.css"));
|
|
15
|
-
var _excluded = ["disabled", "error", "format", "hint", "label", "labels", "max", "min", "name", "
|
|
16
|
+
var _excluded = ["disabled", "error", "format", "hint", "label", "labels", "max", "min", "name", "required", "success", "value", "warning", "onChange", "onError", "onEnter", "onLeave"],
|
|
16
17
|
_excluded2 = ["className", "data-testid"];
|
|
17
18
|
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
19
|
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; }
|
|
@@ -30,7 +31,7 @@ var InputDate = function InputDate(_ref) {
|
|
|
30
31
|
var disabled = _ref.disabled,
|
|
31
32
|
error = _ref.error,
|
|
32
33
|
_ref$format = _ref.format,
|
|
33
|
-
format = _ref$format === void 0 ?
|
|
34
|
+
format = _ref$format === void 0 ? _locale.DEFAULT_DATE_FORMAT : _ref$format,
|
|
34
35
|
hint = _ref.hint,
|
|
35
36
|
label = _ref.label,
|
|
36
37
|
_ref$labels = _ref.labels,
|
|
@@ -38,8 +39,6 @@ var InputDate = function InputDate(_ref) {
|
|
|
38
39
|
max = _ref.max,
|
|
39
40
|
min = _ref.min,
|
|
40
41
|
name = _ref.name,
|
|
41
|
-
_ref$placeholder = _ref.placeholder,
|
|
42
|
-
placeholder = _ref$placeholder === void 0 ? true : _ref$placeholder,
|
|
43
42
|
required = _ref.required,
|
|
44
43
|
success = _ref.success,
|
|
45
44
|
_ref$value = _ref.value,
|
|
@@ -91,7 +90,7 @@ var InputDate = function InputDate(_ref) {
|
|
|
91
90
|
return /*#__PURE__*/_react.default.createElement(_primitives.View, {
|
|
92
91
|
className: (0, _helpers.styles)(_InputTextModule.default.inputContainer, className),
|
|
93
92
|
"data-testid": testId
|
|
94
|
-
}, /*#__PURE__*/_react.default.createElement(_primitives.Text, {
|
|
93
|
+
}, label && /*#__PURE__*/_react.default.createElement(_primitives.Text, {
|
|
95
94
|
small: true,
|
|
96
95
|
className: (0, _helpers.styles)(_InputDateModule.default.label, _InputTextModule.default.text, _InputTextModule.default.hint, disabled && _InputTextModule.default.disabled, focus && _InputTextModule.default.focus, error && _InputTextModule.default.error)
|
|
97
96
|
}, label), /*#__PURE__*/_react.default.createElement(_primitives.View, {
|
|
@@ -100,12 +99,11 @@ var InputDate = function InputDate(_ref) {
|
|
|
100
99
|
return /*#__PURE__*/_react.default.createElement(_InputText.InputText, _extends({}, rest, {
|
|
101
100
|
disabled: disabled,
|
|
102
101
|
error: error,
|
|
103
|
-
hint: !placeholder ? labels[index] || part : undefined,
|
|
104
102
|
key: index,
|
|
103
|
+
label: labels[index] || part,
|
|
105
104
|
maxLength: part.length,
|
|
106
105
|
name: "".concat(name, ":").concat(part),
|
|
107
|
-
|
|
108
|
-
showState: false,
|
|
106
|
+
fork: true,
|
|
109
107
|
value: values[index],
|
|
110
108
|
onChange: function onChange(value) {
|
|
111
109
|
for (var _len = arguments.length, rest = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
@@ -115,7 +113,7 @@ var InputDate = function InputDate(_ref) {
|
|
|
115
113
|
},
|
|
116
114
|
onEnter: handleEnter,
|
|
117
115
|
onLeave: handleLeave,
|
|
118
|
-
className: (0, _helpers.styles)(_InputDateModule.default.input, _InputDateModule.default[part.substring(0, 1)]
|
|
116
|
+
className: (0, _helpers.styles)(_InputDateModule.default.input, _InputDateModule.default[part.substring(0, 1)]),
|
|
119
117
|
"data-testid": testId ? "".concat(testId, "-").concat(part) : undefined
|
|
120
118
|
}));
|
|
121
119
|
}), (error || success || warning) && /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
|
|
@@ -124,7 +122,7 @@ var InputDate = function InputDate(_ref) {
|
|
|
124
122
|
success: success,
|
|
125
123
|
warning: warning
|
|
126
124
|
}),
|
|
127
|
-
className: (0, _helpers.styles)(_InputTextModule.default.icon, error ? _InputTextModule.default.error : warning ? _InputTextModule.default.warning : success ? _InputTextModule.default.success : undefined
|
|
125
|
+
className: (0, _helpers.styles)(_InputTextModule.default.icon, error ? _InputTextModule.default.error : warning ? _InputTextModule.default.warning : success ? _InputTextModule.default.success : undefined)
|
|
128
126
|
})), hint && /*#__PURE__*/_react.default.createElement(_primitives.Text, {
|
|
129
127
|
small: true,
|
|
130
128
|
className: (0, _helpers.styles)(_InputTextModule.default.text, _InputTextModule.default.hint, disabled && _InputTextModule.default.disabled, error && _InputTextModule.default.error)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputDate.js","names":["InputDate","disabled","error","format","hint","label","labels","max","min","name","
|
|
1
|
+
{"version":3,"file":"InputDate.js","names":["InputDate","disabled","error","format","DEFAULT_DATE_FORMAT","hint","label","labels","max","min","name","required","success","value","warning","onChange","onError","onEnter","onLeave","others","useState","focus","setFocus","parts","splitDate","values","handleChange","partValue","partKey","event","nextValue","map","part","index","join","errors","getInputDateErrors","Object","keys","length","handleEnter","handleLeave","className","testId","rest","styles","style","inputContainer","styleDate","text","input","substring","undefined","getIconState","icon","displayName","propTypes","PropTypes","bool","string","arrayOf","isRequired","placeholder","func"],"sources":["../../../src/components/InputDate/InputDate.jsx"],"sourcesContent":["import { DEFAULT_DATE_FORMAT } from '@mirai/locale';\nimport PropTypes from 'prop-types';\nimport React, { useState } from 'react';\n\nimport { getIconState, getInputDateErrors, splitDate, styles } from '../../helpers';\nimport { Icon, Text, View } from '../../primitives';\nimport { InputText } from '../InputText';\nimport style from '../InputText/InputText.module.css';\nimport styleDate from './InputDate.module.css';\n\nconst InputDate = ({\n disabled,\n error,\n format = DEFAULT_DATE_FORMAT,\n hint,\n label,\n labels = [],\n max,\n min,\n name,\n required,\n success,\n value = '',\n warning,\n onChange = () => {},\n onError = () => {},\n onEnter = () => {},\n onLeave = () => {},\n ...others\n}) => {\n const [focus, setFocus] = useState(false);\n\n const parts = splitDate(format);\n const values = splitDate(value);\n\n const handleChange = (partValue = '', partKey, event) => {\n const nextValue = parts.map((part, index) => (part !== partKey ? values[index] || '' : partValue)).join('/');\n onChange(nextValue, event);\n\n const errors = getInputDateErrors({ format, max, min, value, required });\n if (Object.keys(errors || {}).length > 0) onError(errors);\n };\n\n const handleEnter = (event) => {\n setFocus(true);\n onEnter(event);\n };\n\n const handleLeave = (event) => {\n setFocus(false);\n onLeave(event);\n };\n\n const { className, ['data-testid']: testId, ...rest } = others;\n\n return (\n <View className={styles(style.inputContainer, className)} data-testid={testId}>\n {label && (\n <Text\n small\n className={styles(\n styleDate.label,\n style.text,\n style.hint,\n disabled && style.disabled,\n focus && style.focus,\n error && style.error,\n )}\n >\n {label}\n </Text>\n )}\n\n <View row>\n {parts.map((part, index) => (\n <InputText\n {...rest}\n disabled={disabled}\n error={error}\n key={index}\n label={labels[index] || part}\n maxLength={part.length}\n name={`${name}:${part}`}\n fork\n value={values[index]}\n onChange={(value, ...rest) => handleChange(value, part, ...rest)}\n onEnter={handleEnter}\n onLeave={handleLeave}\n className={styles(styleDate.input, styleDate[part.substring(0, 1)])}\n data-testid={testId ? `${testId}-${part}` : undefined}\n />\n ))}\n\n {(error || success || warning) && (\n <Icon\n value={getIconState({ error, success, warning })}\n className={styles(\n style.icon,\n error ? style.error : warning ? style.warning : success ? style.success : undefined,\n )}\n />\n )}\n </View>\n\n {hint && (\n <Text small className={styles(style.text, style.hint, disabled && style.disabled, error && style.error)}>\n {hint}\n </Text>\n )}\n </View>\n );\n};\n\nInputDate.displayName = 'Component:InputDate';\n\nInputDate.propTypes = {\n disabled: PropTypes.bool,\n error: PropTypes.bool,\n format: PropTypes.string,\n hint: PropTypes.string,\n label: PropTypes.string,\n labels: PropTypes.arrayOf(PropTypes.string),\n max: PropTypes.string,\n min: PropTypes.string,\n name: PropTypes.string.isRequired,\n placeholder: PropTypes.bool,\n required: PropTypes.bool,\n success: PropTypes.bool,\n value: PropTypes.string,\n warning: PropTypes.bool,\n onChange: PropTypes.func,\n onError: PropTypes.func,\n onEnter: PropTypes.func,\n onLeave: PropTypes.func,\n};\n\nexport { InputDate };\n"],"mappings":"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"}
|
|
@@ -1,26 +1,18 @@
|
|
|
1
1
|
.input {
|
|
2
|
-
max-width: calc(calc(var(--mirai-ui-input-font-size) * 2.
|
|
2
|
+
max-width: calc(calc(var(--mirai-ui-input-font-size) * 2.2) + calc(var(--mirai-ui-input-text-padding-x) * 2));
|
|
3
3
|
margin-bottom: 0;
|
|
4
4
|
margin-top: 0;
|
|
5
5
|
}
|
|
6
6
|
|
|
7
7
|
.input:not(:last-child) {
|
|
8
|
-
margin-right: var(--mirai-ui-input-text-padding-x);
|
|
8
|
+
margin-right: calc(var(--mirai-ui-input-text-padding-x) / 2);
|
|
9
9
|
}
|
|
10
10
|
|
|
11
|
-
.input.Y
|
|
12
|
-
|
|
13
|
-
max-width: calc(calc(var(--mirai-ui-input-font-size) * 3.25) + calc(var(--mirai-ui-input-text-padding-x) * 2));
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
.input.state.Y {
|
|
17
|
-
max-width: calc(calc(var(--mirai-ui-input-font-size) * 4.25) + calc(var(--mirai-ui-input-text-padding-x) * 2));
|
|
11
|
+
.input.Y {
|
|
12
|
+
max-width: calc(calc(var(--mirai-ui-input-font-size) * 3) + calc(var(--mirai-ui-input-text-padding-x) * 2));
|
|
18
13
|
}
|
|
19
14
|
|
|
20
15
|
.label {
|
|
21
|
-
margin-top: calc(var(--mirai-ui-font-size-small) * -0.
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
.withHint {
|
|
25
|
-
margin-bottom: calc(var(--mirai-ui-input-text-padding-y) * 2);
|
|
16
|
+
margin-top: calc(var(--mirai-ui-font-size-small) * -0.25);
|
|
17
|
+
width: fit-content;
|
|
26
18
|
}
|
|
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.default = exports.Story = void 0;
|
|
8
|
+
var _locale = require("@mirai/locale");
|
|
8
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
10
|
var _InputDate = require("./InputDate");
|
|
10
11
|
var _Story$args;
|
|
@@ -71,14 +72,13 @@ Story.storyName = 'InputDate';
|
|
|
71
72
|
Story.args = (_Story$args = {
|
|
72
73
|
disabled: false,
|
|
73
74
|
error: false,
|
|
74
|
-
format:
|
|
75
|
+
format: _locale.DEFAULT_DATE_FORMAT,
|
|
75
76
|
hint: 'hint',
|
|
76
77
|
label: 'label',
|
|
77
78
|
labels: ['Day', 'Month', 'Year'],
|
|
78
79
|
max: '10/04/2080',
|
|
79
80
|
min: '10/04/1980',
|
|
80
81
|
name: 'name',
|
|
81
|
-
placeholder: true,
|
|
82
82
|
required: false,
|
|
83
83
|
success: false,
|
|
84
84
|
warning: false
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputDate.stories.js","names":["title","Story","props","useState","value","setValue","handleChange","next","others","console","log","handleEnter","handleError","handleLeave","storyName","args","disabled","error","format","hint","label","labels","max","min","name","
|
|
1
|
+
{"version":3,"file":"InputDate.stories.js","names":["title","Story","props","useState","value","setValue","handleChange","next","others","console","log","handleEnter","handleError","handleLeave","storyName","args","disabled","error","format","DEFAULT_DATE_FORMAT","hint","label","labels","max","min","name","required","success","warning","argTypes"],"sources":["../../../src/components/InputDate/InputDate.stories.jsx"],"sourcesContent":["import { DEFAULT_DATE_FORMAT } from '@mirai/locale';\nimport React, { useState } from 'react';\n\nimport { InputDate } from './InputDate';\n\nexport default { title: 'Components' };\n\nexport const Story = (props) => {\n const [value, setValue] = useState('06/05/2020');\n\n const handleChange = (next, ...others) => {\n setValue(next);\n console.log('<InputDate>::onChange', next, ...others);\n };\n\n const handleEnter = (...others) => console.log('<InputDate>::onEnter', ...others);\n\n const handleError = (...others) => console.log('<InputDate>::onError', ...others);\n\n const handleLeave = (...others) => console.log('<InputDate>::onLeave', ...others);\n\n return (\n <InputDate\n {...props}\n value={value}\n onChange={handleChange}\n onEnter={handleEnter}\n onError={handleError}\n onLeave={handleLeave}\n />\n );\n};\n\nStory.storyName = 'InputDate';\n\nStory.args = {\n disabled: false,\n error: false,\n format: DEFAULT_DATE_FORMAT,\n hint: 'hint',\n label: 'label',\n labels: ['Day', 'Month', 'Year'],\n max: '10/04/2080',\n min: '10/04/1980',\n name: 'name',\n required: false,\n success: false,\n warning: false,\n // inherited properties\n ['data-testid']: 'test-story',\n style: {},\n};\n\nStory.argTypes = {};\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AAAwC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAEzB;EAAEA,KAAK,EAAE;AAAa,CAAC;AAAA;AAE/B,IAAMC,KAAK,GAAG,SAARA,KAAK,CAAIC,KAAK,EAAK;EAC9B,gBAA0B,IAAAC,eAAQ,EAAC,YAAY,CAAC;IAAA;IAAzCC,KAAK;IAAEC,QAAQ;EAEtB,IAAMC,YAAY,GAAG,SAAfA,YAAY,CAAIC,IAAI,EAAgB;IAAA;IACxCF,QAAQ,CAACE,IAAI,CAAC;IAAC,kCADcC,MAAM;MAANA,MAAM;IAAA;IAEnC,YAAAC,OAAO,EAACC,GAAG,kBAAC,uBAAuB,EAAEH,IAAI,SAAKC,MAAM,EAAC;EACvD,CAAC;EAED,IAAMG,WAAW,GAAG,SAAdA,WAAW;IAAA;IAAA,mCAAOH,MAAM;MAANA,MAAM;IAAA;IAAA,OAAK,aAAAC,OAAO,EAACC,GAAG,mBAAC,sBAAsB,SAAKF,MAAM,EAAC;EAAA;EAEjF,IAAMI,WAAW,GAAG,SAAdA,WAAW;IAAA;IAAA,mCAAOJ,MAAM;MAANA,MAAM;IAAA;IAAA,OAAK,aAAAC,OAAO,EAACC,GAAG,mBAAC,sBAAsB,SAAKF,MAAM,EAAC;EAAA;EAEjF,IAAMK,WAAW,GAAG,SAAdA,WAAW;IAAA;IAAA,mCAAOL,MAAM;MAANA,MAAM;IAAA;IAAA,OAAK,aAAAC,OAAO,EAACC,GAAG,mBAAC,sBAAsB,SAAKF,MAAM,EAAC;EAAA;EAEjF,oBACE,6BAAC,oBAAS,eACJN,KAAK;IACT,KAAK,EAAEE,KAAM;IACb,QAAQ,EAAEE,YAAa;IACvB,OAAO,EAAEK,WAAY;IACrB,OAAO,EAAEC,WAAY;IACrB,OAAO,EAAEC;EAAY,GACrB;AAEN,CAAC;AAAC;AAEFZ,KAAK,CAACa,SAAS,GAAG,WAAW;AAE7Bb,KAAK,CAACc,IAAI;EACRC,QAAQ,EAAE,KAAK;EACfC,KAAK,EAAE,KAAK;EACZC,MAAM,EAAEC,2BAAmB;EAC3BC,IAAI,EAAE,MAAM;EACZC,KAAK,EAAE,OAAO;EACdC,MAAM,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,CAAC;EAChCC,GAAG,EAAE,YAAY;EACjBC,GAAG,EAAE,YAAY;EACjBC,IAAI,EAAE,MAAM;EACZC,QAAQ,EAAE,KAAK;EACfC,OAAO,EAAE,KAAK;EACdC,OAAO,EAAE;AAAK,gCAEb,aAAa,EAAG,YAAY,yCACtB,CAAC,CAAC,eACV;AAED3B,KAAK,CAAC4B,QAAQ,GAAG,CAAC,CAAC"}
|