@kodaris/krubble-app-components 1.0.69 → 1.0.71

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.
@@ -9,39 +9,39 @@
9
9
  * Copyright 2019 Google LLC
10
10
  * SPDX-License-Identifier: BSD-3-Clause
11
11
  */
12
- const t$3=globalThis,e$7=t$3.ShadowRoot&&(void 0===t$3.ShadyCSS||t$3.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$2=Symbol(),o$5=new WeakMap;let n$3 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s$2)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$7&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$5.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$5.set(s,t));}return t}toString(){return this.cssText}};const r$4=t=>new n$3("string"==typeof t?t:t+"",void 0,s$2),i$4=(t,...e)=>{const o=1===t.length?t[0]:e.reduce((e,s,o)=>e+(t=>{if(true===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1],t[0]);return new n$3(o,t,s$2)},S$1=(s,o)=>{if(e$7)s.adoptedStyleSheets=o.map(t=>t instanceof CSSStyleSheet?t:t.styleSheet);else for(const e of o){const o=document.createElement("style"),n=t$3.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$2=e$7?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$4(e)})(t):t;
12
+ const t$4=globalThis,e$7=t$4.ShadowRoot&&(void 0===t$4.ShadyCSS||t$4.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$3=Symbol(),o$5=new WeakMap;let n$3 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s$3)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$7&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$5.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$5.set(s,t));}return t}toString(){return this.cssText}};const r$4=t=>new n$3("string"==typeof t?t:t+"",void 0,s$3),i$5=(t,...e)=>{const o=1===t.length?t[0]:e.reduce((e,s,o)=>e+(t=>{if(true===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1],t[0]);return new n$3(o,t,s$3)},S$1=(s,o)=>{if(e$7)s.adoptedStyleSheets=o.map(t=>t instanceof CSSStyleSheet?t:t.styleSheet);else for(const e of o){const o=document.createElement("style"),n=t$4.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$3=e$7?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$4(e)})(t):t;
13
13
 
14
14
  /**
15
15
  * @license
16
16
  * Copyright 2017 Google LLC
17
17
  * SPDX-License-Identifier: BSD-3-Clause
18
- */const{is:i$3,defineProperty:e$6,getOwnPropertyDescriptor:h$1,getOwnPropertyNames:r$3,getOwnPropertySymbols:o$4,getPrototypeOf:n$2}=Object,a$1=globalThis,c$1=a$1.trustedTypes,l$1=c$1?c$1.emptyScript:"",p$1=a$1.reactiveElementPolyfillSupport,d$1=(t,s)=>t,u$1={toAttribute(t,s){switch(s){case Boolean:t=t?l$1:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f$1=(t,s)=>!i$3(t,s),b$1={attribute:true,type:String,converter:u$1,reflect:false,useDefault:false,hasChanged:f$1};Symbol.metadata??=Symbol("metadata"),a$1.litPropertyMetadata??=new WeakMap;let y$1 = class y extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=b$1){if(s.state&&(s.attribute=false),this._$Ei(),this.prototype.hasOwnProperty(t)&&((s=Object.create(s)).wrapped=true),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),h=this.getPropertyDescriptor(t,i,s);void 0!==h&&e$6(this.prototype,t,h);}}static getPropertyDescriptor(t,s,i){const{get:e,set:r}=h$1(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get:e,set(s){const h=e?.call(this);r?.call(this,s),this.requestUpdate(t,h,i);},configurable:true,enumerable:true}}static getPropertyOptions(t){return this.elementProperties.get(t)??b$1}static _$Ei(){if(this.hasOwnProperty(d$1("elementProperties")))return;const t=n$2(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$1("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d$1("properties"))){const t=this.properties,s=[...r$3(t),...o$4(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);void 0!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$2(s));}else void 0!==s&&i.push(c$2(s));return i}static _$Eu(t,s){const i=s.attribute;return false===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=false,this.hasUpdated=false,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise(t=>this.enableUpdating=t),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(t=>t(this));}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S$1(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(true),this._$EO?.forEach(t=>t.hostConnected?.());}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach(t=>t.hostDisconnected?.());}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$ET(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&true===i.reflect){const h=(void 0!==i.converter?.toAttribute?i.converter:u$1).toAttribute(s,i.type);this._$Em=t,null==h?this.removeAttribute(e):this.setAttribute(e,h),this._$Em=null;}}_$AK(t,s){const i=this.constructor,e=i._$Eh.get(t);if(void 0!==e&&this._$Em!==e){const t=i.getPropertyOptions(e),h="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:u$1;this._$Em=e;const r=h.fromAttribute(s,t.type);this[e]=r??this._$Ej?.get(e)??r,this._$Em=null;}}requestUpdate(t,s,i,e=false,h){if(void 0!==t){const r=this.constructor;if(false===e&&(h=this[t]),i??=r.getPropertyOptions(t),!((i.hasChanged??f$1)(h,s)||i.useDefault&&i.reflect&&h===this._$Ej?.get(t)&&!this.hasAttribute(r._$Eu(t,i))))return;this.C(t,s,i);} false===this.isUpdatePending&&(this._$ES=this._$EP());}C(t,s,{useDefault:i,reflect:e,wrapped:h},r){i&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,r??s??this[t]),true!==h||void 0!==r)||(this._$AL.has(t)||(this.hasUpdated||i||(s=void 0),this._$AL.set(t,s)),true===e&&this._$Em!==t&&(this._$Eq??=new Set).add(t));}async _$EP(){this.isUpdatePending=true;try{await this._$ES;}catch(t){Promise.reject(t);}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,s]of this._$Ep)this[t]=s;this._$Ep=void 0;}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t){const{wrapped:t}=i,e=this[s];true!==t||this._$AL.has(s)||void 0===e||this.C(s,void 0,i,e);}}let t=false;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach(t=>t.hostUpdate?.()),this.update(s)):this._$EM();}catch(s){throw t=false,this._$EM(),s}t&&this._$AE(s);}willUpdate(t){}_$AE(t){this._$EO?.forEach(t=>t.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=true,this.firstUpdated(t)),this.updated(t);}_$EM(){this._$AL=new Map,this.isUpdatePending=false;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return true}update(t){this._$Eq&&=this._$Eq.forEach(t=>this._$ET(t,this[t])),this._$EM();}updated(t){}firstUpdated(t){}};y$1.elementStyles=[],y$1.shadowRootOptions={mode:"open"},y$1[d$1("elementProperties")]=new Map,y$1[d$1("finalized")]=new Map,p$1?.({ReactiveElement:y$1}),(a$1.reactiveElementVersions??=[]).push("2.1.2");
18
+ */const{is:i$4,defineProperty:e$6,getOwnPropertyDescriptor:h$2,getOwnPropertyNames:r$3,getOwnPropertySymbols:o$4,getPrototypeOf:n$2}=Object,a$1=globalThis,c$2=a$1.trustedTypes,l$1=c$2?c$2.emptyScript:"",p$2=a$1.reactiveElementPolyfillSupport,d$1=(t,s)=>t,u$3={toAttribute(t,s){switch(s){case Boolean:t=t?l$1:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f$1=(t,s)=>!i$4(t,s),b$1={attribute:true,type:String,converter:u$3,reflect:false,useDefault:false,hasChanged:f$1};Symbol.metadata??=Symbol("metadata"),a$1.litPropertyMetadata??=new WeakMap;let y$1 = class y extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=b$1){if(s.state&&(s.attribute=false),this._$Ei(),this.prototype.hasOwnProperty(t)&&((s=Object.create(s)).wrapped=true),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),h=this.getPropertyDescriptor(t,i,s);void 0!==h&&e$6(this.prototype,t,h);}}static getPropertyDescriptor(t,s,i){const{get:e,set:r}=h$2(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get:e,set(s){const h=e?.call(this);r?.call(this,s),this.requestUpdate(t,h,i);},configurable:true,enumerable:true}}static getPropertyOptions(t){return this.elementProperties.get(t)??b$1}static _$Ei(){if(this.hasOwnProperty(d$1("elementProperties")))return;const t=n$2(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$1("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d$1("properties"))){const t=this.properties,s=[...r$3(t),...o$4(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);void 0!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$3(s));}else void 0!==s&&i.push(c$3(s));return i}static _$Eu(t,s){const i=s.attribute;return false===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=false,this.hasUpdated=false,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise(t=>this.enableUpdating=t),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(t=>t(this));}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S$1(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(true),this._$EO?.forEach(t=>t.hostConnected?.());}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach(t=>t.hostDisconnected?.());}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$ET(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&true===i.reflect){const h=(void 0!==i.converter?.toAttribute?i.converter:u$3).toAttribute(s,i.type);this._$Em=t,null==h?this.removeAttribute(e):this.setAttribute(e,h),this._$Em=null;}}_$AK(t,s){const i=this.constructor,e=i._$Eh.get(t);if(void 0!==e&&this._$Em!==e){const t=i.getPropertyOptions(e),h="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:u$3;this._$Em=e;const r=h.fromAttribute(s,t.type);this[e]=r??this._$Ej?.get(e)??r,this._$Em=null;}}requestUpdate(t,s,i,e=false,h){if(void 0!==t){const r=this.constructor;if(false===e&&(h=this[t]),i??=r.getPropertyOptions(t),!((i.hasChanged??f$1)(h,s)||i.useDefault&&i.reflect&&h===this._$Ej?.get(t)&&!this.hasAttribute(r._$Eu(t,i))))return;this.C(t,s,i);} false===this.isUpdatePending&&(this._$ES=this._$EP());}C(t,s,{useDefault:i,reflect:e,wrapped:h},r){i&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,r??s??this[t]),true!==h||void 0!==r)||(this._$AL.has(t)||(this.hasUpdated||i||(s=void 0),this._$AL.set(t,s)),true===e&&this._$Em!==t&&(this._$Eq??=new Set).add(t));}async _$EP(){this.isUpdatePending=true;try{await this._$ES;}catch(t){Promise.reject(t);}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,s]of this._$Ep)this[t]=s;this._$Ep=void 0;}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t){const{wrapped:t}=i,e=this[s];true!==t||this._$AL.has(s)||void 0===e||this.C(s,void 0,i,e);}}let t=false;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach(t=>t.hostUpdate?.()),this.update(s)):this._$EM();}catch(s){throw t=false,this._$EM(),s}t&&this._$AE(s);}willUpdate(t){}_$AE(t){this._$EO?.forEach(t=>t.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=true,this.firstUpdated(t)),this.updated(t);}_$EM(){this._$AL=new Map,this.isUpdatePending=false;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return true}update(t){this._$Eq&&=this._$Eq.forEach(t=>this._$ET(t,this[t])),this._$EM();}updated(t){}firstUpdated(t){}};y$1.elementStyles=[],y$1.shadowRootOptions={mode:"open"},y$1[d$1("elementProperties")]=new Map,y$1[d$1("finalized")]=new Map,p$2?.({ReactiveElement:y$1}),(a$1.reactiveElementVersions??=[]).push("2.1.2");
19
19
 
