/** * `provide` / `inject` — Web Component–native dependency injection. * * Uses a typed `CustomEvent` over the composed path: a descendant emits a * bubbling, non-cancelable `__bq_inject__` event, and the nearest ancestor that * has called `provide(key)` for the same key answers it via the event's * `detail.resolve` callback. No global state is involved. * * This is intentionally synchronous so that `inject()` can be called inside * `connected()` and the resolved value is available immediately. * * @module bquery/component */ /** * Strongly-typed injection key. The phantom `__type` property carries the * value type so consumers receive accurate types from `inject(key)`. */ export type InjectionKey = symbol & { __type?: T; }; /** * Create a new {@link InjectionKey}. */ export declare const injectionKey: (description: string) => InjectionKey; /** * Provide a value for the given key from the calling component host. * * Descendants that call {@link inject} with the same key receive this value. * Multiple providers for the same key are layered: the nearest ancestor wins. * * Must be called from a component lifecycle hook with access to the host element * (e.g. via `this`). The provider is removed when the component disconnects. * * @example * ```ts * const ThemeKey = injectionKey<{ dark: boolean }>('theme'); * * component('app-shell', { * connected() { * provide(this, ThemeKey, { dark: true }); * }, * render() { return html``; }, * }); * ``` */ export declare const provide: (host: EventTarget, key: string | InjectionKey, value: T) => void; /** * Look up the nearest ancestor that has called `provide()` with the given key. * * If no provider is found, returns the supplied `fallback` (or `undefined`). * * @example * ```ts * connected() { * const theme = inject(this, ThemeKey, { dark: false }); * console.log(theme.dark); * } * ``` */ export declare const inject: (host: EventTarget, key: string | InjectionKey, fallback?: T) => T | undefined; /** * Strongly-typed key for the enclosing `` context. Components that * render form inputs can `inject(this, formContextKey)` to discover the * surrounding form and auto-bind themselves. */ export declare const formContextKey: InjectionKey<{ registerField?: (name: string, host: HTMLElement) => () => void; setValue?: (name: string, value: unknown) => void; getValue?: (name: string) => unknown; }>; //# sourceMappingURL=inject.d.ts.map