neo.mjs 4.4.0 → 4.4.1

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.
Files changed (6) hide show
  1. package/examples/list/base/MainContainer.mjs +11 -1
  2. package/package.json +1 -1
  3. package/resources/scss/src/form/field/Text.scss +2 -1
  4. package/resources/scss/theme-dark/form/field/Text.scss +5 -1
  5. package/resources/scss/theme-light/form/field/Text.scss +5 -1
  6. package/src/list/Base.mjs +20 -0
package/examples/list/base/MainContainer.mjs CHANGED
@@ -21,10 +21,20 @@ class MainContainer extends ConfigurationViewport {
21
21
  let me = this;
22
22
 
23
23
  return [{
24
+ module : NumberField,
25
+ clearable: true,
26
+ labelText: 'activeIndex',
27
+ listeners: {change: me.onConfigChange.bind(me, 'activeIndex')},
28
+ maxValue : 5,
29
+ minValue : 0,
30
+ stepSize : 1,
31
+ value : me.exampleComponent.activeIndex
32
+ }, {
24
33
  module : CheckBox,
25
34
  checked : me.exampleComponent.disableSelection,
26
35
  labelText: 'disableSelection',
27
- listeners: {change: me.onConfigChange.bind(me, 'disableSelection')}
36
+ listeners: {change: me.onConfigChange.bind(me, 'disableSelection')},
37
+ style : {marginTop: '10px'}
28
38
  }, {
29
39
  module : CheckBox,
30
40
  checked : me.exampleComponent.draggable,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "neo.mjs",
3
- "version": "4.4.0",
3
+ "version": "4.4.1",
4
4
  "description": "The webworkers driven UI framework",
5
5
  "type": "module",
6
6
  "repository": {
package/resources/scss/src/form/field/Text.scss CHANGED
@@ -9,6 +9,7 @@
9
9
  &.neo-focus {
10
10
  .neo-input-wrapper {
11
11
  border-color: v(textfield-border-color-active) !important;
12
+ outline : v(textfield-outline-active);
12
13
  }
13
14
  }
14
15
 
@@ -176,7 +177,7 @@
176
177
  .neo-input-wrapper {
177
178
  align-items : stretch;
178
179
  background-color: v(textfield-input-background-color);
179
- border : 1px solid v(textfield-border-color);
180
+ border : v(textfield-border-width) solid v(textfield-border-color);
180
181
  border-radius : v(textfield-border-radius);
181
182
  display : flex;
182
183
  flex : 1 1 100px;
package/resources/scss/theme-dark/form/field/Text.scss CHANGED
@@ -3,12 +3,14 @@ $neoMap: map-merge($neoMap, (
3
3
  'textfield-border-color-active' : #5d83a7,
4
4
  'textfield-border-color-invalid' : brown,
5
5
  'textfield-border-radius' : 0,
6
+ 'textfield-border-width' : 1px,
6
7
  'textfield-input-background-color' : #2b2b2b,
7
8
  'textfield-input-color' : #ccc,
8
9
  'textfield-input-placeholder-color' : #ccc,
9
10
  'textfield-input-placeholder-opacity': 0.6,
10
11
  'textfield-label-color' : #bbb,
11
- 'textfield-label-top-margin' : 0 0 3px
12
+ 'textfield-label-top-margin' : 0 0 3px,
13
+ 'textfield-outline-active' : none
12
14
  ));
13
15
 
14
16
  @if $useCssVars == true {
@@ -17,11 +19,13 @@ $neoMap: map-merge($neoMap, (
17
19
  --textfield-border-color-active : #{neo(textfield-border-color-active)};
18
20
  --textfield-border-color-invalid : #{neo(textfield-border-color-invalid)};
19
21
  --textfield-border-radius : #{neo(textfield-border-radius)};
22
+ --textfield-border-width : #{neo(textfield-border-width)};
20
23
  --textfield-input-background-color : #{neo(textfield-input-background-color)};
21
24
  --textfield-input-color : #{neo(textfield-input-color)};
22
25
  --textfield-input-placeholder-color : #{neo(textfield-input-placeholder-color)};
23
26
  --textfield-input-placeholder-opacity: #{neo(textfield-input-placeholder-opacity)};
24
27
  --textfield-label-color : #{neo(textfield-label-color)};
25
28
  --textfield-label-top-margin : #{neo(textfield-label-top-margin)};
29
+ --textfield-outline-active : #{neo(textfield-outline-active)};
26
30
  }
27
31
  }
package/resources/scss/theme-light/form/field/Text.scss CHANGED
@@ -3,12 +3,14 @@ $neoMap: map-merge($neoMap, (
3
3
  'textfield-border-color-active' : #1c60a0,
4
4
  'textfield-border-color-invalid' : brown,
5
5
  'textfield-border-radius' : 3px,
6
+ 'textfield-border-width' : 1px,
6
7
  'textfield-input-background-color' : #fff,
7
8
  'textfield-input-color' : #000,
8
9
  'textfield-input-placeholder-color' : #333,
9
10
  'textfield-input-placeholder-opacity': 0.6,
10
11
  'textfield-label-color' : #666,
11
- 'textfield-label-top-margin' : 0 0 3px
12
+ 'textfield-label-top-margin' : 0 0 3px,
13
+ 'textfield-outline-active' : none
12
14
  ));
13
15
 
14
16
  @if $useCssVars == true {
@@ -17,11 +19,13 @@ $neoMap: map-merge($neoMap, (
17
19
  --textfield-border-color-active : #{neo(textfield-border-color-active)};
18
20
  --textfield-border-color-invalid : #{neo(textfield-border-color-invalid)};
19
21
  --textfield-border-radius : #{neo(textfield-border-radius)};
22
+ --textfield-border-width : #{neo(textfield-border-width)};
20
23
  --textfield-input-background-color : #{neo(textfield-input-background-color)};
21
24
  --textfield-input-color : #{neo(textfield-input-color)};
22
25
  --textfield-input-placeholder-color : #{neo(textfield-input-placeholder-color)};
23
26
  --textfield-input-placeholder-opacity: #{neo(textfield-input-placeholder-opacity)};
24
27
  --textfield-label-color : #{neo(textfield-label-color)};
25
28
  --textfield-label-top-margin : #{neo(textfield-label-top-margin)};
29
+ --textfield-outline-active : #{neo(textfield-outline-active)};
26
30
  }
27
31
  }
package/src/list/Base.mjs CHANGED
@@ -20,6 +20,10 @@ class Base extends Component {
20
20
  * @protected
21
21
  */
22
22
  ntype: 'list',
23
+ /**
24
+ * @member {Number|null} activeIndex_=null
25
+ */
26
+ activeIndex_: null,
23
27
  /**
24
28
  * @member {Boolean} animate_=false
25
29
  */
@@ -136,6 +140,22 @@ class Base extends Component {
136
140
  });
137
141
  }
138
142
 
143
+ /**
144
+ * Triggered after the activeIndex config got changed
145
+ * @param {Number|null} value
146
+ * @param {Number|null} oldValue
147
+ * @protected
148
+ */
149
+ afterSetActiveIndex(value, oldValue) {
150
+ let selectionModel = this.selectionModel;
151
+
152
+ if (Neo.isNumber(value)) {
153
+ selectionModel?.selectAt(value);
154
+ } else if (Neo.isNumber(oldValue)) {
155
+ selectionModel.deselectAll();
156
+ }
157
+ }
158
+
139
159
  /**
140
160
  * Triggered after the animate config got changed
141
161
  * @param {Boolean} value