@jbpark/live-editor 2.0.3 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{ast-BhbOxomw.js → ast-CAhr9WXv.js} +78 -20
- package/dist/ast-CAhr9WXv.js.map +1 -0
- package/dist/{boundary-DOBK2HnX.js → boundary-DQiKrXhI.js} +2 -2
- package/dist/{boundary-DOBK2HnX.js.map → boundary-DQiKrXhI.js.map} +1 -1
- package/dist/{context-DOMX_RsU.js → context-CJ0_ptf4.js} +3 -3
- package/dist/{context-DOMX_RsU.js.map → context-CJ0_ptf4.js.map} +1 -1
- package/dist/core-D5Hn-6ow.js +123 -0
- package/dist/core-D5Hn-6ow.js.map +1 -0
- package/dist/dnd/index.d.ts +1 -1
- package/dist/dnd/index.js +1 -1
- package/dist/{dnd-E8LbmRfE.js → dnd-C1YGcp4k.js} +138 -86
- package/dist/dnd-C1YGcp4k.js.map +1 -0
- package/dist/{document-Ddw-tfnt.js → document-CgUTKVQo.js} +11 -9
- package/dist/document-CgUTKVQo.js.map +1 -0
- package/dist/editor/index.js +2 -2
- package/dist/{editor-ka05eWyz.js → editor-Ds-mUYs_.js} +3 -3
- package/dist/{editor-ka05eWyz.js.map → editor-Ds-mUYs_.js.map} +1 -1
- package/dist/error/index.js +2 -2
- package/dist/{error-fzPGTaFe.js → error-B5MciRP7.js} +2 -2
- package/dist/{error-fzPGTaFe.js.map → error-B5MciRP7.js.map} +1 -1
- package/dist/{index-2CUWhF-T.d.ts → index-9bvWkK07.d.ts} +2 -2
- package/dist/{index-FKgYmeNR.d.ts → index-GuEiafMN.d.ts} +29 -2
- package/dist/index.d.ts +1 -1
- package/dist/index.js +5 -5
- package/dist/preview/index.js +1 -1
- package/dist/{preview-EsfzEjis.js → preview-DtBbnlwy.js} +4 -4
- package/dist/{preview-EsfzEjis.js.map → preview-DtBbnlwy.js.map} +1 -1
- package/dist/provider/index.js +1 -1
- package/dist/style.css +448 -60
- package/dist/{use-dynamic-tailwind-CRMGuKnH.js → use-dynamic-tailwind-cdaivJXJ.js} +2 -2
- package/dist/{use-dynamic-tailwind-CRMGuKnH.js.map → use-dynamic-tailwind-cdaivJXJ.js.map} +1 -1
- package/dist/utils/ast/index.d.ts +2 -2
- package/dist/utils/ast/index.js +2 -2
- package/dist/utils/index.js +2 -2
- package/dist/{utils-B6zpA7mT.js → utils-DbfbS1yV.js} +2 -2
- package/dist/{utils-B6zpA7mT.js.map → utils-DbfbS1yV.js.map} +1 -1
- package/package.json +26 -10
- package/dist/ast-BhbOxomw.js.map +0 -1
- package/dist/core-D-ZvVhdn.js +0 -11195
- package/dist/core-D-ZvVhdn.js.map +0 -1
- package/dist/dnd-E8LbmRfE.js.map +0 -1
- package/dist/document-Ddw-tfnt.js.map +0 -1
package/dist/editor/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { t as Core } from "../core-
|
|
2
|
-
import { t as Editor } from "../editor-
|
|
1
|
+
import { t as Core } from "../core-D5Hn-6ow.js";
|
|
2
|
+
import { t as Editor } from "../editor-Ds-mUYs_.js";
|
|
3
3
|
export { Core, Editor as default };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { y as DEFAULT_TEMPLATE } from "./document-
|
|
1
|
+
import { y as DEFAULT_TEMPLATE } from "./document-CgUTKVQo.js";
|
|
2
2
|
import { i as usePreview, r as useError } from "./states-Ci1AvoQ9.js";
|
|
3
|
-
import { n as useFormatCode, t as Core } from "./core-
|
|
3
|
+
import { n as useFormatCode, t as Core } from "./core-D5Hn-6ow.js";
|
|
4
4
|
import { useCallback, useEffect } from "react";
|
|
5
5
|
import { jsx } from "react/jsx-runtime";
|
|
6
6
|
import { useDebouncedValue } from "@jbpark/use-hooks";
|
|
@@ -48,4 +48,4 @@ Editor.Core = Core;
|
|
|
48
48
|
//#endregion
|
|
49
49
|
export { Editor as t };
|
|
50
50
|
|
|
51
|
-
//# sourceMappingURL=editor-
|
|
51
|
+
//# sourceMappingURL=editor-Ds-mUYs_.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"editor-
|
|
1
|
+
{"version":3,"file":"editor-Ds-mUYs_.js","names":["Editor","EditorImpl"],"sources":["../src/components/editor/editor.tsx","../src/components/editor/index.ts"],"sourcesContent":["import { useCallback, useEffect } from 'react';\n\nimport { useDebouncedValue } from '@jbpark/use-hooks';\n\nimport { useError, usePreview } from '~/components/context/states';\nimport { DEFAULT_TEMPLATE } from '~/constants';\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, 'onSave' | 'onError'> {\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 { setCode } = usePreview();\n const { setError } = useError();\n\n const value =\n _value.trim() === '' ? defaultValue || DEFAULT_TEMPLATE : _value;\n\n const onChange = useCallback(\n (value: string) => {\n _onChange?.(value);\n },\n [_onChange],\n );\n\n const onSave = useCallback(\n (formattedCode: string) => {\n setCode(formattedCode);\n },\n [setCode],\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 const debouncedValue = useDebouncedValue(value, debounce);\n\n useEffect(() => {\n setCode(debouncedValue);\n }, [debouncedValue, setCode]);\n\n if (renderEditor) {\n return renderEditor({ value, onChange, formatCode });\n }\n\n return (\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};\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,YAAY,WAAW;CAC/B,MAAM,EAAE,aAAa,SAAS;CAE9B,MAAM,QACJ,OAAO,KAAK,MAAM,KAAK,gBAAgB,mBAAmB;CAE5D,MAAM,WAAW,aACd,UAAkB;EACjB,YAAY,KAAK;CACnB,GACA,CAAC,SAAS,CACZ;CAEA,MAAM,SAAS,aACZ,kBAA0B;EACzB,QAAQ,aAAa;CACvB,GACA,CAAC,OAAO,CACV;CAEA,MAAM,UAAU,aACb,UAAyB;EACxB,SAAS,KAAK;CAChB,GACA,CAAC,QAAQ,CACX;CAEA,MAAM,aAAa,cAAc;EAAE;EAAU;CAAgB,CAAC;CAE9D,MAAM,iBAAiB,kBAAkB,OAAO,QAAQ;CAExD,gBAAgB;EACd,QAAQ,cAAc;CACxB,GAAG,CAAC,gBAAgB,OAAO,CAAC;CAE5B,IAAI,cACF,OAAO,aAAa;EAAE;EAAO;EAAU;CAAW,CAAC;CAGrD,OACE,oBAAC,MAAD;EACS;EACG;EACF;EACC;EACC;EACO;EACjB,GAAI;CACL,CAAA;AAEL;;;ACnFA,MAAM,SAASC;AAEf,OAAO,OAAO"}
|
package/dist/error/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { t as ErrorBoundary } from "../boundary-
|
|
2
|
-
import { n as Runtime, r as Guard, t as Error } from "../error-
|
|
1
|
+
import { t as ErrorBoundary } from "../boundary-DQiKrXhI.js";
|
|
2
|
+
import { n as Runtime, r as Guard, t as Error } from "../error-B5MciRP7.js";
|
|
3
3
|
export { ErrorBoundary, Guard as ErrorGuard, Runtime as ErrorRuntime, Error as default };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as useError } from "./states-Ci1AvoQ9.js";
|
|
2
|
-
import { n as Error$1, t as ErrorBoundary } from "./boundary-
|
|
2
|
+
import { n as Error$1, t as ErrorBoundary } from "./boundary-DQiKrXhI.js";
|
|
3
3
|
import { useEffect, useRef, useState } from "react";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
5
|
import { useEventListener } from "@jbpark/use-hooks";
|
|
@@ -79,4 +79,4 @@ Error.Guard = Guard;
|
|
|
79
79
|
//#endregion
|
|
80
80
|
export { Runtime as n, Guard as r, Error as t };
|
|
81
81
|
|
|
82
|
-
//# sourceMappingURL=error-
|
|
82
|
+
//# sourceMappingURL=error-B5MciRP7.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"error-
|
|
1
|
+
{"version":3,"file":"error-B5MciRP7.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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { v as Section } from "./document-J9Lo9p81.js";
|
|
2
|
-
import { B as
|
|
2
|
+
import { B as BindingOption, H as BindingRenderMap, U as BindingType } from "./index-GuEiafMN.js";
|
|
3
3
|
import { t as FrameProps } from "./index-DpDU1IAw.js";
|
|
4
4
|
import { LucideIcon } from "lucide-react";
|
|
5
5
|
//#region src/components/dnd/draggable.d.ts
|
|
@@ -95,4 +95,4 @@ type DndComponent = typeof Dnd$1 & {
|
|
|
95
95
|
declare const Dnd: DndComponent;
|
|
96
96
|
//#endregion
|
|
97
97
|
export { ICON_OPTIONS as a, PanelRenderData as c, DraggableItemDragState as d, DraggableItemProps as f, ICON_MAP as i, Props as l, Panel as n, PaletteRenderData as o, PanelProps as r, PanelBinding as s, Dnd as t, DraggableItem as u };
|
|
98
|
-
//# sourceMappingURL=index-
|
|
98
|
+
//# sourceMappingURL=index-9bvWkK07.d.ts.map
|
|
@@ -112,9 +112,36 @@ declare function extract(raw: string): DataAttrNode[];
|
|
|
112
112
|
declare function clearExtractCache(): void;
|
|
113
113
|
//#endregion
|
|
114
114
|
//#region src/utils/ast/update.d.ts
|
|
115
|
+
type UpdateFailure = {
|
|
116
|
+
reason: 'element-not-found';
|
|
117
|
+
dataId: string;
|
|
118
|
+
} | {
|
|
119
|
+
reason: 'no-binding';
|
|
120
|
+
dataId: string;
|
|
121
|
+
} | {
|
|
122
|
+
reason: 'binding-not-declared';
|
|
123
|
+
dataId: string;
|
|
124
|
+
label: string;
|
|
125
|
+
property?: string;
|
|
126
|
+
} | {
|
|
127
|
+
reason: 'duplicate-binding';
|
|
128
|
+
dataId: string;
|
|
129
|
+
label: string;
|
|
130
|
+
property?: string;
|
|
131
|
+
count: number;
|
|
132
|
+
} | {
|
|
133
|
+
reason: 'attribute-not-found';
|
|
134
|
+
dataId: string;
|
|
135
|
+
property: string;
|
|
136
|
+
} | {
|
|
137
|
+
reason: 'parse-error';
|
|
138
|
+
error: unknown;
|
|
139
|
+
};
|
|
115
140
|
interface UpdateResult {
|
|
116
141
|
code: string;
|
|
117
142
|
success: boolean;
|
|
143
|
+
failure?: UpdateFailure;
|
|
144
|
+
failures?: UpdateFailure[];
|
|
118
145
|
}
|
|
119
146
|
declare const update: (code: string, dataId: string, label: string, value: unknown, property?: string) => UpdateResult;
|
|
120
147
|
declare const bulkUpdate: (raw: string, entries: {
|
|
@@ -162,5 +189,5 @@ interface ValidationResult {
|
|
|
162
189
|
}
|
|
163
190
|
declare const validateBindingValue: (binding: BindingItem, value: unknown) => ValidationResult;
|
|
164
191
|
//#endregion
|
|
165
|
-
export {
|
|
166
|
-
//# sourceMappingURL=index-
|
|
192
|
+
export { flattenEditableValue as A, BindingOption as B, EditablePathSegment as C, createNodeFromValue as D, arrayExpressionToCode as E, getCurrentValue as F, EditableNodeValueType as G, BindingRenderMap as H, getStructuredValue as I, ExtractedNodeValue as K, parseBinding as L, parseValue as M, setEditableValue as N, extractNodeValue as O, findEditableChildren as P, parseBindingExpression as R, generateCode as S, EditableValueEntry as T, BindingType as U, BindingRenderLeaf as V, DataAttrNode as W, moveArrayItems as _, replaceIds as a, updateArrayItemProperty as b, bulkUpdate as c, extract as d, ArrayItem as f, moveArrayItem as g, duplicateArrayItems as h, fillIds as i, parseArrayExpression as j, extractObjectProperties as k, update as l, appendArrayItem as m, validateBindingValue as n, UpdateFailure as o, ItemKind as p, NodeValueType as q, clone as r, UpdateResult as s, ValidationResult as t, clearExtractCache as u, parseItems as v, EditablePrimitive as w, updateArrayItemValue as x, removeArrayItems as y, BindingItem as z };
|
|
193
|
+
//# sourceMappingURL=index-GuEiafMN.d.ts.map
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { v as Section } from "./document-J9Lo9p81.js";
|
|
2
2
|
import { t as FrameProps } from "./index-DpDU1IAw.js";
|
|
3
|
-
import { c as PanelRenderData, f as DraggableItemProps, l as Props, o as PaletteRenderData, r as PanelProps, s as PanelBinding, t as Dnd } from "./index-
|
|
3
|
+
import { c as PanelRenderData, f as DraggableItemProps, l as Props, o as PaletteRenderData, r as PanelProps, s as PanelBinding, t as Dnd } from "./index-9bvWkK07.js";
|
|
4
4
|
import { a as Props$2, n as EditorRenderData, r as Props$1, t as Editor } from "./index-C4TBkJBG.js";
|
|
5
5
|
import { a as Props$5, n as Props$4, o as Props$3, s as ErrorBoundary, t as Error } from "./index-CCynrS6c.js";
|
|
6
6
|
import { n as Props$6, t as Preview } from "./index-lgHdCda5.js";
|
package/dist/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { t as ContextProvider } from "./context-
|
|
2
|
-
import { t as Dnd } from "./dnd-
|
|
3
|
-
import { t as Editor } from "./editor-
|
|
4
|
-
import { t as Error } from "./error-
|
|
5
|
-
import { t as Preview } from "./preview-
|
|
1
|
+
import { t as ContextProvider } from "./context-CJ0_ptf4.js";
|
|
2
|
+
import { t as Dnd } from "./dnd-C1YGcp4k.js";
|
|
3
|
+
import { t as Editor } from "./editor-Ds-mUYs_.js";
|
|
4
|
+
import { t as Error } from "./error-B5MciRP7.js";
|
|
5
|
+
import { t as Preview } from "./preview-DtBbnlwy.js";
|
|
6
6
|
import { jsx } from "react/jsx-runtime";
|
|
7
7
|
//#region src/index.tsx
|
|
8
8
|
const App = ({ children }) => {
|
package/dist/preview/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as Preview } from "../preview-
|
|
1
|
+
import { t as Preview } from "../preview-DtBbnlwy.js";
|
|
2
2
|
export { Preview as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { r as cn } from "./utils-
|
|
1
|
+
import { r as cn } from "./utils-DbfbS1yV.js";
|
|
2
2
|
import { i as usePreview, r as useError } from "./states-Ci1AvoQ9.js";
|
|
3
|
-
import { n as useCompiledModule, r as Frame, t as useDynamicTailwind } from "./use-dynamic-tailwind-
|
|
4
|
-
import { t as Error } from "./error-
|
|
3
|
+
import { n as useCompiledModule, r as Frame, t as useDynamicTailwind } from "./use-dynamic-tailwind-cdaivJXJ.js";
|
|
4
|
+
import { t as Error } from "./error-B5MciRP7.js";
|
|
5
5
|
import { useMemo } from "react";
|
|
6
6
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
//#region src/components/preview/client.tsx
|
|
@@ -79,4 +79,4 @@ const Preview = ({ code, props = {}, modules = {}, dynamicTailwind = false, prov
|
|
|
79
79
|
//#endregion
|
|
80
80
|
export { Preview as t };
|
|
81
81
|
|
|
82
|
-
//# sourceMappingURL=preview-
|
|
82
|
+
//# sourceMappingURL=preview-DtBbnlwy.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"preview-
|
|
1
|
+
{"version":3,"file":"preview-DtBbnlwy.js","names":["LiveError"],"sources":["../src/components/preview/client.tsx","../src/components/preview/preview.tsx"],"sourcesContent":["'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';\n\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 = {},\n 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 || 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';\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 = {},\n 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":";;;;;;;AAaA,MAAM,UAAU,EACd,MAAM,QAAQ,IACd,WACA,WACA,QAAQ,CAAC,GACT,UAAU,CAAC,GACX,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,SAAS;CAE/B,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,CAAC,GACT,UAAU,CAAC,GACX,kBAAkB,OAClB,UACA,GAAG,gBACQ;CACX,OACE,oBAAC,QAAD;EACQ;EACC;EACE;EACQ;EACP;EACV,GAAI;CACL,CAAA;AAEL"}
|
package/dist/provider/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as ContextProvider } from "../context-
|
|
1
|
+
import { t as ContextProvider } from "../context-CJ0_ptf4.js";
|
|
2
2
|
export { ContextProvider as default };
|