lightview 1.6.6-b → 1.7.1-b

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "lightview",
3
- "version": "1.6.6b",
3
+ "version": "1.7.1b",
4
4
  "description": "Small, simple, powerful web UI and micro front end creation ... Great ideas from Svelte, React, Vue and Riot combined.",
5
5
  "main": "lightview.js",
6
6
  "scripts": {
package/test/basic.html CHANGED
@@ -3,12 +3,16 @@
3
3
  <head>
4
4
  <meta charset="UTF-8">
5
5
  <title>Basic</title>
6
- <template id="x-test" name="joe" open="true" count=1 children='["mary"]' l-on:click="bump">
6
+ <template id="x-test" name="joe" open="true" count=1 children='["mary"]' l-on:click="${bump}">
7
+
8
+ <span id="children">${children}</span>
9
+
10
+ <input id="idatetime" type="datetime" value="${idatetime}">
7
11
 
8
12
  <span id="name">${name}</span>
9
13
  <span id="open">${open}</span>
10
14
  <span id="count">${count}</span>
11
- <span id="children">${children}</span>
15
+
12
16
  <span id="color">${color}</span>
13
17
  <span id="checked">${checked}</span>
14
18
  <span id="age">${age}</span>
@@ -28,12 +32,12 @@
28
32
  <input id="inumber" type="number" value="${inumber}">
29
33
  <input id="irange" type="range" value="${irange}">
30
34
 
31
- <input id="idatetime" type="datetime" value="${idatetime}">
35
+
32
36
 
33
37
  <input id="icheckbox" type="checkbox" value="${icheckbox}">
34
38
 
35
39
  <script type="lightview/module">
36
- //debugger;
40
+ // debugger;
37
41
  self.variables({name:"string",open:"boolean",count:"number",children:Array},{imported,reactive});
38
42
  self.variables({color:"string",checked:"boolean",age:"number",hamburger:Array},{exported,reactive});
39
43
  self.variables({counter:"number"},{reactive});
package/types.js CHANGED
@@ -161,6 +161,77 @@ const boolean = ({coerce=false,required=false, whenInvalid = ifInvalid,...rest}=
161
161
  }
162
162
  }
163
163
 
164
+ const isDuration = (value) => {
165
+ return parseDuration(value)!==undefined;
166
+ }
167
+ const durationMilliseconds = {
168
+ ms: 1,
169
+ s: 1000,
170
+ m: 1000 * 60,
171
+ h: 1000 * 60 * 60,
172
+ d: 1000 * 60 * 60 * 24,
173
+ w: 1000 * 60 * 60 * 24 * 7,
174
+ mo: (1000 * 60 * 60 * 24 * 365.25)/12,
175
+ q: (1000 * 60 * 60 * 24 * 365.25)/4,
176
+ y: (1000 * 60 * 60 * 24 * 365.25)
177
+ }
178
+ const parseDuration = (value) => {
179
+ if(typeof(value)==="number") return value;
180
+ if(typeof(value)==="string") {
181
+ const num = parseFloat(value),
182
+ suffix = value.substring((num+"").length);
183
+ if(typeof(num)==="number" && !isNaN(num) && suffix in durationMilliseconds) {
184
+ return durationMilliseconds[suffix] * num;
185
+ }
186
+ }
187
+ return null;
188
+ }
189
+
190
+ const validateDuration = function(value,variable) {
191
+ const result = parseDuration(value);
192
+ if(result==null && variable.value===undefined) {
193
+ return parseDuration(this.default);
194
+ }
195
+ if(this.required && result==null) {
196
+ variable.validityState = ValidityState({valueMissing: true});
197
+ } else {
198
+ if(typeof(result)!=="number") {
199
+ variable.validityState = ValidityState({typeMismatch:true,value});
200
+ } else if(isNaN(result)) {
201
+ variable.validityState = ValidityState({badInput:true,value});
202
+ } else if(this.min!=null && result<parseDuration(this.min)) {
203
+ variable.validityState = ValidityState({rangeUnderflow:true,value});
204
+ } else if(this.max!=null && result>parseDuration(this.max)) {
205
+ variable.validityState = ValidityState({rangeOverflow:true,value});
206
+ } else if(this.step!==null && (result % parseDuration(this.step)!==0)) {
207
+ variable.validityState = ValidityState({rangeUnderflow:true,value});
208
+ } else {
209
+ variable.validityState = ValidityState({valid:true});
210
+ return result;
211
+ }
212
+ }
213
+ return this.whenInvalid(variable,value);
214
+ }
215
+ const duration = ({required = false,whenInvalid = ifInvalid,min=-Infinity,max=Infinity,step = 1,...rest}={}) => {
216
+ if(typeof(required)!=="boolean") throw new TypeError(`required, ${JSON.stringify(required)}, must be a boolean`);
217
+ if(typeof(whenInvalid)!=="function") throw new TypeError(`whenInvalid, ${whenInvalid}, must be a function`);
218
+ if(min!=null && !parseDuration(min)) throw new TypeError(`min, ${JSON.stringify(min)}, must be a duration`);
219
+ if(max!=null && !parseDuration(max)) throw new TypeError(`max, ${JSON.stringify(max)}, must be a duration`);
220
+ if(step!=null && !parseDuration(step)) throw new TypeError(`step, ${JSON.stringify(step)}, must be a duration`);
221
+ if(rest.default!==undefined && !parseDuration(rest.default)) throw new TypeError(`default, ${JSON.stringify(rest.default)}, must be a duration`);
222
+ return {
223
+ type: "duration",
224
+ coerce: false,
225
+ required,
226
+ whenInvalid,
227
+ min,
228
+ max,
229
+ step,
230
+ ...rest,
231
+ validate: validateDuration
232
+ }
233
+ }
234
+ duration.parse = parseDuration;
164
235
 
165
236
  const validateNumber = function(value,variable) {
166
237
  if(value===undefined && variable.value===undefined) {
@@ -195,7 +266,7 @@ const number = ({coerce=false,required = false,whenInvalid = ifInvalid,min=-Infi
195
266
  if(max!=null && typeof(max)!=="number") throw new TypeError(`max, ${JSON.stringify(max)}, must be a number`);
196
267
  if(step!=null && typeof(step)!=="number") throw new TypeError(`step, ${JSON.stringify(step)}, must be a number`);
197
268
  if(typeof(allowNaN)!=="boolean") throw new TypeError(`step, ${JSON.stringify(allowNaN)}, must be a boolean`);
198
- if(rest.default!==undefined && typeof(rest.default)!=="number") throw new TypeError(`default, ${rest.default}, must be a number`);
269
+ if(rest.default!==undefined && typeof(rest.default)!=="number") throw new TypeError(`default, ${JSON.stringify(rest.default)}, must be a number`);
199
270
  return {
200
271
  type: "number",
201
272
  coerce,
@@ -451,4 +522,4 @@ const remote = (config) => {
451
522
 
452
523
  const remoteGenerator = handleRemote;
453
524
 
454
- export {ValidityState,any,array,boolean,number,object,remote,remoteGenerator,string,symbol,reviver}
525
+ export {ValidityState,any,array,boolean,duration,number,object,remote,remoteGenerator,string,symbol,reviver}