@limetech/lime-elements 37.26.3 → 37.26.4

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

@@ -20,8 +20,9 @@ export declare class ProsemirrorAdapter {
    * Dispatched when a change is made to the editor
    */
   private change;
-  render(): any[];
   componentDidLoad(): void;
+  render(): any[];
+  private initializeEditor;
   private getHTML;
   private handleActionBarItem;
   private executeCommand;

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

@@ -60,7 +60,7 @@ export declare class TextEditor implements FormComponent<string> {
    * Dispatched when a change is made to the editor
    */
   change: EventEmitter<string>;
-  render(): any;
+  render(): any[];
   private renderEditor;
   private renderLabel;
   private handleChange;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@limetech/lime-elements",
-  "version": "37.26.3",
+  "version": "37.26.4",
   "description": "Lime Elements",
   "author": "Lime Technologies",
   "license": "Apache-2.0",

package/dist/lime-elements/p-a77a0fa8.entry.js

@@ -1,2 +0,0 @@
-import{r,c as e,h as n}from"./p-443111b3.js";const o='@charset "UTF-8";:host{--mdc-theme-primary:var(\n      --lime-primary-color,\n      rgb(var(--color-teal-default))\n  );--mdc-theme-secondary:var(\n      --lime-secondary-color,\n      rgb(var(--contrast-1100))\n  );--mdc-theme-on-primary:var(\n      --lime-on-primary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-secondary:var(\n      --lime-on-secondary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-text-disabled-on-background:var(\n      --lime-text-disabled-on-background-color,\n      rgba(var(--contrast-1700), 0.38)\n  );--mdc-theme-text-primary-on-background:var(\n      --lime-text-primary-on-background-color,\n      rgba(var(--contrast-1700), 0.87)\n  );--mdc-theme-text-secondary-on-background:var(\n      --lime-text-secondary-on-background-color,\n      rgba(var(--contrast-1700), 0.54)\n  );--mdc-theme-error:var(\n      --lime-error-background-color,\n      rgb(var(--color-red-dark))\n  );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n      --lime-surface-background-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-surface:var(\n      --lime-on-surface-color,\n      rgb(var(--contrast-1500))\n  )}.lime-empty-value-for-readonly{z-index:1;position:absolute;top:0.875rem;left:1rem}.lime-looks-like-input-value{line-height:1.75rem;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;color:rgba(var(--contrast-1400), 1);font-size:0.875rem;font-weight:400;letter-spacing:0.009375em}.mdc-text-field--disabled .lime-looks-like-input-value{cursor:not-allowed;opacity:0.4}:host(limel-text-editor){position:relative;isolation:isolate;display:flex;flex-direction:column;width:100%;min-height:max(4rem, 100%)}fieldset{flex-grow:1;min-width:0;min-height:0;height:100%;max-height:100%;padding-inline-start:0 !important;padding-inline-end:0 !important}legend{position:relative;z-index:2;margin-left:0.75rem;max-width:calc(100% - 1.5rem) !important}:host(limel-text-editor[readonly]) limel-markdown{display:block;padding:0.75rem}:host{--mdc-theme-primary:var(\n      --lime-primary-color,\n      rgb(var(--color-teal-default))\n  );--mdc-theme-secondary:var(\n      --lime-secondary-color,\n      rgb(var(--contrast-1100))\n  );--mdc-theme-on-primary:var(\n      --lime-on-primary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-secondary:var(\n      --lime-on-secondary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-text-disabled-on-background:var(\n      --lime-text-disabled-on-background-color,\n      rgba(var(--contrast-1700), 0.38)\n  );--mdc-theme-text-primary-on-background:var(\n      --lime-text-primary-on-background-color,\n      rgba(var(--contrast-1700), 0.87)\n  );--mdc-theme-text-secondary-on-background:var(\n      --lime-text-secondary-on-background-color,\n      rgba(var(--contrast-1700), 0.54)\n  );--mdc-theme-error:var(\n      --lime-error-background-color,\n      rgb(var(--color-red-dark))\n  );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n      --lime-surface-background-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-surface:var(\n      --lime-on-surface-color,\n      rgb(var(--contrast-1500))\n  )}fieldset{box-sizing:border-box;transition:border-color 0.2s ease, background-color 0.2s ease;border:1px solid;border-radius:0.25rem;margin-inline-start:0;margin-inline-end:0;padding-block-start:0;padding-inline-start:0.75rem;padding-inline-end:0.75rem;padding-block-end:0.75rem}fieldset:not([disabled]){border-color:rgba(var(--contrast-700), 0.65);background-color:rgba(var(--contrast-200), 0.5)}fieldset:not([disabled]):hover{border-color:rgba(var(--contrast-700), 1);background-color:rgba(var(--contrast-200), 1)}fieldset:not([disabled]):focus-within{border-color:var(--mdc-theme-primary)}fieldset[disabled]{border-color:transparent}fieldset:has(legend){margin-top:calc((-0.75rem / 2) + (1px / 2))}legend{box-sizing:border-box;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:100%;color:rgba(var(--contrast-1200), 1);font-size:0.65rem;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);padding-inline-start:0.25rem;padding-inline-end:0.25rem}';const t=class{constructor(n){r(this,n);this.change=e(this,"change",7);this.handleChange=()=>r=>{r.stopPropagation();this.change.emit(r.detail)};this.disabled=undefined;this.readonly=undefined;this.helperText=undefined;this.placeholder=undefined;this.label=undefined;this.invalid=undefined;this.value=undefined}render(){return n("fieldset",{disabled:this.readonly||this.disabled},this.renderLabel(),this.renderEditor())}renderEditor(){if(this.readonly&&!this.value){return n("span",{class:"lime-empty-value-for-readonly lime-looks-like-input-value"},"–")}if(this.readonly){return n("limel-markdown",{value:this.value})}return n("limel-prosemirror-adapter",{onChange:this.handleChange,value:this.value})}renderLabel(){if(!this.label){return}return n("legend",null,this.label)}};t.style=o;export{t as limel_text_editor};
-//# sourceMappingURL=p-a77a0fa8.entry.js.map

package/dist/lime-elements/p-a77a0fa8.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["textEditorCss","TextEditor","this","handleChange","event","stopPropagation","change","emit","detail","render","h","disabled","readonly","renderLabel","renderEditor","value","class","onChange","label"],"sources":["./src/components/text-editor/text-editor.scss?tag=limel-text-editor&encapsulation=shadow","./src/components/text-editor/text-editor.tsx"],"sourcesContent":["@use '../../style/internal/shared_input-select-picker';\n\n@include shared_input-select-picker.lime-empty-value-for-readonly;\n@include shared_input-select-picker.lime-looks-like-input-value;\n\n$_label-margin: 0.75rem;\n\n:host(limel-text-editor) {\n    position: relative;\n    isolation: isolate;\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n    min-height: max(4rem, 100%);\n}\n\nfieldset {\n    flex-grow: 1;\n\n    min-width: 0;\n    min-height: 0;\n    height: 100%;\n    max-height: 100%;\n\n    padding-inline-start: 0 !important;\n    padding-inline-end: 0 !important;\n}\n\nlegend {\n    position: relative;\n    z-index: 2;\n    margin-left: $_label-margin;\n    max-width: calc(100% - #{$_label-margin * 2}) !important;\n}\n\n:host(limel-text-editor[readonly]) {\n    limel-markdown {\n        display: block;\n        padding: $_label-margin;\n    }\n}\n\n@import '../../style/internal/fieldset.scss';\n","import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\nimport { FormComponent } from '../form/form.types';\n/**\n * A rich text editor that offers a rich text editing experience with markdown support,\n * in the sense that you can easily type markdown syntax and see the rendered\n * result as rich text in real-time. For instance, you can type `# Hello, world!`\n * and see it directly turning to a heading 1 (an `<h1>` HTML element).\n *\n * Naturally, you can use standard keyboard hotkeys such as <kbd>Ctrl</kbd> + <kbd>B</kbd>\n * to toggle bold text, <kbd>Ctrl</kbd> + <kbd>I</kbd> to toggle italic text, and so on.\n *\n * @exampleComponent limel-example-text-editor-basic\n * @exampleComponent limel-example-text-editor-as-form-component\n * @exampleComponent limel-example-text-editor-composite\n * @exampleComponent limel-example-text-editor-height\n * @beta\n * @private\n */\n@Component({\n    tag: 'limel-text-editor',\n    shadow: true,\n    styleUrl: 'text-editor.scss',\n})\nexport class TextEditor implements FormComponent<string> {\n    /**\n     * Set to `true` to disable the field.\n     * Use `disabled` to indicate that the field can normally be interacted\n     * with, but is currently disabled. This tells the user that if certain\n     * requirements are met, the field may become enabled again.\n     */\n    @Prop({ reflect: true })\n    public disabled?: boolean;\n\n    /**\n     * Set to `true` to make the component read-only.\n     * Use `readonly` when the field is only there to present the data it holds,\n     * and will not become possible for the current user to edit.\n     * :::note\n     * Consider that it might be better to use `limel-markdown`\n     * instead of `limel-text-editor` when the goal is visualizing data.\n     * :::\n     */\n    @Prop({ reflect: true })\n    public readonly?: boolean;\n\n    /**\n     * Optional helper text to display below the input field when it has focus\n     */\n    @Prop({ reflect: true })\n    public helperText?: string;\n\n    /**\n     * The placeholder text shown inside the input field,\n     * when the field is empty.\n     */\n    @Prop({ reflect: true })\n    public placeholder?: string;\n\n    /**\n     * The label of the editor\n     */\n    @Prop({ reflect: true })\n    public label?: string;\n\n    /**\n     * Set to `true` to indicate that the current value of the editor is\n     * invalid.\n     */\n    @Prop({ reflect: true })\n    public invalid?: boolean;\n\n    /**\n     * Description of the text inside the editor as serialised HTML\n     */\n    @Prop({ reflect: true })\n    public value: string;\n\n    /**\n     * Dispatched when a change is made to the editor\n     */\n    @Event()\n    public change: EventEmitter<string>;\n\n    public render() {\n        return (\n            <fieldset disabled={this.readonly || this.disabled}>\n                {this.renderLabel()}\n                {this.renderEditor()}\n            </fieldset>\n        );\n    }\n\n    private renderEditor() {\n        if (this.readonly && !this.value) {\n            return (\n                <span class=\"lime-empty-value-for-readonly lime-looks-like-input-value\">\n                    –\n                </span>\n            );\n        }\n\n        if (this.readonly) {\n            return <limel-markdown value={this.value} />;\n        }\n\n        return (\n            <limel-prosemirror-adapter\n                onChange={this.handleChange}\n                value={this.value}\n            />\n        );\n    }\n\n    private renderLabel() {\n        if (!this.label) {\n            return;\n        }\n\n        return <legend>{this.label}</legend>;\n    }\n\n    private handleChange = () => (event: CustomEvent<string>) => {\n        event.stopPropagation();\n        this.change.emit(event.detail);\n    };\n}\n"],"mappings":"6CAAA,MAAMA,EAAgB,6kI,MCuBTC,EAAU,M,wDAkGXC,KAAAC,aAAe,IAAOC,IAC1BA,EAAMC,kBACNH,KAAKI,OAAOC,KAAKH,EAAMI,OAAO,E,sKAxC3BC,SACH,OACIC,EAAA,YAAUC,SAAUT,KAAKU,UAAYV,KAAKS,UACrCT,KAAKW,cACLX,KAAKY,e,CAKVA,eACJ,GAAIZ,KAAKU,WAAaV,KAAKa,MAAO,CAC9B,OACIL,EAAA,QAAMM,MAAM,6DAA2D,I,CAM/E,GAAId,KAAKU,SAAU,CACf,OAAOF,EAAA,kBAAgBK,MAAOb,KAAKa,O,CAGvC,OACIL,EAAA,6BACIO,SAAUf,KAAKC,aACfY,MAAOb,KAAKa,O,CAKhBF,cACJ,IAAKX,KAAKgB,MAAO,CACb,M,CAGJ,OAAOR,EAAA,cAASR,KAAKgB,M"}