20
20
  /**
21
21
  * @license
22
22
  * Copyright 2017 Google LLC
23
23
  * SPDX-License-Identifier: BSD-3-Clause
24
24
  */
25
- const t$2=globalThis,i$2=t=>t,s$1=t$2.trustedTypes,e$5=s$1?s$1.createPolicy("lit-html",{createHTML:t=>t}):void 0,h="$lit$",o$3=`lit$${Math.random().toFixed(9).slice(2)}$`,n$1="?"+o$3,r$2=`<${n$1}>`,l=document,c=()=>l.createComment(""),a=t=>null===t||"object"!=typeof t&&"function"!=typeof t,u=Array.isArray,d=t=>u(t)||"function"==typeof t?.[Symbol.iterator],f="[ \t\n\f\r]",v=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,_=/-->/g,m=/>/g,p=RegExp(`>|${f}(?:([^\\s"'>=/]+)(${f}*=${f}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),g=/'/g,$=/"/g,y=/^(?:script|style|textarea|title)$/i,x=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),b=x(1),E=Symbol.for("lit-noChange"),A=Symbol.for("lit-nothing"),C=new WeakMap,P=l.createTreeWalker(l,129);function V(t,i){if(!u(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==e$5?e$5.createHTML(i):i}const N=(t,i)=>{const s=t.length-1,e=[];let n,l=2===i?"<svg>":3===i?"<math>":"",c=v;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,f=0;for(;f<s.length&&(c.lastIndex=f,u=c.exec(s),null!==u);)f=c.lastIndex,c===v?"!--"===u[1]?c=_:void 0!==u[1]?c=m:void 0!==u[2]?(y.test(u[2])&&(n=RegExp("</"+u[2],"g")),c=p):void 0!==u[3]&&(c=p):c===p?">"===u[0]?(c=n??v,d=-1):void 0===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=void 0===u[3]?p:'"'===u[3]?$:g):c===$||c===g?c=p:c===_||c===m?c=v:(c=p,n=void 0);const x=c===p&&t[i+1].startsWith("/>")?" ":"";l+=c===v?s+r$2:d>=0?(e.push(a),s.slice(0,d)+h+s.slice(d)+o$3+x):s+o$3+(-2===d?i:x);}return [V(t,l+(t[s]||"<?>")+(2===i?"</svg>":3===i?"</math>":"")),e]};class S{constructor({strings:t,_$litType$:i},e){let r;this.parts=[];let l=0,a=0;const u=t.length-1,d=this.parts,[f,v]=N(t,i);if(this.el=S.createElement(f,e),P.currentNode=this.el.content,2===i||3===i){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=P.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(h)){const i=v[a++],s=r.getAttribute(t).split(o$3),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:l,name:e[2],strings:s,ctor:"."===e[1]?I:"?"===e[1]?L:"@"===e[1]?z:H}),r.removeAttribute(t);}else t.startsWith(o$3)&&(d.push({type:6,index:l}),r.removeAttribute(t));if(y.test(r.tagName)){const t=r.textContent.split(o$3),i=t.length-1;if(i>0){r.textContent=s$1?s$1.emptyScript:"";for(let s=0;s<i;s++)r.append(t[s],c()),P.nextNode(),d.push({type:2,index:++l});r.append(t[i],c());}}}else if(8===r.nodeType)if(r.data===n$1)d.push({type:2,index:l});else {let t=-1;for(;-1!==(t=r.data.indexOf(o$3,t+1));)d.push({type:7,index:l}),t+=o$3.length-1;}l++;}}static createElement(t,i){const s=l.createElement("template");return s.innerHTML=t,s}}function M(t,i,s=t,e){if(i===E)return i;let h=void 0!==e?s._$Co?.[e]:s._$Cl;const o=a(i)?void 0:i._$litDirective$;return h?.constructor!==o&&(h?._$AO?.(false),void 0===o?h=void 0:(h=new o(t),h._$AT(t,s,e)),void 0!==e?(s._$Co??=[])[e]=h:s._$Cl=h),void 0!==h&&(i=M(t,h._$AS(t,i.values),h,e)),i}class R{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??l).importNode(i,true);P.currentNode=e;let h=P.nextNode(),o=0,n=0,r=s[0];for(;void 0!==r;){if(o===r.index){let i;2===r.type?i=new k(h,h.nextSibling,this,t):1===r.type?i=new r.ctor(h,r.name,r.strings,this,t):6===r.type&&(i=new Z(h,this,t)),this._$AV.push(i),r=s[++n];}o!==r?.index&&(h=P.nextNode(),o++);}return P.currentNode=l,e}p(t){let i=0;for(const s of this._$AV) void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}class k{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=A,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??true;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=M(this,t,i),a(t)?t===A||null==t||""===t?(this._$AH!==A&&this._$AR(),this._$AH=A):t!==this._$AH&&t!==E&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):d(t)?this.k(t):this._(t);}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t));}_(t){this._$AH!==A&&a(this._$AH)?this._$AA.nextSibling.data=t:this.T(l.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(void 0===s.el&&(s.el=S.createElement(V(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new R(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=C.get(t.strings);return void 0===i&&C.set(t.strings,i=new S(t)),i}k(t){u(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const h of t)e===i.length?i.push(s=new k(this.O(c()),this.O(c()),this,this.options)):s=i[e],s._$AI(h),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,s){for(this._$AP?.(false,true,s);t!==this._$AB;){const s=i$2(t).nextSibling;i$2(t).remove(),t=s;}}setConnected(t){ void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t));}}class H{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=A,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=A;}_$AI(t,i=this,s,e){const h=this.strings;let o=false;if(void 0===h)t=M(this,t,i,0),o=!a(t)||t!==this._$AH&&t!==E,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=M(this,e[s+n],i,n),r===E&&(r=this._$AH[n]),o||=!a(r)||r!==this._$AH[n],r===A?t=A:t!==A&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===A?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class I extends H{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===A?void 0:t;}}class L extends H{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==A);}}class z extends H{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=M(this,t,i,0)??A)===E)return;const s=this._$AH,e=t===A&&s!==A||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==A&&(s===A||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}}class Z{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){M(this,t);}}const B=t$2.litHtmlPolyfillSupport;B?.(S,k),(t$2.litHtmlVersions??=[]).push("3.3.2");const D=(t,i,s)=>{const e=s?.renderBefore??i;let h=e._$litPart$;if(void 0===h){const t=s?.renderBefore??null;e._$litPart$=h=new k(i.insertBefore(c(),t),t,void 0,s??{});}return h._$AI(t),h};
25
+ const t$3=globalThis,i$3=t=>t,s$2=t$3.trustedTypes,e$5=s$2?s$2.createPolicy("lit-html",{createHTML:t=>t}):void 0,h$1="$lit$",o$3=`lit$${Math.random().toFixed(9).slice(2)}$`,n$1="?"+o$3,r$2=`<${n$1}>`,l=document,c$1=()=>l.createComment(""),a=t=>null===t||"object"!=typeof t&&"function"!=typeof t,u$2=Array.isArray,d=t=>u$2(t)||"function"==typeof t?.[Symbol.iterator],f="[ \t\n\f\r]",v$1=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,_=/-->/g,m$1=/>/g,p$1=RegExp(`>|${f}(?:([^\\s"'>=/]+)(${f}*=${f}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),g=/'/g,$=/"/g,y=/^(?:script|style|textarea|title)$/i,x=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),b=x(1),E=Symbol.for("lit-noChange"),A=Symbol.for("lit-nothing"),C=new WeakMap,P=l.createTreeWalker(l,129);function V(t,i){if(!u$2(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==e$5?e$5.createHTML(i):i}const N=(t,i)=>{const s=t.length-1,e=[];let n,l=2===i?"<svg>":3===i?"<math>":"",c=v$1;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,f=0;for(;f<s.length&&(c.lastIndex=f,u=c.exec(s),null!==u);)f=c.lastIndex,c===v$1?"!--"===u[1]?c=_:void 0!==u[1]?c=m$1:void 0!==u[2]?(y.test(u[2])&&(n=RegExp("</"+u[2],"g")),c=p$1):void 0!==u[3]&&(c=p$1):c===p$1?">"===u[0]?(c=n??v$1,d=-1):void 0===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=void 0===u[3]?p$1:'"'===u[3]?$:g):c===$||c===g?c=p$1:c===_||c===m$1?c=v$1:(c=p$1,n=void 0);const x=c===p$1&&t[i+1].startsWith("/>")?" ":"";l+=c===v$1?s+r$2:d>=0?(e.push(a),s.slice(0,d)+h$1+s.slice(d)+o$3+x):s+o$3+(-2===d?i:x);}return [V(t,l+(t[s]||"<?>")+(2===i?"</svg>":3===i?"</math>":"")),e]};class S{constructor({strings:t,_$litType$:i},e){let r;this.parts=[];let l=0,a=0;const u=t.length-1,d=this.parts,[f,v]=N(t,i);if(this.el=S.createElement(f,e),P.currentNode=this.el.content,2===i||3===i){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=P.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(h$1)){const i=v[a++],s=r.getAttribute(t).split(o$3),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:l,name:e[2],strings:s,ctor:"."===e[1]?I:"?"===e[1]?L:"@"===e[1]?z:H}),r.removeAttribute(t);}else t.startsWith(o$3)&&(d.push({type:6,index:l}),r.removeAttribute(t));if(y.test(r.tagName)){const t=r.textContent.split(o$3),i=t.length-1;if(i>0){r.textContent=s$2?s$2.emptyScript:"";for(let s=0;s<i;s++)r.append(t[s],c$1()),P.nextNode(),d.push({type:2,index:++l});r.append(t[i],c$1());}}}else if(8===r.nodeType)if(r.data===n$1)d.push({type:2,index:l});else {let t=-1;for(;-1!==(t=r.data.indexOf(o$3,t+1));)d.push({type:7,index:l}),t+=o$3.length-1;}l++;}}static createElement(t,i){const s=l.createElement("template");return s.innerHTML=t,s}}function M$1(t,i,s=t,e){if(i===E)return i;let h=void 0!==e?s._$Co?.[e]:s._$Cl;const o=a(i)?void 0:i._$litDirective$;return h?.constructor!==o&&(h?._$AO?.(false),void 0===o?h=void 0:(h=new o(t),h._$AT(t,s,e)),void 0!==e?(s._$Co??=[])[e]=h:s._$Cl=h),void 0!==h&&(i=M$1(t,h._$AS(t,i.values),h,e)),i}class R{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??l).importNode(i,true);P.currentNode=e;let h=P.nextNode(),o=0,n=0,r=s[0];for(;void 0!==r;){if(o===r.index){let i;2===r.type?i=new k(h,h.nextSibling,this,t):1===r.type?i=new r.ctor(h,r.name,r.strings,this,t):6===r.type&&(i=new Z(h,this,t)),this._$AV.push(i),r=s[++n];}o!==r?.index&&(h=P.nextNode(),o++);}return P.currentNode=l,e}p(t){let i=0;for(const s of this._$AV) void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}class k{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=A,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??true;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=M$1(this,t,i),a(t)?t===A||null==t||""===t?(this._$AH!==A&&this._$AR(),this._$AH=A):t!==this._$AH&&t!==E&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):d(t)?this.k(t):this._(t);}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t));}_(t){this._$AH!==A&&a(this._$AH)?this._$AA.nextSibling.data=t:this.T(l.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(void 0===s.el&&(s.el=S.createElement(V(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new R(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=C.get(t.strings);return void 0===i&&C.set(t.strings,i=new S(t)),i}k(t){u$2(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const h of t)e===i.length?i.push(s=new k(this.O(c$1()),this.O(c$1()),this,this.options)):s=i[e],s._$AI(h),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,s){for(this._$AP?.(false,true,s);t!==this._$AB;){const s=i$3(t).nextSibling;i$3(t).remove(),t=s;}}setConnected(t){ void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t));}}class H{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=A,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=A;}_$AI(t,i=this,s,e){const h=this.strings;let o=false;if(void 0===h)t=M$1(this,t,i,0),o=!a(t)||t!==this._$AH&&t!==E,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=M$1(this,e[s+n],i,n),r===E&&(r=this._$AH[n]),o||=!a(r)||r!==this._$AH[n],r===A?t=A:t!==A&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===A?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class I extends H{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===A?void 0:t;}}class L extends H{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==A);}}class z extends H{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=M$1(this,t,i,0)??A)===E)return;const s=this._$AH,e=t===A&&s!==A||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==A&&(s===A||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}}class Z{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){M$1(this,t);}}const j={I:k},B=t$3.litHtmlPolyfillSupport;B?.(S,k),(t$3.litHtmlVersions??=[]).push("3.3.2");const D=(t,i,s)=>{const e=s?.renderBefore??i;let h=e._$litPart$;if(void 0===h){const t=s?.renderBefore??null;e._$litPart$=h=new k(i.insertBefore(c$1(),t),t,void 0,s??{});}return h._$AI(t),h};
26
26
 
