How to use the effector.is.store function in effector

To help you get started, we’ve selected a few effector examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github zerobias / effector / src / react / createComponent.js View on Github external
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)
github zerobias / effector / src / react / useStore.js View on Github external
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],
github zerobias / effector / website / editor / src / realm / init.js View on Github external
.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)],
      }
github zerobias / effector / src / react / useStore.js View on Github external
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,
github zerobias / effector / src / vue / mixin.js View on Github external
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]
          }
        })
github zerobias / effector / src / react / useList.js View on Github external
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])