@limetech/lime-elements 39.24.0 → 39.24.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +14 -0
- package/dist/cjs/{_assignValue-DpsLUlF4.js → _assignValue-DQh76m39.js} +2 -2
- package/dist/cjs/{_baseEach-C570gT5Y.js → _baseEach-Bygi-un6.js} +2 -2
- package/dist/cjs/{_baseIsEqual-aOPReRWl.js → _baseIsEqual-CQZKiKbe.js} +20 -365
- package/dist/cjs/{_baseIteratee-DggA4e7a.js → _baseIteratee-DDklwtn9.js} +6 -4
- package/dist/cjs/{_defineProperty-BDFOiqJL.js → _defineProperty-Csu6P9HT.js} +1 -1
- package/dist/cjs/{_getAllKeysIn-BQIV8aw7.js → _getAllKeysIn-BJsgUTAt.js} +5 -4
- package/dist/cjs/{_getNative-B4n5HX2B.js → _getNative-Cf52giNE.js} +2 -2
- package/dist/cjs/_getTag-BC28Za7d.js +355 -0
- package/dist/cjs/_isIndex-Bu45fvR7.js +27 -0
- package/dist/cjs/{_isIterateeCall-CPWXFS_s.js → _isIterateeCall-BUGt9SrH.js} +4 -3
- package/dist/cjs/{cloneDeep-CxFNKF1Y.js → cloneDeep-hE40Q8aw.js} +13 -12
- package/dist/cjs/{difference-Bfsq4sXB.js → difference-B543MGsY.js} +5 -4
- package/dist/cjs/eq-DFcUoVzv.js +39 -0
- package/dist/cjs/file-metadata-BrhOssGG.js +76 -0
- package/dist/cjs/{files-Cf615Ytp.js → files-Bt11HLi4.js} +1 -1
- package/dist/cjs/{focus-trigger-element-Brw8VubX.js → focus-trigger-element-BfnJmxKO.js} +1 -1
- package/dist/{esm/file-metadata-BwF9vTXN.js → cjs/icons-isR5V1X0.js} +4 -69
- package/dist/cjs/{isArrayLike-_dR1U5-Y.js → isArrayLike-C2RwZMG4.js} +2 -27
- package/dist/cjs/{isEmpty-EBCFxX1S.js → isEmpty-CCxl3bYc.js} +6 -6
- package/dist/cjs/{isEqual-bXyw7kXo.js → isEqual-Cd9J8a5-.js} +1 -1
- package/dist/cjs/{eq-B1KBAwmK.js → isFunction-RSHwsz1x.js} +0 -37
- package/dist/cjs/lime-elements.cjs.js +1 -1
- package/dist/cjs/{limel-breadcrumbs_7.cjs.entry.js → limel-breadcrumbs_8.cjs.entry.js} +74 -8
- package/dist/cjs/limel-chip-set.cjs.entry.js +578 -0
- package/dist/cjs/limel-chip_2.cjs.entry.js +33 -528
- package/dist/cjs/limel-dialog.cjs.entry.js +9 -6
- package/dist/cjs/limel-email-viewer.cjs.entry.js +15 -10
- package/dist/cjs/limel-file-dropzone_2.cjs.entry.js +12 -8
- package/dist/cjs/limel-file.cjs.entry.js +2 -1
- package/dist/cjs/limel-flatpickr-adapter.cjs.entry.js +5 -3
- package/dist/cjs/limel-form.cjs.entry.js +247 -71
- package/dist/cjs/limel-helper-line.cjs.entry.js +42 -0
- package/dist/cjs/limel-popover_2.cjs.entry.js +6 -5
- package/dist/cjs/limel-profile-picture.cjs.entry.js +3 -2
- package/dist/cjs/limel-prosemirror-adapter.cjs.entry.js +16 -12
- package/dist/cjs/limel-tab-bar.cjs.entry.js +11 -8
- package/dist/cjs/limel-table.cjs.entry.js +14 -11
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{pickBy-kLjYLoam.js → pickBy-D-X6S5kg.js} +5 -5
- package/dist/collection/components/chip-set/chip-set.js +14 -2
- package/dist/collection/components/email-viewer/email-viewer.css +12 -32
- package/dist/collection/components/email-viewer/email-viewer.js +16 -9
- package/dist/esm/{_assignValue-DOEO9byf.js → _assignValue-CEFvyZxO.js} +2 -2
- package/dist/esm/{_baseEach-C4UJIc96.js → _baseEach-lvj-g1Zj.js} +2 -2
- package/dist/esm/{_baseIsEqual-DCZXUzsZ.js → _baseIsEqual-B6bIeexY.js} +10 -346
- package/dist/esm/{_baseIteratee-CI-QZdpx.js → _baseIteratee-CEZRuq23.js} +4 -2
- package/dist/esm/{_defineProperty-yVdnnt__.js → _defineProperty-C69Btzid.js} +1 -1
- package/dist/esm/{_getAllKeysIn-v-KlW5r_.js → _getAllKeysIn-kT3KizYN.js} +3 -2
- package/dist/esm/{_getNative-aN4R8EiP.js → _getNative-COawFdVX.js} +1 -1
- package/dist/esm/_getTag-CMJL-6hk.js +344 -0
- package/dist/esm/_isIndex-B--C3qwe.js +25 -0
- package/dist/esm/{_isIterateeCall-CTcCv8Mb.js → _isIterateeCall-Bb4gUZLK.js} +3 -2
- package/dist/esm/{cloneDeep-V4fB8wfG.js → cloneDeep-CL7UD3mR.js} +4 -3
- package/dist/esm/{difference-CWrdq-hd.js → difference-DND5tWiA.js} +4 -3
- package/dist/esm/eq-CZ30nDJE.js +37 -0
- package/dist/esm/file-metadata-BHzkIH4g.js +71 -0
- package/dist/esm/{files-P324wLau.js → files-CZAZotms.js} +1 -1
- package/dist/esm/{focus-trigger-element-DubROLkE.js → focus-trigger-element-BOFcjLq3.js} +1 -1
- package/dist/{cjs/file-metadata-rQ0WzFlZ.js → esm/icons-Bu_YRgCL.js} +1 -75
- package/dist/esm/{isArrayLike-D1QkaJU2.js → isArrayLike-CyVGB489.js} +2 -26
- package/dist/esm/{isEmpty-BFxMjh_H.js → isEmpty-DHgukT5k.js} +2 -2
- package/dist/esm/{isEqual-CsrptmTU.js → isEqual-4tbMaaf_.js} +1 -1
- package/dist/esm/{eq-D7VMHFyO.js → isFunction-9zQTeQI8.js} +1 -37
- package/dist/esm/lime-elements.js +1 -1
- package/dist/esm/{limel-breadcrumbs_7.entry.js → limel-breadcrumbs_8.entry.js} +71 -6
- package/dist/esm/limel-chip-set.entry.js +576 -0
- package/dist/esm/limel-chip_2.entry.js +35 -530
- package/dist/esm/limel-dialog.entry.js +9 -6
- package/dist/esm/limel-email-viewer.entry.js +15 -10
- package/dist/esm/limel-file-dropzone_2.entry.js +12 -8
- package/dist/esm/limel-file.entry.js +2 -1
- package/dist/esm/limel-flatpickr-adapter.entry.js +5 -3
- package/dist/esm/limel-form.entry.js +237 -61
- package/dist/esm/limel-helper-line.entry.js +40 -0
- package/dist/esm/limel-popover_2.entry.js +6 -5
- package/dist/esm/limel-profile-picture.entry.js +3 -2
- package/dist/esm/limel-prosemirror-adapter.entry.js +16 -12
- package/dist/esm/limel-tab-bar.entry.js +11 -8
- package/dist/esm/limel-table.entry.js +14 -11
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{pickBy-D8CUtxE4.js → pickBy-C4C3CM4m.js} +4 -4
- package/dist/lime-elements/lime-elements.esm.js +1 -1
- package/dist/lime-elements/p-00b424d7.entry.js +1 -0
- package/dist/lime-elements/p-01651634.entry.js +1 -0
- package/dist/lime-elements/p-4ecd565b.entry.js +1 -0
- package/dist/lime-elements/p-5442e09e.entry.js +13 -0
- package/dist/lime-elements/p-56bkn1D-.js +1 -0
- package/dist/lime-elements/p-60327283.entry.js +1 -0
- package/dist/lime-elements/{p-cfe85e59.entry.js → p-6eaa9776.entry.js} +10 -10
- package/dist/lime-elements/p-72b9d03e.entry.js +1 -0
- package/dist/lime-elements/p-80162ba0.entry.js +1 -0
- package/dist/lime-elements/p-86ff06d1.entry.js +1 -0
- package/dist/lime-elements/p-9W8bTt2G.js +1 -0
- package/dist/lime-elements/p-B--C3qwe.js +1 -0
- package/dist/lime-elements/p-B8yl2MCT.js +1 -0
- package/dist/lime-elements/p-BAR6am-7.js +1 -0
- package/dist/lime-elements/p-BCq5M9TE.js +1 -0
- package/dist/lime-elements/p-BE1Efiuj.js +1 -0
- package/dist/lime-elements/p-BYfPV0O4.js +1 -0
- package/dist/lime-elements/p-BcJ-TDVt.js +1 -0
- package/dist/lime-elements/p-BsX7ma3n.js +1 -0
- package/dist/lime-elements/p-Bu_YRgCL.js +1 -0
- package/dist/lime-elements/p-ByzvFNMm.js +1 -0
- package/dist/lime-elements/{p-CWuGCKo1.js → p-C4caLnTg.js} +1 -1
- package/dist/lime-elements/p-CR7u-m0b.js +1 -0
- package/dist/lime-elements/p-CVzgpz9P.js +1 -0
- package/dist/lime-elements/p-CZ30nDJE.js +1 -0
- package/dist/lime-elements/{p-BvDmWgCs.js → p-D0F7gOYG.js} +1 -1
- package/dist/lime-elements/p-D4RdItCq.js +1 -0
- package/dist/lime-elements/p-D8H5afYg.js +1 -0
- package/dist/lime-elements/p-DbBZn7JO.js +1 -0
- package/dist/lime-elements/p-DtrvybFR.js +1 -0
- package/dist/lime-elements/{p-8139d26a.entry.js → p-a712087a.entry.js} +3 -3
- package/dist/lime-elements/p-b1645d2d.entry.js +1 -0
- package/dist/lime-elements/{p-e720f65c.entry.js → p-d00ec6c2.entry.js} +3 -3
- package/dist/lime-elements/{p-a416d439.entry.js → p-e5c7cac0.entry.js} +2 -2
- package/dist/lime-elements/p-f6e58e6c.entry.js +1 -0
- package/dist/lime-elements/p-f867b424.entry.js +1 -0
- package/dist/lime-elements/p-mmkVLOjW.js +1 -0
- package/dist/types/components/chip-set/chip-set.d.ts +5 -0
- package/dist/types/components/email-viewer/email-viewer.d.ts +0 -1
- package/package.json +1 -1
- package/dist/cjs/limel-helper-line_2.cjs.entry.js +0 -107
- package/dist/cjs/limel-linear-progress.cjs.entry.js +0 -59
- package/dist/esm/limel-helper-line_2.entry.js +0 -104
- package/dist/esm/limel-linear-progress.entry.js +0 -57
- package/dist/lime-elements/p-34d1d00a.entry.js +0 -1
- package/dist/lime-elements/p-48db87d3.entry.js +0 -1
- package/dist/lime-elements/p-4e9baf08.entry.js +0 -1
- package/dist/lime-elements/p-59f1460d.entry.js +0 -1
- package/dist/lime-elements/p-7uuv3HUP.js +0 -1
- package/dist/lime-elements/p-811c4820.entry.js +0 -1
- package/dist/lime-elements/p-9758568e.entry.js +0 -13
- package/dist/lime-elements/p-9a378cf0.entry.js +0 -1
- package/dist/lime-elements/p-BTHqaZIi.js +0 -1
- package/dist/lime-elements/p-Bj622DVt.js +0 -1
- package/dist/lime-elements/p-Bp0tNo1s.js +0 -1
- package/dist/lime-elements/p-C3Myy3mA.js +0 -1
- package/dist/lime-elements/p-CXgJVvTe.js +0 -1
- package/dist/lime-elements/p-CxfAgSVd.js +0 -1
- package/dist/lime-elements/p-DNIqLXTL.js +0 -1
- package/dist/lime-elements/p-D_uMnX5g.js +0 -1
- package/dist/lime-elements/p-DbC-smVQ.js +0 -1
- package/dist/lime-elements/p-DlJXKdhK.js +0 -1
- package/dist/lime-elements/p-DtS35Df5.js +0 -1
- package/dist/lime-elements/p-SvuA3Boo.js +0 -1
- package/dist/lime-elements/p-b306735b.entry.js +0 -1
- package/dist/lime-elements/p-c1c635c1.entry.js +0 -1
- package/dist/lime-elements/p-cebdd797.entry.js +0 -1
- package/dist/lime-elements/p-efBXH4mj.js +0 -1
- package/dist/lime-elements/p-f_1nwOC8.js +0 -1
- package/dist/lime-elements/p-fd4a4f87.entry.js +0 -1
- package/dist/lime-elements/p-v6b303K5.js +0 -1
|
@@ -1,23 +1,17 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-DBTJNfo7.js';
|
|
2
|
-
import { g as getRel
|
|
2
|
+
import { g as getRel } from './link-helper-5KsJICvh.js';
|
|
3
3
|
import { g as getIconName } from './get-icon-props-CgNJbSP4.js';
|
|
4
4
|
import { m as makeEnterClickable, r as removeEnterClickable } from './make-enter-clickable-BgTwPGeH.js';
|
|
5
5
|
import { t as translate } from './translations-Dv3YcsA7.js';
|
|
6
|
-
import { D as DELETE, B as BACKSPACE
|
|
7
|
-
import { i as isEmpty } from './isEmpty-
|
|
8
|
-
import
|
|
9
|
-
import { i as isEqual } from './isEqual-CsrptmTU.js';
|
|
10
|
-
import { M as MDCTextField } from './component-wGVqvUmL.js';
|
|
11
|
-
import './_baseIsEqual-DCZXUzsZ.js';
|
|
12
|
-
import './eq-D7VMHFyO.js';
|
|
6
|
+
import { D as DELETE, B as BACKSPACE } from './keycodes-rI0IeKpx.js';
|
|
7
|
+
import { i as isEmpty } from './isEmpty-DHgukT5k.js';
|
|
8
|
+
import './_getTag-CMJL-6hk.js';
|
|
13
9
|
import './isObject-BJQylLSL.js';
|
|
14
|
-
import './_getNative-aN4R8EiP.js';
|
|
15
|
-
import './isArray-B8VKuhvH.js';
|
|
16
10
|
import './isObjectLike-oiMYqRQ0.js';
|
|
17
|
-
import './isArrayLike-
|
|
18
|
-
import './
|
|
19
|
-
import './
|
|
20
|
-
import './
|
|
11
|
+
import './isArrayLike-CyVGB489.js';
|
|
12
|
+
import './isFunction-9zQTeQI8.js';
|
|
13
|
+
import './_getNative-COawFdVX.js';
|
|
14
|
+
import './isArray-B8VKuhvH.js';
|
|
21
15
|
|
|
22
16
|
const chipCss = () => `@charset "UTF-8";.text{transition:padding-left 0.4s ease}limel-linear-progress{position:absolute;z-index:1;margin:auto;left:0.25rem;width:1.25rem}:host(limel-chip[loading]) .chip:before{content:"";position:absolute;left:0;width:var(--limel-chip-height);height:var(--limel-chip-height);border-radius:50%;scale:0.9;background-color:rgba(var(--contrast-600), 0.8)}:host(limel-chip[loading]) .chip:not(:has(limel-icon)) .text{padding-left:calc(var(--limel-chip-height) + 0.25rem)}div[role=progressbar]{--limel-chip-progressbar-offset:0.1875rem;--limel-chip-progressbar-stripe-color:rgb(var(--contrast-100), 0.3);--limel-chip-progressbar-stripe-size:1.5rem;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:end;inset:var(--limel-chip-progressbar-offset);max-width:calc(100% - var(--limel-chip-progressbar-offset) * 2);border-radius:inherit;background-color:var(--chip-progress-color, rgb(var(--contrast-700)));width:var(--limel-chip-progress-percentage);opacity:0.8;mix-blend-mode:var(--limel-chip-progress-mix-blend-mode)}div[role=progressbar]:after{content:"";transform:translate3d(0, 0, 0);position:absolute;inset:1px;background-image:linear-gradient(-45deg, var(--limel-chip-progressbar-stripe-color) 25%, transparent 25%, transparent 50%, var(--limel-chip-progressbar-stripe-color) 50%, var(--limel-chip-progressbar-stripe-color) 75%, transparent 75%, transparent);z-index:1;background-size:var(--limel-chip-progressbar-stripe-size) var(--limel-chip-progressbar-stripe-size);animation:move 2.5s linear infinite;border-radius:inherit}@media (prefers-reduced-motion){div[role=progressbar]:after{animation:none}}@keyframes move{0%{background-position:0 0}100%{background-position:calc(var(--limel-chip-progressbar-stripe-size) * -1) calc(var(--limel-chip-progressbar-stripe-size) * -1)}}:host(limel-chip){--limel-chip-height:var(--limel-chip-size, 1.75rem);--limel-chip-gap:0.5rem;isolation:isolate;display:inline-flex;align-items:center;min-width:0;max-width:min(var(--chip-max-width, 100%), 25rem)}:host(limel-chip)::before{content:"";align-self:baseline;line-height:var(--limel-chip-height);font-size:var(--limel-theme-default-font-size, 0.875rem)}:host(limel-chip[size=small]){--limel-chip-height:1.5rem;--limel-chip-gap:0.25rem}:host(limel-chip[size=small]) .text{font-size:var(--limel-theme-default-small-font-size)}*{box-sizing:border-box}.chip{all:unset;position:relative;min-width:0;display:inline-flex;align-items:center;justify-content:center;gap:0.25rem;max-width:100%;height:var(--limel-chip-height);border-radius:var(--limel-chip-height);font-size:clamp(0.8125rem, var(--limel-chip-height) - 0.875rem, 1rem);padding:0 0.125rem}.chip:has(limel-icon) .text,.chip:has(img) .text{padding-left:0}.chip:not([disabled]):focus{outline:none}.chip:not([disabled]):focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.chip:not([disabled]){transition:color var(--limel-clickable-transition-speed, 0.4s) ease, background-color var(--limel-clickable-transition-speed, 0.4s) ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease, transform var(--limel-clickable-transform-speed, 0.4s) var(--limel-clickable-transform-timing-function, ease);cursor:pointer;color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal)}.chip:not([disabled]):hover,.chip:not([disabled]):focus,.chip:not([disabled]):focus-visible{will-change:color, background-color, box-shadow, transform}.chip:not([disabled]):hover,.chip:not([disabled]):focus-visible{transform:translate3d(0, 0.01rem, 0);color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color)}.chip:not([disabled]):hover{box-shadow:var(--button-shadow-hovered)}.chip:not([disabled]):active{--limel-clickable-transform-timing-function:cubic-bezier( 0.83, -0.15, 0.49, 1.16 );transform:translate3d(0, 0.05rem, 0);background-color:var(--limel-theme-surface-background-color);box-shadow:var(--button-shadow-inset-pressed)}.chip:not([disabled]):hover,.chip:not([disabled]):active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}.chip:has(limel-badge){padding-right:0.375rem}.chip:has(limel-badge) .text{padding-right:0}.chip:has(+.remove-button:hover){box-shadow:var(--shadow-depth-8-error)}.chip:has(+limel-menu),.chip:has(+.trailing-button){padding-right:calc(var(--limel-chip-height) + 0.125rem)}.chip:has(+limel-menu) .text,.chip:has(+.trailing-button) .text{padding-right:0}:host(limel-chip[disabled]:not([disabled=false])) .chip{color:rgba(var(--contrast-1600), 0.37);background-color:rgba(var(--contrast-1600), 0.1);box-shadow:none}:host(limel-chip[readonly]:not([readonly=false])) .chip{box-shadow:0 0 0 1px var(--chip-readonly-border-color, rgb(var(--contrast-800), 0.5))}:host(limel-chip[selected]:not([selected=false])) .chip{box-shadow:var(--button-shadow-inset)}:host(limel-chip[selected]:not([selected=false])) .chip:focus-visible{box-shadow:var(--button-shadow-inset), var(--shadow-depth-8-focused)}:host(limel-chip[selected]:not([selected=false])) .chip:active{box-shadow:var(--button-shadow-inset-pressed)}:host(limel-chip[selected]:not([selected=false])) .text{color:var(--lime-primary-color, var(--limel-theme-primary-color))}:host([aria-expanded=true]) .chip,:host([aria-expanded]:not([aria-expanded=false])) .chip{box-shadow:var(--button-shadow-inset-pressed) !important}:host(limel-chip[type=filter]) .chip{border-top-left-radius:0.5rem;border-bottom-left-radius:0.5rem}:host(limel-chip[type=filter]) .chip:after{content:"";transition:background-color 0.4s ease 0.2s, box-shadow 0.6s ease 0.2s;box-sizing:border-box;position:absolute;bottom:0.125rem;left:0.125rem;width:0.5rem;height:0.5rem;border-radius:50%;background-color:rgb(var(--contrast-800), 0.8);box-shadow:0 0 0 1px rgb(var(--color-white)) inset}:host(limel-chip[type=filter][selected]) .chip:after{background-color:rgb(var(--color-green-default));box-shadow:0 0 0.375rem 0 rgb(var(--color-green-light)), 0 0 0 1px rgb(var(--color-white)) inset}:host(limel-chip[invalid]) .chip{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%208%208'%20style='fill-rule:evenodd;'%3E%3Cpath%20fill='rgba(186,186,192,0.16)'%20d='M0%200h4v4H0zM4%204h4v4H4z'/%3E%3C/svg%3E");background-size:0.5rem;background-color:rgb(var(--color-red-default))}:host(limel-chip[invalid]) .text{color:rgb(var(--color-white))}img,limel-icon{flex-shrink:0;width:calc(var(--limel-chip-height) - 0.25rem);height:calc(var(--limel-chip-height) - 0.25rem)}img{object-fit:cover;border-radius:50%}limel-icon{padding:0.0625rem}limel-badge{pointer-events:none}.text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:1.2;padding:0 0.5rem;font-size:var(--limel-theme-default-font-size)}button.trailing-button{appearance:none;background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;text-align:inherit;transition:color var(--limel-clickable-transition-speed, 0.4s) ease, background-color var(--limel-clickable-transition-speed, 0.4s) ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease, transform var(--limel-clickable-transform-speed, 0.4s) var(--limel-clickable-transform-timing-function, ease);cursor:pointer;color:var(--limel-theme-on-surface-color);background-color:transparent}button.trailing-button:hover,button.trailing-button:focus,button.trailing-button:focus-visible{will-change:color, background-color, box-shadow, transform}button.trailing-button:hover,button.trailing-button:focus-visible{transform:translate3d(0, 0.01rem, 0);color:var(--limel-theme-on-surface-color);background-color:var(--lime-elevated-surface-background-color)}button.trailing-button:hover{box-shadow:var(--button-shadow-hovered)}button.trailing-button:active{--limel-clickable-transform-timing-function:cubic-bezier( 0.83, -0.15, 0.49, 1.16 );transform:translate3d(0, 0.05rem, 0);box-shadow:var(--button-shadow-pressed)}button.trailing-button:hover,button.trailing-button:active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}button.trailing-button{z-index:1;flex-shrink:0;display:flex;align-items:center;justify-content:center;margin-left:calc(var(--limel-chip-height) * -1 + 0.125rem);margin-right:0.125rem;width:calc(var(--limel-chip-height) - 0.25rem);height:calc(var(--limel-chip-height) - 0.25rem);border-radius:50%}button.trailing-button svg{transition:color 0.2s ease, transform 0.2s ease;width:1.25rem}button.trailing-button.remove-button:hover{color:rgb(var(--color-red-dark))}button.trailing-button.remove-button:hover svg{transform:scale(0.8)}limel-menu button[slot=trigger]:focus{outline:none}limel-menu button[slot=trigger]:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}limel-menu[open] button[slot=trigger]{box-shadow:var(--button-shadow-inset)}`;
|
|
23
17
|
|
|
@@ -228,546 +222,57 @@ const Chip = class {
|
|
|
228
222
|
};
|
|
229
223
|
Chip.style = chipCss();
|
|
230
224
|
|
|
231
|
-
|
|
232
|
-
* Key handler for the input field.
|
|
233
|
-
* Lets the user select, activate, and remove chips with the keyboard.
|
|
234
|
-
*
|
|
235
|
-
* @param event - event
|
|
236
|
-
|
|
237
|
-
*/
|
|
238
|
-
function handleKeyboardEvent(event) {
|
|
239
|
-
var _a;
|
|
240
|
-
if (this.textValue.length > 0) {
|
|
241
|
-
// If there is any text in the input field, keyboard input should
|
|
242
|
-
// navigate the text, not the chips.
|
|
243
|
-
return;
|
|
244
|
-
}
|
|
245
|
-
if (!((_a = this.value) === null || _a === void 0 ? void 0 : _a.length)) {
|
|
246
|
-
// If there are no chips, there is nothing to select.
|
|
247
|
-
return;
|
|
248
|
-
}
|
|
249
|
-
const isArrowLeft = event.key === ARROW_LEFT;
|
|
250
|
-
const isArrowRight = event.key === ARROW_RIGHT;
|
|
251
|
-
const isEnter = event.key === ENTER;
|
|
252
|
-
const isDelete = event.key === DELETE;
|
|
253
|
-
const isBackspace = event.key === BACKSPACE;
|
|
254
|
-
const isEscape = event.key === ESCAPE;
|
|
255
|
-
if (isArrowLeft) {
|
|
256
|
-
return handleLeft(this, event);
|
|
257
|
-
}
|
|
258
|
-
if (isArrowRight) {
|
|
259
|
-
return handleRight(this, event);
|
|
260
|
-
}
|
|
261
|
-
if (isEnter) {
|
|
262
|
-
return handleEnter(this, event);
|
|
263
|
-
}
|
|
264
|
-
if (isDelete) {
|
|
265
|
-
return handleDelete(this, event);
|
|
266
|
-
}
|
|
267
|
-
if (isBackspace) {
|
|
268
|
-
return handleBackspace(this, event);
|
|
269
|
-
}
|
|
270
|
-
if (isEscape) {
|
|
271
|
-
return handleEscape(this, event);
|
|
272
|
-
}
|
|
273
|
-
}
|
|
274
|
-
function handleLeft(host, event) {
|
|
275
|
-
event.preventDefault();
|
|
276
|
-
if (host.inputChipIndexSelected === null) {
|
|
277
|
-
host.inputChipIndexSelected = host.value.length - 1;
|
|
278
|
-
return;
|
|
279
|
-
}
|
|
280
|
-
if (host.inputChipIndexSelected <= 0) {
|
|
281
|
-
return;
|
|
282
|
-
}
|
|
283
|
-
host.inputChipIndexSelected -= 1;
|
|
284
|
-
}
|
|
285
|
-
function handleRight(host, event) {
|
|
286
|
-
event.preventDefault();
|
|
287
|
-
if (host.inputChipIndexSelected === null) {
|
|
288
|
-
host.inputChipIndexSelected = 0;
|
|
289
|
-
return;
|
|
290
|
-
}
|
|
291
|
-
if (host.inputChipIndexSelected >= host.value.length - 1) {
|
|
292
|
-
return;
|
|
293
|
-
}
|
|
294
|
-
host.inputChipIndexSelected += 1;
|
|
295
|
-
}
|
|
296
|
-
function handleEnter(host, event) {
|
|
297
|
-
if (host.inputChipIndexSelected !== null) {
|
|
298
|
-
event.preventDefault();
|
|
299
|
-
host.emitInteraction(host.value[host.inputChipIndexSelected]);
|
|
300
|
-
}
|
|
301
|
-
}
|
|
302
|
-
function handleEscape(host, event) {
|
|
303
|
-
if (host.inputChipIndexSelected !== null) {
|
|
304
|
-
event.preventDefault();
|
|
305
|
-
host.inputChipIndexSelected = null;
|
|
306
|
-
}
|
|
307
|
-
}
|
|
308
|
-
function handleDelete(host, event) {
|
|
309
|
-
if (host.inputChipIndexSelected !== null) {
|
|
310
|
-
event.preventDefault();
|
|
311
|
-
removeChip(host);
|
|
312
|
-
}
|
|
313
|
-
}
|
|
314
|
-
function handleBackspace(host, event) {
|
|
315
|
-
if (host.inputChipIndexSelected !== null) {
|
|
316
|
-
event.preventDefault();
|
|
317
|
-
removeChip(host);
|
|
318
|
-
}
|
|
319
|
-
else if (!event.repeat) {
|
|
320
|
-
host.inputChipIndexSelected = host.value.length - 1;
|
|
321
|
-
}
|
|
322
|
-
}
|
|
323
|
-
function removeChip(host) {
|
|
324
|
-
if (host.inputChipIndexSelected !== null) {
|
|
325
|
-
host.removeChip(host.value[host.inputChipIndexSelected].id);
|
|
326
|
-
host.inputChipIndexSelected = null;
|
|
327
|
-
}
|
|
328
|
-
}
|
|
329
|
-
|
|
330
|
-
const chipSetCss = () => `@charset "UTF-8";:host(limel-chip-set[readonly]) .mdc-text-field.disabled{pointer-events:auto}:host(limel-chip-set:focus),:host(limel-chip-set:focus-visible),:host(limel-chip-set:focus-within){--limel-h-l-grid-template-rows-transition-speed:0.46s;--limel-h-l-grid-template-rows:1fr}:host(limel-chip-set){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}:host(limel-chip-set:focus) limel-helper-line,:host(limel-chip-set:focus-visible) limel-helper-line,:host(limel-chip-set:focus-within) limel-helper-line,:host(limel-chip-set:hover) limel-helper-line{will-change:grid-template-rows}@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-text-field--filled{--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-text-field--filled .mdc-text-field__ripple::before,.mdc-text-field--filled .mdc-text-field__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.mdc-text-field--filled .mdc-text-field__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-text-field--filled .mdc-text-field__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-text-field--filled.mdc-ripple-upgraded .mdc-text-field__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-text-field--filled.mdc-ripple-upgraded .mdc-text-field__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-text-field--filled.mdc-ripple-upgraded--unbounded .mdc-text-field__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-text-field--filled.mdc-ripple-upgraded--foreground-activation .mdc-text-field__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-text-field--filled.mdc-ripple-upgraded--foreground-deactivation .mdc-text-field__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-text-field--filled .mdc-text-field__ripple::before,.mdc-text-field--filled .mdc-text-field__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-text-field--filled.mdc-ripple-upgraded .mdc-text-field__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-text-field__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-text-field{border-top-left-radius:4px;border-top-left-radius:var(--mdc-shape-small, 4px);border-top-right-radius:4px;border-top-right-radius:var(--mdc-shape-small, 4px);border-bottom-right-radius:0;border-bottom-left-radius:0}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-floating-label{color:rgba(0, 0, 0, 0.6)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input{color:rgba(0, 0, 0, 0.87)}@media all{.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:rgba(0, 0, 0, 0.54)}}@media all{.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:rgba(0, 0, 0, 0.54)}}.mdc-text-field .mdc-text-field__input{caret-color:#6200ee;caret-color:var(--mdc-theme-primary, #6200ee)}.mdc-text-field:not(.mdc-text-field--disabled)+.mdc-text-field-helper-line .mdc-text-field-helper-text{color:rgba(0, 0, 0, 0.6)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field-character-counter,.mdc-text-field:not(.mdc-text-field--disabled)+.mdc-text-field-helper-line .mdc-text-field-character-counter{color:rgba(0, 0, 0, 0.6)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__icon--leading{color:rgba(0, 0, 0, 0.54)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__icon--trailing{color:rgba(0, 0, 0, 0.54)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__affix--prefix{color:rgba(0, 0, 0, 0.6)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__affix--suffix{color:rgba(0, 0, 0, 0.6)}.mdc-text-field .mdc-floating-label{top:50%;transform:translateY(-50%);pointer-events:none}.mdc-text-field{display:inline-flex;align-items:baseline;padding:0 16px;position:relative;box-sizing:border-box;overflow:hidden;will-change:opacity, transform, color}.mdc-text-field__input{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-subtitle1-font-size, 1rem);font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:0.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform, inherit);height:28px;transition:opacity 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1);width:100%;min-width:0;border:none;border-radius:0;background:none;appearance:none;padding:0}.mdc-text-field__input::-ms-clear{display:none}.mdc-text-field__input::-webkit-calendar-picker-indicator{display:none}.mdc-text-field__input:focus{outline:none}.mdc-text-field__input:invalid{box-shadow:none}@media all{.mdc-text-field__input::placeholder{transition:opacity 67ms 0ms cubic-bezier(0.4, 0, 0.2, 1);opacity:0}}@media all{.mdc-text-field__input:-ms-input-placeholder{transition:opacity 67ms 0ms cubic-bezier(0.4, 0, 0.2, 1);opacity:0}}@media all{.mdc-text-field--no-label .mdc-text-field__input::placeholder,.mdc-text-field--focused .mdc-text-field__input::placeholder{transition-delay:40ms;transition-duration:110ms;opacity:1}}@media all{.mdc-text-field--no-label .mdc-text-field__input:-ms-input-placeholder,.mdc-text-field--focused .mdc-text-field__input:-ms-input-placeholder{transition-delay:40ms;transition-duration:110ms;opacity:1}}.mdc-text-field__affix{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-subtitle1-font-size, 1rem);font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:0.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform, inherit);height:28px;transition:opacity 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1);opacity:0;white-space:nowrap}.mdc-text-field--label-floating .mdc-text-field__affix,.mdc-text-field--no-label .mdc-text-field__affix{opacity:1}@supports (-webkit-hyphens: none){.mdc-text-field--outlined .mdc-text-field__affix{align-items:center;align-self:center;display:inline-flex;height:100%}}.mdc-text-field__affix--prefix{padding-left:0;padding-right:2px}[dir=rtl] .mdc-text-field__affix--prefix,.mdc-text-field__affix--prefix[dir=rtl]{padding-left:2px;padding-right:0;}.mdc-text-field--end-aligned .mdc-text-field__affix--prefix{padding-left:0;padding-right:12px}[dir=rtl] .mdc-text-field--end-aligned .mdc-text-field__affix--prefix,.mdc-text-field--end-aligned .mdc-text-field__affix--prefix[dir=rtl]{padding-left:12px;padding-right:0;}.mdc-text-field__affix--suffix{padding-left:12px;padding-right:0}[dir=rtl] .mdc-text-field__affix--suffix,.mdc-text-field__affix--suffix[dir=rtl]{padding-left:0;padding-right:12px;}.mdc-text-field--end-aligned .mdc-text-field__affix--suffix{padding-left:2px;padding-right:0}[dir=rtl] .mdc-text-field--end-aligned .mdc-text-field__affix--suffix,.mdc-text-field--end-aligned .mdc-text-field__affix--suffix[dir=rtl]{padding-left:0;padding-right:2px;}.mdc-text-field--filled .mdc-text-field__ripple::before,.mdc-text-field--filled .mdc-text-field__ripple::after{background-color:rgba(0, 0, 0, 0.87);background-color:var(--mdc-ripple-color, rgba(0, 0, 0, 0.87))}.mdc-text-field--filled:hover .mdc-text-field__ripple::before,.mdc-text-field--filled.mdc-ripple-surface--hover .mdc-text-field__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-text-field--filled.mdc-ripple-upgraded--background-focused .mdc-text-field__ripple::before,.mdc-text-field--filled:not(.mdc-ripple-upgraded):focus .mdc-text-field__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-text-field--filled{height:56px}.mdc-text-field--filled::before{display:inline-block;width:0;height:40px;content:"";vertical-align:0}.mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:rgb(244.8, 244.8, 244.8)}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple::before{border-bottom-color:rgba(0, 0, 0, 0.42)}.mdc-text-field--filled:not(.mdc-text-field--disabled):hover .mdc-line-ripple::before{border-bottom-color:rgba(0, 0, 0, 0.87)}.mdc-text-field--filled .mdc-line-ripple::after{border-bottom-color:#6200ee;border-bottom-color:var(--mdc-theme-primary, #6200ee)}.mdc-text-field--filled .mdc-floating-label{left:16px;right:initial}[dir=rtl] .mdc-text-field--filled .mdc-floating-label,.mdc-text-field--filled .mdc-floating-label[dir=rtl]{left:initial;right:16px;}.mdc-text-field--filled .mdc-floating-label--float-above{transform:translateY(-106%) scale(0.75)}.mdc-text-field--filled.mdc-text-field--no-label .mdc-text-field__input{height:100%}.mdc-text-field--filled.mdc-text-field--no-label .mdc-floating-label{display:none}.mdc-text-field--filled.mdc-text-field--no-label::before{display:none}@supports (-webkit-hyphens: none){.mdc-text-field--filled.mdc-text-field--no-label .mdc-text-field__affix{align-items:center;align-self:center;display:inline-flex;height:100%}}.mdc-text-field--outlined .mdc-floating-label--float-above{transform:translateY(-37.25px) scale(1)}.mdc-text-field--outlined .mdc-floating-label--float-above{font-size:0.75rem}.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{transform:translateY(-34.75px) scale(0.75)}.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:1rem}.mdc-text-field--outlined .mdc-floating-label--shake{animation:mdc-floating-label-shake-float-above-text-field-outlined 250ms 1}@keyframes mdc-floating-label-shake-float-above-text-field-outlined{0%{transform:translateX(calc(0 - 0%)) translateY(-34.75px) scale(0.75)}33%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(calc(4% - 0%)) translateY(-34.75px) scale(0.75)}66%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(calc(-4% - 0%)) translateY(-34.75px) scale(0.75)}100%{transform:translateX(calc(0 - 0%)) translateY(-34.75px) scale(0.75)}}.mdc-text-field--outlined{height:56px}.mdc-text-field--outlined .mdc-text-field__input{height:100%}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__leading,.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__notch,.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__trailing{border-color:rgba(0, 0, 0, 0.38)}.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading,.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch,.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:rgba(0, 0, 0, 0.87)}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__leading,.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__notch,.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#6200ee;border-color:var(--mdc-theme-primary, #6200ee)}.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__leading{border-top-left-radius:4px;border-top-left-radius:var(--mdc-shape-small, 4px);border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:4px;border-bottom-left-radius:var(--mdc-shape-small, 4px)}[dir=rtl] .mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__leading,.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__leading[dir=rtl]{border-top-left-radius:0;border-top-right-radius:4px;border-top-right-radius:var(--mdc-shape-small, 4px);border-bottom-right-radius:4px;border-bottom-right-radius:var(--mdc-shape-small, 4px);border-bottom-left-radius:0;}@supports (top: max(0%)){.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__leading{width:max(12px, var(--mdc-shape-small, 4px))}}@supports (top: max(0%)){.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__notch{max-width:calc(100% - max(12px, var(--mdc-shape-small, 4px)) * 2)}}.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__trailing{border-top-left-radius:0;border-top-right-radius:4px;border-top-right-radius:var(--mdc-shape-small, 4px);border-bottom-right-radius:4px;border-bottom-right-radius:var(--mdc-shape-small, 4px);border-bottom-left-radius:0}[dir=rtl] .mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__trailing,.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__trailing[dir=rtl]{border-top-left-radius:4px;border-top-left-radius:var(--mdc-shape-small, 4px);border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:4px;border-bottom-left-radius:var(--mdc-shape-small, 4px);}@supports (top: max(0%)){.mdc-text-field--outlined{padding-left:max(16px, calc(var(--mdc-shape-small, 4px) + 4px))}}@supports (top: max(0%)){.mdc-text-field--outlined{padding-right:max(16px, var(--mdc-shape-small, 4px))}}@supports (top: max(0%)){.mdc-text-field--outlined+.mdc-text-field-helper-line{padding-left:max(16px, calc(var(--mdc-shape-small, 4px) + 4px))}}@supports (top: max(0%)){.mdc-text-field--outlined+.mdc-text-field-helper-line{padding-right:max(16px, var(--mdc-shape-small, 4px))}}.mdc-text-field--outlined.mdc-text-field--with-leading-icon{padding-left:0}@supports (top: max(0%)){.mdc-text-field--outlined.mdc-text-field--with-leading-icon{padding-right:max(16px, var(--mdc-shape-small, 4px))}}[dir=rtl] .mdc-text-field--outlined.mdc-text-field--with-leading-icon,.mdc-text-field--outlined.mdc-text-field--with-leading-icon[dir=rtl]{}@supports (top: max(0%)){[dir=rtl] .mdc-text-field--outlined.mdc-text-field--with-leading-icon,.mdc-text-field--outlined.mdc-text-field--with-leading-icon[dir=rtl]{padding-left:max(16px, var(--mdc-shape-small, 4px))}}[dir=rtl] .mdc-text-field--outlined.mdc-text-field--with-leading-icon,.mdc-text-field--outlined.mdc-text-field--with-leading-icon[dir=rtl]{padding-right:0;}@supports (top: max(0%)){.mdc-text-field--outlined.mdc-text-field--with-trailing-icon{padding-left:max(16px, calc(var(--mdc-shape-small, 4px) + 4px))}}.mdc-text-field--outlined.mdc-text-field--with-trailing-icon{padding-right:0}[dir=rtl] .mdc-text-field--outlined.mdc-text-field--with-trailing-icon,.mdc-text-field--outlined.mdc-text-field--with-trailing-icon[dir=rtl]{padding-left:0}@supports (top: max(0%)){[dir=rtl] .mdc-text-field--outlined.mdc-text-field--with-trailing-icon,.mdc-text-field--outlined.mdc-text-field--with-trailing-icon[dir=rtl]{padding-right:max(16px, calc(var(--mdc-shape-small, 4px) + 4px))}}[dir=rtl] .mdc-text-field--outlined.mdc-text-field--with-trailing-icon,.mdc-text-field--outlined.mdc-text-field--with-trailing-icon[dir=rtl]{}.mdc-text-field--outlined.mdc-text-field--with-leading-icon.mdc-text-field--with-trailing-icon{padding-left:0;padding-right:0}.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:1px}.mdc-text-field--outlined .mdc-text-field__ripple::before,.mdc-text-field--outlined .mdc-text-field__ripple::after{content:none}.mdc-text-field--outlined .mdc-floating-label{left:4px;right:initial}[dir=rtl] .mdc-text-field--outlined .mdc-floating-label,.mdc-text-field--outlined .mdc-floating-label[dir=rtl]{left:initial;right:4px;}.mdc-text-field--outlined{overflow:visible}.mdc-text-field--outlined .mdc-text-field__input{display:flex;border:none !important;background-color:transparent}.mdc-text-field--outlined .mdc-notched-outline{z-index:1}.mdc-text-field--textarea .mdc-floating-label{top:19px}.mdc-text-field--textarea .mdc-floating-label:not(.mdc-floating-label--float-above){transform:none}.mdc-text-field--textarea{flex-direction:column;align-items:center;width:auto;height:auto;padding:0;transition:none}.mdc-text-field--textarea .mdc-text-field__input{flex-grow:1;height:auto;min-height:1.5rem;overflow-x:hidden;overflow-y:auto;box-sizing:border-box;resize:none;padding:0 16px;line-height:1.5rem}.mdc-text-field--textarea.mdc-text-field--filled::before{display:none}.mdc-text-field--textarea.mdc-text-field--filled .mdc-floating-label--float-above{transform:translateY(-10.25px) scale(0.75)}.mdc-text-field--textarea.mdc-text-field--filled .mdc-floating-label--shake{animation:mdc-floating-label-shake-float-above-textarea-filled 250ms 1}@keyframes mdc-floating-label-shake-float-above-textarea-filled{0%{transform:translateX(calc(0 - 0%)) translateY(-10.25px) scale(0.75)}33%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(calc(4% - 0%)) translateY(-10.25px) scale(0.75)}66%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(calc(-4% - 0%)) translateY(-10.25px) scale(0.75)}100%{transform:translateX(calc(0 - 0%)) translateY(-10.25px) scale(0.75)}}.mdc-text-field--textarea.mdc-text-field--filled .mdc-text-field__input{margin-top:23px;margin-bottom:9px}.mdc-text-field--textarea.mdc-text-field--filled.mdc-text-field--no-label .mdc-text-field__input{margin-top:16px;margin-bottom:16px}.mdc-text-field--textarea.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:0}.mdc-text-field--textarea.mdc-text-field--outlined .mdc-floating-label--float-above{transform:translateY(-27.25px) scale(1)}.mdc-text-field--textarea.mdc-text-field--outlined .mdc-floating-label--float-above{font-size:0.75rem}.mdc-text-field--textarea.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--textarea.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{transform:translateY(-24.75px) scale(0.75)}.mdc-text-field--textarea.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--textarea.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:1rem}.mdc-text-field--textarea.mdc-text-field--outlined .mdc-floating-label--shake{animation:mdc-floating-label-shake-float-above-textarea-outlined 250ms 1}@keyframes mdc-floating-label-shake-float-above-textarea-outlined{0%{transform:translateX(calc(0 - 0%)) translateY(-24.75px) scale(0.75)}33%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(calc(4% - 0%)) translateY(-24.75px) scale(0.75)}66%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(calc(-4% - 0%)) translateY(-24.75px) scale(0.75)}100%{transform:translateX(calc(0 - 0%)) translateY(-24.75px) scale(0.75)}}.mdc-text-field--textarea.mdc-text-field--outlined .mdc-text-field__input{margin-top:16px;margin-bottom:16px}.mdc-text-field--textarea.mdc-text-field--outlined .mdc-floating-label{top:18px}.mdc-text-field--textarea.mdc-text-field--with-internal-counter .mdc-text-field__input{margin-bottom:2px}.mdc-text-field--textarea.mdc-text-field--with-internal-counter .mdc-text-field-character-counter::after{display:inline-block;width:0;height:16px;content:"";vertical-align:-16px}.mdc-text-field--textarea.mdc-text-field--with-internal-counter .mdc-text-field-character-counter{align-self:flex-end;padding:0 16px}.mdc-text-field--textarea.mdc-text-field--with-internal-counter .mdc-text-field-character-counter::before{display:none}.mdc-text-field__resizer{align-self:stretch;display:inline-flex;flex-direction:column;flex-grow:1;max-height:100%;max-width:100%;min-height:56px;min-width:fit-content;min-width:-moz-available;min-width:-webkit-fill-available;overflow:hidden;resize:both}.mdc-text-field--filled .mdc-text-field__resizer{transform:translateY(-1px)}.mdc-text-field--filled .mdc-text-field__resizer .mdc-text-field__input,.mdc-text-field--filled .mdc-text-field__resizer .mdc-text-field-character-counter{transform:translateY(1px)}.mdc-text-field--outlined .mdc-text-field__resizer{transform:translateX(-1px) translateY(-1px)}[dir=rtl] .mdc-text-field--outlined .mdc-text-field__resizer,.mdc-text-field--outlined .mdc-text-field__resizer[dir=rtl]{transform:translateX(1px) translateY(-1px);}.mdc-text-field--outlined .mdc-text-field__resizer .mdc-text-field__input,.mdc-text-field--outlined .mdc-text-field__resizer .mdc-text-field-character-counter{transform:translateX(1px) translateY(1px)}[dir=rtl] .mdc-text-field--outlined .mdc-text-field__resizer .mdc-text-field__input,[dir=rtl] .mdc-text-field--outlined .mdc-text-field__resizer .mdc-text-field-character-counter,.mdc-text-field--outlined .mdc-text-field__resizer .mdc-text-field__input[dir=rtl],.mdc-text-field--outlined .mdc-text-field__resizer .mdc-text-field-character-counter[dir=rtl]{transform:translateX(-1px) translateY(1px);}.mdc-text-field--with-leading-icon{padding-left:0;padding-right:16px}[dir=rtl] .mdc-text-field--with-leading-icon,.mdc-text-field--with-leading-icon[dir=rtl]{padding-left:16px;padding-right:0;}.mdc-text-field--with-leading-icon.mdc-text-field--filled .mdc-floating-label{max-width:calc(100% - 48px);left:48px;right:initial}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--filled .mdc-floating-label,.mdc-text-field--with-leading-icon.mdc-text-field--filled .mdc-floating-label[dir=rtl]{left:initial;right:48px;}.mdc-text-field--with-leading-icon.mdc-text-field--filled .mdc-floating-label--float-above{max-width:calc(100% / 0.75 - 64px / 0.75)}.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label{left:36px;right:initial}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label,.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label[dir=rtl]{left:initial;right:36px;}.mdc-text-field--with-leading-icon.mdc-text-field--outlined :not(.mdc-notched-outline--notched) .mdc-notched-outline__notch{max-width:calc(100% - 60px)}.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above{transform:translateY(-37.25px) translateX(-32px) scale(1)}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above,.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above[dir=rtl]{transform:translateY(-37.25px) translateX(32px) scale(1);}.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above{font-size:0.75rem}.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{transform:translateY(-34.75px) translateX(-32px) scale(0.75)}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above[dir=rtl],.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above[dir=rtl]{transform:translateY(-34.75px) translateX(32px) scale(0.75);}.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:1rem}.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--shake{animation:mdc-floating-label-shake-float-above-text-field-outlined-leading-icon 250ms 1}@keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon{0%{transform:translateX(calc(0 - 32px)) translateY(-34.75px) scale(0.75)}33%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(calc(4% - 32px)) translateY(-34.75px) scale(0.75)}66%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(calc(-4% - 32px)) translateY(-34.75px) scale(0.75)}100%{transform:translateX(calc(0 - 32px)) translateY(-34.75px) scale(0.75)}}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined,.mdc-text-field--with-leading-icon.mdc-text-field--outlined[dir=rtl]{}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--shake,.mdc-text-field--with-leading-icon.mdc-text-field--outlined[dir=rtl] .mdc-floating-label--shake{animation:mdc-floating-label-shake-float-above-text-field-outlined-leading-icon 250ms 1}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined,.mdc-text-field--with-leading-icon.mdc-text-field--outlined[dir=rtl]{}@keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl{0%{transform:translateX(calc(0 - -32px)) translateY(-34.75px) scale(0.75)}33%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(calc(4% - -32px)) translateY(-34.75px) scale(0.75)}66%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(calc(-4% - -32px)) translateY(-34.75px) scale(0.75)}100%{transform:translateX(calc(0 - -32px)) translateY(-34.75px) scale(0.75)}}.mdc-text-field--with-trailing-icon{padding-left:16px;padding-right:0}[dir=rtl] .mdc-text-field--with-trailing-icon,.mdc-text-field--with-trailing-icon[dir=rtl]{padding-left:0;padding-right:16px;}.mdc-text-field--with-trailing-icon.mdc-text-field--filled .mdc-floating-label{max-width:calc(100% - 64px)}.mdc-text-field--with-trailing-icon.mdc-text-field--filled .mdc-floating-label--float-above{max-width:calc(100% / 0.75 - 64px / 0.75)}.mdc-text-field--with-trailing-icon.mdc-text-field--outlined :not(.mdc-notched-outline--notched) .mdc-notched-outline__notch{max-width:calc(100% - 60px)}.mdc-text-field--with-leading-icon.mdc-text-field--with-trailing-icon{padding-left:0;padding-right:0}.mdc-text-field--with-leading-icon.mdc-text-field--with-trailing-icon.mdc-text-field--filled .mdc-floating-label{max-width:calc(100% - 96px)}.mdc-text-field--with-leading-icon.mdc-text-field--with-trailing-icon.mdc-text-field--filled .mdc-floating-label--float-above{max-width:calc(100% / 0.75 - 96px / 0.75)}.mdc-text-field-helper-line{display:flex;justify-content:space-between;box-sizing:border-box}.mdc-text-field+.mdc-text-field-helper-line{padding-right:16px;padding-left:16px}.mdc-form-field>.mdc-text-field+label{align-self:flex-start}.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-floating-label{color:rgba(98, 0, 238, 0.87)}.mdc-text-field--focused .mdc-notched-outline__leading,.mdc-text-field--focused .mdc-notched-outline__notch,.mdc-text-field--focused .mdc-notched-outline__trailing{border-width:2px}.mdc-text-field--focused+.mdc-text-field-helper-line .mdc-text-field-helper-text:not(.mdc-text-field-helper-text--validation-msg){opacity:1}.mdc-text-field--focused.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:2px}.mdc-text-field--focused.mdc-text-field--outlined.mdc-text-field--textarea .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:0}.mdc-text-field--invalid:not(.mdc-text-field--disabled):hover .mdc-line-ripple::before{border-bottom-color:#b00020;border-bottom-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::after{border-bottom-color:#b00020;border-bottom-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-floating-label{color:#b00020;color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--invalid+.mdc-text-field-helper-line .mdc-text-field-helper-text--validation-msg{color:#b00020;color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid .mdc-text-field__input{caret-color:#b00020;caret-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__icon--trailing{color:#b00020;color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::before{border-bottom-color:#b00020;border-bottom-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__leading,.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__notch,.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__trailing{border-color:#b00020;border-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading,.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch,.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:#b00020;border-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__leading,.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__notch,.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#b00020;border-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid+.mdc-text-field-helper-line .mdc-text-field-helper-text--validation-msg{opacity:1}.mdc-text-field--disabled .mdc-text-field__input{color:rgba(0, 0, 0, 0.38)}@media all{.mdc-text-field--disabled .mdc-text-field__input::placeholder{color:rgba(0, 0, 0, 0.38)}}@media all{.mdc-text-field--disabled .mdc-text-field__input:-ms-input-placeholder{color:rgba(0, 0, 0, 0.38)}}.mdc-text-field--disabled .mdc-floating-label{color:rgba(0, 0, 0, 0.38)}.mdc-text-field--disabled+.mdc-text-field-helper-line .mdc-text-field-helper-text{color:rgba(0, 0, 0, 0.38)}.mdc-text-field--disabled .mdc-text-field-character-counter,.mdc-text-field--disabled+.mdc-text-field-helper-line .mdc-text-field-character-counter{color:rgba(0, 0, 0, 0.38)}.mdc-text-field--disabled .mdc-text-field__icon--leading{color:rgba(0, 0, 0, 0.3)}.mdc-text-field--disabled .mdc-text-field__icon--trailing{color:rgba(0, 0, 0, 0.3)}.mdc-text-field--disabled .mdc-text-field__affix--prefix{color:rgba(0, 0, 0, 0.38)}.mdc-text-field--disabled .mdc-text-field__affix--suffix{color:rgba(0, 0, 0, 0.38)}.mdc-text-field--disabled .mdc-line-ripple::before{border-bottom-color:rgba(0, 0, 0, 0.06)}.mdc-text-field--disabled .mdc-notched-outline__leading,.mdc-text-field--disabled .mdc-notched-outline__notch,.mdc-text-field--disabled .mdc-notched-outline__trailing{border-color:rgba(0, 0, 0, 0.06)}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled .mdc-text-field__input::placeholder{color:GrayText}}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled .mdc-text-field__input:-ms-input-placeholder{color:GrayText}.mdc-text-field--disabled .mdc-floating-label{color:GrayText}.mdc-text-field--disabled+.mdc-text-field-helper-line .mdc-text-field-helper-text{color:GrayText}.mdc-text-field--disabled .mdc-text-field-character-counter,.mdc-text-field--disabled+.mdc-text-field-helper-line .mdc-text-field-character-counter{color:GrayText}.mdc-text-field--disabled .mdc-text-field__icon--leading{color:GrayText}.mdc-text-field--disabled .mdc-text-field__icon--trailing{color:GrayText}.mdc-text-field--disabled .mdc-text-field__affix--prefix{color:GrayText}.mdc-text-field--disabled .mdc-text-field__affix--suffix{color:GrayText}.mdc-text-field--disabled .mdc-line-ripple::before{border-bottom-color:GrayText}.mdc-text-field--disabled .mdc-notched-outline__leading,.mdc-text-field--disabled .mdc-notched-outline__notch,.mdc-text-field--disabled .mdc-notched-outline__trailing{border-color:GrayText}}@media screen and (forced-colors: active){.mdc-text-field--disabled .mdc-text-field__input{background-color:Window}.mdc-text-field--disabled .mdc-floating-label{z-index:1}}.mdc-text-field--disabled{pointer-events:none}.mdc-text-field--disabled .mdc-floating-label{cursor:default}.mdc-text-field--disabled.mdc-text-field--filled{background-color:rgb(249.9, 249.9, 249.9)}.mdc-text-field--disabled.mdc-text-field--filled .mdc-text-field__ripple{display:none}.mdc-text-field--disabled .mdc-text-field__input{pointer-events:auto}.mdc-text-field--end-aligned .mdc-text-field__input{text-align:right}[dir=rtl] .mdc-text-field--end-aligned .mdc-text-field__input,.mdc-text-field--end-aligned .mdc-text-field__input[dir=rtl]{text-align:left;}[dir=rtl] .mdc-text-field--ltr-text,.mdc-text-field--ltr-text[dir=rtl]{}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__input,[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__affix,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__input,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__affix{direction:ltr}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__affix--prefix,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__affix--prefix{padding-left:0;padding-right:2px}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__affix--suffix,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__affix--suffix{padding-left:12px;padding-right:0}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__icon--leading,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__icon--leading{order:1}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__affix--suffix,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__affix--suffix{order:2}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__input,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__input{order:3}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__affix--prefix,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__affix--prefix{order:4}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__icon--trailing,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__icon--trailing{order:5}[dir=rtl] .mdc-text-field--ltr-text,.mdc-text-field--ltr-text[dir=rtl]{}[dir=rtl] .mdc-text-field--ltr-text.mdc-text-field--end-aligned,.mdc-text-field--ltr-text.mdc-text-field--end-aligned[dir=rtl]{}[dir=rtl] .mdc-text-field--ltr-text.mdc-text-field--end-aligned .mdc-text-field__input,.mdc-text-field--ltr-text.mdc-text-field--end-aligned[dir=rtl] .mdc-text-field__input{text-align:right}[dir=rtl] .mdc-text-field--ltr-text.mdc-text-field--end-aligned .mdc-text-field__affix--prefix,.mdc-text-field--ltr-text.mdc-text-field--end-aligned[dir=rtl] .mdc-text-field__affix--prefix{padding-right:12px}[dir=rtl] .mdc-text-field--ltr-text.mdc-text-field--end-aligned .mdc-text-field__affix--suffix,.mdc-text-field--ltr-text.mdc-text-field--end-aligned[dir=rtl] .mdc-text-field__affix--suffix{padding-left:2px}[dir=rtl] .mdc-text-field--ltr-text.mdc-text-field--end-aligned,.mdc-text-field--ltr-text.mdc-text-field--end-aligned[dir=rtl]{}.mdc-text-field-helper-text{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.75rem;font-size:var(--mdc-typography-caption-font-size, 0.75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:0.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, 0.0333333333em);text-decoration:inherit;text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform, inherit);display:block}.mdc-text-field-helper-text::before{display:inline-block;width:0;height:16px;content:"";vertical-align:0}.mdc-text-field-helper-text{margin-top:0;line-height:normal;margin:0;opacity:0;will-change:opacity;transition:opacity 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-text-field-helper-text--persistent{transition:none;opacity:1;will-change:initial}.mdc-text-field-character-counter{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.75rem;font-size:var(--mdc-typography-caption-font-size, 0.75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:0.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, 0.0333333333em);text-decoration:inherit;text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform, inherit);display:block}.mdc-text-field-character-counter::before{display:inline-block;width:0;height:16px;content:"";vertical-align:0}.mdc-text-field-character-counter{margin-top:0;line-height:normal;margin-left:auto;margin-right:0}[dir=rtl] .mdc-text-field-character-counter,.mdc-text-field-character-counter[dir=rtl]{margin-left:0;margin-right:auto;}.mdc-text-field-character-counter{padding-left:16px;padding-right:0}[dir=rtl] .mdc-text-field-character-counter,.mdc-text-field-character-counter[dir=rtl]{padding-left:0;padding-right:16px;}.mdc-text-field-character-counter{white-space:nowrap}.mdc-text-field__icon{align-self:center;cursor:pointer}.mdc-text-field__icon:not([tabindex]),.mdc-text-field__icon[tabindex="-1"]{cursor:default;pointer-events:none}.mdc-text-field__icon svg{display:block}.mdc-text-field__icon--leading{margin-left:16px;margin-right:8px}[dir=rtl] .mdc-text-field__icon--leading,.mdc-text-field__icon--leading[dir=rtl]{margin-left:8px;margin-right:16px;}.mdc-text-field__icon--trailing{padding:12px;margin-left:0px;margin-right:0px}[dir=rtl] .mdc-text-field__icon--trailing,.mdc-text-field__icon--trailing[dir=rtl]{margin-left:0px;margin-right:0px;}.mdc-text-field__icon{align-self:center;cursor:pointer}.mdc-text-field__icon:not([tabindex]),.mdc-text-field__icon[tabindex="-1"]{cursor:default;pointer-events:none}.mdc-text-field__icon svg{display:block}.mdc-text-field__icon--leading{margin-left:16px;margin-right:8px}[dir=rtl] .mdc-text-field__icon--leading,.mdc-text-field__icon--leading[dir=rtl]{margin-left:8px;margin-right:16px;}.mdc-text-field__icon--trailing{padding:12px;margin-left:0px;margin-right:0px}[dir=rtl] .mdc-text-field__icon--trailing,.mdc-text-field__icon--trailing[dir=rtl]{margin-left:0px;margin-right:0px;}.mdc-text-field__icon{display:flex;align-items:center;justify-content:center;color:rgb(var(--contrast-900))}.mdc-text-field__icon limel-icon{width:1.5rem;height:1.5rem}:host(limel-chip-set){isolation:isolate}:host(limel-chip-set[type=input]) limel-notched-outline [slot=content]{min-height:2.5rem}:host(limel-chip-set[type=input]) limel-chip:only-of-type{--chip-max-width:auto}:host(limel-chip-set:not([type=input])) .limel-notched-outline{--limel-notched-outline-border-color:transparent;--limel-notched-outline-background-color:transparent}.mdc-chip-set{display:flex;flex-wrap:wrap;align-items:center;gap:0.5rem;min-height:2.5rem;position:relative}.mdc-chip-set.mdc-chip-set--input{padding:0.4rem 0.5rem;width:100%}.mdc-chip-set.has-clear-all-button.mdc-chip-set--input{padding-right:2rem}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input{color:rgba(var(--contrast-1400), 1);font-size:var(--limel-theme-default-font-size) !important;font-family:inherit !important}.mdc-text-field.mdc-text-field--disabled .mdc-text-field__input{color:rgba(var(--contrast-1400), 0.5)}.mdc-text-field{height:auto;cursor:text;flex-wrap:wrap;row-gap:0.5rem}.mdc-text-field .mdc-text-field__input::placeholder{color:rgb(var(--contrast-900)) !important;font-size:var(--limel-theme-default-font-size) !important;font-family:inherit !important}.mdc-text-field .mdc-text-field__input{width:auto;padding:0 0.5rem;flex-grow:1;flex-shrink:0}.mdc-text-field .mdc-text-field__input.hidden{transition:all 0s;opacity:0;position:absolute;z-index:-100}.mdc-text-field .mdc-text-field__input[type=search]{-webkit-appearance:textfield;background-color:transparent}.mdc-text-field .mdc-text-field__input[type=search]::-webkit-search-cancel-button{display:none}.clear-all-button{transition:color var(--limel-clickable-transition-speed, 0.4s) ease, background-color var(--limel-clickable-transition-speed, 0.4s) ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease, transform var(--limel-clickable-transform-speed, 0.4s) var(--limel-clickable-transform-timing-function, ease);cursor:pointer;color:var(--limel-theme-on-surface-color);background-color:rgb(var(--contrast-900))}.clear-all-button:hover,.clear-all-button:focus,.clear-all-button:focus-visible{will-change:color, background-color, box-shadow, transform}.clear-all-button:hover,.clear-all-button:focus-visible{transform:translate3d(0, 0.01rem, 0);color:rgb(var(--color-white));background-color:rgb(var(--color-red-default))}.clear-all-button:hover{box-shadow:var(--button-shadow-hovered)}.clear-all-button:active{--limel-clickable-transform-timing-function:cubic-bezier( 0.83, -0.15, 0.49, 1.16 );transform:translate3d(0, 0.05rem, 0);box-shadow:var(--button-shadow-pressed)}.clear-all-button:hover,.clear-all-button:active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}.clear-all-button{cursor:pointer;height:1.25rem;width:1.25rem;border-radius:50%;background-repeat:no-repeat;background-position:center;background-size:0.75rem;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2032%2032'%3E%3Cdefs/%3E%3Cpath%20fill='rgb(255,255,255)'%20d='M7.219%205.781L5.78%207.22%2014.563%2016%205.78%2024.781%207.22%2026.22%2016%2017.437l8.781%208.782%201.438-1.438L17.437%2016l8.782-8.781L24.78%205.78%2016%2014.563z'/%3E%3C/svg%3E")}.clear-all-button:focus{outline:none}.clear-all-button:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.clear-all-button{position:absolute;right:0.5rem;top:calc(2.5rem / 4);opacity:0}.clear-all-button:focus,.has-chips:not(.disabled):hover .clear-all-button,.has-chips:not(.disabled).mdc-text-field--focused .clear-all-button{opacity:1;outline:none}.mdc-chip-set:not(.has-chips) .clear-all-button,.has-chips.disabled .clear-all-button{display:none}.has-leading-icon:not(.has-chips) .mdc-text-field__input{padding-left:1.5rem}.has-leading-icon limel-chip:first-of-type{margin-left:1.5rem}.has-leading-icon .search-icon{transition:transform 0.2s ease;position:absolute;top:0.5625rem;left:0.25rem}.has-leading-icon limel-icon{background-color:transparent}.delimiter{opacity:0.5;padding:0 0.125rem;color:var(--limel-theme-on-surface-color)}limel-chip{border-radius:2rem}limel-chip.can-be-removed{box-shadow:var(--shadow-depth-8-error)}`;
|
|
225
|
+
const linearProgressCss = () => `:host(limel-linear-progress){isolation:isolate;position:relative;overflow:hidden;display:flex;width:100%;height:0.25rem;border-radius:0.25rem;background-color:var(--background-color, rgb(var(--contrast-800), 0.5))}.progress{height:100%;width:var(--percentage, 0%);border-radius:0.25rem;background-color:var(--lime-primary-color, var(--limel-theme-primary-color))}:host(limel-linear-progress[indeterminate]) .progress{background-color:transparent;width:100%}:host(limel-linear-progress[indeterminate]) .progress:before,:host(limel-linear-progress[indeterminate]) .progress:after{will-change:left, right, opacity;content:"";position:absolute;inset:0;height:100%;border-radius:0.25rem;opacity:0;background-color:var(--lime-primary-color, var(--limel-theme-primary-color))}:host(limel-linear-progress[indeterminate]) .progress:before{animation:indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite}:host(limel-linear-progress[indeterminate]) .progress:after{animation:indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite 1.15s}@keyframes indeterminate{0%{left:-35%;right:100%;opacity:0}10%,80%{opacity:1}60%{left:100%;right:-90%}100%{left:100%;right:-90%;opacity:0}}@keyframes indeterminate-short{0%{left:-200%;right:100%;opacity:0}10%,80%{opacity:1}60%{left:107%;right:-8%}100%{left:107%;right:-8%;opacity:0}}`;
|
|
331
226
|
|
|
332
|
-
const
|
|
227
|
+
const PERCENT = 100;
|
|
228
|
+
const LinearProgress = class {
|
|
333
229
|
constructor(hostRef) {
|
|
334
230
|
registerInstance(this, hostRef);
|
|
335
|
-
this.interact = createEvent(this, "interact");
|
|
336
|
-
this.change = createEvent(this, "change");
|
|
337
|
-
this.startEdit = createEvent(this, "startEdit");
|
|
338
|
-
this.stopEdit = createEvent(this, "stopEdit");
|
|
339
|
-
this.input = createEvent(this, "input");
|
|
340
|
-
/**
|
|
341
|
-
* List of chips for the set
|
|
342
|
-
*/
|
|
343
|
-
this.value = [];
|
|
344
|
-
/**
|
|
345
|
-
* True if the chip set should be disabled
|
|
346
|
-
*/
|
|
347
|
-
this.disabled = false;
|
|
348
|
-
/**
|
|
349
|
-
* For chip-sets of type `input`, set to `true` to disable adding and
|
|
350
|
-
* removing chips, but allow interaction with existing chips in the set.
|
|
351
|
-
* For any other types, setting either `readonly` or `disabled` disables
|
|
352
|
-
* the chip-set.
|
|
353
|
-
*/
|
|
354
|
-
this.readonly = false;
|
|
355
|
-
/**
|
|
356
|
-
* Set to `true` to indicate that the current value of the input field is
|
|
357
|
-
* invalid.
|
|
358
|
-
*/
|
|
359
|
-
this.invalid = false;
|
|
360
|
-
/**
|
|
361
|
-
* For chip-sets of type `input`. Value to use for the `type` attribute on the
|
|
362
|
-
* input field inside the chip-set.
|
|
363
|
-
*/
|
|
364
|
-
this.inputType = 'text';
|
|
365
|
-
/**
|
|
366
|
-
* True if the control requires a value
|
|
367
|
-
*/
|
|
368
|
-
this.required = false;
|
|
369
|
-
/**
|
|
370
|
-
* Whether the input field should be emptied when the chip-set loses focus.
|
|
371
|
-
*/
|
|
372
|
-
this.emptyInputOnBlur = true;
|
|
373
|
-
/**
|
|
374
|
-
* Whether the "Clear all" buttons should be shown
|
|
375
|
-
*/
|
|
376
|
-
this.clearAllButton = true;
|
|
377
|
-
/**
|
|
378
|
-
* For chip-sets of type `input`. When the value is null, no leading icon is used.
|
|
379
|
-
* Leading icon to show to the far left in the text field
|
|
380
|
-
*/
|
|
381
|
-
this.leadingIcon = null;
|
|
382
231
|
/**
|
|
383
|
-
*
|
|
232
|
+
* Defines the language for translations.
|
|
233
|
+
* Will translate the translatable strings on the components.
|
|
384
234
|
*/
|
|
385
|
-
this.
|
|
235
|
+
this.language = 'en';
|
|
386
236
|
/**
|
|
387
|
-
*
|
|
388
|
-
* Read more about the `autocomplete` attribute
|
|
389
|
-
* [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete).
|
|
237
|
+
* The value of the progress bar. Should be between `0` and `1`.
|
|
390
238
|
*/
|
|
391
|
-
this.
|
|
239
|
+
this.value = 0;
|
|
392
240
|
/**
|
|
393
|
-
*
|
|
394
|
-
* Will translate the translatable strings on the components. For example, the clear all chips label.
|
|
241
|
+
* Puts the progress bar in an indeterminate state
|
|
395
242
|
*/
|
|
396
|
-
this.
|
|
397
|
-
this.editMode = false;
|
|
398
|
-
this.textValue = '';
|
|
399
|
-
this.blurred = false;
|
|
400
|
-
this.inputChipIndexSelected = null;
|
|
401
|
-
this.handleKeyDown = handleKeyboardEvent;
|
|
402
|
-
this.renderContent = (value) => {
|
|
403
|
-
if (this.type === 'input') {
|
|
404
|
-
return this.renderInputChips();
|
|
405
|
-
}
|
|
406
|
-
return value.map(this.renderChip);
|
|
407
|
-
};
|
|
408
|
-
this.getValue = () => {
|
|
409
|
-
return this.value.map((chip) => (Object.assign(Object.assign({}, chip), (this.type && {
|
|
410
|
-
selected: this.selectedChipIds.includes(chip.id),
|
|
411
|
-
}))));
|
|
412
|
-
};
|
|
413
|
-
this.floatLabelAbove = () => {
|
|
414
|
-
if (this.value.length > 0 ||
|
|
415
|
-
this.editMode ||
|
|
416
|
-
this.readonly ||
|
|
417
|
-
this.textValue) {
|
|
418
|
-
return true;
|
|
419
|
-
}
|
|
420
|
-
};
|
|
421
|
-
this.hasHelperText = () => {
|
|
422
|
-
return this.helperText !== null && this.helperText !== undefined;
|
|
423
|
-
};
|
|
424
|
-
this.renderHelperLine = () => {
|
|
425
|
-
const maxItems = this.maxItems === 1 ? undefined : this.maxItems;
|
|
426
|
-
if (!maxItems && !this.hasHelperText()) {
|
|
427
|
-
return;
|
|
428
|
-
}
|
|
429
|
-
return (h("limel-helper-line", { length: this.value.length, maxLength: maxItems, helperText: this.helperText, invalid: this.isInvalid() }));
|
|
430
|
-
};
|
|
431
|
-
this.catchInputChipClicks = (chip) => (event) => {
|
|
432
|
-
/*
|
|
433
|
-
* We need to add the `chip` to the event object so that the consumer
|
|
434
|
-
* can get the chip object when the chip is clicked.
|
|
435
|
-
* This is necessary for the consumer to be able to handle the click
|
|
436
|
-
* event itself, based on which chip was clicked, or whether the click
|
|
437
|
-
* was on a chip or elsewhere. The reason the consumer can't just look
|
|
438
|
-
* at the event target is that that information is hidden by the
|
|
439
|
-
* shadow DOM.
|
|
440
|
-
*
|
|
441
|
-
* See documentation for the `interact` event for more information.
|
|
442
|
-
*/
|
|
443
|
-
event.Lime = { chip: chip };
|
|
444
|
-
if (this.isSelectableChip(chip)) {
|
|
445
|
-
this.updateSelectedChipIds(chip);
|
|
446
|
-
this.change.emit(chip);
|
|
447
|
-
}
|
|
448
|
-
this.emitInteraction(chip);
|
|
449
|
-
};
|
|
450
|
-
this.handleRemoveChip = (event) => {
|
|
451
|
-
this.removeChip(event.detail);
|
|
452
|
-
};
|
|
453
|
-
this.removeChip = (identifier) => {
|
|
454
|
-
const newValue = this.value.filter((chip) => {
|
|
455
|
-
return chip.id !== identifier;
|
|
456
|
-
});
|
|
457
|
-
this.change.emit(newValue);
|
|
458
|
-
};
|
|
459
|
-
this.clearAllChipsLabel = () => {
|
|
460
|
-
return translate.get('chip-set.clear-all', this.language);
|
|
461
|
-
};
|
|
462
|
-
this.labelId = createRandomString();
|
|
463
|
-
this.renderChip = this.renderChip.bind(this);
|
|
464
|
-
this.renderInputChip = this.renderInputChip.bind(this);
|
|
465
|
-
this.isFull = this.isFull.bind(this);
|
|
466
|
-
this.handleTextFieldFocus = this.handleTextFieldFocus.bind(this);
|
|
467
|
-
this.handleInputBlur = this.handleInputBlur.bind(this);
|
|
468
|
-
this.handleTextInput = this.handleTextInput.bind(this);
|
|
469
|
-
this.inputFieldOnChange = this.inputFieldOnChange.bind(this);
|
|
470
|
-
this.handleKeyDown = this.handleKeyDown.bind(this);
|
|
471
|
-
this.inputHidden = this.inputHidden.bind(this);
|
|
472
|
-
this.handleDeleteAllIconClick =
|
|
473
|
-
this.handleDeleteAllIconClick.bind(this);
|
|
474
|
-
this.renderDelimiter = this.renderDelimiter.bind(this);
|
|
475
|
-
}
|
|
476
|
-
connectedCallback() {
|
|
477
|
-
this.initialize();
|
|
478
|
-
}
|
|
479
|
-
initialize() {
|
|
480
|
-
if (this.value.length > 0) {
|
|
481
|
-
this.selectedChipIds = this.value
|
|
482
|
-
.filter((chip) => chip.selected)
|
|
483
|
-
.map((chip) => chip.id);
|
|
484
|
-
}
|
|
485
|
-
}
|
|
486
|
-
/**
|
|
487
|
-
* Used to find out whether the chip-set is in edit mode.
|
|
488
|
-
*
|
|
489
|
-
* @returns `true` if the chip-set is in edit mode, `false` otherwise.
|
|
490
|
-
*/
|
|
491
|
-
async getEditMode() {
|
|
492
|
-
return this.editMode;
|
|
493
|
-
}
|
|
494
|
-
/**
|
|
495
|
-
* Used to set focus to the chip-set input field.
|
|
496
|
-
*
|
|
497
|
-
* @param emptyInput - if `true`, any text in the input is discarded
|
|
498
|
-
* @returns does not return anything, but methods have to be async
|
|
499
|
-
*/
|
|
500
|
-
async setFocus(emptyInput = false) {
|
|
501
|
-
if (this.disabled || this.readonly) {
|
|
502
|
-
return;
|
|
503
|
-
}
|
|
504
|
-
this.editMode = true;
|
|
505
|
-
if (emptyInput) {
|
|
506
|
-
this.textValue = '';
|
|
507
|
-
}
|
|
508
|
-
this.host.shadowRoot.querySelector('input').focus();
|
|
509
|
-
this.startEdit.emit();
|
|
510
|
-
}
|
|
511
|
-
/**
|
|
512
|
-
* Used to empty the input field. Used in conjunction with `emptyInputOnBlur` to let the
|
|
513
|
-
* consumer control when the input is emptied.
|
|
514
|
-
*
|
|
515
|
-
* @returns does not return anything, but methods have to be async
|
|
516
|
-
*/
|
|
517
|
-
async emptyInput() {
|
|
518
|
-
this.syncEmptyInput();
|
|
519
|
-
}
|
|
520
|
-
componentDidLoad() {
|
|
521
|
-
this.triggerIconColorWarning(this.value);
|
|
522
|
-
if (this.type === 'input') {
|
|
523
|
-
this.mdcTextField = new MDCTextField(this.host.shadowRoot.querySelector('.mdc-text-field'));
|
|
524
|
-
}
|
|
525
|
-
}
|
|
526
|
-
componentDidUpdate() {
|
|
527
|
-
const input = this.host.shadowRoot.querySelector('input');
|
|
528
|
-
if (input && this.editMode) {
|
|
529
|
-
input.focus();
|
|
530
|
-
}
|
|
531
|
-
}
|
|
532
|
-
disconnectedCallback() {
|
|
533
|
-
if (this.mdcTextField) {
|
|
534
|
-
this.mdcTextField.destroy();
|
|
535
|
-
}
|
|
243
|
+
this.indeterminate = false;
|
|
536
244
|
}
|
|
537
245
|
render() {
|
|
538
|
-
|
|
539
|
-
const classes = {
|
|
540
|
-
'mdc-chip-set': true,
|
|
541
|
-
'mdc-text-field--with-trailing-icon': true,
|
|
542
|
-
disabled: this.disabled || this.readonly,
|
|
543
|
-
};
|
|
544
|
-
if (this.type) {
|
|
545
|
-
classes[`mdc-chip-set--${this.type}`] = true;
|
|
546
|
-
}
|
|
547
|
-
if (this.type === 'input') {
|
|
548
|
-
Object.assign(classes, {
|
|
549
|
-
'mdc-text-field': true,
|
|
550
|
-
'mdc-text-field--outlined': true,
|
|
551
|
-
'mdc-chip-set--input': true,
|
|
552
|
-
'lime-text-field--readonly': this.readonly,
|
|
553
|
-
'has-chips': this.value.length > 0,
|
|
554
|
-
'has-leading-icon': this.leadingIcon !== null,
|
|
555
|
-
'has-clear-all-button': this.clearAllButton,
|
|
556
|
-
});
|
|
557
|
-
}
|
|
558
|
-
const value = this.getValue();
|
|
559
|
-
return (h(Host, { key: '22e7456b5a9849f42d99338c984ffb18bf809661' }, h("limel-notched-outline", { key: '200d72c0bef881abf10ebd099f719ada8bca1938', labelId: this.labelId, label: this.label, required: this.required, invalid: this.invalid || this.isInvalid(), disabled: this.disabled, readonly: this.readonly, hasValue: !!((_a = this.value) === null || _a === void 0 ? void 0 : _a.length), hasLeadingIcon: !!this.leadingIcon, hasFloatingLabel: this.floatLabelAbove() }, h("div", Object.assign({ key: '7d130f4388fdd8f396a2c4caa7a2eeab90d8257d', slot: "content" }, this.getContentProps(), { class: classes }), this.renderContent(value))), this.renderHelperLine()));
|
|
560
|
-
}
|
|
561
|
-
getContentProps() {
|
|
562
|
-
if (this.type === 'input') {
|
|
563
|
-
return {
|
|
564
|
-
onClick: this.handleTextFieldFocus,
|
|
565
|
-
};
|
|
566
|
-
}
|
|
567
|
-
return {
|
|
568
|
-
role: 'grid',
|
|
569
|
-
};
|
|
570
|
-
}
|
|
571
|
-
handleChangeChips(newValue, oldValue) {
|
|
572
|
-
if (isEqual(newValue, oldValue)) {
|
|
246
|
+
if (!this.isFinite(this.value)) {
|
|
573
247
|
return;
|
|
574
248
|
}
|
|
575
|
-
this.
|
|
576
|
-
this.
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
return
|
|
580
|
-
this.value.map(this.renderInputChip),
|
|
581
|
-
h("input", { tabIndex: this.disabled || this.readonly ? -1 : 0, type: this.inputType, id: this.labelId, disabled: this.readonly || this.disabled, class: {
|
|
582
|
-
'mdc-text-field__input': true,
|
|
583
|
-
hidden: this.inputHidden(),
|
|
584
|
-
}, value: this.textValue, onBlur: this.handleInputBlur, onFocus: this.handleTextFieldFocus, onKeyDown: this.handleKeyDown, onInput: this.handleTextInput,
|
|
585
|
-
// Some browsers emit a change event on input elements, we need to stop
|
|
586
|
-
// that event from propagating since we are emitting our own change event
|
|
587
|
-
onChange: this.inputFieldOnChange, placeholder: this.isFull() ? '' : this.searchLabel, readonly: this.isFull(), autocomplete: this.autocomplete }),
|
|
588
|
-
this.renderLeadingIcon(),
|
|
589
|
-
this.renderClearAllChipsButton(),
|
|
590
|
-
];
|
|
591
|
-
}
|
|
592
|
-
isFull() {
|
|
593
|
-
return !!this.maxItems && this.value.length >= this.maxItems;
|
|
594
|
-
}
|
|
595
|
-
isInvalid() {
|
|
596
|
-
var _a;
|
|
597
|
-
if (this.readonly) {
|
|
598
|
-
// A readonly field can never be invalid.
|
|
599
|
-
return false;
|
|
600
|
-
}
|
|
601
|
-
if (this.invalid) {
|
|
602
|
-
return true;
|
|
603
|
-
}
|
|
604
|
-
if (!this.required) {
|
|
605
|
-
return false;
|
|
606
|
-
}
|
|
607
|
-
if (!this.blurred) {
|
|
608
|
-
return false;
|
|
609
|
-
}
|
|
610
|
-
return !((_a = this.value) === null || _a === void 0 ? void 0 : _a.length);
|
|
249
|
+
const loadingText = translate.get('loading', this.language);
|
|
250
|
+
const ariaLabel = translate.get('progress-bar', this.language);
|
|
251
|
+
const ariaValueNow = this.indeterminate ? undefined : this.value;
|
|
252
|
+
const ariaValueText = this.indeterminate ? loadingText : undefined;
|
|
253
|
+
return (h(Host, { role: "progressbar", "aria-label": this.accessibleLabel || ariaLabel, "aria-live": "polite", "aria-valuemin": "0", "aria-valuemax": "1", "aria-valuenow": ariaValueNow, "aria-valuetext": ariaValueText, style: { '--percentage': `${this.value * PERCENT}%` } }, h("div", { class: "progress" })));
|
|
611
254
|
}
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
}
|
|
615
|
-
/**
|
|
616
|
-
* Enter edit mode when the text field receives focus. When editMode is true, the input element will be visible
|
|
617
|
-
*/
|
|
618
|
-
handleTextFieldFocus() {
|
|
619
|
-
if (this.disabled || this.readonly) {
|
|
620
|
-
return;
|
|
621
|
-
}
|
|
622
|
-
if (this.editMode) {
|
|
255
|
+
watchValue(newValue) {
|
|
256
|
+
if (!this.isFinite(newValue)) {
|
|
623
257
|
return;
|
|
624
258
|
}
|
|
625
|
-
this.
|
|
626
|
-
this.startEdit.emit();
|
|
259
|
+
this.updateProgress(newValue);
|
|
627
260
|
}
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
*/
|
|
632
|
-
handleInputBlur() {
|
|
633
|
-
if (this.emptyInputOnBlur) {
|
|
634
|
-
this.syncEmptyInput();
|
|
261
|
+
updateProgress(value) {
|
|
262
|
+
if (this.host) {
|
|
263
|
+
this.host.style.setProperty('--percentage', `${value * PERCENT}%`);
|
|
635
264
|
}
|
|
636
|
-
this.editMode = false;
|
|
637
|
-
this.blurred = true;
|
|
638
|
-
this.inputChipIndexSelected = null;
|
|
639
|
-
// This timeout is needed in order to let a new element receive focus
|
|
640
|
-
setTimeout(() => {
|
|
641
|
-
this.stopEdit.emit();
|
|
642
|
-
}, 0);
|
|
643
265
|
}
|
|
644
|
-
|
|
645
|
-
|
|
266
|
+
isFinite(value) {
|
|
267
|
+
return Number.isFinite(value);
|
|
646
268
|
}
|
|
647
|
-
inputHidden() {
|
|
648
|
-
var _a;
|
|
649
|
-
if (this.editMode) {
|
|
650
|
-
return this.isFull();
|
|
651
|
-
}
|
|
652
|
-
// Keep the input visible while it holds uncommitted text, so typed
|
|
653
|
-
// content doesn't disappear when focus leaves (e.g. tabbing to a
|
|
654
|
-
// sibling action).
|
|
655
|
-
if (this.textValue) {
|
|
656
|
-
return false;
|
|
657
|
-
}
|
|
658
|
-
// If there are chips in the picker, hide the input to avoid the input
|
|
659
|
-
// being placed on a new line and adding ugly space beneath the chips.
|
|
660
|
-
// If there are no chips, show the input, or the picker will look weird.
|
|
661
|
-
return !!((_a = this.value) === null || _a === void 0 ? void 0 : _a.length);
|
|
662
|
-
}
|
|
663
|
-
handleTextInput(event) {
|
|
664
|
-
var _a;
|
|
665
|
-
event.stopPropagation();
|
|
666
|
-
this.inputChipIndexSelected = null;
|
|
667
|
-
this.textValue = event.target.value;
|
|
668
|
-
this.input.emit((_a = event.target.value) === null || _a === void 0 ? void 0 : _a.trim());
|
|
669
|
-
}
|
|
670
|
-
emitInteraction(chip) {
|
|
671
|
-
this.interact.emit(chip);
|
|
672
|
-
}
|
|
673
|
-
renderChip(chip) {
|
|
674
|
-
const chipType = this.type === 'filter' ? 'filter' : 'default';
|
|
675
|
-
const chipProps = this.getChipProps(chip, chipType);
|
|
676
|
-
return h("limel-chip", Object.assign({}, chipProps));
|
|
677
|
-
}
|
|
678
|
-
renderInputChip(chip, index, chips) {
|
|
679
|
-
const chipProps = this.getChipProps(chip, 'default');
|
|
680
|
-
const isLastChip = index === chips.length - 1;
|
|
681
|
-
return [
|
|
682
|
-
h("limel-chip", Object.assign({ key: chip.id, class: {
|
|
683
|
-
'can-be-removed': this.inputChipIndexSelected === index,
|
|
684
|
-
} }, chipProps)),
|
|
685
|
-
!(isLastChip && this.inputHidden()) && this.renderDelimiter(),
|
|
686
|
-
];
|
|
687
|
-
}
|
|
688
|
-
getChipProps(chip, chipType) {
|
|
689
|
-
const removable = this.type === 'input' && chip.removable && !this.readonly;
|
|
690
|
-
const readonly = this.readonly && this.type !== 'input';
|
|
691
|
-
return Object.assign({ role: 'row', identifier: chip.id, text: chip.text, icon: chip.icon, image: chip.image, badge: chip.badge, selected: chip.selected, disabled: this.disabled, loading: chip.loading, invalid: chip.invalid, readonly: readonly, type: chipType, removable: removable, menuItems: chip.menuItems, onClick: this.catchInputChipClicks(chip), onRemove: this.handleRemoveChip }, (chip.href && {
|
|
692
|
-
link: {
|
|
693
|
-
href: getHref(chip.href),
|
|
694
|
-
target: getTarget(chip.href),
|
|
695
|
-
},
|
|
696
|
-
}));
|
|
697
|
-
}
|
|
698
|
-
isSelectableChip(chip) {
|
|
699
|
-
return this.type !== 'input' && 'selected' in chip;
|
|
700
|
-
}
|
|
701
|
-
updateSelectedChipIds(chip) {
|
|
702
|
-
chip.selected = !chip.selected;
|
|
703
|
-
const id = chip.id;
|
|
704
|
-
if (this.type === 'choice') {
|
|
705
|
-
this.updateChoiceTypeSelectedIds(id);
|
|
706
|
-
}
|
|
707
|
-
else {
|
|
708
|
-
this.updateFilterTypeSelectedIds(id);
|
|
709
|
-
}
|
|
710
|
-
}
|
|
711
|
-
updateChoiceTypeSelectedIds(id) {
|
|
712
|
-
this.selectedChipIds = this.isChipSelected(id) ? [] : [id];
|
|
713
|
-
}
|
|
714
|
-
isChipSelected(id) {
|
|
715
|
-
return this.selectedChipIds.includes(id);
|
|
716
|
-
}
|
|
717
|
-
updateFilterTypeSelectedIds(id) {
|
|
718
|
-
if (this.isChipSelected(id)) {
|
|
719
|
-
this.removeChipIdFromSelectedChipIds(id);
|
|
720
|
-
}
|
|
721
|
-
else {
|
|
722
|
-
this.addChipIdToSelectedChipIds(id);
|
|
723
|
-
}
|
|
724
|
-
}
|
|
725
|
-
removeChipIdFromSelectedChipIds(id) {
|
|
726
|
-
this.selectedChipIds = this.selectedChipIds.filter((chipId) => chipId !== id);
|
|
727
|
-
}
|
|
728
|
-
addChipIdToSelectedChipIds(id) {
|
|
729
|
-
this.selectedChipIds = [...this.selectedChipIds, id];
|
|
730
|
-
}
|
|
731
|
-
renderLeadingIcon() {
|
|
732
|
-
if (!this.leadingIcon) {
|
|
733
|
-
return;
|
|
734
|
-
}
|
|
735
|
-
return (h("i", { class: "mdc-text-field__icon search-icon" }, h("limel-icon", { name: this.leadingIcon })));
|
|
736
|
-
}
|
|
737
|
-
renderClearAllChipsButton() {
|
|
738
|
-
if (this.disabled || this.readonly || !this.clearAllButton) {
|
|
739
|
-
return;
|
|
740
|
-
}
|
|
741
|
-
return (h("a", { href: "", onClick: this.handleDeleteAllIconClick, class: "mdc-text-field__icon clear-all-button", tabindex: "0", role: "button", title: this.clearAllChipsLabel(), "aria-label": this.clearAllChipsLabel() }));
|
|
742
|
-
}
|
|
743
|
-
handleDeleteAllIconClick(event) {
|
|
744
|
-
event.preventDefault();
|
|
745
|
-
this.change.emit([]);
|
|
746
|
-
}
|
|
747
|
-
renderDelimiter() {
|
|
748
|
-
if (!this.delimiter) {
|
|
749
|
-
return;
|
|
750
|
-
}
|
|
751
|
-
return h("div", { class: "delimiter" }, this.delimiter);
|
|
752
|
-
}
|
|
753
|
-
triggerIconColorWarning(value) {
|
|
754
|
-
for (const chip of value) {
|
|
755
|
-
if (chip.icon &&
|
|
756
|
-
(chip.iconFillColor ||
|
|
757
|
-
chip.iconBackgroundColor ||
|
|
758
|
-
chip.iconTitle)) {
|
|
759
|
-
console.warn("The `iconFillColor`, `iconBackgroundColor`, and `iconTitle` props are deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name', `iconBackgroundColor: 'color-name', and `iconTitle: 'title'`, write `icon { name: 'icon-name', color: 'color-name', backgroundColor: 'color-name', title: 'title' }`.");
|
|
760
|
-
}
|
|
761
|
-
}
|
|
762
|
-
}
|
|
763
|
-
static get delegatesFocus() { return true; }
|
|
764
269
|
get host() { return getElement(this); }
|
|
765
270
|
static get watchers() { return {
|
|
766
271
|
"value": [{
|
|
767
|
-
"
|
|
272
|
+
"watchValue": 0
|
|
768
273
|
}]
|
|
769
274
|
}; }
|
|
770
275
|
};
|
|
771
|
-
|
|
276
|
+
LinearProgress.style = linearProgressCss();
|
|
772
277
|
|
|
773
|
-
export { Chip as limel_chip,
|
|
278
|
+
export { Chip as limel_chip, LinearProgress as limel_linear_progress };
|