@limetech/lime-elements 40.16.0 → 40.17.1

package/dist/lime-elements/p-895a68c5.entry.js

@@ -0,0 +1 @@
+import{r as e,c as o,h as t,a as i}from"./p-BU9IJqli.js";import{c as s}from"./p-BrjD-ITe.js";import{E as r}from"./p-Bu6-QXrA.js";import{f as a,z as l}from"./p-B8Rm8W5O.js";import"./p-ByzvFNMm.js";import"./p-9W8bTt2G.js";import"./p-DbBZn7JO.js";import"./p-BcJ-TDVt.js";import"./p-BJQylLSL.js";import"./p-CZ30nDJE.js";import"./p-BhoYaGlg.js";function n(e){const o=e.closest(".limel-portal--container");return o?o.portalSource:e.getRootNode().host}const p=class{constructor(t){e(this,t),this.close=o(this,"close",7),this.open=!1,this.shouldRestoreFocusOnClose=!1,this.hasWarnedAboutMissingName=!1,this.handleGlobalKeyPress=e=>{e.key===r&&(e.stopPropagation(),e.preventDefault(),this.requestCloseAndRestoreFocus())},this.requestCloseAndRestoreFocus=()=>{this.shouldRestoreFocusOnClose=!0,this.close.emit()},this.setTriggerRef=e=>{this.triggerSlot=e},this.focusTrigger=()=>{var e,o;const t=null===(o=null===(e=this.triggerSlot)||void 0===e?void 0:e.assignedElements())||void 0===o?void 0:o[0];a(t)},this.setTriggerAttributes=e=>{var o;e.setAttribute("aria-haspopup",null!==(o=this.getNamedPopupRole())&&void 0!==o?o:"true"),e.setAttribute("aria-expanded",this.open?"true":"false"),this.setControlledPopup(e),e.setAttribute("role","button")},this.portalId=s(),this.globalClickListener=this.globalClickListener.bind(this)}watchOpen(){this.setupGlobalHandlers(),!this.open&&this.shouldRestoreFocusOnClose&&(this.shouldRestoreFocusOnClose=!1,setTimeout(this.focusTrigger,0))}connectedCallback(){this.setupGlobalHandlers()}disconnectedCallback(){this.teardownGlobalHandlers()}componentWillRender(){this.warnIfRoleHasNoName()}componentDidRender(){if(this.triggerSlot)for(const e of this.triggerSlot.assignedElements())this.setTriggerAttributes(e)}setupGlobalHandlers(){this.open&&this.host.isConnected?(document.addEventListener("click",this.globalClickListener,{capture:!0}),document.addEventListener("keydown",this.handleGlobalKeyPress)):this.teardownGlobalHandlers()}teardownGlobalHandlers(){document.removeEventListener("click",this.globalClickListener,{capture:!0}),document.removeEventListener("keydown",this.handleGlobalKeyPress)}render(){const e=this.getCssProperties(),o=getComputedStyle(this.host).getPropertyValue("--popover-z-index");return t("div",{key:"f314178b0648433c2e764a31b64c94c85f31d7ce",class:"trigger-anchor"},t("slot",{key:"93953d9f7bf5c1c0550e445a4e49591029408725",name:"trigger",ref:this.setTriggerRef}),t("limel-portal",{key:"01d43457e8eeebd3c135ea823bb26e0e3e336d12",visible:this.open,containerId:this.portalId,containerStyle:{"z-index":o},openDirection:this.openDirection},t("limel-popover-surface",{key:"6c368bcc7a3914fa62525b01f912cf4d0e640531",contentCollection:this.host.children,popupRole:this.getNamedPopupRole(),accessibleLabel:this.accessibleLabel,style:e})))}globalClickListener(e){const o=function(e,o){var t;let i=o;do{if(e.contains(i)||(null===(t=e.shadowRoot)||void 0===t?void 0:t.contains(i)))return!0;i=n(i)}while(i);return!1}(this.host,e.target);this.open&&!o&&(e.stopPropagation(),e.preventDefault(),this.close.emit())}getCssProperties(){const e=["--popover-surface-width","--popover-body-background-color","--popover-border-radius","--popover-box-shadow"],o=getComputedStyle(this.host),t=e.map((e=>o.getPropertyValue(e)));return l(e,t)}getNamedPopupRole(){return this.accessibleLabel?this.popupRole:void 0}warnIfRoleHasNoName(){const e=!!this.popupRole&&!this.accessibleLabel;e&&!this.hasWarnedAboutMissingName&&console.warn(`limel-popover: popupRole is "${this.popupRole}", but there is no accessibleLabel to name the popup. The role is not used until the popup has a name.`),this.hasWarnedAboutMissingName=e}setControlledPopup(e){const o=document.querySelector(`#${this.portalId}`);"ariaControlsElements"in e?e.ariaControlsElements=o?[o]:null:e.setAttribute("aria-controls",this.portalId)}get host(){return i(this)}static get watchers(){return{open:[{watchOpen:0}]}}};p.style=".trigger-anchor{display:inline-block;position:relative}";const c=class{constructor(o){e(this,o)}componentDidLoad(){this.appendElement()}render(){return t("div",{key:"0391463d9777ee0a43de19b4fcf97e5b1ef120d9",class:"limel-popover-surface",tabindex:"0",role:this.popupRole,"aria-label":this.accessibleLabel})}appendElement(){const e=this.host.shadowRoot.querySelector(".limel-popover-surface"),o=[...this.contentCollection];for(const t of o)"trigger"!==t.slot&&e.append(t)}get host(){return i(this)}};c.style='@charset "UTF-8";:host(limel-popover-surface){isolation:isolate;position:relative;display:flex;width:var(--popover-surface-width, auto);max-height:inherit;max-width:calc(100vw - 2rem);margin:0 0.25rem}.limel-popover-surface{flex:1;min-width:0;min-height:0;border-radius:var(--popover-border-radius, 0.75rem);box-shadow:var(--popover-box-shadow, var(--shadow-depth-16));border:1px solid rgb(var(--contrast-1200), 0.1);backdrop-filter:blur(0.3125rem);-webkit-backdrop-filter:blur(0.3125rem)}.limel-popover-surface:after{transition:opacity 0.4s ease;pointer-events:none;content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;opacity:0.95;border-radius:var(--popover-border-radius, 0.75rem);background-color:var(--popover-body-background-color, var(--lime-elevated-surface-background-color))}.limel-popover-surface:focus{outline:none}.limel-popover-surface:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.limel-popover-surface:focus:after,.limel-popover-surface:focus-within:after{opacity:1}.limel-popover-surface>*{box-sizing:border-box}';export{p as limel_popover,c as limel_popover_surface}

package/dist/lime-elements/p-B3C0kDpZ.js

@@ -0,0 +1 @@
+function e(e){return"number"==typeof e&&Number.isSafeInteger(e)&&e>=1&&e<=6}export{e as i}

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

