@lumeweb/portal-framework-ui 0.0.1 → 0.1.0

package/dist/cjs/components/dialog/utils/dialogDetection.d.cts

@@ -0,0 +1,33 @@
+import { DialogConfig, DialogType } from "../Dialog.types.cjs";
+
+//#region src/components/dialog/utils/dialogDetection.d.ts
+
+/**
+ * Config-based detection for dialog type
+ * Useful for static type checking and compile-time analysis
+ * @param config Dialog configuration object
+ */
+declare function getDialogTypeFromConfig(config: DialogConfig): DialogType;
+/**
+ * Hook-based detection for current dialog type
+ * Returns the type of the currently open dialog or null if no dialog is open
+ */
+declare function useDialogType(): DialogType | null;
+/**
+ * Hook-based detection for whether we're in a form dialog
+ * Checks the current dialog context for form-related dialogs
+ */
+declare function useIsFormDialog(): boolean;
+/**
+ * Hook-based detection for whether we're currently in any dialog
+ * More accurate than config-based detection as it reflects runtime state
+ */
+declare function useIsInDialog(): boolean;
+/**
+ * Hook-based detection for whether we're in a wizard dialog
+ * Checks the current dialog context for wizard-specific dialogs
+ */
+declare function useIsWizardDialog(): boolean;
+//#endregion
+export { getDialogTypeFromConfig, useDialogType, useIsFormDialog, useIsInDialog, useIsWizardDialog };
+//# sourceMappingURL=dialogDetection.d.cts.map

package/dist/cjs/components/dialog/utils/index.cjs

@@ -0,0 +1,25 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_components_dialog_utils_dialogClasses = require('./dialogClasses.cjs');
+const require_components_dialog_utils_dialogDetection = require('./dialogDetection.cjs');
+
+//#region src/components/dialog/utils/index.ts
+var init_utils = require_rolldown_runtime.__esmMin((() => {
+	init_dialogClasses();
+	init_dialogDetection();
+}));
+
+//#endregion
+init_utils();
+exports.getDialogContentClasses = require_components_dialog_utils_dialogClasses.getDialogContentClasses;
+exports.getDialogTypeFromConfig = require_components_dialog_utils_dialogDetection.getDialogTypeFromConfig;
+Object.defineProperty(exports, 'init_utils', {
+  enumerable: true,
+  get: function () {
+    return init_utils;
+  }
+});
+exports.useDialogType = require_components_dialog_utils_dialogDetection.useDialogType;
+exports.useIsFormDialog = require_components_dialog_utils_dialogDetection.useIsFormDialog;
+exports.useIsInDialog = require_components_dialog_utils_dialogDetection.useIsInDialog;
+exports.useIsWizardDialog = require_components_dialog_utils_dialogDetection.useIsWizardDialog;
+//# sourceMappingURL=index.cjs.map

package/dist/cjs/components/dialog/utils/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":[],"sources":["../../../../../src/components/dialog/utils/index.ts"],"sourcesContent":["export * from \"./dialogClasses\";\nexport * from \"./dialogDetection\";\n"],"mappings":""}

package/dist/cjs/components/dialog/utils/index.d.cts

@@ -0,0 +1,3 @@
+import { getDialogContentClasses } from "./dialogClasses.cjs";
+import { getDialogTypeFromConfig, useDialogType, useIsFormDialog, useIsInDialog, useIsWizardDialog } from "./dialogDetection.cjs";
+export { getDialogContentClasses, getDialogTypeFromConfig, useDialogType, useIsFormDialog, useIsInDialog, useIsWizardDialog };

package/dist/cjs/components/editor/BlockTypeDropdown.cjs

