@jbpark/live-editor 4.1.1 → 4.3.0

package/dist/editor/index.js

@@ -1,3 +1,3 @@
-import { t as Core } from "../core-DaXVtvH5.js";
-import { t as Editor } from "../editor-C3tQaMlU.js";
+import { t as Core } from "../core-B3ruccKb.js";
+import { t as Editor } from "../editor-DvMruljw.js";
 export { Core, Editor as default };

package/dist/{editor-C3tQaMlU.js → editor-DvMruljw.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-DaXVtvH5.js";
+import { n as useFormatCode, t as Core } from "./core-B3ruccKb.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-C3tQaMlU.js.map
+//# sourceMappingURL=editor-DvMruljw.js.map

package/dist/{editor-C3tQaMlU.js.map → editor-DvMruljw.js.map}

@@ -1 +1 @@
-{"version":3,"file":"editor-C3tQaMlU.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  // Same prettier-based formatting Core's own Cmd+S uses - reused rather\n  // than reimplemented, so a custom editor can offer equivalent\n  // format-on-save behavior without duplicating the prettier wiring.\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  // Full replacement for the built-in CodeMirror editor. Editor still owns\n  // syncing `value` to the shared preview code (debounced), regardless of\n  // which UI renders it - only the editing surface itself is customizable.\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 only\n  // hears about it after `debounce`. Without a draft, the editor had nowhere\n  // to keep what was typed, so an uncontrolled editor dropped every edit.\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":";;;;;;AA4BA,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;CAM9B,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;;;AC7HA,MAAM,SAASC;AAEf,OAAO,OAAO"}
+{"version":3,"file":"editor-DvMruljw.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  // Same prettier-based formatting Core's own Cmd+S uses - reused rather\n  // than reimplemented, so a custom editor can offer equivalent\n  // format-on-save behavior without duplicating the prettier wiring.\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  // Full replacement for the built-in CodeMirror editor. Editor still owns\n  // syncing `value` to the shared preview code (debounced), regardless of\n  // which UI renders it - only the editing surface itself is customizable.\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 only\n  // hears about it after `debounce`. Without a draft, the editor had nowhere\n  // to keep what was typed, so an uncontrolled editor dropped every edit.\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":";;;;;;AA4BA,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;CAM9B,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;;;AC7HA,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-DNNj_0ba.js";
+import { i as Guard, o as Props, r as Runtime, s as ErrorBoundary, t as Error } from "../index-C4SGQ3Ci.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-D2IFja-3.js";
-import { n as Runtime, r as Guard, t as Error } from "../error-KW8XCcjH.js";
+import { t as ErrorBoundary } from "../boundary-B17cepvm.js";
+import { n as Runtime, r as Guard, t as Error } from "../error-DWhxQEom.js";
 export { ErrorBoundary, Guard as ErrorGuard, Runtime as ErrorRuntime, Error as default };

package/dist/{error-KW8XCcjH.js → error-DWhxQEom.js}

@@ -1,5 +1,5 @@
 import { r as useError } from "./states-Ci1AvoQ9.js";
-import { n as Error$1, t as ErrorBoundary } from "./boundary-D2IFja-3.js";
+import { n as Error$1, t as ErrorBoundary } from "./boundary-B17cepvm.js";
 import { useEffect, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 import { useEventListener } from "@jbpark/use-hooks";
@@ -79,4 +79,4 @@ Error.Guard = Guard;
 //#endregion
 export { Runtime as n, Guard as r, Error as t };
 
-//# sourceMappingURL=error-KW8XCcjH.js.map
+//# sourceMappingURL=error-DWhxQEom.js.map

package/dist/{error-KW8XCcjH.js.map → error-DWhxQEom.js.map}

@@ -1 +1 @@
-{"version":3,"file":"error-KW8XCcjH.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 { useEffect, useRef, useState } from 'react';\n\nimport { useEventListener } from '@jbpark/use-hooks';\n\nimport ErrorComponent from './error';\n\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\n  const containerRef = useRef<HTMLDivElement>(null);\n  const errorHandled = useRef(false);\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 || event.message || 'Unknown error';\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  useEffect(() => {\n    const container = containerRef.current;\n\n    if (!container) {\n      return;\n    }\n\n    const handleUnhandledRejection = (event: PromiseRejectionEvent) => {\n      if (errorHandled.current) {\n        return;\n      }\n\n      errorHandled.current = true;\n\n      const errorMessage = event.reason?.message || 'Promise rejection';\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\n    window.addEventListener(\n      'unhandledrejection',\n      handleUnhandledRejection,\n      true,\n    );\n\n    return () => {\n      window.removeEventListener(\n        'unhandledrejection',\n        handleUnhandledRejection,\n        true,\n      );\n    };\n  }, [onError]);\n\n  if (error) {\n    return (\n      <ErrorComponent\n        title=\"Runtime Error\"\n        message={error}\n        className=\"m-4\"\n        onReset={() => {\n          setError(null);\n          errorHandled.current = false;\n        }}\n      />\n    );\n  }\n\n  return <div ref={containerRef}>{children}</div>;\n};\n\nexport default Guard;\n","import { useEffect } from 'react';\n\nimport { useEventListener } from '@jbpark/use-hooks';\n\nimport { useError } from '~/components/context/states';\n\nimport Error from './error';\n\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\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 <Error message={message} onReset={reset} title=\"Runtime Error\" />;\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":";;;;;;AAWA,MAAM,SAAS,EAAE,UAAU,cAAqB;CAC9C,MAAM,CAAC,OAAO,YAAY,SAAwB,IAAI;CAEtD,MAAM,eAAe,OAAuB,IAAI;CAChD,MAAM,eAAe,OAAO,KAAK;CAEjC,iBACE,UACA,UAAS;EACP,IAAI,aAAa,SACf;EAGF,aAAa,UAAU;EAEvB,MAAM,eACJ,MAAM,OAAO,WAAW,MAAM,WAAW;EAE3C,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,gBAAgB;EAGd,IAAI,CAFc,aAAa,SAG7B;EAGF,MAAM,4BAA4B,UAAiC;GACjE,IAAI,aAAa,SACf;GAGF,aAAa,UAAU;GAEvB,MAAM,eAAe,MAAM,QAAQ,WAAW;GAE9C,MAAM,eAAe;GACrB,SAAS,YAAY;GACrB,UAAU,MAAM,UAAU,IAAI,OAAO,MAAM,YAAY,CAAC;GAExD,iBAAiB;IACf,aAAa,UAAU;GACzB,GAAG,GAAG;EACR;EAEA,OAAO,iBACL,sBACA,0BACA,IACF;EAEA,aAAa;GACX,OAAO,oBACL,sBACA,0BACA,IACF;EACF;CACF,GAAG,CAAC,OAAO,CAAC;CAEZ,IAAI,OACF,OACE,oBAACA,SAAD;EACE,OAAM;EACN,SAAS;EACT,WAAU;EACV,eAAe;GACb,SAAS,IAAI;GACb,aAAa,UAAU;EACzB;CACD,CAAA;CAIL,OAAO,oBAAC,OAAD;EAAK,KAAK;EAAe;CAAc,CAAA;AAChD;;;ACrFA,MAAM,WAAW,EAAE,OAAO,MAAM,YAAmB;CACjD,MAAM,EAAE,OAAO,SAAS,aAAa,SAAS;CAE9C,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,OAAO,oBAACC,SAAD;EAAgB;EAAS,SAAS;EAAO,OAAM;CAAiB,CAAA;AACzE;;;ACnBA,MAAM,QAAQC;AAEd,MAAM,WAAW;AACjB,MAAM,UAAUC;AAChB,MAAM,QAAQC"}
+{"version":3,"file":"error-DWhxQEom.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 { useEffect, useRef, useState } from 'react';\n\nimport { useEventListener } from '@jbpark/use-hooks';\n\nimport ErrorComponent from './error';\n\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\n  const containerRef = useRef<HTMLDivElement>(null);\n  const errorHandled = useRef(false);\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 || event.message || 'Unknown error';\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  useEffect(() => {\n    const container = containerRef.current;\n\n    if (!container) {\n      return;\n    }\n\n    const handleUnhandledRejection = (event: PromiseRejectionEvent) => {\n      if (errorHandled.current) {\n        return;\n      }\n\n      errorHandled.current = true;\n\n      const errorMessage = event.reason?.message || 'Promise rejection';\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\n    window.addEventListener(\n      'unhandledrejection',\n      handleUnhandledRejection,\n      true,\n    );\n\n    return () => {\n      window.removeEventListener(\n        'unhandledrejection',\n        handleUnhandledRejection,\n        true,\n      );\n    };\n  }, [onError]);\n\n  if (error) {\n    return (\n      <ErrorComponent\n        title=\"Runtime Error\"\n        message={error}\n        className=\"m-4\"\n        onReset={() => {\n          setError(null);\n          errorHandled.current = false;\n        }}\n      />\n    );\n  }\n\n  return <div ref={containerRef}>{children}</div>;\n};\n\nexport default Guard;\n","import { useEffect } from 'react';\n\nimport { useEventListener } from '@jbpark/use-hooks';\n\nimport { useError } from '~/components/context/states';\n\nimport Error from './error';\n\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\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 <Error message={message} onReset={reset} title=\"Runtime Error\" />;\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":";;;;;;AAWA,MAAM,SAAS,EAAE,UAAU,cAAqB;CAC9C,MAAM,CAAC,OAAO,YAAY,SAAwB,IAAI;CAEtD,MAAM,eAAe,OAAuB,IAAI;CAChD,MAAM,eAAe,OAAO,KAAK;CAEjC,iBACE,UACA,UAAS;EACP,IAAI,aAAa,SACf;EAGF,aAAa,UAAU;EAEvB,MAAM,eACJ,MAAM,OAAO,WAAW,MAAM,WAAW;EAE3C,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,gBAAgB;EAGd,IAAI,CAFc,aAAa,SAG7B;EAGF,MAAM,4BAA4B,UAAiC;GACjE,IAAI,aAAa,SACf;GAGF,aAAa,UAAU;GAEvB,MAAM,eAAe,MAAM,QAAQ,WAAW;GAE9C,MAAM,eAAe;GACrB,SAAS,YAAY;GACrB,UAAU,MAAM,UAAU,IAAI,OAAO,MAAM,YAAY,CAAC;GAExD,iBAAiB;IACf,aAAa,UAAU;GACzB,GAAG,GAAG;EACR;EAEA,OAAO,iBACL,sBACA,0BACA,IACF;EAEA,aAAa;GACX,OAAO,oBACL,sBACA,0BACA,IACF;EACF;CACF,GAAG,CAAC,OAAO,CAAC;CAEZ,IAAI,OACF,OACE,oBAACA,SAAD;EACE,OAAM;EACN,SAAS;EACT,WAAU;EACV,eAAe;GACb,SAAS,IAAI;GACb,aAAa,UAAU;EACzB;CACD,CAAA;CAIL,OAAO,oBAAC,OAAD;EAAK,KAAK;EAAe;CAAc,CAAA;AAChD;;;ACrFA,MAAM,WAAW,EAAE,OAAO,MAAM,YAAmB;CACjD,MAAM,EAAE,OAAO,SAAS,aAAa,SAAS;CAE9C,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,OAAO,oBAACC,SAAD;EAAgB;EAAS,SAAS;EAAO,OAAM;CAAiB,CAAA;AACzE;;;ACnBA,MAAM,QAAQC;AAEd,MAAM,WAAW;AACjB,MAAM,UAAUC;AAChB,MAAM,QAAQC"}

package/dist/{index-DNNj_0ba.d.ts → index-C4SGQ3Ci.d.ts}

@@ -9,12 +9,13 @@ interface Props$3 {
 interface State {
   hasError: boolean;
   error?: Error;
+  resetKeys?: readonly unknown[];
 }
 declare class ErrorBoundary extends React$1.Component<Props$3, State> {
   constructor(props: Props$3);
-  static getDerivedStateFromError(error: Error): State;
+  static getDerivedStateFromError(error: Error): Partial<State>;
   componentDidCatch(error: Error, errorInfo: React$1.ErrorInfo): void;
-  componentDidUpdate(prevProps: Props$3): void;
+  static getDerivedStateFromProps(props: Props$3, state: State): Partial<State> | null;
   reset: () => void;
   render(): string | number | bigint | boolean | Iterable<React$1.ReactNode> | Promise<string | number | bigint | boolean | React$1.ReactPortal | React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>> | Iterable<React$1.ReactNode> | null | undefined> | React$1.JSX.Element | null | undefined;
 }
@@ -50,4 +51,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-DNNj_0ba.d.ts.map
+//# sourceMappingURL=index-C4SGQ3Ci.d.ts.map

package/dist/{index-C4t0OawE.d.ts → index-CtlUYnWq.d.ts}

@@ -1,6 +1,6 @@
-import { v as Section } from "./document-J9Lo9p81.js";
+import { $ as BindingWidget, Q as BindingType, Y as BindingOption, Z as BindingRenderMap, et as DataAttrNode, f as UpdateFailure } from "./index-w3kLcCXl.js";
+import { v as Section } from "./document-Ct4jW78J.js";
 import { t as FrameProps } from "./index-DpDU1IAw.js";
-import { J as BindingRenderMap, K as BindingOption, X as BindingWidget, Y as BindingType, Z as DataAttrNode, u as UpdateFailure } from "./index-B_p74BRM.js";
 import { useMultiSelect } from "@jbpark/use-hooks";
 //#region src/components/dnd/panel/field.d.ts
 interface FieldProps {
@@ -24,6 +24,20 @@ type DndEditError = {
   error?: unknown;
   title: string;
   description?: string;
+} | {
+  type: 'parse';
+  target: 'document';
+  reason: 'parse-error';
+  error: unknown;
+  title: string;
+  description?: string;
+} | {
+  type: 'parse';
+  target: 'document';
+  reason: 'container-not-found';
+  containerId: string;
+  title: string;
+  description?: string;
 } | {
   type: 'items';
   title: string;
@@ -31,6 +45,20 @@ type DndEditError = {
 };
 type DndRenderField = (props: FieldProps, builtin: React.ReactElement) => React.ReactNode | undefined;
 //#endregion
+//#region src/components/dnd/inspector.d.ts
+interface DndNodePick {
+  id: string;
+  sectionId: string;
+}
+interface DndInspector {
+  active: boolean;
+  activate: () => void;
+  deactivate: () => void;
+  toggle: () => void;
+  picked: DndNodePick | null;
+}
+declare const useDndInspector: () => DndInspector;
+//#endregion
 //#region src/components/dnd/panel-binding.d.ts
 interface PanelNodeChange {
   (params: {
@@ -40,6 +68,9 @@ interface PanelNodeChange {
     value: unknown;
   }): void;
 }
+interface PanelNodesChange {
+  (changes: Parameters<PanelNodeChange>[0][]): void;
+}
 interface PanelBinding {
   id: string;
   label: string;
@@ -56,8 +87,17 @@ interface PanelBinding {
   value: unknown;
   rawValue: string;
   canEditValue?: boolean;
+  present?: boolean;
   onChange: (value: unknown) => void;
 }
+type PanelBindingData = Omit<PanelBinding, 'onChange'>;
+interface PanelBindingSource {
+  id: string;
+  tagName: string;
+  bindings: PanelBindingData[];
+}
+declare const resolvePanelBindings: (node: DataAttrNode) => PanelBindingSource | null;
+declare const withPanelCommit: (bindings: PanelBindingData[], commit: PanelNodeChange | undefined) => PanelBinding[];
 //#endregion
 //#region src/components/dnd/section-fallback-context.d.ts
 interface DndSectionFallbackArgs {
@@ -82,6 +122,8 @@ interface DndPanel {
   canMoveDown: boolean;
   bindings: PanelBinding[];
   onNodeChange: PanelNodeChange;
+  onNodesChange: PanelNodesChange;
+  readOnly: boolean;
 }
 interface Props extends Omit<React.ComponentPropsWithRef<'div'>, 'onChange'> {
   value?: string;
@@ -96,9 +138,13 @@ interface Props extends Omit<React.ComponentPropsWithRef<'div'>, 'onChange'> {
   onEditError?: (error: DndEditError) => void;
   renderSectionFallback?: DndRenderSectionFallback;
   shouldForceSectionFallback?: (section: Section) => boolean;
+  onBeforeDelete?: (section: Section) => boolean | Promise<boolean>;
+  sectionNameFallback?: (index: number) => string;
+  containerId?: string;
+  onNodePick?: (pick: DndNodePick) => void;
   children?: React.ReactNode;
 }
-declare const Dnd$1: ({ value: _value, props, modules: _modules, onChange: _onChange, className, items, frame, dynamicTailwind, provider, renderField, onEditError, renderSectionFallback, shouldForceSectionFallback, children, ...restProps }: Props) => import("react").JSX.Element;
+declare const Dnd$1: ({ value: _value, props, modules: _modules, onChange: _onChange, className, items, frame, dynamicTailwind, provider, renderField, onEditError, renderSectionFallback, shouldForceSectionFallback, onBeforeDelete, sectionNameFallback, containerId, onNodePick, children, ...restProps }: Props) => import("react").JSX.Element;
 //#endregion
 //#region src/components/dnd/draggable.d.ts
 interface DraggableItemDragState {
@@ -130,31 +176,56 @@ interface DndLayout {
   clearSelection: () => void;
   paletteOpen: boolean;
   setPaletteOpen: (open: boolean) => void;
+  documentError: 'parse-error' | 'container-not-found' | null;
 }
 declare const useDndPalette: () => DndPalette;
 declare const useDndPanel: () => DndPanel;
 declare const useDndLayout: () => DndLayout;
 //#endregion
-//#region src/components/dnd/panel/use-items-editor.d.ts
-interface ItemsEditorNestedElement {
+//#region src/components/dnd/panel/use-dnd-children.d.ts
+interface DndChildrenOptions {
+  onChange?: (value: string) => void;
+}
+declare const useDndChildren: (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;
+  };
+};
+type DndChildren = ReturnType<typeof useDndChildren>;
+//#endregion
+//#region src/components/dnd/panel/use-dnd-items.d.ts
+interface DndItemsNestedElement {
   id: string;
   tagName: string;
   bindings: PanelBinding[];
 }
-interface ItemsEditorNestedGroup {
+interface DndItemsNestedGroup {
   property: string;
-  elements: ItemsEditorNestedElement[];
+  elements: DndItemsNestedElement[];
   fallback?: PanelBinding;
 }
-interface ItemsEditorItem {
+interface DndItemsItem {
   id: string;
   index: number;
   elementIndex: number;
   properties: PanelBinding[];
-  nested: ItemsEditorNestedGroup[];
+  nested: DndItemsNestedGroup[];
   value?: PanelBinding;
 }
-interface ItemsEditorActions {
+interface DndItemsActions {
   add: () => void;
   move: (elementIndex: number, toIndex: number) => void;
   remove: (elementIndex: number) => void;
@@ -162,26 +233,48 @@ interface ItemsEditorActions {
   moveSelected: (direction: 'up' | 'down') => void;
   removeSelected: () => void;
 }
-interface ItemsEditor {
+interface DndItemsExpansion {
+  expandedIds: string[];
+  isExpanded: (id: string) => boolean;
+  toggle: (id: string) => void;
+  setExpanded: (ids: string[]) => void;
+}
+interface DndItems {
   kind: 'object' | 'primitive';
-  items: ItemsEditorItem[];
+  items: DndItemsItem[];
   selection: ReturnType<typeof useMultiSelect>;
-  actions: ItemsEditorActions;
+  expansion: DndItemsExpansion;
+  actions: DndItemsActions;
   canEditStructure: boolean;
   parseError: boolean;
 }
-interface ItemsEditorOptions {
+interface DndItemsOptions {
   render?: BindingRenderMap;
   onChange?: (value: string) => void;
   onNodeChange?: PanelNodeChange;
 }
-declare const useItemsEditor: (value: string, { render, onChange, onNodeChange }?: ItemsEditorOptions) => ItemsEditor;
+declare const useDndItems: (value: string, { render, onChange, onNodeChange }?: DndItemsOptions) => DndItems;
 //#endregion
-//#region src/components/dnd/panel/use-children-editor.d.ts
-interface ChildrenEditorOptions {
-  onChange?: (value: string) => void;
-}
-declare const useChildrenEditor: (items: DataAttrNode[], { onChange }?: ChildrenEditorOptions) => {
+//#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';
+type FieldKindBinding = Pick<PanelBinding, 'property' | 'type' | 'value' | 'options' | 'canEditValue'>;
+declare const getFieldKind: (binding: FieldKindBinding) => FieldKind;
+declare const isStructuralFieldKind: (kind: FieldKind) => kind is "items" | "children";
+//#endregion
+//#region src/components/dnd/index.d.ts
+type DndComponent = typeof Dnd$1 & {
+  DraggableItem: typeof DraggableItem;
+  Field: typeof Field;
+  Palette: typeof Palette;
+  Canvas: typeof Canvas;
+  Panel: typeof Panel;
+  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>;
@@ -199,18 +292,22 @@ declare const useChildrenEditor: (items: DataAttrNode[], { onChange }?: Children
     removeSelected: () => void;
   };
 };
-type ChildrenEditor = ReturnType<typeof useChildrenEditor>;
-//#endregion
-//#region src/components/dnd/index.d.ts
-type DndComponent = typeof Dnd$1 & {
-  DraggableItem: typeof DraggableItem;
-  Field: typeof Field;
-  Palette: typeof Palette;
-  Canvas: typeof Canvas;
-  Panel: typeof Panel;
-  Layout: typeof Layout;
-};
-declare const Dnd: DndComponent;
+/** @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 { PanelBinding as A, DraggableItemDragState as C, Props as D, DndPanel as E, FieldProps as F, DndEditError as M, DndRenderField as N, DndRenderSectionFallback as O, Field as P, DraggableItem as S, DndPalette as T, DndLayoutProps as _, ItemsEditor as a, Palette as b, ItemsEditorNestedElement as c, useItemsEditor as d, DndLayout as f, Canvas as g, useDndPanel as h, useChildrenEditor as i, PanelNodeChange as j, DndSectionFallbackArgs as k, ItemsEditorNestedGroup as l, useDndPalette as m, ChildrenEditor as n, ItemsEditorActions as o, useDndLayout as p, ChildrenEditorOptions as r, ItemsEditorItem as s, Dnd as t, ItemsEditorOptions as u, DndRegionProps as v, DraggableItemProps as w, Panel as x, Layout as y };
-//# sourceMappingURL=index-C4t0OawE.d.ts.map
+export { DndNodePick as $, useDndPanel as A, DndPalette as B, useDndItems as C, DndLayout as D, useDndChildren as E, Palette as F, PanelBinding as G, Props as H, Panel as I, PanelNodeChange as J, PanelBindingData as K, DraggableItem as L, DndLayoutProps as M, DndRegionProps as N, useDndLayout as O, Layout as P, DndInspector as Q, DraggableItemDragState as R, DndItemsOptions as S, DndChildrenOptions as T, DndRenderSectionFallback as U, DndPanel as V, DndSectionFallbackArgs as W, resolvePanelBindings as X, PanelNodesChange as Y, withPanelCommit as Z, DndItemsActions as _, ItemsEditorActions as a, DndItemsNestedElement as b, ItemsEditorNestedGroup as c, useItemsEditor as d, useDndInspector as et, FieldKind as f, DndItems as g, isStructuralFieldKind as h, ItemsEditor as i, FieldProps as it, Canvas as j, useDndPalette as k, ItemsEditorOptions as l, getFieldKind as m, ChildrenEditorOptions as n, DndRenderField as nt, ItemsEditorItem as o, FieldKindBinding as p, PanelBindingSource as q, Dnd as r, Field as rt, ItemsEditorNestedElement as s, ChildrenEditor as t, DndEditError as tt, useChildrenEditor as u, DndItemsExpansion as v, DndChildren as w, DndItemsNestedGroup as x, DndItemsItem as y, DraggableItemProps as z };
+//# sourceMappingURL=index-CtlUYnWq.d.ts.map

package/dist/{index-B_p74BRM.d.ts → index-w3kLcCXl.d.ts}

@@ -1,4 +1,4 @@
-import { f as ArrayExpression, g as ObjectExpression, h as Node, m as File, p as Expression } from "./document-J9Lo9p81.js";
+import { C as ObjectExpression, S as Node, b as Expression, x as File, y as ArrayExpression } from "./document-Ct4jW78J.js";
 //#region src/utils/ast/types.d.ts
 interface Attribute {
   name: string;
@@ -127,6 +127,14 @@ type UpdateFailure = {
 } | {
   reason: 'no-binding';
   dataId: string;
+} | {
+  reason: 'reserved-property';
+  dataId: string;
+  property: string;
+} | {
+  reason: 'required-property';
+  dataId: string;
+  property: string;
 } | {
   reason: 'binding-not-declared';
   dataId: string;
@@ -157,12 +165,28 @@ interface UpdateResult {
   failures?: UpdateFailure[];
 }
 declare const update: (code: string, dataId: string, label: string, value: unknown, property?: string) => UpdateResult;
-declare const bulkUpdate: (raw: string, entries: {
+interface UpdateEntry {
   dataId: string;
   label: string;
   value: unknown;
   property?: string;
-}[]) => UpdateResult;
+}
+type UpdateAllResult = {
+  success: true;
+  code: string;
+} | {
+  success: false;
+  code: string;
+  failure: UpdateFailure;
+  index: number;
+};
+declare const updateAll: (raw: string, entries: UpdateEntry[]) => UpdateAllResult;
+/**
+ * @deprecated Not atomic: when an entry fails, the ones before and after it
+ * are still applied, and the returned `code` carries them. Use `updateAll`,
+ * which applies every entry or none. Will be removed in the next major.
+ */
+declare const bulkUpdate: (raw: string, entries: UpdateEntry[]) => UpdateResult;
 //#endregion
 //#region src/utils/ast/children.d.ts
 type ChildrenAction = {
@@ -227,5 +251,5 @@ interface ValidationResult {
 }
 declare const validateBindingValue: (binding: BindingItem, value: unknown) => ValidationResult;
 //#endregion
-export { ExtractedNodeValue as $, arrayExpressionToCode as A, getCurrentValue as B, removeArrayItems as C, EditablePathSegment as D, generateCode as E, flattenEditableValue as F, BindingItem as G, parseBinding as H, parseArrayExpression as I, BindingRenderMap as J, BindingOption as K, parseValue as L, createNodeFromValue as M, extractNodeValue as N, EditablePrimitive as O, extractObjectProperties as P, EditableNodeValueType as Q, setEditableValue as R, parseItems as S, updateArrayItemValue as T, parseBindingExpression as U, getStructuredValue as V, BindingFieldSpec as W, BindingWidget as X, BindingType as Y, DataAttrNode as Z, ItemKind as _, replaceIds as a, moveArrayItem as b, ChildrenEdit as c, UpdateResult as d, NodeValueType as et, bulkUpdate as f, ArrayItem as g, extract as h, fillIds as i, canLosslesslyEvaluateSource as j, EditableValueEntry as k, getChildrenSignatures as l, clearExtractCache as m, validateBindingValue as n, canStructurallyEditArray as o, update as p, BindingRenderLeaf as q, clone as r, ChildrenAction as s, ValidationResult as t, UpdateFailure as u, appendArrayItem as v, updateArrayItemProperty as w, moveArrayItems as x, duplicateArrayItems as y, findEditableChildren as z };
-//# sourceMappingURL=index-B_p74BRM.d.ts.map
+export { BindingWidget as $, EditablePathSegment as A, parseValue as B, moveArrayItem as C, updateArrayItemProperty as D, removeArrayItems as E, createNodeFromValue as F, parseBinding as G, findEditableChildren as H, extractNodeValue as I, BindingItem as J, parseBindingExpression as K, extractObjectProperties as L, EditableValueEntry as M, arrayExpressionToCode as N, updateArrayItemValue as O, canLosslesslyEvaluateSource as P, BindingType as Q, flattenEditableValue as R, duplicateArrayItems as S, parseItems as T, getCurrentValue as U, setEditableValue as V, getStructuredValue as W, BindingRenderLeaf as X, BindingOption as Y, BindingRenderMap as Z, clearExtractCache as _, replaceIds as a, ItemKind as b, ChildrenEdit as c, UpdateEntry as d, DataAttrNode as et, UpdateFailure as f, updateAll as g, update as h, fillIds as i, EditablePrimitive as j, generateCode as k, getChildrenSignatures as l, bulkUpdate as m, validateBindingValue as n, ExtractedNodeValue as nt, canStructurallyEditArray as o, UpdateResult as p, BindingFieldSpec as q, clone as r, NodeValueType as rt, ChildrenAction as s, ValidationResult as t, EditableNodeValueType as tt, UpdateAllResult as u, extract as v, moveArrayItems as w, appendArrayItem as x, ArrayItem as y, parseArrayExpression as z };
+//# sourceMappingURL=index-w3kLcCXl.d.ts.map

package/dist/index.d.ts

@@ -1,8 +1,8 @@
-import { v as Section } from "./document-J9Lo9p81.js";
+import { v as Section } from "./document-Ct4jW78J.js";
 import { t as FrameProps } from "./index-DpDU1IAw.js";
-import { A as PanelBinding, D as Props, E as DndPanel, F as FieldProps, M as DndEditError, N as DndRenderField, O as DndRenderSectionFallback, T as DndPalette, a as ItemsEditor, b as Palette, f as DndLayout, g as Canvas, j as PanelNodeChange, k as DndSectionFallbackArgs, s as ItemsEditorItem, t as Dnd, u as ItemsEditorOptions, w as DraggableItemProps, x as Panel, y as Layout } from "./index-C4t0OawE.js";
+import { $ as DndNodePick, B as DndPalette, D as DndLayout, F as Palette, G as PanelBinding, H as Props, I as Panel, J as PanelNodeChange, P as Layout, Q as DndInspector, S as DndItemsOptions, U as DndRenderSectionFallback, V as DndPanel, W as DndSectionFallbackArgs, Y as PanelNodesChange, g as DndItems, i as ItemsEditor, it as FieldProps, j as Canvas, l as ItemsEditorOptions, nt as DndRenderField, o as ItemsEditorItem, r as Dnd, tt as DndEditError, y as DndItemsItem, z as DraggableItemProps } from "./index-CtlUYnWq.js";
 import { a as Props$2, n as EditorRenderData, r as Props$1, t as Editor } from "./index-13BDSrQc.js";
-import { a as Props$5, n as Props$4, o as Props$3, s as ErrorBoundary, t as Error } from "./index-DNNj_0ba.js";
+import { a as Props$5, n as Props$4, o as Props$3, s as ErrorBoundary, t as Error } from "./index-C4SGQ3Ci.js";
 import { n as Preview, r as Props$6 } from "./index-DQkL37eL.js";
 //#region src/index.d.ts
 declare const App: {
@@ -19,7 +19,7 @@ declare const App: {
   Editor: (({ defaultValue, value: _value, debounce, onChange: _onChange, renderEditor, fragment, prettierOptions, ...props }: Props$1) => import("react").JSX.Element) & {
     Core: ({ value, theme, height, className, prettierOptions, fragment, raw, onChange, onSave, onError, ...props }: Props$2) => import("react").JSX.Element;
   };
-  Dnd: (({ value: _value, props, modules: _modules, onChange: _onChange, className, items, frame, dynamicTailwind, provider, renderField, onEditError, renderSectionFallback, shouldForceSectionFallback, children, ...restProps }: Props) => import("react").JSX.Element) & {
+  Dnd: (({ value: _value, props, modules: _modules, onChange: _onChange, className, items, frame, dynamicTailwind, provider, renderField, onEditError, renderSectionFallback, shouldForceSectionFallback, onBeforeDelete, sectionNameFallback, containerId, onNodePick, children, ...restProps }: Props) => import("react").JSX.Element) & {
     DraggableItem: ({ item, children }: DraggableItemProps) => import("react").ReactNode;
     Field: (props: FieldProps) => import("react").JSX.Element;
     Palette: typeof Palette;
@@ -30,5 +30,5 @@ declare const App: {
 };
 declare const LiveRenderer: ({ code, props, modules, dynamicTailwind, provider, ...restProps }: Props$6) => import("react").JSX.Element;
 //#endregion
-export { type DndEditError, type DndLayout, 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, Preview as LivePreview, App as LiveProvider, App as default, LiveRenderer, type PanelBinding, type PanelNodeChange, type Section };
+export { 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, Preview as LivePreview, App as LiveProvider, App as default, LiveRenderer, type PanelBinding, type PanelNodeChange, type PanelNodesChange, type Section };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -1,8 +1,8 @@
-import { t as ContextProvider } from "./context-DQ-UtoyS.js";
-import { t as Dnd } from "./dnd-CMrXfD8O.js";
-import { t as Editor } from "./editor-C3tQaMlU.js";
-import { t as Error } from "./error-KW8XCcjH.js";
-import { t as Preview } from "./preview-BwEfltgi.js";
+import { t as ContextProvider } from "./context-93X3gyfJ.js";
+import { t as Dnd } from "./dnd-Z1KS16Fy.js";
+import { t as Editor } from "./editor-DvMruljw.js";
+import { t as Error } from "./error-DWhxQEom.js";
+import { t as Preview } from "./preview-C_UzpGWh.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/index.tsx
 const App = ({ children }) => {

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 from './components/context';\nimport LiveDnd, {\n  type DndEditError,\n  type DndLayout,\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} 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';\n\nconst App = ({ children }: { children?: React.ReactNode }) => {\n  return <Context>{children}</Context>;\n};\n\nconst LiveRenderer = LivePreview;\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  PanelBinding,\n  PanelNodeChange,\n  FieldProps,\n  ItemsEditor,\n  ItemsEditorItem,\n  ItemsEditorOptions,\n  EditorRenderData,\n  FrameProps,\n  Section,\n};\n\nApp.Preview = LivePreview;\nApp.Renderer = LiveRenderer;\nApp.Error = LiveError;\nApp.Editor = LiveEditor;\nApp.Dnd = LiveDnd;\n\nexport default App;\n"],"mappings":";;;;;;;AAwBA,MAAM,OAAO,EAAE,eAA+C;CAC5D,OAAO,oBAACA,iBAAD,EAAU,SAAkB,CAAA;AACrC;AAEA,MAAM,eAAeC;AA+BrB,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 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';\n\nconst App = ({ children }: { children?: React.ReactNode }) => {\n  return <Context>{children}</Context>;\n};\n\nconst LiveRenderer = LivePreview;\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};\n\nApp.Preview = LivePreview;\nApp.Renderer = LiveRenderer;\nApp.Error = LiveError;\nApp.Editor = LiveEditor;\nApp.Dnd = LiveDnd;\n\nexport default App;\n"],"mappings":";;;;;;;AA8BA,MAAM,OAAO,EAAE,eAA+C;CAC5D,OAAO,oBAACA,iBAAD,EAAU,SAAkB,CAAA;AACrC;AAEA,MAAM,eAAeC;AAsCrB,IAAI,UAAUA;AACd,IAAI,WAAW;AACf,IAAI,QAAQC;AACZ,IAAI,SAASC;AACb,IAAI,MAAMC"}

package/dist/preview/index.js

@@ -1,3 +1,3 @@
-import { r as baseModules } from "../use-dynamic-tailwind-DuGLeDR3.js";
-import { t as Preview } from "../preview-BwEfltgi.js";
+import { r as baseModules } from "../use-dynamic-tailwind-DpbjmATF.js";
+import { t as Preview } from "../preview-C_UzpGWh.js";
 export { baseModules, Preview as default };

package/dist/{preview-BwEfltgi.js → preview-C_UzpGWh.js}

@@ -1,7 +1,7 @@
 import { i as usePreview, r as useError } from "./states-Ci1AvoQ9.js";
 import { t as cn } from "./cn-CAnad2vL.js";
-import { a as Frame, n as useCompiledModule, t as useDynamicTailwind } from "./use-dynamic-tailwind-DuGLeDR3.js";
-import { t as Error } from "./error-KW8XCcjH.js";
+import { a as Frame, n as useCompiledModule, t as useDynamicTailwind } from "./use-dynamic-tailwind-DpbjmATF.js";
+import { t as Error } from "./error-DWhxQEom.js";
 import { useMemo } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/preview/defaults.ts
@@ -83,4 +83,4 @@ const Preview = ({ code, props = NO_PROPS, modules = NO_MODULES, dynamicTailwind
 //#endregion
 export { Preview as t };
 
-//# sourceMappingURL=preview-BwEfltgi.js.map
+//# sourceMappingURL=preview-C_UzpGWh.js.map

package/dist/{preview-BwEfltgi.js.map → preview-C_UzpGWh.js.map}

@@ -1 +1 @@
-{"version":3,"file":"preview-BwEfltgi.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 { 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 './preview';\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 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=\"Compile Error\" />\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 type React from 'react';\n\nimport type { FrameProps } from '../frame';\nimport Client from './client';\nimport { NO_MODULES, NO_PROPS } from './defaults';\n\nexport interface Props extends React.ComponentPropsWithRef<'div'> {\n  code?: string;\n  showError?: boolean;\n  props?: Record<string, unknown>;\n  container?: HTMLElement | null;\n  frame?: boolean | FrameProps;\n  modules?: Record<string, unknown>;\n  dynamicTailwind?: boolean;\n  provider?: (children: React.ReactNode) => React.ReactNode;\n}\n\n// A thin wrapper around Client, which does the actual compiling, error\n// handling, and frame wrapping. This used to have its own duplicate\n// compile-and-render branch for the `code` prop that never wrapped its\n// output in <Frame>, so `frame` was silently ignored whenever `code` was\n// passed — see #187. Client already handles `code` (falling back to\n// context when absent) and `frame`, so there is only one render path now.\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;;;ACUpD,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,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,OAAM;EAAiB,CAAA;CACtD,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;;;ACnGA,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"}
+{"version":3,"file":"preview-C_UzpGWh.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 { 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 './preview';\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 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=\"Compile Error\" />\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 type React from 'react';\n\nimport type { FrameProps } from '../frame';\nimport Client from './client';\nimport { NO_MODULES, NO_PROPS } from './defaults';\n\nexport interface Props extends React.ComponentPropsWithRef<'div'> {\n  code?: string;\n  showError?: boolean;\n  props?: Record<string, unknown>;\n  container?: HTMLElement | null;\n  frame?: boolean | FrameProps;\n  modules?: Record<string, unknown>;\n  dynamicTailwind?: boolean;\n  provider?: (children: React.ReactNode) => React.ReactNode;\n}\n\n// A thin wrapper around Client, which does the actual compiling, error\n// handling, and frame wrapping. This used to have its own duplicate\n// compile-and-render branch for the `code` prop that never wrapped its\n// output in <Frame>, so `frame` was silently ignored whenever `code` was\n// passed — see #187. Client already handles `code` (falling back to\n// context when absent) and `frame`, so there is only one render path now.\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;;;ACUpD,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,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,OAAM;EAAiB,CAAA;CACtD,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;;;ACnGA,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.js

@@ -1,2 +1,2 @@
-import { t as ContextProvider } from "../context-DQ-UtoyS.js";
+import { t as ContextProvider } from "../context-93X3gyfJ.js";
 export { ContextProvider as default };

package/dist/sections-GJQ63uEB.js

@@ -0,0 +1,24 @@
+import { a as generateSectionPreview, l as parseDocument, o as generateSectionPreviews, s as getSections, u as replaceDocumentSections } from "./document-cEEdFERz.js";
+import { i as DEFAULT_CONTAINER_ID, u as documentTemplate } from "./constants-CKvdqZtO.js";
+//#region src/utils/sections.ts
+const extractSections = (code, options) => {
+	const doc = parseDocument(code, options);
+	return doc ? getSections(doc, options) : [];
+};
+const replaceSections = (code, sections, options) => {
+	return replaceDocumentSections(code, sections, options);
+};
+const generateSection = (code, fullCode, options) => {
+	return generateSectionPreview(fullCode, code, options);
+};
+const generateSections = (codes, fullCode, options) => {
+	return generateSectionPreviews(fullCode, codes, options);
+};
+const createDocument = ({ containerId = DEFAULT_CONTAINER_ID } = {}) => {
+	if (!/^[^\s"'<>{}]+$/.test(containerId)) throw new Error(`createDocument: containerId must be a plain element id, got ${JSON.stringify(containerId)}`);
+	return documentTemplate(containerId);
+};
+//#endregion
+export { replaceSections as a, generateSections as i, extractSections as n, generateSection as r, createDocument as t };
+
+//# sourceMappingURL=sections-GJQ63uEB.js.map