@microsoft/fast-element 1.7.1 → 1.9.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 (56) hide show
  1. package/.eslintrc.json +30 -0
  2. package/CHANGELOG.json +73 -1
  3. package/CHANGELOG.md +26 -2
  4. package/dist/dts/components/attributes.d.ts +1 -1
  5. package/dist/dts/components/controller.d.ts +6 -6
  6. package/dist/dts/components/fast-definitions.d.ts +5 -5
  7. package/dist/dts/components/fast-element.d.ts +2 -2
  8. package/dist/dts/dom.d.ts +4 -4
  9. package/dist/dts/index.d.ts +26 -26
  10. package/dist/dts/observation/behavior.d.ts +1 -1
  11. package/dist/dts/observation/observable.d.ts +51 -50
  12. package/dist/dts/platform.d.ts +37 -0
  13. package/dist/dts/styles/css-directive.d.ts +2 -2
  14. package/dist/dts/styles/css.d.ts +2 -2
  15. package/dist/dts/styles/element-styles.d.ts +1 -1
  16. package/dist/dts/templating/binding.d.ts +3 -3
  17. package/dist/dts/templating/children.d.ts +2 -2
  18. package/dist/dts/templating/compiler.d.ts +1 -1
  19. package/dist/dts/templating/html-directive.d.ts +1 -1
  20. package/dist/dts/templating/node-observation.d.ts +1 -1
  21. package/dist/dts/templating/ref.d.ts +2 -2
  22. package/dist/dts/templating/repeat.d.ts +6 -6
  23. package/dist/dts/templating/slotted.d.ts +2 -2
  24. package/dist/dts/templating/template.d.ts +3 -3
  25. package/dist/dts/templating/view.d.ts +2 -2
  26. package/dist/dts/templating/when.d.ts +2 -2
  27. package/dist/esm/components/attributes.js +2 -2
  28. package/dist/esm/components/controller.js +4 -4
  29. package/dist/esm/components/fast-definitions.js +31 -14
  30. package/dist/esm/components/fast-element.js +2 -2
  31. package/dist/esm/dom.js +55 -50
  32. package/dist/esm/index.js +23 -23
  33. package/dist/esm/observation/array-change-records.js +1 -1
  34. package/dist/esm/observation/array-observer.js +12 -6
  35. package/dist/esm/observation/observable.js +244 -236
  36. package/dist/esm/platform.js +23 -0
  37. package/dist/esm/styles/css.js +2 -2
  38. package/dist/esm/styles/element-styles.js +1 -1
  39. package/dist/esm/templating/binding.js +5 -5
  40. package/dist/esm/templating/children.js +2 -2
  41. package/dist/esm/templating/compiler.js +2 -2
  42. package/dist/esm/templating/html-directive.js +1 -1
  43. package/dist/esm/templating/node-observation.js +2 -2
  44. package/dist/esm/templating/ref.js +1 -1
  45. package/dist/esm/templating/repeat.js +6 -6
  46. package/dist/esm/templating/slotted.js +2 -2
  47. package/dist/esm/templating/template.js +6 -6
  48. package/dist/fast-element.api.json +43 -48
  49. package/dist/fast-element.d.ts +53 -13
  50. package/dist/fast-element.js +428 -344
  51. package/dist/fast-element.min.js +1 -1
  52. package/docs/api-report.md +39 -12
  53. package/docs/guide/observables-and-state.md +10 -8
  54. package/docs/guide/using-directives.md +1 -1
  55. package/karma.conf.cjs +152 -0
  56. package/package.json +11 -10