27
27
  /**
28
28
  * @license
29
29
  * Copyright 2017 Google LLC
30
30
  * SPDX-License-Identifier: BSD-3-Clause
31
- */const s=globalThis;let i$1 = class i extends y$1{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0;}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const r=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=D(r,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(true);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(false);}render(){return E}};i$1._$litElement$=true,i$1["finalized"]=true,s.litElementHydrateSupport?.({LitElement:i$1});const o$2=s.litElementPolyfillSupport;o$2?.({LitElement:i$1});(s.litElementVersions??=[]).push("4.2.2");
31
+ */const s$1=globalThis;let i$2 = class i extends y$1{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0;}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const r=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=D(r,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(true);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(false);}render(){return E}};i$2._$litElement$=true,i$2["finalized"]=true,s$1.litElementHydrateSupport?.({LitElement:i$2});const o$2=s$1.litElementPolyfillSupport;o$2?.({LitElement:i$2});(s$1.litElementVersions??=[]).push("4.2.2");
32
32
 
33
33
  /**
34
34
  * @license
35
35
  * Copyright 2017 Google LLC
36
36
  * SPDX-License-Identifier: BSD-3-Clause
37
37
  */
38
- const t$1=t=>(e,o)=>{ void 0!==o?o.addInitializer(()=>{customElements.define(t,e);}):customElements.define(t,e);};
38
+ const t$2=t=>(e,o)=>{ void 0!==o?o.addInitializer(()=>{customElements.define(t,e);}):customElements.define(t,e);};
39
39
 
40
40
  /**
41
41
  * @license
42
42
  * Copyright 2017 Google LLC
43
43
  * SPDX-License-Identifier: BSD-3-Clause
44
- */const o$1={attribute:true,type:String,converter:u$1,reflect:false,hasChanged:f$1},r$1=(t=o$1,e,r)=>{const{kind:n,metadata:i}=r;let s=globalThis.litPropertyMetadata.get(i);if(void 0===s&&globalThis.litPropertyMetadata.set(i,s=new Map),"setter"===n&&((t=Object.create(t)).wrapped=true),s.set(r.name,t),"accessor"===n){const{name:o}=r;return {set(r){const n=e.get.call(this);e.set.call(this,r),this.requestUpdate(o,n,t,true,r);},init(e){return void 0!==e&&this.C(o,void 0,t,e),e}}}if("setter"===n){const{name:o}=r;return function(r){const n=this[o];e.call(this,r),this.requestUpdate(o,n,t,true,r);}}throw Error("Unsupported decorator location: "+n)};function n(t){return (e,o)=>"object"==typeof o?r$1(t,e,o):((t,e,o)=>{const r=e.hasOwnProperty(o);return e.constructor.createProperty(o,t),r?Object.getOwnPropertyDescriptor(e,o):void 0})(t,e,o)}
44
+ */const o$1={attribute:true,type:String,converter:u$3,reflect:false,hasChanged:f$1},r$1=(t=o$1,e,r)=>{const{kind:n,metadata:i}=r;let s=globalThis.litPropertyMetadata.get(i);if(void 0===s&&globalThis.litPropertyMetadata.set(i,s=new Map),"setter"===n&&((t=Object.create(t)).wrapped=true),s.set(r.name,t),"accessor"===n){const{name:o}=r;return {set(r){const n=e.get.call(this);e.set.call(this,r),this.requestUpdate(o,n,t,true,r);},init(e){return void 0!==e&&this.C(o,void 0,t,e),e}}}if("setter"===n){const{name:o}=r;return function(r){const n=this[o];e.call(this,r),this.requestUpdate(o,n,t,true,r);}}throw Error("Unsupported decorator location: "+n)};function n(t){return (e,o)=>"object"==typeof o?r$1(t,e,o):((t,e,o)=>{const r=e.hasOwnProperty(o);return e.constructor.createProperty(o,t),r?Object.getOwnPropertyDescriptor(e,o):void 0})(t,e,o)}
45
45
 
46
46
  /**
47
47
  * @license
@@ -67,19 +67,19 @@
67
67
  * Copyright 2017 Google LLC
68
68
  * SPDX-License-Identifier: BSD-3-Clause
69
69
  */
70
- const t={ATTRIBUTE:1,CHILD:2},e$2=t=>(...e)=>({_$litDirective$:t,values:e});class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i;}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}
70
+ const t$1={ATTRIBUTE:1,CHILD:2},e$2=t=>(...e)=>({_$litDirective$:t,values:e});let i$1 = class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i;}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}};
71
71
 
