@limetech/lime-elements 38.47.4 → 38.48.0

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

@@ -50,6 +50,26 @@ export interface MenuItem<T = any> {
      * Additional supporting text to display in the menu item.
      */
     secondaryText?: string;
+    /**
+     * Alternative text for assistive technologies (e.g. screen readers).
+     *
+     * When provided, this text will be announced by screen readers instead
+     * of the visible `text` and `secondaryText`. The visual appearance
+     * remains unchanged.
+     *
+     * Use this when the visible text is too brief or relies on visual
+     * context (like icons) that isn't accessible to screen reader users.
+     *
+     * @example
+     * ```tsx
+     * {
+     *     text: 'Person',
+     *     icon: 'add',
+     *     assistiveText: 'Create a new person'
+     * }
+     * ```
+     */
+    assistiveText?: string;
     /**
      * True if the menu item should be disabled.
      */

package/dist/types/components.d.ts

@@ -2248,6 +2248,7 @@ export namespace Components {
      * @exampleComponent limel-example-list-item-actions
      * @exampleComponent limel-example-list-item-primary-component
      * @exampleComponent limel-example-list-item-command-text
+     * @exampleComponent limel-example-list-item-assistive-text
      * @private 
      */
     interface LimelListItem {
@@ -2255,6 +2256,10 @@ export namespace Components {
           * {@inheritdoc ListItem.selected}
          */
         "actions"?: ListItem['actions'];
+        /**
+          * {@inheritdoc ListItem.assistiveText}
+         */
+        "assistiveText"?: string;
         /**
           * Set to `true` if the list should display larger icons with a background
           * @default false
@@ -5226,6 +5231,7 @@ declare global {
      * @exampleComponent limel-example-list-item-actions
      * @exampleComponent limel-example-list-item-primary-component
      * @exampleComponent limel-example-list-item-command-text
+     * @exampleComponent limel-example-list-item-assistive-text
      * @private 
      */
     interface HTMLLimelListItemElement extends Components.LimelListItem, HTMLStencilElement {
@@ -8475,6 +8481,7 @@ declare namespace LocalJSX {
      * @exampleComponent limel-example-list-item-actions
      * @exampleComponent limel-example-list-item-primary-component
      * @exampleComponent limel-example-list-item-command-text
+     * @exampleComponent limel-example-list-item-assistive-text
      * @private 
      */
     interface LimelListItem {
@@ -8482,6 +8489,10 @@ declare namespace LocalJSX {
           * {@inheritdoc ListItem.selected}
          */
         "actions"?: ListItem['actions'];
+        /**
+          * {@inheritdoc ListItem.assistiveText}
+         */
+        "assistiveText"?: string;
         /**
           * Set to `true` if the list should display larger icons with a background
           * @default false
@@ -10997,6 +11008,7 @@ declare module "@stencil/core" {
              * @exampleComponent limel-example-list-item-actions
              * @exampleComponent limel-example-list-item-primary-component
              * @exampleComponent limel-example-list-item-command-text
+             * @exampleComponent limel-example-list-item-assistive-text
              * @private 
              */
             "limel-list-item": LocalJSX.LimelListItem & JSXBase.HTMLAttributes<HTMLLimelListItemElement>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@limetech/lime-elements",
-  "version": "38.47.4",
+  "version": "38.48.0",
   "description": "Lime Elements",
   "author": "Lime Technologies",
   "license": "Apache-2.0",
@@ -47,7 +47,7 @@
     "@stencil/sass": "^3.2.2",
     "@types/codemirror": "^5.60.2",
     "@types/html-escaper": "^3.0.4",
-    "@types/jest": "^27.4.0",
+    "@types/jest": "^29.5.14",
     "@types/lodash-es": "^4.17.12",
     "@types/react": "^19.1.10",
     "@types/react-dom": "^19.1.7",
@@ -60,8 +60,8 @@
     "glob": "^13.0.1",
     "globals": "^16.0.0",
     "html-escaper": "^3.0.3",
-    "jest": "^27.5.1",
-    "jest-cli": "^27.5.1",
+    "jest": "^29.7.0",
+    "jest-cli": "^29.7.0",
     "jsonlint-mod": "^1.7.6",
     "jsx-dom": "^8.1.6",
     "kompendium": "^1.0.0",

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

@@ -1 +0,0 @@
-import{r as e,h as i,H as o}from"./p-BudcI_o9.js";import{g as t}from"./p-COzG_Mhw.js";import{c as l}from"./p-JbKhhoXs.js";import{C as r}from"./p-ngNtOjhe.js";import{t as a}from"./p-6rJPElLH.js";const s=class{constructor(o){e(this,o),this.language="en",this.disabled=!1,this.iconSize="small",this.badgeIcon=!1,this.selected=!1,this.type="listitem",this.renderLabel=()=>i("span",{class:"label",id:this.labelId},this.text),this.renderDescription=()=>{if(this.secondaryText)return i("span",{class:"description",id:this.descriptionId},this.secondaryText)},this.renderIcon=()=>{const e=t(this.icon);if(!e)return;let o,l,r;return"object"==typeof this.icon&&(o=this.icon.color,l=this.icon.backgroundColor,r=this.icon.title),i("limel-icon",Object.assign({},{"aria-label":r,"aria-hidden":r?null:"true",name:e,style:{color:o,"background-color":l},badge:this.badgeIcon,size:this.iconSize}))},this.renderPrimaryComponent=()=>{const e=this.primaryComponent;if(null==e?void 0:e.name)return i(e.name,Object.assign({},e.props||{}))},this.renderImage=()=>{if(this.image)return i("img",{src:this.image.src,alt:this.image.alt,loading:"lazy"})},this.renderActionMenu=e=>{if(!e||0===e.length)return;const o=this.getStableActions(e);return i("limel-menu",{class:"mdc-deprecated-list-item__meta",items:o,openDirection:"left-start"},i("limel-icon-button",{class:"action-menu-trigger",slot:"trigger",icon:"menu_2",label:this.actionMenuLabel()}))},this.renderRadioButton=()=>{if("radio"===this.type)return i("limel-radio-button",{id:`radio_${this.labelId}`,checked:this.selected,disabled:this.disabled})},this.renderCheckbox=()=>{if("checkbox"===this.type)return i(r,{id:`checkbox_${this.labelId}`,checked:this.selected,disabled:this.disabled})},this.actionMenuLabel=()=>a.get("file-viewer.more-actions",this.language),this.labelId=l(),this.descriptionId=l()}render(){var e;const t={"aria-labelledby":this.labelId,"aria-describedby":this.secondaryText?this.descriptionId:void 0,"aria-disabled":this.disabled?"true":"false"};return"radio"===this.type||"checkbox"===this.type?t["aria-checked"]=this.selected?"true":"false":"option"!==this.type&&"menuitem"!==this.type||(t["aria-selected"]=this.selected?"true":"false"),i(o,Object.assign({key:"208b9b54451138beec286cc218785bb6c0ec4181",role:this.getHostRole(),class:{"has-primary-component":!!(null===(e=this.primaryComponent)||void 0===e?void 0:e.name)}},t),this.renderRadioButton(),this.renderCheckbox(),this.renderIcon(),this.renderImage(),this.renderPrimaryComponent(),i("div",{key:"e56cb40dc7a707942b2e4595a874db509915c060",class:"text"},this.renderLabel(),this.renderDescription()),this.renderActionMenu(this.actions))}getStableActions(e){return this.memoizedActions===e?this.memoizedActions:(this.memoizedActions=e,e)}getHostRole(){switch(this.type){case"option":return"option";case"radio":return"radio";case"checkbox":return"checkbox";case"menuitem":return"menuitem";default:return"listitem"}}};s.style='@charset "UTF-8";*,*:before,*:after{box-sizing:border-box}.boolean-input{--limel-boolean-input-box-size:1.25rem;--limel-boolean-input-gap-size:0.5rem;position:relative;isolation:isolate;display:flex;align-items:center;min-height:var(--limel-checkbox-min-height, 2.5rem);width:100%}.boolean-input input[type=checkbox],.boolean-input input[type=radio]{position:absolute;width:0;height:0;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0, 0, 0, 0);clip-path:inset(50%);white-space:nowrap;-webkit-appearance:none;-moz-appearance:none;appearance:none}label.boolean-input-label{min-width:var(--limel-boolean-input-box-size);min-height:var(--limel-boolean-input-box-size);padding-top:0.125rem;cursor:pointer;position:relative;width:100%;font-size:var(--limel-theme-default-small-font-size);color:var(--limel-theme-text-primary-on-background-color);padding-left:calc(var(--limel-boolean-input-box-size) + var(--limel-boolean-input-gap-size))}.disabled:not([readonly]):not([readonly=true]) label.boolean-input-label{cursor:not-allowed;color:var(--limel-theme-text-disabled-color)}.required label.boolean-input-label:after{margin-left:0.0625rem;content:"*"}.invalid:not(.readonly) label.boolean-input-label{color:var(--limel-theme-error-text-color)}:host(limel-checkbox.hide-label) label.boolean-input-label,.hide-label label.boolean-input-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;opacity:0;width:var(--limel-boolean-input-box-size)}.box{position:absolute;pointer-events:none;transition:border-color 0.4s ease 0.2s, background-color 0.2s ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease;display:inline-block;vertical-align:middle;width:var(--limel-boolean-input-box-size);height:var(--limel-boolean-input-box-size);margin-right:var(--limel-boolean-input-gap-size);border-radius:var(--limel-boolean-input-box-border-radius);border:0.125rem solid;border-color:var(--checkbox-unchecked-border-color, rgb(var(--contrast-900)));background-color:var(--limel-checkbox-background-color, rgb(var(--contrast-300)));}.checked .box,.boolean-input>input[type=checkbox]:checked+.box,.boolean-input>input[type=radio]:checked+.box{background-color:var(--lime-primary-color, var(--limel-theme-primary-color));border-color:var(--lime-primary-color, var(--limel-theme-primary-color))}.disabled .box{opacity:0.4}.box{}.boolean-input:not(.disabled):hover .box{will-change:box-shadow;box-shadow:var(--button-shadow-hovered)}.boolean-input:not(.disabled):active .box{will-change:box-shadow;box-shadow:var(--button-shadow-pressed)}.box:before{transition:color var(--limel-clickable-transition-speed, 0.4s) ease, background-color var(--limel-clickable-transition-speed, 0.4s) ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease, transform var(--limel-clickable-transform-speed, 0.4s) var(--limel-clickable-transform-timing-function, ease);content:"";position:absolute;inset:-0.1875rem;border-radius:inherit;}.boolean-input>input[type=checkbox]:focus-visible+.box:before,.boolean-input>input[type=radio]:focus-visible+.box:before{will-change:box-shadow;box-shadow:var(--shadow-depth-8-focused)}.box:after{transition:opacity 0.2s ease, width 0.4s ease, box-shadow 0.6s cubic-bezier(0.68, -0.55, 0, 1.87), transform 0.6s cubic-bezier(0.68, -0.55, 0, 1.87);content:"";position:absolute;inset:0;margin:auto;border-radius:1rem;opacity:0;background-color:rgb(var(--color-white));}.boolean-input:not(.disabled):hover .box:after{will-change:opacity, box-shadow, transform, width}:host(limel-checkbox){min-height:var(--limel-checkbox-min-height, 2.5rem)}.box:after{height:0.125rem;width:0.25rem}.indeterminate .box:after{opacity:1;width:calc(var(--limel-boolean-input-box-size) - 0.5rem)}.checkbox{--limel-boolean-input-box-border-radius:0.25rem}.checkbox svg.check-mark{position:absolute;z-index:1;inset:0;transform:translate3d(-0.125rem, -0.125rem, 0);width:var(--limel-boolean-input-box-size);height:var(--limel-boolean-input-box-size);padding:0.25rem;color:rgb(var(--color-white));opacity:0;stroke-width:0.1875rem;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}.checkbox svg.check-mark path{stroke-dashoffset:29.7833;stroke-dasharray:29.7833;transition:stroke-dashoffset 180ms cubic-bezier(0.4, 0, 0.6, 1)}.checkbox{}.checkbox:not(.indeterminate)>input[type=checkbox]:checked+.box svg.check-mark{opacity:1}.checkbox:not(.indeterminate)>input[type=checkbox]:checked+.box svg.check-mark path{stroke-dashoffset:0}limel-dynamic-label{margin-top:0.375rem;margin-left:-0.25rem}:host(limel-checkbox:focus),:host(limel-checkbox:focus-visible),:host(limel-checkbox:focus-within){--limel-h-l-grid-template-rows-transition-speed:0.46s;--limel-h-l-grid-template-rows:1fr}:host(limel-checkbox){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}:host(limel-checkbox:focus) limel-helper-line,:host(limel-checkbox:focus-visible) limel-helper-line,:host(limel-checkbox:focus-within) limel-helper-line,:host(limel-checkbox:hover) limel-helper-line{will-change:grid-template-rows}*,*:before,*:after{box-sizing:border-box}limel-list-item{min-height:2.5rem}limel-list-item:focus{outline:none}limel-list-item:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}limel-list-item{transition:background-color 0.6s ease;position:relative;isolation:isolate;display:flex;align-items:center;gap:0.5rem;padding:0 1rem;background-color:rgb(var(--contrast-100))}limel-list-item:hover{z-index:1;transition:background-color 0.2s ease;border-radius:0.5rem}limel-list-item:focus,limel-list-item:focus-visible,limel-list-item:active{z-index:1;border-radius:0.5rem}limel-list-item:first-of-type{border-top-left-radius:0.5rem;border-top-right-radius:0.5rem}limel-list-item:last-of-type{border-bottom-left-radius:0.5rem;border-bottom-right-radius:0.5rem}limel-list-item:not([disabled]):not([disabled=true]){cursor:pointer}limel-list-item[disabled]:not([disabled=false]){cursor:not-allowed}limel-list-item[disabled]:not([disabled=false]){cursor:not-allowed}limel-list-item[disabled]:not([disabled=false]) .text,limel-list-item[disabled]:not([disabled=false]) limel-icon,limel-list-item[disabled]:not([disabled=false]) img,limel-list-item[disabled]:not([disabled=false]) .boolean-input{opacity:0.4}limel-list-item:not([disabled]):not([disabled=true]):hover,limel-list-item:not([disabled]):not([disabled=true]):focus-visible{background-color:rgb(var(--contrast-400))}limel-list-item[type=option]:before{transition:background-color 0.6s ease;content:"";position:absolute;inset:0;opacity:0.2;border-radius:0.5rem}limel-list-item[type=option][selected]:not([selected=false]):before{transition:background-color 0.2s ease;background-color:var(--limel-theme-primary-color)}limel-list-item .text{flex-grow:1;min-width:0;display:flex;flex-direction:column;padding:0.5rem 0;color:var(--limel-theme-text-primary-on-background-color)}limel-list-item .label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:var(--limel-theme-default-font-size);line-height:1rem}limel-list-item .description{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:var(--maxLinesSecondaryText);line-height:1rem;font-size:var(--limel-theme-default-small-font-size);opacity:0.6}limel-list-item limel-icon{color:var(--limel-theme-text-secondary-on-background-color);flex-shrink:0;margin-left:-0.5rem}limel-list-item limel-icon:has(+img){margin-left:0;position:absolute;top:0.125rem;left:0.125rem;padding:0.1875rem;width:1.25rem;background-color:rgb(var(--contrast-200), 0.8)}limel-list-item img{flex-shrink:0;object-fit:cover;border-radius:50%;width:2rem;height:2rem;box-shadow:0 0 0 1px rgb(var(--contrast-800), 0.5)}limel-list-item limel-menu{margin-right:-0.5rem;order:var(--limel-list-item-menu-order, 3)}limel-list-item[role=menuitem] limel-list-item .label{font-size:var(--limel-theme-default-small-font-size)}.boolean-input,limel-radio-button{width:var(--limel-boolean-input-box-size) !important;margin-left:-0.25rem !important}.boolean-input.checkbox{margin-right:0.25rem}limel-list-item:has(limel-icon) .boolean-input,limel-list-item:has(img) .boolean-input{margin-right:-0.25rem;margin-left:0;order:2}.boolean-input .boolean-input-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;opacity:0;width:var(--limel-boolean-input-box-size)}';export{s as limel_list_item}