ywana-core8 0.0.365 → 0.0.366
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/dist/index.cjs +3 -6
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +10 -0
- package/dist/index.css.map +1 -1
- package/dist/index.modern.js +3 -6
- package/dist/index.modern.js.map +1 -1
- package/dist/index.umd.js +3 -6
- package/dist/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/src/html/textfield.css +5 -0
- package/src/html/textfield.js +2 -4
- package/src/html/textfield.test.js +3 -2
package/package.json
CHANGED
package/src/html/textfield.css
CHANGED
@@ -25,6 +25,11 @@
|
|
25
25
|
background-color: var(--paper-color);
|
26
26
|
}
|
27
27
|
|
28
|
+
.textfield > input:read-only {
|
29
|
+
background-color: var(--paper-color);
|
30
|
+
border-bottom: 1px solid var(--divider-color) !important;
|
31
|
+
}
|
32
|
+
|
28
33
|
.textfield > input:focus {
|
29
34
|
outline: none;
|
30
35
|
border-color: var(--primary-color, blue);
|
package/src/html/textfield.js
CHANGED
@@ -29,7 +29,6 @@ export const TextField = (props) => {
|
|
29
29
|
}
|
30
30
|
|
31
31
|
function focus() {
|
32
|
-
console.log("FOCUS")
|
33
32
|
if (site && site.changeFocus) {
|
34
33
|
site.changeFocus({
|
35
34
|
lose: () => {
|
@@ -40,7 +39,6 @@ export const TextField = (props) => {
|
|
40
39
|
}
|
41
40
|
|
42
41
|
function focusOut() {
|
43
|
-
console.log("FOCUS OUT")
|
44
42
|
if (site && site.changeFocus) {
|
45
43
|
site.changeFocus({
|
46
44
|
lose: () => {
|
@@ -62,7 +60,7 @@ export const TextField = (props) => {
|
|
62
60
|
return (
|
63
61
|
<div className={`${style}`} onClick={onClick}>
|
64
62
|
<input id={id} type={type} placeholder={placeholder} value={value} required onChange={change} onKeyDown={onKeyPress} onFocus={focus} onBlur={focusOut} readOnly={readOnly} />
|
65
|
-
{
|
63
|
+
{canClear && value && value.length > 0 ? <Icon icon="close" clickable size="small" action={clear} /> : null }
|
66
64
|
<span className="bar"></span>
|
67
65
|
{label ? <label>{labelTxt}</label> : null}
|
68
66
|
</div>
|
@@ -181,7 +179,7 @@ export const DropDown = (props) => {
|
|
181
179
|
|
182
180
|
return (
|
183
181
|
<div className="dropdown">
|
184
|
-
<TextField {...props} onClick={toggle} value={label} onChange={change} />
|
182
|
+
<TextField {...props} onClick={toggle} value={label} onChange={change} readOnly={!predictive}/>
|
185
183
|
{!readOnly ? <Icon icon="expand_more" clickable size="small" action={toggle} /> : null }
|
186
184
|
{renderOptions()}
|
187
185
|
</div>
|
@@ -12,6 +12,7 @@ const TextFieldTest = (prop) => {
|
|
12
12
|
}
|
13
13
|
|
14
14
|
const options = [
|
15
|
+
{ label: "", value: "" },
|
15
16
|
{ label: "One", value: "1" },
|
16
17
|
{ label: "Two", value: "2" },
|
17
18
|
{ label: "Three", value: "3" },
|
@@ -22,8 +23,8 @@ const TextFieldTest = (prop) => {
|
|
22
23
|
return (
|
23
24
|
<>
|
24
25
|
<TextField id="name" label="Name" value={form.name} onChange={change} />
|
25
|
-
<DropDown id="gender1" label="Dropdown 1" value={form.gender1} onChange={change} options={options} predictive={
|
26
|
-
<DropDown id="gender2" label="Dropdown 2" value={form.
|
26
|
+
<DropDown id="gender1" label="Dropdown 1" value={form.gender1} onChange={change} options={options} predictive={false}/>
|
27
|
+
<DropDown id="gender2" label="Dropdown 2" value={form.gender2} onChange={change} options={options} predictive={true}/>
|
27
28
|
<TextArea id="text1" label="Text 1" value={form.text1} onChange={change} />
|
28
29
|
<TextField id="date1" type="DATE" label="Date" value={form.date1} onChange={change} />
|
29
30
|
</>
|