@vit-foundation/ui 0.1.0 → 0.2.0

package/dist/config/types.d.ts

@@ -54,6 +54,76 @@ export interface UiMessages {
     footer_rights(): string;
     jobs_empty(): string;
     jobs_newsletterNudge(): string;
+    login_title(): string;
+    login_emailLabel(): string;
+    login_passwordLabel(): string;
+    login_submit(): string;
+    login_divider(): string;
+    login_magicLinkSubmit(): string;
+    login_magicLinkSuccess(): string;
+    login_googleSubmit(): string;
+    login_error_invalidCredentials(): string;
+    signup_title(): string;
+    signup_nameLabel(): string;
+    signup_passwordLabel(): string;
+    signup_newsletterLabel(): string;
+    signup_submit(): string;
+    signup_success(): string;
+    signup_termsPre(): string;
+    signup_termsLink(): string;
+    auth_tabsLabel(): string;
+    auth_legalNotePre(): string;
+    account_nameHeading(): string;
+    account_nameLabel(): string;
+    account_nameSubmit(): string;
+    account_nameSuccess(): string;
+    account_newsletterHeading(): string;
+    account_newsletterStatusOn(params: {
+        email: string;
+    }): string;
+    account_newsletterStatusOff(): string;
+    account_newsletterSubscribe(): string;
+    account_newsletterUnsubscribe(): string;
+    account_newsletterSuccessOn(): string;
+    account_newsletterSuccessOff(): string;
+    account_dataHeading(): string;
+    account_dataDescription(): string;
+    account_dataDownload(): string;
+    account_logout(): string;
+    account_deleteHeading(): string;
+    account_deleteWarning(): string;
+    account_deleteConfirmLabel(): string;
+    account_deleteSubmit(): string;
+    account_error_unavailable(): string;
+    newsletter_title(): string;
+    newsletter_intro(): string;
+    newsletter_promptLoggedOut(): string;
+    newsletter_subscribedNote(): string;
+    comments_title(): string;
+    comments_empty(): string;
+    comments_bodyLabel(): string;
+    comments_submit(): string;
+    comments_replyLabel(): string;
+    comments_replySubmit(): string;
+    comments_loginPrompt(): string;
+    comments_loginLink(): string;
+    comments_signupLink(): string;
+    reaction_like(): string;
+    reaction_love(): string;
+    reaction_clap(): string;
+    reactions_groupLabel(): string;
+    contact_categoryLabel(): string;
+    contact_nameLabel(): string;
+    contact_emailLabel(): string;
+    contact_messageLabel(): string;
+    contact_submit(): string;
+    contact_success(): string;
+    contact_invalid(): string;
+    contact_category_collaborate(): string;
+    contact_category_event(): string;
+    contact_category_press(): string;
+    contact_category_brand(): string;
+    contact_category_other(): string;
     category_foundation(): string;
     category_lab(): string;
     category_education(): string;

package/dist/content/index.d.ts

@@ -1,3 +1,4 @@
 export { renderBody } from './richtext.js';
 export type { RichTextBlock } from './richtext.js';
-export type { CollaboratorData, FieldConstraint, FormFailReason, JobOpeningData, MilestoneCategory, MilestoneData, ProjectCardData, ProjectKind, SortDirection, TeamMemberData, WeeklyCardData } from './types.js';
+export { CONTACT_CATEGORIES, REACTIONS } from './types.js';
+export type { CollaboratorData, CommentData, CommentThreadData, ContactCategory, FieldConstraint, FormFailReason, JobOpeningData, MilestoneCategory, MilestoneData, ProjectCardData, ProjectKind, Reaction, ReactionSummary, ReactionTarget, SortDirection, TeamMemberData, WeeklyCardData } from './types.js';

package/dist/content/index.js

@@ -1 +1,2 @@
 export { renderBody } from './richtext.js';
+export { CONTACT_CATEGORIES, REACTIONS } from './types.js';

package/dist/content/types.d.ts

@@ -69,3 +69,37 @@ export interface JobOpeningData {
     description: string | null;
     postedOn: string;
 }
+/** The reactions a weekly or comment can carry, in display order. */
+export declare const REACTIONS: readonly ["like", "love", "clap"];
+export type Reaction = (typeof REACTIONS)[number];
+/** One reaction's tally as the bar renders it. */
+export interface ReactionSummary {
+    reaction: Reaction;
+    count: number;
+    /** Whether the signed-in reader is among the reactors. */
+    mine: boolean;
+}
+/** The weekly or comment a reaction bar belongs to. */
+export type ReactionTarget = {
+    kind: 'weekly';
+    slug: string;
+} | {
+    kind: 'comment';
+    id: number;
+};
+/** One comment as the section renders it. */
+export interface CommentData {
+    id: number;
+    displayName: string;
+    body: string;
+    /** ISO timestamp. */
+    createdAt: string;
+    reactions: ReactionSummary[];
+}
+/** A top-level comment with its flat reply list. */
+export interface CommentThreadData extends CommentData {
+    replies: CommentData[];
+}
+/** The contact form's reasons, in display order — the host schema derives its enum from this. */
+export declare const CONTACT_CATEGORIES: readonly ["collaborate", "event", "press", "brand", "other"];
+export type ContactCategory = (typeof CONTACT_CATEGORIES)[number];

package/dist/content/types.js

@@ -3,4 +3,7 @@
  * applied. The website's zod-inferred types satisfy these structurally; the
  * package states them itself so consumers owe it no schema library.
  */
-export {};
+/** The reactions a weekly or comment can carry, in display order. */
+export const REACTIONS = ['like', 'love', 'clap'];
+/** The contact form's reasons, in display order — the host schema derives its enum from this. */
+export const CONTACT_CATEGORIES = ['collaborate', 'event', 'press', 'brand', 'other'];

package/dist/forms/constraints.d.ts

@@ -0,0 +1,35 @@
+/**
+ * The bounds of the foundation's form fields — one declaration each, feeding
+ * both halves: the host app's schemas build their validations from these, and
+ * the form components spread them into the markup's length attributes through
+ * Field. A bound written in only one of the two places is enforced on the
+ * server and unstated in the browser, or vice versa.
+ */
+export declare const DISPLAY_NAME: {
+    readonly min: 1;
+    readonly max: 100;
+};
+export declare const EMAIL: {
+    readonly max: 320;
+};
+export declare const PASSWORD: {
+    readonly min: 8;
+    readonly max: 200;
+};
+/**
+ * The login password's own constraint: the site's maximum, and no minimum.
+ * A `minlength` borrowed from PASSWORD would refuse a valid older password
+ * in the browser before the server ever saw it.
+ */
+export declare const LOGIN_PASSWORD: {
+    readonly max: 200;
+};
+export declare const COMMENT_BODY: {
+    readonly max: 2000;
+};
+export declare const CONTACT_NAME: {
+    readonly max: 200;
+};
+export declare const CONTACT_MESSAGE: {
+    readonly max: 5000;
+};

package/dist/forms/constraints.js

@@ -0,0 +1,19 @@
+/**
+ * The bounds of the foundation's form fields — one declaration each, feeding
+ * both halves: the host app's schemas build their validations from these, and
+ * the form components spread them into the markup's length attributes through
+ * Field. A bound written in only one of the two places is enforced on the
+ * server and unstated in the browser, or vice versa.
+ */
+export const DISPLAY_NAME = { min: 1, max: 100 };
+export const EMAIL = { max: 320 };
+export const PASSWORD = { min: 8, max: 200 };
+/**
+ * The login password's own constraint: the site's maximum, and no minimum.
+ * A `minlength` borrowed from PASSWORD would refuse a valid older password
+ * in the browser before the server ever saw it.
+ */
+export const LOGIN_PASSWORD = { max: PASSWORD.max };
+export const COMMENT_BODY = { max: 2000 };
+export const CONTACT_NAME = { max: 200 };
+export const CONTACT_MESSAGE = { max: 5000 };

package/dist/forms/index.d.ts

@@ -0,0 +1,3 @@
+export { COMMENT_BODY, CONTACT_MESSAGE, CONTACT_NAME, DISPLAY_NAME, EMAIL, LOGIN_PASSWORD, PASSWORD } from './constraints.js';
+export { hasNewsletterIntent, HONEYPOT_FIELD, isNewsletterIntent, NEWSLETTER_INTENT_PARAM, NEWSLETTER_INTENT_VALUE, withNewsletterIntent } from './transport.js';
+export type { FormFail, FormFieldIssue, FormResultLike, FormResultOf, KeyedRemoteForms, RemoteField, RemoteFormAttributes, RemoteFormInstance } from './types.js';

package/dist/forms/index.js

@@ -0,0 +1,2 @@
+export { COMMENT_BODY, CONTACT_MESSAGE, CONTACT_NAME, DISPLAY_NAME, EMAIL, LOGIN_PASSWORD, PASSWORD } from './constraints.js';
+export { hasNewsletterIntent, HONEYPOT_FIELD, isNewsletterIntent, NEWSLETTER_INTENT_PARAM, NEWSLETTER_INTENT_VALUE, withNewsletterIntent } from './transport.js';

package/dist/forms/transport.d.ts

@@ -0,0 +1,26 @@
+/**
+ * The form-transport constants shared between this package's markup and the
+ * host app's server envelope. The package owns them so the two halves are
+ * joined by an import rather than by a string typed twice: a hidden field
+ * whose name drifts from the value the server checks fails silently, which
+ * is the exact defect these modules exist to prevent.
+ */
+/**
+ * The honeypot field's name. Rendered hidden by Honeypot.svelte; a value in
+ * it means a bot. The host app's schemas declare the field under this name
+ * and its form envelope checks it before running any handler.
+ */
+export declare const HONEYPOT_FIELD = "website";
+/**
+ * The newsletter intent as it travels in a URL or a hidden field. The value
+ * is what the host app's schema accepts (`z.literal(NEWSLETTER_INTENT_VALUE)`);
+ * the param is the query key the auth pages read.
+ */
+export declare const NEWSLETTER_INTENT_PARAM = "newsletter";
+export declare const NEWSLETTER_INTENT_VALUE = "1";
+/** True when a raw transport value — a URL param, a cookie — carries intent. */
+export declare function isNewsletterIntent(value: string | null | undefined): boolean;
+/** True when the URL arrived from a newsletter prompt (?newsletter=1). */
+export declare function hasNewsletterIntent(url: URL): boolean;
+/** An auth-page path carrying the intent: '/signup' → '/signup?newsletter=1'. */
+export declare function withNewsletterIntent(path: string): string;

package/dist/forms/transport.js

@@ -0,0 +1,32 @@
+/**
+ * The form-transport constants shared between this package's markup and the
+ * host app's server envelope. The package owns them so the two halves are
+ * joined by an import rather than by a string typed twice: a hidden field
+ * whose name drifts from the value the server checks fails silently, which
+ * is the exact defect these modules exist to prevent.
+ */
+/**
+ * The honeypot field's name. Rendered hidden by Honeypot.svelte; a value in
+ * it means a bot. The host app's schemas declare the field under this name
+ * and its form envelope checks it before running any handler.
+ */
+export const HONEYPOT_FIELD = 'website';
+/**
+ * The newsletter intent as it travels in a URL or a hidden field. The value
+ * is what the host app's schema accepts (`z.literal(NEWSLETTER_INTENT_VALUE)`);
+ * the param is the query key the auth pages read.
+ */
+export const NEWSLETTER_INTENT_PARAM = 'newsletter';
+export const NEWSLETTER_INTENT_VALUE = '1';
+/** True when a raw transport value — a URL param, a cookie — carries intent. */
+export function isNewsletterIntent(value) {
+    return value === NEWSLETTER_INTENT_VALUE;
+}
+/** True when the URL arrived from a newsletter prompt (?newsletter=1). */
+export function hasNewsletterIntent(url) {
+    return isNewsletterIntent(url.searchParams.get(NEWSLETTER_INTENT_PARAM));
+}
+/** An auth-page path carrying the intent: '/signup' → '/signup?newsletter=1'. */
+export function withNewsletterIntent(path) {
+    return `${path}?${NEWSLETTER_INTENT_PARAM}=${NEWSLETTER_INTENT_VALUE}`;
+}

package/dist/forms/types.d.ts

@@ -0,0 +1,54 @@
+/**
+ * The structural slice of SvelteKit's RemoteForm surface the form components
+ * render with. Stated here rather than imported from @sveltejs/kit so the
+ * package's only peer stays svelte: any object with this shape works — kit's
+ * real remote forms, and the mock in ../testing/remote-form.js.
+ *
+ * The components take their form as a REQUIRED prop, already preflighted:
+ * validation schemas belong to the host app's server contract, so the call
+ * site runs `myForm.preflight(mySchema)` and hands the result in. Method
+ * syntax throughout — TypeScript checks method parameters bivariantly, which
+ * is what lets kit's narrower literal-typed signatures satisfy these.
+ */
+import type { FormFailReason } from '../content/types.js';
+export interface FormFieldIssue {
+    message: string;
+}
+/** One named field of a remote form, as the markup consumes it. */
+export interface RemoteField {
+    /** Spreadable input attributes for the given control type. */
+    as(type: string, value?: string | boolean): Record<string, unknown>;
+    issues(): FormFieldIssue[] | undefined;
+}
+/**
+ * The spreadable half: `<form {...form}>` — kit enumerates exactly the form
+ * attributes plus its submit handler on the instance.
+ */
+export interface RemoteFormAttributes {
+    method: 'POST';
+    action: string;
+}
+/** A form instance with the given named fields. */
+export type RemoteFormInstance<Fields extends Record<string, RemoteField>, Result = FormResultLike> = RemoteFormAttributes & {
+    fields: Fields;
+    pending: number;
+    result: Result | undefined;
+};
+/** The discriminated result the components branch on. */
+export interface FormResultLike {
+    ok: boolean;
+    reason?: string;
+}
+/** A failure carrying one of the shared envelope reasons, plus form-specific extras. */
+export type FormFail<Extra extends string = never> = {
+    ok: false;
+    reason: FormFailReason | Extra;
+};
+/** The result shape of the foundation's form envelopes, structurally. */
+export type FormResultOf<Ok = object, Extra extends string = never> = ({
+    ok: true;
+} & Ok) | FormFail<Extra>;
+/** A keyed-form factory: `.for(id)` yields one instance per key. */
+export interface KeyedRemoteForms<Instance> {
+    for(key: string): Instance;
+}

package/dist/forms/types.js

@@ -0,0 +1,13 @@
+/**
+ * The structural slice of SvelteKit's RemoteForm surface the form components
+ * render with. Stated here rather than imported from @sveltejs/kit so the
+ * package's only peer stays svelte: any object with this shape works — kit's
+ * real remote forms, and the mock in ../testing/remote-form.js.
+ *
+ * The components take their form as a REQUIRED prop, already preflighted:
+ * validation schemas belong to the host app's server contract, so the call
+ * site runs `myForm.preflight(mySchema)` and hands the result in. Method
+ * syntax throughout — TypeScript checks method parameters bivariantly, which
+ * is what lets kit's narrower literal-typed signatures satisfy these.
+ */
+export {};

package/dist/index.d.ts

@@ -1,3 +1,6 @@
+export * from './components/account/index.js';
+export * from './components/auth/index.js';
+export * from './components/contact/index.js';
 export * from './components/ui/index.js';
 export * from './components/layout/index.js';
 export * from './components/weeklies/index.js';
@@ -5,9 +8,11 @@ export * from './components/projects/index.js';
 export * from './components/team/index.js';
 export * from './components/timeline/index.js';
 export * from './components/jobs/index.js';
+export * from './forms/index.js';
 export * from './config/index.js';
 export * from './edit/index.js';
 export * from './content/index.js';
 export { formatDate, yearOf } from './utils/dates.js';
+export { contactCategoryLabel } from './utils/contact.js';
 export { MILESTONE_CATEGORY_COLOR, milestoneCategoryLabel } from './utils/milestones.js';
 export { isPathUnder } from './utils/paths.js';

package/dist/index.js

@@ -1,4 +1,7 @@
 // Components, by group.
+export * from './components/account/index.js';
+export * from './components/auth/index.js';
+export * from './components/contact/index.js';
 export * from './components/ui/index.js';
 export * from './components/layout/index.js';
 export * from './components/weeklies/index.js';
@@ -6,6 +9,8 @@ export * from './components/projects/index.js';
 export * from './components/team/index.js';
 export * from './components/timeline/index.js';
 export * from './components/jobs/index.js';
+// The form seam: structural remote-form types, transport constants, field bounds.
+export * from './forms/index.js';
 // App wiring: configuration context and the edit-mode contract.
 export * from './config/index.js';
 export * from './edit/index.js';
@@ -13,5 +18,6 @@ export * from './edit/index.js';
 export * from './content/index.js';
 // Utilities the components share with their host apps.
 export { formatDate, yearOf } from './utils/dates.js';
+export { contactCategoryLabel } from './utils/contact.js';
 export { MILESTONE_CATEGORY_COLOR, milestoneCategoryLabel } from './utils/milestones.js';
 export { isPathUnder } from './utils/paths.js';

package/dist/styles/base.css

@@ -44,6 +44,47 @@
 	background: var(--color-surface);
 }
 
