@melv1c/ui-kit 0.0.0 → 1.0.1

package/README.md

@@ -4,7 +4,7 @@ A React component library built with Tailwind CSS and TypeScript.
 
 ## Documentation
 
-For detailed usage instructions, installation guides, and component documentation, visit the [online documentation](https://your-storybook-url.com).
+For detailed usage instructions, installation guides, and component documentation, visit the [online documentation](https://ui-kit.melvyn.be).
 
 ## Concept
 

package/dist/base.css

@@ -46,4 +46,9 @@
   body {
     @apply bg-background text-foreground;
   }
+
+  button:not(:disabled),
+  [role="button"]:not(:disabled) {
+    cursor: pointer;
+  }
 }

package/dist/code-editors/index.cjs

@@ -0,0 +1,200 @@
+'use strict';
+
+var chunkQ4GFV3J3_cjs = require('../chunk-Q4GFV3J3.cjs');
+var chunkI7WHASOO_cjs = require('../chunk-I7WHASOO.cjs');
+require('../chunk-Q7SFCCGT.cjs');
+var react$1 = require('@monaco-editor/react');
+var react = require('react');
+var classVarianceAuthority = require('class-variance-authority');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/components/optionals/code-editors/qualifio-themes.ts
+async function defineQualifioThemes(monaco) {
+  monaco.editor.defineTheme("qualifio", {
+    base: "vs",
+    inherit: true,
+    rules: [],
+    colors: {
+      "editor.foreground": "#666666",
+      "editor.background": "#f8fafb",
+      "editor.lineHighlightBackground": "#f8fafb",
+      "editorCursor.foreground": "#666666",
+      "editorLineNumber.foreground": "#D8D8D8",
+      "editorLineNumber.activeForeground": "#D8D8D8",
+      "editor.selectionBackground": "#dff5fb",
+      "editor.selectionHighlightBackground": "#dff5fb",
+      "editor.wordHighlightBackground": "#dff5fb",
+      "editor.wordHighlightStrongBackground": "#dff5fb",
+      "editor.findMatchBackground": "#FFF7E2",
+      "editor.findMatchHighlightBackground": "#FFF7E2",
+      "editorBracketMatch.background": "#f2f2f2",
+      "editorBracketMatch.border": "#D8D8D8",
+      "editorIndentGuide.background": "#D8D8D8",
+      "editorIndentGuide.activeBackground": "#666666",
+      "editorWidget.background": "#FFFFFF",
+      "editorWidget.border": "#D8D8D8",
+      "editorSuggestWidget.background": "#FFFFFF",
+      "editorSuggestWidget.border": "#D8D8D8",
+      "editorSuggestWidget.selectedBackground": "#dff5fb",
+      "editorHoverWidget.background": "#FFFFFF",
+      "editorHoverWidget.border": "#D8D8D8"
+    }
+  });
+}
+var codeEditorVariants = classVarianceAuthority.cva(
+  "relative overflow-hidden rounded-md border transition-[color,box-shadow] outline-none focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]",
+  {
+    variants: {
+      variant: {
+        default: "border-input bg-transparent dark:bg-input/30",
+        ghost: "border-transparent bg-transparent",
+        card: "border-border bg-card shadow-sm"
+      },
+      size: {
+        default: "h-[300px]",
+        sm: "h-[150px]",
+        lg: "h-[500px]"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function LoadingFallback() {
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkQ4GFV3J3_cjs.Skeleton, { className: "h-full w-full" });
+}
+function CodeDiffEditor({
+  original,
+  modified,
+  language,
+  theme = "qualifio",
+  readOnly = false,
+  disabled = false,
+  className,
+  variant,
+  size,
+  onMount,
+  options,
+  ...props
+}) {
+  const editorOptions = react.useMemo(
+    () => ({
+      readOnly: readOnly || disabled,
+      fontSize: 14,
+      fontFamily: "'Menlo', 'Monaco', Consolas, monospace",
+      scrollBeyondLastLine: false,
+      automaticLayout: true,
+      padding: { top: 12, bottom: 12 },
+      renderSideBySide: true,
+      enableSplitViewResizing: true,
+      ...options
+    }),
+    [readOnly, disabled, options]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "code-diff-editor",
+      className: chunkI7WHASOO_cjs.cn(
+        codeEditorVariants({ variant, size }),
+        disabled && "cursor-not-allowed opacity-50",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        react$1.DiffEditor,
+        {
+          language,
+          theme,
+          original,
+          modified,
+          beforeMount: (monaco) => {
+            defineQualifioThemes(monaco).catch((error) => {
+              console.error("Failed to define Qualifio themes:", error);
+            });
+          },
+          onMount,
+          options: editorOptions,
+          loading: /* @__PURE__ */ jsxRuntime.jsx(LoadingFallback, {})
+        }
+      )
+    }
+  );
+}
+function LoadingFallback2() {
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkQ4GFV3J3_cjs.Skeleton, { className: "h-full w-full" });
+}
+function CodeEditor({
+  value,
+  defaultValue,
+  language,
+  theme = "qualifio",
+  readOnly = false,
+  disabled = false,
+  lineNumbers = true,
+  wordWrap = false,
+  minimap = false,
+  className,
+  variant,
+  size,
+  onChange,
+  onMount,
+  onValidate,
+  options,
+  ...props
+}) {
+  const editorOptions = react.useMemo(
+    () => ({
+      readOnly: readOnly || disabled,
+      lineNumbers: lineNumbers ? "on" : "off",
+      wordWrap: wordWrap ? "on" : "off",
+      minimap: { enabled: minimap },
+      fontSize: 14,
+      fontFamily: "'Menlo', 'Monaco', Consolas, monospace",
+      scrollBeyondLastLine: false,
+      automaticLayout: true,
+      padding: { top: 12, bottom: 12 },
+      bracketPairColorization: { enabled: true },
+      ...options
+    }),
+    [readOnly, disabled, lineNumbers, wordWrap, minimap, options]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "code-editor",
+      className: chunkI7WHASOO_cjs.cn(
+        codeEditorVariants({ variant, size }),
+        disabled && "cursor-not-allowed opacity-50",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        react$1.Editor,
+        {
+          language,
+          theme,
+          value,
+          defaultValue,
+          onChange,
+          beforeMount: (monaco) => {
+            defineQualifioThemes(monaco).catch((error) => {
+              console.error("Failed to define Qualifio themes:", error);
+            });
+          },
+          onMount,
+          onValidate,
+          options: editorOptions,
+          loading: /* @__PURE__ */ jsxRuntime.jsx(LoadingFallback2, {})
+        }
+      )
+    }
+  );
+}
+
+exports.CodeDiffEditor = CodeDiffEditor;
+exports.CodeEditor = CodeEditor;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/code-editors/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/optionals/code-editors/qualifio-themes.ts","../../src/components/optionals/code-editors/variants.ts","../../src/components/optionals/code-editors/code-diff-editor.tsx","../../src/components/optionals/code-editors/code-editor.tsx"],"names":["cva","jsx","Skeleton","useMemo","cn","DiffEditor","LoadingFallback","Editor"],"mappings":"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","file":"index.cjs","sourcesContent":["import type { Monaco } from \"@monaco-editor/react\";\n\n/**\n * Defines the Qualifio theme for Monaco Editor\n * This function should be called once when Monaco is loaded\n */\nexport async function defineQualifioThemes(monaco: Monaco) {\n  monaco.editor.defineTheme(\"qualifio\", {\n    base: \"vs\",\n    inherit: true,\n    rules: [],\n    colors: {\n      \"editor.foreground\": \"#666666\",\n      \"editor.background\": \"#f8fafb\",\n      \"editor.lineHighlightBackground\": \"#f8fafb\",\n      \"editorCursor.foreground\": \"#666666\",\n      \"editorLineNumber.foreground\": \"#D8D8D8\",\n      \"editorLineNumber.activeForeground\": \"#D8D8D8\",\n      \"editor.selectionBackground\": \"#dff5fb\",\n      \"editor.selectionHighlightBackground\": \"#dff5fb\",\n      \"editor.wordHighlightBackground\": \"#dff5fb\",\n      \"editor.wordHighlightStrongBackground\": \"#dff5fb\",\n      \"editor.findMatchBackground\": \"#FFF7E2\",\n      \"editor.findMatchHighlightBackground\": \"#FFF7E2\",\n      \"editorBracketMatch.background\": \"#f2f2f2\",\n      \"editorBracketMatch.border\": \"#D8D8D8\",\n      \"editorIndentGuide.background\": \"#D8D8D8\",\n      \"editorIndentGuide.activeBackground\": \"#666666\",\n      \"editorWidget.background\": \"#FFFFFF\",\n      \"editorWidget.border\": \"#D8D8D8\",\n      \"editorSuggestWidget.background\": \"#FFFFFF\",\n      \"editorSuggestWidget.border\": \"#D8D8D8\",\n      \"editorSuggestWidget.selectedBackground\": \"#dff5fb\",\n      \"editorHoverWidget.background\": \"#FFFFFF\",\n      \"editorHoverWidget.border\": \"#D8D8D8\",\n    },\n  });\n}\n","import { cva } from \"class-variance-authority\";\n\nexport const codeEditorVariants = cva(\n  \"relative overflow-hidden rounded-md border transition-[color,box-shadow] outline-none focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]\",\n  {\n    variants: {\n      variant: {\n        default: \"border-input bg-transparent dark:bg-input/30\",\n        ghost: \"border-transparent bg-transparent\",\n        card: \"border-border bg-card shadow-sm\",\n      },\n      size: {\n        default: \"h-[300px]\",\n        sm: \"h-[150px]\",\n        lg: \"h-[500px]\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  },\n);\n","import { Skeleton } from \"@/components/base/skeleton\";\nimport { cn } from \"@/lib/utils\";\nimport {\n  DiffEditor,\n  type DiffEditorProps,\n  type Monaco,\n} from \"@monaco-editor/react\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport type { editor } from \"monaco-editor\";\nimport { type HTMLAttributes, useMemo } from \"react\";\nimport { defineQualifioThemes } from \"./qualifio-themes\";\nimport type { EditorTheme, SupportedLanguage } from \"./types\";\nimport { codeEditorVariants } from \"./variants\";\n\ninterface CodeDiffEditorProps\n  extends\n    VariantProps<typeof codeEditorVariants>,\n    Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  original?: string;\n  modified?: string;\n  language: SupportedLanguage;\n  theme?: EditorTheme;\n  readOnly?: boolean;\n  disabled?: boolean;\n  onMount?: (editor: editor.IStandaloneDiffEditor, monaco: Monaco) => void;\n  options?: editor.IDiffEditorConstructionOptions;\n}\n\nfunction LoadingFallback() {\n  return <Skeleton className=\"h-full w-full\" />;\n}\n\nfunction CodeDiffEditor({\n  original,\n  modified,\n  language,\n  theme = \"qualifio\",\n  readOnly = false,\n  disabled = false,\n  className,\n  variant,\n  size,\n  onMount,\n  options,\n  ...props\n}: CodeDiffEditorProps) {\n  const editorOptions = useMemo(\n    () => ({\n      readOnly: readOnly || disabled,\n      fontSize: 14,\n      fontFamily: \"'Menlo', 'Monaco', Consolas, monospace\",\n      scrollBeyondLastLine: false,\n      automaticLayout: true,\n      padding: { top: 12, bottom: 12 },\n      renderSideBySide: true,\n      enableSplitViewResizing: true,\n      ...options,\n    }),\n    [readOnly, disabled, options],\n  );\n\n  return (\n    <div\n      data-slot=\"code-diff-editor\"\n      className={cn(\n        codeEditorVariants({ variant, size }),\n        disabled && \"cursor-not-allowed opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      <DiffEditor\n        language={language}\n        theme={theme}\n        original={original}\n        modified={modified}\n        beforeMount={(monaco) => {\n          defineQualifioThemes(monaco).catch((error) => {\n            console.error(\"Failed to define Qualifio themes:\", error);\n          });\n        }}\n        onMount={onMount}\n        options={editorOptions}\n        loading={<LoadingFallback />}\n      />\n    </div>\n  );\n}\n\nexport { CodeDiffEditor, type DiffEditorProps };\n","import { Editor, type Monaco } from \"@monaco-editor/react\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport type { editor } from \"monaco-editor\";\nimport { type HTMLAttributes, useMemo } from \"react\";\nimport { Skeleton } from \"@/components/base/skeleton\";\nimport { cn } from \"@/lib/utils\";\nimport { defineQualifioThemes } from \"./qualifio-themes\";\nimport type { EditorTheme, SupportedLanguage } from \"./types\";\nimport { codeEditorVariants } from \"./variants\";\n\ninterface CodeEditorProps\n  extends\n    VariantProps<typeof codeEditorVariants>,\n    Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  value?: string;\n  defaultValue?: string;\n  language: SupportedLanguage;\n  theme?: EditorTheme;\n  readOnly?: boolean;\n  disabled?: boolean;\n  lineNumbers?: boolean;\n  wordWrap?: boolean;\n  minimap?: boolean;\n  onChange?: (value: string | undefined) => void;\n  onMount?: (editor: editor.IStandaloneCodeEditor, monaco: Monaco) => void;\n  onValidate?: (markers: editor.IMarker[]) => void;\n  options?: editor.IStandaloneEditorConstructionOptions;\n}\n\nfunction LoadingFallback() {\n  return <Skeleton className=\"h-full w-full\" />;\n}\n\nfunction CodeEditor({\n  value,\n  defaultValue,\n  language,\n  theme = \"qualifio\",\n  readOnly = false,\n  disabled = false,\n  lineNumbers = true,\n  wordWrap = false,\n  minimap = false,\n  className,\n  variant,\n  size,\n  onChange,\n  onMount,\n  onValidate,\n  options,\n  ...props\n}: CodeEditorProps) {\n  const editorOptions = useMemo(\n    () => ({\n      readOnly: readOnly || disabled,\n      lineNumbers: lineNumbers ? (\"on\" as const) : (\"off\" as const),\n      wordWrap: wordWrap ? (\"on\" as const) : (\"off\" as const),\n      minimap: { enabled: minimap },\n      fontSize: 14,\n      fontFamily: \"'Menlo', 'Monaco', Consolas, monospace\",\n      scrollBeyondLastLine: false,\n      automaticLayout: true,\n      padding: { top: 12, bottom: 12 },\n      bracketPairColorization: { enabled: true },\n      ...options,\n    }),\n    [readOnly, disabled, lineNumbers, wordWrap, minimap, options],\n  );\n\n  return (\n    <div\n      data-slot=\"code-editor\"\n      className={cn(\n        codeEditorVariants({ variant, size }),\n        disabled && \"cursor-not-allowed opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      <Editor\n        language={language}\n        theme={theme}\n        value={value}\n        defaultValue={defaultValue}\n        onChange={onChange}\n        beforeMount={(monaco) => {\n          defineQualifioThemes(monaco).catch((error) => {\n            console.error(\"Failed to define Qualifio themes:\", error);\n          });\n        }}\n        onMount={onMount}\n        onValidate={onValidate}\n        options={editorOptions}\n        loading={<LoadingFallback />}\n      />\n    </div>\n  );\n}\n\nexport { CodeEditor, type CodeEditorProps };\nexport type { EditorTheme, SupportedLanguage } from \"./types\";\n"]}