72
72
  /**
73
73
  * @license
74
74
  * Copyright 2017 Google LLC
75
75
  * SPDX-License-Identifier: BSD-3-Clause
76
- */let e$1 = class e extends i{constructor(i){if(super(i),this.it=A,i.type!==t.CHILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(r){if(r===A||null==r)return this._t=void 0,this.it=r;if(r===E)return r;if("string"!=typeof r)throw Error(this.constructor.directiveName+"() called with a non-string value");if(r===this.it)return this._t;this.it=r;const s=[r];return s.raw=s,this._t={_$litType$:this.constructor.resultType,strings:s,values:[]}}};e$1.directiveName="unsafeHTML",e$1.resultType=1;const o=e$2(e$1);
76
+ */let e$1 = class e extends i$1{constructor(i){if(super(i),this.it=A,i.type!==t$1.CHILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(r){if(r===A||null==r)return this._t=void 0,this.it=r;if(r===E)return r;if("string"!=typeof r)throw Error(this.constructor.directiveName+"() called with a non-string value");if(r===this.it)return this._t;this.it=r;const s=[r];return s.raw=s,this._t={_$litType$:this.constructor.resultType,strings:s,values:[]}}};e$1.directiveName="unsafeHTML",e$1.resultType=1;const o=e$2(e$1);
77
77
 
78
78
  /**
79
79
  * @license
80
80
  * Copyright 2018 Google LLC
81
81
  * SPDX-License-Identifier: BSD-3-Clause
82
- */const e=e$2(class extends i{constructor(t$1){if(super(t$1),t$1.type!==t.ATTRIBUTE||"class"!==t$1.name||t$1.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter(s=>t[s]).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter(t=>""!==t)));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return E}});
82
+ */const e=e$2(class extends i$1{constructor(t){if(super(t),t.type!==t$1.ATTRIBUTE||"class"!==t.name||t.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter(s=>t[s]).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter(t=>""!==t)));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return E}});
83
83
 
84
84
  var __decorate$6 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
85
85
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -87,7 +87,7 @@
87
87
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
88
88
  return c > 3 && r && Object.defineProperty(target, key, r), r;
89
89
  };
90
- let KRNavItemEdit = class KRNavItemEdit extends i$1 {
90
+ let KRNavItemEdit = class KRNavItemEdit extends i$2 {
91
91
  constructor() {
92
92
  super(...arguments);
93
93
  this.label = '';
@@ -191,7 +191,7 @@
191
191
  `;
192
192
  }
193
193
  };
194
- KRNavItemEdit.styles = i$4 `
194
+ KRNavItemEdit.styles = i$5 `
195
195
  :host {
196
196
  display: block;
197
197
  width: 360px;
@@ -290,7 +290,7 @@
290
290
  r()
291
291
  ], KRNavItemEdit.prototype, "active", void 0);
292
292
  KRNavItemEdit = __decorate$6([
293
- t$1('kr-nav-item-edit')
293
+ t$2('kr-nav-item-edit')
294
294
  ], KRNavItemEdit);
295
295
 
296
296
  var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -352,7 +352,7 @@
352
352
  * - Don't hardcode breadcrumbs
353
353
  * - Look at renderNormalFooter and renderEditFooter and see if that is what we want to do
354
354
  */
355
- exports.Scaffold = class KRScaffold extends i$1 {
355
+ exports.Scaffold = class KRScaffold extends i$2 {
356
356
  constructor() {
357
357
  super();
358
358
  /**
@@ -1516,7 +1516,7 @@
1516
1516
  `;
1517
1517
  }
1518
1518
  };
1519
- exports.Scaffold.styles = i$4 `
1519
+ exports.Scaffold.styles = i$5 `
1520
1520
  :host {
1521
1521
  display: flex;
1522
1522
  flex-direction: column;
@@ -2334,7 +2334,7 @@
2334
2334
  r()
2335
2335
  ], exports.Scaffold.prototype, "pendingRequests", void 0);
2336
2336
  exports.Scaffold = __decorate$5([
2337
- t$1('kr-scaffold')
2337
+ t$2('kr-scaffold')
2338
2338
  ], exports.Scaffold);
2339
2339
 
2340
2340
  var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -2371,7 +2371,7 @@
2371
2371
  * @property {KRScreenNavItem[]} items - Navigation items as JSON array
2372
2372
  * @property {string} activeId - Currently active item ID
2373
2373
  */
2374
- exports.ScreenNav = class KRScreenNav extends i$1 {
2374
+ exports.ScreenNav = class KRScreenNav extends i$2 {
2375
2375
  constructor() {
2376
2376
  super(...arguments);
2377
2377
  /**
@@ -2487,7 +2487,7 @@
2487
2487
  `;
2488
2488
  }
2489
2489
  };
2490
- exports.ScreenNav.styles = i$4 `
2490
+ exports.ScreenNav.styles = i$5 `
2491
2491
  :host {
2492
2492
  display: flex;
2493
2493
  height: 100%;
@@ -2592,7 +2592,7 @@
2592
2592
  n({ type: String })
2593
2593
  ], exports.ScreenNav.prototype, "activeId", void 0);
2594
2594
  exports.ScreenNav = __decorate$4([
2595
- t$1('kr-screen-nav')
2595
+ t$2('kr-screen-nav')
2596
2596
  ], exports.ScreenNav);
2597
2597
 
2598
2598
  var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -2620,7 +2620,7 @@
2620
2620
  *
2621
2621
  * @property {string} title - Section title (e.g., "Company Details")
2622
2622
  */
2623
- exports.ScreenDetail = class KRScreenDetail extends i$1 {
2623
+ exports.ScreenDetail = class KRScreenDetail extends i$2 {
2624
2624
  constructor() {
2625
2625
  super(...arguments);
2626
2626
  /**
@@ -2644,7 +2644,7 @@
2644
2644
  `;
2645
2645
  }
2646
2646
  };
2647
- exports.ScreenDetail.styles = i$4 `
2647
+ exports.ScreenDetail.styles = i$5 `
2648
2648
  :host {
2649
2649
  display: flex;
2650
2650
  flex-direction: column;
@@ -2693,7 +2693,7 @@
2693
2693
  n({ type: String })
2694
2694
  ], exports.ScreenDetail.prototype, "title", void 0);
2695
2695
  exports.ScreenDetail = __decorate$3([
2696
- t$1('kr-screen-detail')
2696
+ t$2('kr-screen-detail')
2697
2697
  ], exports.ScreenDetail);
2698
2698
 
2699
2699
  var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -2707,7 +2707,7 @@
2707
2707
  *
2708
2708
  * @slot - Content to display in the subbar (right side)
2709
2709
  */
2710
- exports.Subbar = class KRSubbar extends i$1 {
2710
+ exports.Subbar = class KRSubbar extends i$2 {
2711
2711
  constructor() {
2712
2712
  super(...arguments);
2713
2713
  /**
@@ -2835,7 +2835,7 @@
2835
2835
  `;
2836
2836
  }
2837
2837
  };
2838
- exports.Subbar.styles = i$4 `
2838
+ exports.Subbar.styles = i$5 `
2839
2839
  :host {
2840
2840
  display: flex;
2841
2841
  flex-direction: row;
@@ -2909,7 +2909,7 @@
2909
2909
  n({ type: Boolean })
2910
2910
  ], exports.Subbar.prototype, "menu", void 0);
2911
2911
  exports.Subbar = __decorate$2([
2912
- t$1('kr-subbar')
2912
+ t$2('kr-subbar')
2913
2913
  ], exports.Subbar);
2914
2914
 
2915
2915
  var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -3048,7 +3048,7 @@
3048
3048
  KRRouter.base = '';
3049
3049
  KRRouter.routes = [];
3050
3050
  KRRouter.elementCache = new Map();
3051
- exports.RouterOutlet = class KRRouterOutlet extends i$1 {
3051
+ exports.RouterOutlet = class KRRouterOutlet extends i$2 {
3052
3052
  constructor() {
3053
3053
  super(...arguments);
3054
3054
  this.level = -1;
@@ -3093,16 +3093,29 @@
3093
3093
  return b `${el}`;
3094
3094
  }
3095
3095
  };
3096
- exports.RouterOutlet.styles = i$4 `
3096
+ exports.RouterOutlet.styles = i$5 `
3097
3097
  :host {
3098
3098
  display: block;
3099
3099
  height: 100%;
3100
3100
  }
3101
3101
  `;
3102
3102
  exports.RouterOutlet = __decorate$1([
3103
- t$1('kr-router-outlet')
3103
+ t$2('kr-router-outlet')
3104
3104
  ], exports.RouterOutlet);
3105
3105
 
3106
+ /**
3107
+ * @license
3108
+ * Copyright 2020 Google LLC
3109
+ * SPDX-License-Identifier: BSD-3-Clause
3110
+ */const {I:t}=j,i=o=>o,s=()=>document.createComment(""),v=(o,n,e)=>{const l=o._$AA.parentNode,d=void 0===n?o._$AB:n._$AA;if(void 0===e){const i=l.insertBefore(s(),d),n=l.insertBefore(s(),d);e=new t(i,n,o,o.options);}else {const t=e._$AB.nextSibling,n=e._$AM,c=n!==o;if(c){let t;e._$AQ?.(o),e._$AM=o,void 0!==e._$AP&&(t=o._$AU)!==n._$AU&&e._$AP(t);}if(t!==d||c){let o=e._$AA;for(;o!==t;){const t=i(o).nextSibling;i(l).insertBefore(o,d),o=t;}}}return e},u$1=(o,t,i=o)=>(o._$AI(t,i),o),m={},p=(o,t=m)=>o._$AH=t,M=o=>o._$AH,h=o=>{o._$AR(),o._$AA.remove();};
3111
+
3112
+ /**
3113
+ * @license
3114
+ * Copyright 2017 Google LLC
3115
+ * SPDX-License-Identifier: BSD-3-Clause
3116
+ */
3117
+ const u=(e,s,t)=>{const r=new Map;for(let l=s;l<=t;l++)r.set(e[l],l);return r},c=e$2(class extends i$1{constructor(e){if(super(e),e.type!==t$1.CHILD)throw Error("repeat() can only be used in text expressions")}dt(e,s,t){let r;void 0===t?t=s:void 0!==s&&(r=s);const l=[],o=[];let i=0;for(const s of e)l[i]=r?r(s,i):i,o[i]=t(s,i),i++;return {values:o,keys:l}}render(e,s,t){return this.dt(e,s,t).values}update(s,[t,r,c]){const d=M(s),{values:p$1,keys:a}=this.dt(t,r,c);if(!Array.isArray(d))return this.ut=a,p$1;const h$1=this.ut??=[],v$1=[];let m,y,x=0,j=d.length-1,k=0,w=p$1.length-1;for(;x<=j&&k<=w;)if(null===d[x])x++;else if(null===d[j])j--;else if(h$1[x]===a[k])v$1[k]=u$1(d[x],p$1[k]),x++,k++;else if(h$1[j]===a[w])v$1[w]=u$1(d[j],p$1[w]),j--,w--;else if(h$1[x]===a[w])v$1[w]=u$1(d[x],p$1[w]),v(s,v$1[w+1],d[x]),x++,w--;else if(h$1[j]===a[k])v$1[k]=u$1(d[j],p$1[k]),v(s,d[x],d[j]),j--,k++;else if(void 0===m&&(m=u(a,k,w),y=u(h$1,x,j)),m.has(h$1[x]))if(m.has(h$1[j])){const e=y.get(a[k]),t=void 0!==e?d[e]:null;if(null===t){const e=v(s,d[x]);u$1(e,p$1[k]),v$1[k]=e;}else v$1[k]=u$1(t,p$1[k]),v(s,d[x],t),d[e]=null;k++;}else h(d[j]),j--;else h(d[x]),x++;for(;k<=w;){const e=v(s,v$1[w+1]);u$1(e,p$1[k]),v$1[k++]=e;}for(;x<=j;){const e=d[x++];null!==e&&h(e);}return this.ut=a,p(s,v$1),E}});
3118
+
3106
3119
  /**
3107
3120
  * marked v12.0.2 - a markdown parser
3108
3121
  * Copyright (c) 2011-2024, Christopher Jeffrey. (MIT Licensed)
@@ -5535,6 +5548,8 @@
5535
5548
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5536
5549
  return c > 3 && r && Object.defineProperty(target, key, r), r;
5537
5550
  };
5551
+ /** Image MIME types the chatbot accepts (matches what Bedrock can ingest). */
5552
+ const ACCEPTED_IMAGE_TYPES = ['image/jpeg', 'image/png', 'image/gif', 'image/webp'];
5538
5553
  /**
5539
5554
  * AI chatbot component with SSE streaming.
5540
5555
  *
@@ -5555,7 +5570,7 @@
5555
5570
  * ## Usage
5556
5571
  * ```html
5557
5572
  * <kr-chatbot
5558
- * title="AI Assistant"
5573
+ * label="AI Assistant"
5559
5574
  * .send=${(params) => {
5560
5575
  * return fetch('/api/ai/chat/stream', {
5561
5576
  * method: 'POST',
@@ -5572,7 +5587,7 @@
5572
5587
  * @fires message-submit - When the user sends a message. Cancelable. Detail: `{ message: string }`
5573
5588
  * @fires stream-event - Dispatched for every SSE message received. Detail contains the parsed event data.
5574
5589
  */
5575
- exports.Chatbot = class KRChatbot extends i$1 {
5590
+ exports.Chatbot = class KRChatbot extends i$2 {
5576
5591
  constructor() {
5577
5592
  super(...arguments);
5578
5593
  // --- Private properties ---
@@ -5590,20 +5605,33 @@
5590
5605
  this._dragStartTop = 0;
5591
5606
  this._resizeStartW = 0;
5592
5607
  this._resizeStartH = 0;
5608
+ /** Counter for depth-aware dragenter/dragleave tracking. */
5609
+ this._dragDepth = 0;
5610
+ /** Monotonic id source for pending attachments. */
5611
+ this._pendingSeq = 0;
5593
5612
  // --- @property (public API) ---
5594
5613
  /**
5595
5614
  * Callback function for sending messages. Receives the user's message and
5596
5615
  * current conversation history. Must return a Response with a streaming SSE body.
5616
+ *
5617
+ * Optional — when not set, the chatbot uses its built-in default that streams
5618
+ * from the Kodaris Bedrock conversation endpoints. Set this to override.
5597
5619
  */
5598
5620
  this.send = null;
5599
5621
  /**
5600
5622
  * Callback function called when the user clears the conversation.
5601
5623
  * Must return a Promise — messages are only cleared if it resolves.
5624
+ *
5625
+ * Optional — when not set, the chatbot uses its built-in default that clears
5626
+ * the Kodaris Bedrock conversation state. Set this to override.
5602
5627
  */
5603
5628
  this.clear = null;
5604
5629
  /**
5605
5630
  * Callback function called on init to load existing conversation messages.
5606
5631
  * Must return a Promise that resolves with an array of KRChatbotMessage.
5632
+ *
5633
+ * Optional — when not set, the chatbot uses its built-in default that loads
5634
+ * existing messages from the Kodaris Bedrock conversation. Set this to override.
5607
5635
  */
5608
5636
  this.load = null;
5609
5637
  /**
@@ -5612,13 +5640,9 @@
5612
5640
  */
5613
5641
  this.messages = [];
5614
5642
  /**
5615
- * Header title text.
5616
- */
5617
- this.title = 'Kat';
5618
- /**
5619
- * Header subtitle text (shown below title with a green status dot).
5643
+ * Header label text.
5620
5644
  */
5621
- this.subtitle = '';
5645
+ this.label = 'Kat';
5622
5646
  /**
5623
5647
  * Input placeholder text.
5624
5648
  */
@@ -5627,11 +5651,31 @@
5627
5651
  * Whether the chat panel is open. Only relevant in floating mode.
5628
5652
  */
5629
5653
  this.opened = false;
5654
+ /**
5655
+ * Hide the built-in floating toggle button. Use this when an external
5656
+ * control (e.g. the site-editor bar) owns opening the chat — the panel is
5657
+ * then driven via the `open()` / `close()` / `toggle()` methods.
5658
+ */
5659
+ this.hideToggle = false;
5660
+ /**
5661
+ * Layout mode.
5662
+ * - `'floating'` (default): the chatbot is a fixed bottom-right widget with a
5663
+ * toggle button, and the panel can be dragged and resized. This is the
5664
+ * traditional chat-widget appearance.
5665
+ * - `'inline'`: the chatbot drops its fixed positioning and fills its parent
5666
+ * container (100% width/height, no border radius/shadow, no toggle, no
5667
+ * drag/resize). The panel is always open. Use this to embed the chat as a
5668
+ * full page or panel region.
5669
+ */
5670
+ this.variant = 'floating';
5630
5671
  // --- @state (internal) ---
5631
5672
  this._inputValue = '';
5632
5673
  this._isStreaming = false;
5633
- this._statusText = '';
5634
5674
  this._error = '';
5675
+ /** Images staged in the composer, before the message is sent. */
5676
+ this._pendingInternalFiles = [];
5677
+ /** True while a file is being dragged over the panel (shows the drop overlay). */
5678
+ this._isDraggingFile = false;
5635
5679
  this._handleMouseMove = (e) => {
5636
5680
  if (this._isDragging) {
5637
5681
  let newLeft = this._dragStartLeft + (e.clientX - this._dragStartX);
@@ -5693,12 +5737,27 @@
5693
5737
  // --- Lifecycle ---
5694
5738
  connectedCallback() {
5695
5739
  super.connectedCallback();
5696
- if (this.load) {
5697
- this.load().then((messages) => {
5698
- if (messages && messages.length) {
5699
- this.messages = messages;
5700
- }
5701
- }).catch(() => { });
5740
+ // Default to loading existing messages from the Kodaris Bedrock conversation
5741
+ // when the consumer hasn't provided their own `load`. The endpoint returns
5742
+ // messages already in KRChatbotMessage shape ({ type, content, images }), so
5743
+ // they pass straight through.
5744
+ if (!this.load) {
5745
+ this.load = () => krubbleHttp.Http.fetch({
5746
+ url: '/api/system/integration/aws/bedrock/getConversationMessages',
5747
+ })
5748
+ .then((r) => r.json())
5749
+ .then((res) => res.data || []);
5750
+ }
5751
+ this.load().then((messages) => {
5752
+ if (messages && messages.length) {
5753
+ this.messages = messages;
5754
+ }
5755
+ }).catch(() => { });
5756
+ // Inline mode fills its container and is always open — the floating widget's
5757
+ // toggle/drag/resize state (including any persisted layout) doesn't apply.
5758
+ if (this.variant === 'inline') {
5759
+ this.opened = true;
5760
+ return;
5702
5761
  }
5703
5762
  this._restoreState();
5704
5763
  }
@@ -5710,9 +5769,11 @@
5710
5769
  }
5711
5770
  document.removeEventListener('mousemove', this._handleMouseMove);
5712
5771
  document.removeEventListener('mouseup', this._handleMouseUp);
5772
+ // Release any object URLs still held by staged attachments.
5773
+ this._pendingInternalFiles.forEach((p) => URL.revokeObjectURL(p.previewUrl));
5713
5774
  }
5714
5775
  updated(changed) {
5715
- if (changed.has('messages') || changed.has('_statusText')) {
5776
+ if (changed.has('messages')) {
5716
5777
  if (!this._userHasScrolledUp && !this._isStreaming && this._messagesEl) {
5717
5778
  requestAnimationFrame(() => {
5718
5779
  if (this._messagesEl) {
@@ -5736,6 +5797,22 @@
5736
5797
  stop() {
5737
5798
  this._handleStop();
5738
5799
  }
5800
+ /** Open the chat panel. */
5801
+ open() {
5802
+ if (!this.opened) {
5803
+ this._handleToggle();
5804
+ }
5805
+ }
5806
+ /** Close the chat panel. */
5807
+ close() {
5808
+ if (this.opened) {
5809
+ this._handleToggle();
5810
+ }
5811
+ }
5812
+ /** Toggle the chat panel open/closed. */
5813
+ toggle() {
5814
+ this._handleToggle();
5815
+ }
5739
5816
  // --- Private methods ---
5740
5817
  /**
5741
5818
  * Shows a full-viewport transparent overlay during drag/resize operations.
@@ -5770,6 +5847,10 @@
5770
5847
  }
5771
5848
  }
5772
5849
  _handleHeaderMouseDown(e) {
5850
+ // Inline mode fills its parent — dragging the panel doesn't apply.
5851
+ if (this.variant === 'inline') {
5852
+ return;
5853
+ }
5773
5854
  // Ignore clicks on buttons inside the header
5774
5855
  if (e.target.closest('button')) {
5775
5856
  return;
@@ -5795,6 +5876,10 @@
5795
5876
  document.addEventListener('mouseup', this._handleMouseUp);
5796
5877
  }
5797
5878
  _handleResizeMouseDown(e) {
5879
+ // Inline mode fills its parent — resizing the panel doesn't apply.
5880
+ if (this.variant === 'inline') {
5881
+ return;
5882
+ }
5798
5883
  if (!this._panelEl) {
5799
5884
  return;
5800
5885
  }
@@ -5904,14 +5989,132 @@
5904
5989
  this._handleSubmit();
5905
5990
  }
5906
5991
  }
5992
+ // --- Attachments ---
5993
+ _openFilePicker() {
5994
+ this._fileInputEl?.click();
5995
+ }
5996
+ _handleFileInputChange(e) {
5997
+ const input = e.target;
5998
+ if (input.files) {
5999
+ this._addFiles(input.files);
6000
+ }
6001
+ // Reset so picking the same file again re-fires change.
6002
+ input.value = '';
6003
+ }
6004
+ _handlePaste(e) {
6005
+ const items = e.clipboardData?.items;
6006
+ if (!items) {
6007
+ return;
6008
+ }
6009
+ const files = [];
6010
+ for (let i = 0; i < items.length; i++) {
6011
+ if (items[i].kind === 'file') {
6012
+ const file = items[i].getAsFile();
6013
+ if (file) {
6014
+ files.push(file);
6015
+ }
6016
+ }
6017
+ }
6018
+ if (files.length) {
6019
+ e.preventDefault();
6020
+ this._addFiles(files);
6021
+ }
6022
+ }
6023
+ _handleDragEnter(e) {
6024
+ if (!this._hasFiles(e)) {
6025
+ return;
6026
+ }
6027
+ e.preventDefault();
6028
+ this._dragDepth++;
6029
+ this._isDraggingFile = true;
6030
+ }
6031
+ _handleDragOver(e) {
6032
+ if (!this._hasFiles(e)) {
6033
+ return;
6034
+ }
6035
+ // Required so the drop event fires.
6036
+ e.preventDefault();
6037
+ }
6038
+ _handleDragLeave(e) {
6039
+ if (!this._hasFiles(e)) {
6040
+ return;
6041
+ }
6042
+ this._dragDepth--;
6043
+ if (this._dragDepth <= 0) {
6044
+ this._dragDepth = 0;
6045
+ this._isDraggingFile = false;
6046
+ }
6047
+ }
6048
+ _handleDrop(e) {
6049
+ if (!this._hasFiles(e)) {
6050
+ return;
6051
+ }
6052
+ e.preventDefault();
6053
+ this._dragDepth = 0;
6054
+ this._isDraggingFile = false;
6055
+ if (e.dataTransfer?.files) {
6056
+ this._addFiles(e.dataTransfer.files);
6057
+ }
6058
+ }
6059
+ _hasFiles(e) {
6060
+ return Array.from(e.dataTransfer?.types || []).includes('Files');
6061
+ }
6062
+ /** Stage a set of image files in the composer (held locally until send). */
6063
+ _addFiles(fileList) {
6064
+ const files = Array.from(fileList).filter((f) => ACCEPTED_IMAGE_TYPES.includes(f.type));
6065
+ if (!files.length) {
6066
+ return;
6067
+ }
6068
+ files.forEach((file) => {
6069
+ const pending = {
6070
+ localId: 'att-' + this._pendingSeq++,
6071
+ file,
6072
+ name: file.name,
6073
+ previewUrl: URL.createObjectURL(file),
6074
+ };
6075
+ this._pendingInternalFiles = [...this._pendingInternalFiles, pending];
6076
+ });
6077
+ }
6078
+ _removePending(localId) {
6079
+ const target = this._pendingInternalFiles.find((p) => p.localId === localId);
6080
+ if (target) {
6081
+ URL.revokeObjectURL(target.previewUrl);
6082
+ }
6083
+ this._pendingInternalFiles = this._pendingInternalFiles.filter((p) => p.localId !== localId);
6084
+ }
6085
+ _clearPending() {
6086
+ this._pendingInternalFiles.forEach((p) => URL.revokeObjectURL(p.previewUrl));
6087
+ this._pendingInternalFiles = [];
6088
+ }
6089
+ /** Open the shared full-screen previewer for a message image. */
6090
+ _openImage(img) {
6091
+ krubbleComponents.FilePreview.open({
6092
+ src: `/api/system/integration/aws/bedrock/conversationImage/${img.internalFileID}/view`,
6093
+ name: img.niceName || 'image',
6094
+ });
6095
+ }
6096
+ /** Whether the send button is active: needs text or at least one image. */
6097
+ _canSend() {
6098
+ return Boolean(this._inputValue.trim()) || this._pendingInternalFiles.length > 0;
6099
+ }
5907
6100
  _handleSubmit() {
5908
- if (!this._inputValue.trim() || !this.send || this._isStreaming) {
6101
+ if (this._isStreaming) {
5909
6102
  return;
5910
6103
  }
5911
6104
  const messageText = this._inputValue.trim();
6105
+ const pending = this._pendingInternalFiles;
6106
+ // Allow sending an image with no text, but require at least one of them.
6107
+ if (!messageText && !pending.length) {
6108
+ return;
6109
+ }
6110
+ // The raw files sent to the backend. Sent images are shown once the
6111
+ // conversation reloads and they come back as stored internal files; the
6112
+ // just-sent message itself carries text only.
6113
+ const internalFiles = pending.map((p) => p.file);
5912
6114
  const submitEvent = new CustomEvent('message-submit', {
5913
6115
  detail: {
5914
6116
  message: messageText,
6117
+ internalFiles,
5915
6118
  },
5916
6119
  bubbles: true,
5917
6120
  composed: true,
@@ -5921,24 +6124,27 @@
5921
6124
  if (submitEvent.defaultPrevented) {
5922
6125
  return;
5923
6126
  }
5924
- this.messages = [...this.messages, {
5925
- role: 'user',
5926
- content: messageText,
5927
- }];
6127
+ const userMessage = {
6128
+ type: 'user',
6129
+ content: messageText,
6130
+ };
6131
+ this.messages = [...this.messages, userMessage];
5928
6132
  this._inputValue = '';
5929
6133
  this._error = '';
5930
6134
  this._userHasScrolledUp = false;
6135
+ // Clear the composer and release its preview object URLs.
6136
+ this._pendingInternalFiles.forEach((p) => URL.revokeObjectURL(p.previewUrl));
6137
+ this._pendingInternalFiles = [];
5931
6138
  // Reset textarea height
5932
6139
  if (this._inputEl) {
5933
6140
  this._inputEl.style.height = 'auto';
5934
6141
  }
5935
6142
  // Add empty assistant message to stream into
5936
6143
  this.messages = [...this.messages, {
5937
- role: 'assistant',
6144
+ type: 'assistant',
5938
6145
  content: '',
5939
6146
  }];
5940
6147
  this._isStreaming = true;
5941
- this._statusText = '';
5942
6148
  // Scroll user's message to the top (Gemini-style).
5943
6149
  // Set min-height on the assistant message = container height so there's enough
5944
6150
  // scroll room below the user message to push it to the top.
@@ -5960,9 +6166,34 @@
5960
6166
  this._messagesEl.scrollTop = userMsgEl.offsetTop - this._messagesEl.offsetTop - 24;
5961
6167
  }
5962
6168
  });
6169
+ // Default to streaming from the Kodaris Bedrock conversation endpoints when
6170
+ // the consumer hasn't provided their own `send`.
6171
+ if (!this.send) {
6172
+ this.send = (params) => {
6173
+ // With images, post text + files as multipart; without, post plain JSON.
6174
+ if (params.internalFiles.length) {
6175
+ const form = new FormData();
6176
+ form.append('userText', params.message);
6177
+ params.internalFiles.forEach((file) => form.append('images', file));
6178
+ return krubbleHttp.Http.fetch({
6179
+ url: '/api/system/integration/aws/bedrock/stream/invokeModelForConversationWithImages',
6180
+ method: 'POST',
6181
+ headers: { Accept: 'text/event-stream' },
6182
+ body: form,
6183
+ });
6184
+ }
6185
+ return krubbleHttp.Http.fetch({
6186
+ url: '/api/system/integration/aws/bedrock/stream/invokeModelForConversationWithState',
6187
+ method: 'POST',
6188
+ headers: { Accept: 'text/event-stream' },
6189
+ body: { userText: params.message },
6190
+ });
6191
+ };
6192
+ }
5963
6193
  this.send({
5964
6194
  message: messageText,
5965
6195
  messages: this.messages.slice(0, -1),
6196
+ internalFiles,
5966
6197
  }).then((response) => {
5967
6198
  if (!response.ok) {
5968
6199
  this._handleStreamError('Request failed: ' + response.status);
@@ -5988,11 +6219,15 @@
5988
6219
  this._reader = null;
5989
6220
  }
5990
6221
  this._isStreaming = false;
5991
- this._statusText = '';
5992
6222
  }
5993
6223
  _handleClear() {
6224
+ // Default to clearing the Kodaris Bedrock conversation state when the consumer
6225
+ // hasn't provided their own `clear`.
5994
6226
  if (!this.clear) {
5995
- return;
6227
+ this.clear = () => krubbleHttp.Http.fetch({
6228
+ url: '/api/system/integration/aws/bedrock/clearConversationWithState',
6229
+ method: 'POST',
6230
+ });
5996
6231
  }
5997
6232
  this.clear().then(() => {
5998
6233
  if (this._reader) {
@@ -6001,7 +6236,6 @@
6001
6236
  }
6002
6237
  this.messages = [];
6003
6238
  this._isStreaming = false;
6004
- this._statusText = '';
6005
6239
  this._error = '';
6006
6240
  this._inputValue = '';
6007
6241
  this._userHasScrolledUp = false;
@@ -6027,7 +6261,6 @@
6027
6261
  this._reader.read().then((result) => {
6028
6262
  if (result.done) {
6029
6263
  this._isStreaming = false;
6030
- this._statusText = '';
6031
6264
  this._reader = null;
6032
6265
  return;
6033
6266
  }
@@ -6060,15 +6293,10 @@
6060
6293
  bubbles: true,
6061
6294
  composed: true,
6062
6295
  }));
6063
- if (data.type === 'STATUS') {
6064
- if (data.message) {
6065
- this._statusText = String(data.message);
6066
- }
6067
- }
6068
- else if (data.type === 'REASONING_PART') {
6296
+ if (data.type === 'REASONING_PART') {
6069
6297
  if (data.message) {
6070
6298
  const lastIndex = this.messages.length - 1;
6071
- if (lastIndex >= 0 && this.messages[lastIndex].role === 'assistant') {
6299
+ if (lastIndex >= 0 && this.messages[lastIndex].type === 'assistant') {
6072
6300
  if (!this.messages[lastIndex].reasoning) {
6073
6301
  this.messages[lastIndex].reasoning = '';
6074
6302
  }
@@ -6079,9 +6307,8 @@
6079
6307
  }
6080
6308
  else if (data.type === 'RESPONSE_PART') {
6081
6309
  if (data.message) {
6082
- this._statusText = '';
6083
6310
  const lastIndex = this.messages.length - 1;
6084
- if (lastIndex >= 0 && this.messages[lastIndex].role === 'assistant') {
6311
+ if (lastIndex >= 0 && this.messages[lastIndex].type === 'assistant') {
6085
6312
  this.messages[lastIndex].content += String(data.message);
6086
6313
  this.requestUpdate();
6087
6314
  }
@@ -6092,7 +6319,6 @@
6092
6319
  }
6093
6320
  if (data.finished) {
6094
6321
  this._isStreaming = false;
6095
- this._statusText = '';
6096
6322
  this._reader = null;
6097
6323
  }
6098
6324
  }
@@ -6106,7 +6332,6 @@
6106
6332
  }
6107
6333
  _handleStreamError(message) {
6108
6334
  this._isStreaming = false;
6109
- this._statusText = '';
6110
6335
  this._error = message;
6111
6336
  if (this._reader) {
6112
6337
  this._reader.cancel();
@@ -6115,7 +6340,7 @@
6115
6340
  // Remove the empty assistant message if it has no content
6116
6341
  if (this.messages.length > 0) {
6117
6342
  const lastMessage = this.messages[this.messages.length - 1];
6118
- if (lastMessage.role === 'assistant' && !lastMessage.content) {
6343
+ if (lastMessage.type === 'assistant' && !lastMessage.content) {
6119
6344
  this.messages = this.messages.slice(0, -1);
6120
6345
  }
6121
6346
  }
@@ -6123,78 +6348,103 @@
6123
6348
  // --- Render ---
6124
6349
  render() {
6125
6350
  return b `
6126
- <button
6127
- class=${e({
6351
+ ${(this.hideToggle || this.variant === 'inline') ? A : b `
6352
+ <button
6353
+ class=${e({
6128
6354
  'toggle': true,
6129
6355
  'toggle--hidden': this.opened,
6130
6356
  })}
6131
- @click=${this._handleToggle}
6132
- title="Open chat"
6133
- >
6134
- <svg
6135
- viewBox="0 0 24 24"
6136
- fill="none"
6137
- stroke="currentColor"
6138
- stroke-width="2"
6139
- stroke-linecap="round"
6140
- class="toggle-icon"
6357
+ @click=${this._handleToggle}
6358
+ title="Open chat"
6141
6359
  >
6142
- <path d="M12 2C6.48 2 2 6.03 2 11c0 2.61 1.19 4.94 3.05 6.55L4 22l4.8-2.4C9.82 19.85 10.88 20 12 20c5.52 0 10-4.03 10-9S17.52 2 12 2z"/>
6143
- <path d="M8 11h.01M12 11h.01M16 11h.01" stroke-width="2.5"/>
6144
- </svg>
6145
- </button>
6360
+ <svg
6361
+ viewBox="0 0 24 24"
6362
+ fill="none"
6363
+ stroke="currentColor"
6364
+ stroke-width="2"
6365
+ stroke-linecap="round"
6366
+ class="toggle-icon"
6367
+ >
6368
+ <path d="M12 2C6.48 2 2 6.03 2 11c0 2.61 1.19 4.94 3.05 6.55L4 22l4.8-2.4C9.82 19.85 10.88 20 12 20c5.52 0 10-4.03 10-9S17.52 2 12 2z"/>
6369
+ <path d="M8 11h.01M12 11h.01M16 11h.01" stroke-width="2.5"/>
6370
+ </svg>
6371
+ </button>
6372
+ `}
6146
6373
 
6147
- <div class=${e({
6374
+ <div
6375
+ class=${e({
6148
6376
  'panel': true,
6149
6377
  'panel--opened': this.opened,
6150
- })}>
6151
- <div
6152
- class="resize resize--n"
6153
- data-dir="n"
6154
- @mousedown=${this._handleResizeMouseDown}
6155
- ></div>
6156
- <div
6157
- class="resize resize--s"
6158
- data-dir="s"
6159
- @mousedown=${this._handleResizeMouseDown}
6160
- ></div>
6161
- <div
6162
- class="resize resize--w"
6163
- data-dir="w"
6164
- @mousedown=${this._handleResizeMouseDown}
6165
- ></div>
6166
- <div
6167
- class="resize resize--e"
6168
- data-dir="e"
6169
- @mousedown=${this._handleResizeMouseDown}
6170
- ></div>
6171
- <div
6172
- class="resize resize--nw"
6173
- data-dir="nw"
6174
- @mousedown=${this._handleResizeMouseDown}
6175
- ></div>
6176
- <div
6177
- class="resize resize--ne"
6178
- data-dir="ne"
6179
- @mousedown=${this._handleResizeMouseDown}
6180
- ></div>
6181
- <div
6182
- class="resize resize--sw"
6183
- data-dir="sw"
6184
- @mousedown=${this._handleResizeMouseDown}
6185
- ></div>
6186
- <div
6187
- class="resize resize--se"
6188
- data-dir="se"
6189
- @mousedown=${this._handleResizeMouseDown}
6190
- ></div>
6378
+ })}
6379
+ @dragenter=${this._handleDragEnter}
6380
+ @dragover=${this._handleDragOver}
6381
+ @dragleave=${this._handleDragLeave}
6382
+ @drop=${this._handleDrop}
6383
+ >
6384
+ ${this._isDraggingFile ? b `
6385
+ <div class="drop-overlay">
6386
+ <svg
6387
+ xmlns="http://www.w3.org/2000/svg"
6388
+ fill="none"
6389
+ viewBox="0 0 24 24"
6390
+ stroke-width="1.5"
6391
+ stroke="currentColor"
6392
+ >
6393
+ <path
6394
+ stroke-linecap="round"
6395
+ stroke-linejoin="round"
6396
+ d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5m-13.5-9L12 3m0 0 4.5 4.5M12 3v13.5"
6397
+ />
6398
+ </svg>
6399
+ <span>Drop images to attach</span>
6400
+ </div>
6401
+ ` : A}
6402
+ ${this.variant === 'inline' ? A : b `
6403
+ <div
6404
+ class="resize resize--n"
6405
+ data-dir="n"
6406
+ @mousedown=${this._handleResizeMouseDown}
6407
+ ></div>
6408
+ <div
6409
+ class="resize resize--s"
6410
+ data-dir="s"
6411
+ @mousedown=${this._handleResizeMouseDown}
6412
+ ></div>
6413
+ <div
6414
+ class="resize resize--w"
6415
+ data-dir="w"
6416
+ @mousedown=${this._handleResizeMouseDown}
6417
+ ></div>
6418
+ <div
6419
+ class="resize resize--e"
6420
+ data-dir="e"
6421
+ @mousedown=${this._handleResizeMouseDown}
6422
+ ></div>
6423
+ <div
6424
+ class="resize resize--nw"
6425
+ data-dir="nw"
6426
+ @mousedown=${this._handleResizeMouseDown}
6427
+ ></div>
6428
+ <div
6429
+ class="resize resize--ne"
6430
+ data-dir="ne"
6431
+ @mousedown=${this._handleResizeMouseDown}
6432
+ ></div>
6433
+ <div
6434
+ class="resize resize--sw"
6435
+ data-dir="sw"
6436
+ @mousedown=${this._handleResizeMouseDown}
6437
+ ></div>
6438
+ <div
6439
+ class="resize resize--se"
6440
+ data-dir="se"
6441
+ @mousedown=${this._handleResizeMouseDown}
6442
+ ></div>
6443
+ `}
6191
6444
  <div class="header" @mousedown=${this._handleHeaderMouseDown}>
6192
6445
  <div class="header-left">
6193
6446
  <div class="header-info">
6194
- <span class="header-title">${this.title}</span>
6195
- ${this.subtitle ? b `
6196
- <span class="header-subtitle">${this.subtitle}</span>
6197
- ` : A}
6447
+ <span class="header-title">${this.label}</span>
6198
6448
  </div>
6199
6449
  </div>
6200
6450
  <div class="header-actions">
@@ -6220,63 +6470,84 @@
6220
6470
  </svg>
6221
6471
  </button>
6222
6472
  ` : A}
6223
- <button
6224
- class="header-action"
6225
- @click=${this._handleToggle}
6226
- title="Close"
6227
- >
6228
- <svg
6229
- xmlns="http://www.w3.org/2000/svg"
6230
- fill="none"
6231
- viewBox="0 0 24 24"
6232
- stroke-width="2"
6233
- stroke="currentColor"
6234
- class="header-action-icon"
6473
+ ${this.variant === 'inline' ? A : b `
6474
+ <button
6475
+ class="header-action"
6476
+ @click=${this._handleToggle}
6477
+ title="Close"
6235
6478
  >
6236
- <path
6237
- stroke-linecap="round"
6238
- stroke-linejoin="round"
6239
- d="M6 18 18 6M6 6l12 12"
6240
- />
6241
- </svg>
6242
- </button>
6479
+ <svg
6480
+ xmlns="http://www.w3.org/2000/svg"
6481
+ fill="none"
6482
+ viewBox="0 0 24 24"
6483
+ stroke-width="2"
6484
+ stroke="currentColor"
6485
+ class="header-action-icon"
6486
+ >
6487
+ <path
6488
+ stroke-linecap="round"
6489
+ stroke-linejoin="round"
6490
+ d="M6 18 18 6M6 6l12 12"
6491
+ />
6492
+ </svg>
6493
+ </button>
6494
+ `}
6243
6495
  </div>
6244
6496
  </div>
6245
6497
 
6246
6498
  <div class="messages" @scroll=${this._handleMessagesScroll}>
6247
- ${this.messages.length === 0 ? b `
6248
- <div class="empty">
6249
- <span class="empty-text">What can I help you with?</span>
6250
- </div>
6251
- ` : A}
6252
- ${this.messages.map((msg) => b `
6253
- <div class=${e({
6499
+ <div class="messages-inner">
6500
+ ${this.messages.length === 0 ? b `
6501
+ <div class="empty">
6502
+ <span class="empty-text">What can I help you with?</span>
6503
+ </div>
6504
+ ` : A}
6505
+ ${this.messages.map((msg) => b `
6506
+ <div class=${e({
6254
6507
  'message': true,
6255
- 'message--user': msg.role === 'user',
6256
- 'message--assistant': msg.role === 'assistant',
6508
+ 'message--user': msg.type === 'user',
6509
+ 'message--assistant': msg.type === 'assistant',
6257
6510
  })}>
6258
- ${msg.reasoning ? b `
6259
- <details class="reasoning">
6260
- <summary>Thinking</summary>
6261
- <div class="reasoning-content">${msg.reasoning}</div>
6262
- </details>
6263
- ` : A}
6264
- ${msg.content ? b `
6265
- <div class="message-content">
6266
- ${msg.role === 'user'
6511
+ ${msg.reasoning ? b `
6512
+ <details class="reasoning">
6513
+ <summary>Thinking</summary>
6514
+ <div class="reasoning-content">${msg.reasoning}</div>
6515
+ </details>
6516
+ ` : A}
6517
+ ${msg.internalFiles && msg.internalFiles.length ? b `
6518
+ <div class="attachments">
6519
+ ${msg.internalFiles.map((img) => b `
6520
+ <button
6521
+ class="attachment"
6522
+ type="button"
6523
+ title=${img.niceName || 'View image'}
6524
+ @click=${() => this._openImage(img)}
6525
+ >
6526
+ <img
6527
+ src="/api/system/integration/aws/bedrock/conversationImage/${img.internalFileID}/view"
6528
+ alt=${img.niceName || ''}
6529
+ />
6530
+ </button>
6531
+ `)}
6532
+ </div>
6533
+ ` : A}
6534
+ ${msg.content ? b `
6535
+ <div class="message-content">
6536
+ ${msg.type === 'user'
6267
6537
  ? msg.content
6268
6538
  : o(marked.parse(msg.content, { breaks: true }))}
6269
- </div>
6270
- ` : A}
6271
- ${msg.role === 'assistant' && this._isStreaming && msg === this.messages[this.messages.length - 1] ? b `
6272
- <div class="typing">
6273
- <span></span>
6274
- <span></span>
6275
- <span></span>
6276
- </div>
6277
- ` : A}
6278
- </div>
6279
- `)}
6539
+ </div>
6540
+ ` : A}
6541
+ ${msg.type === 'assistant' && this._isStreaming && msg === this.messages[this.messages.length - 1] ? b `
6542
+ <div class="typing">
6543
+ <span></span>
6544
+ <span></span>
6545
+ <span></span>
6546
+ </div>
6547
+ ` : A}
6548
+ </div>
6549
+ `)}
6550
+ </div>
6280
6551
  </div>
6281
6552
 
6282
6553
  ${this._error ? b `
@@ -6302,8 +6573,48 @@
6302
6573
  ` : A}
6303
6574
 
6304
6575
  <div class="footer">
6576
+ ${this._pendingInternalFiles.length ? b `
6577
+ <div class="composer-attachments">
6578
+ ${c(this._pendingInternalFiles, (p) => p.localId, (p) => b `
6579
+ <div class="chip">
6580
+ <img src=${p.previewUrl} alt=${p.name} />
6581
+ <button
6582
+ class="chip-remove"
6583
+ title="Remove"
6584
+ @click=${() => this._removePending(p.localId)}
6585
+ >
6586
+ <svg
6587
+ xmlns="http://www.w3.org/2000/svg"
6588
+ fill="none"
6589
+ viewBox="0 0 24 24"
6590
+ stroke-width="3"
6591
+ stroke="currentColor"
6592
+ >
6593
+ <path
6594
+ stroke-linecap="round"
6595
+ stroke-linejoin="round"
6596
+ d="M6 18 18 6M6 6l12 12"
6597
+ />
6598
+ </svg>
6599
+ </button>
6600
+ </div>
6601
+ `)}
6602
+ </div>
6603
+ ` : A}
6604
+ <input
6605
+ class="file-input"
6606
+ type="file"
6607
+ accept="image/png,image/jpeg,image/gif,image/webp"
6608
+ multiple
6609
+ hidden
6610
+ @change=${this._handleFileInputChange}
6611
+ />
6305
6612
  <div class="input-wrapper">
6306
- <button class="input-plus" title="Attach">+</button>
6613
+ <button
6614
+ class="input-plus"
6615
+ title="Attach image"
6616
+ @click=${this._openFilePicker}
6617
+ >+</button>
6307
6618
  <textarea
6308
6619
  class="input"
6309
6620
  .value=${this._inputValue}
@@ -6311,6 +6622,7 @@
6311
6622
  rows="1"
6312
6623
  @input=${this._handleInputChange}
6313
6624
  @keydown=${this._handleKeyDown}
6625
+ @paste=${this._handlePaste}
6314
6626
  ></textarea>
6315
6627
  ${this._isStreaming ? b `
6316
6628
  <button
@@ -6337,7 +6649,7 @@
6337
6649
  <button
6338
6650
  class=${e({
6339
6651
  'send': true,
6340
- 'send--disabled': !this._inputValue.trim(),
6652
+ 'send--disabled': !this._canSend(),
6341
6653
  })}
6342
6654
  @click=${this._handleSubmit}
6343
6655
  title="Send message"
@@ -6362,7 +6674,7 @@
6362
6674
  `;
6363
6675
  }
6364
6676
  };
6365
- exports.Chatbot.styles = i$4 `
6677
+ exports.Chatbot.styles = i$5 `
6366
6678
  *,
6367
6679
  *::before,
6368
6680
  *::after {
@@ -6452,6 +6764,28 @@
6452
6764
  display: flex;
6453
6765
  }
6454
6766
 
6767
+ /* Inline mode: fill the parent container instead of floating bottom-right. */
6768
+ :host([variant='inline']) {
6769
+ position: static;
6770
+ bottom: auto;
6771
+ right: auto;
6772
+ z-index: auto;
6773
+ height: 100%;
6774
+ }
6775
+
6776
+ :host([variant='inline']) .panel {
6777
+ position: relative;
6778
+ bottom: auto;
6779
+ right: auto;
6780
+ width: 100%;
6781
+ height: 100%;
6782
+ max-height: none;
6783
+ border-radius: 0;
6784
+ box-shadow: none;
6785
+ border: none;
6786
+ animation: none;
6787
+ }
6788
+
6455
6789
  @keyframes chatbot-panel-in {
6456
6790
  from {
6457
6791
  opacity: 0;
@@ -6482,7 +6816,7 @@
6482
6816
  gap: 10px;
6483
6817
  }
6484
6818
 
6485
- .header-info {
6819
+ .header-info {
6486
6820
  display: flex;
6487
6821
  flex-direction: column;
6488
6822
  }
@@ -6492,22 +6826,6 @@
6492
6826
  font-weight: 600;
6493
6827
  }
6494
6828
 
6495
- .header-subtitle {
6496
- color: rgba(255, 255, 255, 0.5);
6497
- font-size: 11px;
6498
- display: flex;
6499
- align-items: center;
6500
- gap: 4px;
6501
- }
6502
-
6503
- .header-subtitle::before {
6504
- content: '';
6505
- width: 5px;
6506
- height: 5px;
6507
- background: var(--kr-chatbot-success);
6508
- border-radius: 50%;
6509
- }
6510
-
6511
6829
  .header-actions {
6512
6830
  display: flex;
6513
6831
  align-items: center;
@@ -6539,17 +6857,29 @@
6539
6857
  }
6540
6858
 
6541
6859
  /* Messages */
6860
+ /* Full-width scroll container — keeps the scrollbar at the panel edge. */
6542
6861
  .messages {
6543
6862
  flex: 1;
6544
6863
  overflow-y: auto;
6545
- padding: 32px;
6546
6864
  display: flex;
6547
6865
  flex-direction: column;
6548
- gap: 24px;
6549
6866
  scroll-behavior: smooth;
6550
6867
  background: white;
6551
6868
  }
6552
6869
 
6870
+ /* Centered, width-capped column that actually holds the messages. */
6871
+ .messages-inner {
6872
+ flex: 1;
6873
+ display: flex;
6874
+ flex-direction: column;
6875
+ gap: 24px;
6876
+ padding: 32px;
6877
+ width: 100%;
6878
+ max-width: 768px;
6879
+ margin-left: auto;
6880
+ margin-right: auto;
6881
+ }
6882
+
6553
6883
  .messages::-webkit-scrollbar {
6554
6884
  width: 4px;
6555
6885
  }
@@ -6573,7 +6903,7 @@
6573
6903
  gap: 8px;
6574
6904
  }
6575
6905
 
6576
- .empty-text {
6906
+ .empty-text {
6577
6907
  font-size: 14px;
6578
6908
  color: rgb(0 0 0 / 80%);
6579
6909
  }
@@ -6685,7 +7015,7 @@
6685
7015
  word-wrap: break-word;
6686
7016
  }
6687
7017
 
6688
- .typing {
7018
+ .typing {
6689
7019
  display: flex;
6690
7020
  gap: 4px;
6691
7021
  padding: 4px 0;
@@ -6753,6 +7083,15 @@
6753
7083
  padding: 16px 16px 16px;
6754
7084
  flex-shrink: 0;
6755
7085
  background: white;
7086
+ width: 100%;
7087
+ max-width: 768px;
7088
+ margin-left: auto;
7089
+ margin-right: auto;
7090
+ }
7091
+
7092
+ /* Inline mode: keep the composer clear of the bottom edge. */
7093
+ :host([variant='inline']) .footer {
7094
+ padding-bottom: 40px;
6756
7095
  }
6757
7096
 
6758
7097
  .input-wrapper {
@@ -6771,6 +7110,15 @@
6771
7110
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04);
6772
7111
  }
6773
7112
 
7113
+ /* Inline mode: keep the border and add a soft floating shadow (ChatGPT/Gemini style). */
7114
+ :host([variant='inline']) .input-wrapper {
7115
+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06), 0 8px 24px rgba(0, 0, 0, 0.1);
7116
+ }
7117
+
7118
+ :host([variant='inline']) .input-wrapper:focus-within {
7119
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08), 0 12px 32px rgba(0, 0, 0, 0.14);
7120
+ }
7121
+
6774
7122
  .input-plus {
6775
7123
  width: 34px;
6776
7124
  height: 34px;
@@ -6878,6 +7226,12 @@
6878
7226
  cursor: grabbing;
6879
7227
  }
6880
7228
 
7229
+ /* Inline mode isn't draggable — don't show the grab/hand cursor. */
7230
+ :host([variant='inline']) .header,
7231
+ :host([variant='inline']) .header:active {
7232
+ cursor: default;
7233
+ }
7234
+
6881
7235
  /* Drag / Resize states */
6882
7236
  .panel--dragging,
6883
7237
  .panel--resizing {
@@ -6904,6 +7258,116 @@
6904
7258
  .resize--sw { bottom: -4px; left: -4px; width: 16px; height: 16px; cursor: sw-resize; }
6905
7259
  .resize--se { bottom: -4px; right: -4px; width: 16px; height: 16px; cursor: se-resize; }
6906
7260
 
7261
+ /* Attachment thumbnails inside a sent message bubble */
7262
+ .attachments {
7263
+ display: flex;
7264
+ flex-wrap: wrap;
7265
+ gap: 8px;
7266
+ }
7267
+
7268
+ .message--user .attachments {
7269
+ justify-content: flex-end;
7270
+ }
7271
+
7272
+ .attachment {
7273
+ width: 120px;
7274
+ height: 120px;
7275
+ border-radius: 12px;
7276
+ overflow: hidden;
7277
+ background: #f2f2f4;
7278
+ border: 1px solid rgba(0, 0, 0, 0.08);
7279
+ cursor: zoom-in;
7280
+ flex-shrink: 0;
7281
+ padding: 0;
7282
+ }
7283
+
7284
+ .attachment img {
7285
+ width: 100%;
7286
+ height: 100%;
7287
+ object-fit: cover;
7288
+ display: block;
7289
+ }
7290
+
7291
+ /* Composer attachment chips (pre-send) */
7292
+ .composer-attachments {
7293
+ display: flex;
7294
+ flex-wrap: wrap;
7295
+ gap: 8px;
7296
+ padding: 0 6px 10px;
7297
+ }
7298
+
7299
+ .chip {
7300
+ position: relative;
7301
+ width: 56px;
7302
+ height: 56px;
7303
+ border-radius: 10px;
7304
+ overflow: hidden;
7305
+ background: #f2f2f4;
7306
+ border: 1px solid var(--kr-chatbot-border);
7307
+ flex-shrink: 0;
7308
+ }
7309
+
7310
+ .chip img {
7311
+ width: 100%;
7312
+ height: 100%;
7313
+ object-fit: cover;
7314
+ display: block;
7315
+ }
7316
+
7317
+ .chip-remove {
7318
+ position: absolute;
7319
+ top: 2px;
7320
+ right: 2px;
7321
+ width: 18px;
7322
+ height: 18px;
7323
+ border-radius: 50%;
7324
+ border: none;
7325
+ background: rgba(0, 0, 0, 0.6);
7326
+ color: #fff;
7327
+ cursor: pointer;
7328
+ display: flex;
7329
+ align-items: center;
7330
+ justify-content: center;
7331
+ padding: 0;
7332
+ line-height: 1;
7333
+ }
7334
+
7335
+ .chip-remove:hover {
7336
+ background: rgba(0, 0, 0, 0.8);
7337
+ }
7338
+
7339
+ .chip-remove svg {
7340
+ width: 10px;
7341
+ height: 10px;
7342
+ }
7343
+
7344
+ /* Drag-and-drop overlay */
7345
+ .drop-overlay {
7346
+ position: absolute;
7347
+ inset: 0;
7348
+ z-index: 20;
7349
+ display: flex;
7350
+ align-items: center;
7351
+ justify-content: center;
7352
+ flex-direction: column;
7353
+ gap: 10px;
7354
+ /* Frosted, mostly-opaque surface so the chat content behind is masked
7355
+ and doesn't clash with the overlay label. */
7356
+ background: rgba(255, 255, 255, 0.92);
7357
+ backdrop-filter: blur(3px);
7358
+ border: 2px dashed var(--kr-chatbot-primary);
7359
+ border-radius: 16px;
7360
+ color: var(--kr-chatbot-primary);
7361
+ font-weight: 600;
7362
+ font-size: 15px;
7363
+ pointer-events: none;
7364
+ }
7365
+
7366
+ .drop-overlay svg {
7367
+ width: 32px;
7368
+ height: 32px;
7369
+ }
7370
+
6907
7371
  `;
6908
7372
  __decorate([
6909
7373
  n({ attribute: false })
@@ -6919,10 +7383,7 @@
6919
7383
  ], exports.Chatbot.prototype, "messages", void 0);
6920
7384
  __decorate([
6921
7385
  n({ type: String })
6922
- ], exports.Chatbot.prototype, "title", void 0);
6923
- __decorate([
6924
- n({ type: String })
6925
- ], exports.Chatbot.prototype, "subtitle", void 0);
7386
+ ], exports.Chatbot.prototype, "label", void 0);
6926
7387
  __decorate([
6927
7388
  n({ type: String })
6928
7389
  ], exports.Chatbot.prototype, "placeholder", void 0);
@@ -6932,6 +7393,19 @@
6932
7393
  reflect: true
6933
7394
  })
6934
7395
  ], exports.Chatbot.prototype, "opened", void 0);
7396
+ __decorate([
7397
+ n({
7398
+ type: Boolean,
7399
+ attribute: 'hide-toggle',
7400
+ reflect: true
7401
+ })
7402
+ ], exports.Chatbot.prototype, "hideToggle", void 0);
7403
+ __decorate([
7404
+ n({
7405
+ type: String,
7406
+ reflect: true
7407
+ })
7408
+ ], exports.Chatbot.prototype, "variant", void 0);
6935
7409
  __decorate([
6936
7410
  r()
6937
7411
  ], exports.Chatbot.prototype, "_inputValue", void 0);
@@ -6940,10 +7414,13 @@
6940
7414
  ], exports.Chatbot.prototype, "_isStreaming", void 0);
6941
7415
  __decorate([
6942
7416
  r()
6943
- ], exports.Chatbot.prototype, "_statusText", void 0);
7417
+ ], exports.Chatbot.prototype, "_error", void 0);
7418
+ __decorate([
7419
+ r()
7420
+ ], exports.Chatbot.prototype, "_pendingInternalFiles", void 0);
6944
7421
  __decorate([
6945
7422
  r()
6946
- ], exports.Chatbot.prototype, "_error", void 0);
7423
+ ], exports.Chatbot.prototype, "_isDraggingFile", void 0);
6947
7424
  __decorate([
6948
7425
  e$3('.panel')
6949
7426
  ], exports.Chatbot.prototype, "_panelEl", void 0);
@@ -6953,8 +7430,11 @@
6953
7430
  __decorate([
6954
7431
  e$3('.input')
6955
7432
  ], exports.Chatbot.prototype, "_inputEl", void 0);
7433
+ __decorate([
7434
+ e$3('.file-input')
7435
+ ], exports.Chatbot.prototype, "_fileInputEl", void 0);
6956
7436
  exports.Chatbot = __decorate([
6957
- t$1('kr-chatbot')
7437
+ t$2('kr-chatbot')
6958
7438
  ], exports.Chatbot);
6959
7439
 
6960
7440
  exports.Router = KRRouter;