@rokkit/forms 1.1.18 → 1.1.19

package/dist/FieldLayout.svelte.d.ts

@@ -0,0 +1,23 @@
+import { type Component } from 'svelte';
+import FieldLayout from './FieldLayout.svelte';
+type LayoutSchema = {
+    wrapper?: string;
+    key?: string;
+    component?: string;
+    elements?: LayoutSchema[];
+    props?: Record<string, unknown>;
+    [key: string]: unknown;
+};
+/** Recursive field-value tree: each node is itself an indexable record of nodes. */
+type FieldTree = {
+    [key: string]: FieldTree;
+};
+type Props = {
+    value?: FieldTree;
+    schema?: LayoutSchema;
+    path?: string[];
+    onchange?: (value: unknown) => void;
+};
+declare const FieldLayout: Component<Props, {}, "value">;
+type FieldLayout = ReturnType<typeof FieldLayout>;
+export default FieldLayout;

package/dist/FormRenderer.svelte.d.ts

@@ -0,0 +1,59 @@
+/**
+     * FormRenderer component with snippet-based rendering
+     * Handles defaultInput, info, separator, display components, and custom child snippet selection.
+     * Supports form submission with validate-before-submit, loading state, and optional action buttons.
+     */
+import { type Snippet, type Component } from 'svelte';
+import { FormBuilder } from './lib/builder.svelte.js';
+import type { LookupConfig } from './lib/lookup.svelte.js';
+/** A single element produced by FormBuilder.elements. */
+type FormElement = {
+    scope?: string;
+    type?: string;
+    value?: unknown;
+    override?: boolean;
+    props?: Record<string, unknown> & {
+        elements?: FormElement[];
+    };
+};
+type ValidateMode = 'blur' | 'change' | 'manual';
+type ExternalValidation = {
+    state?: string;
+    text?: string;
+} | null | undefined;
+type ActionsContext = {
+    submitting: boolean;
+    isValid: boolean;
+    isDirty: boolean;
+    submit: (e: Event) => void | Promise<void>;
+    reset: () => void;
+};
+type Props = {
+    /** Optional external builder instance */
+    builder?: FormBuilder;
+    /** Direct data prop (alternative to builder) */
+    data?: Record<string, unknown>;
+    schema?: Record<string, unknown> | null;
+    layout?: Record<string, unknown> | null;
+    /** Lookup configurations */
+    lookups?: Record<string, LookupConfig>;
+    /** Validation mode */
+    validateOn?: ValidateMode;
+    /** Custom type renderers (merged with defaults) */
+    renderers?: Record<string, Component<Record<string, unknown>>>;
+    onupdate?: (data: Record<string, unknown>) => void;
+    onvalidate?: (fieldPath: string, value: unknown, event: string) => ExternalValidation;
+    onselect?: (selected: unknown, item: unknown) => void;
+    onsubmit?: (data: Record<string, unknown>, meta: {
+        isValid: boolean;
+        errors: unknown[];
+    }) => void | Promise<void>;
+    /** Custom actions snippet */
+    actions?: Snippet<[ActionsContext]>;
+    className?: string;
+    /** Custom snippet rendered when an element opts into an override */
+    child?: Snippet<[FormElement]>;
+} & Record<string, unknown>;
+declare const FormRenderer: Component<Props, {}, "data">;
+type FormRenderer = ReturnType<typeof FormRenderer>;
+export default FormRenderer;

package/dist/InfoField.svelte.d.ts

@@ -0,0 +1,10 @@
+type Props = {
+    class?: string;
+    name?: string;
+    value?: unknown;
+    label?: string;
+    description?: string;
+};
+declare const InfoField: import("svelte").Component<Props, {}, "">;
+type InfoField = ReturnType<typeof InfoField>;
+export default InfoField;

package/dist/Input.svelte.d.ts

@@ -0,0 +1,14 @@
+import type { Component } from 'svelte';
+type Props = {
+    type?: string;
+    value?: unknown;
+    onchange?: ((value: unknown) => void) | null;
+    oninput?: ((value: unknown) => void) | null;
+    onfocus?: ((event: FocusEvent) => void) | null;
+    onblur?: ((event: FocusEvent) => void) | null;
+    icon?: string | null;
+    renderers?: Record<string, Component<Record<string, unknown>>>;
+} & Record<string, unknown>;
+declare const Input: Component<Props, {}, "value">;
+type Input = ReturnType<typeof Input>;
+export default Input;

package/dist/InputField.svelte.d.ts

