seitu/dist/solid/components/index.d.mts

import { i as Subscribable, n as Readable } from "../../index-B0IeflOl.mjs";
import { UseSubscriptionOptions } from "../hooks/index.mjs";
import { Accessor, JSX } from "solid-js";
//#region src/solid/components/index.d.ts
interface SubscriptionProps<S extends Subscribable<any> & Readable<any>, R = S['~']['output']> extends Pick<UseSubscriptionOptions<S, R>, 'selector'> {
  value: S;
  children: (value: Accessor<R>) => JSX.Element;
}
/**
 * Subscribes to a value and passes an accessor to `children` (runs once; call
 * `value()` in JSX). Prefer over the primitive when you want a component API.
 *
 * @example Basic usage
 * ```tsx
 * import { createWebStorage } from 'seitu/web'
 * import { Subscription } from 'seitu/solid'
 * import * as z from 'zod'
 *
 * const sessionStorage = createWebStorage({
 *   type: 'sessionStorage',
 *   schemas: { count: z.number(), name: z.string() },
 *   defaultValues: { count: 0, name: '' },
 * })
 *
 * function Page() {
 *   return (
 *     <Subscription value={sessionStorage}>
 *       {value => <div>{value().count}</div>}
 *     </Subscription>
 *   )
 * }
 * ```
 *
 * @example With selector
 * ```tsx
 * import { createWebStorage } from 'seitu/web'
 * import { Subscription } from 'seitu/solid'
 * import * as z from 'zod'
 *
 * const sessionStorage = createWebStorage({
 *   type: 'sessionStorage',
 *   schemas: { count: z.number(), name: z.string() },
 *   defaultValues: { count: 0, name: '' },
 * })
 *
 * function Page() {
 *   return (
 *     <Subscription value={sessionStorage} selector={v => v.count}>
 *       {count => <div>{count()}</div>}
 *     </Subscription>
 *   )
 * }
 * ```
 */
declare function Subscription<S extends Subscribable<any> & Readable<any>, R = S['~']['output']>(props: SubscriptionProps<S, R>): JSX.Element;
//#endregion
export { Subscription, SubscriptionProps };