@snack-uikit/code-editor 0.5.1-preview-d4775873.0 → 0.5.1-preview-f7ec3fa7.0

package/README.md

@@ -36,7 +36,6 @@
 | onMount | `OnMount` | - | Signature: function(editor: monaco.editor.IStandaloneCodeEditor, monaco: Monaco) => void An event is emitted when the editor is mounted It gets the editor instance as a first argument and the monaco instance as a second Defaults to "noop" |
 | onChange | `OnChange` | - | Signature: function(value: string \| undefined, ev: monaco.editor.IModelContentChangedEvent) => void An event is emitted when the content of the current model is changed |
 | onValidate | `OnValidate` | - | Signature: function(markers: monaco.editor.IMarker[]) => void An event is emitted when the content of the current model is changed and the current model markers are ready Defaults to "noop" |
-| hoverDescription | `HoverDescription` | - |  |
 
 
 [//]: DOCUMENTATION_SECTION_END

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

@@ -10,4 +10,4 @@ export type CodeEditorProps = WithSupportProps<{
      */
     hasBackground?: boolean;
 }> & (EditorBaseProps | EditorWithJsonSchemaProps);
-export declare function CodeEditor({ themeName, className, theme, options, loading, hasBackground, onMount, language, hoverDescription, ...props }: CodeEditorProps): import("react/jsx-runtime").JSX.Element;
+export declare function CodeEditor({ themeName, className, theme, options, loading, hasBackground, onMount, language, ...props }: CodeEditorProps): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/CodeEditor.js

@@ -37,17 +37,15 @@ function CodeEditor(_a) {
       loading,
       hasBackground = true,
       onMount,
-      language,
-      hoverDescription
+      language
     } = _a,
-    props = __rest(_a, ["themeName", "className", "theme", "options", "loading", "hasBackground", "onMount", "language", "hoverDescription"]);
+    props = __rest(_a, ["themeName", "className", "theme", "options", "loading", "hasBackground", "onMount", "language"]);
   const monaco = (0, react_1.useMonaco)();
   const [wrapperElement, setWrapperElement] = (0, react_2.useState)(null);
   const {
     jsonSchemaProps,
     jsonSchemaOptions
   } = (0, hooks_1.useApplyJsonSchema)(language, 'jsonSchema' in props ? props.jsonSchema : undefined);
-  (0, hooks_1.useHoverProvider)(language, hoverDescription);
   const onEditorMount = (0, react_2.useCallback)((editor, monaco) => {
     var _a;
     monaco && (0, utils_1.isBrowser)() && ((_a = document === null || document === void 0 ? void 0 : document.fonts) === null || _a === void 0 ? void 0 : _a.ready.finally(monaco.editor.remeasureFonts));

package/dist/cjs/components/hooks.d.ts

@@ -1,4 +1,4 @@
-import { HoverDescription, JsonSchema } from './types';
+import { JsonSchema } from './types';
 type UseCalculatedThemeValuesProps = {
     stylesOriginNode: HTMLDivElement | null;
     themeName?: string;
@@ -48,5 +48,4 @@ export declare function useApplyJsonSchema(language?: string, jsonSchema?: JsonS
     };
     jsonSchemaOptions: import("monaco-editor").editor.IStandaloneEditorConstructionOptions | undefined;
 };
-export declare function useHoverProvider(language?: string, hoverDescription?: HoverDescription): void;
 export {};

package/dist/cjs/components/hooks.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useCalculatedThemeValues = useCalculatedThemeValues;
 exports.useApplyJsonSchema = useApplyJsonSchema;
-exports.useHoverProvider = useHoverProvider;
 const react_1 = require("@monaco-editor/react");
 const monaco_yaml_1 = require("monaco-yaml");
 const react_2 = require("react");
@@ -96,39 +95,4 @@ function useApplyJsonSchema(language, jsonSchema) {
     },
     jsonSchemaOptions
   }), [jsonSchemaOptions, modelPath]);
