Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
export function createComponent(
shape:
| Store
| {+[key: string]: Store | any, ...}
| ((props: Props) => Store),
renderProp: (props: Props, state: State) => React.Node,
): StoreView {
let storeFn: (props: Props) => Store
let store: Store
if (is.store(shape)) {
store = (shape: any)
} else if (typeof shape === 'function') {
storeFn = shape
} else {
if (typeof shape === 'object' && shape !== null) {
//$todo
store = createStoreObject(shape)
} else throw Error('shape should be a store or object with stores')
}
const storeName = store?.shortName ?? 'Unknown'
const mounted = createEvent(`${storeName}.View mounted`)
const unmounted = createEvent(`${storeName}.View unmounted`)
//prettier-ignore
const instanceFabric: (props: Props) => Store =
typeof shape === 'function'
? (storeFn: any)
export function useStore(store: Store): State {
if (!is.store(store)) throw Error('expect useStore argument to be a store')
const dispatch = useReducer(stateReducer, undefined, store.getState)[1]
const subscription = useMemo(() => {
//$off
const subscription: ReactSubscription = store.updates.watch(upd => {
if (!subscription.active) return
dispatch(upd)
})
subscription.active = true
return subscription
}, [store])
useIsomorphicLayoutEffect(
() => () => {
subscription.active = false
subscription()
},
[subscription],
.on(realmClearNode, (stats, unit) => {
if (is.store(unit)) {
return {
...stats,
store: [...stats.store.filter(store => store !== unit)],
}
}
if (is.event(unit)) {
return {
...stats,
event: [...stats.event.filter(event => event !== unit)],
}
}
if (is.effect(unit)) {
return {
...stats,
effect: [...stats.effect.filter(effect => effect !== unit)],
}
export function useStoreMap>({
store,
keys,
fn,
}: {|
+store: Store,
+keys: Keys,
fn(state: State, keys: Keys): Result,
|}): Result {
if (!is.store(store)) throw Error('useStoreMap expects a store')
if (!Array.isArray(keys)) throw Error('useStoreMap expects an array as keys')
if (typeof fn !== 'function') throw Error('useStoreMap expects a function')
const result: Store = useMemo(
() =>
createStore(fn(store.getState(), keys)).on(store, (_, state) =>
fn(state, keys),
),
keys,
)
const state = useStore(result)
useIsomorphicLayoutEffect(
() => () => {
result.off(store)
clearNode(result, {deep: true})
},
keys,
created() {
const vm: {
$options: {
effector?: () => Store | mixed
},
_subscription: any,
[key: string]: any
} = this
const key = 'state'
let shape = vm.$options.effector
if (typeof shape === 'function') {
shape = shape.call(vm)
}
if (shape) {
if (is.store(shape) /*:: && isStore(shape) */) {
//$off
Vue.util.defineReactive(vm, key, shape.getState())
vm._subscription = shape.subscribe(value => {
vm[key] = value
})
} else if (typeof shape === 'object' && shape !== null /*:: && !isStore(shape) */) {
const store = createStoreObject(shape)
for (const key in shape) {
//$off
Vue.util.defineReactive(vm, key, store.defaultState[key])
}
vm._subscription = store.subscribe(value => {
for (const key in value) {
vm[key] = value[key]
}
})
renderItem:
| {
keys?: any[],
fn(item: T, index: number): React.Node,
}
| ((item: T, index: number) => React.Node),
): React.Node {
let keys = []
let fn
if (typeof renderItem === 'object' && renderItem !== null) {
if (renderItem.keys) keys = renderItem.keys
fn = renderItem.fn
} else {
fn = renderItem
}
if (!is.store(list))
throw Error('expect useList first argument to be a store')
if (typeof fn !== 'function')
throw Error("expect useList's renderItem to be a function")
if (!Array.isArray(keys)) throw Error("expect useList's keys to be an array")
const Item = React.useMemo(() => {
const Item = ({index, keys}) => {
const item = useStoreMap({
store: list,
keys: [index, ...keys],
fn: (list, keys) => list[keys[0]],
})
return fnRef.current(item, index)
}
Item.displayName = `${list.shortName || 'Unknown'}.Item`
return React.memo(Item)
}, [list])