How to use the svelte/store.readable function in svelte

To help you get started, we’ve selected a few svelte 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 kenrick95 / Raun / src / stores / RcStreamGroup.js View on Github external
import { readable } from 'svelte/store';
import { RcStream } from './RcStream';
import { OresQueue } from './Ores';
import { filterEvents } from './AppConfig';

/**
 * @var {Array>} eventGroups
 *
 * New events at the front
 */
let eventGroups = [];


export const RcStreamGroups = readable(eventGroups, async (set) => {
  RcStream.subscribe((events) => {
    if (!events || events.length < 1) {
      return;
    }
    const filteredEvents = filterEvents(events);


    const newEventIds = [];
    for (const newEvent of filteredEvents) {
      newEventIds.push({ revid: newEvent.revision.new, dbName: newEvent.wiki });
    }
    OresQueue.update((eventIds) => [...eventIds, ...newEventIds]);
    
    for (const newEvent of filteredEvents) {
      // TODO: These operations are expensive; O(N) on every new event received; see if we can improve
github ctx-core / ctx-core / packages / store / lib.ts View on Github external
export function derived__async(stores, fn, initial_value = null) {
	const single = !Array.isArray(stores)
	if (single) stores = [stores]
	const auto = fn.length < 2
	let value = {}
	return readable(initial_value, set=>{
		let inited = false
		const values = []
		let pending = 0
		// @ts-ignore
		async function sync():Promise {
			if (pending) return
			const result = await fn(single ? values[0] : values, set)
			if (auto && (value !== (value = result))) set(result)
		}
		const unsubscribers = stores.map((store, i)=>
			subscribe(
				store,
				value=>{
					values[i] = value
					pending &= ~(1 << i)
					if (inited) sync()
github timhall / svelte-apollo / src / query.ts View on Github external
initial_value = { data: initial_value } as any;
    } catch (err) {
      // Ignore preload errors
    }
  }

  // Create query and observe,
  // but don't subscribe directly to avoid firing duplicate value if initialized
  const observable_query = client.watchQuery(options);
  const { subscribe: subscribe_to_query } = observe(
    observable_query,
    initial_value
  );

  // Wrap the query subscription with a readable to prevent duplicate values
  const { subscribe } = readable(
    (initial_value as unknown) as Deferred,
    set => {
      subscribed = true;

      const skip_duplicate = initial_value !== undefined;
      let initialized = false;
      let skipped = false;

      const unsubscribe = subscribe_to_query(value => {
        if (skip_duplicate && initialized && !skipped) {
          skipped = true;
        } else {
          if (!initialized) initialized = true;
          set(value);
        }
      });
github pshrmn / curi / packages / svelte / src / index.js View on Github external
export function setup(router) {
  const initial = router.current();
  const response = readable(initial.response, set => {
    return router.observe(({ response }) => {
      set(response);
    });
  });
  const navigation = readable(initial.navigation, set => {
    return router.observe(({ navigation }) => {
      set(navigation);
    });
  });

  setContext(routerKey, router);
  setContext(responseKey, response);
  setContext(navigationKey, navigation);
}
github sveltejs / svelte / site / content / tutorial / 08-stores / 04-derived-stores / app-b / stores.js View on Github external
import { readable, derive } from 'svelte/store';

export const time = readable(function start(set) {
	const interval = setInterval(() => {
		set(new Date());
	}, 1000);

	return function stop() {
		clearInterval(interval);
	};
}, new Date());

const start = new Date();

export const elapsed = derive(
	time,
	$time => Math.round(($time - start) / 1000)
);
github sveltejs / svelte / site / content / examples / 07-stores / 02-readable-stores / stores.js View on Github external
import { readable } from 'svelte/store';

export const time = readable(new Date(), function start(set) {
	const interval = setInterval(() => {
		set(new Date());
	}, 1000);

	return function stop() {
		clearInterval(interval);
	};
});
github spaceavocado / svelte-router / src / router.js View on Github external
const createRouter = (opts) => {
  router = readable(new Router(opts));
  return router;
};
github halfnelson / svelte-native-realworld / app / stores / tags.ts View on Github external
import { readable } from 'svelte/store';
import { client } from '../lib/client'

interface TagResponse {
    tags: string[]
} 

export  const tags = readable([], set => {
    client.sendRequest('/tags', 'get', null).then( res =>
        set(res.tags)
    )
});
github sveltejs / svelte / site / content / tutorial / 08-stores / 03-readable-stores / app-b / stores.js View on Github external
import { readable } from 'svelte/store';

export const time = readable(new Date(), function start(set) {
	const interval = setInterval(() => {
		set(new Date());
	}, 1000);

	return function stop() {
		clearInterval(interval);
	};
});
github sveltejs / svelte / site / content / tutorial / 08-stores / 04-derived-stores / app-a / stores.js View on Github external
import { readable, derive } from 'svelte/store';

export const time = readable(function start(set) {
	const interval = setInterval(() => {
		set(new Date());
	}, 1000);

	return function stop() {
		clearInterval(interval);
	};
}, new Date());

const start = new Date();

export const elapsed = derive(
	time,
	$time => {}
);