@@ -0,0 +1,37 @@
+import type { Component } from 'svelte';
+type FieldMessage = {
+    state?: string;
+    text?: string;
+};
+type Props = {
+    class?: string;
+    name?: string;
+    value?: unknown;
+    type?: string;
+    required?: boolean;
+    status?: string;
+    disabled?: boolean;
+    dirty?: boolean;
+    message?: FieldMessage | string;
+    nolabel?: boolean;
+    icon?: string;
+    label?: string;
+    description?: string;
+    onchange?: (value: unknown) => void;
+    onblur?: () => void;
+    id?: string;
+    renderers?: Record<string, Component<Record<string, unknown>>>;
+    /**
+     * Field layout — controls how the label and input are arranged.
+     *
+     * - `stacked` (default) — label above input. Best for form pages
+     *   with full-width inputs and long labels.
+     * - `inline` — label and input on the same row (label takes a
+     *   fixed leading column). Best for compact control panels —
+     *   playground knob rows, settings dialogs, tweak editors.
+     */
+    variant?: 'stacked' | 'inline';
+} & Record<string, unknown>;
+declare const InputField: Component<Props, {}, "value">;
+type InputField = ReturnType<typeof InputField>;
+export default InputField;

package/dist/StatusList.svelte.d.ts

@@ -0,0 +1,19 @@
+/**
+ * StatusList — grouped summary of validation messages
+ * Groups items by severity (error, warning, info, success) with count headers.
+ * Supports click-to-focus via onclick callback.
+ */
+type Severity = 'error' | 'warning' | 'info' | 'success';
+type StatusItem = {
+    state: Severity;
+    path: string;
+    text: string;
+};
+type Props = {
+    items?: StatusItem[];
+    onclick?: (path: string) => void;
+    class?: string;
+};
+declare const StatusList: import("svelte").Component<Props, {}, "">;
+type StatusList = ReturnType<typeof StatusList>;
+export default StatusList;

package/dist/StepIndicator.svelte.d.ts

@@ -0,0 +1,12 @@
+/**
+ * StepIndicator — standalone presentational component showing multi-step form progress.
+ * Place anywhere on the page; wire to FormBuilder.currentStep and FormBuilder.goToStep.
+ */
+type Props = {
+    steps?: string[];
+    current?: number;
+    onclick?: (index: number) => void;
+};
+declare const StepIndicator: import("svelte").Component<Props, {}, "">;
+type StepIndicator = ReturnType<typeof StepIndicator>;
+export default StepIndicator;

package/dist/display/DisplayCardGrid.svelte.d.ts

@@ -0,0 +1,17 @@
+type DisplayField = {
+    key: string;
+    label?: string;
+    format?: string;
+};
+type DisplayItem = Record<string, unknown>;
+type Props = {
+    data?: DisplayItem[];
+    fields?: DisplayField[];
+    select?: 'one' | 'many';
+    title?: string;
+    onselect?: (selected: DisplayItem | DisplayItem[], item: DisplayItem) => void;
+    class?: string;
+};
+declare const DisplayCardGrid: import("svelte").Component<Props, {}, "">;
+type DisplayCardGrid = ReturnType<typeof DisplayCardGrid>;
+export default DisplayCardGrid;

package/dist/display/DisplayList.svelte.d.ts

@@ -0,0 +1,14 @@
+type DisplayField = {
+    key: string;
+    label?: string;
+    format?: string;
+};
+type Props = {
+    data?: Array<Record<string, unknown>>;
+    fields?: DisplayField[];
+    title?: string;
+    class?: string;
+};
+declare const DisplayList: import("svelte").Component<Props, {}, "">;
+type DisplayList = ReturnType<typeof DisplayList>;
+export default DisplayList;

package/dist/display/DisplaySection.svelte.d.ts

@@ -0,0 +1,13 @@
+type DisplayField = {
+    key: string;
+    label?: string;
+    format?: string;
+};
+type Props = {
+    data?: Record<string, unknown>;
+    fields?: DisplayField[];
+    title?: string;
+};
+declare const DisplaySection: import("svelte").Component<Props, {}, "">;
+type DisplaySection = ReturnType<typeof DisplaySection>;
+export default DisplaySection;

package/dist/display/DisplayTable.svelte.d.ts

@@ -0,0 +1,19 @@
+type DisplayColumn = {
+    key: string;
+    label?: string;
+    sortable?: boolean;
+    width?: string;
+    align?: 'left' | 'center' | 'right';
+    format?: string;
+};
+type Props = {
+    data?: Array<Record<string, unknown>>;
+    columns?: DisplayColumn[];
+    select?: 'one' | 'many';
+    title?: string;
+    onselect?: (value: unknown, row: Record<string, unknown>) => void;
+    class?: string;
+};
+declare const DisplayTable: import("svelte").Component<Props, {}, "">;
+type DisplayTable = ReturnType<typeof DisplayTable>;
+export default DisplayTable;

