@c15t/svelte 3.0.0-alpha.0

package/dist/primitives/tabs/tabs-root.svelte

@@ -0,0 +1,67 @@
+<script lang="ts">
+	import type { TabsOrientation } from '@c15t/ui/primitives';
+	import { getDataDisabled } from '@c15t/ui/primitives';
+	import type { Snippet } from 'svelte';
+	import type { HTMLAttributes } from 'svelte/elements';
+
+	import { setTabsRootContext } from './context';
+
+	const componentId = $props.id();
+
+	let {
+		children,
+		class: className,
+		disabled = false,
+		loop = true,
+		orientation = 'horizontal',
+		value = $bindable<string | null>(null),
+		...restProps
+	}: HTMLAttributes<HTMLDivElement> & {
+		children?: Snippet;
+		class?: string;
+		disabled?: boolean;
+		loop?: boolean;
+		orientation?: TabsOrientation;
+		value?: string | null;
+	} = $props();
+
+	const baseId = `c15t-tabs-${componentId}`;
+	const dataDisabled = $derived(getDataDisabled(disabled));
+
+	const setValue = function setValue(nextValue: string) {
+		if (disabled) {
+			return;
+		}
+
+		value = nextValue;
+	};
+
+	setTabsRootContext({
+		get baseId() {
+			return baseId;
+		},
+		get disabled() {
+			return disabled;
+		},
+		get loop() {
+			return loop;
+		},
+		get orientation() {
+			return orientation;
+		},
+		setValue,
+		get value() {
+			return value;
+		},
+	});
+</script>
+
+<div
+	class={className}
+	data-slot="tabs-root"
+	data-orientation={orientation}
+	data-disabled={dataDisabled}
+	{...restProps}
+>
+	{@render children?.()}
+</div>

package/dist/primitives/tabs/tabs-root.svelte.d.ts

@@ -0,0 +1,14 @@
+import type { TabsOrientation } from '@c15t/ui/primitives';
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+type $$ComponentProps = HTMLAttributes<HTMLDivElement> & {
+    children?: Snippet;
+    class?: string;
+    disabled?: boolean;
+    loop?: boolean;
+    orientation?: TabsOrientation;
+    value?: string | null;
+};
+declare const TabsRoot: import("svelte").Component<$$ComponentProps, {}, "value">;
+type TabsRoot = ReturnType<typeof TabsRoot>;
+export default TabsRoot;

package/dist/primitives/tabs/tabs-trigger.svelte

@@ -0,0 +1,108 @@
+<script lang="ts">
+	import {
+		getDataDisabled,
+		getNextTabValue,
+		getTabState,
+	} from '@c15t/ui/primitives';
+	import type { Snippet } from 'svelte';
+	import type { HTMLAttributes } from 'svelte/elements';
+
+	import { getTabsRootContext } from './context';
+
+	const root = getTabsRootContext();
+
+	let {
+		children,
+		class: className,
+		onclick,
+		onkeydown,
+		type = 'button',
+		value,
+		...restProps
+	}: HTMLAttributes<HTMLButtonElement> & {
+		children?: Snippet;
+		class?: string;
+		type?: 'button' | 'submit' | 'reset';
+		value: string;
+	} = $props();
+
+	const baseId = $derived(root.baseId);
+	const disabled = $derived(root.disabled);
+	const selectedValue = $derived(root.value);
+	const isSelected = $derived(selectedValue === value);
+	const dataState = $derived(getTabState(isSelected));
+	const dataDisabled = $derived(getDataDisabled(disabled));
+	const triggerId = $derived(`${baseId}-trigger-${value}`);
+	const contentId = $derived(`${baseId}-content-${value}`);
+
+	const moveFocus = function moveFocus(nextValue: string) {
+		root.setValue(nextValue);
+
+		if (typeof document === 'undefined') {
+			return;
+		}
+
+		const nextButton = document.getElementById(
+			`${baseId}-trigger-${nextValue}`
+		);
+
+		if (nextButton instanceof HTMLButtonElement) {
+			nextButton.focus();
+		}
+	};
+
+	const handleKeyDown = function handleKeyDown(
+		event: KeyboardEvent & { currentTarget: EventTarget & HTMLButtonElement }
+	) {
+		if (typeof document === 'undefined') {
+			onkeydown?.(event);
+			return;
+		}
+
+		const triggerValues = Array.from(
+			document.querySelectorAll<HTMLButtonElement>(
+				`[data-slot="tabs-trigger"][id^="${baseId}-trigger-"]`
+			)
+		).map((button) => button.id.replace(`${baseId}-trigger-`, ''));
+
+		const nextValue = getNextTabValue({
+			currentValue: value,
+			key: event.key,
+			loop: root.loop,
+			orientation: root.orientation,
+			triggerValues,
+		});
+
+		if (nextValue !== value || event.key === 'Home' || event.key === 'End') {
+			event.preventDefault();
+			moveFocus(nextValue);
+		}
+		onkeydown?.(event);
+	};
+
+	const handleClick = function handleClick(
+		event: MouseEvent & { currentTarget: EventTarget & HTMLButtonElement }
+	) {
+		root.setValue(value);
+		onclick?.(event);
+	};
+</script>
+
+<button
+	{type}
+	id={triggerId}
+	role="tab"
+	tabindex={isSelected ? 0 : -1}
+	aria-controls={contentId}
+	aria-selected={isSelected}
+	class={className}
+	data-slot="tabs-trigger"
+	data-state={dataState}
+	data-disabled={dataDisabled}
+	{disabled}
+	{...restProps}
+	onclick={handleClick}
+	onkeydown={handleKeyDown}
+>
+	{@render children?.()}
+</button>