@@ -1 +1 @@
1
- const t=function(){if("undefined"!=typeof globalThis)return globalThis;if("undefined"!=typeof global)return global;if("undefined"!=typeof self)return self;if("undefined"!=typeof window)return window;try{return new Function("return this")()}catch(t){return{}}}();void 0===t.trustedTypes&&(t.trustedTypes={createPolicy:(t,e)=>e});const e=Object.freeze([]),s=[],i=t.trustedTypes.createPolicy("fast-html",{createHTML:t=>t});let n=i;const r=[];function o(){if(r.length)throw r.shift()}function l(t){try{t.call()}catch(t){r.push(t),setTimeout(o,0)}}const h="fast-"+Math.random().toString(36).substring(2,8),a=h+"{",c="}"+h,d=Object.freeze({supportsAdoptedStyleSheets:Array.isArray(document.adoptedStyleSheets)&&"replace"in CSSStyleSheet.prototype,setHTMLPolicy(t){if(n!==i)throw new Error("The HTML policy can only be set once.");n=t},createHTML:t=>n.createHTML(t),isMarker:t=>t&&8===t.nodeType&&t.data.startsWith(h),extractDirectiveIndexFromMarker:t=>parseInt(t.data.replace(h+":","")),createInterpolationPlaceholder:t=>`${a}${t}${c}`,createCustomAttributePlaceholder(t,e){return`${t}="${this.createInterpolationPlaceholder(e)}"`},createBlockPlaceholder:t=>`\x3c!--${h}:${t}--\x3e`,queueUpdate(t){s.length<1&&window.requestAnimationFrame(d.processUpdates),s.push(t)},processUpdates(){let t=0;for(;t<s.length;)if(l(s[t]),t++,t>1024){for(let e=0,i=s.length-t;e<i;e++)s[e]=s[e+t];s.length-=t,t=0}s.length=0},nextUpdate:()=>new Promise(t=>{d.queueUpdate(t)}),setAttribute(t,e,s){null==s?t.removeAttribute(e):t.setAttribute(e,s)},setBooleanAttribute(t,e,s){s?t.setAttribute(e,""):t.removeAttribute(e)},removeChildNodes(t){for(let e=t.firstChild;null!==e;e=t.firstChild)t.removeChild(e)},createTemplateWalker:t=>document.createTreeWalker(t,133,null,!1)});function u(t){const e=this.spillover;-1===e.indexOf(t)&&e.push(t)}function f(t){const e=this.spillover,s=e.indexOf(t);-1!==s&&e.splice(s,1)}function p(t){const e=this.spillover,s=this.source;for(let i=0,n=e.length;i<n;++i)e[i].handleChange(s,t)}function g(t){return-1!==this.spillover.indexOf(t)}class b{constructor(t,e){this.sub1=void 0,this.sub2=void 0,this.spillover=void 0,this.source=t,this.sub1=e}has(t){return this.sub1===t||this.sub2===t}subscribe(t){this.has(t)||(void 0!==this.sub1?void 0!==this.sub2?(this.spillover=[this.sub1,this.sub2,t],this.subscribe=u,this.unsubscribe=f,this.notify=p,this.has=g,this.sub1=void 0,this.sub2=void 0):this.sub2=t:this.sub1=t)}unsubscribe(t){this.sub1===t?this.sub1=void 0:this.sub2===t&&(this.sub2=void 0)}notify(t){const e=this.sub1,s=this.sub2,i=this.source;void 0!==e&&e.handleChange(i,t),void 0!==s&&s.handleChange(i,t)}}class v{constructor(t){this.subscribers={},this.sourceSubscribers=null,this.source=t}notify(t){var e;const s=this.subscribers[t];void 0!==s&&s.notify(t),null===(e=this.sourceSubscribers)||void 0===e||e.notify(t)}subscribe(t,e){var s;if(e){let s=this.subscribers[e];void 0===s&&(this.subscribers[e]=s=new b(this.source)),s.subscribe(t)}else this.sourceSubscribers=null!==(s=this.sourceSubscribers)&&void 0!==s?s:new b(this.source),this.sourceSubscribers.subscribe(t)}unsubscribe(t,e){var s;if(e){const s=this.subscribers[e];void 0!==s&&s.unsubscribe(t)}else null===(s=this.sourceSubscribers)||void 0===s||s.unsubscribe(t)}}const m=/(:|&&|\|\||if)/,y=new WeakMap,C=new WeakMap;let x=void 0,w=t=>{throw new Error("Must call enableArrayObservation before observing arrays.")};class S{constructor(t){this.name=t,this.field="_"+t,this.callback=t+"Changed"}getValue(t){return void 0!==x&&x.watch(t,this.name),t[this.field]}setValue(t,e){const s=this.field,i=t[s];if(i!==e){t[s]=e;const n=t[this.callback];"function"==typeof n&&n.call(t,i,e),T(t).notify(this.name)}}}const B=Object.freeze({setArrayObserverFactory(t){w=t},getNotifier(t){let e=t.$fastController||y.get(t);return void 0===e&&(Array.isArray(t)?e=w(t):y.set(t,e=new v(t))),e},track(t,e){void 0!==x&&x.watch(t,e)},trackVolatile(){void 0!==x&&(x.needsRefresh=!0)},notify(t,e){T(t).notify(e)},defineProperty(t,e){"string"==typeof e&&(e=new S(e)),this.getAccessors(t).push(e),Reflect.defineProperty(t,e.name,{enumerable:!0,get:function(){return e.getValue(this)},set:function(t){e.setValue(this,t)}})},getAccessors(t){let e=C.get(t);if(void 0===e){let s=Reflect.getPrototypeOf(t);for(;void 0===e&&null!==s;)e=C.get(s),s=Reflect.getPrototypeOf(s);e=void 0===e?[]:e.slice(0),C.set(t,e)}return e},binding(t,e,s=this.isVolatileBinding(t)){return new I(t,e,s)},isVolatileBinding:t=>m.test(t.toString())}),T=B.getNotifier,O=B.trackVolatile,N=d.queueUpdate;function A(t,e){B.defineProperty(t,e)}function k(t,e,s){return Object.assign({},s,{get:function(){return O(),s.get.apply(this)}})}let V=null;function F(t){V=t}class ${constructor(){this.index=0,this.length=0,this.parent=null,this.parentContext=null}get event(){return V}get isEven(){return this.index%2==0}get isOdd(){return this.index%2!=0}get isFirst(){return 0===this.index}get isInMiddle(){return!this.isFirst&&!this.isLast}get isLast(){return this.index===this.length-1}}B.defineProperty($.prototype,"index"),B.defineProperty($.prototype,"length");const _=Object.seal(new $);class I extends b{constructor(t,e,s=!1){super(t,e),this.binding=t,this.isVolatileBinding=s,this.needsRefresh=!0,this.needsQueue=!0,this.first=this,this.last=null,this.propertySource=void 0,this.propertyName=void 0,this.notifier=void 0,this.next=void 0}observe(t,e){this.needsRefresh&&null!==this.last&&this.disconnect();const s=x;x=this.needsRefresh?this:void 0,this.needsRefresh=this.isVolatileBinding;const i=this.binding(t,e);return x=s,i}disconnect(){if(null!==this.last){let t=this.first;for(;void 0!==t;)t.notifier.unsubscribe(this,t.propertyName),t=t.next;this.last=null,this.needsRefresh=this.needsQueue=!0}}watch(t,e){const s=this.last,i=T(t),n=null===s?this.first:{};if(n.propertySource=t,n.propertyName=e,n.notifier=i,i.subscribe(this,e),null!==s){if(!this.needsRefresh){let e;x=void 0,e=s.propertySource[s.propertyName],x=this,t===e&&(this.needsRefresh=!0)}s.next=n}this.last=n}handleChange(){this.needsQueue&&(this.needsQueue=!1,N(this))}call(){null!==this.last&&(this.needsQueue=!0,this.notify(this))}records(){let t=this.first;return{next:()=>{const e=t;return void 0===e?{value:void 0,done:!0}:(t=t.next,{value:e,done:!1})},[Symbol.iterator]:function(){return this}}}}class M{constructor(){this.targetIndex=0}}class E extends M{constructor(){super(...arguments),this.createPlaceholder=d.createInterpolationPlaceholder}}class L extends M{constructor(t,e,s){super(),this.name=t,this.behavior=e,this.options=s}createPlaceholder(t){return d.createCustomAttributePlaceholder(this.name,t)}createBehavior(t){return new this.behavior(t,this.options)}}function P(t,e){this.source=t,this.context=e,null===this.bindingObserver&&(this.bindingObserver=B.binding(this.binding,this,this.isBindingVolatile)),this.updateTarget(this.bindingObserver.observe(t,e))}function j(t,e){this.source=t,this.context=e,this.target.addEventListener(this.targetName,this)}function R(){this.bindingObserver.disconnect(),this.source=null,this.context=null}function z(){this.bindingObserver.disconnect(),this.source=null,this.context=null;const t=this.target.$fastView;void 0!==t&&t.isComposed&&(t.unbind(),t.needsBindOnly=!0)}function H(){this.target.removeEventListener(this.targetName,this),this.source=null,this.context=null}function U(t){d.setAttribute(this.target,this.targetName,t)}function Q(t){d.setBooleanAttribute(this.target,this.targetName,t)}function q(t){if(null==t&&(t=""),t.create){this.target.textContent="";let e=this.target.$fastView;void 0===e?e=t.create():this.target.$fastTemplate!==t&&(e.isComposed&&(e.remove(),e.unbind()),e=t.create()),e.isComposed?e.needsBindOnly&&(e.needsBindOnly=!1,e.bind(this.source,this.context)):(e.isComposed=!0,e.bind(this.source,this.context),e.insertBefore(this.target),this.target.$fastView=e,this.target.$fastTemplate=t)}else{const e=this.target.$fastView;void 0!==e&&e.isComposed&&(e.isComposed=!1,e.remove(),e.needsBindOnly?e.needsBindOnly=!1:e.unbind()),this.target.textContent=t}}function W(t){this.target[this.targetName]=t}function D(t){const e=this.classVersions||Object.create(null),s=this.target;let i=this.version||0;if(null!=t&&t.length){const n=t.split(/\s+/);for(let t=0,r=n.length;t<r;++t){const r=n[t];""!==r&&(e[r]=i,s.classList.add(r))}}if(this.classVersions=e,this.version=i+1,0!==i){i-=1;for(const t in e)e[t]===i&&s.classList.remove(t)}}class G extends E{constructor(t){super(),this.binding=t,this.bind=P,this.unbind=R,this.updateTarget=U,this.isBindingVolatile=B.isVolatileBinding(this.binding)}get targetName(){return this.originalTargetName}set targetName(t){if(this.originalTargetName=t,void 0!==t)switch(t[0]){case":":if(this.cleanedTargetName=t.substr(1),this.updateTarget=W,"innerHTML"===this.cleanedTargetName){const t=this.binding;this.binding=(e,s)=>d.createHTML(t(e,s))}break;case"?":this.cleanedTargetName=t.substr(1),this.updateTarget=Q;break;case"@":this.cleanedTargetName=t.substr(1),this.bind=j,this.unbind=H;break;default:this.cleanedTargetName=t,"class"===t&&(this.updateTarget=D)}}targetAtContent(){this.updateTarget=q,this.unbind=z}createBehavior(t){return new J(t,this.binding,this.isBindingVolatile,this.bind,this.unbind,this.updateTarget,this.cleanedTargetName)}}class J{constructor(t,e,s,i,n,r,o){this.source=null,this.context=null,this.bindingObserver=null,this.target=t,this.binding=e,this.isBindingVolatile=s,this.bind=i,this.unbind=n,this.updateTarget=r,this.targetName=o}handleChange(){this.updateTarget(this.bindingObserver.observe(this.source,this.context))}handleEvent(t){F(t);const e=this.binding(this.source,this.context);F(null),!0!==e&&t.preventDefault()}}let K=null;class X{addFactory(t){t.targetIndex=this.targetIndex,this.behaviorFactories.push(t)}captureContentBinding(t){t.targetAtContent(),this.addFactory(t)}reset(){this.behaviorFactories=[],this.targetIndex=-1}release(){K=this}static borrow(t){const e=K||new X;return e.directives=t,e.reset(),K=null,e}}function Y(t){if(1===t.length)return t[0];let e;const s=t.length,i=t.map(t=>"string"==typeof t?()=>t:(e=t.targetName||e,t.binding)),n=new G((t,e)=>{let n="";for(let r=0;r<s;++r)n+=i[r](t,e);return n});return n.targetName=e,n}const Z=c.length;function tt(t,e){const s=e.split(a);if(1===s.length)return null;const i=[];for(let e=0,n=s.length;e<n;++e){const n=s[e],r=n.indexOf(c);let o;if(-1===r)o=n;else{const e=parseInt(n.substring(0,r));i.push(t.directives[e]),o=n.substring(r+Z)}""!==o&&i.push(o)}return i}function et(t,e,s=!1){const i=e.attributes;for(let n=0,r=i.length;n<r;++n){const o=i[n],l=o.value,h=tt(t,l);let a=null;null===h?s&&(a=new G(()=>l),a.targetName=o.name):a=Y(h),null!==a&&(e.removeAttributeNode(o),n--,r--,t.addFactory(a))}}function st(t,e,s){const i=tt(t,e.textContent);if(null!==i){let n=e;for(let r=0,o=i.length;r<o;++r){const o=i[r],l=0===r?e:n.parentNode.insertBefore(document.createTextNode(""),n.nextSibling);"string"==typeof o?l.textContent=o:(l.textContent=" ",t.captureContentBinding(o)),n=l,t.targetIndex++,l!==e&&s.nextNode()}t.targetIndex--}}function it(t,e){const s=t.content;document.adoptNode(s);const i=X.borrow(e);et(i,t,!0);const n=i.behaviorFactories;i.reset();const r=d.createTemplateWalker(s);let o;for(;o=r.nextNode();)switch(i.targetIndex++,o.nodeType){case 1:et(i,o);break;case 3:st(i,o,r);break;case 8:d.isMarker(o)&&i.addFactory(e[d.extractDirectiveIndexFromMarker(o)])}let l=0;(d.isMarker(s.firstChild)||1===s.childNodes.length&&e.length)&&(s.insertBefore(document.createComment(""),s.firstChild),l=-1);const h=i.behaviorFactories;return i.release(),{fragment:s,viewBehaviorFactories:h,hostBehaviorFactories:n,targetOffset:l}}const nt=document.createRange();class rt{constructor(t,e){this.fragment=t,this.behaviors=e,this.source=null,this.context=null,this.firstChild=t.firstChild,this.lastChild=t.lastChild}appendTo(t){t.appendChild(this.fragment)}insertBefore(t){if(this.fragment.hasChildNodes())t.parentNode.insertBefore(this.fragment,t);else{const e=t.parentNode,s=this.lastChild;let i,n=this.firstChild;for(;n!==s;)i=n.nextSibling,e.insertBefore(n,t),n=i;e.insertBefore(s,t)}}remove(){const t=this.fragment,e=this.lastChild;let s,i=this.firstChild;for(;i!==e;)s=i.nextSibling,t.appendChild(i),i=s;t.appendChild(e)}dispose(){const t=this.firstChild.parentNode,e=this.lastChild;let s,i=this.firstChild;for(;i!==e;)s=i.nextSibling,t.removeChild(i),i=s;t.removeChild(e);const n=this.behaviors,r=this.source;for(let t=0,e=n.length;t<e;++t)n[t].unbind(r)}bind(t,e){const s=this.behaviors;if(this.source!==t)if(null!==this.source){const i=this.source;this.source=t,this.context=e;for(let n=0,r=s.length;n<r;++n){const r=s[n];r.unbind(i),r.bind(t,e)}}else{this.source=t,this.context=e;for(let i=0,n=s.length;i<n;++i)s[i].bind(t,e)}}unbind(){if(null===this.source)return;const t=this.behaviors,e=this.source;for(let s=0,i=t.length;s<i;++s)t[s].unbind(e);this.source=null}static disposeContiguousBatch(t){if(0!==t.length){nt.setStartBefore(t[0].firstChild),nt.setEndAfter(t[t.length-1].lastChild),nt.deleteContents();for(let e=0,s=t.length;e<s;++e){const s=t[e],i=s.behaviors,n=s.source;for(let t=0,e=i.length;t<e;++t)i[t].unbind(n)}}}}class ot{constructor(t,e){this.behaviorCount=0,this.hasHostBehaviors=!1,this.fragment=null,this.targetOffset=0,this.viewBehaviorFactories=null,this.hostBehaviorFactories=null,this.html=t,this.directives=e}create(t){if(null===this.fragment){let t;const e=this.html;if("string"==typeof e){t=document.createElement("template"),t.innerHTML=d.createHTML(e);const s=t.content.firstElementChild;null!==s&&"TEMPLATE"===s.tagName&&(t=s)}else t=e;const s=it(t,this.directives);this.fragment=s.fragment,this.viewBehaviorFactories=s.viewBehaviorFactories,this.hostBehaviorFactories=s.hostBehaviorFactories,this.targetOffset=s.targetOffset,this.behaviorCount=this.viewBehaviorFactories.length+this.hostBehaviorFactories.length,this.hasHostBehaviors=this.hostBehaviorFactories.length>0}const e=this.fragment.cloneNode(!0),s=this.viewBehaviorFactories,i=new Array(this.behaviorCount),n=d.createTemplateWalker(e);let r=0,o=this.targetOffset,l=n.nextNode();for(let t=s.length;r<t;++r){const t=s[r],e=t.targetIndex;for(;null!==l;){if(o===e){i[r]=t.createBehavior(l);break}l=n.nextNode(),o++}}if(this.hasHostBehaviors){const e=this.hostBehaviorFactories;for(let s=0,n=e.length;s<n;++s,++r)i[r]=e[s].createBehavior(t)}return new rt(e,i)}render(t,e,s){"string"==typeof e&&(e=document.getElementById(e)),void 0===s&&(s=e);const i=this.create(s);return i.bind(t,_),i.appendTo(e),i}}const lt=/([ \x09\x0a\x0c\x0d])([^\0-\x1F\x7F-\x9F "'>=/]+)([ \x09\x0a\x0c\x0d]*=[ \x09\x0a\x0c\x0d]*(?:[^ \x09\x0a\x0c\x0d"'`<>=]*|"[^"]*|'[^']*))$/;function ht(t,...e){const s=[];let i="";for(let n=0,r=t.length-1;n<r;++n){const r=t[n];let o=e[n];if(i+=r,o instanceof ot){const t=o;o=()=>t}if("function"==typeof o&&(o=new G(o)),o instanceof E){const t=lt.exec(r);null!==t&&(o.targetName=t[2])}o instanceof M?(i+=o.createPlaceholder(s.length),s.push(o)):i+=o}return i+=t[t.length-1],new ot(i,s)}class at{constructor(){this.targets=new WeakSet,this.behaviors=null}addStylesTo(t){this.targets.add(t)}removeStylesFrom(t){this.targets.delete(t)}isAttachedTo(t){return this.targets.has(t)}withBehaviors(...t){return this.behaviors=null===this.behaviors?t:this.behaviors.concat(t),this}}function ct(t){return t.map(t=>t instanceof at?ct(t.styles):[t]).reduce((t,e)=>t.concat(e),[])}function dt(t){return t.map(t=>t instanceof at?t.behaviors:null).reduce((t,e)=>null===e?t:(null===t&&(t=[]),t.concat(e)),null)}at.create=(()=>{if(d.supportsAdoptedStyleSheets){const t=new Map;return e=>new ut(e,t)}return t=>new pt(t)})();class ut extends at{constructor(t,e){super(),this.styles=t,this.styleSheetCache=e,this._styleSheets=void 0,this.behaviors=dt(t)}get styleSheets(){if(void 0===this._styleSheets){const t=this.styles,e=this.styleSheetCache;this._styleSheets=ct(t).map(t=>{if(t instanceof CSSStyleSheet)return t;let s=e.get(t);return void 0===s&&(s=new CSSStyleSheet,s.replaceSync(t),e.set(t,s)),s})}return this._styleSheets}addStylesTo(t){t.adoptedStyleSheets=[...t.adoptedStyleSheets,...this.styleSheets],super.addStylesTo(t)}removeStylesFrom(t){const e=this.styleSheets;t.adoptedStyleSheets=t.adoptedStyleSheets.filter(t=>-1===e.indexOf(t)),super.removeStylesFrom(t)}}let ft=0;class pt extends at{constructor(t){super(),this.styles=t,this.behaviors=null,this.behaviors=dt(t),this.styleSheets=ct(t),this.styleClass="fast-style-class-"+ ++ft}addStylesTo(t){const e=this.styleSheets,s=this.styleClass;t=this.normalizeTarget(t);for(let i=0;i<e.length;i++){const n=document.createElement("style");n.innerHTML=e[i],n.className=s,t.append(n)}super.addStylesTo(t)}removeStylesFrom(t){const e=(t=this.normalizeTarget(t)).querySelectorAll("."+this.styleClass);for(let s=0,i=e.length;s<i;++s)t.removeChild(e[s]);super.removeStylesFrom(t)}isAttachedTo(t){return super.isAttachedTo(this.normalizeTarget(t))}normalizeTarget(t){return t===document?document.body:t}}const gt={toView:t=>t?"true":"false",fromView:t=>null!=t&&"false"!==t&&!1!==t&&0!==t},bt={toView(t){if(null==t)return null;const e=1*t;return isNaN(e)?null:e.toString()},fromView(t){if(null==t)return null;const e=1*t;return isNaN(e)?null:e}};class vt{constructor(t,e,s=e.toLowerCase(),i="reflect",n){this.guards=new Set,this.Owner=t,this.name=e,this.attribute=s,this.mode=i,this.converter=n,this.fieldName="_"+e,this.callbackName=e+"Changed",this.hasCallback=this.callbackName in t.prototype,"boolean"===i&&void 0===n&&(this.converter=gt)}setValue(t,e){const s=t[this.fieldName],i=this.converter;void 0!==i&&(e=i.fromView(e)),s!==e&&(t[this.fieldName]=e,this.tryReflectToAttribute(t),this.hasCallback&&t[this.callbackName](s,e),t.$fastController.notify(this.name))}getValue(t){return B.track(t,this.name),t[this.fieldName]}onAttributeChangedCallback(t,e){this.guards.has(t)||(this.guards.add(t),this.setValue(t,e),this.guards.delete(t))}tryReflectToAttribute(t){const e=this.mode,s=this.guards;s.has(t)||"fromView"===e||d.queueUpdate(()=>{s.add(t);const i=t[this.fieldName];switch(e){case"reflect":const e=this.converter;d.setAttribute(t,this.attribute,void 0!==e?e.toView(i):i);break;case"boolean":d.setBooleanAttribute(t,this.attribute,i)}s.delete(t)})}static collect(t,...e){const s=[];e.push(t.attributes);for(let i=0,n=e.length;i<n;++i){const n=e[i];if(void 0!==n)for(let e=0,i=n.length;e<i;++e){const i=n[e];"string"==typeof i?s.push(new vt(t,i)):s.push(new vt(t,i.property,i.attribute,i.mode,i.converter))}}return s}}function mt(t,e){let s;function i(t,e){arguments.length>1&&(s.property=e);const i=t.constructor.attributes||(t.constructor.attributes=[]);i.push(s)}return arguments.length>1?(s={},void i(t,e)):(s=void 0===t?{}:t,i)}const yt={mode:"open"},Ct={},xt=new Map;class wt{constructor(t,e=t.definition){"string"==typeof e&&(e={name:e}),this.type=t,this.name=e.name,this.template=e.template;const s=vt.collect(t,e.attributes),i=new Array(s.length),n={},r={};for(let t=0,e=s.length;t<e;++t){const e=s[t];i[t]=e.attribute,n[e.name]=e,r[e.attribute]=e}this.attributes=s,this.observedAttributes=i,this.propertyLookup=n,this.attributeLookup=r,this.shadowOptions=void 0===e.shadowOptions?yt:null===e.shadowOptions?void 0:Object.assign(Object.assign({},yt),e.shadowOptions),this.elementOptions=void 0===e.elementOptions?Ct:Object.assign(Object.assign({},Ct),e.elementOptions),this.styles=void 0===e.styles?void 0:Array.isArray(e.styles)?at.create(e.styles):e.styles instanceof at?e.styles:at.create([e.styles])}define(t=customElements){const e=this.type;if(!this.isDefined){const t=this.attributes,s=e.prototype;for(let e=0,i=t.length;e<i;++e)B.defineProperty(s,t[e]);Reflect.defineProperty(e,"observedAttributes",{value:this.observedAttributes,enumerable:!0}),xt.set(e,this),this.isDefined=!0}return t.get(this.name)||t.define(this.name,e,this.elementOptions),this}static forType(t){return xt.get(t)}}const St=new WeakMap,Bt={bubbles:!0,composed:!0,cancelable:!0};function Tt(t){return t.shadowRoot||St.get(t)||null}class Ot extends v{constructor(t,e){super(t),this.boundObservables=null,this.behaviors=null,this.needsInitialization=!0,this._template=null,this._styles=null,this._isConnected=!1,this.$fastController=this,this.view=null,this.element=t,this.definition=e;const s=e.shadowOptions;if(void 0!==s){const e=t.attachShadow(s);"closed"===s.mode&&St.set(t,e)}const i=B.getAccessors(t);if(i.length>0){const e=this.boundObservables=Object.create(null);for(let s=0,n=i.length;s<n;++s){const n=i[s].name,r=t[n];void 0!==r&&(delete t[n],e[n]=r)}}}get isConnected(){return B.track(this,"isConnected"),this._isConnected}setIsConnected(t){this._isConnected=t,B.notify(this,"isConnected")}get template(){return this._template}set template(t){this._template!==t&&(this._template=t,this.needsInitialization||this.renderTemplate(t))}get styles(){return this._styles}set styles(t){this._styles!==t&&(null!==this._styles&&this.removeStyles(this._styles),this._styles=t,this.needsInitialization||null===t||this.addStyles(t))}addStyles(t){const e=Tt(this.element)||this.element.getRootNode();if(t instanceof HTMLStyleElement)e.append(t);else if(!t.isAttachedTo(e)){const s=t.behaviors;t.addStylesTo(e),null!==s&&this.addBehaviors(s)}}removeStyles(t){const e=Tt(this.element)||this.element.getRootNode();if(t instanceof HTMLStyleElement)e.removeChild(t);else if(t.isAttachedTo(e)){const s=t.behaviors;t.removeStylesFrom(e),null!==s&&this.removeBehaviors(s)}}addBehaviors(t){const e=this.behaviors||(this.behaviors=new Map),s=t.length,i=[];for(let n=0;n<s;++n){const s=t[n];e.has(s)?e.set(s,e.get(s)+1):(e.set(s,1),i.push(s))}if(this._isConnected){const t=this.element;for(let e=0;e<i.length;++e)i[e].bind(t,_)}}removeBehaviors(t,e=!1){const s=this.behaviors;if(null===s)return;const i=t.length,n=[];for(let r=0;r<i;++r){const i=t[r];if(s.has(i)){const t=s.get(i)-1;0===t||e?s.delete(i)&&n.push(i):s.set(i,t)}}if(this._isConnected){const t=this.element;for(let e=0;e<n.length;++e)n[e].unbind(t)}}onConnectedCallback(){if(this._isConnected)return;const t=this.element;this.needsInitialization?this.finishInitialization():null!==this.view&&this.view.bind(t,_);const e=this.behaviors;if(null!==e)for(const[s]of e)s.bind(t,_);this.setIsConnected(!0)}onDisconnectedCallback(){if(!this._isConnected)return;this.setIsConnected(!1);const t=this.view;null!==t&&t.unbind();const e=this.behaviors;if(null!==e){const t=this.element;for(const[s]of e)s.unbind(t)}}onAttributeChangedCallback(t,e,s){const i=this.definition.attributeLookup[t];void 0!==i&&i.onAttributeChangedCallback(this.element,s)}emit(t,e,s){return!!this._isConnected&&this.element.dispatchEvent(new CustomEvent(t,Object.assign(Object.assign({detail:e},Bt),s)))}finishInitialization(){const t=this.element,e=this.boundObservables;if(null!==e){const s=Object.keys(e);for(let i=0,n=s.length;i<n;++i){const n=s[i];t[n]=e[n]}this.boundObservables=null}const s=this.definition;null===this._template&&(this.element.resolveTemplate?this._template=this.element.resolveTemplate():s.template&&(this._template=s.template||null)),null!==this._template&&this.renderTemplate(this._template),null===this._styles&&(this.element.resolveStyles?this._styles=this.element.resolveStyles():s.styles&&(this._styles=s.styles||null)),null!==this._styles&&this.addStyles(this._styles),this.needsInitialization=!1}renderTemplate(t){const e=this.element,s=Tt(e)||e;null!==this.view?(this.view.dispose(),this.view=null):this.needsInitialization||d.removeChildNodes(s),t&&(this.view=t.render(e,s,e))}static forCustomElement(t){const e=t.$fastController;if(void 0!==e)return e;const s=wt.forType(t.constructor);if(void 0===s)throw new Error("Missing FASTElement definition.");return t.$fastController=new Ot(t,s)}}function Nt(t){return class extends t{constructor(){super(),Ot.forCustomElement(this)}$emit(t,e,s){return this.$fastController.emit(t,e,s)}connectedCallback(){this.$fastController.onConnectedCallback()}disconnectedCallback(){this.$fastController.onDisconnectedCallback()}attributeChangedCallback(t,e,s){this.$fastController.onAttributeChangedCallback(t,e,s)}}}const At=Object.assign(Nt(HTMLElement),{from:t=>Nt(t),define:(t,e)=>new wt(t,e).define().type});function kt(t){return function(e){new wt(e,t).define()}}class Vt{createCSS(){return""}createBehavior(){}}function Ft(t,e){const s=[];let i="";const n=[];for(let r=0,o=t.length-1;r<o;++r){i+=t[r];let o=e[r];if(o instanceof Vt){const t=o.createBehavior();o=o.createCSS(),t&&n.push(t)}o instanceof at||o instanceof CSSStyleSheet?(""!==i.trim()&&(s.push(i),i=""),s.push(o)):i+=o}return i+=t[t.length-1],""!==i.trim()&&s.push(i),{styles:s,behaviors:n}}function $t(t,...e){const{styles:s,behaviors:i}=Ft(t,e),n=at.create(s);return i.length&&n.withBehaviors(...i),n}class _t extends Vt{constructor(t,e){super(),this.behaviors=e,this.css="";const s=t.reduce((t,e)=>("string"==typeof e?this.css+=e:t.push(e),t),[]);s.length&&(this.styles=at.create(s))}createBehavior(){return this}createCSS(){return this.css}bind(t){this.styles&&t.$fastController.addStyles(this.styles),this.behaviors.length&&t.$fastController.addBehaviors(this.behaviors)}unbind(t){this.styles&&t.$fastController.removeStyles(this.styles),this.behaviors.length&&t.$fastController.removeBehaviors(this.behaviors)}}function It(t,...e){const{styles:s,behaviors:i}=Ft(t,e);return new _t(s,i)}function Mt(t,e,s){return{index:t,removed:e,addedCount:s}}function Et(t,s,i,n,r,o){let l=0,h=0;const a=Math.min(i-s,o-r);if(0===s&&0===r&&(l=function(t,e,s){for(let i=0;i<s;++i)if(t[i]!==e[i])return i;return s}(t,n,a)),i===t.length&&o===n.length&&(h=function(t,e,s){let i=t.length,n=e.length,r=0;for(;r<s&&t[--i]===e[--n];)r++;return r}(t,n,a-l)),r+=l,o-=h,(i-=h)-(s+=l)==0&&o-r==0)return e;if(s===i){const t=Mt(s,[],0);for(;r<o;)t.removed.push(n[r++]);return[t]}if(r===o)return[Mt(s,[],i-s)];const c=function(t){let e=t.length-1,s=t[0].length-1,i=t[e][s];const n=[];for(;e>0||s>0;){if(0===e){n.push(2),s--;continue}if(0===s){n.push(3),e--;continue}const r=t[e-1][s-1],o=t[e-1][s],l=t[e][s-1];let h;h=o<l?o<r?o:r:l<r?l:r,h===r?(r===i?n.push(0):(n.push(1),i=r),e--,s--):h===o?(n.push(3),e--,i=o):(n.push(2),s--,i=l)}return n.reverse(),n}(function(t,e,s,i,n,r){const o=r-n+1,l=s-e+1,h=new Array(o);let a,c;for(let t=0;t<o;++t)h[t]=new Array(l),h[t][0]=t;for(let t=0;t<l;++t)h[0][t]=t;for(let s=1;s<o;++s)for(let r=1;r<l;++r)t[e+r-1]===i[n+s-1]?h[s][r]=h[s-1][r-1]:(a=h[s-1][r]+1,c=h[s][r-1]+1,h[s][r]=a<c?a:c);return h}(t,s,i,n,r,o)),d=[];let u=void 0,f=s,p=r;for(let t=0;t<c.length;++t)switch(c[t]){case 0:void 0!==u&&(d.push(u),u=void 0),f++,p++;break;case 1:void 0===u&&(u=Mt(f,[],0)),u.addedCount++,f++,u.removed.push(n[p]),p++;break;case 2:void 0===u&&(u=Mt(f,[],0)),u.addedCount++,f++;break;case 3:void 0===u&&(u=Mt(f,[],0)),u.removed.push(n[p]),p++}return void 0!==u&&d.push(u),d}const Lt=Array.prototype.push;function Pt(t,e,s,i){const n=Mt(e,s,i);let r=!1,o=0;for(let e=0;e<t.length;e++){const s=t[e];if(s.index+=o,r)continue;const i=(l=n.index,h=n.index+n.removed.length,a=s.index,c=s.index+s.addedCount,h<a||c<l?-1:h===a||c===l?0:l<a?h<c?h-a:c-a:c<h?c-l:h-l);if(i>=0){t.splice(e,1),e--,o-=s.addedCount-s.removed.length,n.addedCount+=s.addedCount-i;const l=n.removed.length+s.removed.length-i;if(n.addedCount||l){let t=s.removed;if(n.index<s.index){const e=n.removed.slice(0,s.index-n.index);Lt.apply(e,t),t=e}if(n.index+n.removed.length>s.index+s.addedCount){const e=n.removed.slice(s.index+s.addedCount-n.index);Lt.apply(t,e)}n.removed=t,s.index<n.index&&(n.index=s.index)}else r=!0}else if(n.index<s.index){r=!0,t.splice(e,0,n),e++;const i=n.addedCount-n.removed.length;s.index+=i,o+=i}}var l,h,a,c;r||t.push(n)}function jt(t,e){let s=[];const i=function(t){const e=[];for(let s=0,i=t.length;s<i;s++){const i=t[s];Pt(e,i.index,i.removed,i.addedCount)}return e}(e);for(let e=0,n=i.length;e<n;++e){const n=i[e];1!==n.addedCount||1!==n.removed.length?s=s.concat(Et(t,n.index,n.index+n.addedCount,n.removed,0,n.removed.length)):n.removed[0]!==t[n.index]&&s.push(n)}return s}let Rt=!1;function zt(t,e){let s=t.index;const i=e.length;return s>i?s=i-t.addedCount:s<0&&(s=i+t.removed.length+s-t.addedCount),s<0&&(s=0),t.index=s,t}class Ht extends b{constructor(t){super(t),this.oldCollection=void 0,this.splices=void 0,this.needsQueue=!0,this.call=this.flush,t.$fastController=this}addSplice(t){void 0===this.splices?this.splices=[t]:this.splices.push(t),this.needsQueue&&(this.needsQueue=!1,d.queueUpdate(this))}reset(t){this.oldCollection=t,this.needsQueue&&(this.needsQueue=!1,d.queueUpdate(this))}flush(){const t=this.splices,e=this.oldCollection;if(void 0===t&&void 0===e)return;this.needsQueue=!0,this.splices=void 0,this.oldCollection=void 0;const s=void 0===e?jt(this.source,t):Et(this.source,0,this.source.length,e,0,e.length);this.notify(s)}}function Ut(){if(Rt)return;Rt=!0,B.setArrayObserverFactory(t=>new Ht(t));const t=Array.prototype;if(t.$fastPatch)return;t.$fastPatch=!0;const e=t.pop,s=t.push,i=t.reverse,n=t.shift,r=t.sort,o=t.splice,l=t.unshift;t.pop=function(){const t=this.length>0,s=e.apply(this,arguments),i=this.$fastController;return void 0!==i&&t&&i.addSplice(Mt(this.length,[s],0)),s},t.push=function(){const t=s.apply(this,arguments),e=this.$fastController;return void 0!==e&&e.addSplice(zt(Mt(this.length-arguments.length,[],arguments.length),this)),t},t.reverse=function(){let t;const e=this.$fastController;void 0!==e&&(e.flush(),t=this.slice());const s=i.apply(this,arguments);return void 0!==e&&e.reset(t),s},t.shift=function(){const t=this.length>0,e=n.apply(this,arguments),s=this.$fastController;return void 0!==s&&t&&s.addSplice(Mt(0,[e],0)),e},t.sort=function(){let t;const e=this.$fastController;void 0!==e&&(e.flush(),t=this.slice());const s=r.apply(this,arguments);return void 0!==e&&e.reset(t),s},t.splice=function(){const t=o.apply(this,arguments),e=this.$fastController;return void 0!==e&&e.addSplice(zt(Mt(+arguments[0],t,arguments.length>2?arguments.length-2:0),this)),t},t.unshift=function(){const t=l.apply(this,arguments),e=this.$fastController;return void 0!==e&&e.addSplice(zt(Mt(0,[],arguments.length),this)),t}}class Qt{constructor(t,e){this.target=t,this.propertyName=e}bind(t){t[this.propertyName]=this.target}unbind(){}}function qt(t){return new L("fast-ref",Qt,t)}function Wt(t,e){const s="function"==typeof e?e:()=>e;return(e,i)=>t(e,i)?s(e,i):null}const Dt=Object.freeze({positioning:!1,recycle:!0});function Gt(t,e,s,i){t.bind(e[s],i)}function Jt(t,e,s,i){const n=Object.create(i);n.index=s,n.length=e.length,t.bind(e[s],n)}class Kt{constructor(t,e,s,i,n,r){this.location=t,this.itemsBinding=e,this.templateBinding=i,this.options=r,this.source=null,this.views=[],this.items=null,this.itemsObserver=null,this.originalContext=void 0,this.childContext=void 0,this.bindView=Gt,this.itemsBindingObserver=B.binding(e,this,s),this.templateBindingObserver=B.binding(i,this,n),r.positioning&&(this.bindView=Jt)}bind(t,e){this.source=t,this.originalContext=e,this.childContext=Object.create(e),this.childContext.parent=t,this.childContext.parentContext=this.originalContext,this.items=this.itemsBindingObserver.observe(t,this.originalContext),this.template=this.templateBindingObserver.observe(t,this.originalContext),this.observeItems(!0),this.refreshAllViews()}unbind(){this.source=null,this.items=null,null!==this.itemsObserver&&this.itemsObserver.unsubscribe(this),this.unbindAllViews(),this.itemsBindingObserver.disconnect(),this.templateBindingObserver.disconnect()}handleChange(t,e){t===this.itemsBinding?(this.items=this.itemsBindingObserver.observe(this.source,this.originalContext),this.observeItems(),this.refreshAllViews()):t===this.templateBinding?(this.template=this.templateBindingObserver.observe(this.source,this.originalContext),this.refreshAllViews(!0)):this.updateViews(e)}observeItems(t=!1){if(!this.items)return void(this.items=e);const s=this.itemsObserver,i=this.itemsObserver=B.getNotifier(this.items),n=s!==i;n&&null!==s&&s.unsubscribe(this),(n||t)&&i.subscribe(this)}updateViews(t){const e=this.childContext,s=this.views,i=[],n=this.bindView;let r=0;for(let e=0,n=t.length;e<n;++e){const n=t[e],o=n.removed;i.push(...s.splice(n.index+r,o.length)),r-=n.addedCount}const o=this.items,l=this.template;for(let r=0,h=t.length;r<h;++r){const h=t[r];let a=h.index;const c=a+h.addedCount;for(;a<c;++a){const t=s[a],r=t?t.firstChild:this.location,h=this.options.recycle&&i.length>0?i.shift():l.create();s.splice(a,0,h),n(h,o,a,e),h.insertBefore(r)}}for(let t=0,e=i.length;t<e;++t)i[t].dispose();if(this.options.positioning)for(let t=0,e=s.length;t<e;++t){const i=s[t].context;i.length=e,i.index=t}}refreshAllViews(t=!1){const e=this.items,s=this.childContext,i=this.template,n=this.location,r=this.bindView;let o=e.length,l=this.views,h=l.length;if((0===o||t)&&(rt.disposeContiguousBatch(l),h=0),0===h){this.views=l=new Array(o);for(let t=0;t<o;++t){const o=i.create();r(o,e,t,s),l[t]=o,o.insertBefore(n)}}else{let t=0;for(;t<o;++t)if(t<h){r(l[t],e,t,s)}else{const o=i.create();r(o,e,t,s),l.push(o),o.insertBefore(n)}const a=l.splice(t,h-t);for(t=0,o=a.length;t<o;++t)a[t].dispose()}}unbindAllViews(){const t=this.views;for(let e=0,s=t.length;e<s;++e)t[e].unbind()}}class Xt extends M{constructor(t,e,s){super(),this.itemsBinding=t,this.templateBinding=e,this.options=s,this.createPlaceholder=d.createBlockPlaceholder,Ut(),this.isItemsBindingVolatile=B.isVolatileBinding(t),this.isTemplateBindingVolatile=B.isVolatileBinding(e)}createBehavior(t){return new Kt(t,this.itemsBinding,this.isItemsBindingVolatile,this.templateBinding,this.isTemplateBindingVolatile,this.options)}}function Yt(t,e,s=Dt){return new Xt(t,"function"==typeof e?e:()=>e,s)}function Zt(t){return t?function(e,s,i){return 1===e.nodeType&&e.matches(t)}:function(t,e,s){return 1===t.nodeType}}class te{constructor(t,e){this.target=t,this.options=e,this.source=null}bind(t){const e=this.options.property;this.shouldUpdate=B.getAccessors(t).some(t=>t.name===e),this.source=t,this.updateTarget(this.computeNodes()),this.shouldUpdate&&this.observe()}unbind(){this.updateTarget(e),this.source=null,this.shouldUpdate&&this.disconnect()}handleEvent(){this.updateTarget(this.computeNodes())}computeNodes(){let t=this.getNodes();return void 0!==this.options.filter&&(t=t.filter(this.options.filter)),t}updateTarget(t){this.source[this.options.property]=t}}class ee extends te{constructor(t,e){super(t,e)}observe(){this.target.addEventListener("slotchange",this)}disconnect(){this.target.removeEventListener("slotchange",this)}getNodes(){return this.target.assignedNodes(this.options)}}function se(t){return"string"==typeof t&&(t={property:t}),new L("fast-slotted",ee,t)}class ie extends te{constructor(t,e){super(t,e),this.observer=null,e.childList=!0}observe(){null===this.observer&&(this.observer=new MutationObserver(this.handleEvent.bind(this))),this.observer.observe(this.target,this.options)}disconnect(){this.observer.disconnect()}getNodes(){return"subtree"in this.options?Array.from(this.target.querySelectorAll(this.options.selector)):Array.from(this.target.childNodes)}}function ne(t){return"string"==typeof t&&(t={property:t}),new L("fast-children",ie,t)}export{t as $global,L as AttachedBehaviorHTMLDirective,vt as AttributeDefinition,J as BindingBehavior,Vt as CSSDirective,ie as ChildrenBehavior,Ot as Controller,d as DOM,at as ElementStyles,$ as ExecutionContext,At as FASTElement,wt as FASTElementDefinition,G as HTMLBindingDirective,M as HTMLDirective,rt as HTMLView,B as Observable,v as PropertyChangeNotifier,Qt as RefBehavior,Kt as RepeatBehavior,Xt as RepeatDirective,ee as SlottedBehavior,b as SubscriberSet,E as TargetedHTMLDirective,ot as ViewTemplate,mt as attr,gt as booleanConverter,ne as children,it as compileTemplate,$t as css,It as cssPartial,kt as customElement,_ as defaultExecutionContext,Zt as elements,e as emptyArray,Ut as enableArrayObservation,ht as html,bt as nullableNumberConverter,A as observable,qt as ref,Yt as repeat,F as setCurrentEvent,se as slotted,k as volatile,Wt as when};
1
+ const t=function(){if("undefined"!=typeof globalThis)return globalThis;if("undefined"!=typeof global)return global;if("undefined"!=typeof self)return self;if("undefined"!=typeof window)return window;try{return new Function("return this")()}catch(t){return{}}}();void 0===t.trustedTypes&&(t.trustedTypes={createPolicy:(t,e)=>e});const e={configurable:!1,enumerable:!1,writable:!1};void 0===t.FAST&&Reflect.defineProperty(t,"FAST",Object.assign({value:Object.create(null)},e));const s=t.FAST;if(void 0===s.getById){const t=Object.create(null);Reflect.defineProperty(s,"getById",Object.assign({value(e,s){let i=t[e];return void 0===i&&(i=s?t[e]=s():null),i}},e))}const i=Object.freeze([]),n=t.FAST.getById(1,()=>{const e=[],s=[];function i(){if(s.length)throw s.shift()}function n(t){try{t.call()}catch(t){s.push(t),setTimeout(i,0)}}function r(){let t=0;for(;t<e.length;)if(n(e[t]),t++,t>1024){for(let s=0,i=e.length-t;s<i;s++)e[s]=e[s+t];e.length-=t,t=0}e.length=0}return Object.freeze({enqueue:function(s){e.length<1&&t.requestAnimationFrame(r),e.push(s)},process:r})}),r=t.trustedTypes.createPolicy("fast-html",{createHTML:t=>t});let o=r;const l="fast-"+Math.random().toString(36).substring(2,8),h=l+"{",a="}"+l,c=Object.freeze({supportsAdoptedStyleSheets:Array.isArray(document.adoptedStyleSheets)&&"replace"in CSSStyleSheet.prototype,setHTMLPolicy(t){if(o!==r)throw new Error("The HTML policy can only be set once.");o=t},createHTML:t=>o.createHTML(t),isMarker:t=>t&&8===t.nodeType&&t.data.startsWith(l),extractDirectiveIndexFromMarker:t=>parseInt(t.data.replace(l+":","")),createInterpolationPlaceholder:t=>`${h}${t}${a}`,createCustomAttributePlaceholder(t,e){return`${t}="${this.createInterpolationPlaceholder(e)}"`},createBlockPlaceholder:t=>`\x3c!--${l}:${t}--\x3e`,queueUpdate:n.enqueue,processUpdates:n.process,nextUpdate:()=>new Promise(n.enqueue),setAttribute(t,e,s){null==s?t.removeAttribute(e):t.setAttribute(e,s)},setBooleanAttribute(t,e,s){s?t.setAttribute(e,""):t.removeAttribute(e)},removeChildNodes(t){for(let e=t.firstChild;null!==e;e=t.firstChild)t.removeChild(e)},createTemplateWalker:t=>document.createTreeWalker(t,133,null,!1)});function d(t){const e=this.spillover;-1===e.indexOf(t)&&e.push(t)}function u(t){const e=this.spillover,s=e.indexOf(t);-1!==s&&e.splice(s,1)}function f(t){const e=this.spillover,s=this.source;for(let i=0,n=e.length;i<n;++i)e[i].handleChange(s,t)}function g(t){return-1!==this.spillover.indexOf(t)}class p{constructor(t,e){this.sub1=void 0,this.sub2=void 0,this.spillover=void 0,this.source=t,this.sub1=e}has(t){return this.sub1===t||this.sub2===t}subscribe(t){this.has(t)||(void 0!==this.sub1?void 0!==this.sub2?(this.spillover=[this.sub1,this.sub2,t],this.subscribe=d,this.unsubscribe=u,this.notify=f,this.has=g,this.sub1=void 0,this.sub2=void 0):this.sub2=t:this.sub1=t)}unsubscribe(t){this.sub1===t?this.sub1=void 0:this.sub2===t&&(this.sub2=void 0)}notify(t){const e=this.sub1,s=this.sub2,i=this.source;void 0!==e&&e.handleChange(i,t),void 0!==s&&s.handleChange(i,t)}}class b{constructor(t){this.subscribers={},this.sourceSubscribers=null,this.source=t}notify(t){var e;const s=this.subscribers[t];void 0!==s&&s.notify(t),null===(e=this.sourceSubscribers)||void 0===e||e.notify(t)}subscribe(t,e){var s;if(e){let s=this.subscribers[e];void 0===s&&(this.subscribers[e]=s=new p(this.source)),s.subscribe(t)}else this.sourceSubscribers=null!==(s=this.sourceSubscribers)&&void 0!==s?s:new p(this.source),this.sourceSubscribers.subscribe(t)}unsubscribe(t,e){var s;if(e){const s=this.subscribers[e];void 0!==s&&s.unsubscribe(t)}else null===(s=this.sourceSubscribers)||void 0===s||s.unsubscribe(t)}}const v=s.getById(2,()=>{const t=/(:|&&|\|\||if)/,e=new WeakMap,s=new WeakMap,i=c.queueUpdate;let n=void 0,r=t=>{throw new Error("Must call enableArrayObservation before observing arrays.")};function o(t){let s=t.$fastController||e.get(t);return void 0===s&&(Array.isArray(t)?s=r(t):e.set(t,s=new b(t))),s}function l(t){let e=s.get(t);if(void 0===e){let i=Reflect.getPrototypeOf(t);for(;void 0===e&&null!==i;)e=s.get(i),i=Reflect.getPrototypeOf(i);e=void 0===e?[]:e.slice(0),s.set(t,e)}return e}class h{constructor(t){this.name=t,this.field="_"+t,this.callback=t+"Changed"}getValue(t){return void 0!==n&&n.watch(t,this.name),t[this.field]}setValue(t,e){const s=this.field,i=t[s];if(i!==e){t[s]=e;const n=t[this.callback];"function"==typeof n&&n.call(t,i,e),o(t).notify(this.name)}}}class a extends p{constructor(t,e,s=!1){super(t,e),this.binding=t,this.isVolatileBinding=s,this.needsRefresh=!0,this.needsQueue=!0,this.first=this,this.last=null,this.propertySource=void 0,this.propertyName=void 0,this.notifier=void 0,this.next=void 0}observe(t,e){this.needsRefresh&&null!==this.last&&this.disconnect();const s=n;n=this.needsRefresh?this:void 0,this.needsRefresh=this.isVolatileBinding;const i=this.binding(t,e);return n=s,i}disconnect(){if(null!==this.last){let t=this.first;for(;void 0!==t;)t.notifier.unsubscribe(this,t.propertyName),t=t.next;this.last=null,this.needsRefresh=this.needsQueue=!0}}watch(t,e){const s=this.last,i=o(t),r=null===s?this.first:{};if(r.propertySource=t,r.propertyName=e,r.notifier=i,i.subscribe(this,e),null!==s){if(!this.needsRefresh){let e;n=void 0,e=s.propertySource[s.propertyName],n=this,t===e&&(this.needsRefresh=!0)}s.next=r}this.last=r}handleChange(){this.needsQueue&&(this.needsQueue=!1,i(this))}call(){null!==this.last&&(this.needsQueue=!0,this.notify(this))}records(){let t=this.first;return{next:()=>{const e=t;return void 0===e?{value:void 0,done:!0}:(t=t.next,{value:e,done:!1})},[Symbol.iterator]:function(){return this}}}}return Object.freeze({setArrayObserverFactory(t){r=t},getNotifier:o,track(t,e){void 0!==n&&n.watch(t,e)},trackVolatile(){void 0!==n&&(n.needsRefresh=!0)},notify(t,e){o(t).notify(e)},defineProperty(t,e){"string"==typeof e&&(e=new h(e)),l(t).push(e),Reflect.defineProperty(t,e.name,{enumerable:!0,get:function(){return e.getValue(this)},set:function(t){e.setValue(this,t)}})},getAccessors:l,binding(t,e,s=this.isVolatileBinding(t)){return new a(t,e,s)},isVolatileBinding:e=>t.test(e.toString())})});function m(t,e){v.defineProperty(t,e)}function y(t,e,s){return Object.assign({},s,{get:function(){return v.trackVolatile(),s.get.apply(this)}})}const C=s.getById(3,()=>{let t=null;return{get:()=>t,set(e){t=e}}});class x{constructor(){this.index=0,this.length=0,this.parent=null,this.parentContext=null}get event(){return C.get()}get isEven(){return this.index%2==0}get isOdd(){return this.index%2!=0}get isFirst(){return 0===this.index}get isInMiddle(){return!this.isFirst&&!this.isLast}get isLast(){return this.index===this.length-1}static setEvent(t){C.set(t)}}v.defineProperty(x.prototype,"index"),v.defineProperty(x.prototype,"length");const w=Object.seal(new x);class S{constructor(){this.targetIndex=0}}class B extends S{constructor(){super(...arguments),this.createPlaceholder=c.createInterpolationPlaceholder}}class T extends S{constructor(t,e,s){super(),this.name=t,this.behavior=e,this.options=s}createPlaceholder(t){return c.createCustomAttributePlaceholder(this.name,t)}createBehavior(t){return new this.behavior(t,this.options)}}function O(t,e){this.source=t,this.context=e,null===this.bindingObserver&&(this.bindingObserver=v.binding(this.binding,this,this.isBindingVolatile)),this.updateTarget(this.bindingObserver.observe(t,e))}function A(t,e){this.source=t,this.context=e,this.target.addEventListener(this.targetName,this)}function N(){this.bindingObserver.disconnect(),this.source=null,this.context=null}function k(){this.bindingObserver.disconnect(),this.source=null,this.context=null;const t=this.target.$fastView;void 0!==t&&t.isComposed&&(t.unbind(),t.needsBindOnly=!0)}function V(){this.target.removeEventListener(this.targetName,this),this.source=null,this.context=null}function F(t){c.setAttribute(this.target,this.targetName,t)}function I(t){c.setBooleanAttribute(this.target,this.targetName,t)}function $(t){if(null==t&&(t=""),t.create){this.target.textContent="";let e=this.target.$fastView;void 0===e?e=t.create():this.target.$fastTemplate!==t&&(e.isComposed&&(e.remove(),e.unbind()),e=t.create()),e.isComposed?e.needsBindOnly&&(e.needsBindOnly=!1,e.bind(this.source,this.context)):(e.isComposed=!0,e.bind(this.source,this.context),e.insertBefore(this.target),this.target.$fastView=e,this.target.$fastTemplate=t)}else{const e=this.target.$fastView;void 0!==e&&e.isComposed&&(e.isComposed=!1,e.remove(),e.needsBindOnly?e.needsBindOnly=!1:e.unbind()),this.target.textContent=t}}function _(t){this.target[this.targetName]=t}function M(t){const e=this.classVersions||Object.create(null),s=this.target;let i=this.version||0;if(null!=t&&t.length){const n=t.split(/\s+/);for(let t=0,r=n.length;t<r;++t){const r=n[t];""!==r&&(e[r]=i,s.classList.add(r))}}if(this.classVersions=e,this.version=i+1,0!==i){i-=1;for(const t in e)e[t]===i&&s.classList.remove(t)}}class P extends B{constructor(t){super(),this.binding=t,this.bind=O,this.unbind=N,this.updateTarget=F,this.isBindingVolatile=v.isVolatileBinding(this.binding)}get targetName(){return this.originalTargetName}set targetName(t){if(this.originalTargetName=t,void 0!==t)switch(t[0]){case":":if(this.cleanedTargetName=t.substr(1),this.updateTarget=_,"innerHTML"===this.cleanedTargetName){const t=this.binding;this.binding=(e,s)=>c.createHTML(t(e,s))}break;case"?":this.cleanedTargetName=t.substr(1),this.updateTarget=I;break;case"@":this.cleanedTargetName=t.substr(1),this.bind=A,this.unbind=V;break;default:this.cleanedTargetName=t,"class"===t&&(this.updateTarget=M)}}targetAtContent(){this.updateTarget=$,this.unbind=k}createBehavior(t){return new E(t,this.binding,this.isBindingVolatile,this.bind,this.unbind,this.updateTarget,this.cleanedTargetName)}}class E{constructor(t,e,s,i,n,r,o){this.source=null,this.context=null,this.bindingObserver=null,this.target=t,this.binding=e,this.isBindingVolatile=s,this.bind=i,this.unbind=n,this.updateTarget=r,this.targetName=o}handleChange(){this.updateTarget(this.bindingObserver.observe(this.source,this.context))}handleEvent(t){x.setEvent(t);const e=this.binding(this.source,this.context);x.setEvent(null),!0!==e&&t.preventDefault()}}let L=null;class j{addFactory(t){t.targetIndex=this.targetIndex,this.behaviorFactories.push(t)}captureContentBinding(t){t.targetAtContent(),this.addFactory(t)}reset(){this.behaviorFactories=[],this.targetIndex=-1}release(){L=this}static borrow(t){const e=L||new j;return e.directives=t,e.reset(),L=null,e}}function R(t){if(1===t.length)return t[0];let e;const s=t.length,i=t.map(t=>"string"==typeof t?()=>t:(e=t.targetName||e,t.binding)),n=new P((t,e)=>{let n="";for(let r=0;r<s;++r)n+=i[r](t,e);return n});return n.targetName=e,n}const z=a.length;function H(t,e){const s=e.split(h);if(1===s.length)return null;const i=[];for(let e=0,n=s.length;e<n;++e){const n=s[e],r=n.indexOf(a);let o;if(-1===r)o=n;else{const e=parseInt(n.substring(0,r));i.push(t.directives[e]),o=n.substring(r+z)}""!==o&&i.push(o)}return i}function q(t,e,s=!1){const i=e.attributes;for(let n=0,r=i.length;n<r;++n){const o=i[n],l=o.value,h=H(t,l);let a=null;null===h?s&&(a=new P(()=>l),a.targetName=o.name):a=R(h),null!==a&&(e.removeAttributeNode(o),n--,r--,t.addFactory(a))}}function Q(t,e,s){const i=H(t,e.textContent);if(null!==i){let n=e;for(let r=0,o=i.length;r<o;++r){const o=i[r],l=0===r?e:n.parentNode.insertBefore(document.createTextNode(""),n.nextSibling);"string"==typeof o?l.textContent=o:(l.textContent=" ",t.captureContentBinding(o)),n=l,t.targetIndex++,l!==e&&s.nextNode()}t.targetIndex--}}function U(t,e){const s=t.content;document.adoptNode(s);const i=j.borrow(e);q(i,t,!0);const n=i.behaviorFactories;i.reset();const r=c.createTemplateWalker(s);let o;for(;o=r.nextNode();)switch(i.targetIndex++,o.nodeType){case 1:q(i,o);break;case 3:Q(i,o,r);break;case 8:c.isMarker(o)&&i.addFactory(e[c.extractDirectiveIndexFromMarker(o)])}let l=0;(c.isMarker(s.firstChild)||1===s.childNodes.length&&e.length)&&(s.insertBefore(document.createComment(""),s.firstChild),l=-1);const h=i.behaviorFactories;return i.release(),{fragment:s,viewBehaviorFactories:h,hostBehaviorFactories:n,targetOffset:l}}const W=document.createRange();class D{constructor(t,e){this.fragment=t,this.behaviors=e,this.source=null,this.context=null,this.firstChild=t.firstChild,this.lastChild=t.lastChild}appendTo(t){t.appendChild(this.fragment)}insertBefore(t){if(this.fragment.hasChildNodes())t.parentNode.insertBefore(this.fragment,t);else{const e=t.parentNode,s=this.lastChild;let i,n=this.firstChild;for(;n!==s;)i=n.nextSibling,e.insertBefore(n,t),n=i;e.insertBefore(s,t)}}remove(){const t=this.fragment,e=this.lastChild;let s,i=this.firstChild;for(;i!==e;)s=i.nextSibling,t.appendChild(i),i=s;t.appendChild(e)}dispose(){const t=this.firstChild.parentNode,e=this.lastChild;let s,i=this.firstChild;for(;i!==e;)s=i.nextSibling,t.removeChild(i),i=s;t.removeChild(e);const n=this.behaviors,r=this.source;for(let t=0,e=n.length;t<e;++t)n[t].unbind(r)}bind(t,e){const s=this.behaviors;if(this.source!==t)if(null!==this.source){const i=this.source;this.source=t,this.context=e;for(let n=0,r=s.length;n<r;++n){const r=s[n];r.unbind(i),r.bind(t,e)}}else{this.source=t,this.context=e;for(let i=0,n=s.length;i<n;++i)s[i].bind(t,e)}}unbind(){if(null===this.source)return;const t=this.behaviors,e=this.source;for(let s=0,i=t.length;s<i;++s)t[s].unbind(e);this.source=null}static disposeContiguousBatch(t){if(0!==t.length){W.setStartBefore(t[0].firstChild),W.setEndAfter(t[t.length-1].lastChild),W.deleteContents();for(let e=0,s=t.length;e<s;++e){const s=t[e],i=s.behaviors,n=s.source;for(let t=0,e=i.length;t<e;++t)i[t].unbind(n)}}}}class G{constructor(t,e){this.behaviorCount=0,this.hasHostBehaviors=!1,this.fragment=null,this.targetOffset=0,this.viewBehaviorFactories=null,this.hostBehaviorFactories=null,this.html=t,this.directives=e}create(t){if(null===this.fragment){let t;const e=this.html;if("string"==typeof e){t=document.createElement("template"),t.innerHTML=c.createHTML(e);const s=t.content.firstElementChild;null!==s&&"TEMPLATE"===s.tagName&&(t=s)}else t=e;const s=U(t,this.directives);this.fragment=s.fragment,this.viewBehaviorFactories=s.viewBehaviorFactories,this.hostBehaviorFactories=s.hostBehaviorFactories,this.targetOffset=s.targetOffset,this.behaviorCount=this.viewBehaviorFactories.length+this.hostBehaviorFactories.length,this.hasHostBehaviors=this.hostBehaviorFactories.length>0}const e=this.fragment.cloneNode(!0),s=this.viewBehaviorFactories,i=new Array(this.behaviorCount),n=c.createTemplateWalker(e);let r=0,o=this.targetOffset,l=n.nextNode();for(let t=s.length;r<t;++r){const t=s[r],e=t.targetIndex;for(;null!==l;){if(o===e){i[r]=t.createBehavior(l);break}l=n.nextNode(),o++}}if(this.hasHostBehaviors){const e=this.hostBehaviorFactories;for(let s=0,n=e.length;s<n;++s,++r)i[r]=e[s].createBehavior(t)}return new D(e,i)}render(t,e,s){"string"==typeof e&&(e=document.getElementById(e)),void 0===s&&(s=e);const i=this.create(s);return i.bind(t,w),i.appendTo(e),i}}const J=/([ \x09\x0a\x0c\x0d])([^\0-\x1F\x7F-\x9F "'>=/]+)([ \x09\x0a\x0c\x0d]*=[ \x09\x0a\x0c\x0d]*(?:[^ \x09\x0a\x0c\x0d"'`<>=]*|"[^"]*|'[^']*))$/;function K(t,...e){const s=[];let i="";for(let n=0,r=t.length-1;n<r;++n){const r=t[n];let o=e[n];if(i+=r,o instanceof G){const t=o;o=()=>t}if("function"==typeof o&&(o=new P(o)),o instanceof B){const t=J.exec(r);null!==t&&(o.targetName=t[2])}o instanceof S?(i+=o.createPlaceholder(s.length),s.push(o)):i+=o}return i+=t[t.length-1],new G(i,s)}class X{constructor(){this.targets=new WeakSet,this.behaviors=null}addStylesTo(t){this.targets.add(t)}removeStylesFrom(t){this.targets.delete(t)}isAttachedTo(t){return this.targets.has(t)}withBehaviors(...t){return this.behaviors=null===this.behaviors?t:this.behaviors.concat(t),this}}function Y(t){return t.map(t=>t instanceof X?Y(t.styles):[t]).reduce((t,e)=>t.concat(e),[])}function Z(t){return t.map(t=>t instanceof X?t.behaviors:null).reduce((t,e)=>null===e?t:(null===t&&(t=[]),t.concat(e)),null)}X.create=(()=>{if(c.supportsAdoptedStyleSheets){const t=new Map;return e=>new tt(e,t)}return t=>new st(t)})();class tt extends X{constructor(t,e){super(),this.styles=t,this.styleSheetCache=e,this._styleSheets=void 0,this.behaviors=Z(t)}get styleSheets(){if(void 0===this._styleSheets){const t=this.styles,e=this.styleSheetCache;this._styleSheets=Y(t).map(t=>{if(t instanceof CSSStyleSheet)return t;let s=e.get(t);return void 0===s&&(s=new CSSStyleSheet,s.replaceSync(t),e.set(t,s)),s})}return this._styleSheets}addStylesTo(t){t.adoptedStyleSheets=[...t.adoptedStyleSheets,...this.styleSheets],super.addStylesTo(t)}removeStylesFrom(t){const e=this.styleSheets;t.adoptedStyleSheets=t.adoptedStyleSheets.filter(t=>-1===e.indexOf(t)),super.removeStylesFrom(t)}}let et=0;class st extends X{constructor(t){super(),this.styles=t,this.behaviors=null,this.behaviors=Z(t),this.styleSheets=Y(t),this.styleClass="fast-style-class-"+ ++et}addStylesTo(t){const e=this.styleSheets,s=this.styleClass;t=this.normalizeTarget(t);for(let i=0;i<e.length;i++){const n=document.createElement("style");n.innerHTML=e[i],n.className=s,t.append(n)}super.addStylesTo(t)}removeStylesFrom(t){const e=(t=this.normalizeTarget(t)).querySelectorAll("."+this.styleClass);for(let s=0,i=e.length;s<i;++s)t.removeChild(e[s]);super.removeStylesFrom(t)}isAttachedTo(t){return super.isAttachedTo(this.normalizeTarget(t))}normalizeTarget(t){return t===document?document.body:t}}const it={toView:t=>t?"true":"false",fromView:t=>null!=t&&"false"!==t&&!1!==t&&0!==t},nt={toView(t){if(null==t)return null;const e=1*t;return isNaN(e)?null:e.toString()},fromView(t){if(null==t)return null;const e=1*t;return isNaN(e)?null:e}};class rt{constructor(t,e,s=e.toLowerCase(),i="reflect",n){this.guards=new Set,this.Owner=t,this.name=e,this.attribute=s,this.mode=i,this.converter=n,this.fieldName="_"+e,this.callbackName=e+"Changed",this.hasCallback=this.callbackName in t.prototype,"boolean"===i&&void 0===n&&(this.converter=it)}setValue(t,e){const s=t[this.fieldName],i=this.converter;void 0!==i&&(e=i.fromView(e)),s!==e&&(t[this.fieldName]=e,this.tryReflectToAttribute(t),this.hasCallback&&t[this.callbackName](s,e),t.$fastController.notify(this.name))}getValue(t){return v.track(t,this.name),t[this.fieldName]}onAttributeChangedCallback(t,e){this.guards.has(t)||(this.guards.add(t),this.setValue(t,e),this.guards.delete(t))}tryReflectToAttribute(t){const e=this.mode,s=this.guards;s.has(t)||"fromView"===e||c.queueUpdate(()=>{s.add(t);const i=t[this.fieldName];switch(e){case"reflect":const e=this.converter;c.setAttribute(t,this.attribute,void 0!==e?e.toView(i):i);break;case"boolean":c.setBooleanAttribute(t,this.attribute,i)}s.delete(t)})}static collect(t,...e){const s=[];e.push(t.attributes);for(let i=0,n=e.length;i<n;++i){const n=e[i];if(void 0!==n)for(let e=0,i=n.length;e<i;++e){const i=n[e];"string"==typeof i?s.push(new rt(t,i)):s.push(new rt(t,i.property,i.attribute,i.mode,i.converter))}}return s}}function ot(t,e){let s;function i(t,e){arguments.length>1&&(s.property=e);const i=t.constructor.attributes||(t.constructor.attributes=[]);i.push(s)}return arguments.length>1?(s={},void i(t,e)):(s=void 0===t?{}:t,i)}const lt={mode:"open"},ht={},at=s.getById(4,()=>{const t=new Map;return Object.freeze({register:e=>!t.has(e.type)&&(t.set(e.type,e),!0),getByType:e=>t.get(e)})});class ct{constructor(t,e=t.definition){"string"==typeof e&&(e={name:e}),this.type=t,this.name=e.name,this.template=e.template;const s=rt.collect(t,e.attributes),i=new Array(s.length),n={},r={};for(let t=0,e=s.length;t<e;++t){const e=s[t];i[t]=e.attribute,n[e.name]=e,r[e.attribute]=e}this.attributes=s,this.observedAttributes=i,this.propertyLookup=n,this.attributeLookup=r,this.shadowOptions=void 0===e.shadowOptions?lt:null===e.shadowOptions?void 0:Object.assign(Object.assign({},lt),e.shadowOptions),this.elementOptions=void 0===e.elementOptions?ht:Object.assign(Object.assign({},ht),e.elementOptions),this.styles=void 0===e.styles?void 0:Array.isArray(e.styles)?X.create(e.styles):e.styles instanceof X?e.styles:X.create([e.styles])}get isDefined(){return!!at.getByType(this.type)}define(t=customElements){const e=this.type;if(at.register(this)){const t=this.attributes,s=e.prototype;for(let e=0,i=t.length;e<i;++e)v.defineProperty(s,t[e]);Reflect.defineProperty(e,"observedAttributes",{value:this.observedAttributes,enumerable:!0})}return t.get(this.name)||t.define(this.name,e,this.elementOptions),this}}ct.forType=at.getByType;const dt=new WeakMap,ut={bubbles:!0,composed:!0,cancelable:!0};function ft(t){return t.shadowRoot||dt.get(t)||null}class gt extends b{constructor(t,e){super(t),this.boundObservables=null,this.behaviors=null,this.needsInitialization=!0,this._template=null,this._styles=null,this._isConnected=!1,this.$fastController=this,this.view=null,this.element=t,this.definition=e;const s=e.shadowOptions;if(void 0!==s){const e=t.attachShadow(s);"closed"===s.mode&&dt.set(t,e)}const i=v.getAccessors(t);if(i.length>0){const e=this.boundObservables=Object.create(null);for(let s=0,n=i.length;s<n;++s){const n=i[s].name,r=t[n];void 0!==r&&(delete t[n],e[n]=r)}}}get isConnected(){return v.track(this,"isConnected"),this._isConnected}setIsConnected(t){this._isConnected=t,v.notify(this,"isConnected")}get template(){return this._template}set template(t){this._template!==t&&(this._template=t,this.needsInitialization||this.renderTemplate(t))}get styles(){return this._styles}set styles(t){this._styles!==t&&(null!==this._styles&&this.removeStyles(this._styles),this._styles=t,this.needsInitialization||null===t||this.addStyles(t))}addStyles(t){const e=ft(this.element)||this.element.getRootNode();if(t instanceof HTMLStyleElement)e.append(t);else if(!t.isAttachedTo(e)){const s=t.behaviors;t.addStylesTo(e),null!==s&&this.addBehaviors(s)}}removeStyles(t){const e=ft(this.element)||this.element.getRootNode();if(t instanceof HTMLStyleElement)e.removeChild(t);else if(t.isAttachedTo(e)){const s=t.behaviors;t.removeStylesFrom(e),null!==s&&this.removeBehaviors(s)}}addBehaviors(t){const e=this.behaviors||(this.behaviors=new Map),s=t.length,i=[];for(let n=0;n<s;++n){const s=t[n];e.has(s)?e.set(s,e.get(s)+1):(e.set(s,1),i.push(s))}if(this._isConnected){const t=this.element;for(let e=0;e<i.length;++e)i[e].bind(t,w)}}removeBehaviors(t,e=!1){const s=this.behaviors;if(null===s)return;const i=t.length,n=[];for(let r=0;r<i;++r){const i=t[r];if(s.has(i)){const t=s.get(i)-1;0===t||e?s.delete(i)&&n.push(i):s.set(i,t)}}if(this._isConnected){const t=this.element;for(let e=0;e<n.length;++e)n[e].unbind(t)}}onConnectedCallback(){if(this._isConnected)return;const t=this.element;this.needsInitialization?this.finishInitialization():null!==this.view&&this.view.bind(t,w);const e=this.behaviors;if(null!==e)for(const[s]of e)s.bind(t,w);this.setIsConnected(!0)}onDisconnectedCallback(){if(!this._isConnected)return;this.setIsConnected(!1);const t=this.view;null!==t&&t.unbind();const e=this.behaviors;if(null!==e){const t=this.element;for(const[s]of e)s.unbind(t)}}onAttributeChangedCallback(t,e,s){const i=this.definition.attributeLookup[t];void 0!==i&&i.onAttributeChangedCallback(this.element,s)}emit(t,e,s){return!!this._isConnected&&this.element.dispatchEvent(new CustomEvent(t,Object.assign(Object.assign({detail:e},ut),s)))}finishInitialization(){const t=this.element,e=this.boundObservables;if(null!==e){const s=Object.keys(e);for(let i=0,n=s.length;i<n;++i){const n=s[i];t[n]=e[n]}this.boundObservables=null}const s=this.definition;null===this._template&&(this.element.resolveTemplate?this._template=this.element.resolveTemplate():s.template&&(this._template=s.template||null)),null!==this._template&&this.renderTemplate(this._template),null===this._styles&&(this.element.resolveStyles?this._styles=this.element.resolveStyles():s.styles&&(this._styles=s.styles||null)),null!==this._styles&&this.addStyles(this._styles),this.needsInitialization=!1}renderTemplate(t){const e=this.element,s=ft(e)||e;null!==this.view?(this.view.dispose(),this.view=null):this.needsInitialization||c.removeChildNodes(s),t&&(this.view=t.render(e,s,e))}static forCustomElement(t){const e=t.$fastController;if(void 0!==e)return e;const s=ct.forType(t.constructor);if(void 0===s)throw new Error("Missing FASTElement definition.");return t.$fastController=new gt(t,s)}}function pt(t){return class extends t{constructor(){super(),gt.forCustomElement(this)}$emit(t,e,s){return this.$fastController.emit(t,e,s)}connectedCallback(){this.$fastController.onConnectedCallback()}disconnectedCallback(){this.$fastController.onDisconnectedCallback()}attributeChangedCallback(t,e,s){this.$fastController.onAttributeChangedCallback(t,e,s)}}}const bt=Object.assign(pt(HTMLElement),{from:t=>pt(t),define:(t,e)=>new ct(t,e).define().type});function vt(t){return function(e){new ct(e,t).define()}}class mt{createCSS(){return""}createBehavior(){}}function yt(t,e){const s=[];let i="";const n=[];for(let r=0,o=t.length-1;r<o;++r){i+=t[r];let o=e[r];if(o instanceof mt){const t=o.createBehavior();o=o.createCSS(),t&&n.push(t)}o instanceof X||o instanceof CSSStyleSheet?(""!==i.trim()&&(s.push(i),i=""),s.push(o)):i+=o}return i+=t[t.length-1],""!==i.trim()&&s.push(i),{styles:s,behaviors:n}}function Ct(t,...e){const{styles:s,behaviors:i}=yt(t,e),n=X.create(s);return i.length&&n.withBehaviors(...i),n}class xt extends mt{constructor(t,e){super(),this.behaviors=e,this.css="";const s=t.reduce((t,e)=>("string"==typeof e?this.css+=e:t.push(e),t),[]);s.length&&(this.styles=X.create(s))}createBehavior(){return this}createCSS(){return this.css}bind(t){this.styles&&t.$fastController.addStyles(this.styles),this.behaviors.length&&t.$fastController.addBehaviors(this.behaviors)}unbind(t){this.styles&&t.$fastController.removeStyles(this.styles),this.behaviors.length&&t.$fastController.removeBehaviors(this.behaviors)}}function wt(t,...e){const{styles:s,behaviors:i}=yt(t,e);return new xt(s,i)}function St(t,e,s){return{index:t,removed:e,addedCount:s}}function Bt(t,e,s,n,r,o){let l=0,h=0;const a=Math.min(s-e,o-r);if(0===e&&0===r&&(l=function(t,e,s){for(let i=0;i<s;++i)if(t[i]!==e[i])return i;return s}(t,n,a)),s===t.length&&o===n.length&&(h=function(t,e,s){let i=t.length,n=e.length,r=0;for(;r<s&&t[--i]===e[--n];)r++;return r}(t,n,a-l)),r+=l,o-=h,(s-=h)-(e+=l)==0&&o-r==0)return i;if(e===s){const t=St(e,[],0);for(;r<o;)t.removed.push(n[r++]);return[t]}if(r===o)return[St(e,[],s-e)];const c=function(t){let e=t.length-1,s=t[0].length-1,i=t[e][s];const n=[];for(;e>0||s>0;){if(0===e){n.push(2),s--;continue}if(0===s){n.push(3),e--;continue}const r=t[e-1][s-1],o=t[e-1][s],l=t[e][s-1];let h;h=o<l?o<r?o:r:l<r?l:r,h===r?(r===i?n.push(0):(n.push(1),i=r),e--,s--):h===o?(n.push(3),e--,i=o):(n.push(2),s--,i=l)}return n.reverse(),n}(function(t,e,s,i,n,r){const o=r-n+1,l=s-e+1,h=new Array(o);let a,c;for(let t=0;t<o;++t)h[t]=new Array(l),h[t][0]=t;for(let t=0;t<l;++t)h[0][t]=t;for(let s=1;s<o;++s)for(let r=1;r<l;++r)t[e+r-1]===i[n+s-1]?h[s][r]=h[s-1][r-1]:(a=h[s-1][r]+1,c=h[s][r-1]+1,h[s][r]=a<c?a:c);return h}(t,e,s,n,r,o)),d=[];let u=void 0,f=e,g=r;for(let t=0;t<c.length;++t)switch(c[t]){case 0:void 0!==u&&(d.push(u),u=void 0),f++,g++;break;case 1:void 0===u&&(u=St(f,[],0)),u.addedCount++,f++,u.removed.push(n[g]),g++;break;case 2:void 0===u&&(u=St(f,[],0)),u.addedCount++,f++;break;case 3:void 0===u&&(u=St(f,[],0)),u.removed.push(n[g]),g++}return void 0!==u&&d.push(u),d}const Tt=Array.prototype.push;function Ot(t,e,s,i){const n=St(e,s,i);let r=!1,o=0;for(let e=0;e<t.length;e++){const s=t[e];if(s.index+=o,r)continue;const i=(l=n.index,h=n.index+n.removed.length,a=s.index,c=s.index+s.addedCount,h<a||c<l?-1:h===a||c===l?0:l<a?h<c?h-a:c-a:c<h?c-l:h-l);if(i>=0){t.splice(e,1),e--,o-=s.addedCount-s.removed.length,n.addedCount+=s.addedCount-i;const l=n.removed.length+s.removed.length-i;if(n.addedCount||l){let t=s.removed;if(n.index<s.index){const e=n.removed.slice(0,s.index-n.index);Tt.apply(e,t),t=e}if(n.index+n.removed.length>s.index+s.addedCount){const e=n.removed.slice(s.index+s.addedCount-n.index);Tt.apply(t,e)}n.removed=t,s.index<n.index&&(n.index=s.index)}else r=!0}else if(n.index<s.index){r=!0,t.splice(e,0,n),e++;const i=n.addedCount-n.removed.length;s.index+=i,o+=i}}var l,h,a,c;r||t.push(n)}function At(t,e){let s=[];const i=function(t){const e=[];for(let s=0,i=t.length;s<i;s++){const i=t[s];Ot(e,i.index,i.removed,i.addedCount)}return e}(e);for(let e=0,n=i.length;e<n;++e){const n=i[e];1!==n.addedCount||1!==n.removed.length?s=s.concat(Bt(t,n.index,n.index+n.addedCount,n.removed,0,n.removed.length)):n.removed[0]!==t[n.index]&&s.push(n)}return s}let Nt=!1;function kt(t,e){let s=t.index;const i=e.length;return s>i?s=i-t.addedCount:s<0&&(s=i+t.removed.length+s-t.addedCount),s<0&&(s=0),t.index=s,t}class Vt extends p{constructor(t){super(t),this.oldCollection=void 0,this.splices=void 0,this.needsQueue=!0,this.call=this.flush,Reflect.defineProperty(t,"$fastController",{value:this,enumerable:!1})}addSplice(t){void 0===this.splices?this.splices=[t]:this.splices.push(t),this.needsQueue&&(this.needsQueue=!1,c.queueUpdate(this))}reset(t){this.oldCollection=t,this.needsQueue&&(this.needsQueue=!1,c.queueUpdate(this))}flush(){const t=this.splices,e=this.oldCollection;if(void 0===t&&void 0===e)return;this.needsQueue=!0,this.splices=void 0,this.oldCollection=void 0;const s=void 0===e?At(this.source,t):Bt(this.source,0,this.source.length,e,0,e.length);this.notify(s)}}function Ft(){if(Nt)return;Nt=!0,v.setArrayObserverFactory(t=>new Vt(t));const t=Array.prototype;if(t.$fastPatch)return;Reflect.defineProperty(t,"$fastPatch",{value:1,enumerable:!1});const e=t.pop,s=t.push,i=t.reverse,n=t.shift,r=t.sort,o=t.splice,l=t.unshift;t.pop=function(){const t=this.length>0,s=e.apply(this,arguments),i=this.$fastController;return void 0!==i&&t&&i.addSplice(St(this.length,[s],0)),s},t.push=function(){const t=s.apply(this,arguments),e=this.$fastController;return void 0!==e&&e.addSplice(kt(St(this.length-arguments.length,[],arguments.length),this)),t},t.reverse=function(){let t;const e=this.$fastController;void 0!==e&&(e.flush(),t=this.slice());const s=i.apply(this,arguments);return void 0!==e&&e.reset(t),s},t.shift=function(){const t=this.length>0,e=n.apply(this,arguments),s=this.$fastController;return void 0!==s&&t&&s.addSplice(St(0,[e],0)),e},t.sort=function(){let t;const e=this.$fastController;void 0!==e&&(e.flush(),t=this.slice());const s=r.apply(this,arguments);return void 0!==e&&e.reset(t),s},t.splice=function(){const t=o.apply(this,arguments),e=this.$fastController;return void 0!==e&&e.addSplice(kt(St(+arguments[0],t,arguments.length>2?arguments.length-2:0),this)),t},t.unshift=function(){const t=l.apply(this,arguments),e=this.$fastController;return void 0!==e&&e.addSplice(kt(St(0,[],arguments.length),this)),t}}class It{constructor(t,e){this.target=t,this.propertyName=e}bind(t){t[this.propertyName]=this.target}unbind(){}}function $t(t){return new T("fast-ref",It,t)}function _t(t,e){const s="function"==typeof e?e:()=>e;return(e,i)=>t(e,i)?s(e,i):null}const Mt=Object.freeze({positioning:!1,recycle:!0});function Pt(t,e,s,i){t.bind(e[s],i)}function Et(t,e,s,i){const n=Object.create(i);n.index=s,n.length=e.length,t.bind(e[s],n)}class Lt{constructor(t,e,s,i,n,r){this.location=t,this.itemsBinding=e,this.templateBinding=i,this.options=r,this.source=null,this.views=[],this.items=null,this.itemsObserver=null,this.originalContext=void 0,this.childContext=void 0,this.bindView=Pt,this.itemsBindingObserver=v.binding(e,this,s),this.templateBindingObserver=v.binding(i,this,n),r.positioning&&(this.bindView=Et)}bind(t,e){this.source=t,this.originalContext=e,this.childContext=Object.create(e),this.childContext.parent=t,this.childContext.parentContext=this.originalContext,this.items=this.itemsBindingObserver.observe(t,this.originalContext),this.template=this.templateBindingObserver.observe(t,this.originalContext),this.observeItems(!0),this.refreshAllViews()}unbind(){this.source=null,this.items=null,null!==this.itemsObserver&&this.itemsObserver.unsubscribe(this),this.unbindAllViews(),this.itemsBindingObserver.disconnect(),this.templateBindingObserver.disconnect()}handleChange(t,e){t===this.itemsBinding?(this.items=this.itemsBindingObserver.observe(this.source,this.originalContext),this.observeItems(),this.refreshAllViews()):t===this.templateBinding?(this.template=this.templateBindingObserver.observe(this.source,this.originalContext),this.refreshAllViews(!0)):this.updateViews(e)}observeItems(t=!1){if(!this.items)return void(this.items=i);const e=this.itemsObserver,s=this.itemsObserver=v.getNotifier(this.items),n=e!==s;n&&null!==e&&e.unsubscribe(this),(n||t)&&s.subscribe(this)}updateViews(t){const e=this.childContext,s=this.views,i=[],n=this.bindView;let r=0;for(let e=0,n=t.length;e<n;++e){const n=t[e],o=n.removed;i.push(...s.splice(n.index+r,o.length)),r-=n.addedCount}const o=this.items,l=this.template;for(let r=0,h=t.length;r<h;++r){const h=t[r];let a=h.index;const c=a+h.addedCount;for(;a<c;++a){const t=s[a],r=t?t.firstChild:this.location,h=this.options.recycle&&i.length>0?i.shift():l.create();s.splice(a,0,h),n(h,o,a,e),h.insertBefore(r)}}for(let t=0,e=i.length;t<e;++t)i[t].dispose();if(this.options.positioning)for(let t=0,e=s.length;t<e;++t){const i=s[t].context;i.length=e,i.index=t}}refreshAllViews(t=!1){const e=this.items,s=this.childContext,i=this.template,n=this.location,r=this.bindView;let o=e.length,l=this.views,h=l.length;if((0===o||t)&&(D.disposeContiguousBatch(l),h=0),0===h){this.views=l=new Array(o);for(let t=0;t<o;++t){const o=i.create();r(o,e,t,s),l[t]=o,o.insertBefore(n)}}else{let t=0;for(;t<o;++t)if(t<h){r(l[t],e,t,s)}else{const o=i.create();r(o,e,t,s),l.push(o),o.insertBefore(n)}const a=l.splice(t,h-t);for(t=0,o=a.length;t<o;++t)a[t].dispose()}}unbindAllViews(){const t=this.views;for(let e=0,s=t.length;e<s;++e)t[e].unbind()}}class jt extends S{constructor(t,e,s){super(),this.itemsBinding=t,this.templateBinding=e,this.options=s,this.createPlaceholder=c.createBlockPlaceholder,Ft(),this.isItemsBindingVolatile=v.isVolatileBinding(t),this.isTemplateBindingVolatile=v.isVolatileBinding(e)}createBehavior(t){return new Lt(t,this.itemsBinding,this.isItemsBindingVolatile,this.templateBinding,this.isTemplateBindingVolatile,this.options)}}function Rt(t,e,s=Mt){return new jt(t,"function"==typeof e?e:()=>e,s)}function zt(t){return t?function(e,s,i){return 1===e.nodeType&&e.matches(t)}:function(t,e,s){return 1===t.nodeType}}class Ht{constructor(t,e){this.target=t,this.options=e,this.source=null}bind(t){const e=this.options.property;this.shouldUpdate=v.getAccessors(t).some(t=>t.name===e),this.source=t,this.updateTarget(this.computeNodes()),this.shouldUpdate&&this.observe()}unbind(){this.updateTarget(i),this.source=null,this.shouldUpdate&&this.disconnect()}handleEvent(){this.updateTarget(this.computeNodes())}computeNodes(){let t=this.getNodes();return void 0!==this.options.filter&&(t=t.filter(this.options.filter)),t}updateTarget(t){this.source[this.options.property]=t}}class qt extends Ht{constructor(t,e){super(t,e)}observe(){this.target.addEventListener("slotchange",this)}disconnect(){this.target.removeEventListener("slotchange",this)}getNodes(){return this.target.assignedNodes(this.options)}}function Qt(t){return"string"==typeof t&&(t={property:t}),new T("fast-slotted",qt,t)}class Ut extends Ht{constructor(t,e){super(t,e),this.observer=null,e.childList=!0}observe(){null===this.observer&&(this.observer=new MutationObserver(this.handleEvent.bind(this))),this.observer.observe(this.target,this.options)}disconnect(){this.observer.disconnect()}getNodes(){return"subtree"in this.options?Array.from(this.target.querySelectorAll(this.options.selector)):Array.from(this.target.childNodes)}}function Wt(t){return"string"==typeof t&&(t={property:t}),new T("fast-children",Ut,t)}export{t as $global,T as AttachedBehaviorHTMLDirective,rt as AttributeDefinition,E as BindingBehavior,mt as CSSDirective,Ut as ChildrenBehavior,gt as Controller,c as DOM,X as ElementStyles,x as ExecutionContext,s as FAST,bt as FASTElement,ct as FASTElementDefinition,P as HTMLBindingDirective,S as HTMLDirective,D as HTMLView,v as Observable,b as PropertyChangeNotifier,It as RefBehavior,Lt as RepeatBehavior,jt as RepeatDirective,qt as SlottedBehavior,p as SubscriberSet,B as TargetedHTMLDirective,G as ViewTemplate,ot as attr,it as booleanConverter,Wt as children,U as compileTemplate,Ct as css,wt as cssPartial,vt as customElement,w as defaultExecutionContext,zt as elements,i as emptyArray,Ft as enableArrayObservation,K as html,nt as nullableNumberConverter,m as observable,$t as ref,Rt as repeat,Qt as slotted,y as volatile,_t as when};
@@ -104,7 +104,7 @@ export class BindingBehavior implements Behavior {
104
104
  // @public
105
105
  export interface BindingObserver<TSource = any, TReturn = any, TParent = any> extends Notifier {
106
106
  disconnect(): void;
107
- observe(source: TSource, context: ExecutionContext): TReturn;
107
+ observe(source: TSource, context: ExecutionContext<TParent>): TReturn;
108
108
  records(): IterableIterator<ObservationRecord>;
109
109
  }
110
110
 
@@ -215,8 +215,8 @@ export const DOM: Readonly<{
215
215
  createInterpolationPlaceholder(index: number): string;
216
216
  createCustomAttributePlaceholder(attributeName: string, index: number): string;
217
217
  createBlockPlaceholder(index: number): string;
218
- queueUpdate(callable: Callable): void;
219
- processUpdates(): void;
218
+ queueUpdate: (callable: Callable) => void;
219
+ processUpdates: () => void;
220
220
  nextUpdate(): Promise<void>;
221
221
  setAttribute(element: HTMLElement, attributeName: string, value: any): void;
222
222
  setBooleanAttribute(element: HTMLElement, attributeName: string, value: boolean): void;
@@ -280,8 +280,15 @@ export class ExecutionContext<TParent = any, TGrandparent = any> {
280
280
  length: number;
281
281
  parent: TParent;
282
282
  parentContext: ExecutionContext<TGrandparent>;
283
+ // @internal
284
+ static setEvent(event: Event | null): void;
283
285
  }
284
286
 
287
+ // Warning: (ae-internal-missing-underscore) The name "FAST" should be prefixed with an underscore because the declaration is marked as @internal
288
+ //
289
+ // @internal
290
+ export const FAST: FASTGlobal;
291
+
285
292
  // @public
286
293
  export interface FASTElement {
287
294
  $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
@@ -307,8 +314,8 @@ export class FASTElementDefinition<TType extends Function = Function> {
307
314
  readonly attributes: ReadonlyArray<AttributeDefinition>;
308
315
  define(registry?: CustomElementRegistry): this;
309
316
  readonly elementOptions?: ElementDefinitionOptions;
310
- static forType<TType extends Function>(type: TType): FASTElementDefinition | undefined;
311
- readonly isDefined: boolean;
317
+ static readonly forType: <TType_1 extends Function>(key: TType_1) => FASTElementDefinition<Function> | undefined;
318
+ get isDefined(): boolean;
312
319
  readonly name: string;
313
320
  readonly propertyLookup: Record<string, AttributeDefinition>;
314
321
  readonly shadowOptions?: ShadowRootInit;
@@ -317,9 +324,20 @@ export class FASTElementDefinition<TType extends Function = Function> {
317
324
  readonly type: TType;
318
325
  }
319
326
 
327
+ // Warning: (ae-internal-missing-underscore) The name "FASTGlobal" should be prefixed with an underscore because the declaration is marked as @internal
328
+ //
329
+ // @internal
330
+ export interface FASTGlobal {
331
+ getById<T>(id: string | number): T | null;
332
+ // (undocumented)
333
+ getById<T>(id: string | number, initialize: () => T): T;
334
+ readonly versions: string[];
335
+ }
336
+
320
337
  // @public
321
338
  export type Global = typeof globalThis & {
322
339
  trustedTypes: TrustedTypes;
340
+ readonly FAST: FASTGlobal;
323
341
  };
324
342
 
325
343
  // @public
@@ -359,6 +377,20 @@ export class HTMLView implements ElementView, SyntheticView {
359
377
  unbind(): void;
360
378
  }
361
379
 
380
+ // Warning: (ae-internal-missing-underscore) The name "KernelServiceId" should be prefixed with an underscore because the declaration is marked as @internal
381
+ //
382
+ // @internal
383
+ export const enum KernelServiceId {
384
+ // (undocumented)
385
+ contextEvent = 3,
386
+ // (undocumented)
387
+ elementRegistry = 4,
388
+ // (undocumented)
389
+ observable = 2,
390
+ // (undocumented)
391
+ updateQueue = 1
392
+ }
393
+
362
394
  // Warning: (ae-internal-missing-underscore) The name "Mutable" should be prefixed with an underscore because the declaration is marked as @internal
363
395
  //
364
396
  // @internal
@@ -392,12 +424,12 @@ export const nullableNumberConverter: ValueConverter;
392
424
  // @public
393
425
  export const Observable: Readonly<{
394
426
  setArrayObserverFactory(factory: (collection: any[]) => Notifier): void;
395
- getNotifier(source: any): Notifier;
427
+ getNotifier: (source: any) => Notifier;
396
428
  track(source: unknown, propertyName: string): void;
397
429
  trackVolatile(): void;
398
430
  notify(source: unknown, args: any): void;
399
431
  defineProperty(target: {}, nameOrAccessor: string | Accessor): void;
400
- getAccessors(target: {}): Accessor[];
432
+ getAccessors: (target: {}) => Accessor[];
401
433
  binding<TSource = any, TReturn = any, TParent = any>(binding: Binding<TSource, TReturn, TParent>, initialSubscriber?: Subscriber | undefined, isVolatileBinding?: boolean): BindingObserver<TSource, TReturn, TParent>;
402
434
  isVolatileBinding<TSource_1 = any, TReturn_1 = any, TParent_1 = any>(binding: Binding<TSource_1, TReturn_1, TParent_1>): boolean;
403
435
  }>;
@@ -465,11 +497,6 @@ export interface RepeatOptions {
465
497
  recycle?: boolean;
466
498
  }
467
499
 
468
- // Warning: (ae-internal-missing-underscore) The name "setCurrentEvent" should be prefixed with an underscore because the declaration is marked as @internal
469
- //
470
- // @internal (undocumented)
471
- export function setCurrentEvent(event: Event | null): void;
472
-
473
500
  // @public
474
501
  export function slotted<T = any>(propertyOrOptions: (keyof T & string) | SlottedBehaviorOptions<keyof T & string>): CaptureType<T>;
475
502
 
@@ -172,25 +172,27 @@ There are a couple of important details to note with array observation:
172
172
  * If the array is a property of an object, you will often want to observe both the property and the array. Observing the property will allow you to detect when the array instance is completely replaced on the object, while observing the array will allow you to detect changes in the array instance itself. When the property changes, be sure to unsubscribe to the old array and set up a subscription to the new array instance.
173
173
  * Observing an array only notifies on changes to the array itself. It does not notify on changes to properties on objects held within the array. Separate observers would need to be set up for those individual properties. These could be set up and torn down in response to changes in the array though.
174
174
 
175
- ## Bindings
175
+ ## Observing Volatile Properties
176
176
 
177
- In addition to watching properties and arrays, you can also watch arbitrary bindings.
177
+ In addition to watching properties and arrays, you can also watch volatile properties.
178
178
 
179
- **Example: Subscribing to a Binding**
179
+ **Example: Subscribing to a Volatile Property**
180
180
 
181
181
  ```ts
182
- import { Observable } from '@microsoft/fast-element';
182
+ import { Observable, defaultExecutionContext } from '@microsoft/fast-element';
183
183
 
184
- const binding = (x: MyClass) => x.someBoolean ? x.valueA : x.valueB;
185
- const bindingObserver = Observable.binding(binding);
184
+ const myObject = new MyClass();
186
185
  const handler = {
187
186
  handleChange(source: any) {
188
187
  // respond to the change here
189
- // the source is the bindingObserver itself
188
+ // the source is the volatile binding itself
190
189
  }
191
190
  };
191
+ const bindingObserver = Observable.binding(myObject.computedValue, handler);
192
+ bindingObserver.observe(myObject, defaultExecutionContext);
192
193
 
193
- bindingObserver.subscribe(handler);
194
+ // Call this to dismantle the observer
195
+ bindingObserver.disconnect();
194
196
  ```
195
197
 
196
198
  ### Records
@@ -330,7 +330,7 @@ const template = html<MyElement>`
330
330
  <ul>
331
331
  ${repeat(x => x.items, html`
332
332
  <li>
333
- ${(x, c) = c.parent.selectTemplate(x)}
333
+ ${(x, c) => c.parent.selectTemplate(x)}
334
334
  </li>
335
335
  `)}
336
336
  </ul>
package/karma.conf.cjs ADDED
@@ -0,0 +1,152 @@
1
+ const path = require("path");
2
+
3
+ const basePath = path.resolve(__dirname);
4
+
5
+ const commonChromeFlags = [
6
+ "--no-default-browser-check",
7
+ "--no-first-run",
8
+ "--no-sandbox",
9
+ "--no-managed-user-acknowledgment-check",
10
+ "--disable-background-timer-throttling",
11
+ "--disable-backing-store-limit",
12
+ "--disable-boot-animation",
13
+ "--disable-cloud-import",
14
+ "--disable-contextual-search",
15
+ "--disable-default-apps",
16
+ "--disable-extensions",
17
+ "--disable-infobars",
18
+ "--disable-translate",
19
+ ];
20
+
21
+ module.exports = function (config) {
22
+ let browsers;
23
+ if (process.env.BROWSERS) {
24
+ browsers = [process.env.BROWSERS];
25
+ } else if (config.browsers) {
26
+ browsers = config.browsers;
27
+ } else {
28
+ browsers = ["Chrome"];
29
+ }
30
+
31
+ const setup = "setup-browser" + (config.package ? "-" + config.package : "");
32
+ const options = {
33
+ basePath,
34
+ browserDisconnectTimeout: 10000,
35
+ processKillTimeout: 10000,
36
+ frameworks: ["source-map-support", "mocha"],
37
+ plugins: [
38
+ require("karma-mocha"),
39
+ require("karma-mocha-reporter"),
40
+ require("karma-webpack"),
41
+ require("karma-source-map-support"),
42
+ require("karma-sourcemap-loader"),
43
+ require("karma-coverage-istanbul-reporter"),
44
+ require("karma-chrome-launcher"),
45
+ require("karma-firefox-launcher"),
46
+ ],
47
+ files: [`dist/esm/__test__/${setup}.js`],
48
+ preprocessors: {
49
+ [`dist/esm/__test__/${setup}.js`]: ["webpack", "sourcemap"],
50
+ },
51
+ webpackMiddleware: {
52
+ // webpack-dev-middleware configuration
53
+ // i. e.
54
+ stats: "errors-only",
55
+ },
56
+ webpack: {
57
+ mode: "none",
58
+ resolve: {
59
+ extensions: [".js"],
60
+ modules: ["dist", "node_modules"],
61
+ mainFields: ["module", "main"],
62
+ },
63
+ devtool: "inline-source-map",
64
+ performance: {
65
+ hints: false,
66
+ },
67
+ optimization: {
68
+ namedModules: false,
69
+ namedChunks: false,
70
+ nodeEnv: false,
71
+ usedExports: true,
72
+ flagIncludedChunks: false,
73
+ occurrenceOrder: false,
74
+ sideEffects: true,
75
+ concatenateModules: true,
76
+ splitChunks: {
77
+ name: false,
78
+ },
79
+ runtimeChunk: false,
80
+ noEmitOnErrors: false,
81
+ checkWasmTypes: false,
82
+ minimize: false,
83
+ },
84
+ module: {
85
+ rules: [
86
+ {
87
+ test: /\.js\.map$/,
88
+ use: ["ignore-loader"],
89
+ },
90
+ {
91
+ test: /\.js$/,
92
+ use: [
93
+ {
94
+ loader: "source-map-loader",
95
+ options: {
96
+ enforce: "pre",
97
+ },
98
+ },
99
+ ],
100
+ },
101
+ ],
102
+ },
103
+ },
104
+ mime: {
105
+ "text/x-typescript": ["ts"],
106
+ },
107
+ reporters: [config.reporter || (process.env.CI ? "min" : "progress")],
108
+ browsers: browsers,
109
+ customLaunchers: {
110
+ ChromeDebugging: {
111
+ base: "Chrome",
112
+ flags: [...commonChromeFlags, "--remote-debugging-port=9333"],
113
+ debug: true,
114
+ },
115
+ ChromeHeadlessOpt: {
116
+ base: "ChromeHeadless",
117
+ flags: [...commonChromeFlags],
118
+ },
119
+ },
120
+ client: {
121
+ captureConsole: true,
122
+ mocha: {
123
+ bail: config["bail"],
124
+ ui: "bdd",
125
+ timeout: 5000,
126
+ },
127
+ },
128
+ logLevel: config.LOG_ERROR, // to disable the WARN 404 for image requests
129
+ };
130
+
131
+ if (config.coverage) {
132
+ options.webpack.module.rules.push({
133
+ enforce: "post",
134
+ exclude: /(__tests__|testing|node_modules|\.spec\.[tj]s$)/,
135
+ loader: "istanbul-instrumenter-loader",
136
+ options: { esModules: true },
137
+ test: /\.[tj]s$/,
138
+ });
139
+ options.reporters = ["coverage-istanbul", ...options.reporters];
140
+ options.coverageIstanbulReporter = {
141
+ reports: ["html", "text-summary", "json", "lcovonly", "cobertura"],
142
+ dir: "coverage",
143
+ };
144
+ options.junitReporter = {
145
+ outputDir: "coverage",
146
+ outputFile: "test-results.xml",
147
+ useBrowserName: false,
148
+ };
149
+ }
150
+
151
+ config.set(options);
152
+ };
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@microsoft/fast-element",
3
3
  "description": "A library for constructing Web Components",
4
4
  "sideEffects": false,
5
- "version": "1.7.1",
5
+ "version": "1.9.0",
6
6
  "author": {
7
7
  "name": "Microsoft",
8
8
  "url": "https://discord.gg/FcSNfg4"
@@ -17,6 +17,7 @@
17
17
  },
18
18
  "main": "dist/esm/index.js",
19
19
  "types": "dist/fast-element.d.ts",
20
+ "type": "module",
20
21
  "unpkg": "dist/fast-element.min.js",
21
22
  "scripts": {
22
23
  "clean:dist": "node ../../../build/clean.js dist",
@@ -32,17 +33,17 @@
32
33
  "prettier:diff": "prettier --config ../../../.prettierrc \"**/*.ts\" --list-different",
33
34
  "eslint": "eslint . --ext .ts",
34
35
  "eslint:fix": "eslint . --ext .ts --fix",
35
- "test": "yarn test-chrome:verbose && yarn doc:ci",
36
+ "test": "yarn eslint && yarn test-chrome:verbose && yarn doc:ci",
36
37
  "test-node": "mocha --reporter min --exit dist/esm/__test__/setup-node.js './dist/esm/**/*.spec.js'",
37
38
  "test-node:verbose": "mocha --reporter spec --exit dist/esm/__test__/setup-node.js './dist/esm/**/*.spec.js'",
38
- "test-chrome": "karma start karma.conf.js --browsers=ChromeHeadlessOpt --single-run --coverage",
39
- "test-chrome:verbose": "karma start karma.conf.js --browsers=ChromeHeadlessOpt --single-run --coverage --reporter=mocha",
40
- "test-chrome:watch": "karma start karma.conf.js --browsers=ChromeHeadlessOpt --coverage --watch-extensions js",
41
- "test-chrome:debugger": "karma start karma.conf.js --browsers=ChromeDebugging",
42
- "test-chrome:verbose:watch": "karma start karma.conf.js --browsers=ChromeHeadlessOpt --coverage --watch-extensions js --reporter=mocha",
43
- "test-chrome:verbose:debugger": "karma start karma.conf.js --browsers=ChromeDebugging --reporter=mocha",
44
- "test-firefox": "karma start karma.conf.js --browsers=FirefoxHeadless --single-run --coverage",
45
- "test-firefox:verbose": "karma start karma.conf.js --browsers=FirefoxHeadless --single-run --coverage --reporter=mocha"
39
+ "test-chrome": "karma start karma.conf.cjs --browsers=ChromeHeadlessOpt --single-run --coverage",
40
+ "test-chrome:verbose": "karma start karma.conf.cjs --browsers=ChromeHeadlessOpt --single-run --coverage --reporter=mocha",
41
+ "test-chrome:watch": "karma start karma.conf.cjs --browsers=ChromeHeadlessOpt --coverage --watch-extensions js",
42
+ "test-chrome:debugger": "karma start karma.conf.cjs --browsers=ChromeDebugging",
43
+ "test-chrome:verbose:watch": "karma start karma.conf.cjs --browsers=ChromeHeadlessOpt --coverage --watch-extensions js --reporter=mocha",
44
+ "test-chrome:verbose:debugger": "karma start karma.conf.cjs --browsers=ChromeDebugging --reporter=mocha",
45
+ "test-firefox": "karma start karma.conf.cjs --browsers=FirefoxHeadless --single-run --coverage",
46
+ "test-firefox:verbose": "karma start karma.conf.cjs --browsers=FirefoxHeadless --single-run --coverage --reporter=mocha"
46
47
  },
47
48
  "devDependencies": {
48
49
  "@microsoft/api-extractor": "7.8.1",