@limetech/lime-elements 37.81.1 → 37.81.3
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 +17 -0
- package/dist/cjs/limel-breadcrumbs_7.cjs.entry.js +15 -8
- package/dist/cjs/limel-breadcrumbs_7.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/limel-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-chip_2.cjs.entry.js +1 -1
- package/dist/cjs/limel-chip_2.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-dynamic-label_2.cjs.entry.js +1 -1
- package/dist/cjs/limel-dynamic-label_2.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-prosemirror-adapter.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-select.cjs.entry.js +1 -1
- package/dist/cjs/limel-select.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-slider.cjs.entry.js +1 -1
- package/dist/cjs/limel-slider.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-switch.cjs.entry.js +1 -1
- package/dist/cjs/limel-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-table.cjs.entry.js +1 -1
- package/dist/cjs/limel-table.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-text-editor.cjs.entry.js +1 -1
- package/dist/cjs/limel-text-editor.cjs.entry.js.map +1 -1
- package/dist/collection/components/checkbox/checkbox.css +1 -3
- package/dist/collection/components/chip-set/chip-set.css +1 -3
- package/dist/collection/components/helper-line/helper-line.css +4 -0
- package/dist/collection/components/input-field/input-field.css +1 -3
- package/dist/collection/components/input-field/input-field.js +12 -5
- package/dist/collection/components/input-field/input-field.js.map +1 -1
- package/dist/collection/components/list/list.css +2 -6
- package/dist/collection/components/menu-list/menu-list.css +2 -6
- package/dist/collection/components/select/select.css +1 -3
- package/dist/collection/components/slider/slider.css +1 -3
- package/dist/collection/components/switch/switch.css +1 -3
- package/dist/collection/components/table/table.css +5 -3
- package/dist/collection/components/text-editor/text-editor.css +1 -3
- package/dist/collection/style/mixins.scss +1 -3
- package/dist/esm/limel-breadcrumbs_7.entry.js +15 -8
- package/dist/esm/limel-breadcrumbs_7.entry.js.map +1 -1
- package/dist/esm/limel-checkbox.entry.js +1 -1
- package/dist/esm/limel-checkbox.entry.js.map +1 -1
- package/dist/esm/limel-chip_2.entry.js +1 -1
- package/dist/esm/limel-chip_2.entry.js.map +1 -1
- package/dist/esm/limel-dynamic-label_2.entry.js +1 -1
- package/dist/esm/limel-dynamic-label_2.entry.js.map +1 -1
- package/dist/esm/limel-prosemirror-adapter.entry.js.map +1 -1
- package/dist/esm/limel-select.entry.js +1 -1
- package/dist/esm/limel-select.entry.js.map +1 -1
- package/dist/esm/limel-slider.entry.js +1 -1
- package/dist/esm/limel-slider.entry.js.map +1 -1
- package/dist/esm/limel-switch.entry.js +1 -1
- package/dist/esm/limel-switch.entry.js.map +1 -1
- package/dist/esm/limel-table.entry.js +1 -1
- package/dist/esm/limel-table.entry.js.map +1 -1
- package/dist/esm/limel-text-editor.entry.js +1 -1
- package/dist/esm/limel-text-editor.entry.js.map +1 -1
- package/dist/lime-elements/lime-elements.esm.js +1 -1
- package/dist/lime-elements/p-2d997454.entry.js +2 -0
- package/dist/lime-elements/p-2d997454.entry.js.map +1 -0
- package/dist/lime-elements/{p-ef42256f.entry.js → p-36cf3031.entry.js} +2 -2
- package/dist/lime-elements/{p-ef42256f.entry.js.map → p-36cf3031.entry.js.map} +1 -1
- package/dist/lime-elements/{p-147db56c.entry.js → p-3d74b3c1.entry.js} +2 -2
- package/dist/lime-elements/{p-147db56c.entry.js.map → p-3d74b3c1.entry.js.map} +1 -1
- package/dist/lime-elements/p-429a4b20.entry.js +2 -0
- package/dist/lime-elements/{p-c4503728.entry.js.map → p-429a4b20.entry.js.map} +1 -1
- package/dist/lime-elements/{p-c7b21bd8.entry.js → p-4536b562.entry.js} +2 -2
- package/dist/lime-elements/{p-c7b21bd8.entry.js.map → p-4536b562.entry.js.map} +1 -1
- package/dist/lime-elements/{p-3cbe2ed9.entry.js → p-7fdab6b0.entry.js} +2 -2
- package/dist/lime-elements/{p-3cbe2ed9.entry.js.map → p-7fdab6b0.entry.js.map} +1 -1
- package/dist/lime-elements/{p-29dd2fee.entry.js → p-8baf79cf.entry.js} +2 -2
- package/dist/lime-elements/{p-29dd2fee.entry.js.map → p-8baf79cf.entry.js.map} +1 -1
- package/dist/lime-elements/p-911bde1e.entry.js.map +1 -1
- package/dist/lime-elements/{p-603ce062.entry.js → p-d0a80991.entry.js} +4 -4
- package/dist/lime-elements/{p-603ce062.entry.js.map → p-d0a80991.entry.js.map} +1 -1
- package/dist/lime-elements/p-d6d13f31.entry.js +266 -0
- package/dist/lime-elements/p-d6d13f31.entry.js.map +1 -0
- package/dist/lime-elements/style/mixins.scss +1 -3
- package/dist/scss/mixins.scss +1 -3
- package/dist/types/components/input-field/input-field.d.ts +1 -0
- package/package.json +5 -5
- package/dist/lime-elements/p-9f8aa8e7.entry.js +0 -2
- package/dist/lime-elements/p-9f8aa8e7.entry.js.map +0 -1
- package/dist/lime-elements/p-c4503728.entry.js +0 -2
- package/dist/lime-elements/p-d754969f.entry.js +0 -266
- package/dist/lime-elements/p-d754969f.entry.js.map +0 -1
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
const index = require('./index-d1052409.js');
|
|
6
6
|
const randomString = require('./random-string-e8ad4419.js');
|
|
7
7
|
|
|
8
|
-
const textEditorCss = "@charset \"UTF-8\";: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 )}.lime-looks-like-input-value{line-height:1.75rem;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;color:rgba(var(--contrast-1400), 1);font-size:0.875rem;font-weight:400;letter-spacing:0.009375em}.mdc-text-field--disabled .lime-looks-like-input-value{cursor:not-allowed;opacity:0.4}.lime-looks-like-input-value{padding:var(--limel-text-editor-padding)}*{box-sizing:border-box}:host(limel-text-editor){--limel-text-editor-outline-color:rgba(var(--contrast-700), 0.65);--limel-text-editor-background-color:rgba(var(--contrast-200), 0.5);--limel-text-editor-label-color:rgba(var(--contrast-1200), 1);--limel-prosemirror-adapter-toolbar-opacity:0.6;--limel-text-editor-padding:0.25rem 1rem 0.75rem 1rem;--limel-prosemirror-adapter-toolbar-grid-template-rows:1fr;--limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration:0.3s;--limel-prosemirror-adapter-toolbar-transition-timing-function:cubic-bezier(\n 0.19,\n 0.23,\n 0.26,\n 0.89\n );position:relative;isolation:isolate;display:flex;flex-direction:column;width:100%;min-width:5rem;min-height:5rem;height:100%;max-height:var(--text-editor-max-height, calc(100vh - (env(safe-area-inset-top) + env(safe-area-inset-bottom)) - 4rem));padding:1px}:host(limel-text-editor:focus-within),:host(limel-text-editor:not([ui=minimal]):hover){--limel-prosemirror-adapter-toolbar-opacity:1}:host(limel-text-editor[ui=minimal]:not(:focus-within)){--limel-text-editor-padding:0.75rem 1rem 0.75rem 1rem;--limel-prosemirror-adapter-toolbar-grid-template-rows:0fr;--limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration:0.46s;--limel-prosemirror-adapter-action-bar-padding-top-bottom:0;--limel-prosemirror-adapter-toolbar-opacity:0;--limel-text-editor-placeholder-top:0;min-height:2.5rem}:host(limel-text-editor:hover){--limel-text-editor-outline-color:rgba(var(--contrast-700), 1)}:host(limel-text-editor:focus-within){--limel-text-editor-outline-color:var(--mdc-theme-primary)}:host(limel-text-editor:focus-within) .placeholder,:host(limel-text-editor:focus) .placeholder{opacity:0}:host(limel-text-editor[disabled]:not([disabled=false])){cursor:not-allowed;opacity:0.4}:host(limel-text-editor[disabled]:not([disabled=false])) limel-prosemirror-adapter{pointer-events:none}:host(limel-text-editor[invalid]:not([invalid=false])){--limel-text-editor-outline-color:var(--lime-error-text-color)}:host(limel-text-editor[readonly]:not([readonly=false])){--limel-text-editor-padding:0.75rem 1rem 0.75rem 1rem;--limel-text-editor-placeholder-top:0;--limel-text-editor-outline-color:transparent;--limel-text-editor-background-color:transparent}:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown{display:block;padding:var(--limel-text-editor-padding);overflow-y:auto}:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown:before,:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown:after{z-index:1;pointer-events:none;content:\"\";display:block;position:absolute;width:100%}:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown:after{height:1.75rem;top:0;background:linear-gradient(var(--text-editor-fade-out-background-color, rgb(var(--contrast-100))), transparent)}:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown:before{height:2rem;bottom:-0.25rem;background:linear-gradient(transparent, var(--text-editor-fade-out-background-color, rgb(var(--contrast-100))))}.notched-outline{transition:bottom var(--limel-h-l-grid-template-rows-transition-speed, 0.46s) cubic-bezier(1, 0.09, 0, 0.89);pointer-events:none;position:absolute;inset:0;bottom:var(--limel-text-editor-notched-outline-bottom, 0);display:flex;background-color:var(--limel-text-editor-background-color)}.leading-outline,.notch,.trailing-outline{transition:border-color 0.2s ease;border-width:1px;border-style:solid;border-color:var(--limel-text-editor-outline-color)}.leading-outline{flex-shrink:0;width:0.75rem;border-right-width:0;border-top-left-radius:0.25rem;border-bottom-left-radius:0.25rem}.notch{flex-shrink:0;position:relative;z-index:2;border-top-width:0;border-right-width:0;border-left-width:0;max-width:calc(100% - 1.5rem)}.trailing-outline{flex-grow:1;border-left-width:0;border-top-right-radius:0.25rem;border-bottom-right-radius:0.25rem}label{transform:translateY(-50%);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;padding:0 0.25rem;color:var(--limel-text-editor-label-color);font-size:0.65rem;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em)}:host(limel-text-editor[required]:not([required=false])) label::after{content:\"*\"}.placeholder{transition-property:top;transition-duration:var(--limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration);transition-timing-function:var(--limel-prosemirror-adapter-toolbar-transition-timing-function);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;position:absolute;top:var(--limel-text-editor-placeholder-top, 2.25rem);left:0;right:0;padding:var(--limel-text-editor-padding);font-style:italic;font-size:0.875rem;color:rgb(var(--contrast-900))}limel-prosemirror-adapter{flex-grow:1;min-width:0;min-height:0;height:100%;overflow:hidden auto}:host(limel-text-editor:focus),:host(limel-text-editor:focus-visible),:host(limel-text-editor:focus-within)
|
|
8
|
+
const textEditorCss = "@charset \"UTF-8\";: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 )}.lime-looks-like-input-value{line-height:1.75rem;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;color:rgba(var(--contrast-1400), 1);font-size:0.875rem;font-weight:400;letter-spacing:0.009375em}.mdc-text-field--disabled .lime-looks-like-input-value{cursor:not-allowed;opacity:0.4}.lime-looks-like-input-value{padding:var(--limel-text-editor-padding)}*{box-sizing:border-box}:host(limel-text-editor){--limel-text-editor-outline-color:rgba(var(--contrast-700), 0.65);--limel-text-editor-background-color:rgba(var(--contrast-200), 0.5);--limel-text-editor-label-color:rgba(var(--contrast-1200), 1);--limel-prosemirror-adapter-toolbar-opacity:0.6;--limel-text-editor-padding:0.25rem 1rem 0.75rem 1rem;--limel-prosemirror-adapter-toolbar-grid-template-rows:1fr;--limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration:0.3s;--limel-prosemirror-adapter-toolbar-transition-timing-function:cubic-bezier(\n 0.19,\n 0.23,\n 0.26,\n 0.89\n );position:relative;isolation:isolate;display:flex;flex-direction:column;width:100%;min-width:5rem;min-height:5rem;height:100%;max-height:var(--text-editor-max-height, calc(100vh - (env(safe-area-inset-top) + env(safe-area-inset-bottom)) - 4rem));padding:1px}:host(limel-text-editor:focus-within),:host(limel-text-editor:not([ui=minimal]):hover){--limel-prosemirror-adapter-toolbar-opacity:1}:host(limel-text-editor[ui=minimal]:not(:focus-within)){--limel-text-editor-padding:0.75rem 1rem 0.75rem 1rem;--limel-prosemirror-adapter-toolbar-grid-template-rows:0fr;--limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration:0.46s;--limel-prosemirror-adapter-action-bar-padding-top-bottom:0;--limel-prosemirror-adapter-toolbar-opacity:0;--limel-text-editor-placeholder-top:0;min-height:2.5rem}:host(limel-text-editor:hover){--limel-text-editor-outline-color:rgba(var(--contrast-700), 1)}:host(limel-text-editor:focus-within){--limel-text-editor-outline-color:var(--mdc-theme-primary)}:host(limel-text-editor:focus-within) .placeholder,:host(limel-text-editor:focus) .placeholder{opacity:0}:host(limel-text-editor[disabled]:not([disabled=false])){cursor:not-allowed;opacity:0.4}:host(limel-text-editor[disabled]:not([disabled=false])) limel-prosemirror-adapter{pointer-events:none}:host(limel-text-editor[invalid]:not([invalid=false])){--limel-text-editor-outline-color:var(--lime-error-text-color)}:host(limel-text-editor[readonly]:not([readonly=false])){--limel-text-editor-padding:0.75rem 1rem 0.75rem 1rem;--limel-text-editor-placeholder-top:0;--limel-text-editor-outline-color:transparent;--limel-text-editor-background-color:transparent}:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown{display:block;padding:var(--limel-text-editor-padding);overflow-y:auto}:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown:before,:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown:after{z-index:1;pointer-events:none;content:\"\";display:block;position:absolute;width:100%}:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown:after{height:1.75rem;top:0;background:linear-gradient(var(--text-editor-fade-out-background-color, rgb(var(--contrast-100))), transparent)}:host(limel-text-editor[readonly]:not([readonly=false])) limel-markdown:before{height:2rem;bottom:-0.25rem;background:linear-gradient(transparent, var(--text-editor-fade-out-background-color, rgb(var(--contrast-100))))}.notched-outline{transition:bottom var(--limel-h-l-grid-template-rows-transition-speed, 0.46s) cubic-bezier(1, 0.09, 0, 0.89);pointer-events:none;position:absolute;inset:0;bottom:var(--limel-text-editor-notched-outline-bottom, 0);display:flex;background-color:var(--limel-text-editor-background-color)}.leading-outline,.notch,.trailing-outline{transition:border-color 0.2s ease;border-width:1px;border-style:solid;border-color:var(--limel-text-editor-outline-color)}.leading-outline{flex-shrink:0;width:0.75rem;border-right-width:0;border-top-left-radius:0.25rem;border-bottom-left-radius:0.25rem}.notch{flex-shrink:0;position:relative;z-index:2;border-top-width:0;border-right-width:0;border-left-width:0;max-width:calc(100% - 1.5rem)}.trailing-outline{flex-grow:1;border-left-width:0;border-top-right-radius:0.25rem;border-bottom-right-radius:0.25rem}label{transform:translateY(-50%);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;padding:0 0.25rem;color:var(--limel-text-editor-label-color);font-size:0.65rem;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em)}:host(limel-text-editor[required]:not([required=false])) label::after{content:\"*\"}.placeholder{transition-property:top;transition-duration:var(--limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration);transition-timing-function:var(--limel-prosemirror-adapter-toolbar-transition-timing-function);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;position:absolute;top:var(--limel-text-editor-placeholder-top, 2.25rem);left:0;right:0;padding:var(--limel-text-editor-padding);font-style:italic;font-size:0.875rem;color:rgb(var(--contrast-900))}limel-prosemirror-adapter{flex-grow:1;min-width:0;min-height:0;height:100%;overflow:hidden auto}:host(limel-text-editor:focus),:host(limel-text-editor:focus-visible),:host(limel-text-editor:focus-within){--limel-h-l-grid-template-rows-transition-speed:0.46s;--limel-h-l-grid-template-rows:1fr}:host(limel-text-editor){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}:host(limel-text-editor:focus) limel-helper-line,:host(limel-text-editor:focus-visible) limel-helper-line,:host(limel-text-editor:focus-within) limel-helper-line,:host(limel-text-editor:hover) limel-helper-line{will-change:grid-template-rows}:host(limel-text-editor.has-helper-text:focus-within) .notched-outline,:host(limel-text-editor.has-helper-text[invalid]:not([invalid=false])) .notched-outline{--limel-text-editor-notched-outline-bottom:1rem}:host(limel-text-editor[allow-resize]) limel-prosemirror-adapter{resize:vertical}";
|
|
9
9
|
|
|
10
10
|
const TextEditor = class {
|
|
11
11
|
constructor(hostRef) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"limel-text-editor.entry.cjs.js","mappings":"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","names":["h","createRandomString","Host"],"sources":["./src/components/text-editor/text-editor.scss?tag=limel-text-editor&encapsulation=shadow","./src/components/text-editor/text-editor.tsx"],"sourcesContent":["@use '../../style/internal/shared_input-select-picker';\n@use '../../style/mixins.scss';\n\n/**\n * @prop --text-editor-max-height: the tallest height the text editor can become when auto-resizing itself. Defaults to `calc(100vh - (env(safe-area-inset-top) + env(safe-area-inset-bottom)) - 4rem)`.\n * @prop --text-editor-fade-out-background-color: the color of the fade-out effect at the top and bottom of the text editor, when the text-editor is in readonly state. Defaults to rgb(var(--contrast-100)).\n */\n\n@include shared_input-select-picker.lime-looks-like-input-value;\n.lime-looks-like-input-value {\n padding: var(--limel-text-editor-padding);\n}\n\n* {\n box-sizing: border-box;\n}\n\n:host(limel-text-editor) {\n --limel-text-editor-outline-color: #{shared_input-select-picker.$lime-text-field-outline-color};\n --limel-text-editor-background-color: #{shared_input-select-picker.$background-color-normal};\n --limel-text-editor-label-color: #{shared_input-select-picker.$label-color};\n --limel-prosemirror-adapter-toolbar-opacity: 0.6;\n --limel-text-editor-padding: 0.25rem 1rem 0.75rem 1rem;\n --limel-prosemirror-adapter-toolbar-grid-template-rows: 1fr;\n --limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration: 0.3s;\n --limel-prosemirror-adapter-toolbar-transition-timing-function: cubic-bezier(\n 0.19,\n 0.23,\n 0.26,\n 0.89\n );\n\n position: relative;\n isolation: isolate;\n display: flex;\n flex-direction: column;\n\n width: 100%;\n min-width: 5rem;\n min-height: 5rem;\n height: 100%;\n max-height: var(\n --text-editor-max-height,\n calc(\n 100vh - (env(safe-area-inset-top) + env(safe-area-inset-bottom)) -\n 4rem\n )\n );\n padding: 1px; // prevents visual defects that can appear due to the backdrop-filter and closeness to borders\n}\n\n:host(limel-text-editor:focus-within),\n:host(limel-text-editor:not([ui='minimal']):hover) {\n --limel-prosemirror-adapter-toolbar-opacity: 1;\n}\n\n:host(limel-text-editor[ui='minimal']:not(:focus-within)) {\n --limel-text-editor-padding: 0.75rem 1rem 0.75rem 1rem;\n --limel-prosemirror-adapter-toolbar-grid-template-rows: 0fr;\n --limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration: 0.46s;\n --limel-prosemirror-adapter-action-bar-padding-top-bottom: 0;\n --limel-prosemirror-adapter-toolbar-opacity: 0;\n --limel-text-editor-placeholder-top: 0;\n min-height: 2.5rem;\n}\n\n:host(limel-text-editor:hover) {\n --limel-text-editor-outline-color: #{shared_input-select-picker.$lime-text-field-outline-color--hovered};\n}\n\n:host(limel-text-editor:focus-within) {\n --limel-text-editor-outline-color: #{shared_input-select-picker.$lime-text-field-outline-color--focused};\n}\n\n:host(limel-text-editor:focus-within),\n:host(limel-text-editor:focus) {\n .placeholder {\n opacity: 0;\n }\n}\n\n:host(limel-text-editor[disabled]:not([disabled='false'])) {\n @include shared_input-select-picker.looks-disabled;\n\n limel-prosemirror-adapter {\n pointer-events: none;\n }\n}\n\n:host(limel-text-editor[invalid]:not([invalid='false'])) {\n --limel-text-editor-outline-color: var(--lime-error-text-color);\n}\n\n:host(limel-text-editor[readonly]:not([readonly='false'])) {\n --limel-text-editor-padding: 0.75rem 1rem 0.75rem 1rem;\n --limel-text-editor-placeholder-top: 0;\n --limel-text-editor-outline-color: transparent;\n --limel-text-editor-background-color: transparent;\n\n limel-markdown {\n // displayed when `readonly` instead of the adapter\n display: block;\n padding: var(--limel-text-editor-padding);\n overflow-y: auto;\n\n &:before,\n &:after {\n z-index: 1;\n pointer-events: none;\n content: '';\n display: block;\n position: absolute;\n width: 100%;\n }\n &:after {\n height: 1.75rem;\n top: 0;\n background: linear-gradient(\n var(\n --text-editor-fade-out-background-color,\n rgb(var(--contrast-100))\n ),\n transparent\n );\n }\n\n &:before {\n height: 2rem;\n bottom: -0.25rem;\n background: linear-gradient(\n transparent,\n var(\n --text-editor-fade-out-background-color,\n rgb(var(--contrast-100))\n )\n );\n }\n }\n}\n\n.notched-outline {\n transition: bottom\n var(--limel-h-l-grid-template-rows-transition-speed, 0.46s)\n cubic-bezier(1, 0.09, 0, 0.89);\n pointer-events: none;\n position: absolute;\n inset: 0;\n bottom: var(--limel-text-editor-notched-outline-bottom, 0);\n\n display: flex;\n background-color: var(--limel-text-editor-background-color);\n}\n\n.leading-outline,\n.notch,\n.trailing-outline {\n transition: border-color 0.2s ease;\n border-width: 1px;\n border-style: solid;\n border-color: var(--limel-text-editor-outline-color);\n}\n\n.leading-outline {\n flex-shrink: 0;\n width: 0.75rem;\n border-right-width: 0;\n border-top-left-radius: 0.25rem;\n border-bottom-left-radius: 0.25rem;\n}\n\n.notch {\n flex-shrink: 0;\n\n position: relative;\n z-index: 2;\n\n border-top-width: 0;\n border-right-width: 0;\n border-left-width: 0;\n\n max-width: calc(100% - 1.5rem);\n}\n\n.trailing-outline {\n flex-grow: 1;\n border-left-width: 0;\n border-top-right-radius: 0.25rem;\n border-bottom-right-radius: 0.25rem;\n}\n\nlabel {\n transform: translateY(-50%);\n\n @include mixins.truncate-text;\n display: block;\n padding: 0 0.25rem;\n\n color: var(--limel-text-editor-label-color);\n font-size: 0.65rem; // `10.4px` similar to MDC's floating label\n letter-spacing: var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);\n\n :host(limel-text-editor[required]:not([required='false'])) & {\n &::after {\n content: '*';\n }\n }\n}\n\n.placeholder {\n transition-property: top;\n transition-duration: var(\n --limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration\n );\n transition-timing-function: var(\n --limel-prosemirror-adapter-toolbar-transition-timing-function\n );\n @include mixins.truncate-text;\n pointer-events: none;\n position: absolute;\n top: var(--limel-text-editor-placeholder-top, 2.25rem);\n left: 0;\n right: 0;\n\n padding: var(--limel-text-editor-padding);\n font-style: italic;\n font-size: 0.875rem;\n color: shared_input-select-picker.$input-placeholder-color;\n}\n\nlimel-prosemirror-adapter {\n flex-grow: 1;\n\n min-width: 0;\n min-height: 0;\n height: 100%;\n overflow: hidden auto;\n}\n\n@include mixins.hide-helper-line-when-not-needed(limel-text-editor);\n:host(limel-text-editor.has-helper-text:focus-within),\n:host(limel-text-editor.has-helper-text[invalid]:not([invalid='false'])) {\n .notched-outline {\n --limel-text-editor-notched-outline-bottom: 1rem;\n }\n}\n\n:host(limel-text-editor[allow-resize]) {\n limel-prosemirror-adapter {\n resize: vertical;\n }\n}\n","import { Component, Event, EventEmitter, Host, Prop, h } from '@stencil/core';\nimport { FormComponent } from '../form/form.types';\nimport { Languages } from '../date-picker/date.types';\nimport { createRandomString } from '../../util/random-string';\nimport { CustomElementDefinition } from '../../global/shared-types/custom-element.types';\nimport { TriggerCharacter, TriggerEventDetail } from './text-editor.types';\nimport { EditorUiType } from './types';\n\n/**\n * A rich text editor that offers a rich text editing experience with markdown support,\n * in the sense that you can easily type markdown syntax and see the rendered\n * result as rich text in real-time. For instance, you can type `# Hello, world!`\n * and see it directly turning to a heading 1 (an `<h1>` HTML element).\n *\n * Naturally, you can use standard keyboard hotkeys such as <kbd>Ctrl</kbd> + <kbd>B</kbd>\n * to toggle bold text, <kbd>Ctrl</kbd> + <kbd>I</kbd> to toggle italic text, and so on.\n *\n * @exampleComponent limel-example-text-editor-basic\n * @exampleComponent limel-example-text-editor-as-form-component\n * @exampleComponent limel-example-text-editor-with-markdown\n * @exampleComponent limel-example-text-editor-with-html\n * @exampleComponent limel-example-text-editor-with-tables\n * @exampleComponent limel-example-text-editor-allow-resize\n * @exampleComponent limel-example-text-editor-size\n * @exampleComponent limel-example-text-editor-ui\n * @exampleComponent limel-example-text-editor-custom-element\n * @exampleComponent limel-example-text-editor-triggers\n * @exampleComponent limel-example-text-editor-composite\n * @beta\n */\n@Component({\n tag: 'limel-text-editor',\n shadow: { delegatesFocus: true },\n styleUrl: 'text-editor.scss',\n})\nexport class TextEditor implements FormComponent<string> {\n /** The type of content that the editor should handle and emit, defaults to `markdown`\n *\n * Assumed to be set only once, so not reactive to changes\n */\n @Prop()\n public contentType: 'markdown' | 'html' = 'markdown';\n\n /**\n * Defines the language for translations.\n */\n @Prop({ reflect: true })\n public language: Languages = 'en';\n\n /**\n * Set to `true` to disable the field.\n * Use `disabled` to indicate that the field can normally be interacted\n * with, but is currently disabled. This tells the user that if certain\n * requirements are met, the field may become enabled again.\n */\n @Prop({ reflect: true })\n public disabled?: boolean = false;\n\n /**\n * Set to `true` to make the component read-only.\n * Use `readonly` when the field is only there to present the data it holds,\n * and will not become possible for the current user to edit.\n * :::note\n * Consider that it might be better to use `limel-markdown`\n * instead of `limel-text-editor` when the goal is visualizing data.\n * :::\n */\n @Prop({ reflect: true })\n public readonly?: boolean = false;\n\n /**\n * Optional helper text to display below the input field when it has focus\n */\n @Prop({ reflect: true })\n public helperText?: string;\n\n /**\n * The placeholder text shown inside the input field,\n * when the field is empty.\n */\n @Prop({ reflect: true })\n public placeholder?: string;\n\n /**\n * The label of the editor\n */\n @Prop({ reflect: true })\n public label?: string;\n\n /**\n * Set to `true` to indicate that the current value of the editor is\n * invalid.\n */\n @Prop({ reflect: true })\n public invalid?: boolean = false;\n\n /**\n * Description of the text inside the editor as markdown\n */\n @Prop({ reflect: true })\n public value: string;\n\n /**\n * A list of custom elements\n *\n * Any `CustomElement` that should be used inside the text editor needs\n * to be defined here.\n *\n * @private\n * @alpha\n */\n @Prop()\n public customElements: CustomElementDefinition[] = [];\n\n /**\n * A set of trigger characters\n *\n * Defining a character here will enable trigger events to be sent if the\n * character is detected in the editor.\n *\n * @private\n * @alpha\n */\n @Prop()\n public triggers: TriggerCharacter[] = [];\n\n /**\n * Set to `true` to indicate that the field is required.\n *\n * :::important\n * An empty but required field is not automatically considered invalid.\n * You must make sure to check the validity of the field on your own,\n * and properly handle the `invalid` state.\n * :::\n */\n @Prop({ reflect: true })\n public required?: boolean = false;\n\n /**\n * Set to `true` to allow the user to vertically resize the editor.\n * Set to `false` to disable the resize functionality.\n */\n @Prop({ reflect: true })\n public allowResize: boolean = true;\n\n /**\n * Specifies the visual appearance of the editor.\n *\n * - `standard`: The default editor appearance with a full toolbar and\n * standard layout.\n * - `minimal`: A compact editor appearance, ideal for limited space\n * scenarios such as mobile devices. In this mode, the toolbar is hidden\n * until the editor is focused.\n */\n @Prop({ reflect: true })\n public ui?: EditorUiType = 'standard';\n\n /**\n * Dispatched when a change is made to the editor\n */\n @Event()\n public change: EventEmitter<string>;\n\n /**\n * Dispatched if a trigger character is detected.\n *\n * @private\n * @alpha\n */\n @Event()\n public triggerStart: EventEmitter<TriggerEventDetail>;\n\n /**\n * Dispatched if a trigger session is ended. That is if the selection\n * goes outside the trigger input or if something is inserted using the\n * supplied `TextEditor` insert function.\n *\n * @private\n * @alpha\n */\n @Event()\n public triggerStop: EventEmitter<TriggerEventDetail>;\n\n /**\n * Dispatched if a input is changed during an active trigger.\n *\n * @private\n * @alpha\n */\n @Event()\n public triggerChange: EventEmitter<TriggerEventDetail>;\n\n private helperTextId: string;\n private editorId: string;\n\n public constructor() {\n this.helperTextId = createRandomString();\n this.editorId = createRandomString();\n }\n\n public render() {\n return (\n <Host\n class={{\n 'has-helper-text': !!this.helperText,\n }}\n >\n <span class=\"notched-outline\">\n <span class=\"leading-outline\" />\n {this.renderLabel()}\n <span class=\"trailing-outline\" />\n </span>\n {this.renderEditor()}\n </Host>\n );\n }\n\n private renderEditor() {\n if (this.readonly && !this.value) {\n return [\n <span class=\"lime-looks-like-input-value\">–</span>,\n this.renderHelperLine(),\n ];\n }\n\n if (this.readonly) {\n return [\n <limel-markdown\n value={this.value}\n aria-controls={this.helperTextId}\n id={this.editorId}\n />,\n this.renderPlaceholder(),\n this.renderHelperLine(),\n ];\n }\n\n return [\n <limel-prosemirror-adapter\n aria-placeholder={this.placeholder}\n contentType={this.contentType}\n onChange={this.handleChange}\n customElements={this.customElements}\n value={this.value}\n aria-controls={this.helperTextId}\n id={this.editorId}\n aria-disabled={this.disabled}\n language={this.language}\n triggerCharacters={this.triggers}\n disabled={this.disabled}\n />,\n this.renderPlaceholder(),\n this.renderHelperLine(),\n ];\n }\n\n private renderLabel() {\n if (!this.label) {\n return;\n }\n\n return (\n <span class=\"notch\">\n <label htmlFor={this.editorId}>{this.label}</label>\n </span>\n );\n }\n\n private renderPlaceholder() {\n if (!this.placeholder || this.value) {\n return;\n }\n\n return (\n <span class=\"placeholder\" aria-hidden=\"true\">\n {this.placeholder}\n </span>\n );\n }\n\n private renderHelperLine = () => {\n if (!this.helperText) {\n return;\n }\n\n return (\n <limel-helper-line\n helperText={this.helperText}\n helperTextId={this.helperTextId}\n invalid={this.isInvalid()}\n />\n );\n };\n\n private isInvalid = () => {\n if (this.readonly) {\n // A readonly field can never be invalid.\n return false;\n }\n\n if (this.invalid) {\n return true;\n }\n };\n\n private handleChange = (event: CustomEvent<string>) => {\n event.stopPropagation();\n this.change.emit(event.detail);\n };\n}\n"],"version":3}
|
|
1
|
+
{"file":"limel-text-editor.entry.cjs.js","mappings":"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","names":["h","createRandomString","Host"],"sources":["./src/components/text-editor/text-editor.scss?tag=limel-text-editor&encapsulation=shadow","./src/components/text-editor/text-editor.tsx"],"sourcesContent":["@use '../../style/internal/shared_input-select-picker';\n@use '../../style/mixins.scss';\n\n/**\n * @prop --text-editor-max-height: the tallest height the text editor can become when auto-resizing itself. Defaults to `calc(100vh - (env(safe-area-inset-top) + env(safe-area-inset-bottom)) - 4rem)`.\n * @prop --text-editor-fade-out-background-color: the color of the fade-out effect at the top and bottom of the text editor, when the text-editor is in readonly state. Defaults to rgb(var(--contrast-100)).\n */\n\n@include shared_input-select-picker.lime-looks-like-input-value;\n.lime-looks-like-input-value {\n padding: var(--limel-text-editor-padding);\n}\n\n* {\n box-sizing: border-box;\n}\n\n:host(limel-text-editor) {\n --limel-text-editor-outline-color: #{shared_input-select-picker.$lime-text-field-outline-color};\n --limel-text-editor-background-color: #{shared_input-select-picker.$background-color-normal};\n --limel-text-editor-label-color: #{shared_input-select-picker.$label-color};\n --limel-prosemirror-adapter-toolbar-opacity: 0.6;\n --limel-text-editor-padding: 0.25rem 1rem 0.75rem 1rem;\n --limel-prosemirror-adapter-toolbar-grid-template-rows: 1fr;\n --limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration: 0.3s;\n --limel-prosemirror-adapter-toolbar-transition-timing-function: cubic-bezier(\n 0.19,\n 0.23,\n 0.26,\n 0.89\n );\n\n position: relative;\n isolation: isolate;\n display: flex;\n flex-direction: column;\n\n width: 100%;\n min-width: 5rem;\n min-height: 5rem;\n height: 100%;\n max-height: var(\n --text-editor-max-height,\n calc(\n 100vh - (env(safe-area-inset-top) + env(safe-area-inset-bottom)) -\n 4rem\n )\n );\n padding: 1px; // prevents visual defects that can appear due to the backdrop-filter and closeness to borders\n}\n\n:host(limel-text-editor:focus-within),\n:host(limel-text-editor:not([ui='minimal']):hover) {\n --limel-prosemirror-adapter-toolbar-opacity: 1;\n}\n\n:host(limel-text-editor[ui='minimal']:not(:focus-within)) {\n --limel-text-editor-padding: 0.75rem 1rem 0.75rem 1rem;\n --limel-prosemirror-adapter-toolbar-grid-template-rows: 0fr;\n --limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration: 0.46s;\n --limel-prosemirror-adapter-action-bar-padding-top-bottom: 0;\n --limel-prosemirror-adapter-toolbar-opacity: 0;\n --limel-text-editor-placeholder-top: 0;\n min-height: 2.5rem;\n}\n\n:host(limel-text-editor:hover) {\n --limel-text-editor-outline-color: #{shared_input-select-picker.$lime-text-field-outline-color--hovered};\n}\n\n:host(limel-text-editor:focus-within) {\n --limel-text-editor-outline-color: #{shared_input-select-picker.$lime-text-field-outline-color--focused};\n}\n\n:host(limel-text-editor:focus-within),\n:host(limel-text-editor:focus) {\n .placeholder {\n opacity: 0;\n }\n}\n\n:host(limel-text-editor[disabled]:not([disabled='false'])) {\n @include shared_input-select-picker.looks-disabled;\n\n limel-prosemirror-adapter {\n pointer-events: none;\n }\n}\n\n:host(limel-text-editor[invalid]:not([invalid='false'])) {\n --limel-text-editor-outline-color: var(--lime-error-text-color);\n}\n\n:host(limel-text-editor[readonly]:not([readonly='false'])) {\n --limel-text-editor-padding: 0.75rem 1rem 0.75rem 1rem;\n --limel-text-editor-placeholder-top: 0;\n --limel-text-editor-outline-color: transparent;\n --limel-text-editor-background-color: transparent;\n\n limel-markdown {\n // displayed when `readonly` instead of the adapter\n display: block;\n padding: var(--limel-text-editor-padding);\n overflow-y: auto;\n\n &:before,\n &:after {\n z-index: 1;\n pointer-events: none;\n content: '';\n display: block;\n position: absolute;\n width: 100%;\n }\n &:after {\n height: 1.75rem;\n top: 0;\n background: linear-gradient(\n var(\n --text-editor-fade-out-background-color,\n rgb(var(--contrast-100))\n ),\n transparent\n );\n }\n\n &:before {\n height: 2rem;\n bottom: -0.25rem;\n background: linear-gradient(\n transparent,\n var(\n --text-editor-fade-out-background-color,\n rgb(var(--contrast-100))\n )\n );\n }\n }\n}\n\n.notched-outline {\n transition: bottom\n var(--limel-h-l-grid-template-rows-transition-speed, 0.46s)\n cubic-bezier(1, 0.09, 0, 0.89);\n pointer-events: none;\n position: absolute;\n inset: 0;\n bottom: var(--limel-text-editor-notched-outline-bottom, 0);\n\n display: flex;\n background-color: var(--limel-text-editor-background-color);\n}\n\n.leading-outline,\n.notch,\n.trailing-outline {\n transition: border-color 0.2s ease;\n border-width: 1px;\n border-style: solid;\n border-color: var(--limel-text-editor-outline-color);\n}\n\n.leading-outline {\n flex-shrink: 0;\n width: 0.75rem;\n border-right-width: 0;\n border-top-left-radius: 0.25rem;\n border-bottom-left-radius: 0.25rem;\n}\n\n.notch {\n flex-shrink: 0;\n\n position: relative;\n z-index: 2;\n\n border-top-width: 0;\n border-right-width: 0;\n border-left-width: 0;\n\n max-width: calc(100% - 1.5rem);\n}\n\n.trailing-outline {\n flex-grow: 1;\n border-left-width: 0;\n border-top-right-radius: 0.25rem;\n border-bottom-right-radius: 0.25rem;\n}\n\nlabel {\n transform: translateY(-50%);\n\n @include mixins.truncate-text;\n display: block;\n padding: 0 0.25rem;\n\n color: var(--limel-text-editor-label-color);\n font-size: 0.65rem; // `10.4px` similar to MDC's floating label\n letter-spacing: var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);\n\n :host(limel-text-editor[required]:not([required='false'])) & {\n &::after {\n content: '*';\n }\n }\n}\n\n.placeholder {\n transition-property: top;\n transition-duration: var(\n --limel-prosemirror-adapter-toolbar-grid-template-rows-transition-duration\n );\n transition-timing-function: var(\n --limel-prosemirror-adapter-toolbar-transition-timing-function\n );\n @include mixins.truncate-text;\n pointer-events: none;\n position: absolute;\n top: var(--limel-text-editor-placeholder-top, 2.25rem);\n left: 0;\n right: 0;\n\n padding: var(--limel-text-editor-padding);\n font-style: italic;\n font-size: 0.875rem;\n color: shared_input-select-picker.$input-placeholder-color;\n}\n\nlimel-prosemirror-adapter {\n flex-grow: 1;\n\n min-width: 0;\n min-height: 0;\n height: 100%;\n overflow: hidden auto;\n}\n\n@include mixins.hide-helper-line-when-not-needed(limel-text-editor);\n:host(limel-text-editor.has-helper-text:focus-within),\n:host(limel-text-editor.has-helper-text[invalid]:not([invalid='false'])) {\n .notched-outline {\n --limel-text-editor-notched-outline-bottom: 1rem;\n }\n}\n\n:host(limel-text-editor[allow-resize]) {\n limel-prosemirror-adapter {\n resize: vertical;\n }\n}\n","import { Component, Event, EventEmitter, Host, Prop, h } from '@stencil/core';\nimport { FormComponent } from '../form/form.types';\nimport { Languages } from '../date-picker/date.types';\nimport { createRandomString } from '../../util/random-string';\nimport { CustomElementDefinition } from '../../global/shared-types/custom-element.types';\nimport { TriggerCharacter, TriggerEventDetail } from './text-editor.types';\nimport { EditorUiType } from './types';\n\n/**\n * A rich text editor that offers a rich text editing experience with markdown support,\n * in the sense that you can easily type markdown syntax and see the rendered\n * result as rich text in real-time. For instance, you can type `# Hello, world!`\n * and see it directly turning to a heading 1 (an `<h1>` HTML element).\n *\n * Naturally, you can use standard keyboard hotkeys such as <kbd>Ctrl</kbd> + <kbd>B</kbd>\n * to toggle bold text, <kbd>Ctrl</kbd> + <kbd>I</kbd> to toggle italic text, and so on.\n *\n * @exampleComponent limel-example-text-editor-basic\n * @exampleComponent limel-example-text-editor-as-form-component\n * @exampleComponent limel-example-text-editor-with-markdown\n * @exampleComponent limel-example-text-editor-with-html\n * @exampleComponent limel-example-text-editor-with-tables\n * @exampleComponent limel-example-text-editor-allow-resize\n * @exampleComponent limel-example-text-editor-size\n * @exampleComponent limel-example-text-editor-ui\n * @exampleComponent limel-example-text-editor-custom-element\n * @exampleComponent limel-example-text-editor-triggers\n * @exampleComponent limel-example-text-editor-composite\n * @beta\n */\n@Component({\n tag: 'limel-text-editor',\n shadow: { delegatesFocus: true },\n styleUrl: 'text-editor.scss',\n})\nexport class TextEditor implements FormComponent<string> {\n /** The type of content that the editor should handle and emit, defaults to `markdown`\n *\n * Assumed to be set only once, so not reactive to changes\n */\n @Prop()\n public contentType: 'markdown' | 'html' = 'markdown';\n\n /**\n * Defines the language for translations.\n */\n @Prop({ reflect: true })\n public language: Languages = 'en';\n\n /**\n * Set to `true` to disable the field.\n * Use `disabled` to indicate that the field can normally be interacted\n * with, but is currently disabled. This tells the user that if certain\n * requirements are met, the field may become enabled again.\n */\n @Prop({ reflect: true })\n public disabled?: boolean = false;\n\n /**\n * Set to `true` to make the component read-only.\n * Use `readonly` when the field is only there to present the data it holds,\n * and will not become possible for the current user to edit.\n * :::note\n * Consider that it might be better to use `limel-markdown`\n * instead of `limel-text-editor` when the goal is visualizing data.\n * :::\n */\n @Prop({ reflect: true })\n public readonly?: boolean = false;\n\n /**\n * Optional helper text to display below the input field when it has focus\n */\n @Prop({ reflect: true })\n public helperText?: string;\n\n /**\n * The placeholder text shown inside the input field,\n * when the field is empty.\n */\n @Prop({ reflect: true })\n public placeholder?: string;\n\n /**\n * The label of the editor\n */\n @Prop({ reflect: true })\n public label?: string;\n\n /**\n * Set to `true` to indicate that the current value of the editor is\n * invalid.\n */\n @Prop({ reflect: true })\n public invalid?: boolean = false;\n\n /**\n * Description of the text inside the editor as markdown\n */\n @Prop({ reflect: true })\n public value: string;\n\n /**\n * A list of custom elements\n *\n * Any `CustomElement` that should be used inside the text editor needs\n * to be defined here.\n *\n * @private\n * @alpha\n */\n @Prop()\n public customElements: CustomElementDefinition[] = [];\n\n /**\n * A set of trigger characters\n *\n * Defining a character here will enable trigger events to be sent if the\n * character is detected in the editor.\n *\n * @private\n * @alpha\n */\n @Prop()\n public triggers: TriggerCharacter[] = [];\n\n /**\n * Set to `true` to indicate that the field is required.\n *\n * :::important\n * An empty but required field is not automatically considered invalid.\n * You must make sure to check the validity of the field on your own,\n * and properly handle the `invalid` state.\n * :::\n */\n @Prop({ reflect: true })\n public required?: boolean = false;\n\n /**\n * Set to `true` to allow the user to vertically resize the editor.\n * Set to `false` to disable the resize functionality.\n */\n @Prop({ reflect: true })\n public allowResize: boolean = true;\n\n /**\n * Specifies the visual appearance of the editor.\n *\n * - `standard`: The default editor appearance with a full toolbar and\n * standard layout.\n * - `minimal`: A compact editor appearance, ideal for limited space\n * scenarios such as mobile devices. In this mode, the toolbar is hidden\n * until the editor is focused.\n */\n @Prop({ reflect: true })\n public ui?: EditorUiType = 'standard';\n\n /**\n * Dispatched when a change is made to the editor\n */\n @Event()\n public change: EventEmitter<string>;\n\n /**\n * Dispatched if a trigger character is detected.\n *\n * @private\n * @alpha\n */\n @Event()\n public triggerStart: EventEmitter<TriggerEventDetail>;\n\n /**\n * Dispatched if a trigger session is ended. That is if the selection\n * goes outside the trigger input or if something is inserted using the\n * supplied `TextEditor` insert function.\n *\n * @private\n * @alpha\n */\n @Event()\n public triggerStop: EventEmitter<TriggerEventDetail>;\n\n /**\n * Dispatched if a input is changed during an active trigger.\n *\n * @private\n * @alpha\n */\n @Event()\n public triggerChange: EventEmitter<TriggerEventDetail>;\n\n private helperTextId: string;\n private editorId: string;\n\n public constructor() {\n this.helperTextId = createRandomString();\n this.editorId = createRandomString();\n }\n\n public render() {\n return (\n <Host\n class={{\n 'has-helper-text': !!this.helperText,\n }}\n >\n <span class=\"notched-outline\">\n <span class=\"leading-outline\" />\n {this.renderLabel()}\n <span class=\"trailing-outline\" />\n </span>\n {this.renderEditor()}\n </Host>\n );\n }\n\n private renderEditor() {\n if (this.readonly && !this.value) {\n return [\n <span class=\"lime-looks-like-input-value\">–</span>,\n this.renderHelperLine(),\n ];\n }\n\n if (this.readonly) {\n return [\n <limel-markdown\n value={this.value}\n aria-controls={this.helperTextId}\n id={this.editorId}\n />,\n this.renderPlaceholder(),\n this.renderHelperLine(),\n ];\n }\n\n return [\n <limel-prosemirror-adapter\n aria-placeholder={this.placeholder}\n contentType={this.contentType}\n onChange={this.handleChange}\n customElements={this.customElements}\n value={this.value}\n aria-controls={this.helperTextId}\n id={this.editorId}\n aria-disabled={this.disabled}\n language={this.language}\n triggerCharacters={this.triggers}\n disabled={this.disabled}\n />,\n this.renderPlaceholder(),\n this.renderHelperLine(),\n ];\n }\n\n private renderLabel() {\n if (!this.label) {\n return;\n }\n\n return (\n <span class=\"notch\">\n <label htmlFor={this.editorId}>{this.label}</label>\n </span>\n );\n }\n\n private renderPlaceholder() {\n if (!this.placeholder || this.value) {\n return;\n }\n\n return (\n <span class=\"placeholder\" aria-hidden=\"true\">\n {this.placeholder}\n </span>\n );\n }\n\n private renderHelperLine = () => {\n if (!this.helperText) {\n return;\n }\n\n return (\n <limel-helper-line\n helperText={this.helperText}\n helperTextId={this.helperTextId}\n invalid={this.isInvalid()}\n />\n );\n };\n\n private isInvalid = () => {\n if (this.readonly) {\n // A readonly field can never be invalid.\n return false;\n }\n\n if (this.invalid) {\n return true;\n }\n };\n\n private handleChange = (event: CustomEvent<string>) => {\n event.stopPropagation();\n this.change.emit(event.detail);\n };\n}\n"],"version":3}
|
|
@@ -888,9 +888,7 @@ limel-dynamic-label {
|
|
|
888
888
|
*/
|
|
889
889
|
:host(limel-checkbox:focus),
|
|
890
890
|
:host(limel-checkbox:focus-visible),
|
|
891
|
-
:host(limel-checkbox:focus-within)
|
|
892
|
-
:host(limel-checkbox[invalid]:not([invalid=false])),
|
|
893
|
-
:host(limel-checkbox[invalid=true]) {
|
|
891
|
+
:host(limel-checkbox:focus-within) {
|
|
894
892
|
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
895
893
|
--limel-h-l-grid-template-rows: 1fr;
|
|
896
894
|
}
|
|
@@ -2209,9 +2209,7 @@ limel-chip.can-be-removed {
|
|
|
2209
2209
|
*/
|
|
2210
2210
|
:host(limel-chip-set:focus),
|
|
2211
2211
|
:host(limel-chip-set:focus-visible),
|
|
2212
|
-
:host(limel-chip-set:focus-within)
|
|
2213
|
-
:host(limel-chip-set[invalid]:not([invalid=false])),
|
|
2214
|
-
:host(limel-chip-set[invalid=true]) {
|
|
2212
|
+
:host(limel-chip-set:focus-within) {
|
|
2215
2213
|
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
2216
2214
|
--limel-h-l-grid-template-rows: 1fr;
|
|
2217
2215
|
}
|
|
@@ -18,6 +18,10 @@ div {
|
|
|
18
18
|
padding: 0 1rem;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
+
:host(limel-helper-line.invalid) {
|
|
22
|
+
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
23
|
+
--limel-h-l-grid-template-rows: 1fr;
|
|
24
|
+
}
|
|
21
25
|
:host(limel-helper-line.invalid) .helper-text {
|
|
22
26
|
color: var(--mdc-theme-error);
|
|
23
27
|
}
|
|
@@ -351,9 +351,7 @@
|
|
|
351
351
|
|
|
352
352
|
:host(limel-input-field:focus),
|
|
353
353
|
:host(limel-input-field:focus-visible),
|
|
354
|
-
:host(limel-input-field:focus-within)
|
|
355
|
-
:host(limel-input-field[invalid]:not([invalid=false])),
|
|
356
|
-
:host(limel-input-field[invalid=true]) {
|
|
354
|
+
:host(limel-input-field:focus-within) {
|
|
357
355
|
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
358
356
|
--limel-h-l-grid-template-rows: 1fr;
|
|
359
357
|
}
|
|
@@ -68,8 +68,6 @@ export class InputField {
|
|
|
68
68
|
};
|
|
69
69
|
if (this.type === 'textarea') {
|
|
70
70
|
classList['mdc-text-field--textarea'] = true;
|
|
71
|
-
classList['has-helper-line'] =
|
|
72
|
-
!!this.helperText || !!this.maxlength;
|
|
73
71
|
}
|
|
74
72
|
else {
|
|
75
73
|
classList['mdc-text-field--with-leading-icon'] = !!this.leadingIcon;
|
|
@@ -145,18 +143,20 @@ export class InputField {
|
|
|
145
143
|
this.changeEmitter.flush();
|
|
146
144
|
};
|
|
147
145
|
this.hasHelperText = () => {
|
|
148
|
-
|
|
146
|
+
var _a;
|
|
147
|
+
return !!((_a = this.helperText) !== null && _a !== void 0 ? _a : this.validationMessage);
|
|
149
148
|
};
|
|
150
149
|
this.hasHelperLine = () => {
|
|
151
|
-
return this.maxlength || this.hasHelperText();
|
|
150
|
+
return this.maxlength > 0 || this.hasHelperText();
|
|
152
151
|
};
|
|
153
152
|
this.renderHelperLine = () => {
|
|
153
|
+
var _a;
|
|
154
154
|
const text = this.getCurrentValue() || '';
|
|
155
155
|
const length = text.length;
|
|
156
156
|
if (!this.hasHelperLine()) {
|
|
157
157
|
return;
|
|
158
158
|
}
|
|
159
|
-
return (h("limel-helper-line", { helperTextId: this.helperTextId, helperText: this.helperText, length: length, maxLength: this.maxlength, invalid: this.isInvalid() }));
|
|
159
|
+
return (h("limel-helper-line", { helperTextId: this.helperTextId, helperText: (_a = this.helperText) !== null && _a !== void 0 ? _a : this.validationMessage, length: length, maxLength: this.maxlength, invalid: this.isInvalid() }));
|
|
160
160
|
};
|
|
161
161
|
this.renderEmptyValueForReadonly = () => {
|
|
162
162
|
if (this.readonly && this.isEmpty()) {
|
|
@@ -548,6 +548,13 @@ export class InputField {
|
|
|
548
548
|
completionsWatcher() {
|
|
549
549
|
this.mapCompletions();
|
|
550
550
|
}
|
|
551
|
+
get validationMessage() {
|
|
552
|
+
var _a;
|
|
553
|
+
if (this.isInvalid() && !this.invalid) {
|
|
554
|
+
return ((_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.validationMessage) || '';
|
|
555
|
+
}
|
|
556
|
+
return '';
|
|
557
|
+
}
|
|
551
558
|
static get is() { return "limel-input-field"; }
|
|
552
559
|
static get encapsulation() { return "shadow"; }
|
|
553
560
|
static get originalStyleUrls() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-field.js","sourceRoot":"","sources":["../../../src/components/input-field/input-field.tsx"],"names":[],"mappings":"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","sourcesContent":["import { MDCTextField } from '@material/textfield';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { debounce } from 'lodash-es';\nimport {\n ARROW_DOWN,\n ARROW_DOWN_KEY_CODE,\n ARROW_UP,\n ARROW_UP_KEY_CODE,\n ENTER,\n ENTER_KEY_CODE,\n ESCAPE,\n ESCAPE_KEY_CODE,\n SPACE,\n SPACE_KEY_CODE,\n TAB,\n TAB_KEY_CODE,\n} from '../../util/keycodes';\nimport { InputType } from '../input-field/input-field.types';\nimport { ListItem } from '../list/list-item.types';\nimport { getHref, getTarget } from '../../util/link-helper';\nimport { JSXBase } from '@stencil/core/internal';\nimport { createRandomString } from '../../util/random-string';\nimport { LimelListCustomEvent } from '../../components';\nimport { globalConfig } from '../../global/config';\n\ninterface LinkProperties {\n href: string;\n target?: string;\n}\n\nconst CHANGE_EVENT_DEBOUNCE_TIMEOUT = 300;\nconst RESIZE_HANDLER_DEBOUNCE_TIMEOUT = 100;\n\n/**\n * @exampleComponent limel-example-input-field-text\n * @exampleComponent limel-example-input-field-placeholder\n * @exampleComponent limel-example-input-field-text-multiple\n * @exampleComponent limel-example-input-field-number\n * @exampleComponent limel-example-input-field-autocomplete\n * @exampleComponent limel-example-input-field-icon-leading\n * @exampleComponent limel-example-input-field-icon-trailing\n * @exampleComponent limel-example-input-field-icon-both\n * @exampleComponent limel-example-input-field-showlink\n * @exampleComponent limel-example-input-field-error-icon\n * @exampleComponent limel-example-input-field-textarea\n * @exampleComponent limel-example-input-field-suffix\n * @exampleComponent limel-example-input-field-prefix\n * @exampleComponent limel-example-input-field-search\n * @exampleComponent limel-example-input-field-pattern\n * @exampleComponent limel-example-input-field-focus\n */\n@Component({\n tag: 'limel-input-field',\n shadow: true,\n styleUrl: 'input-field.scss',\n})\nexport class InputField {\n /**\n * Set to `true` to disable the field.\n * Use `disabled` to indicate that the field can normally be interacted\n * with, but is currently disabled. This tells the user that if certain\n * requirements are met, the field may become enabled again.\n */\n @Prop({ reflect: true })\n public disabled = false;\n\n /**\n * Set to `true` to make the field read-only.\n * Use `readonly` when the field is only there to present the data it holds,\n * and will not become possible for the current user to edit.\n */\n @Prop({ reflect: true })\n public readonly = false;\n\n /**\n * Set to `true` to indicate that the current value of the input field is\n * invalid.\n */\n @Prop({ reflect: true })\n public invalid = false;\n\n /**\n * The input label.\n */\n @Prop({ reflect: true })\n public label: string;\n\n /**\n * The placeholder text shown inside the input field, when the field is focused and empty.\n */\n @Prop({ reflect: true })\n public placeholder: string;\n\n /**\n * Optional helper text to display below the input field when it has focus\n */\n @Prop({ reflect: true })\n public helperText: string;\n\n /**\n * A short piece of text to display before the value inside the input field.\n * Displayed for all types except `textarea`.\n */\n @Prop({ reflect: true })\n public prefix: string;\n\n /**\n * A short piece of text to display after the value inside the input field.\n * Displayed for all types except `textarea`.\n */\n @Prop({ reflect: true })\n public suffix: string;\n\n /**\n * Set to `true` to indicate that the field is required.\n */\n @Prop({ reflect: true })\n public required = false;\n\n /**\n * The value of the field.\n */\n @Prop({ reflect: true })\n public value: string;\n\n /**\n * Trailing icon to show to the far right in the field.\n */\n @Prop({ reflect: true })\n public trailingIcon: string;\n\n /**\n * Leading icon to show to the far left in the field.\n */\n @Prop({ reflect: true })\n public leadingIcon: string;\n\n /**\n * Regular expression that the current value of the input field must match.\n * No forward slashes should be specified around the pattern.\n * Only used if type is `text`, `tel`, `email`, `url`, `urlAsText`,\n * `password`, or `search`.\n */\n @Prop({ reflect: true })\n public pattern: string;\n\n /**\n * Type of input.\n *\n * Note** regarding type `url`: `limel-input` uses the native validation\n * built into the browser for many types of input fields. The native\n * validation for `url` is very strict, and does not allow relative urls,\n * nor any other formats that are not a \"fully qualified\" url. To allow\n * such urls, use the type `urlAsText` instead. `urlAsText` works exactly\n * like `text` in all regards, except that it enables use of the `showLink`\n * property.\n */\n @Prop({ reflect: true })\n public type: InputType = 'text';\n\n /**\n * Set to `true` to format the current value of the input field only\n * if the field is of type number.\n * The number format is determined by the current language of the browser.\n */\n @Prop({ reflect: true })\n public formatNumber = true;\n\n /**\n * Incremental values that are valid if the field type is `number`.\n */\n @Prop({ reflect: true })\n public step: number | 'any' = 'any';\n\n /**\n * Maximum allowed value if input type is `number`.\n */\n @Prop({ reflect: true })\n public max: number;\n\n /**\n * Minimum allowed value if input type is `number`.\n */\n @Prop({ reflect: true })\n public min: number;\n\n /**\n * Maximum length of the value if type is `password`, `search`, `tel`,\n * `text`, `url`, or `urlAsText`.\n */\n @Prop({ reflect: true })\n public maxlength: number;\n\n /**\n * Minimum length of the value if type is `password`, `search`, `tel`,\n * `text`, `url`, or `urlAsText`.\n */\n @Prop({ reflect: true })\n public minlength: number;\n\n /**\n * list of suggestions `value` can autocomplete to.\n */\n @Prop()\n public completions: string[] = [];\n\n /**\n * For inputs of type `email`, `tel`, `url`, and `urlAsText`, set this to\n * `true` to show a trailing icon with a `mailto:`,`tel:`, or normal link,\n * respectively. The default icon can be overridden using the `trailingIcon`\n * property.\n */\n @Prop({ reflect: true })\n public showLink = false;\n\n /**\n * The locale to use for formatting numbers.\n */\n @Prop({ reflect: true })\n public locale: string = globalConfig.defaultLocale;\n\n /**\n * Emitted when the input value is changed.\n */\n @Event()\n private change: EventEmitter<string>;\n\n /**\n * Emitted when `trailingIcon` or `leadingIcon` is set\n * and the icon is interacted with.\n */\n @Event()\n private action: EventEmitter<void>;\n\n @Element()\n private limelInputField: HTMLLimelInputFieldElement;\n\n @State()\n private isFocused: boolean = false;\n\n @State()\n private wasInvalid: boolean = false;\n\n @State()\n public showCompletions: boolean = false;\n\n private inputElement?: HTMLInputElement | HTMLTextAreaElement;\n private mdcTextField: MDCTextField;\n private completionsList: ListItem[] = [];\n private portalId: string;\n private helperTextId: string;\n private labelId: string;\n\n private changeWaiting = false;\n\n constructor() {\n this.portalId = createRandomString();\n this.helperTextId = createRandomString();\n this.labelId = createRandomString();\n }\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n public disconnectedCallback() {\n if (this.mdcTextField) {\n this.mdcTextField.destroy();\n }\n\n this.restyleCompletionsDropDown.cancel();\n window.removeEventListener('resize', this.layout);\n this.limelInputField.removeEventListener('focus', this.setFocus);\n }\n\n public componentDidUpdate() {\n if (this.invalid) {\n this.mdcTextField.valid = false;\n }\n\n this.mdcTextField.disabled = this.disabled || this.readonly;\n }\n\n public render() {\n const properties = this.getAdditionalProps();\n properties['aria-labelledby'] = this.labelId;\n properties.class = 'mdc-text-field__input';\n properties.ref = this.setInputElement;\n properties.onInput = this.handleInput;\n properties.onChange = this.handleChange;\n properties.onFocus = this.onFocus;\n properties.onBlur = this.onBlur;\n properties.required = this.required;\n properties.readonly = this.readonly;\n properties.disabled = this.disabled || this.readonly;\n\n let ariaControls = '';\n\n if (this.hasHelperText()) {\n ariaControls += this.helperTextId;\n properties['aria-describedby'] = this.helperTextId;\n }\n\n if (this.renderAutocompleteList()) {\n if (ariaControls) {\n ariaControls += ' ';\n }\n\n ariaControls += this.portalId;\n }\n\n if (ariaControls) {\n properties['aria-controls'] = ariaControls;\n }\n\n return [\n <label class={this.getContainerClassList()}>\n <span class=\"mdc-notched-outline\" tabindex=\"-1\">\n <span class=\"mdc-notched-outline__leading\"></span>\n {this.renderLabel()}\n <span class=\"mdc-notched-outline__trailing\"></span>\n </span>\n {this.renderLeadingIcon()}\n {this.renderEmptyValueForReadonly()}\n {this.renderPrefix()}\n {this.renderFormattedNumber()}\n {this.renderInput(properties)}\n {this.renderSuffix()}\n {this.renderTextarea(properties)}\n {this.renderTrailingLinkOrButton()}\n </label>,\n this.renderHelperLine(),\n this.renderAutocompleteList(),\n ];\n }\n\n @Watch('value')\n protected valueWatcher(newValue: string) {\n if (!this.mdcTextField) {\n return;\n }\n\n if (this.changeWaiting) {\n return;\n }\n\n if (\n this.type === 'number' &&\n this.isFocused &&\n Number(newValue) === Number(this.mdcTextField.value)\n ) {\n return;\n }\n\n if (newValue !== this.mdcTextField.value) {\n this.mdcTextField.value = newValue || '';\n }\n\n if (this.wasInvalid) {\n this.validate();\n }\n }\n\n @Watch('completions')\n protected completionsWatcher() {\n this.mapCompletions();\n }\n\n private initialize = () => {\n const element =\n this.limelInputField.shadowRoot.querySelector('.mdc-text-field');\n if (!element) {\n return;\n }\n\n this.mdcTextField = new MDCTextField(element);\n if (this.value) {\n this.mdcTextField.value = this.value;\n }\n\n if (this.invalid) {\n this.mdcTextField.valid = false;\n }\n\n this.mapCompletions();\n\n window.addEventListener('resize', this.layout, { passive: true });\n this.limelInputField.addEventListener('focus', this.setFocus);\n };\n\n private mapCompletions = () => {\n this.completionsList = [...this.completions].map((item) => {\n return { text: item };\n });\n };\n\n private setFocus = () => {\n this.mdcTextField.focus();\n };\n\n private getContainerClassList = () => {\n const classList = {\n 'mdc-text-field': true,\n 'mdc-text-field--no-label': !this.label,\n 'mdc-text-field--outlined': true,\n 'mdc-text-field--invalid': this.isInvalid(),\n 'mdc-text-field--disabled': this.disabled || this.readonly,\n 'lime-text-field--readonly': this.readonly,\n 'mdc-text-field--required': this.required,\n 'lime-text-field--empty': this.isEmpty(),\n 'lime-has-prefix': this.hasPrefix(),\n 'lime-has-suffix': this.hasSuffix(),\n };\n\n if (this.type === 'textarea') {\n classList['mdc-text-field--textarea'] = true;\n classList['has-helper-line'] =\n !!this.helperText || !!this.maxlength;\n } else {\n classList['mdc-text-field--with-leading-icon'] = !!this.leadingIcon;\n classList['mdc-text-field--with-trailing-icon'] =\n !!this.getTrailingIcon();\n }\n\n return classList;\n };\n\n private isEmpty = () => {\n if (this.type === 'number' && this.inputElement?.validity.badInput) {\n return false;\n }\n\n return !this.getCurrentValue();\n };\n\n private getCurrentValue = () => {\n if (this.changeWaiting && this.inputElement) {\n return this.inputElement.value;\n }\n\n return this.value;\n };\n\n private renderInput = (\n properties: JSXBase.InputHTMLAttributes<HTMLInputElement>,\n ) => {\n if (this.type === 'textarea') {\n return;\n }\n\n const type = this.type === 'urlAsText' ? 'text' : this.type;\n\n return (\n <input\n {...properties}\n type={type}\n pattern={this.pattern}\n onWheel={this.handleWheel}\n onKeyDown={this.onKeyDown}\n placeholder={this.placeholder}\n />\n );\n };\n\n private renderTextarea = (\n properties: JSXBase.TextareaHTMLAttributes<HTMLTextAreaElement>,\n ) => {\n if (this.type !== 'textarea') {\n return;\n }\n\n return (\n <span class=\"mdc-text-field__resizer\">\n <textarea\n {...properties}\n placeholder={this.placeholder}\n ></textarea>\n </span>\n );\n };\n\n private layout = () => {\n this.mdcTextField?.layout();\n this.restyleCompletionsDropDown();\n };\n\n private restyleCompletionsDropDown = debounce(() => {\n const stateOfShowCompletions = this.showCompletions;\n this.showCompletions = false;\n requestAnimationFrame(() => {\n this.showCompletions = stateOfShowCompletions;\n });\n }, RESIZE_HANDLER_DEBOUNCE_TIMEOUT);\n\n private getAdditionalProps = () => {\n const props: any = {};\n\n if (this.type === 'number') {\n props.step = this.step;\n }\n\n if (this.type === 'number' && Number.isInteger(this.min)) {\n props.min = this.min;\n }\n\n if (this.type === 'number' && Number.isInteger(this.max)) {\n props.max = this.max;\n }\n\n if (this.minlength) {\n props.minlength = this.minlength;\n }\n\n if (this.maxlength) {\n props.maxlength = this.maxlength;\n }\n\n return props;\n };\n\n private onFocus = () => {\n this.isFocused = true;\n this.showCompletions = true;\n };\n\n private onBlur = () => {\n this.isFocused = false;\n this.validate();\n this.changeEmitter.flush();\n };\n\n private hasHelperText = () => {\n return this.helperText !== null && this.helperText !== undefined;\n };\n\n private hasHelperLine = () => {\n return this.maxlength || this.hasHelperText();\n };\n\n private renderHelperLine = () => {\n const text: string = this.getCurrentValue() || '';\n const length = text.length;\n\n if (!this.hasHelperLine()) {\n return;\n }\n\n return (\n <limel-helper-line\n helperTextId={this.helperTextId}\n helperText={this.helperText}\n length={length}\n maxLength={this.maxlength}\n invalid={this.isInvalid()}\n />\n );\n };\n\n private renderEmptyValueForReadonly = () => {\n if (this.readonly && this.isEmpty()) {\n return (\n <span class=\"lime-empty-value-for-readonly lime-looks-like-input-value\">\n –\n </span>\n );\n }\n };\n\n private renderSuffix = () => {\n if (!this.hasSuffix() || this.type === 'textarea') {\n return;\n }\n\n const classList = {\n 'mdc-text-field__affix': true,\n 'mdc-text-field__affix--suffix': true,\n };\n\n return <span class={classList}>{this.suffix}</span>;\n };\n\n private hasSuffix = () => {\n return this.suffix !== null && this.suffix !== undefined;\n };\n\n private renderPrefix = () => {\n if (!this.hasPrefix() || this.type === 'textarea') {\n return;\n }\n\n const classList = {\n 'mdc-text-field__affix': true,\n 'mdc-text-field__affix--prefix': true,\n };\n\n return <span class={classList}>{this.prefix}</span>;\n };\n\n private hasPrefix = () => {\n return this.prefix !== null && this.prefix !== undefined;\n };\n\n private isInvalid = () => {\n if (this.readonly) {\n // A readonly field can never be invalid.\n return false;\n }\n\n if (this.invalid) {\n // `this.invalid` is set by the consumer. If the consumer explicitly\n // told us to consider the field invalid, we consider it invalid\n // regardless of what our internal validation thinks, and regardless\n // of whether the field has been modified.\n return true;\n }\n\n return this.wasInvalid;\n };\n\n private validate = () => {\n if (this.readonly || this.invalid) {\n this.wasInvalid = false;\n\n return;\n }\n\n if (this.inputElement) {\n this.wasInvalid = !this.inputElement.checkValidity();\n }\n };\n\n private setInputElement = (\n element?: HTMLInputElement | HTMLTextAreaElement,\n ) => {\n if (element) {\n this.inputElement = element;\n }\n };\n\n private renderLabel = () => {\n const labelClassList = {\n 'mdc-floating-label': true,\n 'mdc-floating-label--float-above':\n !this.isEmpty() || this.isFocused || this.readonly,\n };\n\n if (!this.label) {\n return;\n }\n\n return (\n <span class=\"mdc-notched-outline__notch\">\n <span class={labelClassList} id={this.labelId}>\n {this.label}\n </span>\n </span>\n );\n };\n\n private renderLeadingIcon = () => {\n if (this.type === 'textarea') {\n return;\n }\n\n if (this.leadingIcon) {\n return (\n <i class=\"material-icons mdc-text-field__icon mdc-text-field__icon--leading\">\n <limel-icon name={this.leadingIcon} />\n </i>\n );\n }\n };\n\n private renderTrailingLinkOrButton = () => {\n if (this.type === 'textarea') {\n return;\n }\n\n const trailingIcon = this.getTrailingIcon();\n\n if (!this.isInvalid() && this.hasLink()) {\n return this.renderLinkIcon(this.getLink(), trailingIcon);\n } else if (trailingIcon) {\n return this.renderTrailingIcon(trailingIcon);\n }\n };\n\n private hasLink = () => {\n return (\n this.showLink &&\n ['email', 'tel', 'url', 'urlAsText'].includes(this.type)\n );\n };\n\n private getLink = () => {\n const props: LinkProperties = { href: '' };\n switch (this.type) {\n case 'email':\n props.href = `mailto:${this.value}`;\n break;\n case 'tel':\n props.href = `tel:${this.value}`;\n break;\n default:\n props.href = getHref(this.value);\n props.target = getTarget(this.value);\n }\n\n return props;\n };\n\n private renderLinkIcon = (linkProps: LinkProperties, icon: string) => {\n // If the trailing icon uses the class `mdc-text-field__icon--trailing`,\n // MDC attaches a click handler to it, which apparently runs\n // `preventDefault()` on the event. For links, we don't want that,\n // so instead of `mdc-text-field__icon--trailing`, we use our own class\n // `lime-trailing-icon-for-link`, which uses all the same styling. /Ads\n return (\n <a\n {...linkProps}\n class=\"material-icons mdc-text-field__icon lime-trailing-icon-for-link\"\n tabindex={this.disabled || this.isEmpty() ? '-1' : '0'}\n role=\"button\"\n >\n <limel-icon name={icon} />\n </a>\n );\n };\n\n private renderTrailingIcon = (icon: string) => {\n if (this.isInvalid()) {\n return (\n <i\n key=\"invalid\"\n class=\"material-icons mdc-text-field__icon invalid-icon\"\n >\n <limel-icon name={icon} />\n </i>\n );\n }\n\n return (\n <i\n key=\"action\"\n class=\"material-icons mdc-text-field__icon mdc-text-field__icon--trailing\"\n tabIndex={0}\n role=\"button\"\n onKeyDown={this.handleIconKeyPress}\n onClick={this.handleIconClick}\n >\n <limel-icon name={icon} />\n </i>\n );\n };\n\n private getTrailingIcon = () => {\n if (this.isInvalid()) {\n return 'high_importance';\n }\n\n if (this.trailingIcon) {\n return this.trailingIcon;\n }\n\n if (this.showLink && this.type === 'email') {\n return 'filled_message';\n }\n\n if (this.showLink && this.type === 'tel') {\n return 'phone';\n }\n\n if (\n this.showLink &&\n (this.type === 'url' || this.type === 'urlAsText')\n ) {\n return 'external_link';\n }\n };\n\n private renderFormattedNumber = () => {\n if (this.type !== 'number') {\n return;\n }\n\n let renderValue = this.value;\n if (this.formatNumber && this.value) {\n renderValue = new Intl.NumberFormat(this.locale).format(\n Number(this.value),\n );\n if (renderValue === 'NaN') {\n return;\n }\n }\n\n return (\n <span class=\"lime-formatted-input lime-looks-like-input-value\">\n {renderValue}\n </span>\n );\n };\n\n /**\n * Key handler for the input field\n * Will change focus to the first/last item in the dropdown list to enable selection with the keyboard\n *\n * @param event - event\n */\n\n private onKeyDown = (event: KeyboardEvent): void => {\n this.showCompletions = true;\n const isForwardTab =\n (event.key === TAB || event.keyCode === TAB_KEY_CODE) &&\n !event.altKey &&\n !event.metaKey &&\n !event.shiftKey;\n const isUp =\n event.key === ARROW_UP || event.keyCode === ARROW_UP_KEY_CODE;\n const isDown =\n event.key === ARROW_DOWN || event.keyCode === ARROW_DOWN_KEY_CODE;\n\n if (event.keyCode === TAB_KEY_CODE && event.shiftKey) {\n this.showCompletions = false;\n }\n\n if (!isForwardTab && !isUp && !isDown) {\n return;\n }\n\n const list = document.querySelector(` #${this.portalId} limel-list`);\n\n if (!list) {\n return;\n }\n\n event.preventDefault();\n if (isForwardTab || isDown) {\n const listElement: HTMLElement = list.shadowRoot.querySelector(\n '.mdc-deprecated-list-item:first-child',\n );\n listElement.focus();\n\n return;\n }\n\n if (isUp) {\n const listElement: HTMLElement = list.shadowRoot.querySelector(\n '.mdc-deprecated-list-item:last-child',\n );\n listElement.focus();\n }\n };\n\n private handleCompletionChange = (\n event: LimelListCustomEvent<ListItem>,\n ) => {\n event.stopPropagation();\n if (!event.detail) {\n return;\n }\n\n this.showCompletions = false;\n\n /*\n This change event doesn't need to be debounced in itself, but we want\n to make absolutely sure that an earlier change event that *has* been\n debounced doesn't emit after this one. Therefore, we run this through\n the same debounced emitter function. /Ads\n */\n this.changeEmitter(event.detail.text);\n this.changeEmitter.flush();\n };\n\n private renderAutocompleteList = () => {\n if (this.type === 'textarea' || !this.completions.length) {\n return;\n }\n\n const dropdownZIndex = getComputedStyle(\n this.limelInputField,\n ).getPropertyValue('--dropdown-z-index');\n\n return (\n <limel-portal\n visible={this.showCompletions}\n containerId={this.portalId}\n inheritParentWidth={true}\n containerStyle={{ 'z-index': dropdownZIndex }}\n >\n <limel-menu-surface\n open={this.showCompletions}\n allowClicksElement={this.limelInputField}\n style={{\n '--mdc-menu-min-width': '100%',\n 'max-height': 'inherit',\n display: 'flex',\n }}\n onDismiss={this.handleCloseMenu}\n >\n {this.renderListResult()}\n </limel-menu-surface>\n </limel-portal>\n );\n };\n\n private renderListResult = () => {\n const filteredCompletions: ListItem[] = this.filterCompletions(\n this.getCurrentValue(),\n );\n if (!filteredCompletions || filteredCompletions.length === 0) {\n return null;\n }\n\n return (\n <limel-list\n onChange={this.handleCompletionChange}\n onKeyDown={this.handleKeyDownInDropdown}\n type=\"selectable\"\n items={filteredCompletions}\n />\n );\n };\n\n private handleKeyDownInDropdown = (event: KeyboardEvent) => {\n const keyFound = [TAB, ESCAPE, ENTER].includes(event.key);\n const keyCodeFound = [\n TAB_KEY_CODE,\n ESCAPE_KEY_CODE,\n ENTER_KEY_CODE,\n ].includes(event.keyCode);\n if (keyFound || keyCodeFound) {\n this.setFocus();\n }\n };\n\n private handleCloseMenu = () => {\n this.showCompletions = false;\n };\n\n private filterCompletions = (filter: string) => {\n if (!filter) {\n return this.completionsList;\n }\n\n return this.completionsList.filter(\n (completion) =>\n completion.text.toLowerCase().indexOf(filter.toLowerCase()) >\n -1,\n );\n };\n\n private handleInput = (event) => {\n event.stopPropagation();\n let value = event.target.value;\n\n if (this.type === 'number') {\n if (!value && event.data) {\n event.stopPropagation();\n\n return;\n }\n\n if (value) {\n value = Number(value);\n }\n }\n\n this.changeWaiting = true;\n this.changeEmitter(value);\n };\n\n private changeEmitter = debounce((value: string) => {\n this.change.emit(value);\n this.changeWaiting = false;\n }, CHANGE_EVENT_DEBOUNCE_TIMEOUT);\n\n private handleChange = (event: Event) => {\n event.stopPropagation();\n this.changeEmitter.flush();\n };\n\n private handleIconClick = () => {\n this.action.emit();\n };\n\n private handleIconKeyPress = (event: KeyboardEvent) => {\n const isEnter = event.key === ENTER || event.keyCode === ENTER_KEY_CODE;\n const isSpace = event.key === SPACE || event.keyCode === SPACE_KEY_CODE;\n\n if (isSpace || isEnter) {\n this.action.emit();\n }\n };\n\n private handleWheel = () => {\n // This empty event handler is here to circumvent a bug.\n // In some browsers (Chrome for example), hovering the input with\n // the input focused, and scrolling, will both change the value\n // AND scroll the page. We would prefer to never change the value\n // on scroll, instead always scrolling the page, but since we\n // haven't found a way to do that, this is the next best thing, as\n // it prevents the page from being scrolled, but only in the\n // circumstances when the value is changed by the scrolling.\n // Please test THOROUGHLY if you remove this event handler 😄\n };\n}\n"]}
|
|
1
|
+
{"version":3,"file":"input-field.js","sourceRoot":"","sources":["../../../src/components/input-field/input-field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACnD,OAAO,EACH,SAAS,EACT,OAAO,EACP,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,KAAK,EACL,KAAK,GACR,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACrC,OAAO,EACH,UAAU,EACV,mBAAmB,EACnB,QAAQ,EACR,iBAAiB,EACjB,KAAK,EACL,cAAc,EACd,MAAM,EACN,eAAe,EACf,KAAK,EACL,cAAc,EACd,GAAG,EACH,YAAY,GACf,MAAM,qBAAqB,CAAC;AAG7B,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAE5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAE9D,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAOnD,MAAM,6BAA6B,GAAG,GAAG,CAAC;AAC1C,MAAM,+BAA+B,GAAG,GAAG,CAAC;AAE5C;;;;;;;;;;;;;;;;;GAiBG;AAMH,MAAM,OAAO,UAAU;EAuMnB;IAPQ,oBAAe,GAAe,EAAE,CAAC;IAKjC,kBAAa,GAAG,KAAK,CAAC;IAuHtB,eAAU,GAAG,GAAG,EAAE;MACtB,MAAM,OAAO,GACT,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;MACrE,IAAI,CAAC,OAAO,EAAE;QACV,OAAO;OACV;MAED,IAAI,CAAC,YAAY,GAAG,IAAI,YAAY,CAAC,OAAO,CAAC,CAAC;MAC9C,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;OACxC;MAED,IAAI,IAAI,CAAC,OAAO,EAAE;QACd,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,KAAK,CAAC;OACnC;MAED,IAAI,CAAC,cAAc,EAAE,CAAC;MAEtB,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;MAClE,IAAI,CAAC,eAAe,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IAClE,CAAC,CAAC;IAEM,mBAAc,GAAG,GAAG,EAAE;MAC1B,IAAI,CAAC,eAAe,GAAG,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;QACtD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;MAC1B,CAAC,CAAC,CAAC;IACP,CAAC,CAAC;IAEM,aAAQ,GAAG,GAAG,EAAE;MACpB,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,CAAC;IAC9B,CAAC,CAAC;IAEM,0BAAqB,GAAG,GAAG,EAAE;MACjC,MAAM,SAAS,GAAG;QACd,gBAAgB,EAAE,IAAI;QACtB,0BAA0B,EAAE,CAAC,IAAI,CAAC,KAAK;QACvC,0BAA0B,EAAE,IAAI;QAChC,yBAAyB,EAAE,IAAI,CAAC,SAAS,EAAE;QAC3C,0BAA0B,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ;QAC1D,2BAA2B,EAAE,IAAI,CAAC,QAAQ;QAC1C,0BAA0B,EAAE,IAAI,CAAC,QAAQ;QACzC,wBAAwB,EAAE,IAAI,CAAC,OAAO,EAAE;QACxC,iBAAiB,EAAE,IAAI,CAAC,SAAS,EAAE;QACnC,iBAAiB,EAAE,IAAI,CAAC,SAAS,EAAE;OACtC,CAAC;MAEF,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;QAC1B,SAAS,CAAC,0BAA0B,CAAC,GAAG,IAAI,CAAC;OAChD;WAAM;QACH,SAAS,CAAC,mCAAmC,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC;QACpE,SAAS,CAAC,oCAAoC,CAAC;UAC3C,CAAC,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;OAChC;MAED,OAAO,SAAS,CAAC;IACrB,CAAC,CAAC;IAEM,YAAO,GAAG,GAAG,EAAE;;MACnB,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,KAAI,MAAA,IAAI,CAAC,YAAY,0CAAE,QAAQ,CAAC,QAAQ,CAAA,EAAE;QAChE,OAAO,KAAK,CAAC;OAChB;MAED,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;IACnC,CAAC,CAAC;IAEM,oBAAe,GAAG,GAAG,EAAE;MAC3B,IAAI,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,YAAY,EAAE;QACzC,OAAO,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC;OAClC;MAED,OAAO,IAAI,CAAC,KAAK,CAAC;IACtB,CAAC,CAAC;IAEM,gBAAW,GAAG,CAClB,UAAyD,EAC3D,EAAE;MACA,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;QAC1B,OAAO;OACV;MAED,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,KAAK,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;MAE5D,OAAO,CACH,6BACQ,UAAU,IACd,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,WAAW,EAAE,IAAI,CAAC,WAAW,IAC/B,CACL,CAAC;IACN,CAAC,CAAC;IAEM,mBAAc,GAAG,CACrB,UAA+D,EACjE,EAAE;MACA,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;QAC1B,OAAO;OACV;MAED,OAAO,CACH,YAAM,KAAK,EAAC,yBAAyB;QACjC,gCACQ,UAAU,IACd,WAAW,EAAE,IAAI,CAAC,WAAW,IACrB,CACT,CACV,CAAC;IACN,CAAC,CAAC;IAEM,WAAM,GAAG,GAAG,EAAE;;MAClB,MAAA,IAAI,CAAC,YAAY,0CAAE,MAAM,EAAE,CAAC;MAC5B,IAAI,CAAC,0BAA0B,EAAE,CAAC;IACtC,CAAC,CAAC;IAEM,+BAA0B,GAAG,QAAQ,CAAC,GAAG,EAAE;MAC/C,MAAM,sBAAsB,GAAG,IAAI,CAAC,eAAe,CAAC;MACpD,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;MAC7B,qBAAqB,CAAC,GAAG,EAAE;QACvB,IAAI,CAAC,eAAe,GAAG,sBAAsB,CAAC;MAClD,CAAC,CAAC,CAAC;IACP,CAAC,EAAE,+BAA+B,CAAC,CAAC;IAE5B,uBAAkB,GAAG,GAAG,EAAE;MAC9B,MAAM,KAAK,GAAQ,EAAE,CAAC;MAEtB,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;QACxB,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;OAC1B;MAED,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAI,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE;QACtD,KAAK,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC;OACxB;MAED,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAI,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE;QACtD,KAAK,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC;OACxB;MAED,IAAI,IAAI,CAAC,SAAS,EAAE;QAChB,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC;OACpC;MAED,IAAI,IAAI,CAAC,SAAS,EAAE;QAChB,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC;OACpC;MAED,OAAO,KAAK,CAAC;IACjB,CAAC,CAAC;IAEM,YAAO,GAAG,GAAG,EAAE;MACnB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;MACtB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;IAChC,CAAC,CAAC;IAEM,WAAM,GAAG,GAAG,EAAE;MAClB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;MACvB,IAAI,CAAC,QAAQ,EAAE,CAAC;MAChB,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;IAC/B,CAAC,CAAC;IAUM,kBAAa,GAAG,GAAG,EAAE;;MACzB,OAAO,CAAC,CAAC,CAAC,MAAA,IAAI,CAAC,UAAU,mCAAI,IAAI,CAAC,iBAAiB,CAAC,CAAC;IACzD,CAAC,CAAC;IAEM,kBAAa,GAAG,GAAG,EAAE;MACzB,OAAO,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;IACtD,CAAC,CAAC;IAEM,qBAAgB,GAAG,GAAG,EAAE;;MAC5B,MAAM,IAAI,GAAW,IAAI,CAAC,eAAe,EAAE,IAAI,EAAE,CAAC;MAClD,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;MAE3B,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,EAAE;QACvB,OAAO;OACV;MAED,OAAO,CACH,yBACI,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,UAAU,EAAE,MAAA,IAAI,CAAC,UAAU,mCAAI,IAAI,CAAC,iBAAiB,EACrD,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,OAAO,EAAE,IAAI,CAAC,SAAS,EAAE,GAC3B,CACL,CAAC;IACN,CAAC,CAAC;IAEM,gCAA2B,GAAG,GAAG,EAAE;MACvC,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,EAAE,EAAE;QACjC,OAAO,CACH,YAAM,KAAK,EAAC,2DAA2D,aAEhE,CACV,CAAC;OACL;IACL,CAAC,CAAC;IAEM,iBAAY,GAAG,GAAG,EAAE;MACxB,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;QAC/C,OAAO;OACV;MAED,MAAM,SAAS,GAAG;QACd,uBAAuB,EAAE,IAAI;QAC7B,+BAA+B,EAAE,IAAI;OACxC,CAAC;MAEF,OAAO,YAAM,KAAK,EAAE,SAAS,IAAG,IAAI,CAAC,MAAM,CAAQ,CAAC;IACxD,CAAC,CAAC;IAEM,cAAS,GAAG,GAAG,EAAE;MACrB,OAAO,IAAI,CAAC,MAAM,KAAK,IAAI,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,CAAC;IAC7D,CAAC,CAAC;IAEM,iBAAY,GAAG,GAAG,EAAE;MACxB,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;QAC/C,OAAO;OACV;MAED,MAAM,SAAS,GAAG;QACd,uBAAuB,EAAE,IAAI;QAC7B,+BAA+B,EAAE,IAAI;OACxC,CAAC;MAEF,OAAO,YAAM,KAAK,EAAE,SAAS,IAAG,IAAI,CAAC,MAAM,CAAQ,CAAC;IACxD,CAAC,CAAC;IAEM,cAAS,GAAG,GAAG,EAAE;MACrB,OAAO,IAAI,CAAC,MAAM,KAAK,IAAI,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,CAAC;IAC7D,CAAC,CAAC;IAEM,cAAS,GAAG,GAAG,EAAE;MACrB,IAAI,IAAI,CAAC,QAAQ,EAAE;QACf,yCAAyC;QACzC,OAAO,KAAK,CAAC;OAChB;MAED,IAAI,IAAI,CAAC,OAAO,EAAE;QACd,oEAAoE;QACpE,gEAAgE;QAChE,oEAAoE;QACpE,0CAA0C;QAC1C,OAAO,IAAI,CAAC;OACf;MAED,OAAO,IAAI,CAAC,UAAU,CAAC;IAC3B,CAAC,CAAC;IAEM,aAAQ,GAAG,GAAG,EAAE;MACpB,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,EAAE;QAC/B,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QAExB,OAAO;OACV;MAED,IAAI,IAAI,CAAC,YAAY,EAAE;QACnB,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,CAAC;OACxD;IACL,CAAC,CAAC;IAEM,oBAAe,GAAG,CACtB,OAAgD,EAClD,EAAE;MACA,IAAI,OAAO,EAAE;QACT,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC;OAC/B;IACL,CAAC,CAAC;IAEM,gBAAW,GAAG,GAAG,EAAE;MACvB,MAAM,cAAc,GAAG;QACnB,oBAAoB,EAAE,IAAI;QAC1B,iCAAiC,EAC7B,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,QAAQ;OACzD,CAAC;MAEF,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;QACb,OAAO;OACV;MAED,OAAO,CACH,YAAM,KAAK,EAAC,4BAA4B;QACpC,YAAM,KAAK,EAAE,cAAc,EAAE,EAAE,EAAE,IAAI,CAAC,OAAO,IACxC,IAAI,CAAC,KAAK,CACR,CACJ,CACV,CAAC;IACN,CAAC,CAAC;IAEM,sBAAiB,GAAG,GAAG,EAAE;MAC7B,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;QAC1B,OAAO;OACV;MAED,IAAI,IAAI,CAAC,WAAW,EAAE;QAClB,OAAO,CACH,SAAG,KAAK,EAAC,mEAAmE;UACxE,kBAAY,IAAI,EAAE,IAAI,CAAC,WAAW,GAAI,CACtC,CACP,CAAC;OACL;IACL,CAAC,CAAC;IAEM,+BAA0B,GAAG,GAAG,EAAE;MACtC,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;QAC1B,OAAO;OACV;MAED,MAAM,YAAY,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;MAE5C,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE,EAAE;QACrC,OAAO,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,EAAE,EAAE,YAAY,CAAC,CAAC;OAC5D;WAAM,IAAI,YAAY,EAAE;QACrB,OAAO,IAAI,CAAC,kBAAkB,CAAC,YAAY,CAAC,CAAC;OAChD;IACL,CAAC,CAAC;IAEM,YAAO,GAAG,GAAG,EAAE;MACnB,OAAO,CACH,IAAI,CAAC,QAAQ;QACb,CAAC,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAC3D,CAAC;IACN,CAAC,CAAC;IAEM,YAAO,GAAG,GAAG,EAAE;MACnB,MAAM,KAAK,GAAmB,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC;MAC3C,QAAQ,IAAI,CAAC,IAAI,EAAE;QACf,KAAK,OAAO;UACR,KAAK,CAAC,IAAI,GAAG,UAAU,IAAI,CAAC,KAAK,EAAE,CAAC;UACpC,MAAM;QACV,KAAK,KAAK;UACN,KAAK,CAAC,IAAI,GAAG,OAAO,IAAI,CAAC,KAAK,EAAE,CAAC;UACjC,MAAM;QACV;UACI,KAAK,CAAC,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;UACjC,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;OAC5C;MAED,OAAO,KAAK,CAAC;IACjB,CAAC,CAAC;IAEM,mBAAc,GAAG,CAAC,SAAyB,EAAE,IAAY,EAAE,EAAE;MACjE,wEAAwE;MACxE,4DAA4D;MAC5D,kEAAkE;MAClE,uEAAuE;MACvE,uEAAuE;MACvE,OAAO,CACH,yBACQ,SAAS,IACb,KAAK,EAAC,iEAAiE,EACvE,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,EACtD,IAAI,EAAC,QAAQ;QAEb,kBAAY,IAAI,EAAE,IAAI,GAAI,CAC1B,CACP,CAAC;IACN,CAAC,CAAC;IAEM,uBAAkB,GAAG,CAAC,IAAY,EAAE,EAAE;MAC1C,IAAI,IAAI,CAAC,SAAS,EAAE,EAAE;QAClB,OAAO,CACH,SACI,GAAG,EAAC,SAAS,EACb,KAAK,EAAC,kDAAkD;UAExD,kBAAY,IAAI,EAAE,IAAI,GAAI,CAC1B,CACP,CAAC;OACL;MAED,OAAO,CACH,SACI,GAAG,EAAC,QAAQ,EACZ,KAAK,EAAC,oEAAoE,EAC1E,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,IAAI,CAAC,kBAAkB,EAClC,OAAO,EAAE,IAAI,CAAC,eAAe;QAE7B,kBAAY,IAAI,EAAE,IAAI,GAAI,CAC1B,CACP,CAAC;IACN,CAAC,CAAC;IAEM,oBAAe,GAAG,GAAG,EAAE;MAC3B,IAAI,IAAI,CAAC,SAAS,EAAE,EAAE;QAClB,OAAO,iBAAiB,CAAC;OAC5B;MAED,IAAI,IAAI,CAAC,YAAY,EAAE;QACnB,OAAO,IAAI,CAAC,YAAY,CAAC;OAC5B;MAED,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;QACxC,OAAO,gBAAgB,CAAC;OAC3B;MAED,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,KAAK,KAAK,EAAE;QACtC,OAAO,OAAO,CAAC;OAClB;MAED,IACI,IAAI,CAAC,QAAQ;QACb,CAAC,IAAI,CAAC,IAAI,KAAK,KAAK,IAAI,IAAI,CAAC,IAAI,KAAK,WAAW,CAAC,EACpD;QACE,OAAO,eAAe,CAAC;OAC1B;IACL,CAAC,CAAC;IAEM,0BAAqB,GAAG,GAAG,EAAE;MACjC,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;QACxB,OAAO;OACV;MAED,IAAI,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC;MAC7B,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,KAAK,EAAE;QACjC,WAAW,GAAG,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,MAAM,CACnD,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CACrB,CAAC;QACF,IAAI,WAAW,KAAK,KAAK,EAAE;UACvB,OAAO;SACV;OACJ;MAED,OAAO,CACH,YAAM,KAAK,EAAC,kDAAkD,IACzD,WAAW,CACT,CACV,CAAC;IACN,CAAC,CAAC;IAEF;;;;;OAKG;IAEK,cAAS,GAAG,CAAC,KAAoB,EAAQ,EAAE;MAC/C,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;MAC5B,MAAM,YAAY,GACd,CAAC,KAAK,CAAC,GAAG,KAAK,GAAG,IAAI,KAAK,CAAC,OAAO,KAAK,YAAY,CAAC;QACrD,CAAC,KAAK,CAAC,MAAM;QACb,CAAC,KAAK,CAAC,OAAO;QACd,CAAC,KAAK,CAAC,QAAQ,CAAC;MACpB,MAAM,IAAI,GACN,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,KAAK,CAAC,OAAO,KAAK,iBAAiB,CAAC;MAClE,MAAM,MAAM,GACR,KAAK,CAAC,GAAG,KAAK,UAAU,IAAI,KAAK,CAAC,OAAO,KAAK,mBAAmB,CAAC;MAEtE,IAAI,KAAK,CAAC,OAAO,KAAK,YAAY,IAAI,KAAK,CAAC,QAAQ,EAAE;QAClD,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;OAChC;MAED,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,IAAI,CAAC,MAAM,EAAE;QACnC,OAAO;OACV;MAED,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC,QAAQ,aAAa,CAAC,CAAC;MAErE,IAAI,CAAC,IAAI,EAAE;QACP,OAAO;OACV;MAED,KAAK,CAAC,cAAc,EAAE,CAAC;MACvB,IAAI,YAAY,IAAI,MAAM,EAAE;QACxB,MAAM,WAAW,GAAgB,IAAI,CAAC,UAAU,CAAC,aAAa,CAC1D,uCAAuC,CAC1C,CAAC;QACF,WAAW,CAAC,KAAK,EAAE,CAAC;QAEpB,OAAO;OACV;MAED,IAAI,IAAI,EAAE;QACN,MAAM,WAAW,GAAgB,IAAI,CAAC,UAAU,CAAC,aAAa,CAC1D,sCAAsC,CACzC,CAAC;QACF,WAAW,CAAC,KAAK,EAAE,CAAC;OACvB;IACL,CAAC,CAAC;IAEM,2BAAsB,GAAG,CAC7B,KAAqC,EACvC,EAAE;MACA,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;QACf,OAAO;OACV;MAED,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;MAE7B;;;;;SAKG;MACH,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;MACtC,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;IAC/B,CAAC,CAAC;IAEM,2BAAsB,GAAG,GAAG,EAAE;MAClC,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE;QACtD,OAAO;OACV;MAED,MAAM,cAAc,GAAG,gBAAgB,CACnC,IAAI,CAAC,eAAe,CACvB,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,CAAC;MAEzC,OAAO,CACH,oBACI,OAAO,EAAE,IAAI,CAAC,eAAe,EAC7B,WAAW,EAAE,IAAI,CAAC,QAAQ,EAC1B,kBAAkB,EAAE,IAAI,EACxB,cAAc,EAAE,EAAE,SAAS,EAAE,cAAc,EAAE;QAE7C,0BACI,IAAI,EAAE,IAAI,CAAC,eAAe,EAC1B,kBAAkB,EAAE,IAAI,CAAC,eAAe,EACxC,KAAK,EAAE;YACH,sBAAsB,EAAE,MAAM;YAC9B,YAAY,EAAE,SAAS;YACvB,OAAO,EAAE,MAAM;WAClB,EACD,SAAS,EAAE,IAAI,CAAC,eAAe,IAE9B,IAAI,CAAC,gBAAgB,EAAE,CACP,CACV,CAClB,CAAC;IACN,CAAC,CAAC;IAEM,qBAAgB,GAAG,GAAG,EAAE;MAC5B,MAAM,mBAAmB,GAAe,IAAI,CAAC,iBAAiB,CAC1D,IAAI,CAAC,eAAe,EAAE,CACzB,CAAC;MACF,IAAI,CAAC,mBAAmB,IAAI,mBAAmB,CAAC,MAAM,KAAK,CAAC,EAAE;QAC1D,OAAO,IAAI,CAAC;OACf;MAED,OAAO,CACH,kBACI,QAAQ,EAAE,IAAI,CAAC,sBAAsB,EACrC,SAAS,EAAE,IAAI,CAAC,uBAAuB,EACvC,IAAI,EAAC,YAAY,EACjB,KAAK,EAAE,mBAAmB,GAC5B,CACL,CAAC;IACN,CAAC,CAAC;IAEM,4BAAuB,GAAG,CAAC,KAAoB,EAAE,EAAE;MACvD,MAAM,QAAQ,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;MAC1D,MAAM,YAAY,GAAG;QACjB,YAAY;QACZ,eAAe;QACf,cAAc;OACjB,CAAC,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;MAC1B,IAAI,QAAQ,IAAI,YAAY,EAAE;QAC1B,IAAI,CAAC,QAAQ,EAAE,CAAC;OACnB;IACL,CAAC,CAAC;IAEM,oBAAe,GAAG,GAAG,EAAE;MAC3B,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;IACjC,CAAC,CAAC;IAEM,sBAAiB,GAAG,CAAC,MAAc,EAAE,EAAE;MAC3C,IAAI,CAAC,MAAM,EAAE;QACT,OAAO,IAAI,CAAC,eAAe,CAAC;OAC/B;MAED,OAAO,IAAI,CAAC,eAAe,CAAC,MAAM,CAC9B,CAAC,UAAU,EAAE,EAAE,CACX,UAAU,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC;QAC3D,CAAC,CAAC,CACT,CAAC;IACN,CAAC,CAAC;IAEM,gBAAW,GAAG,CAAC,KAAK,EAAE,EAAE;MAC5B,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;MAE/B,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;QACxB,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,IAAI,EAAE;UACtB,KAAK,CAAC,eAAe,EAAE,CAAC;UAExB,OAAO;SACV;QAED,IAAI,KAAK,EAAE;UACP,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;SACzB;OACJ;MAED,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;MAC1B,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC,CAAC;IAEM,kBAAa,GAAG,QAAQ,CAAC,CAAC,KAAa,EAAE,EAAE;MAC/C,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;MACxB,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;IAC/B,CAAC,EAAE,6BAA6B,CAAC,CAAC;IAE1B,iBAAY,GAAG,CAAC,KAAY,EAAE,EAAE;MACpC,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;IAC/B,CAAC,CAAC;IAEM,oBAAe,GAAG,GAAG,EAAE;MAC3B,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;IACvB,CAAC,CAAC;IAEM,uBAAkB,GAAG,CAAC,KAAoB,EAAE,EAAE;MAClD,MAAM,OAAO,GAAG,KAAK,CAAC,GAAG,KAAK,KAAK,IAAI,KAAK,CAAC,OAAO,KAAK,cAAc,CAAC;MACxE,MAAM,OAAO,GAAG,KAAK,CAAC,GAAG,KAAK,KAAK,IAAI,KAAK,CAAC,OAAO,KAAK,cAAc,CAAC;MAExE,IAAI,OAAO,IAAI,OAAO,EAAE;QACpB,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;OACtB;IACL,CAAC,CAAC;IAEM,gBAAW,GAAG,GAAG,EAAE;MACvB,wDAAwD;MACxD,iEAAiE;MACjE,+DAA+D;MAC/D,iEAAiE;MACjE,6DAA6D;MAC7D,kEAAkE;MAClE,4DAA4D;MAC5D,4DAA4D;MAC5D,6DAA6D;IACjE,CAAC,CAAC;oBAt7BgB,KAAK;oBAQL,KAAK;mBAON,KAAK;;;;;;oBAsCJ,KAAK;;;;;gBAyCE,MAAM;wBAQT,IAAI;gBAMI,KAAK;;;;;uBAgCJ,EAAE;oBASf,KAAK;kBAMC,YAAY,CAAC,aAAa;qBAmBrB,KAAK;sBAGJ,KAAK;2BAGD,KAAK;IAYnC,IAAI,CAAC,QAAQ,GAAG,kBAAkB,EAAE,CAAC;IACrC,IAAI,CAAC,YAAY,GAAG,kBAAkB,EAAE,CAAC;IACzC,IAAI,CAAC,OAAO,GAAG,kBAAkB,EAAE,CAAC;GACvC;EAEM,iBAAiB;IACpB,IAAI,CAAC,UAAU,EAAE,CAAC;EACtB,CAAC;EAEM,gBAAgB;IACnB,IAAI,CAAC,UAAU,EAAE,CAAC;EACtB,CAAC;EAEM,oBAAoB;IACvB,IAAI,IAAI,CAAC,YAAY,EAAE;MACnB,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC;KAC/B;IAED,IAAI,CAAC,0BAA0B,CAAC,MAAM,EAAE,CAAC;IACzC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;IAClD,IAAI,CAAC,eAAe,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;EACrE,CAAC;EAEM,kBAAkB;IACrB,IAAI,IAAI,CAAC,OAAO,EAAE;MACd,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,KAAK,CAAC;KACnC;IAED,IAAI,CAAC,YAAY,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC;EAChE,CAAC;EAEM,MAAM;IACT,MAAM,UAAU,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAC7C,UAAU,CAAC,iBAAiB,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;IAC7C,UAAU,CAAC,KAAK,GAAG,uBAAuB,CAAC;IAC3C,UAAU,CAAC,GAAG,GAAG,IAAI,CAAC,eAAe,CAAC;IACtC,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC,WAAW,CAAC;IACtC,UAAU,CAAC,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC;IACxC,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;IAClC,UAAU,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;IAChC,UAAU,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;IACpC,UAAU,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;IACpC,UAAU,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC;IAErD,IAAI,YAAY,GAAG,EAAE,CAAC;IAEtB,IAAI,IAAI,CAAC,aAAa,EAAE,EAAE;MACtB,YAAY,IAAI,IAAI,CAAC,YAAY,CAAC;MAClC,UAAU,CAAC,kBAAkB,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC;KACtD;IAED,IAAI,IAAI,CAAC,sBAAsB,EAAE,EAAE;MAC/B,IAAI,YAAY,EAAE;QACd,YAAY,IAAI,GAAG,CAAC;OACvB;MAED,YAAY,IAAI,IAAI,CAAC,QAAQ,CAAC;KACjC;IAED,IAAI,YAAY,EAAE;MACd,UAAU,CAAC,eAAe,CAAC,GAAG,YAAY,CAAC;KAC9C;IAED,OAAO;MACH,aAAO,KAAK,EAAE,IAAI,CAAC,qBAAqB,EAAE;QACtC,YAAM,KAAK,EAAC,qBAAqB,EAAC,QAAQ,EAAC,IAAI;UAC3C,YAAM,KAAK,EAAC,8BAA8B,GAAQ;UACjD,IAAI,CAAC,WAAW,EAAE;UACnB,YAAM,KAAK,EAAC,+BAA+B,GAAQ,CAChD;QACN,IAAI,CAAC,iBAAiB,EAAE;QACxB,IAAI,CAAC,2BAA2B,EAAE;QAClC,IAAI,CAAC,YAAY,EAAE;QACnB,IAAI,CAAC,qBAAqB,EAAE;QAC5B,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC;QAC5B,IAAI,CAAC,YAAY,EAAE;QACnB,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC;QAC/B,IAAI,CAAC,0BAA0B,EAAE,CAC9B;MACR,IAAI,CAAC,gBAAgB,EAAE;MACvB,IAAI,CAAC,sBAAsB,EAAE;KAChC,CAAC;EACN,CAAC;EAGS,YAAY,CAAC,QAAgB;IACnC,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;MACpB,OAAO;KACV;IAED,IAAI,IAAI,CAAC,aAAa,EAAE;MACpB,OAAO;KACV;IAED,IACI,IAAI,CAAC,IAAI,KAAK,QAAQ;MACtB,IAAI,CAAC,SAAS;MACd,MAAM,CAAC,QAAQ,CAAC,KAAK,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,EACtD;MACE,OAAO;KACV;IAED,IAAI,QAAQ,KAAK,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE;MACtC,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,QAAQ,IAAI,EAAE,CAAC;KAC5C;IAED,IAAI,IAAI,CAAC,UAAU,EAAE;MACjB,IAAI,CAAC,QAAQ,EAAE,CAAC;KACnB;EACL,CAAC;EAGS,kBAAkB;IACxB,IAAI,CAAC,cAAc,EAAE,CAAC;EAC1B,CAAC;EAmKD,IAAY,iBAAiB;;IACzB,IAAI,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;MACnC,OAAO,CAAA,MAAA,IAAI,CAAC,YAAY,0CAAE,iBAAiB,KAAI,EAAE,CAAC;KACrD;IAED,OAAO,EAAE,CAAC;EACd,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4dJ","sourcesContent":["import { MDCTextField } from '@material/textfield';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { debounce } from 'lodash-es';\nimport {\n ARROW_DOWN,\n ARROW_DOWN_KEY_CODE,\n ARROW_UP,\n ARROW_UP_KEY_CODE,\n ENTER,\n ENTER_KEY_CODE,\n ESCAPE,\n ESCAPE_KEY_CODE,\n SPACE,\n SPACE_KEY_CODE,\n TAB,\n TAB_KEY_CODE,\n} from '../../util/keycodes';\nimport { InputType } from '../input-field/input-field.types';\nimport { ListItem } from '../list/list-item.types';\nimport { getHref, getTarget } from '../../util/link-helper';\nimport { JSXBase } from '@stencil/core/internal';\nimport { createRandomString } from '../../util/random-string';\nimport { LimelListCustomEvent } from '../../components';\nimport { globalConfig } from '../../global/config';\n\ninterface LinkProperties {\n href: string;\n target?: string;\n}\n\nconst CHANGE_EVENT_DEBOUNCE_TIMEOUT = 300;\nconst RESIZE_HANDLER_DEBOUNCE_TIMEOUT = 100;\n\n/**\n * @exampleComponent limel-example-input-field-text\n * @exampleComponent limel-example-input-field-placeholder\n * @exampleComponent limel-example-input-field-text-multiple\n * @exampleComponent limel-example-input-field-number\n * @exampleComponent limel-example-input-field-autocomplete\n * @exampleComponent limel-example-input-field-icon-leading\n * @exampleComponent limel-example-input-field-icon-trailing\n * @exampleComponent limel-example-input-field-icon-both\n * @exampleComponent limel-example-input-field-showlink\n * @exampleComponent limel-example-input-field-error-icon\n * @exampleComponent limel-example-input-field-textarea\n * @exampleComponent limel-example-input-field-suffix\n * @exampleComponent limel-example-input-field-prefix\n * @exampleComponent limel-example-input-field-search\n * @exampleComponent limel-example-input-field-pattern\n * @exampleComponent limel-example-input-field-focus\n */\n@Component({\n tag: 'limel-input-field',\n shadow: true,\n styleUrl: 'input-field.scss',\n})\nexport class InputField {\n /**\n * Set to `true` to disable the field.\n * Use `disabled` to indicate that the field can normally be interacted\n * with, but is currently disabled. This tells the user that if certain\n * requirements are met, the field may become enabled again.\n */\n @Prop({ reflect: true })\n public disabled = false;\n\n /**\n * Set to `true` to make the field read-only.\n * Use `readonly` when the field is only there to present the data it holds,\n * and will not become possible for the current user to edit.\n */\n @Prop({ reflect: true })\n public readonly = false;\n\n /**\n * Set to `true` to indicate that the current value of the input field is\n * invalid.\n */\n @Prop({ reflect: true })\n public invalid = false;\n\n /**\n * The input label.\n */\n @Prop({ reflect: true })\n public label: string;\n\n /**\n * The placeholder text shown inside the input field, when the field is focused and empty.\n */\n @Prop({ reflect: true })\n public placeholder: string;\n\n /**\n * Optional helper text to display below the input field when it has focus\n */\n @Prop({ reflect: true })\n public helperText: string;\n\n /**\n * A short piece of text to display before the value inside the input field.\n * Displayed for all types except `textarea`.\n */\n @Prop({ reflect: true })\n public prefix: string;\n\n /**\n * A short piece of text to display after the value inside the input field.\n * Displayed for all types except `textarea`.\n */\n @Prop({ reflect: true })\n public suffix: string;\n\n /**\n * Set to `true` to indicate that the field is required.\n */\n @Prop({ reflect: true })\n public required = false;\n\n /**\n * The value of the field.\n */\n @Prop({ reflect: true })\n public value: string;\n\n /**\n * Trailing icon to show to the far right in the field.\n */\n @Prop({ reflect: true })\n public trailingIcon: string;\n\n /**\n * Leading icon to show to the far left in the field.\n */\n @Prop({ reflect: true })\n public leadingIcon: string;\n\n /**\n * Regular expression that the current value of the input field must match.\n * No forward slashes should be specified around the pattern.\n * Only used if type is `text`, `tel`, `email`, `url`, `urlAsText`,\n * `password`, or `search`.\n */\n @Prop({ reflect: true })\n public pattern: string;\n\n /**\n * Type of input.\n *\n * Note** regarding type `url`: `limel-input` uses the native validation\n * built into the browser for many types of input fields. The native\n * validation for `url` is very strict, and does not allow relative urls,\n * nor any other formats that are not a \"fully qualified\" url. To allow\n * such urls, use the type `urlAsText` instead. `urlAsText` works exactly\n * like `text` in all regards, except that it enables use of the `showLink`\n * property.\n */\n @Prop({ reflect: true })\n public type: InputType = 'text';\n\n /**\n * Set to `true` to format the current value of the input field only\n * if the field is of type number.\n * The number format is determined by the current language of the browser.\n */\n @Prop({ reflect: true })\n public formatNumber = true;\n\n /**\n * Incremental values that are valid if the field type is `number`.\n */\n @Prop({ reflect: true })\n public step: number | 'any' = 'any';\n\n /**\n * Maximum allowed value if input type is `number`.\n */\n @Prop({ reflect: true })\n public max: number;\n\n /**\n * Minimum allowed value if input type is `number`.\n */\n @Prop({ reflect: true })\n public min: number;\n\n /**\n * Maximum length of the value if type is `password`, `search`, `tel`,\n * `text`, `url`, or `urlAsText`.\n */\n @Prop({ reflect: true })\n public maxlength: number;\n\n /**\n * Minimum length of the value if type is `password`, `search`, `tel`,\n * `text`, `url`, or `urlAsText`.\n */\n @Prop({ reflect: true })\n public minlength: number;\n\n /**\n * list of suggestions `value` can autocomplete to.\n */\n @Prop()\n public completions: string[] = [];\n\n /**\n * For inputs of type `email`, `tel`, `url`, and `urlAsText`, set this to\n * `true` to show a trailing icon with a `mailto:`,`tel:`, or normal link,\n * respectively. The default icon can be overridden using the `trailingIcon`\n * property.\n */\n @Prop({ reflect: true })\n public showLink = false;\n\n /**\n * The locale to use for formatting numbers.\n */\n @Prop({ reflect: true })\n public locale: string = globalConfig.defaultLocale;\n\n /**\n * Emitted when the input value is changed.\n */\n @Event()\n private change: EventEmitter<string>;\n\n /**\n * Emitted when `trailingIcon` or `leadingIcon` is set\n * and the icon is interacted with.\n */\n @Event()\n private action: EventEmitter<void>;\n\n @Element()\n private limelInputField: HTMLLimelInputFieldElement;\n\n @State()\n private isFocused: boolean = false;\n\n @State()\n private wasInvalid: boolean = false;\n\n @State()\n public showCompletions: boolean = false;\n\n private inputElement?: HTMLInputElement | HTMLTextAreaElement;\n private mdcTextField: MDCTextField;\n private completionsList: ListItem[] = [];\n private portalId: string;\n private helperTextId: string;\n private labelId: string;\n\n private changeWaiting = false;\n\n constructor() {\n this.portalId = createRandomString();\n this.helperTextId = createRandomString();\n this.labelId = createRandomString();\n }\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n public disconnectedCallback() {\n if (this.mdcTextField) {\n this.mdcTextField.destroy();\n }\n\n this.restyleCompletionsDropDown.cancel();\n window.removeEventListener('resize', this.layout);\n this.limelInputField.removeEventListener('focus', this.setFocus);\n }\n\n public componentDidUpdate() {\n if (this.invalid) {\n this.mdcTextField.valid = false;\n }\n\n this.mdcTextField.disabled = this.disabled || this.readonly;\n }\n\n public render() {\n const properties = this.getAdditionalProps();\n properties['aria-labelledby'] = this.labelId;\n properties.class = 'mdc-text-field__input';\n properties.ref = this.setInputElement;\n properties.onInput = this.handleInput;\n properties.onChange = this.handleChange;\n properties.onFocus = this.onFocus;\n properties.onBlur = this.onBlur;\n properties.required = this.required;\n properties.readonly = this.readonly;\n properties.disabled = this.disabled || this.readonly;\n\n let ariaControls = '';\n\n if (this.hasHelperText()) {\n ariaControls += this.helperTextId;\n properties['aria-describedby'] = this.helperTextId;\n }\n\n if (this.renderAutocompleteList()) {\n if (ariaControls) {\n ariaControls += ' ';\n }\n\n ariaControls += this.portalId;\n }\n\n if (ariaControls) {\n properties['aria-controls'] = ariaControls;\n }\n\n return [\n <label class={this.getContainerClassList()}>\n <span class=\"mdc-notched-outline\" tabindex=\"-1\">\n <span class=\"mdc-notched-outline__leading\"></span>\n {this.renderLabel()}\n <span class=\"mdc-notched-outline__trailing\"></span>\n </span>\n {this.renderLeadingIcon()}\n {this.renderEmptyValueForReadonly()}\n {this.renderPrefix()}\n {this.renderFormattedNumber()}\n {this.renderInput(properties)}\n {this.renderSuffix()}\n {this.renderTextarea(properties)}\n {this.renderTrailingLinkOrButton()}\n </label>,\n this.renderHelperLine(),\n this.renderAutocompleteList(),\n ];\n }\n\n @Watch('value')\n protected valueWatcher(newValue: string) {\n if (!this.mdcTextField) {\n return;\n }\n\n if (this.changeWaiting) {\n return;\n }\n\n if (\n this.type === 'number' &&\n this.isFocused &&\n Number(newValue) === Number(this.mdcTextField.value)\n ) {\n return;\n }\n\n if (newValue !== this.mdcTextField.value) {\n this.mdcTextField.value = newValue || '';\n }\n\n if (this.wasInvalid) {\n this.validate();\n }\n }\n\n @Watch('completions')\n protected completionsWatcher() {\n this.mapCompletions();\n }\n\n private initialize = () => {\n const element =\n this.limelInputField.shadowRoot.querySelector('.mdc-text-field');\n if (!element) {\n return;\n }\n\n this.mdcTextField = new MDCTextField(element);\n if (this.value) {\n this.mdcTextField.value = this.value;\n }\n\n if (this.invalid) {\n this.mdcTextField.valid = false;\n }\n\n this.mapCompletions();\n\n window.addEventListener('resize', this.layout, { passive: true });\n this.limelInputField.addEventListener('focus', this.setFocus);\n };\n\n private mapCompletions = () => {\n this.completionsList = [...this.completions].map((item) => {\n return { text: item };\n });\n };\n\n private setFocus = () => {\n this.mdcTextField.focus();\n };\n\n private getContainerClassList = () => {\n const classList = {\n 'mdc-text-field': true,\n 'mdc-text-field--no-label': !this.label,\n 'mdc-text-field--outlined': true,\n 'mdc-text-field--invalid': this.isInvalid(),\n 'mdc-text-field--disabled': this.disabled || this.readonly,\n 'lime-text-field--readonly': this.readonly,\n 'mdc-text-field--required': this.required,\n 'lime-text-field--empty': this.isEmpty(),\n 'lime-has-prefix': this.hasPrefix(),\n 'lime-has-suffix': this.hasSuffix(),\n };\n\n if (this.type === 'textarea') {\n classList['mdc-text-field--textarea'] = true;\n } else {\n classList['mdc-text-field--with-leading-icon'] = !!this.leadingIcon;\n classList['mdc-text-field--with-trailing-icon'] =\n !!this.getTrailingIcon();\n }\n\n return classList;\n };\n\n private isEmpty = () => {\n if (this.type === 'number' && this.inputElement?.validity.badInput) {\n return false;\n }\n\n return !this.getCurrentValue();\n };\n\n private getCurrentValue = () => {\n if (this.changeWaiting && this.inputElement) {\n return this.inputElement.value;\n }\n\n return this.value;\n };\n\n private renderInput = (\n properties: JSXBase.InputHTMLAttributes<HTMLInputElement>,\n ) => {\n if (this.type === 'textarea') {\n return;\n }\n\n const type = this.type === 'urlAsText' ? 'text' : this.type;\n\n return (\n <input\n {...properties}\n type={type}\n pattern={this.pattern}\n onWheel={this.handleWheel}\n onKeyDown={this.onKeyDown}\n placeholder={this.placeholder}\n />\n );\n };\n\n private renderTextarea = (\n properties: JSXBase.TextareaHTMLAttributes<HTMLTextAreaElement>,\n ) => {\n if (this.type !== 'textarea') {\n return;\n }\n\n return (\n <span class=\"mdc-text-field__resizer\">\n <textarea\n {...properties}\n placeholder={this.placeholder}\n ></textarea>\n </span>\n );\n };\n\n private layout = () => {\n this.mdcTextField?.layout();\n this.restyleCompletionsDropDown();\n };\n\n private restyleCompletionsDropDown = debounce(() => {\n const stateOfShowCompletions = this.showCompletions;\n this.showCompletions = false;\n requestAnimationFrame(() => {\n this.showCompletions = stateOfShowCompletions;\n });\n }, RESIZE_HANDLER_DEBOUNCE_TIMEOUT);\n\n private getAdditionalProps = () => {\n const props: any = {};\n\n if (this.type === 'number') {\n props.step = this.step;\n }\n\n if (this.type === 'number' && Number.isInteger(this.min)) {\n props.min = this.min;\n }\n\n if (this.type === 'number' && Number.isInteger(this.max)) {\n props.max = this.max;\n }\n\n if (this.minlength) {\n props.minlength = this.minlength;\n }\n\n if (this.maxlength) {\n props.maxlength = this.maxlength;\n }\n\n return props;\n };\n\n private onFocus = () => {\n this.isFocused = true;\n this.showCompletions = true;\n };\n\n private onBlur = () => {\n this.isFocused = false;\n this.validate();\n this.changeEmitter.flush();\n };\n\n private get validationMessage(): string {\n if (this.isInvalid() && !this.invalid) {\n return this.inputElement?.validationMessage || '';\n }\n\n return '';\n }\n\n private hasHelperText = () => {\n return !!(this.helperText ?? this.validationMessage);\n };\n\n private hasHelperLine = () => {\n return this.maxlength > 0 || this.hasHelperText();\n };\n\n private renderHelperLine = () => {\n const text: string = this.getCurrentValue() || '';\n const length = text.length;\n\n if (!this.hasHelperLine()) {\n return;\n }\n\n return (\n <limel-helper-line\n helperTextId={this.helperTextId}\n helperText={this.helperText ?? this.validationMessage}\n length={length}\n maxLength={this.maxlength}\n invalid={this.isInvalid()}\n />\n );\n };\n\n private renderEmptyValueForReadonly = () => {\n if (this.readonly && this.isEmpty()) {\n return (\n <span class=\"lime-empty-value-for-readonly lime-looks-like-input-value\">\n –\n </span>\n );\n }\n };\n\n private renderSuffix = () => {\n if (!this.hasSuffix() || this.type === 'textarea') {\n return;\n }\n\n const classList = {\n 'mdc-text-field__affix': true,\n 'mdc-text-field__affix--suffix': true,\n };\n\n return <span class={classList}>{this.suffix}</span>;\n };\n\n private hasSuffix = () => {\n return this.suffix !== null && this.suffix !== undefined;\n };\n\n private renderPrefix = () => {\n if (!this.hasPrefix() || this.type === 'textarea') {\n return;\n }\n\n const classList = {\n 'mdc-text-field__affix': true,\n 'mdc-text-field__affix--prefix': true,\n };\n\n return <span class={classList}>{this.prefix}</span>;\n };\n\n private hasPrefix = () => {\n return this.prefix !== null && this.prefix !== undefined;\n };\n\n private isInvalid = () => {\n if (this.readonly) {\n // A readonly field can never be invalid.\n return false;\n }\n\n if (this.invalid) {\n // `this.invalid` is set by the consumer. If the consumer explicitly\n // told us to consider the field invalid, we consider it invalid\n // regardless of what our internal validation thinks, and regardless\n // of whether the field has been modified.\n return true;\n }\n\n return this.wasInvalid;\n };\n\n private validate = () => {\n if (this.readonly || this.invalid) {\n this.wasInvalid = false;\n\n return;\n }\n\n if (this.inputElement) {\n this.wasInvalid = !this.inputElement.checkValidity();\n }\n };\n\n private setInputElement = (\n element?: HTMLInputElement | HTMLTextAreaElement,\n ) => {\n if (element) {\n this.inputElement = element;\n }\n };\n\n private renderLabel = () => {\n const labelClassList = {\n 'mdc-floating-label': true,\n 'mdc-floating-label--float-above':\n !this.isEmpty() || this.isFocused || this.readonly,\n };\n\n if (!this.label) {\n return;\n }\n\n return (\n <span class=\"mdc-notched-outline__notch\">\n <span class={labelClassList} id={this.labelId}>\n {this.label}\n </span>\n </span>\n );\n };\n\n private renderLeadingIcon = () => {\n if (this.type === 'textarea') {\n return;\n }\n\n if (this.leadingIcon) {\n return (\n <i class=\"material-icons mdc-text-field__icon mdc-text-field__icon--leading\">\n <limel-icon name={this.leadingIcon} />\n </i>\n );\n }\n };\n\n private renderTrailingLinkOrButton = () => {\n if (this.type === 'textarea') {\n return;\n }\n\n const trailingIcon = this.getTrailingIcon();\n\n if (!this.isInvalid() && this.hasLink()) {\n return this.renderLinkIcon(this.getLink(), trailingIcon);\n } else if (trailingIcon) {\n return this.renderTrailingIcon(trailingIcon);\n }\n };\n\n private hasLink = () => {\n return (\n this.showLink &&\n ['email', 'tel', 'url', 'urlAsText'].includes(this.type)\n );\n };\n\n private getLink = () => {\n const props: LinkProperties = { href: '' };\n switch (this.type) {\n case 'email':\n props.href = `mailto:${this.value}`;\n break;\n case 'tel':\n props.href = `tel:${this.value}`;\n break;\n default:\n props.href = getHref(this.value);\n props.target = getTarget(this.value);\n }\n\n return props;\n };\n\n private renderLinkIcon = (linkProps: LinkProperties, icon: string) => {\n // If the trailing icon uses the class `mdc-text-field__icon--trailing`,\n // MDC attaches a click handler to it, which apparently runs\n // `preventDefault()` on the event. For links, we don't want that,\n // so instead of `mdc-text-field__icon--trailing`, we use our own class\n // `lime-trailing-icon-for-link`, which uses all the same styling. /Ads\n return (\n <a\n {...linkProps}\n class=\"material-icons mdc-text-field__icon lime-trailing-icon-for-link\"\n tabindex={this.disabled || this.isEmpty() ? '-1' : '0'}\n role=\"button\"\n >\n <limel-icon name={icon} />\n </a>\n );\n };\n\n private renderTrailingIcon = (icon: string) => {\n if (this.isInvalid()) {\n return (\n <i\n key=\"invalid\"\n class=\"material-icons mdc-text-field__icon invalid-icon\"\n >\n <limel-icon name={icon} />\n </i>\n );\n }\n\n return (\n <i\n key=\"action\"\n class=\"material-icons mdc-text-field__icon mdc-text-field__icon--trailing\"\n tabIndex={0}\n role=\"button\"\n onKeyDown={this.handleIconKeyPress}\n onClick={this.handleIconClick}\n >\n <limel-icon name={icon} />\n </i>\n );\n };\n\n private getTrailingIcon = () => {\n if (this.isInvalid()) {\n return 'high_importance';\n }\n\n if (this.trailingIcon) {\n return this.trailingIcon;\n }\n\n if (this.showLink && this.type === 'email') {\n return 'filled_message';\n }\n\n if (this.showLink && this.type === 'tel') {\n return 'phone';\n }\n\n if (\n this.showLink &&\n (this.type === 'url' || this.type === 'urlAsText')\n ) {\n return 'external_link';\n }\n };\n\n private renderFormattedNumber = () => {\n if (this.type !== 'number') {\n return;\n }\n\n let renderValue = this.value;\n if (this.formatNumber && this.value) {\n renderValue = new Intl.NumberFormat(this.locale).format(\n Number(this.value),\n );\n if (renderValue === 'NaN') {\n return;\n }\n }\n\n return (\n <span class=\"lime-formatted-input lime-looks-like-input-value\">\n {renderValue}\n </span>\n );\n };\n\n /**\n * Key handler for the input field\n * Will change focus to the first/last item in the dropdown list to enable selection with the keyboard\n *\n * @param event - event\n */\n\n private onKeyDown = (event: KeyboardEvent): void => {\n this.showCompletions = true;\n const isForwardTab =\n (event.key === TAB || event.keyCode === TAB_KEY_CODE) &&\n !event.altKey &&\n !event.metaKey &&\n !event.shiftKey;\n const isUp =\n event.key === ARROW_UP || event.keyCode === ARROW_UP_KEY_CODE;\n const isDown =\n event.key === ARROW_DOWN || event.keyCode === ARROW_DOWN_KEY_CODE;\n\n if (event.keyCode === TAB_KEY_CODE && event.shiftKey) {\n this.showCompletions = false;\n }\n\n if (!isForwardTab && !isUp && !isDown) {\n return;\n }\n\n const list = document.querySelector(` #${this.portalId} limel-list`);\n\n if (!list) {\n return;\n }\n\n event.preventDefault();\n if (isForwardTab || isDown) {\n const listElement: HTMLElement = list.shadowRoot.querySelector(\n '.mdc-deprecated-list-item:first-child',\n );\n listElement.focus();\n\n return;\n }\n\n if (isUp) {\n const listElement: HTMLElement = list.shadowRoot.querySelector(\n '.mdc-deprecated-list-item:last-child',\n );\n listElement.focus();\n }\n };\n\n private handleCompletionChange = (\n event: LimelListCustomEvent<ListItem>,\n ) => {\n event.stopPropagation();\n if (!event.detail) {\n return;\n }\n\n this.showCompletions = false;\n\n /*\n This change event doesn't need to be debounced in itself, but we want\n to make absolutely sure that an earlier change event that *has* been\n debounced doesn't emit after this one. Therefore, we run this through\n the same debounced emitter function. /Ads\n */\n this.changeEmitter(event.detail.text);\n this.changeEmitter.flush();\n };\n\n private renderAutocompleteList = () => {\n if (this.type === 'textarea' || !this.completions.length) {\n return;\n }\n\n const dropdownZIndex = getComputedStyle(\n this.limelInputField,\n ).getPropertyValue('--dropdown-z-index');\n\n return (\n <limel-portal\n visible={this.showCompletions}\n containerId={this.portalId}\n inheritParentWidth={true}\n containerStyle={{ 'z-index': dropdownZIndex }}\n >\n <limel-menu-surface\n open={this.showCompletions}\n allowClicksElement={this.limelInputField}\n style={{\n '--mdc-menu-min-width': '100%',\n 'max-height': 'inherit',\n display: 'flex',\n }}\n onDismiss={this.handleCloseMenu}\n >\n {this.renderListResult()}\n </limel-menu-surface>\n </limel-portal>\n );\n };\n\n private renderListResult = () => {\n const filteredCompletions: ListItem[] = this.filterCompletions(\n this.getCurrentValue(),\n );\n if (!filteredCompletions || filteredCompletions.length === 0) {\n return null;\n }\n\n return (\n <limel-list\n onChange={this.handleCompletionChange}\n onKeyDown={this.handleKeyDownInDropdown}\n type=\"selectable\"\n items={filteredCompletions}\n />\n );\n };\n\n private handleKeyDownInDropdown = (event: KeyboardEvent) => {\n const keyFound = [TAB, ESCAPE, ENTER].includes(event.key);\n const keyCodeFound = [\n TAB_KEY_CODE,\n ESCAPE_KEY_CODE,\n ENTER_KEY_CODE,\n ].includes(event.keyCode);\n if (keyFound || keyCodeFound) {\n this.setFocus();\n }\n };\n\n private handleCloseMenu = () => {\n this.showCompletions = false;\n };\n\n private filterCompletions = (filter: string) => {\n if (!filter) {\n return this.completionsList;\n }\n\n return this.completionsList.filter(\n (completion) =>\n completion.text.toLowerCase().indexOf(filter.toLowerCase()) >\n -1,\n );\n };\n\n private handleInput = (event) => {\n event.stopPropagation();\n let value = event.target.value;\n\n if (this.type === 'number') {\n if (!value && event.data) {\n event.stopPropagation();\n\n return;\n }\n\n if (value) {\n value = Number(value);\n }\n }\n\n this.changeWaiting = true;\n this.changeEmitter(value);\n };\n\n private changeEmitter = debounce((value: string) => {\n this.change.emit(value);\n this.changeWaiting = false;\n }, CHANGE_EVENT_DEBOUNCE_TIMEOUT);\n\n private handleChange = (event: Event) => {\n event.stopPropagation();\n this.changeEmitter.flush();\n };\n\n private handleIconClick = () => {\n this.action.emit();\n };\n\n private handleIconKeyPress = (event: KeyboardEvent) => {\n const isEnter = event.key === ENTER || event.keyCode === ENTER_KEY_CODE;\n const isSpace = event.key === SPACE || event.keyCode === SPACE_KEY_CODE;\n\n if (isSpace || isEnter) {\n this.action.emit();\n }\n };\n\n private handleWheel = () => {\n // This empty event handler is here to circumvent a bug.\n // In some browsers (Chrome for example), hovering the input with\n // the input focused, and scrolling, will both change the value\n // AND scroll the page. We would prefer to never change the value\n // on scroll, instead always scrolling the page, but since we\n // haven't found a way to do that, this is the next best thing, as\n // it prevents the page from being scrolled, but only in the\n // circumstances when the value is changed by the scrolling.\n // Please test THOROUGHLY if you remove this event handler 😄\n };\n}\n"]}
|
|
@@ -946,9 +946,7 @@ limel-dynamic-label {
|
|
|
946
946
|
*/
|
|
947
947
|
:host(limel-checkbox:focus),
|
|
948
948
|
:host(limel-checkbox:focus-visible),
|
|
949
|
-
:host(limel-checkbox:focus-within)
|
|
950
|
-
:host(limel-checkbox[invalid]:not([invalid=false])),
|
|
951
|
-
:host(limel-checkbox[invalid=true]) {
|
|
949
|
+
:host(limel-checkbox:focus-within) {
|
|
952
950
|
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
953
951
|
--limel-h-l-grid-template-rows: 1fr;
|
|
954
952
|
}
|
|
@@ -5431,9 +5429,7 @@ limel-dynamic-label {
|
|
|
5431
5429
|
*/
|
|
5432
5430
|
:host(limel-checkbox:focus),
|
|
5433
5431
|
:host(limel-checkbox:focus-visible),
|
|
5434
|
-
:host(limel-checkbox:focus-within)
|
|
5435
|
-
:host(limel-checkbox[invalid]:not([invalid=false])),
|
|
5436
|
-
:host(limel-checkbox[invalid=true]) {
|
|
5432
|
+
:host(limel-checkbox:focus-within) {
|
|
5437
5433
|
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
5438
5434
|
--limel-h-l-grid-template-rows: 1fr;
|
|
5439
5435
|
}
|
|
@@ -1016,9 +1016,7 @@ limel-dynamic-label {
|
|
|
1016
1016
|
*/
|
|
1017
1017
|
:host(limel-checkbox:focus),
|
|
1018
1018
|
:host(limel-checkbox:focus-visible),
|
|
1019
|
-
:host(limel-checkbox:focus-within)
|
|
1020
|
-
:host(limel-checkbox[invalid]:not([invalid=false])),
|
|
1021
|
-
:host(limel-checkbox[invalid=true]) {
|
|
1019
|
+
:host(limel-checkbox:focus-within) {
|
|
1022
1020
|
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
1023
1021
|
--limel-h-l-grid-template-rows: 1fr;
|
|
1024
1022
|
}
|
|
@@ -5501,9 +5499,7 @@ limel-dynamic-label {
|
|
|
5501
5499
|
*/
|
|
5502
5500
|
:host(limel-checkbox:focus),
|
|
5503
5501
|
:host(limel-checkbox:focus-visible),
|
|
5504
|
-
:host(limel-checkbox:focus-within)
|
|
5505
|
-
:host(limel-checkbox[invalid]:not([invalid=false])),
|
|
5506
|
-
:host(limel-checkbox[invalid=true]) {
|
|
5502
|
+
:host(limel-checkbox:focus-within) {
|
|
5507
5503
|
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
5508
5504
|
--limel-h-l-grid-template-rows: 1fr;
|
|
5509
5505
|
}
|
|
@@ -1876,9 +1876,7 @@ select.limel-select__native-control {
|
|
|
1876
1876
|
*/
|
|
1877
1877
|
:host(limel-select:focus),
|
|
1878
1878
|
:host(limel-select:focus-visible),
|
|
1879
|
-
:host(limel-select:focus-within)
|
|
1880
|
-
:host(limel-select[invalid]:not([invalid=false])),
|
|
1881
|
-
:host(limel-select[invalid=true]) {
|
|
1879
|
+
:host(limel-select:focus-within) {
|
|
1882
1880
|
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
1883
1881
|
--limel-h-l-grid-template-rows: 1fr;
|
|
1884
1882
|
}
|
|
@@ -982,9 +982,7 @@
|
|
|
982
982
|
*/
|
|
983
983
|
:host(limel-slider:focus),
|
|
984
984
|
:host(limel-slider:focus-visible),
|
|
985
|
-
:host(limel-slider:focus-within)
|
|
986
|
-
:host(limel-slider[invalid]:not([invalid=false])),
|
|
987
|
-
:host(limel-slider[invalid=true]) {
|
|
985
|
+
:host(limel-slider:focus-within) {
|
|
988
986
|
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
989
987
|
--limel-h-l-grid-template-rows: 1fr;
|
|
990
988
|
}
|
|
@@ -915,9 +915,7 @@ label {
|
|
|
915
915
|
*/
|
|
916
916
|
:host(limel-switch:focus),
|
|
917
917
|
:host(limel-switch:focus-visible),
|
|
918
|
-
:host(limel-switch:focus-within)
|
|
919
|
-
:host(limel-switch[invalid]:not([invalid=false])),
|
|
920
|
-
:host(limel-switch[invalid=true]) {
|
|
918
|
+
:host(limel-switch:focus-within) {
|
|
921
919
|
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
922
920
|
--limel-h-l-grid-template-rows: 1fr;
|
|
923
921
|
}
|
|
@@ -1607,7 +1607,7 @@ button.tabulator-page[data-page=first]:not([disabled]):hover:after, button.tabul
|
|
|
1607
1607
|
position: absolute;
|
|
1608
1608
|
bottom: 0;
|
|
1609
1609
|
}
|
|
1610
|
-
:host(.has-pagination-on-top)
|
|
1610
|
+
:host(.has-pagination-on-top):has(.tabulator-calcs-holder) .tabulator-tableHolder {
|
|
1611
1611
|
margin-bottom: 1.5rem;
|
|
1612
1612
|
}
|
|
1613
1613
|
:host(.has-pagination-on-top) .select-all {
|
|
@@ -1754,14 +1754,16 @@ button.tabulator-page[data-page=first]:not([disabled]):hover:after, button.tabul
|
|
|
1754
1754
|
margin-bottom: 0;
|
|
1755
1755
|
}
|
|
1756
1756
|
.tabulator .tabulator-footer .tabulator-calcs-holder .tabulator-row {
|
|
1757
|
+
height: 1.5rem;
|
|
1757
1758
|
background: transparent !important;
|
|
1758
1759
|
}
|
|
1759
1760
|
.tabulator .tabulator-footer .tabulator-calcs-holder .tabulator-calcs {
|
|
1760
1761
|
cursor: default;
|
|
1761
1762
|
}
|
|
1762
1763
|
.tabulator .tabulator-footer .tabulator-calcs-holder .tabulator-cell {
|
|
1763
|
-
|
|
1764
|
-
padding-
|
|
1764
|
+
height: 1.5rem !important;
|
|
1765
|
+
padding-top: 0.25rem;
|
|
1766
|
+
padding-bottom: 0;
|
|
1765
1767
|
}
|
|
1766
1768
|
|
|
1767
1769
|
/*
|
|
@@ -332,9 +332,7 @@ limel-prosemirror-adapter {
|
|
|
332
332
|
|
|
333
333
|
:host(limel-text-editor:focus),
|
|
334
334
|
:host(limel-text-editor:focus-visible),
|
|
335
|
-
:host(limel-text-editor:focus-within)
|
|
336
|
-
:host(limel-text-editor[invalid]:not([invalid=false])),
|
|
337
|
-
:host(limel-text-editor[invalid=true]) {
|
|
335
|
+
:host(limel-text-editor:focus-within) {
|
|
338
336
|
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
339
337
|
--limel-h-l-grid-template-rows: 1fr;
|
|
340
338
|
}
|
|
@@ -345,9 +345,7 @@ $clickable-normal-state-transitions: (
|
|
|
345
345
|
|
|
346
346
|
:host(#{$component-tag}:focus),
|
|
347
347
|
:host(#{$component-tag}:focus-visible),
|
|
348
|
-
:host(#{$component-tag}:focus-within)
|
|
349
|
-
:host(#{$component-tag}[invalid]:not([invalid='false'])),
|
|
350
|
-
:host(#{$component-tag}[invalid='true']) {
|
|
348
|
+
:host(#{$component-tag}:focus-within) {
|
|
351
349
|
--limel-h-l-grid-template-rows-transition-speed: 0.46s;
|
|
352
350
|
--limel-h-l-grid-template-rows: 1fr;
|
|
353
351
|
}
|