@@ -0,0 +1,71 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_components_editor_ToolbarContext = require('./ToolbarContext.cjs');
+const require_components_editor_formatting = require('./formatting.cjs');
+let _lumeweb_portal_framework_ui_core = require("@lumeweb/portal-framework-ui-core");
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let _lexical_react_LexicalComposerContext = require("@lexical/react/LexicalComposerContext");
+
+//#region src/components/editor/BlockTypeDropdown.tsx
+function BlockTypeDropdown({ blockType }) {
+	const [editor] = (0, _lexical_react_LexicalComposerContext.useLexicalComposerContext)();
+	const { updateToolbarState } = require_components_editor_ToolbarContext.useToolbarState();
+	const handleSelect = (value) => {
+		switch (value) {
+			case "bullet":
+				require_components_editor_formatting.formatBulletList(editor, blockType, updateToolbarState);
+				break;
+			case "check":
+				require_components_editor_formatting.formatCheckList(editor, blockType, updateToolbarState);
+				break;
+			case "code":
+				require_components_editor_formatting.formatCode(editor, blockType, updateToolbarState);
+				break;
+			case "h1":
+			case "h2":
+			case "h3":
+			case "h4":
+			case "h5":
+			case "h6":
+				require_components_editor_formatting.formatHeading(editor, blockType, value, updateToolbarState);
+				break;
+			case "number":
+				require_components_editor_formatting.formatOrderedList(editor, blockType, updateToolbarState);
+				break;
+			case "paragraph":
+				require_components_editor_formatting.formatParagraph(editor, updateToolbarState);
+				break;
+			case "quote":
+				require_components_editor_formatting.formatQuote(editor, blockType, updateToolbarState);
+				break;
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_lumeweb_portal_framework_ui_core.Select, {
+		onValueChange: handleSelect,
+		value: blockType,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lumeweb_portal_framework_ui_core.SelectTrigger, {
+			className: "w-40",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lumeweb_portal_framework_ui_core.SelectValue, { placeholder: "Block Type" })
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lumeweb_portal_framework_ui_core.SelectContent, { children: Object.keys(require_components_editor_ToolbarContext.blockTypeToBlockName).map((type) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lumeweb_portal_framework_ui_core.SelectItem, {
+			value: type,
+			children: require_components_editor_ToolbarContext.blockTypeToBlockName[type]
+		}, type)) })]
+	});
+}
+var init_BlockTypeDropdown = require_rolldown_runtime.__esmMin((() => {
+	require_components_editor_formatting.init_formatting();
+	require_components_editor_ToolbarContext.init_ToolbarContext();
+}));
+
+//#endregion
+init_BlockTypeDropdown();
+exports.default = BlockTypeDropdown;
+Object.defineProperty(exports, 'init_BlockTypeDropdown', {
+  enumerable: true,
+  get: function () {
+    return init_BlockTypeDropdown;
+  }
+});
+//# sourceMappingURL=BlockTypeDropdown.cjs.map

package/dist/cjs/components/editor/BlockTypeDropdown.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockTypeDropdown.cjs","names":["useToolbarState","Select","SelectTrigger","SelectValue","SelectContent","blockTypeToBlockName","SelectItem"],"sources":["../../../../src/components/editor/BlockTypeDropdown.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from \"@lumeweb/portal-framework-ui-core\";\nimport React from \"react\";\n\nimport {\n  formatBulletList,\n  formatCheckList,\n  formatCode,\n  formatHeading,\n  formatOrderedList,\n  formatParagraph,\n  formatQuote,\n} from \"./formatting\";\nimport { blockTypeToBlockName, useToolbarState } from \"./ToolbarContext\";\n\ninterface BlockTypeDropdownProps {\n  blockType: keyof typeof blockTypeToBlockName;\n}\n\nexport default function BlockTypeDropdown({\n  blockType,\n}: BlockTypeDropdownProps) {\n  const [editor] = useLexicalComposerContext();\n  const { updateToolbarState } = useToolbarState();\n\n  const handleSelect = (value: string) => {\n    switch (value) {\n      case \"bullet\":\n        formatBulletList(editor, blockType, updateToolbarState);\n        break;\n      case \"check\":\n        formatCheckList(editor, blockType, updateToolbarState);\n        break;\n      case \"code\":\n        formatCode(editor, blockType, updateToolbarState);\n        break;\n      case \"h1\":\n      case \"h2\":\n      case \"h3\":\n      case \"h4\":\n      case \"h5\":\n      case \"h6\":\n        formatHeading(editor, blockType, value, updateToolbarState);\n        break;\n      case \"number\":\n        formatOrderedList(editor, blockType, updateToolbarState);\n        break;\n      case \"paragraph\":\n        formatParagraph(editor, updateToolbarState);\n        break;\n      case \"quote\":\n        formatQuote(editor, blockType, updateToolbarState);\n        break;\n    }\n  };\n\n  return (\n    <Select onValueChange={handleSelect} value={blockType}>\n      <SelectTrigger className=\"w-40\">\n        <SelectValue placeholder=\"Block Type\" />\n      </SelectTrigger>\n      <SelectContent>\n        {Object.keys(blockTypeToBlockName).map((type) => (\n          <SelectItem key={type} value={type}>\n            {blockTypeToBlockName[type as keyof typeof blockTypeToBlockName]}\n          </SelectItem>\n        ))}\n      </SelectContent>\n    </Select>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAyBA,SAAwB,kBAAkB,EACxC,aACyB;CACzB,MAAM,CAAC,gFAAqC;CAC5C,MAAM,EAAE,uBAAuBA,0DAAiB;CAEhD,MAAM,gBAAgB,UAAkB;AACtC,UAAQ,OAAR;GACE,KAAK;AACH,0DAAiB,QAAQ,WAAW,mBAAmB;AACvD;GACF,KAAK;AACH,yDAAgB,QAAQ,WAAW,mBAAmB;AACtD;GACF,KAAK;AACH,oDAAW,QAAQ,WAAW,mBAAmB;AACjD;GACF,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;AACH,uDAAc,QAAQ,WAAW,OAAO,mBAAmB;AAC3D;GACF,KAAK;AACH,2DAAkB,QAAQ,WAAW,mBAAmB;AACxD;GACF,KAAK;AACH,yDAAgB,QAAQ,mBAAmB;AAC3C;GACF,KAAK;AACH,qDAAY,QAAQ,WAAW,mBAAmB;AAClD;;;AAIN,QACE,4CAACC;EAAO,eAAe;EAAc,OAAO;aAC1C,2CAACC;GAAc,WAAU;aACvB,2CAACC,iDAAY,aAAY,eAAe;IAC1B,EAChB,2CAACC,6DACE,OAAO,KAAKC,8DAAqB,CAAC,KAAK,SACtC,2CAACC;GAAsB,OAAO;aAC3BD,8DAAqB;KADP,KAEJ,CACb,GACY;GACT;;;uDAxDS;+DACmD"}