-}
-function useHoverProvider(language, hoverDescription) {
-  const monaco = (0, react_1.useMonaco)();
-  const configureHoverProvider = (0, react_2.useCallback)(() => {
-    if (!monaco || !language || !hoverDescription) {
-      return;
-    }
-    return monaco.languages.registerHoverProvider(language, {
-      provideHover: (model, position) => {
-        var _a;
-        const wordInfo = model.getWordAtPosition(position);
-        const hoveredDescription = hoverDescription[(_a = wordInfo === null || wordInfo === void 0 ? void 0 : wordInfo.word) !== null && _a !== void 0 ? _a : ''];
-        if (wordInfo && hoveredDescription) {
-          const {
-            startColumn,
-            endColumn
-          } = wordInfo;
-          return {
-            range: new monaco.Range(position.lineNumber, startColumn, position.lineNumber, endColumn),
-            contents: [{
-              value: hoveredDescription
-            }]
-          };
-        }
-        return null;
-      }
-    });
-  }, [monaco, language, hoverDescription]);
-  (0, react_2.useEffect)(() => {
-    var _a;
-    const {
-      dispose
-    } = (_a = configureHoverProvider()) !== null && _a !== void 0 ? _a : {};
-    return dispose;
-  }, [configureHoverProvider]);
 }

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

@@ -1,11 +1,6 @@
 import { EditorProps as MonacoEditorProps } from '@monaco-editor/react';
 import { JSONSchema } from 'monaco-yaml';