+/* Vertical form: fields stacked with the standard rhythm. Forms that lay out
+ * as a row or as contents don't take it. */
+.form-stack {
+	display: flex;
+	flex-direction: column;
+	gap: var(--space-3);
+}
+
+/* Submit row. Load-bearing, not decorative: .form-stack stretches its direct
+ * children, so a bare button would fill the column. */
+.actions {
+	display: flex;
+	flex-wrap: wrap;
+	align-items: center;
+	gap: var(--space-2);
+}
+
+/* Labelled rule between alternatives ("o"), e.g. between login methods. */
+.divider {
+	display: flex;
+	align-items: center;
+	gap: var(--space-2);
+	color: var(--color-ink-muted);
+	font-size: var(--text-sm);
+	margin: 0;
+}
+
+.divider::before,
+.divider::after {
+	content: '';
+	flex: 1;
+	border-top: 1px solid var(--color-hairline);
+}
+
+/* The h2 that opens a band within a section — declared globally because
+ * scoped styles cannot cross a module edge. Spacing stays with the module. */
+.subsection-heading {
+	font-size: var(--text-lg);
+	margin-block: var(--space-4) var(--space-2);
+}
+
 /* Edit-mode affordance. Global on purpose: the editable element is rendered
  * by the consuming component's own markup (Editable hands it attributes
  * through a snippet), which scoped styles inside Editable can never reach. */