package/dist/primitives/tabs/tabs-trigger.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+type $$ComponentProps = HTMLAttributes<HTMLButtonElement> & {
+    children?: Snippet;
+    class?: string;
+    type?: 'button' | 'submit' | 'reset';
+    value: string;
+};
+declare const TabsTrigger: import("svelte").Component<$$ComponentProps, {}, "">;
+type TabsTrigger = ReturnType<typeof TabsTrigger>;
+export default TabsTrigger;

package/dist/server/headers.d.ts

@@ -0,0 +1,13 @@
+declare const FORWARDED_HEADERS: readonly ["x-c15t-country", "cf-ipcountry", "x-vercel-ip-country", "x-amz-cf-ipcountry", "x-country-code", "x-country", "x-c15t-region", "cf-region-code", "x-vercel-ip-country-region", "x-region-code", "accept-language", "x-c15t-gpc", "sec-gpc", "user-agent", "x-forwarded-host", "x-forwarded-for", "purpose", "sec-purpose"];
+type ForwardedHeader = (typeof FORWARDED_HEADERS)[number];
+type RelevantHeaders = Partial<Record<ForwardedHeader, string>>;
+/**
+ * Extracts relevant headers for consent management from the request headers.
+ *
+ * @param headersList - The Headers object from the incoming request
+ * @returns An object containing the relevant headers for consent management
+ *
+ * @public
+ */
+export declare const extractRelevantHeaders: (headersList: Headers) => RelevantHeaders;
+export {};

package/dist/server/headers.js

@@ -0,0 +1,37 @@
+import { CONSENT_REQUEST_HEADER_NAMES, extractConsentRequestInputs, } from '@c15t/schema/types';
+const SVELTE_EXTRA_HEADERS = [
+    'user-agent',
+    'x-forwarded-host',
+    'x-forwarded-for',
+    'purpose',
+    'sec-purpose',
+];
+const FORWARDED_HEADERS = [
+    ...CONSENT_REQUEST_HEADER_NAMES,
+    ...SVELTE_EXTRA_HEADERS,
+];
+/**
+ * Extracts relevant headers for consent management from the request headers.
+ *
+ * @param headersList - The Headers object from the incoming request
+ * @returns An object containing the relevant headers for consent management
+ *
+ * @public
+ */
+export const extractRelevantHeaders = function extractRelevantHeaders(headersList) {
+    const relevantHeaders = {};
+    for (const headerName of FORWARDED_HEADERS) {
+        const value = headersList.get(headerName);
+        if (value) {
+            relevantHeaders[headerName] = value;
+        }
+    }
+    const inputs = extractConsentRequestInputs(headersList);
+    if (inputs.country) {
+        relevantHeaders['x-c15t-country'] = inputs.country;
+    }
+    if (inputs.region) {
+        relevantHeaders['x-c15t-region'] = inputs.region;
+    }
+    return relevantHeaders;
+};