package/dist/cjs/components/editor/BlockTypeDropdown.d.cts

@@ -0,0 +1,11 @@
+import { blockTypeToBlockName } from "./ToolbarContext.cjs";
+
+//#region src/components/editor/BlockTypeDropdown.d.ts
+interface BlockTypeDropdownProps {
+  blockType: keyof typeof blockTypeToBlockName;
+}
+declare function BlockTypeDropdown({
+  blockType
+}: BlockTypeDropdownProps): any;
+export = BlockTypeDropdown;
+//# sourceMappingURL=BlockTypeDropdown.d.cts.map

package/dist/cjs/components/editor/Editor.cjs

@@ -0,0 +1,122 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_components_editor_Preview = require('./Preview.cjs');
+const require_components_editor_ToolbarContext = require('./ToolbarContext.cjs');
+const require_components_editor_ToolbarPlugin = require('./ToolbarPlugin.cjs');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let _lexical_code = require("@lexical/code");
+let _lexical_link = require("@lexical/link");
+let _lexical_list = require("@lexical/list");
+let _lexical_markdown = require("@lexical/markdown");
+let _lexical_react_LexicalCheckListPlugin = require("@lexical/react/LexicalCheckListPlugin");
+let _lexical_react_LexicalComposer = require("@lexical/react/LexicalComposer");
+let _lexical_react_LexicalContentEditable = require("@lexical/react/LexicalContentEditable");
+let _lexical_react_LexicalErrorBoundary = require("@lexical/react/LexicalErrorBoundary");
+let _lexical_react_LexicalHistoryPlugin = require("@lexical/react/LexicalHistoryPlugin");
+let _lexical_react_LexicalHorizontalRuleNode = require("@lexical/react/LexicalHorizontalRuleNode");
+let _lexical_react_LexicalLinkPlugin = require("@lexical/react/LexicalLinkPlugin");
+let _lexical_react_LexicalListPlugin = require("@lexical/react/LexicalListPlugin");
+let _lexical_react_LexicalMarkdownShortcutPlugin = require("@lexical/react/LexicalMarkdownShortcutPlugin");
+let _lexical_react_LexicalOnChangePlugin = require("@lexical/react/LexicalOnChangePlugin");
+let _lexical_react_LexicalRichTextPlugin = require("@lexical/react/LexicalRichTextPlugin");
+let _lexical_rich_text = require("@lexical/rich-text");
+let lexical = require("lexical");
+
+//#region src/components/editor/Editor.tsx
+var Editor;
+var init_Editor = require_rolldown_runtime.__esmMin((() => {
+	require_components_editor_Preview.init_Preview();
+	require_components_editor_ToolbarContext.init_ToolbarContext();
+	require_components_editor_ToolbarPlugin.init_ToolbarPlugin();
+	Editor = (0, react.forwardRef)(({ enablePreview, onChange, placeholder, toolbarOptions, value }, ref) => {
+		const [isPreview, setIsPreview] = (0, react.useState)(false);
+		const handleChange = react.default.useCallback((editorState) => {
+			const content = editorState.read(() => (0, lexical.$getRoot)().getTextContent());
+			onChange?.(content);
+		}, [onChange]);
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "bg-modal-input text-foreground rounded-md border",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lexical_react_LexicalComposer.LexicalComposer, {
+				initialConfig: react.default.useMemo(() => ({
+					editable: !isPreview,
+					editorState: () => {
+						(0, _lexical_markdown.$convertFromMarkdownString)(value ?? "", _lexical_markdown.TRANSFORMERS);
+					},
+					namespace: "MarkdownEditor",
+					nodes: [
+						_lexical_react_LexicalHorizontalRuleNode.HorizontalRuleNode,
+						_lexical_code.CodeNode,
+						_lexical_link.LinkNode,
+						_lexical_list.ListNode,
+						_lexical_list.ListItemNode,
+						_lexical_rich_text.HeadingNode,
+						_lexical_rich_text.QuoteNode
+					],
+					onError: (error) => {
+						throw error;
+					},
+					theme: {
+						heading: {
+							h1: "text-2xl font-bold",
+							h2: "text-xl font-bold",
+							h3: "text-lg font-semibold",
+							h4: "text-base font-semibold",
+							h5: "text-sm font-semibold",
+							h6: "text-xs font-semibold"
+						},
+						link: "cursor-pointer",
+						root: "p-3 border rounded-md bg-modal-input text-foreground",
+						text: {
+							bold: "font-semibold",
+							italic: "italic",
+							underline: "underline"
+						}
+					}
+				}), [isPreview, value]),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_editor_ToolbarContext.ToolbarProvider, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "border-border flex items-center justify-between gap-1 border-b p-1",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_editor_ToolbarPlugin.ToolbarPlugin, {
+						isPreview,
+						setIsPreview,
+						toolbarOptions
+					})
+				}), !isPreview ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lexical_react_LexicalRichTextPlugin.RichTextPlugin, {
+						contentEditable: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lexical_react_LexicalContentEditable.ContentEditable, {
+							"aria-placeholder": placeholder ?? "",
+							className: "text-foreground min-h-[150px] w-full resize-none bg-transparent outline-none",
+							placeholder: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: "text-foreground/50",
+								children: placeholder
+							})
+						}),
+						ErrorBoundary: _lexical_react_LexicalErrorBoundary.LexicalErrorBoundary
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lexical_react_LexicalHistoryPlugin.HistoryPlugin, {}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lexical_react_LexicalListPlugin.ListPlugin, {}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lexical_react_LexicalCheckListPlugin.CheckListPlugin, {}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lexical_react_LexicalLinkPlugin.LinkPlugin, {}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lexical_react_LexicalMarkdownShortcutPlugin.MarkdownShortcutPlugin, { transformers: _lexical_markdown.TRANSFORMERS }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_lexical_react_LexicalOnChangePlugin.OnChangePlugin, {
+						ignoreHistoryMergeTagChange: true,
+						ignoreSelectionChange: true,
+						onChange: handleChange
+					})
+				] }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_editor_Preview.Preview, {})] })
+			})
+		});
+	});
+	Editor.displayName = "Markdown";
+}));
+
+//#endregion
+init_Editor();
+exports.Editor = Editor;
+Object.defineProperty(exports, 'init_Editor', {
+  enumerable: true,
+  get: function () {
+    return init_Editor;
+  }
+});
+//# sourceMappingURL=Editor.cjs.map