package/dist/code-editors/index.d.cts

@@ -0,0 +1,46 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Monaco } from '@monaco-editor/react';
+export { DiffEditorProps } from '@monaco-editor/react';
+import { VariantProps } from 'class-variance-authority';
+import { editor } from 'monaco-editor';
+import { HTMLAttributes } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+type SupportedLanguage = "javascript" | "typescript" | "json" | "html" | "css" | "markdown" | "python" | "sql" | "xml" | "yaml" | "plaintext";
+type EditorTheme = "light" | "vs-dark" | "qualifio";
+
+declare const codeEditorVariants: (props?: ({
+    variant?: "default" | "ghost" | "card" | null | undefined;
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+interface CodeDiffEditorProps extends VariantProps<typeof codeEditorVariants>, Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
+    original?: string;
+    modified?: string;
+    language: SupportedLanguage;
+    theme?: EditorTheme;
+    readOnly?: boolean;
+    disabled?: boolean;
+    onMount?: (editor: editor.IStandaloneDiffEditor, monaco: Monaco) => void;
+    options?: editor.IDiffEditorConstructionOptions;
+}
+declare function CodeDiffEditor({ original, modified, language, theme, readOnly, disabled, className, variant, size, onMount, options, ...props }: CodeDiffEditorProps): react_jsx_runtime.JSX.Element;
+
+interface CodeEditorProps extends VariantProps<typeof codeEditorVariants>, Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
+    value?: string;
+    defaultValue?: string;
+    language: SupportedLanguage;
+    theme?: EditorTheme;
+    readOnly?: boolean;
+    disabled?: boolean;
+    lineNumbers?: boolean;
+    wordWrap?: boolean;
+    minimap?: boolean;
+    onChange?: (value: string | undefined) => void;
+    onMount?: (editor: editor.IStandaloneCodeEditor, monaco: Monaco) => void;
+    onValidate?: (markers: editor.IMarker[]) => void;
+    options?: editor.IStandaloneEditorConstructionOptions;
+}
+declare function CodeEditor({ value, defaultValue, language, theme, readOnly, disabled, lineNumbers, wordWrap, minimap, className, variant, size, onChange, onMount, onValidate, options, ...props }: CodeEditorProps): react_jsx_runtime.JSX.Element;
+
+export { CodeDiffEditor, CodeEditor, type CodeEditorProps, type EditorTheme, type SupportedLanguage };

package/dist/code-editors/index.d.ts

@@ -0,0 +1,46 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Monaco } from '@monaco-editor/react';
+export { DiffEditorProps } from '@monaco-editor/react';
+import { VariantProps } from 'class-variance-authority';
+import { editor } from 'monaco-editor';
+import { HTMLAttributes } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+type SupportedLanguage = "javascript" | "typescript" | "json" | "html" | "css" | "markdown" | "python" | "sql" | "xml" | "yaml" | "plaintext";
+type EditorTheme = "light" | "vs-dark" | "qualifio";
+
+declare const codeEditorVariants: (props?: ({
+    variant?: "default" | "ghost" | "card" | null | undefined;
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+interface CodeDiffEditorProps extends VariantProps<typeof codeEditorVariants>, Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
+    original?: string;
+    modified?: string;
+    language: SupportedLanguage;
+    theme?: EditorTheme;
+    readOnly?: boolean;
+    disabled?: boolean;
+    onMount?: (editor: editor.IStandaloneDiffEditor, monaco: Monaco) => void;
+    options?: editor.IDiffEditorConstructionOptions;
+}
+declare function CodeDiffEditor({ original, modified, language, theme, readOnly, disabled, className, variant, size, onMount, options, ...props }: CodeDiffEditorProps): react_jsx_runtime.JSX.Element;
+
+interface CodeEditorProps extends VariantProps<typeof codeEditorVariants>, Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
+    value?: string;
+    defaultValue?: string;
+    language: SupportedLanguage;
+    theme?: EditorTheme;
+    readOnly?: boolean;
+    disabled?: boolean;
+    lineNumbers?: boolean;
+    wordWrap?: boolean;
+    minimap?: boolean;
+    onChange?: (value: string | undefined) => void;
+    onMount?: (editor: editor.IStandaloneCodeEditor, monaco: Monaco) => void;
+    onValidate?: (markers: editor.IMarker[]) => void;
+    options?: editor.IStandaloneEditorConstructionOptions;
+}
+declare function CodeEditor({ value, defaultValue, language, theme, readOnly, disabled, lineNumbers, wordWrap, minimap, className, variant, size, onChange, onMount, onValidate, options, ...props }: CodeEditorProps): react_jsx_runtime.JSX.Element;
+
+export { CodeDiffEditor, CodeEditor, type CodeEditorProps, type EditorTheme, type SupportedLanguage };

package/dist/code-editors/index.js

@@ -0,0 +1,197 @@
+import { Skeleton } from '../chunk-PYHBC3IQ.js';
+import { cn } from '../chunk-WZ2GOU2J.js';
+import '../chunk-PZ5AY32C.js';
+import { DiffEditor, Editor } from '@monaco-editor/react';
+import { useMemo } from 'react';
+import { cva } from 'class-variance-authority';
+import { jsx } from 'react/jsx-runtime';
+
+// src/components/optionals/code-editors/qualifio-themes.ts
+async function defineQualifioThemes(monaco) {
+  monaco.editor.defineTheme("qualifio", {
+    base: "vs",
+    inherit: true,
+    rules: [],
+    colors: {
+      "editor.foreground": "#666666",
+      "editor.background": "#f8fafb",
+      "editor.lineHighlightBackground": "#f8fafb",
+      "editorCursor.foreground": "#666666",
+      "editorLineNumber.foreground": "#D8D8D8",
+      "editorLineNumber.activeForeground": "#D8D8D8",
+      "editor.selectionBackground": "#dff5fb",
+      "editor.selectionHighlightBackground": "#dff5fb",
+      "editor.wordHighlightBackground": "#dff5fb",
+      "editor.wordHighlightStrongBackground": "#dff5fb",
+      "editor.findMatchBackground": "#FFF7E2",
+      "editor.findMatchHighlightBackground": "#FFF7E2",
+      "editorBracketMatch.background": "#f2f2f2",
+      "editorBracketMatch.border": "#D8D8D8",
+      "editorIndentGuide.background": "#D8D8D8",
+      "editorIndentGuide.activeBackground": "#666666",
+      "editorWidget.background": "#FFFFFF",
+      "editorWidget.border": "#D8D8D8",
+      "editorSuggestWidget.background": "#FFFFFF",
+      "editorSuggestWidget.border": "#D8D8D8",
+      "editorSuggestWidget.selectedBackground": "#dff5fb",
+      "editorHoverWidget.background": "#FFFFFF",
+      "editorHoverWidget.border": "#D8D8D8"
+    }
+  });
+}
+var codeEditorVariants = cva(
+  "relative overflow-hidden rounded-md border transition-[color,box-shadow] outline-none focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]",
+  {
+    variants: {
+      variant: {
+        default: "border-input bg-transparent dark:bg-input/30",
+        ghost: "border-transparent bg-transparent",
+        card: "border-border bg-card shadow-sm"
+      },
+      size: {
+        default: "h-[300px]",
+        sm: "h-[150px]",
+        lg: "h-[500px]"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function LoadingFallback() {
+  return /* @__PURE__ */ jsx(Skeleton, { className: "h-full w-full" });
+}
+function CodeDiffEditor({
+  original,
+  modified,
+  language,
+  theme = "qualifio",
+  readOnly = false,
+  disabled = false,
+  className,
+  variant,
+  size,
+  onMount,
+  options,
+  ...props
+}) {
+  const editorOptions = useMemo(
+    () => ({
+      readOnly: readOnly || disabled,
+      fontSize: 14,
+      fontFamily: "'Menlo', 'Monaco', Consolas, monospace",
+      scrollBeyondLastLine: false,
+      automaticLayout: true,
+      padding: { top: 12, bottom: 12 },
+      renderSideBySide: true,
+      enableSplitViewResizing: true,
+      ...options
+    }),
+    [readOnly, disabled, options]
+  );
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "code-diff-editor",
+      className: cn(
+        codeEditorVariants({ variant, size }),
+        disabled && "cursor-not-allowed opacity-50",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        DiffEditor,
+        {
+          language,
+          theme,
+          original,
+          modified,
+          beforeMount: (monaco) => {
+            defineQualifioThemes(monaco).catch((error) => {
+              console.error("Failed to define Qualifio themes:", error);
+            });
+          },
+          onMount,
+          options: editorOptions,
+          loading: /* @__PURE__ */ jsx(LoadingFallback, {})
+        }
+      )
+    }
+  );
+}
+function LoadingFallback2() {
+  return /* @__PURE__ */ jsx(Skeleton, { className: "h-full w-full" });
+}
+function CodeEditor({
+  value,
+  defaultValue,
+  language,
+  theme = "qualifio",
+  readOnly = false,
+  disabled = false,
+  lineNumbers = true,
+  wordWrap = false,
+  minimap = false,
+  className,
+  variant,
+  size,
+  onChange,
+  onMount,
+  onValidate,
+  options,
+  ...props
+}) {
+  const editorOptions = useMemo(
+    () => ({
+      readOnly: readOnly || disabled,
+      lineNumbers: lineNumbers ? "on" : "off",
+      wordWrap: wordWrap ? "on" : "off",
+      minimap: { enabled: minimap },
+      fontSize: 14,
+      fontFamily: "'Menlo', 'Monaco', Consolas, monospace",
+      scrollBeyondLastLine: false,
+      automaticLayout: true,
+      padding: { top: 12, bottom: 12 },
+      bracketPairColorization: { enabled: true },
+      ...options
+    }),
+    [readOnly, disabled, lineNumbers, wordWrap, minimap, options]
+  );
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "code-editor",
+      className: cn(
+        codeEditorVariants({ variant, size }),
+        disabled && "cursor-not-allowed opacity-50",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        Editor,
+        {
+          language,
+          theme,
+          value,
+          defaultValue,
+          onChange,
+          beforeMount: (monaco) => {
+            defineQualifioThemes(monaco).catch((error) => {
+              console.error("Failed to define Qualifio themes:", error);
+            });
+          },
+          onMount,
+          onValidate,
+          options: editorOptions,
+          loading: /* @__PURE__ */ jsx(LoadingFallback2, {})
+        }
+      )
+    }
+  );
+}
+
+export { CodeDiffEditor, CodeEditor };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/code-editors/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/optionals/code-editors/qualifio-themes.ts","../../src/components/optionals/code-editors/variants.ts","../../src/components/optionals/code-editors/code-diff-editor.tsx","../../src/components/optionals/code-editors/code-editor.tsx"],"names":["LoadingFallback","jsx","useMemo"],"mappings":"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","file":"index.js","sourcesContent":["import type { Monaco } from \"@monaco-editor/react\";\n\n/**\n * Defines the Qualifio theme for Monaco Editor\n * This function should be called once when Monaco is loaded\n */\nexport async function defineQualifioThemes(monaco: Monaco) {\n  monaco.editor.defineTheme(\"qualifio\", {\n    base: \"vs\",\n    inherit: true,\n    rules: [],\n    colors: {\n      \"editor.foreground\": \"#666666\",\n      \"editor.background\": \"#f8fafb\",\n      \"editor.lineHighlightBackground\": \"#f8fafb\",\n      \"editorCursor.foreground\": \"#666666\",\n      \"editorLineNumber.foreground\": \"#D8D8D8\",\n      \"editorLineNumber.activeForeground\": \"#D8D8D8\",\n      \"editor.selectionBackground\": \"#dff5fb\",\n      \"editor.selectionHighlightBackground\": \"#dff5fb\",\n      \"editor.wordHighlightBackground\": \"#dff5fb\",\n      \"editor.wordHighlightStrongBackground\": \"#dff5fb\",\n      \"editor.findMatchBackground\": \"#FFF7E2\",\n      \"editor.findMatchHighlightBackground\": \"#FFF7E2\",\n      \"editorBracketMatch.background\": \"#f2f2f2\",\n      \"editorBracketMatch.border\": \"#D8D8D8\",\n      \"editorIndentGuide.background\": \"#D8D8D8\",\n      \"editorIndentGuide.activeBackground\": \"#666666\",\n      \"editorWidget.background\": \"#FFFFFF\",\n      \"editorWidget.border\": \"#D8D8D8\",\n      \"editorSuggestWidget.background\": \"#FFFFFF\",\n      \"editorSuggestWidget.border\": \"#D8D8D8\",\n      \"editorSuggestWidget.selectedBackground\": \"#dff5fb\",\n      \"editorHoverWidget.background\": \"#FFFFFF\",\n      \"editorHoverWidget.border\": \"#D8D8D8\",\n    },\n  });\n}\n","import { cva } from \"class-variance-authority\";\n\nexport const codeEditorVariants = cva(\n  \"relative overflow-hidden rounded-md border transition-[color,box-shadow] outline-none focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]\",\n  {\n    variants: {\n      variant: {\n        default: \"border-input bg-transparent dark:bg-input/30\",\n        ghost: \"border-transparent bg-transparent\",\n        card: \"border-border bg-card shadow-sm\",\n      },\n      size: {\n        default: \"h-[300px]\",\n        sm: \"h-[150px]\",\n        lg: \"h-[500px]\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  },\n);\n","import { Skeleton } from \"@/components/base/skeleton\";\nimport { cn } from \"@/lib/utils\";\nimport {\n  DiffEditor,\n  type DiffEditorProps,\n  type Monaco,\n} from \"@monaco-editor/react\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport type { editor } from \"monaco-editor\";\nimport { type HTMLAttributes, useMemo } from \"react\";\nimport { defineQualifioThemes } from \"./qualifio-themes\";\nimport type { EditorTheme, SupportedLanguage } from \"./types\";\nimport { codeEditorVariants } from \"./variants\";\n\ninterface CodeDiffEditorProps\n  extends\n    VariantProps<typeof codeEditorVariants>,\n    Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  original?: string;\n  modified?: string;\n  language: SupportedLanguage;\n  theme?: EditorTheme;\n  readOnly?: boolean;\n  disabled?: boolean;\n  onMount?: (editor: editor.IStandaloneDiffEditor, monaco: Monaco) => void;\n  options?: editor.IDiffEditorConstructionOptions;\n}\n\nfunction LoadingFallback() {\n  return <Skeleton className=\"h-full w-full\" />;\n}\n\nfunction CodeDiffEditor({\n  original,\n  modified,\n  language,\n  theme = \"qualifio\",\n  readOnly = false,\n  disabled = false,\n  className,\n  variant,\n  size,\n  onMount,\n  options,\n  ...props\n}: CodeDiffEditorProps) {\n  const editorOptions = useMemo(\n    () => ({\n      readOnly: readOnly || disabled,\n      fontSize: 14,\n      fontFamily: \"'Menlo', 'Monaco', Consolas, monospace\",\n      scrollBeyondLastLine: false,\n      automaticLayout: true,\n      padding: { top: 12, bottom: 12 },\n      renderSideBySide: true,\n      enableSplitViewResizing: true,\n      ...options,\n    }),\n    [readOnly, disabled, options],\n  );\n\n  return (\n    <div\n      data-slot=\"code-diff-editor\"\n      className={cn(\n        codeEditorVariants({ variant, size }),\n        disabled && \"cursor-not-allowed opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      <DiffEditor\n        language={language}\n        theme={theme}\n        original={original}\n        modified={modified}\n        beforeMount={(monaco) => {\n          defineQualifioThemes(monaco).catch((error) => {\n            console.error(\"Failed to define Qualifio themes:\", error);\n          });\n        }}\n        onMount={onMount}\n        options={editorOptions}\n        loading={<LoadingFallback />}\n      />\n    </div>\n  );\n}\n\nexport { CodeDiffEditor, type DiffEditorProps };\n","import { Editor, type Monaco } from \"@monaco-editor/react\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport type { editor } from \"monaco-editor\";\nimport { type HTMLAttributes, useMemo } from \"react\";\nimport { Skeleton } from \"@/components/base/skeleton\";\nimport { cn } from \"@/lib/utils\";\nimport { defineQualifioThemes } from \"./qualifio-themes\";\nimport type { EditorTheme, SupportedLanguage } from \"./types\";\nimport { codeEditorVariants } from \"./variants\";\n\ninterface CodeEditorProps\n  extends\n    VariantProps<typeof codeEditorVariants>,\n    Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  value?: string;\n  defaultValue?: string;\n  language: SupportedLanguage;\n  theme?: EditorTheme;\n  readOnly?: boolean;\n  disabled?: boolean;\n  lineNumbers?: boolean;\n  wordWrap?: boolean;\n  minimap?: boolean;\n  onChange?: (value: string | undefined) => void;\n  onMount?: (editor: editor.IStandaloneCodeEditor, monaco: Monaco) => void;\n  onValidate?: (markers: editor.IMarker[]) => void;\n  options?: editor.IStandaloneEditorConstructionOptions;\n}\n\nfunction LoadingFallback() {\n  return <Skeleton className=\"h-full w-full\" />;\n}\n\nfunction CodeEditor({\n  value,\n  defaultValue,\n  language,\n  theme = \"qualifio\",\n  readOnly = false,\n  disabled = false,\n  lineNumbers = true,\n  wordWrap = false,\n  minimap = false,\n  className,\n  variant,\n  size,\n  onChange,\n  onMount,\n  onValidate,\n  options,\n  ...props\n}: CodeEditorProps) {\n  const editorOptions = useMemo(\n    () => ({\n      readOnly: readOnly || disabled,\n      lineNumbers: lineNumbers ? (\"on\" as const) : (\"off\" as const),\n      wordWrap: wordWrap ? (\"on\" as const) : (\"off\" as const),\n      minimap: { enabled: minimap },\n      fontSize: 14,\n      fontFamily: \"'Menlo', 'Monaco', Consolas, monospace\",\n      scrollBeyondLastLine: false,\n      automaticLayout: true,\n      padding: { top: 12, bottom: 12 },\n      bracketPairColorization: { enabled: true },\n      ...options,\n    }),\n    [readOnly, disabled, lineNumbers, wordWrap, minimap, options],\n  );\n\n  return (\n    <div\n      data-slot=\"code-editor\"\n      className={cn(\n        codeEditorVariants({ variant, size }),\n        disabled && \"cursor-not-allowed opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      <Editor\n        language={language}\n        theme={theme}\n        value={value}\n        defaultValue={defaultValue}\n        onChange={onChange}\n        beforeMount={(monaco) => {\n          defineQualifioThemes(monaco).catch((error) => {\n            console.error(\"Failed to define Qualifio themes:\", error);\n          });\n        }}\n        onMount={onMount}\n        onValidate={onValidate}\n        options={editorOptions}\n        loading={<LoadingFallback />}\n      />\n    </div>\n  );\n}\n\nexport { CodeEditor, type CodeEditorProps };\nexport type { EditorTheme, SupportedLanguage } from \"./types\";\n"]}