package/dist/server/index.d.ts

@@ -0,0 +1,8 @@
+import type { KernelConfig } from '@c15t/core';
+import type { PrefetchInitialConsentOptions, ReadInitialConsentConfigOptions } from './types';
+export declare const readInitialConsentConfig: (options: ReadInitialConsentConfigOptions) => Promise<KernelConfig>;
+export declare const prefetchInitialConsent: (options: PrefetchInitialConsentOptions) => Promise<KernelConfig>;
+export type { KernelConfig } from '@c15t/core';
+export type { PrefetchInitialConsentOptions, ReadInitialConsentConfigOptions };
+export { custom, hosted } from '@c15t/core';
+export { offline } from '../transports/offline';

package/dist/server/index.js

@@ -0,0 +1,116 @@
+import { deferInitGvl, createHostedTransport, mergeInitResponseIntoKernelConfig, } from '@c15t/core';
+import { readStoredRecordsFromCookieHeader } from '@c15t/core/modules/persistence';
+import { consentInputsToOverrides, extractConsentRequestInputs, } from '@c15t/schema/types';
+import { extractRelevantHeaders } from './headers';
+import { normalizeBackendURL } from './normalize-url';
+export const readInitialConsentConfig = function readInitialConsentConfig(options) {
+    const now = options.now ?? Date.now();
+    const cookieHeader = options.cookieHeader ?? options.headers.get('cookie') ?? undefined;
+    const initialRecords = readStoredRecordsFromCookieHeader(cookieHeader, options.cookieName ? { storageKey: options.cookieName } : undefined, now);
+    const inputs = extractConsentRequestInputs(options.headers, {
+        country: options.country,
+        language: options.language,
+        region: options.region,
+    });
+    const overrides = consentInputsToOverrides({
+        country: inputs.country,
+        language: inputs.language,
+        region: inputs.region,
+    });
+    const config = {
+        initialPrivacySignals: { gpc: options.headers.get('sec-gpc') === '1' },
+        initialRecords,
+        now,
+    };
+    if (Object.keys(overrides).length > 0) {
+        config.initialOverrides = overrides;
+    }
+    return Promise.resolve(config);
+};
+const createForwardHeaders = (options, overrides) => {
+    const forward = {
+        ...extractRelevantHeaders(options.headers),
+    };
+    const cookieHeader = options.cookieHeader ?? options.headers.get('cookie');
+    if (cookieHeader) {
+        forward.cookie = cookieHeader;
+    }
+    for (const key of options.forwardHeaders ?? []) {
+        const value = options.headers.get(key);
+        if (value) {
+            forward[key.toLowerCase()] = value;
+        }
+    }
+    if (overrides?.country) {
+        forward['x-c15t-country'] = overrides.country;
+    }
+    if (overrides?.region) {
+        forward['x-c15t-region'] = overrides.region;
+    }
+    if (options.language) {
+        forward['accept-language'] = options.language;
+    }
+    return forward;
+};
+export const prefetchInitialConsent = async function prefetchInitialConsent(options) {
+    const base = await readInitialConsentConfig(options);
+    const absoluteBackend = normalizeBackendURL(options.backendURL, options.headers);
+    if (!absoluteBackend) {
+        return base;
+    }
+    const forward = createForwardHeaders(options, base.initialOverrides);
+    try {
+        const fetchImpl = options.fetch ??
+            options.frameworkFetch ??
+            globalThis.fetch?.bind(globalThis);
+        if (!fetchImpl) {
+            return base;
+        }
+        const transport = createHostedTransport({
+            backendURL: absoluteBackend,
+            // Server-request forwarding is broader than the hosted client's
+            // header allowlist. Keep the transport's protocol headers authoritative.
+            fetch: (input, init) => {
+                const headers = new Headers(forward);
+                new Headers(init?.headers).forEach((value, key) => {
+                    headers.set(key, value);
+                });
+                // Keep the caller's full language preference list. The normalized
+                // kernel language is for policy resolution, not HTTP forwarding.
+                if (forward['accept-language']) {
+                    headers.set('accept-language', forward['accept-language']);
+                }
+                return fetchImpl(input, { ...init, headers });
+            },
+        });
+        const response = await transport.init?.({
+            overrides: base.initialOverrides ?? {},
+            user: base.initialUser ?? null,
+        });
+        if (!response) {
+            return base;
+        }
+        const merged = mergeInitResponseIntoKernelConfig(base, options.fetch ||
+            forward.cookie ||
+            (options.frameworkFetch && options.headers.has('authorization')) ||
+            options.forwardHeaders?.some((name) => options.headers.has(name))
+            ? response
+            : deferInitGvl(response, `${absoluteBackend}/init`, 'init', forward));
+        if (response.subjectId) {
+            merged.initialRecords = {
+                ...merged.initialRecords,
+                subject: {
+                    ...merged.initialRecords?.subject,
+                    subjectId: response.subjectId,
+                },
+            };
+        }
+        delete merged.initialDraft;
+        return merged;
+    }
+    catch {
+        return base;
+    }
+};
+export { custom, hosted } from '@c15t/core';
+export { offline } from '../transports/offline';