package/dist/cjs/components/editor/Editor.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Editor.cjs","names":["React","LexicalComposer","TRANSFORMERS","HorizontalRuleNode","CodeNode","LinkNode","ListNode","ListItemNode","HeadingNode","QuoteNode","ToolbarProvider","ToolbarPlugin","RichTextPlugin","ContentEditable","LexicalErrorBoundary","HistoryPlugin","ListPlugin","CheckListPlugin","LinkPlugin","MarkdownShortcutPlugin","OnChangePlugin","Preview"],"sources":["../../../../src/components/editor/Editor.tsx"],"sourcesContent":["import { CodeNode } from \"@lexical/code\";\nimport { LinkNode } from \"@lexical/link\";\nimport { ListItemNode, ListNode } from \"@lexical/list\";\nimport { $convertFromMarkdownString, TRANSFORMERS } from \"@lexical/markdown\";\nimport { CheckListPlugin } from \"@lexical/react/LexicalCheckListPlugin\";\nimport {\n  InitialConfigType,\n  LexicalComposer,\n} from \"@lexical/react/LexicalComposer\";\nimport { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\nimport { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\nimport { HistoryPlugin } from \"@lexical/react/LexicalHistoryPlugin\";\nimport { HorizontalRuleNode } from \"@lexical/react/LexicalHorizontalRuleNode\";\nimport { LinkPlugin } from \"@lexical/react/LexicalLinkPlugin\";\nimport { ListPlugin } from \"@lexical/react/LexicalListPlugin\";\nimport { MarkdownShortcutPlugin } from \"@lexical/react/LexicalMarkdownShortcutPlugin\";\nimport { OnChangePlugin } from \"@lexical/react/LexicalOnChangePlugin\";\nimport { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\nimport { HeadingNode, QuoteNode } from \"@lexical/rich-text\";\nimport { $getRoot } from \"lexical\";\nimport React, { forwardRef, useState } from \"react\";\n\nimport { Preview } from \"./Preview\";\nimport { ToolbarProvider } from \"./ToolbarContext\";\nimport { ToolbarPlugin } from \"./ToolbarPlugin\";\n\nexport interface EditorProps {\n  enablePreview?: boolean;\n  onChange?: (value: string) => void;\n  placeholder?: string;\n  required?: boolean;\n  toolbarOptions?: ToolbarOption[];\n  value?: string;\n}\n\nexport type ToolbarOption =\n  | \"blockTypes\"\n  | \"bold\"\n  | \"clear\"\n  | \"italic\"\n  | \"redo\"\n  | \"strikethrough\"\n  | \"subscript\"\n  | \"superscript\"\n  | \"underline\"\n  | \"undo\";\n\nexport const Editor = forwardRef<HTMLDivElement, EditorProps>(\n  ({ enablePreview, onChange, placeholder, toolbarOptions, value }, ref) => {\n    const [isPreview, setIsPreview] = useState(false);\n\n    const handleChange = React.useCallback(\n      (editorState) => {\n        const content = editorState.read(() => $getRoot().getTextContent());\n        onChange?.(content);\n      },\n      [onChange],\n    );\n\n    const initialConfig = React.useMemo(\n      () =>\n        ({\n          editable: !isPreview,\n          editorState: () => {\n            $convertFromMarkdownString(value ?? \"\", TRANSFORMERS);\n          },\n          namespace: \"MarkdownEditor\",\n          nodes: [\n            HorizontalRuleNode,\n            CodeNode,\n            LinkNode,\n            ListNode,\n            ListItemNode,\n            HeadingNode,\n            QuoteNode,\n          ],\n          onError: (error: Error) => {\n            throw error;\n          },\n          theme: {\n            heading: {\n              h1: \"text-2xl font-bold\",\n              h2: \"text-xl font-bold\",\n              h3: \"text-lg font-semibold\",\n              h4: \"text-base font-semibold\",\n              h5: \"text-sm font-semibold\",\n              h6: \"text-xs font-semibold\",\n            },\n            link: \"cursor-pointer\",\n            root: \"p-3 border rounded-md bg-modal-input text-foreground\",\n            text: {\n              bold: \"font-semibold\",\n              italic: \"italic\",\n              underline: \"underline\",\n            },\n          },\n        }) satisfies InitialConfigType,\n      [isPreview, value],\n    );\n\n    return (\n      <div className=\"bg-modal-input text-foreground rounded-md border\">\n        <LexicalComposer initialConfig={initialConfig}>\n          <ToolbarProvider>\n            <div className=\"border-border flex items-center justify-between gap-1 border-b p-1\">\n              <ToolbarPlugin\n                isPreview={isPreview}\n                setIsPreview={setIsPreview}\n                toolbarOptions={toolbarOptions}\n              />\n            </div>\n            {!isPreview ? (\n              <>\n                <RichTextPlugin\n                  contentEditable={\n                    <ContentEditable\n                      aria-placeholder={placeholder ?? \"\"}\n                      className=\"text-foreground min-h-[150px] w-full resize-none bg-transparent outline-none\"\n                      placeholder={\n                        <div className=\"text-foreground/50\">{placeholder}</div>\n                      }\n                    />\n                  }\n                  ErrorBoundary={LexicalErrorBoundary}\n                />\n                <HistoryPlugin />\n                <ListPlugin />\n                <CheckListPlugin />\n                <LinkPlugin />\n                <MarkdownShortcutPlugin transformers={TRANSFORMERS} />\n                <OnChangePlugin\n                  ignoreHistoryMergeTagChange={true}\n                  ignoreSelectionChange={true}\n                  onChange={handleChange}\n                />\n              </>\n            ) : (\n              <Preview />\n            )}\n          </ToolbarProvider>\n        </LexicalComposer>\n      </div>\n    );\n  },\n);\nEditor.displayName = \"Markdown\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;iDAsBoC;+DACe;6DACH;CAuBnC,gCACV,EAAE,eAAe,UAAU,aAAa,gBAAgB,SAAS,QAAQ;EACxE,MAAM,CAAC,WAAW,oCAAyB,MAAM;EAEjD,MAAM,eAAeA,cAAM,aACxB,gBAAgB;GACf,MAAM,UAAU,YAAY,kCAAqB,CAAC,gBAAgB,CAAC;AACnE,cAAW,QAAQ;KAErB,CAAC,SAAS,CACX;AA2CD,SACE,2CAAC;GAAI,WAAU;aACb,2CAACC;IAAgB,eA3CCD,cAAM,eAEvB;KACC,UAAU,CAAC;KACX,mBAAmB;AACjB,wDAA2B,SAAS,IAAIE,+BAAa;;KAEvD,WAAW;KACX,OAAO;MACLC;MACAC;MACAC;MACAC;MACAC;MACAC;MACAC;MACD;KACD,UAAU,UAAiB;AACzB,YAAM;;KAER,OAAO;MACL,SAAS;OACP,IAAI;OACJ,IAAI;OACJ,IAAI;OACJ,IAAI;OACJ,IAAI;OACJ,IAAI;OACL;MACD,MAAM;MACN,MAAM;MACN,MAAM;OACJ,MAAM;OACN,QAAQ;OACR,WAAW;OACZ;MACF;KACF,GACH,CAAC,WAAW,MAAM,CACnB;cAKK,4CAACC,uEACC,2CAAC;KAAI,WAAU;eACb,2CAACC;MACY;MACG;MACE;OAChB;MACE,EACL,CAAC,YACA;KACE,2CAACC;MACC,iBACE,2CAACC;OACC,oBAAkB,eAAe;OACjC,WAAU;OACV,aACE,2CAAC;QAAI,WAAU;kBAAsB;SAAkB;QAEzD;MAEJ,eAAeC;OACf;KACF,2CAACC,sDAAgB;KACjB,2CAACC,gDAAa;KACd,2CAACC,0DAAkB;KACnB,2CAACC,gDAAa;KACd,2CAACC,uEAAuB,cAAcjB,iCAAgB;KACtD,2CAACkB;MACC,6BAA6B;MAC7B,uBAAuB;MACvB,UAAU;OACV;QACD,GAEH,2CAACC,8CAAU,IAEG;KACF;IACd;GAGX;AACD,QAAO,cAAc"}