package/dist/testing/remote-form.d.ts

@@ -0,0 +1,45 @@
+/**
+ * Test/Storybook stand-in for a SvelteKit RemoteForm. Components accept their
+ * form as an optional prop defaulting to the real one, so tests and stories
+ * substitute through the component's own interface — no module interception.
+ * It fakes exactly the surface components render with: the spreadable form
+ * attributes, fields.<name>.as()/issues(), fields.allIssues(), result,
+ * pending, and the preflight/enhance/for chain. One module — one place to
+ * audit when a kit upgrade changes the RemoteForm contract.
+ *
+ * The type parameter is the prop's type, so a call site reads
+ * `createRemoteFormMock<Props['form']>()` and carries no cast of its own.
+ *
+ * `for(id)` returns a distinct instance per key, and `preflight()` is recorded
+ * on the instance it was called on. Both used to return the mock itself, which
+ * made a keyed form and its base indistinguishable *by construction*: whether
+ * a reply form carried browser-side validation was a question no component
+ * test could ask. `preflighted` is the only non-kit member and is test-only.
+ */
+export type FieldIssues = Array<{
+    message: string;
+}> | undefined;
+export interface RemoteFormMockOptions {
+    /** Live result accessor — a function so tests can change it between renders. */
+    result?: () => unknown;
+    /** Live per-field validation issues, keyed by field name. */
+    issues?: () => Record<string, FieldIssues>;
+    /**
+     * Live submitting count. A function for the reason `result` is one: a test
+     * that renders a control mid-flight needs to move it between renders.
+     *
+     * Pinned at 0 until `Button` and the reaction chips started reading it —
+     * before that no component rendered `pending`, so the mock not offering it
+     * cost nothing. Now the disabled and aria-busy states depend on it, and a
+     * surface a component renders is exactly what this module exists to fake.
+     */
+    pending?: () => number;
+}
+/** The test-only surface a mock adds on top of kit's RemoteForm. */
+export interface RemoteFormProbe {
+    /** Whether `preflight()` was called on this instance. */
+    readonly preflighted: boolean;
+    /** The keyed instance for `id`, as the component under test received it. */
+    for(id: string | number): RemoteFormProbe;
+}
+export declare function createRemoteFormMock<T = Record<string, unknown>>(options?: RemoteFormMockOptions): T;

