@limetech/lime-elements 36.0.0-next.4 → 36.0.0-next.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/lime-elements.cjs.js +1 -1
- package/dist/cjs/limel-button.cjs.entry.js +2 -2
- package/dist/cjs/{limel-color-picker-palette_2.cjs.entry.js → limel-color-picker-palette.cjs.entry.js} +0 -112
- package/dist/cjs/limel-dock-button.cjs.entry.js +79 -0
- package/dist/cjs/limel-dock.cjs.entry.js +105 -0
- package/dist/cjs/{limel-list_3.cjs.entry.js → limel-list_2.cjs.entry.js} +0 -2018
- package/dist/cjs/limel-popover_4.cjs.entry.js +239 -0
- package/dist/cjs/limel-portal.cjs.entry.js +2024 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +2 -0
- package/dist/collection/components/button/button.css +3 -0
- package/dist/collection/components/button/button.js +1 -2
- package/dist/collection/components/dock/dock-button/dock-button.css +71 -0
- package/dist/collection/components/dock/dock-button/dock-button.js +187 -0
- package/dist/collection/components/dock/dock.css +107 -0
- package/dist/collection/components/dock/dock.js +254 -0
- package/dist/collection/components/dock/dock.types.js +1 -0
- package/dist/esm/lime-elements.js +1 -1
- package/dist/esm/limel-button.entry.js +2 -2
- package/dist/esm/{limel-color-picker-palette_2.entry.js → limel-color-picker-palette.entry.js} +2 -113
- package/dist/esm/limel-dock-button.entry.js +75 -0
- package/dist/esm/limel-dock.entry.js +101 -0
- package/dist/esm/{limel-list_3.entry.js → limel-list_2.entry.js} +1 -2018
- package/dist/esm/limel-popover_4.entry.js +232 -0
- package/dist/esm/limel-portal.entry.js +2020 -0
- package/dist/esm/loader.js +1 -1
- package/dist/lime-elements/lime-elements.esm.js +1 -1
- package/dist/lime-elements/p-009de50e.entry.js +1 -0
- package/dist/lime-elements/{p-08251941.entry.js → p-19f72dab.entry.js} +1 -1
- package/dist/lime-elements/p-1dfccbc5.entry.js +1 -0
- package/dist/lime-elements/p-93cd2268.entry.js +1 -0
- package/dist/lime-elements/p-b9af1b40.entry.js +1 -0
- package/dist/lime-elements/p-bd098a11.entry.js +1 -0
- package/dist/lime-elements/p-fabea4b5.entry.js +1 -0
- package/dist/types/components/dock/dock-button/dock-button.d.ts +36 -0
- package/dist/types/components/dock/dock.d.ts +71 -0
- package/dist/types/components/dock/dock.types.d.ts +53 -0
- package/dist/types/components.d.ts +108 -0
- package/dist/types/interface.d.ts +1 -0
- package/package.json +1 -1
- package/dist/cjs/limel-popover-surface.cjs.entry.js +0 -32
- package/dist/cjs/limel-tooltip_2.cjs.entry.js +0 -102
- package/dist/esm/limel-popover-surface.entry.js +0 -28
- package/dist/esm/limel-tooltip_2.entry.js +0 -97
- package/dist/lime-elements/p-22569fb6.entry.js +0 -1
- package/dist/lime-elements/p-2fbfc1ea.entry.js +0 -1
- package/dist/lime-elements/p-705334c1.entry.js +0 -1
- package/dist/lime-elements/p-87453b45.entry.js +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,h as o}from"./p-e9a95b8f.js";const e=class{constructor(o){t(this,o),this.primary=!1,this.outlined=!1,this.disabled=!1,this.loading=!1,this.loadingFailed=!1,this.justLoaded=!1}render(){return o("button",{class:{"mdc-button":!0,"mdc-button--unelevated":this.primary,loading:this.loading,"just-loaded":this.justLoaded&&!this.loadingFailed,"just-failed":this.justLoaded&&this.loadingFailed,"mdc-button--outlined":this.outlined},disabled:this.disabled||this.loading},this.renderIcon(),o("span",{class:"label mdc-button__label"},this.label),o("limel-spinner",{limeBranded:!1}),o("svg",{viewBox:"0 0 30 30"},this.renderLoadingIcons()))}loadingWatcher(t,o){o&&!t?(this.justLoaded=!0,this.justLoadedTimeout=window.setTimeout((()=>{this.justLoaded=!1}),2e3)):t&&(this.justLoaded=!1,window.clearTimeout(this.justLoadedTimeout))}renderLoadingIcons(){return this.loadingFailed?[o("line",{x1:"9",y1:"9",x2:"21",y2:"21"}),o("line",{x1:"21",y1:"9",x2:"9",y2:"21"})]:[o("line",{x1:"8",y1:"14",x2:"15",y2:"20"}),o("line",{x1:"23",y1:"9",x2:"14",y2:"20"})]}renderIcon(){if(!this.icon)return;let t="";return this.label||(t="no-label"),o("i",{class:`mdc-button__icon ${t}`},o("limel-icon",{name:this.icon}))}static get watchers(){return{loading:["loadingWatcher"]}}};e.style=':host{--mdc-theme-primary:var(\n --lime-primary-color,\n rgb(var(--color-teal-default))\n );--mdc-theme-secondary:var(\n --lime-secondary-color,\n rgb(var(--contrast-1100))\n );--mdc-theme-on-primary:var(\n --lime-on-primary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-secondary:var(\n --lime-on-secondary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-text-disabled-on-background:var(\n --lime-text-disabled-on-background-color,\n rgba(var(--contrast-1700), 0.38)\n );--mdc-theme-text-primary-on-background:var(\n --lime-text-primary-on-background-color,\n rgba(var(--contrast-1700), 0.87)\n );--mdc-theme-text-secondary-on-background:var(\n --lime-text-secondary-on-background-color,\n rgba(var(--contrast-1700), 0.54)\n );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n --lime-surface-background-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-surface:var(\n --lime-on-surface-color,\n var(--lime-text-primary-on-background-color)\n )}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1);background-color:#fff;background-color:var(--mdc-elevation-overlay-color, #fff)}.mdc-button{position:relative;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:64px;border:none;outline:none;line-height:inherit;user-select:none;-webkit-appearance:none;overflow:visible;vertical-align:middle;background:transparent}.mdc-button .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-button::-moz-focus-inner{padding:0;border:0}.mdc-button:active{outline:none}.mdc-button:hover{cursor:pointer}.mdc-button:disabled{cursor:default;pointer-events:none}.mdc-button .mdc-button__icon{margin-left:0;margin-right:8px;display:inline-block;position:relative;vertical-align:top}[dir=rtl] .mdc-button .mdc-button__icon,.mdc-button .mdc-button__icon[dir=rtl]{margin-left:8px;margin-right:0;}.mdc-button .mdc-button__label{position:relative}.mdc-button .mdc-button__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-button__label+.mdc-button__icon{margin-left:8px;margin-right:0}[dir=rtl] .mdc-button__label+.mdc-button__icon,.mdc-button__label+.mdc-button__icon[dir=rtl]{margin-left:0;margin-right:8px;}svg.mdc-button__icon{fill:currentColor}.mdc-button--touch{margin-top:6px;margin-bottom:6px}.mdc-button{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));text-decoration:none;text-decoration:var(--mdc-typography-button-text-decoration, none)}.mdc-button{padding:0 8px 0 8px}.mdc-button--unelevated{transition:box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);padding:0 16px 0 16px}.mdc-button--unelevated.mdc-button--icon-trailing{padding:0 12px 0 16px}.mdc-button--unelevated.mdc-button--icon-leading{padding:0 16px 0 12px}.mdc-button--raised{transition:box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);padding:0 16px 0 16px}.mdc-button--raised.mdc-button--icon-trailing{padding:0 12px 0 16px}.mdc-button--raised.mdc-button--icon-leading{padding:0 16px 0 12px}.mdc-button--outlined{border-style:solid;transition:border 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-button--outlined .mdc-button__ripple{border-style:solid;border-color:transparent}@keyframes mdc-ripple-fg-radius-in{from{animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-opacity-in{from{animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-out{from{animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-button{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}.mdc-button .mdc-button__ripple::before,.mdc-button .mdc-button__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.mdc-button .mdc-button__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-button .mdc-button__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-button.mdc-ripple-upgraded .mdc-button__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-button.mdc-ripple-upgraded .mdc-button__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-button.mdc-ripple-upgraded--unbounded .mdc-button__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-button.mdc-ripple-upgraded--foreground-activation .mdc-button__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-button.mdc-ripple-upgraded--foreground-deactivation .mdc-button__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-button .mdc-button__ripple::before,.mdc-button .mdc-button__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-button.mdc-ripple-upgraded .mdc-button__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-button .mdc-button__ripple{position:absolute;box-sizing:content-box;width:100%;height:100%;overflow:hidden;z-index:0}.mdc-button:not(.mdc-button--outlined) .mdc-button__ripple{top:0;left:0}.mdc-button{font-family:Roboto, sans-serif;font-family:var(--mdc-text-button-label-text-font, var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif)));font-size:0.875rem;font-size:var(--mdc-text-button-label-text-size, var(--mdc-typography-button-font-size, 0.875rem));letter-spacing:0.0892857143em;letter-spacing:var(--mdc-text-button-label-text-tracking, var(--mdc-typography-button-letter-spacing, 0.0892857143em));font-weight:500;font-weight:var(--mdc-text-button-label-text-weight, var(--mdc-typography-button-font-weight, 500));text-transform:none;text-transform:var(--mdc-text-button-label-text-transform, var(--mdc-typography-button-text-transform, none));height:36px;height:var(--mdc-text-button-container-height, 36px);border-radius:4px;border-radius:var(--mdc-text-button-container-shape, var(--mdc-shape-small, 4px))}.mdc-button:not(:disabled){color:#26a69a;color:var(--mdc-text-button-label-text-color, var(--mdc-theme-primary, #26a69a))}.mdc-button:disabled{color:rgba(0, 0, 0, 0.38);color:var(--mdc-text-button-disabled-label-text-color, rgba(0, 0, 0, 0.38))}.mdc-button .mdc-button__icon{font-size:1.125rem;font-size:var(--mdc-text-button-with-icon-icon-size, 1.125rem);width:1.125rem;width:var(--mdc-text-button-with-icon-icon-size, 1.125rem);height:1.125rem;height:var(--mdc-text-button-with-icon-icon-size, 1.125rem)}.mdc-button .mdc-button__ripple::before,.mdc-button .mdc-button__ripple::after{background-color:#26a69a;background-color:var(--mdc-text-button-hover-state-layer-color, var(--mdc-theme-primary, #26a69a))}.mdc-button:hover .mdc-button__ripple::before,.mdc-button.mdc-ripple-surface--hover .mdc-button__ripple::before{opacity:0.04;opacity:var(--mdc-text-button-hover-state-layer-opacity, 0.04)}.mdc-button.mdc-ripple-upgraded--background-focused .mdc-button__ripple::before,.mdc-button:not(.mdc-ripple-upgraded):focus .mdc-button__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-text-button-focus-state-layer-opacity, 0.12)}.mdc-button:not(.mdc-ripple-upgraded) .mdc-button__ripple::after{transition:opacity 150ms linear}.mdc-button:not(.mdc-ripple-upgraded):active .mdc-button__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-text-button-pressed-state-layer-opacity, 0.12)}.mdc-button.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-text-button-pressed-state-layer-opacity, 0.12)}.mdc-button .mdc-button__ripple{border-radius:4px;border-radius:var(--mdc-text-button-container-shape, var(--mdc-shape-small, 4px))}.mdc-button--unelevated{font-family:Roboto, sans-serif;font-family:var(--mdc-filled-button-label-text-font, var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif)));font-size:0.875rem;font-size:var(--mdc-filled-button-label-text-size, var(--mdc-typography-button-font-size, 0.875rem));letter-spacing:0.0892857143em;letter-spacing:var(--mdc-filled-button-label-text-tracking, var(--mdc-typography-button-letter-spacing, 0.0892857143em));font-weight:500;font-weight:var(--mdc-filled-button-label-text-weight, var(--mdc-typography-button-font-weight, 500));text-transform:none;text-transform:var(--mdc-filled-button-label-text-transform, var(--mdc-typography-button-text-transform, none));height:36px;height:var(--mdc-filled-button-container-height, 36px);border-radius:4px;border-radius:var(--mdc-filled-button-container-shape, var(--mdc-shape-small, 4px))}.mdc-button--unelevated:not(:disabled){background-color:#26a69a;background-color:var(--mdc-filled-button-container-color, var(--mdc-theme-primary, #26a69a))}.mdc-button--unelevated:disabled{background-color:rgba(0, 0, 0, 0.12);background-color:var(--mdc-filled-button-disabled-container-color, rgba(0, 0, 0, 0.12))}.mdc-button--unelevated:not(:disabled){color:#fff;color:var(--mdc-filled-button-label-text-color, var(--mdc-theme-on-primary, #fff))}.mdc-button--unelevated:disabled{color:rgba(0, 0, 0, 0.38);color:var(--mdc-filled-button-disabled-label-text-color, rgba(0, 0, 0, 0.38))}.mdc-button--unelevated .mdc-button__icon{font-size:1.125rem;font-size:var(--mdc-filled-button-with-icon-icon-size, 1.125rem);width:1.125rem;width:var(--mdc-filled-button-with-icon-icon-size, 1.125rem);height:1.125rem;height:var(--mdc-filled-button-with-icon-icon-size, 1.125rem)}.mdc-button--unelevated .mdc-button__ripple::before,.mdc-button--unelevated .mdc-button__ripple::after{background-color:#fff;background-color:var(--mdc-filled-button-hover-state-layer-color, var(--mdc-theme-on-primary, #fff))}.mdc-button--unelevated:hover .mdc-button__ripple::before,.mdc-button--unelevated.mdc-ripple-surface--hover .mdc-button__ripple::before{opacity:0.08;opacity:var(--mdc-filled-button-hover-state-layer-opacity, 0.08)}.mdc-button--unelevated.mdc-ripple-upgraded--background-focused .mdc-button__ripple::before,.mdc-button--unelevated:not(.mdc-ripple-upgraded):focus .mdc-button__ripple::before{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-filled-button-focus-state-layer-opacity, 0.24)}.mdc-button--unelevated:not(.mdc-ripple-upgraded) .mdc-button__ripple::after{transition:opacity 150ms linear}.mdc-button--unelevated:not(.mdc-ripple-upgraded):active .mdc-button__ripple::after{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-filled-button-pressed-state-layer-opacity, 0.24)}.mdc-button--unelevated.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-filled-button-pressed-state-layer-opacity, 0.24)}.mdc-button--unelevated .mdc-button__ripple{border-radius:4px;border-radius:var(--mdc-filled-button-container-shape, var(--mdc-shape-small, 4px))}.mdc-button--raised{font-family:Roboto, sans-serif;font-family:var(--mdc-protected-button-label-text-font, var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif)));font-size:0.875rem;font-size:var(--mdc-protected-button-label-text-size, var(--mdc-typography-button-font-size, 0.875rem));letter-spacing:0.0892857143em;letter-spacing:var(--mdc-protected-button-label-text-tracking, var(--mdc-typography-button-letter-spacing, 0.0892857143em));font-weight:500;font-weight:var(--mdc-protected-button-label-text-weight, var(--mdc-typography-button-font-weight, 500));text-transform:none;text-transform:var(--mdc-protected-button-label-text-transform, var(--mdc-typography-button-text-transform, none));height:36px;height:var(--mdc-protected-button-container-height, 36px);border-radius:4px;border-radius:var(--mdc-protected-button-container-shape, var(--mdc-shape-small, 4px));box-shadow:0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);box-shadow:var(--mdc-protected-button-container-elevation, var(--mdc-elevation-box-shadow-for-gss));--mdc-elevation-box-shadow-for-gss:0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12)}.mdc-button--raised:not(:disabled){background-color:#26a69a;background-color:var(--mdc-protected-button-container-color, var(--mdc-theme-primary, #26a69a))}.mdc-button--raised:disabled{background-color:rgba(0, 0, 0, 0.12);background-color:var(--mdc-protected-button-disabled-container-color, rgba(0, 0, 0, 0.12))}.mdc-button--raised:not(:disabled){color:#fff;color:var(--mdc-protected-button-label-text-color, var(--mdc-theme-on-primary, #fff))}.mdc-button--raised:disabled{color:rgba(0, 0, 0, 0.38);color:var(--mdc-protected-button-disabled-label-text-color, rgba(0, 0, 0, 0.38))}.mdc-button--raised .mdc-button__icon{font-size:1.125rem;font-size:var(--mdc-protected-button-with-icon-icon-size, 1.125rem);width:1.125rem;width:var(--mdc-protected-button-with-icon-icon-size, 1.125rem);height:1.125rem;height:var(--mdc-protected-button-with-icon-icon-size, 1.125rem)}.mdc-button--raised .mdc-button__ripple::before,.mdc-button--raised .mdc-button__ripple::after{background-color:#fff;background-color:var(--mdc-protected-button-hover-state-layer-color, var(--mdc-theme-on-primary, #fff))}.mdc-button--raised:hover .mdc-button__ripple::before,.mdc-button--raised.mdc-ripple-surface--hover .mdc-button__ripple::before{opacity:0.08;opacity:var(--mdc-protected-button-hover-state-layer-opacity, 0.08)}.mdc-button--raised.mdc-ripple-upgraded--background-focused .mdc-button__ripple::before,.mdc-button--raised:not(.mdc-ripple-upgraded):focus .mdc-button__ripple::before{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-protected-button-focus-state-layer-opacity, 0.24)}.mdc-button--raised:not(.mdc-ripple-upgraded) .mdc-button__ripple::after{transition:opacity 150ms linear}.mdc-button--raised:not(.mdc-ripple-upgraded):active .mdc-button__ripple::after{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-protected-button-pressed-state-layer-opacity, 0.24)}.mdc-button--raised.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-protected-button-pressed-state-layer-opacity, 0.24)}.mdc-button--raised .mdc-button__ripple{border-radius:4px;border-radius:var(--mdc-protected-button-container-shape, var(--mdc-shape-small, 4px))}.mdc-button--raised.mdc-ripple-upgraded--background-focused,.mdc-button--raised:not(.mdc-ripple-upgraded):focus{box-shadow:0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);box-shadow:var(--mdc-protected-button-focus-container-elevation, var(--mdc-elevation-box-shadow-for-gss));--mdc-elevation-box-shadow-for-gss:0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12)}.mdc-button--raised:hover{box-shadow:0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);box-shadow:var(--mdc-protected-button-hover-container-elevation, var(--mdc-elevation-box-shadow-for-gss));--mdc-elevation-box-shadow-for-gss:0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12)}.mdc-button--raised:not(:disabled):active{box-shadow:0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);box-shadow:var(--mdc-protected-button-pressed-container-elevation, var(--mdc-elevation-box-shadow-for-gss));--mdc-elevation-box-shadow-for-gss:0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12)}.mdc-button--raised:disabled{box-shadow:0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);box-shadow:var(--mdc-protected-button-disabled-container-elevation, var(--mdc-elevation-box-shadow-for-gss));--mdc-elevation-box-shadow-for-gss:0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12)}.mdc-button--outlined{font-family:Roboto, sans-serif;font-family:var(--mdc-outlined-button-label-text-font, var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif)));font-size:0.875rem;font-size:var(--mdc-outlined-button-label-text-size, var(--mdc-typography-button-font-size, 0.875rem));letter-spacing:0.0892857143em;letter-spacing:var(--mdc-outlined-button-label-text-tracking, var(--mdc-typography-button-letter-spacing, 0.0892857143em));font-weight:500;font-weight:var(--mdc-outlined-button-label-text-weight, var(--mdc-typography-button-font-weight, 500));text-transform:none;text-transform:var(--mdc-outlined-button-label-text-transform, var(--mdc-typography-button-text-transform, none));height:36px;height:var(--mdc-outlined-button-container-height, 36px);border-radius:4px;border-radius:var(--mdc-outlined-button-container-shape, var(--mdc-shape-small, 4px));padding:0 15px 0 15px;border-width:1px;border-width:var(--mdc-outlined-button-outline-width, 1px)}.mdc-button--outlined:not(:disabled){color:#26a69a;color:var(--mdc-outlined-button-label-text-color, var(--mdc-theme-primary, #26a69a))}.mdc-button--outlined:disabled{color:rgba(0, 0, 0, 0.38);color:var(--mdc-outlined-button-disabled-label-text-color, rgba(0, 0, 0, 0.38))}.mdc-button--outlined .mdc-button__icon{font-size:1.125rem;font-size:var(--mdc-outlined-button-with-icon-icon-size, 1.125rem);width:1.125rem;width:var(--mdc-outlined-button-with-icon-icon-size, 1.125rem);height:1.125rem;height:var(--mdc-outlined-button-with-icon-icon-size, 1.125rem)}.mdc-button--outlined .mdc-button__ripple::before,.mdc-button--outlined .mdc-button__ripple::after{background-color:#26a69a;background-color:var(--mdc-outlined-button-hover-state-layer-color, var(--mdc-theme-primary, #26a69a))}.mdc-button--outlined:hover .mdc-button__ripple::before,.mdc-button--outlined.mdc-ripple-surface--hover .mdc-button__ripple::before{opacity:0.04;opacity:var(--mdc-outlined-button-hover-state-layer-opacity, 0.04)}.mdc-button--outlined.mdc-ripple-upgraded--background-focused .mdc-button__ripple::before,.mdc-button--outlined:not(.mdc-ripple-upgraded):focus .mdc-button__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-outlined-button-focus-state-layer-opacity, 0.12)}.mdc-button--outlined:not(.mdc-ripple-upgraded) .mdc-button__ripple::after{transition:opacity 150ms linear}.mdc-button--outlined:not(.mdc-ripple-upgraded):active .mdc-button__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-outlined-button-pressed-state-layer-opacity, 0.12)}.mdc-button--outlined.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-outlined-button-pressed-state-layer-opacity, 0.12)}.mdc-button--outlined .mdc-button__ripple{border-radius:4px;border-radius:var(--mdc-outlined-button-container-shape, var(--mdc-shape-small, 4px))}.mdc-button--outlined:not(:disabled){border-color:rgba(0, 0, 0, 0.12);border-color:var(--mdc-outlined-button-outline-color, rgba(0, 0, 0, 0.12))}.mdc-button--outlined:disabled{border-color:rgba(0, 0, 0, 0.12);border-color:var(--mdc-outlined-button-disabled-outline-color, rgba(0, 0, 0, 0.12))}.mdc-button--outlined.mdc-button--icon-trailing{padding:0 11px 0 15px}.mdc-button--outlined.mdc-button--icon-leading{padding:0 15px 0 11px}.mdc-button--outlined .mdc-button__ripple{top:calc(-1 * 1px);top:calc(-1 * var(--mdc-outlined-button-outline-width, 1px));left:calc(-1 * 1px);left:calc(-1 * var(--mdc-outlined-button-outline-width, 1px));border-width:1px;border-width:var(--mdc-outlined-button-outline-width, 1px)}.mdc-button--outlined .mdc-button__touch{left:calc(-1 * 1px);left:calc(-1 * var(--mdc-outlined-button-outline-width, 1px));width:calc(100% + 2 * 1px);width:calc(100% + 2 * var(--mdc-outlined-button-outline-width, 1px))}.mdc-button--raised .mdc-button__icon,.mdc-button--unelevated .mdc-button__icon,.mdc-button--outlined .mdc-button__icon{margin-left:-4px;margin-right:8px}[dir=rtl] .mdc-button--raised .mdc-button__icon,[dir=rtl] .mdc-button--unelevated .mdc-button__icon,[dir=rtl] .mdc-button--outlined .mdc-button__icon,.mdc-button--raised .mdc-button__icon[dir=rtl],.mdc-button--unelevated .mdc-button__icon[dir=rtl],.mdc-button--outlined .mdc-button__icon[dir=rtl]{margin-left:8px;margin-right:-4px;}.mdc-button--raised .mdc-button__label+.mdc-button__icon,.mdc-button--unelevated .mdc-button__label+.mdc-button__icon,.mdc-button--outlined .mdc-button__label+.mdc-button__icon{margin-left:8px;margin-right:-4px}[dir=rtl] .mdc-button--raised .mdc-button__label+.mdc-button__icon,[dir=rtl] .mdc-button--unelevated .mdc-button__label+.mdc-button__icon,[dir=rtl] .mdc-button--outlined .mdc-button__label+.mdc-button__icon,.mdc-button--raised .mdc-button__label+.mdc-button__icon[dir=rtl],.mdc-button--unelevated .mdc-button__label+.mdc-button__icon[dir=rtl],.mdc-button--outlined .mdc-button__label+.mdc-button__icon[dir=rtl]{margin-left:-4px;margin-right:8px;}:host{display:inline-block}:host([hidden]){display:none}:host([disabled]){pointer-events:none}button{transition:background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;box-shadow:var(--button-shadow-normal)}button:hover{box-shadow:var(--button-shadow-hovered)}button:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}button:focus-visible{box-shadow:var(--shadow-depth-8-focused)}button.mdc-button{min-width:2.25rem;padding:0 0.75rem;height:100%;min-height:2.25rem;width:100%}button.mdc-button:not(:disabled){color:var(--mdc-theme-primary, rgb(var(--color-teal-default)));background-color:rgb(var(--contrast-100))}button.mdc-button:not(:disabled).mdc-button--raised,button.mdc-button:not(:disabled).mdc-button--unelevated{color:var(--mdc-theme-on-primary, rgb(var(--color-white)));background-color:var(--mdc-theme-primary, rgb(var(--color-teal-default)))}button.mdc-button:disabled{color:rgba(var(--contrast-1600), 0.37);background-color:rgba(var(--contrast-1600), 0.1)}button.mdc-button:disabled.mdc-button--raised,button.mdc-button:disabled.mdc-button--unelevated{background-color:rgba(var(--contrast-1700), 0.15)}button.mdc-button:disabled.mdc-button--outlined{border-color:rgba(var(--contrast-1700), 0.2)}button .label{opacity:1}button limel-spinner{opacity:0;display:none;position:absolute}button .mdc-button__icon{flex-shrink:0}button .mdc-button__icon.no-label{margin-right:-0.25rem;margin-left:-0.25rem}button limel-icon{vertical-align:top}button svg{height:1.875rem;opacity:0;pointer-events:none;position:absolute;width:1.875rem}button svg line{stroke:rgb(var(--color-white));stroke-width:2}button limel-icon,button .label,button limel-spinner,button svg{transition:opacity 300ms ease-in-out}button.loading limel-icon,button.loading .label{opacity:0}button.loading limel-spinner{opacity:1;display:block}button.just-loaded limel-icon,button.just-loaded .label,button.just-failed limel-icon,button.just-failed .label{opacity:0}button.just-loaded svg,button.just-failed svg{opacity:1}button.just-loaded limel-spinner,button.just-failed limel-spinner{display:block;animation:fade-out-spinner 0.3s ease}button.just-failed{background-color:var(--lime-error-text-color) !important;animation:shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both}.mdc-button--outlined:not(:disabled){border-color:#26a69a;border-color:var(--mdc-theme-primary, #26a69a)}@keyframes fade-out-spinner{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.5)}}@keyframes shake{10%,90%{transform:translate3d(-0.0625rem, 0, 0)}20%,80%{transform:translate3d(0.125rem, 0, 0)}30%,50%,70%{transform:translate3d(-0.1875rem, 0, 0)}40%,60%{transform:translate3d(0.1875rem, 0, 0)}}@keyframes reduced-presence{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(0.7)}}:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded){animation:reduced-presence 0.3s ease forwards;transition:padding 0.3s ease, min-width 0.3s ease;transition-delay:0.3s;padding:0;min-width:0}:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) .label{transition:font-size 0.8s ease;transition-delay:0.3s;font-size:0;opacity:0}:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) limel-icon,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) limel-spinner,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) svg{transition:all 0.3s ease;transition-delay:0.3s;opacity:0;width:0;height:0}';export{e as limel_button}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,h as n,g as e}from"./p-e9a95b8f.js";var r="top",i="bottom",o="right",a="left",u=[r,i,o,a],f=u.reduce((function(t,n){return t.concat([n+"-start",n+"-end"])}),[]),s=[].concat(u,["auto"]).reduce((function(t,n){return t.concat([n,n+"-start",n+"-end"])}),[]),c=["beforeRead","read","afterRead","beforeMain","main","afterMain","beforeWrite","write","afterWrite"];function l(t){return t?(t.nodeName||"").toLowerCase():null}function p(t){if(null==t)return window;if("[object Window]"!==t.toString()){var n=t.ownerDocument;return n&&n.defaultView||window}return t}function d(t){return t instanceof p(t).Element||t instanceof Element}function h(t){return t instanceof p(t).HTMLElement||t instanceof HTMLElement}function v(t){return"undefined"!=typeof ShadowRoot&&(t instanceof p(t).ShadowRoot||t instanceof ShadowRoot)}function b(t){return t.split("-")[0]}var m=Math.max,y=Math.min,g=Math.round;function w(t,n){void 0===n&&(n=!1);var e=t.getBoundingClientRect(),r=1,i=1;if(h(t)&&n){var o=t.offsetHeight,a=t.offsetWidth;a>0&&(r=g(e.width)/a||1),o>0&&(i=g(e.height)/o||1)}return{width:e.width/r,height:e.height/i,top:e.top/i,right:e.right/r,bottom:e.bottom/i,left:e.left/r,x:e.left/r,y:e.top/i}}function x(t){var n=w(t),e=t.offsetWidth,r=t.offsetHeight;return Math.abs(n.width-e)<=1&&(e=n.width),Math.abs(n.height-r)<=1&&(r=n.height),{x:t.offsetLeft,y:t.offsetTop,width:e,height:r}}function O(t,n){var e=n.getRootNode&&n.getRootNode();if(t.contains(n))return!0;if(e&&v(e)){var r=n;do{if(r&&t.isSameNode(r))return!0;r=r.parentNode||r.host}while(r)}return!1}function j(t){return p(t).getComputedStyle(t)}function M(t){return["table","td","th"].indexOf(l(t))>=0}function k(t){return((d(t)?t.ownerDocument:t.document)||window.document).documentElement}function P(t){return"html"===l(t)?t:t.assignedSlot||t.parentNode||(v(t)?t.host:null)||k(t)}function C(t){return h(t)&&"fixed"!==j(t).position?t.offsetParent:null}function A(t){for(var n=p(t),e=C(t);e&&M(e)&&"static"===j(e).position;)e=C(e);return e&&("html"===l(e)||"body"===l(e)&&"static"===j(e).position)?n:e||function(t){var n=-1!==navigator.userAgent.toLowerCase().indexOf("firefox");if(-1!==navigator.userAgent.indexOf("Trident")&&h(t)&&"fixed"===j(t).position)return null;var e=P(t);for(v(e)&&(e=e.host);h(e)&&["html","body"].indexOf(l(e))<0;){var r=j(e);if("none"!==r.transform||"none"!==r.perspective||"paint"===r.contain||-1!==["transform","perspective"].indexOf(r.willChange)||n&&"filter"===r.willChange||n&&r.filter&&"none"!==r.filter)return e;e=e.parentNode}return null}(t)||n}function q(t){return["top","bottom"].indexOf(t)>=0?"x":"y"}function E(t,n,e){return m(t,y(n,e))}function R(t){return Object.assign({},{top:0,right:0,bottom:0,left:0},t)}function W(t,n){return n.reduce((function(n,e){return n[e]=t,n}),{})}function B(t){return t.split("-")[1]}var S={top:"auto",right:"auto",bottom:"auto",left:"auto"};function L(t){var n,e=t.popper,u=t.popperRect,f=t.placement,s=t.variation,c=t.offsets,l=t.position,d=t.gpuAcceleration,h=t.adaptive,v=t.roundOffsets,b=t.isFixed,m=c.x,y=void 0===m?0:m,w=c.y,x=void 0===w?0:w,O="function"==typeof v?v({x:y,y:x}):{x:y,y:x};y=O.x,x=O.y;var M=c.hasOwnProperty("x"),P=c.hasOwnProperty("y"),C=a,q=r,E=window;if(h){var R=A(e),W="clientHeight",B="clientWidth";R===p(e)&&"static"!==j(R=k(e)).position&&"absolute"===l&&(W="scrollHeight",B="scrollWidth"),R=R,(f===r||(f===a||f===o)&&"end"===s)&&(q=i,x-=(b&&R===E&&E.visualViewport?E.visualViewport.height:R[W])-u.height,x*=d?1:-1),f!==a&&(f!==r&&f!==i||"end"!==s)||(C=o,y-=(b&&R===E&&E.visualViewport?E.visualViewport.width:R[B])-u.width,y*=d?1:-1)}var L,I=Object.assign({position:l},h&&S),T=!0===v?function(t){var n=t.y,e=window.devicePixelRatio||1;return{x:g(t.x*e)/e||0,y:g(n*e)/e||0}}({x:y,y:x}):{x:y,y:x};return y=T.x,x=T.y,Object.assign({},I,d?((L={})[q]=P?"0":"",L[C]=M?"0":"",L.transform=(E.devicePixelRatio||1)<=1?"translate("+y+"px, "+x+"px)":"translate3d("+y+"px, "+x+"px, 0)",L):((n={})[q]=P?x+"px":"",n[C]=M?y+"px":"",n.transform="",n))}var I={passive:!0},T={left:"right",right:"left",bottom:"top",top:"bottom"};function z(t){return t.replace(/left|right|bottom|top/g,(function(t){return T[t]}))}var F={start:"end",end:"start"};function H(t){return t.replace(/start|end/g,(function(t){return F[t]}))}function V(t){var n=p(t);return{scrollLeft:n.pageXOffset,scrollTop:n.pageYOffset}}function D(t){return w(k(t)).left+V(t).scrollLeft}function $(t){var n=j(t);return/auto|scroll|overlay|hidden/.test(n.overflow+n.overflowY+n.overflowX)}function _(t){return["html","body","#document"].indexOf(l(t))>=0?t.ownerDocument.body:h(t)&&$(t)?t:_(P(t))}function U(t,n){var e;void 0===n&&(n=[]);var r=_(t),i=r===(null==(e=t.ownerDocument)?void 0:e.body),o=p(r),a=i?[o].concat(o.visualViewport||[],$(r)?r:[]):r,u=n.concat(a);return i?u:u.concat(U(P(a)))}function G(t){return Object.assign({},t,{left:t.x,top:t.y,right:t.x+t.width,bottom:t.y+t.height})}function J(t,n){return"viewport"===n?G(function(t){var n=p(t),e=k(t),r=n.visualViewport,i=e.clientWidth,o=e.clientHeight,a=0,u=0;return r&&(i=r.width,o=r.height,/^((?!chrome|android).)*safari/i.test(navigator.userAgent)||(a=r.offsetLeft,u=r.offsetTop)),{width:i,height:o,x:a+D(t),y:u}}(t)):d(n)?function(t){var n=w(t);return n.top=n.top+t.clientTop,n.left=n.left+t.clientLeft,n.bottom=n.top+t.clientHeight,n.right=n.left+t.clientWidth,n.width=t.clientWidth,n.height=t.clientHeight,n.x=n.left,n.y=n.top,n}(n):G(function(t){var n,e=k(t),r=V(t),i=null==(n=t.ownerDocument)?void 0:n.body,o=m(e.scrollWidth,e.clientWidth,i?i.scrollWidth:0,i?i.clientWidth:0),a=m(e.scrollHeight,e.clientHeight,i?i.scrollHeight:0,i?i.clientHeight:0),u=-r.scrollLeft+D(t),f=-r.scrollTop;return"rtl"===j(i||e).direction&&(u+=m(e.clientWidth,i?i.clientWidth:0)-o),{width:o,height:a,x:u,y:f}}(k(t)))}function K(t){var n,e=t.reference,u=t.element,f=t.placement,s=f?b(f):null,c=f?B(f):null,l=e.x+e.width/2-u.width/2,p=e.y+e.height/2-u.height/2;switch(s){case r:n={x:l,y:e.y-u.height};break;case i:n={x:l,y:e.y+e.height};break;case o:n={x:e.x+e.width,y:p};break;case a:n={x:e.x-u.width,y:p};break;default:n={x:e.x,y:e.y}}var d=s?q(s):null;if(null!=d){var h="y"===d?"height":"width";switch(c){case"start":n[d]=n[d]-(e[h]/2-u[h]/2);break;case"end":n[d]=n[d]+(e[h]/2-u[h]/2)}}return n}function N(t,n){void 0===n&&(n={});var e=n.placement,a=void 0===e?t.placement:e,f=n.boundary,s=void 0===f?"clippingParents":f,c=n.rootBoundary,p=void 0===c?"viewport":c,v=n.elementContext,b=void 0===v?"popper":v,g=n.altBoundary,x=void 0!==g&&g,M=n.padding,C=void 0===M?0:M,q=R("number"!=typeof C?C:W(C,u)),E=t.rects.popper,B=t.elements[x?"popper"===b?"reference":"popper":b],S=function(t,n,e){var r="clippingParents"===n?function(t){var n=U(P(t)),e=["absolute","fixed"].indexOf(j(t).position)>=0&&h(t)?A(t):t;return d(e)?n.filter((function(t){return d(t)&&O(t,e)&&"body"!==l(t)})):[]}(t):[].concat(n),i=[].concat(r,[e]),o=i.reduce((function(n,e){var r=J(t,e);return n.top=m(r.top,n.top),n.right=y(r.right,n.right),n.bottom=y(r.bottom,n.bottom),n.left=m(r.left,n.left),n}),J(t,i[0]));return o.width=o.right-o.left,o.height=o.bottom-o.top,o.x=o.left,o.y=o.top,o}(d(B)?B:B.contextElement||k(t.elements.popper),s,p),L=w(t.elements.reference),I=K({reference:L,element:E,strategy:"absolute",placement:a}),T=G(Object.assign({},E,I)),z="popper"===b?T:L,F={top:S.top-z.top+q.top,bottom:z.bottom-S.bottom+q.bottom,left:S.left-z.left+q.left,right:z.right-S.right+q.right},H=t.modifiersData.offset;if("popper"===b&&H){var V=H[a];Object.keys(F).forEach((function(t){var n=[o,i].indexOf(t)>=0?1:-1,e=[r,i].indexOf(t)>=0?"y":"x";F[t]+=V[e]*n}))}return F}function Q(t,n){void 0===n&&(n={});var e=n.boundary,r=n.rootBoundary,i=n.padding,o=n.flipVariations,a=n.allowedAutoPlacements,c=void 0===a?s:a,l=B(n.placement),p=l?o?f:f.filter((function(t){return B(t)===l})):u,d=p.filter((function(t){return c.indexOf(t)>=0}));0===d.length&&(d=p);var h=d.reduce((function(n,o){return n[o]=N(t,{placement:o,boundary:e,rootBoundary:r,padding:i})[b(o)],n}),{});return Object.keys(h).sort((function(t,n){return h[t]-h[n]}))}function X(t,n,e){return void 0===e&&(e={x:0,y:0}),{top:t.top-n.height-e.y,right:t.right-n.width+e.x,bottom:t.bottom-n.height+e.y,left:t.left-n.width-e.x}}function Y(t){return[r,o,i,a].some((function(n){return t[n]>=0}))}function Z(t,n,e){void 0===e&&(e=!1);var r,i,o=h(n),a=h(n)&&function(t){var n=t.getBoundingClientRect(),e=g(n.width)/t.offsetWidth||1,r=g(n.height)/t.offsetHeight||1;return 1!==e||1!==r}(n),u=k(n),f=w(t,a),s={scrollLeft:0,scrollTop:0},c={x:0,y:0};return(o||!o&&!e)&&(("body"!==l(n)||$(u))&&(s=(r=n)!==p(r)&&h(r)?{scrollLeft:(i=r).scrollLeft,scrollTop:i.scrollTop}:V(r)),h(n)?((c=w(n,!0)).x+=n.clientLeft,c.y+=n.clientTop):u&&(c.x=D(u))),{x:f.left+s.scrollLeft-c.x,y:f.top+s.scrollTop-c.y,width:f.width,height:f.height}}function tt(t){var n=new Map,e=new Set,r=[];function i(t){e.add(t.name),[].concat(t.requires||[],t.requiresIfExists||[]).forEach((function(t){if(!e.has(t)){var r=n.get(t);r&&i(r)}})),r.push(t)}return t.forEach((function(t){n.set(t.name,t)})),t.forEach((function(t){e.has(t.name)||i(t)})),r}var nt={placement:"bottom",modifiers:[],strategy:"absolute"};function et(){for(var t=arguments.length,n=new Array(t),e=0;e<t;e++)n[e]=arguments[e];return!n.some((function(t){return!(t&&"function"==typeof t.getBoundingClientRect)}))}function rt(t){void 0===t&&(t={});var n=t.defaultModifiers,e=void 0===n?[]:n,r=t.defaultOptions,i=void 0===r?nt:r;return function(t,n,r){void 0===r&&(r=i);var o,a,u={placement:"bottom",orderedModifiers:[],options:Object.assign({},nt,i),modifiersData:{},elements:{reference:t,popper:n},attributes:{},styles:{}},f=[],s=!1,l={state:u,setOptions:function(r){var o="function"==typeof r?r(u.options):r;p(),u.options=Object.assign({},i,u.options,o),u.scrollParents={reference:d(t)?U(t):t.contextElement?U(t.contextElement):[],popper:U(n)};var a,s,h=function(t){var n=tt(t);return c.reduce((function(t,e){return t.concat(n.filter((function(t){return t.phase===e})))}),[])}((a=[].concat(e,u.options.modifiers),s=a.reduce((function(t,n){var e=t[n.name];return t[n.name]=e?Object.assign({},e,n,{options:Object.assign({},e.options,n.options),data:Object.assign({},e.data,n.data)}):n,t}),{}),Object.keys(s).map((function(t){return s[t]}))));return u.orderedModifiers=h.filter((function(t){return t.enabled})),u.orderedModifiers.forEach((function(t){var n=t.options,e=t.effect;if("function"==typeof e){var r=e({state:u,name:t.name,instance:l,options:void 0===n?{}:n});f.push(r||function(){})}})),l.update()},forceUpdate:function(){if(!s){var t=u.elements,n=t.reference,e=t.popper;if(et(n,e)){u.rects={reference:Z(n,A(e),"fixed"===u.options.strategy),popper:x(e)},u.reset=!1,u.placement=u.options.placement,u.orderedModifiers.forEach((function(t){return u.modifiersData[t.name]=Object.assign({},t.data)}));for(var r=0;r<u.orderedModifiers.length;r++)if(!0!==u.reset){var i=u.orderedModifiers[r],o=i.fn,a=i.options;"function"==typeof o&&(u=o({state:u,options:void 0===a?{}:a,name:i.name,instance:l})||u)}else u.reset=!1,r=-1}}},update:(o=function(){return new Promise((function(t){l.forceUpdate(),t(u)}))},function(){return a||(a=new Promise((function(t){Promise.resolve().then((function(){a=void 0,t(o())}))}))),a}),destroy:function(){p(),s=!0}};if(!et(t,n))return l;function p(){f.forEach((function(t){return t()})),f=[]}return l.setOptions(r).then((function(t){!s&&r.onFirstUpdate&&r.onFirstUpdate(t)})),l}}var it=rt({defaultModifiers:[{name:"eventListeners",enabled:!0,phase:"write",fn:function(){},effect:function(t){var n=t.state,e=t.instance,r=t.options,i=r.scroll,o=void 0===i||i,a=r.resize,u=void 0===a||a,f=p(n.elements.popper),s=[].concat(n.scrollParents.reference,n.scrollParents.popper);return o&&s.forEach((function(t){t.addEventListener("scroll",e.update,I)})),u&&f.addEventListener("resize",e.update,I),function(){o&&s.forEach((function(t){t.removeEventListener("scroll",e.update,I)})),u&&f.removeEventListener("resize",e.update,I)}},data:{}},{name:"popperOffsets",enabled:!0,phase:"read",fn:function(t){var n=t.state;n.modifiersData[t.name]=K({reference:n.rects.reference,element:n.rects.popper,strategy:"absolute",placement:n.placement})},data:{}},{name:"computeStyles",enabled:!0,phase:"beforeWrite",fn:function(t){var n=t.state,e=t.options,r=e.gpuAcceleration,i=void 0===r||r,o=e.adaptive,a=void 0===o||o,u=e.roundOffsets,f=void 0===u||u,s={placement:b(n.placement),variation:B(n.placement),popper:n.elements.popper,popperRect:n.rects.popper,gpuAcceleration:i,isFixed:"fixed"===n.options.strategy};null!=n.modifiersData.popperOffsets&&(n.styles.popper=Object.assign({},n.styles.popper,L(Object.assign({},s,{offsets:n.modifiersData.popperOffsets,position:n.options.strategy,adaptive:a,roundOffsets:f})))),null!=n.modifiersData.arrow&&(n.styles.arrow=Object.assign({},n.styles.arrow,L(Object.assign({},s,{offsets:n.modifiersData.arrow,position:"absolute",adaptive:!1,roundOffsets:f})))),n.attributes.popper=Object.assign({},n.attributes.popper,{"data-popper-placement":n.placement})},data:{}},{name:"applyStyles",enabled:!0,phase:"write",fn:function(t){var n=t.state;Object.keys(n.elements).forEach((function(t){var e=n.styles[t]||{},r=n.attributes[t]||{},i=n.elements[t];h(i)&&l(i)&&(Object.assign(i.style,e),Object.keys(r).forEach((function(t){var n=r[t];!1===n?i.removeAttribute(t):i.setAttribute(t,!0===n?"":n)})))}))},effect:function(t){var n=t.state,e={popper:{position:n.options.strategy,left:"0",top:"0",margin:"0"},arrow:{position:"absolute"},reference:{}};return Object.assign(n.elements.popper.style,e.popper),n.styles=e,n.elements.arrow&&Object.assign(n.elements.arrow.style,e.arrow),function(){Object.keys(n.elements).forEach((function(t){var r=n.elements[t],i=n.attributes[t]||{},o=Object.keys(n.styles.hasOwnProperty(t)?n.styles[t]:e[t]).reduce((function(t,n){return t[n]="",t}),{});h(r)&&l(r)&&(Object.assign(r.style,o),Object.keys(i).forEach((function(t){r.removeAttribute(t)})))}))}},requires:["computeStyles"]},{name:"offset",enabled:!0,phase:"main",requires:["popperOffsets"],fn:function(t){var n=t.state,e=t.name,i=t.options.offset,u=void 0===i?[0,0]:i,f=s.reduce((function(t,e){return t[e]=function(t,n,e){var i=b(t),u=[a,r].indexOf(i)>=0?-1:1,f="function"==typeof e?e(Object.assign({},n,{placement:t})):e,s=f[0],c=f[1];return s=s||0,c=(c||0)*u,[a,o].indexOf(i)>=0?{x:c,y:s}:{x:s,y:c}}(e,n.rects,u),t}),{}),c=f[n.placement],l=c.y;null!=n.modifiersData.popperOffsets&&(n.modifiersData.popperOffsets.x+=c.x,n.modifiersData.popperOffsets.y+=l),n.modifiersData[e]=f}},{name:"flip",enabled:!0,phase:"main",fn:function(t){var n=t.state,e=t.options,u=t.name;if(!n.modifiersData[u]._skip){for(var f=e.mainAxis,s=void 0===f||f,c=e.altAxis,l=void 0===c||c,p=e.fallbackPlacements,d=e.padding,h=e.boundary,v=e.rootBoundary,m=e.altBoundary,y=e.flipVariations,g=void 0===y||y,w=e.allowedAutoPlacements,x=n.options.placement,O=b(x),j=p||(O!==x&&g?function(t){if("auto"===b(t))return[];var n=z(t);return[H(t),n,H(n)]}(x):[z(x)]),M=[x].concat(j).reduce((function(t,e){return t.concat("auto"===b(e)?Q(n,{placement:e,boundary:h,rootBoundary:v,padding:d,flipVariations:g,allowedAutoPlacements:w}):e)}),[]),k=n.rects.reference,P=n.rects.popper,C=new Map,A=!0,q=M[0],E=0;E<M.length;E++){var R=M[E],W=b(R),S="start"===B(R),L=[r,i].indexOf(W)>=0,I=L?"width":"height",T=N(n,{placement:R,boundary:h,rootBoundary:v,altBoundary:m,padding:d}),F=L?S?o:a:S?i:r;k[I]>P[I]&&(F=z(F));var V=z(F),D=[];if(s&&D.push(T[W]<=0),l&&D.push(T[F]<=0,T[V]<=0),D.every((function(t){return t}))){q=R,A=!1;break}C.set(R,D)}if(A)for(var $=function(t){var n=M.find((function(n){var e=C.get(n);if(e)return e.slice(0,t).every((function(t){return t}))}));if(n)return q=n,"break"},_=g?3:1;_>0&&"break"!==$(_);_--);n.placement!==q&&(n.modifiersData[u]._skip=!0,n.placement=q,n.reset=!0)}},requiresIfExists:["offset"],data:{_skip:!1}},{name:"preventOverflow",enabled:!0,phase:"main",fn:function(t){var n=t.state,e=t.options,u=t.name,f=e.mainAxis,s=void 0===f||f,c=e.altAxis,l=void 0!==c&&c,p=e.tether,d=void 0===p||p,h=e.tetherOffset,v=void 0===h?0:h,g=N(n,{boundary:e.boundary,rootBoundary:e.rootBoundary,padding:e.padding,altBoundary:e.altBoundary}),w=b(n.placement),O=B(n.placement),j=!O,M=q(w),k="x"===M?"y":"x",P=n.modifiersData.popperOffsets,C=n.rects.reference,R=n.rects.popper,W="function"==typeof v?v(Object.assign({},n.rects,{placement:n.placement})):v,S="number"==typeof W?{mainAxis:W,altAxis:W}:Object.assign({mainAxis:0,altAxis:0},W),L=n.modifiersData.offset?n.modifiersData.offset[n.placement]:null,I={x:0,y:0};if(P){if(s){var T,z="y"===M?r:a,F="y"===M?i:o,H="y"===M?"height":"width",V=P[M],D=V+g[z],$=V-g[F],_=d?-R[H]/2:0,U="start"===O?C[H]:R[H],G="start"===O?-R[H]:-C[H],J=n.elements.arrow,K=d&&J?x(J):{width:0,height:0},Q=n.modifiersData["arrow#persistent"]?n.modifiersData["arrow#persistent"].padding:{top:0,right:0,bottom:0,left:0},X=Q[z],Y=Q[F],Z=E(0,C[H],K[H]),tt=j?C[H]/2-_-Z-X-S.mainAxis:U-Z-X-S.mainAxis,nt=j?-C[H]/2+_+Z+Y+S.mainAxis:G+Z+Y+S.mainAxis,et=n.elements.arrow&&A(n.elements.arrow),rt=null!=(T=null==L?void 0:L[M])?T:0,it=V+nt-rt,ot=E(d?y(D,V+tt-rt-(et?"y"===M?et.clientTop||0:et.clientLeft||0:0)):D,V,d?m($,it):$);P[M]=ot,I[M]=ot-V}if(l){var at,ut=P[k],ft="y"===k?"height":"width",st=ut+g["x"===M?r:a],ct=ut-g["x"===M?i:o],lt=-1!==[r,a].indexOf(w),pt=null!=(at=null==L?void 0:L[k])?at:0,dt=lt?st:ut-C[ft]-R[ft]-pt+S.altAxis,ht=lt?ut+C[ft]+R[ft]-pt-S.altAxis:ct,vt=d&<?function(t,n,e){var r=E(t,n,e);return r>e?e:r}(dt,ut,ht):E(d?dt:st,ut,d?ht:ct);P[k]=vt,I[k]=vt-ut}n.modifiersData[u]=I}},requiresIfExists:["offset"]},{name:"arrow",enabled:!0,phase:"main",fn:function(t){var n,e=t.state,f=t.name,s=t.options,c=e.elements.arrow,l=e.modifiersData.popperOffsets,p=b(e.placement),d=q(p),h=[a,o].indexOf(p)>=0?"height":"width";if(c&&l){var v=function(t,n){return R("number"!=typeof(t="function"==typeof t?t(Object.assign({},n.rects,{placement:n.placement})):t)?t:W(t,u))}(s.padding,e),m=x(c),y="y"===d?r:a,g="y"===d?i:o,w=e.rects.reference[h]+e.rects.reference[d]-l[d]-e.rects.popper[h],O=l[d]-e.rects.reference[d],j=A(c),M=j?"y"===d?j.clientHeight||0:j.clientWidth||0:0,k=M/2-m[h]/2+(w/2-O/2),P=E(v[y],k,M-m[h]-v[g]);e.modifiersData[f]=((n={})[d]=P,n.centerOffset=P-k,n)}},effect:function(t){var n=t.state,e=t.options.element,r=void 0===e?"[data-popper-arrow]":e;null!=r&&("string"!=typeof r||(r=n.elements.popper.querySelector(r)))&&O(n.elements.popper,r)&&(n.elements.arrow=r)},requires:["popperOffsets"],requiresIfExists:["preventOverflow"]},{name:"hide",enabled:!0,phase:"main",requiresIfExists:["preventOverflow"],fn:function(t){var n=t.state,e=t.name,r=n.rects.reference,i=n.rects.popper,o=n.modifiersData.preventOverflow,a=N(n,{elementContext:"reference"}),u=N(n,{altBoundary:!0}),f=X(a,r),s=X(u,i,o),c=Y(f),l=Y(s);n.modifiersData[e]={referenceClippingOffsets:f,popperEscapeOffsets:s,isReferenceHidden:c,hasPopperEscaped:l},n.attributes.popper=Object.assign({},n.attributes.popper,{"data-popper-reference-hidden":c,"data-popper-escaped":l})}}]});const ot=class{constructor(n){t(this,n),this.openDirection="bottom",this.position="absolute",this.containerStyle={},this.parent=document.body,this.inheritParentWidth=!1,this.visible=!1,this.loaded=!1,this.parents=new WeakMap}onVisible(){if(!this.visible)return this.hideContainer(),this.styleContainer(),void this.destroyPopper();this.styleContainer(),this.createPopper(),requestAnimationFrame((()=>{this.showContainer()}))}disconnectedCallback(){this.removeContainer(),this.destroyPopper(),this.observer&&this.observer.unobserve(this.container)}connectedCallback(){this.loaded&&(this.createContainer(),this.hideContainer(),this.attachContainer(),this.styleContainer(),this.visible&&(this.createPopper(),this.showContainer()),"ResizeObserver"in window)&&new ResizeObserver((()=>{this.popperInstance&&(this.styleContainer(),this.popperInstance.update())})).observe(this.container)}componentDidLoad(){this.loaded=!0,this.connectedCallback()}render(){return n("slot",null)}createContainer(){const t=this.host.shadowRoot.querySelector("slot"),n=t.assignedElements&&t.assignedElements()||[];this.container=document.createElement("div"),this.container.setAttribute("id",this.containerId),this.container.setAttribute("class","limel-portal--container"),Object.assign(this.container,{portalSource:this.host}),n.forEach((t=>{this.parents.set(t,t.parentElement),this.container.appendChild(t)}))}attachContainer(){this.parent.appendChild(this.container)}removeContainer(){this.container&&(Array.from(this.container.children).forEach((t=>{const n=this.parents.get(t);n&&n.appendChild(t)})),this.hideContainer(),this.container.parentElement.removeChild(this.container))}hideContainer(){this.container.style.opacity="0"}showContainer(){this.container.style.opacity="1"}styleContainer(){const t=this.host.getBoundingClientRect().width;if(this.container.style.display=this.visible?"block":"none",this.inheritParentWidth){let n=this.getContentWidth(this.container);t>0&&(n=t),this.container.style.width=`${n}px`}this.ensureContainerFitsInViewPort(),Object.keys(this.containerStyle).forEach((t=>{this.container.style[t]=this.containerStyle[t]}))}getContentWidth(t){if(!t)return null;const n=t.getBoundingClientRect().width;if(0!==n)return n;const e=t.querySelector("*");return this.getContentWidth(e)}createPopper(){const t=this.createPopperConfig();this.popperInstance=it(this.host,this.container,t)}destroyPopper(){var t;null===(t=this.popperInstance)||void 0===t||t.destroy(),this.popperInstance=null}createPopperConfig(){const t=this.getPlacement(this.openDirection),n=this.getFlipPlacement(this.openDirection);return{strategy:this.position,placement:t,modifiers:[{name:"flip",options:{fallbackPlacements:[n]}}]}}getPlacement(t){return{"left-start":"left-start",left:"left","left-end":"left-end","right-start":"right-start",right:"right","right-end":"right-end","top-start":"top-start",top:"top","top-end":"top-end","bottom-start":"bottom-start",bottom:"bottom","bottom-end":"bottom-end"}[t]}getFlipPlacement(t){return{"left-start":"right-start",left:"right","left-end":"right-end","right-start":"left-start",right:"left","right-end":"left-end","top-start":"bottom-start",top:"bottom","top-end":"bottom-end","bottom-start":"top-start",bottom:"top","bottom-end":"top-end"}[t]}ensureContainerFitsInViewPort(){const t=Math.max(document.documentElement.clientHeight||0,window.innerHeight||0),{top:n,bottom:e}=this.host.getBoundingClientRect(),r=Math.max(n,0),i=Math.max(t-e,0),o=Math.max(r,i)-16;this.container.style.maxHeight=`${o}px`}get host(){return e(this)}static get watchers(){return{visible:["onVisible"]}}};ot.style=":host(limel-portal){display:block;position:absolute;top:0;bottom:0;width:100%;pointer-events:none}:host([hidden]){display:none}";export{ot as limel_portal}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,c as e,h as o}from"./p-e9a95b8f.js";import{c as i}from"./p-6c094f3f.js";const s=class{constructor(o){t(this,o),this.interact=e(this,"interact",7),this.close=e(this,"close",7),this.expanded=!1,this.useMobileLayout=!1,this.isOpen=!1,this.openPopover=t=>{t.stopPropagation(),this.isOpen=!0},this.onPopoverClose=()=>{this.isOpen=!1,this.close.emit()},this.handleClick=t=>{t.stopPropagation(),this.interact.emit(this.item)},this.tooltipId=i()}render(){var t,e;return(null===(e=null===(t=this.item)||void 0===t?void 0:t.dockMenu)||void 0===e?void 0:e.componentName)?this.renderPopover():this.renderButton(this.handleClick)}renderPopover(){var t;const e=null===(t=this.item)||void 0===t?void 0:t.dockMenu.componentName;return o("limel-popover",{openDirection:this.useMobileLayout?"top":"right",open:this.isOpen||this.item.dockMenu.menuOpen,onClose:this.onPopoverClose},this.renderButton(this.openPopover,"trigger"),o(e,Object.assign({},this.item.dockMenu.props||{},{onClose:this.onPopoverClose})))}renderButton(t,e){var i;return o("button",{slot:e,tabindex:"0",id:this.tooltipId,type:"button",class:{button:!0,selected:null===(i=this.item)||void 0===i?void 0:i.selected},onClick:t},this.renderIcon(),this.renderLabel(),this.renderTooltip())}renderIcon(){if(this.item.icon)return o("limel-icon",{name:this.item.icon,class:"icon"})}renderLabel(){if(this.expanded)return o("span",{class:"text"},this.item.label)}renderTooltip(){return!this.expanded&&this.item.label?o("limel-tooltip",{elementId:this.tooltipId,label:this.item.label,helperLabel:this.item.helperLabel}):this.expanded&&this.item.helperLabel?o("limel-tooltip",{elementId:this.tooltipId,label:this.item.helperLabel}):void 0}};s.style=".button{all:unset;box-sizing:border-box;display:flex;align-items:center;position:relative;width:100%;height:var(--dock-item-height);border-radius:0.375rem;font-size:0.875rem;padding:0 0.5rem;min-width:var(--dock-item-height);color:var(--limel-dock-item-text-color);background-color:var(--dock-background-color)}.button:focus-visible{box-shadow:var(--shadow-depth-8-focused)}.dock-item:not(.selected) .button:not(.disabled){cursor:pointer;transition:background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out}.dock-item:not(.selected) .button:not(.disabled):hover{box-shadow:var(--button-shadow-hovered)}.dock-item:not(.selected) .button:not(.disabled):active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}.button:hover{z-index:1}.button.selected{color:var(--limel-dock-item-text-color--selected);background-color:var(--dock-item-background-color--selected, rgb(var(--contrast-200)));box-shadow:var(--button-shadow-inset)}.button.selected .icon{color:var(--limel-dock-item-text--selected)}limel-popover{display:grid}.text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-left:0.5rem;padding-right:0.75rem}.icon{flex-shrink:0;width:calc(var(--dock-item-height) - 1rem);height:calc(var(--dock-item-height) - 1rem);color:var(--dock-item-icon-color--deselected, var(--limel-dock-item-text-color))}";export{s as limel_dock_button}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,c as e,h as o,g as i}from"./p-e9a95b8f.js";import{c as r}from"./p-6c094f3f.js";import{b as s}from"./p-216ffe20.js";import{z as l}from"./p-7cda574b.js";import"./p-b28128d2.js";import"./p-5fdb83c9.js";import"./p-4c3358cb.js";import"./p-eda23c05.js";import"./p-c93050d6.js";function a(t,e){var o;if(t.contains(e)||(null===(o=t.shadowRoot)||void 0===o?void 0:o.contains(e)))return!0;const i=function(t){const e=t.closest(".limel-portal--container");return e?e.portalSource:t.getRootNode().host}(e);return!!i&&a(t,i)}const n=class{constructor(o){t(this,o),this.close=e(this,"close",7),this.open=!1,this.handleGlobalKeyPress=t=>{t.key===s&&(t.stopPropagation(),t.preventDefault(),this.close.emit())},this.portalId=r(),this.globalClickListener=this.globalClickListener.bind(this)}watchOpen(){this.setupGlobalHandlers()}componentWillLoad(){this.setupGlobalHandlers()}setupGlobalHandlers(){this.open?(document.addEventListener("click",this.globalClickListener,{capture:!0}),document.addEventListener("keyup",this.handleGlobalKeyPress)):(document.removeEventListener("click",this.globalClickListener),document.removeEventListener("keyup",this.handleGlobalKeyPress))}render(){const t=this.getCssProperties(),e=getComputedStyle(this.host).getPropertyValue("--popover-z-index");return o("div",{class:"trigger-anchor"},o("slot",{name:"trigger"}),o("limel-portal",{visible:this.open,containerId:this.portalId,containerStyle:{"z-index":e},openDirection:this.openDirection},o("limel-popover-surface",{contentCollection:this.host.children,style:t})))}globalClickListener(t){const e=a(this.host,t.target);this.open&&!e&&(t.stopPropagation(),t.preventDefault(),this.close.emit())}getCssProperties(){const t=["--popover-surface-width","--popover-body-background-color","--popover-border-radius"],e=getComputedStyle(this.host),o=t.map((t=>e.getPropertyValue(t)));return l(t,o)}get host(){return i(this)}static get watchers(){return{open:["watchOpen"]}}};n.style=".trigger-anchor{display:inline-block;position:relative}";const c=class{constructor(e){t(this,e)}componentDidLoad(){this.appendElement()}render(){return o("div",{class:"limel-popover-surface",tabindex:"0"})}appendElement(){const t=this.host.shadowRoot.querySelector(".limel-popover-surface");Array.from(this.contentCollection).forEach((e=>{"trigger"!==e.slot&&t.appendChild(e)}))}get host(){return i(this)}};c.style='.limel-popover-surface{position:relative;display:flex;flex-direction:column;width:var(--popover-surface-width, auto);max-height:calc(100vh - 2rem);max-width:calc(100vw - 2rem);margin:0 0.25rem;border-radius:var(--popover-border-radius, 0.75rem);box-shadow:var(--shadow-depth-16);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.75;border-radius:var(--popover-border-radius, 0.75rem);background-color:var(--popover-body-background-color, rgb(var(--contrast-100)))}.limel-popover-surface:focus,.limel-popover-surface:focus-within{outline:none}.limel-popover-surface:focus:after,.limel-popover-surface:focus-within:after{opacity:1}.limel-popover-surface:focus-visible{box-shadow:var(--shadow-depth-16-focused)}';const h=class{constructor(e){t(this,e),this.maxlength=50,this.showTooltip=()=>{this.showTooltipTimeoutHandle=window.setTimeout((()=>{this.open=!0}),500)},this.hideTooltip=()=>{clearTimeout(this.showTooltipTimeoutHandle),this.open=!1},this.portalId=r(),this.tooltipId=r()}connectedCallback(){this.setOwnerAriaLabel(),this.addListeners()}disconnectedCallback(){this.removeListeners()}render(){const t=getComputedStyle(this.host).getPropertyValue("--tooltip-z-index");return o("div",{class:"trigger-anchor"},o("limel-portal",{openDirection:"bottom-start",visible:this.open,containerId:this.portalId,containerStyle:{"z-index":t,"pointer-events":"none"}},o("limel-tooltip-content",{label:this.label,helperLabel:this.helperLabel,maxlength:this.maxlength,role:"tooltip","aria-hidden":!this.open,id:this.tooltipId})))}setOwnerAriaLabel(){const t=this.getOwnerElement();null==t||t.setAttribute("aria-describedby",this.tooltipId)}addListeners(){const t=this.getOwnerElement();null==t||t.addEventListener("mouseover",this.showTooltip),null==t||t.addEventListener("mouseout",this.hideTooltip),null==t||t.addEventListener("click",this.hideTooltip)}removeListeners(){const t=this.getOwnerElement();null==t||t.removeEventListener("mouseover",this.showTooltip),null==t||t.removeEventListener("mouseout",this.hideTooltip),null==t||t.removeEventListener("click",this.hideTooltip)}getOwnerElement(){var t;let e=this.host;do{e=e.parentNode}while(e&&e.nodeType!==Node.DOCUMENT_FRAGMENT_NODE&&e.nodeType!==Node.DOCUMENT_NODE);return null===(t=e)||void 0===t?void 0:t.getElementById(this.elementId)}get host(){return i(this)}};h.style=".trigger-anchor{position:relative}";const p=class{constructor(e){t(this,e)}render(){let t=!1;this.helperLabel&&this.maxlength&&(t=this.label.length+this.helperLabel.length>this.maxlength);const e={};return this.maxlength&&(e.style={"--tooltip-max-width-of-text":`${this.maxlength}ch`}),[o("text",Object.assign({class:{"has-column-layout":t}},e),o("div",{class:"label"},this.label),o("div",{class:"helper-label"},this.helperLabel))]}};p.style=":host{animation:display-tooltip 0.2s ease;display:flex;border-radius:0.25rem;padding:0.25rem 0.5rem;background-color:rgb(var(--contrast-1300));box-shadow:var(--shadow-depth-16)}text{font-size:0.875rem;line-height:1.25;display:flex;column-gap:1rem}text.has-column-layout{display:table-cell;width:fit-content;max-width:min(var(--tooltip-max-width-of-text), 80vw)}text.has-column-layout .label{padding-bottom:0.5rem}text.has-column-layout .helper-label{padding-bottom:0.25rem}.label{color:rgb(var(--contrast-200))}.helper-label{color:rgb(var(--contrast-800))}.helper-label:empty{display:none}@keyframes display-tooltip{0%{opacity:0;transform:translate3d(0, 0, 0) scale(0.94)}100%{opacity:1;transform:translate3d(0, 0, 0) scale(1)}}";export{n as limel_popover,c as limel_popover_surface,h as limel_tooltip,p as limel_tooltip_content}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as e,c as t,h as o,H as i}from"./p-e9a95b8f.js";const s=class{constructor(i){e(this,i),this.itemSelected=t(this,"itemSelected",7),this.dockItems=[],this.dockFooterItems=[],this.expanded=!1,this.allowResize=!0,this.mobileBreakPoint=700,this.useMobileLayout=!1,this.renderSeparator=()=>this.useMobileLayout?null:o("span",{class:"footer-separator"}),this.renderDockItem=e=>o("limel-dock-button",{class:{"dock-item":!0,selected:e.selected},item:e,expanded:this.expanded&&!this.useMobileLayout,useMobileLayout:this.useMobileLayout,onInteract:this.handleDockItemClick}),this.handleDockItemClick=e=>{e.detail.selected||this.itemSelected.emit(e.detail)},this.handleResize=()=>{this.useMobileLayout=window.innerWidth<=this.mobileBreakPoint},this.toggleDockWidth=()=>{this.expanded=!this.expanded}}componentDidLoad(){this.resizeObserver=new ResizeObserver(this.handleResize),this.resizeObserver.observe(document.body)}disconnectedCallback(){this.resizeObserver.disconnect()}render(){return o(i,{class:{dock:!0,expanded:this.expanded,"has-mobile-layout":this.useMobileLayout}},o("nav",{"aria-label":this.accessibleLabel},this.dockItems.map(this.renderDockItem),this.renderSeparator(),this.dockFooterItems.map(this.renderDockItem)),this.renderExpandShrinkToggle())}renderExpandShrinkToggle(){if(!this.useMobileLayout&&this.allowResize)return o("button",{class:{"expand-shrink":!0,expanded:this.expanded},onClick:this.toggleDockWidth},o("limel-icon",{name:"angle_right"}))}};s.style=":host(limel-dock){--dock-item-height:2.75rem;--dock-padding:0.25rem;--dock-expand-shrink-button-height:1rem;--limel-dock-item-text-color:var(\n --dock-item-text-color--deselected,\n rgb(var(--contrast-1100))\n );--limel-dock-item-text-color--selected:var(\n --dock-item-text-color--selected,\n rgb(var(--contrast-1300))\n );isolation:isolate;position:relative;display:inline-flex;flex-direction:column;background-color:var(--dock-background-color, rgb(var(--contrast-100)));box-shadow:0.1875rem 0 0.375rem -0.125rem rgba(var(--color-black), 0.15), 0.1875rem 0 0.625rem -0.125rem rgba(var(--color-black), 0.05)}:host(limel-dock:not(.has-mobile-layout)){height:100%;width:calc(var(--dock-padding) * 2 + var(--dock-item-height))}:host(limel-dock.expanded){width:var(--dock-expanded-max-width, max-content)}.footer-separator{margin-top:auto;justify-self:flex-end}nav{box-sizing:border-box;display:inline-flex;flex-direction:column;gap:0.375rem;flex-grow:1;padding:var(--dock-padding);overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}nav::-webkit-scrollbar{display:none}:host(limel-dock.has-mobile-layout) nav{justify-content:space-between;flex-direction:row}.expand-shrink{all:unset;box-sizing:border-box;transition:background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;display:flex;justify-content:center;align-items:center;height:var(--dock-expand-shrink-button-height);padding:0 0.5rem;margin:var(--dock-padding);border-radius:0.375rem}.expand-shrink:hover{box-shadow:var(--button-shadow-hovered)}.expand-shrink:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}.expand-shrink.expanded{justify-content:flex-end}.expand-shrink.expanded limel-icon{transform:rotateY(180deg)}.expand-shrink:focus-visible{box-shadow:var(--shadow-depth-8-focused)}.expand-shrink limel-icon{width:calc(var(--dock-expand-shrink-button-height) - 0.25rem);color:var(--dock-item-icon-color--deselected, var(--button-text))}";export{s as limel_dock}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { EventEmitter } from '../../../stencil-public-runtime';
|
|
2
|
+
import { DockItem } from '../dock.types';
|
|
3
|
+
/**
|
|
4
|
+
* @private
|
|
5
|
+
*/
|
|
6
|
+
export declare class DockButton {
|
|
7
|
+
/**
|
|
8
|
+
* @inheritdoc
|
|
9
|
+
*/
|
|
10
|
+
item: DockItem;
|
|
11
|
+
/**
|
|
12
|
+
* @inheritdoc
|
|
13
|
+
*/
|
|
14
|
+
expanded?: boolean;
|
|
15
|
+
/**
|
|
16
|
+
* @inheritdoc
|
|
17
|
+
*/
|
|
18
|
+
useMobileLayout?: boolean;
|
|
19
|
+
/**
|
|
20
|
+
* Fired when clicking on the flow item.
|
|
21
|
+
*/
|
|
22
|
+
private interact;
|
|
23
|
+
private isOpen;
|
|
24
|
+
close: EventEmitter<void>;
|
|
25
|
+
private tooltipId;
|
|
26
|
+
constructor();
|
|
27
|
+
render(): any;
|
|
28
|
+
private renderPopover;
|
|
29
|
+
private renderButton;
|
|
30
|
+
private openPopover;
|
|
31
|
+
private onPopoverClose;
|
|
32
|
+
private handleClick;
|
|
33
|
+
private renderIcon;
|
|
34
|
+
private renderLabel;
|
|
35
|
+
private renderTooltip;
|
|
36
|
+
}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import { DockItem } from './dock.types';
|
|
2
|
+
/**
|
|
3
|
+
* @exampleComponent limel-example-dock-basic
|
|
4
|
+
* @exampleComponent limel-example-dock-custom-component
|
|
5
|
+
* @exampleComponent limel-example-dock-mobile
|
|
6
|
+
* @exampleComponent limel-example-dock-expanded
|
|
7
|
+
* @exampleComponent limel-example-dock-colors-css
|
|
8
|
+
* @private
|
|
9
|
+
*/
|
|
10
|
+
export declare class Dock {
|
|
11
|
+
/**
|
|
12
|
+
* Items that are placed in the dock.
|
|
13
|
+
*/
|
|
14
|
+
dockItems: DockItem[];
|
|
15
|
+
/**
|
|
16
|
+
* Items that are placed at the bottom of the dock. (Or at the end in mobile
|
|
17
|
+
* layout.)
|
|
18
|
+
*/
|
|
19
|
+
dockFooterItems?: DockItem[];
|
|
20
|
+
/**
|
|
21
|
+
* A label used to describe the purpose of the navigation element to users
|
|
22
|
+
* of assistive technologies, like screen readers. Especially useful when
|
|
23
|
+
* there are multiple navigation elements in the user interface.
|
|
24
|
+
* Example value: "Primary navigation"
|
|
25
|
+
*/
|
|
26
|
+
accessibleLabel?: string;
|
|
27
|
+
/**
|
|
28
|
+
* Defines the width of the component, when it loads.
|
|
29
|
+
* - `true`: shows both icons and labels of the Dock items.
|
|
30
|
+
* - `false`: only shows icons of the doc items, and displays
|
|
31
|
+
* their labels as tooltip.
|
|
32
|
+
*
|
|
33
|
+
* Note: when `useMobileLayout` is `true`, labels will always
|
|
34
|
+
* be shown as tooltips. Read more below…
|
|
35
|
+
*/
|
|
36
|
+
expanded?: boolean;
|
|
37
|
+
/**
|
|
38
|
+
* Set to `false` if you do not want to allow end-users
|
|
39
|
+
* to exapnd or shrink the Dock. This will hide the
|
|
40
|
+
* expand/shrink button, and the only things that defines
|
|
41
|
+
* the layout will be the `expanded` property, and
|
|
42
|
+
* the `mobileBreakPoint`.
|
|
43
|
+
*/
|
|
44
|
+
allowResize?: boolean;
|
|
45
|
+
/**
|
|
46
|
+
* Defines the breakpoint in pixles, at which the component will be rendered
|
|
47
|
+
* in a hoizontal layout. Default breakpoint is `700` pixels, which means
|
|
48
|
+
* when the screen size is smaller than `700px`, the component will automatically
|
|
49
|
+
* switch to a horizontal layout.
|
|
50
|
+
*/
|
|
51
|
+
mobileBreakPoint?: number;
|
|
52
|
+
/**
|
|
53
|
+
* Fired when a Dock item has been selected from the dock.
|
|
54
|
+
*/
|
|
55
|
+
private itemSelected;
|
|
56
|
+
/**
|
|
57
|
+
* Is used to render the component horizontally, and place
|
|
58
|
+
* the Dock items in a row.
|
|
59
|
+
*/
|
|
60
|
+
private useMobileLayout;
|
|
61
|
+
private resizeObserver;
|
|
62
|
+
componentDidLoad(): void;
|
|
63
|
+
disconnectedCallback(): void;
|
|
64
|
+
render(): any;
|
|
65
|
+
private renderSeparator;
|
|
66
|
+
private renderDockItem;
|
|
67
|
+
private handleDockItemClick;
|
|
68
|
+
private handleResize;
|
|
69
|
+
private renderExpandShrinkToggle;
|
|
70
|
+
private toggleDockWidth;
|
|
71
|
+
}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
export interface DockItem {
|
|
2
|
+
/**
|
|
3
|
+
* A non-changing value to uniquely identify each item.
|
|
4
|
+
*/
|
|
5
|
+
id: string;
|
|
6
|
+
/**
|
|
7
|
+
* Text to display for the item.
|
|
8
|
+
*/
|
|
9
|
+
label: string;
|
|
10
|
+
/**
|
|
11
|
+
* Name of the icon to use.
|
|
12
|
+
*/
|
|
13
|
+
icon: string;
|
|
14
|
+
/**
|
|
15
|
+
* Additional helper text for the dock item.
|
|
16
|
+
* Example usage can be a keyboard shortcut to activate the dock item.
|
|
17
|
+
*/
|
|
18
|
+
helperLabel?: string;
|
|
19
|
+
/**
|
|
20
|
+
* Whether the dock item should indicate it is selected.
|
|
21
|
+
* These dock items normally take the user to a top-level location within
|
|
22
|
+
* the navigation tree; for example "Home", "Search" or "My Account".
|
|
23
|
+
* Set `selected` to `true`, when:
|
|
24
|
+
* - the user interface is showing the same top-level location as the dock
|
|
25
|
+
* item is pointing at, or
|
|
26
|
+
* - the user interface is showing a page which is a sub-location of the
|
|
27
|
+
* top-level location. For example, when user is at
|
|
28
|
+
* _My Account > Notification Settings_, the dock item of _My Account_
|
|
29
|
+
* should have the `selected` state.
|
|
30
|
+
*/
|
|
31
|
+
selected?: boolean;
|
|
32
|
+
/**
|
|
33
|
+
* Used to specify a custom component to render as a menu for the dock item.
|
|
34
|
+
*/
|
|
35
|
+
dockMenu?: DockMenu;
|
|
36
|
+
}
|
|
37
|
+
export interface DockMenu {
|
|
38
|
+
/**
|
|
39
|
+
* The tag name of a custom component to be displayed in a popover when
|
|
40
|
+
* clicking on the dock item this menu belongs to.
|
|
41
|
+
*/
|
|
42
|
+
componentName: string;
|
|
43
|
+
/**
|
|
44
|
+
* Whether the menu is open.
|
|
45
|
+
*/
|
|
46
|
+
menuOpen?: boolean;
|
|
47
|
+
/**
|
|
48
|
+
* Any properties that should be set on the custom component.
|
|
49
|
+
*/
|
|
50
|
+
props?: {
|
|
51
|
+
[key: string]: any;
|
|
52
|
+
};
|
|
53
|
+
}
|
|
@@ -10,6 +10,7 @@ import { Action as Action1, Chip, ClosingActions, DateType, DialogHeading, FileI
|
|
|
10
10
|
import { CircularProgressSize } from "./components/circular-progress/circular-progress.types";
|
|
11
11
|
import { ColorScheme, Language } from "./components/code-editor/code-editor.types";
|
|
12
12
|
import { Action } from "./components/collapsible-section/action";
|
|
13
|
+
import { DockItem } from "./components/dock/dock.types";
|
|
13
14
|
import { FormError, ValidationError, ValidationStatus } from "./components/form/form.types";
|
|
14
15
|
import { IconSize } from "./components/icon/icon.types";
|
|
15
16
|
import { InputType } from "./components/input-field/input-field.types";
|
|
@@ -359,6 +360,46 @@ export namespace Components {
|
|
|
359
360
|
*/
|
|
360
361
|
"open": boolean;
|
|
361
362
|
}
|
|
363
|
+
interface LimelDock {
|
|
364
|
+
/**
|
|
365
|
+
* A label used to describe the purpose of the navigation element to users of assistive technologies, like screen readers. Especially useful when there are multiple navigation elements in the user interface. Example value: "Primary navigation"
|
|
366
|
+
*/
|
|
367
|
+
"accessibleLabel"?: string;
|
|
368
|
+
/**
|
|
369
|
+
* Set to `false` if you do not want to allow end-users to exapnd or shrink the Dock. This will hide the expand/shrink button, and the only things that defines the layout will be the `expanded` property, and the `mobileBreakPoint`.
|
|
370
|
+
*/
|
|
371
|
+
"allowResize"?: boolean;
|
|
372
|
+
/**
|
|
373
|
+
* Items that are placed at the bottom of the dock. (Or at the end in mobile layout.)
|
|
374
|
+
*/
|
|
375
|
+
"dockFooterItems"?: DockItem[];
|
|
376
|
+
/**
|
|
377
|
+
* Items that are placed in the dock.
|
|
378
|
+
*/
|
|
379
|
+
"dockItems": DockItem[];
|
|
380
|
+
/**
|
|
381
|
+
* Defines the width of the component, when it loads. - `true`: shows both icons and labels of the Dock items. - `false`: only shows icons of the doc items, and displays their labels as tooltip. Note: when `useMobileLayout` is `true`, labels will always be shown as tooltips. Read more below…
|
|
382
|
+
*/
|
|
383
|
+
"expanded"?: boolean;
|
|
384
|
+
/**
|
|
385
|
+
* Defines the breakpoint in pixles, at which the component will be rendered in a hoizontal layout. Default breakpoint is `700` pixels, which means when the screen size is smaller than `700px`, the component will automatically switch to a horizontal layout.
|
|
386
|
+
*/
|
|
387
|
+
"mobileBreakPoint"?: number;
|
|
388
|
+
}
|
|
389
|
+
interface LimelDockButton {
|
|
390
|
+
/**
|
|
391
|
+
* @inheritdoc
|
|
392
|
+
*/
|
|
393
|
+
"expanded"?: boolean;
|
|
394
|
+
/**
|
|
395
|
+
* @inheritdoc
|
|
396
|
+
*/
|
|
397
|
+
"item": DockItem;
|
|
398
|
+
/**
|
|
399
|
+
* @inheritdoc
|
|
400
|
+
*/
|
|
401
|
+
"useMobileLayout"?: boolean;
|
|
402
|
+
}
|
|
362
403
|
interface LimelFile {
|
|
363
404
|
/**
|
|
364
405
|
* The [accepted file types](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers)
|
|
@@ -1156,6 +1197,18 @@ declare global {
|
|
|
1156
1197
|
prototype: HTMLLimelDialogElement;
|
|
1157
1198
|
new (): HTMLLimelDialogElement;
|
|
1158
1199
|
};
|
|
1200
|
+
interface HTMLLimelDockElement extends Components.LimelDock, HTMLStencilElement {
|
|
1201
|
+
}
|
|
1202
|
+
var HTMLLimelDockElement: {
|
|
1203
|
+
prototype: HTMLLimelDockElement;
|
|
1204
|
+
new (): HTMLLimelDockElement;
|
|
1205
|
+
};
|
|
1206
|
+
interface HTMLLimelDockButtonElement extends Components.LimelDockButton, HTMLStencilElement {
|
|
1207
|
+
}
|
|
1208
|
+
var HTMLLimelDockButtonElement: {
|
|
1209
|
+
prototype: HTMLLimelDockButtonElement;
|
|
1210
|
+
new (): HTMLLimelDockButtonElement;
|
|
1211
|
+
};
|
|
1159
1212
|
interface HTMLLimelFileElement extends Components.LimelFile, HTMLStencilElement {
|
|
1160
1213
|
}
|
|
1161
1214
|
var HTMLLimelFileElement: {
|
|
@@ -1351,6 +1404,8 @@ declare global {
|
|
|
1351
1404
|
"limel-config": HTMLLimelConfigElement;
|
|
1352
1405
|
"limel-date-picker": HTMLLimelDatePickerElement;
|
|
1353
1406
|
"limel-dialog": HTMLLimelDialogElement;
|
|
1407
|
+
"limel-dock": HTMLLimelDockElement;
|
|
1408
|
+
"limel-dock-button": HTMLLimelDockButtonElement;
|
|
1354
1409
|
"limel-file": HTMLLimelFileElement;
|
|
1355
1410
|
"limel-flatpickr-adapter": HTMLLimelFlatpickrAdapterElement;
|
|
1356
1411
|
"limel-flex-container": HTMLLimelFlexContainerElement;
|
|
@@ -1764,6 +1819,55 @@ declare namespace LocalJSX {
|
|
|
1764
1819
|
*/
|
|
1765
1820
|
"open"?: boolean;
|
|
1766
1821
|
}
|
|
1822
|
+
interface LimelDock {
|
|
1823
|
+
/**
|
|
1824
|
+
* A label used to describe the purpose of the navigation element to users of assistive technologies, like screen readers. Especially useful when there are multiple navigation elements in the user interface. Example value: "Primary navigation"
|
|
1825
|
+
*/
|
|
1826
|
+
"accessibleLabel"?: string;
|
|
1827
|
+
/**
|
|
1828
|
+
* Set to `false` if you do not want to allow end-users to exapnd or shrink the Dock. This will hide the expand/shrink button, and the only things that defines the layout will be the `expanded` property, and the `mobileBreakPoint`.
|
|
1829
|
+
*/
|
|
1830
|
+
"allowResize"?: boolean;
|
|
1831
|
+
/**
|
|
1832
|
+
* Items that are placed at the bottom of the dock. (Or at the end in mobile layout.)
|
|
1833
|
+
*/
|
|
1834
|
+
"dockFooterItems"?: DockItem[];
|
|
1835
|
+
/**
|
|
1836
|
+
* Items that are placed in the dock.
|
|
1837
|
+
*/
|
|
1838
|
+
"dockItems"?: DockItem[];
|
|
1839
|
+
/**
|
|
1840
|
+
* Defines the width of the component, when it loads. - `true`: shows both icons and labels of the Dock items. - `false`: only shows icons of the doc items, and displays their labels as tooltip. Note: when `useMobileLayout` is `true`, labels will always be shown as tooltips. Read more below…
|
|
1841
|
+
*/
|
|
1842
|
+
"expanded"?: boolean;
|
|
1843
|
+
/**
|
|
1844
|
+
* Defines the breakpoint in pixles, at which the component will be rendered in a hoizontal layout. Default breakpoint is `700` pixels, which means when the screen size is smaller than `700px`, the component will automatically switch to a horizontal layout.
|
|
1845
|
+
*/
|
|
1846
|
+
"mobileBreakPoint"?: number;
|
|
1847
|
+
/**
|
|
1848
|
+
* Fired when a Dock item has been selected from the dock.
|
|
1849
|
+
*/
|
|
1850
|
+
"onItemSelected"?: (event: CustomEvent<DockItem>) => void;
|
|
1851
|
+
}
|
|
1852
|
+
interface LimelDockButton {
|
|
1853
|
+
/**
|
|
1854
|
+
* @inheritdoc
|
|
1855
|
+
*/
|
|
1856
|
+
"expanded"?: boolean;
|
|
1857
|
+
/**
|
|
1858
|
+
* @inheritdoc
|
|
1859
|
+
*/
|
|
1860
|
+
"item": DockItem;
|
|
1861
|
+
"onClose"?: (event: CustomEvent<void>) => void;
|
|
1862
|
+
/**
|
|
1863
|
+
* Fired when clicking on the flow item.
|
|
1864
|
+
*/
|
|
1865
|
+
"onInteract"?: (event: CustomEvent<DockItem>) => void;
|
|
1866
|
+
/**
|
|
1867
|
+
* @inheritdoc
|
|
1868
|
+
*/
|
|
1869
|
+
"useMobileLayout"?: boolean;
|
|
1870
|
+
}
|
|
1767
1871
|
interface LimelFile {
|
|
1768
1872
|
/**
|
|
1769
1873
|
* The [accepted file types](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers)
|
|
@@ -2622,6 +2726,8 @@ declare namespace LocalJSX {
|
|
|
2622
2726
|
"limel-config": LimelConfig;
|
|
2623
2727
|
"limel-date-picker": LimelDatePicker;
|
|
2624
2728
|
"limel-dialog": LimelDialog;
|
|
2729
|
+
"limel-dock": LimelDock;
|
|
2730
|
+
"limel-dock-button": LimelDockButton;
|
|
2625
2731
|
"limel-file": LimelFile;
|
|
2626
2732
|
"limel-flatpickr-adapter": LimelFlatpickrAdapter;
|
|
2627
2733
|
"limel-flex-container": LimelFlexContainer;
|
|
@@ -2672,6 +2778,8 @@ declare module "@stencil/core" {
|
|
|
2672
2778
|
"limel-config": LocalJSX.LimelConfig & JSXBase.HTMLAttributes<HTMLLimelConfigElement>;
|
|
2673
2779
|
"limel-date-picker": LocalJSX.LimelDatePicker & JSXBase.HTMLAttributes<HTMLLimelDatePickerElement>;
|
|
2674
2780
|
"limel-dialog": LocalJSX.LimelDialog & JSXBase.HTMLAttributes<HTMLLimelDialogElement>;
|
|
2781
|
+
"limel-dock": LocalJSX.LimelDock & JSXBase.HTMLAttributes<HTMLLimelDockElement>;
|
|
2782
|
+
"limel-dock-button": LocalJSX.LimelDockButton & JSXBase.HTMLAttributes<HTMLLimelDockButtonElement>;
|
|
2675
2783
|
"limel-file": LocalJSX.LimelFile & JSXBase.HTMLAttributes<HTMLLimelFileElement>;
|
|
2676
2784
|
"limel-flatpickr-adapter": LocalJSX.LimelFlatpickrAdapter & JSXBase.HTMLAttributes<HTMLLimelFlatpickrAdapterElement>;
|
|
2677
2785
|
"limel-flex-container": LocalJSX.LimelFlexContainer & JSXBase.HTMLAttributes<HTMLLimelFlexContainerElement>;
|
package/package.json
CHANGED
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
const index = require('./index-2a28697b.js');
|
|
6
|
-
|
|
7
|
-
const popoverSurfaceCss = ".limel-popover-surface{position:relative;display:flex;flex-direction:column;width:var(--popover-surface-width, auto);max-height:calc(100vh - 2rem);max-width:calc(100vw - 2rem);margin:0 0.25rem;border-radius:var(--popover-border-radius, 0.75rem);box-shadow:var(--shadow-depth-16);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.75;border-radius:var(--popover-border-radius, 0.75rem);background-color:var(--popover-body-background-color, rgb(var(--contrast-100)))}.limel-popover-surface:focus,.limel-popover-surface:focus-within{outline:none}.limel-popover-surface:focus:after,.limel-popover-surface:focus-within:after{opacity:1}.limel-popover-surface:focus-visible{box-shadow:var(--shadow-depth-16-focused)}";
|
|
8
|
-
|
|
9
|
-
const PopoverSurface = class {
|
|
10
|
-
constructor(hostRef) {
|
|
11
|
-
index.registerInstance(this, hostRef);
|
|
12
|
-
}
|
|
13
|
-
componentDidLoad() {
|
|
14
|
-
this.appendElement();
|
|
15
|
-
}
|
|
16
|
-
render() {
|
|
17
|
-
return index.h("div", { class: "limel-popover-surface", tabindex: "0" });
|
|
18
|
-
}
|
|
19
|
-
appendElement() {
|
|
20
|
-
const portalContainer = this.host.shadowRoot.querySelector('.limel-popover-surface');
|
|
21
|
-
Array.from(this.contentCollection).forEach((child) => {
|
|
22
|
-
if (child.slot === 'trigger') {
|
|
23
|
-
return;
|
|
24
|
-
}
|
|
25
|
-
portalContainer.appendChild(child);
|
|
26
|
-
});
|
|
27
|
-
}
|
|
28
|
-
get host() { return index.getElement(this); }
|
|
29
|
-
};
|
|
30
|
-
PopoverSurface.style = popoverSurfaceCss;
|
|
31
|
-
|
|
32
|
-
exports.limel_popover_surface = PopoverSurface;
|
|
@@ -1,102 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
const index = require('./index-2a28697b.js');
|
|
6
|
-
const randomString = require('./random-string-4c3b7f1c.js');
|
|
7
|
-
|
|
8
|
-
const tooltipCss = ".trigger-anchor{position:relative}";
|
|
9
|
-
|
|
10
|
-
const DEFAULT_MAX_LENGTH = 50;
|
|
11
|
-
const Tooltip = class {
|
|
12
|
-
constructor(hostRef) {
|
|
13
|
-
index.registerInstance(this, hostRef);
|
|
14
|
-
/**
|
|
15
|
-
* The maximum amount of characters before rendering 'label' and
|
|
16
|
-
* 'helperLabel' in two rows.
|
|
17
|
-
*/
|
|
18
|
-
this.maxlength = DEFAULT_MAX_LENGTH;
|
|
19
|
-
this.showTooltip = () => {
|
|
20
|
-
const tooltipDelay = 500;
|
|
21
|
-
this.showTooltipTimeoutHandle = window.setTimeout(() => {
|
|
22
|
-
this.open = true;
|
|
23
|
-
}, tooltipDelay);
|
|
24
|
-
};
|
|
25
|
-
this.hideTooltip = () => {
|
|
26
|
-
clearTimeout(this.showTooltipTimeoutHandle);
|
|
27
|
-
this.open = false;
|
|
28
|
-
};
|
|
29
|
-
this.portalId = randomString.createRandomString();
|
|
30
|
-
this.tooltipId = randomString.createRandomString();
|
|
31
|
-
}
|
|
32
|
-
connectedCallback() {
|
|
33
|
-
this.setOwnerAriaLabel();
|
|
34
|
-
this.addListeners();
|
|
35
|
-
}
|
|
36
|
-
disconnectedCallback() {
|
|
37
|
-
this.removeListeners();
|
|
38
|
-
}
|
|
39
|
-
render() {
|
|
40
|
-
const tooltipZIndex = getComputedStyle(this.host).getPropertyValue('--tooltip-z-index');
|
|
41
|
-
return (index.h("div", { class: "trigger-anchor" }, index.h("limel-portal", { openDirection: "bottom-start", visible: this.open, containerId: this.portalId, containerStyle: {
|
|
42
|
-
'z-index': tooltipZIndex,
|
|
43
|
-
'pointer-events': 'none',
|
|
44
|
-
} }, index.h("limel-tooltip-content", { label: this.label, helperLabel: this.helperLabel, maxlength: this.maxlength, role: "tooltip", "aria-hidden": !this.open, id: this.tooltipId }))));
|
|
45
|
-
}
|
|
46
|
-
setOwnerAriaLabel() {
|
|
47
|
-
const owner = this.getOwnerElement();
|
|
48
|
-
owner === null || owner === void 0 ? void 0 : owner.setAttribute('aria-describedby', this.tooltipId);
|
|
49
|
-
}
|
|
50
|
-
addListeners() {
|
|
51
|
-
const owner = this.getOwnerElement();
|
|
52
|
-
owner === null || owner === void 0 ? void 0 : owner.addEventListener('mouseover', this.showTooltip);
|
|
53
|
-
owner === null || owner === void 0 ? void 0 : owner.addEventListener('mouseout', this.hideTooltip);
|
|
54
|
-
owner === null || owner === void 0 ? void 0 : owner.addEventListener('click', this.hideTooltip);
|
|
55
|
-
}
|
|
56
|
-
removeListeners() {
|
|
57
|
-
const owner = this.getOwnerElement();
|
|
58
|
-
owner === null || owner === void 0 ? void 0 : owner.removeEventListener('mouseover', this.showTooltip);
|
|
59
|
-
owner === null || owner === void 0 ? void 0 : owner.removeEventListener('mouseout', this.hideTooltip);
|
|
60
|
-
owner === null || owner === void 0 ? void 0 : owner.removeEventListener('click', this.hideTooltip);
|
|
61
|
-
}
|
|
62
|
-
getOwnerElement() {
|
|
63
|
-
var _a;
|
|
64
|
-
let element = this.host;
|
|
65
|
-
do {
|
|
66
|
-
element = element.parentNode;
|
|
67
|
-
} while (element &&
|
|
68
|
-
element.nodeType !== Node.DOCUMENT_FRAGMENT_NODE &&
|
|
69
|
-
element.nodeType !== Node.DOCUMENT_NODE);
|
|
70
|
-
return (_a = element) === null || _a === void 0 ? void 0 : _a.getElementById(this.elementId);
|
|
71
|
-
}
|
|
72
|
-
get host() { return index.getElement(this); }
|
|
73
|
-
};
|
|
74
|
-
Tooltip.style = tooltipCss;
|
|
75
|
-
|
|
76
|
-
const tooltipContentCss = ":host{animation:display-tooltip 0.2s ease;display:flex;border-radius:0.25rem;padding:0.25rem 0.5rem;background-color:rgb(var(--contrast-1300));box-shadow:var(--shadow-depth-16)}text{font-size:0.875rem;line-height:1.25;display:flex;column-gap:1rem}text.has-column-layout{display:table-cell;width:fit-content;max-width:min(var(--tooltip-max-width-of-text), 80vw)}text.has-column-layout .label{padding-bottom:0.5rem}text.has-column-layout .helper-label{padding-bottom:0.25rem}.label{color:rgb(var(--contrast-200))}.helper-label{color:rgb(var(--contrast-800))}.helper-label:empty{display:none}@keyframes display-tooltip{0%{opacity:0;transform:translate3d(0, 0, 0) scale(0.94)}100%{opacity:1;transform:translate3d(0, 0, 0) scale(1)}}";
|
|
77
|
-
|
|
78
|
-
const TooltipContent = class {
|
|
79
|
-
constructor(hostRef) {
|
|
80
|
-
index.registerInstance(this, hostRef);
|
|
81
|
-
}
|
|
82
|
-
render() {
|
|
83
|
-
let isLabelsTextLong = false;
|
|
84
|
-
if (this.helperLabel && this.maxlength) {
|
|
85
|
-
isLabelsTextLong =
|
|
86
|
-
this.label.length + this.helperLabel.length > this.maxlength;
|
|
87
|
-
}
|
|
88
|
-
const props = {};
|
|
89
|
-
if (this.maxlength) {
|
|
90
|
-
props.style = {
|
|
91
|
-
'--tooltip-max-width-of-text': `${this.maxlength}` + 'ch',
|
|
92
|
-
};
|
|
93
|
-
}
|
|
94
|
-
return [
|
|
95
|
-
index.h("text", Object.assign({ class: { 'has-column-layout': isLabelsTextLong } }, props), index.h("div", { class: "label" }, this.label), index.h("div", { class: "helper-label" }, this.helperLabel)),
|
|
96
|
-
];
|
|
97
|
-
}
|
|
98
|
-
};
|
|
99
|
-
TooltipContent.style = tooltipContentCss;
|
|
100
|
-
|
|
101
|
-
exports.limel_tooltip = Tooltip;
|
|
102
|
-
exports.limel_tooltip_content = TooltipContent;
|