package/dist/cjs/components/editor/Editor.d.cts

@@ -0,0 +1,14 @@
+//#region src/components/editor/Editor.d.ts
+interface EditorProps {
+  enablePreview?: boolean;
+  onChange?: (value: string) => void;
+  placeholder?: string;
+  required?: boolean;
+  toolbarOptions?: ToolbarOption[];
+  value?: string;
+}
+type ToolbarOption = "blockTypes" | "bold" | "clear" | "italic" | "redo" | "strikethrough" | "subscript" | "superscript" | "underline" | "undo";
+declare const Editor: any;
+//#endregion
+export { Editor, EditorProps, ToolbarOption };
+//# sourceMappingURL=Editor.d.cts.map

package/dist/cjs/components/editor/Preview.cjs

@@ -0,0 +1,31 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let _lexical_html = require("@lexical/html");
+let _lexical_react_LexicalComposerContext = require("@lexical/react/LexicalComposerContext");
+let dompurify = require("dompurify");
+dompurify = require_rolldown_runtime.__toESM(dompurify);
+
+//#region src/components/editor/Preview.tsx
+var Preview;
+var init_Preview = require_rolldown_runtime.__esmMin((() => {
+	Preview = function() {
+		const [editor] = (0, _lexical_react_LexicalComposerContext.useLexicalComposerContext)();
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "text-foreground min-h-[150px] whitespace-pre-wrap p-4",
+			dangerouslySetInnerHTML: { __html: editor.read(() => dompurify.default.sanitize((0, _lexical_html.$generateHtmlFromNodes)(editor))) }
+		});
+	};
+}));
+
+//#endregion
+init_Preview();
+exports.Preview = Preview;
+Object.defineProperty(exports, 'init_Preview', {
+  enumerable: true,
+  get: function () {
+    return init_Preview;
+  }
+});
+//# sourceMappingURL=Preview.cjs.map

