@limetech/lime-elements 40.12.1 → 40.12.2

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

@@ -62,6 +62,31 @@ export declare class ProsemirrorAdapter {
      * Specifies the visual appearance of the editor.
      */
     ui: EditorUiType;
+    /**
+     * The name of the editable area, read by assistive technology.
+     * Ids cannot be referenced across a shadow root, so a label that is
+     * rendered outside of the adapter cannot name the editable area.
+     */
+    accessibleLabel?: string;
+    /**
+     * The description of the editable area, read by assistive technology
+     * after its name.
+     */
+    accessibleDescription?: string;
+    /**
+     * A hint about what to type, which is exposed as the placeholder of the
+     * editable area. It is not shown by the adapter.
+     */
+    accessiblePlaceholder?: string;
+    /**
+     * Set to `true` to indicate that the editable area is required.
+     */
+    required?: boolean;
+    /**
+     * Set to `true` to indicate that the current value of the editable area
+     * is invalid.
+     */
+    invalid?: boolean;
     private host;
     private portalId;
     private view;
@@ -90,6 +115,7 @@ export declare class ProsemirrorAdapter {
     private transactionFired;
     private lastClickedPos;
     private focusRestoreTimeout;
+    private hadFocusWhenDisabled;
     private metadata;
     /**
      *  Used to stop change event emitting as result of getting updated value from consumer
@@ -142,6 +168,8 @@ export declare class ProsemirrorAdapter {
      * their own copy when calling this.
      */
     clear(): Promise<void>;
+    protected watchEditableAttributes(): void;
+    protected watchDisabled(disabled: boolean): void;
     protected watchValue(newValue: string): void;
     componentWillLoad(): void;
     componentDidLoad(): void;
@@ -149,12 +177,17 @@ export declare class ProsemirrorAdapter {
     disconnectedCallback(): void;
     render(): any;
     renderToolbar(): any;
+    private getToolbarItems;
     renderLinkMenu(): any;
     private validateInlineImages;
     private setupContentConverter;
     private getActionBarItems;
     private getTranslatedItem;
     private initializeTextEditor;
+    private readonly isEditable;
+    private updateEditableProps;
+    private restoreFocus;
+    private getEditableAttributes;
     private initializeSchema;
     private parseInitialContent;
     private createEditorState;
@@ -165,6 +198,7 @@ export declare class ProsemirrorAdapter {
     private removeImagesFromCache;
     private handleActionBarItem;
     private handleCancelLinkMenu;
+    private closeLinkMenu;
     private handleSaveLinkMenu;
     private handleLinkChange;
     private handleFocus;

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

@@ -26,6 +26,7 @@ import { EditorUiType } from './types';
  * @exampleComponent limel-example-text-editor-ui
  * @exampleComponent limel-example-text-editor-custom-element
  * @exampleComponent limel-example-text-editor-triggers
+ * @exampleComponent limel-example-text-editor-accessibility
  * @exampleComponent limel-example-text-editor-composite
  * @beta
  */
@@ -191,10 +192,7 @@ export declare class TextEditor implements FormComponent<string> {
      * @alpha
      */
     triggerChange: EventEmitter<TriggerEventDetail>;
-    private readonly helperTextId;
-    private readonly editorId;
     private adapterElement?;
-    constructor();
     /**
      * Emits any pending `change` event immediately, instead of waiting
      * for the debounce delay to elapse. Does nothing if no change is

package/dist/types/components.d.ts

@@ -3308,6 +3308,18 @@ export namespace Components {
      * @private 
      */
     interface LimelProsemirrorAdapter {
+        /**
+          * The description of the editable area, read by assistive technology after its name.
+         */
+        "accessibleDescription"?: string;
+        /**
+          * The name of the editable area, read by assistive technology. Ids cannot be referenced across a shadow root, so a label that is rendered outside of the adapter cannot name the editable area.
+         */
+        "accessibleLabel"?: string;
+        /**
+          * A hint about what to type, which is exposed as the placeholder of the editable area. It is not shown by the adapter.
+         */
+        "accessiblePlaceholder"?: string;
         /**
           * Clear the editor's content imperatively.  Assigning an empty `value` prop only clears the editor when the value changes. The editor debounces its `change` event, so a consumer's bound value can lag the live document; assigning `''` when the prop was already `''` is skipped by change detection and would leave the typed content untouched — for example, clearing the editor right after a send. Use this to empty the editor regardless of the prop's change detection.  Does not emit a `change` event. Consumers that mirror the editor content on `change` (drafts, validation, dirty state) should reset their own copy when calling this.
          */
@@ -3339,10 +3351,20 @@ export namespace Components {
           * @alpha
          */
         "inlineImages"?: InlineImages;
+        /**
+          * Set to `true` to indicate that the current value of the editable area is invalid.
+          * @default false
+         */
+        "invalid"?: boolean;
         /**
           * Defines the language for translations.
          */
         "language": Languages;
+        /**
+          * Set to `true` to indicate that the editable area is required.
+          * @default false
+         */
+        "required"?: boolean;
         /**
           * set to private to avoid usage while under development
           * @private 
@@ -4121,6 +4143,7 @@ export namespace Components {
      * @exampleComponent limel-example-text-editor-ui
      * @exampleComponent limel-example-text-editor-custom-element
      * @exampleComponent limel-example-text-editor-triggers
+     * @exampleComponent limel-example-text-editor-accessibility
      * @exampleComponent limel-example-text-editor-composite
      * @beta 
      */
@@ -6956,6 +6979,7 @@ declare global {
      * @exampleComponent limel-example-text-editor-ui
      * @exampleComponent limel-example-text-editor-custom-element
      * @exampleComponent limel-example-text-editor-triggers
+     * @exampleComponent limel-example-text-editor-accessibility
      * @exampleComponent limel-example-text-editor-composite
      * @beta 
      */
@@ -10536,6 +10560,18 @@ declare namespace LocalJSX {
      * @private 
      */
     interface LimelProsemirrorAdapter {
+        /**
+          * The description of the editable area, read by assistive technology after its name.
+         */
+        "accessibleDescription"?: string;
+        /**
+          * The name of the editable area, read by assistive technology. Ids cannot be referenced across a shadow root, so a label that is rendered outside of the adapter cannot name the editable area.
+         */
+        "accessibleLabel"?: string;
+        /**
+          * A hint about what to type, which is exposed as the placeholder of the editable area. It is not shown by the adapter.
+         */
+        "accessiblePlaceholder"?: string;
         /**
           * The type of content that the editor should handle and emit, defaults to `markdown`  Assumed to be set only once, so not reactive to changes
           * @default 'markdown'
@@ -10559,6 +10595,11 @@ declare namespace LocalJSX {
           * @alpha
          */
         "inlineImages"?: InlineImages;
+        /**
+          * Set to `true` to indicate that the current value of the editable area is invalid.
+          * @default false
+         */
+        "invalid"?: boolean;
         /**
           * Defines the language for translations.
          */
@@ -10585,6 +10626,11 @@ declare namespace LocalJSX {
           * @alpha
          */
         "onMetadataChange"?: (event: LimelProsemirrorAdapterCustomEvent<EditorMetadata>) => void;
+        /**
+          * Set to `true` to indicate that the editable area is required.
+          * @default false
+         */
+        "required"?: boolean;
         /**
           * set to private to avoid usage while under development
           * @private 
@@ -11444,6 +11490,7 @@ declare namespace LocalJSX {
      * @exampleComponent limel-example-text-editor-ui
      * @exampleComponent limel-example-text-editor-custom-element
      * @exampleComponent limel-example-text-editor-triggers
+     * @exampleComponent limel-example-text-editor-accessibility
      * @exampleComponent limel-example-text-editor-composite
      * @beta 
      */
@@ -12182,6 +12229,11 @@ declare namespace LocalJSX {
         "language": Languages;
         "disabled": boolean;
         "ui": EditorUiType;
+        "accessibleLabel": string;
+        "accessibleDescription": string;
+        "accessiblePlaceholder": string;
+        "required": boolean;
+        "invalid": boolean;
     }
     interface LimelRadioButtonAttributes {
         "checked": boolean;
@@ -13857,6 +13909,7 @@ declare module "@stencil/core" {
              * @exampleComponent limel-example-text-editor-ui
              * @exampleComponent limel-example-text-editor-custom-element
              * @exampleComponent limel-example-text-editor-triggers
+             * @exampleComponent limel-example-text-editor-accessibility
              * @exampleComponent limel-example-text-editor-composite
              * @beta 
              */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@limetech/lime-elements",
-  "version": "40.12.1",
+  "version": "40.12.2",
   "description": "Lime Elements",
   "author": "Lime Technologies",
   "license": "Apache-2.0",
@@ -70,7 +70,7 @@
     "@types/react": "^19.3.0",
     "@types/react-dom": "^19.3.0",
     "@types/tabulator-tables": "^6.3.6",
-    "@vitest/browser-playwright": "^4.1.11",
+    "@vitest/browser-playwright": "^4.1.12",
     "axe-core": "4.14.0",
     "codemirror": "^5.65.9",
     "cross-env": "^10.1.0",
@@ -93,7 +93,7 @@
     "morphdom": "^2.7.8",
     "number-abbreviate": "^2.0.0",
     "parse-css-color": "^0.2.1",
-    "postal-mime": "^4.0.6",
+    "postal-mime": "^4.0.7",
     "prettier": "^3.9.10",
     "prosemirror-example-setup": "^1.2.3",
     "prosemirror-markdown": "^1.13.8",

package/dist/lime-elements/p-0e662a3c.entry.js

@@ -1 +0,0 @@
-import{r as t,c as e,h as i,H as r}from"./p-BU9IJqli.js";import{c as o}from"./p-BrjD-ITe.js";const l=class{constructor(r){t(this,r),this.change=e(this,"change",7),this.imagePasted=e(this,"imagePasted",7),this.imageRemoved=e(this,"imageRemoved",7),this.metadataChange=e(this,"metadataChange",7),this.triggerStart=e(this,"triggerStart",7),this.triggerStop=e(this,"triggerStop",7),this.triggerChange=e(this,"triggerChange",7),this.contentType="markdown",this.language="en",this.disabled=!1,this.readonly=!1,this.invalid=!1,this.customElements=[],this.triggers=[],this.required=!1,this.allowResize=!0,this.ui="standard",this.renderHelperLine=()=>{if(this.helperText)return i("limel-helper-line",{helperText:this.helperText,helperTextId:this.helperTextId,invalid:this.isInvalid()})},this.isInvalid=()=>!this.readonly&&(!!this.invalid||void 0),this.handleChange=t=>{t.stopPropagation(),this.change.emit(t.detail)},this.handleImagePasted=t=>{t.stopPropagation(),this.imagePasted.emit(t.detail)},this.handleMetadataChange=t=>{t.stopPropagation(),this.metadataChange.emit(t.detail)},this.handleImageRemoved=t=>{t.stopPropagation(),this.imageRemoved.emit(t.detail)},this.helperTextId=o(),this.editorId=o()}async flushPendingChanges(){var t;await(null===(t=this.adapterElement)||void 0===t?void 0:t.flushPendingChanges())}async clear(){var t;await(null===(t=this.adapterElement)||void 0===t?void 0:t.clear())}render(){return i(r,{key:"8a5ca6c89305056819747e51cd808f35036c8666"},i("limel-notched-outline",{key:"eb4bd944033212a2ec88d664aa1096fc3b07a5cf",labelId:this.editorId,label:this.label,required:this.required,invalid:this.invalid,disabled:this.disabled,readonly:this.readonly,hasValue:!!this.value,hasFloatingLabel:!0},this.renderEditor(),this.renderPlaceholder()),this.renderHelperLine())}renderEditor(){return this.readonly?i("limel-markdown",{slot:"content",value:this.value,id:this.editorId}):i("limel-prosemirror-adapter",{ref:t=>this.adapterElement=t,slot:"content","aria-placeholder":this.placeholder,contentType:this.contentType,onChange:this.handleChange,onImagePasted:this.handleImagePasted,onImageRemoved:this.handleImageRemoved,onMetadataChange:this.handleMetadataChange,customElements:this.customElements,inlineImages:this.inlineImages,value:this.value,id:this.editorId,"aria-disabled":this.disabled,"aria-invalid":this.invalid,"aria-required":this.required,language:this.language,triggerCharacters:this.triggers,disabled:this.disabled,ui:this.ui})}renderPlaceholder(){if(this.placeholder&&!this.value)return i("span",{class:"placeholder","aria-hidden":"true",slot:"content"},this.placeholder)}static get delegatesFocus(){return!0}};l.style='@charset "UTF-8";*{box-sizing:border-box}:host(limel-text-editor){--limel-notched-outline-z-index:2;--limel-prosemirror-adapter-toolbar-opacity:0.6;--limel-text-editor-padding:0.25rem 1rem 0.75rem 1rem;--limel-prosemirror-adapter-toolbar-grid-template-rows:1fr;--limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration:0.3s;--limel-prosemirror-adapter-toolbar-transition-timing-function:cubic-bezier(       0.19,       0.23,       0.26,       0.89   );position:relative;isolation:isolate;display:flex;flex-direction:column;width:100%;min-width:5rem;min-height:5rem;height:100%;max-height:var(--text-editor-max-height, calc(100vh - (env(safe-area-inset-top) + env(safe-area-inset-bottom)) - 4rem));padding:1px}:host(limel-text-editor) limel-notched-outline{height:100%}:host(limel-text-editor:focus-within),:host(limel-text-editor:not([ui=minimal]):hover){--limel-prosemirror-adapter-toolbar-opacity:1}:host(limel-text-editor[ui=minimal]:not(:focus-within)){--limel-prosemirror-adapter-toolbar-grid-template-rows:0fr;--limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration:0.46s;--limel-prosemirror-adapter-action-bar-padding-top-bottom:0;--limel-prosemirror-adapter-toolbar-opacity:0}:host(limel-text-editor[ui=minimal]:not(:focus-within)),:host(limel-text-editor[ui=no-toolbar]){--limel-text-editor-padding:0.75rem 1rem 0.75rem 1rem;--limel-text-editor-placeholder-top:0;min-height:2.5rem}:host(limel-text-editor[ui=minimal]:not(:focus-within)) limel-prosemirror-adapter,:host(limel-text-editor[ui=no-toolbar]) limel-prosemirror-adapter{min-height:2.5rem}:host(limel-text-editor:focus-within) .placeholder,:host(limel-text-editor:focus) .placeholder{opacity:0}:host(limel-text-editor[disabled]:not([disabled=false])) limel-prosemirror-adapter{cursor:not-allowed;opacity:0.4;pointer-events:none}:host(limel-text-editor[readonly]:not([readonly=false])){--limel-text-editor-padding:0.75rem 1rem 0.75rem 1rem;--limel-text-editor-placeholder-top:0}:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown{display:block;padding:var(--limel-text-editor-padding);overflow-y:auto;-webkit-overflow-scrolling:touch;height:100%}:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown:before,:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown:after{z-index:1;pointer-events:none;content:"";display:block;position:absolute;width:100%}:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown:after{height:1.75rem;top:0;background:linear-gradient(var(--text-editor-fade-out-background-color, rgb(var(--contrast-100))), transparent)}:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown:before{height:2rem;bottom:-0.25rem;background:linear-gradient(transparent, var(--text-editor-fade-out-background-color, rgb(var(--contrast-100))))}.placeholder{transition-property:top;transition-duration:var(--limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration);transition-timing-function:var(--limel-prosemirror-adapter-toolbar-transition-timing-function);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;position:absolute;top:var(--limel-text-editor-placeholder-top, 2.25rem);left:0;right:0;padding:var(--limel-text-editor-padding);font-style:italic;font-size:var(--limel-theme-default-font-size);color:rgb(var(--contrast-900))}limel-prosemirror-adapter{flex-grow:1;min-width:0;min-height:5rem;height:100%;max-height:100%;overflow:hidden auto;-webkit-overflow-scrolling:touch}:host(limel-text-editor:focus),:host(limel-text-editor:focus-visible),:host(limel-text-editor:focus-within){--limel-h-l-grid-template-rows-transition-speed:0.46s;--limel-h-l-grid-template-rows:1fr}:host(limel-text-editor){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}:host(limel-text-editor:focus) limel-helper-line,:host(limel-text-editor:focus-visible) limel-helper-line,:host(limel-text-editor:focus-within) limel-helper-line,:host(limel-text-editor:hover) limel-helper-line{will-change:grid-template-rows}:host(limel-text-editor[allow-resize]) limel-prosemirror-adapter{resize:vertical}';export{l as limel_text_editor}