Comparing version 0.5.56 to 0.6.0
{ | ||
"name": "aurumjs", | ||
"version": "0.5.56", | ||
"version": "0.6.0", | ||
"description": "Stream based declarative DOM rendering library for javascript", | ||
@@ -12,5 +12,4 @@ "main": "prebuilt/cjs/aurumjs.js", | ||
"test": "tsc -p tsconfig.test.json && http-server -o -c-1", | ||
"generateDocs": "typedoc --json docs/docs.json --mode modules --excludePrivate --excludeProtected", | ||
"deploy-test": "npm run build", | ||
"deploy": "npm run build && tsc -p tsconfig.amd.json && tsc -p tsconfig.cjs.json && npm run generateDocs" | ||
"deploy": "npm run build && tsc -p tsconfig.amd.json && tsc -p tsconfig.cjs.json" | ||
}, | ||
@@ -38,9 +37,9 @@ "homepage": "https://aurumjs.org/", | ||
"mocha": "^8.1.1", | ||
"prettier": "^1.19.1", | ||
"prettier": "^2.2.1", | ||
"requirejs": "^2.3.6", | ||
"sinon": "^9.0.3", | ||
"typedoc": "^0.15.4", | ||
"typescript": "^4.0.5" | ||
"typescript": "^4.1.5" | ||
}, | ||
"dependencies": {} | ||
} |
"use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Object = exports.Output = exports.Picture = exports.Wbr = exports.Var = exports.Kbd = exports.Samp = exports.Strong = exports.Slot = exports.OptGroup = exports.Option = exports.Progress = exports.Svg = exports.Script = exports.Param = exports.Track = exports.Source = exports.Style = exports.Time = exports.Th = exports.Td = exports.TFoot = exports.TBody = exports.Table = exports.Sup = exports.Sub = exports.Nav = exports.Link = exports.Label = exports.Img = exports.IFrame = exports.I = exports.Heading = exports.Header = exports.Head = exports.Html = exports.Meta = exports.Form = exports.Footer = exports.Em = exports.Details = exports.Data = exports.Canvas = exports.Button = exports.Br = exports.Audio = exports.Hr = exports.P = exports.Pre = exports.Q = exports.Template = exports.THead = exports.Summary = exports.Title = exports.Body = exports.B = exports.Tr = exports.Li = exports.Ol = exports.Ul = exports.Video = exports.NoScript = exports.Span = exports.Aside = exports.Article = exports.Area = exports.H6 = exports.H5 = exports.H4 = exports.H3 = exports.H2 = exports.H1 = exports.Address = exports.Abbr = exports.A = exports.Div = exports.Code = void 0; | ||
exports.Link = exports.Label = exports.Img = exports.IFrame = exports.I = exports.Heading = exports.Header = exports.Head = exports.Html = exports.Meta = exports.Form = exports.Footer = exports.Em = exports.Details = exports.Data = exports.Canvas = exports.Button = exports.Br = exports.Audio = exports.Hr = exports.P = exports.Pre = exports.Q = exports.Template = exports.THead = exports.Summary = exports.Title = exports.Body = exports.B = exports.Tr = exports.Li = exports.Ol = exports.Ul = exports.Video = exports.NoScript = exports.Span = exports.Aside = exports.Article = exports.Area = exports.H6 = exports.H5 = exports.H4 = exports.H3 = exports.H2 = exports.H1 = exports.Address = exports.Abbr = exports.A = exports.Div = exports.Code = void 0; | ||
exports.Object = exports.Output = exports.Picture = exports.Wbr = exports.Var = exports.Kbd = exports.Samp = exports.Strong = exports.Slot = exports.OptGroup = exports.Option = exports.Progress = exports.Svg = exports.Script = exports.Param = exports.Track = exports.Source = exports.Style = exports.Time = exports.Th = exports.Td = exports.TFoot = exports.TBody = exports.Table = exports.Sup = exports.Sub = exports.Nav = void 0; | ||
const dom_adapter_1 = require("../builtin_compoents/dom_adapter"); | ||
@@ -286,3 +287,3 @@ /** | ||
*/ | ||
exports.OptGroup = dom_adapter_1.DomNodeCreator('option', ['label', 'disabled']); | ||
exports.OptGroup = dom_adapter_1.DomNodeCreator('optgroup', ['label', 'disabled']); | ||
/** | ||
@@ -289,0 +290,0 @@ * @internal |
@@ -54,2 +54,3 @@ import { DataSource, ArrayDataSource, ReadOnlyDataSource } from '../stream/data_source'; | ||
attachToDom(node: HTMLElement, index: number): void; | ||
protected getStartIndex(): number; | ||
protected getWorkIndex(): number; | ||
@@ -56,0 +57,0 @@ protected getLastIndex(): number; |
@@ -81,2 +81,5 @@ "use strict"; | ||
} | ||
getStartIndex() { | ||
return this.getWorkIndex() - 1; | ||
} | ||
getWorkIndex() { | ||
@@ -137,3 +140,18 @@ if (this.lastStartIndex !== undefined && this.hostNode.childNodes[this.lastStartIndex] === this.contentStartMarker) { | ||
} | ||
offset += child.getLastIndex() - i - offset - workIndex; | ||
if (child.getStartIndex() === i + workIndex + offset) { | ||
offset += child.getLastIndex() - i - offset - workIndex; | ||
} | ||
else { | ||
let start = child.getStartIndex(); | ||
let end = child.getLastIndex(); | ||
for (let ptr = start, swapIteration = 0; ptr <= end; ptr++, swapIteration++) { | ||
const itemA = this.hostNode.childNodes[i + workIndex + offset + swapIteration]; | ||
const itemB = this.hostNode.childNodes[ptr]; | ||
const parentA = itemA.parentNode; | ||
const siblingA = itemA.nextSibling === itemB ? itemB : itemA.nextSibling; | ||
itemB.parentNode.insertBefore(itemA, itemB); | ||
parentA.insertBefore(itemB, siblingA); | ||
} | ||
offset += child.getLastIndex() - i - offset - workIndex; | ||
} | ||
continue; | ||
@@ -446,2 +464,9 @@ } | ||
const itemB = this.children[change.index2]; | ||
if (itemA instanceof HTMLElement && itemB instanceof HTMLElement) { | ||
optimized = true; | ||
const parentA = itemA.parentNode; | ||
const siblingA = itemA.nextSibling === itemB ? itemB : itemA.nextSibling; | ||
itemB.parentNode.insertBefore(itemA, itemB); | ||
parentA.insertBefore(itemB, siblingA); | ||
} | ||
this.children[change.index2] = itemA; | ||
@@ -448,0 +473,0 @@ this.children[change.index] = itemB; |
import { Renderable } from './aurum_element'; | ||
/** | ||
* Generates a style tag with the provided style as content, supports data sources duplex data sources and streams instead of strings in the template. | ||
* Generates a style tag with the provided style as content, supports data sources, duplex data sources and streams instead of strings in the template. | ||
* Updates style content if any of the datasources used updates. | ||
@@ -5,0 +5,0 @@ */ |
@@ -10,3 +10,3 @@ "use strict"; | ||
/** | ||
* Generates a style tag with the provided style as content, supports data sources duplex data sources and streams instead of strings in the template. | ||
* Generates a style tag with the provided style as content, supports data sources, duplex data sources and streams instead of strings in the template. | ||
* Updates style content if any of the datasources used updates. | ||
@@ -13,0 +13,0 @@ */ |
@@ -313,2 +313,3 @@ import { AurumServerInfo } from '../aurum_server/aurum_server_client'; | ||
toArray(): T[]; | ||
flat(depth?: number, cancellationToken?: CancellationToken): FlattenedArrayView<FlatArray<T, typeof depth>>; | ||
reverse(cancellationToken?: CancellationToken): ReversedArrayView<T>; | ||
@@ -323,2 +324,8 @@ sort(comparator: (a: T, b: T) => number, dependencies?: ReadOnlyDataSource<any>[], cancellationToken?: CancellationToken): SortedArrayView<T>; | ||
} | ||
export declare class FlattenedArrayView<T> extends ArrayDataSource<T> { | ||
private parent; | ||
private depth; | ||
constructor(parent: ArrayDataSource<T[]>, depth: number, cancellationToken?: CancellationToken, name?: string); | ||
refresh(): void; | ||
} | ||
export declare class MappedArrayView<D, T> extends ArrayDataSource<T> { | ||
@@ -325,0 +332,0 @@ private parent; |
"use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.processTransform = exports.FilteredArrayView = exports.SortedArrayView = exports.UniqueArrayView = exports.SlicedArrayView = exports.ReversedArrayView = exports.MappedArrayView = exports.ArrayDataSource = exports.DataSource = void 0; | ||
exports.processTransform = exports.FilteredArrayView = exports.SortedArrayView = exports.UniqueArrayView = exports.SlicedArrayView = exports.ReversedArrayView = exports.MappedArrayView = exports.FlattenedArrayView = exports.ArrayDataSource = exports.DataSource = void 0; | ||
const aurum_server_client_1 = require("../aurum_server/aurum_server_client"); | ||
@@ -493,2 +493,8 @@ const debug_mode_1 = require("../debug_mode"); | ||
merge(newData) { | ||
if (newData.length === 0) { | ||
return this.clear(); | ||
} | ||
if (newData === this.data) { | ||
return; | ||
} | ||
const old = this.data; | ||
@@ -575,2 +581,6 @@ this.data = newData.slice(); | ||
} | ||
flat(depth = 1, cancellationToken) { | ||
const view = new FlattenedArrayView(this, depth, cancellationToken, this.name + '.flat()'); | ||
return view; | ||
} | ||
reverse(cancellationToken) { | ||
@@ -624,2 +634,37 @@ const view = new ReversedArrayView(this, cancellationToken, this.name + '.reverse()'); | ||
exports.ArrayDataSource = ArrayDataSource; | ||
class FlattenedArrayView extends ArrayDataSource { | ||
constructor(parent, depth, cancellationToken = new cancellation_token_1.CancellationToken(), name) { | ||
const initial = parent.getData().flat(depth); | ||
super(initial, name); | ||
this.depth = depth; | ||
this.parent = parent; | ||
parent.listen((change) => { | ||
switch (change.operationDetailed) { | ||
case 'removeLeft': | ||
case 'removeRight': | ||
case 'remove': | ||
case 'swap': | ||
case 'replace': | ||
case 'insert': | ||
case 'merge': | ||
this.refresh(); | ||
break; | ||
case 'clear': | ||
this.clear(); | ||
break; | ||
case 'prepend': | ||
this.unshift(...change.items.flat(this.depth)); | ||
break; | ||
case 'append': | ||
this.appendArray(change.items.flat(this.depth)); | ||
break; | ||
break; | ||
} | ||
}, cancellationToken); | ||
} | ||
refresh() { | ||
this.merge(this.parent.getData().flat(this.depth)); | ||
} | ||
} | ||
exports.FlattenedArrayView = FlattenedArrayView; | ||
class MappedArrayView extends ArrayDataSource { | ||
@@ -669,3 +714,3 @@ constructor(parent, mapper, cancellationToken = new cancellation_token_1.CancellationToken(), name) { | ||
else if (source[i] !== change.newState[i]) { | ||
const index = source.indexOf(change.newState[i]); | ||
const index = source.indexOf(change.newState[i], i); | ||
if (index !== -1) { | ||
@@ -705,4 +750,3 @@ const a = this.data[i]; | ||
refresh() { | ||
//@ts-ignore | ||
this.merge(this.parent.data.map(this.mapper)); | ||
this.merge(this.parent.getData().map(this.mapper)); | ||
} | ||
@@ -713,6 +757,3 @@ } | ||
constructor(parent, cancellationToken = new cancellation_token_1.CancellationToken(), name) { | ||
const initial = parent | ||
.getData() | ||
.slice() | ||
.reverse(); | ||
const initial = parent.getData().slice().reverse(); | ||
super(initial, name); | ||
@@ -758,6 +799,3 @@ this.parent = parent; | ||
refresh() { | ||
this.merge(this.parent | ||
.getData() | ||
.slice() | ||
.reverse()); | ||
this.merge(this.parent.getData().slice().reverse()); | ||
} | ||
@@ -845,6 +883,3 @@ } | ||
constructor(parent, comparator, cancellationToken = new cancellation_token_1.CancellationToken(), name) { | ||
const initial = parent | ||
.getData() | ||
.slice() | ||
.sort(comparator); | ||
const initial = parent.getData().slice().sort(comparator); | ||
super(initial, name); | ||
@@ -891,6 +926,3 @@ this.parent = parent; | ||
refresh() { | ||
this.merge(this.parent | ||
.getData() | ||
.slice() | ||
.sort(this.comparator)); | ||
this.merge(this.parent.getData().slice().sort(this.comparator)); | ||
} | ||
@@ -897,0 +929,0 @@ } |
@@ -5,4 +5,15 @@ import { DataSource, ArrayDataSource } from './data_source'; | ||
import { CancellationToken } from '../utilities/cancellation_token'; | ||
import { ObjectDataSource } from './object_data_source'; | ||
/** | ||
* Convenience function to update a stream at fixed intervals | ||
*/ | ||
export declare function intervalEmitter<T = void>(target: DataSource<T> | DuplexDataSource<T> | Stream<T, any> | ArrayDataSource<T>, interval: number, value: T, cancellationToken?: CancellationToken): void; | ||
/** | ||
* Convenience function to stream the window size to a data source | ||
*/ | ||
export declare function windowSizeEmitter(target: ObjectDataSource<{ | ||
width: number; | ||
height: number; | ||
}>, debounce?: number, cancellationToken?: CancellationToken): void; | ||
/** | ||
* Calls the callback every animation frame with a number from 0 to 1 indicating how far along in the animation timeline it is. | ||
@@ -12,3 +23,6 @@ * | ||
export declare function animate(cb: (progress: number) => void, time: number, cancellationToken: CancellationToken): Promise<void>; | ||
/** | ||
* Convenience function to stream animate to a datasource | ||
*/ | ||
export declare function tweenEmitter(target: DataSource<number> | DuplexDataSource<number> | Stream<number, any> | ArrayDataSource<number>, duration: number, startValue: number, endValue: number, interpolation?: (v: number) => number, cancellationToken?: CancellationToken): Promise<void>; | ||
//# sourceMappingURL=emitters.d.ts.map |
"use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.tweenEmitter = exports.animate = exports.intervalEmitter = void 0; | ||
exports.tweenEmitter = exports.animate = exports.windowSizeEmitter = exports.intervalEmitter = void 0; | ||
const data_source_1 = require("./data_source"); | ||
const duplex_data_source_1 = require("./duplex_data_source"); | ||
const cancellation_token_1 = require("../utilities/cancellation_token"); | ||
const data_source_operators_1 = require("./data_source_operators"); | ||
/** | ||
* Convenience function to update a stream at fixed intervals | ||
*/ | ||
function intervalEmitter(target, interval, value, cancellationToken) { | ||
@@ -22,2 +26,21 @@ (cancellationToken !== null && cancellationToken !== void 0 ? cancellationToken : new cancellation_token_1.CancellationToken()).setInterval(() => { | ||
/** | ||
* Convenience function to stream the window size to a data source | ||
*/ | ||
function windowSizeEmitter(target, debounce = 100, cancellationToken) { | ||
cancellationToken !== null && cancellationToken !== void 0 ? cancellationToken : (cancellationToken = new cancellation_token_1.CancellationToken()); | ||
const updateStream = new data_source_1.DataSource(); | ||
cancellationToken.registerDomEvent(window, 'resize', () => { | ||
updateStream.update(); | ||
}); | ||
target.assign({ | ||
width: window.innerWidth, | ||
height: window.innerHeight | ||
}); | ||
updateStream.transform(data_source_operators_1.dsDebounce(debounce), data_source_operators_1.dsTap(() => target.assign({ | ||
width: window.innerWidth, | ||
height: window.innerHeight | ||
}))); | ||
} | ||
exports.windowSizeEmitter = windowSizeEmitter; | ||
/** | ||
* Calls the callback every animation frame with a number from 0 to 1 indicating how far along in the animation timeline it is. | ||
@@ -44,2 +67,5 @@ * | ||
exports.animate = animate; | ||
/** | ||
* Convenience function to stream animate to a datasource | ||
*/ | ||
function tweenEmitter(target, duration, startValue, endValue, interpolation, cancellationToken) { | ||
@@ -46,0 +72,0 @@ return animate((progress) => { |
@@ -13,2 +13,3 @@ import { InputProps } from '../nodes/input'; | ||
static attach(aurumRenderable: Renderable, dom: HTMLElement): CancellationToken; | ||
static fragment(): void; | ||
static factory(node: string | ((props: any, children: Renderable[], api: AurumComponentAPI) => Renderable), args: MapLike<any>, ...innerNodes: Array<AurumElementModel<any> | DataSource<any> | ArrayDataSource<any>>): AurumElementModel<any>; | ||
@@ -15,0 +16,0 @@ } |
@@ -15,3 +15,3 @@ "use strict"; | ||
object: simple_dom_nodes_1.Object, | ||
optGroup: simple_dom_nodes_1.OptGroup, | ||
optgroup: simple_dom_nodes_1.OptGroup, | ||
picture: simple_dom_nodes_1.Picture, | ||
@@ -124,3 +124,8 @@ output: simple_dom_nodes_1.Output, | ||
} | ||
static fragment() { } | ||
static factory(node, args, ...innerNodes) { | ||
//@ts-ignore | ||
if (node === Aurum.fragment) { | ||
return innerNodes; | ||
} | ||
let name; | ||
@@ -127,0 +132,0 @@ let intrinsic = false; |
@@ -283,3 +283,3 @@ import { DomNodeCreator } from '../builtin_compoents/dom_adapter'; | ||
*/ | ||
export const OptGroup = DomNodeCreator('option', ['label', 'disabled']); | ||
export const OptGroup = DomNodeCreator('optgroup', ['label', 'disabled']); | ||
/** | ||
@@ -286,0 +286,0 @@ * @internal |
@@ -54,2 +54,3 @@ import { DataSource, ArrayDataSource, ReadOnlyDataSource } from '../stream/data_source'; | ||
attachToDom(node: HTMLElement, index: number): void; | ||
protected getStartIndex(): number; | ||
protected getWorkIndex(): number; | ||
@@ -56,0 +57,0 @@ protected getLastIndex(): number; |
@@ -76,2 +76,5 @@ import { diagnosticMode } from '../debug_mode'; | ||
} | ||
getStartIndex() { | ||
return this.getWorkIndex() - 1; | ||
} | ||
getWorkIndex() { | ||
@@ -131,3 +134,18 @@ if (this.lastStartIndex !== undefined && this.hostNode.childNodes[this.lastStartIndex] === this.contentStartMarker) { | ||
} | ||
offset += child.getLastIndex() - i - offset - workIndex; | ||
if (child.getStartIndex() === i + workIndex + offset) { | ||
offset += child.getLastIndex() - i - offset - workIndex; | ||
} | ||
else { | ||
let start = child.getStartIndex(); | ||
let end = child.getLastIndex(); | ||
for (let ptr = start, swapIteration = 0; ptr <= end; ptr++, swapIteration++) { | ||
const itemA = this.hostNode.childNodes[i + workIndex + offset + swapIteration]; | ||
const itemB = this.hostNode.childNodes[ptr]; | ||
const parentA = itemA.parentNode; | ||
const siblingA = itemA.nextSibling === itemB ? itemB : itemA.nextSibling; | ||
itemB.parentNode.insertBefore(itemA, itemB); | ||
parentA.insertBefore(itemB, siblingA); | ||
} | ||
offset += child.getLastIndex() - i - offset - workIndex; | ||
} | ||
continue; | ||
@@ -436,2 +454,9 @@ } | ||
const itemB = this.children[change.index2]; | ||
if (itemA instanceof HTMLElement && itemB instanceof HTMLElement) { | ||
optimized = true; | ||
const parentA = itemA.parentNode; | ||
const siblingA = itemA.nextSibling === itemB ? itemB : itemA.nextSibling; | ||
itemB.parentNode.insertBefore(itemA, itemB); | ||
parentA.insertBefore(itemB, siblingA); | ||
} | ||
this.children[change.index2] = itemA; | ||
@@ -438,0 +463,0 @@ this.children[change.index] = itemB; |
import { Renderable } from './aurum_element'; | ||
/** | ||
* Generates a style tag with the provided style as content, supports data sources duplex data sources and streams instead of strings in the template. | ||
* Generates a style tag with the provided style as content, supports data sources, duplex data sources and streams instead of strings in the template. | ||
* Updates style content if any of the datasources used updates. | ||
@@ -5,0 +5,0 @@ */ |
@@ -7,3 +7,3 @@ import { DataSource } from '../stream/data_source'; | ||
/** | ||
* Generates a style tag with the provided style as content, supports data sources duplex data sources and streams instead of strings in the template. | ||
* Generates a style tag with the provided style as content, supports data sources, duplex data sources and streams instead of strings in the template. | ||
* Updates style content if any of the datasources used updates. | ||
@@ -10,0 +10,0 @@ */ |
@@ -313,2 +313,3 @@ import { AurumServerInfo } from '../aurum_server/aurum_server_client'; | ||
toArray(): T[]; | ||
flat(depth?: number, cancellationToken?: CancellationToken): FlattenedArrayView<FlatArray<T, typeof depth>>; | ||
reverse(cancellationToken?: CancellationToken): ReversedArrayView<T>; | ||
@@ -323,2 +324,8 @@ sort(comparator: (a: T, b: T) => number, dependencies?: ReadOnlyDataSource<any>[], cancellationToken?: CancellationToken): SortedArrayView<T>; | ||
} | ||
export declare class FlattenedArrayView<T> extends ArrayDataSource<T> { | ||
private parent; | ||
private depth; | ||
constructor(parent: ArrayDataSource<T[]>, depth: number, cancellationToken?: CancellationToken, name?: string); | ||
refresh(): void; | ||
} | ||
export declare class MappedArrayView<D, T> extends ArrayDataSource<T> { | ||
@@ -325,0 +332,0 @@ private parent; |
@@ -488,2 +488,8 @@ import { syncArrayDataSource, syncDataSource } from '../aurum_server/aurum_server_client'; | ||
merge(newData) { | ||
if (newData.length === 0) { | ||
return this.clear(); | ||
} | ||
if (newData === this.data) { | ||
return; | ||
} | ||
const old = this.data; | ||
@@ -570,2 +576,6 @@ this.data = newData.slice(); | ||
} | ||
flat(depth = 1, cancellationToken) { | ||
const view = new FlattenedArrayView(this, depth, cancellationToken, this.name + '.flat()'); | ||
return view; | ||
} | ||
reverse(cancellationToken) { | ||
@@ -618,2 +628,36 @@ const view = new ReversedArrayView(this, cancellationToken, this.name + '.reverse()'); | ||
} | ||
export class FlattenedArrayView extends ArrayDataSource { | ||
constructor(parent, depth, cancellationToken = new CancellationToken(), name) { | ||
const initial = parent.getData().flat(depth); | ||
super(initial, name); | ||
this.depth = depth; | ||
this.parent = parent; | ||
parent.listen((change) => { | ||
switch (change.operationDetailed) { | ||
case 'removeLeft': | ||
case 'removeRight': | ||
case 'remove': | ||
case 'swap': | ||
case 'replace': | ||
case 'insert': | ||
case 'merge': | ||
this.refresh(); | ||
break; | ||
case 'clear': | ||
this.clear(); | ||
break; | ||
case 'prepend': | ||
this.unshift(...change.items.flat(this.depth)); | ||
break; | ||
case 'append': | ||
this.appendArray(change.items.flat(this.depth)); | ||
break; | ||
break; | ||
} | ||
}, cancellationToken); | ||
} | ||
refresh() { | ||
this.merge(this.parent.getData().flat(this.depth)); | ||
} | ||
} | ||
export class MappedArrayView extends ArrayDataSource { | ||
@@ -663,3 +707,3 @@ constructor(parent, mapper, cancellationToken = new CancellationToken(), name) { | ||
else if (source[i] !== change.newState[i]) { | ||
const index = source.indexOf(change.newState[i]); | ||
const index = source.indexOf(change.newState[i], i); | ||
if (index !== -1) { | ||
@@ -699,4 +743,3 @@ const a = this.data[i]; | ||
refresh() { | ||
//@ts-ignore | ||
this.merge(this.parent.data.map(this.mapper)); | ||
this.merge(this.parent.getData().map(this.mapper)); | ||
} | ||
@@ -706,6 +749,3 @@ } | ||
constructor(parent, cancellationToken = new CancellationToken(), name) { | ||
const initial = parent | ||
.getData() | ||
.slice() | ||
.reverse(); | ||
const initial = parent.getData().slice().reverse(); | ||
super(initial, name); | ||
@@ -751,6 +791,3 @@ this.parent = parent; | ||
refresh() { | ||
this.merge(this.parent | ||
.getData() | ||
.slice() | ||
.reverse()); | ||
this.merge(this.parent.getData().slice().reverse()); | ||
} | ||
@@ -835,6 +872,3 @@ } | ||
constructor(parent, comparator, cancellationToken = new CancellationToken(), name) { | ||
const initial = parent | ||
.getData() | ||
.slice() | ||
.sort(comparator); | ||
const initial = parent.getData().slice().sort(comparator); | ||
super(initial, name); | ||
@@ -881,6 +915,3 @@ this.parent = parent; | ||
refresh() { | ||
this.merge(this.parent | ||
.getData() | ||
.slice() | ||
.sort(this.comparator)); | ||
this.merge(this.parent.getData().slice().sort(this.comparator)); | ||
} | ||
@@ -887,0 +918,0 @@ } |
@@ -5,4 +5,15 @@ import { DataSource, ArrayDataSource } from './data_source'; | ||
import { CancellationToken } from '../utilities/cancellation_token'; | ||
import { ObjectDataSource } from './object_data_source'; | ||
/** | ||
* Convenience function to update a stream at fixed intervals | ||
*/ | ||
export declare function intervalEmitter<T = void>(target: DataSource<T> | DuplexDataSource<T> | Stream<T, any> | ArrayDataSource<T>, interval: number, value: T, cancellationToken?: CancellationToken): void; | ||
/** | ||
* Convenience function to stream the window size to a data source | ||
*/ | ||
export declare function windowSizeEmitter(target: ObjectDataSource<{ | ||
width: number; | ||
height: number; | ||
}>, debounce?: number, cancellationToken?: CancellationToken): void; | ||
/** | ||
* Calls the callback every animation frame with a number from 0 to 1 indicating how far along in the animation timeline it is. | ||
@@ -12,3 +23,6 @@ * | ||
export declare function animate(cb: (progress: number) => void, time: number, cancellationToken: CancellationToken): Promise<void>; | ||
/** | ||
* Convenience function to stream animate to a datasource | ||
*/ | ||
export declare function tweenEmitter(target: DataSource<number> | DuplexDataSource<number> | Stream<number, any> | ArrayDataSource<number>, duration: number, startValue: number, endValue: number, interpolation?: (v: number) => number, cancellationToken?: CancellationToken): Promise<void>; | ||
//# sourceMappingURL=emitters.d.ts.map |
@@ -1,4 +0,8 @@ | ||
import { ArrayDataSource } from './data_source'; | ||
import { DataSource, ArrayDataSource } from './data_source'; | ||
import { DuplexDataSource } from './duplex_data_source'; | ||
import { CancellationToken, registerAnimationLoop } from '../utilities/cancellation_token'; | ||
import { dsDebounce, dsTap } from './data_source_operators'; | ||
/** | ||
* Convenience function to update a stream at fixed intervals | ||
*/ | ||
export function intervalEmitter(target, interval, value, cancellationToken) { | ||
@@ -18,2 +22,20 @@ (cancellationToken ?? new CancellationToken()).setInterval(() => { | ||
/** | ||
* Convenience function to stream the window size to a data source | ||
*/ | ||
export function windowSizeEmitter(target, debounce = 100, cancellationToken) { | ||
cancellationToken ??= new CancellationToken(); | ||
const updateStream = new DataSource(); | ||
cancellationToken.registerDomEvent(window, 'resize', () => { | ||
updateStream.update(); | ||
}); | ||
target.assign({ | ||
width: window.innerWidth, | ||
height: window.innerHeight | ||
}); | ||
updateStream.transform(dsDebounce(debounce), dsTap(() => target.assign({ | ||
width: window.innerWidth, | ||
height: window.innerHeight | ||
}))); | ||
} | ||
/** | ||
* Calls the callback every animation frame with a number from 0 to 1 indicating how far along in the animation timeline it is. | ||
@@ -39,2 +61,5 @@ * | ||
} | ||
/** | ||
* Convenience function to stream animate to a datasource | ||
*/ | ||
export function tweenEmitter(target, duration, startValue, endValue, interpolation, cancellationToken) { | ||
@@ -41,0 +66,0 @@ return animate((progress) => { |
@@ -13,2 +13,3 @@ import { InputProps } from '../nodes/input'; | ||
static attach(aurumRenderable: Renderable, dom: HTMLElement): CancellationToken; | ||
static fragment(): void; | ||
static factory(node: string | ((props: any, children: Renderable[], api: AurumComponentAPI) => Renderable), args: MapLike<any>, ...innerNodes: Array<AurumElementModel<any> | DataSource<any> | ArrayDataSource<any>>): AurumElementModel<any>; | ||
@@ -15,0 +16,0 @@ } |
@@ -12,3 +12,3 @@ import { Input } from '../nodes/input'; | ||
object: Object, | ||
optGroup: OptGroup, | ||
optgroup: OptGroup, | ||
picture: Picture, | ||
@@ -121,3 +121,8 @@ output: Output, | ||
} | ||
static fragment() { } | ||
static factory(node, args, ...innerNodes) { | ||
//@ts-ignore | ||
if (node === Aurum.fragment) { | ||
return innerNodes; | ||
} | ||
let name; | ||
@@ -124,0 +129,0 @@ let intrinsic = false; |
@@ -25,3 +25,3 @@ import { assert } from 'chai'; | ||
it('setTimeout should fire if cancel occurs after', () => { | ||
return new Promise((resolve) => { | ||
return new Promise<void>((resolve) => { | ||
const token = new CancellationToken(); | ||
@@ -28,0 +28,0 @@ token.setTimeout(() => { |
@@ -12,2 +12,3 @@ { | ||
"strictFunctionTypes": true, | ||
"jsxFragmentFactory": "Aurum.fragment", | ||
"jsxFactory": "Aurum.factory", | ||
@@ -14,0 +15,0 @@ "declaration": true, |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
6665485
265
129267