cradova 2.3.0 → 3.0.0

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 (4) hide show
  1. package/README.md +30 -48
  2. package/dist/index.d.ts +444 -373
  3. package/dist/index.js +477 -636
  4. package/package.json +1 -1
package/dist/index.d.ts CHANGED
@@ -1,286 +1,162 @@
1
1
  declare module "cradova" {
2
- type ElementType<T> = (
3
- ...VJS: (
4
- | string
5
- | undefined
6
- | Partial<T>
7
- | HTMLElement
8
- | (() => HTMLElement)
9
- | {
10
- style?: Partial<CSSStyleDeclaration>;
11
- beforeMount?: () => void;
12
- afterMount?: () => void;
13
- text?: string;
14
- stateID?: string;
15
- shouldUpdate?: boolean;
16
- assert?: any;
17
- }
18
- )[]
19
- ) => T;
20
2
  /**
21
- *
3
+ * Cradova Signal
4
+ * ----
5
+ * Create stateful data store.
6
+ * Features:
7
+ * - create a store
8
+ * - create actions and fire them
9
+ * - bind a Ref and elements
10
+ * - listen to updates
11
+ * - set object keys instead of all values
12
+ * - persist changes to localStorage
13
+ * - update a cradova Ref automatically
14
+ * @constructor initial: unknown, props: {useHistory, persist}
22
15
  */
23
- type CradovaScreenType = {
16
+ export class createSignal<Type extends Record<string, unknown>> {
17
+ private callback;
18
+ private persistName;
19
+ private actions;
20
+ private ref;
21
+ value: Type;
22
+ constructor(
23
+ initial: Type,
24
+ props?: {
25
+ persistName?: string | undefined;
26
+ }
27
+ );
24
28
  /**
25
- * Cradova screen
26
- * ---
27
- * title of the page
28
- *
29
- *
30
- * .
29
+ * Cradova Signal
30
+ * ----
31
+ * set signal value
32
+ * @param value - signal value
33
+ * @returns void
31
34
  */
32
- name: string;
35
+ set(value: Type | ((value: Type) => Type), shouldRefRender?: boolean): void;
33
36
  /**
34
- * Cradova screen
35
- * ---
36
- * a css className to add to screen when rendering it
37
- * Usually for adding css transitions
38
- * .
37
+ * Cradova Signal
38
+ * ----
39
+ * set a key value if it's an object
40
+ * @param key - key of the key
41
+ * @param value - value of the key
42
+ * @returns void
39
43
  */
40
- transition?: string;
44
+ setKey<k extends keyof Type>(
45
+ key: k,
46
+ value: unknown,
47
+ shouldRefRender?: boolean
48
+ ): void;
41
49
  /**
42
- * Cradova screen
43
- * ---
44
- * The component for the screen
45
- * @param data
46
- * @returns void
47
- *
48
- *
49
- * .
50
+ * Cradova Signal
51
+ * ----
52
+ * set a key to signal an action
53
+ * @param name - name of the action
54
+ * @param action function to execute
50
55
  */
51
- template: Function | HTMLElement;
56
+ createAction(name: string, action: (data?: unknown) => void): void;
52
57
  /**
53
- * Cradova screen
54
- * ---
55
- * Allows this screen render in parallel for unique routes
56
- *
57
- * limit is 1000
58
- *
59
- *
60
- *
61
- * .
58
+ * Cradova Signal
59
+ * ----
60
+ * creates man y actions at a time
61
+ * @param name - name of the action
62
+ * @param action function to execute
62
63
  */
63
- renderInParallel?: boolean;
64
+ createActions(Actions: Record<string, (data?: unknown) => void>): void;
64
65
  /**
65
- * Cradova screen
66
+ * Cradova Signal
67
+ * ----
68
+ * fires an action if available
69
+ * @param key - string key of the action
70
+ * @param data - data for the action
71
+ */
72
+ fireAction(key: string, data?: unknown): void;
73
+ /**
74
+ * Cradova
66
75
  * ---
67
- * gets called when the the screen is displayed
76
+ * is used to bind signal data to elements and Refs
68
77
  *
78
+ * @param prop
79
+ * @returns something
80
+ */
81
+ bind(prop: string): any;
82
+ private _updateState;
83
+ /**
84
+ * Cradova Signal
85
+ * ----
86
+ * set a auto - rendering component for this store
69
87
  *
70
- * .
88
+ * @param Ref component to bind to.
89
+ * @param path a property in the object to send to attached ref
90
+ */
91
+ bindRef(
92
+ ref: Partial<Ref<unknown>>, //! there's more to this friday (even elements act as ref here because of the updateState)
93
+ binding?: {
94
+ event?: string;
95
+ signalProperty: string;
96
+ _element_property: string;
97
+ }
98
+ ): void;
99
+ /**
100
+ * Cradova Signal
101
+ * ----
102
+ * set a update listener on value changes
103
+ * @param callback
71
104
  */
105
+ listen(callback: (a: Type) => void): void;
72
106
  /**
73
- * Cradova screen
74
- * ---
75
- * Should this screen be cached after first render?
76
- * you can use Route.navigate(url, null, true) to force later
107
+ * Cradova Signal
108
+ * ----
109
+ * clear the history on local storage
77
110
  *
78
- * .
79
111
  */
80
- persist?: boolean;
81
- };
82
-
83
- export const makeElement: (
84
- element: Record<string, any>,
85
- ...ElementChildrenAndPropertyList: ElementType<HTMLElement>[]
86
- ) => Record<string, any>;
87
- export const a: ElementType<HTMLAnchorElement>;
88
- export const abbr: ElementType<HTMLElement>;
89
- export const address: ElementType<HTMLElement>;
90
- export const area: ElementType<HTMLAreaElement>;
91
- export const article: ElementType<HTMLElement>;
92
- export const aside: ElementType<HTMLElement>;
93
- export const audio: ElementType<HTMLAudioElement>;
94
- export const b: ElementType<HTMLElement>;
95
- export const base: ElementType<HTMLBaseElement>;
96
- export const bdi: ElementType<HTMLElement>;
97
- export const bdo: ElementType<HTMLElement>;
98
- export const blockquote: ElementType<HTMLElement>;
99
- export const body: ElementType<HTMLBodyElement>;
100
- export const br: ElementType<HTMLBRElement>;
101
- export const button: ElementType<HTMLButtonElement>;
102
- export const canvas: ElementType<HTMLCanvasElement>;
103
- export const caption: ElementType<HTMLTableCaptionElement>;
104
- export const cite: ElementType<HTMLElement>;
105
- export const code: ElementType<HTMLElement>;
106
- export const col: ElementType<HTMLTableColElement>;
107
- export const colgroup: ElementType<HTMLElement>;
108
- export const data: ElementType<HTMLDataElement>;
109
- export const datalist: ElementType<HTMLDataListElement>;
110
- export const dd: ElementType<HTMLElement>;
111
- export const del: ElementType<HTMLElement>;
112
- export const details: ElementType<HTMLDetailsElement>;
113
- export const dfn: ElementType<HTMLElement>;
114
- export const dialog: ElementType<HTMLDialogElement>;
115
- export const div: ElementType<HTMLDivElement>;
116
- export const dl: ElementType<HTMLElement>;
117
- export const dt: ElementType<HTMLElement>;
118
- export const em: ElementType<HTMLElement>;
119
- export const embed: ElementType<HTMLEmbedElement>;
120
- export const fieldset: ElementType<HTMLFieldSetElement>;
121
- export const figcaption: ElementType<HTMLElement>;
122
- export const figure: ElementType<HTMLElement>;
123
- export const footer: ElementType<HTMLElement>;
124
- export const form: ElementType<HTMLFormElement>;
125
- export const h1: ElementType<HTMLHeadingElement>;
126
- export const h2: ElementType<HTMLHeadingElement>;
127
- export const h3: ElementType<HTMLHeadingElement>;
128
- export const h4: ElementType<HTMLHeadingElement>;
129
- export const h5: ElementType<HTMLHeadingElement>;
130
- export const h6: ElementType<HTMLHeadingElement>;
131
- export const head: ElementType<HTMLHeadElement>;
132
- export const header: ElementType<HTMLElement>;
133
- export const hr: ElementType<HTMLHRElement>;
134
- export const html: ElementType<HTMLHtmlElement>;
135
- export const i: ElementType<HTMLElement>;
136
- export const iframe: ElementType<HTMLIFrameElement>;
137
- export const img: ElementType<HTMLImageElement>;
138
- export const input: ElementType<HTMLInputElement>;
139
- export const ins: ElementType<HTMLElement>;
140
- export const kbd: ElementType<HTMLElement>;
141
- export const label: ElementType<HTMLLabelElement>;
142
- export const legend: ElementType<HTMLLegendElement>;
143
- export const li: ElementType<HTMLLIElement>;
144
- export const link: ElementType<HTMLLinkElement>;
145
- export const main: ElementType<HTMLElement>;
146
- export const map: ElementType<HTMLMapElement>;
147
- export const mark: ElementType<HTMLElement>;
148
- export const math: ElementType<HTMLElement>;
149
- export const menu: ElementType<HTMLMenuElement>;
150
- export const meta: ElementType<HTMLMetaElement>;
151
- export const meter: ElementType<HTMLMeterElement>;
152
- export const nav: ElementType<HTMLElement>;
153
- export const noscript: ElementType<HTMLElement>;
154
- export const object: ElementType<HTMLObjectElement>;
155
- export const ol: ElementType<HTMLOListElement>;
156
- export const optgroup: ElementType<HTMLOptGroupElement>;
157
- export const option: ElementType<HTMLOptionElement>;
158
- export const output: ElementType<HTMLOutputElement>;
159
- export const p: ElementType<HTMLParagraphElement>;
160
- export const picture: ElementType<HTMLPictureElement>;
161
- export const portal: ElementType<HTMLElement>;
162
- export const pre: ElementType<HTMLPreElement>;
163
- export const progress: ElementType<HTMLProgressElement>;
164
- export const q: ElementType<HTMLQuoteElement>;
165
- export const rp: ElementType<HTMLElement>;
166
- export const rt: ElementType<HTMLElement>;
167
- export const ruby: ElementType<HTMLElement>;
168
- export const s: ElementType<HTMLElement>;
169
- export const samp: ElementType<HTMLElement>;
170
- export const script: ElementType<HTMLScriptElement>;
171
- export const section: ElementType<HTMLElement>;
172
- export const select: ElementType<HTMLSelectElement>;
173
- export const slot: ElementType<HTMLSlotElement>;
174
- export const small: ElementType<HTMLElement>;
175
- export const source: ElementType<HTMLSourceElement>;
176
- export const span: ElementType<HTMLSpanElement>;
177
- export const strong: ElementType<HTMLElement>;
178
- export const style: ElementType<HTMLStyleElement>;
179
- export const sub: ElementType<HTMLElement>;
180
- export const summary: ElementType<HTMLElement>;
181
- export const sup: ElementType<HTMLElement>;
182
- export const table: ElementType<HTMLTableElement>;
183
- export const tbody: ElementType<HTMLTableColElement>;
184
- export const td: ElementType<HTMLTableCellElement>;
185
- export const template: ElementType<HTMLTemplateElement>;
186
- export const textarea: ElementType<HTMLTextAreaElement>;
187
- export const tfoot: ElementType<HTMLElement>;
188
- export const th: ElementType<HTMLTableSectionElement>;
189
- export const thead: ElementType<HTMLTableSectionElement>;
190
- export const time: ElementType<HTMLTimeElement>;
191
- export const title: ElementType<HTMLTitleElement>;
192
- export const tr: ElementType<HTMLTableRowElement>;
193
- export const track: ElementType<HTMLTrackElement>;
194
- export const u: ElementType<HTMLElement>;
195
- export const ul: ElementType<HTMLUListElement>;
196
- export const val: ElementType<HTMLElement>;
197
- export const video: ElementType<HTMLVideoElement>;
198
- export const wbr: ElementType<HTMLElement>;
199
-
200
- /**
201
- *
202
- * Cradova Ajax
203
- * ------------------
204
- * your new axios alternative
205
- * supports files upload
206
- * @param url string
207
- * @param {{method: string;data;header;callbacks;}} opts
208
- * @returns any
209
- */
210
- export function Ajax(
211
- url: string | URL,
212
- opts?:
213
- | {
214
- method?: "GET" | "POST";
215
- data?: Record<string, any>;
216
- header?: {
217
- "content-type": string;
218
- } & Record<string, any>;
219
- callbacks?: Record<string, (arg: any) => void>;
220
- }
221
- | any
222
- ): Promise<unknown>;
223
-
224
- /**
225
- * Cradova afterMount event
226
- */
227
- export let cradovaAftermountEvent: CustomEvent<unknown>;
228
- /**
229
- Write CSS styles in Javascript
230
- @example
231
-
232
- css("#container",
233
- {
234
- height: "100%",
235
- height: "100%",
236
- background-color: "#ff9800"
237
- })
238
-
239
- css(".btn:hover",
240
- {
241
- height: "100%",
242
- height: "100%",
243
- background-color: "#ff9800"
244
- })
112
+ clearPersist(): void;
113
+ }
245
114
 
246
- */
247
- export function css(
248
- identifier: string,
249
- properties?: Record<string, string>
250
- ): void;
115
+ export function css(identifier: string | TemplateStringsArray): void;
251
116
  /**
252
117
  *
253
118
  * @param {expression} condition
254
119
  * @param {function} elements[]
255
120
  */
256
- export function assert(condition: any, ...elements: any): any;
257
- export function loop(
258
- datalist: any[],
259
- component: (value: any, index?: number, array?: any[]) => any
121
+ export function assert(
122
+ condition: boolean,
123
+ ...elements: VJS_Child_TYPE<HTMLElement>[]
124
+ ): VJS_Child_TYPE<HTMLElement> | undefined;
125
+
126
+ type LoopData<Type> = Type[];
127
+
128
+ export function loop<Type>(
129
+ datalist: LoopData<Type>,
130
+ component: (
131
+ value: Type,
132
+ index?: number,
133
+ array?: LoopData<Type>
134
+ ) => HTMLElement | undefined
260
135
  ): HTMLElement | undefined;
261
136
  export function assertOr(
262
137
  condition: boolean,
263
- ifTrue: () => any,
264
- ifFalse: () => any
265
- ): () => any;
138
+ ifTrue: HTMLElement | HTMLElement[],
139
+ ifFalse: HTMLElement | HTMLElement[]
140
+ ): HTMLElement;
266
141
  /**
267
142
  * Cradova Ref
268
143
  * -------
269
144
  * create dynamic components
270
145
  */
271
- type RefProps<D> = D | any;
146
+
272
147
  export class Ref<D> {
273
148
  private component;
274
- private stateID;
275
149
  private effects;
276
150
  private effectuate;
277
151
  private rendered;
278
152
  private published;
279
153
  private hasFirstStateUpdateRun;
280
154
  private preRendered;
155
+ private reference;
156
+ Signal: createSignal<any> | undefined;
281
157
  stash: D | undefined;
282
- constructor(component: (data?: RefProps<D>) => any);
283
- preRender(data?: RefProps<D>): void;
158
+ constructor(component: (this: Ref<D>, data: D) => HTMLElement);
159
+ preRender(data?: D | undefined): void;
284
160
  destroyPreRendered(): void;
285
161
  /**
286
162
  * Cradova Ref
@@ -290,14 +166,15 @@ css(".btn:hover",
290
166
  * @returns () => HTMLElement
291
167
  */
292
168
  render(data?: D, stash?: boolean): HTMLElement;
293
- instance(): any;
169
+ instance(): Record<string, any>;
170
+ _setExtra(Extra: createSignal<any>): void;
294
171
  /**
295
172
  * Cradova Ref
296
173
  * ---
297
174
  * runs on first state update
298
175
  *
299
176
  */
300
- effect(fn: () => Promise<unknown>): void;
177
+ effect(fn: () => Promise<void> | void): void;
301
178
  private effector;
302
179
  /**
303
180
  * Cradova Ref
@@ -313,158 +190,325 @@ css(".btn:hover",
313
190
  private Activate;
314
191
  remove(): void;
315
192
  }
316
- export const svgNS: (
317
- type: string,
318
- props: Record<string, any>,
319
- ...children: any
320
- ) => HTMLElement;
321
- export class lazy {
322
- content: any;
193
+ export class lazy<Type> {
194
+ public content: Type | undefined;
323
195
  private _cb;
324
- constructor(cb: () => Promise<any>);
196
+ constructor(cb: () => Promise<unknown>);
325
197
  load(): Promise<void>;
326
198
  }
327
-
328
199
  /**
329
- * Cradova Signal
330
- * ----
331
- * create stateful data store.
332
- * ability to:
333
- * - create store
334
- * - create actions and fire them
335
- * - bind a Ref
336
- * - listen to changes
337
- * - persist changes to localStorage
338
- * - set keys instead of all values
339
- * - update a cradova Ref and bindings automatically
340
- * @constructor initial: any, props: {useHistory, persist}
200
+ * Cradova
201
+ * ---
202
+ * make reference to dom elements
341
203
  */
204
+ export class reference {
205
+ [x: string]: Record<string, any>;
206
+ bindAs(name: string): reference;
207
+ // _appendDom(name: string, Element: HTMLElement): void;
208
+ _appendDomForce(name: string, Element: HTMLElement): void;
209
+ }
342
210
 
343
- export class createSignal<Type extends Record<string, any>> {
344
- private callback;
345
- private persistName;
346
- private actions;
347
- private ref;
348
- value: Type;
349
- constructor(
350
- initial: Type,
351
- props?: {
352
- persistName?: string | undefined;
211
+ type DataAttributes = { [key: `data-${string}`]: string };
212
+ type AriaAttributes = { [key: `aria-${string}`]: string };
213
+
214
+ type VJSType<T> = (
215
+ ...VJS: (
216
+ | undefined
217
+ | string
218
+ | Partial<T>
219
+ | HTMLElement
220
+ | HTMLElement[]
221
+ | DataAttributes
222
+ | AriaAttributes
223
+ | (() => HTMLElement)
224
+ | {
225
+ style?: Partial<CSSStyleDeclaration>;
226
+ onmount?: (this: T) => void;
227
+ text?: string;
228
+ reference?: reference;
229
+ }
230
+ )[]
231
+ ) => T;
232
+ type VJS_params_TYPE<T> = (
233
+ | undefined
234
+ | string
235
+ | Partial<T>
236
+ | HTMLElement
237
+ | HTMLElement[]
238
+ | Partial<CSSStyleDeclaration>
239
+ | DataAttributes
240
+ | AriaAttributes
241
+ | TemplateStringsArray
242
+ | (() => HTMLElement)
243
+ | any
244
+ | {
245
+ style?: Partial<CSSStyleDeclaration>;
246
+ onmount?: (this: T) => void;
247
+ text?: string;
248
+ reference?: reference;
353
249
  }
354
- );
250
+ )[];
251
+
252
+ type VJS_Child_TYPE<T> = undefined | string | T | (() => T);
253
+ /**
254
+ *
255
+ */
256
+ type CradovaScreenType = {
355
257
  /**
356
- * Cradova Signal
357
- * ----
358
- * set signal value
359
- * @param value - signal value
360
- * @returns void
258
+ * Cradova screen
259
+ * ---
260
+ * title of the page
261
+ * .
361
262
  */
362
- set(value: Type | ((value: Type) => Type), shouldRefRender?: boolean): void;
263
+ name: string;
363
264
  /**
364
- * Cradova Signal
365
- * ----
366
- * set a key value if it's an object
367
- * @param key - key of the key
368
- * @param value - value of the key
265
+ * Cradova screen
266
+ * ---
267
+ * a css className to add to screen when rendering it
268
+ * Usually for adding css transitions
269
+ * .
270
+ */
271
+ transition?: string;
272
+ /**
273
+ * Cradova screen
274
+ * ---
275
+ * The component for the screen
276
+ * @param data
369
277
  * @returns void
278
+ * .
370
279
  */
371
- setKey<k extends keyof Type>(
372
- key: k,
373
- value: any,
374
- shouldRefRender?: boolean
375
- ): void;
280
+ template: ((this: Screen, data?: unknown) => HTMLElement) | HTMLElement;
376
281
  /**
377
- * Cradova Signal
378
- * ----
379
- * set a key to signal an action
380
- * @param key - key of the action
381
- * @param action function to execute
282
+ * Cradova screen
283
+ * ---
284
+ * Allows this screen render in parallel for unique routes
285
+ *
286
+ * limit is 1000
287
+ * .
382
288
  */
383
- createAction(
384
- key: string | Record<string, (data?: Type) => void>,
385
- action?: ((data?: Type) => void) | Ref<unknown>
386
- ): void;
289
+ renderInParallel?: boolean;
387
290
  /**
388
- * Cradova Signal
389
- * ----
390
- * fires an action if available
391
- * @param key - string key of the action
392
- * @param data - data for the action
291
+ * Cradova screen
292
+ * ---
293
+ * Should this screen be cached after first render?
294
+ * you can use Route.navigate(url, null, true) to force later
295
+ *
296
+ * .
393
297
  */
394
- fireAction(key: string, data?: Type): void;
298
+ persist?: boolean;
395
299
  /**
396
- * Cradova
300
+ * Cradova screen
397
301
  * ---
398
- * is used to bind store data to an element
302
+ * Should the loading screen be show as this screen is loading?
303
+ * .
304
+ */
305
+ suspend?: boolean;
306
+ };
307
+
308
+ export const makeElement: (
309
+ element: HTMLElement,
310
+ ...ElementChildrenAndPropertyList: VJS_params_TYPE<HTMLElement>
311
+ ) => HTMLElement;
312
+ export const a: VJSType<HTMLAnchorElement>;
313
+ export const abbr: VJSType<HTMLElement>;
314
+ export const address: VJSType<HTMLElement>;
315
+ export const area: VJSType<HTMLAreaElement>;
316
+ export const article: VJSType<HTMLElement>;
317
+ export const aside: VJSType<HTMLElement>;
318
+ export const audio: VJSType<HTMLAudioElement>;
319
+ export const b: VJSType<HTMLElement>;
320
+ export const base: VJSType<HTMLBaseElement>;
321
+ export const bdi: VJSType<HTMLElement>;
322
+ export const bdo: VJSType<HTMLElement>;
323
+ export const blockquote: VJSType<HTMLElement>;
324
+ export const body: VJSType<HTMLBodyElement>;
325
+ export const br: VJSType<HTMLBRElement>;
326
+ export const button: VJSType<HTMLButtonElement>;
327
+ export const canvas: VJSType<HTMLCanvasElement>;
328
+ export const caption: VJSType<HTMLTableCaptionElement>;
329
+ export const cite: VJSType<HTMLElement>;
330
+ export const code: VJSType<HTMLElement>;
331
+ export const col: VJSType<HTMLTableColElement>;
332
+ export const colgroup: VJSType<HTMLElement>;
333
+ export const data: VJSType<HTMLDataElement>;
334
+ export const datalist: VJSType<HTMLDataListElement>;
335
+ export const dd: VJSType<HTMLElement>;
336
+ export const del: VJSType<HTMLElement>;
337
+ export const details: VJSType<HTMLDetailsElement>;
338
+ export const dfn: VJSType<HTMLElement>;
339
+ export const dialog: VJSType<HTMLDialogElement>;
340
+ export const div: VJSType<HTMLDivElement>;
341
+ export const dl: VJSType<HTMLElement>;
342
+ export const dt: VJSType<HTMLElement>;
343
+ export const em: VJSType<HTMLElement>;
344
+ export const embed: VJSType<HTMLEmbedElement>;
345
+ export const fieldset: VJSType<HTMLFieldSetElement>;
346
+ export const figcaption: VJSType<HTMLElement>;
347
+ export const figure: VJSType<HTMLElement>;
348
+ export const footer: VJSType<HTMLElement>;
349
+ export const form: VJSType<HTMLFormElement>;
350
+ export const h1: VJSType<HTMLHeadingElement>;
351
+ export const h2: VJSType<HTMLHeadingElement>;
352
+ export const h3: VJSType<HTMLHeadingElement>;
353
+ export const h4: VJSType<HTMLHeadingElement>;
354
+ export const h5: VJSType<HTMLHeadingElement>;
355
+ export const h6: VJSType<HTMLHeadingElement>;
356
+ export const head: VJSType<HTMLHeadElement>;
357
+ export const header: VJSType<HTMLElement>;
358
+ export const hr: VJSType<HTMLHRElement>;
359
+ export const html: VJSType<HTMLHtmlElement>;
360
+ export const i: VJSType<HTMLElement>;
361
+ export const iframe: VJSType<HTMLIFrameElement>;
362
+ export const img: VJSType<HTMLImageElement>;
363
+ export const input: VJSType<HTMLInputElement>;
364
+ export const ins: VJSType<HTMLElement>;
365
+ export const kbd: VJSType<HTMLElement>;
366
+ export const label: VJSType<HTMLLabelElement>;
367
+ export const legend: VJSType<HTMLLegendElement>;
368
+ export const li: VJSType<HTMLLIElement>;
369
+ export const link: VJSType<HTMLLinkElement>;
370
+ export const main: VJSType<HTMLElement>;
371
+ export const map: VJSType<HTMLMapElement>;
372
+ export const mark: VJSType<HTMLElement>;
373
+ export const math: VJSType<HTMLElement>;
374
+ export const menu: VJSType<HTMLMenuElement>;
375
+ export const meta: VJSType<HTMLMetaElement>;
376
+ export const meter: VJSType<HTMLMeterElement>;
377
+ export const nav: VJSType<HTMLElement>;
378
+ export const object: VJSType<HTMLObjectElement>;
379
+ export const ol: VJSType<HTMLOListElement>;
380
+ export const optgroup: VJSType<HTMLOptGroupElement>;
381
+ export const option: VJSType<HTMLOptionElement>;
382
+ export const output: VJSType<HTMLOutputElement>;
383
+ export const p: VJSType<HTMLParagraphElement>;
384
+ export const picture: VJSType<HTMLPictureElement>;
385
+ export const portal: VJSType<HTMLElement>;
386
+ export const pre: VJSType<HTMLPreElement>;
387
+ export const progress: VJSType<HTMLProgressElement>;
388
+ export const q: VJSType<HTMLQuoteElement>;
389
+ export const rp: VJSType<HTMLElement>;
390
+ export const rt: VJSType<HTMLElement>;
391
+ export const ruby: VJSType<HTMLElement>;
392
+ export const s: VJSType<HTMLElement>;
393
+ export const samp: VJSType<HTMLElement>;
394
+ export const script: VJSType<HTMLScriptElement>;
395
+ export const section: VJSType<HTMLElement>;
396
+ export const select: VJSType<HTMLSelectElement>;
397
+ export const slot: VJSType<HTMLSlotElement>;
398
+ export const small: VJSType<HTMLElement>;
399
+ export const source: VJSType<HTMLSourceElement>;
400
+ export const span: VJSType<HTMLSpanElement>;
401
+ export const strong: VJSType<HTMLElement>;
402
+ export const style: VJSType<HTMLStyleElement>;
403
+ export const sub: VJSType<HTMLElement>;
404
+ export const summary: VJSType<HTMLElement>;
405
+ export const sup: VJSType<HTMLElement>;
406
+ export const table: VJSType<HTMLTableElement>;
407
+ export const tbody: VJSType<HTMLTableColElement>;
408
+ export const td: VJSType<HTMLTableCellElement>;
409
+ export const template: VJSType<HTMLTemplateElement>;
410
+ export const textarea: VJSType<HTMLTextAreaElement>;
411
+ export const tfoot: VJSType<HTMLElement>;
412
+ export const th: VJSType<HTMLTableSectionElement>;
413
+ export const thead: VJSType<HTMLTableSectionElement>;
414
+ export const time: VJSType<HTMLTimeElement>;
415
+ export const title: VJSType<HTMLTitleElement>;
416
+ export const tr: VJSType<HTMLTableRowElement>;
417
+ export const track: VJSType<HTMLTrackElement>;
418
+ export const u: VJSType<HTMLElement>;
419
+ export const ul: VJSType<HTMLUListElement>;
420
+ export const val: VJSType<HTMLElement>;
421
+ export const video: VJSType<HTMLVideoElement>;
422
+ export const wbr: VJSType<HTMLElement>;
423
+
424
+ /** cradova router
425
+ * ---
426
+ * Registers a route.
427
+ *
428
+ * @param {string} path Route path.
429
+ * @param screen the cradova document tree for the route.
430
+ */
431
+ class RouterClass {
432
+ /** cradova router
433
+ * ---
434
+ * Registers a route.
399
435
  *
400
- * @param prop
401
- * @returns something
436
+ * accepts an object containing
437
+ *
438
+ * @param {string} path Route path.
439
+ * @param screen the cradova screen.
402
440
  */
403
- bind(prop: string): (string | this)[];
404
- private _updateState;
441
+ BrowserRoutes(obj: Record<string, any>): void;
405
442
  /**
406
- * Cradova Signal
407
- * ----
408
- * set a auto - rendering component for this store
443
+ Go back in Navigation history
444
+ */
445
+ back(): void;
446
+ /**
447
+ Go forward in Navigation history
448
+ */
449
+ forward(): void;
450
+ /**
451
+ * Cradova Router
452
+ * ------
409
453
  *
410
- * @param Ref component to bind to.
411
- * @param path a property in the object to send to attached ref
454
+ * Navigates to a designated screen in your app
455
+ *
456
+ * @param href string
457
+ * @param data object
458
+ * @param force boolean
412
459
  */
413
- bindRef(
414
- ref: any,
415
- binding: {
416
- event?: string;
417
- signalProperty: string;
418
- _element_property: string;
419
- }
460
+ navigate(
461
+ href: string,
462
+ data?: Record<string, unknown> | null,
463
+ force?: boolean
420
464
  ): void;
465
+ /** cradova router
466
+ * ---
467
+ * Listen for navigation events
468
+ *
469
+ * @param callback () => void
470
+ */
471
+ onPageEvent(callback: () => void): void;
472
+ /** cradova router
473
+ * ---
474
+ * get a screen ready before time.
475
+ *
476
+ * @param {string} path Route path.
477
+ * @param data data for the screen.
478
+ */
479
+ packageScreen(path: string, data?: Record<string, unknown>): Promise<void>;
421
480
  /**
422
- * Cradova Signal
423
- * ----
424
- * set a update listener on value changes
481
+ * Cradova Router
482
+ * ------
483
+ *
484
+ * return last set router params
485
+ *
486
+ * .
487
+ */
488
+ getParams: () => any;
489
+ /**
490
+ * Cradova
491
+ * ---
492
+ * Error Handler for your app
493
+ *
425
494
  * @param callback
495
+ * @param path? page path
426
496
  */
427
- listen(callback: (a: any) => void): void;
497
+ addErrorHandler(callback: (err: unknown) => void): void;
428
498
  /**
429
- * Cradova Signal
430
- * ----
431
- * clear the history on local storage
499
+ * Cradova
500
+ * ---
501
+ * Loading screen for your app
432
502
  *
503
+ * lazy loaded loading use
433
504
  *
434
- * .
505
+ * @param screen
435
506
  */
436
- clearPersist(): void;
437
- }
507
+ setLoadingScreen(screen: Screen): void;
438
508
 
439
- type stateType =
440
- | Partial<HTMLElement>
441
- | {
442
- class?: string;
443
- text?: string;
444
- style?: Partial<CSSStyleDeclaration>;
445
- tree?: Function | HTMLElement;
446
- remove?: boolean;
447
- };
448
- type stateID = string;
449
- /**
450
- * Send a new state to specified element with stateID
451
- *
452
- * @param stateID
453
- * @param state
454
- * @returns element(s)
455
- */
456
- export function dispatch(
457
- stateID: stateID | Record<stateID, stateType>,
458
- state?: stateType
459
- ): any;
460
-
461
- /**
462
- * Cradova Router
463
- * ---
464
- * Facilitates navigation within the application and initializes
465
- * page views based on the matched routes.
466
- */
467
- export const Router: Record<string, any>;
509
+ _mount(): void;
510
+ }
511
+ export const Router: RouterClass;
468
512
 
469
513
  /**
470
514
  * Cradova Screen
@@ -478,15 +522,15 @@ css(".btn:hover",
478
522
  /**
479
523
  * this should be a cradova screen component
480
524
  */
481
- _html: Function;
525
+ _html: Function | HTMLElement;
482
526
  /**
483
527
  * this is a set of added html to the screen
484
528
  */
485
- _secondaryChildren: Array<Node>;
529
+ _secondaryChildren: VJSType<HTMLElement>[];
486
530
  /**
487
531
  * error handler for the screen
488
532
  */
489
- errorHandler: (() => void) | null;
533
+ _errorHandler: ((err: unknown) => void) | null;
490
534
  /**
491
535
  * used internally
492
536
  */
@@ -497,23 +541,50 @@ css(".btn:hover",
497
541
  private _deCallBack;
498
542
  private _persist;
499
543
  private _data;
500
- _params: Record<string, any> | null;
544
+ // _params: Record<string, unknown> | null;
545
+ _suspend: boolean;
501
546
  private _delegatedRoutesCount;
502
547
  private _transition;
548
+ private _doc;
503
549
  constructor(cradova_screen_initials: CradovaScreenType);
504
550
  get _delegatedRoutes(): boolean;
505
551
  set _delegatedRoutes(count: boolean);
506
- get _paramData(): typeof this._params;
507
- set _paramData(params: typeof this._params);
508
- setErrorHandler(errorHandler: () => void): void;
552
+ // get _paramData(): typeof this._params;
553
+ // set _paramData(params: typeof this._params);
554
+ setErrorHandler(errorHandler: (err: unknown) => void): void;
509
555
  _package(): Promise<void>;
510
556
  onActivate(cb: () => Promise<void> | void): void;
511
557
  onDeactivate(cb: () => Promise<void> | void): void;
512
- addChild(...addOns: any[]): void;
558
+ addChildren(...addOns: VJSType<HTMLElement>[]): void;
513
559
  _deActivate(): Promise<void>;
514
560
  _Activate(force?: boolean): Promise<void>;
515
561
  }
516
562
 
563
+ /**
564
+ *
565
+ * Cradova Ajax
566
+ * ------------------
567
+ * your new axios alternative
568
+ * supports files upload
569
+ * @param url string
570
+ * @param {{method: string;data;header;callbacks;}} opts
571
+ * @returns unknown
572
+ */
573
+ export function Ajax(
574
+ url: string | URL,
575
+ opts?: {
576
+ method?: "GET" | "POST";
577
+ data?: Record<string, unknown>;
578
+ header?: {
579
+ "content-type"?: string;
580
+ } & Record<string, string>;
581
+ callbacks?: Record<string, (arg: Function) => void>;
582
+ }
583
+ ): Promise<unknown>;
584
+
585
+ type TemplateType = (
586
+ ...element_initials: VJS_params_TYPE<HTMLElement>
587
+ ) => HTMLElement;
517
588
  /**
518
589
  * Cradova
519
590
  * ---
@@ -544,9 +615,9 @@ css(".btn:hover",
544
615
  * ...
545
616
  * )
546
617
  *
547
- * @param {...any[]} element_initials
618
+ * @param element_initials
548
619
  * @returns function - cradova element
549
620
  */
550
- const _: any;
621
+ const _: TemplateType;
551
622
  export default _;
552
623
  }