@jbpark/live-editor 4.6.1 → 5.0.0

package/dist/editor/index.js

@@ -1,3 +1,3 @@
-import { t as Core } from "../core-Bgfek364.js";
-import { t as Editor } from "../editor-CMElfHer.js";
+import { t as Core } from "../core-CKazr4tT.js";
+import { t as Editor } from "../editor-Bty5XzpV.js";
 export { Core, Editor as default };

package/dist/{editor-CMElfHer.js → editor-Bty5XzpV.js}

@@ -1,5 +1,5 @@
 import { i as usePreview, r as useError } from "./states-Ci1AvoQ9.js";
-import { n as useFormatCode, t as Core } from "./core-Bgfek364.js";
+import { n as useFormatCode, t as Core } from "./core-CKazr4tT.js";
 import { useCallback, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 import { useDebouncedCallback } from "@jbpark/use-hooks";
@@ -63,4 +63,4 @@ Editor.Core = Core;
 //#endregion
 export { Editor as t };
 
-//# sourceMappingURL=editor-CMElfHer.js.map
+//# sourceMappingURL=editor-Bty5XzpV.js.map

package/dist/{editor-CMElfHer.js.map → editor-Bty5XzpV.js.map}

@@ -1 +1 @@
-{"version":3,"file":"editor-CMElfHer.js","names":["Editor","EditorImpl"],"sources":["../src/components/editor/editor.tsx","../src/components/editor/index.ts"],"sourcesContent":["import { useCallback, useState } from 'react';\n\nimport { useDebouncedCallback } from '@jbpark/use-hooks';\n\nimport { useError, usePreview } from '~/components/context/states';\n\nimport Core, { type Props as CoreProps } from './core';\nimport { useFormatCode } from './use-format-code';\n\nexport interface EditorRenderData {\n  value: string;\n  onChange: (value: string) => void;\n  // The same Prettier formatting the built-in editor uses on Cmd+S, for a\n  // custom editor's own format-on-save.\n  formatCode: (code: string) => Promise<string>;\n}\n\nexport interface Props extends Omit<CoreProps, 'value' | 'onSave' | 'onError'> {\n  value?: string;\n  defaultValue?: string;\n  debounce?: number;\n  // Replaces the built-in CodeMirror editor. `Live.Editor` still sends the\n  // value to the provider, debounced; only the editing surface changes.\n  renderEditor?: (data: EditorRenderData) => React.ReactNode;\n}\n\nconst Editor = ({\n  defaultValue,\n  value: _value,\n  debounce = 1000,\n  onChange: _onChange,\n  renderEditor,\n  fragment,\n  prettierOptions,\n  ...props\n}: Props) => {\n  const { code, setCode } = usePreview();\n  const { setError } = useError();\n\n  // Controlled, the host owns the document; uncontrolled, the provider does\n  // (#341). `draft` shows each keystroke at once, while the provider hears\n  // about it after `debounce`.\n  const controlled = _value !== undefined;\n  const [draft, setDraft] = useState(() => defaultValue ?? code);\n\n  // The last code this editor pushed, and the provider code it has already\n  // seen. A provider change that isn't this editor's own push came from\n  // somewhere else sharing the provider — an uncontrolled DnD, say — and the\n  // draft follows it. Adjusted during render so no frame shows the old one.\n  const [pushed, setPushed] = useState<string | null>(null);\n  const [seenCode, setSeenCode] = useState(code);\n\n  if (code !== seenCode) {\n    setSeenCode(code);\n\n    if (!controlled && code !== pushed) {\n      setDraft(code);\n    }\n  }\n\n  const value = controlled ? _value : draft;\n\n  const pushCode = useCallback(\n    (next: string) => {\n      setPushed(next);\n      setCode(next);\n    },\n    [setCode],\n  );\n\n  const onChange = useCallback(\n    (next: string) => {\n      if (!controlled) {\n        setDraft(next);\n      }\n\n      _onChange?.(next);\n    },\n    [_onChange, controlled],\n  );\n\n  // Formatting on save reaches the provider at once, ahead of the debounce.\n  const onSave = useCallback(\n    (formattedCode: string) => {\n      pushCode(formattedCode);\n    },\n    [pushCode],\n  );\n\n  const onError = useCallback(\n    (error: string | null) => {\n      setError(error);\n    },\n    [setError],\n  );\n\n  const formatCode = useFormatCode({ fragment, prettierOptions });\n\n  // Pushes `value` to the provider `debounce` ms after it stops changing,\n  // and at once on mount. A pending push is never dropped: it runs when the\n  // editor unmounts, and when focus leaves it — so clicking into another\n  // surface right after typing edits a document that includes the typing.\n  const push = useDebouncedCallback(\n    () => pushCode(value),\n    { delay: debounce, flushOnUnmount: true },\n    [value],\n  );\n\n  // `display: contents` so the wrapper adds a blur listener without adding a\n  // box: the editor lays out against this element's parent, as before.\n  return (\n    <div style={{ display: 'contents' }} onBlur={push.flush}>\n      {renderEditor ? (\n        renderEditor({ value, onChange, formatCode })\n      ) : (\n        <Core\n          value={value}\n          onChange={onChange}\n          onSave={onSave}\n          onError={onError}\n          fragment={fragment}\n          prettierOptions={prettierOptions}\n          {...props}\n        />\n      )}\n    </div>\n  );\n};\n\nexport default Editor;\n","import Core, { type Props as CoreProps } from './core';\nimport EditorImpl, { type EditorRenderData, type Props } from './editor';\n\ntype EditorComponent = typeof EditorImpl & { Core: typeof Core };\n\nconst Editor = EditorImpl as EditorComponent;\n\nEditor.Core = Core;\n\nexport { Core };\nexport type { Props, CoreProps, EditorRenderData };\nexport default Editor;\n"],"mappings":";;;;;;AA0BA,MAAMA,YAAU,EACd,cACA,OAAO,QACP,WAAW,KACX,UAAU,WACV,cACA,UACA,iBACA,GAAG,YACQ;CACX,MAAM,EAAE,MAAM,YAAY,WAAW;CACrC,MAAM,EAAE,aAAa,SAAS;CAK9B,MAAM,aAAa,WAAW,KAAA;CAC9B,MAAM,CAAC,OAAO,YAAY,eAAe,gBAAgB,IAAI;CAM7D,MAAM,CAAC,QAAQ,aAAa,SAAwB,IAAI;CACxD,MAAM,CAAC,UAAU,eAAe,SAAS,IAAI;CAE7C,IAAI,SAAS,UAAU;EACrB,YAAY,IAAI;EAEhB,IAAI,CAAC,cAAc,SAAS,QAC1B,SAAS,IAAI;CAEjB;CAEA,MAAM,QAAQ,aAAa,SAAS;CAEpC,MAAM,WAAW,aACd,SAAiB;EAChB,UAAU,IAAI;EACd,QAAQ,IAAI;CACd,GACA,CAAC,OAAO,CACV;CAEA,MAAM,WAAW,aACd,SAAiB;EAChB,IAAI,CAAC,YACH,SAAS,IAAI;EAGf,YAAY,IAAI;CAClB,GACA,CAAC,WAAW,UAAU,CACxB;CAGA,MAAM,SAAS,aACZ,kBAA0B;EACzB,SAAS,aAAa;CACxB,GACA,CAAC,QAAQ,CACX;CAEA,MAAM,UAAU,aACb,UAAyB;EACxB,SAAS,KAAK;CAChB,GACA,CAAC,QAAQ,CACX;CAEA,MAAM,aAAa,cAAc;EAAE;EAAU;CAAgB,CAAC;CAM9D,MAAM,OAAO,2BACL,SAAS,KAAK,GACpB;EAAE,OAAO;EAAU,gBAAgB;CAAK,GACxC,CAAC,KAAK,CACR;CAIA,OACE,oBAAC,OAAD;EAAK,OAAO,EAAE,SAAS,WAAW;EAAG,QAAQ,KAAK;EAC/C,UAAA,eACC,aAAa;GAAE;GAAO;GAAU;EAAW,CAAC,IAE5C,oBAAC,MAAD;GACS;GACG;GACF;GACC;GACC;GACO;GACjB,GAAI;EACL,CAAA;CAEA,CAAA;AAET;;;AC1HA,MAAM,SAASC;AAEf,OAAO,OAAO"}
+{"version":3,"file":"editor-Bty5XzpV.js","names":["Editor","EditorImpl"],"sources":["../src/components/editor/editor.tsx","../src/components/editor/index.ts"],"sourcesContent":["import { useCallback, useState } from 'react';\n\nimport { useDebouncedCallback } from '@jbpark/use-hooks';\n\nimport { useError, usePreview } from '~/components/context/states';\n\nimport Core, { type Props as CoreProps } from './core';\nimport { useFormatCode } from './use-format-code';\n\nexport interface EditorRenderData {\n  value: string;\n  onChange: (value: string) => void;\n  // The same Prettier formatting the built-in editor uses on Cmd+S, for a\n  // custom editor's own format-on-save.\n  formatCode: (code: string) => Promise<string>;\n}\n\nexport interface Props extends Omit<CoreProps, 'value' | 'onSave' | 'onError'> {\n  value?: string;\n  defaultValue?: string;\n  debounce?: number;\n  // Replaces the built-in CodeMirror editor. `Live.Editor` still sends the\n  // value to the provider, debounced; only the editing surface changes.\n  renderEditor?: (data: EditorRenderData) => React.ReactNode;\n}\n\nconst Editor = ({\n  defaultValue,\n  value: _value,\n  debounce = 1000,\n  onChange: _onChange,\n  renderEditor,\n  fragment,\n  prettierOptions,\n  ...props\n}: Props) => {\n  const { code, setCode } = usePreview();\n  const { setError } = useError();\n\n  // Controlled, the host owns the document; uncontrolled, the provider does\n  // (#341). `draft` shows each keystroke at once, while the provider hears\n  // about it after `debounce`.\n  const controlled = _value !== undefined;\n  const [draft, setDraft] = useState(() => defaultValue ?? code);\n\n  // The last code this editor pushed, and the provider code it has already\n  // seen. A provider change that isn't this editor's own push came from\n  // somewhere else sharing the provider — an uncontrolled DnD, say — and the\n  // draft follows it. Adjusted during render so no frame shows the old one.\n  const [pushed, setPushed] = useState<string | null>(null);\n  const [seenCode, setSeenCode] = useState(code);\n\n  if (code !== seenCode) {\n    setSeenCode(code);\n\n    if (!controlled && code !== pushed) {\n      setDraft(code);\n    }\n  }\n\n  const value = controlled ? _value : draft;\n\n  const pushCode = useCallback(\n    (next: string) => {\n      setPushed(next);\n      setCode(next);\n    },\n    [setCode],\n  );\n\n  const onChange = useCallback(\n    (next: string) => {\n      if (!controlled) {\n        setDraft(next);\n      }\n\n      _onChange?.(next);\n    },\n    [_onChange, controlled],\n  );\n\n  // Formatting on save reaches the provider at once, ahead of the debounce.\n  const onSave = useCallback(\n    (formattedCode: string) => {\n      pushCode(formattedCode);\n    },\n    [pushCode],\n  );\n\n  const onError = useCallback(\n    (error: string | null) => {\n      setError(error);\n    },\n    [setError],\n  );\n\n  const formatCode = useFormatCode({ fragment, prettierOptions });\n\n  // Pushes `value` to the provider `debounce` ms after it stops changing,\n  // and at once on mount. A pending push is never dropped: it runs when the\n  // editor unmounts, and when focus leaves it — so clicking into another\n  // surface right after typing edits a document that includes the typing.\n  const push = useDebouncedCallback(\n    () => pushCode(value),\n    { delay: debounce, flushOnUnmount: true },\n    [value],\n  );\n\n  // `display: contents` so the wrapper adds a blur listener without adding a\n  // box: the editor lays out against this element's parent, as before.\n  return (\n    <div style={{ display: 'contents' }} onBlur={push.flush}>\n      {renderEditor ? (\n        renderEditor({ value, onChange, formatCode })\n      ) : (\n        <Core\n          value={value}\n          onChange={onChange}\n          onSave={onSave}\n          onError={onError}\n          fragment={fragment}\n          prettierOptions={prettierOptions}\n          {...props}\n        />\n      )}\n    </div>\n  );\n};\n\nexport default Editor;\n","import Core, { type Props as CoreProps } from './core';\nimport EditorImpl, { type EditorRenderData, type Props } from './editor';\n\ntype EditorComponent = typeof EditorImpl & { Core: typeof Core };\n\nconst Editor = EditorImpl as EditorComponent;\n\nEditor.Core = Core;\n\nexport { Core };\nexport type { Props, CoreProps, EditorRenderData };\nexport default Editor;\n"],"mappings":";;;;;;AA0BA,MAAMA,YAAU,EACd,cACA,OAAO,QACP,WAAW,KACX,UAAU,WACV,cACA,UACA,iBACA,GAAG,YACQ;CACX,MAAM,EAAE,MAAM,YAAY,WAAW;CACrC,MAAM,EAAE,aAAa,SAAS;CAK9B,MAAM,aAAa,WAAW,KAAA;CAC9B,MAAM,CAAC,OAAO,YAAY,eAAe,gBAAgB,IAAI;CAM7D,MAAM,CAAC,QAAQ,aAAa,SAAwB,IAAI;CACxD,MAAM,CAAC,UAAU,eAAe,SAAS,IAAI;CAE7C,IAAI,SAAS,UAAU;EACrB,YAAY,IAAI;EAEhB,IAAI,CAAC,cAAc,SAAS,QAC1B,SAAS,IAAI;CAEjB;CAEA,MAAM,QAAQ,aAAa,SAAS;CAEpC,MAAM,WAAW,aACd,SAAiB;EAChB,UAAU,IAAI;EACd,QAAQ,IAAI;CACd,GACA,CAAC,OAAO,CACV;CAEA,MAAM,WAAW,aACd,SAAiB;EAChB,IAAI,CAAC,YACH,SAAS,IAAI;EAGf,YAAY,IAAI;CAClB,GACA,CAAC,WAAW,UAAU,CACxB;CAGA,MAAM,SAAS,aACZ,kBAA0B;EACzB,SAAS,aAAa;CACxB,GACA,CAAC,QAAQ,CACX;CAEA,MAAM,UAAU,aACb,UAAyB;EACxB,SAAS,KAAK;CAChB,GACA,CAAC,QAAQ,CACX;CAEA,MAAM,aAAa,cAAc;EAAE;EAAU;CAAgB,CAAC;CAM9D,MAAM,OAAO,2BACL,SAAS,KAAK,GACpB;EAAE,OAAO;EAAU,gBAAgB;CAAK,GACxC,CAAC,KAAK,CACR;CAIA,OACE,oBAAC,OAAD;EAAK,OAAO,EAAE,SAAS,WAAW;EAAG,QAAQ,KAAK;EAC/C,UAAA,eACC,aAAa;GAAE;GAAO;GAAU;EAAW,CAAC,IAE5C,oBAAC,MAAD;GACS;GACG;GACF;GACC;GACC;GACO;GACjB,GAAI;EACL,CAAA;CAEA,CAAA;AAET;;;AC1HA,MAAM,SAASC;AAEf,OAAO,OAAO"}

package/dist/error/index.d.ts

@@ -1,2 +1,2 @@
-import { i as Guard, o as Props, r as Runtime, s as ErrorBoundary, t as Error } from "../index-CRwEhJ7w.js";
+import { i as Guard, o as Props, r as Runtime, s as ErrorBoundary, t as Error } from "../index-kKUjo9lr.js";
 export { ErrorBoundary, Guard as ErrorGuard, Runtime as ErrorRuntime, type Props, Error as default };

package/dist/error/index.js

@@ -1,3 +1,3 @@
-import { t as ErrorBoundary } from "../boundary-BLB80tyw.js";
-import { n as Runtime, r as Guard, t as Error } from "../error-CN_GCnXB.js";
+import { t as ErrorBoundary } from "../boundary-6_nTsWxP.js";
+import { n as Runtime, r as Guard, t as Error } from "../error-DyYx2NQ2.js";
 export { ErrorBoundary, Guard as ErrorGuard, Runtime as ErrorRuntime, Error as default };

package/dist/{error-CN_GCnXB.js → error-DyYx2NQ2.js}

@@ -1,19 +1,15 @@
-import { i as useLiveMessages } from "./messages-CSrMI4Rm.js";
+import { i as useLiveMessages } from "./messages-Bt5WXKTE.js";
 import { r as useError } from "./states-Ci1AvoQ9.js";
-import { n as Error$1, t as ErrorBoundary } from "./boundary-BLB80tyw.js";
+import { n as Error$1, t as ErrorBoundary } from "./boundary-6_nTsWxP.js";
 import { useEffect, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
-import { useEventListener } from "@jbpark/use-hooks";
+import { useEventListener, useLatest } from "@jbpark/use-hooks";
 //#region src/components/error/guard.tsx
 const Guard = ({ children, onError }) => {
 	const [error, setError] = useState(null);
 	const messages = useLiveMessages();
-	const containerRef = useRef(null);
 	const errorHandled = useRef(false);
-	const messagesRef = useRef(messages);
-	useEffect(() => {
-		messagesRef.current = messages;
-	});
+	const messagesRef = useLatest(messages);
 	useEventListener("error", (event) => {
 		if (errorHandled.current) return;
 		errorHandled.current = true;
@@ -26,24 +22,17 @@ const Guard = ({ children, onError }) => {
 			errorHandled.current = false;
 		}, 100);
 	}, { capture: true });
-	useEffect(() => {
-		if (!containerRef.current) return;
-		const handleUnhandledRejection = (event) => {
-			if (errorHandled.current) return;
-			errorHandled.current = true;
-			const errorMessage = event.reason?.message || messagesRef.current.errors.unhandledRejection;
-			event.preventDefault();
-			setError(errorMessage);
-			onError?.(event.reason || new window.Error(errorMessage));
-			setTimeout(() => {
-				errorHandled.current = false;
-			}, 100);
-		};
-		window.addEventListener("unhandledrejection", handleUnhandledRejection, true);
-		return () => {
-			window.removeEventListener("unhandledrejection", handleUnhandledRejection, true);
-		};
-	}, [onError]);
+	useEventListener("unhandledrejection", (event) => {
+		if (errorHandled.current) return;
+		errorHandled.current = true;
+		const errorMessage = event.reason?.message || messagesRef.current.errors.unhandledRejection;
+		event.preventDefault();
+		setError(errorMessage);
+		onError?.(event.reason || new window.Error(errorMessage));
+		setTimeout(() => {
+			errorHandled.current = false;
+		}, 100);
+	}, { capture: true });
 	if (error) return /* @__PURE__ */ jsx(Error$1, {
 		title: messages.errors.runtime,
 		message: error,
@@ -53,10 +42,7 @@ const Guard = ({ children, onError }) => {
 			errorHandled.current = false;
 		}
 	});
-	return /* @__PURE__ */ jsx("div", {
-		ref: containerRef,
-		children
-	});
+	return /* @__PURE__ */ jsx("div", { children });
 };
 //#endregion
 //#region src/components/error/runtime.tsx
@@ -86,4 +72,4 @@ Error.Guard = Guard;
 //#endregion
 export { Runtime as n, Guard as r, Error as t };
 
-//# sourceMappingURL=error-CN_GCnXB.js.map
+//# sourceMappingURL=error-DyYx2NQ2.js.map

package/dist/error-DyYx2NQ2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"error-DyYx2NQ2.js","names":["ErrorComponent","Error","ErrorImpl","ErrorRuntime","ErrorGuard"],"sources":["../src/components/error/guard.tsx","../src/components/error/runtime.tsx","../src/components/error/index.ts"],"sourcesContent":["import { useRef, useState } from 'react';\n\nimport { useEventListener, useLatest } from '@jbpark/use-hooks';\n\nimport { useLiveMessages } from '~/components/context/messages';\n\nimport ErrorComponent from './error';\n\n// Exported although no file imports it: the declaration of `App` in\n// `src/index.tsx` names it, and TypeScript can't name a type from another\n// module unless it is exported (TS4023).\nexport interface Props {\n  children: React.ReactNode;\n  onError?: (error: Error) => void;\n}\n\nconst Guard = ({ children, onError }: Props) => {\n  const [error, setError] = useState<string | null>(null);\n  const messages = useLiveMessages();\n\n  const errorHandled = useRef(false);\n  // Read by the listeners, so new messages don't subscribe them again.\n  const messagesRef = useLatest(messages);\n\n  useEventListener(\n    'error',\n    event => {\n      if (errorHandled.current) {\n        return;\n      }\n\n      errorHandled.current = true;\n\n      const errorMessage =\n        event.error?.message ||\n        event.message ||\n        messagesRef.current.errors.unknown;\n\n      console.error('⚡ [Guard] Event handler error:', errorMessage);\n\n      event.preventDefault();\n\n      setError(errorMessage);\n      onError?.(event.error || new window.Error(errorMessage));\n\n      setTimeout(() => {\n        errorHandled.current = false;\n      }, 100);\n    },\n    { capture: true },\n  );\n\n  useEventListener(\n    'unhandledrejection',\n    event => {\n      if (errorHandled.current) {\n        return;\n      }\n\n      errorHandled.current = true;\n\n      const errorMessage =\n        event.reason?.message || messagesRef.current.errors.unhandledRejection;\n\n      event.preventDefault();\n      setError(errorMessage);\n      onError?.(event.reason || new window.Error(errorMessage));\n\n      setTimeout(() => {\n        errorHandled.current = false;\n      }, 100);\n    },\n    { capture: true },\n  );\n\n  if (error) {\n    return (\n      <ErrorComponent\n        title={messages.errors.runtime}\n        message={error}\n        className=\"m-4\"\n        onReset={() => {\n          setError(null);\n          errorHandled.current = false;\n        }}\n      />\n    );\n  }\n\n  return <div>{children}</div>;\n};\n\nexport default Guard;\n","import { useEffect } from 'react';\n\nimport { useEventListener } from '@jbpark/use-hooks';\n\nimport { useLiveMessages } from '~/components/context/messages';\nimport { useError } from '~/components/context/states';\n\nimport Error from './error';\n\n// Exported although no file imports it: the declaration of `App` in\n// `src/index.tsx` names it, and TypeScript can't name a type from another\n// module unless it is exported (TS4023).\nexport interface Props extends React.ComponentPropsWithRef<'div'> {\n  open?: boolean;\n  reset?: () => void;\n}\n\nconst Runtime = ({ open = true, reset }: Props) => {\n  const { error: message, setError } = useError();\n  const messages = useLiveMessages();\n\n  useEventListener('error', e => {\n    setError(e.message);\n    e.preventDefault();\n  });\n\n  useEffect(() => {\n    return () => setError(null);\n  }, [setError]);\n\n  if (!open) {\n    return null;\n  }\n\n  return (\n    <Error message={message} onReset={reset} title={messages.errors.runtime} />\n  );\n};\n\nexport default Runtime;\n","import ErrorBoundary from './boundary';\nimport ErrorImpl, { type Props } from './error';\nimport ErrorGuard from './guard';\nimport ErrorRuntime from './runtime';\n\ntype ErrorComponent = typeof ErrorImpl & {\n  Boundary: typeof ErrorBoundary;\n  Runtime: typeof ErrorRuntime;\n  Guard: typeof ErrorGuard;\n};\n\nconst Error = ErrorImpl as ErrorComponent;\n\nError.Boundary = ErrorBoundary;\nError.Runtime = ErrorRuntime;\nError.Guard = ErrorGuard;\n\nexport { ErrorBoundary, ErrorRuntime, ErrorGuard };\nexport type { Props };\nexport default Error;\n"],"mappings":";;;;;;;AAgBA,MAAM,SAAS,EAAE,UAAU,cAAqB;CAC9C,MAAM,CAAC,OAAO,YAAY,SAAwB,IAAI;CACtD,MAAM,WAAW,gBAAgB;CAEjC,MAAM,eAAe,OAAO,KAAK;CAEjC,MAAM,cAAc,UAAU,QAAQ;CAEtC,iBACE,UACA,UAAS;EACP,IAAI,aAAa,SACf;EAGF,aAAa,UAAU;EAEvB,MAAM,eACJ,MAAM,OAAO,WACb,MAAM,WACN,YAAY,QAAQ,OAAO;EAE7B,QAAQ,MAAM,kCAAkC,YAAY;EAE5D,MAAM,eAAe;EAErB,SAAS,YAAY;EACrB,UAAU,MAAM,SAAS,IAAI,OAAO,MAAM,YAAY,CAAC;EAEvD,iBAAiB;GACf,aAAa,UAAU;EACzB,GAAG,GAAG;CACR,GACA,EAAE,SAAS,KAAK,CAClB;CAEA,iBACE,uBACA,UAAS;EACP,IAAI,aAAa,SACf;EAGF,aAAa,UAAU;EAEvB,MAAM,eACJ,MAAM,QAAQ,WAAW,YAAY,QAAQ,OAAO;EAEtD,MAAM,eAAe;EACrB,SAAS,YAAY;EACrB,UAAU,MAAM,UAAU,IAAI,OAAO,MAAM,YAAY,CAAC;EAExD,iBAAiB;GACf,aAAa,UAAU;EACzB,GAAG,GAAG;CACR,GACA,EAAE,SAAS,KAAK,CAClB;CAEA,IAAI,OACF,OACE,oBAACA,SAAD;EACE,OAAO,SAAS,OAAO;EACvB,SAAS;EACT,WAAU;EACV,eAAe;GACb,SAAS,IAAI;GACb,aAAa,UAAU;EACzB;CACD,CAAA;CAIL,OAAO,oBAAC,OAAD,EAAM,SAAc,CAAA;AAC7B;;;ACzEA,MAAM,WAAW,EAAE,OAAO,MAAM,YAAmB;CACjD,MAAM,EAAE,OAAO,SAAS,aAAa,SAAS;CAC9C,MAAM,WAAW,gBAAgB;CAEjC,iBAAiB,UAAS,MAAK;EAC7B,SAAS,EAAE,OAAO;EAClB,EAAE,eAAe;CACnB,CAAC;CAED,gBAAgB;EACd,aAAa,SAAS,IAAI;CAC5B,GAAG,CAAC,QAAQ,CAAC;CAEb,IAAI,CAAC,MACH,OAAO;CAGT,OACE,oBAACC,SAAD;EAAgB;EAAS,SAAS;EAAO,OAAO,SAAS,OAAO;CAAU,CAAA;AAE9E;;;AC1BA,MAAM,QAAQC;AAEd,MAAM,WAAW;AACjB,MAAM,UAAUC;AAChB,MAAM,QAAQC"}