package/dist/display/DisplayValue.svelte.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Format-aware value display component.
+ * Renders a value with formatting based on the `format` hint.
+ */
+type Props = {
+    value?: unknown;
+    format?: string;
+};
+declare const DisplayValue: import("svelte").Component<Props, {}, "">;
+type DisplayValue = ReturnType<typeof DisplayValue>;
+export default DisplayValue;

package/dist/input/ArrayEditor.svelte.d.ts

@@ -0,0 +1,15 @@
+type ItemSchema = {
+    type?: string;
+    default?: unknown;
+    properties?: Record<string, ItemSchema>;
+};
+type Props = {
+    value?: unknown[];
+    onchange?: (value: unknown[]) => void;
+    items?: ItemSchema;
+    disabled?: boolean;
+    readonly?: boolean;
+};
+declare const ArrayEditor: import("svelte").Component<Props, {}, "value">;
+type ArrayEditor = ReturnType<typeof ArrayEditor>;
+export default ArrayEditor;

package/dist/input/InputCheckbox.svelte.d.ts

@@ -0,0 +1,15 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type StateIcons = {
+    checked?: string;
+    unchecked?: string;
+    unknown?: string;
+};
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: boolean | null;
+    variant?: 'default' | 'custom';
+    icons?: StateIcons;
+    onchange?: (value: boolean) => void;
+};
+declare const InputCheckbox: import("svelte").Component<Props, {}, "value">;
+type InputCheckbox = ReturnType<typeof InputCheckbox>;
+export default InputCheckbox;

package/dist/input/InputColor.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: string;
+    onchange?: (value: string) => void;
+};
+declare const InputColor: import("svelte").Component<Props, {}, "value">;
+type InputColor = ReturnType<typeof InputColor>;
+export default InputColor;

package/dist/input/InputDate.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: string;
+    onchange?: (value: string) => void;
+};
+declare const InputDate: import("svelte").Component<Props, {}, "value">;
+type InputDate = ReturnType<typeof InputDate>;
+export default InputDate;

package/dist/input/InputDateTime.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: string;
+    onchange?: (value: string) => void;
+};
+declare const InputDateTime: import("svelte").Component<Props, {}, "value">;
+type InputDateTime = ReturnType<typeof InputDateTime>;
+export default InputDateTime;

package/dist/input/InputEmail.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: string;
+    onchange?: (value: string) => void;
+};
+declare const InputEmail: import("svelte").Component<Props, {}, "value">;
+type InputEmail = ReturnType<typeof InputEmail>;
+export default InputEmail;

package/dist/input/InputFile.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: FileList | null;
+    onchange?: (value: FileList | null) => void;
+};
+declare const InputFile: import("svelte").Component<Props, {}, "value">;
+type InputFile = ReturnType<typeof InputFile>;
+export default InputFile;

package/dist/input/InputMonth.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: string;
+    onchange?: (value: string) => void;
+};
+declare const InputMonth: import("svelte").Component<Props, {}, "value">;
+type InputMonth = ReturnType<typeof InputMonth>;
+export default InputMonth;

package/dist/input/InputNumber.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: number;
+    onchange?: (value: number) => void;
+};
+declare const InputNumber: import("svelte").Component<Props, {}, "value">;
+type InputNumber = ReturnType<typeof InputNumber>;
+export default InputNumber;

package/dist/input/InputPassword.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: string;
+    onchange?: (value: string) => void;
+};
+declare const InputPassword: import("svelte").Component<Props, {}, "value">;
+type InputPassword = ReturnType<typeof InputPassword>;
+export default InputPassword;

package/dist/input/InputRadio.svelte.d.ts

@@ -0,0 +1,16 @@
+import { type FieldMapping } from '@rokkit/core';
+type Props = {
+    class?: string;
+    value?: unknown;
+    fields?: FieldMapping;
+    options?: unknown[];
+    disabled?: boolean;
+    flip?: boolean;
+    onchange?: (value: unknown) => void;
+    onfocus?: (event: FocusEvent) => void;
+    onblur?: (event: FocusEvent) => void;
+    [key: string]: unknown;
+};
+declare const InputRadio: import("svelte").Component<Props, {}, "value">;
+type InputRadio = ReturnType<typeof InputRadio>;
+export default InputRadio;

package/dist/input/InputRange.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: number;
+    onchange?: (value: number) => void;
+};
+declare const InputRange: import("svelte").Component<Props, {}, "value">;
+type InputRange = ReturnType<typeof InputRange>;
+export default InputRange;