package/dist/index.cjs

@@ -1,9 +1,9 @@
 'use strict';
 
-var chunkQV4CTFLS_cjs = require('./chunk-QV4CTFLS.cjs');
 var chunkQ4GFV3J3_cjs = require('./chunk-Q4GFV3J3.cjs');
 var chunkGQ6Z5A4R_cjs = require('./chunk-GQ6Z5A4R.cjs');
 var chunkI7WHASOO_cjs = require('./chunk-I7WHASOO.cjs');
+var chunkQV4CTFLS_cjs = require('./chunk-QV4CTFLS.cjs');
 require('./chunk-Q7SFCCGT.cjs');
 var React9 = require('react');
 var AccordionPrimitive = require('@radix-ui/react-accordion');
@@ -3882,30 +3882,6 @@ function TranslationProvider({
   }
   return /* @__PURE__ */ jsxRuntime.jsx(reactI18next.I18nextProvider, { i18n: i18n2, children });
 }
-var CodeEditorInternal = React9.lazy(
-  () => import('./code-editor-DK64HVFQ.cjs').then((m) => ({ default: m.CodeEditor }))
-);
-var CodeDiffEditorInternal = React9.lazy(
-  () => import('./code-diff-editor-J24VGXHL.cjs').then((m) => ({ default: m.CodeDiffEditor }))
-);
-function EditorSkeleton() {
-  return /* @__PURE__ */ jsxRuntime.jsx(chunkQ4GFV3J3_cjs.Skeleton, { className: "h-full w-full min-h-50" });
-}
-function LazyCodeEditor(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(React9.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(EditorSkeleton, {}), children: /* @__PURE__ */ jsxRuntime.jsx(CodeEditorInternal, { ...props }) });
-}
-function LazyCodeDiffEditor(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(React9.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(EditorSkeleton, {}), children: /* @__PURE__ */ jsxRuntime.jsx(CodeDiffEditorInternal, { ...props }) });
-}
-var RichTextEditorInternal = React9.lazy(
-  () => import('./rich-text-editor-MOJDWQTI.cjs').then((m) => ({ default: m.RichTextEditor }))
-);
-function EditorSkeleton2() {
-  return /* @__PURE__ */ jsxRuntime.jsx(chunkQ4GFV3J3_cjs.Skeleton, { className: "h-full w-full min-h-[100px]" });
-}
-function LazyRichTextEditor(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(React9.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(EditorSkeleton2, {}), children: /* @__PURE__ */ jsxRuntime.jsx(RichTextEditorInternal, { ...props }) });
-}
 
 Object.defineProperty(exports, "Skeleton", {
   enumerable: true,
@@ -4010,8 +3986,6 @@ exports.CarouselItem = CarouselItem;
 exports.CarouselNext = CarouselNext;
 exports.CarouselPrevious = CarouselPrevious;
 exports.Checkbox = Checkbox;
-exports.CodeDiffEditor = LazyCodeDiffEditor;
-exports.CodeEditor = LazyCodeEditor;
 exports.Collapsible = Collapsible;
 exports.CollapsibleContent = CollapsibleContent2;
 exports.CollapsibleTrigger = CollapsibleTrigger2;
@@ -4122,7 +4096,6 @@ exports.PreviousButton = PreviousButton;
 exports.Progress = Progress;
 exports.RadioGroup = RadioGroup4;
 exports.RadioGroupItem = RadioGroupItem;
-exports.RichTextEditor = LazyRichTextEditor;
 exports.ScrollArea = ScrollArea;
 exports.ScrollBar = ScrollBar;
 exports.Select = Select;