package/dist/server/normalize-url.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Validates and normalizes a backend URL.
+ *
+ * @param backendURL - The URL to validate (absolute or relative)
+ * @returns An object with isAbsolute flag and the normalized URL
+ * @throws {Error} If the URL format is invalid
+ *
+ * @public
+ */
+export declare const validateBackendURL: (backendURL: string) => {
+    isAbsolute: boolean;
+    normalizedURL: string;
+};
+/**
+ * Normalizes a backend URL, resolving relative URLs using request headers.
+ *
+ * @param backendURL - The backend URL (absolute or relative)
+ * @param headersList - The Headers object from the incoming request
+ * @returns The normalized absolute URL, or null if it cannot be determined
+ *
+ * @public
+ */
+export declare const normalizeBackendURL: (backendURL: string, headersList: Headers) => string | null;

package/dist/server/normalize-url.js

@@ -0,0 +1,46 @@
+import { resolveBackendURL } from '@c15t/schema/types';
+const ABSOLUTE_URL_REGEX = /^https?:\/\//u;
+const trimTrailingSlash = function trimTrailingSlash(url) {
+    if (url === '/') {
+        return url;
+    }
+    return url.endsWith('/') ? url.slice(0, -1) : url;
+};
+/**
+ * Validates and normalizes a backend URL.
+ *
+ * @param backendURL - The URL to validate (absolute or relative)
+ * @returns An object with isAbsolute flag and the normalized URL
+ * @throws {Error} If the URL format is invalid
+ *
+ * @public
+ */
+export const validateBackendURL = function validateBackendURL(backendURL) {
+    const isAbsolute = ABSOLUTE_URL_REGEX.test(backendURL);
+    if (isAbsolute) {
+        String(new URL(backendURL));
+        return {
+            isAbsolute: true,
+            normalizedURL: trimTrailingSlash(backendURL),
+        };
+    }
+    if (backendURL.startsWith('/')) {
+        return {
+            isAbsolute: false,
+            normalizedURL: trimTrailingSlash(backendURL),
+        };
+    }
+    throw new Error(`Invalid URL format: ${backendURL}. URL must be absolute (https://...) or relative starting with (/)`);
+};
+/**
+ * Normalizes a backend URL, resolving relative URLs using request headers.
+ *
+ * @param backendURL - The backend URL (absolute or relative)
+ * @param headersList - The Headers object from the incoming request
+ * @returns The normalized absolute URL, or null if it cannot be determined
+ *
+ * @public
+ */
+export const normalizeBackendURL = function normalizeBackendURL(backendURL, headersList) {
+    return resolveBackendURL(backendURL, headersList);
+};

package/dist/server/types.d.ts

