@limetech/lime-elements 37.15.1 → 37.16.0

package/dist/types/components/text-editor/text-editor.d.ts

@@ -0,0 +1,25 @@
+/**
+ * This editor offers a rich text editing experience with markdown support,
+ * in the sense that you can easily type markdown syntax and see the rendered
+ * result as rich text in real-time. For instance, you can type `# Hello, world!`
+ * and see it directly turning to a heading 1 (an `<h1>` HTML element).
+ *
+ * Naturally, you can use standard keyboard hotkeys such as <kbd>Ctrl</kbd> + <kbd>B</kbd>
+ * to toggle bold text, <kbd>Ctrl</kbd> + <kbd>I</kbd> to toggle italic text, and so on.
+ *
+ * @exampleComponent limel-example-text-editor-basic
+ * @beta
+ * @private
+ */
+export declare class TextEditor {
+  private host;
+  private view;
+  /**
+   * Dispatched when a change is made to the editor
+   */
+  private change;
+  componentWillLoad(): void;
+  render(): any;
+  componentDidLoad(): void;
+}
+//# sourceMappingURL=text-editor.d.ts.map

package/dist/types/components.d.ts

@@ -2457,6 +2457,19 @@ export namespace Components {
          */
         "totalRows": number;
     }
+    /**
+     * This editor offers a rich text editing experience with markdown support,
+     * in the sense that you can easily type markdown syntax and see the rendered
+     * result as rich text in real-time. For instance, you can type `# Hello, world!`
+     * and see it directly turning to a heading 1 (an `<h1>` HTML element).
+     * Naturally, you can use standard keyboard hotkeys such as <kbd>Ctrl</kbd> + <kbd>B</kbd>
+     * to toggle bold text, <kbd>Ctrl</kbd> + <kbd>I</kbd> to toggle italic text, and so on.
+     * @exampleComponent limel-example-text-editor-basic
+     * @beta 
+     * @private 
+     */
+    interface LimelTextEditor {
+    }
     /**
      * A tooltip can be used to display a descriptive text for any element.
      * The displayed content must be a brief and supplemental string of text,
@@ -2693,6 +2706,10 @@ export interface LimelTableCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLLimelTableElement;
 }
+export interface LimelTextEditorCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLLimelTextEditorElement;
+}
 declare global {
     /**
      * An action bar is a user interface element commonly found in software applications and websites.
@@ -3935,6 +3952,23 @@ declare global {
         prototype: HTMLLimelTableElement;
         new (): HTMLLimelTableElement;
     };
+    /**
+     * This editor offers a rich text editing experience with markdown support,
+     * in the sense that you can easily type markdown syntax and see the rendered
+     * result as rich text in real-time. For instance, you can type `# Hello, world!`
+     * and see it directly turning to a heading 1 (an `<h1>` HTML element).
+     * Naturally, you can use standard keyboard hotkeys such as <kbd>Ctrl</kbd> + <kbd>B</kbd>
+     * to toggle bold text, <kbd>Ctrl</kbd> + <kbd>I</kbd> to toggle italic text, and so on.
+     * @exampleComponent limel-example-text-editor-basic
+     * @beta 
+     * @private 
+     */
+    interface HTMLLimelTextEditorElement extends Components.LimelTextEditor, HTMLStencilElement {
+    }
+    var HTMLLimelTextEditorElement: {
+        prototype: HTMLLimelTextEditorElement;
+        new (): HTMLLimelTextEditorElement;
+    };
     /**
      * A tooltip can be used to display a descriptive text for any element.
      * The displayed content must be a brief and supplemental string of text,
@@ -4052,6 +4086,7 @@ declare global {
         "limel-tab-bar": HTMLLimelTabBarElement;
         "limel-tab-panel": HTMLLimelTabPanelElement;
         "limel-table": HTMLLimelTableElement;
+        "limel-text-editor": HTMLLimelTextEditorElement;
         "limel-tooltip": HTMLLimelTooltipElement;
         "limel-tooltip-content": HTMLLimelTooltipContentElement;
     }
@@ -6674,6 +6709,23 @@ declare namespace LocalJSX {
          */
         "totalRows"?: number;
     }
+    /**
+     * This editor offers a rich text editing experience with markdown support,
+     * in the sense that you can easily type markdown syntax and see the rendered
+     * result as rich text in real-time. For instance, you can type `# Hello, world!`
+     * and see it directly turning to a heading 1 (an `<h1>` HTML element).
+     * Naturally, you can use standard keyboard hotkeys such as <kbd>Ctrl</kbd> + <kbd>B</kbd>
+     * to toggle bold text, <kbd>Ctrl</kbd> + <kbd>I</kbd> to toggle italic text, and so on.
+     * @exampleComponent limel-example-text-editor-basic
+     * @beta 
+     * @private 
+     */
+    interface LimelTextEditor {
+        /**
+          * Dispatched when a change is made to the editor
+         */
+        "onChange"?: (event: LimelTextEditorCustomEvent<{ html: string }>) => void;
+    }
     /**
      * A tooltip can be used to display a descriptive text for any element.
      * The displayed content must be a brief and supplemental string of text,
@@ -6815,6 +6867,7 @@ declare namespace LocalJSX {
         "limel-tab-bar": LimelTabBar;
         "limel-tab-panel": LimelTabPanel;
         "limel-table": LimelTable;
+        "limel-text-editor": LimelTextEditor;
         "limel-tooltip": LimelTooltip;
         "limel-tooltip-content": LimelTooltipContent;
     }
@@ -7759,6 +7812,18 @@ declare module "@stencil/core" {
              * @exampleComponent limel-example-table-interactive-rows
              */
             "limel-table": LocalJSX.LimelTable & JSXBase.HTMLAttributes<HTMLLimelTableElement>;
+            /**
+             * This editor offers a rich text editing experience with markdown support,
+             * in the sense that you can easily type markdown syntax and see the rendered
+             * result as rich text in real-time. For instance, you can type `# Hello, world!`
+             * and see it directly turning to a heading 1 (an `<h1>` HTML element).
+             * Naturally, you can use standard keyboard hotkeys such as <kbd>Ctrl</kbd> + <kbd>B</kbd>
+             * to toggle bold text, <kbd>Ctrl</kbd> + <kbd>I</kbd> to toggle italic text, and so on.
+             * @exampleComponent limel-example-text-editor-basic
+             * @beta 
+             * @private 
+             */
+            "limel-text-editor": LocalJSX.LimelTextEditor & JSXBase.HTMLAttributes<HTMLLimelTextEditorElement>;
             /**
              * A tooltip can be used to display a descriptive text for any element.
              * The displayed content must be a brief and supplemental string of text,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@limetech/lime-elements",
-  "version": "37.15.1",
+  "version": "37.16.0",
   "description": "Lime Elements",
   "author": "Lime Technologies",
   "license": "Apache-2.0",
@@ -44,7 +44,7 @@
   },
   "devDependencies": {
     "@commitlint/config-conventional": "^19.1.0",
-    "@microsoft/api-extractor": "^7.43.0",
+    "@microsoft/api-extractor": "^7.43.1",
     "@popperjs/core": "^2.11.8",
     "@rjsf/core": "^2.4.2",
     "@rollup/plugin-node-resolve": "^13.3.0",
@@ -83,6 +83,8 @@
     "number-abbreviate": "^2.0.0",
     "parse-css-color": "^0.2.1",
     "prettier": "^3.2.5",
+    "prosemirror-example-setup": "^1.2.2",
+    "prosemirror-schema-basic": "^1.2.2",
     "puppeteer": "^19.11.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",