@mirai/ui 1.0.38 → 1.0.39
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.
|
@@ -94,7 +94,7 @@ var InputText = function InputText(_ref) {
|
|
|
94
94
|
className: (0, _helpers.styles)(_InputTextModule.default.inputContainer, others.className),
|
|
95
95
|
style: others.style
|
|
96
96
|
}, label && /*#__PURE__*/_react.default.createElement(_primitives.Text, {
|
|
97
|
-
className: (0, _helpers.styles)(_InputTextModule.default.text, _InputTextModule.default.label, disabled && _InputTextModule.default.disabled, focus && _InputTextModule.default.focus, error && _InputTextModule.default.error, (focus || error || has.value) && _InputTextModule.default.value)
|
|
97
|
+
className: (0, _helpers.styles)(_InputTextModule.default.text, _InputTextModule.default.label, disabled && _InputTextModule.default.disabled, focus && _InputTextModule.default.focus, error && _InputTextModule.default.error, icon && _InputTextModule.default.withIcon, (focus || error || has.value) && _InputTextModule.default.value)
|
|
98
98
|
}, label), /*#__PURE__*/_react.default.createElement(_primitives.View, {
|
|
99
99
|
row: true,
|
|
100
100
|
className: (0, _helpers.styles)(_InputTextModule.default.inputBorder, disabled && _InputTextModule.default.disabled, error && _InputTextModule.default.error, focus && !error && _InputTextModule.default.focus)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputText.js","names":["InputText","disabled","error","hint","icon","label","type","onChange","onEnter","onLeave","others","focus","setFocus","password","setPassword","handleChange","value","event","handleEnter","handleLeave","has","undefined","length","is","style","inputContainer","className","text","inputBorder","left","input","iconLeft","pressable","displayName","propTypes","PropTypes","bool","string","multiLine","name","isRequired","func"],"sources":["../../../src/components/InputText/InputText.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useState } from 'react';\n\nimport { styles } from '../../helpers';\nimport { Icon, Input, Pressable, Text, View } from '../../primitives';\nimport style from './InputText.module.css';\n\nconst InputText = ({\n disabled,\n error,\n hint,\n icon,\n label,\n type,\n onChange = () => {},\n onEnter = () => {},\n onLeave = () => {},\n ...others\n}) => {\n const [focus, setFocus] = useState(false);\n const [password, setPassword] = useState(true);\n\n const handleChange = (value, event) => {\n onChange(value, event);\n };\n\n const handleEnter = (event) => {\n setFocus(true);\n onEnter(event);\n };\n\n const handleLeave = () => {\n setFocus(false);\n onLeave(event);\n };\n\n const has = {\n value: others.value !== undefined && others.value?.length > 0,\n };\n const is = { password: type === 'password' };\n\n return (\n <View className={styles(style.inputContainer, others.className)} style={others.style}>\n {label && (\n <Text\n className={styles(\n style.text,\n style.label,\n disabled && style.disabled,\n focus && style.focus,\n error && style.error,\n (focus || error || has.value) && style.value,\n )}\n >\n {label}\n </Text>\n )}\n\n <View\n row\n className={styles(\n style.inputBorder,\n disabled && style.disabled,\n error && style.error,\n focus && !error && style.focus,\n )}\n >\n {icon && <Icon name={icon} className={[style.icon, style.left]} />}\n <Input\n {...others}\n disabled={disabled}\n type={!is.password || password ? type : 'text'}\n value={others.value || ''}\n className={styles(style.input, icon && style.iconLeft)}\n style={undefined}\n onChange={handleChange}\n onEnter={handleEnter}\n onLeave={handleLeave}\n />\n {is.password && !disabled && (\n <Pressable className={style.pressable} onPress={() => setPassword(!password)}>\n <Icon name={password ? 'EyeClose' : 'EyeOpen'} />\n </Pressable>\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\nInputText.displayName = 'Component:InputText';\n\nInputText.propTypes = {\n disabled: PropTypes.bool,\n error: PropTypes.bool,\n hint: PropTypes.string,\n icon: PropTypes.string,\n label: PropTypes.string,\n multiLine: PropTypes.bool,\n name: PropTypes.string.isRequired,\n type: PropTypes.string,\n onChange: PropTypes.func,\n onEnter: PropTypes.func,\n onLeave: PropTypes.func,\n};\n\nexport { InputText };\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,IAAMA,SAAS,GAAG,SAAZA,SAAY,OAWZ;EAAA;;EAAA,IAVJC,QAUI,QAVJA,QAUI;EAAA,IATJC,KASI,QATJA,KASI;EAAA,IARJC,IAQI,QARJA,IAQI;EAAA,IAPJC,IAOI,QAPJA,IAOI;EAAA,IANJC,KAMI,QANJA,KAMI;EAAA,IALJC,IAKI,QALJA,IAKI;EAAA,yBAJJC,QAII;EAAA,IAJJA,QAII,8BAJO,YAAM,CAAE,CAIf;EAAA,wBAHJC,OAGI;EAAA,IAHJA,OAGI,6BAHM,YAAM,CAAE,CAGd;EAAA,wBAFJC,OAEI;EAAA,IAFJA,OAEI,6BAFM,YAAM,CAAE,CAEd;EAAA,IADDC,MACC;;EACJ,gBAA0B,qBAAS,KAAT,CAA1B;EAAA;EAAA,IAAOC,KAAP;EAAA,IAAcC,QAAd;;EACA,iBAAgC,qBAAS,IAAT,CAAhC;EAAA;EAAA,IAAOC,QAAP;EAAA,IAAiBC,WAAjB;;EAEA,IAAMC,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD,EAAQC,KAAR,EAAkB;IACrCV,QAAQ,CAACS,KAAD,EAAQC,KAAR,CAAR;EACD,CAFD;;EAIA,IAAMC,WAAW,GAAG,SAAdA,WAAc,CAACD,KAAD,EAAW;IAC7BL,QAAQ,CAAC,IAAD,CAAR;IACAJ,OAAO,CAACS,KAAD,CAAP;EACD,CAHD;;EAKA,IAAME,WAAW,GAAG,SAAdA,WAAc,GAAM;IACxBP,QAAQ,CAAC,KAAD,CAAR;IACAH,OAAO,CAACQ,KAAD,CAAP;EACD,CAHD;;EAKA,IAAMG,GAAG,GAAG;IACVJ,KAAK,EAAEN,MAAM,CAACM,KAAP,KAAiBK,SAAjB,IAA8B,kBAAAX,MAAM,CAACM,KAAP,gEAAcM,MAAd,IAAuB;EADlD,CAAZ;EAGA,IAAMC,EAAE,GAAG;IAAEV,QAAQ,EAAEP,IAAI,KAAK;EAArB,CAAX;EAEA,oBACE,6BAAC,gBAAD;IAAM,SAAS,EAAE,qBAAOkB,yBAAMC,cAAb,EAA6Bf,MAAM,CAACgB,SAApC,CAAjB;IAAiE,KAAK,EAAEhB,MAAM,CAACc;EAA/E,GACGnB,KAAK,iBACJ,6BAAC,gBAAD;IACE,SAAS,EAAE,qBACTmB,yBAAMG,IADG,EAETH,yBAAMnB,KAFG,EAGTJ,QAAQ,IAAIuB,yBAAMvB,QAHT,EAITU,KAAK,IAAIa,yBAAMb,KAJN,EAKTT,KAAK,IAAIsB,yBAAMtB,KALN,
|
|
1
|
+
{"version":3,"file":"InputText.js","names":["InputText","disabled","error","hint","icon","label","type","onChange","onEnter","onLeave","others","focus","setFocus","password","setPassword","handleChange","value","event","handleEnter","handleLeave","has","undefined","length","is","style","inputContainer","className","text","withIcon","inputBorder","left","input","iconLeft","pressable","displayName","propTypes","PropTypes","bool","string","multiLine","name","isRequired","func"],"sources":["../../../src/components/InputText/InputText.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useState } from 'react';\n\nimport { styles } from '../../helpers';\nimport { Icon, Input, Pressable, Text, View } from '../../primitives';\nimport style from './InputText.module.css';\n\nconst InputText = ({\n disabled,\n error,\n hint,\n icon,\n label,\n type,\n onChange = () => {},\n onEnter = () => {},\n onLeave = () => {},\n ...others\n}) => {\n const [focus, setFocus] = useState(false);\n const [password, setPassword] = useState(true);\n\n const handleChange = (value, event) => {\n onChange(value, event);\n };\n\n const handleEnter = (event) => {\n setFocus(true);\n onEnter(event);\n };\n\n const handleLeave = () => {\n setFocus(false);\n onLeave(event);\n };\n\n const has = {\n value: others.value !== undefined && others.value?.length > 0,\n };\n const is = { password: type === 'password' };\n\n return (\n <View className={styles(style.inputContainer, others.className)} style={others.style}>\n {label && (\n <Text\n className={styles(\n style.text,\n style.label,\n disabled && style.disabled,\n focus && style.focus,\n error && style.error,\n icon && style.withIcon,\n (focus || error || has.value) && style.value,\n )}\n >\n {label}\n </Text>\n )}\n\n <View\n row\n className={styles(\n style.inputBorder,\n disabled && style.disabled,\n error && style.error,\n focus && !error && style.focus,\n )}\n >\n {icon && <Icon name={icon} className={[style.icon, style.left]} />}\n <Input\n {...others}\n disabled={disabled}\n type={!is.password || password ? type : 'text'}\n value={others.value || ''}\n className={styles(style.input, icon && style.iconLeft)}\n style={undefined}\n onChange={handleChange}\n onEnter={handleEnter}\n onLeave={handleLeave}\n />\n {is.password && !disabled && (\n <Pressable className={style.pressable} onPress={() => setPassword(!password)}>\n <Icon name={password ? 'EyeClose' : 'EyeOpen'} />\n </Pressable>\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\nInputText.displayName = 'Component:InputText';\n\nInputText.propTypes = {\n disabled: PropTypes.bool,\n error: PropTypes.bool,\n hint: PropTypes.string,\n icon: PropTypes.string,\n label: PropTypes.string,\n multiLine: PropTypes.bool,\n name: PropTypes.string.isRequired,\n type: PropTypes.string,\n onChange: PropTypes.func,\n onEnter: PropTypes.func,\n onLeave: PropTypes.func,\n};\n\nexport { InputText };\n"],"mappings":"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"}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
:root {
|
|
2
2
|
--mirai-ui-input-text-border: solid 1px var(--mirai-ui-content-border);
|
|
3
|
+
--mirai-ui-input-text-disabled: var(--mirai-ui-content-border);
|
|
4
|
+
--mirai-ui-input-text-error: var(--mirai-ui-error);
|
|
3
5
|
--mirai-ui-input-text-focus: var(--mirai-ui-accent);
|
|
6
|
+
--mirai-ui-input-text-icon: var(--mirai-ui-icon);
|
|
4
7
|
--mirai-ui-input-text-padding-x: var(--mirai-ui-space-S);
|
|
5
8
|
--mirai-ui-input-text-padding-y: var(--mirai-ui-space-S);
|
|
6
9
|
--mirai-ui-input-text-radius: var(--mirai-ui-border-radius);
|
|
7
|
-
--mirai-ui-input-text-disabled: var(--mirai-ui-content-border);
|
|
8
|
-
--mirai-ui-input-text-error: var(--mirai-ui-error);
|
|
9
10
|
}
|
|
10
11
|
|
|
11
12
|
.inputContainer {
|
|
@@ -31,9 +32,28 @@
|
|
|
31
32
|
border-color: var(--mirai-ui-input-text-focus);
|
|
32
33
|
}
|
|
33
34
|
|
|
35
|
+
.icon {
|
|
36
|
+
color: var(--mirai-ui-input-disabled);
|
|
37
|
+
line-height: var(--mirai-ui-input-text-icon);
|
|
38
|
+
height: var(--mirai-ui-input-text-icon);
|
|
39
|
+
width: var(--mirai-ui-input-text-icon);
|
|
40
|
+
font-size: var(--mirai-ui-input-text-icon);
|
|
41
|
+
pointer-events: none;
|
|
42
|
+
position: absolute;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.icon.left {
|
|
46
|
+
left: var(--mirai-ui-input-text-padding-x);
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.icon.right {
|
|
50
|
+
right: var(--mirai-ui-input-text-padding-x);
|
|
51
|
+
}
|
|
52
|
+
|
|
34
53
|
.input {
|
|
35
54
|
border-radius: var(--mirai-ui-input-text-radius);
|
|
36
55
|
padding: var(--mirai-ui-input-text-padding-y) var(--mirai-ui-input-text-padding-x);
|
|
56
|
+
min-height: var(--mirai-ui-input-min-height);
|
|
37
57
|
}
|
|
38
58
|
|
|
39
59
|
.input.iconLeft {
|
|
@@ -53,25 +73,11 @@
|
|
|
53
73
|
margin: calc(var(--mirai-ui-input-text-padding-x) / 4) var(--mirai-ui-input-text-padding-x);
|
|
54
74
|
}
|
|
55
75
|
|
|
56
|
-
.icon {
|
|
57
|
-
color: var(--mirai-ui-input-disabled);
|
|
58
|
-
pointer-events: none;
|
|
59
|
-
position: absolute;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
76
|
.pressable {
|
|
63
77
|
position: absolute;
|
|
64
78
|
right: var(--mirai-ui-input-text-padding-x);
|
|
65
79
|
}
|
|
66
80
|
|
|
67
|
-
.icon.left {
|
|
68
|
-
left: var(--mirai-ui-input-text-padding-x);
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
.icon.right {
|
|
72
|
-
right: var(--mirai-ui-input-text-padding-x);
|
|
73
|
-
}
|
|
74
|
-
|
|
75
81
|
.label {
|
|
76
82
|
background-color: var(--mirai-ui-input-background);
|
|
77
83
|
font-size: var(--mirai-ui-input-font-size);
|
|
@@ -79,14 +85,35 @@
|
|
|
79
85
|
padding: 0 calc(var(--mirai-ui-input-text-padding-x) / 2);
|
|
80
86
|
pointer-events: none;
|
|
81
87
|
position: absolute;
|
|
82
|
-
top: calc(
|
|
83
|
-
|
|
88
|
+
top: calc(
|
|
89
|
+
calc(
|
|
90
|
+
var(--mirai-ui-input-min-height) - var(--mirai-ui-input-font-size) -
|
|
91
|
+
calc(var(--mirai-ui-input-text-padding-x) / 2)
|
|
92
|
+
) / 2
|
|
93
|
+
);
|
|
94
|
+
transition: background-color var(--mirai-ui-motion-expand) var(--mirai-ui-motion-easing),
|
|
95
|
+
font-size var(--mirai-ui-motion-expand) var(--mirai-ui-motion-easing),
|
|
96
|
+
left var(--mirai-ui-motion-expand) var(--mirai-ui-motion-easing),
|
|
84
97
|
top var(--mirai-ui-motion-expand) var(--mirai-ui-motion-easing);
|
|
85
98
|
z-index: 1;
|
|
86
99
|
}
|
|
87
100
|
|
|
101
|
+
.label.withIcon:not(.value) {
|
|
102
|
+
background-color: transparent;
|
|
103
|
+
/* left: calc(var(--mirai-ui-input-text-icon) + var(--mirai-ui-input-text-padding-x)); */
|
|
104
|
+
left: calc(var(--mirai-ui-input-text-icon) + calc(var(--mirai-ui-input-text-padding-x) / 2));
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
.label:not(.value) {
|
|
108
|
+
width: 50%;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
.label.withIcon:not(.value) {
|
|
112
|
+
}
|
|
113
|
+
|
|
88
114
|
.label.value {
|
|
89
115
|
font-size: var(--mirai-ui-font-size-small);
|
|
116
|
+
left: 0;
|
|
90
117
|
top: calc(var(--mirai-ui-input-text-padding-y) * -1);
|
|
91
118
|
}
|
|
92
119
|
|
|
@@ -10,7 +10,6 @@
|
|
|
10
10
|
--mirai-ui-font-size-paragraph: 14px;
|
|
11
11
|
--mirai-ui-font-size-action: 14px;
|
|
12
12
|
--mirai-ui-font-size-small: 12px;
|
|
13
|
-
--mirai-ui-input-font-size: 14px;
|
|
14
13
|
--mirai-ui-line-height: 24px;
|
|
15
14
|
--mirai-ui-text-direction: ltr;
|
|
16
15
|
--mirai-ui-text-align: left;
|
|
@@ -68,6 +67,10 @@
|
|
|
68
67
|
--mirai-ui-motion-expand: 300ms;
|
|
69
68
|
--mirai-ui-motion-easing: cubic-bezier(0.1, 0.1, 0.25, 0.9);
|
|
70
69
|
|
|
70
|
+
/* input */
|
|
71
|
+
--mirai-ui-input-font-size: var(--mirai-ui-font-size-paragraph);
|
|
72
|
+
--mirai-ui-input-min-height: var(--mirai-ui-space-XL);
|
|
73
|
+
|
|
71
74
|
/* defaults */
|
|
72
75
|
--mirai-ui-border-radius: 4px;
|
|
73
76
|
--mirai-ui-shadow: 0 0 var(--mirai-ui-space-XS) var(--mirai-ui-content-border);
|