@@ -0,0 +1 @@
+import{r as t,c as e,h as i,H as a,a as r}from"./p-BU9IJqli.js";import{t as s}from"./p-B26k4gw8.js";import{c as n}from"./p-BrjD-ITe.js";import{g as o}from"./p-ChagAaNf.js";import{g as l}from"./p-CSC2LJ7P.js";const h="en",u=class{constructor(a){t(this,a),this.goToPage=e(this,"goToPage",6),this.page=1,this.pageSize=100,this.totalItems=null,this.loading=!1,this.language="en",this.lastKnownTotalItems=null,this.liveMessage="",this.idPrefix=n(),this.warnedAbout=new Map,this.settledLanguage=h,this.view={page:1,pageCount:null,pageSize:100,totalItems:null,slots:[]},this.renderSlot=(t,e)=>{if("gap"===t.kind)return this.renderGap(e);const a=t.page===this.currentPage;return i("button",{key:`page-${e}`,id:this.slotId(e),class:"page","aria-current":a?"page":null,"aria-disabled":this.loading?"true":null,"aria-label":this.pageLabel(t.page,a),"data-page":t.page,onClick:this.selectPage},this.formatNumber(t.page),this.renderSpinner(a),this.renderTooltip(t.page,e))},this.openJump=t=>{if(this.loading)return;const{index:e}=t.currentTarget.dataset;this.openGap=Number(e)},this.closeJump=()=>{this.openGap=void 0},this.handleJump=t=>{t.stopPropagation();const e=t.detail;this.focusGap(this.openGap),this.openGap=void 0,this.goTo(e)&&(this.awaitedJump=e,this.jumpedFrom=this.view.page)},this.step=t=>{const e=t.currentTarget.dataset.direction;this.isArrowDisabled(e)||this.goTo(this.currentPage+("next"===e?1:-1))},this.selectPage=t=>{const{page:e}=t.currentTarget.dataset;this.goTo(Number(e))},this.translate=(t,e)=>s.get(t,this.language,e)}componentWillRender(){const t=this.knownTotalItems,e=this.usablePageSize,i=this.wholePage(this.page);null!==t&&(this.lastKnownTotalItems=t);const a=this.countPages(null!=t?t:this.lastKnownTotalItems,e),r=this.capToLastPage(i,a);this.view={page:r,pageCount:a,pageSize:e,totalItems:t,slots:this.slotsFor(r,a)},this.closeJumpWithoutAGap(),this.readOut(r),this.reconcile(r,i),this.shownPage=r}countPages(t,e){return null===t?null:Math.max(1,Math.ceil(t/e))}componentDidRender(){this.reportCorrection(),this.followJumpedPage()}reportCorrection(){const t=this.pendingCorrection;void 0!==t&&(this.pendingCorrection=void 0,this.emitGoToPage(t,"clamped"))}readOut(t){const e=this.rangeIdentity(t),i=this.lastRange;this.lastRange=e,void 0!==this.shownPage&&(t!==this.shownPage||null!==e&&null!==i&&e!==i)&&(this.liveMessage=this.rangeLabel(t)||this.pageLabel(t,!0))}rangeIdentity(t){const e=this.itemsOn(t);return null===e?null:`${e.from}:${e.to}`}offsetOf(t){return(t-1)*this.view.pageSize}itemsOn(t){const{totalItems:e,pageSize:i}=this.view;if(null===e)return null;const a=this.offsetOf(t)+1;return{from:a,to:Math.min(a+i-1,e)}}reconcile(t,e){const i=this.page,a=!Object.is(e,i),r=t!==e,s=a||r&&null!==this.view.totalItems;a||r||(this.reportedAsk=void 0),s&&(t===this.shownPage&&Object.is(i,this.reportedAsk)||(this.reportedAsk=i,this.pendingCorrection=t))}handleLanguageChange(){this.numberFormat=void 0}closeJumpWithoutAGap(){var t;const e=this.openGap;void 0!==e&&"gap"!==(null===(t=this.view.slots[e])||void 0===t?void 0:t.kind)&&(this.openGap=void 0)}render(){const{slots:t}=this.view;return i(a,{key:"7d7e26956a5df97a75d2e9d4a8d5b2407b2b65a3"},i("nav",{key:"e2b6b6a1bb513e3136b6fcc2e34c668be8e64089","aria-label":this.translate("pagination.label"),"aria-busy":this.loading?"true":null},this.renderArrow("previous"),t.map(((t,e)=>this.renderSlot(t,e))),this.renderArrow("next")),i("span",{key:"00e74cdbf6ca753b7bac6b4731a5b63c4ac4d338",class:"live-region","aria-live":"polite"},this.liveMessage))}slotsFor(t,e){return null===e?[{kind:"page",page:t}]:l(t,e)}renderGap(t){const{pageCount:e}=this.view;if(null===e)return;const a=this.translate("pagination.jump-to-a-page");return i("limel-popover",{key:`gap-${t}`,open:this.openGap===t,openDirection:"bottom",popupRole:"dialog",accessibleLabel:a,onClose:this.closeJump},i("button",{slot:"trigger",class:"gap",id:this.slotId(t),"aria-label":a,"aria-disabled":this.loading?"true":null,"data-index":t,onClick:this.openJump},"···"),i("limel-pagination-jump",{open:this.openGap===t,page:this.view.page,pageCount:e,loading:this.loading,language:this.languageForNumbers,onJump:this.handleJump}))}focusGap(t){var e;const i=null===(e=this.host.shadowRoot)||void 0===e?void 0:e.querySelector(`[id="${this.slotId(t)}"]`);null==i||i.focus(),this.jumpFocus=i}followJumpedPage(){void 0!==this.awaitedJump&&(this.ownsFocus()?this.view.page===this.awaitedJump?(this.forgetJump(),this.focusCurrentPage()):this.view.page!==this.jumpedFrom&&this.forgetJump():this.forgetJump())}forgetJump(){this.awaitedJump=void 0,this.jumpedFrom=void 0}ownsFocus(){var t,e;return(null===(t=this.host.shadowRoot)||void 0===t?void 0:t.activeElement)===this.jumpFocus||!(null===(e=this.jumpFocus)||void 0===e?void 0:e.isConnected)&&document.activeElement===document.body}focusCurrentPage(){var t;const e=null===(t=this.host.shadowRoot)||void 0===t?void 0:t.querySelector('[aria-current="page"]');null==e||e.focus(),this.jumpFocus=void 0}renderSpinner(t){if(t&&this.loading)return i("limel-spinner",null)}renderTooltip(t,e){return i("limel-tooltip",{elementId:this.slotId(e),label:this.translate("pagination.page",{page:this.formatNumber(t)}),helperLabel:this.rangeLabel(t)})}renderArrow(t){const e=this.isArrowDisabled(t);return i("button",{id:this.arrowId(t),class:`arrow ${t}`,"aria-label":this.translate(`pagination.${t}-page`),"aria-disabled":e?"true":null,"data-direction":t,onClick:this.step},i("span",{"aria-hidden":"true"}),this.renderArrowTooltip(t))}renderArrowTooltip(t){if(this.isArrowDisabled(t))return;const e="next"===t?this.currentPage+1:this.currentPage-1;return i("limel-tooltip",{elementId:this.arrowId(t),label:this.translate(`pagination.go-to-${t}-page`),helperLabel:this.translate("pagination.page",{page:this.formatNumber(e)})})}isArrowDisabled(t){if(this.loading)return!0;const{page:e,pageCount:i}=this.view;return"previous"===t?e<=1:null===i||e>=i}goTo(t){return this.awaitedJump=void 0,!this.loading&&t!==this.currentPage&&(this.emitGoToPage(t,"user"),!0)}get currentPage(){return this.view.page}emitGoToPage(t,e){this.goToPage.emit({page:t,reason:e,pageSize:this.view.pageSize,offset:this.offsetOf(t)})}get knownTotalItems(){const{totalItems:t}=this;return null==t?null:Number.isSafeInteger(t)&&t>=0?(this.warnedAbout.delete("totalItems"),t):(this.warnOnce("totalItems",t,(()=>`\`totalItems\` must be a whole number of at least 0, or null, but was ${t}. Ignoring it and keeping the last count it had.`)),null)}get usablePageSize(){return this.countable("pageSize",this.pageSize,1,100)}wholePage(t){return this.countable("page",t,1,1)}countable(t,e,i,a){return Number.isSafeInteger(e)&&e>=i?(this.warnedAbout.delete(t),e):(this.warnOnce(t,e,(()=>`\`${t}\` must be a whole number of at least ${i}, but was ${e}. Using ${a}.`)),a)}capToLastPage(t,e){return null===e?t:Math.min(t,e)}warnOnce(t,e,i){this.warnedAbout.has(t)&&Object.is(this.warnedAbout.get(t),e)||(this.warnedAbout.set(t,e),console.warn(`limel-pagination: ${i()}`))}pageLabel(t,e){return this.translate(e?"pagination.current-page":"pagination.go-to-page",{page:this.formatNumber(t)})}rangeLabel(t){const{totalItems:e,pageSize:i}=this.view;if(null===e)return"";const a=t*i;return this.translate("pagination.items-range",{from:this.formatNumber((t-1)*i+1),to:this.formatNumber(Math.min(a,e)),total:this.formatNumber(e)})}slotId(t){return`${this.idPrefix}-slot-${t}`}arrowId(t){return`${this.idPrefix}-${t}`}formatNumber(t){var e;return null!==(e=this.numberFormat)&&void 0!==e||(this.numberFormat=this.createNumberFormat()),this.numberFormat.format(t)}get languageForNumbers(){var t;return null!==(t=this.numberFormat)&&void 0!==t||(this.numberFormat=this.createNumberFormat()),this.settledLanguage}createNumberFormat(){const{language:t}=this;try{const e=new Intl.NumberFormat(t),i=e.resolvedOptions().locale;if(o(i)===o(t))return this.warnedAbout.delete("language"),this.settledLanguage=t,e}catch(t){}return this.warnOnce("language",t,(()=>`\`language\` must be one this browser can write numbers in, but was ${JSON.stringify(t)}. Using ${h}.`)),this.settledLanguage=h,new Intl.NumberFormat(h)}get host(){return r(this)}static get watchers(){return{language:[{handleLanguageChange:0}]}}};u.style='@charset "UTF-8";:host(limel-pagination){display:block;box-sizing:border-box}*{box-sizing:border-box}nav{display:flex;align-items:center}button{appearance:none;background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;text-align:inherit}button:focus{outline:none}button:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button{position:relative;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:1.75rem;min-width:1.75rem;border-radius:1.75rem;padding:0 0.5rem;font-variant-numeric:tabular-nums}button:not([aria-disabled=true]):not([aria-current=page]){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);cursor:pointer;color:rgb(var(--contrast-1100));background-color:transparent}button:not([aria-disabled=true]):not([aria-current=page]):hover,button:not([aria-disabled=true]):not([aria-current=page]):focus,button:not([aria-disabled=true]):not([aria-current=page]):focus-visible{will-change:color, background-color, box-shadow, transform}button:not([aria-disabled=true]):not([aria-current=page]):hover,button:not([aria-disabled=true]):not([aria-current=page]):focus-visible{transform:translate3d(0, 0.01rem, 0);color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color)}button:not([aria-disabled=true]):not([aria-current=page]):hover{box-shadow:var(--button-shadow-hovered)}button:not([aria-disabled=true]):not([aria-current=page]):active{--limel-clickable-transform-timing-function:cubic-bezier(       0.83,       -0.15,       0.49,       1.16   );transform:translate3d(0, 0.05rem, 0);box-shadow:var(--button-shadow-pressed)}button:not([aria-disabled=true]):not([aria-current=page]):hover,button:not([aria-disabled=true]):not([aria-current=page]):active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}button[aria-disabled=true]:not([aria-current=page]){opacity:0.4}button[aria-disabled=true]{cursor:default}button[aria-current=page]{background-color:var(--limel-theme-surface-background-color);box-shadow:var(--button-shadow-inset)}button limel-spinner{position:absolute;pointer-events:none}limel-popover{display:inline-flex}.gap{width:1.75rem;padding:0;color:rgb(var(--contrast-1100))}.gap[aria-expanded=true]{box-shadow:var(--button-shadow-inset-pressed) !important}.arrow span{display:block;border-style:solid;border-color:transparent;border-width:0.25rem 0 0.25rem 0.375rem;border-left-color:currentColor;transition:transform 0.2s ease}.arrow.previous span{transform:rotateZ(180deg)}.arrow:not([aria-disabled=true]):hover.next span{transform:translate3d(0.1rem, 0, 0)}.arrow:not([aria-disabled=true]):hover.previous span{transform:translate3d(-0.1rem, 0, 0) rotateZ(180deg)}.live-region{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}';export{u as limel_pagination}

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

@@ -0,0 +1 @@
+import{r as e,c as t,h as r,H as o}from"./p-BU9IJqli.js";const i=class{constructor(o){e(this,o),this.change=t(this,"change",7),this.disabled=!1,this.readonly=!1,this.invalid=!1,this.manualInput=!0,this.isOpen=!1,this.shouldFocus=!1,this.renderTooltip=()=>{if(!this.readonly&&this.tooltipLabel)return r("limel-tooltip",{label:this.tooltipLabel,elementId:"tooltip-button"})},this.renderPickerPalette=()=>this.readonly?this.renderPickerTrigger():r("limel-popover",{open:this.isOpen,openDirection:"bottom-start",popupRole:"dialog",accessibleLabel:this.label,onClose:this.onPopoverClose},this.renderPickerTrigger(),r("limel-color-picker-palette",{ref:this.setColorPickerPaletteElement,value:this.value,label:this.label,helperText:this.helperText,placeholder:this.placeholder,invalid:this.invalid,onChange:this.handleChange,required:this.required,palette:this.palette,columnCount:this.paletteColumnCount,manualInput:this.manualInput})),this.renderPickerTrigger=()=>r("button",{slot:"trigger",style:this.value?{"--background":this.value}:{},role:"button",onClick:this.openPopover,id:"tooltip-button",disabled:this.readonly||this.disabled}),this.setColorPickerPaletteElement=e=>{this.contentElement=e},this.openPopover=e=>{e.stopPropagation(),this.isOpen=!0,this.shouldFocus=this.isOpen},this.onPopoverClose=e=>{e.stopPropagation(),this.isOpen=!1},this.handleChange=e=>{e.stopPropagation(),this.change.emit(e.detail)}}disconnectedCallback(){this.isOpen=!1}componentDidRender(){var e;this.shouldFocus&&this.isOpen&&(this.shouldFocus=!1,null===(e=this.contentElement)||void 0===e||e.focus())}render(){return r(o,{key:"04973de288b9d3f4773a03c351d37f288e9e07bf"},this.renderTooltip(),this.renderPickerPalette(),r("limel-input-field",{key:"93c5ea34c6eef290b1b4cf744b911a4e5de80c1c",label:this.label,helperText:this.helperText,value:this.value,onChange:this.handleChange,required:this.required,readonly:this.readonly,disabled:this.disabled||!this.manualInput,invalid:this.invalid,placeholder:this.placeholder}))}};i.style='@charset "UTF-8";.picker-trigger[style="--background:lime-magenta;"]:after,.chosen-color-preview[style="--background:lime-magenta;"]:after{background-color:var(--lime-magenta)}.picker-trigger[style="--background:lime-blue;"]:after,.chosen-color-preview[style="--background:lime-blue;"]:after{background-color:var(--lime-blue)}.picker-trigger[style="--background:lime-orange;"]:after,.chosen-color-preview[style="--background:lime-orange;"]:after{background-color:var(--lime-orange)}.picker-trigger[style="--background:lime-green;"]:after,.chosen-color-preview[style="--background:lime-green;"]:after{background-color:var(--lime-green)}.picker-trigger[style="--background:lime-red;"]:after,.chosen-color-preview[style="--background:lime-red;"]:after{background-color:var(--lime-red)}.picker-trigger[style="--background:lime-dark-blue;"]:after,.chosen-color-preview[style="--background:lime-dark-blue;"]:after{background-color:var(--lime-dark-blue)}.picker-trigger[style="--background:lime-turquoise;"]:after,.chosen-color-preview[style="--background:lime-turquoise;"]:after{background-color:var(--lime-turquoise)}.picker-trigger[style="--background:lime-yellow;"]:after,.chosen-color-preview[style="--background:lime-yellow;"]:after{background-color:var(--lime-yellow)}.picker-trigger[style="--background:lime-light-grey;"]:after,.chosen-color-preview[style="--background:lime-light-grey;"]:after{background-color:var(--lime-light-grey)}:host(limel-color-picker){display:grid;gap:0.25rem;grid-template-columns:auto 1fr}button[slot=trigger]{appearance:none;background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;text-align:inherit;box-sizing:border-box;position:relative;isolation:isolate;width:2.5rem;height:2.5rem;border-radius:0.5rem}button[slot=trigger]:not([disabled]):not([disabled=true]){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);cursor:pointer;color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal)}button[slot=trigger]:not([disabled]):not([disabled=true]):hover,button[slot=trigger]:not([disabled]):not([disabled=true]):focus,button[slot=trigger]:not([disabled]):not([disabled=true]):focus-visible{will-change:color, background-color, box-shadow, transform}button[slot=trigger]:not([disabled]):not([disabled=true]):hover,button[slot=trigger]:not([disabled]):not([disabled=true]):focus-visible{transform:translate3d(0, -0.04rem, 0);color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button[slot=trigger]:not([disabled]):not([disabled=true]):active{--limel-clickable-transform-timing-function:cubic-bezier(       0.83,       -0.15,       0.49,       1.16   );transform:translate3d(0, 0.05rem, 0);box-shadow:var(--button-shadow-pressed)}button[slot=trigger]:not([disabled]):not([disabled=true]):hover,button[slot=trigger]:not([disabled]):not([disabled=true]):active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}button[slot=trigger]:not([disabled]):not([disabled=true]):focus{outline:none}button[slot=trigger]:not([disabled]):not([disabled=true]):focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button[slot=trigger]:before,button[slot=trigger]:after{content:"";position:absolute;inset:0;border-radius:inherit}button[slot=trigger]:before{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns=\'http://www.w3.org/2000/svg\'%20viewBox=\'0%200%208%208\'%20style=\'fill-rule:evenodd;\'%3E%3Cpath%20fill=\'rgba(186,186,192,0.16)\'%20d=\'M0%200h4v4H0zM4%204h4v4H4z\'/%3E%3C/svg%3E");background-size:0.5rem;z-index:0}button[slot=trigger]:after{z-index:1;box-shadow:0 0 0 0.25rem rgb(var(--contrast-100)) inset;background:var(--background)}:host([readonly]:not([readonly=false])) limel-input-field{transform:translateX(calc(2.5rem / 4 * -1)) translateY(calc(2.5rem / 4))}:host([readonly]:not([readonly=false])) button[slot=trigger],:host([disabled]:not([disabled=false])) button[slot=trigger]{border:1px solid rgba(var(--contrast-700), 0.65)}';export{i as limel_color_picker}

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