package/dist/cjs/components/editor/Preview.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Preview.cjs","names":["DOMPurify"],"sources":["../../../../src/components/editor/Preview.tsx"],"sourcesContent":["import { $generateHtmlFromNodes } from \"@lexical/html\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport DOMPurify from \"dompurify\";\nimport React from \"react\";\n\nexport const Preview = function () {\n  const [editor] = useLexicalComposerContext();\n\n  return (\n    <div\n      className=\"text-foreground min-h-[150px] whitespace-pre-wrap p-4\"\n      dangerouslySetInnerHTML={{\n        __html: editor.read(() =>\n          DOMPurify.sanitize($generateHtmlFromNodes(editor)),\n        ),\n      }}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;;;CAKa,UAAU,WAAY;EACjC,MAAM,CAAC,gFAAqC;AAE5C,SACE,2CAAC;GACC,WAAU;GACV,yBAAyB,EACvB,QAAQ,OAAO,WACbA,kBAAU,mDAAgC,OAAO,CAAC,CACnD,EACF;IACD"}

package/dist/cjs/components/editor/Preview.d.cts

@@ -0,0 +1,5 @@
+//#region src/components/editor/Preview.d.ts
+declare const Preview: () => any;
+//#endregion
+export { Preview };
+//# sourceMappingURL=Preview.d.cts.map

