@public-ui/hydrate 2.2.0 → 2.2.1-3f35a0e390fee7a875eaf8922b28ac560293ae59.0

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.
Files changed (3) hide show
  1. package/dist/index.js +67 -49
  2. package/dist/index.mjs +67 -49
  3. package/package.json +3 -3
package/dist/index.js CHANGED
@@ -2660,7 +2660,7 @@ var loglevel = {exports: {}};
2660
2660
 
2661
2661
  var m = loglevel.exports;
2662
2662
 
2663
- const M=new Map,Y=[],I=new Map,a$1={A11yUi:{CSS_STYLE_CACHE:M,HYDRATED_HISTORY:Y,STYLING_TASK_QUEUE:I,Themes:{}}};let g=!1;const O=/^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/,$=e=>typeof e=="string"&&O.test(e),A=e=>{if($(e)===!1)throw new Error(`[Theming] The theme identifier "${typeof e=="string"?e:""}" (Type: ${typeof e}) is not valid. Please use only follow this pattern: /^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/`)},k=(e,t,s,o)=>T(e,t,s,o),T=(e,t,s,o)=>{o=o??{},o.append=o.append??!1,A(e),g===!1&&(g=!0,m.warn(`[Theming] The theme process is locked. This means that the theme "${e}" should not be patched.
2663
+ const H=new Map,M=[],Y=new Map,o$1={A11yUi:{CSS_STYLE_CACHE:H,HYDRATED_HISTORY:M,STYLING_TASK_QUEUE:Y,Themes:{}}};let g=!1;const I=/^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/,O=e=>typeof e=="string"&&I.test(e),p=e=>{if(O(e)===!1)throw new Error(`[Theming] The theme identifier "${typeof e=="string"?e:""}" (Type: ${typeof e}) is not valid. Please use only follow this pattern: /^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/`)},$=(e,t,s,n)=>T(e,t,s,n),T=(e,t,s,n)=>{n=n??{},n.append=n.append??!1,p(e),g===!1&&(g=!0,m.warn(`[Theming] The theme process is locked. This means that the theme "${e}" should not be patched.
2664
2664
 
2665
2665
  import { register } from 'adopted-style-sheets';
2666
2666
  import { defineCustomElements } from '...';
@@ -2670,7 +2670,7 @@ const M=new Map,Y=[],I=new Map,a$1={A11yUi:{CSS_STYLE_CACHE:M,HYDRATED_HISTORY:Y
2670
2670
  .then(() => {
2671
2671
  // run your app or website
2672
2672
  })
2673
- .catch(console.warn);`)),(typeof a$1.A11yUi.Themes[e]!="object"||a$1.A11yUi.Themes[e]===null)&&(a$1.A11yUi.Themes[e]={}),o.append&&typeof a$1.A11yUi.Themes[e][t]=="string"?a$1.A11yUi.Themes[e][t]+=s:a$1.A11yUi.Themes[e][t]=s;},P$1=(e,t,s,o)=>p(e,t,s,o),p=(e,t,s,o)=>(A(e),typeof t=="object"&&t!==null&&Object.getOwnPropertyNames(t).forEach(n=>{const r=t[n],i=n.toLowerCase(),h=typeof o?.transformTagName=="function"&&!["GLOBAL","PROPERTIES"].includes(n)?o.transformTagName(i):n;typeof r=="string"&&r.length>0&&T(e,h.toUpperCase(),r,s);}),e);const w=new Set,q=/--[^;]+/g,J=/:/,V=(e,t)=>{let s=t.match(q);if(Array.isArray(s)){s=s.filter(n=>J.test(n));const o=document.createElement("style");o.innerHTML=`.${e} {${s.join(";")}}`,document.querySelector("head")?.appendChild(o);}w.add(e);},y=(e,t)=>typeof a$1.A11yUi=="object"&&a$1.A11yUi!==null&&typeof a$1.A11yUi.Themes=="object"&&a$1.A11yUi.Themes!==null&&typeof a$1.A11yUi.Themes[e]=="object"&&a$1.A11yUi.Themes[e]!==null&&typeof a$1.A11yUi.Themes[e][t]=="string"?a$1.A11yUi.Themes[e][t].replace(/\r?\n/g,""):"",W=e=>{for(const t of Array.from(e.childNodes))if(t instanceof HTMLStyleElement&&t.tagName==="STYLE"&&t.dataset.themingFallback===void 0)e.removeChild(t);else break},X=(e,t)=>{try{if(a$1.A11yUi.Theme?.mode==="ssr")throw new Error("SSR");const s=[];t.forEach(o=>{const n=new CSSStyleSheet;n.replaceSync(o),s.push(n);}),e.adoptedStyleSheets=s;}catch{[...t].reverse().forEach((s,o)=>{if(typeof s!="string"||s.length===0)return;const n=document.createElement("style");switch(n.dataset.themingFallback="",o){case 4:n.dataset.themingBaseA11y="";break;case 3:n.dataset.themingBaseGlobal="";break;case 2:n.dataset.themingBaseComponent="";break;case 1:n.dataset.themingCustomGlobal="";break;case 0:n.dataset.themingCustomComponent="";break;default:n.dataset.themingUnknown="";break}n.innerHTML=s,e.insertBefore(n,e.firstChild);});}},Z$1=(e,t,s)=>{if(s!==!1){const o=[...Array.from(e.childNodes).filter(r=>r instanceof HTMLStyleElement&&r.tagName==="STYLE")];let n;try{n=[...Array.from(e.adoptedStyleSheets)];}catch{n=[];}s?.mode==="before"?(o.reverse().forEach(r=>t.unshift(r.innerHTML)),n.reverse().forEach(r=>t.unshift(Array.from(r.cssRules).map(i=>i.cssText).join("")))):s?.mode==="after"&&(o.forEach(r=>t.push(r.innerHTML)),n.forEach(r=>t.push(Array.from(r.cssRules).map(i=>i.cssText).join(""))));}},L=(e,t,s)=>{const o=t.name||"default";let n;try{if(e.shadowRoot===null)throw new Error("ShadowRoot is null");n=e.shadowRoot;}catch{n=e;}if(a$1.A11yUi.CSS_STYLE_CACHE.get(o)?.has(e.tagName))_(e,n,a$1.A11yUi.CSS_STYLE_CACHE.get(o)?.get(e.tagName),s);else {const r=y(o,"PROPERTIES"),i=y(o,"GLOBAL"),h=y(o,e.tagName);w.has(o)===!1&&V(o,i);const l=[r,i,h];Z$1(n,l,t.encroachCss),t.loglevel==="debug"&&console.log(e.tagName,l),t.cache===!0&&(a$1.A11yUi.CSS_STYLE_CACHE.has(o)===!1&&a$1.A11yUi.CSS_STYLE_CACHE.set(o,new Map),a$1.A11yUi.CSS_STYLE_CACHE.get(o)?.set(e.tagName,l)),_(e,n,l,s);}},_=(e,t,s,o)=>{W(t),X(t,s),e.style.display=o;},v=e=>{e.loglevel==="debug"&&a$1.A11yUi.HYDRATED_HISTORY.push({timestamp:Date.now(),numberOfTasks:a$1.A11yUi.STYLING_TASK_QUEUE.size});},se=e=>{a$1.A11yUi.STYLING_TASK_QUEUE.delete(e);},N=(e,t)=>{se(e),v(t);},oe=e=>{for(const t of e)if(a$1.A11yUi.STYLING_TASK_QUEUE.has(t.target)&&t.target.classList.contains("hydrated")){const{styleDisplay:s,themeDetails:o}=a$1.A11yUi.STYLING_TASK_QUEUE.get(t.target);L(t.target,o,s),N(t.target,o);}};try{new MutationObserver(oe);}catch{}
2673
+ .catch(console.warn);`)),(typeof o$1.A11yUi.Themes[e]!="object"||o$1.A11yUi.Themes[e]===null)&&(o$1.A11yUi.Themes[e]={}),n.append&&typeof o$1.A11yUi.Themes[e][t]=="string"?o$1.A11yUi.Themes[e][t]+=s:o$1.A11yUi.Themes[e][t]=s;},k=(e,t,s,n)=>d(e,t,s,n),d=(e,t,s,n)=>(p(e),typeof t=="object"&&t!==null&&Object.getOwnPropertyNames(t).forEach(a=>{const r=t[a],i=a.toLowerCase(),c=typeof n?.transformTagName=="function"&&!["GLOBAL","PROPERTIES"].includes(a)?n.transformTagName(i):a;typeof r=="string"&&r.length>0&&T(e,c.toUpperCase(),r,s);}),e);const C=new Set,F=/--[^;]+/g,q=/:/,J=(e,t)=>{let s=t.match(F);if(Array.isArray(s)){s=s.filter(a=>q.test(a));const n=document.createElement("style");n.innerHTML=`.${e} {${s.join(";")}}`,document.querySelector("head")?.appendChild(n);}C.add(e);},l=(e,t)=>typeof o$1.A11yUi=="object"&&o$1.A11yUi!==null&&typeof o$1.A11yUi.Themes=="object"&&o$1.A11yUi.Themes!==null&&typeof o$1.A11yUi.Themes[e]=="object"&&o$1.A11yUi.Themes[e]!==null&&typeof o$1.A11yUi.Themes[e][t]=="string"?o$1.A11yUi.Themes[e][t].replace(/\r?\n/g,""):"",V=e=>{for(const t of Array.from(e.childNodes))if(t instanceof HTMLStyleElement&&t.tagName==="STYLE"&&t.dataset.themingFallback===void 0)e.removeChild(t);else break},W=(e,t)=>{try{if(o$1.A11yUi.Theme?.mode==="ssr")throw new Error("SSR");const s=[];t.forEach(n=>{const a=new CSSStyleSheet;a.replaceSync(n),s.push(a);}),e.adoptedStyleSheets=s;}catch{[...t].reverse().forEach((s,n)=>{if(typeof s!="string"||s.length===0)return;const a=document.createElement("style");switch(a.dataset.themingFallback="",n){case 4:a.dataset.themingBaseA11y="";break;case 3:a.dataset.themingBaseGlobal="";break;case 2:a.dataset.themingBaseComponent="";break;case 1:a.dataset.themingCustomGlobal="";break;case 0:a.dataset.themingCustomComponent="";break;default:a.dataset.themingUnknown="";break}a.innerHTML=s,e.insertBefore(a,e.firstChild);});}},X=(e,t,s)=>{if(s!==!1){const n=[...Array.from(e.childNodes).filter(r=>r instanceof HTMLStyleElement&&r.tagName==="STYLE")];let a;try{a=[...Array.from(e.adoptedStyleSheets)];}catch{a=[];}s?.mode==="before"?(n.reverse().forEach(r=>t.unshift(r.innerHTML)),a.reverse().forEach(r=>t.unshift(Array.from(r.cssRules).map(i=>i.cssText).join("")))):s?.mode==="after"&&(n.forEach(r=>t.push(r.innerHTML)),a.forEach(r=>t.push(Array.from(r.cssRules).map(i=>i.cssText).join(""))));}},w=(e,t)=>{const s=t.name||"default";let n;try{if(e.shadowRoot===null)throw new Error("ShadowRoot is null");n=e.shadowRoot;}catch{n=e;}if(o$1.A11yUi.CSS_STYLE_CACHE.get(s)?.has(e.tagName))L(n,o$1.A11yUi.CSS_STYLE_CACHE.get(s)?.get(e.tagName));else {const a=l(s,"PROPERTIES"),r=l(s,"GLOBAL"),i=l(s,e.tagName);C.has(s)===!1&&J(s,r);const c=[a,r,i];X(n,c,t.encroachCss),t.loglevel==="debug"&&console.log(e.tagName,c),t.cache===!0&&(o$1.A11yUi.CSS_STYLE_CACHE.has(s)===!1&&o$1.A11yUi.CSS_STYLE_CACHE.set(s,new Map),o$1.A11yUi.CSS_STYLE_CACHE.get(s)?.set(e.tagName,c)),L(n,c);}},L=(e,t)=>{V(e),W(e,t);},_=e=>{e.loglevel==="debug"&&o$1.A11yUi.HYDRATED_HISTORY.push({timestamp:Date.now(),numberOfTasks:o$1.A11yUi.STYLING_TASK_QUEUE.size});},te=e=>{o$1.A11yUi.STYLING_TASK_QUEUE.delete(e);},v=(e,t)=>{te(e),_(t);},se=e=>{for(const t of e)if(o$1.A11yUi.STYLING_TASK_QUEUE.has(t.target)&&t.target.classList.contains("hydrated")){const{themeDetails:s}=o$1.A11yUi.STYLING_TASK_QUEUE.get(t.target);w(t.target,s),v(t.target,s);}};try{new MutationObserver(se);}catch{}
2674
2674
 
2675
2675
  const alertTypeOptions = ['default', 'info', 'success', 'warning', 'error'];
2676
2676
  const alertVariantOptions = ['card', 'msg'];
@@ -3745,9 +3745,9 @@ const koliBriQuerySelector = (selector, node) => querySelector(selector, node ||
3745
3745
  const koliBriQuerySelectorAll = (selector, node) => querySelectorAll(selector, node || getDocument());
3746
3746
  class KoliBriDevHelper {
3747
3747
  }
3748
- KoliBriDevHelper.getCssStyle = y;
3749
- KoliBriDevHelper.patchTheme = P$1;
3750
- KoliBriDevHelper.patchThemeTag = k;
3748
+ KoliBriDevHelper.getCssStyle = l;
3749
+ KoliBriDevHelper.patchTheme = k;
3750
+ KoliBriDevHelper.patchThemeTag = $;
3751
3751
  KoliBriDevHelper.querySelector = koliBriQuerySelector;
3752
3752
  KoliBriDevHelper.querySelectorAll = koliBriQuerySelectorAll;
3753
3753
  KoliBriDevHelper.stringifyJson = stringifyJson;
@@ -4239,7 +4239,12 @@ const validateMsg = (component, value) => {
4239
4239
  }
4240
4240
  catch (e) {
4241
4241
  }
4242
- watchValidator(component, `_msg`, (value) => typeof value === 'object', new Set(['Object']), value);
4242
+ watchValidator(component, `_msg`, (value) => isObject$1(value) && typeof (value === null || value === void 0 ? void 0 : value._description) === 'string', new Set(['MsgPropType']), value, {
4243
+ defaultValue: {
4244
+ _description: '',
4245
+ _type: 'error',
4246
+ },
4247
+ });
4243
4248
  });
4244
4249
  };