package/dist/testing/remote-form.js

@@ -0,0 +1,85 @@
+/**
+ * Test/Storybook stand-in for a SvelteKit RemoteForm. Components accept their
+ * form as an optional prop defaulting to the real one, so tests and stories
+ * substitute through the component's own interface — no module interception.
+ * It fakes exactly the surface components render with: the spreadable form
+ * attributes, fields.<name>.as()/issues(), fields.allIssues(), result,
+ * pending, and the preflight/enhance/for chain. One module — one place to
+ * audit when a kit upgrade changes the RemoteForm contract.
+ *
+ * The type parameter is the prop's type, so a call site reads
+ * `createRemoteFormMock<Props['form']>()` and carries no cast of its own.
+ *
+ * `for(id)` returns a distinct instance per key, and `preflight()` is recorded
+ * on the instance it was called on. Both used to return the mock itself, which
+ * made a keyed form and its base indistinguishable *by construction*: whether
+ * a reply form carried browser-side validation was a question no component
+ * test could ask. `preflighted` is the only non-kit member and is test-only.
+ */
+export function createRemoteFormMock(options = {}) {
+    const getResult = options.result ?? (() => undefined);
+    const getIssues = options.issues ?? (() => ({}));
+    const getPending = options.pending ?? (() => 0);
+    const field = (name) => ({
+        as: (type, value) => type === 'text'
+            ? { name, ...(value !== undefined ? { value } : {}) }
+            : { name, type, ...(value !== undefined ? { value } : {}) },
+        issues: () => getIssues()[name],
+        value: () => undefined,
+        set: (input) => input
+    });
+    const roots = {
+        allIssues: () => {
+            const all = Object.values(getIssues()).flatMap((entry) => entry ?? []);
+            return all.length ? all : undefined;
+        }
+    };
+    const fields = new Proxy(roots, {
+        get: (target, prop) => (prop in target ? target[prop] : field(String(prop)))
+    });
+    const keyed = new Map();
+    function build(isKeyed) {
+        let preflighted = false;
+        // Only method/action/onsubmit may be enumerable: components spread the
+        // form object onto <form>, exactly like the real RemoteForm does.
+        const instance = {
+            method: 'POST',
+            action: '#mock',
+            onsubmit: (event) => event.preventDefault()
+        };
+        Object.defineProperties(instance, {
+            fields: { value: fields },
+            result: { get: getResult },
+            pending: { get: getPending },
+            submitted: { value: false },
+            element: { value: null },
+            submit: { value: () => Promise.resolve(true) },
+            validate: { value: () => Promise.resolve() },
+            enhance: { value: () => instance },
+            preflight: {
+                value: () => {
+                    preflighted = true;
+                    return instance;
+                }
+            },
+            preflighted: { get: () => preflighted }
+        });
+        // kit types `for` as returning Omit<RemoteForm, 'for'>: a keyed instance
+        // cannot be keyed again, and the mock says so too.
+        if (!isKeyed) {
+            Object.defineProperty(instance, 'for', {
+                value: (id) => {
+                    const key = String(id);
+                    let child = keyed.get(key);
+                    if (!child) {
+                        child = build(true);
+                        keyed.set(key, child);
+                    }
+                    return child;
+                }
+            });
+        }
+        return instance;
+    }
+    return build(false);
+}