package/dist/input/InputSelect.svelte.d.ts

@@ -0,0 +1,13 @@
+type Option = string | Record<string, unknown>;
+type Props = {
+    value?: unknown;
+    fields?: Record<string, string>;
+    options?: Option[];
+    placeholder?: string;
+    disabled?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+    onchange?: (value: unknown, item: unknown) => void;
+};
+declare const InputSelect: import("svelte").Component<Props, {}, "value">;
+type InputSelect = ReturnType<typeof InputSelect>;
+export default InputSelect;

package/dist/input/InputSwatch.svelte.d.ts

@@ -0,0 +1,13 @@
+type Props = {
+    value?: unknown;
+    options?: Array<string | number | Record<string, unknown>>;
+    fields?: Record<string, string>;
+    multiple?: boolean;
+    shape?: 'square' | 'circle';
+    size?: 'sm' | 'md' | 'lg';
+    disabled?: boolean;
+    onchange?: (value: unknown, item: unknown) => void;
+};
+declare const InputSwatch: import("svelte").Component<Props, {}, "value">;
+type InputSwatch = ReturnType<typeof InputSwatch>;
+export default InputSwatch;

package/dist/input/InputSwitch.svelte.d.ts

@@ -0,0 +1,7 @@
+import { type SwitchProps } from '@rokkit/ui';
+type Props = SwitchProps & {
+    name?: string;
+};
+declare const InputSwitch: import("svelte").Component<Props, {}, "value">;
+type InputSwitch = ReturnType<typeof InputSwitch>;
+export default InputSwitch;

package/dist/input/InputTel.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: string;
+    onchange?: (value: string) => void;
+};
+declare const InputTel: import("svelte").Component<Props, {}, "value">;
+type InputTel = ReturnType<typeof InputTel>;
+export default InputTel;

package/dist/input/InputText.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: string;
+    onchange?: (value: string) => void;
+};
+declare const InputText: import("svelte").Component<Props, {}, "value">;
+type InputText = ReturnType<typeof InputText>;
+export default InputText;

package/dist/input/InputTextArea.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLTextareaAttributes } from 'svelte/elements';
+type Props = Omit<HTMLTextareaAttributes, 'value' | 'onchange'> & {
+    value?: string;
+    onchange?: (value: string) => void;
+};
+declare const InputTextArea: import("svelte").Component<Props, {}, "value">;
+type InputTextArea = ReturnType<typeof InputTextArea>;
+export default InputTextArea;

package/dist/input/InputTime.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: string;
+    onchange?: (value: string) => void;
+};
+declare const InputTime: import("svelte").Component<Props, {}, "value">;
+type InputTime = ReturnType<typeof InputTime>;
+export default InputTime;

package/dist/input/InputToggle.svelte.d.ts

@@ -0,0 +1,5 @@
+import { type ToggleProps } from '@rokkit/ui';
+type Props = Pick<ToggleProps, 'value' | 'options' | 'fields' | 'disabled' | 'size' | 'showLabels' | 'onchange'>;
+declare const InputToggle: import("svelte").Component<Props, {}, "value">;
+type InputToggle = ReturnType<typeof InputToggle>;
+export default InputToggle;

package/dist/input/InputUrl.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: string;
+    onchange?: (value: string) => void;
+};
+declare const InputUrl: import("svelte").Component<Props, {}, "value">;
+type InputUrl = ReturnType<typeof InputUrl>;
+export default InputUrl;

package/dist/input/InputWeek.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+type Props = Omit<HTMLInputAttributes, 'value' | 'onchange'> & {
+    value?: string;
+    onchange?: (value: string) => void;
+};
+declare const InputWeek: import("svelte").Component<Props, {}, "value">;
+type InputWeek = ReturnType<typeof InputWeek>;
+export default InputWeek;

package/dist/lib/Input.svelte.d.ts

@@ -0,0 +1,37 @@
+/**
+ * Universal Input wrapper component supporting all HTML input types
+ * Provides consistent interface with label, description, message handling
+ */
+type Message = {
+    state: 'error' | 'warning' | 'info' | 'success';
+    text: string;
+};
+type SelectOption = string | {
+    value: unknown;
+    label?: string;
+};
+type Props = {
+    type?: string;
+    value?: unknown;
+    label?: string;
+    description?: string;
+    message?: Message | null;
+    placeholder?: string;
+    required?: boolean;
+    disabled?: boolean;
+    readonly?: boolean;
+    min?: number | string;
+    max?: number | string;
+    step?: number | string;
+    pattern?: string;
+    minLength?: number;
+    maxLength?: number;
+    options?: SelectOption[];
+    className?: string;
+    onchange?: (value: unknown) => void;
+    onfocus?: (event: FocusEvent) => void;
+    onblur?: (event: FocusEvent) => void;
+} & Record<string, unknown>;
+declare const Input: import("svelte").Component<Props, {}, "value">;
+type Input = ReturnType<typeof Input>;
+export default Input;