4245
4250
 
@@ -6137,11 +6142,15 @@ class InputController extends ControlledInputController {
6137
6142
  validateTooltipAlign(this.component, value);
6138
6143
  }
6139
6144
  validateError(value) {
6140
- const message = {
6141
- _description: value || '',
6142
- _type: 'error',
6143
- };
6144
- this.validateMsg(message);
6145
+ if (typeof value === 'string' && value.length > 0) {
6146
+ this.validateMsg({
6147
+ _description: value,
6148
+ _type: 'error',
6149
+ });
6150
+ }
6151
+ else {
6152
+ this.validateMsg(undefined);
6153
+ }
6145
6154
  }
6146
6155
  validateHideError(value) {
6147
6156
  validateHideError(this.component, value, {
@@ -6209,7 +6218,9 @@ class InputController extends ControlledInputController {
6209
6218
  this.validateAccessKey(this.component._accessKey);
6210
6219
  this.validateAdjustHeight(this.component._adjustHeight);
6211
6220
  this.validateError(this.component._error);
6212
- this.validateMsg(this.component._msg);
6221
+ if (this.component._msg) {
6222
+ this.validateMsg(this.component._msg);
6223
+ }
6213
6224
  this.validateDisabled(this.component._disabled);
6214
6225
  this.validateHideError(this.component._hideError);
6215
6226
  this.validateHideLabel(this.component._hideLabel);
@@ -10591,29 +10602,27 @@ class KolInputWc {
10591
10602
  return icon && typeof icon === 'object' && icon.style ? icon.style : {};
10592
10603
  }
10593
10604
  render() {
10594
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
10595
- const isMessageValidError = Boolean(((_a = this._msg) === null || _a === void 0 ? void 0 : _a._type) === 'error' && this._msg._description && ((_b = this._msg._description) === null || _b === void 0 ? void 0 : _b.length) > 0);
10596
- const hasError = !this._readOnly && isMessageValidError && this._touched === true;
10597
- const showFormFieldMsg = Boolean(hasError || (((_c = this._msg) === null || _c === void 0 ? void 0 : _c._type) !== 'error' && ((_d = this._msg) === null || _d === void 0 ? void 0 : _d._description)));
10605
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
10606
+ const showMsg = typeof ((_a = this._msg) === null || _a === void 0 ? void 0 : _a._description) === 'string' && ((_b = this._msg) === null || _b === void 0 ? void 0 : _b._description.length) > 0 && this._touched === true;
10598
10607
  const hasExpertSlot = showExpertSlot(this._label);
10599
10608
  const hasHint = typeof this._hint === 'string' && this._hint.length > 0;
10600
10609
  const useTooltopInsteadOfLabel = !hasExpertSlot && this._hideLabel;
10601
- return (hAsync(Host, { key: '8cdf8d6dde998550bced4da791d8c9c5ea31ab2e', class: clsx('kol-input', this.getModifierClassNameByMsgType(), {
10610
+ return (hAsync(Host, { key: 'd0ceb4dd9cb440870fec781c26b3c35a0db7cf3c', class: clsx('kol-input', this.getModifierClassNameByMsgType(showMsg), {
10602
10611
  disabled: this._disabled === true,
10603
- error: hasError === true,
10612
+ [((_c = this._msg) === null || _c === void 0 ? void 0 : _c._type) || 'error']: showMsg === true,
10604
10613
  'read-only': this._readOnly === true,
10605
10614
  required: this._required === true,
10606
10615
  touched: this._touched === true,
10607
10616
  'hidden-error': this._hideError === true,
10608
- }) }, hAsync("label", { key: 'ace5b68eef432c2a34db70ac234b4488297702b2', class: "input-label", id: !useTooltopInsteadOfLabel ? `${this._id}-label` : undefined, hidden: useTooltopInsteadOfLabel, htmlFor: this._id }, hAsync("span", { key: 'cf0cb4d88144b324cb61134ffd26bc3f7da64c46', class: "input-label-span" }, hAsync("slot", { key: 'adce45da91af4963c7b5b00b4471ab29e4cf857b', name: "label" }))), hasHint && (hAsync("span", { key: 'a6fe31328a8ae31bcd132d13e527c27afc52f95c', class: "hint", id: `${this._id}-hint` }, this._hint)), hAsync("div", { key: 'c25ad4e10b70d33a9f3be5e06bcefbacb3046d93', class: {
10617
+ }) }, hAsync("label", { key: 'c67cf862ec7499d87c7a2b5c3e098f2d56e1ddc2', class: "input-label", id: !useTooltopInsteadOfLabel ? `${this._id}-label` : undefined, hidden: useTooltopInsteadOfLabel, htmlFor: this._id }, hAsync("span", { key: 'ef979abf10372861c4253fdf8239fa50a8f71c34', class: "input-label-span" }, hAsync("slot", { key: '6b71f8bc1cc97c5659a721f0ca5d010bf83e9958', name: "label" }))), hasHint && (hAsync("span", { key: '26259043769d50abb4242ef5b3282f754c363a23', class: "hint", id: `${this._id}-hint` }, this._hint)), hAsync("div", { key: '69473768e9570bb3673cf2a682226d6aa099ab8b', class: {
10609
10618
  input: true,
10610
- 'icon-left': typeof ((_e = this._icons) === null || _e === void 0 ? void 0 : _e.left) === 'object',
10611
- 'icon-right': typeof ((_f = this._icons) === null || _f === void 0 ? void 0 : _f.right) === 'object',
10612
- } }, ((_g = this._icons) === null || _g === void 0 ? void 0 : _g.left) && (hAsync(KolIconTag, { key: '1ebc24cdf54e0af6924e53ebd89530b7dce7b390', _label: "", _icons: ((_h = this._icons) === null || _h === void 0 ? void 0 : _h.left).icon, style: this.getIconStyles((_j = this._icons) === null || _j === void 0 ? void 0 : _j.left) })), hAsync("div", { key: 'a51050e6ee364e70ec8c0a2008c5696469ef0dcc', ref: this.catchInputSlot, id: this.slotName, class: "input-slot" }), typeof this._smartButton === 'object' && this._smartButton !== null && (hAsync(KolButtonWcTag, { key: '9be371d3929093972c667445c272a08340e0d90e', _customClass: this._smartButton._customClass, _disabled: this._smartButton._disabled, _icons: this._smartButton._icons, _hideLabel: true, _id: this._smartButton._id, _label: this._smartButton._label, _on: this._smartButton._on, _tooltipAlign: this._smartButton._tooltipAlign, _variant: this._smartButton._variant })), ((_k = this._icons) === null || _k === void 0 ? void 0 : _k.right) && (hAsync(KolIconTag, { key: '6150b39bb7458fc0064a161eab5a0be1c6fad549', _label: "", _icons: ((_l = this._icons) === null || _l === void 0 ? void 0 : _l.right).icon, style: this.getIconStyles((_m = this._icons) === null || _m === void 0 ? void 0 : _m.right) }))), useTooltopInsteadOfLabel && (hAsync(KolTooltipWcTag, { key: '96ecebd94a2d45e96d169af27d96f8beb67402dd', "aria-hidden": "true", class: "input-tooltip", _badgeText: this._accessKey || this._shortKey, _align: this._tooltipAlign, _id: this._hideLabel ? `${this._id}-label` : undefined, _label: this._label })), showFormFieldMsg && hAsync(KolFormFieldMsgFc, { key: '92d8c187a118275f2fa4dea8557c7a0c5b937b8a', _alert: this._alert, _hideError: this._hideError, _msg: this._msg, _id: this._id }), Array.isArray(this._suggestions) && this._suggestions.length > 0 && (hAsync("datalist", { key: '1c4c1811fd84d6f08f4dee22f783b91fdff2894a', id: `${this._id}-list` }, this._suggestions.map((option) => (hAsync("option", { value: option }))))), this._hasCounter && (hAsync("span", { key: '1823a1dc667ec6f72019b29beba1bbb6fe1f827c', class: "counter", "aria-atomic": "true", "aria-live": "polite", "data-testid": "input-counter" }, this._currentLength, this._maxLength && (hAsync(Fragment, null, hAsync("span", { key: 'fcc12beb596bdf86c0ecc507899685218c697775', "aria-label": translate('kol-of'), role: "img" }, "/"), this._maxLength)), ' ', hAsync("span", { key: 'eaaf2c17470681dc799b74f5eaebbe2496564c0e' }, translate('kol-characters'))))));
10619
+ 'icon-left': typeof ((_d = this._icons) === null || _d === void 0 ? void 0 : _d.left) === 'object',
10620
+ 'icon-right': typeof ((_e = this._icons) === null || _e === void 0 ? void 0 : _e.right) === 'object',
10621
+ } }, ((_f = this._icons) === null || _f === void 0 ? void 0 : _f.left) && (hAsync(KolIconTag, { key: 'c6651727cbd0c84a7120b4f38096e4629461582b', _label: "", _icons: ((_g = this._icons) === null || _g === void 0 ? void 0 : _g.left).icon, style: this.getIconStyles((_h = this._icons) === null || _h === void 0 ? void 0 : _h.left) })), hAsync("div", { key: '7a45832f515f4a7402ded242916b638a973b4363', ref: this.catchInputSlot, id: this.slotName, class: "input-slot" }), typeof this._smartButton === 'object' && this._smartButton !== null && (hAsync(KolButtonWcTag, { key: 'b009c381aa4d445c531765b852befc836a369b32', _customClass: this._smartButton._customClass, _disabled: this._smartButton._disabled, _icons: this._smartButton._icons, _hideLabel: true, _id: this._smartButton._id, _label: this._smartButton._label, _on: this._smartButton._on, _tooltipAlign: this._smartButton._tooltipAlign, _variant: this._smartButton._variant })), ((_j = this._icons) === null || _j === void 0 ? void 0 : _j.right) && (hAsync(KolIconTag, { key: '0d8ea29a271f1bf2dde15cc0b38586d83554e2a1', _label: "", _icons: ((_k = this._icons) === null || _k === void 0 ? void 0 : _k.right).icon, style: this.getIconStyles((_l = this._icons) === null || _l === void 0 ? void 0 : _l.right) }))), useTooltopInsteadOfLabel && (hAsync(KolTooltipWcTag, { key: '4bab14b17ab7f1b4ea031436eabf76f25f609186', "aria-hidden": "true", class: "input-tooltip", _badgeText: this._accessKey || this._shortKey, _align: this._tooltipAlign, _id: this._hideLabel ? `${this._id}-label` : undefined, _label: this._label })), showMsg && hAsync(KolFormFieldMsgFc, { key: '7225565e2026885136416d4c8a7d488ce628da1d', _alert: this._alert, _hideError: this._hideError, _msg: this._msg, _id: this._id }), Array.isArray(this._suggestions) && this._suggestions.length > 0 && (hAsync("datalist", { key: 'c16300512396ecfba9139293f6b05cb9788f90cd', id: `${this._id}-list` }, this._suggestions.map((option) => (hAsync("option", { value: option }))))), this._hasCounter && (hAsync("span", { key: '22826946e07709619c37cc24a8fdd573db2fb359', class: "counter", "aria-atomic": "true", "aria-live": "polite", "data-testid": "input-counter" }, this._currentLength, this._maxLength && (hAsync(Fragment, null, hAsync("span", { key: 'ba72b0ee76ca6736505a8478d232646bfa88828f', "aria-label": translate('kol-of'), role: "img" }, "/"), this._maxLength)), ' ', hAsync("span", { key: '6fd9fd3ff27b29233517bfc9e84ef6656093dc36' }, translate('kol-characters'))))));
10613
10622
  }
10614
- getModifierClassNameByMsgType() {
10623
+ getModifierClassNameByMsgType(showMsg) {
10615
10624
  var _a, _b;
10616
- if ((_a = this._msg) === null || _a === void 0 ? void 0 : _a._type) {
10625
+ if (showMsg && ((_a = this._msg) === null || _a === void 0 ? void 0 : _a._type)) {
10617
10626
  return {
10618
10627
  default: 'msg-type-default',
10619
10628
  info: 'msg-type-info',
@@ -13526,6 +13535,31 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
13526
13535
  });
13527
13536
  }
13528
13537
 
13538
+ // If <html> has a CSS width greater than the viewport, then this will be
13539
+ // incorrect for RTL.
13540
+ function getWindowScrollBarX(element, rect) {
13541
+ const leftScroll = getNodeScroll(element).scrollLeft;
13542
+ if (!rect) {
13543
+ return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
13544
+ }
13545
+ return rect.left + leftScroll;
13546
+ }
13547
+
13548
+ function getHTMLOffset(documentElement, scroll, ignoreScrollbarX) {
13549
+ if (ignoreScrollbarX === void 0) {
13550
+ ignoreScrollbarX = false;
13551
+ }
13552
+ const htmlRect = documentElement.getBoundingClientRect();
13553
+ const x = htmlRect.left + scroll.scrollLeft - (ignoreScrollbarX ? 0 :
13554
+ // RTL <body> scrollbar.
13555
+ getWindowScrollBarX(documentElement, htmlRect));
13556
+ const y = htmlRect.top + scroll.scrollTop;
13557
+ return {
13558
+ x,
13559
+ y
13560
+ };
13561
+ }
13562
+
13529
13563
  function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
13530
13564
  let {
13531
13565
  elements,
@@ -13557,11 +13591,12 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
13557
13591
  offsets.y = offsetRect.y + offsetParent.clientTop;
13558
13592
  }
13559
13593
  }
13594
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll, true) : createCoords(0);
13560
13595
  return {
13561
13596
  width: rect.width * scale.x,
13562
13597
  height: rect.height * scale.y,
13563
- x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
13564
- y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
13598
+ x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
13599
+ y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
13565
13600
  };
13566
13601
  }
13567
13602
 
@@ -13569,16 +13604,6 @@ function getClientRects(element) {
13569
13604
  return Array.from(element.getClientRects());
13570
13605
  }
13571
13606
 
13572
- // If <html> has a CSS width greater than the viewport, then this will be
13573
- // incorrect for RTL.
13574
- function getWindowScrollBarX(element, rect) {
13575
- const leftScroll = getNodeScroll(element).scrollLeft;
13576
- if (!rect) {
13577
- return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
13578
- }
13579
- return rect.left + leftScroll;
13580
- }
13581
-
13582
13607
  // Gets the entire size of the scrollable document area, even extending outside
13583
13608
  // of the `<html>` and `<body>` rect bounds if horizontally scrollable.
13584
13609
  function getDocumentRect(element) {
@@ -13653,9 +13678,10 @@ function getClientRectFromClippingAncestor(element, clippingAncestor, strategy)
13653
13678
  } else {
13654
13679
  const visualOffsets = getVisualOffsets(element);
13655
13680
  rect = {
13656
- ...clippingAncestor,
13657
13681
  x: clippingAncestor.x - visualOffsets.x,
13658
- y: clippingAncestor.y - visualOffsets.y
13682
+ y: clippingAncestor.y - visualOffsets.y,
13683
+ width: clippingAncestor.width,
13684
+ height: clippingAncestor.height
13659
13685
  };
13660
13686
  }
13661
13687
  return rectToClientRect(rect);
@@ -13765,17 +13791,9 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
13765
13791
  offsets.x = getWindowScrollBarX(documentElement);
13766
13792
  }
13767
13793
  }
13768
- let htmlX = 0;
13769
- let htmlY = 0;
13770
- if (documentElement && !isOffsetParentAnElement && !isFixed) {
13771
- const htmlRect = documentElement.getBoundingClientRect();
13772
- htmlY = htmlRect.top + scroll.scrollTop;
13773
- htmlX = htmlRect.left + scroll.scrollLeft -
13774
- // RTL <body> scrollbar.
13775
- getWindowScrollBarX(documentElement, htmlRect);
13776
- }
13777
- const x = rect.left + scroll.scrollLeft - offsets.x - htmlX;
13778
- const y = rect.top + scroll.scrollTop - offsets.y - htmlY;
13794
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
13795
+ const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
13796
+ const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
13779
13797
  return {
13780
13798
  x,
13781
13799
  y,
package/dist/index.mjs CHANGED
@@ -2656,7 +2656,7 @@ var loglevel = {exports: {}};
2656
2656
 
2657
2657
  var m = loglevel.exports;
2658
2658
 
2659
- const M=new Map,Y=[],I=new Map,a$1={A11yUi:{CSS_STYLE_CACHE:M,HYDRATED_HISTORY:Y,STYLING_TASK_QUEUE:I,Themes:{}}};let g=!1;const O=/^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/,$=e=>typeof e=="string"&&O.test(e),A=e=>{if($(e)===!1)throw new Error(`[Theming] The theme identifier "${typeof e=="string"?e:""}" (Type: ${typeof e}) is not valid. Please use only follow this pattern: /^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/`)},k=(e,t,s,o)=>T(e,t,s,o),T=(e,t,s,o)=>{o=o??{},o.append=o.append??!1,A(e),g===!1&&(g=!0,m.warn(`[Theming] The theme process is locked. This means that the theme "${e}" should not be patched.
2659
+ const H=new Map,M=[],Y=new Map,o$1={A11yUi:{CSS_STYLE_CACHE:H,HYDRATED_HISTORY:M,STYLING_TASK_QUEUE:Y,Themes:{}}};let g=!1;const I=/^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/,O=e=>typeof e=="string"&&I.test(e),p=e=>{if(O(e)===!1)throw new Error(`[Theming] The theme identifier "${typeof e=="string"?e:""}" (Type: ${typeof e}) is not valid. Please use only follow this pattern: /^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/`)},$=(e,t,s,n)=>T(e,t,s,n),T=(e,t,s,n)=>{n=n??{},n.append=n.append??!1,p(e),g===!1&&(g=!0,m.warn(`[Theming] The theme process is locked. This means that the theme "${e}" should not be patched.
2660
2660
 
2661
2661
  import { register } from 'adopted-style-sheets';
2662
2662
  import { defineCustomElements } from '...';
@@ -2666,7 +2666,7 @@ const M=new Map,Y=[],I=new Map,a$1={A11yUi:{CSS_STYLE_CACHE:M,HYDRATED_HISTORY:Y
2666
2666
  .then(() => {
2667
2667
  // run your app or website
2668
2668
  })
2669
- .catch(console.warn);`)),(typeof a$1.A11yUi.Themes[e]!="object"||a$1.A11yUi.Themes[e]===null)&&(a$1.A11yUi.Themes[e]={}),o.append&&typeof a$1.A11yUi.Themes[e][t]=="string"?a$1.A11yUi.Themes[e][t]+=s:a$1.A11yUi.Themes[e][t]=s;},P$1=(e,t,s,o)=>p(e,t,s,o),p=(e,t,s,o)=>(A(e),typeof t=="object"&&t!==null&&Object.getOwnPropertyNames(t).forEach(n=>{const r=t[n],i=n.toLowerCase(),h=typeof o?.transformTagName=="function"&&!["GLOBAL","PROPERTIES"].includes(n)?o.transformTagName(i):n;typeof r=="string"&&r.length>0&&T(e,h.toUpperCase(),r,s);}),e);const w=new Set,q=/--[^;]+/g,J=/:/,V=(e,t)=>{let s=t.match(q);if(Array.isArray(s)){s=s.filter(n=>J.test(n));const o=document.createElement("style");o.innerHTML=`.${e} {${s.join(";")}}`,document.querySelector("head")?.appendChild(o);}w.add(e);},y=(e,t)=>typeof a$1.A11yUi=="object"&&a$1.A11yUi!==null&&typeof a$1.A11yUi.Themes=="object"&&a$1.A11yUi.Themes!==null&&typeof a$1.A11yUi.Themes[e]=="object"&&a$1.A11yUi.Themes[e]!==null&&typeof a$1.A11yUi.Themes[e][t]=="string"?a$1.A11yUi.Themes[e][t].replace(/\r?\n/g,""):"",W=e=>{for(const t of Array.from(e.childNodes))if(t instanceof HTMLStyleElement&&t.tagName==="STYLE"&&t.dataset.themingFallback===void 0)e.removeChild(t);else break},X=(e,t)=>{try{if(a$1.A11yUi.Theme?.mode==="ssr")throw new Error("SSR");const s=[];t.forEach(o=>{const n=new CSSStyleSheet;n.replaceSync(o),s.push(n);}),e.adoptedStyleSheets=s;}catch{[...t].reverse().forEach((s,o)=>{if(typeof s!="string"||s.length===0)return;const n=document.createElement("style");switch(n.dataset.themingFallback="",o){case 4:n.dataset.themingBaseA11y="";break;case 3:n.dataset.themingBaseGlobal="";break;case 2:n.dataset.themingBaseComponent="";break;case 1:n.dataset.themingCustomGlobal="";break;case 0:n.dataset.themingCustomComponent="";break;default:n.dataset.themingUnknown="";break}n.innerHTML=s,e.insertBefore(n,e.firstChild);});}},Z$1=(e,t,s)=>{if(s!==!1){const o=[...Array.from(e.childNodes).filter(r=>r instanceof HTMLStyleElement&&r.tagName==="STYLE")];let n;try{n=[...Array.from(e.adoptedStyleSheets)];}catch{n=[];}s?.mode==="before"?(o.reverse().forEach(r=>t.unshift(r.innerHTML)),n.reverse().forEach(r=>t.unshift(Array.from(r.cssRules).map(i=>i.cssText).join("")))):s?.mode==="after"&&(o.forEach(r=>t.push(r.innerHTML)),n.forEach(r=>t.push(Array.from(r.cssRules).map(i=>i.cssText).join(""))));}},L=(e,t,s)=>{const o=t.name||"default";let n;try{if(e.shadowRoot===null)throw new Error("ShadowRoot is null");n=e.shadowRoot;}catch{n=e;}if(a$1.A11yUi.CSS_STYLE_CACHE.get(o)?.has(e.tagName))_(e,n,a$1.A11yUi.CSS_STYLE_CACHE.get(o)?.get(e.tagName),s);else {const r=y(o,"PROPERTIES"),i=y(o,"GLOBAL"),h=y(o,e.tagName);w.has(o)===!1&&V(o,i);const l=[r,i,h];Z$1(n,l,t.encroachCss),t.loglevel==="debug"&&console.log(e.tagName,l),t.cache===!0&&(a$1.A11yUi.CSS_STYLE_CACHE.has(o)===!1&&a$1.A11yUi.CSS_STYLE_CACHE.set(o,new Map),a$1.A11yUi.CSS_STYLE_CACHE.get(o)?.set(e.tagName,l)),_(e,n,l,s);}},_=(e,t,s,o)=>{W(t),X(t,s),e.style.display=o;},v=e=>{e.loglevel==="debug"&&a$1.A11yUi.HYDRATED_HISTORY.push({timestamp:Date.now(),numberOfTasks:a$1.A11yUi.STYLING_TASK_QUEUE.size});},se=e=>{a$1.A11yUi.STYLING_TASK_QUEUE.delete(e);},N=(e,t)=>{se(e),v(t);},oe=e=>{for(const t of e)if(a$1.A11yUi.STYLING_TASK_QUEUE.has(t.target)&&t.target.classList.contains("hydrated")){const{styleDisplay:s,themeDetails:o}=a$1.A11yUi.STYLING_TASK_QUEUE.get(t.target);L(t.target,o,s),N(t.target,o);}};try{new MutationObserver(oe);}catch{}
2669
+ .catch(console.warn);`)),(typeof o$1.A11yUi.Themes[e]!="object"||o$1.A11yUi.Themes[e]===null)&&(o$1.A11yUi.Themes[e]={}),n.append&&typeof o$1.A11yUi.Themes[e][t]=="string"?o$1.A11yUi.Themes[e][t]+=s:o$1.A11yUi.Themes[e][t]=s;},k=(e,t,s,n)=>d(e,t,s,n),d=(e,t,s,n)=>(p(e),typeof t=="object"&&t!==null&&Object.getOwnPropertyNames(t).forEach(a=>{const r=t[a],i=a.toLowerCase(),c=typeof n?.transformTagName=="function"&&!["GLOBAL","PROPERTIES"].includes(a)?n.transformTagName(i):a;typeof r=="string"&&r.length>0&&T(e,c.toUpperCase(),r,s);}),e);const C=new Set,F=/--[^;]+/g,q=/:/,J=(e,t)=>{let s=t.match(F);if(Array.isArray(s)){s=s.filter(a=>q.test(a));const n=document.createElement("style");n.innerHTML=`.${e} {${s.join(";")}}`,document.querySelector("head")?.appendChild(n);}C.add(e);},l=(e,t)=>typeof o$1.A11yUi=="object"&&o$1.A11yUi!==null&&typeof o$1.A11yUi.Themes=="object"&&o$1.A11yUi.Themes!==null&&typeof o$1.A11yUi.Themes[e]=="object"&&o$1.A11yUi.Themes[e]!==null&&typeof o$1.A11yUi.Themes[e][t]=="string"?o$1.A11yUi.Themes[e][t].replace(/\r?\n/g,""):"",V=e=>{for(const t of Array.from(e.childNodes))if(t instanceof HTMLStyleElement&&t.tagName==="STYLE"&&t.dataset.themingFallback===void 0)e.removeChild(t);else break},W=(e,t)=>{try{if(o$1.A11yUi.Theme?.mode==="ssr")throw new Error("SSR");const s=[];t.forEach(n=>{const a=new CSSStyleSheet;a.replaceSync(n),s.push(a);}),e.adoptedStyleSheets=s;}catch{[...t].reverse().forEach((s,n)=>{if(typeof s!="string"||s.length===0)return;const a=document.createElement("style");switch(a.dataset.themingFallback="",n){case 4:a.dataset.themingBaseA11y="";break;case 3:a.dataset.themingBaseGlobal="";break;case 2:a.dataset.themingBaseComponent="";break;case 1:a.dataset.themingCustomGlobal="";break;case 0:a.dataset.themingCustomComponent="";break;default:a.dataset.themingUnknown="";break}a.innerHTML=s,e.insertBefore(a,e.firstChild);});}},X=(e,t,s)=>{if(s!==!1){const n=[...Array.from(e.childNodes).filter(r=>r instanceof HTMLStyleElement&&r.tagName==="STYLE")];let a;try{a=[...Array.from(e.adoptedStyleSheets)];}catch{a=[];}s?.mode==="before"?(n.reverse().forEach(r=>t.unshift(r.innerHTML)),a.reverse().forEach(r=>t.unshift(Array.from(r.cssRules).map(i=>i.cssText).join("")))):s?.mode==="after"&&(n.forEach(r=>t.push(r.innerHTML)),a.forEach(r=>t.push(Array.from(r.cssRules).map(i=>i.cssText).join(""))));}},w=(e,t)=>{const s=t.name||"default";let n;try{if(e.shadowRoot===null)throw new Error("ShadowRoot is null");n=e.shadowRoot;}catch{n=e;}if(o$1.A11yUi.CSS_STYLE_CACHE.get(s)?.has(e.tagName))L(n,o$1.A11yUi.CSS_STYLE_CACHE.get(s)?.get(e.tagName));else {const a=l(s,"PROPERTIES"),r=l(s,"GLOBAL"),i=l(s,e.tagName);C.has(s)===!1&&J(s,r);const c=[a,r,i];X(n,c,t.encroachCss),t.loglevel==="debug"&&console.log(e.tagName,c),t.cache===!0&&(o$1.A11yUi.CSS_STYLE_CACHE.has(s)===!1&&o$1.A11yUi.CSS_STYLE_CACHE.set(s,new Map),o$1.A11yUi.CSS_STYLE_CACHE.get(s)?.set(e.tagName,c)),L(n,c);}},L=(e,t)=>{V(e),W(e,t);},_=e=>{e.loglevel==="debug"&&o$1.A11yUi.HYDRATED_HISTORY.push({timestamp:Date.now(),numberOfTasks:o$1.A11yUi.STYLING_TASK_QUEUE.size});},te=e=>{o$1.A11yUi.STYLING_TASK_QUEUE.delete(e);},v=(e,t)=>{te(e),_(t);},se=e=>{for(const t of e)if(o$1.A11yUi.STYLING_TASK_QUEUE.has(t.target)&&t.target.classList.contains("hydrated")){const{themeDetails:s}=o$1.A11yUi.STYLING_TASK_QUEUE.get(t.target);w(t.target,s),v(t.target,s);}};try{new MutationObserver(se);}catch{}
2670
2670
 
2671
2671
  const alertTypeOptions = ['default', 'info', 'success', 'warning', 'error'];
2672
2672
  const alertVariantOptions = ['card', 'msg'];
@@ -3741,9 +3741,9 @@ const koliBriQuerySelector = (selector, node) => querySelector(selector, node ||
3741
3741
  const koliBriQuerySelectorAll = (selector, node) => querySelectorAll(selector, node || getDocument());
3742
3742
  class KoliBriDevHelper {
3743
3743
  }
3744
- KoliBriDevHelper.getCssStyle = y;
3745
- KoliBriDevHelper.patchTheme = P$1;
3746
- KoliBriDevHelper.patchThemeTag = k;
3744
+ KoliBriDevHelper.getCssStyle = l;
3745
+ KoliBriDevHelper.patchTheme = k;
3746
+ KoliBriDevHelper.patchThemeTag = $;
3747
3747
  KoliBriDevHelper.querySelector = koliBriQuerySelector;
3748
3748
  KoliBriDevHelper.querySelectorAll = koliBriQuerySelectorAll;
3749
3749
  KoliBriDevHelper.stringifyJson = stringifyJson;
@@ -4235,7 +4235,12 @@ const validateMsg = (component, value) => {
4235
4235
  }
4236
4236
  catch (e) {
4237
4237
  }
4238
- watchValidator(component, `_msg`, (value) => typeof value === 'object', new Set(['Object']), value);
4238
+ watchValidator(component, `_msg`, (value) => isObject$1(value) && typeof (value === null || value === void 0 ? void 0 : value._description) === 'string', new Set(['MsgPropType']), value, {
4239
+ defaultValue: {
4240
+ _description: '',
4241
+ _type: 'error',
4242
+ },
4243
+ });
4239
4244
  });
4240
4245
  };
4241
4246
 
@@ -6133,11 +6138,15 @@ class InputController extends ControlledInputController {
6133
6138
  validateTooltipAlign(this.component, value);
6134
6139
  }
6135
6140
  validateError(value) {
6136
- const message = {
6137
- _description: value || '',
6138
- _type: 'error',
6139
- };
6140
- this.validateMsg(message);
6141
+ if (typeof value === 'string' && value.length > 0) {
6142
+ this.validateMsg({
6143
+ _description: value,
6144
+ _type: 'error',
6145
+ });
6146
+ }
6147
+ else {
6148
+ this.validateMsg(undefined);
6149
+ }
6141
6150
  }
6142
6151
  validateHideError(value) {
6143
6152
  validateHideError(this.component, value, {
@@ -6205,7 +6214,9 @@ class InputController extends ControlledInputController {
6205
6214
  this.validateAccessKey(this.component._accessKey);
6206
6215
  this.validateAdjustHeight(this.component._adjustHeight);
6207
6216
  this.validateError(this.component._error);
6208
- this.validateMsg(this.component._msg);
6217
+ if (this.component._msg) {
6218
+ this.validateMsg(this.component._msg);
6219
+ }
6209
6220
  this.validateDisabled(this.component._disabled);
6210
6221
  this.validateHideError(this.component._hideError);
6211
6222
  this.validateHideLabel(this.component._hideLabel);
@@ -10587,29 +10598,27 @@ class KolInputWc {
10587
10598
  return icon && typeof icon === 'object' && icon.style ? icon.style : {};
10588
10599
  }
10589
10600
  render() {
10590
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
10591
- const isMessageValidError = Boolean(((_a = this._msg) === null || _a === void 0 ? void 0 : _a._type) === 'error' && this._msg._description && ((_b = this._msg._description) === null || _b === void 0 ? void 0 : _b.length) > 0);
10592
- const hasError = !this._readOnly && isMessageValidError && this._touched === true;
10593
- const showFormFieldMsg = Boolean(hasError || (((_c = this._msg) === null || _c === void 0 ? void 0 : _c._type) !== 'error' && ((_d = this._msg) === null || _d === void 0 ? void 0 : _d._description)));
10601
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
10602
+ const showMsg = typeof ((_a = this._msg) === null || _a === void 0 ? void 0 : _a._description) === 'string' && ((_b = this._msg) === null || _b === void 0 ? void 0 : _b._description.length) > 0 && this._touched === true;
10594
10603
  const hasExpertSlot = showExpertSlot(this._label);
10595
10604
  const hasHint = typeof this._hint === 'string' && this._hint.length > 0;
10596
10605
  const useTooltopInsteadOfLabel = !hasExpertSlot && this._hideLabel;
10597
- return (hAsync(Host, { key: '8cdf8d6dde998550bced4da791d8c9c5ea31ab2e', class: clsx('kol-input', this.getModifierClassNameByMsgType(), {
10606
+ return (hAsync(Host, { key: 'd0ceb4dd9cb440870fec781c26b3c35a0db7cf3c', class: clsx('kol-input', this.getModifierClassNameByMsgType(showMsg), {
10598
10607
  disabled: this._disabled === true,
10599
- error: hasError === true,
10608
+ [((_c = this._msg) === null || _c === void 0 ? void 0 : _c._type) || 'error']: showMsg === true,
10600
10609
  'read-only': this._readOnly === true,
10601
10610
  required: this._required === true,
10602
10611
  touched: this._touched === true,
10603
10612
  'hidden-error': this._hideError === true,
10604
- }) }, hAsync("label", { key: 'ace5b68eef432c2a34db70ac234b4488297702b2', class: "input-label", id: !useTooltopInsteadOfLabel ? `${this._id}-label` : undefined, hidden: useTooltopInsteadOfLabel, htmlFor: this._id }, hAsync("span", { key: 'cf0cb4d88144b324cb61134ffd26bc3f7da64c46', class: "input-label-span" }, hAsync("slot", { key: 'adce45da91af4963c7b5b00b4471ab29e4cf857b', name: "label" }))), hasHint && (hAsync("span", { key: 'a6fe31328a8ae31bcd132d13e527c27afc52f95c', class: "hint", id: `${this._id}-hint` }, this._hint)), hAsync("div", { key: 'c25ad4e10b70d33a9f3be5e06bcefbacb3046d93', class: {
10613
+ }) }, hAsync("label", { key: 'c67cf862ec7499d87c7a2b5c3e098f2d56e1ddc2', class: "input-label", id: !useTooltopInsteadOfLabel ? `${this._id}-label` : undefined, hidden: useTooltopInsteadOfLabel, htmlFor: this._id }, hAsync("span", { key: 'ef979abf10372861c4253fdf8239fa50a8f71c34', class: "input-label-span" }, hAsync("slot", { key: '6b71f8bc1cc97c5659a721f0ca5d010bf83e9958', name: "label" }))), hasHint && (hAsync("span", { key: '26259043769d50abb4242ef5b3282f754c363a23', class: "hint", id: `${this._id}-hint` }, this._hint)), hAsync("div", { key: '69473768e9570bb3673cf2a682226d6aa099ab8b', class: {
10605
10614
  input: true,
10606
- 'icon-left': typeof ((_e = this._icons) === null || _e === void 0 ? void 0 : _e.left) === 'object',
10607
- 'icon-right': typeof ((_f = this._icons) === null || _f === void 0 ? void 0 : _f.right) === 'object',
10608
- } }, ((_g = this._icons) === null || _g === void 0 ? void 0 : _g.left) && (hAsync(KolIconTag, { key: '1ebc24cdf54e0af6924e53ebd89530b7dce7b390', _label: "", _icons: ((_h = this._icons) === null || _h === void 0 ? void 0 : _h.left).icon, style: this.getIconStyles((_j = this._icons) === null || _j === void 0 ? void 0 : _j.left) })), hAsync("div", { key: 'a51050e6ee364e70ec8c0a2008c5696469ef0dcc', ref: this.catchInputSlot, id: this.slotName, class: "input-slot" }), typeof this._smartButton === 'object' && this._smartButton !== null && (hAsync(KolButtonWcTag, { key: '9be371d3929093972c667445c272a08340e0d90e', _customClass: this._smartButton._customClass, _disabled: this._smartButton._disabled, _icons: this._smartButton._icons, _hideLabel: true, _id: this._smartButton._id, _label: this._smartButton._label, _on: this._smartButton._on, _tooltipAlign: this._smartButton._tooltipAlign, _variant: this._smartButton._variant })), ((_k = this._icons) === null || _k === void 0 ? void 0 : _k.right) && (hAsync(KolIconTag, { key: '6150b39bb7458fc0064a161eab5a0be1c6fad549', _label: "", _icons: ((_l = this._icons) === null || _l === void 0 ? void 0 : _l.right).icon, style: this.getIconStyles((_m = this._icons) === null || _m === void 0 ? void 0 : _m.right) }))), useTooltopInsteadOfLabel && (hAsync(KolTooltipWcTag, { key: '96ecebd94a2d45e96d169af27d96f8beb67402dd', "aria-hidden": "true", class: "input-tooltip", _badgeText: this._accessKey || this._shortKey, _align: this._tooltipAlign, _id: this._hideLabel ? `${this._id}-label` : undefined, _label: this._label })), showFormFieldMsg && hAsync(KolFormFieldMsgFc, { key: '92d8c187a118275f2fa4dea8557c7a0c5b937b8a', _alert: this._alert, _hideError: this._hideError, _msg: this._msg, _id: this._id }), Array.isArray(this._suggestions) && this._suggestions.length > 0 && (hAsync("datalist", { key: '1c4c1811fd84d6f08f4dee22f783b91fdff2894a', id: `${this._id}-list` }, this._suggestions.map((option) => (hAsync("option", { value: option }))))), this._hasCounter && (hAsync("span", { key: '1823a1dc667ec6f72019b29beba1bbb6fe1f827c', class: "counter", "aria-atomic": "true", "aria-live": "polite", "data-testid": "input-counter" }, this._currentLength, this._maxLength && (hAsync(Fragment, null, hAsync("span", { key: 'fcc12beb596bdf86c0ecc507899685218c697775', "aria-label": translate('kol-of'), role: "img" }, "/"), this._maxLength)), ' ', hAsync("span", { key: 'eaaf2c17470681dc799b74f5eaebbe2496564c0e' }, translate('kol-characters'))))));
10615
+ 'icon-left': typeof ((_d = this._icons) === null || _d === void 0 ? void 0 : _d.left) === 'object',
10616
+ 'icon-right': typeof ((_e = this._icons) === null || _e === void 0 ? void 0 : _e.right) === 'object',
10617
+ } }, ((_f = this._icons) === null || _f === void 0 ? void 0 : _f.left) && (hAsync(KolIconTag, { key: 'c6651727cbd0c84a7120b4f38096e4629461582b', _label: "", _icons: ((_g = this._icons) === null || _g === void 0 ? void 0 : _g.left).icon, style: this.getIconStyles((_h = this._icons) === null || _h === void 0 ? void 0 : _h.left) })), hAsync("div", { key: '7a45832f515f4a7402ded242916b638a973b4363', ref: this.catchInputSlot, id: this.slotName, class: "input-slot" }), typeof this._smartButton === 'object' && this._smartButton !== null && (hAsync(KolButtonWcTag, { key: 'b009c381aa4d445c531765b852befc836a369b32', _customClass: this._smartButton._customClass, _disabled: this._smartButton._disabled, _icons: this._smartButton._icons, _hideLabel: true, _id: this._smartButton._id, _label: this._smartButton._label, _on: this._smartButton._on, _tooltipAlign: this._smartButton._tooltipAlign, _variant: this._smartButton._variant })), ((_j = this._icons) === null || _j === void 0 ? void 0 : _j.right) && (hAsync(KolIconTag, { key: '0d8ea29a271f1bf2dde15cc0b38586d83554e2a1', _label: "", _icons: ((_k = this._icons) === null || _k === void 0 ? void 0 : _k.right).icon, style: this.getIconStyles((_l = this._icons) === null || _l === void 0 ? void 0 : _l.right) }))), useTooltopInsteadOfLabel && (hAsync(KolTooltipWcTag, { key: '4bab14b17ab7f1b4ea031436eabf76f25f609186', "aria-hidden": "true", class: "input-tooltip", _badgeText: this._accessKey || this._shortKey, _align: this._tooltipAlign, _id: this._hideLabel ? `${this._id}-label` : undefined, _label: this._label })), showMsg && hAsync(KolFormFieldMsgFc, { key: '7225565e2026885136416d4c8a7d488ce628da1d', _alert: this._alert, _hideError: this._hideError, _msg: this._msg, _id: this._id }), Array.isArray(this._suggestions) && this._suggestions.length > 0 && (hAsync("datalist", { key: 'c16300512396ecfba9139293f6b05cb9788f90cd', id: `${this._id}-list` }, this._suggestions.map((option) => (hAsync("option", { value: option }))))), this._hasCounter && (hAsync("span", { key: '22826946e07709619c37cc24a8fdd573db2fb359', class: "counter", "aria-atomic": "true", "aria-live": "polite", "data-testid": "input-counter" }, this._currentLength, this._maxLength && (hAsync(Fragment, null, hAsync("span", { key: 'ba72b0ee76ca6736505a8478d232646bfa88828f', "aria-label": translate('kol-of'), role: "img" }, "/"), this._maxLength)), ' ', hAsync("span", { key: '6fd9fd3ff27b29233517bfc9e84ef6656093dc36' }, translate('kol-characters'))))));
10609
10618
  }
10610
- getModifierClassNameByMsgType() {
10619
+ getModifierClassNameByMsgType(showMsg) {
10611
10620
  var _a, _b;
10612
- if ((_a = this._msg) === null || _a === void 0 ? void 0 : _a._type) {
10621
+ if (showMsg && ((_a = this._msg) === null || _a === void 0 ? void 0 : _a._type)) {
10613
10622
  return {
10614
10623
  default: 'msg-type-default',
10615
10624
  info: 'msg-type-info',
@@ -13522,6 +13531,31 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
13522
13531
  });
13523
13532
  }
13524
13533
 
13534
+ // If <html> has a CSS width greater than the viewport, then this will be
13535
+ // incorrect for RTL.
13536
+ function getWindowScrollBarX(element, rect) {
13537
+ const leftScroll = getNodeScroll(element).scrollLeft;
13538
+ if (!rect) {
13539
+ return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
13540
+ }
13541
+ return rect.left + leftScroll;
13542
+ }
13543
+
13544
+ function getHTMLOffset(documentElement, scroll, ignoreScrollbarX) {
13545
+ if (ignoreScrollbarX === void 0) {
13546
+ ignoreScrollbarX = false;
13547
+ }
13548
+ const htmlRect = documentElement.getBoundingClientRect();
13549
+ const x = htmlRect.left + scroll.scrollLeft - (ignoreScrollbarX ? 0 :
13550
+ // RTL <body> scrollbar.
13551
+ getWindowScrollBarX(documentElement, htmlRect));
13552
+ const y = htmlRect.top + scroll.scrollTop;
13553
+ return {
13554
+ x,
13555
+ y
13556
+ };
13557
+ }
13558
+
13525
13559
  function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
13526
13560
  let {
13527
13561
  elements,
@@ -13553,11 +13587,12 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
13553
13587
  offsets.y = offsetRect.y + offsetParent.clientTop;
13554
13588
  }
13555
13589
  }
13590
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll, true) : createCoords(0);
13556
13591
  return {
13557
13592
  width: rect.width * scale.x,
13558
13593
  height: rect.height * scale.y,
13559
- x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
13560
- y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
13594
+ x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
13595
+ y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
13561
13596
  };
13562
13597
  }
13563
13598
 
@@ -13565,16 +13600,6 @@ function getClientRects(element) {
13565
13600
  return Array.from(element.getClientRects());
13566
13601
  }
13567
13602
 
13568
- // If <html> has a CSS width greater than the viewport, then this will be
13569
- // incorrect for RTL.
13570
- function getWindowScrollBarX(element, rect) {
13571
- const leftScroll = getNodeScroll(element).scrollLeft;
13572
- if (!rect) {
13573
- return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
13574
- }
13575
- return rect.left + leftScroll;
13576
- }
13577
-
13578
13603
  // Gets the entire size of the scrollable document area, even extending outside
13579
13604
  // of the `<html>` and `<body>` rect bounds if horizontally scrollable.
13580
13605
  function getDocumentRect(element) {
@@ -13649,9 +13674,10 @@ function getClientRectFromClippingAncestor(element, clippingAncestor, strategy)
13649
13674
  } else {
13650
13675
  const visualOffsets = getVisualOffsets(element);
13651
13676
  rect = {
13652
- ...clippingAncestor,
13653
13677
  x: clippingAncestor.x - visualOffsets.x,
13654
- y: clippingAncestor.y - visualOffsets.y
13678
+ y: clippingAncestor.y - visualOffsets.y,
13679
+ width: clippingAncestor.width,
13680
+ height: clippingAncestor.height
13655
13681
  };
13656
13682
  }
13657
13683
  return rectToClientRect(rect);
@@ -13761,17 +13787,9 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
13761
13787
  offsets.x = getWindowScrollBarX(documentElement);
13762
13788
  }
13763
13789
  }
13764
- let htmlX = 0;
13765
- let htmlY = 0;
13766
- if (documentElement && !isOffsetParentAnElement && !isFixed) {
13767
- const htmlRect = documentElement.getBoundingClientRect();
13768
- htmlY = htmlRect.top + scroll.scrollTop;
13769
- htmlX = htmlRect.left + scroll.scrollLeft -
13770
- // RTL <body> scrollbar.
13771
- getWindowScrollBarX(documentElement, htmlRect);
13772
- }
13773
- const x = rect.left + scroll.scrollLeft - offsets.x - htmlX;
13774
- const y = rect.top + scroll.scrollTop - offsets.y - htmlY;
13790
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
13791
+ const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
13792
+ const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
13775
13793
  return {
13776
13794
  x,
13777
13795
  y,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@public-ui/hydrate",
3
- "version": "2.2.0",
3
+ "version": "2.2.1-3f35a0e390fee7a875eaf8922b28ac560293ae59.0",
4
4
  "license": "EUPL-1.2",
5
5
  "homepage": "https://public-ui.github.io",
6
6
  "repository": {
@@ -46,10 +46,10 @@
46
46
  ],
47
47
  "devDependencies": {
48
48
  "rimraf": "6.0.1",
49
- "@public-ui/components": "2.2.0"
49
+ "@public-ui/components": "2.2.1-3f35a0e390fee7a875eaf8922b28ac560293ae59.0"
50
50
  },
51
51
  "peerDependencies": {
52
- "@public-ui/components": "2.2.0"
52
+ "@public-ui/components": "2.2.1-3f35a0e390fee7a875eaf8922b28ac560293ae59.0"
53
53
  },
54
54
  "sideEffects": false,
55
55
  "type": "commonjs",