@react-fabric/monaco 1.0.0-beta.51 → 1.0.0-beta.52

package/dist/cjs/components/CodeEditor.js

@@ -13,6 +13,33 @@ var jsxRuntime = require('react/jsx-runtime');
 
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+/**
+ * CodeEditor component to render a code editor using Monaco Editor.
+ * It supports JSON and HTML languages with optional schema validation and handlebar suggestions.
+ * The editor can be configured to be read-only, minimal, and can handle changes in the code.
+ * It provides a ref to access the editor's value and validation methods.
+ *
+ * @param {EditorProps} props - The properties for the CodeEditor component.
+ * @param {RefProp<MonacoEditorRef>} ref - The ref to access the editor methods.
+ * @return {JSX.Element} The rendered CodeEditor component.
+ *
+ * @example
+ * ```jsx
+ * <CodeEditor
+ *   value={initialValue}
+ *   schema={[{ uri: "http://example.com/schema.json", schema: {} }]}
+ *   handlebarSuggestions={[{ text: "example", description: "An example suggestion" }]}
+ *   required={true}
+ *   readOnly={false}
+ *   minimal={false}
+ *   onChange={(value) => console.log("Code changed:", value)}
+ *   language="json"
+ * />
+ * ```
+ *
+ * @see {@link https://adarshpastakia.github.io/react-fabric/?path=/story/monaco-playground--playground}
+ * @see {@link https://microsoft.github.io/monaco-editor/}
+ */
 var CodeEditor = function CodeEditor(_ref) {
   var ref = _ref.ref,
     value = _ref.value,

package/dist/esm/components/CodeEditor.js

@@ -13,6 +13,33 @@ import { jsx } from 'react/jsx-runtime';
 
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+/**
+ * CodeEditor component to render a code editor using Monaco Editor.
+ * It supports JSON and HTML languages with optional schema validation and handlebar suggestions.
+ * The editor can be configured to be read-only, minimal, and can handle changes in the code.
+ * It provides a ref to access the editor's value and validation methods.
+ *
+ * @param {EditorProps} props - The properties for the CodeEditor component.
+ * @param {RefProp<MonacoEditorRef>} ref - The ref to access the editor methods.
+ * @return {JSX.Element} The rendered CodeEditor component.
+ *
+ * @example
+ * ```jsx
+ * <CodeEditor
+ *   value={initialValue}
+ *   schema={[{ uri: "http://example.com/schema.json", schema: {} }]}
+ *   handlebarSuggestions={[{ text: "example", description: "An example suggestion" }]}
+ *   required={true}
+ *   readOnly={false}
+ *   minimal={false}
+ *   onChange={(value) => console.log("Code changed:", value)}
+ *   language="json"
+ * />
+ * ```
+ *
+ * @see {@link https://adarshpastakia.github.io/react-fabric/?path=/story/monaco-playground--playground}
+ * @see {@link https://microsoft.github.io/monaco-editor/}
+ */
 var CodeEditor = function CodeEditor(_ref) {
   var ref = _ref.ref,
     value = _ref.value,

package/dist/types/components/CodeEditor.d.ts

@@ -29,5 +29,32 @@ type EditorProps = BaseEditorProps & ({
     schema?: any;
     handlebarSuggestions?: never;
 });
+/**
+ * CodeEditor component to render a code editor using Monaco Editor.
+ * It supports JSON and HTML languages with optional schema validation and handlebar suggestions.
+ * The editor can be configured to be read-only, minimal, and can handle changes in the code.
+ * It provides a ref to access the editor's value and validation methods.
+ *
+ * @param {EditorProps} props - The properties for the CodeEditor component.
+ * @param {RefProp<MonacoEditorRef>} ref - The ref to access the editor methods.
+ * @return {JSX.Element} The rendered CodeEditor component.
+ *
+ * @example
+ * ```jsx
+ * <CodeEditor
+ *   value={initialValue}
+ *   schema={[{ uri: "http://example.com/schema.json", schema: {} }]}
+ *   handlebarSuggestions={[{ text: "example", description: "An example suggestion" }]}
+ *   required={true}
+ *   readOnly={false}
+ *   minimal={false}
+ *   onChange={(value) => console.log("Code changed:", value)}
+ *   language="json"
+ * />
+ * ```
+ *
+ * @see {@link https://adarshpastakia.github.io/react-fabric/?path=/story/monaco-playground--playground}
+ * @see {@link https://microsoft.github.io/monaco-editor/}
+ */
 export declare const CodeEditor: ({ ref, value, schema, handlebarSuggestions, required, readOnly, minimal, onChange, language, }: EditorProps & RefProp<MonacoEditorRef>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-fabric/monaco",
-  "version": "1.0.0-beta.51",
+  "version": "1.0.0-beta.52",
   "description": "RUF: Monaco editor",
   "author": "Adarsh Pastakia <adarshpastakia@outlook.com>",
   "license": "MIT",
@@ -35,8 +35,8 @@
     "watch": "npm-run-all -p watch:rollup watch:dts"
   },
   "dependencies": {
-    "@react-fabric/core": "^1.0.0-beta.51",
-    "@react-fabric/utilities": "^1.0.0-beta.50",
+    "@react-fabric/core": "^1.0.0-beta.52",
+    "@react-fabric/utilities": "^1.0.0-beta.52",
     "classnames": "^2.5.1",
     "monaco-editor": "^0.52.2",
     "react-monaco-editor": "^0.58.0"
@@ -51,5 +51,5 @@
     "node": ">=18.12.0",
     "npm": ">=8.19.0"
   },
-  "gitHead": "a1b04de4663045f82992bff2aef8db26608eac74"
+  "gitHead": "0eabb9d88d91af93d657bcc209b226fd576e8260"
 }

package/src/components/CodeEditor.tsx

@@ -77,6 +77,33 @@ type EditorProps = BaseEditorProps &
       }
   );
 
+/**
+ * CodeEditor component to render a code editor using Monaco Editor.
+ * It supports JSON and HTML languages with optional schema validation and handlebar suggestions.
+ * The editor can be configured to be read-only, minimal, and can handle changes in the code.
+ * It provides a ref to access the editor's value and validation methods.
+ *
+ * @param {EditorProps} props - The properties for the CodeEditor component.
+ * @param {RefProp<MonacoEditorRef>} ref - The ref to access the editor methods.
+ * @return {JSX.Element} The rendered CodeEditor component.
+ *
+ * @example
+ * ```jsx
+ * <CodeEditor
+ *   value={initialValue}
+ *   schema={[{ uri: "http://example.com/schema.json", schema: {} }]}
+ *   handlebarSuggestions={[{ text: "example", description: "An example suggestion" }]}
+ *   required={true}
+ *   readOnly={false}
+ *   minimal={false}
+ *   onChange={(value) => console.log("Code changed:", value)}
+ *   language="json"
+ * />
+ * ```
+ *
+ * @see {@link https://adarshpastakia.github.io/react-fabric/?path=/story/monaco-playground--playground}
+ * @see {@link https://microsoft.github.io/monaco-editor/}
+ */
 export const CodeEditor = ({
   ref,
   value,