-export type HoverDescription = {
-    [word: string]: string;
-};
-export type EditorBaseProps = MonacoEditorProps & {
-    hoverDescription?: HoverDescription;
-};
+export type EditorBaseProps = MonacoEditorProps;
 export type SupportedSchemaLanguage = 'json' | 'yaml';
 export type JsonSchema = {
     uri?: string;
@@ -23,10 +18,8 @@ type WithoutJsonSchema = Pick<MonacoEditorProps, 'path'>;
 export type EditorWithJsonSchemaProps = Omit<EditorBaseProps, 'language' | 'path'> & {
     language: SupportedSchemaLanguage;
 } & (WithJsonSchema | WithoutJsonSchema);
-export type Dispose = {
-    dispose?: () => void;
-};
-export type ConfigureJsonSchemaReturn = ({
+export type ConfigureJsonSchemaReturn = {
     options?: MonacoEditorProps['options'];
-} & Dispose) | undefined;
+    dispose?: () => void;
+} | undefined;
 export {};

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

@@ -10,4 +10,4 @@ export type CodeEditorProps = WithSupportProps<{
      */
     hasBackground?: boolean;
 }> & (EditorBaseProps | EditorWithJsonSchemaProps);
-export declare function CodeEditor({ themeName, className, theme, options, loading, hasBackground, onMount, language, hoverDescription, ...props }: CodeEditorProps): import("react/jsx-runtime").JSX.Element;
+export declare function CodeEditor({ themeName, className, theme, options, loading, hasBackground, onMount, language, ...props }: CodeEditorProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/CodeEditor.js

@@ -16,16 +16,15 @@ import { useCallback, useMemo, useState } from 'react';
 import { Spinner } from '@snack-uikit/loaders';
 import { extractSupportProps, isBrowser } from '@snack-uikit/utils';
 import { CODE_EDITOR_OPTIONS, DEFAULT_THEME_OPTIONS, DEFAULT_THEME_VALUES } from './constants';
-import { useApplyJsonSchema, useCalculatedThemeValues, useHoverProvider } from './hooks';
+import { useApplyJsonSchema, useCalculatedThemeValues } from './hooks';
 import styles from './styles.module.css';
 import { initLoaderConfig, isDark } from './utils';
 initLoaderConfig();
 export function CodeEditor(_a) {
-    var { themeName, className, theme, options, loading, hasBackground = true, onMount, language, hoverDescription } = _a, props = __rest(_a, ["themeName", "className", "theme", "options", "loading", "hasBackground", "onMount", "language", "hoverDescription"]);
+    var { themeName, className, theme, options, loading, hasBackground = true, onMount, language } = _a, props = __rest(_a, ["themeName", "className", "theme", "options", "loading", "hasBackground", "onMount", "language"]);
     const monaco = useMonaco();
     const [wrapperElement, setWrapperElement] = useState(null);
     const { jsonSchemaProps, jsonSchemaOptions } = useApplyJsonSchema(language, 'jsonSchema' in props ? props.jsonSchema : undefined);
-    useHoverProvider(language, hoverDescription);
     const onEditorMount = useCallback((editor, monaco) => {
         var _a;
         monaco && isBrowser() && ((_a = document === null || document === void 0 ? void 0 : document.fonts) === null || _a === void 0 ? void 0 : _a.ready.finally(monaco.editor.remeasureFonts));

package/dist/esm/components/hooks.d.ts

@@ -1,4 +1,4 @@
-import { HoverDescription, JsonSchema } from './types';
+import { JsonSchema } from './types';
 type UseCalculatedThemeValuesProps = {
     stylesOriginNode: HTMLDivElement | null;
     themeName?: string;
@@ -48,5 +48,4 @@ export declare function useApplyJsonSchema(language?: string, jsonSchema?: JsonS
     };
     jsonSchemaOptions: import("monaco-editor").editor.IStandaloneEditorConstructionOptions | undefined;
 };
-export declare function useHoverProvider(language?: string, hoverDescription?: HoverDescription): void;
 export {};

package/dist/esm/components/hooks.js

@@ -81,31 +81,3 @@ export function useApplyJsonSchema(language, jsonSchema) {
         jsonSchemaOptions,
     }), [jsonSchemaOptions, modelPath]);
 }
-export function useHoverProvider(language, hoverDescription) {
-    const monaco = useMonaco();
-    const configureHoverProvider = useCallback(() => {
-        if (!monaco || !language || !hoverDescription) {
-            return;
-        }
-        return monaco.languages.registerHoverProvider(language, {
-            provideHover: (model, position) => {
-                var _a;
-                const wordInfo = model.getWordAtPosition(position);
-                const hoveredDescription = hoverDescription[(_a = wordInfo === null || wordInfo === void 0 ? void 0 : wordInfo.word) !== null && _a !== void 0 ? _a : ''];
-                if (wordInfo && hoveredDescription) {
-                    const { startColumn, endColumn } = wordInfo;
-                    return {
-                        range: new monaco.Range(position.lineNumber, startColumn, position.lineNumber, endColumn),
-                        contents: [{ value: hoveredDescription }],
-                    };
-                }
-                return null;
-            },
-        });
-    }, [monaco, language, hoverDescription]);
-    useEffect(() => {
-        var _a;
-        const { dispose } = (_a = configureHoverProvider()) !== null && _a !== void 0 ? _a : {};
-        return dispose;
-    }, [configureHoverProvider]);
-}

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

@@ -1,11 +1,6 @@
 import { EditorProps as MonacoEditorProps } from '@monaco-editor/react';
 import { JSONSchema } from 'monaco-yaml';
-export type HoverDescription = {
-    [word: string]: string;
-};
-export type EditorBaseProps = MonacoEditorProps & {
-    hoverDescription?: HoverDescription;
-};
+export type EditorBaseProps = MonacoEditorProps;
 export type SupportedSchemaLanguage = 'json' | 'yaml';
 export type JsonSchema = {
     uri?: string;
@@ -23,10 +18,8 @@ type WithoutJsonSchema = Pick<MonacoEditorProps, 'path'>;
 export type EditorWithJsonSchemaProps = Omit<EditorBaseProps, 'language' | 'path'> & {
     language: SupportedSchemaLanguage;
 } & (WithJsonSchema | WithoutJsonSchema);
-export type Dispose = {
-    dispose?: () => void;
-};
-export type ConfigureJsonSchemaReturn = ({
+export type ConfigureJsonSchemaReturn = {
     options?: MonacoEditorProps['options'];
-} & Dispose) | undefined;
+    dispose?: () => void;
+} | undefined;
 export {};

package/package.json

@@ -4,7 +4,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.5.1-preview-d4775873.0",
+  "version": "0.5.1-preview-f7ec3fa7.0",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -37,8 +37,8 @@
   "scripts": {},
   "dependencies": {
     "@monaco-editor/react": "4.6.0",
-    "@snack-uikit/loaders": "0.9.1",
-    "@snack-uikit/utils": "3.7.0",
+    "@snack-uikit/loaders": "0.9.2-preview-f7ec3fa7.0",
+    "@snack-uikit/utils": "3.7.1-preview-f7ec3fa7.0",
     "chroma-js": "3.1.2",
     "classnames": "2.5.1",
     "monaco-yaml": "5.2.3"
@@ -46,5 +46,5 @@
   "devDependencies": {
     "@types/chroma-js": "2.4.4"
   },
-  "gitHead": "1db3ab2954a7d659a5bd2cb7a8403d5500cecd31"
+  "gitHead": "41cd467095dc6f8b733bff37101ea84ab0e55351"
 }

package/src/components/CodeEditor.tsx

@@ -6,7 +6,7 @@ import { Spinner } from '@snack-uikit/loaders';
 import { extractSupportProps, isBrowser, WithSupportProps } from '@snack-uikit/utils';
 
 import { CODE_EDITOR_OPTIONS, DEFAULT_THEME_OPTIONS, DEFAULT_THEME_VALUES } from './constants';
-import { useApplyJsonSchema, useCalculatedThemeValues, useHoverProvider } from './hooks';
+import { useApplyJsonSchema, useCalculatedThemeValues } from './hooks';
 import styles from './styles.module.scss';
 import { EditorBaseProps, EditorWithJsonSchemaProps } from './types';
 import { initLoaderConfig, isDark } from './utils';
@@ -34,7 +34,6 @@ export function CodeEditor({
   hasBackground = true,
   onMount,
   language,
-  hoverDescription,
   ...props
 }: CodeEditorProps) {
   const monaco = useMonaco();
@@ -45,8 +44,6 @@ export function CodeEditor({
     'jsonSchema' in props ? props.jsonSchema : undefined,
   );
 
-  useHoverProvider(language, hoverDescription);
-
   const onEditorMount = useCallback<OnMount>(
     (editor, monaco) => {
       monaco && isBrowser() && document?.fonts?.ready.finally(monaco.editor.remeasureFonts);

package/src/components/hooks.ts

@@ -5,7 +5,7 @@ import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useThemeContext } from '@snack-uikit/utils';
 
 import { THEME_VARS, YAML_CODE_EDITOR_OPTIONS } from './constants';
-import { ConfigureJsonSchemaReturn, Dispose, HoverDescription, JsonSchema } from './types';
+import { ConfigureJsonSchemaReturn, JsonSchema } from './types';
 import { getJsonSchema } from './utils';
 
 function getThemeVars(styles: CSSStyleDeclaration) {
@@ -111,35 +111,3 @@ export function useApplyJsonSchema(language?: string, jsonSchema?: JsonSchema) {
     [jsonSchemaOptions, modelPath],
   );
 }
-
-export function useHoverProvider(language?: string, hoverDescription?: HoverDescription) {
-  const monaco = useMonaco();
-
-  const configureHoverProvider = useCallback((): Dispose | undefined => {
-    if (!monaco || !language || !hoverDescription) {
-      return;
-    }
-
-    return monaco.languages.registerHoverProvider(language, {
-      provideHover: (model, position) => {
-        const wordInfo = model.getWordAtPosition(position);
-        const hoveredDescription = hoverDescription[wordInfo?.word ?? ''];
-
-        if (wordInfo && hoveredDescription) {
-          const { startColumn, endColumn } = wordInfo;
-
-          return {
-            range: new monaco.Range(position.lineNumber, startColumn, position.lineNumber, endColumn),
-            contents: [{ value: hoveredDescription }],
-          };
-        }
-        return null;
-      },
-    });
-  }, [monaco, language, hoverDescription]);
-
-  useEffect(() => {
-    const { dispose } = configureHoverProvider() ?? {};
-    return dispose;
-  }, [configureHoverProvider]);
-}

package/src/components/types.ts

@@ -1,13 +1,7 @@
 import { EditorProps as MonacoEditorProps } from '@monaco-editor/react';
 import { JSONSchema } from 'monaco-yaml';
 
-export type HoverDescription = {
-  [word: string]: string;
-};
-
-export type EditorBaseProps = MonacoEditorProps & {
-  hoverDescription?: HoverDescription;
-};
+export type EditorBaseProps = MonacoEditorProps;
 
 export type SupportedSchemaLanguage = 'json' | 'yaml';
 
@@ -31,12 +25,9 @@ export type EditorWithJsonSchemaProps = Omit<EditorBaseProps, 'language' | 'path
   language: SupportedSchemaLanguage;
 } & (WithJsonSchema | WithoutJsonSchema);
 
-export type Dispose = {
-  dispose?: () => void;
-};
-
 export type ConfigureJsonSchemaReturn =
-  | ({
+  | {
       options?: MonacoEditorProps['options'];
-    } & Dispose)
+      dispose?: () => void;
+    }
   | undefined;