package/dist/{src/lib → lib}/builder.svelte.d.ts

@@ -4,12 +4,12 @@
 export class FormBuilder {
     /**
      * Create a new FormBuilder instance
-     * @param {Object} [data={}] - Initial data object
+     * @param {Record<string, unknown>} [data={}] - Initial data object
      * @param {Object|null} [schema=null] - Optional schema override
      * @param {Object|null} [layout=null] - Optional layout override
      * @param {Object<string, import('./lookup.svelte.js').LookupConfig>} [lookups={}] - Lookup configurations
      */
-    constructor(data?: Object, schema?: Object | null, layout?: Object | null, lookups?: {
+    constructor(data?: Record<string, unknown>, schema?: Object | null, layout?: Object | null, lookups?: {
         [x: string]: import("./lookup.svelte.js").LookupConfig;
     });
     /** @type {FormElement[]} */
@@ -20,14 +20,14 @@ export class FormBuilder {
     get combined(): any;
     /**
      * Set the data
-     * @param {Object} value - New data object
+     * @param {Record<string, unknown>} value - New data object
      */
-    set data(value: Object);
+    set data(value: Record<string, unknown>);
     /**
      * Get the current data
-     * @returns {Object} Current data object
+     * @returns {Record<string, unknown>} Current data object
      */
-    get data(): Object;
+    get data(): Record<string, unknown>;
     /**
      * Set the schema
      * @param {Object} value - New schema object
@@ -145,9 +145,9 @@ export class FormBuilder {
      * Get form data with hidden field values stripped out
      * Hidden fields are those absent from this.elements (the derived list)
      * Does not mutate this.#data
-     * @returns {Object} Filtered data containing only visible field keys
+     * @returns {Record<string, unknown>} Filtered data containing only visible field keys
      */
-    getVisibleData(): Object;
+    getVisibleData(): Record<string, unknown>;
     /**
      * Whether all fields pass validation (no error-state messages)
      * @returns {boolean}

package/dist/types.d.ts

@@ -0,0 +1,14 @@
+export namespace types {
+    let string: import("svelte").Component<Omit<import("svelte/elements").HTMLInputAttributes, "value" | "onchange"> & {
+        value?: string;
+        onchange?: (value: string) => void;
+    }, {}, "value">;
+    let integer: import("svelte").Component<Omit<import("svelte/elements").HTMLInputAttributes, "value" | "onchange"> & {
+        value?: number;
+        onchange?: (value: number) => void;
+    }, {}, "value">;
+    let phone: import("svelte").Component<Omit<import("svelte/elements").HTMLInputAttributes, "value" | "onchange"> & {
+        value?: string;
+        onchange?: (value: string) => void;
+    }, {}, "value">;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rokkit/forms",
-  "version": "1.1.18",
+  "version": "1.1.19",
   "description": "Form building components for Rokkit applications",
   "repository": {
     "type": "git",
@@ -14,10 +14,11 @@
     "access": "public"
   },
   "scripts": {
-    "prepublishOnly": "cp ../../LICENSE . && tsc --project tsconfig.build.json",
+    "prepublishOnly": "cp ../../LICENSE . && bun run clean && bun run build",
     "postpublish": "rm -f LICENSE",
     "clean": "rm -rf dist",
-    "build": "bun clean && bun prepublishOnly"
+    "build": "svelte-package -i src -o dist",
+    "check": "svelte-check --tsconfig ./tsconfig.json"
   },
   "files": [
     "src/**/*.js",
@@ -35,6 +36,7 @@
       "svelte": "./src/index.js"
     },
     "./lib": {
+      "types": "./dist/lib/index.d.ts",
       "import": "./src/lib/index.js"
     }
   },
@@ -44,5 +46,14 @@
     "@rokkit/states": "latest",
     "@rokkit/ui": "latest",
     "ramda": "^0.32.0"
+  },
+  "peerDependencies": {
+    "svelte": "^5.0.0"
+  },
+  "devDependencies": {
+    "@sveltejs/package": "^2.5.8",
+    "@sveltejs/vite-plugin-svelte": "^6.2.4",
+    "@types/ramda": "^0.31.1",
+    "svelte-check": "^4.4.3"
   }
 }