package/dist/cjs/components/editor/ToolbarContext.cjs

@@ -0,0 +1,68 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/editor/ToolbarContext.tsx
+var blockTypeToBlockName, Context, ToolbarProvider, useToolbarState;
+var init_ToolbarContext = require_rolldown_runtime.__esmMin((() => {
+	blockTypeToBlockName = {
+		bullet: "Bulleted List",
+		check: "Check List",
+		code: "Code Block",
+		h1: "Heading 1",
+		h2: "Heading 2",
+		h3: "Heading 3",
+		h4: "Heading 4",
+		h5: "Heading 5",
+		h6: "Heading 6",
+		number: "Numbered List",
+		paragraph: "Normal",
+		quote: "Quote"
+	};
+	Context = (0, react.createContext)(void 0);
+	ToolbarProvider = ({ children }) => {
+		const [toolbarState, setToolbarState] = (0, react.useState)({
+			blockType: "paragraph",
+			isBold: false,
+			isClear: false,
+			isItalic: false,
+			isStrikethrough: false,
+			isSubscript: false,
+			isSuperscript: false,
+			isUnderline: false
+		});
+		const updateToolbarState = (0, react.useCallback)((key, value) => {
+			setToolbarState((prev) => ({
+				...prev,
+				[key]: value
+			}));
+		}, []);
+		const contextValue = (0, react.useMemo)(() => ({
+			toolbarState,
+			updateToolbarState
+		}), [toolbarState, updateToolbarState]);
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Context.Provider, {
+			value: contextValue,
+			children
+		});
+	};
+	useToolbarState = () => {
+		const context = (0, react.useContext)(Context);
+		if (context === void 0) throw new Error("useToolbarState must be used within a ToolbarProvider");
+		return context;
+	};
+}));
+
+//#endregion
+init_ToolbarContext();
+exports.ToolbarProvider = ToolbarProvider;
+exports.blockTypeToBlockName = blockTypeToBlockName;
+Object.defineProperty(exports, 'init_ToolbarContext', {
+  enumerable: true,
+  get: function () {
+    return init_ToolbarContext;
+  }
+});
+exports.useToolbarState = useToolbarState;
+//# sourceMappingURL=ToolbarContext.cjs.map