@@ -0,0 +1,25 @@
+export interface ReadInitialConsentConfigOptions {
+    headers: Headers;
+    /** Request clock shared with the client seed. */
+    now?: number;
+    cookieHeader?: string | null;
+    /**
+     * Cookie name holding persisted consent. Defaults to `c15t` — the
+     * persistence module's storage key. Set this only if you customized
+     * `storageConfig.storageKey` client-side; it must match.
+     */
+    cookieName?: string;
+    country?: string;
+    region?: string;
+    language?: string;
+}
+export interface PrefetchInitialConsentOptions extends ReadInitialConsentConfigOptions {
+    backendURL: string;
+    fetch?: typeof globalThis.fetch;
+    /**
+     * Default request fetch supplied by the SvelteKit adapter.
+     * @internal
+     */
+    frameworkFetch?: typeof globalThis.fetch;
+    forwardHeaders?: string[];
+}

package/dist/server/types.js

@@ -0,0 +1 @@
+export {};

package/dist/styles.css

@@ -0,0 +1,10 @@
+/**
+ * @c15t/svelte — Non-IAB prebuilt component styles.
+ *
+ * Import this stylesheet once from your app-level CSS entrypoint
+ * when using prebuilt (styled) consent components.
+ *
+ * Usage (src/app.css):
+ *   @import "@c15t/svelte/styles.css";
+ */
+@import '@c15t/ui/styles.css';

package/dist/transports/offline.d.ts

@@ -0,0 +1,14 @@
+import type { ProviderTransportFactory } from '@c15t/core';
+import type { PolicyRule } from '@c15t/schema/types';
+/** Policy rules evaluated locally when initialization runs. */
+export interface OfflineModeOptions {
+    policyRules?: PolicyRule[];
+}
+/**
+ * Resolve local rules outside render and hydration.
+ * @param options - Explicit policy rules; absence resolves the recommended
+ * pack: strict opt-in for Europe and unknown locations, opt-out for the US
+ * privacy states, and `none` where no consent law grants rights.
+ * @returns A provider transport with no network requests.
+ */
+export declare const offline: (options?: OfflineModeOptions) => ProviderTransportFactory;

package/dist/transports/offline.js

@@ -0,0 +1,22 @@
+import { recommendedPolicyRules, resolvePolicyRules, writePolicyResolutionWire, } from '@c15t/schema/types';
+/**
+ * Resolve local rules outside render and hydration.
+ * @param options - Explicit policy rules; absence resolves the recommended
+ * pack: strict opt-in for Europe and unknown locations, opt-out for the US
+ * privacy states, and `none` where no consent law grants rights.
+ * @returns A provider transport with no network requests.
+ */
+export const offline = function offline(options = {}) {
+    return Object.assign((context) => ({
+        init: ({ overrides }) => Promise.resolve({
+            policyResolution: writePolicyResolutionWire(resolvePolicyRules({
+                countryCode: overrides.country ?? null,
+                iabEnabled: context.iabEnabled,
+                regionCode: overrides.region ?? null,
+                rules: options.policyRules ??
+                    recommendedPolicyRules({ iab: context.iabEnabled }),
+            })),
+            translations: context.translations,
+        }),
+    }), { kind: 'offline' });
+};

package/dist/types.d.ts