@@ -0,0 +1 @@
+import{r as e,c as o,h as t,a as i}from"./p-BU9IJqli.js";import{d as n}from"./p-z_E3sq3p.js";import{m as s,r}from"./p-CIf8aGSd.js";import{c as a}from"./p-BrjD-ITe.js";import{b as l,d as c,g as d}from"./p-CgNJbSP4.js";import{t as p}from"./p-B26k4gw8.js";import{i as h}from"./p-B3C0kDpZ.js";import"./p-ChagAaNf.js";const g=class{constructor(i){e(this,i),this.open=o(this,"open",7),this.close=o(this,"close",7),this.action=o(this,"action",7),this.isOpen=!1,this.headingLevel=2,this.invalid=!1,this.language="en",this.bodyId=a(),this.headingId=a(),this.onClick=()=>{this.handleInteraction()},this.handleInteraction=()=>{this.isOpen=!this.isOpen,this.isOpen?(this.open.emit(),setTimeout(n,100)):this.close.emit()},this.renderExpandCollapseSign=()=>t("div",{class:"expand-icon",role:"presentation","aria-hidden":"true"},t("div",{class:"line"}),t("div",{class:"line"}),t("div",{class:"line"}),t("div",{class:"line"})),this.renderIcon=()=>{if(!this.icon)return;const e=d(this.icon),o=l(this.icon),i=c(this.icon);return t("limel-icon",{name:e,"aria-label":i,"aria-hidden":i?null:"true",style:{color:`${o}`}})},this.renderHeading=()=>{if(!this.header)return;const e=`h${this.getHeadingLevel()}`;return t(e,{class:"title mdc-typography mdc-typography--headline2",id:this.headingId},this.header)},this.renderActions=()=>{if(this.actions)return t("div",{class:"actions"},this.actions.map(this.renderActionButton))},this.renderActionButton=e=>t("limel-icon-button",{icon:e.icon,label:e.label,disabled:e.disabled,onClick:this.handleActionClick(e)}),this.handleActionClick=e=>o=>{o.stopPropagation(),this.action.emit(e)},this.getCollapsibleSectionAriaLabel=()=>p.get(this.isOpen?"collapsible-section.close":"collapsible-section.open",this.language,{header:this.header?`"${this.header}"`:" "})}componentWillLoad(){this.warnIfHeadingLevelIsInvalid()}handleHeadingLevelChange(){this.warnIfHeadingLevelIsInvalid()}componentDidRender(){const e=this.host.shadowRoot.querySelector(".open-close-toggle");s(e)}disconnectedCallback(){const e=this.host.shadowRoot.querySelector(".open-close-toggle");r(e)}render(){return t("section",{key:"ff18dacc5e74d3bd8d16da55be3e5340922acf86",class:this.isOpen?"open":"","aria-invalid":this.invalid,"aria-labelledby":this.header?this.headingId:null},t("header",{key:"f4dba35493c7ce7344ff34d2fbaeeb769f8c87eb"},t("button",{key:"d3a632b4002d01774c9bb88f250be4e196340ef3",class:"open-close-toggle",onClick:this.onClick,"aria-controls":this.bodyId,"aria-expanded":this.isOpen?"true":"false","aria-label":this.getCollapsibleSectionAriaLabel(),type:"button"}),this.renderExpandCollapseSign(),this.renderIcon(),this.renderHeading(),t("div",{key:"8d8489917d5e1bfa8de3cca8294651f448c8129c",class:"divider-line",role:"presentation"}),this.renderHeaderSlot(),this.renderActions()),t("div",{key:"fd7e13cf3bd26815d62c3fbac0ef04ed4db364b5",class:"body",inert:!this.isOpen,"aria-hidden":String(!this.isOpen),id:this.bodyId,role:"region"},t("slot",{key:"90ed08286c1091f5c5c5feec827729cfa65588fc"})))}getHeadingLevel(){return h(this.headingLevel)?this.headingLevel:2}warnIfHeadingLevelIsInvalid(){h(this.headingLevel)||console.warn(`limel-collapsible-section: headingLevel must be a whole number from 1 to 6, but it is ${this.headingLevel}. The heading is drawn as an h2 instead.`)}renderHeaderSlot(){return t("slot",{name:"header"})}get host(){return i(this)}static get watchers(){return{headingLevel:[{handleHeadingLevelChange:0}]}}};g.style='@charset "UTF-8";.expand-icon{position:relative;display:flex;align-items:center;justify-content:center;height:1.875rem;margin:0 0 0 0.5rem;width:0.75rem;flex-shrink:0}.line{position:absolute;inset:auto;margin:auto;width:100%;border-radius:1rem;height:0.125rem}.line:first-of-type,.line:last-of-type{transition:opacity 0.2s ease 0.1s, transform 0.4s ease 0.3s;opacity:0;background-color:var(--header-stroke-color, rgb(var(--contrast-900)))}.line:nth-of-type(2){transform:translate3d(0, 0.25rem, 0) rotate(90deg)}.line:nth-of-type(3){transform:translate3d(0, -0.25rem, 0) rotate(-90deg)}.line:nth-of-type(2),.line:nth-of-type(3){transition:opacity 0.2s ease, transform 0.18s ease}.line:nth-of-type(2):before,.line:nth-of-type(2):after,.line:nth-of-type(3):before,.line:nth-of-type(3):after{content:"";position:absolute;inset:0;margin:auto;width:50%;height:100%;border-radius:inherit;background-color:var(--header-stroke-color, rgb(var(--contrast-900)))}.line:nth-of-type(2):before,.line:nth-of-type(3):before{transform:translate3d(0, -0.1rem, 0) rotate(45deg)}.line:nth-of-type(2):after,.line:nth-of-type(3):after{transform:translate3d(0, 0.1rem, 0) rotate(-45deg)}.open-close-toggle:hover+.expand-icon .line:first-of-type,.open-close-toggle:hover+.expand-icon .line:last-of-type,.open-close-toggle:focus-visible+.expand-icon .line:first-of-type,.open-close-toggle:focus-visible+.expand-icon .line:last-of-type{transition:opacity 0.8s ease 0.4s, transform 0.4s ease 0.3s;opacity:1}.open-close-toggle:hover+.expand-icon .line:first-of-type,.open-close-toggle:focus-visible+.expand-icon .line:first-of-type{transform:rotate3d(0, 0, 1, 0deg)}.open-close-toggle:hover+.expand-icon .line:last-of-type,.open-close-toggle:focus-visible+.expand-icon .line:last-of-type{transform:rotate3d(0, 0, 1, 0deg)}.open-close-toggle:hover+.expand-icon .line:nth-of-type(2),.open-close-toggle:hover+.expand-icon .line:nth-of-type(3),.open-close-toggle:focus-visible+.expand-icon .line:nth-of-type(2),.open-close-toggle:focus-visible+.expand-icon .line:nth-of-type(3){transition:opacity 0.5s ease 0.4s, transform 0.7s cubic-bezier(0.85, 0.11, 0.14, 1.35) 0.2s}.open-close-toggle:hover+.expand-icon .line:nth-of-type(2),.open-close-toggle:focus-visible+.expand-icon .line:nth-of-type(2){transform:translate3d(0, 0.5rem, 0) rotate(90deg);opacity:0.4}.open-close-toggle:hover+.expand-icon .line:nth-of-type(3),.open-close-toggle:focus-visible+.expand-icon .line:nth-of-type(3){transform:translate3d(0, -0.5rem, 0) rotate(-90deg);opacity:0.4}section.open .line:first-of-type,section.open .line:last-of-type{transition:opacity 0.2s ease 0.1s, transform 0.4s ease 0.3s;opacity:1}section.open .line:first-of-type{transform:rotate3d(0, 0, 1, 0deg)}section.open .line:last-of-type{transform:rotate3d(0, 0, 1, 0deg)}section.open .line:nth-of-type(2),section.open .line:nth-of-type(3){transition:opacity 1s ease, transform 0.4s ease}section.open .line:nth-of-type(2){transform:translate3d(0, 1rem, 0) rotate(90deg);opacity:0}section.open .line:nth-of-type(3){transform:translate3d(0, -1rem, 0) rotate(-90deg);opacity:0}section.open .open-close-toggle:hover+.expand-icon .line:first-of-type,section.open .open-close-toggle:hover+.expand-icon .line:last-of-type,section.open .open-close-toggle:focus-visible+.expand-icon .line:first-of-type,section.open .open-close-toggle:focus-visible+.expand-icon .line:last-of-type{transition:opacity 0.2s ease 0.4s, transform 0.4s cubic-bezier(0.85, 0.11, 0.14, 1.35) 0.2s}section.open .open-close-toggle:hover+.expand-icon .line:first-of-type,section.open .open-close-toggle:focus-visible+.expand-icon .line:first-of-type{transform:rotate3d(0, 0, 1, 45deg)}section.open .open-close-toggle:hover+.expand-icon .line:last-of-type,section.open .open-close-toggle:focus-visible+.expand-icon .line:last-of-type{transform:rotate3d(0, 0, 1, -45deg)}section.open .open-close-toggle:hover+.expand-icon .line:nth-of-type(2),section.open .open-close-toggle:focus-visible+.expand-icon .line:nth-of-type(2){transform:translate3d(0, 1rem, 0) rotate(90deg);opacity:0}section.open .open-close-toggle:hover+.expand-icon .line:nth-of-type(3),section.open .open-close-toggle:focus-visible+.expand-icon .line:nth-of-type(3){transform:translate3d(0, -1rem, 0) rotate(-90deg);opacity:0}:host(limel-collapsible-section){--border-radius-of-header:0.75rem;display:block}:host([hidden]){display:none}button.open-close-toggle{appearance:none;background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;text-align:inherit;position:absolute;inset:0;width:100%}button.open-close-toggle:focus{outline:none}button.open-close-toggle:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button.open-close-toggle{transition:background-color 0.4s ease, border-radius 0.1s ease;cursor:pointer;z-index:-1;background-color:var(--closed-header-background-color, rgb(var(--contrast-200)));border-radius:var(--border-radius-of-header)}button.open-close-toggle:hover,button.open-close-toggle:focus-visible{background-color:var(--open-header-background-color, rgb(var(--contrast-300)))}section.open button.open-close-toggle{background-color:var(--open-header-background-color, rgb(var(--contrast-100)));border-radius:var(--border-radius-of-header) var(--border-radius-of-header) var(--limel-cs-open-header-bottom-border-radius, 0) var(--limel-cs-open-header-bottom-border-radius, 0)}section.open button.open-close-toggle:hover,section.open button.open-close-toggle:focus-visible{background-color:var(--open-header-background-color, rgb(var(--contrast-300)))}.title,.divider-line,.expand-icon{pointer-events:none}section{transition:box-shadow 0.4s ease;border-radius:var(--border-radius-of-header)}section[aria-invalid]:not([aria-invalid=false]){--header-stroke-color:rgb(var(--color-red-default)) !important}section[aria-invalid]:not([aria-invalid=false]):not(.open){box-shadow:0 0 0 1px rgb(var(--color-red-default))}header{isolation:isolate;position:relative;align-items:center;display:flex;justify-content:space-between;gap:0.5rem;padding-left:0.5rem;height:2.5rem}limel-icon{width:1.5rem;flex-shrink:0}.title{font-size:1rem;font-weight:300;color:var(--limel-theme-on-surface-color);justify-self:flex-start;user-select:none;height:auto;max-height:3rem;line-height:1.2rem;display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.divider-line{transition:opacity 0.3s ease 0.3s;flex-grow:1;height:0.125rem;border-radius:1rem;background-color:var(--header-stroke-color, rgb(var(--contrast-900)));opacity:0;margin-right:0.5rem}section.open .divider-line{opacity:0.16}.actions{justify-self:flex-end;flex-shrink:0}::slotted([slot=header]){margin-right:0.5rem}.body{background-color:var(--body-background-color, var(--contrast-100));padding-left:var(--body-padding, 1.25rem);padding-right:var(--body-padding, 1.25rem);border-radius:0 0 var(--border-radius-of-header) var(--border-radius-of-header)}.body{transition:grid-template-rows var(--limel-cs-grid-template-rows-transition-speed) cubic-bezier(1, 0.09, 0, 0.89);display:grid;grid-template-rows:var(--limel-cs-grid-template-rows)}.body slot{transition:opacity var(--limel-cs-opacity-transition-speed) ease var(--limel-cs-opacity-transition-delay);display:block;overflow:hidden}:host(limel-collapsible-section:not([is-open])){--limel-cs-opacity-transition-speed:0.1s;--limel-cs-opacity-transition-delay:0s;--limel-cs-grid-template-rows-transition-speed:0.3s;--limel-cs-grid-template-rows:0fr}:host(limel-collapsible-section:not([is-open])) slot{opacity:0}:host(limel-collapsible-section[is-open]){--limel-cs-opacity-transition-speed:0.4s;--limel-cs-opacity-transition-delay:0.3s;--limel-cs-grid-template-rows-transition-speed:0.46s;--limel-cs-grid-template-rows:1fr}:host(limel-collapsible-section[is-open]) slot{opacity:1}header:hover+.body,header:has(.open-close-toggle:hover)+.body,header:has(.open-close-toggle:focus-visible)+.body{will-change:grid-template-rows}header:hover+.body slot,header:has(.open-close-toggle:hover)+.body slot,header:has(.open-close-toggle:focus-visible)+.body slot{will-change:opacity}';export{g as limel_collapsible_section}

