@reforma/components 0.2.2 → 0.3.0

package/dist/Composer/RichField.d.ts

@@ -1,3 +1,7 @@
-/** TipTap prompt field. Import this only when the plain textarea is not enough. */
-export declare function ComposerRichField(): import("react").JSX.Element;
+import type { HTMLAttributes } from 'react';
+import type { ComposerClassNames } from './types';
+/** TipTap field with caller-owned wrapper and editable-element classes. */
+export declare function ComposerRichField({ className, classNames: slots, style, ...props }: HTMLAttributes<HTMLDivElement> & {
+    classNames?: Pick<ComposerClassNames, 'textareaWrap' | 'editor'>;
+}): import("react").JSX.Element;
 //# sourceMappingURL=RichField.d.ts.map

package/dist/Composer/RichField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RichField.d.ts","sourceRoot":"","sources":["../../src/Composer/RichField.tsx"],"names":[],"mappings":"AAWA,mFAAmF;AACnF,wBAAgB,iBAAiB,gCAoChC"}
+{"version":3,"file":"RichField.d.ts","sourceRoot":"","sources":["../../src/Composer/RichField.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAiB,cAAc,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD,2EAA2E;AAC3E,wBAAgB,iBAAiB,CAAC,EAC9B,SAAS,EACT,UAAU,EAAE,KAAK,EACjB,KAAK,EACL,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,cAAc,CAAC,GAAG;IAChC,UAAU,CAAC,EAAE,IAAI,CAAC,kBAAkB,EAAE,cAAc,GAAG,QAAQ,CAAC,CAAC;CACpE,+BA4FA"}

package/dist/Composer/RichField.js

@@ -1,44 +1,114 @@
-import { useMemo as x } from "react";
-import { plainTextToDoc as d, docToPlainText as h } from "../RichInput/composerDoc.js";
-import { RichInput as T } from "../RichInput/RichInput.js";
-import r from "./Composer.module.css.js";
-import { useComposer as F } from "./context.js";
-import { jsx as m } from "react/jsx-runtime";
-function H() {
+import { cn as s } from "@reforma/lib";
+import E from "@tiptap/extension-bold";
+import S from "@tiptap/extension-code";
+import w from "@tiptap/extension-document";
+import F from "@tiptap/extension-hard-break";
+import H from "@tiptap/extension-history";
+import K from "@tiptap/extension-italic";
+import { ListKit as O } from "@tiptap/extension-list";
+import k from "@tiptap/extension-paragraph";
+import v from "@tiptap/extension-placeholder";
+import I from "@tiptap/extension-text";
+import { useEditor as L, EditorContent as R } from "@tiptap/react";
+import { useLayoutEffect as d, useEffect as j } from "react";
+import { docToPlainText as f, plainTextToDoc as u } from "../RichInput/composerDoc.js";
+import { handleComposerKeyDown as B } from "../RichInput/composerKeymap.js";
+import { useComposer as J } from "./context.js";
+import { jsx as h } from "react/jsx-runtime";
+function at({
+  className: x,
+  classNames: n,
+  style: b,
+  ...m
+}) {
   const {
-    value: o,
-    setPrompt: a,
-    submit: i,
-    placeholder: t,
-    autoFocus: s,
-    submitOnEnter: p,
-    minHeight: n,
-    focusRef: l,
-    addFiles: c,
-    pasteTextAsFile: u
-  } = F(), f = x(() => d(o.prompt), [o.prompt]);
-  return /* @__PURE__ */ m("div", {
-    className: r.textareaWrap,
-    children: /* @__PURE__ */ m(T, {
-      ref: (e) => {
-        l.current = e;
-      },
-      value: f,
-      onChange: (e) => a(h(e)),
-      autoFocus: s,
-      minHeight: n,
-      maxHeight: 280,
-      placeholder: t,
-      className: r.textarea,
-      "aria-label": t,
-      submitOnEnter: p,
-      onSubmit: () => i(),
-      onPasteFiles: (e) => c(e),
-      onPasteText: u
+    value: r,
+    setPrompt: y,
+    submit: g,
+    placeholder: l,
+    autoFocus: C,
+    submitOnEnter: N,
+    focusRef: a,
+    addFiles: D,
+    pasteTextAsFile: P,
+    classNames: i,
+    minHeight: T
+  } = J(), p = {
+    attributes: {
+      class: s(i.editor, n?.editor),
+      role: "textbox",
+      "aria-multiline": "true",
+      "aria-label": m["aria-label"] ?? l,
+      "aria-placeholder": l,
+      "data-slot": "composer-editor"
+    },
+    handleKeyDown: (t, o) => B(t, o, {
+      submitOnEnter: N,
+      hasMenuItems: !1,
+      onSubmit: () => g()
+    }),
+    handlePaste: (t, o) => {
+      const c = o.clipboardData?.files;
+      return c?.length ? (D([...c]), !0) : P(o.clipboardData?.getData("text/plain") ?? "");
+    }
+  }, e = L({
+    immediatelyRender: !1,
+    injectCSS: !1,
+    autofocus: C && (typeof document > "u" || !document.activeElement?.matches('input, textarea, [contenteditable="true"]')) ? "end" : !1,
+    extensions: [w, k, I, F.extend({
+      addKeyboardShortcuts: () => ({})
+    }), H, E, K, S, O.configure({
+      taskItem: !1,
+      taskList: !1
+    }), v.configure({
+      placeholder: ({
+        editor: t
+      }) => {
+        const o = t.options.editorProps.attributes;
+        return (typeof o == "function" ? o(t.state) : o)?.["aria-placeholder"] ?? "";
+      }
+    })],
+    content: u(r.prompt),
+    editorProps: p,
+    onUpdate: ({
+      editor: t
+    }) => y(f(t.getJSON()))
+  });
+  return d(() => {
+    e?.setOptions({
+      editorProps: p
+    });
+  }), d(() => {
+    if (!e)
+      return;
+    const t = {
+      focus: () => {
+        e.chain().focus().run();
+      }
+    };
+    return a.current = t, () => {
+      a.current === t && (a.current = null);
+    };
+  }, [e, a]), j(() => {
+    !e || f(e.getJSON()) === r.prompt || e.chain().setMeta("addToHistory", !1).setContent(u(r.prompt), {
+      emitUpdate: !1
+    }).run();
+  }, [e, r.prompt]), /* @__PURE__ */ h("div", {
+    "data-slot": "composer-field-wrapper",
+    className: s(i.textareaWrap, n?.textareaWrap),
+    children: /* @__PURE__ */ h(R, {
+      ...m,
+      editor: e,
+      "data-slot": "composer-rich-field",
+      className: s(i.textarea, x),
+      style: {
+        "--composer-min-height": `${T}px`,
+        ...b
+      }
     })
   });
 }
 export {
-  H as ComposerRichField
+  at as ComposerRichField
 };
 //# sourceMappingURL=RichField.js.map

package/dist/Composer/RichField.js.map

@@ -1 +1 @@
-{"version":3,"file":"RichField.js","sources":["../../src/Composer/RichField.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { docToPlainText, plainTextToDoc } from '../RichInput';\nimport { RichInput } from '../RichInput/RichInput';\nimport styles from './Composer.module.css';\nimport { useComposer } from './context';\n\nimport type { RichInputHandle } from '../RichInput/types';\n\n/** TipTap prompt field. Import this only when the plain textarea is not enough. */\nexport function ComposerRichField() {\n    const {\n        value,\n        setPrompt,\n        submit,\n        placeholder,\n        autoFocus,\n        submitOnEnter,\n        minHeight,\n        focusRef,\n        addFiles,\n        pasteTextAsFile,\n    } = useComposer();\n    const doc = useMemo(() => plainTextToDoc(value.prompt), [value.prompt]);\n\n    return (\n        <div className={ styles.textareaWrap }>\n            <RichInput\n                ref={ (node: RichInputHandle | null) => {\n                    focusRef.current = node;\n                } }\n                value={ doc }\n                onChange={ (next) => setPrompt(docToPlainText(next)) }\n                autoFocus={ autoFocus }\n                minHeight={ minHeight }\n                maxHeight={ 280 }\n                placeholder={ placeholder }\n                className={ styles.textarea }\n                aria-label={ placeholder }\n                submitOnEnter={ submitOnEnter }\n                onSubmit={ () => submit() }\n                onPasteFiles={ files => addFiles(files) }\n                onPasteText={ pasteTextAsFile }\n            />\n        </div>\n    );\n}\n"],"names":["ComposerRichField","value","setPrompt","submit","placeholder","autoFocus","submitOnEnter","minHeight","focusRef","addFiles","pasteTextAsFile","useComposer","doc","useMemo","plainTextToDoc","styles","RichInput","node","next","docToPlainText","files"],"mappings":";;;;;;AASO,SAASA,IAAoB;AAClC,QAAM;AAAA,IACJ,OAAAC;AAAA,IACA,WAAAC;AAAA,IACA,QAAAC;AAAA,IACA,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,eAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,iBAAAC;AAAA,EAAA,IACEC,EAAA,GACEC,IAAMC,EAAQ,MAAMC,EAAeb,EAAM,MAAM,GAAG,CAACA,EAAM,MAAM,CAAC;AACtE,2BAAyB,OAAO;AAAA,IAC9B,WAAWc,EAAO;AAAA,IAClB,4BAA4BC,GAAW;AAAA,MACrC,KAAK,CAAAC,MAAQ;AACX,QAAAT,EAAS,UAAUS;AAAA,MACrB;AAAA,MACA,OAAOL;AAAA,MACP,UAAU,CAAAM,MAAQhB,EAAUiB,EAAeD,CAAI,CAAC;AAAA,MAChD,WAAAb;AAAA,MACA,WAAAE;AAAA,MACA,WAAW;AAAA,MACX,aAAAH;AAAA,MACA,WAAWW,EAAO;AAAA,MAClB,cAAcX;AAAA,MACd,eAAAE;AAAA,MACA,UAAU,MAAMH,EAAA;AAAA,MAChB,cAAc,CAAAiB,MAASX,EAASW,CAAK;AAAA,MACrC,aAAaV;AAAA,IAAA,CACd;AAAA,EAAA,CACF;AACH;"}
+{"version":3,"file":"RichField.js","sources":["../../src/Composer/RichField.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@reforma/lib';\nimport Bold from '@tiptap/extension-bold';\nimport Code from '@tiptap/extension-code';\nimport Document from '@tiptap/extension-document';\nimport HardBreak from '@tiptap/extension-hard-break';\nimport History from '@tiptap/extension-history';\nimport Italic from '@tiptap/extension-italic';\nimport { ListKit } from '@tiptap/extension-list';\nimport Paragraph from '@tiptap/extension-paragraph';\nimport Placeholder from '@tiptap/extension-placeholder';\nimport Text from '@tiptap/extension-text';\nimport { EditorContent, useEditor } from '@tiptap/react';\nimport { useEffect, useLayoutEffect } from 'react';\n\nimport { docToPlainText, plainTextToDoc } from '../RichInput/composerDoc';\nimport { handleComposerKeyDown } from '../RichInput/composerKeymap';\nimport { useComposer } from './context';\n\nimport type { EditorOptions } from '@tiptap/core';\nimport type { CSSProperties, HTMLAttributes } from 'react';\nimport type { ComposerClassNames } from './types';\n\n/** TipTap field with caller-owned wrapper and editable-element classes. */\nexport function ComposerRichField({\n    className,\n    classNames: slots,\n    style,\n    ...props\n}: HTMLAttributes<HTMLDivElement> & {\n    classNames?: Pick<ComposerClassNames, 'textareaWrap' | 'editor'>;\n}) {\n    const {\n        value, setPrompt, submit, placeholder, autoFocus, submitOnEnter,\n        focusRef, addFiles, pasteTextAsFile, classNames, minHeight,\n    } = useComposer();\n    const editorClassName = cn(classNames.editor, slots?.editor);\n    const editorProps: EditorOptions['editorProps'] = {\n        attributes: {\n            class: editorClassName,\n            role: 'textbox',\n            'aria-multiline': 'true',\n            'aria-label': props['aria-label'] ?? placeholder,\n            'aria-placeholder': placeholder,\n            'data-slot': 'composer-editor',\n        },\n        handleKeyDown: (view, event) => handleComposerKeyDown(view, event, {\n            submitOnEnter,\n            hasMenuItems: false,\n            onSubmit: () => submit(),\n        }),\n        handlePaste: (_view, event) => {\n            const files = event.clipboardData?.files;\n            if (files?.length) {\n                addFiles([...files]);\n                return true;\n            }\n            return pasteTextAsFile(event.clipboardData?.getData('text/plain') ?? '');\n        },\n    };\n    const editor = useEditor({\n        immediatelyRender: false,\n        injectCSS: false,\n        autofocus: autoFocus && (typeof document === 'undefined' || !document.activeElement?.matches('input, textarea, [contenteditable=\"true\"]')) ? 'end' : false,\n        extensions: [\n            Document,\n            Paragraph,\n            Text,\n            HardBreak.extend({ addKeyboardShortcuts: () => ({}) }),\n            History,\n            Bold,\n            Italic,\n            Code,\n            ListKit.configure({ taskItem: false, taskList: false }),\n            Placeholder.configure({ placeholder: ({ editor: current }) => {\n                const attributes = current.options.editorProps.attributes;\n                return (typeof attributes === 'function' ? attributes(current.state) : attributes)?.['aria-placeholder'] ?? '';\n            } }),\n        ],\n        content: plainTextToDoc(value.prompt),\n        editorProps,\n        onUpdate: ({ editor: current }) => setPrompt(docToPlainText(current.getJSON())),\n    });\n\n    useLayoutEffect(() => {\n        editor?.setOptions({ editorProps });\n    });\n\n    useLayoutEffect(() => {\n        if (!editor) {\n            return;\n        }\n        const handle = { focus: () => {\n            editor.chain().focus().run();\n        } };\n        focusRef.current = handle;\n        return () => {\n            if (focusRef.current === handle) {\n                focusRef.current = null;\n            }\n        };\n    }, [editor, focusRef]);\n\n    useEffect(() => {\n        if (!editor || docToPlainText(editor.getJSON()) === value.prompt) {\n            return;\n        }\n        // Host resets do not become undo steps; local edits keep their rich document.\n        editor.chain().setMeta('addToHistory', false)\n            .setContent(plainTextToDoc(value.prompt), { emitUpdate: false }).run();\n    }, [editor, value.prompt]);\n\n    return (\n        <div data-slot=\"composer-field-wrapper\" className={ cn(classNames.textareaWrap, slots?.textareaWrap) }>\n            <EditorContent\n                { ...props }\n                editor={ editor }\n                data-slot=\"composer-rich-field\"\n                className={ cn(classNames.textarea, className) }\n                style={ { '--composer-min-height': `${ minHeight }px`, ...style } as CSSProperties }\n            />\n        </div>\n    );\n}\n"],"names":["ComposerRichField","className","slots","style","props","value","setPrompt","submit","placeholder","autoFocus","submitOnEnter","focusRef","addFiles","pasteTextAsFile","classNames","minHeight","useComposer","editorProps","cn","view","event","handleComposerKeyDown","_view","files","editor","useEditor","Document","Paragraph","Text","HardBreak","History","Bold","Italic","Code","ListKit","Placeholder","current","attributes","plainTextToDoc","docToPlainText","useLayoutEffect","handle","useEffect","EditorContent"],"mappings":"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"}

package/dist/Composer/context.d.ts

@@ -1,10 +1,11 @@
 import { type ReactNode, type RefObject } from 'react';
 import { useFileDrag } from '../hooks/useFileDrag';
-import type { ComposerUploadResult, ComposerValue } from './types';
+import type { ComposerClassNames, ComposerNotice, ComposerUploadResult, ComposerValue } from './types';
 export type ComposerFieldHandle = {
     focus: () => void;
 };
 export type ComposerContextValue = {
+    classNames: ComposerClassNames;
     value: ComposerValue;
     setPrompt: (prompt: string) => void;
     setPlanMode: (planMode: boolean) => void;
@@ -28,6 +29,9 @@ export type ComposerContextValue = {
 };
 export declare function useComposer(): ComposerContextValue;
 export type ComposerProviderProps = {
+    classNames?: ComposerClassNames;
+    /** Report validation errors in the host UI. Defaults to an inline alert. */
+    onError?: (notice: ComposerNotice) => void;
     value: ComposerValue;
     onChange: (value: ComposerValue) => void;
     onSubmit: () => void;
@@ -40,5 +44,5 @@ export type ComposerProviderProps = {
     rows?: number;
     children: ReactNode;
 };
-export declare function ComposerProvider({ value, onChange, onSubmit, uploadFile, busy, placeholder, autoFocus, submitHotkey, rows, children, }: ComposerProviderProps): import("react").JSX.Element;
+export declare function ComposerProvider({ classNames, onError, value, onChange, onSubmit, uploadFile, busy, placeholder, autoFocus, submitHotkey, rows, children, }: ComposerProviderProps): import("react").JSX.Element;
 //# sourceMappingURL=context.d.ts.map

package/dist/Composer/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../src/Composer/context.tsx"],"names":[],"mappings":"AASA,OAAO,EAQH,KAAK,SAAS,EACd,KAAK,SAAS,EACjB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAGnD,OAAO,KAAK,EAER,oBAAoB,EACpB,aAAa,EAChB,MAAM,SAAS,CAAC;AAEjB,MAAM,MAAM,mBAAmB,GAAG;IAC9B,KAAK,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IAC/B,KAAK,EAAE,aAAa,CAAC;IACrB,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,WAAW,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,QAAQ,EAAE,CAAC,KAAK,EAAE,QAAQ,GAAG,SAAS,IAAI,EAAE,KAAK,IAAI,CAAC;IACtD,gBAAgB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,eAAe,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,OAAO,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,OAAO,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC;IAC3C,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,QAAQ,EAAE,SAAS,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAC;IAChD,YAAY,EAAE,OAAO,CAAC;IACtB,IAAI,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;CACxC,CAAC;AAIF,wBAAgB,WAAW,IAAI,oBAAoB,CAQlD;AAmCD,MAAM,MAAM,qBAAqB,GAAG;IAChC,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACzC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,oBAAoB,CAAC,CAAC;IAC1D,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,GAAG,WAAW,CAAC;IACrC,4DAA4D;IAC5D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;CACvB,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,IAAY,EACZ,WAAkC,EAClC,SAAgB,EAChB,YAA0B,EAC1B,IAAQ,EACR,QAAQ,GACX,EAAE,qBAAqB,+BAgOvB"}
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../src/Composer/context.tsx"],"names":[],"mappings":"AASA,OAAO,EAQH,KAAK,SAAS,EACd,KAAK,SAAS,EACjB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAGnD,OAAO,KAAK,EAER,kBAAkB,EAClB,cAAc,EACd,oBAAoB,EACpB,aAAa,EAChB,MAAM,SAAS,CAAC;AAEjB,MAAM,MAAM,mBAAmB,GAAG;IAC9B,KAAK,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IAC/B,UAAU,EAAE,kBAAkB,CAAC;IAC/B,KAAK,EAAE,aAAa,CAAC;IACrB,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,WAAW,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,QAAQ,EAAE,CAAC,KAAK,EAAE,QAAQ,GAAG,SAAS,IAAI,EAAE,KAAK,IAAI,CAAC;IACtD,gBAAgB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,eAAe,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,OAAO,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,OAAO,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC;IAC3C,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,QAAQ,EAAE,SAAS,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAC;IAChD,YAAY,EAAE,OAAO,CAAC;IACtB,IAAI,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;CACxC,CAAC;AAIF,wBAAgB,WAAW,IAAI,oBAAoB,CAQlD;AAmCD,MAAM,MAAM,qBAAqB,GAAG;IAChC,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,4EAA4E;IAC5E,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC;IAC3C,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACzC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,oBAAoB,CAAC,CAAC;IAC1D,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,GAAG,WAAW,CAAC;IACrC,4DAA4D;IAC5D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;CACvB,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,EAC7B,UAAe,EACf,OAAO,EACP,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,IAAY,EACZ,WAAkC,EAClC,SAAgB,EAChB,YAA0B,EAC1B,IAAQ,EACR,QAAQ,GACX,EAAE,qBAAqB,+BAoQvB"}

package/dist/Composer/context.js

@@ -1,70 +1,91 @@
-import { coerceUploadMimeType as z, MAX_CHAT_ATTACHMENT_BYTES_PER_FILE as y, MAX_CHAT_ATTACHMENT_BYTES_TOTAL as x, COMPOSER_PASTE_AS_FILE_MIN_CHARS as $ } from "@reforma/constants";
-import { revokeObjectURL as A, formatFileSize as F, createObjectURL as X } from "@reforma/lib";
-import { useRef as f, useState as Y, useLayoutEffect as W, useEffect as q, useCallback as R, use as G, createContext as J } from "react";
-import { useFileDrag as K } from "../hooks/useFileDrag.js";
-import { toast as T } from "../Toast/Toast.js";
-import { jsxs as Q, jsx as V } from "react/jsx-runtime";
-const M = /* @__PURE__ */ J(null);
-function it() {
-  const o = G(M);
-  if (!o)
+import { coerceUploadMimeType as x, MAX_CHAT_ATTACHMENT_BYTES_PER_FILE as S, MAX_CHAT_ATTACHMENT_BYTES_TOTAL as O, COMPOSER_PASTE_AS_FILE_MIN_CHARS as Z } from "@reforma/constants";
+import { revokeObjectURL as C, formatFileSize as P, createObjectURL as ee } from "@reforma/lib";
+import { useState as k, useCallback as y, useRef as f, useLayoutEffect as B, useEffect as te, use as re, createContext as ne } from "react";
+import { useFileDrag as oe } from "../hooks/useFileDrag.js";
+import { Show as se } from "../Show/Show.js";
+import { jsxs as D, jsx as H } from "react/jsx-runtime";
+const L = /* @__PURE__ */ ne(null);
+function fe() {
+  const s = re(L);
+  if (!s)
     throw new Error("Composer pieces must render inside ComposerProvider");
-  return o;
-}
-function Z(o) {
-  let s = 0;
-  for (const c of o)
-    typeof c.size == "number" && Number.isFinite(c.size) && (s += c.size);
   return s;
 }
-function tt(o) {
-  return o.length === 0 ? !0 : o.every((s) => s.uploadStatus === "ready" && !!s.url);
+function ae(s) {
+  let a = 0;
+  for (const i of s)
+    typeof i.size == "number" && Number.isFinite(i.size) && (a += i.size);
+  return a;
+}
+function ie(s) {
+  return s.length === 0 ? !0 : s.every((a) => a.uploadStatus === "ready" && !!a.url);
 }
-function v(o, s, c) {
+function E(s, a, i) {
   return {
-    ...o,
-    attachments: o.attachments.map((m) => m.clientId === s ? {
+    ...s,
+    attachments: s.attachments.map((m) => m.clientId === a ? {
       ...m,
-      ...c
+      ...i
     } : m)
   };
 }
-function ct({
-  value: o,
-  onChange: s,
-  onSubmit: c,
-  uploadFile: m,
-  busy: E = !1,
-  placeholder: b = "What should it do?",
-  autoFocus: O = !0,
-  submitHotkey: C = "mod+enter",
-  rows: h = 3,
-  children: P
+function he({
+  classNames: s = {},
+  onError: a,
+  value: i,
+  onChange: m,
+  onSubmit: U,
+  uploadFile: _,
+  busy: z = !1,
+  placeholder: I = "What should it do?",
+  autoFocus: N = !0,
+  submitHotkey: j = "mod+enter",
+  rows: A = 3,
+  children: $
 }) {
-  const S = f(null), _ = f(null), i = f(o), l = f(/* @__PURE__ */ new Map()), [B, D] = Y(!1);
-  W(() => {
-    i.current = o;
-  }, [o]), q(() => {
-    const t = l.current;
+  const [v, R] = k(null), h = y((e) => {
+    a ? a(e) : R(e);
+  }, [a]), w = f(null), F = f(null), c = f(i), M = f(m), d = f(/* @__PURE__ */ new Map()), [X, Y] = k(!1);
+  B(() => {
+    c.current = i;
+  }, [i]), B(() => {
+    M.current = m;
+  }, [m]);
+  const l = y((e) => {
+    c.current = e, M.current(e);
+  }, []);
+  te(() => {
+    const e = d.current;
     return () => {
-      for (const n of i.current.attachments)
-        A(n.preview);
-      t.clear();
+      for (const n of c.current.attachments)
+        C(n.preview);
+      e.clear();
     };
   }, []);
-  const w = !!o.prompt.trim() && tt(o.attachments) && !E, g = R(async (t, n) => {
-    const r = await m(n), a = i.current;
-    if (!a.attachments.some((u) => u.clientId === t)) {
-      l.current.delete(t);
+  const b = !!i.prompt.trim() && ie(i.attachments) && !z, T = y(async (e, n) => {
+    let r;
+    try {
+      r = await _(n);
+    } catch (u) {
+      r = {
+        ok: !1,
+        message: u instanceof Error ? u.message : void 0
+      };
+    }
+    if (d.current.get(e) !== n)
+      return;
+    const o = c.current;
+    if (!o.attachments.some((u) => u.clientId === e)) {
+      d.current.delete(e);
       return;
     }
     if (r.ok) {
-      const u = a.attachments.find((d) => d.clientId === t)?.preview;
-      A(u), l.current.delete(t), s(v(a, t, {
+      const u = o.attachments.find((p) => p.clientId === e)?.preview;
+      C(u), d.current.delete(e), l(E(o, e, {
         id: r.data.id,
         url: r.data.url,
         filename: r.data.name ?? n.name,
-        mediaType: r.data.mimeType ?? z(n.name, n.type),
+        mediaType: r.data.mimeType ?? x(n.name, n.type),
         size: r.data.size ?? n.size,
         uploadStatus: "ready",
         uploadError: void 0,
@@ -72,134 +93,141 @@ function ct({
       }));
       return;
     }
-    s(v(a, t, {
+    l(E(o, e, {
       uploadStatus: "error",
       uploadError: r.message ?? "Upload failed"
     }));
-  }, [s, m]), p = R((t) => {
-    const n = [...t], r = [];
-    let a = 0;
-    const u = Z(i.current.attachments);
-    for (const e of n) {
-      if (e.size > y) {
-        T.warning({
+  }, [l, _]), g = y((e) => {
+    R(null);
+    const n = [...e], r = [];
+    let o = 0;
+    const u = ae(c.current.attachments);
+    for (const t of n) {
+      if (t.size > S) {
+        h({
           title: "Attachment too large",
-          message: `${e.name} is over the ${F(y, {
+          message: `${t.name} is over the ${P(S, {
             round: "up"
           })} per-file limit.`
         });
         continue;
       }
-      if (u + a + e.size > x) {
-        T.warning({
+      if (u + o + t.size > O) {
+        h({
           title: "Attachments too large",
-          message: `Adding ${e.name} would exceed the ${F(x, {
+          message: `Adding ${t.name} would exceed the ${P(O, {
             round: "up"
           })} combined limit.`
         });
         continue;
       }
-      r.push(e), a += e.size;
+      r.push(t), o += t.size;
     }
     if (r.length === 0)
       return;
-    const d = r.map((e) => ({
+    const p = r.map((t) => ({
       clientId: crypto.randomUUID(),
-      filename: e.name,
-      mediaType: z(e.name, e.type),
-      size: e.size,
-      lastModified: e.lastModified,
+      filename: t.name,
+      mediaType: x(t.name, t.type),
+      size: t.size,
+      lastModified: t.lastModified,
       uploadStatus: "uploading",
-      preview: X(e) ?? void 0
+      preview: ee(t) ?? void 0
     }));
-    for (let e = 0; e < r.length; e++)
-      l.current.set(d[e].clientId, r[e]);
-    const N = {
-      ...i.current,
-      attachments: [...i.current.attachments, ...d]
+    for (let t = 0; t < r.length; t++)
+      d.current.set(p[t].clientId, r[t]);
+    const Q = {
+      ...c.current,
+      attachments: [...c.current.attachments, ...p]
     };
-    s(N);
-    for (let e = 0; e < r.length; e++)
-      g(d[e].clientId, r[e]);
-  }, [s, g]), H = K({
-    onFileDragOver: D,
-    onFilesDropped: (t) => p(t)
-  }), I = (t) => {
-    const n = i.current, r = n.attachments.find((a) => a.clientId === t);
-    A(r?.preview), l.current.delete(t), s({
+    l(Q);
+    for (let t = 0; t < r.length; t++)
+      T(p[t].clientId, r[t]);
+  }, [l, T, h]), V = oe({
+    onFileDragOver: Y,
+    onFilesDropped: (e) => g(e)
+  }), W = (e) => {
+    const n = c.current, r = n.attachments.find((o) => o.clientId === e);
+    C(r?.preview), d.current.delete(e), l({
       ...n,
-      attachments: n.attachments.filter((a) => a.clientId !== t)
+      attachments: n.attachments.filter((o) => o.clientId !== e)
     });
-  }, L = (t) => {
-    const n = i.current, r = n.attachments.find((u) => u.clientId === t), a = l.current.get(t);
+  }, q = (e) => {
+    const n = c.current, r = n.attachments.find((u) => u.clientId === e), o = d.current.get(e);
     if (!(!r || r.uploadStatus !== "error")) {
-      if (!a) {
-        T.warning({
+      if (!o) {
+        h({
           title: "Could not retry",
           message: "Remove the file and attach it again."
         });
         return;
       }
-      s(v(n, t, {
+      l(E(n, e, {
         uploadStatus: "uploading",
         uploadError: void 0
-      })), g(t, a);
+      })), T(e, o);
     }
-  }, U = () => {
-    w && c();
-  }, k = (t) => {
-    if (t.length < $)
+  }, G = () => {
+    b && U();
+  }, J = (e) => {
+    if (e.length < Z)
       return !1;
-    const n = new File([t], "paste.txt", {
+    const n = new File([e], "paste.txt", {
       type: "text/plain"
     });
-    return n.size > y ? !1 : (p([n]), !0);
-  }, j = {
-    value: o,
-    setPrompt: (t) => s({
-      ...i.current,
-      prompt: t
+    return n.size > S ? !1 : (g([n]), !0);
+  }, K = {
+    classNames: s,
+    value: i,
+    setPrompt: (e) => l({
+      ...c.current,
+      prompt: e
     }),
-    setPlanMode: (t) => s({
-      ...i.current,
-      planMode: t
+    setPlanMode: (e) => l({
+      ...c.current,
+      planMode: e
     }),
-    addFiles: p,
-    removeAttachment: I,
-    retryAttachment: L,
-    submit: U,
-    canSubmit: w,
-    busy: E,
-    placeholder: b,
-    autoFocus: O,
-    submitOnEnter: C === "enter",
-    rows: h,
-    minHeight: h ? h * 22 : 20,
-    pasteTextAsFile: k,
-    openFilePicker: () => S.current?.click(),
-    focus: () => _.current?.focus(),
-    focusRef: _,
-    fileDragOver: B,
-    drag: H
+    addFiles: g,
+    removeAttachment: W,
+    retryAttachment: q,
+    submit: G,
+    canSubmit: b,
+    busy: z,
+    placeholder: I,
+    autoFocus: N,
+    submitOnEnter: j === "enter",
+    rows: A,
+    minHeight: A ? A * 22 : 20,
+    pasteTextAsFile: J,
+    openFilePicker: () => w.current?.click(),
+    focus: () => F.current?.focus(),
+    focusRef: F,
+    fileDragOver: X,
+    drag: V
   };
-  return /* @__PURE__ */ Q(M, {
-    value: j,
-    children: [P, /* @__PURE__ */ V("input", {
-      ref: S,
+  return /* @__PURE__ */ D(L, {
+    value: K,
+    children: [$, /* @__PURE__ */ H(se, {
+      when: v && !a,
+      children: /* @__PURE__ */ D("p", {
+        role: "alert",
+        className: s.notice,
+        children: [v?.title, ": ", v?.message]
+      })
+    }), /* @__PURE__ */ H("input", {
+      ref: w,
       type: "file",
       multiple: !0,
       tabIndex: -1,
-      style: {
-        display: "none"
-      },
-      onChange: (t) => {
-        t.target.files?.length && p(t.target.files), t.target.value = "";
+      hidden: !0,
+      onChange: (e) => {
+        e.target.files?.length && g(e.target.files), e.target.value = "";
       }
     })]
   });
 }
 export {
-  ct as ComposerProvider,
-  it as useComposer
+  he as ComposerProvider,
+  fe as useComposer
 };
 //# sourceMappingURL=context.js.map