@@ -0,0 +1,70 @@
+import type { IABConfig, LegalLinks, ProviderTransportFactory } from '@c15t/core';
+import type { ConsentRuntimeOptions, RuntimeNetworkBlockerOptions, RuntimePersistenceOptions, RuntimeScriptLoaderOptions } from '@c15t/core/runtime';
+import type { CreateIABOptions } from '@c15t/iab';
+import type { Theme, UIOptions } from '@c15t/ui/theme';
+/** IAB options a provider accepts, or `false` to leave IAB unmounted. */
+export type ProviderIABOptions = (Partial<Omit<CreateIABOptions, 'kernel' | 'gvl'>> & Partial<Pick<IABConfig, 'enabled' | 'cmpId' | 'cmpVersion' | 'vendors'>> & Partial<Pick<CreateIABOptions, 'gvl'>>) | false;
+/**
+ * Options for the script-loader module.
+ *
+ * The runtime's own contract, re-exported under this package's `use*`
+ * naming so the Svelte hooks and the runtime cannot drift apart.
+ *
+ * @see {@link https://c15t.com/docs/frameworks/svelte}
+ */
+export type UseScriptLoaderOptions = RuntimeScriptLoaderOptions;
+/**
+ * Options for the network-blocker module.
+ *
+ * The runtime's own contract, re-exported under this package's `use*`
+ * naming so the Svelte hooks and the runtime cannot drift apart.
+ */
+export type UseNetworkBlockerOptions = RuntimeNetworkBlockerOptions;
+/**
+ * Options for the persistence module.
+ *
+ * The runtime's own contract, re-exported under this package's `use*`
+ * naming so the Svelte hooks and the runtime cannot drift apart.
+ */
+export type UsePersistenceOptions = RuntimePersistenceOptions;
+/**
+ * Options accepted by `<ConsentManagerProvider>`.
+ *
+ * Everything except the fields below is the framework-agnostic
+ * {@link ConsentRuntimeOptions} contract, forwarded untouched to
+ * `createConsentRuntime()` from `@c15t/core/runtime`. `createIAB` is
+ * supplied by this package, and `pkg` is fixed to `'@c15t/svelte'`.
+ */
+export interface ConsentManagerOptions extends Omit<ConsentRuntimeOptions, 'createIAB' | 'iab' | 'mode' | 'pkg'>, Pick<UIOptions, 'colorScheme' | 'disableAnimation' | 'noStyle' | 'scrollLock' | 'trapFocus'> {
+    /**
+     * Transport factory the provider builds its kernel with. Required.
+     *
+     * Pass `hosted()` to talk to a c15t backend, `offline()` to resolve
+     * policies locally with no network, or `custom()` to supply your own
+     * kernel transport or v2 endpoint handlers. This is an initial-only
+     * option: remount the provider to change it.
+     *
+     * @example
+     * ```svelte
+     * <script lang="ts">
+     *   import { ConsentManagerProvider, hosted } from '@c15t/svelte';
+     *
+     *   let { children } = $props();
+     * </script>
+     *
+     * <ConsentManagerProvider mode={hosted({ url: '/api/c15t' })}>
+     *   {@render children()}
+     * </ConsentManagerProvider>
+     * ```
+     */
+    mode: ProviderTransportFactory;
+    /** IAB TCF configuration. Pass `false` to disable the TCF addon. */
+    iab?: ProviderIABOptions;
+    /** Links rendered in the banner and preference-center footers. */
+    legalLinks?: LegalLinks;
+    /** Design-token overrides applied as a `<style id="c15t-theme">` block. */
+    theme?: Theme;
+}
+export type SvelteUIOptions = UIOptions;
+/** Public policy lifecycle callbacks. */
+export type ConsentProviderCallbacks = NonNullable<ConsentRuntimeOptions['callbacks']>;

package/dist/types.js

@@ -0,0 +1 @@
+export {};

package/dist/use-banner-visibility.svelte.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Visibility / mount lifecycle for the consent banner.
+ *
+ * - On show: mounts the element with `.bannerHidden`, awaits Svelte commit,
+ *   forces a reflow so the browser observes that initial style, then flips
+ *   to `.bannerVisible`. The CSS transition fires automatically — no JS
+ *   timing coordination.
+ * - On hide: flips to `.bannerHidden`, then unmounts after the duration
+ *   declared by the `--consent-banner-animation-duration` CSS variable.
+ * - When animation is disabled (provider option or `prefers-reduced-motion`):
+ *   toggles synchronously, skipping the show reflow and the hide timer.
+ * - Server render: when the very first evaluation already says "show" — which
+ *   only happens once a `prefetch` has seeded a resolved policy, since
+ *   without one the kernel's model is `null` and `activeUI` is `'none'` — the
+ *   banner starts mounted and *visible*. That puts the shell in the first
+ *   HTML and skips the entry animation on hydration, which would otherwise
+ *   replay an animation the user has already seen painted. Client-triggered
+ *   shows still take the animated path.
+ */
+export declare const useBannerVisibility: (getShouldShow: () => boolean, getDisableAnimation: () => boolean) => {
+    bannerEl: HTMLElement | undefined;
+    readonly isMounted: boolean;
+    readonly isVisible: boolean;
+    readonly shouldRender: boolean;
+};