package/dist/types/components/collapsible-section/collapsible-section.d.ts

@@ -1,6 +1,7 @@
 import { Action } from './action';
 import { Icon, IconName } from '../../global/shared-types/icon.types';
 import { Languages } from '../date-picker/date.types';
+import { HeadingLevel } from '../../global/shared-types/heading-level.types';
 /**
  * A collapsible section can be used to group related content together
  * and hide the group when not needed.
@@ -40,7 +41,7 @@ export declare class CollapsibleSection {
      * For example, when the section is below an `h2`, set it to `3`.
      * It does not change how the heading looks.
      */
-    headingLevel: 1 | 2 | 3 | 4 | 5 | 6;
+    headingLevel: HeadingLevel;
     /**
      * Icon to display in the header of the section
      */

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

@@ -1,5 +1,6 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-import { FormError, FormSchema, HeadingLevel, ValidationError, ValidationStatus } from './form.types';
+import { FormError, FormSchema, ValidationError, ValidationStatus } from './form.types';
+import { HeadingLevel } from '../../global/shared-types/heading-level.types';
 /**
  * @exampleComponent limel-example-form
  * @exampleComponent limel-example-nested-form
@@ -55,7 +56,8 @@ export declare class Form {
     /**
      * The level, from `1` to `6`, of the topmost headings in the form.
      * The headings of the sections inside them get one level more for each
-     * level of nesting, down to `6`.
+     * level of nesting, down to `6`. A collapsible section, and each item
+     * of a list that is shown as one, counts as a level too.
      *
      * Set it so that the headings of the form fit below the headings of
      * the page around it. For example, when the form is in a section with

package/dist/types/components/form/form.test-schemas.d.ts

@@ -35,6 +35,7 @@ export declare const arrayItemControlsSchema: FormSchema;
 export declare const rowLayoutSchema: FormSchema;
 export declare const rowLayoutWithCustomComponentSchema: FormSchema;
 export declare const nestedArrayObjectSchema: FormSchema;
+export declare const arrayItemWithEmptyListSchema: FormSchema;
 export declare const topLevelStringCustomComponentSchema: FormSchema;
 export declare const stringWithDefaultCustomComponentSchema: FormSchema;
 export declare const arrayItemWithDependenciesSchema: FormSchema;
@@ -48,5 +49,7 @@ export declare const requiredCheckboxSchema: FormSchema;
 export declare const nestedTitlesSchema: FormSchema;
 export declare const titledRowLayoutSchema: FormSchema;
 export declare const untitledRootSchema: FormSchema;
+export declare const nestedCollapsibleSchema: FormSchema;
+export declare const untitledCollapsibleSchema: FormSchema;
 export declare const untitledRowSchema: FormSchema;
 //# sourceMappingURL=form.test-schemas.d.ts.map

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

@@ -72,12 +72,6 @@ export type ValidationError = {
      */
     [key: string]: string[] | ValidationError;
 };
-/**
- * The level of a heading, from `1` for an `h1` to `6` for an `h6`.
- *
- * @public
- */
-export type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
 /**
  * @public
  */

package/dist/types/components/form/row/row.d.ts

