@gov-design-system-ce/components 4.0.8-rc06 → 4.0.8-rc08
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/core.cjs.js +1 -1
- package/dist/cjs/gov-form-autocomplete.cjs.entry.js +17 -8
- package/dist/cjs/gov-form-autocomplete.cjs.entry.js.map +1 -1
- package/dist/cjs/gov-form-multi-select.cjs.entry.js +2 -2
- package/dist/cjs/gov-form-multi-select.cjs.entry.js.map +1 -1
- package/dist/cjs/gov-icon.cjs.entry.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/gov-form/autocomplete/gov-form-autocomplete.js +35 -9
- package/dist/collection/components/gov-form/autocomplete/gov-form-autocomplete.js.map +1 -1
- package/dist/collection/components/gov-form/multiselect/gov-form-multi-select.js +2 -2
- package/dist/collection/components/gov-form/multiselect/gov-form-multi-select.js.map +1 -1
- package/dist/components/gov-accordion-item.js +1 -1
- package/dist/components/gov-attachments-item.js +1 -1
- package/dist/components/gov-breadcrumbs.js +1 -1
- package/dist/components/gov-button.js +1 -1
- package/dist/components/gov-card.js +1 -1
- package/dist/components/gov-chip.js +1 -1
- package/dist/components/gov-form-autocomplete.js +1 -1
- package/dist/components/gov-form-checkbox.js +1 -1
- package/dist/components/gov-form-file.js +1 -1
- package/dist/components/gov-form-input.js +1 -1
- package/dist/components/gov-form-multi-select.js +1 -1
- package/dist/components/gov-form-multi-select.js.map +1 -1
- package/dist/components/gov-form-select.js +1 -1
- package/dist/components/gov-icon.js +1 -1
- package/dist/components/gov-infobar.js +1 -1
- package/dist/components/gov-loading.js +1 -1
- package/dist/components/gov-modal.js +1 -1
- package/dist/components/gov-pagination.js +1 -1
- package/dist/components/gov-prompt.js +1 -1
- package/dist/components/gov-side-nav-item.js +1 -1
- package/dist/components/gov-tabs.js +1 -1
- package/dist/components/gov-tag.js +1 -1
- package/dist/components/gov-toast.js +1 -1
- package/dist/components/gov-tooltip-content.js +1 -1
- package/dist/components/gov-wizard-item.js +1 -1
- package/dist/components/{p-d3271ba4.js → p-20707bc4.js} +2 -2
- package/dist/components/{p-5a96fe7a.js → p-56f32486.js} +2 -2
- package/dist/components/{p-7677b93a.js → p-633ff182.js} +2 -2
- package/dist/components/{p-98464833.js → p-6d114533.js} +2 -2
- package/dist/components/{p-281b05f0.js → p-92fcef42.js} +2 -2
- package/dist/components/p-c5bac92c.js +2 -0
- package/dist/components/p-c5bac92c.js.map +1 -0
- package/dist/components/{p-245d3ff5.js → p-f2b3753c.js} +2 -2
- package/dist/core/core.esm.js +1 -1
- package/dist/core/core.esm.js.map +1 -1
- package/dist/core/{p-41550ab6.entry.js → p-0f525123.entry.js} +2 -2
- package/dist/core/p-0f525123.entry.js.map +1 -0
- package/dist/core/p-542ce647.entry.js +2 -0
- package/dist/core/p-542ce647.entry.js.map +1 -0
- package/dist/core/{p-2254b2ef.entry.js → p-a09a8710.entry.js} +2 -2
- package/dist/esm/core.js +1 -1
- package/dist/esm/gov-form-autocomplete.entry.js +17 -8
- package/dist/esm/gov-form-autocomplete.entry.js.map +1 -1
- package/dist/esm/gov-form-multi-select.entry.js +2 -2
- package/dist/esm/gov-form-multi-select.entry.js.map +1 -1
- package/dist/esm/gov-icon.entry.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/hydrate/index.js +20 -10
- package/dist/types/components/gov-form/autocomplete/gov-form-autocomplete.d.ts +6 -1
- package/dist/types/components.d.ts +5 -1
- package/package.json +1 -1
- package/dist/components/p-86a37e8c.js +0 -2
- package/dist/components/p-86a37e8c.js.map +0 -1
- package/dist/core/p-41550ab6.entry.js.map +0 -1
- package/dist/core/p-cdd77b6c.entry.js +0 -2
- package/dist/core/p-cdd77b6c.entry.js.map +0 -1
- /package/dist/components/{p-d3271ba4.js.map → p-20707bc4.js.map} +0 -0
- /package/dist/components/{p-5a96fe7a.js.map → p-56f32486.js.map} +0 -0
- /package/dist/components/{p-7677b93a.js.map → p-633ff182.js.map} +0 -0
- /package/dist/components/{p-98464833.js.map → p-6d114533.js.map} +0 -0
- /package/dist/components/{p-281b05f0.js.map → p-92fcef42.js.map} +0 -0
- /package/dist/components/{p-245d3ff5.js.map → p-f2b3753c.js.map} +0 -0
- /package/dist/core/{p-2254b2ef.entry.js.map → p-a09a8710.entry.js.map} +0 -0
package/dist/hydrate/index.js
CHANGED
|
@@ -7375,6 +7375,12 @@ class GovFormAutocomplete {
|
|
|
7375
7375
|
});
|
|
7376
7376
|
}
|
|
7377
7377
|
}
|
|
7378
|
+
clearList() {
|
|
7379
|
+
const areOptions = propsValueToArray(this.options);
|
|
7380
|
+
if (areOptions.length === 0) {
|
|
7381
|
+
this.list = [];
|
|
7382
|
+
}
|
|
7383
|
+
}
|
|
7378
7384
|
get isValueAccepted() {
|
|
7379
7385
|
if (typeof this.value === 'string') {
|
|
7380
7386
|
return this.value.length >= this.minlength;
|
|
@@ -7388,10 +7394,10 @@ class GovFormAutocomplete {
|
|
|
7388
7394
|
this.validateSize(this.size);
|
|
7389
7395
|
}
|
|
7390
7396
|
render() {
|
|
7391
|
-
return (hAsync(Host, { class: FormAutocompleteClass.root, size: this.size, variant: this.variant }, hAsync("gov-form-input", { placeholder: this.placeholder, name: this.name, disabled: this.disabled, readonly: this.readonly, autocomplete: false, size: this.size, variant: this.variant, required: this.required, invalid: this.invalid, success: this.success, role: 'searchbox', value: this.value, minlength: this.minlength, maxlength: this.maxlength, "on-gov-input": throttle(this.onInputHandler.bind(this), this.throttleTime), "on-gov-keyup": this.onKeyUpHandler.bind(this), "on-gov-keydown": this.onKeyDownHandler.bind(this), "on-gov-focus": this.onFocusHandler.bind(this), "on-gov-blur": this.onBlurHandler.bind(this), wcagAutocomplete: 'list', wcagDescribedBy: this.wcagDescribedBy, wcagLabelledBy: this.wcagLabelledBy, wcagOwns: [this.listBoxId, this.wcagOwns].join(' '), wcagExpanded: this.list.length && this.focused, ref: el => (this.inputRef = el) }, hAsync("slot", { slot: "right-icon", name: "right-icon" })), hAsync("ul", { class: FormAutocompleteClass.list, role: 'listbox', id: this.listBoxId, ref: el => (this.listRef = el) }, this.focused && this.list.length === 0 && this.processing === false && this.isValueAccepted && this.messageEmpty ? (hAsync("li", { class: FormAutocompleteClass.empty }, this.messageEmpty)) : null, this.focused && this.processing === true && this.isValueAccepted ? (hAsync("li", { class: FormAutocompleteClass.loading }, hAsync("gov-icon", { name: "loader", class: "gov-spin-animation" }), "\u00A0", this.messageLoading)) : null, this.list.map((item, index) => {
|
|
7397
|
+
return (hAsync(Host, { class: FormAutocompleteClass.root, size: this.size, variant: this.variant }, hAsync("gov-form-input", { placeholder: this.placeholder, name: this.name, disabled: this.disabled, readonly: this.readonly, autocomplete: false, size: this.size, variant: this.variant, required: this.required, invalid: this.invalid, success: this.success, role: 'searchbox', value: this.value, minlength: this.minlength, maxlength: this.maxlength, "on-gov-input": throttle(this.onInputHandler.bind(this), this.throttleTime), "on-gov-keyup": this.onKeyUpHandler.bind(this), "on-gov-keydown": this.onKeyDownHandler.bind(this), "on-gov-focus": this.onFocusHandler.bind(this), "on-gov-blur": this.onBlurHandler.bind(this), wcagAutocomplete: 'list', wcagDescribedBy: this.wcagDescribedBy, wcagLabelledBy: this.wcagLabelledBy, wcagOwns: [this.listBoxId, this.wcagOwns].join(' '), wcagExpanded: this.list.length && this.focused, ref: el => (this.inputRef = el) }, hAsync("slot", { slot: "right-icon", name: "right-icon" })), hAsync("ul", { class: FormAutocompleteClass.list, role: 'listbox', "aria-hidden": toBoolAttr(!this.focused), hidden: !this.focused, id: this.listBoxId, ref: el => (this.listRef = el) }, this.focused && this.list.length === 0 && this.processing === false && this.isValueAccepted && this.messageEmpty ? (hAsync("li", { class: FormAutocompleteClass.empty }, this.messageEmpty)) : null, this.focused && this.processing === true && this.isValueAccepted ? (hAsync("li", { class: FormAutocompleteClass.loading }, hAsync("gov-icon", { name: "loader", class: "gov-spin-animation" }), "\u00A0", this.messageLoading)) : null, this.focused ? this.list.map((item, index) => {
|
|
7392
7398
|
const isSelected = this.arrowCounter === index;
|
|
7393
7399
|
return (hAsync("li", { class: FormAutocompleteClass.item, innerHTML: this.templateResolver(item, isSelected), role: 'option', "aria-posinset": index, tabindex: isSelected ? 0 : -1, "aria-setsize": this.list.length, onTouchStart: (e) => this.onSelectHandler(e, index), onMouseDown: (e) => this.onSelectHandler(e, index), "aria-selected": toBoolAttr(isSelected) }));
|
|
7394
|
-
}))));
|
|
7400
|
+
}) : null)));
|
|
7395
7401
|
}
|
|
7396
7402
|
onFocusHandler(e) {
|
|
7397
7403
|
this.focused = true;
|
|
@@ -7409,10 +7415,7 @@ class GovFormAutocomplete {
|
|
|
7409
7415
|
}
|
|
7410
7416
|
onBlurHandler(e) {
|
|
7411
7417
|
this.focused = false;
|
|
7412
|
-
|
|
7413
|
-
if (areOptions.length === 0) {
|
|
7414
|
-
this.list = [];
|
|
7415
|
-
}
|
|
7418
|
+
this.clearList();
|
|
7416
7419
|
this.arrowCounter = -1;
|
|
7417
7420
|
e.stopPropagation();
|
|
7418
7421
|
this.govBlur.emit({
|
|
@@ -7448,7 +7451,7 @@ class GovFormAutocomplete {
|
|
|
7448
7451
|
selected: selected,
|
|
7449
7452
|
originalEvent: e,
|
|
7450
7453
|
});
|
|
7451
|
-
this.
|
|
7454
|
+
this.clearList();
|
|
7452
7455
|
if (has(this.nameKey, selected) && typeof selected[this.nameKey] === 'string') {
|
|
7453
7456
|
this.value = selected[this.nameKey];
|
|
7454
7457
|
}
|
|
@@ -7478,11 +7481,17 @@ class GovFormAutocomplete {
|
|
|
7478
7481
|
}
|
|
7479
7482
|
}
|
|
7480
7483
|
/**
|
|
7481
|
-
*
|
|
7484
|
+
* Focus main input element
|
|
7482
7485
|
*/
|
|
7483
7486
|
async setFocus(options) {
|
|
7484
7487
|
return this.inputRef.focus(options);
|
|
7485
7488
|
}
|
|
7489
|
+
/**
|
|
7490
|
+
* Blur main input element
|
|
7491
|
+
*/
|
|
7492
|
+
async setBlur() {
|
|
7493
|
+
return this.inputRef.blur();
|
|
7494
|
+
}
|
|
7486
7495
|
/**
|
|
7487
7496
|
* Set options for list
|
|
7488
7497
|
*/
|
|
@@ -7554,6 +7563,7 @@ class GovFormAutocomplete {
|
|
|
7554
7563
|
"arrowCounter": [32],
|
|
7555
7564
|
"list": [32],
|
|
7556
7565
|
"setFocus": [64],
|
|
7566
|
+
"setBlur": [64],
|
|
7557
7567
|
"setOptions": [64],
|
|
7558
7568
|
"clearValue": [64],
|
|
7559
7569
|
"setProcessing": [64],
|
|
@@ -8725,7 +8735,7 @@ class GovFormMultiSelect {
|
|
|
8725
8735
|
return this.optionsState.filter((option) => {
|
|
8726
8736
|
const selectedIndex = this.selectedValueIndex(option.value);
|
|
8727
8737
|
return (selectedIndex !== -1 || (option === null || option === void 0 ? void 0 : option.disabled)) ? false : true;
|
|
8728
|
-
}).map((option) => { var _a; return ({
|
|
8738
|
+
}).map((option) => { var _a; return ({ label: (_a = option.label) !== null && _a !== void 0 ? _a : option.value, value: option.value }); });
|
|
8729
8739
|
}
|
|
8730
8740
|
return Array.from(this.selectRef.querySelectorAll('option'))
|
|
8731
8741
|
.filter((option) => {
|
|
@@ -8735,7 +8745,7 @@ class GovFormMultiSelect {
|
|
|
8735
8745
|
const selectedIndex = this.selectedValueIndex(option.value);
|
|
8736
8746
|
return !(option.disabled || option.selected || selectedIndex > -1);
|
|
8737
8747
|
})
|
|
8738
|
-
.map((option) => ({
|
|
8748
|
+
.map((option) => ({ label: option.textContent, value: option.value }));
|
|
8739
8749
|
}
|
|
8740
8750
|
initAutocomplete() {
|
|
8741
8751
|
var _a, _b, _c, _d, _e;
|
|
@@ -123,6 +123,7 @@ export declare class GovFormAutocomplete {
|
|
|
123
123
|
private onArrowDown;
|
|
124
124
|
private moveToView;
|
|
125
125
|
private doSearch;
|
|
126
|
+
private clearList;
|
|
126
127
|
get isValueAccepted(): boolean;
|
|
127
128
|
componentWillLoad(): void;
|
|
128
129
|
render(): any;
|
|
@@ -133,9 +134,13 @@ export declare class GovFormAutocomplete {
|
|
|
133
134
|
private onKeyUpHandler;
|
|
134
135
|
private onKeyDownHandler;
|
|
135
136
|
/**
|
|
136
|
-
*
|
|
137
|
+
* Focus main input element
|
|
137
138
|
*/
|
|
138
139
|
setFocus(options?: FocusOptions): Promise<void>;
|
|
140
|
+
/**
|
|
141
|
+
* Blur main input element
|
|
142
|
+
*/
|
|
143
|
+
setBlur(): Promise<void>;
|
|
139
144
|
/**
|
|
140
145
|
* Set options for list
|
|
141
146
|
*/
|
|
@@ -602,7 +602,11 @@ export namespace Components {
|
|
|
602
602
|
*/
|
|
603
603
|
"required": boolean;
|
|
604
604
|
/**
|
|
605
|
-
*
|
|
605
|
+
* Blur main input element
|
|
606
|
+
*/
|
|
607
|
+
"setBlur": () => Promise<void>;
|
|
608
|
+
/**
|
|
609
|
+
* Focus main input element
|
|
606
610
|
*/
|
|
607
611
|
"setFocus": (options?: FocusOptions) => Promise<void>;
|
|
608
612
|
/**
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@gov-design-system-ce/components",
|
|
3
3
|
"description": "This package includes Gov Design System Web Components and related utilities.",
|
|
4
4
|
"author": "Zdeněk Vítek",
|
|
5
|
-
"version": "4.0.8-
|
|
5
|
+
"version": "4.0.8-rc08",
|
|
6
6
|
"license": "EUPL v1.2 Licensed",
|
|
7
7
|
"main": "./dist/index.cjs.js",
|
|
8
8
|
"unpkg": "./dist/core/core.esm.js",
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{p as t,H as e,c as i,h as s,d as o}from"./p-2dee9951.js";import{a}from"./p-c353678b.js";import{v as n}from"./p-dcb5fb35.js";import{c as r}from"./p-24636c53.js";import{d as h,t as l,h as c}from"./p-03990da5.js";import{F as m,a as d,b as p}from"./p-f04382c3.js";import{p as g}from"./p-ab5a13ea.js";import{d as u}from"./p-245d3ff5.js";import{d as f}from"./p-281b05f0.js";const v='.gov-form-autocomplete__list{margin:0;padding:0}.gov-form-autocomplete__list>.gov-form-autocomplete__item{margin:0;padding:0;background:none}.gov-form-autocomplete__list>.gov-form-autocomplete__item::before{display:none}.gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}@keyframes countdown{to{transform:scaleX(0)}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes pulse{0%{opacity:1}50%{opacity:0.4}100%{opacity:1}}.gov-form-autocomplete{position:relative;display:block;width:100%}.gov-form-autocomplete__list{font-weight:var(--gov-text-s-font-weight);font-size:var(--gov-text-s-font-size);line-height:var(--gov-text-s-line-height);letter-spacing:var(--gov-text-s-letter-spacing);position:absolute;top:100%;right:0;left:0;z-index:5;max-height:14.0625rem;margin-top:0.5rem;border:var(--gov-autocomplete-item-hover, 0.0625rem solid var(--gov-color-secondary-500));border-radius:var(--gov-border-radius, 0.1875rem);background:var(--gov-autocomplete-bg, var(--gov-color-neutral-white));overflow-x:hidden;overflow-y:auto;overscroll-behavior:none}.gov-form-autocomplete__list>.gov-form-autocomplete__item{padding:0.75rem 0.5rem;cursor:pointer}.gov-form-autocomplete__item--empty,.gov-form-autocomplete__item--loading{padding:0.75rem 0.5rem;color:var(--gov-autocomplete-item-disable-color, var(--gov-color-secondary-600))}.gov-form-autocomplete__item--empty .gov-icon,.gov-form-autocomplete__item--empty .gov-spin-animation,.gov-form-autocomplete__item--loading .gov-icon,.gov-form-autocomplete__item--loading .gov-spin-animation{width:12px;height:12px}.gov-form-autocomplete__list:empty{display:none}.gov-form-autocomplete__item[aria-selected=""],.gov-form-autocomplete__item[aria-selected=true i],.gov-form-autocomplete__item[aria-selected="1"]{background:var(--gov-autocomplete-item-select, var(--gov-color-secondary-400))}@media not all and (pointer: coarse){.gov-form-autocomplete__item:hover{background:var(--gov-autocomplete-item-hover, var(--gov-color-primary-100))}}';const y=t(class t extends e{constructor(){super();this.__registerHost();this.govFocus=i(this,"gov-focus",7);this.govBlur=i(this,"gov-blur",7);this.govInput=i(this,"gov-input",7);this.govSelect=i(this,"gov-select",7);this.templateResolver=t=>t[this.nameKey];this.value="";this.options=undefined;this.identifier=undefined;this.variant=undefined;this.success=undefined;this.size="m";this.nameKey="name";this.name=undefined;this.required=false;this.disabled=false;this.placeholder=undefined;this.readonly=undefined;this.invalid=undefined;this.minlength=3;this.maxlength=undefined;this.throttleTime=200;this.messageEmpty="Nebyly nalezeny žádné výsledky";this.messageLoading="Načítám...";this.wcagDescribedBy=undefined;this.wcagLabelledBy=undefined;this.wcagOwns=undefined;this.focused=undefined;this.processing=false;this.arrowCounter=-1;this.list=[];this.listBoxId=r("GovListBox")}validateVariant(t){n(d,t,m.root)}validateSize(t){n(p,t,m.root)}watchOptions(t){this.setOptions(g(t)).catch()}onArrowUp(){if(this.arrowCounter>0){this.arrowCounter=this.arrowCounter-1;this.moveToView().finally()}}onArrowDown(){if(this.arrowCounter<this.list.length-1){this.arrowCounter=this.arrowCounter+1;this.moveToView().finally()}}async moveToView(){await h(200);const t=this.listRef.offsetHeight;const e=this.listRef.querySelector('li[aria-selected="true"]');if(e&&t){const t=e.offsetTop;this.listRef.scrollTo({top:t,behavior:"smooth"})}}doSearch(){if(Number.isInteger(this.minlength)&&this.isValueAccepted===false&&this.minlength){this.list=[];this.arrowCounter=-1;this.processing=false;return}if(this.searchCallback){this.processing=true;this.searchCallback(this.value).then((t=>this.list=t)).catch((()=>this.list=[])).finally((()=>{this.arrowCounter=-1;this.processing=false}))}}get isValueAccepted(){if(typeof this.value==="string"){return this.value.length>=this.minlength}else{return false}}componentWillLoad(){this.validateVariant(this.variant);this.validateSize(this.size)}render(){return s(o,{class:m.root,size:this.size,variant:this.variant},s("gov-form-input",{placeholder:this.placeholder,name:this.name,disabled:this.disabled,readonly:this.readonly,autocomplete:false,size:this.size,variant:this.variant,required:this.required,invalid:this.invalid,success:this.success,role:"searchbox",value:this.value,minlength:this.minlength,maxlength:this.maxlength,"on-gov-input":l(this.onInputHandler.bind(this),this.throttleTime),"on-gov-keyup":this.onKeyUpHandler.bind(this),"on-gov-keydown":this.onKeyDownHandler.bind(this),"on-gov-focus":this.onFocusHandler.bind(this),"on-gov-blur":this.onBlurHandler.bind(this),wcagAutocomplete:"list",wcagDescribedBy:this.wcagDescribedBy,wcagLabelledBy:this.wcagLabelledBy,wcagOwns:[this.listBoxId,this.wcagOwns].join(" "),wcagExpanded:this.list.length&&this.focused,ref:t=>this.inputRef=t},s("slot",{slot:"right-icon",name:"right-icon"})),s("ul",{class:m.list,role:"listbox",id:this.listBoxId,ref:t=>this.listRef=t},this.focused&&this.list.length===0&&this.processing===false&&this.isValueAccepted&&this.messageEmpty?s("li",{class:m.empty},this.messageEmpty):null,this.focused&&this.processing===true&&this.isValueAccepted?s("li",{class:m.loading},s("gov-icon",{name:"loader",class:"gov-spin-animation"})," ",this.messageLoading):null,this.list.map(((t,e)=>{const i=this.arrowCounter===e;return s("li",{class:m.item,innerHTML:this.templateResolver(t,i),role:"option","aria-posinset":e,tabindex:i?0:-1,"aria-setsize":this.list.length,onTouchStart:t=>this.onSelectHandler(t,e),onMouseDown:t=>this.onSelectHandler(t,e),"aria-selected":a(i)})}))))}onFocusHandler(t){this.focused=true;this.arrowCounter=-1;if(this.isValueAccepted&&this.searchCallback){this.doSearch()}t.stopPropagation();this.govFocus.emit({originalEvent:t,component:m.root,value:this.value,selected:null})}onBlurHandler(t){this.focused=false;const e=g(this.options);if(e.length===0){this.list=[]}this.arrowCounter=-1;t.stopPropagation();this.govBlur.emit({originalEvent:t,component:m.root,value:this.value,selected:null})}onInputHandler(t){this.value=t.target.value;t.stopPropagation();this.govInput.emit({originalEvent:t,component:m.root,value:this.value,selected:null});this.doSearch()}onSelectHandler(t,e=-1){let i=null;if(e>-1){i=this.list[e]}else if(c(this.arrowCounter,this.list)){i=this.list[this.arrowCounter]}if(i){this.govSelect.emit({component:m.root,value:this.value,selected:i,originalEvent:t});this.list=[];if(c(this.nameKey,i)&&typeof i[this.nameKey]==="string"){this.value=i[this.nameKey]}}}onKeyUpHandler(t){const e=t.detail.originalEvent;t.stopPropagation();e.stopPropagation();if(e.keyCode===38)this.onArrowUp();else if(e.keyCode===40)this.onArrowDown();else if(e.keyCode===13){t.preventDefault();e.preventDefault();this.onSelectHandler(t)}}onKeyDownHandler(t){const e=t.detail.originalEvent;t.stopPropagation();e.stopPropagation();if(e.keyCode===13){t.preventDefault();e.preventDefault()}}async setFocus(t){return this.inputRef.focus(t)}async setOptions(t){this.list=Array.isArray(t)?t:[];this.arrowCounter=-1}async clearValue(){this.value="";this.inputRef.value="";await this.inputRef.clearValue()}async setProcessing(t){this.processing=t}async setSearchCallback(t){this.searchCallback=t}async setTemplateResolver(t){this.templateResolver=t}get host(){return this}static get watchers(){return{variant:["validateVariant"],size:["validateSize"],options:["watchOptions"]}}static get style(){return v}},[4,"gov-form-autocomplete",{value:[1537],options:[1537],identifier:[1],variant:[1],success:[4],size:[1],nameKey:[1,"name-key"],name:[1],required:[4],disabled:[4],placeholder:[1],readonly:[4],invalid:[4],minlength:[2],maxlength:[2],throttleTime:[2,"throttle-time"],messageEmpty:[1,"message-empty"],messageLoading:[1,"message-loading"],wcagDescribedBy:[1,"wcag-described-by"],wcagLabelledBy:[1,"wcag-labelled-by"],wcagOwns:[1,"wcag-owns"],focused:[32],processing:[32],arrowCounter:[32],list:[32],setFocus:[64],setOptions:[64],clearValue:[64],setProcessing:[64],setSearchCallback:[64],setTemplateResolver:[64]}]);function b(){if(typeof customElements==="undefined"){return}const t=["gov-form-autocomplete","gov-form-input","gov-icon"];t.forEach((t=>{switch(t){case"gov-form-autocomplete":if(!customElements.get(t)){customElements.define(t,y)}break;case"gov-form-input":if(!customElements.get(t)){u()}break;case"gov-icon":if(!customElements.get(t)){f()}break}}))}b();export{y as G,b as d};
|
|
2
|
-
//# sourceMappingURL=p-86a37e8c.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["govFormAutocompleteCss","GovFormAutocomplete","proxyCustomElement","H","constructor","this","templateResolver","item","nameKey","listBoxId","createID","validateVariant","newValue","validateProp","FormAutocompleteVariants","FormAutocompleteClass","root","validateSize","FormAutocompleteSizes","watchOptions","setOptions","propsValueToArray","catch","onArrowUp","arrowCounter","moveToView","finally","onArrowDown","list","length","delay","heightOfList","listRef","offsetHeight","selected","querySelector","offsetTop","scrollTo","top","behavior","doSearch","Number","isInteger","minlength","isValueAccepted","processing","searchCallback","value","then","response","componentWillLoad","variant","size","render","h","Host","class","placeholder","name","disabled","readonly","autocomplete","required","invalid","success","role","maxlength","throttle","onInputHandler","bind","throttleTime","onKeyUpHandler","onKeyDownHandler","onFocusHandler","onBlurHandler","wcagAutocomplete","wcagDescribedBy","wcagLabelledBy","wcagOwns","join","wcagExpanded","focused","ref","el","inputRef","slot","id","messageEmpty","empty","loading","messageLoading","map","index","isSelected","innerHTML","tabindex","onTouchStart","e","onSelectHandler","onMouseDown","toBoolAttr","stopPropagation","govFocus","emit","originalEvent","component","areOptions","options","govBlur","target","govInput","has","govSelect","event","detail","keyCode","preventDefault","setFocus","focus","Array","isArray","clearValue","setProcessing","status","setSearchCallback","callback","setTemplateResolver"],"sources":["../../../packages/core/src/components/gov-form/autocomplete/gov-form-autocomplete.scss?tag=gov-form-autocomplete","../../../packages/core/src/components/gov-form/autocomplete/gov-form-autocomplete.tsx"],"sourcesContent":["$class: \".gov-form-autocomplete\";\n\n#{$class} {\n\t@include base();\n\t&__list {\n\t\t@include typography($font-size-s);\n\t\t@extend %reset-ul;\n\t\tposition: absolute;\n\t\ttop: 100%;\n\t\tright: 0;\n\t\tleft: 0;\n\t\tz-index: 5;\n\t\tmax-height: rem-calc(225);\n\t\tmargin-top: rem-calc(8);\n\t\tborder: $form-autocomplete-border;\n\t\tborder-radius: $border-radius;\n\t\tbackground: $form-autocomplete-bg;\n\t\toverflow-x: hidden;\n\t\toverflow-y: auto;\n\t\toverscroll-behavior: none;\n\t}\n\t&__list > &__item {\n\t\t@extend %reset-ul-li;\n\t\tpadding: rem-calc(12 8);\n\t\tcursor: pointer;\n\t}\n\t&__item {\n\t\t&--empty,\n\t\t&--loading {\n\t\t\tpadding: rem-calc(12 8);\n\t\t\tcolor: $form-autocomplete-item-disable-color;\n\t\t\t& .gov-icon,\n\t\t\t& .gov-spin-animation {\n\t\t\t\twidth: 12px;\n\t\t\t\theight: 12px;\n\t\t\t}\n\t\t}\n\t}\n\n\t// STATES\n\t&__list:empty {\n\t\tdisplay: none;\n\t}\n\n\t// HOVERS\n\t&__item {\n\t\t@include parameter(\"aria-selected\") {\n\t\t\tbackground: $form-autocomplete-item-select-bg;\n\t\t}\n\t\t@include hover() {\n\t\t\tbackground: $form-autocomplete-item-hover-bg;\n\t\t}\n\t}\n}\n","import {Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch} from '@stencil/core'\nimport {toBoolAttr} from '../../../helpers/Dom/template'\nimport {validateProp} from '../../../helpers/Validate/props'\nimport {Nullable} from '../../../types/interfaces'\nimport {createID} from '../../../utils/string.utils'\nimport {delay, has, throttle} from '../../../utils/utils'\nimport {FormInputEvent} from '../input/gov-form-input.types'\nimport {\n\tFormAutocompleteClass,\n\tFormAutocompleteSizes,\n\tFormAutocompleteVariants,\n\tSizesType,\n\tVariantType\n} from './constants'\nimport {FormAutocompleteEvent, GovFormAutocompleteItem} from './gov-form-autocomplete.types'\nimport {propsValueToArray} from \"../../../utils/array.utils\";\n\n@Component({\n\ttag: 'gov-form-autocomplete',\n\tstyleUrl: 'gov-form-autocomplete.scss',\n})\nexport class GovFormAutocomplete {\n\tprivate inputRef?: HTMLGovFormInputElement\n\tprivate listRef?: HTMLUListElement\n\tprivate readonly listBoxId: string\n\tprivate searchCallback: (value: string) => Promise<GovFormAutocompleteItem[]>\n\tprivate templateResolver: (item: GovFormAutocompleteItem, selected: boolean) => string = item => item[this.nameKey]\n\n\tconstructor() {\n\t\tthis.listBoxId = createID('GovListBox')\n\t}\n\n\t@Element() host: HTMLGovFormInputElement\n\t/**\n\t * Value of input\n\t */\n\t@Prop({reflect: true, mutable: true}) value = ''\n\t/**\n\t * Options of autocomplete\n\t */\n\t@Prop({reflect: true, mutable: true}) options?: string | GovFormAutocompleteItem[]\n\t/**\n\t * Custom input identifier.\n\t */\n\t@Prop({attribute: 'identifier'}) readonly identifier: string\n\t/**\n\t * Style variation of the form input.\n\t */\n\t@Prop() readonly variant?: VariantType\n\t/**\n\t * Indicates the entered value of child form element does conform to the format expected by the application.\n\t */\n\t@Prop() readonly success: boolean\n\t/**\n\t * Input’s size.\n\t */\n\t@Prop() readonly size?: SizesType = 'm'\n\t/**\n\t * Main key name in the object\n\t */\n\t@Prop() readonly nameKey: string = 'name'\n\t/**\n\t * Name of the input.\n\t */\n\t@Prop() readonly name: string\n\t/**\n\t * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.\n\t * When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Makes the input component disabled.\n\t * This prevents users from being able to interact with the select, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean = false\n\t/**\n\t * Text that appears in the form control when it has no value set\n\t */\n\t@Prop() readonly placeholder: string\n\t/**\n\t * The value is not editable\n\t */\n\t@Prop() readonly readonly: boolean\n\t/**\n\t * Indicates the entered value does not conform to the format expected by the application.\n\t */\n\t@Prop() readonly invalid: boolean\n\t/**\n\t * Minimum length (number of characters) of value\n\t */\n\t@Prop() readonly minlength: number = 3\n\t/**\n\t * Maximum length (number of characters) of value\n\t */\n\t@Prop() readonly maxlength: number\n\t/**\n\t * Input throttle in milliseconds\n\t */\n\t@Prop() readonly throttleTime: number = 200\n\t/**\n\t * Custom message for when there is a blank sheet\n\t */\n\t@Prop({attribute: 'message-empty'}) readonly messageEmpty: string = 'Nebyly nalezeny žádné výsledky'\n\t/**\n\t * Custom message for when data is loaded\n\t */\n\t@Prop({attribute: 'message-loading'}) readonly messageLoading: string = 'Načítám...'\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({attribute: 'wcag-described-by'}) readonly wcagDescribedBy: string\n\t/**\n\t * Indicates the id of a component that labels the input.\n\t */\n\t@Prop({attribute: 'wcag-labelled-by'}) readonly wcagLabelledBy: string\n\t/**\n\t * Same as original parameter\n\t * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-owns\n\t */\n\t@Prop({attribute: 'wcag-owns'}) readonly wcagOwns: string\n\t/**\n\t * Emitted when the input has focus.\n\t */\n\t@Event({eventName: 'gov-focus'}) govFocus: EventEmitter<FormAutocompleteEvent>\n\t/**\n\t * Emitted when the input loses focus.\n\t */\n\t@Event({eventName: 'gov-blur'}) govBlur: EventEmitter<FormAutocompleteEvent>\n\t/**\n\t * Emitted when the input change value.\n\t */\n\t@Event({eventName: 'gov-input'}) govInput: EventEmitter<FormAutocompleteEvent>\n\t/**\n\t * Emitted when the input change value.\n\t */\n\t@Event({eventName: 'gov-select'}) govSelect: EventEmitter<FormAutocompleteEvent>\n\t@State() focused: boolean\n\t@State() processing = false\n\t@State() arrowCounter = -1\n\t@State() list: GovFormAutocompleteItem[] = []\n\n\t@Watch('variant')\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(FormAutocompleteVariants, newValue, FormAutocompleteClass.root)\n\t}\n\n\t@Watch('size')\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(FormAutocompleteSizes, newValue, FormAutocompleteClass.root)\n\t}\n\n\t@Watch('options')\n\twatchOptions(newValue: string | GovFormAutocompleteItem[]): void {\n\t\tthis.setOptions(propsValueToArray(newValue)).catch()\n\t}\n\n\tprivate onArrowUp() {\n\t\tif (this.arrowCounter > 0) {\n\t\t\tthis.arrowCounter = this.arrowCounter - 1\n\t\t\tthis.moveToView().finally()\n\t\t}\n\t}\n\n\tprivate onArrowDown() {\n\t\tif (this.arrowCounter < this.list.length - 1) {\n\t\t\tthis.arrowCounter = this.arrowCounter + 1\n\t\t\tthis.moveToView().finally()\n\t\t}\n\t}\n\n\tprivate async moveToView() {\n\t\tawait delay(200)\n\t\tconst heightOfList = this.listRef.offsetHeight\n\t\tconst selected = this.listRef.querySelector('li[aria-selected=\"true\"]') as HTMLUListElement\n\t\tif (selected && heightOfList) {\n\t\t\tconst offsetTop = selected.offsetTop\n\t\t\tthis.listRef.scrollTo({top: offsetTop, behavior: 'smooth'})\n\t\t}\n\t}\n\n\tprivate doSearch() {\n\t\tif (Number.isInteger(this.minlength) && this.isValueAccepted === false && this.minlength) {\n\t\t\tthis.list = []\n\t\t\tthis.arrowCounter = -1\n\t\t\tthis.processing = false\n\t\t\treturn\n\t\t}\n\t\tif (this.searchCallback) {\n\t\t\tthis.processing = true\n\t\t\tthis.searchCallback(this.value)\n\t\t\t\t.then(response => (this.list = response))\n\t\t\t\t.catch(() => (this.list = []))\n\t\t\t\t.finally(() => {\n\t\t\t\t\tthis.arrowCounter = -1\n\t\t\t\t\tthis.processing = false\n\t\t\t\t})\n\t\t}\n\t}\n\n\tget isValueAccepted() {\n\t\tif (typeof this.value === 'string') {\n\t\t\treturn this.value.length >= this.minlength\n\t\t} else {\n\t\t\treturn false\n\t\t}\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.validateVariant(this.variant)\n\t\tthis.validateSize(this.size)\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={FormAutocompleteClass.root} size={this.size} variant={this.variant}>\n\t\t\t\t<gov-form-input\n\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\tname={this.name}\n\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\treadonly={this.readonly}\n\t\t\t\t\tautocomplete={false}\n\t\t\t\t\tsize={this.size}\n\t\t\t\t\tvariant={this.variant}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t\tinvalid={this.invalid}\n\t\t\t\t\tsuccess={this.success}\n\t\t\t\t\trole={'searchbox'}\n\t\t\t\t\tvalue={this.value}\n\t\t\t\t\tminlength={this.minlength}\n\t\t\t\t\tmaxlength={this.maxlength}\n\t\t\t\t\ton-gov-input={throttle(this.onInputHandler.bind(this), this.throttleTime)}\n\t\t\t\t\ton-gov-keyup={this.onKeyUpHandler.bind(this)}\n\t\t\t\t\ton-gov-keydown={this.onKeyDownHandler.bind(this)}\n\t\t\t\t\ton-gov-focus={this.onFocusHandler.bind(this)}\n\t\t\t\t\ton-gov-blur={this.onBlurHandler.bind(this)}\n\t\t\t\t\twcagAutocomplete={'list'}\n\t\t\t\t\twcagDescribedBy={this.wcagDescribedBy}\n\t\t\t\t\twcagLabelledBy={this.wcagLabelledBy}\n\t\t\t\t\twcagOwns={[this.listBoxId, this.wcagOwns].join(' ')}\n\t\t\t\t\twcagExpanded={this.list.length && this.focused}\n\t\t\t\t\tref={el => (this.inputRef = el as HTMLGovFormInputElement)}\n\t\t\t\t>\n\t\t\t\t\t<slot slot=\"right-icon\" name=\"right-icon\"/>\n\t\t\t\t</gov-form-input>\n\t\t\t\t<ul class={FormAutocompleteClass.list} role={'listbox'} id={this.listBoxId}\n\t\t\t\t\t\tref={el => (this.listRef = el as HTMLUListElement)}>\n\t\t\t\t\t{this.focused && this.list.length === 0 && this.processing === false && this.isValueAccepted && this.messageEmpty ? (\n\t\t\t\t\t\t<li class={FormAutocompleteClass.empty}>{this.messageEmpty}</li>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{this.focused && this.processing === true && this.isValueAccepted ? (\n\t\t\t\t\t\t<li class={FormAutocompleteClass.loading}>\n\t\t\t\t\t\t\t<gov-icon name=\"loader\" class=\"gov-spin-animation\"></gov-icon>\n\t\t\t\t\t\t\t {this.messageLoading}\n\t\t\t\t\t\t</li>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{this.list.map((item, index) => {\n\t\t\t\t\t\tconst isSelected = this.arrowCounter === index\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t\tclass={FormAutocompleteClass.item}\n\t\t\t\t\t\t\t\tinnerHTML={this.templateResolver(item, isSelected)}\n\t\t\t\t\t\t\t\trole={'option'}\n\t\t\t\t\t\t\t\taria-posinset={index}\n\t\t\t\t\t\t\t\ttabindex={isSelected ? 0 : -1}\n\t\t\t\t\t\t\t\taria-setsize={this.list.length}\n\t\t\t\t\t\t\t\tonTouchStart={(e: TouchEvent) => this.onSelectHandler(e, index)}\n\t\t\t\t\t\t\t\tonMouseDown={(e: PointerEvent) => this.onSelectHandler(e, index)}\n\t\t\t\t\t\t\t\taria-selected={toBoolAttr(isSelected)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)\n\t\t\t\t\t})}\n\t\t\t\t</ul>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onFocusHandler(e: FocusEvent) {\n\t\tthis.focused = true\n\t\tthis.arrowCounter = -1\n\t\tif (this.isValueAccepted && this.searchCallback) {\n\t\t\tthis.doSearch()\n\t\t}\n\t\te.stopPropagation()\n\t\tthis.govFocus.emit({\n\t\t\toriginalEvent: e,\n\t\t\tcomponent: FormAutocompleteClass.root,\n\t\t\tvalue: this.value,\n\t\t\tselected: null,\n\t\t})\n\t}\n\n\tprivate onBlurHandler(e: FocusEvent) {\n\t\tthis.focused = false\n\t\tconst areOptions = propsValueToArray<GovFormAutocompleteItem[]>(this.options)\n\t\tif (areOptions.length === 0) {\n\t\t\tthis.list = []\n\t\t}\n\t\tthis.arrowCounter = -1\n\t\te.stopPropagation()\n\t\tthis.govBlur.emit({\n\t\t\toriginalEvent: e,\n\t\t\tcomponent: FormAutocompleteClass.root,\n\t\t\tvalue: this.value,\n\t\t\tselected: null,\n\t\t})\n\t}\n\n\tprivate onInputHandler(e: InputEvent) {\n\t\tthis.value = (e.target as HTMLGovFormInputElement).value\n\t\te.stopPropagation()\n\t\tthis.govInput.emit({\n\t\t\toriginalEvent: e,\n\t\t\tcomponent: FormAutocompleteClass.root,\n\t\t\tvalue: this.value,\n\t\t\tselected: null,\n\t\t})\n\t\tthis.doSearch()\n\t}\n\n\tprivate onSelectHandler(e: PointerEvent | CustomEvent | TouchEvent, index = -1) {\n\t\tlet selected: Nullable<GovFormAutocompleteItem> = null\n\t\tif (index > -1) {\n\t\t\tselected = this.list[index]\n\t\t} else if (has(this.arrowCounter, this.list)) {\n\t\t\tselected = this.list[this.arrowCounter]\n\t\t}\n\t\tif (selected) {\n\t\t\tthis.govSelect.emit({\n\t\t\t\tcomponent: FormAutocompleteClass.root,\n\t\t\t\tvalue: this.value,\n\t\t\t\tselected: selected,\n\t\t\t\toriginalEvent: e,\n\t\t\t})\n\t\t\tthis.list = []\n\t\t\tif (has(this.nameKey, selected) && typeof selected[this.nameKey] === 'string') {\n\t\t\t\tthis.value = selected[this.nameKey]\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate onKeyUpHandler(e: CustomEvent) {\n\t\tconst event = (e.detail as FormInputEvent).originalEvent as KeyboardEvent\n\t\te.stopPropagation()\n\t\tevent.stopPropagation()\n\t\tif (event.keyCode === 38) this.onArrowUp()\n\t\telse if (event.keyCode === 40) this.onArrowDown()\n\t\telse if (event.keyCode === 13) {\n\t\t\te.preventDefault()\n\t\t\tevent.preventDefault()\n\t\t\tthis.onSelectHandler(e)\n\t\t}\n\t}\n\n\tprivate onKeyDownHandler(e: CustomEvent) {\n\t\tconst event = (e.detail as FormInputEvent).originalEvent as KeyboardEvent\n\t\te.stopPropagation()\n\t\tevent.stopPropagation()\n\t\tif (event.keyCode === 13) {\n\t\t\te.preventDefault()\n\t\t\tevent.preventDefault()\n\t\t}\n\t}\n\n\t/**\n\t * Returns the current state of the component\n\t */\n\t@Method()\n\tasync setFocus(options?: FocusOptions): Promise<void> {\n\t\treturn this.inputRef.focus(options)\n\t}\n\n\t/**\n\t * Set options for list\n\t */\n\t@Method()\n\tasync setOptions(options: GovFormAutocompleteItem[]): Promise<void> {\n\t\tthis.list = Array.isArray(options) ? options : []\n\t\tthis.arrowCounter = -1\n\t}\n\n\t/**\n\t * Clears whisperer value\n\t */\n\t@Method()\n\tasync clearValue(): Promise<void> {\n\t\tthis.value = ''\n\t\tthis.inputRef.value = ''\n\n\t\tawait this.inputRef.clearValue()\n\t}\n\n\t/**\n\t * Clears whisperer value\n\t */\n\t@Method()\n\tasync setProcessing(status: boolean): Promise<void> {\n\t\tthis.processing = status\n\t}\n\n\t/**\n\t * Set a custom asynchronous function for the whisperer\n\t */\n\t@Method()\n\tasync setSearchCallback(callback: (value: string) => Promise<any>) {\n\t\tthis.searchCallback = callback\n\t}\n\n\t/**\n\t * Setting a custom whisper result template\n\t * @param callback\n\t */\n\t@Method()\n\tasync setTemplateResolver(callback: (item: GovFormAutocompleteItem) => string) {\n\t\tthis.templateResolver = callback\n\t}\n}\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["govFormMultiSelectCss","GovFormMultiSelect","constructor","hostRef","this","selectId","createID","listId","h","govHost","host","f","govForm","validateVariant","newValue","validateProp","FormMultiselectVariants","FormMultiSelectClass","root","validateSize","FormMultiselectSizes","watchOptions","optionsState","propsValueToArray","watchValue","selectedOptionsState","watchDisabled","passControlAttrs","passAttrToControl","size","toBoolAttr","invalid","success","componentWillLoad","variant","passAttrToLabel","String","required","options","value","getAvailableOptions","ignoreFilter","Array","isArray","length","filter","option","selectedIndex","selectedValueIndex","disabled","map","_a","name","label","from","selectRef","querySelectorAll","selected","textContent","initAutocomplete","autocompleteRef","addEventListener","onSelectHandler","bind","_b","onInputHandler","_c","onFocusHandler","_d","onBlurHandler","_e","setSearchCallback","searchString","Promise","resolve","data","removeDiacritics","toLowerCase","indexOf","finally","findIndex","getOptionElement","querySelector","getOption","find","selectOption","newOption","notify","index","govChange","emit","component","govSelect","removeOption","splice","govRemove","componentDidLoad","componentDidRender","tick","forEach","canValidateWcagOnRender","delay","validateWcag","render","Host","class","wrap","hasSlot","valueState","identifier","placeholder","messageEmpty","messageLoading","ref","el","minlength","wcagDescribedBy","wcagLabelledBy","wcagOwns","slot","hidden","multiple","toBoolAttrIfDefined","selectedOption","hideSelectedList","role","id","list","item","wcagLabel","type","onTagRemove","e","stopPropagation","focused","govFocus","originalEvent","govBlur","detail","clearValue","focus","setFocus","setValue","getRef","validateWcagRef","validateWcagLabelFor"],"sources":["../../../packages/core/src/components/gov-form/multiselect/gov-form-multi-select.scss?tag=gov-form-multi-select","../../../packages/core/src/components/gov-form/multiselect/gov-form-multi-select.tsx"],"sourcesContent":["/*\n * Multiselect\n */\n\n@import \"../select/gov-form-select-core.scss\";\n$class: \".gov-form-multi-select\";\n\n#{$class} {\n\t@extend %form-select-core;\n\tflex-wrap: wrap;\n\t&__wrap {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: rem-calc(8);\n\t\twidth: 100%;\n\t}\n\t&__list {\n\t\t@extend %reset-ul;\n\t\t@include typography($font-size-xs);\n\t\tdisplay: flex;\n\t\tgap: rem-calc(8);\n\t\tflex-wrap: wrap;\n\t}\n\t&__list > &__item {\n\t\t@extend %reset-ul-li;\n\t\tposition: relative;\n\t\tdisplay: flex;\n\t\tflex: 0 0 auto;\n\t\talign-items: center;\n\t\tpadding: rem-calc(0 0 0 8);\n\t\tbackground: $form-multiselect-bg;\n\t\ttransition: $t linear background-color;\n\t}\n}\n","import {Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch} from '@stencil/core'\nimport {govForm} from '../../../helpers/Dom/form'\nimport {GovForm} from '../../../helpers/Dom/form.types'\nimport {govHost, toBoolAttr, toBoolAttrIfDefined} from '../../../helpers/Dom/template'\nimport {GovHost} from '../../../helpers/Dom/template.types'\nimport {canValidateWcagOnRender} from '../../../helpers/Dom/win'\nimport {validateProp} from '../../../helpers/Validate/props'\nimport {validateWcagLabelFor, validateWcagRef} from '../../../helpers/Validate/wcag'\nimport {Nullable} from '../../../types/interfaces'\nimport {createID, removeDiacritics} from '../../../utils/string.utils'\nimport {delay} from '../../../utils/utils'\nimport {FormAutocompleteEvent} from '../autocomplete/gov-form-autocomplete.types'\nimport {\n\tFormMultiSelectClass,\n\tFormMultiselectSizes,\n\tFormMultiselectSizesType,\n\tFormMultiselectVariants,\n\tFormMultiselectVariantType\n} from './constants'\nimport {\n\tFormMultiselectEvent,\n\tGovFormMultiSelectItem,\n\tGovFormMultiSelectSelectedItem\n} from './gov-form-multi-select.types'\nimport {propsValueToArray} from \"../../../utils/array.utils\";\nimport {tick} from \"../../../utils/stencil.utils\";\n\n@Component({\n\ttag: 'gov-form-multi-select',\n\tstyleUrl: 'gov-form-multi-select.scss',\n})\nexport class GovFormMultiSelect {\n\tprivate f: GovForm\n\tprivate readonly h: GovHost\n\n\tprivate selectRef?: HTMLSelectElement\n\tprivate autocompleteRef?: HTMLGovFormAutocompleteElement\n\n\tprivate readonly selectId: string\n\tprivate readonly listId: string\n\n\tconstructor() {\n\t\tthis.selectId = createID('GovSelect')\n\t\tthis.listId = createID('GovMultiList')\n\n\t\tthis.h = govHost(this.host)\n\t\tthis.f = govForm(this.h)\n\t}\n\n\t@Element() host: HTMLGovFormSelectElement\n\t/**\n\t * Value of multi-select\n\t */\n\t@Prop({reflect: true, mutable: true}) value: string | GovFormMultiSelectSelectedItem[]\n\t/**\n\t * Options of multi-select\n\t */\n\t@Prop({reflect: true, mutable: true}) options?: string | GovFormMultiSelectItem[]\n\t/**\n\t * Custom select identifier.\n\t */\n\t@Prop({attribute: 'identifier'}) readonly identifier: string\n\t/**\n\t * Custom select placeholder.\n\t */\n\t@Prop({attribute: 'placeholder'}) readonly placeholder: string\n\t/**\n\t * Style variation of the form select.\n\t */\n\t@Prop() readonly variant?: FormMultiselectVariantType\n\t/**\n\t * Select’s size.\n\t */\n\t@Prop() readonly size?: FormMultiselectSizesType = 'm'\n\t/**\n\t * Name of the select.\n\t */\n\t@Prop() readonly name: string\n\t/**\n\t * Option to hide the list of selected items\n\t */\n\t@Prop({attribute: 'hide-selected-list'}) readonly hideSelectedList: boolean = false\n\t/**\n\t * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.\n\t * When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Makes the select component disabled.\n\t * This prevents users from being able to interact with the select, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean = false\n\t/**\n\t * Indicates the entered value does not conform to the format expected by the application.\n\t */\n\t@Prop() readonly invalid: boolean\n\t/**\n\t * Indicates the entered value of child form element does conform to the format expected by the application.\n\t */\n\t@Prop() readonly success: boolean\n\t/**\n\t * Custom message for when there is a blank sheet\n\t */\n\t@Prop({attribute: 'message-empty'}) readonly messageEmpty: string = 'Nebyly nalezeny žádné výsledky'\n\t/**\n\t * Custom message for when data is loaded\n\t */\n\t@Prop({attribute: 'message-loading'}) readonly messageLoading: string = 'Načítám...'\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({attribute: 'wcag-described-by'}) readonly wcagDescribedBy: string\n\t/**\n\t * Indicates the id of a component that labels the input.\n\t */\n\t@Prop({attribute: 'wcag-labelled-by'}) readonly wcagLabelledBy: string\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({attribute: 'wcag-owns'}) readonly wcagOwns: string\n\t/**\n\t * Emitted when the select has focus.\n\t */\n\t@Event({eventName: 'gov-focus'}) govFocus: EventEmitter<FormMultiselectEvent>\n\t/**\n\t * Emitted when the select loses focus.\n\t */\n\t@Event({eventName: 'gov-blur'}) govBlur: EventEmitter<FormMultiselectEvent>\n\t/**\n\t * Emitted when the select change value.\n\t */\n\t@Event({eventName: 'gov-change'}) govChange: EventEmitter<FormMultiselectEvent>\n\t/**\n\t * Emitted when an item is selected\n\t */\n\t@Event({eventName: 'gov-select'}) govSelect: EventEmitter<FormMultiselectEvent>\n\t/**\n\t * Emitted when an item is removed\n\t */\n\t@Event({eventName: 'gov-remove'}) govRemove: EventEmitter<FormMultiselectEvent>\n\n\t@State() focused: boolean\n\t@State() valueState: string\n\t@State() selectedOptionsState: GovFormMultiSelectSelectedItem[] = []\n\t@State() optionsState: GovFormMultiSelectItem[] = []\n\n\t@Watch('variant')\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(FormMultiselectVariants, newValue, FormMultiSelectClass.root)\n\t}\n\n\t@Watch('size')\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(FormMultiselectSizes, newValue, FormMultiSelectClass.root)\n\t}\n\n\t@Watch('options')\n\twatchOptions(newValue: string | GovFormMultiSelectItem[]): void {\n\t\tthis.optionsState = propsValueToArray(newValue)\n\t}\n\n\t@Watch('value')\n\twatchValue(newValue: string | GovFormMultiSelectItem[]): void {\n\t\tthis.selectedOptionsState = propsValueToArray(newValue)\n\t}\n\n\t@Watch('disabled')\n\t@Watch('invalid')\n\t@Watch('success')\n\t@Watch('size')\n\twatchDisabled(): void {\n\t\tthis.passControlAttrs()\n\t}\n\n\tprivate passControlAttrs() {\n\t\tthis.f.passAttrToControl('size', this.size)\n\t\tthis.f.passAttrToControl('invalid', toBoolAttr(this.invalid))\n\t\tthis.f.passAttrToControl('success', toBoolAttr(this.success))\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.validateVariant(this.variant)\n\t\tthis.validateSize(this.size)\n\t\tthis.watchDisabled()\n\t\tthis.passControlAttrs()\n\t\tthis.f.passAttrToLabel('required', String(this.required))\n\t\tthis.optionsState = propsValueToArray(this.options)\n\t\tthis.selectedOptionsState = propsValueToArray(this.value)\n\t}\n\n\tprivate getAvailableOptions(ignoreFilter = false): GovFormMultiSelectItem[] {\n\t\tif (Array.isArray(this.optionsState) && this.optionsState.length) {\n\t\t\tif (ignoreFilter) {\n\t\t\t\treturn this.optionsState;\n\t\t\t}\n\t\t\treturn this.optionsState.filter((option) => {\n\t\t\t\tconst selectedIndex = this.selectedValueIndex(option.value)\n\t\t\t\treturn (selectedIndex !== -1 || option?.disabled) ? false : true\n\t\t\t}).map((option) => ({name: option.label ?? option.value, value: option.value}))\n\t\t}\n\t\treturn Array.from(this.selectRef.querySelectorAll('option'))\n\t\t\t.filter((option: HTMLOptionElement) => {\n\t\t\t\tif (ignoreFilter) {\n\t\t\t\t\treturn true\n\t\t\t\t}\n\t\t\t\tconst selectedIndex = this.selectedValueIndex(option.value)\n\t\t\t\treturn !(option.disabled || option.selected || selectedIndex > -1)\n\t\t\t})\n\t\t\t.map((option: HTMLOptionElement) => ({name: option.textContent, value: option.value}))\n\t}\n\n\tprivate initAutocomplete() {\n\t\tthis.autocompleteRef?.addEventListener('gov-select', this.onSelectHandler.bind(this))\n\t\tthis.autocompleteRef?.addEventListener('gov-input', this.onInputHandler.bind(this))\n\t\tthis.autocompleteRef?.addEventListener('gov-focus', this.onFocusHandler.bind(this))\n\t\tthis.autocompleteRef?.addEventListener('gov-blur', this.onBlurHandler.bind(this))\n\t\tthis.autocompleteRef\n\t\t\t?.setSearchCallback(searchString => {\n\t\t\t\treturn new Promise(resolve => {\n\t\t\t\t\tconst data = this.getAvailableOptions()\n\t\t\t\t\tif (String(searchString).length === 0) {\n\t\t\t\t\t\treturn resolve(data)\n\t\t\t\t\t}\n\t\t\t\t\tresolve(\n\t\t\t\t\t\tdata.filter(({label, value}) => {\n\t\t\t\t\t\t\tif (!label) label = value;\n\t\t\t\t\t\t\treturn removeDiacritics(label).toLowerCase().indexOf(removeDiacritics(searchString).toLowerCase()) > -1\n\t\t\t\t\t\t})\n\t\t\t\t\t)\n\t\t\t\t})\n\t\t\t})\n\t\t\t.finally()\n\t}\n\n\tprivate selectedValueIndex(value: GovFormMultiSelectSelectedItem) {\n\t\treturn this.selectedOptionsState.findIndex((selected) => selected === value)\n\t}\n\n\tprivate getOptionElement(value: GovFormMultiSelectSelectedItem): Nullable<HTMLOptionElement> {\n\t\treturn this.selectRef.querySelector('option[value=\"' + value + '\"]') as HTMLOptionElement\n\t}\n\n\tprivate getOption(value: GovFormMultiSelectSelectedItem): GovFormMultiSelectItem | null {\n\t\treturn this.getAvailableOptions(true).find((option) => option.value === value) ?? null;\n\t}\n\n\tprivate selectOption(newOption: GovFormMultiSelectSelectedItem, notify = true) {\n\t\tconst index = this.selectedValueIndex(newOption)\n\t\tif (index === -1) {\n\t\t\tthis.selectedOptionsState = [...this.selectedOptionsState, newOption]\n\t\t\tthis.value = this.selectedOptionsState;\n\t\t\tif (notify) {\n\t\t\t\tthis.govChange.emit({\n\t\t\t\t\tcomponent: FormMultiSelectClass.root,\n\t\t\t\t\tvalue: this.selectedOptionsState,\n\t\t\t\t})\n\t\t\t\tthis.govSelect.emit({\n\t\t\t\t\tcomponent: FormMultiSelectClass.root,\n\t\t\t\t\tvalue: this.selectedOptionsState,\n\t\t\t\t})\n\t\t\t}\n\t\t\tconst option = this.getOptionElement(newOption)\n\t\t\tif (option) {\n\t\t\t\toption.selected = true\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate removeOption(removeOption: GovFormMultiSelectSelectedItem, notify = true) {\n\t\tconst index = this.selectedValueIndex(removeOption)\n\t\tif (index !== -1) {\n\t\t\tthis.selectedOptionsState.splice(index, 1)\n\t\t\tthis.selectedOptionsState = [...this.selectedOptionsState]\n\t\t\tthis.value = this.selectedOptionsState;\n\t\t\tif (notify) {\n\t\t\t\tthis.govChange.emit({\n\t\t\t\t\tcomponent: FormMultiSelectClass.root,\n\t\t\t\t\tvalue: this.selectedOptionsState,\n\t\t\t\t})\n\t\t\t\tthis.govRemove.emit({\n\t\t\t\t\tcomponent: FormMultiSelectClass.root,\n\t\t\t\t\tvalue: this.selectedOptionsState,\n\t\t\t\t})\n\t\t\t}\n\t\t\tconst option = this.getOptionElement(removeOption)\n\t\t\tif (option) {\n\t\t\t\toption.selected = false\n\t\t\t}\n\t\t}\n\t}\n\n\tasync componentDidLoad() {\n\t\tthis.initAutocomplete()\n\t}\n\n\tasync componentDidRender() {\n\t\ttick(() => {\n\t\t\tthis.selectRef.querySelectorAll('option').forEach((option: HTMLOptionElement) => {\n\t\t\t\tif (option.selected) {\n\t\t\t\t\tthis.selectOption(option.value, false)\n\t\t\t\t}\n\t\t\t})\n\t\t})\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateWcag()\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={FormMultiSelectClass.root} size={this.size} variant={this.variant}>\n\t\t\t\t<div class={FormMultiSelectClass.wrap}>\n\t\t\t\t\t{this.h.hasSlot('prefix') && <slot name=\"prefix\"></slot>}\n\t\t\t\t\t<div class=\"element\">\n\t\t\t\t\t\t<gov-form-autocomplete\n\t\t\t\t\t\t\tvalue={this.valueState}\n\t\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\t\tidentifier={this.identifier || this.selectId}\n\t\t\t\t\t\t\trequired={false}\n\t\t\t\t\t\t\tsize={this.size}\n\t\t\t\t\t\t\tvariant={this.variant}\n\t\t\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\t\t\tmessage-empty={this.messageEmpty}\n\t\t\t\t\t\t\tmessage-loading={this.messageLoading}\n\t\t\t\t\t\t\tref={el => (this.autocompleteRef = el as HTMLGovFormAutocompleteElement)}\n\t\t\t\t\t\t\tminlength={0}\n\t\t\t\t\t\t\twcagDescribedBy={this.wcagDescribedBy}\n\t\t\t\t\t\t\twcagLabelledBy={this.wcagLabelledBy}\n\t\t\t\t\t\t\twcagOwns={this.listId}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<gov-icon slot=\"right-icon\" class=\"icon-arrow\" name=\"chevron-down\"></gov-icon>\n\t\t\t\t\t\t{this.h.hasSlot('right-icon') && !(this.success || this.invalid) && <slot name=\"right-icon\"/>}\n\t\t\t\t\t\t{this.success && <gov-icon slot=\"right-icon\" class=\"icon-validation\" name=\"check-lg\"></gov-icon>}\n\t\t\t\t\t\t{this.invalid && <gov-icon slot=\"right-icon\" class=\"icon-validation\" name=\"exclamation-lg\"></gov-icon>}\n\t\t\t\t\t\t<select\n\t\t\t\t\t\t\thidden\n\t\t\t\t\t\t\tclass={'hidden-select-list'}\n\t\t\t\t\t\t\taria-hidden={toBoolAttr(true)}\n\t\t\t\t\t\t\tmultiple\n\t\t\t\t\t\t\trequired={this.required}\n\t\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\t\tref={el => (this.selectRef = el as HTMLSelectElement)}\n\t\t\t\t\t\t\taria-disabled={toBoolAttrIfDefined(this.disabled)}\n\t\t\t\t\t\t\taria-required={toBoolAttrIfDefined(this.required)}\n\t\t\t\t\t\t\taria-invalid={toBoolAttrIfDefined(this.invalid)}\n\t\t\t\t\t\t\taria-describedby={this.wcagDescribedBy}\n\t\t\t\t\t\t\taria-labelledby={this.wcagLabelledBy}\n\t\t\t\t\t\t\taria-owns={this.wcagOwns}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t\t{Array.isArray(this.optionsState) && this.optionsState.map((option) => {\n\t\t\t\t\t\t\t\tconst selectedOption = this.selectedValueIndex(option.value);\n\t\t\t\t\t\t\t\treturn (<option value={option.value} selected={selectedOption > -1}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={option?.disabled}>{option.label ?? option.value}</option>)\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</select>\n\t\t\t\t\t</div>\n\t\t\t\t\t{this.h.hasSlot('sufix') && <slot name=\"sufix\"></slot>}\n\t\t\t\t</div>\n\t\t\t\t{this.hideSelectedList === false ? (\n\t\t\t\t\t<ul role=\"listbox\" id={this.listId} class={FormMultiSelectClass.list}>\n\t\t\t\t\t\t{Array.isArray(this.selectedOptionsState) && this.selectedOptionsState.map(selected => {\n\t\t\t\t\t\t\tconst option = this.getOption(selected);\n\t\t\t\t\t\t\tif (!option) return null\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<li class={FormMultiSelectClass.item} role=\"option\">\n\t\t\t\t\t\t\t\t\t{option.label ?? option.value}\n\t\t\t\t\t\t\t\t\t<gov-button\n\t\t\t\t\t\t\t\t\t\twcagLabel={'Odebrat vybranou položku ' + option.label ?? option.value}\n\t\t\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\t\t\ttype=\"base\"\n\t\t\t\t\t\t\t\t\t\tsize=\"s\"\n\t\t\t\t\t\t\t\t\t\ton-gov-click={() => this.onTagRemove(selected)}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<gov-icon name=\"x-lg\"></gov-icon>\n\t\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t})}\n\t\t\t\t\t</ul>\n\t\t\t\t) : null}\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onFocusHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.focused = true\n\t\tthis.govFocus.emit({\n\t\t\tcomponent: FormMultiSelectClass.root,\n\t\t\toriginalEvent: e,\n\t\t\tvalue: this.selectedOptionsState,\n\t\t})\n\t}\n\n\tprivate onBlurHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\te.stopPropagation()\n\t\tthis.focused = false\n\t\tthis.govBlur.emit({\n\t\t\tcomponent: FormMultiSelectClass.root,\n\t\t\toriginalEvent: e,\n\t\t\tvalue: this.selectedOptionsState,\n\t\t})\n\t}\n\n\tprivate onInputHandler(e: CustomEvent<FormAutocompleteEvent>) {\n\t\tthis.valueState = e.detail.value\n\t\te.stopPropagation()\n\t}\n\n\tprivate onSelectHandler(e: CustomEvent<FormAutocompleteEvent>) {\n\t\te.stopPropagation()\n\t\tconst value = e.detail.selected\n\t\tthis.selectOption(value.value)\n\t\tthis.valueState = ''\n\t\tthis.autocompleteRef.clearValue().finally()\n\t\tthis.autocompleteRef.focus()\n\t}\n\n\tprivate onTagRemove(removeOption: GovFormMultiSelectSelectedItem) {\n\t\tthis.removeOption(removeOption)\n\t}\n\n\t/**\n\t * Returns the current state of the component\n\t */\n\t@Method()\n\tasync setFocus(options?: FocusOptions): Promise<void> {\n\t\treturn this.selectRef.focus(options)\n\t}\n\n\t/**\n\t * Sets the ordered value of the element\n\t */\n\t@Method()\n\tasync setValue(value: string): Promise<void> {\n\t\tthis.valueState = value\n\t}\n\n\t/**\n\t * Returns an instance of the native html select element\n\t */\n\t@Method()\n\tasync getRef(): Promise<HTMLSelectElement> {\n\t\treturn this.selectRef\n\t}\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateWcag(): Promise<void> {\n\t\tvalidateWcagRef(this.wcagDescribedBy, 'wcag-described-by', FormMultiSelectClass.root)\n\t\tvalidateWcagRef(this.wcagLabelledBy, 'wcag-labelled-by', FormMultiSelectClass.root)\n\t\tvalidateWcagRef(this.wcagOwns, 'wcag-owns', FormMultiSelectClass.root)\n\t\tvalidateWcagLabelFor(this.identifier || this.selectId, this.wcagLabelledBy, FormMultiSelectClass.root)\n\t}\n}\n"],"mappings":"gkBAAA,MAAMA,EAAwB,o4pB,MC+BjBC,EAAkB,MAU9B,WAAAC,CAAAC,G,oUAgCmD,I,0CAQ2B,M,cAKzC,M,cAKA,M,gEAY+B,iC,oBAII,a,gKAoCN,G,kBAChB,GAtGjDC,KAAKC,SAAWC,EAAS,aACzBF,KAAKG,OAASD,EAAS,gBAEvBF,KAAKI,EAAIC,EAAQL,KAAKM,MACtBN,KAAKO,EAAIC,EAAQR,KAAKI,E,CAqGvB,eAAAK,CAAgBC,GACfC,EAAaC,EAAyBF,EAAUG,EAAqBC,K,CAItE,YAAAC,CAAaL,GACZC,EAAaK,EAAsBN,EAAUG,EAAqBC,K,CAInE,YAAAG,CAAaP,GACZV,KAAKkB,aAAeC,EAAkBT,E,CAIvC,UAAAU,CAAWV,GACVV,KAAKqB,qBAAuBF,EAAkBT,E,CAO/C,aAAAY,GACCtB,KAAKuB,kB,CAGE,gBAAAA,GACPvB,KAAKO,EAAEiB,kBAAkB,OAAQxB,KAAKyB,MACtCzB,KAAKO,EAAEiB,kBAAkB,UAAWE,EAAW1B,KAAK2B,UACpD3B,KAAKO,EAAEiB,kBAAkB,UAAWE,EAAW1B,KAAK4B,S,CAGrD,iBAAAC,GACC7B,KAAKS,gBAAgBT,KAAK8B,SAC1B9B,KAAKe,aAAaf,KAAKyB,MACvBzB,KAAKsB,gBACLtB,KAAKuB,mBACLvB,KAAKO,EAAEwB,gBAAgB,WAAYC,OAAOhC,KAAKiC,WAC/CjC,KAAKkB,aAAeC,EAAkBnB,KAAKkC,SAC3ClC,KAAKqB,qBAAuBF,EAAkBnB,KAAKmC,M,CAG5C,mBAAAC,CAAoBC,EAAe,OAC1C,GAAIC,MAAMC,QAAQvC,KAAKkB,eAAiBlB,KAAKkB,aAAasB,OAAQ,CACjE,GAAIH,EAAc,CACjB,OAAOrC,KAAKkB,Y,CAEb,OAAOlB,KAAKkB,aAAauB,QAAQC,IAChC,MAAMC,EAAgB3C,KAAK4C,mBAAmBF,EAAOP,OACrD,OAAQQ,KAAmB,IAAKD,IAAM,MAANA,SAAM,SAANA,EAAQG,UAAY,MAAQ,IAAI,IAC9DC,KAAKJ,IAAM,IAAAK,EAAK,OAAEC,MAAMD,EAAAL,EAAOO,SAAK,MAAAF,SAAA,EAAAA,EAAIL,EAAOP,MAAOA,MAAOO,EAAOP,MAAM,G,CAE9E,OAAOG,MAAMY,KAAKlD,KAAKmD,UAAUC,iBAAiB,WAChDX,QAAQC,IACR,GAAIL,EAAc,CACjB,OAAO,I,CAER,MAAMM,EAAgB3C,KAAK4C,mBAAmBF,EAAOP,OACrD,QAASO,EAAOG,UAAYH,EAAOW,UAAYV,GAAiB,EAAE,IAElEG,KAAKJ,IAAyB,CAAOM,KAAMN,EAAOY,YAAanB,MAAOO,EAAOP,S,CAGxE,gBAAAoB,G,eACPR,EAAA/C,KAAKwD,mBAAe,MAAAT,SAAA,SAAAA,EAAEU,iBAAiB,aAAczD,KAAK0D,gBAAgBC,KAAK3D,QAC/E4D,EAAA5D,KAAKwD,mBAAe,MAAAI,SAAA,SAAAA,EAAEH,iBAAiB,YAAazD,KAAK6D,eAAeF,KAAK3D,QAC7E8D,EAAA9D,KAAKwD,mBAAe,MAAAM,SAAA,SAAAA,EAAEL,iBAAiB,YAAazD,KAAK+D,eAAeJ,KAAK3D,QAC7EgE,EAAAhE,KAAKwD,mBAAe,MAAAQ,SAAA,SAAAA,EAAEP,iBAAiB,WAAYzD,KAAKiE,cAAcN,KAAK3D,QAC3EkE,EAAAlE,KAAKwD,mBAAe,MAAAU,SAAA,SAAAA,EACjBC,mBAAkBC,GACZ,IAAIC,SAAQC,IAClB,MAAMC,EAAOvE,KAAKoC,sBAClB,GAAIJ,OAAOoC,GAAc5B,SAAW,EAAG,CACtC,OAAO8B,EAAQC,E,CAEhBD,EACCC,EAAK9B,QAAO,EAAEQ,QAAOd,YACpB,IAAKc,EAAOA,EAAQd,EACpB,OAAOqC,EAAiBvB,GAAOwB,cAAcC,QAAQF,EAAiBJ,GAAcK,gBAAkB,CAAC,IAExG,MAGFE,S,CAGK,kBAAA/B,CAAmBT,GAC1B,OAAOnC,KAAKqB,qBAAqBuD,WAAWvB,GAAaA,IAAalB,G,CAG/D,gBAAA0C,CAAiB1C,GACxB,OAAOnC,KAAKmD,UAAU2B,cAAc,iBAAmB3C,EAAQ,K,CAGxD,SAAA4C,CAAU5C,G,MACjB,OAAOY,EAAA/C,KAAKoC,oBAAoB,MAAM4C,MAAMtC,GAAWA,EAAOP,QAAUA,OAAM,MAAAY,SAAA,EAAAA,EAAI,I,CAG3E,YAAAkC,CAAaC,EAA2CC,EAAS,MACxE,MAAMC,EAAQpF,KAAK4C,mBAAmBsC,GACtC,GAAIE,KAAW,EAAG,CACjBpF,KAAKqB,qBAAuB,IAAIrB,KAAKqB,qBAAsB6D,GAC3DlF,KAAKmC,MAAQnC,KAAKqB,qBAClB,GAAI8D,EAAQ,CACXnF,KAAKqF,UAAUC,KAAK,CACnBC,UAAW1E,EAAqBC,KAChCqB,MAAOnC,KAAKqB,uBAEbrB,KAAKwF,UAAUF,KAAK,CACnBC,UAAW1E,EAAqBC,KAChCqB,MAAOnC,KAAKqB,sB,CAGd,MAAMqB,EAAS1C,KAAK6E,iBAAiBK,GACrC,GAAIxC,EAAQ,CACXA,EAAOW,SAAW,I,GAKb,YAAAoC,CAAaA,EAA8CN,EAAS,MAC3E,MAAMC,EAAQpF,KAAK4C,mBAAmB6C,GACtC,GAAIL,KAAW,EAAG,CACjBpF,KAAKqB,qBAAqBqE,OAAON,EAAO,GACxCpF,KAAKqB,qBAAuB,IAAIrB,KAAKqB,sBACrCrB,KAAKmC,MAAQnC,KAAKqB,qBAClB,GAAI8D,EAAQ,CACXnF,KAAKqF,UAAUC,KAAK,CACnBC,UAAW1E,EAAqBC,KAChCqB,MAAOnC,KAAKqB,uBAEbrB,KAAK2F,UAAUL,KAAK,CACnBC,UAAW1E,EAAqBC,KAChCqB,MAAOnC,KAAKqB,sB,CAGd,MAAMqB,EAAS1C,KAAK6E,iBAAiBY,GACrC,GAAI/C,EAAQ,CACXA,EAAOW,SAAW,K,GAKrB,sBAAMuC,GACL5F,KAAKuD,kB,CAGN,wBAAMsC,GACLC,GAAK,KACJ9F,KAAKmD,UAAUC,iBAAiB,UAAU2C,SAASrD,IAClD,GAAIA,EAAOW,SAAU,CACpBrD,KAAKiF,aAAavC,EAAOP,MAAO,M,IAEhC,IAEH,GAAI6D,IAA2B,OACxBC,EAAM,WACNjG,KAAKkG,c,EAIb,MAAAC,GACC,OACC/F,EAACgG,EAAI,CAACC,MAAOxF,EAAqBC,KAAMW,KAAMzB,KAAKyB,KAAMK,QAAS9B,KAAK8B,SACtE1B,EAAA,OAAKiG,MAAOxF,EAAqByF,MAC/BtG,KAAKI,EAAEmG,QAAQ,WAAanG,EAAA,QAAM4C,KAAK,WACxC5C,EAAA,OAAKiG,MAAM,WACVjG,EAAA,yBACC+B,MAAOnC,KAAKwG,WACZ3D,SAAU7C,KAAK6C,SACf4D,WAAYzG,KAAKyG,YAAczG,KAAKC,SACpCgC,SAAU,MACVR,KAAMzB,KAAKyB,KACXK,QAAS9B,KAAK8B,QACd4E,YAAa1G,KAAK0G,YAAW,gBACd1G,KAAK2G,aAAY,kBACf3G,KAAK4G,eACtBC,IAAKC,GAAO9G,KAAKwD,gBAAkBsD,EACnCC,UAAW,EACXC,gBAAiBhH,KAAKgH,gBACtBC,eAAgBjH,KAAKiH,eACrBC,SAAUlH,KAAKG,SAEhBC,EAAA,YAAU+G,KAAK,aAAad,MAAM,aAAarD,KAAK,iBACnDhD,KAAKI,EAAEmG,QAAQ,iBAAmBvG,KAAK4B,SAAW5B,KAAK2B,UAAYvB,EAAA,QAAM4C,KAAK,eAC9EhD,KAAK4B,SAAWxB,EAAA,YAAU+G,KAAK,aAAad,MAAM,kBAAkBrD,KAAK,aACzEhD,KAAK2B,SAAWvB,EAAA,YAAU+G,KAAK,aAAad,MAAM,kBAAkBrD,KAAK,mBAC1E5C,EAAA,UACCgH,OAAM,KACNf,MAAO,qBAAoB,cACd3E,EAAW,MACxB2F,SAAQ,KACRpF,SAAUjC,KAAKiC,SACfe,KAAMhD,KAAKgD,KACXH,SAAU7C,KAAK6C,SACfgE,IAAKC,GAAO9G,KAAKmD,UAAY2D,EAAwB,gBACtCQ,EAAoBtH,KAAK6C,UAAS,gBAClCyE,EAAoBtH,KAAKiC,UAAS,eACnCqF,EAAoBtH,KAAK2B,SAAQ,mBAC7B3B,KAAKgH,gBAAe,kBACrBhH,KAAKiH,eAAc,YACzBjH,KAAKkH,UAEhB9G,EAAA,aACCkC,MAAMC,QAAQvC,KAAKkB,eAAiBlB,KAAKkB,aAAa4B,KAAKJ,I,MAC3D,MAAM6E,EAAiBvH,KAAK4C,mBAAmBF,EAAOP,OACtD,OAAQ/B,EAAA,UAAQ+B,MAAOO,EAAOP,MAAOkB,SAAUkE,GAAkB,EACzD1E,SAAUH,IAAM,MAANA,SAAM,SAANA,EAAQG,WAAWE,EAAAL,EAAOO,SAAK,MAAAF,SAAA,EAAAA,EAAIL,EAAOP,MAAe,MAI7EnC,KAAKI,EAAEmG,QAAQ,UAAYnG,EAAA,QAAM4C,KAAK,WAEvChD,KAAKwH,mBAAqB,MAC1BpH,EAAA,MAAIqH,KAAK,UAAUC,GAAI1H,KAAKG,OAAQkG,MAAOxF,EAAqB8G,MAC9DrF,MAAMC,QAAQvC,KAAKqB,uBAAyBrB,KAAKqB,qBAAqByB,KAAIO,I,QAC1E,MAAMX,EAAS1C,KAAK+E,UAAU1B,GAC9B,IAAKX,EAAQ,OAAO,KACpB,OACCtC,EAAA,MAAIiG,MAAOxF,EAAqB+G,KAAMH,KAAK,WACzC1E,EAAAL,EAAOO,SAAK,MAAAF,SAAA,EAAAA,EAAIL,EAAOP,MACxB/B,EAAA,cACCyH,WAAWjE,EAAA,4BAA8BlB,EAAOO,SAAK,MAAAW,SAAA,EAAAA,EAAIlB,EAAOP,MAChEL,QAAQ,UACRgG,KAAK,OACLrG,KAAK,IAAG,eACM,IAAMzB,KAAK+H,YAAY1E,IAErCjD,EAAA,YAAU4C,KAAK,UAEZ,KAIL,K,CAKC,cAAAe,CAAeiE,GACtBA,EAAEC,kBACFjI,KAAKkI,QAAU,KACflI,KAAKmI,SAAS7C,KAAK,CAClBC,UAAW1E,EAAqBC,KAChCsH,cAAeJ,EACf7F,MAAOnC,KAAKqB,sB,CAIN,aAAA4C,CAAc+D,GACrBA,EAAEC,kBACFD,EAAEC,kBACFjI,KAAKkI,QAAU,MACflI,KAAKqI,QAAQ/C,KAAK,CACjBC,UAAW1E,EAAqBC,KAChCsH,cAAeJ,EACf7F,MAAOnC,KAAKqB,sB,CAIN,cAAAwC,CAAemE,GACtBhI,KAAKwG,WAAawB,EAAEM,OAAOnG,MAC3B6F,EAAEC,iB,CAGK,eAAAvE,CAAgBsE,GACvBA,EAAEC,kBACF,MAAM9F,EAAQ6F,EAAEM,OAAOjF,SACvBrD,KAAKiF,aAAa9C,EAAMA,OACxBnC,KAAKwG,WAAa,GAClBxG,KAAKwD,gBAAgB+E,aAAa5D,UAClC3E,KAAKwD,gBAAgBgF,O,CAGd,WAAAT,CAAYtC,GACnBzF,KAAKyF,aAAaA,E,CAOnB,cAAMgD,CAASvG,GACd,OAAOlC,KAAKmD,UAAUqF,MAAMtG,E,CAO7B,cAAMwG,CAASvG,GACdnC,KAAKwG,WAAarE,C,CAOnB,YAAMwG,GACL,OAAO3I,KAAKmD,S,CAOb,kBAAM+C,GACL0C,EAAgB5I,KAAKgH,gBAAiB,oBAAqBnG,EAAqBC,MAChF8H,EAAgB5I,KAAKiH,eAAgB,mBAAoBpG,EAAqBC,MAC9E8H,EAAgB5I,KAAKkH,SAAU,YAAarG,EAAqBC,MACjE+H,EAAqB7I,KAAKyG,YAAczG,KAAKC,SAAUD,KAAKiH,eAAgBpG,EAAqBC,K"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as i,h as e,a as s,g as o}from"./p-5bc604a3.js";import{a}from"./p-5de606f8.js";import{v as n}from"./p-dcb5fb35.js";import{c as r}from"./p-24636c53.js";import{d as h,t as l,h as c}from"./p-03990da5.js";import{F as m,a as p,b as d}from"./p-9dab01be.js";import{p as g}from"./p-ab5a13ea.js";import"./p-7f2c9830.js";import"./p-003e6cca.js";import"./p-55500e5a.js";import"./p-ff7365ae.js";const u='.gov-form-autocomplete__list{margin:0;padding:0}.gov-form-autocomplete__list>.gov-form-autocomplete__item{margin:0;padding:0;background:none}.gov-form-autocomplete__list>.gov-form-autocomplete__item::before{display:none}.gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}@keyframes countdown{to{transform:scaleX(0)}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes pulse{0%{opacity:1}50%{opacity:0.4}100%{opacity:1}}.gov-form-autocomplete{position:relative;display:block;width:100%}.gov-form-autocomplete__list{font-weight:var(--gov-text-s-font-weight);font-size:var(--gov-text-s-font-size);line-height:var(--gov-text-s-line-height);letter-spacing:var(--gov-text-s-letter-spacing);position:absolute;top:100%;right:0;left:0;z-index:5;max-height:14.0625rem;margin-top:0.5rem;border:var(--gov-autocomplete-item-hover, 0.0625rem solid var(--gov-color-secondary-500));border-radius:var(--gov-border-radius, 0.1875rem);background:var(--gov-autocomplete-bg, var(--gov-color-neutral-white));overflow-x:hidden;overflow-y:auto;overscroll-behavior:none}.gov-form-autocomplete__list>.gov-form-autocomplete__item{padding:0.75rem 0.5rem;cursor:pointer}.gov-form-autocomplete__item--empty,.gov-form-autocomplete__item--loading{padding:0.75rem 0.5rem;color:var(--gov-autocomplete-item-disable-color, var(--gov-color-secondary-600))}.gov-form-autocomplete__item--empty .gov-icon,.gov-form-autocomplete__item--empty .gov-spin-animation,.gov-form-autocomplete__item--loading .gov-icon,.gov-form-autocomplete__item--loading .gov-spin-animation{width:12px;height:12px}.gov-form-autocomplete__list:empty{display:none}.gov-form-autocomplete__item[aria-selected=""],.gov-form-autocomplete__item[aria-selected=true i],.gov-form-autocomplete__item[aria-selected="1"]{background:var(--gov-autocomplete-item-select, var(--gov-color-secondary-400))}@media not all and (pointer: coarse){.gov-form-autocomplete__item:hover{background:var(--gov-autocomplete-item-hover, var(--gov-color-primary-100))}}';const v=class{constructor(e){t(this,e);this.govFocus=i(this,"gov-focus",7);this.govBlur=i(this,"gov-blur",7);this.govInput=i(this,"gov-input",7);this.govSelect=i(this,"gov-select",7);this.templateResolver=t=>t[this.nameKey];this.value="";this.options=undefined;this.identifier=undefined;this.variant=undefined;this.success=undefined;this.size="m";this.nameKey="name";this.name=undefined;this.required=false;this.disabled=false;this.placeholder=undefined;this.readonly=undefined;this.invalid=undefined;this.minlength=3;this.maxlength=undefined;this.throttleTime=200;this.messageEmpty="Nebyly nalezeny žádné výsledky";this.messageLoading="Načítám...";this.wcagDescribedBy=undefined;this.wcagLabelledBy=undefined;this.wcagOwns=undefined;this.focused=undefined;this.processing=false;this.arrowCounter=-1;this.list=[];this.listBoxId=r("GovListBox")}validateVariant(t){n(p,t,m.root)}validateSize(t){n(d,t,m.root)}watchOptions(t){this.setOptions(g(t)).catch()}onArrowUp(){if(this.arrowCounter>0){this.arrowCounter=this.arrowCounter-1;this.moveToView().finally()}}onArrowDown(){if(this.arrowCounter<this.list.length-1){this.arrowCounter=this.arrowCounter+1;this.moveToView().finally()}}async moveToView(){await h(200);const t=this.listRef.offsetHeight;const i=this.listRef.querySelector('li[aria-selected="true"]');if(i&&t){const t=i.offsetTop;this.listRef.scrollTo({top:t,behavior:"smooth"})}}doSearch(){if(Number.isInteger(this.minlength)&&this.isValueAccepted===false&&this.minlength){this.list=[];this.arrowCounter=-1;this.processing=false;return}if(this.searchCallback){this.processing=true;this.searchCallback(this.value).then((t=>this.list=t)).catch((()=>this.list=[])).finally((()=>{this.arrowCounter=-1;this.processing=false}))}}get isValueAccepted(){if(typeof this.value==="string"){return this.value.length>=this.minlength}else{return false}}componentWillLoad(){this.validateVariant(this.variant);this.validateSize(this.size)}render(){return e(s,{class:m.root,size:this.size,variant:this.variant},e("gov-form-input",{placeholder:this.placeholder,name:this.name,disabled:this.disabled,readonly:this.readonly,autocomplete:false,size:this.size,variant:this.variant,required:this.required,invalid:this.invalid,success:this.success,role:"searchbox",value:this.value,minlength:this.minlength,maxlength:this.maxlength,"on-gov-input":l(this.onInputHandler.bind(this),this.throttleTime),"on-gov-keyup":this.onKeyUpHandler.bind(this),"on-gov-keydown":this.onKeyDownHandler.bind(this),"on-gov-focus":this.onFocusHandler.bind(this),"on-gov-blur":this.onBlurHandler.bind(this),wcagAutocomplete:"list",wcagDescribedBy:this.wcagDescribedBy,wcagLabelledBy:this.wcagLabelledBy,wcagOwns:[this.listBoxId,this.wcagOwns].join(" "),wcagExpanded:this.list.length&&this.focused,ref:t=>this.inputRef=t},e("slot",{slot:"right-icon",name:"right-icon"})),e("ul",{class:m.list,role:"listbox",id:this.listBoxId,ref:t=>this.listRef=t},this.focused&&this.list.length===0&&this.processing===false&&this.isValueAccepted&&this.messageEmpty?e("li",{class:m.empty},this.messageEmpty):null,this.focused&&this.processing===true&&this.isValueAccepted?e("li",{class:m.loading},e("gov-icon",{name:"loader",class:"gov-spin-animation"})," ",this.messageLoading):null,this.list.map(((t,i)=>{const s=this.arrowCounter===i;return e("li",{class:m.item,innerHTML:this.templateResolver(t,s),role:"option","aria-posinset":i,tabindex:s?0:-1,"aria-setsize":this.list.length,onTouchStart:t=>this.onSelectHandler(t,i),onMouseDown:t=>this.onSelectHandler(t,i),"aria-selected":a(s)})}))))}onFocusHandler(t){this.focused=true;this.arrowCounter=-1;if(this.isValueAccepted&&this.searchCallback){this.doSearch()}t.stopPropagation();this.govFocus.emit({originalEvent:t,component:m.root,value:this.value,selected:null})}onBlurHandler(t){this.focused=false;const i=g(this.options);if(i.length===0){this.list=[]}this.arrowCounter=-1;t.stopPropagation();this.govBlur.emit({originalEvent:t,component:m.root,value:this.value,selected:null})}onInputHandler(t){this.value=t.target.value;t.stopPropagation();this.govInput.emit({originalEvent:t,component:m.root,value:this.value,selected:null});this.doSearch()}onSelectHandler(t,i=-1){let e=null;if(i>-1){e=this.list[i]}else if(c(this.arrowCounter,this.list)){e=this.list[this.arrowCounter]}if(e){this.govSelect.emit({component:m.root,value:this.value,selected:e,originalEvent:t});this.list=[];if(c(this.nameKey,e)&&typeof e[this.nameKey]==="string"){this.value=e[this.nameKey]}}}onKeyUpHandler(t){const i=t.detail.originalEvent;t.stopPropagation();i.stopPropagation();if(i.keyCode===38)this.onArrowUp();else if(i.keyCode===40)this.onArrowDown();else if(i.keyCode===13){t.preventDefault();i.preventDefault();this.onSelectHandler(t)}}onKeyDownHandler(t){const i=t.detail.originalEvent;t.stopPropagation();i.stopPropagation();if(i.keyCode===13){t.preventDefault();i.preventDefault()}}async setFocus(t){return this.inputRef.focus(t)}async setOptions(t){this.list=Array.isArray(t)?t:[];this.arrowCounter=-1}async clearValue(){this.value="";this.inputRef.value="";await this.inputRef.clearValue()}async setProcessing(t){this.processing=t}async setSearchCallback(t){this.searchCallback=t}async setTemplateResolver(t){this.templateResolver=t}get host(){return o(this)}static get watchers(){return{variant:["validateVariant"],size:["validateSize"],options:["watchOptions"]}}};v.style=u;export{v as gov_form_autocomplete};
|
|
2
|
-
//# sourceMappingURL=p-cdd77b6c.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["govFormAutocompleteCss","GovFormAutocomplete","constructor","hostRef","this","templateResolver","item","nameKey","listBoxId","createID","validateVariant","newValue","validateProp","FormAutocompleteVariants","FormAutocompleteClass","root","validateSize","FormAutocompleteSizes","watchOptions","setOptions","propsValueToArray","catch","onArrowUp","arrowCounter","moveToView","finally","onArrowDown","list","length","delay","heightOfList","listRef","offsetHeight","selected","querySelector","offsetTop","scrollTo","top","behavior","doSearch","Number","isInteger","minlength","isValueAccepted","processing","searchCallback","value","then","response","componentWillLoad","variant","size","render","h","Host","class","placeholder","name","disabled","readonly","autocomplete","required","invalid","success","role","maxlength","throttle","onInputHandler","bind","throttleTime","onKeyUpHandler","onKeyDownHandler","onFocusHandler","onBlurHandler","wcagAutocomplete","wcagDescribedBy","wcagLabelledBy","wcagOwns","join","wcagExpanded","focused","ref","el","inputRef","slot","id","messageEmpty","empty","loading","messageLoading","map","index","isSelected","innerHTML","tabindex","onTouchStart","e","onSelectHandler","onMouseDown","toBoolAttr","stopPropagation","govFocus","emit","originalEvent","component","areOptions","options","govBlur","target","govInput","has","govSelect","event","detail","keyCode","preventDefault","setFocus","focus","Array","isArray","clearValue","setProcessing","status","setSearchCallback","callback","setTemplateResolver"],"sources":["../../../packages/core/src/components/gov-form/autocomplete/gov-form-autocomplete.scss?tag=gov-form-autocomplete","../../../packages/core/src/components/gov-form/autocomplete/gov-form-autocomplete.tsx"],"sourcesContent":["$class: \".gov-form-autocomplete\";\n\n#{$class} {\n\t@include base();\n\t&__list {\n\t\t@include typography($font-size-s);\n\t\t@extend %reset-ul;\n\t\tposition: absolute;\n\t\ttop: 100%;\n\t\tright: 0;\n\t\tleft: 0;\n\t\tz-index: 5;\n\t\tmax-height: rem-calc(225);\n\t\tmargin-top: rem-calc(8);\n\t\tborder: $form-autocomplete-border;\n\t\tborder-radius: $border-radius;\n\t\tbackground: $form-autocomplete-bg;\n\t\toverflow-x: hidden;\n\t\toverflow-y: auto;\n\t\toverscroll-behavior: none;\n\t}\n\t&__list > &__item {\n\t\t@extend %reset-ul-li;\n\t\tpadding: rem-calc(12 8);\n\t\tcursor: pointer;\n\t}\n\t&__item {\n\t\t&--empty,\n\t\t&--loading {\n\t\t\tpadding: rem-calc(12 8);\n\t\t\tcolor: $form-autocomplete-item-disable-color;\n\t\t\t& .gov-icon,\n\t\t\t& .gov-spin-animation {\n\t\t\t\twidth: 12px;\n\t\t\t\theight: 12px;\n\t\t\t}\n\t\t}\n\t}\n\n\t// STATES\n\t&__list:empty {\n\t\tdisplay: none;\n\t}\n\n\t// HOVERS\n\t&__item {\n\t\t@include parameter(\"aria-selected\") {\n\t\t\tbackground: $form-autocomplete-item-select-bg;\n\t\t}\n\t\t@include hover() {\n\t\t\tbackground: $form-autocomplete-item-hover-bg;\n\t\t}\n\t}\n}\n","import {Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch} from '@stencil/core'\nimport {toBoolAttr} from '../../../helpers/Dom/template'\nimport {validateProp} from '../../../helpers/Validate/props'\nimport {Nullable} from '../../../types/interfaces'\nimport {createID} from '../../../utils/string.utils'\nimport {delay, has, throttle} from '../../../utils/utils'\nimport {FormInputEvent} from '../input/gov-form-input.types'\nimport {\n\tFormAutocompleteClass,\n\tFormAutocompleteSizes,\n\tFormAutocompleteVariants,\n\tSizesType,\n\tVariantType\n} from './constants'\nimport {FormAutocompleteEvent, GovFormAutocompleteItem} from './gov-form-autocomplete.types'\nimport {propsValueToArray} from \"../../../utils/array.utils\";\n\n@Component({\n\ttag: 'gov-form-autocomplete',\n\tstyleUrl: 'gov-form-autocomplete.scss',\n})\nexport class GovFormAutocomplete {\n\tprivate inputRef?: HTMLGovFormInputElement\n\tprivate listRef?: HTMLUListElement\n\tprivate readonly listBoxId: string\n\tprivate searchCallback: (value: string) => Promise<GovFormAutocompleteItem[]>\n\tprivate templateResolver: (item: GovFormAutocompleteItem, selected: boolean) => string = item => item[this.nameKey]\n\n\tconstructor() {\n\t\tthis.listBoxId = createID('GovListBox')\n\t}\n\n\t@Element() host: HTMLGovFormInputElement\n\t/**\n\t * Value of input\n\t */\n\t@Prop({reflect: true, mutable: true}) value = ''\n\t/**\n\t * Options of autocomplete\n\t */\n\t@Prop({reflect: true, mutable: true}) options?: string | GovFormAutocompleteItem[]\n\t/**\n\t * Custom input identifier.\n\t */\n\t@Prop({attribute: 'identifier'}) readonly identifier: string\n\t/**\n\t * Style variation of the form input.\n\t */\n\t@Prop() readonly variant?: VariantType\n\t/**\n\t * Indicates the entered value of child form element does conform to the format expected by the application.\n\t */\n\t@Prop() readonly success: boolean\n\t/**\n\t * Input’s size.\n\t */\n\t@Prop() readonly size?: SizesType = 'm'\n\t/**\n\t * Main key name in the object\n\t */\n\t@Prop() readonly nameKey: string = 'name'\n\t/**\n\t * Name of the input.\n\t */\n\t@Prop() readonly name: string\n\t/**\n\t * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.\n\t * When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Makes the input component disabled.\n\t * This prevents users from being able to interact with the select, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean = false\n\t/**\n\t * Text that appears in the form control when it has no value set\n\t */\n\t@Prop() readonly placeholder: string\n\t/**\n\t * The value is not editable\n\t */\n\t@Prop() readonly readonly: boolean\n\t/**\n\t * Indicates the entered value does not conform to the format expected by the application.\n\t */\n\t@Prop() readonly invalid: boolean\n\t/**\n\t * Minimum length (number of characters) of value\n\t */\n\t@Prop() readonly minlength: number = 3\n\t/**\n\t * Maximum length (number of characters) of value\n\t */\n\t@Prop() readonly maxlength: number\n\t/**\n\t * Input throttle in milliseconds\n\t */\n\t@Prop() readonly throttleTime: number = 200\n\t/**\n\t * Custom message for when there is a blank sheet\n\t */\n\t@Prop({attribute: 'message-empty'}) readonly messageEmpty: string = 'Nebyly nalezeny žádné výsledky'\n\t/**\n\t * Custom message for when data is loaded\n\t */\n\t@Prop({attribute: 'message-loading'}) readonly messageLoading: string = 'Načítám...'\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({attribute: 'wcag-described-by'}) readonly wcagDescribedBy: string\n\t/**\n\t * Indicates the id of a component that labels the input.\n\t */\n\t@Prop({attribute: 'wcag-labelled-by'}) readonly wcagLabelledBy: string\n\t/**\n\t * Same as original parameter\n\t * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-owns\n\t */\n\t@Prop({attribute: 'wcag-owns'}) readonly wcagOwns: string\n\t/**\n\t * Emitted when the input has focus.\n\t */\n\t@Event({eventName: 'gov-focus'}) govFocus: EventEmitter<FormAutocompleteEvent>\n\t/**\n\t * Emitted when the input loses focus.\n\t */\n\t@Event({eventName: 'gov-blur'}) govBlur: EventEmitter<FormAutocompleteEvent>\n\t/**\n\t * Emitted when the input change value.\n\t */\n\t@Event({eventName: 'gov-input'}) govInput: EventEmitter<FormAutocompleteEvent>\n\t/**\n\t * Emitted when the input change value.\n\t */\n\t@Event({eventName: 'gov-select'}) govSelect: EventEmitter<FormAutocompleteEvent>\n\t@State() focused: boolean\n\t@State() processing = false\n\t@State() arrowCounter = -1\n\t@State() list: GovFormAutocompleteItem[] = []\n\n\t@Watch('variant')\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(FormAutocompleteVariants, newValue, FormAutocompleteClass.root)\n\t}\n\n\t@Watch('size')\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(FormAutocompleteSizes, newValue, FormAutocompleteClass.root)\n\t}\n\n\t@Watch('options')\n\twatchOptions(newValue: string | GovFormAutocompleteItem[]): void {\n\t\tthis.setOptions(propsValueToArray(newValue)).catch()\n\t}\n\n\tprivate onArrowUp() {\n\t\tif (this.arrowCounter > 0) {\n\t\t\tthis.arrowCounter = this.arrowCounter - 1\n\t\t\tthis.moveToView().finally()\n\t\t}\n\t}\n\n\tprivate onArrowDown() {\n\t\tif (this.arrowCounter < this.list.length - 1) {\n\t\t\tthis.arrowCounter = this.arrowCounter + 1\n\t\t\tthis.moveToView().finally()\n\t\t}\n\t}\n\n\tprivate async moveToView() {\n\t\tawait delay(200)\n\t\tconst heightOfList = this.listRef.offsetHeight\n\t\tconst selected = this.listRef.querySelector('li[aria-selected=\"true\"]') as HTMLUListElement\n\t\tif (selected && heightOfList) {\n\t\t\tconst offsetTop = selected.offsetTop\n\t\t\tthis.listRef.scrollTo({top: offsetTop, behavior: 'smooth'})\n\t\t}\n\t}\n\n\tprivate doSearch() {\n\t\tif (Number.isInteger(this.minlength) && this.isValueAccepted === false && this.minlength) {\n\t\t\tthis.list = []\n\t\t\tthis.arrowCounter = -1\n\t\t\tthis.processing = false\n\t\t\treturn\n\t\t}\n\t\tif (this.searchCallback) {\n\t\t\tthis.processing = true\n\t\t\tthis.searchCallback(this.value)\n\t\t\t\t.then(response => (this.list = response))\n\t\t\t\t.catch(() => (this.list = []))\n\t\t\t\t.finally(() => {\n\t\t\t\t\tthis.arrowCounter = -1\n\t\t\t\t\tthis.processing = false\n\t\t\t\t})\n\t\t}\n\t}\n\n\tget isValueAccepted() {\n\t\tif (typeof this.value === 'string') {\n\t\t\treturn this.value.length >= this.minlength\n\t\t} else {\n\t\t\treturn false\n\t\t}\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.validateVariant(this.variant)\n\t\tthis.validateSize(this.size)\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={FormAutocompleteClass.root} size={this.size} variant={this.variant}>\n\t\t\t\t<gov-form-input\n\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\tname={this.name}\n\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\treadonly={this.readonly}\n\t\t\t\t\tautocomplete={false}\n\t\t\t\t\tsize={this.size}\n\t\t\t\t\tvariant={this.variant}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t\tinvalid={this.invalid}\n\t\t\t\t\tsuccess={this.success}\n\t\t\t\t\trole={'searchbox'}\n\t\t\t\t\tvalue={this.value}\n\t\t\t\t\tminlength={this.minlength}\n\t\t\t\t\tmaxlength={this.maxlength}\n\t\t\t\t\ton-gov-input={throttle(this.onInputHandler.bind(this), this.throttleTime)}\n\t\t\t\t\ton-gov-keyup={this.onKeyUpHandler.bind(this)}\n\t\t\t\t\ton-gov-keydown={this.onKeyDownHandler.bind(this)}\n\t\t\t\t\ton-gov-focus={this.onFocusHandler.bind(this)}\n\t\t\t\t\ton-gov-blur={this.onBlurHandler.bind(this)}\n\t\t\t\t\twcagAutocomplete={'list'}\n\t\t\t\t\twcagDescribedBy={this.wcagDescribedBy}\n\t\t\t\t\twcagLabelledBy={this.wcagLabelledBy}\n\t\t\t\t\twcagOwns={[this.listBoxId, this.wcagOwns].join(' ')}\n\t\t\t\t\twcagExpanded={this.list.length && this.focused}\n\t\t\t\t\tref={el => (this.inputRef = el as HTMLGovFormInputElement)}\n\t\t\t\t>\n\t\t\t\t\t<slot slot=\"right-icon\" name=\"right-icon\"/>\n\t\t\t\t</gov-form-input>\n\t\t\t\t<ul class={FormAutocompleteClass.list} role={'listbox'} id={this.listBoxId}\n\t\t\t\t\t\tref={el => (this.listRef = el as HTMLUListElement)}>\n\t\t\t\t\t{this.focused && this.list.length === 0 && this.processing === false && this.isValueAccepted && this.messageEmpty ? (\n\t\t\t\t\t\t<li class={FormAutocompleteClass.empty}>{this.messageEmpty}</li>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{this.focused && this.processing === true && this.isValueAccepted ? (\n\t\t\t\t\t\t<li class={FormAutocompleteClass.loading}>\n\t\t\t\t\t\t\t<gov-icon name=\"loader\" class=\"gov-spin-animation\"></gov-icon>\n\t\t\t\t\t\t\t {this.messageLoading}\n\t\t\t\t\t\t</li>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{this.list.map((item, index) => {\n\t\t\t\t\t\tconst isSelected = this.arrowCounter === index\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t\tclass={FormAutocompleteClass.item}\n\t\t\t\t\t\t\t\tinnerHTML={this.templateResolver(item, isSelected)}\n\t\t\t\t\t\t\t\trole={'option'}\n\t\t\t\t\t\t\t\taria-posinset={index}\n\t\t\t\t\t\t\t\ttabindex={isSelected ? 0 : -1}\n\t\t\t\t\t\t\t\taria-setsize={this.list.length}\n\t\t\t\t\t\t\t\tonTouchStart={(e: TouchEvent) => this.onSelectHandler(e, index)}\n\t\t\t\t\t\t\t\tonMouseDown={(e: PointerEvent) => this.onSelectHandler(e, index)}\n\t\t\t\t\t\t\t\taria-selected={toBoolAttr(isSelected)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)\n\t\t\t\t\t})}\n\t\t\t\t</ul>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onFocusHandler(e: FocusEvent) {\n\t\tthis.focused = true\n\t\tthis.arrowCounter = -1\n\t\tif (this.isValueAccepted && this.searchCallback) {\n\t\t\tthis.doSearch()\n\t\t}\n\t\te.stopPropagation()\n\t\tthis.govFocus.emit({\n\t\t\toriginalEvent: e,\n\t\t\tcomponent: FormAutocompleteClass.root,\n\t\t\tvalue: this.value,\n\t\t\tselected: null,\n\t\t})\n\t}\n\n\tprivate onBlurHandler(e: FocusEvent) {\n\t\tthis.focused = false\n\t\tconst areOptions = propsValueToArray<GovFormAutocompleteItem[]>(this.options)\n\t\tif (areOptions.length === 0) {\n\t\t\tthis.list = []\n\t\t}\n\t\tthis.arrowCounter = -1\n\t\te.stopPropagation()\n\t\tthis.govBlur.emit({\n\t\t\toriginalEvent: e,\n\t\t\tcomponent: FormAutocompleteClass.root,\n\t\t\tvalue: this.value,\n\t\t\tselected: null,\n\t\t})\n\t}\n\n\tprivate onInputHandler(e: InputEvent) {\n\t\tthis.value = (e.target as HTMLGovFormInputElement).value\n\t\te.stopPropagation()\n\t\tthis.govInput.emit({\n\t\t\toriginalEvent: e,\n\t\t\tcomponent: FormAutocompleteClass.root,\n\t\t\tvalue: this.value,\n\t\t\tselected: null,\n\t\t})\n\t\tthis.doSearch()\n\t}\n\n\tprivate onSelectHandler(e: PointerEvent | CustomEvent | TouchEvent, index = -1) {\n\t\tlet selected: Nullable<GovFormAutocompleteItem> = null\n\t\tif (index > -1) {\n\t\t\tselected = this.list[index]\n\t\t} else if (has(this.arrowCounter, this.list)) {\n\t\t\tselected = this.list[this.arrowCounter]\n\t\t}\n\t\tif (selected) {\n\t\t\tthis.govSelect.emit({\n\t\t\t\tcomponent: FormAutocompleteClass.root,\n\t\t\t\tvalue: this.value,\n\t\t\t\tselected: selected,\n\t\t\t\toriginalEvent: e,\n\t\t\t})\n\t\t\tthis.list = []\n\t\t\tif (has(this.nameKey, selected) && typeof selected[this.nameKey] === 'string') {\n\t\t\t\tthis.value = selected[this.nameKey]\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate onKeyUpHandler(e: CustomEvent) {\n\t\tconst event = (e.detail as FormInputEvent).originalEvent as KeyboardEvent\n\t\te.stopPropagation()\n\t\tevent.stopPropagation()\n\t\tif (event.keyCode === 38) this.onArrowUp()\n\t\telse if (event.keyCode === 40) this.onArrowDown()\n\t\telse if (event.keyCode === 13) {\n\t\t\te.preventDefault()\n\t\t\tevent.preventDefault()\n\t\t\tthis.onSelectHandler(e)\n\t\t}\n\t}\n\n\tprivate onKeyDownHandler(e: CustomEvent) {\n\t\tconst event = (e.detail as FormInputEvent).originalEvent as KeyboardEvent\n\t\te.stopPropagation()\n\t\tevent.stopPropagation()\n\t\tif (event.keyCode === 13) {\n\t\t\te.preventDefault()\n\t\t\tevent.preventDefault()\n\t\t}\n\t}\n\n\t/**\n\t * Returns the current state of the component\n\t */\n\t@Method()\n\tasync setFocus(options?: FocusOptions): Promise<void> {\n\t\treturn this.inputRef.focus(options)\n\t}\n\n\t/**\n\t * Set options for list\n\t */\n\t@Method()\n\tasync setOptions(options: GovFormAutocompleteItem[]): Promise<void> {\n\t\tthis.list = Array.isArray(options) ? options : []\n\t\tthis.arrowCounter = -1\n\t}\n\n\t/**\n\t * Clears whisperer value\n\t */\n\t@Method()\n\tasync clearValue(): Promise<void> {\n\t\tthis.value = ''\n\t\tthis.inputRef.value = ''\n\n\t\tawait this.inputRef.clearValue()\n\t}\n\n\t/**\n\t * Clears whisperer value\n\t */\n\t@Method()\n\tasync setProcessing(status: boolean): Promise<void> {\n\t\tthis.processing = status\n\t}\n\n\t/**\n\t * Set a custom asynchronous function for the whisperer\n\t */\n\t@Method()\n\tasync setSearchCallback(callback: (value: string) => Promise<any>) {\n\t\tthis.searchCallback = callback\n\t}\n\n\t/**\n\t * Setting a custom whisper result template\n\t * @param callback\n\t */\n\t@Method()\n\tasync setTemplateResolver(callback: (item: GovFormAutocompleteItem) => string) {\n\t\tthis.templateResolver = callback\n\t}\n}\n"],"mappings":"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"}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|