@limetech/lime-elements 37.1.0-next.13 → 37.1.0-next.14

package/dist/lime-elements/{p-5235c79f.entry.js → p-d8826406.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as o,g as e}from"./p-3075aa67.js";import{m as r,r as n}from"./p-c9bdda85.js";const a=':host{--mdc-theme-primary:var(\n      --lime-primary-color,\n      rgb(var(--color-teal-default))\n  );--mdc-theme-secondary:var(\n      --lime-secondary-color,\n      rgb(var(--contrast-1100))\n  );--mdc-theme-on-primary:var(\n      --lime-on-primary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-secondary:var(\n      --lime-on-secondary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-text-disabled-on-background:var(\n      --lime-text-disabled-on-background-color,\n      rgba(var(--contrast-1700), 0.38)\n  );--mdc-theme-text-primary-on-background:var(\n      --lime-text-primary-on-background-color,\n      rgba(var(--contrast-1700), 0.87)\n  );--mdc-theme-text-secondary-on-background:var(\n      --lime-text-secondary-on-background-color,\n      rgba(var(--contrast-1700), 0.54)\n  );--mdc-theme-error:var(\n      --lime-error-background-color,\n      rgb(var(--color-red-dark))\n  );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n      --lime-surface-background-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-surface:var(\n      --lime-on-surface-color,\n      rgb(var(--contrast-1500))\n  )}.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.mdc-button{min-width:2.25rem;padding-top:0;padding-right:var(--button-padding-right, 0.75rem);padding-bottom:0;padding-left:var(--button-padding-left, 0.75rem);height:100%;min-height:2.25rem;width:100%}button.mdc-button:not(:disabled){transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal)}button.mdc-button:not(:disabled):focus{outline:none}button.mdc-button:not(:disabled):focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button.mdc-button:not(:disabled):hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button.mdc-button:not(:disabled):active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}:host(limel-button[primary]) button.mdc-button:not(:disabled){color:var(--mdc-theme-on-primary, rgb(var(--color-white)));background-color:var(--mdc-theme-primary, rgb(var(--color-teal-default)))}:host(limel-button[primary]) button.mdc-button:disabled{background-color:rgba(var(--contrast-1700), 0.15)}:host(limel-button:not([primary])) button.mdc-button:not(:disabled){color:var(--mdc-theme-primary, rgb(var(--color-teal-default)))}:host(limel-button:not([primary])) 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--outlined{border-color:rgba(var(--contrast-1700), 0.2)}button.mdc-button .mdc-button__icon{flex-shrink:0;margin-left:-0.25rem}button.mdc-button .mdc-button__icon.no-label{margin-right:-0.25rem}button .label{opacity:1}button limel-spinner{opacity:0;display:none;position:absolute}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,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) .mdc-button__icon{transition:all 0.3s ease;transition-delay:0.3s;opacity:0;width:0;height:0}';const d=class{constructor(o){t(this,o);this.label=undefined;this.primary=false;this.outlined=false;this.icon=undefined;this.disabled=false;this.loading=false;this.loadingFailed=false;this.justLoaded=false}componentWillLoad(){r(this.host)}disconnectedCallback(){n(this.host)}render(){return o("button",{class:{"mdc-button":true,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:false}),o("svg",{viewBox:"0 0 30 30"},this.renderLoadingIcons()))}loadingWatcher(t,o){if(o&&!t){this.justLoaded=true;const t=2e3;this.justLoadedTimeout=window.setTimeout((()=>{this.justLoaded=false}),t)}else if(t){this.justLoaded=false;window.clearTimeout(this.justLoadedTimeout)}}renderLoadingIcons(){if(this.loadingFailed){return[o("line",{x1:"9",y1:"9",x2:"21",y2:"21"}),o("line",{x1:"21",y1:"9",x2:"9",y2:"21"})]}return[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="";if(!this.label){t="no-label"}return o("i",{class:`mdc-button__icon ${t}`},o("limel-icon",{name:this.icon}))}get host(){return e(this)}static get watchers(){return{loading:["loadingWatcher"]}}};d.style=a;export{d as limel_button};
-//# sourceMappingURL=p-5235c79f.entry.js.map
+import{r as t,h as o,g as e}from"./p-3075aa67.js";import{m as r,r as n}from"./p-d028b08d.js";const a=':host{--mdc-theme-primary:var(\n      --lime-primary-color,\n      rgb(var(--color-teal-default))\n  );--mdc-theme-secondary:var(\n      --lime-secondary-color,\n      rgb(var(--contrast-1100))\n  );--mdc-theme-on-primary:var(\n      --lime-on-primary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-secondary:var(\n      --lime-on-secondary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-text-disabled-on-background:var(\n      --lime-text-disabled-on-background-color,\n      rgba(var(--contrast-1700), 0.38)\n  );--mdc-theme-text-primary-on-background:var(\n      --lime-text-primary-on-background-color,\n      rgba(var(--contrast-1700), 0.87)\n  );--mdc-theme-text-secondary-on-background:var(\n      --lime-text-secondary-on-background-color,\n      rgba(var(--contrast-1700), 0.54)\n  );--mdc-theme-error:var(\n      --lime-error-background-color,\n      rgb(var(--color-red-dark))\n  );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n      --lime-surface-background-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-surface:var(\n      --lime-on-surface-color,\n      rgb(var(--contrast-1500))\n  )}.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.mdc-button{min-width:2.25rem;padding-top:0;padding-right:var(--button-padding-right, 0.75rem);padding-bottom:0;padding-left:var(--button-padding-left, 0.75rem);height:100%;min-height:2.25rem;width:100%}button.mdc-button:not(:disabled){transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal)}button.mdc-button:not(:disabled):focus{outline:none}button.mdc-button:not(:disabled):focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button.mdc-button:not(:disabled):hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button.mdc-button:not(:disabled):active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}:host(limel-button[primary]) button.mdc-button:not(:disabled){color:var(--mdc-theme-on-primary, rgb(var(--color-white)));background-color:var(--mdc-theme-primary, rgb(var(--color-teal-default)))}:host(limel-button[primary]) button.mdc-button:disabled{background-color:rgba(var(--contrast-1700), 0.15)}:host(limel-button:not([primary])) button.mdc-button:not(:disabled){color:var(--mdc-theme-primary, rgb(var(--color-teal-default)))}:host(limel-button:not([primary])) 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--outlined{border-color:rgba(var(--contrast-1700), 0.2)}button.mdc-button .mdc-button__icon{flex-shrink:0;margin-left:-0.25rem}button.mdc-button .mdc-button__icon.no-label{margin-right:-0.25rem}button .label{opacity:1}button limel-spinner{opacity:0;display:none;position:absolute}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,:host(.has-reduced-presence) button[disabled]:not(.loading):not(.just-loaded) .mdc-button__icon{transition:all 0.3s ease;transition-delay:0.3s;opacity:0;width:0;height:0}';const d=class{constructor(o){t(this,o);this.label=undefined;this.primary=false;this.outlined=false;this.icon=undefined;this.disabled=false;this.loading=false;this.loadingFailed=false;this.justLoaded=false}componentWillLoad(){r(this.host)}disconnectedCallback(){n(this.host)}render(){return o("button",{class:{"mdc-button":true,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:false}),o("svg",{viewBox:"0 0 30 30"},this.renderLoadingIcons()))}loadingWatcher(t,o){if(o&&!t){this.justLoaded=true;const t=2e3;this.justLoadedTimeout=window.setTimeout((()=>{this.justLoaded=false}),t)}else if(t){this.justLoaded=false;window.clearTimeout(this.justLoadedTimeout)}}renderLoadingIcons(){if(this.loadingFailed){return[o("line",{x1:"9",y1:"9",x2:"21",y2:"21"}),o("line",{x1:"21",y1:"9",x2:"9",y2:"21"})]}return[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="";if(!this.label){t="no-label"}return o("i",{class:`mdc-button__icon ${t}`},o("limel-icon",{name:this.icon}))}get host(){return e(this)}static get watchers(){return{loading:["loadingWatcher"]}}};d.style=a;export{d as limel_button};
+//# sourceMappingURL=p-d8826406.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["buttonCss","Button","componentWillLoad","makeEnterClickable","this","host","disconnectedCallback","removeEnterClickable","render","h","class","loading","justLoaded","loadingFailed","outlined","disabled","renderIcon","label","limeBranded","viewBox","renderLoadingIcons","loadingWatcher","newValue","oldValue","TIMEOUT","justLoadedTimeout","window","setTimeout","clearTimeout","x1","y1","x2","y2","icon","withoutLabelClass","name"],"sources":["./src/components/button/button.scss?tag=limel-button&encapsulation=shadow","./src/components/button/button.tsx"],"sourcesContent":["@use '../../style/functions';\n@use '../../style/mixins';\n\n@use '../../style/internal/lime-theme';\n\n@use '@material/button/styles';\n@use '@material/button';\n\n:host {\n    display: inline-block;\n}\n\n:host([hidden]) {\n    display: none;\n}\n\n:host([disabled]) {\n    pointer-events: none;\n}\n\nbutton {\n    &.mdc-button {\n        min-width: functions.pxToRem(36);\n        padding: {\n            top: 0;\n            right: var(--button-padding-right, #{functions.pxToRem(12)});\n            bottom: 0;\n            left: var(--button-padding-left, #{functions.pxToRem(12)});\n        }\n        height: 100%;\n        min-height: functions.pxToRem(36);\n        width: 100%;\n\n        &:not(:disabled) {\n            @include mixins.visualize-keyboard-focus;\n            @include mixins.is-elevated-clickable();\n        }\n\n        :host(limel-button[primary]) & {\n            &:not(:disabled) {\n                color: var(--mdc-theme-on-primary, rgb(var(--color-white)));\n                background-color: var(\n                    --mdc-theme-primary,\n                    rgb(var(--color-teal-default))\n                );\n            }\n            &:disabled {\n                background-color: rgba(var(--contrast-1700), 0.15);\n            }\n        }\n\n        :host(limel-button:not([primary])) & {\n            &:not(:disabled) {\n                color: var(--mdc-theme-primary, rgb(var(--color-teal-default)));\n            }\n            &:disabled {\n                color: rgba(var(--contrast-1600), 0.37);\n                background-color: rgba(var(--contrast-1600), 0.1);\n            }\n        }\n\n        &:disabled {\n            &.mdc-button--outlined {\n                border-color: rgba(var(--contrast-1700), 0.2);\n            }\n        }\n\n        .mdc-button__icon {\n            flex-shrink: 0;\n            margin-left: functions.pxToRem(-4);\n\n            &.no-label {\n                margin-right: functions.pxToRem(-4);\n            }\n        }\n    }\n\n    .label {\n        opacity: 1;\n    }\n\n    limel-spinner {\n        opacity: 0;\n        display: none;\n        position: absolute;\n    }\n\n    limel-icon {\n        vertical-align: top;\n    }\n\n    svg {\n        height: functions.pxToRem(30);\n        opacity: 0;\n        pointer-events: none;\n        position: absolute;\n        width: functions.pxToRem(30);\n\n        line {\n            stroke: rgb(var(--color-white));\n            stroke-width: 2;\n        }\n    }\n\n    limel-icon,\n    .label,\n    limel-spinner,\n    svg {\n        transition: opacity 300ms ease-in-out;\n    }\n\n    &.loading {\n        limel-icon,\n        .label {\n            opacity: 0;\n        }\n        limel-spinner {\n            opacity: 1;\n            display: block;\n        }\n    }\n\n    &.just-loaded,\n    &.just-failed {\n        limel-icon,\n        .label {\n            opacity: 0;\n        }\n        svg {\n            opacity: 1;\n        }\n        limel-spinner {\n            display: block;\n            animation: fade-out-spinner 0.3s ease;\n        }\n    }\n\n    &.just-failed {\n        background-color: var(--lime-error-text-color) !important;\n        animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n    }\n}\n\n.mdc-button--outlined {\n    @include button.outline-color(primary);\n}\n\n@keyframes fade-out-spinner {\n    0% {\n        opacity: 1;\n        transform: scale(1);\n    }\n    100% {\n        opacity: 0;\n        transform: scale(1.5);\n    }\n}\n\n@keyframes shake {\n    10%,\n    90% {\n        transform: translate3d(#{functions.pxToRem(-1)}, 0, 0);\n    }\n\n    20%,\n    80% {\n        transform: translate3d(#{functions.pxToRem(2)}, 0, 0);\n    }\n\n    30%,\n    50%,\n    70% {\n        transform: translate3d(#{functions.pxToRem(-3)}, 0, 0);\n    }\n\n    40%,\n    60% {\n        transform: translate3d(#{functions.pxToRem(3)}, 0, 0);\n    }\n}\n\n@import './partial-styles/_has-reduced-presence';\n","import { Component, h, Prop, State, Watch, Element } from '@stencil/core';\nimport {\n    makeEnterClickable,\n    removeEnterClickable,\n} from '../../util/make-enter-clickable';\n\n/**\n * @exampleComponent limel-example-button-basic\n * @exampleComponent limel-example-button-primary\n * @exampleComponent limel-example-button-outlined\n * @exampleComponent limel-example-button-disabled\n * @exampleComponent limel-example-button-icon\n * @exampleComponent limel-example-button-loading\n * @exampleComponent limel-example-button-click-success\n * @exampleComponent limel-example-button-click-fail\n * @exampleComponent limel-example-button-reduce-presence\n * @exampleComponent limel-example-button-colors\n * @exampleComponent limel-example-button-composite\n */\n@Component({\n    tag: 'limel-button',\n    shadow: true,\n    styleUrl: 'button.scss',\n})\nexport class Button {\n    /**\n     * The text to show on the button.\n     */\n    @Prop({ reflect: true })\n    public label: string;\n\n    /**\n     * Set to `true` to make the button primary.\n     */\n    @Prop({ reflect: true })\n    public primary = false;\n\n    /**\n     * Set to `true` to make the button outlined.\n     */\n    @Prop({ reflect: true })\n    public outlined = false;\n\n    /**\n     * Set icon for the button\n     */\n    @Prop({ reflect: true })\n    public icon: string;\n\n    /**\n     * Set to `true` to disable the button.\n     */\n    @Prop({ reflect: true })\n    public disabled = false;\n\n    /**\n     * Set to `true` to put the button in the `loading` state.\n     * This also disables the button.\n     */\n    @Prop({ reflect: true })\n    public loading = false;\n\n    /**\n     * Set to `true` to indicate failure instead of success when the button is\n     * no longer in the `loading` state.\n     */\n    @Prop({ reflect: true })\n    public loadingFailed = false;\n\n    @State()\n    private justLoaded = false;\n\n    @Element()\n    private host: HTMLElement;\n\n    private justLoadedTimeout?: number;\n\n    public componentWillLoad() {\n        makeEnterClickable(this.host);\n    }\n\n    public disconnectedCallback() {\n        removeEnterClickable(this.host);\n    }\n\n    public render() {\n        return (\n            <button\n                class={{\n                    'mdc-button': true,\n                    loading: this.loading,\n                    'just-loaded': this.justLoaded && !this.loadingFailed,\n                    'just-failed': this.justLoaded && this.loadingFailed,\n                    'mdc-button--outlined': this.outlined,\n                }}\n                disabled={this.disabled || this.loading}\n            >\n                {this.renderIcon()}\n                <span class=\"label mdc-button__label\">{this.label}</span>\n                <limel-spinner limeBranded={false} />\n                <svg viewBox=\"0 0 30 30\">{this.renderLoadingIcons()}</svg>\n            </button>\n        );\n    }\n\n    @Watch('loading')\n    protected loadingWatcher(newValue: boolean, oldValue: boolean) {\n        if (oldValue && !newValue) {\n            this.justLoaded = true;\n            const TIMEOUT = 2000;\n            this.justLoadedTimeout = window.setTimeout(() => {\n                this.justLoaded = false;\n            }, TIMEOUT);\n        } else if (newValue) {\n            this.justLoaded = false;\n            window.clearTimeout(this.justLoadedTimeout);\n        }\n    }\n\n    private renderLoadingIcons() {\n        if (this.loadingFailed) {\n            return [\n                <line x1=\"9\" y1=\"9\" x2=\"21\" y2=\"21\"></line>,\n                <line x1=\"21\" y1=\"9\" x2=\"9\" y2=\"21\"></line>,\n            ];\n        }\n\n        return [\n            <line x1=\"8\" y1=\"14\" x2=\"15\" y2=\"20\"></line>,\n            <line x1=\"23\" y1=\"9\" x2=\"14\" y2=\"20\"></line>,\n        ];\n    }\n\n    private renderIcon(): HTMLElement {\n        if (!this.icon) {\n            return;\n        }\n\n        let withoutLabelClass = '';\n        if (!this.label) {\n            withoutLabelClass = 'no-label';\n        }\n\n        return (\n            <i class={`mdc-button__icon ${withoutLabelClass}`}>\n                <limel-icon name={this.icon} />\n            </i>\n        );\n    }\n}\n"],"mappings":"6FAAA,MAAMA,EAAY,gryB,MCwBLC,EAAM,M,2DAWE,M,cAMC,M,kCAYA,M,aAOD,M,mBAOM,M,gBAGF,K,CAOdC,oBACHC,EAAmBC,KAAKC,K,CAGrBC,uBACHC,EAAqBH,KAAKC,K,CAGvBG,SACH,OACIC,EAAA,UACIC,MAAO,CACH,aAAc,KACdC,QAASP,KAAKO,QACd,cAAeP,KAAKQ,aAAeR,KAAKS,cACxC,cAAeT,KAAKQ,YAAcR,KAAKS,cACvC,uBAAwBT,KAAKU,UAEjCC,SAAUX,KAAKW,UAAYX,KAAKO,SAE/BP,KAAKY,aACNP,EAAA,QAAMC,MAAM,2BAA2BN,KAAKa,OAC5CR,EAAA,iBAAeS,YAAa,QAC5BT,EAAA,OAAKU,QAAQ,aAAaf,KAAKgB,sB,CAMjCC,eAAeC,EAAmBC,GACxC,GAAIA,IAAaD,EAAU,CACvBlB,KAAKQ,WAAa,KAClB,MAAMY,EAAU,IAChBpB,KAAKqB,kBAAoBC,OAAOC,YAAW,KACvCvB,KAAKQ,WAAa,KAAK,GACxBY,E,MACA,GAAIF,EAAU,CACjBlB,KAAKQ,WAAa,MAClBc,OAAOE,aAAaxB,KAAKqB,kB,EAIzBL,qBACJ,GAAIhB,KAAKS,cAAe,CACpB,MAAO,CACHJ,EAAA,QAAMoB,GAAG,IAAIC,GAAG,IAAIC,GAAG,KAAKC,GAAG,OAC/BvB,EAAA,QAAMoB,GAAG,KAAKC,GAAG,IAAIC,GAAG,IAAIC,GAAG,O,CAIvC,MAAO,CACHvB,EAAA,QAAMoB,GAAG,IAAIC,GAAG,KAAKC,GAAG,KAAKC,GAAG,OAChCvB,EAAA,QAAMoB,GAAG,KAAKC,GAAG,IAAIC,GAAG,KAAKC,GAAG,O,CAIhChB,aACJ,IAAKZ,KAAK6B,KAAM,CACZ,M,CAGJ,IAAIC,EAAoB,GACxB,IAAK9B,KAAKa,MAAO,CACbiB,EAAoB,U,CAGxB,OACIzB,EAAA,KAAGC,MAAO,oBAAoBwB,KAC1BzB,EAAA,cAAY0B,KAAM/B,KAAK6B,O"}

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

@@ -56,6 +56,11 @@ export declare class Portal {
    * true from false when the dialog opens to position the content properly.
    */
   visible: boolean;
+  /**
+   * The element that the content should be positioned relative to.
+   * Defaults to the limel-portal element.
+   */
+  anchor?: HTMLElement;
   private host;
   private parents;
   private container;

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

@@ -15,8 +15,9 @@ import { JSX } from 'react';
  *
  * :::note
  * In order to display the tooltip, the tooltip element and its trigger element
- * must be within the same document or document fragment.
- * A good practice is to just place them next to each other like below:
+ * must be within the same document or document fragment (the same shadowRoot).
+ * Often, it's easiest to just place them next to each other like in the example
+ * below, but if you need to, you can place them differently.
  *
  * ```html
  * <limel-button icon="search" id="tooltip-example" />
@@ -40,7 +41,6 @@ import { JSX } from 'react';
  * @exampleComponent limel-example-tooltip-basic
  * @exampleComponent limel-example-tooltip-max-character
  * @exampleComponent limel-example-tooltip-composite
- * @private
  */
 export declare class Tooltip {
   /**
@@ -69,6 +69,7 @@ export declare class Tooltip {
   private portalId;
   private tooltipId;
   private showTooltipTimeoutHandle;
+  private ownerElement;
   constructor();
   connectedCallback(): void;
   disconnectedCallback(): void;

package/dist/types/components.d.ts

@@ -1525,6 +1525,10 @@ export namespace Components {
      * @exampleComponent limel-example-portal-basic
      */
     interface LimelPortal {
+        /**
+          * The element that the content should be positioned relative to. Defaults to the limel-portal element.
+         */
+        "anchor"?: HTMLElement;
         /**
           * A unique ID.
          */
@@ -1999,8 +2003,9 @@ export namespace Components {
      * to it.
      * :::note
      * In order to display the tooltip, the tooltip element and its trigger element
-     * must be within the same document or document fragment.
-     * A good practice is to just place them next to each other like below:
+     * must be within the same document or document fragment (the same shadowRoot).
+     * Often, it's easiest to just place them next to each other like in the example
+     * below, but if you need to, you can place them differently.
      * ```html
      * <limel-button icon="search" id="tooltip-example" />
      * <limel-tooltip label="Search" elementId="tooltip-example" />
@@ -2022,7 +2027,6 @@ export namespace Components {
      * @exampleComponent limel-example-tooltip-basic
      * @exampleComponent limel-example-tooltip-max-character
      * @exampleComponent limel-example-tooltip-composite
-     * @private 
      */
     interface LimelTooltip {
         /**
@@ -3207,8 +3211,9 @@ declare global {
      * to it.
      * :::note
      * In order to display the tooltip, the tooltip element and its trigger element
-     * must be within the same document or document fragment.
-     * A good practice is to just place them next to each other like below:
+     * must be within the same document or document fragment (the same shadowRoot).
+     * Often, it's easiest to just place them next to each other like in the example
+     * below, but if you need to, you can place them differently.
      * ```html
      * <limel-button icon="search" id="tooltip-example" />
      * <limel-tooltip label="Search" elementId="tooltip-example" />
@@ -3230,7 +3235,6 @@ declare global {
      * @exampleComponent limel-example-tooltip-basic
      * @exampleComponent limel-example-tooltip-max-character
      * @exampleComponent limel-example-tooltip-composite
-     * @private 
      */
     interface HTMLLimelTooltipElement extends Components.LimelTooltip, HTMLStencilElement {
     }
@@ -4930,6 +4934,10 @@ declare namespace LocalJSX {
      * @exampleComponent limel-example-portal-basic
      */
     interface LimelPortal {
+        /**
+          * The element that the content should be positioned relative to. Defaults to the limel-portal element.
+         */
+        "anchor"?: HTMLElement;
         /**
           * A unique ID.
          */
@@ -5468,8 +5476,9 @@ declare namespace LocalJSX {
      * to it.
      * :::note
      * In order to display the tooltip, the tooltip element and its trigger element
-     * must be within the same document or document fragment.
-     * A good practice is to just place them next to each other like below:
+     * must be within the same document or document fragment (the same shadowRoot).
+     * Often, it's easiest to just place them next to each other like in the example
+     * below, but if you need to, you can place them differently.
      * ```html
      * <limel-button icon="search" id="tooltip-example" />
      * <limel-tooltip label="Search" elementId="tooltip-example" />
@@ -5491,7 +5500,6 @@ declare namespace LocalJSX {
      * @exampleComponent limel-example-tooltip-basic
      * @exampleComponent limel-example-tooltip-max-character
      * @exampleComponent limel-example-tooltip-composite
-     * @private 
      */
     interface LimelTooltip {
         /**
@@ -6339,8 +6347,9 @@ declare module "@stencil/core" {
              * to it.
              * :::note
              * In order to display the tooltip, the tooltip element and its trigger element
-             * must be within the same document or document fragment.
-             * A good practice is to just place them next to each other like below:
+             * must be within the same document or document fragment (the same shadowRoot).
+             * Often, it's easiest to just place them next to each other like in the example
+             * below, but if you need to, you can place them differently.
              * ```html
              * <limel-button icon="search" id="tooltip-example" />
              * <limel-tooltip label="Search" elementId="tooltip-example" />
@@ -6362,7 +6371,6 @@ declare module "@stencil/core" {
              * @exampleComponent limel-example-tooltip-basic
              * @exampleComponent limel-example-tooltip-max-character
              * @exampleComponent limel-example-tooltip-composite
-             * @private 
              */
             "limel-tooltip": LocalJSX.LimelTooltip & JSXBase.HTMLAttributes<HTMLLimelTooltipElement>;
             /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@limetech/lime-elements",
-  "version": "37.1.0-next.13",
+  "version": "37.1.0-next.14",
   "description": "Lime Elements",
   "author": "Lime Technologies",
   "license": "Apache-2.0",
@@ -58,7 +58,7 @@
     "codemirror": "^5.65.9",
     "cross-env": "^7.0.3",
     "dayjs": "^1.11.9",
-    "eslint": "^8.46.0",
+    "eslint": "^8.47.0",
     "eslint-config-prettier": "^9.0.0",
     "eslint-plugin-ban": "^1.6.0",
     "eslint-plugin-jsdoc": "^46.4.6",

package/dist/cjs/makeEnterClickable-aa2ed75b.js

@@ -1,68 +0,0 @@
-'use strict';
-
-const index = require('./index-38eb64b5.js');
-
-const eventHandlers = new WeakMap();
-/**
- * Overrides the default browser behavior for clickable elements
- * When focused and pressing down enter, avoids calling onClick repeatedly
- * @param {HTMLElement} element the clickable element
- */
-// eslint-disable-next-line sonarjs/cognitive-complexity
-function makeEnterClickable(element) {
-  if (eventHandlers.has(element)) {
-    return;
-  }
-  let isActive = false;
-  let hasJustReleasedEnter = true;
-  const keydownHandler = (event) => {
-    if (event.key === 'Enter' && !isActive) {
-      isActive = true;
-      if (element === null || element === void 0 ? void 0 : element.shadowRoot) {
-        index.forceUpdate(element);
-      }
-    }
-  };
-  const keyupHandler = (event) => {
-    if (event.key === 'Enter' && isActive) {
-      isActive = false;
-      hasJustReleasedEnter = true;
-      if (element === null || element === void 0 ? void 0 : element.shadowRoot) {
-        index.forceUpdate(element);
-      }
-    }
-  };
-  const clickHandler = (event) => {
-    if (!isActive) {
-      return;
-    }
-    if (hasJustReleasedEnter) {
-      hasJustReleasedEnter = false;
-      return;
-    }
-    event.stopImmediatePropagation();
-  };
-  eventHandlers.set(element, {
-    keydownHandler: keydownHandler,
-    keyupHandler: keyupHandler,
-    clickHandler: clickHandler,
-  });
-  element.addEventListener('keydown', keydownHandler);
-  element.addEventListener('keyup', keyupHandler);
-  element.addEventListener('click', clickHandler, true);
-}
-function removeEnterClickable(element) {
-  const callBacks = eventHandlers.get(element);
-  if (!callBacks || !eventHandlers.has(element)) {
-    return;
-  }
-  element.removeEventListener('keydown', callBacks.keydownHandler);
-  element.removeEventListener('keyup', callBacks.keyupHandler);
-  element.removeEventListener('click', callBacks.clickHandler, true);
-  eventHandlers.delete(element);
-}
-
-exports.makeEnterClickable = makeEnterClickable;
-exports.removeEnterClickable = removeEnterClickable;
-
-//# sourceMappingURL=makeEnterClickable-aa2ed75b.js.map

package/dist/cjs/makeEnterClickable-aa2ed75b.js.map

@@ -1 +0,0 @@
-{"file":"makeEnterClickable-aa2ed75b.js","mappings":";;;;AAEA,MAAM,aAAa,GAAoC,IAAI,OAAO,EAAE,CAAC;AAErE;;;;;AAKA;SACgB,kBAAkB,CAAC,OAAoB;EACnD,IAAI,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;IAC5B,OAAO;GACV;EAED,IAAI,QAAQ,GAAG,KAAK,CAAC;EACrB,IAAI,oBAAoB,GAAG,IAAI,CAAC;EAEhC,MAAM,cAAc,GAAG,CAAC,KAAoB;IACxC,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,QAAQ,EAAE;MACpC,QAAQ,GAAG,IAAI,CAAC;MAEhB,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU,EAAE;QACrBA,iBAAW,CAAC,OAAO,CAAC,CAAC;OACxB;KACJ;GACJ,CAAC;EAEF,MAAM,YAAY,GAAG,CAAC,KAAoB;IACtC,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,QAAQ,EAAE;MACnC,QAAQ,GAAG,KAAK,CAAC;MACjB,oBAAoB,GAAG,IAAI,CAAC;MAE5B,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU,EAAE;QACrBA,iBAAW,CAAC,OAAO,CAAC,CAAC;OACxB;KACJ;GACJ,CAAC;EAEF,MAAM,YAAY,GAAG,CAAC,KAAiB;IACnC,IAAI,CAAC,QAAQ,EAAE;MACX,OAAO;KACV;IAED,IAAI,oBAAoB,EAAE;MACtB,oBAAoB,GAAG,KAAK,CAAC;MAE7B,OAAO;KACV;IAED,KAAK,CAAC,wBAAwB,EAAE,CAAC;GACpC,CAAC;EAEF,aAAa,CAAC,GAAG,CAAC,OAAO,EAAE;IACvB,cAAc,EAAE,cAAc;IAC9B,YAAY,EAAE,YAAY;IAC1B,YAAY,EAAE,YAAY;GAC7B,CAAC,CAAC;EAEH,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;EACpD,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC;EAChD,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,YAAY,EAAE,IAAI,CAAC,CAAC;AAC1D,CAAC;SAEe,oBAAoB,CAAC,OAAoB;EACrD,MAAM,SAAS,GAAc,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;EAExD,IAAI,CAAC,SAAS,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;IAC3C,OAAO;GACV;EAED,OAAO,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;EACjE,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;EAC7D,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,SAAS,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC;EAEnE,aAAa,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;AAClC;;;;;","names":["forceUpdate"],"sources":["./src/util/makeEnterClickable.ts"],"sourcesContent":["import { forceUpdate } from '@stencil/core';\n\nconst eventHandlers: WeakMap<HTMLElement, CallBacks> = new WeakMap();\n\n/**\n * Overrides the default browser behavior for clickable elements\n * When focused and pressing down enter, avoids calling onClick repeatedly\n * @param {HTMLElement} element the clickable element\n */\n// eslint-disable-next-line sonarjs/cognitive-complexity\nexport function makeEnterClickable(element: HTMLElement) {\n    if (eventHandlers.has(element)) {\n        return;\n    }\n\n    let isActive = false;\n    let hasJustReleasedEnter = true;\n\n    const keydownHandler = (event: KeyboardEvent) => {\n        if (event.key === 'Enter' && !isActive) {\n            isActive = true;\n\n            if (element?.shadowRoot) {\n                forceUpdate(element);\n            }\n        }\n    };\n\n    const keyupHandler = (event: KeyboardEvent) => {\n        if (event.key === 'Enter' && isActive) {\n            isActive = false;\n            hasJustReleasedEnter = true;\n\n            if (element?.shadowRoot) {\n                forceUpdate(element);\n            }\n        }\n    };\n\n    const clickHandler = (event: MouseEvent) => {\n        if (!isActive) {\n            return;\n        }\n\n        if (hasJustReleasedEnter) {\n            hasJustReleasedEnter = false;\n\n            return;\n        }\n\n        event.stopImmediatePropagation();\n    };\n\n    eventHandlers.set(element, {\n        keydownHandler: keydownHandler,\n        keyupHandler: keyupHandler,\n        clickHandler: clickHandler,\n    });\n\n    element.addEventListener('keydown', keydownHandler);\n    element.addEventListener('keyup', keyupHandler);\n    element.addEventListener('click', clickHandler, true);\n}\n\nexport function removeEnterClickable(element: HTMLElement) {\n    const callBacks: CallBacks = eventHandlers.get(element);\n\n    if (!callBacks || !eventHandlers.has(element)) {\n        return;\n    }\n\n    element.removeEventListener('keydown', callBacks.keydownHandler);\n    element.removeEventListener('keyup', callBacks.keyupHandler);\n    element.removeEventListener('click', callBacks.clickHandler, true);\n\n    eventHandlers.delete(element);\n}\n\ninterface CallBacks {\n    keydownHandler: (arg: KeyboardEvent) => void;\n    keyupHandler: (arg: KeyboardEvent) => void;\n    clickHandler: (arg: MouseEvent) => void;\n}\n"],"version":3}

package/dist/collection/util/makeEnterClickable.js

@@ -1,61 +0,0 @@
-import { forceUpdate } from '@stencil/core';
-const eventHandlers = new WeakMap();
-/**
- * Overrides the default browser behavior for clickable elements
- * When focused and pressing down enter, avoids calling onClick repeatedly
- * @param {HTMLElement} element the clickable element
- */
-// eslint-disable-next-line sonarjs/cognitive-complexity
-export function makeEnterClickable(element) {
-  if (eventHandlers.has(element)) {
-    return;
-  }
-  let isActive = false;
-  let hasJustReleasedEnter = true;
-  const keydownHandler = (event) => {
-    if (event.key === 'Enter' && !isActive) {
-      isActive = true;
-      if (element === null || element === void 0 ? void 0 : element.shadowRoot) {
-        forceUpdate(element);
-      }
-    }
-  };
-  const keyupHandler = (event) => {
-    if (event.key === 'Enter' && isActive) {
-      isActive = false;
-      hasJustReleasedEnter = true;
-      if (element === null || element === void 0 ? void 0 : element.shadowRoot) {
-        forceUpdate(element);
-      }
-    }
-  };
-  const clickHandler = (event) => {
-    if (!isActive) {
-      return;
-    }
-    if (hasJustReleasedEnter) {
-      hasJustReleasedEnter = false;
-      return;
-    }
-    event.stopImmediatePropagation();
-  };
-  eventHandlers.set(element, {
-    keydownHandler: keydownHandler,
-    keyupHandler: keyupHandler,
-    clickHandler: clickHandler,
-  });
-  element.addEventListener('keydown', keydownHandler);
-  element.addEventListener('keyup', keyupHandler);
-  element.addEventListener('click', clickHandler, true);
-}
-export function removeEnterClickable(element) {
-  const callBacks = eventHandlers.get(element);
-  if (!callBacks || !eventHandlers.has(element)) {
-    return;
-  }
-  element.removeEventListener('keydown', callBacks.keydownHandler);
-  element.removeEventListener('keyup', callBacks.keyupHandler);
-  element.removeEventListener('click', callBacks.clickHandler, true);
-  eventHandlers.delete(element);
-}
-//# sourceMappingURL=makeEnterClickable.js.map

package/dist/collection/util/makeEnterClickable.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"makeEnterClickable.js","sourceRoot":"","sources":["../../src/util/makeEnterClickable.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,MAAM,aAAa,GAAoC,IAAI,OAAO,EAAE,CAAC;AAErE;;;;GAIG;AACH,wDAAwD;AACxD,MAAM,UAAU,kBAAkB,CAAC,OAAoB;EACnD,IAAI,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;IAC5B,OAAO;GACV;EAED,IAAI,QAAQ,GAAG,KAAK,CAAC;EACrB,IAAI,oBAAoB,GAAG,IAAI,CAAC;EAEhC,MAAM,cAAc,GAAG,CAAC,KAAoB,EAAE,EAAE;IAC5C,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,QAAQ,EAAE;MACpC,QAAQ,GAAG,IAAI,CAAC;MAEhB,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU,EAAE;QACrB,WAAW,CAAC,OAAO,CAAC,CAAC;OACxB;KACJ;EACL,CAAC,CAAC;EAEF,MAAM,YAAY,GAAG,CAAC,KAAoB,EAAE,EAAE;IAC1C,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,QAAQ,EAAE;MACnC,QAAQ,GAAG,KAAK,CAAC;MACjB,oBAAoB,GAAG,IAAI,CAAC;MAE5B,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU,EAAE;QACrB,WAAW,CAAC,OAAO,CAAC,CAAC;OACxB;KACJ;EACL,CAAC,CAAC;EAEF,MAAM,YAAY,GAAG,CAAC,KAAiB,EAAE,EAAE;IACvC,IAAI,CAAC,QAAQ,EAAE;MACX,OAAO;KACV;IAED,IAAI,oBAAoB,EAAE;MACtB,oBAAoB,GAAG,KAAK,CAAC;MAE7B,OAAO;KACV;IAED,KAAK,CAAC,wBAAwB,EAAE,CAAC;EACrC,CAAC,CAAC;EAEF,aAAa,CAAC,GAAG,CAAC,OAAO,EAAE;IACvB,cAAc,EAAE,cAAc;IAC9B,YAAY,EAAE,YAAY;IAC1B,YAAY,EAAE,YAAY;GAC7B,CAAC,CAAC;EAEH,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;EACpD,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC;EAChD,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,YAAY,EAAE,IAAI,CAAC,CAAC;AAC1D,CAAC;AAED,MAAM,UAAU,oBAAoB,CAAC,OAAoB;EACrD,MAAM,SAAS,GAAc,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;EAExD,IAAI,CAAC,SAAS,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;IAC3C,OAAO;GACV;EAED,OAAO,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;EACjE,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;EAC7D,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,SAAS,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC;EAEnE,aAAa,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;AAClC,CAAC","sourcesContent":["import { forceUpdate } from '@stencil/core';\n\nconst eventHandlers: WeakMap<HTMLElement, CallBacks> = new WeakMap();\n\n/**\n * Overrides the default browser behavior for clickable elements\n * When focused and pressing down enter, avoids calling onClick repeatedly\n * @param {HTMLElement} element the clickable element\n */\n// eslint-disable-next-line sonarjs/cognitive-complexity\nexport function makeEnterClickable(element: HTMLElement) {\n    if (eventHandlers.has(element)) {\n        return;\n    }\n\n    let isActive = false;\n    let hasJustReleasedEnter = true;\n\n    const keydownHandler = (event: KeyboardEvent) => {\n        if (event.key === 'Enter' && !isActive) {\n            isActive = true;\n\n            if (element?.shadowRoot) {\n                forceUpdate(element);\n            }\n        }\n    };\n\n    const keyupHandler = (event: KeyboardEvent) => {\n        if (event.key === 'Enter' && isActive) {\n            isActive = false;\n            hasJustReleasedEnter = true;\n\n            if (element?.shadowRoot) {\n                forceUpdate(element);\n            }\n        }\n    };\n\n    const clickHandler = (event: MouseEvent) => {\n        if (!isActive) {\n            return;\n        }\n\n        if (hasJustReleasedEnter) {\n            hasJustReleasedEnter = false;\n\n            return;\n        }\n\n        event.stopImmediatePropagation();\n    };\n\n    eventHandlers.set(element, {\n        keydownHandler: keydownHandler,\n        keyupHandler: keyupHandler,\n        clickHandler: clickHandler,\n    });\n\n    element.addEventListener('keydown', keydownHandler);\n    element.addEventListener('keyup', keyupHandler);\n    element.addEventListener('click', clickHandler, true);\n}\n\nexport function removeEnterClickable(element: HTMLElement) {\n    const callBacks: CallBacks = eventHandlers.get(element);\n\n    if (!callBacks || !eventHandlers.has(element)) {\n        return;\n    }\n\n    element.removeEventListener('keydown', callBacks.keydownHandler);\n    element.removeEventListener('keyup', callBacks.keyupHandler);\n    element.removeEventListener('click', callBacks.clickHandler, true);\n\n    eventHandlers.delete(element);\n}\n\ninterface CallBacks {\n    keydownHandler: (arg: KeyboardEvent) => void;\n    keyupHandler: (arg: KeyboardEvent) => void;\n    clickHandler: (arg: MouseEvent) => void;\n}\n"]}

package/dist/esm/makeEnterClickable-b5ad939a.js

@@ -1,65 +0,0 @@
-import { f as forceUpdate } from './index-232e9616.js';
-
-const eventHandlers = new WeakMap();
-/**
- * Overrides the default browser behavior for clickable elements
- * When focused and pressing down enter, avoids calling onClick repeatedly
- * @param {HTMLElement} element the clickable element
- */
-// eslint-disable-next-line sonarjs/cognitive-complexity
-function makeEnterClickable(element) {
-  if (eventHandlers.has(element)) {
-    return;
-  }
-  let isActive = false;
-  let hasJustReleasedEnter = true;
-  const keydownHandler = (event) => {
-    if (event.key === 'Enter' && !isActive) {
-      isActive = true;
-      if (element === null || element === void 0 ? void 0 : element.shadowRoot) {
-        forceUpdate(element);
-      }
-    }
-  };
-  const keyupHandler = (event) => {
-    if (event.key === 'Enter' && isActive) {
-      isActive = false;
-      hasJustReleasedEnter = true;
-      if (element === null || element === void 0 ? void 0 : element.shadowRoot) {
-        forceUpdate(element);
-      }
-    }
-  };
-  const clickHandler = (event) => {
-    if (!isActive) {
-      return;
-    }
-    if (hasJustReleasedEnter) {
-      hasJustReleasedEnter = false;
-      return;
-    }
-    event.stopImmediatePropagation();
-  };
-  eventHandlers.set(element, {
-    keydownHandler: keydownHandler,
-    keyupHandler: keyupHandler,
-    clickHandler: clickHandler,
-  });
-  element.addEventListener('keydown', keydownHandler);
-  element.addEventListener('keyup', keyupHandler);
-  element.addEventListener('click', clickHandler, true);
-}
-function removeEnterClickable(element) {
-  const callBacks = eventHandlers.get(element);
-  if (!callBacks || !eventHandlers.has(element)) {
-    return;
-  }
-  element.removeEventListener('keydown', callBacks.keydownHandler);
-  element.removeEventListener('keyup', callBacks.keyupHandler);
-  element.removeEventListener('click', callBacks.clickHandler, true);
-  eventHandlers.delete(element);
-}
-
-export { makeEnterClickable as m, removeEnterClickable as r };
-
-//# sourceMappingURL=makeEnterClickable-b5ad939a.js.map

package/dist/esm/makeEnterClickable-b5ad939a.js.map

@@ -1 +0,0 @@
-{"file":"makeEnterClickable-b5ad939a.js","mappings":";;AAEA,MAAM,aAAa,GAAoC,IAAI,OAAO,EAAE,CAAC;AAErE;;;;;AAKA;SACgB,kBAAkB,CAAC,OAAoB;EACnD,IAAI,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;IAC5B,OAAO;GACV;EAED,IAAI,QAAQ,GAAG,KAAK,CAAC;EACrB,IAAI,oBAAoB,GAAG,IAAI,CAAC;EAEhC,MAAM,cAAc,GAAG,CAAC,KAAoB;IACxC,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,QAAQ,EAAE;MACpC,QAAQ,GAAG,IAAI,CAAC;MAEhB,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU,EAAE;QACrB,WAAW,CAAC,OAAO,CAAC,CAAC;OACxB;KACJ;GACJ,CAAC;EAEF,MAAM,YAAY,GAAG,CAAC,KAAoB;IACtC,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,QAAQ,EAAE;MACnC,QAAQ,GAAG,KAAK,CAAC;MACjB,oBAAoB,GAAG,IAAI,CAAC;MAE5B,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU,EAAE;QACrB,WAAW,CAAC,OAAO,CAAC,CAAC;OACxB;KACJ;GACJ,CAAC;EAEF,MAAM,YAAY,GAAG,CAAC,KAAiB;IACnC,IAAI,CAAC,QAAQ,EAAE;MACX,OAAO;KACV;IAED,IAAI,oBAAoB,EAAE;MACtB,oBAAoB,GAAG,KAAK,CAAC;MAE7B,OAAO;KACV;IAED,KAAK,CAAC,wBAAwB,EAAE,CAAC;GACpC,CAAC;EAEF,aAAa,CAAC,GAAG,CAAC,OAAO,EAAE;IACvB,cAAc,EAAE,cAAc;IAC9B,YAAY,EAAE,YAAY;IAC1B,YAAY,EAAE,YAAY;GAC7B,CAAC,CAAC;EAEH,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;EACpD,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC;EAChD,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,YAAY,EAAE,IAAI,CAAC,CAAC;AAC1D,CAAC;SAEe,oBAAoB,CAAC,OAAoB;EACrD,MAAM,SAAS,GAAc,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;EAExD,IAAI,CAAC,SAAS,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;IAC3C,OAAO;GACV;EAED,OAAO,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;EACjE,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;EAC7D,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,SAAS,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC;EAEnE,aAAa,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;AAClC;;;;","names":[],"sources":["./src/util/makeEnterClickable.ts"],"sourcesContent":["import { forceUpdate } from '@stencil/core';\n\nconst eventHandlers: WeakMap<HTMLElement, CallBacks> = new WeakMap();\n\n/**\n * Overrides the default browser behavior for clickable elements\n * When focused and pressing down enter, avoids calling onClick repeatedly\n * @param {HTMLElement} element the clickable element\n */\n// eslint-disable-next-line sonarjs/cognitive-complexity\nexport function makeEnterClickable(element: HTMLElement) {\n    if (eventHandlers.has(element)) {\n        return;\n    }\n\n    let isActive = false;\n    let hasJustReleasedEnter = true;\n\n    const keydownHandler = (event: KeyboardEvent) => {\n        if (event.key === 'Enter' && !isActive) {\n            isActive = true;\n\n            if (element?.shadowRoot) {\n                forceUpdate(element);\n            }\n        }\n    };\n\n    const keyupHandler = (event: KeyboardEvent) => {\n        if (event.key === 'Enter' && isActive) {\n            isActive = false;\n            hasJustReleasedEnter = true;\n\n            if (element?.shadowRoot) {\n                forceUpdate(element);\n            }\n        }\n    };\n\n    const clickHandler = (event: MouseEvent) => {\n        if (!isActive) {\n            return;\n        }\n\n        if (hasJustReleasedEnter) {\n            hasJustReleasedEnter = false;\n\n            return;\n        }\n\n        event.stopImmediatePropagation();\n    };\n\n    eventHandlers.set(element, {\n        keydownHandler: keydownHandler,\n        keyupHandler: keyupHandler,\n        clickHandler: clickHandler,\n    });\n\n    element.addEventListener('keydown', keydownHandler);\n    element.addEventListener('keyup', keyupHandler);\n    element.addEventListener('click', clickHandler, true);\n}\n\nexport function removeEnterClickable(element: HTMLElement) {\n    const callBacks: CallBacks = eventHandlers.get(element);\n\n    if (!callBacks || !eventHandlers.has(element)) {\n        return;\n    }\n\n    element.removeEventListener('keydown', callBacks.keydownHandler);\n    element.removeEventListener('keyup', callBacks.keyupHandler);\n    element.removeEventListener('click', callBacks.clickHandler, true);\n\n    eventHandlers.delete(element);\n}\n\ninterface CallBacks {\n    keydownHandler: (arg: KeyboardEvent) => void;\n    keyupHandler: (arg: KeyboardEvent) => void;\n    clickHandler: (arg: MouseEvent) => void;\n}\n"],"version":3}

package/dist/lime-elements/p-5235c79f.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["buttonCss","Button","componentWillLoad","makeEnterClickable","this","host","disconnectedCallback","removeEnterClickable","render","h","class","loading","justLoaded","loadingFailed","outlined","disabled","renderIcon","label","limeBranded","viewBox","renderLoadingIcons","loadingWatcher","newValue","oldValue","TIMEOUT","justLoadedTimeout","window","setTimeout","clearTimeout","x1","y1","x2","y2","icon","withoutLabelClass","name"],"sources":["./src/components/button/button.scss?tag=limel-button&encapsulation=shadow","./src/components/button/button.tsx"],"sourcesContent":["@use '../../style/functions';\n@use '../../style/mixins';\n\n@use '../../style/internal/lime-theme';\n\n@use '@material/button/styles';\n@use '@material/button';\n\n:host {\n    display: inline-block;\n}\n\n:host([hidden]) {\n    display: none;\n}\n\n:host([disabled]) {\n    pointer-events: none;\n}\n\nbutton {\n    &.mdc-button {\n        min-width: functions.pxToRem(36);\n        padding: {\n            top: 0;\n            right: var(--button-padding-right, #{functions.pxToRem(12)});\n            bottom: 0;\n            left: var(--button-padding-left, #{functions.pxToRem(12)});\n        }\n        height: 100%;\n        min-height: functions.pxToRem(36);\n        width: 100%;\n\n        &:not(:disabled) {\n            @include mixins.visualize-keyboard-focus;\n            @include mixins.is-elevated-clickable();\n        }\n\n        :host(limel-button[primary]) & {\n            &:not(:disabled) {\n                color: var(--mdc-theme-on-primary, rgb(var(--color-white)));\n                background-color: var(\n                    --mdc-theme-primary,\n                    rgb(var(--color-teal-default))\n                );\n            }\n            &:disabled {\n                background-color: rgba(var(--contrast-1700), 0.15);\n            }\n        }\n\n        :host(limel-button:not([primary])) & {\n            &:not(:disabled) {\n                color: var(--mdc-theme-primary, rgb(var(--color-teal-default)));\n            }\n            &:disabled {\n                color: rgba(var(--contrast-1600), 0.37);\n                background-color: rgba(var(--contrast-1600), 0.1);\n            }\n        }\n\n        &:disabled {\n            &.mdc-button--outlined {\n                border-color: rgba(var(--contrast-1700), 0.2);\n            }\n        }\n\n        .mdc-button__icon {\n            flex-shrink: 0;\n            margin-left: functions.pxToRem(-4);\n\n            &.no-label {\n                margin-right: functions.pxToRem(-4);\n            }\n        }\n    }\n\n    .label {\n        opacity: 1;\n    }\n\n    limel-spinner {\n        opacity: 0;\n        display: none;\n        position: absolute;\n    }\n\n    limel-icon {\n        vertical-align: top;\n    }\n\n    svg {\n        height: functions.pxToRem(30);\n        opacity: 0;\n        pointer-events: none;\n        position: absolute;\n        width: functions.pxToRem(30);\n\n        line {\n            stroke: rgb(var(--color-white));\n            stroke-width: 2;\n        }\n    }\n\n    limel-icon,\n    .label,\n    limel-spinner,\n    svg {\n        transition: opacity 300ms ease-in-out;\n    }\n\n    &.loading {\n        limel-icon,\n        .label {\n            opacity: 0;\n        }\n        limel-spinner {\n            opacity: 1;\n            display: block;\n        }\n    }\n\n    &.just-loaded,\n    &.just-failed {\n        limel-icon,\n        .label {\n            opacity: 0;\n        }\n        svg {\n            opacity: 1;\n        }\n        limel-spinner {\n            display: block;\n            animation: fade-out-spinner 0.3s ease;\n        }\n    }\n\n    &.just-failed {\n        background-color: var(--lime-error-text-color) !important;\n        animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n    }\n}\n\n.mdc-button--outlined {\n    @include button.outline-color(primary);\n}\n\n@keyframes fade-out-spinner {\n    0% {\n        opacity: 1;\n        transform: scale(1);\n    }\n    100% {\n        opacity: 0;\n        transform: scale(1.5);\n    }\n}\n\n@keyframes shake {\n    10%,\n    90% {\n        transform: translate3d(#{functions.pxToRem(-1)}, 0, 0);\n    }\n\n    20%,\n    80% {\n        transform: translate3d(#{functions.pxToRem(2)}, 0, 0);\n    }\n\n    30%,\n    50%,\n    70% {\n        transform: translate3d(#{functions.pxToRem(-3)}, 0, 0);\n    }\n\n    40%,\n    60% {\n        transform: translate3d(#{functions.pxToRem(3)}, 0, 0);\n    }\n}\n\n@import './partial-styles/_has-reduced-presence';\n","import { Component, h, Prop, State, Watch, Element } from '@stencil/core';\nimport {\n    makeEnterClickable,\n    removeEnterClickable,\n} from '../../util/makeEnterClickable';\n\n/**\n * @exampleComponent limel-example-button-basic\n * @exampleComponent limel-example-button-primary\n * @exampleComponent limel-example-button-outlined\n * @exampleComponent limel-example-button-disabled\n * @exampleComponent limel-example-button-icon\n * @exampleComponent limel-example-button-loading\n * @exampleComponent limel-example-button-click-success\n * @exampleComponent limel-example-button-click-fail\n * @exampleComponent limel-example-button-reduce-presence\n * @exampleComponent limel-example-button-colors\n * @exampleComponent limel-example-button-composite\n */\n@Component({\n    tag: 'limel-button',\n    shadow: true,\n    styleUrl: 'button.scss',\n})\nexport class Button {\n    /**\n     * The text to show on the button.\n     */\n    @Prop({ reflect: true })\n    public label: string;\n\n    /**\n     * Set to `true` to make the button primary.\n     */\n    @Prop({ reflect: true })\n    public primary = false;\n\n    /**\n     * Set to `true` to make the button outlined.\n     */\n    @Prop({ reflect: true })\n    public outlined = false;\n\n    /**\n     * Set icon for the button\n     */\n    @Prop({ reflect: true })\n    public icon: string;\n\n    /**\n     * Set to `true` to disable the button.\n     */\n    @Prop({ reflect: true })\n    public disabled = false;\n\n    /**\n     * Set to `true` to put the button in the `loading` state.\n     * This also disables the button.\n     */\n    @Prop({ reflect: true })\n    public loading = false;\n\n    /**\n     * Set to `true` to indicate failure instead of success when the button is\n     * no longer in the `loading` state.\n     */\n    @Prop({ reflect: true })\n    public loadingFailed = false;\n\n    @State()\n    private justLoaded = false;\n\n    @Element()\n    private host: HTMLElement;\n\n    private justLoadedTimeout?: number;\n\n    public componentWillLoad() {\n        makeEnterClickable(this.host);\n    }\n\n    public disconnectedCallback() {\n        removeEnterClickable(this.host);\n    }\n\n    public render() {\n        return (\n            <button\n                class={{\n                    'mdc-button': true,\n                    loading: this.loading,\n                    'just-loaded': this.justLoaded && !this.loadingFailed,\n                    'just-failed': this.justLoaded && this.loadingFailed,\n                    'mdc-button--outlined': this.outlined,\n                }}\n                disabled={this.disabled || this.loading}\n            >\n                {this.renderIcon()}\n                <span class=\"label mdc-button__label\">{this.label}</span>\n                <limel-spinner limeBranded={false} />\n                <svg viewBox=\"0 0 30 30\">{this.renderLoadingIcons()}</svg>\n            </button>\n        );\n    }\n\n    @Watch('loading')\n    protected loadingWatcher(newValue: boolean, oldValue: boolean) {\n        if (oldValue && !newValue) {\n            this.justLoaded = true;\n            const TIMEOUT = 2000;\n            this.justLoadedTimeout = window.setTimeout(() => {\n                this.justLoaded = false;\n            }, TIMEOUT);\n        } else if (newValue) {\n            this.justLoaded = false;\n            window.clearTimeout(this.justLoadedTimeout);\n        }\n    }\n\n    private renderLoadingIcons() {\n        if (this.loadingFailed) {\n            return [\n                <line x1=\"9\" y1=\"9\" x2=\"21\" y2=\"21\"></line>,\n                <line x1=\"21\" y1=\"9\" x2=\"9\" y2=\"21\"></line>,\n            ];\n        }\n\n        return [\n            <line x1=\"8\" y1=\"14\" x2=\"15\" y2=\"20\"></line>,\n            <line x1=\"23\" y1=\"9\" x2=\"14\" y2=\"20\"></line>,\n        ];\n    }\n\n    private renderIcon(): HTMLElement {\n        if (!this.icon) {\n            return;\n        }\n\n        let withoutLabelClass = '';\n        if (!this.label) {\n            withoutLabelClass = 'no-label';\n        }\n\n        return (\n            <i class={`mdc-button__icon ${withoutLabelClass}`}>\n                <limel-icon name={this.icon} />\n            </i>\n        );\n    }\n}\n"],"mappings":"6FAAA,MAAMA,EAAY,gryB,MCwBLC,EAAM,M,2DAWE,M,cAMC,M,kCAYA,M,aAOD,M,mBAOM,M,gBAGF,K,CAOdC,oBACHC,EAAmBC,KAAKC,K,CAGrBC,uBACHC,EAAqBH,KAAKC,K,CAGvBG,SACH,OACIC,EAAA,UACIC,MAAO,CACH,aAAc,KACdC,QAASP,KAAKO,QACd,cAAeP,KAAKQ,aAAeR,KAAKS,cACxC,cAAeT,KAAKQ,YAAcR,KAAKS,cACvC,uBAAwBT,KAAKU,UAEjCC,SAAUX,KAAKW,UAAYX,KAAKO,SAE/BP,KAAKY,aACNP,EAAA,QAAMC,MAAM,2BAA2BN,KAAKa,OAC5CR,EAAA,iBAAeS,YAAa,QAC5BT,EAAA,OAAKU,QAAQ,aAAaf,KAAKgB,sB,CAMjCC,eAAeC,EAAmBC,GACxC,GAAIA,IAAaD,EAAU,CACvBlB,KAAKQ,WAAa,KAClB,MAAMY,EAAU,IAChBpB,KAAKqB,kBAAoBC,OAAOC,YAAW,KACvCvB,KAAKQ,WAAa,KAAK,GACxBY,E,MACA,GAAIF,EAAU,CACjBlB,KAAKQ,WAAa,MAClBc,OAAOE,aAAaxB,KAAKqB,kB,EAIzBL,qBACJ,GAAIhB,KAAKS,cAAe,CACpB,MAAO,CACHJ,EAAA,QAAMoB,GAAG,IAAIC,GAAG,IAAIC,GAAG,KAAKC,GAAG,OAC/BvB,EAAA,QAAMoB,GAAG,KAAKC,GAAG,IAAIC,GAAG,IAAIC,GAAG,O,CAIvC,MAAO,CACHvB,EAAA,QAAMoB,GAAG,IAAIC,GAAG,KAAKC,GAAG,KAAKC,GAAG,OAChCvB,EAAA,QAAMoB,GAAG,KAAKC,GAAG,IAAIC,GAAG,KAAKC,GAAG,O,CAIhChB,aACJ,IAAKZ,KAAK6B,KAAM,CACZ,M,CAGJ,IAAIC,EAAoB,GACxB,IAAK9B,KAAKa,MAAO,CACbiB,EAAoB,U,CAGxB,OACIzB,EAAA,KAAGC,MAAO,oBAAoBwB,KAC1BzB,EAAA,cAAY0B,KAAM/B,KAAK6B,O"}

package/dist/lime-elements/p-6f2fad3a.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["iconButtonCss","IconButton","connectedCallback","this","initialize","componentWillLoad","makeEnterClickable","host","disconnectedCallback","removeEnterClickable","componentDidLoad","element","shadowRoot","querySelector","render","buttonAttributes","hasAttribute","tabindex","getAttribute","h","Object","assign","class","disabled","label","title","name","icon","badge"],"sources":["./src/components/icon-button/icon-button.scss?tag=limel-icon-button&encapsulation=shadow","./src/components/icon-button/icon-button.tsx"],"sourcesContent":["@use '../../style/mixins';\n@use '../../style/functions';\n@use '@material/icon-button/styles';\n\n/**\n * @prop --icon-background-color: Background color of the button.\n */\n\n$height-of-limel-button: functions.pxToRem(36);\n\n:host([hidden]) {\n    display: none;\n}\n\n:host([disabled]) {\n    pointer-events: none;\n}\n\n.mdc-icon-button {\n    @include mixins.is-flat-clickable(\n        $background-color: var(--icon-background-color, transparent)\n    );\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n    height: $height-of-limel-button;\n    width: $height-of-limel-button;\n    padding: functions.pxToRem(2);\n    border-radius: 50%;\n\n    :host([elevated]) & {\n        &:not(:hover):not(:active):not(:focus-visible) {\n            box-shadow: var(--button-shadow-normal);\n        }\n    }\n\n    &:disabled {\n        color: var(--mdc-theme-text-disabled-on-background);\n    }\n\n    &:focus-visible {\n        // only when non-pointer input is being used,\n        // e.g. tabbed into using keyboard\n        box-shadow: var(--shadow-depth-8-focused);\n        border-radius: 50%;\n    }\n}\n\nlimel-icon {\n    width: functions.pxToRem(20);\n    height: functions.pxToRem(20);\n}\n","import { Component, Element, h, Prop } from '@stencil/core';\nimport {\n    makeEnterClickable,\n    removeEnterClickable,\n} from 'src/util/makeEnterClickable';\n\n/**\n * @exampleComponent limel-example-icon-button-basic\n * @exampleComponent limel-example-icon-button-disabled\n * @exampleComponent limel-example-icon-button-elevated\n * @exampleComponent limel-example-icon-button-toggle-state\n * @exampleComponent limel-example-icon-button-composite\n */\n@Component({\n    tag: 'limel-icon-button',\n    shadow: true,\n    styleUrl: 'icon-button.scss',\n})\nexport class IconButton {\n    /**\n     * The icon to display.\n     */\n    @Prop({ reflect: true })\n    public icon: string;\n\n    /**\n     * Set to `true` to give the button our standard \"elevated\" look, lifting\n     * it off the flat layout.\n     */\n    @Prop({ reflect: true })\n    public elevated = false;\n\n    /**\n     * The text to show to screenreaders and other assistive tech.\n     */\n    @Prop({ reflect: true })\n    public label: string;\n\n    /**\n     * Set to `true` to disable the button.\n     */\n    @Prop({ reflect: true })\n    public disabled = false;\n\n    @Element()\n    private host: HTMLLimelIconButtonElement;\n\n    public connectedCallback() {\n        this.initialize();\n    }\n\n    public componentWillLoad() {\n        makeEnterClickable(this.host);\n    }\n\n    public disconnectedCallback() {\n        removeEnterClickable(this.host);\n    }\n\n    public componentDidLoad() {\n        this.initialize();\n    }\n\n    private initialize() {\n        const element = this.host.shadowRoot.querySelector('.mdc-icon-button');\n        if (!element) {\n            return;\n        }\n    }\n\n    public render() {\n        const buttonAttributes: { tabindex?: string } = {};\n        if (this.host.hasAttribute('tabindex')) {\n            buttonAttributes.tabindex = this.host.getAttribute('tabindex');\n        }\n\n        return (\n            <button\n                class=\"mdc-icon-button\"\n                disabled={this.disabled}\n                aria-label={this.label}\n                title={this.label}\n                {...buttonAttributes}\n            >\n                <limel-icon name={this.icon} badge={true} />\n            </button>\n        );\n    }\n}\n"],"mappings":"6FAAA,MAAMA,EAAgB,s/L,MCkBTC,EAAU,M,2DAYD,M,mCAYA,K,CAKXC,oBACHC,KAAKC,Y,CAGFC,oBACHC,EAAmBH,KAAKI,K,CAGrBC,uBACHC,EAAqBN,KAAKI,K,CAGvBG,mBACHP,KAAKC,Y,CAGDA,aACJ,MAAMO,EAAUR,KAAKI,KAAKK,WAAWC,cAAc,oBACnD,IAAKF,EAAS,CACV,M,EAIDG,SACH,MAAMC,EAA0C,GAChD,GAAIZ,KAAKI,KAAKS,aAAa,YAAa,CACpCD,EAAiBE,SAAWd,KAAKI,KAAKW,aAAa,W,CAGvD,OACIC,EAAA,SAAAC,OAAAC,OAAA,CACIC,MAAM,kBACNC,SAAUpB,KAAKoB,SAAQ,aACXpB,KAAKqB,MACjBC,MAAOtB,KAAKqB,OACRT,GAEJI,EAAA,cAAYO,KAAMvB,KAAKwB,KAAMC,MAAO,O"}

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

@@ -1,2 +0,0 @@
-import{r as t,h as i,g as e}from"./p-3075aa67.js";import{c as s}from"./p-3ccdc4a3.js";const o=".trigger-anchor{position:relative}";const l=50;const n=class{constructor(i){t(this,i);this.showTooltip=()=>{const t=500;this.showTooltipTimeoutHandle=window.setTimeout((()=>{this.open=true}),t)};this.hideTooltip=()=>{clearTimeout(this.showTooltipTimeoutHandle);this.open=false};this.elementId=undefined;this.label=undefined;this.helperLabel=undefined;this.maxlength=l;this.open=undefined;this.portalId=s();this.tooltipId=s()}connectedCallback(){this.setOwnerAriaLabel();this.addListeners()}disconnectedCallback(){this.removeListeners()}render(){const t=getComputedStyle(this.host).getPropertyValue("--tooltip-z-index");return i("div",{class:"trigger-anchor"},i("limel-portal",{openDirection:"bottom-start",visible:this.open,containerId:this.portalId,containerStyle:{"z-index":t,"pointer-events":"none"}},i("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();t===null||t===void 0?void 0:t.setAttribute("aria-describedby",this.tooltipId)}addListeners(){const t=this.getOwnerElement();t===null||t===void 0?void 0:t.addEventListener("mouseover",this.showTooltip);t===null||t===void 0?void 0:t.addEventListener("mouseout",this.hideTooltip);t===null||t===void 0?void 0:t.addEventListener("click",this.hideTooltip)}removeListeners(){const t=this.getOwnerElement();t===null||t===void 0?void 0:t.removeEventListener("mouseover",this.showTooltip);t===null||t===void 0?void 0:t.removeEventListener("mouseout",this.hideTooltip);t===null||t===void 0?void 0:t.removeEventListener("click",this.hideTooltip)}getOwnerElement(){let t=this.host;do{t=t.parentNode}while(t&&t.nodeType!==Node.DOCUMENT_FRAGMENT_NODE&&t.nodeType!==Node.DOCUMENT_NODE);return t===null||t===void 0?void 0:t.getElementById(this.elementId)}get host(){return e(this)}};n.style=o;const a=":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)}}";const r=class{constructor(i){t(this,i);this.label=undefined;this.helperLabel=undefined;this.maxlength=undefined}render(){let t=false;if(this.helperLabel&&this.maxlength){t=this.label.length+this.helperLabel.length>this.maxlength}const e={};if(this.maxlength){e.style={"--tooltip-max-width-of-text":`${this.maxlength}`+"ch"}}return[i("text",Object.assign({class:{"has-column-layout":t}},e),i("div",{class:"label"},this.label),i("div",{class:"helper-label"},this.helperLabel))]}};r.style=a;export{n as limel_tooltip,r as limel_tooltip_content};
-//# sourceMappingURL=p-b3ff8fef.entry.js.map