@@ -3,7 +3,7 @@ import { RowProps } from '../templates/types';
 import { HeadingLevelContext } from '../templates/heading-level';
 export declare class Row extends React.Component<RowProps> {
     props: RowProps;
-    static readonly contextType: React.Context<import("../form.types").HeadingLevel>;
+    static readonly contextType: React.Context<import("../../..").HeadingLevel>;
     context: React.ContextType<typeof HeadingLevelContext>;
     constructor(props: RowProps);
     render(): React.DetailedReactHTMLElement<{

package/dist/types/components/form/templates/array-field-collapsible-item.d.ts

@@ -1,6 +1,7 @@
 import React, { PropsWithChildren } from 'react';
 import { ArrayFieldItemButtonsTemplateProps, ErrorSchema } from '@rjsf/utils';
 import { JSONSchema7 } from 'json-schema';
+import { HeadingLevelContext } from './heading-level';
 export interface CollapsibleItemProps {
     buttonsProps: ArrayFieldItemButtonsTemplateProps;
     /**
@@ -46,6 +47,8 @@ export interface CollapsibleItemProps {
 }
 export declare class CollapsibleItemTemplate extends React.Component<PropsWithChildren<CollapsibleItemProps>> {
     props: PropsWithChildren<CollapsibleItemProps>;
+    static readonly contextType: React.Context<import("../../..").HeadingLevel>;
+    context: React.ContextType<typeof HeadingLevelContext>;
     state: {
         isOpen: boolean;
     };
@@ -55,7 +58,8 @@ export declare class CollapsibleItemTemplate extends React.Component<PropsWithCh
     componentDidUpdate(): void;
     componentWillUnmount(): void;
     render(): React.ReactElement<{
-        header: any;
+        header: string;
+        headingLevel: import("../../..").HeadingLevel;
         class: string;
         ref: (section: HTMLLimelCollapsibleSectionElement) => void;
         'is-open': boolean;

package/dist/types/components/form/templates/heading-level.d.ts

@@ -1,11 +1,6 @@
 import React, { PropsWithChildren } from 'react';
 import { Help } from '../../help/help.types';
-import { HeadingLevel } from '../form.types';
-/**
- * @param level - any value
- * @returns whether the value is a heading level, from `1` to `6`
- */
-export declare function isHeadingLevel(level: unknown): level is HeadingLevel;
+import { HeadingLevel } from '../../../global/shared-types/heading-level.types';
 /**
  * The heading level that a title at the current depth in the form gets.
  */

package/dist/types/components/form/templates/object-field.d.ts

@@ -1,7 +1,9 @@
 import React from 'react';
 import { LimeObjectFieldTemplateProps } from './types';
+import { HeadingLevel } from '../../../global/shared-types/heading-level.types';
 export declare const ObjectFieldTemplate: (props: LimeObjectFieldTemplateProps) => React.FunctionComponentElement<React.FragmentProps> | React.ReactElement<{
     header: string;
+    headingLevel: HeadingLevel;
     id: string;
     'is-open': boolean;
     invalid: boolean;

package/dist/types/components/form-header/form-header.d.ts

@@ -1,5 +1,5 @@
 import { Help } from '../help/help.types';
-import { HeadingLevel } from '../form/form.types';
+import { HeadingLevel } from '../../global/shared-types/heading-level.types';
 /**
  * This is an internal and private component that `limel-form` uses to
  * draw the heading of a section, a list or a custom component, together

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

@@ -53,6 +53,25 @@ export declare class Popover {
      * Decides the popover's location in relation to its trigger
      */
     openDirection: OpenDirection;
+    /**
+     * Says what kind of popup the trigger opens, so that a screen reader can
+     * announce it. Use the one that fits what you put in the popover: `dialog`
+     * for a form, a message or other content, and `menu`, `listbox`, `tree`
+     * or `grid` when the content is one of those widgets.
+     *
+     * A popup with one of these roles needs a name, so the role is used only
+     * together with `accessibleLabel`. Without one, the popover warns in the
+     * console.
+     *
+     * When the role is not set or not used, the trigger only says that it
+     * opens a popup.
+     */
+    popupRole?: 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid';
+    /**
+     * The name of the popup, which a screen reader announces when the focus
+     * moves into it. Used together with `popupRole`.
+     */
+    accessibleLabel?: string;
     /**
      * Emits an event when the component is closing
      */
@@ -61,10 +80,12 @@ export declare class Popover {
     private portalId;
     private triggerSlot;
     private shouldRestoreFocusOnClose;
+    private hasWarnedAboutMissingName;
     constructor();
     protected watchOpen(): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    componentWillRender(): void;
     componentDidRender(): void;
     private setupGlobalHandlers;
     /**
@@ -81,5 +102,8 @@ export declare class Popover {
     private readonly setTriggerRef;
     private readonly focusTrigger;
     private setTriggerAttributes;
+    private getNamedPopupRole;
+    private warnIfRoleHasNoName;
+    private setControlledPopup;
 }
 //# sourceMappingURL=popover.d.ts.map

package/dist/types/components/popover-surface/popover-surface.d.ts

@@ -7,6 +7,14 @@ export declare class PopoverSurface {
      * Content to render
      */
     contentCollection: HTMLCollection;
+    /**
+     * The role of the surface, for assistive technology
+     */
+    popupRole?: string;
+    /**
+     * The name of the surface, for assistive technology
+     */
+    accessibleLabel?: string;
     private host;
     componentDidLoad(): void;
     render(): any;

package/dist/types/components.d.ts

@@ -24,6 +24,7 @@ import { MenuItem as MenuItem1 } from "./components";
 import { CircularProgressSize } from "./components/circular-progress/circular-progress.types";
 import { CodeDiffLayout } from "./components/code-diff/code-diff.types";
 import { ColorScheme, Language } from "./components/code-editor/code-editor.types";
+import { HeadingLevel } from "./global/shared-types/heading-level.types";
 import { Action } from "./components/collapsible-section/action";
 import { CustomColorSwatch, CustomPalette } from "./components/color-picker/color-picker.types";
 import { Config } from "./global/config";
@@ -34,7 +35,7 @@ import { FileInfo } from "./global/shared-types/file.types";
 import { ResizeOptions } from "./util/image-resize";
 import { OfficeViewer } from "./components/file-viewer/file-viewer.types";
 import { FlexContainerAlign, FlexContainerDirection, FlexContainerJustify } from "./components/flex-container/flex-container.types";
-import { FormError, FormSchema, HeadingLevel, ValidationError, ValidationStatus } from "./components/form/form.types";
+import { FormError, FormSchema, ValidationError, ValidationStatus } from "./components/form/form.types";
 import { Help } from "./components/help/help.types";
 import { IconSize } from "./components/icon/icon.types";
 import { InfoTileProgress } from "./components/info-tile/info-tile.types";
@@ -75,6 +76,7 @@ export { MenuItem as MenuItem1 } from "./components";
 export { CircularProgressSize } from "./components/circular-progress/circular-progress.types";
 export { CodeDiffLayout } from "./components/code-diff/code-diff.types";
 export { ColorScheme, Language } from "./components/code-editor/code-editor.types";
+export { HeadingLevel } from "./global/shared-types/heading-level.types";
 export { Action } from "./components/collapsible-section/action";
 export { CustomColorSwatch, CustomPalette } from "./components/color-picker/color-picker.types";
 export { Config } from "./global/config";
@@ -85,7 +87,7 @@ export { FileInfo } from "./global/shared-types/file.types";
 export { ResizeOptions } from "./util/image-resize";
 export { OfficeViewer } from "./components/file-viewer/file-viewer.types";
 export { FlexContainerAlign, FlexContainerDirection, FlexContainerJustify } from "./components/flex-container/flex-container.types";
-export { FormError, FormSchema, HeadingLevel, ValidationError, ValidationStatus } from "./components/form/form.types";
+export { FormError, FormSchema, ValidationError, ValidationStatus } from "./components/form/form.types";
 export { Help } from "./components/help/help.types";
 export { IconSize } from "./components/icon/icon.types";
 export { InfoTileProgress } from "./components/info-tile/info-tile.types";
@@ -1180,7 +1182,7 @@ export namespace Components {
           * The level of the heading that the `header` is drawn with, from `1` for an `h1` to `6` for an `h6`.  Set it so that the heading fits below the headings around the section. For example, when the section is below an `h2`, set it to `3`. It does not change how the heading looks.
           * @default 2
          */
-        "headingLevel": 1 | 2 | 3 | 4 | 5 | 6;
+        "headingLevel": HeadingLevel;
         /**
           * Icon to display in the header of the section
          */
@@ -1922,7 +1924,7 @@ export namespace Components {
          */
         "errors": ValidationError;
         /**
-          * The level, from `1` to `6`, of the topmost headings in the form. The headings of the sections inside them get one level more for each level of nesting, down to `6`.  Set it so that the headings of the form fit below the headings of the page around it. For example, when the form is in a section with an `h2` heading, set it to `3`.
+          * The level, from `1` to `6`, of the topmost headings in the form. The headings of the sections inside them get one level more for each level of nesting, down to `6`. A collapsible section, and each item of a list that is shown as one, counts as a level too.  Set it so that the headings of the form fit below the headings of the page around it. For example, when the form is in a section with an `h2` heading, set it to `3`.
           * @default 1
          */
         "headingLevel": HeadingLevel;
@@ -3135,6 +3137,10 @@ export namespace Components {
      * @exampleComponent limel-example-popover-styling
      */
     interface LimelPopover {
+        /**
+          * The name of the popup, which a screen reader announces when the focus moves into it. Used together with `popupRole`.
+         */
+        "accessibleLabel"?: string;
         /**
           * True if the content within the popover should be visible
           * @default false
@@ -3144,15 +3150,27 @@ export namespace Components {
           * Decides the popover's location in relation to its trigger
          */
         "openDirection": OpenDirection;
+        /**
+          * Says what kind of popup the trigger opens, so that a screen reader can announce it. Use the one that fits what you put in the popover: `dialog` for a form, a message or other content, and `menu`, `listbox`, `tree` or `grid` when the content is one of those widgets.  A popup with one of these roles needs a name, so the role is used only together with `accessibleLabel`. Without one, the popover warns in the console.  When the role is not set or not used, the trigger only says that it opens a popup.
+         */
+        "popupRole"?: 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid';
     }
     /**
      * @private 
      */
     interface LimelPopoverSurface {
+        /**
+          * The name of the surface, for assistive technology
+         */
+        "accessibleLabel"?: string;
         /**
           * Content to render
          */
         "contentCollection": HTMLCollection;
+        /**
+          * The role of the surface, for assistive technology
+         */
+        "popupRole"?: string;
     }
     /**
      * The portal component provides a way to render children into a DOM node that
@@ -8410,7 +8428,7 @@ declare namespace LocalJSX {
           * The level of the heading that the `header` is drawn with, from `1` for an `h1` to `6` for an `h6`.  Set it so that the heading fits below the headings around the section. For example, when the section is below an `h2`, set it to `3`. It does not change how the heading looks.
           * @default 2
          */
-        "headingLevel"?: 1 | 2 | 3 | 4 | 5 | 6;
+        "headingLevel"?: HeadingLevel;
         /**
           * Icon to display in the header of the section
          */
@@ -9241,7 +9259,7 @@ declare namespace LocalJSX {
          */
         "errors"?: ValidationError;
         /**
-          * The level, from `1` to `6`, of the topmost headings in the form. The headings of the sections inside them get one level more for each level of nesting, down to `6`.  Set it so that the headings of the form fit below the headings of the page around it. For example, when the form is in a section with an `h2` heading, set it to `3`.
+          * The level, from `1` to `6`, of the topmost headings in the form. The headings of the sections inside them get one level more for each level of nesting, down to `6`. A collapsible section, and each item of a list that is shown as one, counts as a level too.  Set it so that the headings of the form fit below the headings of the page around it. For example, when the form is in a section with an `h2` heading, set it to `3`.
           * @default 1
          */
         "headingLevel"?: HeadingLevel;
@@ -10499,6 +10517,10 @@ declare namespace LocalJSX {
      * @exampleComponent limel-example-popover-styling
      */
     interface LimelPopover {
+        /**
+          * The name of the popup, which a screen reader announces when the focus moves into it. Used together with `popupRole`.
+         */
+        "accessibleLabel"?: string;
         /**
           * Emits an event when the component is closing
          */
@@ -10512,15 +10534,27 @@ declare namespace LocalJSX {
           * Decides the popover's location in relation to its trigger
          */
         "openDirection"?: OpenDirection;
+        /**
+          * Says what kind of popup the trigger opens, so that a screen reader can announce it. Use the one that fits what you put in the popover: `dialog` for a form, a message or other content, and `menu`, `listbox`, `tree` or `grid` when the content is one of those widgets.  A popup with one of these roles needs a name, so the role is used only together with `accessibleLabel`. Without one, the popover warns in the console.  When the role is not set or not used, the trigger only says that it opens a popup.
+         */
+        "popupRole"?: 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid';
     }
     /**
      * @private 
      */
     interface LimelPopoverSurface {
+        /**
+          * The name of the surface, for assistive technology
+         */
+        "accessibleLabel"?: string;
         /**
           * Content to render
          */
         "contentCollection"?: HTMLCollection;
+        /**
+          * The role of the surface, for assistive technology
+         */
+        "popupRole"?: string;
     }
     /**
      * The portal component provides a way to render children into a DOM node that
@@ -12126,7 +12160,7 @@ declare namespace LocalJSX {
     interface LimelCollapsibleSectionAttributes {
         "isOpen": boolean;
         "header": string;
-        "headingLevel": 1 | 2 | 3 | 4 | 5 | 6;
+        "headingLevel": HeadingLevel;
         "icon": IconName | Icon;
         "invalid": boolean;
         "language": Languages;
@@ -12428,6 +12462,12 @@ declare namespace LocalJSX {
     interface LimelPopoverAttributes {
         "open": boolean;
         "openDirection": OpenDirection;
+        "popupRole": 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid';
+        "accessibleLabel": string;
+    }
+    interface LimelPopoverSurfaceAttributes {
+        "popupRole": string;
+        "accessibleLabel": string;
     }
     interface LimelPortalAttributes {
         "openDirection": OpenDirection;
@@ -12679,7 +12719,7 @@ declare namespace LocalJSX {
         "limel-pagination-jump": Omit<LimelPaginationJump, keyof LimelPaginationJumpAttributes> & { [K in keyof LimelPaginationJump & keyof LimelPaginationJumpAttributes]?: LimelPaginationJump[K] } & { [K in keyof LimelPaginationJump & keyof LimelPaginationJumpAttributes as `attr:${K}`]?: LimelPaginationJumpAttributes[K] } & { [K in keyof LimelPaginationJump & keyof LimelPaginationJumpAttributes as `prop:${K}`]?: LimelPaginationJump[K] };
         "limel-picker": Omit<LimelPicker, keyof LimelPickerAttributes> & { [K in keyof LimelPicker & keyof LimelPickerAttributes]?: LimelPicker[K] } & { [K in keyof LimelPicker & keyof LimelPickerAttributes as `attr:${K}`]?: LimelPickerAttributes[K] } & { [K in keyof LimelPicker & keyof LimelPickerAttributes as `prop:${K}`]?: LimelPicker[K] };
         "limel-popover": Omit<LimelPopover, keyof LimelPopoverAttributes> & { [K in keyof LimelPopover & keyof LimelPopoverAttributes]?: LimelPopover[K] } & { [K in keyof LimelPopover & keyof LimelPopoverAttributes as `attr:${K}`]?: LimelPopoverAttributes[K] } & { [K in keyof LimelPopover & keyof LimelPopoverAttributes as `prop:${K}`]?: LimelPopover[K] };
-        "limel-popover-surface": LimelPopoverSurface;
+        "limel-popover-surface": Omit<LimelPopoverSurface, keyof LimelPopoverSurfaceAttributes> & { [K in keyof LimelPopoverSurface & keyof LimelPopoverSurfaceAttributes]?: LimelPopoverSurface[K] } & { [K in keyof LimelPopoverSurface & keyof LimelPopoverSurfaceAttributes as `attr:${K}`]?: LimelPopoverSurfaceAttributes[K] } & { [K in keyof LimelPopoverSurface & keyof LimelPopoverSurfaceAttributes as `prop:${K}`]?: LimelPopoverSurface[K] };
         "limel-portal": Omit<LimelPortal, keyof LimelPortalAttributes> & { [K in keyof LimelPortal & keyof LimelPortalAttributes]?: LimelPortal[K] } & { [K in keyof LimelPortal & keyof LimelPortalAttributes as `attr:${K}`]?: LimelPortalAttributes[K] } & { [K in keyof LimelPortal & keyof LimelPortalAttributes as `prop:${K}`]?: LimelPortal[K] };
         "limel-profile-picture": Omit<LimelProfilePicture, keyof LimelProfilePictureAttributes> & { [K in keyof LimelProfilePicture & keyof LimelProfilePictureAttributes]?: LimelProfilePicture[K] } & { [K in keyof LimelProfilePicture & keyof LimelProfilePictureAttributes as `attr:${K}`]?: LimelProfilePictureAttributes[K] } & { [K in keyof LimelProfilePicture & keyof LimelProfilePictureAttributes as `prop:${K}`]?: LimelProfilePicture[K] };
         "limel-progress-flow": Omit<LimelProgressFlow, keyof LimelProgressFlowAttributes> & { [K in keyof LimelProgressFlow & keyof LimelProgressFlowAttributes]?: LimelProgressFlow[K] } & { [K in keyof LimelProgressFlow & keyof LimelProgressFlowAttributes as `attr:${K}`]?: LimelProgressFlowAttributes[K] } & { [K in keyof LimelProgressFlow & keyof LimelProgressFlowAttributes as `prop:${K}`]?: LimelProgressFlow[K] };

package/dist/types/global/shared-types/heading-level.types.d.ts

@@ -0,0 +1,7 @@
+/**
+ * The level of a heading, from `1` for an `h1` to `6` for an `h6`.
+ *
+ * @public
+ */
+export type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+//# sourceMappingURL=heading-level.types.d.ts.map

package/dist/types/interface.d.ts

@@ -19,7 +19,7 @@ export * from './components/flex-container/flex-container.types';
 export * from './global/shared-types/custom-element.types';
 export * from './global/config';
 export * from './global/shared-types/link.types';
-export { EventEmitter, ValidationStatus, FormError, ValidationError, FormComponent, FormInfo, FormSchema, HeadingLevel, LimeSchemaOptions, LimeLayoutOptions, FormComponentOptions, FormLayoutOptions, GridLayoutOptions, RowLayoutOptions, FormLayoutType, ReplaceObjectType, FormSchemaArrayItem, FormSubKeySchema, } from './components/form/form.types';
+export { EventEmitter, ValidationStatus, FormError, ValidationError, FormComponent, FormInfo, FormSchema, LimeSchemaOptions, LimeLayoutOptions, FormComponentOptions, FormLayoutOptions, GridLayoutOptions, RowLayoutOptions, FormLayoutType, ReplaceObjectType, FormSchemaArrayItem, FormSubKeySchema, } from './components/form/form.types';
 export * from './components/help/help.types';
 export * from './components/icon/icon.types';
 export * from './components/info-tile/info-tile.types';
@@ -45,6 +45,7 @@ export * from './global/shared-types/separator.types';
 export * from './global/shared-types/icon.types';
 export * from './global/shared-types/image.types';
 export * from './global/shared-types/color.types';
+export * from './global/shared-types/heading-level.types';
 export * from './components/text-editor/text-editor.types';
 export * from './components/text-editor/types';
 export * from './components/text-editor/prosemirror-adapter/menu/types';

package/dist/types/util/heading-level.d.ts

@@ -0,0 +1,7 @@
+import { HeadingLevel } from '../global/shared-types/heading-level.types';
+/**
+ * @param level - any value
+ * @returns whether the value is a heading level, from `1` to `6`
+ */
+export declare function isHeadingLevel(level: unknown): level is HeadingLevel;
+//# sourceMappingURL=heading-level.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@limetech/lime-elements",
-  "version": "40.16.0",
+  "version": "40.17.1",
   "description": "Lime Elements",
   "author": "Lime Technologies",
   "license": "Apache-2.0",
@@ -93,7 +93,7 @@
     "morphdom": "^2.7.8",
     "number-abbreviate": "^2.0.0",
     "parse-css-color": "^0.2.1",
-    "postal-mime": "^4.0.11",
+    "postal-mime": "^4.1.4",
     "prettier": "^3.9.10",
     "prosemirror-example-setup": "^1.2.3",
     "prosemirror-markdown": "^1.13.9",

package/dist/lime-elements/p-1d13245d.entry.js

@@ -1 +0,0 @@
-import{r as e,c as o,h as t,a as i}from"./p-BU9IJqli.js";import{d as n}from"./p-z_E3sq3p.js";import{m as s,r}from"./p-CIf8aGSd.js";import{c as a}from"./p-BrjD-ITe.js";import{b as l,d as c,g as d}from"./p-CgNJbSP4.js";import{t as p}from"./p-B26k4gw8.js";import"./p-ChagAaNf.js";function h(e){return"number"==typeof e&&Number.isSafeInteger(e)&&e>=1&&e<=6}const g=class{constructor(i){e(this,i),this.open=o(this,"open",7),this.close=o(this,"close",7),this.action=o(this,"action",7),this.isOpen=!1,this.headingLevel=2,this.invalid=!1,this.language="en",this.bodyId=a(),this.headingId=a(),this.onClick=()=>{this.handleInteraction()},this.handleInteraction=()=>{this.isOpen=!this.isOpen,this.isOpen?(this.open.emit(),setTimeout(n,100)):this.close.emit()},this.renderExpandCollapseSign=()=>t("div",{class:"expand-icon",role:"presentation","aria-hidden":"true"},t("div",{class:"line"}),t("div",{class:"line"}),t("div",{class:"line"}),t("div",{class:"line"})),this.renderIcon=()=>{if(!this.icon)return;const e=d(this.icon),o=l(this.icon),i=c(this.icon);return t("limel-icon",{name:e,"aria-label":i,"aria-hidden":i?null:"true",style:{color:`${o}`}})},this.renderHeading=()=>{if(!this.header)return;const e=`h${this.getHeadingLevel()}`;return t(e,{class:"title mdc-typography mdc-typography--headline2",id:this.headingId},this.header)},this.renderActions=()=>{if(this.actions)return t("div",{class:"actions"},this.actions.map(this.renderActionButton))},this.renderActionButton=e=>t("limel-icon-button",{icon:e.icon,label:e.label,disabled:e.disabled,onClick:this.handleActionClick(e)}),this.handleActionClick=e=>o=>{o.stopPropagation(),this.action.emit(e)},this.getCollapsibleSectionAriaLabel=()=>p.get(this.isOpen?"collapsible-section.close":"collapsible-section.open",this.language,{header:this.header?`"${this.header}"`:" "})}componentWillLoad(){this.warnIfHeadingLevelIsInvalid()}handleHeadingLevelChange(){this.warnIfHeadingLevelIsInvalid()}componentDidRender(){const e=this.host.shadowRoot.querySelector(".open-close-toggle");s(e)}disconnectedCallback(){const e=this.host.shadowRoot.querySelector(".open-close-toggle");r(e)}render(){return t("section",{key:"1cb8db604bbbc8f8dbb7ca97895b3cfcf4dcd80b",class:this.isOpen?"open":"","aria-invalid":this.invalid,"aria-labelledby":this.header?this.headingId:null},t("header",{key:"4e55c5b636b1d049df4d77a77a35285648096ea0"},t("button",{key:"29eefb5499fb0f00cbdf513698acf8f357a935a6",class:"open-close-toggle",onClick:this.onClick,"aria-controls":this.bodyId,"aria-expanded":this.isOpen?"true":"false","aria-label":this.getCollapsibleSectionAriaLabel(),type:"button"}),this.renderExpandCollapseSign(),this.renderIcon(),this.renderHeading(),t("div",{key:"16ec84abfe81a812c9d30188a714b58d363ca8a3",class:"divider-line",role:"presentation"}),this.renderHeaderSlot(),this.renderActions()),t("div",{key:"f28ff7d73f05dc1a6ca0dcd9948cb67107647598",class:"body",inert:!this.isOpen,"aria-hidden":String(!this.isOpen),id:this.bodyId,role:"region"},t("slot",{key:"33d0fda5501c178f92dff4a1b0361a43829fe095"})))}getHeadingLevel(){return h(this.headingLevel)?this.headingLevel:2}warnIfHeadingLevelIsInvalid(){h(this.headingLevel)||console.warn(`limel-collapsible-section: headingLevel must be a whole number from 1 to 6, but it is ${this.headingLevel}. The heading is drawn as an h2 instead.`)}renderHeaderSlot(){return t("slot",{name:"header"})}get host(){return i(this)}static get watchers(){return{headingLevel:[{handleHeadingLevelChange:0}]}}};g.style='@charset "UTF-8";.expand-icon{position:relative;display:flex;align-items:center;justify-content:center;height:1.875rem;margin:0 0 0 0.5rem;width:0.75rem;flex-shrink:0}.line{position:absolute;inset:auto;margin:auto;width:100%;border-radius:1rem;height:0.125rem}.line:first-of-type,.line:last-of-type{transition:opacity 0.2s ease 0.1s, transform 0.4s ease 0.3s;opacity:0;background-color:var(--header-stroke-color, rgb(var(--contrast-900)))}.line:nth-of-type(2){transform:translate3d(0, 0.25rem, 0) rotate(90deg)}.line:nth-of-type(3){transform:translate3d(0, -0.25rem, 0) rotate(-90deg)}.line:nth-of-type(2),.line:nth-of-type(3){transition:opacity 0.2s ease, transform 0.18s ease}.line:nth-of-type(2):before,.line:nth-of-type(2):after,.line:nth-of-type(3):before,.line:nth-of-type(3):after{content:"";position:absolute;inset:0;margin:auto;width:50%;height:100%;border-radius:inherit;background-color:var(--header-stroke-color, rgb(var(--contrast-900)))}.line:nth-of-type(2):before,.line:nth-of-type(3):before{transform:translate3d(0, -0.1rem, 0) rotate(45deg)}.line:nth-of-type(2):after,.line:nth-of-type(3):after{transform:translate3d(0, 0.1rem, 0) rotate(-45deg)}.open-close-toggle:hover+.expand-icon .line:first-of-type,.open-close-toggle:hover+.expand-icon .line:last-of-type,.open-close-toggle:focus-visible+.expand-icon .line:first-of-type,.open-close-toggle:focus-visible+.expand-icon .line:last-of-type{transition:opacity 0.8s ease 0.4s, transform 0.4s ease 0.3s;opacity:1}.open-close-toggle:hover+.expand-icon .line:first-of-type,.open-close-toggle:focus-visible+.expand-icon .line:first-of-type{transform:rotate3d(0, 0, 1, 0deg)}.open-close-toggle:hover+.expand-icon .line:last-of-type,.open-close-toggle:focus-visible+.expand-icon .line:last-of-type{transform:rotate3d(0, 0, 1, 0deg)}.open-close-toggle:hover+.expand-icon .line:nth-of-type(2),.open-close-toggle:hover+.expand-icon .line:nth-of-type(3),.open-close-toggle:focus-visible+.expand-icon .line:nth-of-type(2),.open-close-toggle:focus-visible+.expand-icon .line:nth-of-type(3){transition:opacity 0.5s ease 0.4s, transform 0.7s cubic-bezier(0.85, 0.11, 0.14, 1.35) 0.2s}.open-close-toggle:hover+.expand-icon .line:nth-of-type(2),.open-close-toggle:focus-visible+.expand-icon .line:nth-of-type(2){transform:translate3d(0, 0.5rem, 0) rotate(90deg);opacity:0.4}.open-close-toggle:hover+.expand-icon .line:nth-of-type(3),.open-close-toggle:focus-visible+.expand-icon .line:nth-of-type(3){transform:translate3d(0, -0.5rem, 0) rotate(-90deg);opacity:0.4}section.open .line:first-of-type,section.open .line:last-of-type{transition:opacity 0.2s ease 0.1s, transform 0.4s ease 0.3s;opacity:1}section.open .line:first-of-type{transform:rotate3d(0, 0, 1, 0deg)}section.open .line:last-of-type{transform:rotate3d(0, 0, 1, 0deg)}section.open .line:nth-of-type(2),section.open .line:nth-of-type(3){transition:opacity 1s ease, transform 0.4s ease}section.open .line:nth-of-type(2){transform:translate3d(0, 1rem, 0) rotate(90deg);opacity:0}section.open .line:nth-of-type(3){transform:translate3d(0, -1rem, 0) rotate(-90deg);opacity:0}section.open .open-close-toggle:hover+.expand-icon .line:first-of-type,section.open .open-close-toggle:hover+.expand-icon .line:last-of-type,section.open .open-close-toggle:focus-visible+.expand-icon .line:first-of-type,section.open .open-close-toggle:focus-visible+.expand-icon .line:last-of-type{transition:opacity 0.2s ease 0.4s, transform 0.4s cubic-bezier(0.85, 0.11, 0.14, 1.35) 0.2s}section.open .open-close-toggle:hover+.expand-icon .line:first-of-type,section.open .open-close-toggle:focus-visible+.expand-icon .line:first-of-type{transform:rotate3d(0, 0, 1, 45deg)}section.open .open-close-toggle:hover+.expand-icon .line:last-of-type,section.open .open-close-toggle:focus-visible+.expand-icon .line:last-of-type{transform:rotate3d(0, 0, 1, -45deg)}section.open .open-close-toggle:hover+.expand-icon .line:nth-of-type(2),section.open .open-close-toggle:focus-visible+.expand-icon .line:nth-of-type(2){transform:translate3d(0, 1rem, 0) rotate(90deg);opacity:0}section.open .open-close-toggle:hover+.expand-icon .line:nth-of-type(3),section.open .open-close-toggle:focus-visible+.expand-icon .line:nth-of-type(3){transform:translate3d(0, -1rem, 0) rotate(-90deg);opacity:0}:host(limel-collapsible-section){--border-radius-of-header:0.75rem;display:block}:host([hidden]){display:none}button.open-close-toggle{appearance:none;background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;text-align:inherit;position:absolute;inset:0;width:100%}button.open-close-toggle:focus{outline:none}button.open-close-toggle:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button.open-close-toggle{transition:background-color 0.4s ease, border-radius 0.1s ease;cursor:pointer;z-index:-1;background-color:var(--closed-header-background-color, rgb(var(--contrast-200)));border-radius:var(--border-radius-of-header)}button.open-close-toggle:hover,button.open-close-toggle:focus-visible{background-color:var(--open-header-background-color, rgb(var(--contrast-300)))}section.open button.open-close-toggle{background-color:var(--open-header-background-color, rgb(var(--contrast-100)));border-radius:var(--border-radius-of-header) var(--border-radius-of-header) var(--limel-cs-open-header-bottom-border-radius, 0) var(--limel-cs-open-header-bottom-border-radius, 0)}section.open button.open-close-toggle:hover,section.open button.open-close-toggle:focus-visible{background-color:var(--open-header-background-color, rgb(var(--contrast-300)))}.title,.divider-line,.expand-icon{pointer-events:none}section{transition:box-shadow 0.4s ease;border-radius:var(--border-radius-of-header)}section[aria-invalid]:not([aria-invalid=false]){--header-stroke-color:rgb(var(--color-red-default)) !important}section[aria-invalid]:not([aria-invalid=false]):not(.open){box-shadow:0 0 0 1px rgb(var(--color-red-default))}header{isolation:isolate;position:relative;align-items:center;display:flex;justify-content:space-between;gap:0.5rem;padding-left:0.5rem;height:2.5rem}limel-icon{width:1.5rem;flex-shrink:0}.title{font-size:1rem;font-weight:300;color:var(--limel-theme-on-surface-color);justify-self:flex-start;user-select:none;height:auto;max-height:3rem;line-height:1.2rem;display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.divider-line{transition:opacity 0.3s ease 0.3s;flex-grow:1;height:0.125rem;border-radius:1rem;background-color:var(--header-stroke-color, rgb(var(--contrast-900)));opacity:0;margin-right:0.5rem}section.open .divider-line{opacity:0.16}.actions{justify-self:flex-end;flex-shrink:0}::slotted([slot=header]){margin-right:0.5rem}.body{background-color:var(--body-background-color, var(--contrast-100));padding-left:var(--body-padding, 1.25rem);padding-right:var(--body-padding, 1.25rem);border-radius:0 0 var(--border-radius-of-header) var(--border-radius-of-header)}.body{transition:grid-template-rows var(--limel-cs-grid-template-rows-transition-speed) cubic-bezier(1, 0.09, 0, 0.89);display:grid;grid-template-rows:var(--limel-cs-grid-template-rows)}.body slot{transition:opacity var(--limel-cs-opacity-transition-speed) ease var(--limel-cs-opacity-transition-delay);display:block;overflow:hidden}:host(limel-collapsible-section:not([is-open])){--limel-cs-opacity-transition-speed:0.1s;--limel-cs-opacity-transition-delay:0s;--limel-cs-grid-template-rows-transition-speed:0.3s;--limel-cs-grid-template-rows:0fr}:host(limel-collapsible-section:not([is-open])) slot{opacity:0}:host(limel-collapsible-section[is-open]){--limel-cs-opacity-transition-speed:0.4s;--limel-cs-opacity-transition-delay:0.3s;--limel-cs-grid-template-rows-transition-speed:0.46s;--limel-cs-grid-template-rows:1fr}:host(limel-collapsible-section[is-open]) slot{opacity:1}header:hover+.body,header:has(.open-close-toggle:hover)+.body,header:has(.open-close-toggle:focus-visible)+.body{will-change:grid-template-rows}header:hover+.body slot,header:has(.open-close-toggle:hover)+.body slot,header:has(.open-close-toggle:focus-visible)+.body slot{will-change:opacity}';export{g as limel_collapsible_section}

package/dist/lime-elements/p-62b6e235.entry.js

@@ -1 +0,0 @@
-import{r as t,c as e,h as i,H as r}from"./p-BU9IJqli.js";import{i as o}from"./p-Bkvc4sus.js";import{g as s}from"./p-CgNJbSP4.js";import{t as a}from"./p-B26k4gw8.js";import{c as l}from"./p-BrjD-ITe.js";import{r as n}from"./p-Dv2HOgWN.js";import{I as h}from"./p-N9vxZMhe.js";import"./p-BCq5M9TE.js";import"./p-Bu_YRgCL.js";import"./p-ChagAaNf.js";const c=class{constructor(r){t(this,r),this.change=e(this,"change",7),this.filesRejected=e(this,"filesRejected",7),this.language="en",this.icon="user",this.disabled=!1,this.readonly=!1,this.required=!1,this.invalid=!1,this.loading=!1,this.imageFit="cover",this.accept="image/jpeg,image/png,image/heic,.jpg,.jpeg,.png,.heic",this.imageError=!1,this.isErrorMessagePopoverOpen=!1,this.removeButtonId=l(),this.browseButtonId=l(),this.renderHelperText=()=>{if(this.helperText)return i("limel-tooltip",{elementId:this.browseButtonId,label:this.helperText})},this.handleNewFiles=async t=>{var e,i,r,s;if(t.stopPropagation(),this.disabled)return;const a=null===(e=t.detail)||void 0===e?void 0:e[0];if(!a)return;if(!o(a,this.accept))return void this.filesRejected.emit([a]);this.revokeObjectUrl(),this.imageError=!1;let l=a;if(this.resize&&a.fileContent instanceof File)try{const t=await n(a.fileContent,Object.assign(Object.assign({},this.resize),{fit:null!==(i=this.resize.fit)&&void 0!==i?i:this.imageFit,type:null!==(r=this.resize.type)&&void 0!==r?r:"image/jpeg",quality:null!==(s=this.resize.quality)&&void 0!==s?s:.85}));l=Object.assign(Object.assign({},a),{filename:t.name,size:t.size,contentType:t.type,fileContent:t})}catch(t){l=a}!l.href&&l.fileContent instanceof File&&(this.objectUrl=URL.createObjectURL(l.fileContent)),this.change.emit(l)},this.handleRejectedFiles=t=>{t.stopPropagation(),this.filesRejected.emit(t.detail)},this.handleClear=t=>{t.stopPropagation(),this.revokeObjectUrl(),this.imageError=!1,this.change.emit(void 0)},this.onImageError=()=>{this.imageError=!0},this.openPopover=t=>{t.stopPropagation(),this.isErrorMessagePopoverOpen=!0},this.onPopoverClose=t=>{t.stopPropagation(),this.isErrorMessagePopoverOpen=!1},this.getTranslation=t=>a.get(t,this.language)}disconnectedCallback(){this.revokeObjectUrl()}handleValueChange(){this.revokeObjectUrl(),this.imageError=!1;const t=this.value;t&&"string"!=typeof t&&!t.href&&t.fileContent instanceof File&&(this.objectUrl=URL.createObjectURL(t.fileContent))}render(){const t={"has-image-error":this.imageError};return this.readonly?i(r,{class:t},this.renderAvatar()):i(r,{class:t},i("limel-file-dropzone",{disabled:this.disabled,accept:this.accept,onFilesSelected:this.handleNewFiles,onFilesRejected:this.handleRejectedFiles},i("limel-file-input",{accept:this.accept,disabled:this.disabled,"aria-required":this.required?"true":void 0,"aria-invalid":this.invalid?"true":void 0},this.renderBrowseButton())),this.renderClearButton(),this.renderSpinner(),this.renderErrorMessage(),this.renderHelperText())}get hasValue(){return"string"==typeof this.value?!!this.value:!(!this.value||!this.value.href&&!this.value.fileContent)||!!this.objectUrl}renderBrowseButton(){return i("button",{id:this.browseButtonId,type:"button",class:"avatar",disabled:this.disabled,"aria-label":this.label,"aria-busy":this.loading?"true":"false","aria-live":"polite"},this.renderAvatar())}renderAvatar(){const t=this.getImageSrc();return t?i(h,{image:{src:t,alt:"",referrerpolicy:"no-referrer"},style:{"--limel-profile-picture-object-fit":this.imageFit},onError:this.onImageError}):this.renderIcon()}renderIcon(){var t,e;const r=s(this.icon);return i("limel-icon",{name:r,style:{color:`${null===(t=this.icon)||void 0===t?void 0:t.color}`,"background-color":`${null===(e=this.icon)||void 0===e?void 0:e.backgroundColor}`}})}renderClearButton(){if(this.hasValue&&!this.disabled)return[i("button",{class:"remove",type:"button",id:this.removeButtonId,onClick:this.handleClear}),i("limel-tooltip",{label:this.getTranslation("profile-picture.remove"),elementId:this.removeButtonId})]}renderSpinner(){if(this.loading)return i("limel-spinner",null)}getUnsupportedPreviewContext(){const t=this.value;return{hasNoSrc:!this.getImageSrc(),hasLocalFile:!(!(t&&"string"!=typeof t&&t.fileContent instanceof File)||t.href),isResizeConfigured:!!this.resize}}shouldShowErrorMessage(){const{hasNoSrc:t,hasLocalFile:e,isResizeConfigured:i}=this.getUnsupportedPreviewContext();return(t||this.imageError)&&e&&i}renderErrorMessage(){if(this.shouldShowErrorMessage())return i("limel-popover",{open:this.isErrorMessagePopoverOpen,onClick:this.openPopover,onClose:this.onPopoverClose},i("limel-icon-button",{slot:"trigger",elevated:!0,icon:{name:"error",color:"rgb(var(--color-orange-dark))"},"aria-live":"polite",label:this.getTranslation("profile-picture.unsupported-preview.title")}),i("limel-callout",{type:"warning",style:{maxWidth:"20rem",borderRadius:"0.75rem"},heading:this.getTranslation("profile-picture.unsupported-preview.title")},this.getTranslation("profile-picture.unsupported-preview.description")))}getImageSrc(){return this.value?"string"==typeof this.value?this.value:this.value.href?this.value.href:this.value.fileContent instanceof File?this.objectUrl:void 0:this.objectUrl}revokeObjectUrl(){this.objectUrl&&(URL.revokeObjectURL(this.objectUrl),this.objectUrl=void 0)}static get watchers(){return{value:[{handleValueChange:0}]}}};c.style="@charset \"UTF-8\";:host(limel-profile-picture){position:relative;display:inline-flex;min-width:1.5rem;min-height:1.5rem;border-radius:var(--profile-picture-border-radius, 100vw);background-color:rgb(var(--contrast-400))}*{box-sizing:border-box}limel-file-dropzone,limel-file-input,button.avatar{display:flex;align-items:center;justify-content:center;width:100%;height:100%}button{appearance:none;background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;text-align:inherit;display:block}button:focus{outline:none}button:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button.avatar{overflow:hidden;border-radius:var(--profile-picture-border-radius, 100vw)}:host(:not([disabled]):not([disabled=true])) button.avatar{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);cursor:pointer;color:var(--limel-theme-on-surface-color);background-color:transparent}:host(:not([disabled]):not([disabled=true])) button.avatar:hover,:host(:not([disabled]):not([disabled=true])) button.avatar:focus,:host(:not([disabled]):not([disabled=true])) button.avatar:focus-visible{will-change:color, background-color, box-shadow, transform}:host(:not([disabled]):not([disabled=true])) button.avatar:hover,:host(:not([disabled]):not([disabled=true])) button.avatar:focus-visible{transform:translate3d(0, 0.01rem, 0);color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color)}:host(:not([disabled]):not([disabled=true])) button.avatar:hover{box-shadow:var(--button-shadow-hovered)}:host(:not([disabled]):not([disabled=true])) button.avatar:active{--limel-clickable-transform-timing-function:cubic-bezier(       0.83,       -0.15,       0.49,       1.16   );transform:translate3d(0, 0.05rem, 0);box-shadow:var(--button-shadow-pressed)}:host(:not([disabled]):not([disabled=true])) button.avatar:hover,:host(:not([disabled]):not([disabled=true])) button.avatar:active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}:host([invalid]:not([invalid=false])) button.avatar{box-shadow:var(--shadow-error-state)}button.remove{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);cursor:pointer;color:var(--limel-theme-on-surface-color);background-color:rgb(var(--contrast-900))}button.remove:hover,button.remove:focus,button.remove:focus-visible{will-change:color, background-color, box-shadow, transform}button.remove:hover,button.remove:focus-visible{transform:translate3d(0, 0.01rem, 0);color:rgb(var(--color-white));background-color:rgb(var(--color-red-default))}button.remove:hover{box-shadow:var(--button-shadow-hovered)}button.remove:active{--limel-clickable-transform-timing-function:cubic-bezier(       0.83,       -0.15,       0.49,       1.16   );transform:translate3d(0, 0.05rem, 0);box-shadow:var(--button-shadow-pressed)}button.remove:hover,button.remove:active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}button.remove{cursor:pointer;height:1.25rem;width:1.25rem;border-radius:50%;background-repeat:no-repeat;background-position:center;background-size:0.75rem;background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2032%2032'%3E%3Cdefs/%3E%3Cpath%20fill='rgb(255,255,255)'%20d='M7.219%205.781L5.78%207.22%2014.563%2016%205.78%2024.781%207.22%2026.22%2016%2017.437l8.781%208.782%201.438-1.438L17.437%2016l8.782-8.781L24.78%205.78%2016%2014.563z'/%3E%3C/svg%3E\");position:absolute;top:0;left:0;opacity:0}:host(:hover) button.remove,:host(:focus) button.remove,:host(:focus-visible) button.remove,:host(:focus-within) button.remove,:host(:active) button.remove{animation:show 0.4s ease-in-out forwards}@keyframes show{0%{transform:scale(0.9);opacity:0}100%{transform:scale(1);opacity:1}}button.avatar,img,limel-icon{border-radius:var(--profile-picture-border-radius, 100vw)}limel-icon{width:calc(100% - 1rem);min-width:1rem;max-width:4rem;color:var(--limel-theme-text-secondary-on-background-color);margin:auto}img{object-fit:var(--limel-profile-picture-object-fit);width:100%;height:100%}:host(.has-image-error) img{border:1px dashed rgb(var(--contrast-600));background:url(\"data:image/svg+xml;charset=utf-8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8' style='fill-rule:evenodd;'><path fill='rgba(186,186,192,0.16)' d='M0 0h4v4H0zM4 4h4v4H4z'/></svg>\");background-size:0.5rem}limel-spinner{position:absolute;inset:0;margin:auto}limel-popover{position:absolute;inset:auto 0 0 auto;display:block;width:2.25rem;height:2.25rem}";export{c as limel_profile_picture}

package/dist/lime-elements/p-713a1158.entry.js

@@ -1 +0,0 @@
-import{r as e,c as o,h as t,a as r}from"./p-BU9IJqli.js";import{c as i}from"./p-BrjD-ITe.js";import{E as s}from"./p-Bu6-QXrA.js";import{f as a,z as c}from"./p-B8Rm8W5O.js";import"./p-ByzvFNMm.js";import"./p-9W8bTt2G.js";import"./p-DbBZn7JO.js";import"./p-BcJ-TDVt.js";import"./p-BJQylLSL.js";import"./p-CZ30nDJE.js";import"./p-BhoYaGlg.js";function n(e){const o=e.closest(".limel-portal--container");return o?o.portalSource:e.getRootNode().host}const p=class{constructor(t){e(this,t),this.close=o(this,"close",7),this.open=!1,this.shouldRestoreFocusOnClose=!1,this.handleGlobalKeyPress=e=>{e.key===s&&(e.stopPropagation(),e.preventDefault(),this.requestCloseAndRestoreFocus())},this.requestCloseAndRestoreFocus=()=>{this.shouldRestoreFocusOnClose=!0,this.close.emit()},this.setTriggerRef=e=>{this.triggerSlot=e},this.focusTrigger=()=>{var e,o;const t=null===(o=null===(e=this.triggerSlot)||void 0===e?void 0:e.assignedElements())||void 0===o?void 0:o[0];a(t)},this.setTriggerAttributes=e=>{e.setAttribute("aria-haspopup","true"),e.setAttribute("aria-expanded",this.open?"true":"false"),e.setAttribute("aria-controls",this.portalId),e.setAttribute("role","button")},this.portalId=i(),this.globalClickListener=this.globalClickListener.bind(this)}watchOpen(){this.setupGlobalHandlers(),!this.open&&this.shouldRestoreFocusOnClose&&(this.shouldRestoreFocusOnClose=!1,setTimeout(this.focusTrigger,0))}connectedCallback(){this.setupGlobalHandlers()}disconnectedCallback(){this.teardownGlobalHandlers()}componentDidRender(){if(this.triggerSlot)for(const e of this.triggerSlot.assignedElements())this.setTriggerAttributes(e)}setupGlobalHandlers(){this.open&&this.host.isConnected?(document.addEventListener("click",this.globalClickListener,{capture:!0}),document.addEventListener("keydown",this.handleGlobalKeyPress)):this.teardownGlobalHandlers()}teardownGlobalHandlers(){document.removeEventListener("click",this.globalClickListener,{capture:!0}),document.removeEventListener("keydown",this.handleGlobalKeyPress)}render(){const e=this.getCssProperties(),o=getComputedStyle(this.host).getPropertyValue("--popover-z-index");return t("div",{key:"5292df85fc887c632417be674a1521e0c3084ad4",class:"trigger-anchor"},t("slot",{key:"6612ae05c8145183234f265e6cdd7419fbebe292",name:"trigger",ref:this.setTriggerRef}),t("limel-portal",{key:"67e816cb950de1933a368743c745b5080fd49ba0",visible:this.open,containerId:this.portalId,containerStyle:{"z-index":o},openDirection:this.openDirection},t("limel-popover-surface",{key:"f22deeea052c868f753fd7016c615ccee5bb068a",contentCollection:this.host.children,style:e})))}globalClickListener(e){const o=function(e,o){var t;let r=o;do{if(e.contains(r)||(null===(t=e.shadowRoot)||void 0===t?void 0:t.contains(r)))return!0;r=n(r)}while(r);return!1}(this.host,e.target);this.open&&!o&&(e.stopPropagation(),e.preventDefault(),this.close.emit())}getCssProperties(){const e=["--popover-surface-width","--popover-body-background-color","--popover-border-radius","--popover-box-shadow"],o=getComputedStyle(this.host),t=e.map((e=>o.getPropertyValue(e)));return c(e,t)}get host(){return r(this)}static get watchers(){return{open:[{watchOpen:0}]}}};p.style=".trigger-anchor{display:inline-block;position:relative}";const l=class{constructor(o){e(this,o)}componentDidLoad(){this.appendElement()}render(){return t("div",{key:"437d1e0bf1d1ab969aac149c2ada4124ee771ae8",class:"limel-popover-surface",tabindex:"0"})}appendElement(){const e=this.host.shadowRoot.querySelector(".limel-popover-surface"),o=[...this.contentCollection];for(const t of o)"trigger"!==t.slot&&e.append(t)}get host(){return r(this)}};l.style='@charset "UTF-8";:host(limel-popover-surface){isolation:isolate;position:relative;display:flex;width:var(--popover-surface-width, auto);max-height:inherit;max-width:calc(100vw - 2rem);margin:0 0.25rem}.limel-popover-surface{flex:1;min-width:0;min-height:0;border-radius:var(--popover-border-radius, 0.75rem);box-shadow:var(--popover-box-shadow, var(--shadow-depth-16));border:1px solid rgb(var(--contrast-1200), 0.1);backdrop-filter:blur(0.3125rem);-webkit-backdrop-filter:blur(0.3125rem)}.limel-popover-surface:after{transition:opacity 0.4s ease;pointer-events:none;content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;opacity:0.95;border-radius:var(--popover-border-radius, 0.75rem);background-color:var(--popover-body-background-color, var(--lime-elevated-surface-background-color))}.limel-popover-surface:focus{outline:none}.limel-popover-surface:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.limel-popover-surface:focus:after,.limel-popover-surface:focus-within:after{opacity:1}.limel-popover-surface>*{box-sizing:border-box}';export{p as limel_popover,l as limel_popover_surface}