package/dist/{index-CiWB0zFb.d.ts → index-0VB5C3Jk.d.ts}

@@ -1,7 +1,7 @@
-import { _ as BindingWidget, d as BindingOptions, f as BindingRegistry, g as BindingType, l as BindingKeyMap, m as BindingRenderMap, u as BindingOption, v as DataAttrNode } from "./validate-DB59Z_Nx.js";
-import { v as Section } from "./document-DqRSCtsx.js";
-import { B as UpdateFailure } from "./index-C_PfR4X9.js";
-import { t as FrameProps } from "./index-DpDU1IAw.js";
+import { a as BindingOption, d as BindingType, f as BindingWidget, i as BindingKeyMap, l as BindingRenderMap, o as BindingOptions, p as DataAttrNode, s as BindingRegistry } from "./types-Czps1Txy.js";
+import { n as Section } from "./index-C8h8TcIl.js";
+import { t as FrameProps } from "./index-92L7F440.js";
+import { r as UpdateFailure } from "./update-2PJbwoS8.js";
 import { useMultiSelect } from "@jbpark/use-hooks";
 //#region src/components/dnd/canvas/section-fallback-context.d.ts
 interface DndSectionFallbackArgs {
@@ -34,7 +34,16 @@ interface PanelBinding {
   min?: number;
   max?: number;
   pattern?: string;
+  patternMessage?: string;
   required?: boolean;
+  minLength?: number;
+  maxLength?: number;
+  step?: number;
+  minItems?: number;
+  maxItems?: number;
+  minDate?: string;
+  maxDate?: string;
+  protocols?: string[];
   meta?: Record<string, unknown>;
   value: unknown;
   rawValue: string;
@@ -56,12 +65,11 @@ interface PanelBindingSource {
 declare const resolvePanelBindings: (node: DataAttrNode) => PanelBindingSource | null;
 declare const withPanelCommit: (bindings: PanelBindingData[], commit: PanelNodeChange | undefined) => PanelBinding[];
 //#endregion
-//#region src/components/dnd/panel/field.d.ts
+//#region src/components/dnd/panel/types.d.ts
 interface FieldProps {
   binding: PanelBinding;
   onNodeChange?: PanelNodeChange;
 }
-declare const Field: (props: FieldProps) => import("react").JSX.Element;
 //#endregion
 //#region src/components/dnd/edit-options.d.ts
 type DndEditError = {
@@ -194,7 +202,7 @@ interface DraggableItemProps {
 }
 declare const DraggableItem: ({ item, children }: DraggableItemProps) => import("react").ReactNode;
 //#endregion
-//#region src/components/dnd/panel/use-dnd-children.d.ts
+//#region src/components/dnd/panel/children/use-dnd-children.d.ts
 interface DndChildrenOptions {
   onChange?: (value: string) => void;
 }
@@ -218,7 +226,10 @@ declare const useDndChildren: (items: DataAttrNode[], { onChange }?: DndChildren
 };
 type DndChildren = ReturnType<typeof useDndChildren>;
 //#endregion
-//#region src/components/dnd/panel/use-dnd-items.d.ts
+//#region src/components/dnd/panel/field.d.ts
+declare const Field: (props: FieldProps) => import("react").JSX.Element;
+//#endregion
+//#region src/components/dnd/panel/items/use-dnd-items.d.ts
 interface DndItemsNestedElement {
   id: string;
   tagName: string;
@@ -258,17 +269,21 @@ interface DndItems {
   expansion: DndItemsExpansion;
   actions: DndItemsActions;
   canEditStructure: boolean;
+  canAddItems: (count?: number) => boolean;
+  canRemoveItems: (count?: number) => boolean;
   parseError: boolean;
 }
 interface DndItemsOptions {
   render?: BindingRenderMap;
   onChange?: (value: string) => void;
   onNodeChange?: PanelNodeChange;
+  minItems?: number;
+  maxItems?: number;
 }
-declare const useDndItems: (value: string, { render, onChange, onNodeChange }?: DndItemsOptions) => DndItems;
+declare const useDndItems: (value: string, { render, onChange, onNodeChange, minItems, maxItems }?: DndItemsOptions) => DndItems;
 //#endregion
-//#region src/components/dnd/panel/field-kind.d.ts
-type FieldKind = 'readonly' | 'items' | 'children' | 'richtext' | 'jsx' | 'html' | 'object' | 'boolean' | 'select' | 'color' | 'date' | 'url' | 'number' | 'text';
+//#region src/components/dnd/panel/fields/field-kind.d.ts
+type FieldKind = 'readonly' | 'items' | 'children' | 'richtext' | 'jsx' | 'html' | 'object' | 'boolean' | 'select' | 'color' | 'date' | 'time' | 'datetime' | 'url' | 'email' | 'tel' | 'number' | 'text';
 type FieldKindBinding = Pick<PanelBinding, 'property' | 'type' | 'value' | 'options' | 'canEditValue'>;
 declare const getFieldKind: (binding: FieldKindBinding) => FieldKind;
 declare const isStructuralFieldKind: (kind: FieldKind) => kind is "items" | "children";
@@ -283,43 +298,6 @@ type DndComponent = typeof Dnd$1 & {
   Layout: typeof Layout;
 };
 declare const Dnd: DndComponent;
-/** @deprecated Renamed to `useDndItems`. */
-declare const useItemsEditor: (value: string, { render, onChange, onNodeChange }?: DndItemsOptions) => DndItems;
-/** @deprecated Renamed to `useDndChildren`. */
-declare const useChildrenEditor: (items: DataAttrNode[], { onChange }?: DndChildrenOptions) => {
-  items: DataAttrNode[];
-  selection: {
-    readonly selected: Set<number>;
-    readonly isSelected: (index: number) => boolean;
-    readonly toggle: (index: number, shiftKey?: boolean) => void;
-    readonly clear: () => void;
-    readonly replace: (indices: Set<number>) => void;
-  };
-  actions: {
-    move: (from: number, to: number) => void;
-    remove: (index: number) => void;
-    add: () => void;
-    duplicateSelected: () => void;
-    moveSelected: (direction: "up" | "down") => void;
-    removeSelected: () => void;
-  };
-};
-/** @deprecated Renamed to `DndItems`. */
-type ItemsEditor = DndItems;
-/** @deprecated Renamed to `DndItemsActions`. */
-type ItemsEditorActions = DndItemsActions;
-/** @deprecated Renamed to `DndItemsItem`. */
-type ItemsEditorItem = DndItemsItem;
-/** @deprecated Renamed to `DndItemsNestedElement`. */
-type ItemsEditorNestedElement = DndItemsNestedElement;
-/** @deprecated Renamed to `DndItemsNestedGroup`. */
-type ItemsEditorNestedGroup = DndItemsNestedGroup;
-/** @deprecated Renamed to `DndItemsOptions`. */
-type ItemsEditorOptions = DndItemsOptions;
-/** @deprecated Renamed to `DndChildren`. */
-type ChildrenEditor = DndChildren;
-/** @deprecated Renamed to `DndChildrenOptions`. */
-type ChildrenEditorOptions = DndChildrenOptions;
 //#endregion
-export { PanelBindingSource as $, DndLayout as A, DndPalette as B, useDndItems as C, DraggableItem as D, useDndChildren as E, DndLayoutProps as F, useDndInspector as G, Props as H, DndRegionProps as I, Field as J, DndEditError as K, Layout as L, useDndPalette as M, useDndPanel as N, DraggableItemDragState as O, Canvas as P, PanelBindingElement as Q, Palette as R, DndItemsOptions as S, DndChildrenOptions as T, DndInspector as U, DndPanel as V, DndNodePick as W, PanelBinding as X, FieldProps as Y, PanelBindingData as Z, DndItemsActions as _, ItemsEditorActions as a, DndSectionFallbackArgs as at, DndItemsNestedElement as b, ItemsEditorNestedGroup as c, useItemsEditor as d, PanelNodeChange as et, FieldKind as f, DndItems as g, isStructuralFieldKind as h, ItemsEditor as i, DndRenderSectionFallback as it, useDndLayout as j, DraggableItemProps as k, ItemsEditorOptions as l, getFieldKind as m, ChildrenEditorOptions as n, resolvePanelBindings as nt, ItemsEditorItem as o, FieldKindBinding as p, DndRenderField as q, Dnd as r, withPanelCommit as rt, ItemsEditorNestedElement as s, ChildrenEditor as t, PanelNodesChange as tt, useChildrenEditor as u, DndItemsExpansion as v, DndChildren as w, DndItemsNestedGroup as x, DndItemsItem as y, Panel as z };
-//# sourceMappingURL=index-CiWB0zFb.d.ts.map
+export { Panel as A, PanelBinding as B, useDndPalette as C, DndRegionProps as D, DndLayoutProps as E, DndNodePick as F, PanelNodesChange as G, PanelBindingElement as H, useDndInspector as I, DndRenderSectionFallback as J, resolvePanelBindings as K, DndEditError as L, DndPanel as M, Props as N, Layout as O, DndInspector as P, DndRenderField as R, useDndLayout as S, Canvas as T, PanelBindingSource as U, PanelBindingData as V, PanelNodeChange as W, DndSectionFallbackArgs as Y, useDndChildren as _, isStructuralFieldKind as a, DraggableItemProps as b, DndItemsExpansion as c, DndItemsNestedGroup as d, DndItemsOptions as f, DndChildrenOptions as g, DndChildren as h, getFieldKind as i, DndPalette as j, Palette as k, DndItemsItem as l, Field as m, FieldKind as n, DndItems as o, useDndItems as p, withPanelCommit as q, FieldKindBinding as r, DndItemsActions as s, Dnd as t, DndItemsNestedElement as u, DraggableItem as v, useDndPanel as w, DndLayout as x, DraggableItemDragState as y, FieldProps as z };
+//# sourceMappingURL=index-0VB5C3Jk.d.ts.map

package/dist/{index-DpDU1IAw.d.ts → index-92L7F440.d.ts}

@@ -1,5 +1,5 @@
 import { ReactNode } from "react";
-//#region src/components/frame/iframe.d.ts
+//#region src/components/frame/iframe/iframe.d.ts
 interface Props {
   title?: string;
   /** Forwarded to the iframe's `sandbox` attribute for DOM/CSS isolation only — not a security boundary, since preview code executes in the host window's realm (see `compileModule` in `~/utils`). */
@@ -20,4 +20,4 @@ interface FrameProps extends Omit<Props, 'children'> {
 }
 //#endregion
 export { FrameProps as t };
-//# sourceMappingURL=index-DpDU1IAw.d.ts.map
+//# sourceMappingURL=index-92L7F440.d.ts.map

package/dist/index-C8h8TcIl.d.ts

@@ -0,0 +1,15 @@
+//#region src/types/index.d.ts
+interface Module {
+  exports: {
+    default?: React.ComponentType<Record<string, unknown>>;
+  };
+  error?: string;
+}
+interface Section {
+  id: string;
+  name: string;
+  code: string;
+}
+//#endregion
+export { Section as n, Module as t };
+//# sourceMappingURL=index-C8h8TcIl.d.ts.map

package/dist/{index-DQkL37eL.d.ts → index-Cl79M7ZJ.d.ts}

@@ -1,8 +1,8 @@
-import { t as FrameProps } from "./index-DpDU1IAw.js";
+import { t as FrameProps } from "./index-92L7F440.js";
 import React from "react";
 import * as ui from "@jbpark/ui-kit";
 import * as utils from "@jbpark/ui-kit/utils";
-//#region src/components/preview/preview.d.ts
+//#region src/components/preview/types.d.ts
 interface Props extends React.ComponentPropsWithRef<'div'> {
   code?: string;
   showError?: boolean;
@@ -13,7 +13,9 @@ interface Props extends React.ComponentPropsWithRef<'div'> {
   dynamicTailwind?: boolean;
   provider?: (children: React.ReactNode) => React.ReactNode;
 }
-declare const Preview: ({ code, props, modules, dynamicTailwind, provider, ...restProps }: Props) => React.JSX.Element;
+//#endregion
+//#region src/components/preview/preview.d.ts
+declare const Preview: ({ code, props, modules, dynamicTailwind, provider, ...restProps }: Props) => import("react").JSX.Element;
 //#endregion
 //#region src/components/preview/base-modules.d.ts
 declare const baseModules: {
@@ -22,4 +24,4 @@ declare const baseModules: {
 };
 //#endregion
 export { Preview as n, Props as r, baseModules as t };
-//# sourceMappingURL=index-DQkL37eL.d.ts.map
+//# sourceMappingURL=index-Cl79M7ZJ.d.ts.map

package/dist/{index-CRwEhJ7w.d.ts → index-kKUjo9lr.d.ts}

@@ -1,4 +1,4 @@
-import { t as LiveMessages } from "./messages-IBPs4TkZ.js";
+import { t as LiveMessages } from "./messages-Yb3b7YJt.js";
 import React$1 from "react";
 //#region src/components/error/boundary.d.ts
 interface Props$3 {
@@ -54,4 +54,4 @@ type ErrorComponent = typeof Error$2 & {
 declare const Error$1: ErrorComponent;
 //#endregion
 export { Props$1 as a, Guard as i, Props as n, Props$2 as o, Runtime as r, ErrorBoundary as s, Error$1 as t };
-//# sourceMappingURL=index-CRwEhJ7w.d.ts.map
+//# sourceMappingURL=index-kKUjo9lr.d.ts.map

package/dist/{index-DrWtSKXu.d.ts → index-tAiuHZsC.d.ts}

@@ -1,4 +1,4 @@
-import { n as LiveMessagesInput } from "./messages-IBPs4TkZ.js";
+import { n as LiveMessagesInput } from "./messages-Yb3b7YJt.js";
 import React from "react";
 //#region src/components/context/context.d.ts
 interface Props {
@@ -8,4 +8,4 @@ interface Props {
 declare const ContextProvider: ({ children, messages }: Props) => React.JSX.Element;
 //#endregion
 export { Props as n, ContextProvider as t };
-//# sourceMappingURL=index-DrWtSKXu.d.ts.map
+//# sourceMappingURL=index-tAiuHZsC.d.ts.map

package/dist/index.d.ts

@@ -1,12 +1,12 @@
-import { d as BindingOptions, f as BindingRegistry, h as BindingSchema, l as BindingKeyMap } from "./validate-DB59Z_Nx.js";
-import { i as useLiveMessages, n as LiveMessagesInput, r as defaultMessages, t as LiveMessages } from "./messages-IBPs4TkZ.js";
-import { n as Props } from "./index-DrWtSKXu.js";
-import { v as Section } from "./document-DqRSCtsx.js";
-import { A as DndLayout, B as DndPalette, H as Props$1, K as DndEditError, L as Layout, P as Canvas, R as Palette, S as DndItemsOptions, U as DndInspector, V as DndPanel, W as DndNodePick, X as PanelBinding, Y as FieldProps, at as DndSectionFallbackArgs, et as PanelNodeChange, g as DndItems, i as ItemsEditor, it as DndRenderSectionFallback, k as DraggableItemProps, l as ItemsEditorOptions, o as ItemsEditorItem, q as DndRenderField, r as Dnd, tt as PanelNodesChange, y as DndItemsItem, z as Panel } from "./index-CiWB0zFb.js";
-import { t as FrameProps } from "./index-DpDU1IAw.js";
+import { i as BindingKeyMap, o as BindingOptions, s as BindingRegistry, u as BindingSchema } from "./types-Czps1Txy.js";
+import { i as useLiveMessages, n as LiveMessagesInput, r as defaultMessages, t as LiveMessages } from "./messages-Yb3b7YJt.js";
+import { n as Props } from "./index-tAiuHZsC.js";
+import { n as Section } from "./index-C8h8TcIl.js";
+import { A as Panel, B as PanelBinding, F as DndNodePick, G as PanelNodesChange, J as DndRenderSectionFallback, L as DndEditError, M as DndPanel, N as Props$1, O as Layout, P as DndInspector, R as DndRenderField, T as Canvas, W as PanelNodeChange, Y as DndSectionFallbackArgs, b as DraggableItemProps, f as DndItemsOptions, j as DndPalette, k as Palette, l as DndItemsItem, o as DndItems, t as Dnd, x as DndLayout, z as FieldProps } from "./index-0VB5C3Jk.js";
+import { t as FrameProps } from "./index-92L7F440.js";
 import { a as Props$3, n as EditorRenderData, r as Props$2, t as Editor } from "./index-13BDSrQc.js";
-import { a as Props$6, n as Props$5, o as Props$4, s as ErrorBoundary, t as Error } from "./index-CRwEhJ7w.js";
-import { n as Preview, r as Props$7 } from "./index-DQkL37eL.js";
+import { a as Props$6, n as Props$5, o as Props$4, s as ErrorBoundary, t as Error } from "./index-kKUjo9lr.js";
+import { n as Preview, r as Props$7 } from "./index-Cl79M7ZJ.js";
 //#region src/index.d.ts
 declare const App: {
   ({ children, messages }: Props): import("react").JSX.Element;
@@ -31,5 +31,5 @@ declare const App: {
 };
 declare const LiveRenderer: ({ code, props, modules, dynamicTailwind, provider, ...restProps }: Props$7) => import("react").JSX.Element;
 //#endregion
-export { type BindingKeyMap, type BindingOptions, type BindingRegistry, type BindingSchema, type DndEditError, type DndInspector, type DndItems, type DndItemsItem, type DndItemsOptions, type DndLayout, type DndNodePick, type DndPalette, type DndPanel, type DndRenderField, type DndRenderSectionFallback, type DndSectionFallbackArgs, type EditorRenderData, type FieldProps, type FrameProps, type ItemsEditor, type ItemsEditorItem, type ItemsEditorOptions, Dnd as LiveDnd, Editor as LiveEditor, Error as LiveError, type LiveMessages, type LiveMessagesInput, Preview as LivePreview, App as LiveProvider, App as default, LiveRenderer, type PanelBinding, type PanelNodeChange, type PanelNodesChange, type Section, defaultMessages, useLiveMessages };
+export { type BindingKeyMap, type BindingOptions, type BindingRegistry, type BindingSchema, type DndEditError, type DndInspector, type DndItems, type DndItemsItem, type DndItemsOptions, type DndLayout, type DndNodePick, type DndPalette, type DndPanel, type DndRenderField, type DndRenderSectionFallback, type DndSectionFallbackArgs, type EditorRenderData, type FieldProps, type FrameProps, Dnd as LiveDnd, Editor as LiveEditor, Error as LiveError, type LiveMessages, type LiveMessagesInput, Preview as LivePreview, App as LiveProvider, App as default, LiveRenderer, type PanelBinding, type PanelNodeChange, type PanelNodesChange, type Section, defaultMessages, useLiveMessages };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -1,9 +1,9 @@
-import { i as useLiveMessages, n as defaultMessages } from "./messages-CSrMI4Rm.js";
-import { t as ContextProvider } from "./context-B8MzP7_p.js";
-import { t as Dnd } from "./dnd-V8NAxd_R.js";
-import { t as Editor } from "./editor-CMElfHer.js";
-import { t as Error } from "./error-CN_GCnXB.js";
-import { t as Preview } from "./preview-CtyG5UbH.js";
+import { t as Dnd } from "./dnd-BlC1gqUy.js";
+import { i as useLiveMessages, n as defaultMessages } from "./messages-Bt5WXKTE.js";
+import { t as ContextProvider } from "./context-DDR1xVKo.js";
+import { t as Editor } from "./editor-Bty5XzpV.js";
+import { t as Error } from "./error-DyYx2NQ2.js";
+import { t as Preview } from "./preview-DC0pyOdu.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/index.tsx
 const App = ({ children, messages }) => {

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Context","LivePreview","LiveError","LiveEditor","LiveDnd"],"sources":["../src/index.tsx"],"sourcesContent":["import './index.css';\n\nimport Context, {\n  type Props as ContextProps,\n  type LiveMessages,\n  type LiveMessagesInput,\n} from './components/context';\nimport LiveDnd, {\n  type DndEditError,\n  type DndInspector,\n  type DndItems,\n  type DndItemsItem,\n  type DndItemsOptions,\n  type DndLayout,\n  type DndNodePick,\n  type DndPalette,\n  type DndPanel,\n  type DndRenderField,\n  type DndRenderSectionFallback,\n  type DndSectionFallbackArgs,\n  type FieldProps,\n  type ItemsEditor,\n  type ItemsEditorItem,\n  type ItemsEditorOptions,\n  type PanelBinding,\n  type PanelNodeChange,\n  type PanelNodesChange,\n} from './components/dnd';\nimport LiveEditor, { type EditorRenderData } from './components/editor';\nimport LiveError from './components/error';\nimport { type FrameProps } from './components/frame';\nimport LivePreview from './components/preview';\nimport type { Section } from './types';\nimport type {\n  BindingKeyMap,\n  BindingOptions,\n  BindingRegistry,\n  BindingSchema,\n} from './utils/ast/types';\n\nconst App = ({ children, messages }: ContextProps) => {\n  return <Context messages={messages}>{children}</Context>;\n};\n\nconst LiveRenderer = LivePreview;\n\n// The editor's text, for a host that translates it (#524). This is the\n// package entry, which Fast Refresh never reloads.\n// eslint-disable-next-line react-refresh/only-export-components\nexport { defaultMessages, useLiveMessages } from './components/context';\n\nexport {\n  LivePreview,\n  LiveError,\n  LiveEditor,\n  LiveDnd,\n  LiveRenderer,\n  App as LiveProvider,\n  //\n};\n\nexport type {\n  DndEditError,\n  DndRenderField,\n  DndRenderSectionFallback,\n  DndSectionFallbackArgs,\n  DndPalette,\n  DndPanel,\n  DndLayout,\n  DndInspector,\n  DndNodePick,\n  PanelBinding,\n  PanelNodeChange,\n  PanelNodesChange,\n  FieldProps,\n  DndItems,\n  DndItemsItem,\n  DndItemsOptions,\n  // Deprecated aliases of the three above, kept until the next major.\n  ItemsEditor,\n  ItemsEditorItem,\n  ItemsEditorOptions,\n  EditorRenderData,\n  FrameProps,\n  Section,\n  BindingRegistry,\n  BindingKeyMap,\n  BindingOptions,\n  BindingSchema,\n  LiveMessages,\n  LiveMessagesInput,\n};\n\nApp.Preview = LivePreview;\nApp.Renderer = LiveRenderer;\nApp.Error = LiveError;\nApp.Editor = LiveEditor;\nApp.Dnd = LiveDnd;\n\nexport default App;\n"],"mappings":";;;;;;;;AAwCA,MAAM,OAAO,EAAE,UAAU,eAA6B;CACpD,OAAO,oBAACA,iBAAD;EAAmB;EAAW;CAAkB,CAAA;AACzD;AAEA,MAAM,eAAeC;AAiDrB,IAAI,UAAUA;AACd,IAAI,WAAW;AACf,IAAI,QAAQC;AACZ,IAAI,SAASC;AACb,IAAI,MAAMC"}
+{"version":3,"file":"index.js","names":["Context","LivePreview","LiveError","LiveEditor","LiveDnd"],"sources":["../src/index.tsx"],"sourcesContent":["import './index.css';\n\nimport Context, {\n  type Props as ContextProps,\n  type LiveMessages,\n  type LiveMessagesInput,\n} from './components/context';\nimport LiveDnd, {\n  type DndEditError,\n  type DndInspector,\n  type DndItems,\n  type DndItemsItem,\n  type DndItemsOptions,\n  type DndLayout,\n  type DndNodePick,\n  type DndPalette,\n  type DndPanel,\n  type DndRenderField,\n  type DndRenderSectionFallback,\n  type DndSectionFallbackArgs,\n  type FieldProps,\n  type PanelBinding,\n  type PanelNodeChange,\n  type PanelNodesChange,\n} from './components/dnd';\nimport LiveEditor, { type EditorRenderData } from './components/editor';\nimport LiveError from './components/error';\nimport { type FrameProps } from './components/frame';\nimport LivePreview from './components/preview';\nimport type { Section } from './types';\nimport type {\n  BindingKeyMap,\n  BindingOptions,\n  BindingRegistry,\n  BindingSchema,\n} from './utils/ast/types';\n\nconst App = ({ children, messages }: ContextProps) => {\n  return <Context messages={messages}>{children}</Context>;\n};\n\nconst LiveRenderer = LivePreview;\n\n// The editor's text, for a host that translates it (#524). This is the\n// package entry, which Fast Refresh never reloads.\n// eslint-disable-next-line react-refresh/only-export-components\nexport { defaultMessages, useLiveMessages } from './components/context';\n\nexport {\n  LivePreview,\n  LiveError,\n  LiveEditor,\n  LiveDnd,\n  LiveRenderer,\n  App as LiveProvider,\n  //\n};\n\nexport type {\n  DndEditError,\n  DndRenderField,\n  DndRenderSectionFallback,\n  DndSectionFallbackArgs,\n  DndPalette,\n  DndPanel,\n  DndLayout,\n  DndInspector,\n  DndNodePick,\n  PanelBinding,\n  PanelNodeChange,\n  PanelNodesChange,\n  FieldProps,\n  DndItems,\n  DndItemsItem,\n  DndItemsOptions,\n  EditorRenderData,\n  FrameProps,\n  Section,\n  BindingRegistry,\n  BindingKeyMap,\n  BindingOptions,\n  BindingSchema,\n  LiveMessages,\n  LiveMessagesInput,\n};\n\nApp.Preview = LivePreview;\nApp.Renderer = LiveRenderer;\nApp.Error = LiveError;\nApp.Editor = LiveEditor;\nApp.Dnd = LiveDnd;\n\nexport default App;\n"],"mappings":";;;;;;;;AAqCA,MAAM,OAAO,EAAE,UAAU,eAA6B;CACpD,OAAO,oBAACA,iBAAD;EAAmB;EAAW;CAAkB,CAAA;AACzD;AAEA,MAAM,eAAeC;AA6CrB,IAAI,UAAUA;AACd,IAAI,WAAW;AACf,IAAI,QAAQC;AACZ,IAAI,SAASC;AACb,IAAI,MAAMC"}

package/dist/{messages-CSrMI4Rm.js → messages-Bt5WXKTE.js}

@@ -1,4 +1,4 @@
-import { t as defaultValidationMessages } from "./validate-iLo8IONY.js";
+import { t as defaultValidationMessages } from "./validate-CZz30Pnb.js";
 import { createContext, useContext } from "react";
 //#region src/components/context/messages.ts
 const defaultMessages = {
@@ -32,6 +32,8 @@ const defaultMessages = {
 		useCodeEditor: "Use the code editor to change it.",
 		invalidValue: "Invalid value.",
 		urlPlaceholder: "https://example.com",
+		emailPlaceholder: "name@example.com",
+		telPlaceholder: "+1 555 0100",
 		numberPlaceholder: "Enter a numeric value",
 		textPlaceholder: "Enter a value"
 	},
@@ -62,6 +64,7 @@ const defaultMessages = {
 	},
 	selection: {
 		count: (count) => `${count} selected`,
+		selectAll: "Select all",
 		duplicate: "Duplicate selected",
 		moveUp: "Move selected up",
 		moveDown: "Move selected down",
@@ -130,4 +133,4 @@ const useLiveMessages = () => useContext(MessagesContext);
 //#endregion
 export { useLiveMessages as i, defaultMessages as n, mergeMessages as r, MessagesContext as t };
 
-//# sourceMappingURL=messages-CSrMI4Rm.js.map
+//# sourceMappingURL=messages-Bt5WXKTE.js.map

package/dist/messages-Bt5WXKTE.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"messages-Bt5WXKTE.js","names":[],"sources":["../src/components/context/messages.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nimport {\n  type ValidationMessages,\n  defaultValidationMessages,\n} from '~/utils/ast/validate';\n\n// Every piece of text the editor shows or announces, grouped by where it\n// appears (#524). Text with values in it is a function, so a translation\n// can put them where its grammar needs them. Pass a partial set to `Live`'s\n// `messages` prop to replace any of it; the rest stays English.\nexport interface LiveMessages {\n  // The section toolbar on the canvas and the panel header.\n  section: {\n    moveUp: string;\n    moveDown: string;\n    duplicate: string;\n    delete: string;\n  };\n  canvas: {\n    // The mobile palette button and Drawer title.\n    palette: string;\n    // The mobile panel Drawer title.\n    properties: string;\n    pickElement: string;\n    pickElementActive: string;\n    dropHere: string;\n    dropAtBottom: string;\n    empty: string;\n    emptyHintTouch: string;\n    emptyHintDrag: string;\n    syntaxError: string;\n    syntaxErrorDetail: string;\n    missingContainer: (containerId: string) => string;\n    missingContainerDetail: (containerId: string) => string;\n    stale: string;\n  };\n  panel: {\n    selectSection: string;\n    noEditableElements: string;\n    readOnly: string;\n    expressionPreserved: string;\n    useCodeEditor: string;\n    invalidValue: string;\n    urlPlaceholder: string;\n    emailPlaceholder: string;\n    telPlaceholder: string;\n    numberPlaceholder: string;\n    textPlaceholder: string;\n  };\n  // The built-in editor for an array value.\n  items: {\n    heading: (count: number) => string;\n    add: string;\n    item: (position: number) => string;\n    reorder: (item: string) => string;\n    moveUp: string;\n    moveDown: string;\n    delete: string;\n    collapseAll: string;\n    expandAll: string;\n    unreadable: string;\n    empty: string;\n    structureLocked: string;\n    noNestedBindings: string;\n  };\n  // The built-in editor for child elements.\n  children: {\n    heading: (count: number) => string;\n    add: string;\n    child: (position: number, tagName: string) => string;\n    moveUp: string;\n    moveDown: string;\n    delete: string;\n    editableBindings: string;\n    childNodes: string;\n  };\n  // The bar shown while items or children are selected.\n  selection: {\n    count: (count: number) => string;\n    selectAll: string;\n    duplicate: string;\n    moveUp: string;\n    moveDown: string;\n    delete: string;\n    clear: string;\n  };\n  // The `title` and `description` of a `DndEditError`, which the default\n  // toast shows.\n  editErrors: {\n    updateFailed: (label: string) => string;\n    cannotEdit: (label: string) => string;\n    cannotRemove: (label: string) => string;\n    attributeNotFound: (property: string) => string;\n    // `property` is set when the binding names one, otherwise `label` is the\n    // one to show.\n    bindingNotDeclared: (target: {\n      label: string;\n      property?: string;\n    }) => string;\n    duplicateBinding: (target: {\n      count: number;\n      label: string;\n      property?: string;\n    }) => string;\n    reservedProperty: (property: string) => string;\n    requiredProperty: (property: string) => string;\n    noBinding: string;\n    elementNotFound: string;\n    unsupportedSyntax: (property: string) => string;\n    selfClosing: (property: string) => string;\n    checkConsole: string;\n    syntaxError: string;\n    syntaxErrorDetail: string;\n    missingContainer: (containerId: string) => string;\n    missingContainerDetail: (containerId: string) => string;\n    sectionParseFailed: string;\n    itemsParseFailed: string;\n    itemUpdateFailed: string;\n    itemUpdateFailedDetail: string;\n  };\n  // What a screen reader hears during a drag.\n  announcements: {\n    instructions: string;\n    // Stands in for a section without a name.\n    section: string;\n    pickedUp: (name: string) => string;\n    movedTo: (name: string, position: number, total: number) => string;\n    notOver: (name: string) => string;\n    droppedAt: (name: string, position: number, total: number) => string;\n    dropped: (name: string) => string;\n    cancelled: (name: string) => string;\n    itemOver: (name: string, over: string) => string;\n    itemMoved: (name: string, over: string) => string;\n  };\n  // The error boxes of `Live.Preview`, `Live.Error` and canvas sections.\n  errors: {\n    default: string;\n    compile: string;\n    runtime: string;\n    rendering: string;\n    sectionUnavailable: string;\n    sectionNotRendered: string;\n    tryAgain: string;\n    // The message of a page error that carries none.\n    unknown: string;\n    // The message of an unhandled promise rejection that carries none.\n    unhandledRejection: string;\n  };\n  validation: ValidationMessages;\n}\n\n// Every group of `LiveMessages`, each with any of its keys.\nexport type LiveMessagesInput = {\n  [Group in keyof LiveMessages]?: Partial<LiveMessages[Group]>;\n};\n\nexport const defaultMessages: LiveMessages = {\n  section: {\n    moveUp: 'Move section up',\n    moveDown: 'Move section down',\n    duplicate: 'Duplicate section',\n    delete: 'Delete section',\n  },\n  canvas: {\n    palette: 'Components',\n    properties: 'Properties',\n    pickElement: 'Pick an element',\n    pickElementActive: 'Click an element to edit it. Esc to cancel.',\n    dropHere: 'Drop here',\n    dropAtBottom: 'Drag here to add at bottom',\n    empty: 'No sections available',\n    emptyHintTouch: 'Tap a component to add it',\n    emptyHintDrag: 'Drag a component from the left to add it',\n    syntaxError: 'The document has a syntax error',\n    syntaxErrorDetail: 'Fix it in the code to see its sections',\n    missingContainer: containerId =>\n      `No #${containerId} element in the document`,\n    missingContainerDetail: containerId =>\n      `Sections go inside the element with id=\"${containerId}\"`,\n    stale:\n      'Showing the last version that parsed. Fix the syntax error in the code to edit here again.',\n  },\n  panel: {\n    selectSection: 'Please select a section.',\n    noEditableElements: 'No editable elements.',\n    readOnly:\n      \"The document has a syntax error. These fields are from the last version that parsed, and can't be edited until it parses again.\",\n    expressionPreserved:\n      'This expression is preserved but is not editable here.',\n    useCodeEditor: 'Use the code editor to change it.',\n    invalidValue: 'Invalid value.',\n    urlPlaceholder: 'https://example.com',\n    emailPlaceholder: 'name@example.com',\n    telPlaceholder: '+1 555 0100',\n    numberPlaceholder: 'Enter a numeric value',\n    textPlaceholder: 'Enter a value',\n  },\n  items: {\n    heading: count => `Items (${count})`,\n    add: 'Add Item',\n    item: position => `Item ${position}`,\n    reorder: item => `Reorder ${item}`,\n    moveUp: 'Move item up',\n    moveDown: 'Move item down',\n    delete: 'Delete item',\n    collapseAll: 'Collapse all',\n    expandAll: 'Expand all',\n    unreadable:\n      'This value could not be read as a list. Edit it in the code editor.',\n    empty:\n      'No editable items. The panel copies an existing item rather than guessing the shape of a new one — add the first item in the code editor.',\n    structureLocked:\n      'Values remain editable, but moving, copying, adding, and deleting require a dense array without spreads or parenthesized top-level items. Use the code editor for those structural changes.',\n    noNestedBindings: 'No JSX bindings found',\n  },\n  children: {\n    heading: count => `Children Items (${count})`,\n    add: 'Add Child',\n    child: (position, tagName) => `Child ${position} (${tagName})`,\n    moveUp: 'Move child up',\n    moveDown: 'Move child down',\n    delete: 'Delete child',\n    editableBindings: 'Editable Bindings:',\n    childNodes: 'Child Nodes:',\n  },\n  selection: {\n    count: count => `${count} selected`,\n    selectAll: 'Select all',\n    duplicate: 'Duplicate selected',\n    moveUp: 'Move selected up',\n    moveDown: 'Move selected down',\n    delete: 'Delete selected',\n    clear: 'Clear',\n  },\n  editErrors: {\n    updateFailed: label => `Failed to update \"${label}\"`,\n    cannotEdit: label => `Cannot edit \"${label}\" in the panel`,\n    cannotRemove: label => `Cannot remove \"${label}\"`,\n    attributeNotFound: property =>\n      `This element has no \"${property}\" attribute — check the property in its data-binding.`,\n    bindingNotDeclared: ({ label, property }) =>\n      `No binding for ${\n        property ? `property \"${property}\"` : `label \"${label}\"`\n      } is declared on this element's data-binding.`,\n    duplicateBinding: ({ count, label, property }) =>\n      `${count} bindings share ${\n        property ? `property \"${property}\"` : `label \"${label}\"`\n      } on this element — remove the duplicate in its data-binding.`,\n    reservedProperty: property =>\n      `\"${property}\" is managed by the editor, so a binding can't change it.`,\n    requiredProperty: property =>\n      `\"${property}\" is marked required in its data-binding, so it can't be removed.`,\n    noBinding: 'This element has no data-binding declaration.',\n    elementNotFound: 'The target element could not be found in this section.',\n    unsupportedSyntax: property =>\n      `The \"${property}\" expression was preserved. Change it in the code editor instead.`,\n    selfClosing: property =>\n      `This element is self-closing, so it has no content for \"${property}\". Give it a closing tag in the code editor.`,\n    checkConsole: 'Check the console for details.',\n    syntaxError: 'The document has a syntax error',\n    syntaxErrorDetail:\n      'The canvas shows the last version that parsed. Fix the error in the code, then edit here again.',\n    missingContainer: containerId =>\n      `No #${containerId} element in the document`,\n    missingContainerDetail: containerId =>\n      `Sections are the <section> elements inside the element with id=\"${containerId}\". Start from createDocument(), or set containerId to match your document.`,\n    sectionParseFailed: 'Failed to parse this section',\n    itemsParseFailed: 'Failed to parse items',\n    itemUpdateFailed: 'Failed to update this item',\n    itemUpdateFailedDetail:\n      'The source was preserved. Structural edits require a dense array without spreads; use the code editor for unsupported syntax.',\n  },\n  announcements: {\n    instructions:\n      'On a palette item, press Enter to add it to the canvas. On a canvas section, press Enter to select it, the up and down arrow keys to go to the previous or next section, and Delete to remove it. Press Space to pick a section up, the arrow keys to move it, and Space or Enter to drop it. Press Escape to cancel.',\n    section: 'section',\n    pickedUp: name => `Picked up ${name}.`,\n    movedTo: (name, position, total) =>\n      `${name} moved to position ${position} of ${total}.`,\n    notOver: name => `${name} is no longer over a position.`,\n    droppedAt: (name, position, total) =>\n      `${name} dropped at position ${position} of ${total}.`,\n    dropped: name => `${name} dropped.`,\n    cancelled: name => `Moving ${name} was cancelled.`,\n    itemOver: (name, over) => `${name} is over ${over}.`,\n    itemMoved: (name, over) => `${name} was moved to the place of ${over}.`,\n  },\n  errors: {\n    default: 'An error occurred',\n    compile: 'Compile Error',\n    runtime: 'Runtime Error',\n    rendering: 'Rendering Error',\n    sectionUnavailable: 'Section Unavailable',\n    sectionNotRendered: 'This section is not rendered in this editor.',\n    tryAgain: 'Try Again',\n    unknown: 'Unknown error',\n    unhandledRejection: 'Unhandled promise rejection',\n  },\n  validation: defaultValidationMessages,\n};\n\n// `base` (the defaults, unless given) with each group's given keys on top.\nexport const mergeMessages = (\n  input?: LiveMessagesInput,\n  base: LiveMessages = defaultMessages,\n): LiveMessages => {\n  if (!input) {\n    return base;\n  }\n\n  const merged = { ...base };\n\n  for (const group of Object.keys(base) as (keyof LiveMessages)[]) {\n    if (input[group]) {\n      merged[group] = { ...base[group], ...input[group] } as never;\n    }\n  }\n\n  return merged;\n};\n\n// The English defaults outside a provider, so an error box rendered on its\n// own still has text.\nexport const MessagesContext = createContext<LiveMessages>(defaultMessages);\n\n// The messages in effect: the provider's, merged over the defaults. A custom\n// palette or panel can use it to show the same text as the built-in ones.\nexport const useLiveMessages = () => useContext(MessagesContext);\n"],"mappings":";;;AA6JA,MAAa,kBAAgC;CAC3C,SAAS;EACP,QAAQ;EACR,UAAU;EACV,WAAW;EACX,QAAQ;CACV;CACA,QAAQ;EACN,SAAS;EACT,YAAY;EACZ,aAAa;EACb,mBAAmB;EACnB,UAAU;EACV,cAAc;EACd,OAAO;EACP,gBAAgB;EAChB,eAAe;EACf,aAAa;EACb,mBAAmB;EACnB,mBAAkB,gBAChB,OAAO,YAAY;EACrB,yBAAwB,gBACtB,2CAA2C,YAAY;EACzD,OACE;CACJ;CACA,OAAO;EACL,eAAe;EACf,oBAAoB;EACpB,UACE;EACF,qBACE;EACF,eAAe;EACf,cAAc;EACd,gBAAgB;EAChB,kBAAkB;EAClB,gBAAgB;EAChB,mBAAmB;EACnB,iBAAiB;CACnB;CACA,OAAO;EACL,UAAS,UAAS,UAAU,MAAM;EAClC,KAAK;EACL,OAAM,aAAY,QAAQ;EAC1B,UAAS,SAAQ,WAAW;EAC5B,QAAQ;EACR,UAAU;EACV,QAAQ;EACR,aAAa;EACb,WAAW;EACX,YACE;EACF,OACE;EACF,iBACE;EACF,kBAAkB;CACpB;CACA,UAAU;EACR,UAAS,UAAS,mBAAmB,MAAM;EAC3C,KAAK;EACL,QAAQ,UAAU,YAAY,SAAS,SAAS,IAAI,QAAQ;EAC5D,QAAQ;EACR,UAAU;EACV,QAAQ;EACR,kBAAkB;EAClB,YAAY;CACd;CACA,WAAW;EACT,QAAO,UAAS,GAAG,MAAM;EACzB,WAAW;EACX,WAAW;EACX,QAAQ;EACR,UAAU;EACV,QAAQ;EACR,OAAO;CACT;CACA,YAAY;EACV,eAAc,UAAS,qBAAqB,MAAM;EAClD,aAAY,UAAS,gBAAgB,MAAM;EAC3C,eAAc,UAAS,kBAAkB,MAAM;EAC/C,oBAAmB,aACjB,wBAAwB,SAAS;EACnC,qBAAqB,EAAE,OAAO,eAC5B,kBACE,WAAW,aAAa,SAAS,KAAK,UAAU,MAAM,GACvD;EACH,mBAAmB,EAAE,OAAO,OAAO,eACjC,GAAG,MAAM,kBACP,WAAW,aAAa,SAAS,KAAK,UAAU,MAAM,GACvD;EACH,mBAAkB,aAChB,IAAI,SAAS;EACf,mBAAkB,aAChB,IAAI,SAAS;EACf,WAAW;EACX,iBAAiB;EACjB,oBAAmB,aACjB,QAAQ,SAAS;EACnB,cAAa,aACX,2DAA2D,SAAS;EACtE,cAAc;EACd,aAAa;EACb,mBACE;EACF,mBAAkB,gBAChB,OAAO,YAAY;EACrB,yBAAwB,gBACtB,mEAAmE,YAAY;EACjF,oBAAoB;EACpB,kBAAkB;EAClB,kBAAkB;EAClB,wBACE;CACJ;CACA,eAAe;EACb,cACE;EACF,SAAS;EACT,WAAU,SAAQ,aAAa,KAAK;EACpC,UAAU,MAAM,UAAU,UACxB,GAAG,KAAK,qBAAqB,SAAS,MAAM,MAAM;EACpD,UAAS,SAAQ,GAAG,KAAK;EACzB,YAAY,MAAM,UAAU,UAC1B,GAAG,KAAK,uBAAuB,SAAS,MAAM,MAAM;EACtD,UAAS,SAAQ,GAAG,KAAK;EACzB,YAAW,SAAQ,UAAU,KAAK;EAClC,WAAW,MAAM,SAAS,GAAG,KAAK,WAAW,KAAK;EAClD,YAAY,MAAM,SAAS,GAAG,KAAK,6BAA6B,KAAK;CACvE;CACA,QAAQ;EACN,SAAS;EACT,SAAS;EACT,SAAS;EACT,WAAW;EACX,oBAAoB;EACpB,oBAAoB;EACpB,UAAU;EACV,SAAS;EACT,oBAAoB;CACtB;CACA,YAAY;AACd;AAGA,MAAa,iBACX,OACA,OAAqB,oBACJ;CACjB,IAAI,CAAC,OACH,OAAO;CAGT,MAAM,SAAS,EAAE,GAAG,KAAK;CAEzB,KAAK,MAAM,SAAS,OAAO,KAAK,IAAI,GAClC,IAAI,MAAM,QACR,OAAO,SAAS;EAAE,GAAG,KAAK;EAAQ,GAAG,MAAM;CAAO;CAItD,OAAO;AACT;AAIA,MAAa,kBAAkB,cAA4B,eAAe;AAI1E,MAAa,wBAAwB,WAAW,eAAe"}

package/dist/{messages-IBPs4TkZ.d.ts → messages-Yb3b7YJt.d.ts}

@@ -1,4 +1,4 @@
-import { t as ValidationMessages } from "./validate-DB59Z_Nx.js";
+import { t as ValidationMessages } from "./validate-CiA1LF6S.js";
 //#region src/components/context/messages.d.ts
 interface LiveMessages {
   section: {
@@ -31,6 +31,8 @@ interface LiveMessages {
     useCodeEditor: string;
     invalidValue: string;
     urlPlaceholder: string;
+    emailPlaceholder: string;
+    telPlaceholder: string;
     numberPlaceholder: string;
     textPlaceholder: string;
   };
@@ -61,6 +63,7 @@ interface LiveMessages {
   };
   selection: {
     count: (count: number) => string;
+    selectAll: string;
     duplicate: string;
     moveUp: string;
     moveDown: string;
@@ -127,4 +130,4 @@ declare const defaultMessages: LiveMessages;
 declare const useLiveMessages: () => LiveMessages;
 //#endregion
 export { useLiveMessages as i, LiveMessagesInput as n, defaultMessages as r, LiveMessages as t };
-//# sourceMappingURL=messages-IBPs4TkZ.d.ts.map
+//# sourceMappingURL=messages-Yb3b7YJt.d.ts.map

package/dist/preview/index.d.ts

@@ -1,2 +1,2 @@
-import { n as Preview, r as Props, t as baseModules } from "../index-DQkL37eL.js";
+import { n as Preview, r as Props, t as baseModules } from "../index-Cl79M7ZJ.js";
 export { type Props, baseModules, Preview as default };

package/dist/preview/index.js

@@ -1,3 +1,3 @@
-import { r as baseModules } from "../use-dynamic-tailwind-BP1toJkW.js";
-import { t as Preview } from "../preview-CtyG5UbH.js";
+import { r as baseModules } from "../use-dynamic-tailwind-CSYKXDmX.js";
+import { t as Preview } from "../preview-DC0pyOdu.js";
 export { baseModules, Preview as default };

package/dist/{preview-CtyG5UbH.js → preview-DC0pyOdu.js}

@@ -1,8 +1,8 @@
-import { i as useLiveMessages } from "./messages-CSrMI4Rm.js";
+import { i as useLiveMessages } from "./messages-Bt5WXKTE.js";
 import { i as usePreview, r as useError } from "./states-Ci1AvoQ9.js";
 import { t as cn } from "./cn-CAnad2vL.js";
-import { i as Frame, n as useCompiledModule, t as useDynamicTailwind } from "./use-dynamic-tailwind-BP1toJkW.js";
-import { t as Error } from "./error-CN_GCnXB.js";
+import { i as Frame, n as useCompiledModule, t as useDynamicTailwind } from "./use-dynamic-tailwind-CSYKXDmX.js";
+import { t as Error } from "./error-DyYx2NQ2.js";
 import { useMemo } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/preview/defaults.ts
@@ -85,4 +85,4 @@ const Preview = ({ code, props = NO_PROPS, modules = NO_MODULES, dynamicTailwind
 //#endregion
 export { Preview as t };
 
-//# sourceMappingURL=preview-CtyG5UbH.js.map
+//# sourceMappingURL=preview-DC0pyOdu.js.map

package/dist/preview-DC0pyOdu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview-DC0pyOdu.js","names":["LiveError"],"sources":["../src/components/preview/defaults.ts","../src/components/preview/client.tsx","../src/components/preview/preview.tsx"],"sourcesContent":["// Stable defaults for optional object props. A `= {}` default is a new\n// object on every render, which re-runs every memo keyed on it — the merged\n// module map, and so `compile()` — even when the caller passed nothing (#348).\nexport const NO_PROPS: Record<string, unknown> = {};\nexport const NO_MODULES: Record<string, unknown> = {};\n","'use client';\n\nimport { useMemo } from 'react';\n\nimport { useLiveMessages } from '~/components/context/messages';\nimport { useError, usePreview } from '~/components/context/states';\nimport LiveError from '~/components/error';\nimport Frame, { type FrameProps } from '~/components/frame';\nimport { cn } from '~/utils/cn';\n\nimport { NO_MODULES, NO_PROPS } from './defaults';\nimport type { Props } from './types';\nimport { useCompiledModule } from './use-compiled-module';\nimport { useDynamicTailwind } from './use-dynamic-tailwind';\n\nconst Client = ({\n  code: _code,\n  className,\n  showError,\n  props = NO_PROPS,\n  modules = NO_MODULES,\n  frame,\n  dynamicTailwind = false,\n  provider,\n}: Props) => {\n  const { code } = usePreview();\n  const { error, setError } = useError();\n  const messages = useLiveMessages();\n  const isError = !!showError && !!error;\n\n  const classNames = cn(isError && 'hidden', className);\n\n  const effectiveCode = _code === undefined ? code : _code;\n\n  const module = useCompiledModule(effectiveCode, modules);\n\n  // Attached to the wrapper below; scans the rendered DOM so classes coming\n  // from an imported component are picked up too. See the hook for details.\n  const { ref: contentRef, css: dynamicCSS } = useDynamicTailwind(\n    effectiveCode,\n    dynamicTailwind,\n  );\n\n  const componentProps = useMemo(\n    () => ({\n      ...props,\n    }),\n    [props],\n  );\n\n  const renderProvider = (component: React.ReactNode) => {\n    return provider ? provider(component) : component;\n  };\n\n  if (module && module.error) {\n    return (\n      <>\n        <div className={cn('relative h-full w-full', classNames)}>\n          <LiveError message={module.error} title={messages.errors.compile} />\n        </div>\n        <LiveError.Runtime open={isError} />\n      </>\n    );\n  }\n\n  const Component = module?.exports?.default;\n\n  if (!Component) {\n    return null;\n  }\n\n  return (\n    <>\n      {frame ? (\n        <div className={cn('h-full w-full', classNames)}>\n          <Frame {...(frame as FrameProps)}>\n            {container => (\n              <div ref={contentRef} style={{ display: 'contents' }}>\n                <LiveError.Boundary\n                  resetKeys={[effectiveCode]}\n                  onError={(e: Error) => setError(e.message)}\n                >\n                  {renderProvider(\n                    <LiveError.Guard onError={e => setError(e.message)}>\n                      <Component {...componentProps} container={container} />\n                      {dynamicTailwind && dynamicCSS && (\n                        <style>{dynamicCSS}</style>\n                      )}\n                    </LiveError.Guard>,\n                  )}\n                </LiveError.Boundary>\n              </div>\n            )}\n          </Frame>\n        </div>\n      ) : (\n        <div\n          ref={contentRef}\n          className={cn(\n            'relative h-full w-full overflow-x-hidden overflow-y-auto',\n            classNames,\n          )}\n          style={{\n            isolation: 'isolate',\n            transform: 'translateZ(0)',\n            containerType: 'inline-size',\n          }}\n        >\n          <LiveError.Boundary\n            resetKeys={[effectiveCode]}\n            onError={e => setError(e.message)}\n          >\n            {renderProvider(\n              <LiveError.Guard onError={e => setError(e.message)}>\n                <Component {...componentProps} />\n                {dynamicTailwind && dynamicCSS && <style>{dynamicCSS}</style>}\n              </LiveError.Guard>,\n            )}\n          </LiveError.Boundary>\n        </div>\n      )}\n      <LiveError.Runtime open={isError} />\n    </>\n  );\n};\n\nexport default Client;\n","import Client from './client';\nimport { NO_MODULES, NO_PROPS } from './defaults';\nimport type { Props } from './types';\n\n// `Live.Preview`: a thin wrapper around `Client`, which compiles, handles\n// errors and wraps the frame. One render path for both `code` and the\n// provider's code (#187).\nconst Preview = ({\n  code,\n  props = NO_PROPS,\n  modules = NO_MODULES,\n  dynamicTailwind = false,\n  provider,\n  ...restProps\n}: Props) => {\n  return (\n    <Client\n      code={code}\n      props={props}\n      modules={modules}\n      dynamicTailwind={dynamicTailwind}\n      provider={provider}\n      {...restProps}\n    />\n  );\n};\n\nexport default Preview;\n"],"mappings":";;;;;;;;AAGA,MAAa,WAAoC,CAAC;AAClD,MAAa,aAAsC,CAAC;;;ACWpD,MAAM,UAAU,EACd,MAAM,OACN,WACA,WACA,QAAQ,UACR,UAAU,YACV,OACA,kBAAkB,OAClB,eACW;CACX,MAAM,EAAE,SAAS,WAAW;CAC5B,MAAM,EAAE,OAAO,aAAa,SAAS;CACrC,MAAM,WAAW,gBAAgB;CACjC,MAAM,UAAU,CAAC,CAAC,aAAa,CAAC,CAAC;CAEjC,MAAM,aAAa,GAAG,WAAW,UAAU,SAAS;CAEpD,MAAM,gBAAgB,UAAU,KAAA,IAAY,OAAO;CAEnD,MAAM,SAAS,kBAAkB,eAAe,OAAO;CAIvD,MAAM,EAAE,KAAK,YAAY,KAAK,eAAe,mBAC3C,eACA,eACF;CAEA,MAAM,iBAAiB,eACd,EACL,GAAG,MACL,IACA,CAAC,KAAK,CACR;CAEA,MAAM,kBAAkB,cAA+B;EACrD,OAAO,WAAW,SAAS,SAAS,IAAI;CAC1C;CAEA,IAAI,UAAU,OAAO,OACnB,OACE,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,OAAD;EAAK,WAAW,GAAG,0BAA0B,UAAU;EACrD,UAAA,oBAACA,OAAD;GAAW,SAAS,OAAO;GAAO,OAAO,SAAS,OAAO;EAAU,CAAA;CAChE,CAAA,GACL,oBAACA,MAAU,SAAX,EAAmB,MAAM,QAAU,CAAA,CACnC,EAAA,CAAA;CAIN,MAAM,YAAY,QAAQ,SAAS;CAEnC,IAAI,CAAC,WACH,OAAO;CAGT,OACE,qBAAA,UAAA,EAAA,UAAA,CACG,QACC,oBAAC,OAAD;EAAK,WAAW,GAAG,iBAAiB,UAAU;EAC5C,UAAA,oBAAC,OAAD;GAAO,GAAK;GACT,WAAA,cACC,oBAAC,OAAD;IAAK,KAAK;IAAY,OAAO,EAAE,SAAS,WAAW;IACjD,UAAA,oBAACA,MAAU,UAAX;KACE,WAAW,CAAC,aAAa;KACzB,UAAU,MAAa,SAAS,EAAE,OAAO;KAExC,UAAA,eACC,qBAACA,MAAU,OAAX;MAAiB,UAAS,MAAK,SAAS,EAAE,OAAO;MAAjD,UAAA,CACE,oBAAC,WAAD;OAAW,GAAI;OAA2B;MAAY,CAAA,GACrD,mBAAmB,cAClB,oBAAC,SAAD,EAAA,UAAQ,WAAkB,CAAA,CAEb;KACnB,CAAA,CAAA;IACkB,CAAA;GACjB,CAAA;EAEF,CAAA;CACJ,CAAA,IAEL,oBAAC,OAAD;EACE,KAAK;EACL,WAAW,GACT,4DACA,UACF;EACA,OAAO;GACL,WAAW;GACX,WAAW;GACX,eAAe;EACjB;EAEA,UAAA,oBAACA,MAAU,UAAX;GACE,WAAW,CAAC,aAAa;GACzB,UAAS,MAAK,SAAS,EAAE,OAAO;GAE/B,UAAA,eACC,qBAACA,MAAU,OAAX;IAAiB,UAAS,MAAK,SAAS,EAAE,OAAO;IAAjD,UAAA,CACE,oBAAC,WAAD,EAAW,GAAI,eAAiB,CAAA,GAC/B,mBAAmB,cAAc,oBAAC,SAAD,EAAA,UAAQ,WAAkB,CAAA,CAC7C;GACnB,CAAA,CAAA;EACkB,CAAA;CACjB,CAAA,GAEP,oBAACA,MAAU,SAAX,EAAmB,MAAM,QAAU,CAAA,CACnC,EAAA,CAAA;AAEN;;;ACrHA,MAAM,WAAW,EACf,MACA,QAAQ,UACR,UAAU,YACV,kBAAkB,OAClB,UACA,GAAG,gBACQ;CACX,OACE,oBAAC,QAAD;EACQ;EACC;EACE;EACQ;EACP;EACV,GAAI;CACL,CAAA;AAEL"}

package/dist/provider/index.d.ts

@@ -1,3 +1,3 @@
-import { i as useLiveMessages, n as LiveMessagesInput, r as defaultMessages, t as LiveMessages } from "../messages-IBPs4TkZ.js";
-import { n as Props, t as ContextProvider } from "../index-DrWtSKXu.js";
+import { i as useLiveMessages, n as LiveMessagesInput, r as defaultMessages, t as LiveMessages } from "../messages-Yb3b7YJt.js";
+import { n as Props, t as ContextProvider } from "../index-tAiuHZsC.js";
 export { type LiveMessages, type LiveMessagesInput, type Props, ContextProvider as default, defaultMessages, useLiveMessages };

package/dist/provider/index.js

@@ -1,3 +1,3 @@
-import { i as useLiveMessages, n as defaultMessages } from "../messages-CSrMI4Rm.js";
-import { t as ContextProvider } from "../context-B8MzP7_p.js";
+import { i as useLiveMessages, n as defaultMessages } from "../messages-Bt5WXKTE.js";
+import { t as ContextProvider } from "../context-DDR1xVKo.js";
 export { ContextProvider as default, defaultMessages, useLiveMessages };