package/dist/utils/contact.d.ts

@@ -0,0 +1,4 @@
+import type { UiMessages } from '../config/types.js';
+import type { ContactCategory } from '../content/types.js';
+/** The contact category's label in the host app's copy. */
+export declare function contactCategoryLabel(category: ContactCategory, messages: UiMessages): string;

package/dist/utils/contact.js

@@ -0,0 +1,15 @@
+/** The contact category's label in the host app's copy. */
+export function contactCategoryLabel(category, messages) {
+    switch (category) {
+        case 'collaborate':
+            return messages.contact_category_collaborate();
+        case 'event':
+            return messages.contact_category_event();
+        case 'press':
+            return messages.contact_category_press();
+        case 'brand':
+            return messages.contact_category_brand();
+        case 'other':
+            return messages.contact_category_other();
+    }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@vit-foundation/ui",
-	"version": "0.1.0",
+	"version": "0.2.0",
 	"scripts": {
 		"dev": "vite dev",
 		"build": "vite build && npm run prepack",
@@ -23,8 +23,7 @@
 		"!dist/**/*.spec.*",
 		"!dist/fixtures.*",
 		"!dist/**/stories/**",
-		"!dist/**/tests/**",
-		"!dist/testing/**"
+		"!dist/**/tests/**"
 	],
 	"sideEffects": [
 		"**/*.css"
@@ -43,6 +42,21 @@
 			"svelte": "./dist/components/ui/index.js",
 			"default": "./dist/components/ui/index.js"
 		},
+		"./auth": {
+			"types": "./dist/components/auth/index.d.ts",
+			"svelte": "./dist/components/auth/index.js",
+			"default": "./dist/components/auth/index.js"
+		},
+		"./account": {
+			"types": "./dist/components/account/index.d.ts",
+			"svelte": "./dist/components/account/index.js",
+			"default": "./dist/components/account/index.js"
+		},
+		"./contact": {
+			"types": "./dist/components/contact/index.d.ts",
+			"svelte": "./dist/components/contact/index.js",
+			"default": "./dist/components/contact/index.js"
+		},
 		"./layout": {
 			"types": "./dist/components/layout/index.d.ts",
 			"svelte": "./dist/components/layout/index.js",
@@ -83,6 +97,16 @@
 			"svelte": "./dist/config/index.js",
 			"default": "./dist/config/index.js"
 		},
+		"./forms": {
+			"types": "./dist/forms/index.d.ts",
+			"svelte": "./dist/forms/index.js",
+			"default": "./dist/forms/index.js"
+		},
+		"./testing": {
+			"types": "./dist/testing/remote-form.d.ts",
+			"svelte": "./dist/testing/remote-form.js",
+			"default": "./dist/testing/remote-form.js"
+		},
 		"./tokens.css": "./dist/styles/tokens.css",
 		"./base.css": "./dist/styles/base.css"
 	},