"use client";
import { jsx as _jsx } from "react/jsx-runtime";
import { cn, resolvePresetClass } from "@stigmer/theme";
import { StigmerContext } from "./context";
import { DeploymentModeContext } from "./deployment-mode";
import { ColorModeContext, useSystemColorMode } from "./color-mode";
/**
 * React provider that distributes a {@link Stigmer} SDK client to
 * descendant components via {@link StigmerContext}.
 *
 * Renders a `<div class="stgm">` container that scopes Stigmer's
 * CSS reset and design tokens. External consumers importing
 * `@stigmer/react/styles.css` get isolated styles that do not
 * leak into the host application.
 *
 * The `colorMode` prop controls dark/light appearance via a
 * `data-stgm-color-mode` attribute on the scoping container.
 * Host applications pass their theme state directly — no ancestor
 * `.dark` class or Tailwind convention is required.
 *
 * Pass {@link StigmerProviderProps.preset | preset} to apply a
 * built-in theme, or use {@link StigmerProviderProps.className | className}
 * for custom styling.
 *
 * @example
 * ```tsx
 * const client = useMemo(
 *   () => new Stigmer({ baseUrl, getAccessToken }),
 *   [getAccessToken],
 * );
 *
 * <StigmerProvider client={client} preset="fintech" colorMode="dark">
 *   <App />
 * </StigmerProvider>
 * ```
 */
export function StigmerProvider({ client, children, deploymentMode = "cloud", preset, className, colorMode = "light", }) {
    const systemMode = useSystemColorMode();
    const resolvedMode = colorMode === "system" ? systemMode : colorMode;
    const presetClass = preset ? resolvePresetClass(preset) : "";
    return (_jsx(StigmerContext.Provider, { value: client, children: _jsx(DeploymentModeContext.Provider, { value: deploymentMode, children: _jsx(ColorModeContext.Provider, { value: resolvedMode, children: _jsx("div", { className: cn("stgm", presetClass, className), "data-stgm-color-mode": resolvedMode, children: children }) }) }) }));
}
//# sourceMappingURL=provider.js.map