mobservable
Advanced tools
mobservable - npm Package Compare versions
Comparing version 1.0.0-alpha.1 to 1.0.0-alpha.2
| # 0.7.0 | ||
@@ -13,4 +14,2 @@ | ||
| * Reintroduced `expr(func)` as shorthand for `makeReactive(func)()`, which is useful to create temporarily views inside views | ||
| TODO: | ||
| * Deprecated the options object that could be passed to `makeReactive`. | ||
@@ -17,0 +16,0 @@ |
@@ -64,15 +64,14 @@ (function webpackUniversalModuleDefinition(root, factory) { | ||
| var extras_1 = __webpack_require__(3); | ||
| var SimpleEventEmitter = __webpack_require__(6); | ||
| __export(__webpack_require__(11)); | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| exports.default = core.makeReactive; | ||
| exports.default = core.observable; | ||
| var core_1 = __webpack_require__(1); | ||
| exports.isReactive = core_1.isReactive; | ||
| exports.makeReactive = core_1.makeReactive; | ||
| exports.extendReactive = core_1.extendReactive; | ||
| exports.isObservable = core_1.isObservable; | ||
| exports.observable = core_1.observable; | ||
| exports.extendObservable = core_1.extendObservable; | ||
| exports.asReference = core_1.asReference; | ||
| exports.asFlat = core_1.asFlat; | ||
| exports.asStructure = core_1.asStructure; | ||
| exports.observable = core_1.observable; | ||
| exports.observe = core_1.observe; | ||
| exports.sideEffect = core_1.sideEffect; | ||
| exports.observeUntil = core_1.observeUntil; | ||
@@ -100,2 +99,3 @@ exports.observeAsync = core_1.observeAsync; | ||
| quickDiff: utils_1.quickDiff, | ||
| SimpleEventEmitter: SimpleEventEmitter | ||
| }; | ||
@@ -126,38 +126,29 @@ exports.extras = { | ||
| var scheduler_1 = __webpack_require__(10); | ||
| function makeReactive(v, scopeOrName, name) { | ||
| if (isReactive(v)) | ||
| function observable(v, keyOrScope) { | ||
| if (typeof arguments[1] === "string") | ||
| return observableDecorator.apply(null, arguments); | ||
| if (isObservable(v)) | ||
| return v; | ||
| var opts = utils_1.isPlainObject(scopeOrName) ? scopeOrName : {}; | ||
| var _a = getValueModeFromValue(v, ValueMode.Recursive), mode = _a[0], value = _a[1]; | ||
| if (opts.recurse === false) { | ||
| console.warn("[mobservable.makeReactive] option 'recurse: false' is deprecated, use 'mobservable.asFlat' instead"); | ||
| mode = ValueMode.Flat; | ||
| } | ||
| else if (opts.as === "reference") { | ||
| console.warn("[mobservable.makeReactive] option 'as: \"reference\"' is deprecated, use 'mobservable.asReference' instead"); | ||
| mode = ValueMode.Reference; | ||
| } | ||
| var sourceType = mode === ValueMode.Reference ? ValueType.Reference : getTypeOfValue(value); | ||
| var scope = opts.scope || (scopeOrName && typeof scopeOrName === "object" ? scopeOrName : null); | ||
| var context = { | ||
| name: name || opts.name, | ||
| object: opts.context || opts.scope | ||
| }; | ||
| switch (sourceType) { | ||
| case ValueType.Reference: | ||
| case ValueType.ComplexObject: | ||
| return toGetterSetterFunction(new observablevalue_1.ObservableValue(value, mode, context)); | ||
| return toGetterSetterFunction(new observablevalue_1.ObservableValue(value, mode, null)); | ||
| case ValueType.ComplexFunction: | ||
| throw new Error("[mobservable.makeReactive] Creating reactive functions from functions with multiple arguments is currently not supported, see https://github.com/mweststrate/mobservable/issues/12"); | ||
| case ValueType.ViewFunction: | ||
| if (!context.name) | ||
| context.name = value.name; | ||
| return toGetterSetterFunction(new observableview_1.ObservableView(value, opts.scope || opts.context, context, mode === ValueMode.Structure)); | ||
| case ValueType.ViewFunction: { | ||
| var context = { | ||
| name: value.name, | ||
| object: value | ||
| }; | ||
| return toGetterSetterFunction(new observableview_1.ObservableView(value, keyOrScope, context, mode === ValueMode.Structure)); | ||
| } | ||
| case ValueType.Array: | ||
| case ValueType.PlainObject: | ||
| return makeChildReactive(value, mode, context); | ||
| return makeChildObservable(value, mode, null); | ||
| } | ||
| throw "Illegal State"; | ||
| } | ||
| exports.makeReactive = makeReactive; | ||
| exports.observable = observable; | ||
| function asReference(value) { | ||
@@ -175,3 +166,3 @@ return new AsReference(value); | ||
| exports.asFlat = asFlat; | ||
| function isReactive(value) { | ||
| function isObservable(value) { | ||
| if (value === null || value === undefined) | ||
@@ -181,12 +172,7 @@ return false; | ||
| } | ||
| exports.isReactive = isReactive; | ||
| function sideEffect(func, scope) { | ||
| console.warn("[mobservable.sideEffect] 'sideEffect' has been renamed to 'observe' and will be removed in a later version."); | ||
| return observe(func, scope); | ||
| } | ||
| exports.sideEffect = sideEffect; | ||
| exports.isObservable = isObservable; | ||
| function observe(view, scope) { | ||
| var _a = getValueModeFromValue(view, ValueMode.Recursive), mode = _a[0], unwrappedView = _a[1]; | ||
| var observable = new observableview_1.ObservableView(unwrappedView, scope, { | ||
| object: scope, | ||
| object: scope || view, | ||
| name: view.name | ||
@@ -234,23 +220,20 @@ }, mode === ValueMode.Structure); | ||
| exports.observeAsync = observeAsync; | ||
| function when(predicate, effect, scope) { | ||
| console.error("[mobservable.when] deprecated, please use 'mobservable.observeUntil'"); | ||
| return observeUntil(predicate, effect, scope); | ||
| } | ||
| exports.when = when; | ||
| function expr(expr, scope) { | ||
| if (!dnode_1.isComputingView()) | ||
| throw new Error("[mobservable.expr] 'expr' can only be used inside a computed value."); | ||
| return makeReactive(expr, scope)(); | ||
| return observable(expr, scope)(); | ||
| } | ||
| exports.expr = expr; | ||
| function extendReactive(target, properties, context) { | ||
| return extendReactiveHelper(target, properties, ValueMode.Recursive, context); | ||
| function extendObservable(target, properties, context) { | ||
| return extendObservableHelper(target, properties, ValueMode.Recursive, context); | ||
| } | ||
| exports.extendReactive = extendReactive; | ||
| function observable(target, key, baseDescriptor) { | ||
| exports.extendObservable = extendObservable; | ||
| function observableDecorator(target, key, baseDescriptor) { | ||
| var isDecoratingProperty = baseDescriptor && !baseDescriptor.hasOwnProperty("value"); | ||
| var descriptor = baseDescriptor || {}; | ||
| var baseValue = isDecoratingProperty ? descriptor.get : descriptor.value; | ||
| if (!target || typeof target !== "object") | ||
| throw new Error("The @observable decorator can only be used on objects"); | ||
| if (!isDecoratingProperty && typeof baseValue === "function") | ||
| throw new Error("@observable functions are deprecated. Use @observable on a getter function if you want to create a view, or wrap the value in 'asReference' if you want to store a value (found on member '" + key + "')."); | ||
| throw new Error("@observable functions are not supported. Use @observable on a getter function if you want to create a view, or wrap the value in 'asReference' if you want to store a value (found on member '" + key + "')."); | ||
| if (isDecoratingProperty) { | ||
@@ -281,3 +264,2 @@ if (typeof baseValue !== "function") | ||
| } | ||
| exports.observable = observable; | ||
| function toJSON(source) { | ||
@@ -298,27 +280,6 @@ if (!source) | ||
| exports.toJSON = toJSON; | ||
| function toJson(source) { | ||
| console.warn("mobservable.toJson is deprecated, use mobservable.toJSON instead"); | ||
| return toJSON(source); | ||
| } | ||
| exports.toJson = toJson; | ||
| function transaction(action) { | ||
| return scheduler_1.batch(action); | ||
| return scheduler_1.transaction(action); | ||
| } | ||
| exports.transaction = transaction; | ||
| function observeUntilInvalid(func, onInvalidate, context) { | ||
| console.warn("mobservable.observeUntilInvalid is deprecated and will be removed in 0.7"); | ||
| var hasRun = false; | ||
| var result; | ||
| var disposer = observe(function () { | ||
| if (!hasRun) { | ||
| hasRun = true; | ||
| result = func(); | ||
| } | ||
| else { | ||
| onInvalidate(); | ||
| } | ||
| }); | ||
| return [result, disposer, disposer['$mobservable']]; | ||
| } | ||
| exports.observeUntilInvalid = observeUntilInvalid; | ||
| exports.logLevel = 1; | ||
@@ -358,3 +319,3 @@ exports.strict = true; | ||
| exports.getTypeOfValue = getTypeOfValue; | ||
| function extendReactiveHelper(target, properties, mode, context) { | ||
| function extendObservableHelper(target, properties, mode, context) { | ||
| var meta = observableobject_1.ObservableObject.asReactive(target, context, mode); | ||
@@ -367,3 +328,3 @@ for (var key in properties) | ||
| } | ||
| exports.extendReactiveHelper = extendReactiveHelper; | ||
| exports.extendObservableHelper = extendObservableHelper; | ||
| function toGetterSetterFunction(observable) { | ||
@@ -420,5 +381,5 @@ var f = function (value) { | ||
| exports.getValueModeFromValue = getValueModeFromValue; | ||
| function makeChildReactive(value, parentMode, context) { | ||
| function makeChildObservable(value, parentMode, context) { | ||
| var childMode; | ||
| if (isReactive(value)) | ||
| if (isObservable(value)) | ||
| return value; | ||
@@ -445,7 +406,7 @@ switch (parentMode) { | ||
| if (utils_1.isPlainObject(value)) | ||
| return extendReactiveHelper(value, value, childMode, context); | ||
| return extendObservableHelper(value, value, childMode, context); | ||
| return value; | ||
| var _a; | ||
| } | ||
| exports.makeChildReactive = makeChildReactive; | ||
| exports.makeChildObservable = makeChildObservable; | ||
| function assertUnwrapped(value, message) { | ||
@@ -493,3 +454,2 @@ if (value instanceof AsReference || value instanceof AsStructure || value instanceof AsFlat) | ||
| function DataNode(context) { | ||
| this.context = context; | ||
| this.id = ++mobservableId; | ||
@@ -500,4 +460,7 @@ this.state = NodeState.READY; | ||
| this.externalRefenceCount = 0; | ||
| if (!context) | ||
| context = { name: undefined, object: undefined }; | ||
| if (!context.name) | ||
| context.name = "[m#" + this.id + "]"; | ||
| this.context = context; | ||
| } | ||
@@ -695,3 +658,3 @@ DataNode.prototype.setRefCount = function (delta) { | ||
| function getDNode(thing, property) { | ||
| if (!core_1.isReactive(thing)) | ||
| if (!core_1.isObservable(thing)) | ||
| throw new Error("[mobservable.getDNode] " + thing + " doesn't seem to be reactive"); | ||
@@ -1043,5 +1006,2 @@ if (property !== undefined) { | ||
| exports.once = once; | ||
| function noop() { | ||
| } | ||
| exports.noop = noop; | ||
| function unique(list) { | ||
@@ -1168,3 +1128,3 @@ var res = []; | ||
| function ObservableArrayAdministration(array, mode, context) { | ||
| _super.call(this, context); | ||
| _super.call(this, context ? context : { name: undefined, object: undefined }); | ||
| this.array = array; | ||
@@ -1174,4 +1134,4 @@ this.mode = mode; | ||
| this.changeEvent = new simpleeventemitter_1.default(); | ||
| if (!context.object) | ||
| context.object = array; | ||
| if (!this.context.object) | ||
| this.context.object = array; | ||
| } | ||
@@ -1253,3 +1213,3 @@ return ObservableArrayAdministration; | ||
| core_1.assertUnwrapped(value, "Array values cannot have modifiers"); | ||
| return core_1.makeChildReactive(value, this.$mobservable.mode, { | ||
| return core_1.makeChildObservable(value, this.$mobservable.mode, { | ||
| object: this.$mobservable.context.object, | ||
@@ -1286,7 +1246,2 @@ name: this.$mobservable.context.name + "[x]" | ||
| }; | ||
| ObservableArray.prototype.values = function () { | ||
| console.warn("mobservable.array.values is deprecated and will be removed in 0.7, use slice() instead"); | ||
| this.$mobservable.notifyObserved(); | ||
| return this.$mobservable.values.slice(); | ||
| }; | ||
| ObservableArray.prototype.toJSON = function () { | ||
@@ -1296,10 +1251,2 @@ this.$mobservable.notifyObserved(); | ||
| }; | ||
| ObservableArray.prototype.clone = function () { | ||
| console.warn("mobservable.array.clone is deprecated and will be removed in 0.7"); | ||
| this.$mobservable.notifyObserved(); | ||
| return new ObservableArray(this.$mobservable.values, this.$mobservable.mode, { | ||
| object: null, | ||
| name: this.$mobservable.context.name + "[clone]" | ||
| }); | ||
| }; | ||
| ObservableArray.prototype.find = function (predicate, thisArg, fromIndex) { | ||
@@ -1474,3 +1421,3 @@ if (fromIndex === void 0) { fromIndex = 0; } | ||
| ObservableValue.prototype.makeReferenceValueReactive = function (value) { | ||
| return core_1.makeChildReactive(value, this.mode, this.context); | ||
| return core_1.makeChildObservable(value, this.mode, this.context); | ||
| }; | ||
@@ -1543,3 +1490,3 @@ ObservableValue.prototype.set = function (newValue) { | ||
| } | ||
| function batch(action) { | ||
| function transaction(action) { | ||
| inBatch += 1; | ||
@@ -1557,3 +1504,3 @@ try { | ||
| } | ||
| exports.batch = batch; | ||
| exports.transaction = transaction; | ||
| //# sourceMappingURL=scheduler.js.map | ||
@@ -1560,0 +1507,0 @@ |
@@ -1,24 +0,20 @@ | ||
| import { Lambda, IObservableArray, IObservableValue, IContextInfoStruct, IContextInfo } from './interfaces'; | ||
| import { Lambda, IObservableArray, IObservableValue, IContextInfoStruct } from './interfaces'; | ||
| import { ObservableValue } from './observablevalue'; | ||
| import { ObservableView } from './observableview'; | ||
| export declare function makeReactive<T>(value: T[], name?: string): IObservableArray<T>; | ||
| export declare function makeReactive<T>(value: () => T, nameOrScope?: string | Object, name?: string): IObservableValue<T>; | ||
| export declare function makeReactive<T extends string | number | boolean | Date | RegExp | Function | void>(value: T, name?: string): IObservableValue<T>; | ||
| export declare function makeReactive<T extends Object>(value: T, name?: string): T; | ||
| export declare function observable(target: Object, key: string, baseDescriptor?: PropertyDescriptor): any; | ||
| export declare function observable<T>(value: T[]): IObservableArray<T>; | ||
| export declare function observable<T, S extends Object>(value: () => T, thisArg: S): IObservableValue<T>; | ||
| export declare function observable<T extends string | number | boolean | Date | RegExp | Function | void>(value: T): IObservableValue<T>; | ||
| export declare function observable<T extends Object>(value: T): T; | ||
| export declare function asReference<T>(value: T): T; | ||
| export declare function asStructure<T>(value: T): T; | ||
| export declare function asFlat<T>(value: T): T; | ||
| export declare function isReactive(value: any): boolean; | ||
| export declare function sideEffect(func: Lambda, scope?: any): Lambda; | ||
| export declare function isObservable(value: any): boolean; | ||
| export declare function observe(view: Lambda, scope?: any): Lambda; | ||
| export declare function observeUntil(predicate: () => boolean, effect: Lambda, scope?: any): Lambda; | ||
| export declare function observeAsync<T>(view: () => T, effect: (latestValue: T) => void, delay?: number, scope?: any): Lambda; | ||
| export declare function when(predicate: () => boolean, effect: Lambda, scope?: any): Lambda; | ||
| export declare function expr<T>(expr: () => T, scope?: any): T; | ||
| export declare function extendReactive<A extends Object, B extends Object>(target: A, properties: B, context?: IContextInfoStruct): A & B; | ||
| export declare function observable(target: Object, key: string, baseDescriptor?: any): void; | ||
| export declare function extendObservable<A extends Object, B extends Object>(target: A, properties: B, context?: IContextInfoStruct): A & B; | ||
| export declare function toJSON(source: any): any; | ||
| export declare function toJson(source: any): any; | ||
| export declare function transaction<T>(action: () => T): T; | ||
| export declare function observeUntilInvalid<T>(func: () => T, onInvalidate: Lambda, context?: IContextInfo): [T, Lambda, any]; | ||
| export declare var logLevel: number; | ||
@@ -41,3 +37,3 @@ export declare var strict: boolean; | ||
| export declare function getTypeOfValue(value: any): ValueType; | ||
| export declare function extendReactiveHelper(target: any, properties: any, mode: ValueMode, context: IContextInfoStruct): Object; | ||
| export declare function extendObservableHelper(target: any, properties: any, mode: ValueMode, context: IContextInfoStruct): Object; | ||
| export declare function toGetterSetterFunction<T>(observable: ObservableValue<T> | ObservableView<T>): IObservableValue<T>; | ||
@@ -57,3 +53,3 @@ export declare class AsReference { | ||
| export declare function getValueModeFromValue(value: any, defaultMode: ValueMode): [ValueMode, any]; | ||
| export declare function makeChildReactive(value: any, parentMode: ValueMode, context: any): any; | ||
| export declare function makeChildObservable(value: any, parentMode: ValueMode, context: any): any; | ||
| export declare function assertUnwrapped(value: any, message: any): void; |
@@ -8,3 +8,2 @@ export declare function checkIfStateIsBeingModifiedDuringView(context: IContextInfoStruct): void; | ||
| export declare class DataNode { | ||
| context: IContextInfoStruct; | ||
| id: number; | ||
@@ -15,2 +14,3 @@ state: NodeState; | ||
| externalRefenceCount: number; | ||
| context: IContextInfoStruct; | ||
| constructor(context: IContextInfoStruct); | ||
@@ -17,0 +17,0 @@ setRefCount(delta: number): void; |
| import * as core from './core'; | ||
| import { IDependencyTree, IObserverTree, ITransitionEvent, Lambda } from './interfaces'; | ||
| import * as SimpleEventEmitter from './simpleeventemitter'; | ||
| export * from './interfaces'; | ||
| declare var _default: typeof core.makeReactive; | ||
| declare var _default: typeof core.observable; | ||
| export default _default; | ||
| export { isReactive, makeReactive, extendReactive, asReference, asFlat, asStructure, observable, observe, sideEffect, observeUntil, observeAsync, expr, transaction, toJSON, logLevel, strict } from './core'; | ||
| export { isObservable, observable, extendObservable, asReference, asFlat, asStructure, observe, observeUntil, observeAsync, expr, transaction, toJSON, logLevel, strict } from './core'; | ||
| export declare const _: { | ||
| isComputingView: () => boolean; | ||
| quickDiff: <T>(current: T[], base: T[]) => [T[], T[]]; | ||
| SimpleEventEmitter: typeof SimpleEventEmitter; | ||
| }; | ||
@@ -11,0 +13,0 @@ export declare const extras: { |
@@ -28,5 +28,3 @@ import { DataNode } from './dnode'; | ||
| replace(newItems: T[]): T[]; | ||
| values(): T[]; | ||
| toJSON(): T[]; | ||
| clone(): ObservableArray<T>; | ||
| find(predicate: (item: T, index: number, array: ObservableArray<T>) => boolean, thisArg?: any, fromIndex?: number): T; | ||
@@ -33,0 +31,0 @@ splice(index: number, deleteCount?: number, ...newItems: T[]): T[]; |
| import { Lambda } from './interfaces'; | ||
| export declare function schedule(func: Lambda): void; | ||
| export declare function batch<T>(action: () => T): T; | ||
| export declare function transaction<T>(action: () => T): T; |
| import { Lambda } from './interfaces'; | ||
| export declare function once(func: Lambda): Lambda; | ||
| export declare function noop(): void; | ||
| export declare function unique<T>(list: T[]): T[]; | ||
@@ -5,0 +4,0 @@ export declare function isPlainObject(value: any): boolean; |
| { | ||
| "name": "mobservable", | ||
| "version": "1.0.0-alpha.1", | ||
| "description": "Keeps views automatically in sync with state. Unobtrusively.", | ||
| "version": "1.0.0-alpha.2", | ||
| "description": "Observable data. Observing views.", | ||
| "main": "dist/mobservable.js", | ||
@@ -6,0 +6,0 @@ "typings": "dist/typings/index", |
@@ -51,8 +51,8 @@ # mobservable | ||
| ### mobservable.makeReactive | ||
| ### mobservable.observable | ||
| The first function is `makeReactive`. It is the swiss knife of mobservable and turns any data structure and function into its reactive counterpart. Objects, arrays, functions; they can all be made reactive. Reactiveness is contagious; new data that is put in reactive data will become reactive as well. To make our timer reactive, just change the first three lines of the code: | ||
| The first function is `observable`. It is the swiss knife of mobservable and turns any data structure and function into its reactive counterpart. Objects, arrays, functions; they can all be made reactive. Reactiveness is contagious; new data that is put in reactive data will become reactive as well. To make our timer reactive, just change the first three lines of the code: | ||
| ```javascript | ||
| var timerData = mobservable.makeReactive({ | ||
| var timerData = mobservable.observable({ | ||
| secondsPassed: 0 | ||
@@ -62,8 +62,8 @@ }); | ||
| ### mobservableReact.reactiveComponent | ||
| ### mobservableReact.observer | ||
| The second important function is `reactiveComponent` from the `mobservable-react` package. It turns a Reactjs component into a reactive one, that responds automatically to changes in data that is used by its render method. It can be used to wrap any react component, either created by using ES6 classes or `createClass`. So to fix the example, just update the timer definition to: | ||
| The second important function is `observer` from the `mobservable-react` package. It turns a Reactjs component into a reactive one, that responds automatically to changes in data that is used by its render method. It can be used to wrap any react component, either created by using ES6 classes or `createClass`. So to fix the example, just update the timer definition to: | ||
| ```javascript | ||
| var Timer = mobservableReact.reactiveComponent(React.createClass{ | ||
| var Timer = mobservableReact.observer(React.createClass{ | ||
| /** Omitted */ | ||
@@ -134,13 +134,13 @@ })); | ||
| **makeReactive(value, options?)** | ||
| **observable(value, options?)** | ||
| Turns a value into a reactive array, object, function, value or a reactive reference to a value. | ||
| **reactiveComponent(reactJsComponent)** | ||
| **observer(reactJsComponent)** | ||
| Provided by the `mobservable-react` packaege, turns a ReactJS component into a reactive one, that automatically re-renders if any reactive data that it uses is changed. | ||
| **extendReactive(target, properties)** | ||
| **extendObservable(target, properties)** | ||
| Extends an existing object with reactive properties. | ||
| **observe(function)** | ||
| Similar to `makeReactive(function)`. Exception the created reactive function will not be lazy, so that it is executed even when it has no observers on its own. | ||
| Similar to `observable(function)`. Exception the created reactive function will not be lazy, so that it is executed even when it has no observers on its own. | ||
| Useful to bridge reactive code to imperative code. | ||
@@ -147,0 +147,0 @@ |
New alerts
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
Fixed alerts
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
Worsened metrics
- Total package byte prevSize
- decreased by-2.89%
85625
- Lines of code
- decreased by-3.15%
1783
No dependency changes