package/dist/cjs/components/editor/ToolbarContext.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarContext.cjs","names":[],"sources":["../../../../src/components/editor/ToolbarContext.tsx"],"sourcesContent":["import React, {\n  createContext,\n  ReactNode,\n  useCallback,\n  useContext,\n  useMemo,\n  useState,\n} from \"react\";\n\nexport const blockTypeToBlockName = {\n  bullet: \"Bulleted List\",\n  check: \"Check List\",\n  code: \"Code Block\",\n  h1: \"Heading 1\",\n  h2: \"Heading 2\",\n  h3: \"Heading 3\",\n  h4: \"Heading 4\",\n  h5: \"Heading 5\",\n  h6: \"Heading 6\",\n  number: \"Numbered List\",\n  paragraph: \"Normal\",\n  quote: \"Quote\",\n};\n\nexport type BlockType = \"check\" | \"code\" | keyof typeof blockTypeToBlockName;\n\nexport interface ToolbarState {\n  blockType: BlockType;\n  isBold: boolean;\n  isClear: boolean;\n  isItalic: boolean;\n  isStrikethrough: boolean;\n  isSubscript: boolean;\n  isSuperscript: boolean;\n  isUnderline: boolean;\n}\n\nexport type ToolbarStateKey = keyof ToolbarState;\n\nexport type ToolbarStateValue<Key extends ToolbarStateKey> = ToolbarState[Key];\n\ninterface ContextShape {\n  toolbarState: ToolbarState;\n  updateToolbarState: <Key extends ToolbarStateKey>(\n    key: Key,\n    value: ToolbarStateValue<Key>,\n  ) => void;\n}\n\nconst Context = createContext<ContextShape | undefined>(undefined);\n\nexport const ToolbarProvider = ({ children }: { children: ReactNode }) => {\n  const [toolbarState, setToolbarState] = useState<ToolbarState>({\n    blockType: \"paragraph\",\n    isBold: false,\n    isClear: false,\n    isItalic: false,\n    isStrikethrough: false,\n    isSubscript: false,\n    isSuperscript: false,\n    isUnderline: false,\n  });\n\n  const updateToolbarState = useCallback(\n    <Key extends ToolbarStateKey>(key: Key, value: ToolbarStateValue<Key>) => {\n      setToolbarState((prev) => ({\n        ...prev,\n        [key]: value,\n      }));\n    },\n    [],\n  );\n\n  const contextValue = useMemo(\n    () => ({\n      toolbarState,\n      updateToolbarState,\n    }),\n    [toolbarState, updateToolbarState],\n  );\n\n  return <Context.Provider value={contextValue}>{children}</Context.Provider>;\n};\n\nexport const useToolbarState = () => {\n  const context = useContext(Context);\n\n  if (context === undefined) {\n    throw new Error(\"useToolbarState must be used within a ToolbarProvider\");\n  }\n\n  return context;\n};\n"],"mappings":";;;;;;;;CASa,uBAAuB;EAClC,QAAQ;EACR,OAAO;EACP,MAAM;EACN,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,QAAQ;EACR,WAAW;EACX,OAAO;EACR;CA2BK,mCAAkD,OAAU;CAErD,mBAAmB,EAAE,eAAwC;EACxE,MAAM,CAAC,cAAc,uCAA0C;GAC7D,WAAW;GACX,QAAQ;GACR,SAAS;GACT,UAAU;GACV,iBAAiB;GACjB,aAAa;GACb,eAAe;GACf,aAAa;GACd,CAAC;EAEF,MAAM,6CAC0B,KAAU,UAAkC;AACxE,oBAAiB,UAAU;IACzB,GAAG;KACF,MAAM;IACR,EAAE;KAEL,EAAE,CACH;EAED,MAAM,yCACG;GACL;GACA;GACD,GACD,CAAC,cAAc,mBAAmB,CACnC;AAED,SAAO,2CAAC,QAAQ;GAAS,OAAO;GAAe;IAA4B;;CAGhE,wBAAwB;EACnC,MAAM,gCAAqB,QAAQ;AAEnC,MAAI,YAAY,OACd,OAAM,IAAI,MAAM,wDAAwD;AAG1E,SAAO"}

package/dist/cjs/components/editor/ToolbarContext.d.cts

@@ -0,0 +1,39 @@
+import { ReactNode } from "react";
+
+//#region src/components/editor/ToolbarContext.d.ts
+declare const blockTypeToBlockName: {
+  bullet: string;
+  check: string;
+  code: string;
+  h1: string;
+  h2: string;
+  h3: string;
+  h4: string;
+  h5: string;
+  h6: string;
+  number: string;
+  paragraph: string;
+  quote: string;
+};
+type BlockType = "check" | "code" | keyof typeof blockTypeToBlockName;
+interface ToolbarState {
+  blockType: BlockType;
+  isBold: boolean;
+  isClear: boolean;
+  isItalic: boolean;
+  isStrikethrough: boolean;
+  isSubscript: boolean;
+  isSuperscript: boolean;
+  isUnderline: boolean;
+}
+type ToolbarStateKey = keyof ToolbarState;
+type ToolbarStateValue<Key extends ToolbarStateKey> = ToolbarState[Key];
+declare const ToolbarProvider: ({
+  children
+}: {
+  children: ReactNode;
+}) => any;
+declare const useToolbarState: () => any;
+//#endregion
+export { BlockType, ToolbarProvider, ToolbarState, ToolbarStateKey, ToolbarStateValue, blockTypeToBlockName, useToolbarState };
+//# sourceMappingURL=ToolbarContext.d.cts.map