tinkiet 0.2.80 → 0.3.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 (9) hide show
  1. package/drawer/drawer.d.ts +1 -1
  2. package/drawer/drawer.js +17 -4
  3. package/drawer/drawer.scss.js +2 -2
  4. package/package.json +2 -2
  5. package/select/select.js +2 -2
  6. package/textarea/textarea.js +2 -2
  7. package/textfield/textfield.js +2 -2
  8. package/umd/tinkiet.min.d.ts +1 -1
  9. package/umd/tinkiet.min.js +47 -46
package/drawer/drawer.d.ts CHANGED
@@ -5,7 +5,7 @@ declare class TkDrawer extends LitElement {
5
5
  over: boolean;
6
6
  openQuery: string;
7
7
  overQuery: string;
8
- left: boolean;
8
+ right: boolean;
9
9
  swipeable: boolean;
10
10
  private $drawer;
11
11
  private mql;
package/drawer/drawer.js CHANGED
@@ -2,14 +2,14 @@ import { __decorate, __metadata } from 'tslib';
2
2
  import { LitElement, html, css, unsafeCSS } from 'lit';
3
3
  import { property, query, customElement } from 'lit/decorators.js';
4
4
  import css_248z from './drawer.scss.js';
5
- import { PointerListener, Tap, Pan } from 'contactjs';
5
+ import { DIRECTION_HORIZONTAL, Pan, PointerListener, Tap } from 'contactjs';
6
6
 
7
7
  let TkDrawer = class TkDrawer extends LitElement {
8
8
  constructor() {
9
9
  super(...arguments);
10
10
  this.open = false;
11
11
  this.over = false;
12
- this.left = false;
12
+ this.right = false;
13
13
  this.swipeable = false;
14
14
  }
15
15
  render() {
@@ -27,8 +27,17 @@ let TkDrawer = class TkDrawer extends LitElement {
27
27
  this.show();
28
28
  }
29
29
  if (props.has("swipeable") && this.swipeable) {
30
+ var panOptions = {
31
+ supportedDirections: DIRECTION_HORIZONTAL,
32
+ bubbles: false
33
+ };
34
+ var panRecognizer = new Pan(this.$drawer, panOptions);
30
35
  this.pointerListener = new PointerListener(this.$drawer, {
31
- supportedGestures: [Tap, Pan],
36
+ DEBUG: true,
37
+ DEBUG_CONTACT: true,
38
+ DEBUG_GESTURES: true,
39
+ // handleTouchEvents : false,
40
+ supportedGestures: [Tap, panRecognizer],
32
41
  bubbles: false
33
42
  });
34
43
  this.$drawer.addEventListener("tap", (event) => {
@@ -37,6 +46,9 @@ let TkDrawer = class TkDrawer extends LitElement {
37
46
  if (el)
38
47
  el.click();
39
48
  });
49
+ this.$drawer.addEventListener("panstart", (event) => {
50
+ this.$drawer.style.transition = "transform 0ms ease";
51
+ });
40
52
  this.$drawer.addEventListener("pan", (event) => {
41
53
  var x = event.detail.global.deltaX > 0 ? 0 : event.detail.global.deltaX;
42
54
  var y = 0;
@@ -47,6 +59,7 @@ let TkDrawer = class TkDrawer extends LitElement {
47
59
  });
48
60
  this.$drawer.addEventListener("panend", (event) => {
49
61
  requestAnimationFrame(_ => {
62
+ this.$drawer.style.transition = "";
50
63
  this.$drawer.style.transform = "";
51
64
  this.open = event.detail.global.deltaX < -50 ? false : true;
52
65
  });
@@ -101,7 +114,7 @@ __decorate([
101
114
  __decorate([
102
115
  property({ type: Boolean, reflect: true }),
103
116
  __metadata("design:type", Boolean)
104
- ], TkDrawer.prototype, "left", void 0);
117
+ ], TkDrawer.prototype, "right", void 0);
105
118
  __decorate([
106
119
  property({ type: Boolean, reflect: true }),
107
120
  __metadata("design:type", Boolean)
package/drawer/drawer.scss.js CHANGED
@@ -1,4 +1,4 @@
1
- var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{display:block;height:100%;overflow:hidden;position:relative;width:100%}.drawer{background-color:var(--background,#f7f7f7);color:var(--foreground,#454545);display:flex;flex-direction:column;height:100%;overflow:scroll;position:absolute;top:0;transform:translateX(-100%);transition:transform cubic-bezier(.4,0,.2,1) var(--transition-duration-medium,.18s);width:var(--drawer-width,256px);will-change:transform;z-index:var(--drawer-z-index,200)}.drawer .drawer-content{flex:1;overflow:scroll}:host([left]) .drawer{right:0;transform:translateX(100%)}.overlay{background-color:#00000080;bottom:0;display:none;left:0;position:absolute;right:0;top:0;z-index:var(--drawer-overlay-z-index,200)}.container{background-color:var(--background,#f7f7f7);height:100%;overflow:scroll;transition:padding cubic-bezier(.4,0,.2,1) var(--transition-duration-slow,.25s)}:host([open]) .drawer{transform:none}:host([open]) .container{padding-left:var(--drawer-width)}:host([open][over]) .container{padding-left:0}:host([open][over]) .overlay{display:block}@media (max-width:var(--drawer-trigger-width,400px)){:host([open]) .container{padding-left:0}:host([open]) .overlay{display:block}}";
2
- var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{display:block;height:100%;overflow:hidden;position:relative;width:100%}.drawer{background-color:var(--background,#f7f7f7);color:var(--foreground,#454545);display:flex;flex-direction:column;height:100%;overflow:scroll;position:absolute;top:0;transform:translateX(-100%);transition:transform cubic-bezier(.4,0,.2,1) var(--transition-duration-medium,.18s);width:var(--drawer-width,256px);will-change:transform;z-index:var(--drawer-z-index,200)}.drawer .drawer-content{flex:1;overflow:scroll}:host([left]) .drawer{right:0;transform:translateX(100%)}.overlay{background-color:#00000080;bottom:0;display:none;left:0;position:absolute;right:0;top:0;z-index:var(--drawer-overlay-z-index,200)}.container{background-color:var(--background,#f7f7f7);height:100%;overflow:scroll;transition:padding cubic-bezier(.4,0,.2,1) var(--transition-duration-slow,.25s)}:host([open]) .drawer{transform:none}:host([open]) .container{padding-left:var(--drawer-width)}:host([open][over]) .container{padding-left:0}:host([open][over]) .overlay{display:block}@media (max-width:var(--drawer-trigger-width,400px)){:host([open]) .container{padding-left:0}:host([open]) .overlay{display:block}}";
1
+ var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{display:block;height:100%;overflow:hidden;position:relative;width:100%}.drawer{background-color:var(--background,#f7f7f7);color:var(--foreground,#454545);display:flex;flex-direction:column;height:100%;overflow:scroll;position:absolute;top:0;touch-action:pan-y;transform:translateX(-100%);transition:transform cubic-bezier(.4,0,.2,1) var(--transition-duration-medium,.18s);width:var(--drawer-width,256px);will-change:transform;z-index:var(--drawer-z-index,200)}.drawer .drawer-content{flex:1;overflow:scroll}:host([right]) .drawer{right:0;transform:translateX(100%)}.overlay{background-color:#00000080;bottom:0;display:none;left:0;position:absolute;right:0;top:0;z-index:var(--drawer-overlay-z-index,200)}.container{background-color:var(--background,#f7f7f7);height:100%;overflow:scroll;transition:padding cubic-bezier(.4,0,.2,1) var(--transition-duration-slow,.25s)}:host([open]) .drawer{transform:none}:host([open]) .container{padding-left:var(--drawer-width)}:host([open][over]) .container{padding-left:0}:host([open][over]) .overlay{display:block}@media (max-width:var(--drawer-trigger-width,400px)){:host([open]) .container{padding-left:0}:host([open]) .overlay{display:block}}";
2
+ var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{display:block;height:100%;overflow:hidden;position:relative;width:100%}.drawer{background-color:var(--background,#f7f7f7);color:var(--foreground,#454545);display:flex;flex-direction:column;height:100%;overflow:scroll;position:absolute;top:0;touch-action:pan-y;transform:translateX(-100%);transition:transform cubic-bezier(.4,0,.2,1) var(--transition-duration-medium,.18s);width:var(--drawer-width,256px);will-change:transform;z-index:var(--drawer-z-index,200)}.drawer .drawer-content{flex:1;overflow:scroll}:host([right]) .drawer{right:0;transform:translateX(100%)}.overlay{background-color:#00000080;bottom:0;display:none;left:0;position:absolute;right:0;top:0;z-index:var(--drawer-overlay-z-index,200)}.container{background-color:var(--background,#f7f7f7);height:100%;overflow:scroll;transition:padding cubic-bezier(.4,0,.2,1) var(--transition-duration-slow,.25s)}:host([open]) .drawer{transform:none}:host([open]) .container{padding-left:var(--drawer-width)}:host([open][over]) .container{padding-left:0}:host([open][over]) .overlay{display:block}@media (max-width:var(--drawer-trigger-width,400px)){:host([open]) .container{padding-left:0}:host([open]) .overlay{display:block}}";
3
3
 
4
4
  export { css_248z as default, stylesheet };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tinkiet",
3
- "version": "0.2.80",
3
+ "version": "0.3.0",
4
4
  "description": "Pragmatic UI Web Components",
5
5
  "main": "index.js",
6
6
  "module": "index.js",
@@ -27,7 +27,7 @@
27
27
  "homepage": "https://tinkiet.educ.cloud",
28
28
  "dependencies": {
29
29
  "contactjs": "^1.4.0",
30
- "lit": "^2.0.2",
30
+ "lit": "^2.2.1",
31
31
  "tslib": "^2.3.1"
32
32
  },
33
33
  "contributors": [
package/select/select.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { __decorate, __metadata } from 'tslib';
2
2
  import { LitElement, html, css, unsafeCSS } from 'lit';
3
- import { property, eventOptions, customElement } from 'lit/decorators.js';
3
+ import { property, state, eventOptions, customElement } from 'lit/decorators.js';
4
4
  import { ifDefined } from 'lit/directives/if-defined.js';
5
5
  import '../box/index.js';
6
6
  import { uniqueID } from '../utils/unique.js';
@@ -85,7 +85,7 @@ __decorate([
85
85
  __metadata("design:type", String)
86
86
  ], TkSelect.prototype, "pattern", void 0);
87
87
  __decorate([
88
- property({ type: String, attribute: "value" }),
88
+ state(),
89
89
  __metadata("design:type", String)
90
90
  ], TkSelect.prototype, "initialValue", void 0);
91
91
  __decorate([
package/textarea/textarea.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { __decorate, __metadata } from 'tslib';
2
2
  import { LitElement, html, css, unsafeCSS } from 'lit';
3
- import { property, eventOptions, customElement } from 'lit/decorators.js';
3
+ import { property, state, eventOptions, customElement } from 'lit/decorators.js';
4
4
  import { ifDefined } from 'lit/directives/if-defined.js';
5
5
  import { uniqueID } from '../utils/unique.js';
6
6
  import css_248z from './textarea.scss.js';
@@ -90,7 +90,7 @@ __decorate([
90
90
  __metadata("design:type", String)
91
91
  ], TkTextarea.prototype, "pattern", void 0);
92
92
  __decorate([
93
- property({ type: String }),
93
+ state(),
94
94
  __metadata("design:type", String)
95
95
  ], TkTextarea.prototype, "initialValue", void 0);
96
96
  __decorate([
package/textfield/textfield.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { __decorate, __metadata } from 'tslib';
2
+ import { property, state, eventOptions, customElement } from 'lit/decorators.js';
2
3
  import { LitElement, html, css, unsafeCSS } from 'lit';
3
- import { property, eventOptions, customElement } from 'lit/decorators.js';
4
4
  import { ifDefined } from 'lit/directives/if-defined.js';
5
5
  import { uniqueID } from '../utils/unique.js';
6
6
  import css_248z from './textfield.scss.js';
@@ -89,7 +89,7 @@ __decorate([
89
89
  __metadata("design:type", String)
90
90
  ], TkTextfield.prototype, "pattern", void 0);
91
91
  __decorate([
92
- property({ type: String, attribute: "value" }),
92
+ state(),
93
93
  __metadata("design:type", String)
94
94
  ], TkTextfield.prototype, "initialValue", void 0);
95
95
  __decorate([
package/umd/tinkiet.min.d.ts CHANGED
@@ -210,7 +210,7 @@ declare class TkDrawer extends LitElement {
210
210
  over: boolean;
211
211
  openQuery: string;
212
212
  overQuery: string;
213
- left: boolean;
213
+ right: boolean;
214
214
  swipeable: boolean;
215
215
  private $drawer;
216
216
  private mql;
package/umd/tinkiet.min.js CHANGED
@@ -28,13 +28,13 @@
28
28
  * Copyright 2017 Google LLC
29
29
  * SPDX-License-Identifier: BSD-3-Clause
30
30
  */
31
- var y;b.finalized=!0,b.elementProperties=new Map,b.elementStyles=[],b.shadowRootOptions={mode:"open"},null==v||v({ReactiveElement:b}),(null!==(d=globalThis.reactiveElementVersions)&&void 0!==d?d:globalThis.reactiveElementVersions=[]).push("1.3.0");const f=globalThis.trustedTypes,k=f?f.createPolicy("lit-html",{createHTML:t=>t}):void 0,x=`lit$${(Math.random()+"").slice(9)}$`,w="?"+x,T=`<${w}>`,$=document,P=(t="")=>$.createComment(t),S=t=>null===t||"object"!=typeof t&&"function"!=typeof t,_=Array.isArray,E=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,A=/-->/g,z=/>/g,C=/>|[ \n \r](?:([^\s"'>=/]+)([ \n \r]*=[ \n \r]*(?:[^ \n \r"'`<>=]|("|')|))|$)/g,B=/'/g,M=/"/g,L=/^(?:script|style|textarea|title)$/i,I=(t=>(e,...r)=>({_$litType$:t,strings:e,values:r}))(1),D=Symbol.for("lit-noChange"),U=Symbol.for("lit-nothing"),N=new WeakMap,H=$.createTreeWalker($,129,null,!1),R=(t,e)=>{const r=t.length-1,i=[];let o,a=2===e?"<svg>":"",n=E;for(let e=0;e<r;e++){const r=t[e];let s,l,h=-1,d=0;for(;d<r.length&&(n.lastIndex=d,l=n.exec(r),null!==l);)d=n.lastIndex,n===E?"!--"===l[1]?n=A:void 0!==l[1]?n=z:void 0!==l[2]?(L.test(l[2])&&(o=RegExp("</"+l[2],"g")),n=C):void 0!==l[3]&&(n=C):n===C?">"===l[0]?(n=null!=o?o:E,h=-1):void 0===l[1]?h=-2:(h=n.lastIndex-l[2].length,s=l[1],n=void 0===l[3]?C:'"'===l[3]?M:B):n===M||n===B?n=C:n===A||n===z?n=E:(n=C,o=void 0);const c=n===C&&t[e+1].startsWith("/>")?" ":"";a+=n===E?r+T:h>=0?(i.push(s),r.slice(0,h)+"$lit$"+r.slice(h)+x+c):r+x+(-2===h?(i.push(void 0),e):c)}const s=a+(t[r]||"<?>")+(2===e?"</svg>":"");if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return[void 0!==k?k.createHTML(s):s,i]};class q{constructor({strings:t,_$litType$:e},r){let i;this.parts=[];let o=0,a=0;const n=t.length-1,s=this.parts,[l,h]=R(t,e);if(this.el=q.createElement(l,r),H.currentNode=this.el.content,2===e){const t=this.el.content,e=t.firstChild;e.remove(),t.append(...e.childNodes)}for(;null!==(i=H.nextNode())&&s.length<n;){if(1===i.nodeType){if(i.hasAttributes()){const t=[];for(const e of i.getAttributeNames())if(e.endsWith("$lit$")||e.startsWith(x)){const r=h[a++];if(t.push(e),void 0!==r){const t=i.getAttribute(r.toLowerCase()+"$lit$").split(x),e=/([.?@])?(.*)/.exec(r);s.push({type:1,index:o,name:e[2],strings:t,ctor:"."===e[1]?F:"?"===e[1]?X:"@"===e[1]?K:V})}else s.push({type:6,index:o})}for(const e of t)i.removeAttribute(e)}if(L.test(i.tagName)){const t=i.textContent.split(x),e=t.length-1;if(e>0){i.textContent=f?f.emptyScript:"";for(let r=0;r<e;r++)i.append(t[r],P()),H.nextNode(),s.push({type:2,index:++o});i.append(t[e],P())}}}else if(8===i.nodeType)if(i.data===w)s.push({type:2,index:o});else{let t=-1;for(;-1!==(t=i.data.indexOf(x,t+1));)s.push({type:7,index:o}),t+=x.length-1}o++}}static createElement(t,e){const r=$.createElement("template");return r.innerHTML=t,r}}function G(t,e,r=t,i){var o,a,n,s;if(e===D)return e;let l=void 0!==i?null===(o=r._$Cl)||void 0===o?void 0:o[i]:r._$Cu;const h=S(e)?void 0:e._$litDirective$;return(null==l?void 0:l.constructor)!==h&&(null===(a=null==l?void 0:l._$AO)||void 0===a||a.call(l,!1),void 0===h?l=void 0:(l=new h(t),l._$AT(t,r,i)),void 0!==i?(null!==(n=(s=r)._$Cl)&&void 0!==n?n:s._$Cl=[])[i]=l:r._$Cu=l),void 0!==l&&(e=G(t,l._$AS(t,e.values),l,i)),e}class O{constructor(t,e){this.v=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}p(t){var e;const{el:{content:r},parts:i}=this._$AD,o=(null!==(e=null==t?void 0:t.creationScope)&&void 0!==e?e:$).importNode(r,!0);H.currentNode=o;let a=H.nextNode(),n=0,s=0,l=i[0];for(;void 0!==l;){if(n===l.index){let e;2===l.type?e=new j(a,a.nextSibling,this,t):1===l.type?e=new l.ctor(a,l.name,l.strings,this,t):6===l.type&&(e=new Q(a,this,t)),this.v.push(e),l=i[++s]}n!==(null==l?void 0:l.index)&&(a=H.nextNode(),n++)}return o}m(t){let e=0;for(const r of this.v)void 0!==r&&(void 0!==r.strings?(r._$AI(t,r,e),e+=r.strings.length-2):r._$AI(t[e])),e++}}class j{constructor(t,e,r,i){var o;this.type=2,this._$AH=U,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=r,this.options=i,this._$Cg=null===(o=null==i?void 0:i.isConnected)||void 0===o||o}get _$AU(){var t,e;return null!==(e=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==e?e:this._$Cg}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return void 0!==e&&11===t.nodeType&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=G(this,t,e),S(t)?t===U||null==t||""===t?(this._$AH!==U&&this._$AR(),this._$AH=U):t!==this._$AH&&t!==D&&this.$(t):void 0!==t._$litType$?this.T(t):void 0!==t.nodeType?this.k(t):(t=>{var e;return _(t)||"function"==typeof(null===(e=t)||void 0===e?void 0:e[Symbol.iterator])})(t)?this.S(t):this.$(t)}A(t,e=this._$AB){return this._$AA.parentNode.insertBefore(t,e)}k(t){this._$AH!==t&&(this._$AR(),this._$AH=this.A(t))}$(t){this._$AH!==U&&S(this._$AH)?this._$AA.nextSibling.data=t:this.k($.createTextNode(t)),this._$AH=t}T(t){var e;const{values:r,_$litType$:i}=t,o="number"==typeof i?this._$AC(t):(void 0===i.el&&(i.el=q.createElement(i.h,this.options)),i);if((null===(e=this._$AH)||void 0===e?void 0:e._$AD)===o)this._$AH.m(r);else{const t=new O(o,this),e=t.p(this.options);t.m(r),this.k(e),this._$AH=t}}_$AC(t){let e=N.get(t.strings);return void 0===e&&N.set(t.strings,e=new q(t)),e}S(t){_(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let r,i=0;for(const o of t)i===e.length?e.push(r=new j(this.A(P()),this.A(P()),this,this.options)):r=e[i],r._$AI(o),i++;i<e.length&&(this._$AR(r&&r._$AB.nextSibling,i),e.length=i)}_$AR(t=this._$AA.nextSibling,e){var r;for(null===(r=this._$AP)||void 0===r||r.call(this,!1,!0,e);t&&t!==this._$AB;){const e=t.nextSibling;t.remove(),t=e}}setConnected(t){var e;void 0===this._$AM&&(this._$Cg=t,null===(e=this._$AP)||void 0===e||e.call(this,t))}}class V{constructor(t,e,r,i,o){this.type=1,this._$AH=U,this._$AN=void 0,this.element=t,this.name=e,this._$AM=i,this.options=o,r.length>2||""!==r[0]||""!==r[1]?(this._$AH=Array(r.length-1).fill(new String),this.strings=r):this._$AH=U}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,e=this,r,i){const o=this.strings;let a=!1;if(void 0===o)t=G(this,t,e,0),a=!S(t)||t!==this._$AH&&t!==D,a&&(this._$AH=t);else{const i=t;let n,s;for(t=o[0],n=0;n<o.length-1;n++)s=G(this,i[r+n],e,n),s===D&&(s=this._$AH[n]),a||(a=!S(s)||s!==this._$AH[n]),s===U?t=U:t!==U&&(t+=(null!=s?s:"")+o[n+1]),this._$AH[n]=s}a&&!i&&this.C(t)}C(t){t===U?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class F extends V{constructor(){super(...arguments),this.type=3}C(t){this.element[this.name]=t===U?void 0:t}}const Y=f?f.emptyScript:"";class X extends V{constructor(){super(...arguments),this.type=4}C(t){t&&t!==U?this.element.setAttribute(this.name,Y):this.element.removeAttribute(this.name)}}class K extends V{constructor(t,e,r,i,o){super(t,e,r,i,o),this.type=5}_$AI(t,e=this){var r;if((t=null!==(r=G(this,t,e,0))&&void 0!==r?r:U)===D)return;const i=this._$AH,o=t===U&&i!==U||t.capture!==i.capture||t.once!==i.once||t.passive!==i.passive,a=t!==U&&(i===U||o);o&&this.element.removeEventListener(this.name,this,i),a&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var e,r;"function"==typeof this._$AH?this._$AH.call(null!==(r=null===(e=this.options)||void 0===e?void 0:e.host)&&void 0!==r?r:this.element,t):this._$AH.handleEvent(t)}}class Q{constructor(t,e,r){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=r}get _$AU(){return this._$AM._$AU}_$AI(t){G(this,t)}}const W=window.litHtmlPolyfillSupport;
31
+ var y;b.finalized=!0,b.elementProperties=new Map,b.elementStyles=[],b.shadowRootOptions={mode:"open"},null==v||v({ReactiveElement:b}),(null!==(d=globalThis.reactiveElementVersions)&&void 0!==d?d:globalThis.reactiveElementVersions=[]).push("1.3.1");const f=globalThis.trustedTypes,k=f?f.createPolicy("lit-html",{createHTML:t=>t}):void 0,x=`lit$${(Math.random()+"").slice(9)}$`,w="?"+x,T=`<${w}>`,$=document,P=(t="")=>$.createComment(t),S=t=>null===t||"object"!=typeof t&&"function"!=typeof t,_=Array.isArray,E=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,A=/-->/g,z=/>/g,C=/>|[ \n \r](?:([^\s"'>=/]+)([ \n \r]*=[ \n \r]*(?:[^ \n \r"'`<>=]|("|')|))|$)/g,B=/'/g,M=/"/g,L=/^(?:script|style|textarea|title)$/i,I=(t=>(e,...r)=>({_$litType$:t,strings:e,values:r}))(1),D=Symbol.for("lit-noChange"),U=Symbol.for("lit-nothing"),N=new WeakMap,H=$.createTreeWalker($,129,null,!1),R=(t,e)=>{const r=t.length-1,i=[];let o,a=2===e?"<svg>":"",n=E;for(let e=0;e<r;e++){const r=t[e];let s,l,h=-1,d=0;for(;d<r.length&&(n.lastIndex=d,l=n.exec(r),null!==l);)d=n.lastIndex,n===E?"!--"===l[1]?n=A:void 0!==l[1]?n=z:void 0!==l[2]?(L.test(l[2])&&(o=RegExp("</"+l[2],"g")),n=C):void 0!==l[3]&&(n=C):n===C?">"===l[0]?(n=null!=o?o:E,h=-1):void 0===l[1]?h=-2:(h=n.lastIndex-l[2].length,s=l[1],n=void 0===l[3]?C:'"'===l[3]?M:B):n===M||n===B?n=C:n===A||n===z?n=E:(n=C,o=void 0);const c=n===C&&t[e+1].startsWith("/>")?" ":"";a+=n===E?r+T:h>=0?(i.push(s),r.slice(0,h)+"$lit$"+r.slice(h)+x+c):r+x+(-2===h?(i.push(void 0),e):c)}const s=a+(t[r]||"<?>")+(2===e?"</svg>":"");if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return[void 0!==k?k.createHTML(s):s,i]};class G{constructor({strings:t,_$litType$:e},r){let i;this.parts=[];let o=0,a=0;const n=t.length-1,s=this.parts,[l,h]=R(t,e);if(this.el=G.createElement(l,r),H.currentNode=this.el.content,2===e){const t=this.el.content,e=t.firstChild;e.remove(),t.append(...e.childNodes)}for(;null!==(i=H.nextNode())&&s.length<n;){if(1===i.nodeType){if(i.hasAttributes()){const t=[];for(const e of i.getAttributeNames())if(e.endsWith("$lit$")||e.startsWith(x)){const r=h[a++];if(t.push(e),void 0!==r){const t=i.getAttribute(r.toLowerCase()+"$lit$").split(x),e=/([.?@])?(.*)/.exec(r);s.push({type:1,index:o,name:e[2],strings:t,ctor:"."===e[1]?F:"?"===e[1]?X:"@"===e[1]?K:V})}else s.push({type:6,index:o})}for(const e of t)i.removeAttribute(e)}if(L.test(i.tagName)){const t=i.textContent.split(x),e=t.length-1;if(e>0){i.textContent=f?f.emptyScript:"";for(let r=0;r<e;r++)i.append(t[r],P()),H.nextNode(),s.push({type:2,index:++o});i.append(t[e],P())}}}else if(8===i.nodeType)if(i.data===w)s.push({type:2,index:o});else{let t=-1;for(;-1!==(t=i.data.indexOf(x,t+1));)s.push({type:7,index:o}),t+=x.length-1}o++}}static createElement(t,e){const r=$.createElement("template");return r.innerHTML=t,r}}function q(t,e,r=t,i){var o,a,n,s;if(e===D)return e;let l=void 0!==i?null===(o=r._$Cl)||void 0===o?void 0:o[i]:r._$Cu;const h=S(e)?void 0:e._$litDirective$;return(null==l?void 0:l.constructor)!==h&&(null===(a=null==l?void 0:l._$AO)||void 0===a||a.call(l,!1),void 0===h?l=void 0:(l=new h(t),l._$AT(t,r,i)),void 0!==i?(null!==(n=(s=r)._$Cl)&&void 0!==n?n:s._$Cl=[])[i]=l:r._$Cu=l),void 0!==l&&(e=q(t,l._$AS(t,e.values),l,i)),e}class O{constructor(t,e){this.v=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}p(t){var e;const{el:{content:r},parts:i}=this._$AD,o=(null!==(e=null==t?void 0:t.creationScope)&&void 0!==e?e:$).importNode(r,!0);H.currentNode=o;let a=H.nextNode(),n=0,s=0,l=i[0];for(;void 0!==l;){if(n===l.index){let e;2===l.type?e=new j(a,a.nextSibling,this,t):1===l.type?e=new l.ctor(a,l.name,l.strings,this,t):6===l.type&&(e=new Q(a,this,t)),this.v.push(e),l=i[++s]}n!==(null==l?void 0:l.index)&&(a=H.nextNode(),n++)}return o}m(t){let e=0;for(const r of this.v)void 0!==r&&(void 0!==r.strings?(r._$AI(t,r,e),e+=r.strings.length-2):r._$AI(t[e])),e++}}class j{constructor(t,e,r,i){var o;this.type=2,this._$AH=U,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=r,this.options=i,this._$Cg=null===(o=null==i?void 0:i.isConnected)||void 0===o||o}get _$AU(){var t,e;return null!==(e=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==e?e:this._$Cg}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return void 0!==e&&11===t.nodeType&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=q(this,t,e),S(t)?t===U||null==t||""===t?(this._$AH!==U&&this._$AR(),this._$AH=U):t!==this._$AH&&t!==D&&this.$(t):void 0!==t._$litType$?this.T(t):void 0!==t.nodeType?this.k(t):(t=>{var e;return _(t)||"function"==typeof(null===(e=t)||void 0===e?void 0:e[Symbol.iterator])})(t)?this.S(t):this.$(t)}A(t,e=this._$AB){return this._$AA.parentNode.insertBefore(t,e)}k(t){this._$AH!==t&&(this._$AR(),this._$AH=this.A(t))}$(t){this._$AH!==U&&S(this._$AH)?this._$AA.nextSibling.data=t:this.k($.createTextNode(t)),this._$AH=t}T(t){var e;const{values:r,_$litType$:i}=t,o="number"==typeof i?this._$AC(t):(void 0===i.el&&(i.el=G.createElement(i.h,this.options)),i);if((null===(e=this._$AH)||void 0===e?void 0:e._$AD)===o)this._$AH.m(r);else{const t=new O(o,this),e=t.p(this.options);t.m(r),this.k(e),this._$AH=t}}_$AC(t){let e=N.get(t.strings);return void 0===e&&N.set(t.strings,e=new G(t)),e}S(t){_(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let r,i=0;for(const o of t)i===e.length?e.push(r=new j(this.A(P()),this.A(P()),this,this.options)):r=e[i],r._$AI(o),i++;i<e.length&&(this._$AR(r&&r._$AB.nextSibling,i),e.length=i)}_$AR(t=this._$AA.nextSibling,e){var r;for(null===(r=this._$AP)||void 0===r||r.call(this,!1,!0,e);t&&t!==this._$AB;){const e=t.nextSibling;t.remove(),t=e}}setConnected(t){var e;void 0===this._$AM&&(this._$Cg=t,null===(e=this._$AP)||void 0===e||e.call(this,t))}}class V{constructor(t,e,r,i,o){this.type=1,this._$AH=U,this._$AN=void 0,this.element=t,this.name=e,this._$AM=i,this.options=o,r.length>2||""!==r[0]||""!==r[1]?(this._$AH=Array(r.length-1).fill(new String),this.strings=r):this._$AH=U}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,e=this,r,i){const o=this.strings;let a=!1;if(void 0===o)t=q(this,t,e,0),a=!S(t)||t!==this._$AH&&t!==D,a&&(this._$AH=t);else{const i=t;let n,s;for(t=o[0],n=0;n<o.length-1;n++)s=q(this,i[r+n],e,n),s===D&&(s=this._$AH[n]),a||(a=!S(s)||s!==this._$AH[n]),s===U?t=U:t!==U&&(t+=(null!=s?s:"")+o[n+1]),this._$AH[n]=s}a&&!i&&this.C(t)}C(t){t===U?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class F extends V{constructor(){super(...arguments),this.type=3}C(t){this.element[this.name]=t===U?void 0:t}}const Y=f?f.emptyScript:"";class X extends V{constructor(){super(...arguments),this.type=4}C(t){t&&t!==U?this.element.setAttribute(this.name,Y):this.element.removeAttribute(this.name)}}class K extends V{constructor(t,e,r,i,o){super(t,e,r,i,o),this.type=5}_$AI(t,e=this){var r;if((t=null!==(r=q(this,t,e,0))&&void 0!==r?r:U)===D)return;const i=this._$AH,o=t===U&&i!==U||t.capture!==i.capture||t.once!==i.once||t.passive!==i.passive,a=t!==U&&(i===U||o);o&&this.element.removeEventListener(this.name,this,i),a&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var e,r;"function"==typeof this._$AH?this._$AH.call(null!==(r=null===(e=this.options)||void 0===e?void 0:e.host)&&void 0!==r?r:this.element,t):this._$AH.handleEvent(t)}}class Q{constructor(t,e,r){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=r}get _$AU(){return this._$AM._$AU}_$AI(t){q(this,t)}}const W=window.litHtmlPolyfillSupport;
32
32
  /**
33
33
  * @license
34
34
  * Copyright 2017 Google LLC
35
35
  * SPDX-License-Identifier: BSD-3-Clause
36
36
  */
37
- var Z,J;null==W||W(q,j),(null!==(y=globalThis.litHtmlVersions)&&void 0!==y?y:globalThis.litHtmlVersions=[]).push("2.2.0");class tt extends b{constructor(){super(...arguments),this.renderOptions={host:this},this._$Dt=void 0}createRenderRoot(){var t,e;const r=super.createRenderRoot();return null!==(t=(e=this.renderOptions).renderBefore)&&void 0!==t||(e.renderBefore=r.firstChild),r}update(t){const e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Dt=((t,e,r)=>{var i,o;const a=null!==(i=null==r?void 0:r.renderBefore)&&void 0!==i?i:e;let n=a._$litPart$;if(void 0===n){const t=null!==(o=null==r?void 0:r.renderBefore)&&void 0!==o?o:null;a._$litPart$=n=new j(e.insertBefore(P(),t),t,void 0,null!=r?r:{})}return n._$AI(t),n})(e,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),null===(t=this._$Dt)||void 0===t||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),null===(t=this._$Dt)||void 0===t||t.setConnected(!1)}render(){return D}}tt.finalized=!0,tt._$litElement$=!0,null===(Z=globalThis.litElementHydrateSupport)||void 0===Z||Z.call(globalThis,{LitElement:tt});const et=globalThis.litElementPolyfillSupport;null==et||et({LitElement:tt}),(null!==(J=globalThis.litElementVersions)&&void 0!==J?J:globalThis.litElementVersions=[]).push("3.2.0");
37
+ var Z,J;null==W||W(G,j),(null!==(y=globalThis.litHtmlVersions)&&void 0!==y?y:globalThis.litHtmlVersions=[]).push("2.2.1");class tt extends b{constructor(){super(...arguments),this.renderOptions={host:this},this._$Dt=void 0}createRenderRoot(){var t,e;const r=super.createRenderRoot();return null!==(t=(e=this.renderOptions).renderBefore)&&void 0!==t||(e.renderBefore=r.firstChild),r}update(t){const e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Dt=((t,e,r)=>{var i,o;const a=null!==(i=null==r?void 0:r.renderBefore)&&void 0!==i?i:e;let n=a._$litPart$;if(void 0===n){const t=null!==(o=null==r?void 0:r.renderBefore)&&void 0!==o?o:null;a._$litPart$=n=new j(e.insertBefore(P(),t),t,void 0,null!=r?r:{})}return n._$AI(t),n})(e,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),null===(t=this._$Dt)||void 0===t||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),null===(t=this._$Dt)||void 0===t||t.setConnected(!1)}render(){return D}}tt.finalized=!0,tt._$litElement$=!0,null===(Z=globalThis.litElementHydrateSupport)||void 0===Z||Z.call(globalThis,{LitElement:tt});const et=globalThis.litElementPolyfillSupport;null==et||et({LitElement:tt}),(null!==(J=globalThis.litElementVersions)&&void 0!==J?J:globalThis.litElementVersions=[]).push("3.2.0");
38
38
  /**
39
39
  * @license
40
40
  * Copyright 2017 Google LLC
@@ -50,34 +50,33 @@ const rt=t=>e=>"function"==typeof e?((t,e)=>(window.customElements.define(t,e),e
50
50
  * @license
51
51
  * Copyright 2017 Google LLC
52
52
  * SPDX-License-Identifier: BSD-3-Clause
53
- */}
53
+ */}function at(t){return ot({...t,state:!0})}
54
54
  /**
55
55
  * @license
56
56
  * Copyright 2017 Google LLC
57
57
  * SPDX-License-Identifier: BSD-3-Clause
58
- */
59
- const at=({finisher:t,descriptor:e})=>(r,i)=>{var o;if(void 0===i){const i=null!==(o=r.originalKey)&&void 0!==o?o:r.key,a=null!=e?{kind:"method",placement:"prototype",key:i,descriptor:e(r.key)}:{...r,key:i};return null!=t&&(a.finisher=function(e){t(e,i)}),a}{const o=r.constructor;void 0!==e&&Object.defineProperty(r,i,e(i)),null==t||t(o,i)}}
58
+ */const nt=({finisher:t,descriptor:e})=>(r,i)=>{var o;if(void 0===i){const i=null!==(o=r.originalKey)&&void 0!==o?o:r.key,a=null!=e?{kind:"method",placement:"prototype",key:i,descriptor:e(r.key)}:{...r,key:i};return null!=t&&(a.finisher=function(e){t(e,i)}),a}{const o=r.constructor;void 0!==e&&Object.defineProperty(r,i,e(i)),null==t||t(o,i)}}
60
59
  /**
61
60
  * @license
62
61
  * Copyright 2017 Google LLC
63
62
  * SPDX-License-Identifier: BSD-3-Clause
64
- */;function nt(t){return at({finisher:(e,r)=>{Object.assign(e.prototype[r],t)}})}
63
+ */;function st(t){return nt({finisher:(e,r)=>{Object.assign(e.prototype[r],t)}})}
65
64
  /**
66
65
  * @license
67
66
  * Copyright 2017 Google LLC
68
67
  * SPDX-License-Identifier: BSD-3-Clause
69
- */function st(t,e){return at({descriptor:r=>{const i={get(){var e,r;return null!==(r=null===(e=this.renderRoot)||void 0===e?void 0:e.querySelector(t))&&void 0!==r?r:null},enumerable:!0,configurable:!0};if(e){const e="symbol"==typeof r?Symbol():"__"+r;i.get=function(){var r,i;return void 0===this[e]&&(this[e]=null!==(i=null===(r=this.renderRoot)||void 0===r?void 0:r.querySelector(t))&&void 0!==i?i:null),this[e]}}return i}})}
68
+ */function lt(t,e){return nt({descriptor:r=>{const i={get(){var e,r;return null!==(r=null===(e=this.renderRoot)||void 0===e?void 0:e.querySelector(t))&&void 0!==r?r:null},enumerable:!0,configurable:!0};if(e){const e="symbol"==typeof r?Symbol():"__"+r;i.get=function(){var r,i;return void 0===this[e]&&(this[e]=null!==(i=null===(r=this.renderRoot)||void 0===r?void 0:r.querySelector(t))&&void 0!==i?i:null),this[e]}}return i}})}
70
69
  /**
71
70
  * @license
72
71
  * Copyright 2021 Google LLC
73
72
  * SPDX-License-Identifier: BSD-3-Clause
74
- */var lt;null===(lt=window.HTMLSlotElement)||void 0===lt||lt.prototype.assignedElements;
73
+ */var ht;null===(ht=window.HTMLSlotElement)||void 0===ht||ht.prototype.assignedElements;
75
74
  /**
76
75
  * @license
77
76
  * Copyright 2018 Google LLC
78
77
  * SPDX-License-Identifier: BSD-3-Clause
79
78
  */
80
- const ht=t=>null!=t?t:U;const dt=["primary-lighter","primary-light","primary","primary-dark","primary-darker","on-primary-lighter","on-primary-light","on-primary","on-primary-dark","on-primary-darker","accent-lighter","accent-light","accent","accent-dark","accent-darker","on-accent-lighter","on-accent-light","on-accent","on-accent-dark","on-accent-darker","error-lighter","error-light","error","error-dark","error-darker","on-error-lighter","on-error-light","on-error","on-error-dark","on-error-darker","shade-lighter","shade-light","shade","shade-dark","shade-darker","on-shade-lighter","on-shade-light","on-shade","on-shade-dark","on-shade-darker"];
79
+ const dt=t=>null!=t?t:U;const ct=["primary-lighter","primary-light","primary","primary-dark","primary-darker","on-primary-lighter","on-primary-light","on-primary","on-primary-dark","on-primary-darker","accent-lighter","accent-light","accent","accent-dark","accent-darker","on-accent-lighter","on-accent-light","on-accent","on-accent-dark","on-accent-darker","error-lighter","error-light","error","error-dark","error-darker","on-error-lighter","on-error-light","on-error","on-error-dark","on-error-darker","shade-lighter","shade-light","shade","shade-dark","shade-darker","on-shade-lighter","on-shade-light","on-shade","on-shade-dark","on-shade-darker"];
81
80
  /**
82
81
  * A container that lays out its contents in one direction
83
82
  *
@@ -109,19 +108,19 @@ const ht=t=>null!=t?t:U;const dt=["primary-lighter","primary-light","primary","p
109
108
  * @param {number} length
110
109
  * @returns {string}
111
110
  */
112
- function ct(t=10){return`_${Math.random().toString(36).substr(2,t)}`}t.TkBox=class extends tt{constructor(){super(...arguments),
111
+ function pt(t=10){return`_${Math.random().toString(36).substr(2,t)}`}t.TkBox=class extends tt{constructor(){super(...arguments),
113
112
  /**
114
113
  * Activate ripple
115
114
  */
116
- this.ripple=!1}static get styles(){return[l`${s('*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{box-sizing:border-box;display:flex;flex-direction:column;position:relative;transition:background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease)}:host([hidden]){display:none}.ripple{bottom:0;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0}.ripple span{background-color:currentColor;border-radius:50%;opacity:.5;position:absolute}:host([align-content=start]){align-content:flex-start}:host([align-content=end]){align-content:flex-end}:host([align-content=stretch]){align-content:stretch}:host([align-content=center]){align-content:center}:host([align-content=around]){align-content:space-around}:host([align-content=between]){align-content:space-between}:host([align-items=start]){align-items:flex-start}:host([align-items=end]){align-items:flex-end}:host([align-items=stretch]){align-items:stretch}:host([align-items=center]){align-items:center}:host([align-items=baseline]){align-items:baseline}:host([align-self=start]){align-self:flex-start}:host([align-self=end]){align-self:flex-end}:host([align-self=stretch]){align-self:stretch}:host([align-self=center]){align-self:center}:host([background=primary-lighter]){background-color:var(--primary-lighter)}:host([color=primary-lighter]){color:var(--primary-lighter)}:host([background=primary-light]){background-color:var(--primary-light)}:host([color=primary-light]){color:var(--primary-light)}:host([background=primary]){background-color:var(--primary)}:host([color=primary]){color:var(--primary)}:host([background=primary-dark]){background-color:var(--primary-dark)}:host([color=primary-dark]){color:var(--primary-dark)}:host([background=primary-darker]){background-color:var(--primary-darker)}:host([color=primary-darker]){color:var(--primary-darker)}:host([background=on-primary-lighter]){background-color:var(--on-primary-lighter)}:host([color=on-primary-lighter]){color:var(--on-primary-lighter)}:host([background=on-primary-light]){background-color:var(--on-primary-light)}:host([color=on-primary-light]){color:var(--on-primary-light)}:host([background=on-primary]){background-color:var(--on-primary)}:host([color=on-primary]){color:var(--on-primary)}:host([background=on-primary-dark]){background-color:var(--on-primary-dark)}:host([color=on-primary-dark]){color:var(--on-primary-dark)}:host([background=on-primary-darker]){background-color:var(--on-primary-darker)}:host([color=on-primary-darker]){color:var(--on-primary-darker)}:host([background=accent-lighter]){background-color:var(--accent-lighter)}:host([color=accent-lighter]){color:var(--accent-lighter)}:host([background=accent-light]){background-color:var(--accent-light)}:host([color=accent-light]){color:var(--accent-light)}:host([background=accent]){background-color:var(--accent)}:host([color=accent]){color:var(--accent)}:host([background=accent-dark]){background-color:var(--accent-dark)}:host([color=accent-dark]){color:var(--accent-dark)}:host([background=accent-darker]){background-color:var(--accent-darker)}:host([color=accent-darker]){color:var(--accent-darker)}:host([background=on-accent-lighter]){background-color:var(--on-accent-lighter)}:host([color=on-accent-lighter]){color:var(--on-accent-lighter)}:host([background=on-accent-light]){background-color:var(--on-accent-light)}:host([color=on-accent-light]){color:var(--on-accent-light)}:host([background=on-accent]){background-color:var(--on-accent)}:host([color=on-accent]){color:var(--on-accent)}:host([background=on-accent-dark]){background-color:var(--on-accent-dark)}:host([color=on-accent-dark]){color:var(--on-accent-dark)}:host([background=on-accent-darker]){background-color:var(--on-accent-darker)}:host([color=on-accent-darker]){color:var(--on-accent-darker)}:host([background=error-lighter]){background-color:var(--error-lighter)}:host([color=error-lighter]){color:var(--error-lighter)}:host([background=error-light]){background-color:var(--error-light)}:host([color=error-light]){color:var(--error-light)}:host([background=error]){background-color:var(--error)}:host([color=error]){color:var(--error)}:host([background=error-dark]){background-color:var(--error-dark)}:host([color=error-dark]){color:var(--error-dark)}:host([background=error-darker]){background-color:var(--error-darker)}:host([color=error-darker]){color:var(--error-darker)}:host([background=on-error-lighter]){background-color:var(--on-error-lighter)}:host([color=on-error-lighter]){color:var(--on-error-lighter)}:host([background=on-error-light]){background-color:var(--on-error-light)}:host([color=on-error-light]){color:var(--on-error-light)}:host([background=on-error]){background-color:var(--on-error)}:host([color=on-error]){color:var(--on-error)}:host([background=on-error-dark]){background-color:var(--on-error-dark)}:host([color=on-error-dark]){color:var(--on-error-dark)}:host([background=on-error-darker]){background-color:var(--on-error-darker)}:host([color=on-error-darker]){color:var(--on-error-darker)}:host([background=shade-lighter]){background-color:var(--shade-lighter)}:host([color=shade-lighter]){color:var(--shade-lighter)}:host([background=shade-light]){background-color:var(--shade-light)}:host([color=shade-light]){color:var(--shade-light)}:host([background=shade]){background-color:var(--shade)}:host([color=shade]){color:var(--shade)}:host([background=shade-dark]){background-color:var(--shade-dark)}:host([color=shade-dark]){color:var(--shade-dark)}:host([background=shade-darker]){background-color:var(--shade-darker)}:host([color=shade-darker]){color:var(--shade-darker)}:host([background=on-shade-lighter]){background-color:var(--on-shade-lighter)}:host([color=on-shade-lighter]){color:var(--on-shade-lighter)}:host([background=on-shade-light]){background-color:var(--on-shade-light)}:host([color=on-shade-light]){color:var(--on-shade-light)}:host([background=on-shade]){background-color:var(--on-shade)}:host([color=on-shade]){color:var(--on-shade)}:host([background=on-shade-dark]){background-color:var(--on-shade-dark)}:host([color=on-shade-dark]){color:var(--on-shade-dark)}:host([background=on-shade-darker]){background-color:var(--on-shade-darker)}:host([color=on-shade-darker]){color:var(--on-shade-darker)}:host([background=foreground]){background-color:var(--foreground)}:host([color=foreground]){color:var(--foreground)}:host([background=background]){background-color:var(--background)}:host([color=background]){color:var(--background)}:host([direction=column]){flex-direction:column}:host([direction=row-reverse]){flex-direction:row-reverse}:host([direction=column-reverse]){flex-direction:column-reverse}:host([text=center]){text-align:center}:host([text=justify]){text-align:justify}:host([text=left]){text-align:left}:host([text=right]){text-align:right}:host([weight="100"]){font-weight:100}:host([weight="200"]){font-weight:200}:host([weight="300"]){font-weight:300}:host([weight="400"]){font-weight:400}:host([weight="500"]){font-weight:500}:host([weight="600"]){font-weight:600}:host([weight="700"]){font-weight:700}:host([weight="800"]){font-weight:800}:host([weight="900"]){font-weight:900}:host([weight=lighter]){font-weight:lighter}:host([weight=bold]){font-weight:700}:host([weight=bolder]){font-weight:bolder}:host([direction=row]){flex-direction:row}:host([direction=row-reverse]){flex-direction:row}:host([elevation=xsmall]){box-shadow:var(--box-elevation,var(--elevation-1,0 1px 2px var(--shadow)))}:host([elevation=small]){box-shadow:var(--box-elevation,var(--elevation-2,0 2px 4px var(--shadow)))}:host([elevation=medium]){box-shadow:var(--box-elevation,var(--elevation-3,0 4px 8px var(--shadow)))}:host([elevation=large]){box-shadow:var(--box-elevation,var(--elevation-4,0 8px 16px var(--shadow)))}:host([elevation=xlarge]){box-shadow:var(--box-elevation,var(--elevation-5,0 12px 24px var(--shadow)))}:host([fill=horizontal]){width:100%}:host([fill=vertical]){height:100%}:host([fill=true]){height:100%;width:100%}:host([flex=grow]){flex:1 0}:host([flex=shrink]){flex:0 1}:host([flex=true]){flex:1 1}:host([flex=false]){flex:0 0}:host([gap=xsmall]) ::slotted(*),:host([gap=xsmall][direction=column]) ::slotted(*){margin:var(--spacing-xs,.25rem) 0}:host([gap=xsmall][direction=row]) ::slotted(*){margin:0 var(--spacing-xs,.25rem)}:host([margin=xsmall]){margin:var(--box-margin,var(--spacing-xs,.25rem))}:host([margin="xsmall auto"]){margin:var(--box-margin,var(--spacing-xs,.25rem)) auto}:host([margin="auto xsmall"]){margin:auto var(--box-margin,var(--spacing-xs,.25rem))}:host([padding=xsmall]){padding:var(--box-padding,var(--spacing-xs,.25rem))}:host([gap=small]) ::slotted(*),:host([gap=small][direction=column]) ::slotted(*){margin:var(--spacing-s,.5rem) 0}:host([gap=small][direction=row]) ::slotted(*){margin:0 var(--spacing-s,.5rem)}:host([margin=small]){margin:var(--box-margin,var(--spacing-s,.5rem))}:host([margin="small auto"]){margin:var(--box-margin,var(--spacing-s,.5rem)) auto}:host([margin="auto small"]){margin:auto var(--box-margin,var(--spacing-s,.5rem))}:host([padding=small]){padding:var(--box-padding,var(--spacing-s,.5rem))}:host([gap=medium]) ::slotted(*),:host([gap=medium][direction=column]) ::slotted(*){margin:var(--spacing-m,1rem) 0}:host([gap=medium][direction=row]) ::slotted(*){margin:0 var(--spacing-m,1rem)}:host([margin=medium]){margin:var(--box-margin,var(--spacing-m,1rem))}:host([margin="medium auto"]){margin:var(--box-margin,var(--spacing-m,1rem)) auto}:host([margin="auto medium"]){margin:auto var(--box-margin,var(--spacing-m,1rem))}:host([padding=medium]){padding:var(--box-padding,var(--spacing-m,1rem))}:host([gap=large]) ::slotted(*),:host([gap=large][direction=column]) ::slotted(*){margin:var(--spacing-l,1.25rem) 0}:host([gap=large][direction=row]) ::slotted(*){margin:0 var(--spacing-l,1.25rem)}:host([margin=large]){margin:var(--box-margin,var(--spacing-l,1.25rem))}:host([margin="large auto"]){margin:var(--box-margin,var(--spacing-l,1.25rem)) auto}:host([margin="auto large"]){margin:auto var(--box-margin,var(--spacing-l,1.25rem))}:host([padding=large]){padding:var(--box-padding,var(--spacing-l,1.25rem))}:host([gap=xlarge]) ::slotted(*),:host([gap=xlarge][direction=column]) ::slotted(*){margin:var(--spacing-xl,2rem) 0}:host([gap=xlarge][direction=row]) ::slotted(*){margin:0 var(--spacing-xl,2rem)}:host([margin=xlarge]){margin:var(--box-margin,var(--spacing-xl,2rem))}:host([margin="xlarge auto"]){margin:var(--box-margin,var(--spacing-xl,2rem)) auto}:host([margin="auto xlarge"]){margin:auto var(--box-margin,var(--spacing-xl,2rem))}:host([padding=xlarge]){padding:var(--box-padding,var(--spacing-xl,2rem))}:host([font=xsmall]),:host([size=xsmall]){font-size:var(--box-font-size,var(--font-size-xs,.625rem))}:host([font=small]),:host([size=small]){font-size:var(--box-font-size,var(--font-size-s,.875rem))}:host([font=medium]),:host([size=medium]){font-size:var(--box-font-size,var(--font-size-m,1rem))}:host([font=large]),:host([size=large]){font-size:var(--box-font-size,var(--font-size-l,1.25rem))}:host([font=xlarge]),:host([size=xlarge]){font-size:var(--box-font-size,var(--font-size-xl,1.5rem))}:host([font=xxlarge]),:host([size=xxlarge]){font-size:var(--box-font-size,var(--font-size-xxl,2.25rem))}:host([justify=start]){justify-content:flex-start}:host([justify=end]){justify-content:flex-end}:host([justify=stretch]){justify-content:stretch}:host([justify=baseline]){justify-content:baseline}:host([justify=center]){justify-content:center}:host([justify=around]){justify-content:space-around}:host([justify=between]){justify-content:space-between}:host([overflow=auto]){overflow:auto}:host([overflow=hidden]){overflow:hidden}:host([overflow=scroll]){overflow:scroll}:host([overflow=visible]){overflow:visible}:host([radius=none]){border-radius:var(--box-border-radius,0)}:host([radius=small]){border-radius:var(--box-border-radius,var(--border-radius-small,.125rem))}:host([radius=medium]){border-radius:var(--box-border-radius,var(--border-radius-medium,.25rem))}:host([radius=large]){border-radius:var(--box-border-radius,var(--border-radius-large,.5rem))}:host([radius=xlarge]){border-radius:var(--box-border-radius,var(--border-radius-x-large,1rem))}:host([radius=circle]){border-radius:var(--box-border-radius,var(--border-radius-circle,50%))}:host([radius=pill]){border-radius:var(--box-border-radius,var(--border-radius-pill,9999px))}:host([max-width=xxsmall]){max-width:var(--box-max-width,var(--size-xxs,2rem))}:host([width=xxsmall]){width:var(--box-width,var(--size-xxs,2rem))}:host([max-height=xxsmall]){max-height:var(--box-max-height,var(--size-xxs,2rem))}:host([height=xxsmall]){height:var(--box-height,var(--size-xxs,2rem))}:host([max-width=xsmall]){max-width:var(--box-max-width,var(--size-xs,4rem))}:host([width=xsmall]){width:var(--box-width,var(--size-xs,4rem))}:host([max-height=xsmall]){max-height:var(--box-max-height,var(--size-xs,4rem))}:host([height=xsmall]){height:var(--box-height,var(--size-xs,4rem))}:host([max-width=small]){max-width:var(--box-max-width,var(--size-s,8rem))}:host([width=small]){width:var(--box-width,var(--size-s,8rem))}:host([max-height=small]){max-height:var(--box-max-height,var(--size-s,8rem))}:host([height=small]){height:var(--box-height,var(--size-s,8rem))}:host([max-width=medium]){max-width:var(--box-max-width,var(--size-m,16rem))}:host([width=medium]){width:var(--box-width,var(--size-m,16rem))}:host([max-height=medium]){max-height:var(--box-max-height,var(--size-m,16rem))}:host([height=medium]){height:var(--box-height,var(--size-m,16rem))}:host([max-width=large]){max-width:var(--box-max-width,var(--size-l,32rem))}:host([width=large]){width:var(--box-width,var(--size-l,32rem))}:host([max-height=large]){max-height:var(--box-max-height,var(--size-l,32rem))}:host([height=large]){height:var(--box-height,var(--size-l,32rem))}:host([max-width=xlarge]){max-width:var(--box-max-width,var(--size-xl,48rem))}:host([width=xlarge]){width:var(--box-width,var(--size-xl,48rem))}:host([max-height=xlarge]){max-height:var(--box-max-height,var(--size-xl,48rem))}:host([height=xlarge]){height:var(--box-height,var(--size-xl,48rem))}:host([max-width=xxlarge]){max-width:var(--box-max-width,var(--size-xxl,64rem))}:host([width=xxlarge]){width:var(--box-width,var(--size-xxl,64rem))}:host([max-height=xxlarge]){max-height:var(--box-max-height,var(--size-xxl,64rem))}:host([height=xxlarge]){height:var(--box-height,var(--size-xxl,64rem))}:host([wrap=true]){flex-wrap:wrap}:host([wrap=reverse]){flex-wrap:wrap-reverse}')}`]}render(){return I`<slot></slot>`}connectedCallback(){this.ripple&&(this.addEventListener("mousedown",this.showRipple.bind(this),{passive:!0}),this.addEventListener("mouseup",this.hideRipple.bind(this),{passive:!0})),super.connectedCallback()}disconnectedCallback(){this.removeEventListener("mousedown",this.showRipple),this.addEventListener("mouseup",this.hideRipple),super.disconnectedCallback()}updated(t){t.has("background")&&![...dt,"background","foreground"].includes(this.background)&&this.style.setProperty("background-color",this.background.toString()),t.has("color")&&![...dt,"background","foreground"].includes(this.color)&&this.style.setProperty("color",this.color.toString()),super.updated(t)}showRipple(t){const e=t.clientX,r=t.clientY,{offsetWidth:i,offsetHeight:o}=this,a=document.createElement("span");a.classList.add("ripple","open");const n=document.createElement("span");a.appendChild(n),this.shadowRoot.appendChild(a);const s=this.getBoundingClientRect(),l=2*Math.max(i,i);n.style.width=n.style.height=l+"px",n.style.left=e-s.left-l/2+"px",n.style.top=r-s.top-l/2+"px";n.animate({transform:["scale(0)","scale(1)"]},{easing:"ease-out",fill:"both",duration:500}).onfinish=()=>{a.classList.remove("open");n.animate({opacity:["0.5","0"]},{easing:"ease-in",fill:"both",duration:300}).onfinish=()=>{requestAnimationFrame((()=>{a.remove()}))}}}hideRipple(t){this.shadowRoot?.querySelectorAll(".ripple:not([open])").forEach((t=>{t.querySelector("span").animate({opacity:["0.5","0"]},{easing:"ease-out",fill:"both",duration:300}).onfinish=()=>{requestAnimationFrame((()=>{t.remove()}))}}))}},e([ot({type:Boolean}),r("design:type",Boolean)],t.TkBox.prototype,"ripple",void 0),e([ot(),r("design:type",Object)],t.TkBox.prototype,"background",void 0),e([ot(),r("design:type",Object)],t.TkBox.prototype,"color",void 0),t.TkBox=e([rt("tk-box")],t.TkBox);class pt extends t.TkBox{constructor(){super(...arguments),
115
+ this.ripple=!1}static get styles(){return[l`${s('*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{box-sizing:border-box;display:flex;flex-direction:column;position:relative;transition:background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease)}:host([hidden]){display:none}.ripple{bottom:0;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0}.ripple span{background-color:currentColor;border-radius:50%;opacity:.5;position:absolute}:host([align-content=start]){align-content:flex-start}:host([align-content=end]){align-content:flex-end}:host([align-content=stretch]){align-content:stretch}:host([align-content=center]){align-content:center}:host([align-content=around]){align-content:space-around}:host([align-content=between]){align-content:space-between}:host([align-items=start]){align-items:flex-start}:host([align-items=end]){align-items:flex-end}:host([align-items=stretch]){align-items:stretch}:host([align-items=center]){align-items:center}:host([align-items=baseline]){align-items:baseline}:host([align-self=start]){align-self:flex-start}:host([align-self=end]){align-self:flex-end}:host([align-self=stretch]){align-self:stretch}:host([align-self=center]){align-self:center}:host([background=primary-lighter]){background-color:var(--primary-lighter)}:host([color=primary-lighter]){color:var(--primary-lighter)}:host([background=primary-light]){background-color:var(--primary-light)}:host([color=primary-light]){color:var(--primary-light)}:host([background=primary]){background-color:var(--primary)}:host([color=primary]){color:var(--primary)}:host([background=primary-dark]){background-color:var(--primary-dark)}:host([color=primary-dark]){color:var(--primary-dark)}:host([background=primary-darker]){background-color:var(--primary-darker)}:host([color=primary-darker]){color:var(--primary-darker)}:host([background=on-primary-lighter]){background-color:var(--on-primary-lighter)}:host([color=on-primary-lighter]){color:var(--on-primary-lighter)}:host([background=on-primary-light]){background-color:var(--on-primary-light)}:host([color=on-primary-light]){color:var(--on-primary-light)}:host([background=on-primary]){background-color:var(--on-primary)}:host([color=on-primary]){color:var(--on-primary)}:host([background=on-primary-dark]){background-color:var(--on-primary-dark)}:host([color=on-primary-dark]){color:var(--on-primary-dark)}:host([background=on-primary-darker]){background-color:var(--on-primary-darker)}:host([color=on-primary-darker]){color:var(--on-primary-darker)}:host([background=accent-lighter]){background-color:var(--accent-lighter)}:host([color=accent-lighter]){color:var(--accent-lighter)}:host([background=accent-light]){background-color:var(--accent-light)}:host([color=accent-light]){color:var(--accent-light)}:host([background=accent]){background-color:var(--accent)}:host([color=accent]){color:var(--accent)}:host([background=accent-dark]){background-color:var(--accent-dark)}:host([color=accent-dark]){color:var(--accent-dark)}:host([background=accent-darker]){background-color:var(--accent-darker)}:host([color=accent-darker]){color:var(--accent-darker)}:host([background=on-accent-lighter]){background-color:var(--on-accent-lighter)}:host([color=on-accent-lighter]){color:var(--on-accent-lighter)}:host([background=on-accent-light]){background-color:var(--on-accent-light)}:host([color=on-accent-light]){color:var(--on-accent-light)}:host([background=on-accent]){background-color:var(--on-accent)}:host([color=on-accent]){color:var(--on-accent)}:host([background=on-accent-dark]){background-color:var(--on-accent-dark)}:host([color=on-accent-dark]){color:var(--on-accent-dark)}:host([background=on-accent-darker]){background-color:var(--on-accent-darker)}:host([color=on-accent-darker]){color:var(--on-accent-darker)}:host([background=error-lighter]){background-color:var(--error-lighter)}:host([color=error-lighter]){color:var(--error-lighter)}:host([background=error-light]){background-color:var(--error-light)}:host([color=error-light]){color:var(--error-light)}:host([background=error]){background-color:var(--error)}:host([color=error]){color:var(--error)}:host([background=error-dark]){background-color:var(--error-dark)}:host([color=error-dark]){color:var(--error-dark)}:host([background=error-darker]){background-color:var(--error-darker)}:host([color=error-darker]){color:var(--error-darker)}:host([background=on-error-lighter]){background-color:var(--on-error-lighter)}:host([color=on-error-lighter]){color:var(--on-error-lighter)}:host([background=on-error-light]){background-color:var(--on-error-light)}:host([color=on-error-light]){color:var(--on-error-light)}:host([background=on-error]){background-color:var(--on-error)}:host([color=on-error]){color:var(--on-error)}:host([background=on-error-dark]){background-color:var(--on-error-dark)}:host([color=on-error-dark]){color:var(--on-error-dark)}:host([background=on-error-darker]){background-color:var(--on-error-darker)}:host([color=on-error-darker]){color:var(--on-error-darker)}:host([background=shade-lighter]){background-color:var(--shade-lighter)}:host([color=shade-lighter]){color:var(--shade-lighter)}:host([background=shade-light]){background-color:var(--shade-light)}:host([color=shade-light]){color:var(--shade-light)}:host([background=shade]){background-color:var(--shade)}:host([color=shade]){color:var(--shade)}:host([background=shade-dark]){background-color:var(--shade-dark)}:host([color=shade-dark]){color:var(--shade-dark)}:host([background=shade-darker]){background-color:var(--shade-darker)}:host([color=shade-darker]){color:var(--shade-darker)}:host([background=on-shade-lighter]){background-color:var(--on-shade-lighter)}:host([color=on-shade-lighter]){color:var(--on-shade-lighter)}:host([background=on-shade-light]){background-color:var(--on-shade-light)}:host([color=on-shade-light]){color:var(--on-shade-light)}:host([background=on-shade]){background-color:var(--on-shade)}:host([color=on-shade]){color:var(--on-shade)}:host([background=on-shade-dark]){background-color:var(--on-shade-dark)}:host([color=on-shade-dark]){color:var(--on-shade-dark)}:host([background=on-shade-darker]){background-color:var(--on-shade-darker)}:host([color=on-shade-darker]){color:var(--on-shade-darker)}:host([background=foreground]){background-color:var(--foreground)}:host([color=foreground]){color:var(--foreground)}:host([background=background]){background-color:var(--background)}:host([color=background]){color:var(--background)}:host([direction=column]){flex-direction:column}:host([direction=row-reverse]){flex-direction:row-reverse}:host([direction=column-reverse]){flex-direction:column-reverse}:host([text=center]){text-align:center}:host([text=justify]){text-align:justify}:host([text=left]){text-align:left}:host([text=right]){text-align:right}:host([weight="100"]){font-weight:100}:host([weight="200"]){font-weight:200}:host([weight="300"]){font-weight:300}:host([weight="400"]){font-weight:400}:host([weight="500"]){font-weight:500}:host([weight="600"]){font-weight:600}:host([weight="700"]){font-weight:700}:host([weight="800"]){font-weight:800}:host([weight="900"]){font-weight:900}:host([weight=lighter]){font-weight:lighter}:host([weight=bold]){font-weight:700}:host([weight=bolder]){font-weight:bolder}:host([direction=row]){flex-direction:row}:host([direction=row-reverse]){flex-direction:row}:host([elevation=xsmall]){box-shadow:var(--box-elevation,var(--elevation-1,0 1px 2px var(--shadow)))}:host([elevation=small]){box-shadow:var(--box-elevation,var(--elevation-2,0 2px 4px var(--shadow)))}:host([elevation=medium]){box-shadow:var(--box-elevation,var(--elevation-3,0 4px 8px var(--shadow)))}:host([elevation=large]){box-shadow:var(--box-elevation,var(--elevation-4,0 8px 16px var(--shadow)))}:host([elevation=xlarge]){box-shadow:var(--box-elevation,var(--elevation-5,0 12px 24px var(--shadow)))}:host([fill=horizontal]){width:100%}:host([fill=vertical]){height:100%}:host([fill=true]){height:100%;width:100%}:host([flex=grow]){flex:1 0}:host([flex=shrink]){flex:0 1}:host([flex=true]){flex:1 1}:host([flex=false]){flex:0 0}:host([gap=xsmall]) ::slotted(*),:host([gap=xsmall][direction=column]) ::slotted(*){margin:var(--spacing-xs,.25rem) 0}:host([gap=xsmall][direction=row]) ::slotted(*){margin:0 var(--spacing-xs,.25rem)}:host([margin=xsmall]){margin:var(--box-margin,var(--spacing-xs,.25rem))}:host([margin="xsmall auto"]){margin:var(--box-margin,var(--spacing-xs,.25rem)) auto}:host([margin="auto xsmall"]){margin:auto var(--box-margin,var(--spacing-xs,.25rem))}:host([padding=xsmall]){padding:var(--box-padding,var(--spacing-xs,.25rem))}:host([gap=small]) ::slotted(*),:host([gap=small][direction=column]) ::slotted(*){margin:var(--spacing-s,.5rem) 0}:host([gap=small][direction=row]) ::slotted(*){margin:0 var(--spacing-s,.5rem)}:host([margin=small]){margin:var(--box-margin,var(--spacing-s,.5rem))}:host([margin="small auto"]){margin:var(--box-margin,var(--spacing-s,.5rem)) auto}:host([margin="auto small"]){margin:auto var(--box-margin,var(--spacing-s,.5rem))}:host([padding=small]){padding:var(--box-padding,var(--spacing-s,.5rem))}:host([gap=medium]) ::slotted(*),:host([gap=medium][direction=column]) ::slotted(*){margin:var(--spacing-m,1rem) 0}:host([gap=medium][direction=row]) ::slotted(*){margin:0 var(--spacing-m,1rem)}:host([margin=medium]){margin:var(--box-margin,var(--spacing-m,1rem))}:host([margin="medium auto"]){margin:var(--box-margin,var(--spacing-m,1rem)) auto}:host([margin="auto medium"]){margin:auto var(--box-margin,var(--spacing-m,1rem))}:host([padding=medium]){padding:var(--box-padding,var(--spacing-m,1rem))}:host([gap=large]) ::slotted(*),:host([gap=large][direction=column]) ::slotted(*){margin:var(--spacing-l,1.25rem) 0}:host([gap=large][direction=row]) ::slotted(*){margin:0 var(--spacing-l,1.25rem)}:host([margin=large]){margin:var(--box-margin,var(--spacing-l,1.25rem))}:host([margin="large auto"]){margin:var(--box-margin,var(--spacing-l,1.25rem)) auto}:host([margin="auto large"]){margin:auto var(--box-margin,var(--spacing-l,1.25rem))}:host([padding=large]){padding:var(--box-padding,var(--spacing-l,1.25rem))}:host([gap=xlarge]) ::slotted(*),:host([gap=xlarge][direction=column]) ::slotted(*){margin:var(--spacing-xl,2rem) 0}:host([gap=xlarge][direction=row]) ::slotted(*){margin:0 var(--spacing-xl,2rem)}:host([margin=xlarge]){margin:var(--box-margin,var(--spacing-xl,2rem))}:host([margin="xlarge auto"]){margin:var(--box-margin,var(--spacing-xl,2rem)) auto}:host([margin="auto xlarge"]){margin:auto var(--box-margin,var(--spacing-xl,2rem))}:host([padding=xlarge]){padding:var(--box-padding,var(--spacing-xl,2rem))}:host([font=xsmall]),:host([size=xsmall]){font-size:var(--box-font-size,var(--font-size-xs,.625rem))}:host([font=small]),:host([size=small]){font-size:var(--box-font-size,var(--font-size-s,.875rem))}:host([font=medium]),:host([size=medium]){font-size:var(--box-font-size,var(--font-size-m,1rem))}:host([font=large]),:host([size=large]){font-size:var(--box-font-size,var(--font-size-l,1.25rem))}:host([font=xlarge]),:host([size=xlarge]){font-size:var(--box-font-size,var(--font-size-xl,1.5rem))}:host([font=xxlarge]),:host([size=xxlarge]){font-size:var(--box-font-size,var(--font-size-xxl,2.25rem))}:host([justify=start]){justify-content:flex-start}:host([justify=end]){justify-content:flex-end}:host([justify=stretch]){justify-content:stretch}:host([justify=baseline]){justify-content:baseline}:host([justify=center]){justify-content:center}:host([justify=around]){justify-content:space-around}:host([justify=between]){justify-content:space-between}:host([overflow=auto]){overflow:auto}:host([overflow=hidden]){overflow:hidden}:host([overflow=scroll]){overflow:scroll}:host([overflow=visible]){overflow:visible}:host([radius=none]){border-radius:var(--box-border-radius,0)}:host([radius=small]){border-radius:var(--box-border-radius,var(--border-radius-small,.125rem))}:host([radius=medium]){border-radius:var(--box-border-radius,var(--border-radius-medium,.25rem))}:host([radius=large]){border-radius:var(--box-border-radius,var(--border-radius-large,.5rem))}:host([radius=xlarge]){border-radius:var(--box-border-radius,var(--border-radius-x-large,1rem))}:host([radius=circle]){border-radius:var(--box-border-radius,var(--border-radius-circle,50%))}:host([radius=pill]){border-radius:var(--box-border-radius,var(--border-radius-pill,9999px))}:host([max-width=xxsmall]){max-width:var(--box-max-width,var(--size-xxs,2rem))}:host([width=xxsmall]){width:var(--box-width,var(--size-xxs,2rem))}:host([max-height=xxsmall]){max-height:var(--box-max-height,var(--size-xxs,2rem))}:host([height=xxsmall]){height:var(--box-height,var(--size-xxs,2rem))}:host([max-width=xsmall]){max-width:var(--box-max-width,var(--size-xs,4rem))}:host([width=xsmall]){width:var(--box-width,var(--size-xs,4rem))}:host([max-height=xsmall]){max-height:var(--box-max-height,var(--size-xs,4rem))}:host([height=xsmall]){height:var(--box-height,var(--size-xs,4rem))}:host([max-width=small]){max-width:var(--box-max-width,var(--size-s,8rem))}:host([width=small]){width:var(--box-width,var(--size-s,8rem))}:host([max-height=small]){max-height:var(--box-max-height,var(--size-s,8rem))}:host([height=small]){height:var(--box-height,var(--size-s,8rem))}:host([max-width=medium]){max-width:var(--box-max-width,var(--size-m,16rem))}:host([width=medium]){width:var(--box-width,var(--size-m,16rem))}:host([max-height=medium]){max-height:var(--box-max-height,var(--size-m,16rem))}:host([height=medium]){height:var(--box-height,var(--size-m,16rem))}:host([max-width=large]){max-width:var(--box-max-width,var(--size-l,32rem))}:host([width=large]){width:var(--box-width,var(--size-l,32rem))}:host([max-height=large]){max-height:var(--box-max-height,var(--size-l,32rem))}:host([height=large]){height:var(--box-height,var(--size-l,32rem))}:host([max-width=xlarge]){max-width:var(--box-max-width,var(--size-xl,48rem))}:host([width=xlarge]){width:var(--box-width,var(--size-xl,48rem))}:host([max-height=xlarge]){max-height:var(--box-max-height,var(--size-xl,48rem))}:host([height=xlarge]){height:var(--box-height,var(--size-xl,48rem))}:host([max-width=xxlarge]){max-width:var(--box-max-width,var(--size-xxl,64rem))}:host([width=xxlarge]){width:var(--box-width,var(--size-xxl,64rem))}:host([max-height=xxlarge]){max-height:var(--box-max-height,var(--size-xxl,64rem))}:host([height=xxlarge]){height:var(--box-height,var(--size-xxl,64rem))}:host([wrap=true]){flex-wrap:wrap}:host([wrap=reverse]){flex-wrap:wrap-reverse}')}`]}render(){return I`<slot></slot>`}connectedCallback(){this.ripple&&(this.addEventListener("mousedown",this.showRipple.bind(this),{passive:!0}),this.addEventListener("mouseup",this.hideRipple.bind(this),{passive:!0})),super.connectedCallback()}disconnectedCallback(){this.removeEventListener("mousedown",this.showRipple),this.addEventListener("mouseup",this.hideRipple),super.disconnectedCallback()}updated(t){t.has("background")&&![...ct,"background","foreground"].includes(this.background)&&this.style.setProperty("background-color",this.background.toString()),t.has("color")&&![...ct,"background","foreground"].includes(this.color)&&this.style.setProperty("color",this.color.toString()),super.updated(t)}showRipple(t){const e=t.clientX,r=t.clientY,{offsetWidth:i,offsetHeight:o}=this,a=document.createElement("span");a.classList.add("ripple","open");const n=document.createElement("span");a.appendChild(n),this.shadowRoot.appendChild(a);const s=this.getBoundingClientRect(),l=2*Math.max(i,i);n.style.width=n.style.height=l+"px",n.style.left=e-s.left-l/2+"px",n.style.top=r-s.top-l/2+"px";n.animate({transform:["scale(0)","scale(1)"]},{easing:"ease-out",fill:"both",duration:500}).onfinish=()=>{a.classList.remove("open");n.animate({opacity:["0.5","0"]},{easing:"ease-in",fill:"both",duration:300}).onfinish=()=>{requestAnimationFrame((()=>{a.remove()}))}}}hideRipple(t){this.shadowRoot?.querySelectorAll(".ripple:not([open])").forEach((t=>{t.querySelector("span").animate({opacity:["0.5","0"]},{easing:"ease-out",fill:"both",duration:300}).onfinish=()=>{requestAnimationFrame((()=>{t.remove()}))}}))}},e([ot({type:Boolean}),r("design:type",Boolean)],t.TkBox.prototype,"ripple",void 0),e([ot(),r("design:type",Object)],t.TkBox.prototype,"background",void 0),e([ot(),r("design:type",Object)],t.TkBox.prototype,"color",void 0),t.TkBox=e([rt("tk-box")],t.TkBox);class vt extends t.TkBox{constructor(){super(...arguments),
117
116
  /**
118
117
  * Element random id
119
118
  */
120
- this._id=ct(),
119
+ this._id=pt(),
121
120
  /**
122
121
  * disabled atribute
123
122
  */
124
- this.disabled=!1}updated(t){this.tabIndex=this.disabled?-1:0,super.updated(t)}}e([ot({type:Boolean}),r("design:type",String)],pt.prototype,"_id",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],pt.prototype,"disabled",void 0);t.TkAccordion=class extends pt{constructor(){super(...arguments),this.checked=!1,this.rippleHeader=!1}static get styles(){return[...t.TkBox.styles,l`${s('@charset "UTF-8";*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host .header{border:1px solid var(--shade-lighter);border-radius:10px;color:var(--primary);cursor:pointer;padding:.6em}:host .header>*{margin:0 10px}:host .header:after{content:"▼";display:inline-block;font-size:12px;transition:transform .3s}:host .header .before{width:fit-content}:host .header .header-content{flex:1}:host .content{height:0;margin:0 auto;opacity:0;transition:all .2s;visibility:hidden;width:95%}:host h3,:host h5{margin:0}:host([checked]) .header{background-color:var(--primary);color:var(--on-primary)}:host([checked]) .header:after{transform:rotate(180deg)}:host([checked]) .content{height:auto;opacity:1;transition:all .3s,opacity .7s;visibility:visible}:host([pill]) .header{border-radius:9999px}')}`]}render(){return I`<tk-box margin="small"><tk-box @click="${this.handleClick.bind(this)}" ?ripple="${this.rippleHeader}" class="header" direction="row" align-items="center"><tk-box class="before"><slot name="before"></slot></tk-box><tk-box class="header-content"><h3 class="title"><slot name="title"></slot></h3><h5><slot name="description"></slot></h5></tk-box></tk-box><tk-box class="content"><slot></slot></tk-box></tk-box><input id="${this.id}" slot="none" style="display:none" type="radio" ?checked="${this.checked}" ?disabled="${this.disabled}" name="${ht(this.name)}" aria-hidden="true" tabindex="-1">`}firstUpdated(){this.appendChild(this.$input)}onKeyDown(t){"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),t.stopPropagation(),this.click())}handleClick(){this.checked=!this.checked,this.checked&&this.name&&this.getRootNode().querySelectorAll(`tk-accordion[name="${this.name}"]`).forEach((t=>t!=this?t.checked=!1:null)),this.dispatchEvent(new Event("change"))}},e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkAccordion.prototype,"name",void 0),e([ot({attribute:!0,type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkAccordion.prototype,"checked",void 0),e([ot({attribute:"ripple-header",type:Boolean}),r("design:type",Boolean)],t.TkAccordion.prototype,"rippleHeader",void 0),e([st("input"),r("design:type",HTMLInputElement)],t.TkAccordion.prototype,"$input",void 0),t.TkAccordion=e([rt("tk-accordion")],t.TkAccordion);
123
+ this.disabled=!1}updated(t){this.tabIndex=this.disabled?-1:0,super.updated(t)}}e([ot({type:Boolean}),r("design:type",String)],vt.prototype,"_id",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],vt.prototype,"disabled",void 0);t.TkAccordion=class extends vt{constructor(){super(...arguments),this.checked=!1,this.rippleHeader=!1}static get styles(){return[...t.TkBox.styles,l`${s('@charset "UTF-8";*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host .header{border:1px solid var(--shade-lighter);border-radius:10px;color:var(--primary);cursor:pointer;padding:.6em}:host .header>*{margin:0 10px}:host .header:after{content:"▼";display:inline-block;font-size:12px;transition:transform .3s}:host .header .before{width:fit-content}:host .header .header-content{flex:1}:host .content{height:0;margin:0 auto;opacity:0;transition:all .2s;visibility:hidden;width:95%}:host h3,:host h5{margin:0}:host([checked]) .header{background-color:var(--primary);color:var(--on-primary)}:host([checked]) .header:after{transform:rotate(180deg)}:host([checked]) .content{height:auto;opacity:1;transition:all .3s,opacity .7s;visibility:visible}:host([pill]) .header{border-radius:9999px}')}`]}render(){return I`<tk-box margin="small"><tk-box @click="${this.handleClick.bind(this)}" ?ripple="${this.rippleHeader}" class="header" direction="row" align-items="center"><tk-box class="before"><slot name="before"></slot></tk-box><tk-box class="header-content"><h3 class="title"><slot name="title"></slot></h3><h5><slot name="description"></slot></h5></tk-box></tk-box><tk-box class="content"><slot></slot></tk-box></tk-box><input id="${this.id}" slot="none" style="display:none" type="radio" ?checked="${this.checked}" ?disabled="${this.disabled}" name="${dt(this.name)}" aria-hidden="true" tabindex="-1">`}firstUpdated(){this.appendChild(this.$input)}onKeyDown(t){"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),t.stopPropagation(),this.click())}handleClick(){this.checked=!this.checked,this.checked&&this.name&&this.getRootNode().querySelectorAll(`tk-accordion[name="${this.name}"]`).forEach((t=>t!=this?t.checked=!1:null)),this.dispatchEvent(new Event("change"))}},e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkAccordion.prototype,"name",void 0),e([ot({attribute:!0,type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkAccordion.prototype,"checked",void 0),e([ot({attribute:"ripple-header",type:Boolean}),r("design:type",Boolean)],t.TkAccordion.prototype,"rippleHeader",void 0),e([lt("input"),r("design:type",HTMLInputElement)],t.TkAccordion.prototype,"$input",void 0),t.TkAccordion=e([rt("tk-accordion")],t.TkAccordion);
125
124
  /**
126
125
  * A badge WebComponent
127
126
  * @cssprop --tk-badge-color - Color of widget default to --primary
@@ -143,7 +142,7 @@ t.TkBadge=class extends t.TkBox{static get styles(){return[...t.TkBox.styles,l`$
143
142
  * @attr {Boolean} ripple - display ripple when active
144
143
  * @attr {Boolean} small - mini button
145
144
  */
146
- t.TkButton=class extends t.TkBox{constructor(){super(...arguments),this.href=null,this.type="button",this.disabled=!1}static get styles(){return[...t.TkBox.styles,l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));--color-darker:var(--primary-darker,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*0.7)));--text:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));align-items:center;background-color:var(--color);border:1px solid var(--color);border-radius:var(--border-radius-medium,.25rem);box-sizing:border-box;color:var(--text);cursor:pointer;display:inline-flex;flex-direction:row;font-family:Roboto,sans-serif;height:2.5em;justify-content:center;letter-spacing:.8px;line-height:2.5em;padding:0 var(--spacing-m,1rem);position:relative;text-align:center;text-decoration:none;text-overflow:ellipsis;user-select:none;vertical-align:middle;white-space:nowrap}:host .content{align-items:center;display:flex;pointer-events:none}:host .before{align-items:center;display:flex}:host .before ::slotted(*){margin-right:var(--spacing-s,.5rem)}:host .after{align-items:center;display:flex}:host .after ::slotted(*){margin-left:var(--spacing-s,.5rem)}:host .badge-out{display:flex;pointer-events:none;position:absolute;right:-.8em;top:-.7em}:host .badge-in{display:flex;pointer-events:none;position:absolute;right:2px;top:2px}:host(:focus){outline:none}:host(:focus),:host(:hover){--color:var(--primary-light,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*1.15)))}:host(:active){--color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)))}:host([inverted]){--color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));--text:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)))}:host([inverted]:focus),:host([inverted]:hover){--color:#0000001a}:host([inverted]:active){--color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)))}:host([accent]){--color:var(--accent,hsl(var(--accent-h,8.76404),var(--accent-s,64.0288%),var(--accent-l,72.7451%)));--color-darker:var(--accent,hsl(var(--accent-h,8.76404),var(--accent-s,64.0288%),var(--accent-l,72.7451%)))}:host([accent]:focus),:host([accent]:hover){--color:var(--accent-light,hsl(var(--accent-h,8.76404),var(--accent-s,64.0288%),calc(var(--accent-l, 72.7451%)*1.15)))}:host([accent]:active){--color:var(--accent,hsl(var(--accent-h,8.76404),var(--accent-s,64.0288%),var(--accent-l,72.7451%)))}:host([accent][inverted]){--color:var(--on-accent,hsl(var(--on-accent-h,0),var(--on-accent-s,0%),var(--on-accent-l,100%)));--text:var(--accent,hsl(var(--accent-h,8.76404),var(--accent-s,64.0288%),var(--accent-l,72.7451%)))}:host([accent][inverted]:focus),:host([accent][inverted]:hover){--color:#0000001a}:host([accent][inverted]:active){--color:var(--on-accent,hsl(var(--on-accent-h,0),var(--on-accent-s,0%),var(--on-accent-l,100%)))}:host([outlined]){background:var(--background,#f7f7f7) radial-gradient(circle,#0000 1%,var(--background,#f7f7f7) 1%) center/15000%;color:var(--color)}:host([pill]){border-radius:var(--border-radius-pill,9999px)}:host([small]){font-size:.8em;height:28px;line-height:.9em;padding:0 var(--spacing-s,.5rem)}:host([small]) .before ::slotted(*){margin-right:var(--spacing-xs,.25rem)}:host([small]) .after ::slotted(*){margin-left:var(--spacing-xs,.25rem)}:host([fab]){align-items:center;border-radius:50%;box-shadow:var(--elevation-1,0 1px 2px var(--shadow));height:40px;justify-content:center;line-height:normal;overflow:hidden;padding:0;width:40px}:host([fab]):hover{box-shadow:var(--elevation-3,0 4px 8px var(--shadow))}:host([fab][small]){font-size:.75em;height:30px;width:30px}:host([flat]){box-shadow:none}:host([flat]):hover{box-shadow:none}:host([disabled]),:host([disabled][accent]){--text:var(--button-color-disabled,var(--shade-lighter));--color:var(--button-bg-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));box-shadow:none;cursor:default;pointer-events:none}")}`]}render(){return I`<div class="before"><slot name="before"></slot></div><div class="content"><slot></slot></div><div class="after"><slot name="after"></slot></div><div class="badge-in"><slot name="badge-in"></slot></div><div class="badge-out"><slot name="badge-out"></slot></div>${this.href?I`<a hidden id="ahref" href="${this.href}" target="${ht(this.target)}" rel="noreferrer"></a>`:""} <button id="${ct()}" hidden type="${ht(this.type)}"></button>`}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.onKeyDown.bind(this))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.onKeyDown)}updated(t){this.tabIndex=this.disabled?-1:0,super.updated(t)}onKeyDown(t){"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),t.stopPropagation(),this.click())}firstUpdated(){"submit"!=this.type&&"reset"!=this.type||this.appendChild(this.$button)}handleClick(t){this.querySelector("button")&&t.target==this.querySelector("button")||this.$ahref&&t.target==this.$ahref||(this.href?this.$ahref.click():"submit"!=this.type&&"reset"!=this.type||this.querySelector("button")?.dispatchEvent(new MouseEvent("click",{relatedTarget:this,composed:!0,bubbles:!0})))}},e([ot(),r("design:type",Object)],t.TkButton.prototype,"href",void 0),e([ot(),r("design:type",String)],t.TkButton.prototype,"target",void 0),e([ot(),r("design:type",String)],t.TkButton.prototype,"type",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkButton.prototype,"disabled",void 0),e([st("#ahref"),r("design:type",HTMLAnchorElement)],t.TkButton.prototype,"$ahref",void 0),e([st("button"),r("design:type",HTMLButtonElement)],t.TkButton.prototype,"$button",void 0),t.TkButton=e([rt("tk-button")],t.TkButton);t.TkCheckbox=class extends tt{constructor(){super(...arguments),this.checked=!1}render(){return I`<tk-box direction="row" align-items="center"><div tabindex="0" class="checkbox"><svg id="checkmark" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" preserveAspectRatio="none" viewBox="0 0 24 24"><path id="checkmark-path" fill="none" d="M1.73,12.91 8.1,19.28 22.79,4.59"></path><line id="indeterminate-path" fill="none" x1="0" y1="12.5" x2="24" y2="12.5"/></svg></div><span class="label"><slot></slot></span></tk-box><input id="${ct()}" slot="none" style="display:none" ?checked="${this.checked}" type="checkbox" name="${ht(this.name)}" value="${ht(this.value)}" aria-hidden="true" tabindex="-1">`}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.onKeyDown.bind(this))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.onKeyDown)}firstUpdated(){this.appendChild(this.$input)}onKeyDown(t){"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),t.stopPropagation(),this.click())}handleClick(){this.checked=!this.checked,setTimeout((()=>this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))))}},t.TkCheckbox.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_checkbox-bg:var(--checkbox-bg,#0000);--_checkbox-color:var(--checkbox-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));display:inline-flex}:host .checkbox{align-items:center;background:var(--_checkbox-bg);border:var(--checkbox-border-config,.125rem solid) currentColor;border-radius:var(--checkbox-border-radius,.375rem);color:var(--_checkbox-color);display:inline-flex;height:var(--checkbox-size,1.25rem);justify-content:center;margin:0 5px;min-width:var(--checkbox-size,1.25rem);outline:none;position:relative;transition:var(--checkbox-transition,background var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),border-color var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));-webkit-user-select:none;user-select:none;width:var(--checkbox-size,1.25rem)}:host .label{font-size:1.1em}:host(:not([disabled])){cursor:pointer}:host([checked]),:host([indeterminate]){--_checkbox-bg:var(--checkbox-bg-checked,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));--_checkbox-color:var(--checkbox-color-checked,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([checked]:not([indeterminate])) #checkmark-path,:host([indeterminate]) #indeterminate-path{stroke-dashoffset:0}:host(:focus),:host(:hover){will-change:border,background}:host(:focus) #checkmark-path,:host(:hover) #checkmark-path{will-change:stroke-dashoffset}:host([disabled]){--_checkbox-bg:var(--checkbox-bg-disabled,#0000);--_checkbox-color:var(--checkbox-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));color:var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%)));pointer-events:none}:host([disabled][checked]),:host([disabled][indeterminate]){--_checkbox-bg:var(--checkbox-bg-disabled-checked,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_checkbox-color:var(--checkbox-color-disabled-checked,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}#checkmark{height:var(--checkbox-checkmark-size,.75rem);width:var(--checkbox-checkmark-size,.75rem)}#checkmark-path,#indeterminate-path{stroke-width:var(--checkbox-checkmark-path-width,.3rem);stroke:var(--checkbox-checkmark-stroke-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));stroke-dasharray:var(--checkbox-checkmark-path-dasharray,30);stroke-dashoffset:var(--checkbox-checkmark-path-dasharray,30);transition:var(--checkbox-checkmark-transition,stroke-dashoffset var(--transition-duration-medium,.18s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)))}#checkmark-path{transition-delay:var(--checkbox-checkmark-path-delay,50ms)}#ripple{transform:var(--checkbox-ripple-transform,translate(-50%,-50%) scale(1.8))}")}`,e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkCheckbox.prototype,"name",void 0),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkCheckbox.prototype,"value",void 0),e([ot({attribute:!0,type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkCheckbox.prototype,"checked",void 0),e([st("input"),r("design:type",HTMLInputElement)],t.TkCheckbox.prototype,"$input",void 0),t.TkCheckbox=e([rt("tk-checkbox")],t.TkCheckbox);t.TkDialog=class extends tt{constructor(){super(...arguments),this.modal=!1,this.open=!1,this.blurOverlay=!1}render(){return I`${this.open?I`<div class="overlay ${this.blurOverlay?"blur":""}" @click="${()=>this.modal?null:this.hide()}"></div><div class="container"><slot></slot></div>`:""}`}updated(t){t.has("open")&&this.open&&this.dispatchEvent(new Event("did-show")),t.has("open")&&!this.open&&this.dispatchEvent(new Event("did-close"))}show(){return this.open=!0,new Promise((t=>{this.resolve=t}))}hide(t=null){this.open=!1,this.resolve(t)}},t.TkDialog.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{display:none;outline:none;position:relative}:host([open]){align-items:center;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:var(--dialog-z-index,300)}:host([open]) .overlay{background-color:#00000080;bottom:0;left:0;position:absolute;right:0;top:0}:host([open]) .overlay.blur{backdrop-filter:blur(2px)}:host([open]) .container{animation:fade-in .3s forwards;border-radius:var(--border-radius-medium,.25rem);height:100%;margin:0;max-width:100%;overflow-y:auto;overscroll-behavior:contain;padding:1rem;position:fixed;width:fit-content;will-change:transform,opacity}@keyframes fade-in{0%{opacity:0}to{opacity:1}}")}`,e([ot({type:Boolean,attribute:!0}),r("design:type",Boolean)],t.TkDialog.prototype,"modal",void 0),e([ot({type:Boolean,attribute:!0,reflect:!0}),r("design:type",Boolean)],t.TkDialog.prototype,"open",void 0),e([ot({type:Boolean,attribute:"blur-overlay"}),r("design:type",Boolean)],t.TkDialog.prototype,"blurOverlay",void 0),t.TkDialog=e([rt("tk-dialog")],t.TkDialog);const vt="left",ut="right",gt="down",mt=[vt,ut,"up",gt],bt="possible",yt="blocked";
145
+ t.TkButton=class extends t.TkBox{constructor(){super(...arguments),this.href=null,this.type="button",this.disabled=!1}static get styles(){return[...t.TkBox.styles,l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));--color-darker:var(--primary-darker,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*0.7)));--text:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));align-items:center;background-color:var(--color);border:1px solid var(--color);border-radius:var(--border-radius-medium,.25rem);box-sizing:border-box;color:var(--text);cursor:pointer;display:inline-flex;flex-direction:row;font-family:Roboto,sans-serif;height:2.5em;justify-content:center;letter-spacing:.8px;line-height:2.5em;padding:0 var(--spacing-m,1rem);position:relative;text-align:center;text-decoration:none;text-overflow:ellipsis;user-select:none;vertical-align:middle;white-space:nowrap}:host .content{align-items:center;display:flex;pointer-events:none}:host .before{align-items:center;display:flex}:host .before ::slotted(*){margin-right:var(--spacing-s,.5rem)}:host .after{align-items:center;display:flex}:host .after ::slotted(*){margin-left:var(--spacing-s,.5rem)}:host .badge-out{display:flex;pointer-events:none;position:absolute;right:-.8em;top:-.7em}:host .badge-in{display:flex;pointer-events:none;position:absolute;right:2px;top:2px}:host(:focus){outline:none}:host(:focus),:host(:hover){--color:var(--primary-light,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*1.15)))}:host(:active){--color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)))}:host([inverted]){--color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));--text:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)))}:host([inverted]:focus),:host([inverted]:hover){--color:#0000001a}:host([inverted]:active){--color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)))}:host([accent]){--color:var(--accent,hsl(var(--accent-h,8.76404),var(--accent-s,64.0288%),var(--accent-l,72.7451%)));--color-darker:var(--accent,hsl(var(--accent-h,8.76404),var(--accent-s,64.0288%),var(--accent-l,72.7451%)))}:host([accent]:focus),:host([accent]:hover){--color:var(--accent-light,hsl(var(--accent-h,8.76404),var(--accent-s,64.0288%),calc(var(--accent-l, 72.7451%)*1.15)))}:host([accent]:active){--color:var(--accent,hsl(var(--accent-h,8.76404),var(--accent-s,64.0288%),var(--accent-l,72.7451%)))}:host([accent][inverted]){--color:var(--on-accent,hsl(var(--on-accent-h,0),var(--on-accent-s,0%),var(--on-accent-l,100%)));--text:var(--accent,hsl(var(--accent-h,8.76404),var(--accent-s,64.0288%),var(--accent-l,72.7451%)))}:host([accent][inverted]:focus),:host([accent][inverted]:hover){--color:#0000001a}:host([accent][inverted]:active){--color:var(--on-accent,hsl(var(--on-accent-h,0),var(--on-accent-s,0%),var(--on-accent-l,100%)))}:host([outlined]){background:var(--background,#f7f7f7) radial-gradient(circle,#0000 1%,var(--background,#f7f7f7) 1%) center/15000%;color:var(--color)}:host([pill]){border-radius:var(--border-radius-pill,9999px)}:host([small]){font-size:.8em;height:28px;line-height:.9em;padding:0 var(--spacing-s,.5rem)}:host([small]) .before ::slotted(*){margin-right:var(--spacing-xs,.25rem)}:host([small]) .after ::slotted(*){margin-left:var(--spacing-xs,.25rem)}:host([fab]){align-items:center;border-radius:50%;box-shadow:var(--elevation-1,0 1px 2px var(--shadow));height:40px;justify-content:center;line-height:normal;overflow:hidden;padding:0;width:40px}:host([fab]):hover{box-shadow:var(--elevation-3,0 4px 8px var(--shadow))}:host([fab][small]){font-size:.75em;height:30px;width:30px}:host([flat]){box-shadow:none}:host([flat]):hover{box-shadow:none}:host([disabled]),:host([disabled][accent]){--text:var(--button-color-disabled,var(--shade-lighter));--color:var(--button-bg-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));box-shadow:none;cursor:default;pointer-events:none}")}`]}render(){return I`<div class="before"><slot name="before"></slot></div><div class="content"><slot></slot></div><div class="after"><slot name="after"></slot></div><div class="badge-in"><slot name="badge-in"></slot></div><div class="badge-out"><slot name="badge-out"></slot></div>${this.href?I`<a hidden id="ahref" href="${this.href}" target="${dt(this.target)}" rel="noreferrer"></a>`:""} <button id="${pt()}" hidden type="${dt(this.type)}"></button>`}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.onKeyDown.bind(this))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.onKeyDown)}updated(t){this.tabIndex=this.disabled?-1:0,super.updated(t)}onKeyDown(t){"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),t.stopPropagation(),this.click())}firstUpdated(){"submit"!=this.type&&"reset"!=this.type||this.appendChild(this.$button)}handleClick(t){this.querySelector("button")&&t.target==this.querySelector("button")||this.$ahref&&t.target==this.$ahref||(this.href?this.$ahref.click():"submit"!=this.type&&"reset"!=this.type||this.querySelector("button")?.dispatchEvent(new MouseEvent("click",{relatedTarget:this,composed:!0,bubbles:!0})))}},e([ot(),r("design:type",Object)],t.TkButton.prototype,"href",void 0),e([ot(),r("design:type",String)],t.TkButton.prototype,"target",void 0),e([ot(),r("design:type",String)],t.TkButton.prototype,"type",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkButton.prototype,"disabled",void 0),e([lt("#ahref"),r("design:type",HTMLAnchorElement)],t.TkButton.prototype,"$ahref",void 0),e([lt("button"),r("design:type",HTMLButtonElement)],t.TkButton.prototype,"$button",void 0),t.TkButton=e([rt("tk-button")],t.TkButton);t.TkCheckbox=class extends tt{constructor(){super(...arguments),this.checked=!1}render(){return I`<tk-box direction="row" align-items="center"><div tabindex="0" class="checkbox"><svg id="checkmark" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" preserveAspectRatio="none" viewBox="0 0 24 24"><path id="checkmark-path" fill="none" d="M1.73,12.91 8.1,19.28 22.79,4.59"></path><line id="indeterminate-path" fill="none" x1="0" y1="12.5" x2="24" y2="12.5"/></svg></div><span class="label"><slot></slot></span></tk-box><input id="${pt()}" slot="none" style="display:none" ?checked="${this.checked}" type="checkbox" name="${dt(this.name)}" value="${dt(this.value)}" aria-hidden="true" tabindex="-1">`}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.onKeyDown.bind(this))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.onKeyDown)}firstUpdated(){this.appendChild(this.$input)}onKeyDown(t){"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),t.stopPropagation(),this.click())}handleClick(){this.checked=!this.checked,setTimeout((()=>this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))))}},t.TkCheckbox.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_checkbox-bg:var(--checkbox-bg,#0000);--_checkbox-color:var(--checkbox-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));display:inline-flex}:host .checkbox{align-items:center;background:var(--_checkbox-bg);border:var(--checkbox-border-config,.125rem solid) currentColor;border-radius:var(--checkbox-border-radius,.375rem);color:var(--_checkbox-color);display:inline-flex;height:var(--checkbox-size,1.25rem);justify-content:center;margin:0 5px;min-width:var(--checkbox-size,1.25rem);outline:none;position:relative;transition:var(--checkbox-transition,background var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),border-color var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));-webkit-user-select:none;user-select:none;width:var(--checkbox-size,1.25rem)}:host .label{font-size:1.1em}:host(:not([disabled])){cursor:pointer}:host([checked]),:host([indeterminate]){--_checkbox-bg:var(--checkbox-bg-checked,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));--_checkbox-color:var(--checkbox-color-checked,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([checked]:not([indeterminate])) #checkmark-path,:host([indeterminate]) #indeterminate-path{stroke-dashoffset:0}:host(:focus),:host(:hover){will-change:border,background}:host(:focus) #checkmark-path,:host(:hover) #checkmark-path{will-change:stroke-dashoffset}:host([disabled]){--_checkbox-bg:var(--checkbox-bg-disabled,#0000);--_checkbox-color:var(--checkbox-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));color:var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%)));pointer-events:none}:host([disabled][checked]),:host([disabled][indeterminate]){--_checkbox-bg:var(--checkbox-bg-disabled-checked,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_checkbox-color:var(--checkbox-color-disabled-checked,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}#checkmark{height:var(--checkbox-checkmark-size,.75rem);width:var(--checkbox-checkmark-size,.75rem)}#checkmark-path,#indeterminate-path{stroke-width:var(--checkbox-checkmark-path-width,.3rem);stroke:var(--checkbox-checkmark-stroke-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));stroke-dasharray:var(--checkbox-checkmark-path-dasharray,30);stroke-dashoffset:var(--checkbox-checkmark-path-dasharray,30);transition:var(--checkbox-checkmark-transition,stroke-dashoffset var(--transition-duration-medium,.18s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)))}#checkmark-path{transition-delay:var(--checkbox-checkmark-path-delay,50ms)}#ripple{transform:var(--checkbox-ripple-transform,translate(-50%,-50%) scale(1.8))}")}`,e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkCheckbox.prototype,"name",void 0),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkCheckbox.prototype,"value",void 0),e([ot({attribute:!0,type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkCheckbox.prototype,"checked",void 0),e([lt("input"),r("design:type",HTMLInputElement)],t.TkCheckbox.prototype,"$input",void 0),t.TkCheckbox=e([rt("tk-checkbox")],t.TkCheckbox);t.TkDialog=class extends tt{constructor(){super(...arguments),this.modal=!1,this.open=!1,this.blurOverlay=!1}render(){return I`${this.open?I`<div class="overlay ${this.blurOverlay?"blur":""}" @click="${()=>this.modal?null:this.hide()}"></div><div class="container"><slot></slot></div>`:""}`}updated(t){t.has("open")&&this.open&&this.dispatchEvent(new Event("did-show")),t.has("open")&&!this.open&&this.dispatchEvent(new Event("did-close"))}show(){return this.open=!0,new Promise((t=>{this.resolve=t}))}hide(t=null){this.open=!1,this.resolve(t)}},t.TkDialog.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{display:none;outline:none;position:relative}:host([open]){align-items:center;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:var(--dialog-z-index,300)}:host([open]) .overlay{background-color:#00000080;bottom:0;left:0;position:absolute;right:0;top:0}:host([open]) .overlay.blur{backdrop-filter:blur(2px)}:host([open]) .container{animation:fade-in .3s forwards;border-radius:var(--border-radius-medium,.25rem);height:100%;margin:0;max-width:100%;overflow-y:auto;overscroll-behavior:contain;padding:1rem;position:fixed;width:fit-content;will-change:transform,opacity}@keyframes fade-in{0%{opacity:0}to{opacity:1}}")}`,e([ot({type:Boolean,attribute:!0}),r("design:type",Boolean)],t.TkDialog.prototype,"modal",void 0),e([ot({type:Boolean,attribute:!0,reflect:!0}),r("design:type",Boolean)],t.TkDialog.prototype,"open",void 0),e([ot({type:Boolean,attribute:"blur-overlay"}),r("design:type",Boolean)],t.TkDialog.prototype,"blurOverlay",void 0),t.TkDialog=e([rt("tk-dialog")],t.TkDialog);const ut="left",gt="right",mt="down",bt=[ut,gt],yt=[ut,gt,"up",mt],ft="possible",kt="blocked";
147
146
  /*
148
147
  * contact-js uses pointer events, which combine touch and mouse events (and more)
149
148
  * for readability, "touch" is used in comments
@@ -159,7 +158,7 @@ t.TkButton=class extends t.TkBox{constructor(){super(...arguments),this.href=nul
159
158
  * Therefore, the first pointerdownEvent is the point in time where Contact becomes alive. It dies with the last pointerup event
160
159
  * Contact collects data of the interaction with the surface, but does not decide if a gesture has been detected.
161
160
  */
162
- class ft{constructor(t,e){e=e||{},this.options={DEBUG:!1};for(let t in e)this.options[t]=e[t];this.DEBUG=this.options.DEBUG,this.id=(new Date).getTime(),
161
+ class xt{constructor(t,e){e=e||{},this.options={DEBUG:!1};for(let t in e)this.options[t]=e[t];this.DEBUG=this.options.DEBUG,this.id=(new Date).getTime(),
163
162
  // a map of all active PointerInput instances
164
163
  this.pointerInputs={},this.activePointerInputs={},this.primaryPointerId=t.pointerId,
165
164
  // initialPointerEvent holds the correct event.target for bubbling if pointerListener is bound to a "ancestor element"
@@ -172,7 +171,7 @@ relativeDistanceChange:null,// %
172
171
  rotationAngle:null,//deg ccw[0,360], cw[0,-360]
173
172
  vectorAngle:null},globalParameters:{centerMovement:null,centerMovementVector:null,distanceChange:null,relativeDistanceChange:null,rotationAngle:null,vectorAngle:null}}}
174
173
  // add more pointers
175
- addPointer(t){this.currentPointerEvent=t;var e={DEBUG:this.DEBUG},r=new kt(t,e);this.pointerInputs[t.pointerId]=r,this.activePointerInputs[t.pointerId]=r}removePointer(t){delete this.activePointerInputs[t]}
174
+ addPointer(t){this.currentPointerEvent=t;var e={DEBUG:this.DEBUG},r=new wt(t,e);this.pointerInputs[t.pointerId]=r,this.activePointerInputs[t.pointerId]=r}removePointer(t){delete this.activePointerInputs[t]}
176
175
  // return a specific pointer input by its identifier
177
176
  getPointerInput(t){if(Object.prototype.hasOwnProperty.call(this.pointers,t)){return this.pointers[t]}throw new Error("invalid pointerId: "+t+". Pointer not found in Contact.pointers")}
178
177
  // return the pointer input which started this specific contact phenomenon
@@ -192,17 +191,17 @@ onIdle(){for(let t in this.activePointerInputs){this.activePointerInputs[t].onId
192
191
  // update this contact instance. invoked on pointermove, pointerup and pointercancel events
193
192
  updateState(){var t=!1;Object.keys(this.activePointerInputs).length>0&&(t=!0),this.isActive=t,0==this.isActive?this.endTimestamp=this.currentTimestamp:Object.keys(this.activePointerInputs).length>=2&&this.updateMultipointerParameters()}
194
193
  // functions for multi pointer gestures, currently only 2 pointers are supported
195
- updateMultipointerParameters(){var t=this.getMultiPointerInputs(),e=t[0],r=t[1],i=e.liveParameters.vector,o=r.liveParameters.vector;if(null!=i&&null!=o){var a=Tt(i.startPoint,o.startPoint);this.multipointer.liveParameters.center=a;var n=this.calculateCenterMovement(i,o);this.multipointer.liveParameters.centerMovementVector=n,this.multipointer.liveParameters.centerMovement=n.vectorLength;var s=this.calculateDistanceChange(i,o);this.multipointer.liveParameters.distanceChange=s.absolute,this.multipointer.liveParameters.relativeDistanceChange=s.relative;
194
+ updateMultipointerParameters(){var t=this.getMultiPointerInputs(),e=t[0],r=t[1],i=e.liveParameters.vector,o=r.liveParameters.vector;if(null!=i&&null!=o){var a=Pt(i.startPoint,o.startPoint);this.multipointer.liveParameters.center=a;var n=this.calculateCenterMovement(i,o);this.multipointer.liveParameters.centerMovementVector=n,this.multipointer.liveParameters.centerMovement=n.vectorLength;var s=this.calculateDistanceChange(i,o);this.multipointer.liveParameters.distanceChange=s.absolute,this.multipointer.liveParameters.relativeDistanceChange=s.relative;
196
195
  // calculate rotation angle. imagine the user turning a wheel with 2 fingers
197
196
  var l=this.calculateRotationAngle(i,o);this.multipointer.liveParameters.rotationAngle=l;
198
197
  // calculate the simple vectorAngle for determining if the fingers moved into the same direction
199
198
  var h=this.calculateVectorAngle(i,o);this.multipointer.liveParameters.vectorAngle=h}
200
199
  // global distance change and rotation
201
- var d=e.globalParameters.vector,c=r.globalParameters.vector;if(null!=d&&null!=c){var p=Tt(d.startPoint,c.startPoint);this.multipointer.globalParameters.center=p;var v=this.calculateCenterMovement(d,c);this.multipointer.globalParameters.centerMovementVector=v,this.multipointer.globalParameters.centerMovement=v.vectorLength;var u=this.calculateDistanceChange(d,c);this.multipointer.globalParameters.distanceChange=u.absolute,this.multipointer.globalParameters.relativeDistanceChange=u.relative;var g=this.calculateRotationAngle(d,c);this.multipointer.globalParameters.rotationAngle=g;var m=this.calculateVectorAngle(d,c);this.multipointer.liveParameters.vectorAngle=m}!0===this.DEBUG&&(console.log("[Contact] 2 fingers: centerMovement between pointer #"+e.pointerId+" and pointer #"+r.pointerId+" : "+this.multipointer.liveParameters.centerMovement+"px"),console.log("[Contact] 2 fingers: distanceChange: between pointer #"+e.pointerId+" and pointer #"+r.pointerId+" : "+this.multipointer.liveParameters.distanceChange+"px"),console.log("[Contact] 2 fingers live angle: "+this.multipointer.liveParameters.rotationAngle+"deg"),console.log("[Contact] 2 fingers global angle: "+this.multipointer.globalParameters.rotationAngle+"deg"))}calculateCenterMovement(t,e){
200
+ var d=e.globalParameters.vector,c=r.globalParameters.vector;if(null!=d&&null!=c){var p=Pt(d.startPoint,c.startPoint);this.multipointer.globalParameters.center=p;var v=this.calculateCenterMovement(d,c);this.multipointer.globalParameters.centerMovementVector=v,this.multipointer.globalParameters.centerMovement=v.vectorLength;var u=this.calculateDistanceChange(d,c);this.multipointer.globalParameters.distanceChange=u.absolute,this.multipointer.globalParameters.relativeDistanceChange=u.relative;var g=this.calculateRotationAngle(d,c);this.multipointer.globalParameters.rotationAngle=g;var m=this.calculateVectorAngle(d,c);this.multipointer.liveParameters.vectorAngle=m}!0===this.DEBUG&&(console.log("[Contact] 2 fingers: centerMovement between pointer #"+e.pointerId+" and pointer #"+r.pointerId+" : "+this.multipointer.liveParameters.centerMovement+"px"),console.log("[Contact] 2 fingers: distanceChange: between pointer #"+e.pointerId+" and pointer #"+r.pointerId+" : "+this.multipointer.liveParameters.distanceChange+"px"),console.log("[Contact] 2 fingers live angle: "+this.multipointer.liveParameters.rotationAngle+"deg"),console.log("[Contact] 2 fingers global angle: "+this.multipointer.globalParameters.rotationAngle+"deg"))}calculateCenterMovement(t,e){
202
201
  // start point is the center between the starting points of the 2 vectors
203
- var r=Tt(t.startPoint,e.startPoint),i=Tt(t.endPoint,e.endPoint);
202
+ var r=Pt(t.startPoint,e.startPoint),i=Pt(t.endPoint,e.endPoint);
204
203
  // center between the end points of the vectors
205
- return new wt(r,i)}calculateDistanceChange(t,e){var r=new wt(t.startPoint,e.startPoint),i=new wt(t.endPoint,e.endPoint);return{absolute:i.vectorLength-r.vectorLength,relative:i.vectorLength/r.vectorLength}}
204
+ return new $t(r,i)}calculateDistanceChange(t,e){var r=new $t(t.startPoint,e.startPoint),i=new $t(t.endPoint,e.endPoint);return{absolute:i.vectorLength-r.vectorLength,relative:i.vectorLength/r.vectorLength}}
206
205
  /*
207
206
  * CALCULATE ROTATION
208
207
  * this is not a trivial problem
@@ -217,7 +216,7 @@ return new wt(r,i)}calculateDistanceChange(t,e){var r=new wt(t.startPoint,e.star
217
216
  */calculateRotationAngle(t,e){
218
217
  // vector_ are vectors between 2 points in time, same finger
219
218
  // angleAector_ are vectors between 2 fingers
220
- var r=new wt(t.startPoint,e.startPoint),i=new wt(t.endPoint,e.endPoint),o=new xt(0,0),a=new wt(r.startPoint,o),n=$t(r.endPoint,a),s=new wt(i.startPoint,o),l=$t(i.endPoint,s),h=-1*function(t){var e=Math.atan2(t.y,t.x);// [-PI, PI]
219
+ var r=new $t(t.startPoint,e.startPoint),i=new $t(t.endPoint,e.endPoint),o=new Tt(0,0),a=new $t(r.startPoint,o),n=St(r.endPoint,a),s=new $t(i.startPoint,o),l=St(i.endPoint,s),h=-1*function(t){var e=Math.atan2(t.y,t.x);// [-PI, PI]
221
220
  e<0&&(e=2*Math.PI+e);return e}
222
221
  // single finger gestures
223
222
  (n),d=l.x*Math.cos(h)-l.y*Math.sin(h),c=Math.round(l.x*Math.sin(h)+l.y*Math.cos(h));// in time: occured first
@@ -233,7 +232,7 @@ return 180*Math.atan2(c,d)/Math.PI}calculateVectorAngle(t,e){var r=null;if(t.vec
233
232
  - start and end coordinates
234
233
  - start and end timestamps
235
234
  - speeds and distances
236
- **********************************************************************************************/class kt{constructor(t,e){e=e||{},this.options={DEBUG:!1};for(let t in e)this.options[t]=e[t];this.DEBUG=this.options.DEBUG;var r=(new Date).getTime();this.pointerId=t.pointerId;var i=Object.prototype.hasOwnProperty.call(this.options,"vectorTimespan");this.vectorTimespan=1==i?this.options.vectorTimespan:100,// milliseconds
235
+ **********************************************************************************************/class wt{constructor(t,e){e=e||{},this.options={DEBUG:!1};for(let t in e)this.options[t]=e[t];this.DEBUG=this.options.DEBUG;var r=(new Date).getTime();this.pointerId=t.pointerId;var i=Object.prototype.hasOwnProperty.call(this.options,"vectorTimespan");this.vectorTimespan=1==i?this.options.vectorTimespan:100,// milliseconds
237
236
  // events used for vector calculation
238
237
  this.initialPointerEvent=t,this.currentPointerEvent=t,this.recognizedEvents=[t],this.canceled=!1,this.isActive=!0;
239
238
  // start with the NullVector to support idle
@@ -264,11 +263,11 @@ this.liveParameters.speed>this.globalParameters.maximumSpeed&&(this.globalParame
264
263
  // if so, use this.initialPointerEvent as a fallback
265
264
  var t=this.initialPointerEvent,e=this.recognizedEvents[this.recognizedEvents.length-1],r=this.recognizedEvents.length-1,i=0,o=e.timeStamp;i<this.vectorTimespan&&!((r-=1)<0);)i=o-(t=this.recognizedEvents[r]).timeStamp;var a=[t,e];return this.recognizedEvents=this.recognizedEvents.slice(-20),a}
266
265
  // create and return a vector based on 2 PointerEvents
267
- getVector(t,e){var r=null;if(null!=t&&null!=e){let i=new xt(t.clientX,t.clientY),o=new xt(e.clientX,e.clientY);r=new wt(i,o)}return r}
266
+ getVector(t,e){var r=null;if(null!=t&&null!=e){let i=new Tt(t.clientX,t.clientY),o=new Tt(e.clientX,e.clientY);r=new $t(i,o)}return r}
268
267
  // update speed. speed = distance / time
269
268
  getSpeed(t,e,r){!0===this.DEBUG&&(console.log("[PointerInput vector] "+t),console.log("[PointerInput startTimestamp] "+e),console.log("[PointerInput endTimestamp] "+r));var i=0,o=(r-e)/1e3;return null!=t&&0!=o&&(
270
269
  // px/s
271
- i=t.vectorLength/o),i}}class xt{constructor(t,e){this.x=t,this.y=e}}class wt{
270
+ i=t.vectorLength/o),i}}class Tt{constructor(t,e){this.x=t,this.y=e}}class $t{
272
271
  // vector between 2 points: START(x,y) and END(x,y)
273
272
  constructor(t,e){this.startPoint=t,this.endPoint=e,this.direction="0",this.deltaX=this.endPoint.x-this.startPoint.x,this.deltaY=this.endPoint.y-this.startPoint.y,this.x=this.deltaX,this.y=this.deltaY,
274
273
  // determine length
@@ -276,9 +275,9 @@ this.vectorLength=Math.sqrt(Math.pow(this.deltaX,2)+Math.pow(this.deltaY,2)),
276
275
  // determine direction
277
276
  Math.abs(this.deltaX)>Math.abs(this.deltaY)?
278
277
  // left or right
279
- this.startPoint.x<this.endPoint.x?this.direction=ut:this.direction=vt:
278
+ this.startPoint.x<this.endPoint.x?this.direction=gt:this.direction=ut:
280
279
  // up or down
281
- this.startPoint.y<this.endPoint.y?this.direction="up":this.direction=gt}}function Tt(t,e){var r=(t.x+e.x)/2,i=(t.y+e.y)/2;return new xt(r,i)}function $t(t,e){var r=t.x+e.x,i=t.y+e.y;return new xt(r,i)}class Pt{constructor(t,e){this.domElement=t,this.isActive=!1,this.state=bt,
280
+ this.startPoint.y<this.endPoint.y?this.direction="up":this.direction=mt}}function Pt(t,e){var r=(t.x+e.x)/2,i=(t.y+e.y)/2;return new Tt(r,i)}function St(t,e){var r=t.x+e.x,i=t.y+e.y;return new Tt(r,i)}class _t{constructor(t,e){this.domElement=t,this.isActive=!1,this.state=ft,
282
281
  // the PointerEvent when the gesture has been recognized, used for some global calculations
283
282
  // it is not always reasonable to use contact.pointerdownEvent, because the user could first rotate and object, and after some time perform a pinch
284
283
  // the starting point of the pinch then is not contact.pointerdownEvent
@@ -298,7 +297,7 @@ averageSpeed:[null,null],// px/s
298
297
  finalSpeed:[null,null],// px/s
299
298
  distance:[null,null]};let r={bubbles:!0,blocks:[],DEBUG:!1};this.options=e||{};for(let t in r)t in this.options||(this.options[t]=r[t]);this.DEBUG=this.options.DEBUG}validateMinMax(t,e,r){var i=t[e][0],o=t[e][1];return 1==this.DEBUG&&console.log("[Gestures] checking "+e+"[gesture.isActive: "+this.isActive.toString()+"] minValue: "+i+", maxValue: "+o+", current value: "+r),null!=i&&null!=r&&r<i?(1==this.DEBUG&&console.log("dismissing min"+this.eventBaseName+": required "+e+": "+i+", current value: "+r),!1):!(null!=o&&null!=r&&r>o)||(1==this.DEBUG&&console.log("dismissing max"+this.eventBaseName+": required "+e+": "+o+", current value: "+r),!1)}validateBool(t,e){
300
299
  // requiresPointerMove = null -> it does not matter if the pointer has been moved
301
- var r=this.boolParameters[t];return null!=r&&null!=e&&r===e||(null==r||(1==this.DEBUG&&console.log("[Gestures] dismissing "+this.eventBaseName+": "+t+" required: "+r+", actual value: "+e),!1))}getMinMaxParameters(t){var e=t.getPrimaryPointerInput();return{pointerCount:Object.keys(t.activePointerInputs).length,duration:e.globalParameters.duration,currentSpeed:e.liveParameters.speed,averageSpeed:e.globalParameters.averageSpeed,finalSpeed:e.globalParameters.finalSpeed,distance:e.liveParameters.vector.vectorLength}}getBoolParameters(t){var e=t.getPrimaryPointerInput();return{requiresPointerUp:!1===e.isActive,requiresActivePointer:!0===e.isActive,requiresPointerMove:!0===e.globalParameters.hasBeenMoved}}validate(t){if(this.state==yt)return!1;var e=t.getPrimaryPointerInput();1==this.DEBUG&&console.log("[Gestures] running recognition for "+this.eventBaseName);var r=this.getBoolParameters(t);for(let t in this.boolParameters){let e=r[t];if(0==this.validateBool(t,e))return!1;
300
+ var r=this.boolParameters[t];return null!=r&&null!=e&&r===e||(null==r||(1==this.DEBUG&&console.log("[Gestures] dismissing "+this.eventBaseName+": "+t+" required: "+r+", actual value: "+e),!1))}getMinMaxParameters(t){var e=t.getPrimaryPointerInput();return{pointerCount:Object.keys(t.activePointerInputs).length,duration:e.globalParameters.duration,currentSpeed:e.liveParameters.speed,averageSpeed:e.globalParameters.averageSpeed,finalSpeed:e.globalParameters.finalSpeed,distance:e.liveParameters.vector.vectorLength}}getBoolParameters(t){var e=t.getPrimaryPointerInput();return{requiresPointerUp:!1===e.isActive,requiresActivePointer:!0===e.isActive,requiresPointerMove:!0===e.globalParameters.hasBeenMoved}}validate(t){if(this.state==kt)return!1;var e=t.getPrimaryPointerInput();1==this.DEBUG&&console.log("[Gestures] running recognition for "+this.eventBaseName);var r=this.getBoolParameters(t);for(let t in this.boolParameters){let e=r[t];if(0==this.validateBool(t,e))return!1;
302
301
  //break;
303
302
  }var i,o=this.getMinMaxParameters(t);
304
303
  // check duration
@@ -306,7 +305,7 @@ i=1==this.isActive?this.activeStateMinMaxParameters:this.initialMinMaxParameters
306
305
  //break;
307
306
  }
308
307
  // check direction
309
- return!(1==Object.prototype.hasOwnProperty.call(this.options,"supportedDirections")&&this.options.supportedDirections.length>0&&-1==this.options.supportedDirections.indexOf(e.liveParameters.vector.direction))||(1==this.DEBUG&&console.log("[Gestures] dismissing "+this.eventBaseName+": supported directions: "+this.options.supportedDirections+", current direction: "+e.liveParameters.vector.direction),!1)}recognize(t){var e=this.validate(t);1==e&&0==this.isActive&&this.state==bt&&this.onStart(t),1==e&&1==this.isActive&&this.state==bt?this.emit(t):1==this.isActive&&0==e&&this.onEnd(t)}block(t){-1==this.options.blocks.indexOf(t)&&this.options.blocks.push(t)}unblock(t){-1!=this.options.blocks.indexOf(t)&&this.options.blocks.splice(this.options.blocks.indexOf(t),1)}blockGestures(){for(let t=0;t<this.options.blocks.length;t++){let e=this.options.blocks[t];0==e.isActive&&(0==this.DEBUG&&console.log("[Gesture] blocking "+e.eventBaseName),e.state=yt)}}unblockGestures(){for(let t=0;t<this.options.blocks.length;t++){this.options.blocks[t].state=bt}}getEventData(t){return{contact:t,recognizer:this}}
308
+ return!(1==Object.prototype.hasOwnProperty.call(this.options,"supportedDirections")&&this.options.supportedDirections.length>0&&-1==this.options.supportedDirections.indexOf(e.liveParameters.vector.direction))||(1==this.DEBUG&&console.log("[Gestures] dismissing "+this.eventBaseName+": supported directions: "+this.options.supportedDirections+", current direction: "+e.liveParameters.vector.direction),!1)}recognize(t){var e=this.validate(t);1==e&&0==this.isActive&&this.state==ft&&this.onStart(t),1==e&&1==this.isActive&&this.state==ft?this.emit(t):1==this.isActive&&0==e&&this.onEnd(t)}block(t){-1==this.options.blocks.indexOf(t)&&this.options.blocks.push(t)}unblock(t){-1!=this.options.blocks.indexOf(t)&&this.options.blocks.splice(this.options.blocks.indexOf(t),1)}blockGestures(){for(let t=0;t<this.options.blocks.length;t++){let e=this.options.blocks[t];0==e.isActive&&(0==this.DEBUG&&console.log("[Gesture] blocking "+e.eventBaseName),e.state=kt)}}unblockGestures(){for(let t=0;t<this.options.blocks.length;t++){this.options.blocks[t].state=ft}}getEventData(t){return{contact:t,recognizer:this}}
310
309
  // fire events
311
310
  emit(t,e){
312
311
  // fire general event like "pan" , "pinch", "rotate"
@@ -318,10 +317,10 @@ var r=this.getEventData(t),i=new CustomEvent(e,{detail:r});this.domElement.dispa
318
317
  // fire gestureend event
319
318
  let r=this.getEventData(t);var i=new CustomEvent(e,{detail:r});this.domElement.dispatchEvent(i)}
320
319
  // provide the ability to react (eg block) to touch events
321
- onTouchStart(){}onTouchMove(){}onTouchEnd(){}onTouchCancel(){}}class St extends Pt{constructor(t,e){super(t,e=e||{})}getEventData(t){
320
+ onTouchStart(){}onTouchMove(){}onTouchEnd(){}onTouchCancel(){}}class Et extends _t{constructor(t,e){super(t,e=e||{})}getEventData(t){
322
321
  // provide short-cuts to the values collected in the Contact object
323
322
  // match this to the event used by hammer.js
324
- var e=super.getEventData(t),r=t.getPrimaryPointerInput(),i=new xt(this.initialPointerEvent.clientX,this.initialPointerEvent.clientY),o=new xt(t.currentPointerEvent.clientX,t.currentPointerEvent.clientY),a=new wt(i,o),n=t.currentPointerEvent.timeStamp-this.initialPointerEvent.timeStamp;
323
+ var e=super.getEventData(t),r=t.getPrimaryPointerInput(),i=new Tt(this.initialPointerEvent.clientX,this.initialPointerEvent.clientY),o=new Tt(t.currentPointerEvent.clientX,t.currentPointerEvent.clientY),a=new $t(i,o),n=t.currentPointerEvent.timeStamp-this.initialPointerEvent.timeStamp;
325
324
  // this should be optimized in the future, not using primaryPointerInput, but something like currentPointerInput
326
325
  // global: global for this recognizer, not the Contact object
327
326
  return e.global={deltaX:a.x,deltaY:a.y,distance:a.vectorLength,speedX:a.x/n,speedY:a.y/n,speed:a.vectorLength/n,direction:a.direction,scale:1,rotation:0,srcEvent:t.currentPointerEvent},e.live={deltaX:r.liveParameters.vector.x,deltaY:r.liveParameters.vector.y,distance:r.liveParameters.vector.vectorLength,speedX:r.liveParameters.vector.x/t.vectorTimespan,speedY:r.liveParameters.vector.y/t.vectorTimespan,speed:r.liveParameters.speed,direction:r.liveParameters.vector.direction,scale:1,rotation:0,center:{x:r.liveParameters.vector.endPoint.x,y:r.liveParameters.vector.endPoint.y},srcEvent:t.currentPointerEvent
@@ -341,10 +340,10 @@ return e.global={deltaX:a.x,deltaY:a.y,distance:a.vectorLength,speedX:a.x/n,spee
341
340
  * - to detect a "swipe", the final speed is used
342
341
  * - a SWIPE is a pan that ended with a high speed (velocity without direction)
343
342
  * - Pan supports directions. options["supportedDirections"] = []
344
- */class _t extends St{constructor(t,e){super(t,e=e||{}),this.eventBaseName="pan",this.initialMinMaxParameters.pointerCount=[1,1],// 1: no pan recognized at the pointerup event. 0: pan recognized at pointerup
345
- this.initialMinMaxParameters.duration=[0,null],this.initialMinMaxParameters.distance=[10,null],this.activeStateMinMaxParameters.pointerCount=[1,1],this.boolParameters.requiresPointerMove=!0,this.boolParameters.requiresActivePointer=!0,this.swipeFinalSpeed=600,this.isSwipe=!1,this.initialSupportedDirections=mt,Object.prototype.hasOwnProperty.call(e,"supportedDirections")?this.initialSupportedDirections=e.supportedDirections:this.options.supportedDirections=mt}validate(t){
343
+ */class At extends Et{constructor(t,e){super(t,e=e||{}),this.eventBaseName="pan",this.initialMinMaxParameters.pointerCount=[1,1],// 1: no pan recognized at the pointerup event. 0: pan recognized at pointerup
344
+ this.initialMinMaxParameters.duration=[0,null],this.initialMinMaxParameters.distance=[10,null],this.activeStateMinMaxParameters.pointerCount=[1,1],this.boolParameters.requiresPointerMove=!0,this.boolParameters.requiresActivePointer=!0,this.swipeFinalSpeed=600,this.isSwipe=!1,this.initialSupportedDirections=yt,Object.prototype.hasOwnProperty.call(e,"supportedDirections")?this.initialSupportedDirections=e.supportedDirections:this.options.supportedDirections=yt}validate(t){
346
345
  // on second recognition allow all directions. otherwise, the "pan" mode would end if the finger was moved right and then down during "panleft" mode
347
- return 1==this.isActive&&(this.options.supportedDirections=mt),super.validate(t)}onStart(t){this.isSwipe=!1,super.onStart(t)}
346
+ return 1==this.isActive&&(this.options.supportedDirections=yt),super.validate(t)}onStart(t){this.isSwipe=!1,super.onStart(t)}
348
347
  // check if it was a swipe
349
348
  onEnd(t){var e=t.getPrimaryPointerInput();this.swipeFinalSpeed<e.globalParameters.finalSpeed&&(this.isSwipe=!0,this.emit(t,"swipe")),super.onEnd(t),this.options.supportedDirections=this.initialSupportedDirections}onTouchMove(t){1==this.isActive&&(1==this.DEBUG&&console.log("[Pan] preventing touchmove default"),t.preventDefault(),t.stopPropagation())}}
350
349
  /*
@@ -352,16 +351,16 @@ onEnd(t){var e=t.getPrimaryPointerInput();this.swipeFinalSpeed<e.globalParameter
352
351
  * - user touches the screen with one finger or presses the mouse button down
353
352
  * - the finger does not move for x ms
354
353
  * - the finger is released, Tap is no recognized
355
- */class Et extends St{constructor(t,e){super(t,e=e||{}),this.eventBaseName="tap",this.initialMinMaxParameters.pointerCount=[0,0],// count of fingers touching the surface. a tap is fired AFTER the user removed his finger
354
+ */class zt extends Et{constructor(t,e){super(t,e=e||{}),this.eventBaseName="tap",this.initialMinMaxParameters.pointerCount=[0,0],// count of fingers touching the surface. a tap is fired AFTER the user removed his finger
356
355
  this.initialMinMaxParameters.duration=[0,200],// milliseconds. after a certain touch duration, it is not a TAP anymore
357
356
  this.initialMinMaxParameters.distance=[null,30],// if a certain distance is detected, TAP becomes impossible
358
- this.boolParameters.requiresPointerMove=null,this.boolParameters.requiresActivePointer=!1}recognize(t){1==this.validate(t)&&this.state==bt&&(this.initialPointerEvent=t.currentPointerEvent,this.emit(t))}}
357
+ this.boolParameters.requiresPointerMove=null,this.boolParameters.requiresActivePointer=!1}recognize(t){1==this.validate(t)&&this.state==ft&&(this.initialPointerEvent=t.currentPointerEvent,this.emit(t))}}
359
358
  /*
360
359
  * press should only be fired once
361
360
  * if global duration is below Press.initialMinMaxParameters["duration"][0], set the Press to possible
362
361
  * if global duration is above Press.initialMinMaxParameters["duration"][0] AND press already has been emitted, set Press to impossible
363
362
  *
364
- */class At extends Pt{constructor(t,e){super(t,e=e||{}),this.boolParameters={requiresPointerMove:null,requiresActivePointer:null},this.initialMinMaxParameters={pointerCount:[2,null]},this.activeStateMinMaxParameters={pointerCount:[2,null]},this.options=e||{}}}class zt extends At{constructor(t,e){super(t,e=e||{}),this.boolParameters.requiresPointerMove=!0,this.boolParameters.requiresActivePointer=!0,this.initialMinMaxParameters.pointerCount=[2,2],// minimum number of fingers currently on the surface
363
+ */class Ct extends _t{constructor(t,e){super(t,e=e||{}),this.boolParameters={requiresPointerMove:null,requiresActivePointer:null},this.initialMinMaxParameters={pointerCount:[2,null]},this.activeStateMinMaxParameters={pointerCount:[2,null]},this.options=e||{}}}class Bt extends Ct{constructor(t,e){super(t,e=e||{}),this.boolParameters.requiresPointerMove=!0,this.boolParameters.requiresActivePointer=!0,this.initialMinMaxParameters.pointerCount=[2,2],// minimum number of fingers currently on the surface
365
364
  this.initialMinMaxParameters.centerMovement=[null,null],//px
366
365
  this.initialMinMaxParameters.distanceChange=[null,null],//px - distance between 2 fingers
367
366
  this.initialMinMaxParameters.rotationAngle=[null,null],// degrees: positive = clockwise, negative = counter-clockwise (js convention, not mathematical convention)
@@ -392,7 +391,7 @@ return e.global={deltaX:i.centerMovementVector.x,deltaY:i.centerMovementVector.y
392
391
  * - var listener = new PointerListener(domElement, {});
393
392
  * - domElement.addEventListener("pan", function(){});
394
393
  */
395
- var Ct=[Et,class extends St{constructor(t,e){super(t,e=e||{}),this.eventBaseName="press",this.initialMinMaxParameters.pointerCount=[1,1],// count of fingers touching the surface. a press is fired during an active contact
394
+ var Mt=[zt,class extends Et{constructor(t,e){super(t,e=e||{}),this.eventBaseName="press",this.initialMinMaxParameters.pointerCount=[1,1],// count of fingers touching the surface. a press is fired during an active contact
396
395
  this.initialMinMaxParameters.duration=[600,null],// milliseconds. after a certain touch duration, it is not a TAP anymore
397
396
  this.initialMinMaxParameters.distance=[null,10],// if a certain distance is detected, Press becomes impossible
398
397
  this.boolParameters.requiresPointerMove=null,this.boolParameters.requiresActivePointer=!0,
@@ -401,7 +400,7 @@ this.hasBeenEmitted=!1,
401
400
  // as the global vector length is used, press should not trigger if the user moves away from the startpoint, then back, then stays
402
401
  this.hasBeenInvalidatedForContactId=null}
403
402
  // distance has to use the global vector
404
- getMinMaxParameters(t){var e=super.getMinMaxParameters(t),r=t.getPrimaryPointerInput();return e.distance=r.globalParameters.vector.vectorLength,e}recognize(t){var e=this.validate(t),r=t.getPrimaryPointerInput();if(null!=this.hasBeenInvalidatedForContactId&&this.hasBeenInvalidatedForContactId!=t.id&&(this.hasBeenInvalidatedForContactId=null),0==e&&r.globalParameters.vector.vectorLength>this.initialMinMaxParameters.distance[1]&&(this.hasBeenInvalidatedForContactId=t.id),1==e&&0==this.hasBeenEmitted&&null==this.hasBeenInvalidatedForContactId)this.initialPointerEvent=t.currentPointerEvent,this.emit(t),this.hasBeenEmitted=!0;else{let t=r.globalParameters.duration;1==this.hasBeenEmitted&&t<=this.initialMinMaxParameters.duration[0]&&(this.hasBeenEmitted=!1)}}},_t,class extends zt{constructor(t,e){super(t,e=e||{}),this.eventBaseName="pinch",this.initialMinMaxParameters.centerMovement=[0,50],//px
403
+ getMinMaxParameters(t){var e=super.getMinMaxParameters(t),r=t.getPrimaryPointerInput();return e.distance=r.globalParameters.vector.vectorLength,e}recognize(t){var e=this.validate(t),r=t.getPrimaryPointerInput();if(null!=this.hasBeenInvalidatedForContactId&&this.hasBeenInvalidatedForContactId!=t.id&&(this.hasBeenInvalidatedForContactId=null),0==e&&r.globalParameters.vector.vectorLength>this.initialMinMaxParameters.distance[1]&&(this.hasBeenInvalidatedForContactId=t.id),1==e&&0==this.hasBeenEmitted&&null==this.hasBeenInvalidatedForContactId)this.initialPointerEvent=t.currentPointerEvent,this.emit(t),this.hasBeenEmitted=!0;else{let t=r.globalParameters.duration;1==this.hasBeenEmitted&&t<=this.initialMinMaxParameters.duration[0]&&(this.hasBeenEmitted=!1)}}},At,class extends Bt{constructor(t,e){super(t,e=e||{}),this.eventBaseName="pinch",this.initialMinMaxParameters.centerMovement=[0,50],//px
405
404
  this.initialMinMaxParameters.distanceChange=[5,null],// distance between 2 fingers
406
405
  this.initialMinMaxParameters.rotationAngle=[null,20],// distance between 2 fingers
407
406
  this.initialMinMaxParameters.vectorAngle=[10,null]}}
@@ -409,16 +408,16 @@ this.initialMinMaxParameters.vectorAngle=[10,null]}}
409
408
  * ROTATE DEFINITION
410
409
  * - 2 fingers touch the surface
411
410
  * - 1 or 2 fingers are moved in a circular motion. the center is between the 2 fingers
412
- */,class extends zt{constructor(t,e){super(t,e=e||{}),this.eventBaseName="rotate",this.initialMinMaxParameters.centerMovement=[0,50],this.initialMinMaxParameters.distanceChange=[null,50],this.initialMinMaxParameters.rotationAngle=[5,null]}}
411
+ */,class extends Bt{constructor(t,e){super(t,e=e||{}),this.eventBaseName="rotate",this.initialMinMaxParameters.centerMovement=[0,50],this.initialMinMaxParameters.distanceChange=[null,50],this.initialMinMaxParameters.rotationAngle=[5,null]}}
413
412
  /*
414
413
  * 2 fingers are moved across the surface, in the same direction
415
- */,class extends zt{constructor(t,e){super(t,e=e||{}),this.eventBaseName="twofingerpan",this.initialMinMaxParameters.centerMovement=[3,null],this.initialMinMaxParameters.distanceChange=[null,50],this.initialMinMaxParameters.rotationAngle=[null,null],this.initialMinMaxParameters.vectorAngle=[null,150]}}];class Bt{constructor(t,e){
414
+ */,class extends Bt{constructor(t,e){super(t,e=e||{}),this.eventBaseName="twofingerpan",this.initialMinMaxParameters.centerMovement=[3,null],this.initialMinMaxParameters.distanceChange=[null,50],this.initialMinMaxParameters.rotationAngle=[null,null],this.initialMinMaxParameters.vectorAngle=[null,150]}}];class Lt{constructor(t,e){
416
415
  // registry for events like "pan", "rotate", which have to be removed on this.destroy();
417
416
  this.eventHandlers={},this.lastRecognitionTimestamp=null,this.idleRecognitionIntervalId=null,this.pointerEventHandlers={},this.touchEventHandlers={},e=e||{},this.options={bubbles:!0,handleTouchEvents:!0,DEBUG:!1,DEBUG_GESTURES:!1,DEBUG_CONTACT:!1};
418
417
  // add user-defined options to this.options
419
418
  for(let t in e)"supportedGestures"!=t&&(this.options[t]=e[t]);this.DEBUG=this.options.DEBUG;
420
419
  // add instantiatedGestures to options.supportedGestures
421
- var r=Ct,i=[];1==Object.prototype.hasOwnProperty.call(e,"supportedGestures")&&(r=e.supportedGestures);for(let e=0;e<r.length;e++){let o,a=r[e],n={bubbles:this.options.bubbles,DEBUG:this.options.DEBUG_GESTURES};if("function"==typeof a)o=new a(t,n);else{if("object"!=typeof a)throw new Error("unsupported gesture type: "+typeof a);o=a}i.push(o)}this.options.supportedGestures=i,this.domElement=t,
420
+ var r=Mt,i=[];1==Object.prototype.hasOwnProperty.call(e,"supportedGestures")&&(r=e.supportedGestures);for(let e=0;e<r.length;e++){let o,a=r[e],n={bubbles:this.options.bubbles,DEBUG:this.options.DEBUG_GESTURES};if("function"==typeof a)o=new a(t,n);else{if("object"!=typeof a)throw new Error("unsupported gesture type: "+typeof a);o=a}i.push(o)}this.options.supportedGestures=i,this.domElement=t,
422
421
  // the Contact instance - only active during an active pointerdown
423
422
  this.contact=null,
424
423
  // disable context menu on long taps - this kills pointermove
@@ -429,7 +428,7 @@ this.contact=null,
429
428
  this.addPointerListeners(),this.addTouchListeners()}addPointerListeners(){var t=this,e=this.domElement,r=function(r){if(1==t.DEBUG&&console.log("[PointerListener] pointerdown event detected"),
430
429
  // re-target all pointerevents to the current element
431
430
  // see https://developer.mozilla.org/en-US/docs/Web/API/Element/setPointerCapture
432
- e.setPointerCapture(r.pointerId),null==t.contact||0==t.contact.isActive){let e={DEBUG:t.options.DEBUG_CONTACT};t.contact=new ft(r,e)}else
431
+ e.setPointerCapture(r.pointerId),null==t.contact||0==t.contact.isActive){let e={DEBUG:t.options.DEBUG_CONTACT};t.contact=new xt(r,e)}else
433
432
  // use existing contact instance if a second pointer becomes present
434
433
  t.contact.addPointer(r);1==Object.prototype.hasOwnProperty.call(t.options,"pointerdown")&&t.options.pointerdown(r,t),
435
434
  // before starting a new interval, make sure the old one is stopped if present
@@ -461,19 +460,21 @@ recognizeGestures(){this.lastRecognitionTimestamp=(new Date).getTime();for(let t
461
460
  * useCapture defaults to false
462
461
  */parseEventsString(t){return t.trim().split(/\s+/g)}on(t,e){let r=this.parseEventsString(t);for(let t=0;t<r.length;t++){let i=r[t];i in this.eventHandlers||(this.eventHandlers[i]=[]),-1==this.eventHandlers[i].indexOf(e)&&this.eventHandlers[i].push(e),this.domElement.addEventListener(i,e,!1)}}off(t,e){let r=this.parseEventsString(t);for(let t=0;t<r.length;t++){let i=r[t];if(i in this.eventHandlers){let t=this.eventHandlers[i],r=t.indexOf(e);r>=0&&(t.splice(r,1),this.eventHandlers[i]=t),this.domElement.removeEventListener(i,e,!1)}}}destroy(){
463
462
  // remove all EventListeners from self.domElement
464
- for(let t in this.eventHandlers){let e=this.eventHandlers[t];for(let r=0;r<e.length;r++){let i=e[r];this.domElement.removeEventListener(t,i)}delete this.eventHandlers[t]}this.removePointerListeners(),this.removeTouchListeners()}}t.TkDrawer=class extends tt{constructor(){super(...arguments),this.open=!1,this.over=!1,this.left=!1,this.swipeable=!1}render(){return I`<div class="container fi"><slot name="drawer-container"></slot></div><div class="overlay" @click="${()=>this.open=!1}"></div><div class="drawer"><div class="drawer-header"><slot name="drawer-header"></slot></div><div class="drawer-content"><slot name="drawer-content"></slot></div><div class="drawer-footer"><slot name="drawer-footer"></slot></div></div>`}updated(t){t.has("open")&&this.open&&this.dispatchEvent(new Event("did-show")),t.has("open")&&!this.open&&this.dispatchEvent(new Event("did-close")),t.has("overQuery")&&this.overMediaQuery(),t.has("openQuery")&&window.matchMedia(this.openQuery).matches&&this.show(),t.has("swipeable")&&this.swipeable&&(this.pointerListener=new Bt(this.$drawer,{supportedGestures:[Et,_t],bubbles:!1}),this.$drawer.addEventListener("tap",(t=>{const{x:e,y:r}=t.detail.live.srcEvent,i=this.shadowRoot?.elementFromPoint(e,r);i&&i.click()})),this.$drawer.addEventListener("pan",(t=>{var e="translate3d("+(t.detail.global.deltaX>0?0:t.detail.global.deltaX)+"px, 0px, 0)";requestAnimationFrame((t=>{this.$drawer.style.transform=e}))})),this.$drawer.addEventListener("panend",(t=>{requestAnimationFrame((e=>{this.$drawer.style.transform="",this.open=!(t.detail.global.deltaX<-50)}))}))),t.has("swipeable")&&!this.swipeable&&(this.pointerListener&&this.pointerListener.destroy(),this.pointerListener=null)}overMediaQuery(){this.mql&&this.mql.removeEventListener("change",this.overMediaQueryListener.bind(this)),this.mql=window.matchMedia(this.overQuery),this.mql.matches?this.setAttribute("over",""):this.removeAttribute("over"),this.mql.addEventListener("change",this.overMediaQueryListener.bind(this))}overMediaQueryListener(t){t.matches?this.setAttribute("over",""):this.removeAttribute("over")}hideIfOver(){(this.overQuery&&this.mql?.matches||this.over)&&(this.open=!1)}show(){this.open=!0}hide(){this.open=!1}toggle(){this.open=!this.open}},t.TkDrawer.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{display:block;height:100%;overflow:hidden;position:relative;width:100%}.drawer{background-color:var(--background,#f7f7f7);color:var(--foreground,#454545);display:flex;flex-direction:column;height:100%;overflow:scroll;position:absolute;top:0;transform:translateX(-100%);transition:transform cubic-bezier(.4,0,.2,1) var(--transition-duration-medium,.18s);width:var(--drawer-width,256px);will-change:transform;z-index:var(--drawer-z-index,200)}.drawer .drawer-content{flex:1;overflow:scroll}:host([left]) .drawer{right:0;transform:translateX(100%)}.overlay{background-color:#00000080;bottom:0;display:none;left:0;position:absolute;right:0;top:0;z-index:var(--drawer-overlay-z-index,200)}.container{background-color:var(--background,#f7f7f7);height:100%;overflow:scroll;transition:padding cubic-bezier(.4,0,.2,1) var(--transition-duration-slow,.25s)}:host([open]) .drawer{transform:none}:host([open]) .container{padding-left:var(--drawer-width)}:host([open][over]) .container{padding-left:0}:host([open][over]) .overlay{display:block}@media (max-width:var(--drawer-trigger-width,400px)){:host([open]) .container{padding-left:0}:host([open]) .overlay{display:block}}")}`,e([ot({type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkDrawer.prototype,"open",void 0),e([ot({type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkDrawer.prototype,"over",void 0),e([ot({type:String,attribute:"open-query"}),r("design:type",String)],t.TkDrawer.prototype,"openQuery",void 0),e([ot({type:String,attribute:"over-query"}),r("design:type",String)],t.TkDrawer.prototype,"overQuery",void 0),e([ot({type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkDrawer.prototype,"left",void 0),e([ot({type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkDrawer.prototype,"swipeable",void 0),e([st("div.drawer"),r("design:type",HTMLElement)],t.TkDrawer.prototype,"$drawer",void 0),t.TkDrawer=e([rt("tk-drawer")],t.TkDrawer);
463
+ for(let t in this.eventHandlers){let e=this.eventHandlers[t];for(let r=0;r<e.length;r++){let i=e[r];this.domElement.removeEventListener(t,i)}delete this.eventHandlers[t]}this.removePointerListeners(),this.removeTouchListeners()}}t.TkDrawer=class extends tt{constructor(){super(...arguments),this.open=!1,this.over=!1,this.right=!1,this.swipeable=!1}render(){return I`<div class="container fi"><slot name="drawer-container"></slot></div><div class="overlay" @click="${()=>this.open=!1}"></div><div class="drawer"><div class="drawer-header"><slot name="drawer-header"></slot></div><div class="drawer-content"><slot name="drawer-content"></slot></div><div class="drawer-footer"><slot name="drawer-footer"></slot></div></div>`}updated(t){if(t.has("open")&&this.open&&this.dispatchEvent(new Event("did-show")),t.has("open")&&!this.open&&this.dispatchEvent(new Event("did-close")),t.has("overQuery")&&this.overMediaQuery(),t.has("openQuery")&&window.matchMedia(this.openQuery).matches&&this.show(),t.has("swipeable")&&this.swipeable){var e={supportedDirections:bt,bubbles:!1},r=new At(this.$drawer,e);this.pointerListener=new Lt(this.$drawer,{DEBUG:!0,DEBUG_CONTACT:!0,DEBUG_GESTURES:!0,
464
+ // handleTouchEvents : false,
465
+ supportedGestures:[zt,r],bubbles:!1}),this.$drawer.addEventListener("tap",(t=>{const{x:e,y:r}=t.detail.live.srcEvent,i=this.shadowRoot?.elementFromPoint(e,r);i&&i.click()})),this.$drawer.addEventListener("panstart",(t=>{this.$drawer.style.transition="transform 0ms ease"})),this.$drawer.addEventListener("pan",(t=>{var e="translate3d("+(t.detail.global.deltaX>0?0:t.detail.global.deltaX)+"px, 0px, 0)";requestAnimationFrame((t=>{this.$drawer.style.transform=e}))})),this.$drawer.addEventListener("panend",(t=>{requestAnimationFrame((e=>{this.$drawer.style.transition="",this.$drawer.style.transform="",this.open=!(t.detail.global.deltaX<-50)}))}))}t.has("swipeable")&&!this.swipeable&&(this.pointerListener&&this.pointerListener.destroy(),this.pointerListener=null)}overMediaQuery(){this.mql&&this.mql.removeEventListener("change",this.overMediaQueryListener.bind(this)),this.mql=window.matchMedia(this.overQuery),this.mql.matches?this.setAttribute("over",""):this.removeAttribute("over"),this.mql.addEventListener("change",this.overMediaQueryListener.bind(this))}overMediaQueryListener(t){t.matches?this.setAttribute("over",""):this.removeAttribute("over")}hideIfOver(){(this.overQuery&&this.mql?.matches||this.over)&&(this.open=!1)}show(){this.open=!0}hide(){this.open=!1}toggle(){this.open=!this.open}},t.TkDrawer.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{display:block;height:100%;overflow:hidden;position:relative;width:100%}.drawer{background-color:var(--background,#f7f7f7);color:var(--foreground,#454545);display:flex;flex-direction:column;height:100%;overflow:scroll;position:absolute;top:0;touch-action:pan-y;transform:translateX(-100%);transition:transform cubic-bezier(.4,0,.2,1) var(--transition-duration-medium,.18s);width:var(--drawer-width,256px);will-change:transform;z-index:var(--drawer-z-index,200)}.drawer .drawer-content{flex:1;overflow:scroll}:host([right]) .drawer{right:0;transform:translateX(100%)}.overlay{background-color:#00000080;bottom:0;display:none;left:0;position:absolute;right:0;top:0;z-index:var(--drawer-overlay-z-index,200)}.container{background-color:var(--background,#f7f7f7);height:100%;overflow:scroll;transition:padding cubic-bezier(.4,0,.2,1) var(--transition-duration-slow,.25s)}:host([open]) .drawer{transform:none}:host([open]) .container{padding-left:var(--drawer-width)}:host([open][over]) .container{padding-left:0}:host([open][over]) .overlay{display:block}@media (max-width:var(--drawer-trigger-width,400px)){:host([open]) .container{padding-left:0}:host([open]) .overlay{display:block}}")}`,e([ot({type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkDrawer.prototype,"open",void 0),e([ot({type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkDrawer.prototype,"over",void 0),e([ot({type:String,attribute:"open-query"}),r("design:type",String)],t.TkDrawer.prototype,"openQuery",void 0),e([ot({type:String,attribute:"over-query"}),r("design:type",String)],t.TkDrawer.prototype,"overQuery",void 0),e([ot({type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkDrawer.prototype,"right",void 0),e([ot({type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkDrawer.prototype,"swipeable",void 0),e([lt("div.drawer"),r("design:type",HTMLElement)],t.TkDrawer.prototype,"$drawer",void 0),t.TkDrawer=e([rt("tk-drawer")],t.TkDrawer);
465
466
  /**
466
467
  * @license
467
468
  * Copyright 2017 Google LLC
468
469
  * SPDX-License-Identifier: BSD-3-Clause
469
470
  */
470
- const Mt=2;
471
+ const It=2;
471
472
  /**
472
473
  * @license
473
474
  * Copyright 2017 Google LLC
474
475
  * SPDX-License-Identifier: BSD-3-Clause
475
476
  */
476
- class Lt extends class{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,r){this._$Ct=t,this._$AM=e,this._$Ci=r}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}{constructor(t){if(super(t),this.it=U,t.type!==Mt)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===U||null==t)return this.ft=void 0,this.it=t;if(t===D)return t;if("string"!=typeof t)throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.it)return this.ft;this.it=t;const e=[t];return e.raw=e,this.ft={_$litType$:this.constructor.resultType,strings:e,values:[]}}}Lt.directiveName="unsafeHTML",Lt.resultType=1;const It=(t=>(...e)=>({_$litDirective$:t,values:e}))(Lt);t.TkIcon=class extends t.TkBox{constructor(){super(...arguments),this.svg=""}static get styles(){return[...t.TkBox.styles,l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--tk-icon-color,currentColor);display:inline-flex;height:1.5em;width:1.5em}:host svg{fill:var(--color);display:block;height:100%;width:100%}")}`]}render(){return I`${this.path?I`<svg viewBox="0 0 24 24"><path d="${this.path}"></path></svg>`:I`${It(this.svg)}`}`}updated(t){t.has("name")&&this.name&&this.loadIcon()}async loadIcon(){const t=this.library?document.querySelector(`tk-icons[library=${this.library}]`):document.querySelector("tk-icons");t&&(this.svg=await fetch(t.resolve(this.name)).then((t=>t.blob().then((e=>({contentType:t.headers.get("Content-Type"),raw:e}))))).then((t=>t.contentType&&/svg/.test(t.contentType)?t.raw.text():"")))}},e([ot(),r("design:type",String)],t.TkIcon.prototype,"name",void 0),e([ot(),r("design:type",String)],t.TkIcon.prototype,"library",void 0),e([ot(),r("design:type",String)],t.TkIcon.prototype,"path",void 0),e([ot(),r("design:type",String)],t.TkIcon.prototype,"svg",void 0),t.TkIcon=e([rt("tk-icon")],t.TkIcon),t.TkIcons=class extends tt{constructor(){super(...arguments),this.library="default"}firstUpdated(){window.document.body.appendChild(this)}},e([ot({attribute:!1}),r("design:type",Function)],t.TkIcons.prototype,"resolve",void 0),e([ot({reflect:!0}),r("design:type",String)],t.TkIcons.prototype,"library",void 0),t.TkIcons=e([rt("tk-icons")],t.TkIcons);t.TkListItem=class extends tt{constructor(){super(),this.href="",this.target=""}render(){return I`<slot name="before"></slot><div id="content"><slot></slot></div><slot name="after"></slot>${this.href?I`<a tabindex="-1" id="ahref" href="${this.href}" rel="noreferrer" aria-label="${this.ariaLabel}"></a>`:""}`}firstUpdated(){!this.ariaLabel&&this.innerText&&(this.ariaLabel=this.innerText)}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleClick.bind(this))}disconnectedCallback(){this.removeEventListener("click",this.handleClick),super.disconnectedCallback()}handleClick(t){this.querySelector("button")&&t.target==this.querySelector("button")||this.$ahref&&t.target==this.$ahref||this.href&&this.$ahref.click()}},t.TkListItem.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--text:var(--list-item-color,var(--foreground,#454545));--color:var(--list-item-bg,var(--background,#f7f7f7));align-items:center;background:var(--color);border-radius:var(--list-item-border-radius,var(--border-radius-large,.5rem));color:var(--text);display:flex;outline:none;overflow:hidden;padding:var(--spacing-m,1rem) var(--spacing-m,1rem);position:relative;text-align:left;transition:var(--list-item-transition,background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}:host([clickable]),:host([href]){user-select:none}:host([clickable]:not([active]):not([disabled])),:host([href]:not([active]):not([disabled])){cursor:pointer}:host(:focus),:host(:hover){--color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)));will-change:background,color}:host([active]:focus),:host([active]:hover){--text:var(--primary-darker,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*0.7)));--color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)))}:host([disabled]){--text:var(--shade-dark,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*0.85)));--color:var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%)));opacity:.4;pointer-events:none}:host([active]){--text:var(--primary-darker,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*0.7)));--color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)))}::slotted([slot=after]),::slotted([slot=before]){flex-shrink:0}::slotted([slot=before]){align-self:var(--list-item-left-align-self,center);margin:0 var(--spacing-m,1rem) 0 0}::slotted([slot=after]){align-self:var(--list-item-left-align-self,center);margin:0 0 0 var(--spacing-m,1rem)}#content{display:flex;flex-direction:column;flex-grow:1}")}`,e([ot({attribute:!0}),r("design:type",String)],t.TkListItem.prototype,"href",void 0),e([ot({attribute:!0}),r("design:type",String)],t.TkListItem.prototype,"target",void 0),e([ot({attribute:"aria-label"}),r("design:type",String)],t.TkListItem.prototype,"ariaLabel",void 0),e([st("#ahref"),r("design:type",HTMLAnchorElement)],t.TkListItem.prototype,"$ahref",void 0),t.TkListItem=e([rt("tk-list-item"),r("design:paramtypes",[])],t.TkListItem);t.TkLoading=class extends t.TkBox{constructor(){super(...arguments),this.circle=!1,this.indeterminate=!1}static get styles(){return[...t.TkBox.styles,l`${s('*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:currentColor}.circle{animation:rotator 3s linear infinite;display:inline-flex;height:2em;width:2em}.circle,.circle .path{transform-origin:center}.circle .path{stroke-dasharray:265;stroke-dashoffset:0;stroke:var(--color);animation:dash 3s ease-in-out infinite}@keyframes rotator{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes dash{0%{stroke-dashoffset:265}50%{stroke-dashoffset:65;transform:rotate(90deg)}to{stroke-dashoffset:265;transform:rotate(1turn)}}.line{background-color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)));height:.4em;overflow:hidden;position:relative}.line .indeterminate{background-color:var(--color)}.line .indeterminate:before{animation:indeterminate 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.line .indeterminate:after,.line .indeterminate:before{background-color:inherit;bottom:0;content:"";left:0;position:absolute;top:0;will-change:left,right}.line .indeterminate:after{animation:indeterminate-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation-delay:1.15s}@keyframes indeterminate{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes indeterminate-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}')}`]}render(){return I`${this.circle?I`<svg class="circle" viewBox="0 0 100 100"><circle class="path" fill="none" stroke-width="1em" stroke-linecap="butt" cx="50" cy="50" r="40"></circle></svg>`:I`<div class="line"><div class="indeterminate"></div></div>`}`}},e([ot({attribute:!0,type:Boolean}),r("design:type",Boolean)],t.TkLoading.prototype,"circle",void 0),e([ot({attribute:!0,type:Boolean}),r("design:type",Boolean)],t.TkLoading.prototype,"indeterminate",void 0),t.TkLoading=e([rt("tk-loading")],t.TkLoading);t.TkNavbar=class extends t.TkBox{static get styles(){return[...t.TkBox.styles,l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));--text:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));align-items:center;background:var(--color);color:var(--text);flex-direction:row;justify-content:space-between}:host([inverted]){--color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));--text:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)))}:host([fixed]){left:0;position:fixed;right:0;top:0;z-index:var(--navbar-z-index,100)}#left,#right,#title,::slotted([slot=left]),::slotted([slot=right]),::slotted([slot=title]){align-items:center;display:flex;height:100%}#title,::slotted([slot=title]){font-weight:var(--nav-title-font-weight,var(--font-weight-regular,500));margin:var(--nav-title-margin,0 0 0 var(--spacing-l,1.25rem))}")}`]}render(){return I`<div id="left"><slot name="left"></slot><slot name="title"></slot></div><div id="right"><slot name="right"></slot></div>`}},t.TkNavbar=e([rt("tk-navbar")],t.TkNavbar);t.TkTextfield=class extends tt{constructor(){super(...arguments),this._id=ct(),this.type="text",this.required=!1,this.disabled=!1,this.readonly=!1}set value(t){this.$input?(this.$input.value=t,this.refreshAttributes()):this.initialValue=t}get value(){return null!=this.$input?this.$input.value:this.initialValue||""}render(){return I`<div id="container"><slot id="before" name="before"></slot><div id="wrapper"><div id="label">${this.label}</div><slot id="slot"></slot><input id="${this._id}" @keydown="${this.handleChange.bind(this)}" @input="${this.handleChange.bind(this)}" @focusout="${this.handleChange.bind(this)}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" autocomplete="${ht(this.autocomplete)}" autocapitalize="${ht(this.autocapitalize)}" aria-label="${ht(this.label)}" type="${ht(this.type)}" name="${ht(this.name)}" list="${ht(this.list)}" pattern="${ht(this.pattern)}" minlength="${ht(this.minLength)}" maxlength="${ht(this.maxLength)}" min="${ht(this.min)}" max="${ht(this.max)}" tabindex="${this.disabled?-1:0}"></div><slot id="after" name="after"></slot></div>`}handleChange(){this.refreshAttributes()}firstUpdated(){this.$input=this.shadowRoot?.querySelector("input"),this.appendChild(this.$input),this.initialValue&&(this.value=this.initialValue)}refreshAttributes(){this.$input.value?this.setAttribute("dirty",""):this.removeAttribute("dirty"),this.$input.checkValidity()?this.removeAttribute("invalid"):this.setAttribute("invalid","")}focus(){this.$input.focus()}},t.TkTextfield.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}")}`,e([ot({type:String}),r("design:type",String),r("design:paramtypes",[String])],t.TkTextfield.prototype,"value",null),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkTextfield.prototype,"name",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextfield.prototype,"list",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextfield.prototype,"type",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkTextfield.prototype,"required",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkTextfield.prototype,"disabled",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkTextfield.prototype,"readonly",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextfield.prototype,"autocomplete",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextfield.prototype,"autocapitalize",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextfield.prototype,"pattern",void 0),e([ot({type:String,attribute:"value"}),r("design:type",String)],t.TkTextfield.prototype,"initialValue",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextfield.prototype,"label",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextfield.prototype,"min",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextfield.prototype,"max",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextfield.prototype,"minLength",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextfield.prototype,"maxLength",void 0),e([nt({passive:!0}),r("design:type",Function),r("design:paramtypes",[]),r("design:returntype",void 0)],t.TkTextfield.prototype,"handleChange",null),t.TkTextfield=e([rt("tk-textfield")],t.TkTextfield);var Dt,Ut,Nt;!function(t){t.show="show",t.force="force",t.confirm="confirm",t.input="input"}(Ut||(Ut={})),function(t){t.success="success",t.warning="warning",t.error="error",t.info="info",t.neutral="neutral"}(Nt||(Nt={})),t.TkNotie=Dt=class extends t.TkBox{constructor(t=""){super(),this.persistent=!0,this.open=!1,this.position="bottom",this.type=Ut.show,this.level=Nt.info,this.delay=3e3,this.animationDelay=300,this.buttonText="OK",this.confirmText="OK",this.cancelText="CANCEL",this.text=t}static get styles(){return[...t.TkBox.styles,l`${s(":host{bottom:0;display:none;font-size:1.6rem;left:0;margin:0;position:fixed;right:0;top:0}:host .overlay{background-color:#00000080;bottom:0;left:0;position:fixed;right:0;top:0;z-index:var(--notie-z-index,400)}:host .container{background-color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));bottom:0;box-shadow:10px 10px 10px 10px var(--shadow);color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));height:fit-content;left:0;position:fixed;right:0;text-align:center;transform:translateY(100%);transition:all .15s ease-in;z-index:calc(var(--notie-z-index, 400) + 1)}:host .container.info{background-color:#4d82d6}:host .container.error{background-color:#e1715b}:host .container.warning{background-color:#d6a14d}:host .container.success{background-color:#57bf57}:host .text{padding:.5em}:host .input{--input-font-size:$font-size-widescreen;background-color:var(--background);color:var(--foreground);text-align:center}:host .button{cursor:pointer;padding:.5em}:host .button.confirm,:host .button.forcer{background-color:#57bf57;color:#fff}:host .button.cancel{background-color:var(--error,#e1715b);color:var(--on-error,#fff)}@media screen and (max-width:900px){:host{font-size:1.4rem}}@media screen and (max-width:750px){:host{font-size:1.2rem}}@media screen and (max-width:400px){:host{font-size:1rem}}:host([position=top]) .container{bottom:inherit;position:fixed;top:0;transform:translateY(-100%)}:host([open]) .container{transform:translateY(0)}")}`]}render(){return I`<div class="overlay" @click="${()=>this.hide(!1)}"></div><tk-box class="container ${this.level}">${this.text?I`<tk-box class="text" @click="${()=>this.type==Ut.show?this.hide(!0):null}">${this.text}</tk-box>`:""} ${this.template?I`<tk-box class="template" @click="${()=>this.type==Ut.show?this.hide(!0):null}">${this.template}</tk-box>`:""} ${this.type==Ut.force?I`<tk-box @click="${()=>this.hide(!0)}" class="button force">${this.buttonText}</tk-box>`:""} ${this.type==Ut.input?I`<tk-textfield class="input"></tk-textfield>`:""} ${this.type==Ut.confirm||this.type==Ut.input?I`<tk-box direction="row"><tk-box justify="center" align-items="center" flex="grow" @click="${()=>this.hide(!0)}" class="button confirm">${this.confirmText}</tk-box><tk-box justify="center" align-items="center" flex="grow" @click="${()=>this.hide(!1)}" class="button confirm cancel">${this.cancelText}</tk-box></tk-box>`:""}</tk-box>`}show(){return new Promise((t=>{this.resolve=t,this.style.setProperty("display","flex"),setTimeout((()=>this.open=!0)),this.dispatchEvent(new Event("didShow")),this.$input&&setTimeout((()=>this.$input.focus())),this.type==Ut.show&&setTimeout((()=>this.hide(!1)),this.delay)}))}hide(t){t&&this.type===Ut.input&&(t=this.$input.value),t||this.type!==Ut.input||(t=null),this.$input&&(this.$input.value=""),this.$container.addEventListener("transitionend",(()=>{this.dispatchEvent(new Event("didHide")),this.resolve(t),this.persistent||this.remove()}),{once:!0}),this.open=!1}static show(t){return this.getNotie(t,Ut.show).show()}static force(t){const e=this.getNotie(t,Ut.force);return t.buttonText&&(e.buttonText=t.buttonText),e.show()}static confirm(t){const e=this.getNotie(t,Ut.confirm);return t.confirmText&&(e.confirmText=t.confirmText),t.cancelText&&(e.cancelText=t.cancelText),e.show()}static input(t){const e=this.getNotie(t,Ut.input);return t.password&&(e.$input.type="password"),t.confirmText&&(e.confirmText=t.confirmText),t.cancelText&&(e.cancelText=t.cancelText),e.show()}static getNotie(t,e){const r=new Dt(t.text);return r.persistent=!1,r.type=e,r.delay=t.delay??999999999,t.template&&(r.template=t.template),t.position&&(r.position=t.position),t.background&&r.$container&&r.$container.setAttribute("background-color",t.background),t.color&&r.$container&&r.$container.setAttribute("color",t.color),t.container?t.container.shadowRoot?.appendChild(r):window.document.body.appendChild(r),t.zIndex&&r.style.setProperty("z-index",t.zIndex.toString()),r}},e([function(t){return ot({...t,state:!0})}(),r("design:type",Boolean)],t.TkNotie.prototype,"persistent",void 0),e([ot({type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkNotie.prototype,"open",void 0),e([ot({reflect:!0}),r("design:type",Object)],t.TkNotie.prototype,"position",void 0),e([ot({type:String}),r("design:type",String)],t.TkNotie.prototype,"type",void 0),e([ot({type:String}),r("design:type",String)],t.TkNotie.prototype,"level",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkNotie.prototype,"delay",void 0),e([ot(),r("design:type",String)],t.TkNotie.prototype,"text",void 0),e([ot(),r("design:type",String)],t.TkNotie.prototype,"buttonText",void 0),e([ot(),r("design:type",String)],t.TkNotie.prototype,"confirmText",void 0),e([ot(),r("design:type",String)],t.TkNotie.prototype,"cancelText",void 0),e([ot({type:Object}),r("design:type",Object)],t.TkNotie.prototype,"template",void 0),e([st("tk-textfield"),r("design:type",t.TkTextfield)],t.TkNotie.prototype,"$input",void 0),e([st(".container"),r("design:type",HTMLElement)],t.TkNotie.prototype,"$container",void 0),t.TkNotie=Dt=e([rt("tk-notie"),r("design:paramtypes",[String])],t.TkNotie);t.TkPages=class extends tt{constructor(){super(...arguments),this._page="",this.selected="",this.handleScroll=!1,this.scrollHistory={}}set page(t){let e=this._page;if(this._page=t,e&&this.handleScroll){if(this.querySelector(`[page=${e}]`)){const t=document.scrollingElement||document.documentElement;this.scrollHistory[e]=t.scrollTop}}this.requestUpdate("page",e)}get page(){return this._page}render(){return I`<slot></slot>`}updated(t){t.has("page")&&this.querySelectorAll(":scope > *").forEach((t=>{const e=t.getAttribute("page")??"default",r=document.scrollingElement||document.documentElement;e==this.page?(t.removeAttribute("hidden"),""!=this.selected&&t.setAttribute(this.selected,""),this.handleScroll&&!t.hasAttribute("no-scroll")&&(r.scrollTop=this.scrollHistory[e]?this.scrollHistory[e]:0)):(t.setAttribute("hidden",""),""!=this.selected&&t.removeAttribute(this.selected))}))}},t.TkPages.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}")}`,e([ot({attribute:"page",type:String}),r("design:type",String),r("design:paramtypes",[String])],t.TkPages.prototype,"page",null),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkPages.prototype,"selected",void 0),e([ot({attribute:"handle-scroll",type:Boolean}),r("design:type",Boolean)],t.TkPages.prototype,"handleScroll",void 0),t.TkPages=e([rt("tk-pages")],t.TkPages);t.TkProgress=class extends tt{constructor(){super(...arguments),this.circle=!1,this.indeterminate=!1,this.value=0,this.buffer=0}render(){return I`${this.circle?I`<svg class="spinner" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle class="path" fill="none" stroke-width="10" stroke-linecap="butt" cx="50" cy="50" r="40"></circle></svg>`:I`${this.indeterminate?I`<div class="progress-materializecss"><div class="indeterminate"></div></div>`:I`<progress class="progress" max="100" value="50"></progress>`}`}`}},t.TkProgress.styles=l`${s('*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--primary)}:host([accent]){--color:var(--accent)}:host([error]){--color:var(--error)}.spinner{animation:rotator 3s linear infinite;height:1em;transform-origin:center;width:1em}.spinner .path{stroke-dasharray:265;stroke-dashoffset:0;stroke:var(--color);animation:dash 3s ease-in-out infinite;transform-origin:center}@keyframes rotator{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes dash{0%{stroke-dashoffset:265}50%{stroke-dashoffset:65;transform:rotate(90deg)}to{stroke-dashoffset:265;transform:rotate(1turn)}}.progress-materializecss{background-color:var(--shade-lighter);display:block;height:.3em;margin:5px 0;overflow:hidden;position:relative}.progress-materializecss .indeterminate{background-color:var(--primary)}.progress-materializecss .indeterminate:before{animation:indeterminate 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.progress-materializecss .indeterminate:after,.progress-materializecss .indeterminate:before{background-color:inherit;bottom:0;content:"";left:0;position:absolute;top:0;will-change:left,right}.progress-materializecss .indeterminate:after{animation:indeterminate-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation-delay:1.15s}@keyframes indeterminate{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes indeterminate-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}')}`,e([ot({attribute:!0,type:Boolean}),r("design:type",Boolean)],t.TkProgress.prototype,"circle",void 0),e([ot({attribute:!0,type:Boolean}),r("design:type",Boolean)],t.TkProgress.prototype,"indeterminate",void 0),e([ot({attribute:!0,type:Number}),r("design:type",Number)],t.TkProgress.prototype,"value",void 0),e([ot({attribute:!0,type:Number}),r("design:type",Number)],t.TkProgress.prototype,"buffer",void 0),t.TkProgress=e([rt("tk-progress")],t.TkProgress);t.TkRadio=class extends tt{constructor(){super(...arguments),this.checked=!1,this.required=!1,this.disabled=!1,this.readonly=!1}render(){return I`<tk-box direction="row" align-items="center"><div tabindex="0" class="radio"><div id="dot"></div></div><span class="label"><slot></slot></span></tk-box><input id="${ct()}" slot="none" style="display:none" type="radio" ?checked="${this.checked}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" value="${ht(this.value)}" name="${ht(this.name)}" aria-hidden="true" tabindex="-1">`}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.onKeyDown.bind(this))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.onKeyDown)}firstUpdated(){this.appendChild(this.$input)}onKeyDown(t){"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),t.stopPropagation(),this.click())}handleClick(){this.checked=!this.checked,this.checked&&this.name&&this.getRootNode().querySelectorAll(`tk-radio[name="${this.name}"]`).forEach((t=>t!=this?t.checked=!1:null)),setTimeout((()=>this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))))}},t.TkRadio.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_radio-bg:var(--radio-bg,#0000);--_radio-color:var(--radio-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));display:inline-flex}:host .radio{align-items:center;background:var(--_radio-bg);border:var(--radio-border-config,.125rem solid) currentColor;border-radius:var(--radio-border-radius,100%);color:var(--_radio-color);display:inline-flex;height:var(--radio-size,1.25rem);justify-content:center;outline:none;position:relative;transition:var(--radio-transition,background var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),border-color var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));-webkit-user-select:none;user-select:none;width:var(--radio-size,1.25rem)}:host .label{font-size:1.1em;margin-left:10px}:host(:not([disabled])){cursor:pointer}:host([checked]){--_radio-bg:var(--radio-bg-checked,#0000);--_radio-color:var(--radio-color-checked,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([checked]) #dot{transform:scale(1)}:host(:focus),:host(:hover){will-change:border,background}:host(:focus) #dot,:host(:hover) #dot{will-change:transform,background}:host([disabled]){--_radio-bg:var(--radio-bg-disabled,#0000);--_radio-color:var(--radio-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));pointer-events:none}:host([disabled][checked]){--_radio-bg:var(--radio-bg-disabled-checked,#0000);--_radio-color:var(--radio-color-disabled-checked,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}#dot{background:currentColor;border-radius:var(--radio-dot-border-radius,100%);height:var(--radio-dot-size,.625rem);transform:scale(0);transition:var(--radio-dot-transition,transform var(--transition-duration-medium,.18s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--radio-dot-size,.625rem)}#ripple{transform:var(--radio-ripple-transform,translate(-50%,-50%) scale(1.8))}")}`,e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkRadio.prototype,"name",void 0),e([ot({attribute:!0,type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkRadio.prototype,"checked",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkRadio.prototype,"required",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkRadio.prototype,"disabled",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkRadio.prototype,"readonly",void 0),e([ot({type:String,reflect:!0}),r("design:type",String)],t.TkRadio.prototype,"value",void 0),e([st("input"),r("design:type",HTMLInputElement)],t.TkRadio.prototype,"$input",void 0),t.TkRadio=e([rt("tk-radio")],t.TkRadio);t.TkSelect=class extends tt{constructor(){super(...arguments),this.type="text",this.required=!1,this.disabled=!1,this.readonly=!1}set value(t){this.$select?(this.$select.value=t,this.refreshAttributes()):this.initialValue=t}get value(){return null!=this.$select?this.$select.value:this.initialValue||""}render(){return I`<div id="container"><slot id="before" name="before"></slot><div id="wrapper"><div id="label">${this.label}</div><slot id="slot"></slot><select id="${ct()}" @keydown="${this.handleChange.bind(this)}" @input="${this.handleChange.bind(this)}" @focusout="${this.handleChange.bind(this)}" @change="${this.handleChange.bind(this)}" .value="${this.initialValue}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" name="${ht(this.name)}" autocomplete="${ht(this.autocomplete)}" tabindex="${this.disabled?-1:0}"></select> <svg id="arrow" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 25" preserveAspectRatio="none"><polygon points="0,0 50,0 25,25"/></svg></div><slot id="after" name="after"></slot></div>`}handleChange(){this.refreshAttributes()}firstUpdated(){this.$select=this.shadowRoot?.querySelector("select"),this.appendChild(this.$select);this.querySelectorAll("option").forEach((t=>this.$select.appendChild(t))),this.initialValue&&(this.value=this.initialValue)}refreshAttributes(){this.$select.value?this.setAttribute("dirty",""):this.removeAttribute("dirty"),this.$select.checkValidity()?this.removeAttribute("invalid"):this.setAttribute("invalid",""),setTimeout((()=>this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))))}},t.TkSelect.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}#arrow{fill:var(--_input-state-color);height:8px;position:absolute;right:0;top:50%;transform:translate(-100%,-50%);z-index:-1}::slotted(option){display:none}:host(:not([dirty])) ::slotted(select){opacity:0}")}`,e([ot({type:String}),r("design:type",String),r("design:paramtypes",[String])],t.TkSelect.prototype,"value",null),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkSelect.prototype,"name",void 0),e([ot({type:String}),r("design:type",String)],t.TkSelect.prototype,"list",void 0),e([ot({type:String}),r("design:type",String)],t.TkSelect.prototype,"type",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSelect.prototype,"required",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSelect.prototype,"disabled",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSelect.prototype,"readonly",void 0),e([ot({type:String}),r("design:type",String)],t.TkSelect.prototype,"autocomplete",void 0),e([ot({type:String}),r("design:type",String)],t.TkSelect.prototype,"pattern",void 0),e([ot({type:String,attribute:"value"}),r("design:type",String)],t.TkSelect.prototype,"initialValue",void 0),e([ot({type:String}),r("design:type",String)],t.TkSelect.prototype,"label",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSelect.prototype,"min",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSelect.prototype,"max",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSelect.prototype,"minLength",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSelect.prototype,"maxLength",void 0),e([nt({passive:!0}),r("design:type",Function),r("design:paramtypes",[]),r("design:returntype",void 0)],t.TkSelect.prototype,"handleChange",null),t.TkSelect=e([rt("tk-select")],t.TkSelect);t.TkSlider=class extends tt{constructor(){super(...arguments),this.required=!1,this.disabled=!1,this.readonly=!1,this.thumbLabel=!1,this.thumbLabelPersist=!1,this.min=0,this.value=this.min,this.max=100}render(){return I`<div id="container"><slot id="before" name="before"></slot><div id="wrapper"><div id="label">${this.label}</div><div id="slot-wrapper"><input @input="${this.handleChange.bind(this)}" id="slider" type="range" .value="${this.value.toString()}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" aria-label="${ht(this.label)}" name="${ht(this.name)}" autocomplete="${ht(this.autocomplete)}" min="${ht(this.min)}" max="${ht(this.max)}" step="${ht(this.step)}" tabindex="0"> ${this.thumbLabel||this.thumbLabelPersist?I`<div id="thumb-container"><div id="thumb-label"><slot name="thumb-label">${this.value}</slot></div></div>`:""}</div><input id="${ct()}" class="hidden-input" type="hidden" value="${this.value.toString()}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" aria-label="${ht(this.label)}" name="${ht(this.name)}"></div><slot id="after" name="after"></slot></div>`}handleChange(t){t.target.checkValidity()?this.removeAttribute("invalid"):this.setAttribute("invalid",""),this.value=t.target.value.toString(),setTimeout((()=>this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))))}firstUpdated(){this.appendChild(this.$input),this.setAttribute("dirty","")}updated(){console.log("slider updated",this.$slider.valueAsNumber),requestAnimationFrame((()=>{this.style.setProperty("--_perc",((Number(this.value)-this.min)/(this.max-this.min)).toString())}))}},t.TkSlider.styles=l`${s('*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host{--_perc:0;--_slider-track-bg:var(--slider-bg,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_slider-track-bg-active:var(--slider-bg-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));--_slider-thumb-bg:var(--slider-thumb-bg,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));--_slider-thumb-border:var(--slider-thumb-bg,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([disabled]){--_slider-track-bg:var(--slider-bg-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_slider-track-bg-active:var(--slider-bg-active-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_slider-thumb-bg:var(--slider-thumb-bg-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_slider-thumb-border:var(--slider-thumb-bg,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host([thumblabel-persist]) #container,:host([thumblabel]) #container{padding-top:33px}#container{border:none;overflow:visible}#slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:linear-gradient(90deg,var(--_slider-track-bg-active) 0,var(--_slider-track-bg-active) calc(var(--_perc)*100%),var(--_slider-track-bg) calc(var(--_perc)*100%),var(--_slider-track-bg));border:none;border-radius:0;box-sizing:border-box;cursor:grab;height:var(--slider-height,.3125rem);margin:0;outline:none;top:calc(var(--slider-height, .3125rem)*-1/2)}#slider,#thumb-container{position:relative;width:100%}#thumb-label{--_thumb-label-transform-y:0.625rem;-webkit-text-fill-color:var(--slider-thumb-label-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));align-items:center;border-radius:var(--slider-thumb-label-border-radius,100%);bottom:calc(100% + var(--slider-thumb-size, .75rem) + var(--slider-height, .3125rem) + var(--slider-thumb-space, .75rem));color:var(--slider-thumb-label-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));display:flex;font-size:var(--slider-thumb-label-font-size,.75rem);height:var(--slider-thumb-label-size,1.875rem);justify-content:center;left:calc(var(--_perc)*100% - var(--slider-thumb-size, 1.2rem)*var(--_perc));opacity:0;pointer-events:none;text-overflow:ellipsis;transform:translate(calc(-50% + var(--slider-thumb-size, 1.2rem)/2),var(--_thumb-label-transform-y));transition:var(--slider-thumb-label-transition,opacity var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-label-size,1.875rem)}#thumb-label,#thumb-label:before{background:var(--slider-thumb-label-bg,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));position:absolute}#thumb-label:before{border-radius:0 50% 50% 50%;content:"";height:100%;left:0;top:0;transform:rotate(225deg);width:100%;z-index:-1}#slider:focus+#thumb-container #thumb-label,:host([thumblabel-persist]) #thumb-label,:host:focus #thumb-label{--_thumb-label-transform-y:0;opacity:1}#slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--_slider-thumb-bg);border:4px solid var(--_slider-thumb-border);border-radius:var(--slider-thumb-border-radius,100%);box-shadow:0 0 0 0 var(--slider-thumb-focus-ring-bg,#00000015);cursor:grab;height:var(--slider-thumb-size,1.2rem);position:relative;-webkit-transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-size,1.2rem)}#slider::-moz-range-thumb{-moz-appearance:none;appearance:none;background:var(--_slider-thumb-bg);border:none;border-radius:var(--slider-thumb-border-radius,100%);box-shadow:0 0 0 0 var(--slider-thumb-focus-ring-bg,#00000015);cursor:grab;height:var(--slider-thumb-size,1.2rem);position:relative;-moz-transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-size,1.2rem)}#slider:focus::-webkit-slider-thumb{box-shadow:0 0 0 var(--slider-thumb-focus-ring-size,.75rem) var(--slider-thumb-focus-ring-bg,#00000015);transform:var(--slider-thumb-transform-focus,scale(1.2))}#slider:focus::-moz-range-thumb{box-shadow:0 0 0 var(--slider-thumb-focus-ring-size,.75rem) var(--slider-thumb-focus-ring-bg,#00000015);transform:var(--slider-thumb-transform-focus,scale(1.2))}')}`,e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkSlider.prototype,"name",void 0),e([ot({type:String}),r("design:type",String)],t.TkSlider.prototype,"list",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSlider.prototype,"required",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSlider.prototype,"disabled",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSlider.prototype,"readonly",void 0),e([ot({type:String}),r("design:type",String)],t.TkSlider.prototype,"autocomplete",void 0),e([ot({type:Boolean,attribute:"thumblabel"}),r("design:type",Boolean)],t.TkSlider.prototype,"thumbLabel",void 0),e([ot({type:Boolean,attribute:"thumblabel-persist"}),r("design:type",Boolean)],t.TkSlider.prototype,"thumbLabelPersist",void 0),e([ot({type:String}),r("design:type",String)],t.TkSlider.prototype,"label",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSlider.prototype,"min",void 0),e([ot({type:Number,reflect:!0}),r("design:type",Number)],t.TkSlider.prototype,"value",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSlider.prototype,"max",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSlider.prototype,"step",void 0),e([st("#slider"),r("design:type",HTMLInputElement)],t.TkSlider.prototype,"$slider",void 0),e([st(".hidden-input"),r("design:type",HTMLInputElement)],t.TkSlider.prototype,"$input",void 0),t.TkSlider=e([rt("tk-slider")],t.TkSlider);t.TkSwitch=class extends tt{constructor(){super(...arguments),this.checked=!1,this.required=!1,this.disabled=!1,this.readonly=!1}render(){return I`<tk-box direction="row" align-items="center"><span class="switch"><span id="knob"></span> </span><span class="label"><slot></slot></span></tk-box><input id="${ct()}" slot="none" style="display:none" type="radio" ?checked="${this.checked}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" value="${ht(this.value)}" name="${ht(this.name)}" aria-hidden="true" tabindex="-1">`}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.onKeyDown.bind(this))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.onKeyDown)}firstUpdated(){this.appendChild(this.$input)}onKeyDown(t){"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),t.stopPropagation(),this.click())}handleClick(){this.checked=!this.checked,this.checked&&this.name&&this.getRootNode().querySelectorAll(`tk-radio[name="${this.name}"]`).forEach((t=>t!=this?t.checked=!1:null)),setTimeout((()=>this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))))}},t.TkSwitch.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_switch-bg:var(--switch-bg,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_switch-color:var(--switch-color,var(--background,#f7f7f7))}:host .switch{align-items:center;background:var(--_switch-bg);border-radius:var(--switch-border-radius,.75rem);color:var(--_switch-color);display:inline-flex;height:var(--switch-height,.875rem);outline:none;position:relative;transition:var(--switch-transition,background var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));-webkit-user-select:none;user-select:none;width:var(--switch-width,2.125rem)}:host .switch #knob{background:currentColor;border-radius:var(--switch-knob-border-radius,100%);box-shadow:var(--switch-knob-elevation,var(--elevation-3,0 4px 8px var(--shadow)));height:var(--switch-knob-size,1.25rem);position:absolute;transition:var(--switch-knob-transition,background var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--switch-knob-size,1.25rem)}:host .label{font-size:1.1em;margin-left:10px}:host(:not([disabled])){cursor:pointer}:host([checked]){--_switch-bg:var(--switch-bg-checked,var(--primary-lighter,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*1.3))));--_switch-color:var(--switch-color-checked,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([checked]) .switch #knob{transform:translateX(calc(var(--switch-width, 2.125rem) - 100%))}:host(:focus),:host(:hover){will-change:background-color}:host([disabled]){--_switch-bg:var(--switch-bg-disabled,hsl(var(--shade-200,var(--shade-hue,200),var(--shade-saturation,4%),var(--shade-lightness,85%))));--_switch-color:var(\n \t--switch-color-disabled,hsl(var(--shade-300,var(--shade-hue,200),var(--shade-saturation,4%),var(--shade-lightness,75%)))\n );pointer-events:none}:host([disabled][checked]){--_switch-bg:var(\n \t--switch-bg-disabled-checked,hsla(var(--primary-400,var(--primary-hue,224),var(--primary-saturation,42%),var(--primary-lightness,52%)),0.1)\n );--_switch-color:var(\n \t--switch-color-disabled-checked,hsla(var(--primary-400,var(--primary-hue,224),var(--primary-saturation,42%),var(--primary-lightness,52%)),0.4)\n )}")}`,e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkSwitch.prototype,"name",void 0),e([ot({attribute:!0,type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkSwitch.prototype,"checked",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSwitch.prototype,"required",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSwitch.prototype,"disabled",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSwitch.prototype,"readonly",void 0),e([ot({type:String,reflect:!0}),r("design:type",String)],t.TkSwitch.prototype,"value",void 0),e([st("input"),r("design:type",HTMLInputElement)],t.TkSwitch.prototype,"$input",void 0),t.TkSwitch=e([rt("tk-switch")],t.TkSwitch);t.TkTabGroup=class extends tt{constructor(){super(),this.circle=!1,this.observe="",this.selected=""}render(){return I`<div class="tabs"><slot @click="${t=>this.clickOnTab(t.target)}" @slotchange="${()=>this.updateUnderline()}"></slot></div>${this.circle?I`<div class="circle"></div>`:I`<div class="underline"></div>`}`}firstUpdated(){if(IntersectionObserver){new IntersectionObserver(this.updateUnderline.bind(this)).observe(this)}else this.updateUnderline.bind(this)}updated(t){t.has("selected")&&(this.querySelectorAll("*").forEach((t=>t.removeAttribute("selected"))),this.querySelector(`[tab="${this.selected}"]`)?.setAttribute("selected","")),t.has("observe")&&(this.querySelector(`[tab="${this.selected}"]`)?.focus(),this.updateUnderline())}clickOnTab(t){this.querySelectorAll("*").forEach((t=>t.removeAttribute("selected"))),t.setAttribute("selected",""),this.updateUnderline(),this.dispatchEvent(new CustomEvent("change",{detail:t.getAttribute("tab"),composed:!0,bubbles:!0}))}updateUnderline(){const t=this.querySelector("[selected]");t&&setTimeout((()=>{this.circle?this.$circle.style.transform=`translate(${t.offsetLeft+t.clientWidth/2-this.$circle.clientWidth/2}px, -${this.$circle.clientWidth/2}px)`:(this.$underline.style.width=t.clientWidth+"px",this.$underline.style.transform=`translateX(${t.offsetLeft}px)`)}));
477
+ class Dt extends class{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,r){this._$Ct=t,this._$AM=e,this._$Ci=r}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}{constructor(t){if(super(t),this.it=U,t.type!==It)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===U||null==t)return this.ft=void 0,this.it=t;if(t===D)return t;if("string"!=typeof t)throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.it)return this.ft;this.it=t;const e=[t];return e.raw=e,this.ft={_$litType$:this.constructor.resultType,strings:e,values:[]}}}Dt.directiveName="unsafeHTML",Dt.resultType=1;const Ut=(t=>(...e)=>({_$litDirective$:t,values:e}))(Dt);t.TkIcon=class extends t.TkBox{constructor(){super(...arguments),this.svg=""}static get styles(){return[...t.TkBox.styles,l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--tk-icon-color,currentColor);display:inline-flex;height:1.5em;width:1.5em}:host svg{fill:var(--color);display:block;height:100%;width:100%}")}`]}render(){return I`${this.path?I`<svg viewBox="0 0 24 24"><path d="${this.path}"></path></svg>`:I`${Ut(this.svg)}`}`}updated(t){t.has("name")&&this.name&&this.loadIcon()}async loadIcon(){const t=this.library?document.querySelector(`tk-icons[library=${this.library}]`):document.querySelector("tk-icons");t&&(this.svg=await fetch(t.resolve(this.name)).then((t=>t.blob().then((e=>({contentType:t.headers.get("Content-Type"),raw:e}))))).then((t=>t.contentType&&/svg/.test(t.contentType)?t.raw.text():"")))}},e([ot(),r("design:type",String)],t.TkIcon.prototype,"name",void 0),e([ot(),r("design:type",String)],t.TkIcon.prototype,"library",void 0),e([ot(),r("design:type",String)],t.TkIcon.prototype,"path",void 0),e([ot(),r("design:type",String)],t.TkIcon.prototype,"svg",void 0),t.TkIcon=e([rt("tk-icon")],t.TkIcon),t.TkIcons=class extends tt{constructor(){super(...arguments),this.library="default"}firstUpdated(){window.document.body.appendChild(this)}},e([ot({attribute:!1}),r("design:type",Function)],t.TkIcons.prototype,"resolve",void 0),e([ot({reflect:!0}),r("design:type",String)],t.TkIcons.prototype,"library",void 0),t.TkIcons=e([rt("tk-icons")],t.TkIcons);t.TkListItem=class extends tt{constructor(){super(),this.href="",this.target=""}render(){return I`<slot name="before"></slot><div id="content"><slot></slot></div><slot name="after"></slot>${this.href?I`<a tabindex="-1" id="ahref" href="${this.href}" rel="noreferrer" aria-label="${this.ariaLabel}"></a>`:""}`}firstUpdated(){!this.ariaLabel&&this.innerText&&(this.ariaLabel=this.innerText)}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleClick.bind(this))}disconnectedCallback(){this.removeEventListener("click",this.handleClick),super.disconnectedCallback()}handleClick(t){this.querySelector("button")&&t.target==this.querySelector("button")||this.$ahref&&t.target==this.$ahref||this.href&&this.$ahref.click()}},t.TkListItem.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--text:var(--list-item-color,var(--foreground,#454545));--color:var(--list-item-bg,var(--background,#f7f7f7));align-items:center;background:var(--color);border-radius:var(--list-item-border-radius,var(--border-radius-large,.5rem));color:var(--text);display:flex;outline:none;overflow:hidden;padding:var(--spacing-m,1rem) var(--spacing-m,1rem);position:relative;text-align:left;transition:var(--list-item-transition,background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}:host([clickable]),:host([href]){user-select:none}:host([clickable]:not([active]):not([disabled])),:host([href]:not([active]):not([disabled])){cursor:pointer}:host(:focus),:host(:hover){--color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)));will-change:background,color}:host([active]:focus),:host([active]:hover){--text:var(--primary-darker,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*0.7)));--color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)))}:host([disabled]){--text:var(--shade-dark,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*0.85)));--color:var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%)));opacity:.4;pointer-events:none}:host([active]){--text:var(--primary-darker,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*0.7)));--color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)))}::slotted([slot=after]),::slotted([slot=before]){flex-shrink:0}::slotted([slot=before]){align-self:var(--list-item-left-align-self,center);margin:0 var(--spacing-m,1rem) 0 0}::slotted([slot=after]){align-self:var(--list-item-left-align-self,center);margin:0 0 0 var(--spacing-m,1rem)}#content{display:flex;flex-direction:column;flex-grow:1}")}`,e([ot({attribute:!0}),r("design:type",String)],t.TkListItem.prototype,"href",void 0),e([ot({attribute:!0}),r("design:type",String)],t.TkListItem.prototype,"target",void 0),e([ot({attribute:"aria-label"}),r("design:type",String)],t.TkListItem.prototype,"ariaLabel",void 0),e([lt("#ahref"),r("design:type",HTMLAnchorElement)],t.TkListItem.prototype,"$ahref",void 0),t.TkListItem=e([rt("tk-list-item"),r("design:paramtypes",[])],t.TkListItem);t.TkLoading=class extends t.TkBox{constructor(){super(...arguments),this.circle=!1,this.indeterminate=!1}static get styles(){return[...t.TkBox.styles,l`${s('*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:currentColor}.circle{animation:rotator 3s linear infinite;display:inline-flex;height:2em;width:2em}.circle,.circle .path{transform-origin:center}.circle .path{stroke-dasharray:265;stroke-dashoffset:0;stroke:var(--color);animation:dash 3s ease-in-out infinite}@keyframes rotator{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes dash{0%{stroke-dashoffset:265}50%{stroke-dashoffset:65;transform:rotate(90deg)}to{stroke-dashoffset:265;transform:rotate(1turn)}}.line{background-color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)));height:.4em;overflow:hidden;position:relative}.line .indeterminate{background-color:var(--color)}.line .indeterminate:before{animation:indeterminate 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.line .indeterminate:after,.line .indeterminate:before{background-color:inherit;bottom:0;content:"";left:0;position:absolute;top:0;will-change:left,right}.line .indeterminate:after{animation:indeterminate-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation-delay:1.15s}@keyframes indeterminate{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes indeterminate-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}')}`]}render(){return I`${this.circle?I`<svg class="circle" viewBox="0 0 100 100"><circle class="path" fill="none" stroke-width="1em" stroke-linecap="butt" cx="50" cy="50" r="40"></circle></svg>`:I`<div class="line"><div class="indeterminate"></div></div>`}`}},e([ot({attribute:!0,type:Boolean}),r("design:type",Boolean)],t.TkLoading.prototype,"circle",void 0),e([ot({attribute:!0,type:Boolean}),r("design:type",Boolean)],t.TkLoading.prototype,"indeterminate",void 0),t.TkLoading=e([rt("tk-loading")],t.TkLoading);t.TkNavbar=class extends t.TkBox{static get styles(){return[...t.TkBox.styles,l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));--text:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));align-items:center;background:var(--color);color:var(--text);flex-direction:row;justify-content:space-between}:host([inverted]){--color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));--text:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)))}:host([fixed]){left:0;position:fixed;right:0;top:0;z-index:var(--navbar-z-index,100)}#left,#right,#title,::slotted([slot=left]),::slotted([slot=right]),::slotted([slot=title]){align-items:center;display:flex;height:100%}#title,::slotted([slot=title]){font-weight:var(--nav-title-font-weight,var(--font-weight-regular,500));margin:var(--nav-title-margin,0 0 0 var(--spacing-l,1.25rem))}")}`]}render(){return I`<div id="left"><slot name="left"></slot><slot name="title"></slot></div><div id="right"><slot name="right"></slot></div>`}},t.TkNavbar=e([rt("tk-navbar")],t.TkNavbar);t.TkTextfield=class extends tt{constructor(){super(...arguments),this._id=pt(),this.type="text",this.required=!1,this.disabled=!1,this.readonly=!1}set value(t){this.$input?(this.$input.value=t,this.refreshAttributes()):this.initialValue=t}get value(){return null!=this.$input?this.$input.value:this.initialValue||""}render(){return I`<div id="container"><slot id="before" name="before"></slot><div id="wrapper"><div id="label">${this.label}</div><slot id="slot"></slot><input id="${this._id}" @keydown="${this.handleChange.bind(this)}" @input="${this.handleChange.bind(this)}" @focusout="${this.handleChange.bind(this)}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" autocomplete="${dt(this.autocomplete)}" autocapitalize="${dt(this.autocapitalize)}" aria-label="${dt(this.label)}" type="${dt(this.type)}" name="${dt(this.name)}" list="${dt(this.list)}" pattern="${dt(this.pattern)}" minlength="${dt(this.minLength)}" maxlength="${dt(this.maxLength)}" min="${dt(this.min)}" max="${dt(this.max)}" tabindex="${this.disabled?-1:0}"></div><slot id="after" name="after"></slot></div>`}handleChange(){this.refreshAttributes()}firstUpdated(){this.$input=this.shadowRoot?.querySelector("input"),this.appendChild(this.$input),this.initialValue&&(this.value=this.initialValue)}refreshAttributes(){this.$input.value?this.setAttribute("dirty",""):this.removeAttribute("dirty"),this.$input.checkValidity()?this.removeAttribute("invalid"):this.setAttribute("invalid","")}focus(){this.$input.focus()}},t.TkTextfield.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}")}`,e([ot({type:String}),r("design:type",String),r("design:paramtypes",[String])],t.TkTextfield.prototype,"value",null),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkTextfield.prototype,"name",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextfield.prototype,"list",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextfield.prototype,"type",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkTextfield.prototype,"required",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkTextfield.prototype,"disabled",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkTextfield.prototype,"readonly",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextfield.prototype,"autocomplete",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextfield.prototype,"autocapitalize",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextfield.prototype,"pattern",void 0),e([at(),r("design:type",String)],t.TkTextfield.prototype,"initialValue",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextfield.prototype,"label",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextfield.prototype,"min",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextfield.prototype,"max",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextfield.prototype,"minLength",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextfield.prototype,"maxLength",void 0),e([st({passive:!0}),r("design:type",Function),r("design:paramtypes",[]),r("design:returntype",void 0)],t.TkTextfield.prototype,"handleChange",null),t.TkTextfield=e([rt("tk-textfield")],t.TkTextfield);var Nt,Ht,Rt;!function(t){t.show="show",t.force="force",t.confirm="confirm",t.input="input"}(Ht||(Ht={})),function(t){t.success="success",t.warning="warning",t.error="error",t.info="info",t.neutral="neutral"}(Rt||(Rt={})),t.TkNotie=Nt=class extends t.TkBox{constructor(t=""){super(),this.persistent=!0,this.open=!1,this.position="bottom",this.type=Ht.show,this.level=Rt.info,this.delay=3e3,this.animationDelay=300,this.buttonText="OK",this.confirmText="OK",this.cancelText="CANCEL",this.text=t}static get styles(){return[...t.TkBox.styles,l`${s(":host{bottom:0;display:none;font-size:1.6rem;left:0;margin:0;position:fixed;right:0;top:0}:host .overlay{background-color:#00000080;bottom:0;left:0;position:fixed;right:0;top:0;z-index:var(--notie-z-index,400)}:host .container{background-color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));bottom:0;box-shadow:10px 10px 10px 10px var(--shadow);color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));height:fit-content;left:0;position:fixed;right:0;text-align:center;transform:translateY(100%);transition:all .15s ease-in;z-index:calc(var(--notie-z-index, 400) + 1)}:host .container.info{background-color:#4d82d6}:host .container.error{background-color:#e1715b}:host .container.warning{background-color:#d6a14d}:host .container.success{background-color:#57bf57}:host .text{padding:.5em}:host .input{--input-font-size:$font-size-widescreen;background-color:var(--background);color:var(--foreground);text-align:center}:host .button{cursor:pointer;padding:.5em}:host .button.confirm,:host .button.forcer{background-color:#57bf57;color:#fff}:host .button.cancel{background-color:var(--error,#e1715b);color:var(--on-error,#fff)}@media screen and (max-width:900px){:host{font-size:1.4rem}}@media screen and (max-width:750px){:host{font-size:1.2rem}}@media screen and (max-width:400px){:host{font-size:1rem}}:host([position=top]) .container{bottom:inherit;position:fixed;top:0;transform:translateY(-100%)}:host([open]) .container{transform:translateY(0)}")}`]}render(){return I`<div class="overlay" @click="${()=>this.hide(!1)}"></div><tk-box class="container ${this.level}">${this.text?I`<tk-box class="text" @click="${()=>this.type==Ht.show?this.hide(!0):null}">${this.text}</tk-box>`:""} ${this.template?I`<tk-box class="template" @click="${()=>this.type==Ht.show?this.hide(!0):null}">${this.template}</tk-box>`:""} ${this.type==Ht.force?I`<tk-box @click="${()=>this.hide(!0)}" class="button force">${this.buttonText}</tk-box>`:""} ${this.type==Ht.input?I`<tk-textfield class="input"></tk-textfield>`:""} ${this.type==Ht.confirm||this.type==Ht.input?I`<tk-box direction="row"><tk-box justify="center" align-items="center" flex="grow" @click="${()=>this.hide(!0)}" class="button confirm">${this.confirmText}</tk-box><tk-box justify="center" align-items="center" flex="grow" @click="${()=>this.hide(!1)}" class="button confirm cancel">${this.cancelText}</tk-box></tk-box>`:""}</tk-box>`}show(){return new Promise((t=>{this.resolve=t,this.style.setProperty("display","flex"),setTimeout((()=>this.open=!0)),this.dispatchEvent(new Event("didShow")),this.$input&&setTimeout((()=>this.$input.focus())),this.type==Ht.show&&setTimeout((()=>this.hide(!1)),this.delay)}))}hide(t){t&&this.type===Ht.input&&(t=this.$input.value),t||this.type!==Ht.input||(t=null),this.$input&&(this.$input.value=""),this.$container.addEventListener("transitionend",(()=>{this.dispatchEvent(new Event("didHide")),this.resolve(t),this.persistent||this.remove()}),{once:!0}),this.open=!1}static show(t){return this.getNotie(t,Ht.show).show()}static force(t){const e=this.getNotie(t,Ht.force);return t.buttonText&&(e.buttonText=t.buttonText),e.show()}static confirm(t){const e=this.getNotie(t,Ht.confirm);return t.confirmText&&(e.confirmText=t.confirmText),t.cancelText&&(e.cancelText=t.cancelText),e.show()}static input(t){const e=this.getNotie(t,Ht.input);return t.password&&(e.$input.type="password"),t.confirmText&&(e.confirmText=t.confirmText),t.cancelText&&(e.cancelText=t.cancelText),e.show()}static getNotie(t,e){const r=new Nt(t.text);return r.persistent=!1,r.type=e,r.delay=t.delay??999999999,t.template&&(r.template=t.template),t.position&&(r.position=t.position),t.background&&r.$container&&r.$container.setAttribute("background-color",t.background),t.color&&r.$container&&r.$container.setAttribute("color",t.color),t.container?t.container.shadowRoot?.appendChild(r):window.document.body.appendChild(r),t.zIndex&&r.style.setProperty("z-index",t.zIndex.toString()),r}},e([at(),r("design:type",Boolean)],t.TkNotie.prototype,"persistent",void 0),e([ot({type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkNotie.prototype,"open",void 0),e([ot({reflect:!0}),r("design:type",Object)],t.TkNotie.prototype,"position",void 0),e([ot({type:String}),r("design:type",String)],t.TkNotie.prototype,"type",void 0),e([ot({type:String}),r("design:type",String)],t.TkNotie.prototype,"level",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkNotie.prototype,"delay",void 0),e([ot(),r("design:type",String)],t.TkNotie.prototype,"text",void 0),e([ot(),r("design:type",String)],t.TkNotie.prototype,"buttonText",void 0),e([ot(),r("design:type",String)],t.TkNotie.prototype,"confirmText",void 0),e([ot(),r("design:type",String)],t.TkNotie.prototype,"cancelText",void 0),e([ot({type:Object}),r("design:type",Object)],t.TkNotie.prototype,"template",void 0),e([lt("tk-textfield"),r("design:type",t.TkTextfield)],t.TkNotie.prototype,"$input",void 0),e([lt(".container"),r("design:type",HTMLElement)],t.TkNotie.prototype,"$container",void 0),t.TkNotie=Nt=e([rt("tk-notie"),r("design:paramtypes",[String])],t.TkNotie);t.TkPages=class extends tt{constructor(){super(...arguments),this._page="",this.selected="",this.handleScroll=!1,this.scrollHistory={}}set page(t){let e=this._page;if(this._page=t,e&&this.handleScroll){if(this.querySelector(`[page=${e}]`)){const t=document.scrollingElement||document.documentElement;this.scrollHistory[e]=t.scrollTop}}this.requestUpdate("page",e)}get page(){return this._page}render(){return I`<slot></slot>`}updated(t){t.has("page")&&this.querySelectorAll(":scope > *").forEach((t=>{const e=t.getAttribute("page")??"default",r=document.scrollingElement||document.documentElement;e==this.page?(t.removeAttribute("hidden"),""!=this.selected&&t.setAttribute(this.selected,""),this.handleScroll&&!t.hasAttribute("no-scroll")&&(r.scrollTop=this.scrollHistory[e]?this.scrollHistory[e]:0)):(t.setAttribute("hidden",""),""!=this.selected&&t.removeAttribute(this.selected))}))}},t.TkPages.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}")}`,e([ot({attribute:"page",type:String}),r("design:type",String),r("design:paramtypes",[String])],t.TkPages.prototype,"page",null),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkPages.prototype,"selected",void 0),e([ot({attribute:"handle-scroll",type:Boolean}),r("design:type",Boolean)],t.TkPages.prototype,"handleScroll",void 0),t.TkPages=e([rt("tk-pages")],t.TkPages);t.TkProgress=class extends tt{constructor(){super(...arguments),this.circle=!1,this.indeterminate=!1,this.value=0,this.buffer=0}render(){return I`${this.circle?I`<svg class="spinner" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle class="path" fill="none" stroke-width="10" stroke-linecap="butt" cx="50" cy="50" r="40"></circle></svg>`:I`${this.indeterminate?I`<div class="progress-materializecss"><div class="indeterminate"></div></div>`:I`<progress class="progress" max="100" value="50"></progress>`}`}`}},t.TkProgress.styles=l`${s('*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--primary)}:host([accent]){--color:var(--accent)}:host([error]){--color:var(--error)}.spinner{animation:rotator 3s linear infinite;height:1em;transform-origin:center;width:1em}.spinner .path{stroke-dasharray:265;stroke-dashoffset:0;stroke:var(--color);animation:dash 3s ease-in-out infinite;transform-origin:center}@keyframes rotator{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes dash{0%{stroke-dashoffset:265}50%{stroke-dashoffset:65;transform:rotate(90deg)}to{stroke-dashoffset:265;transform:rotate(1turn)}}.progress-materializecss{background-color:var(--shade-lighter);display:block;height:.3em;margin:5px 0;overflow:hidden;position:relative}.progress-materializecss .indeterminate{background-color:var(--primary)}.progress-materializecss .indeterminate:before{animation:indeterminate 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.progress-materializecss .indeterminate:after,.progress-materializecss .indeterminate:before{background-color:inherit;bottom:0;content:"";left:0;position:absolute;top:0;will-change:left,right}.progress-materializecss .indeterminate:after{animation:indeterminate-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation-delay:1.15s}@keyframes indeterminate{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes indeterminate-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}')}`,e([ot({attribute:!0,type:Boolean}),r("design:type",Boolean)],t.TkProgress.prototype,"circle",void 0),e([ot({attribute:!0,type:Boolean}),r("design:type",Boolean)],t.TkProgress.prototype,"indeterminate",void 0),e([ot({attribute:!0,type:Number}),r("design:type",Number)],t.TkProgress.prototype,"value",void 0),e([ot({attribute:!0,type:Number}),r("design:type",Number)],t.TkProgress.prototype,"buffer",void 0),t.TkProgress=e([rt("tk-progress")],t.TkProgress);t.TkRadio=class extends tt{constructor(){super(...arguments),this.checked=!1,this.required=!1,this.disabled=!1,this.readonly=!1}render(){return I`<tk-box direction="row" align-items="center"><div tabindex="0" class="radio"><div id="dot"></div></div><span class="label"><slot></slot></span></tk-box><input id="${pt()}" slot="none" style="display:none" type="radio" ?checked="${this.checked}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" value="${dt(this.value)}" name="${dt(this.name)}" aria-hidden="true" tabindex="-1">`}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.onKeyDown.bind(this))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.onKeyDown)}firstUpdated(){this.appendChild(this.$input)}onKeyDown(t){"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),t.stopPropagation(),this.click())}handleClick(){this.checked=!this.checked,this.checked&&this.name&&this.getRootNode().querySelectorAll(`tk-radio[name="${this.name}"]`).forEach((t=>t!=this?t.checked=!1:null)),setTimeout((()=>this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))))}},t.TkRadio.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_radio-bg:var(--radio-bg,#0000);--_radio-color:var(--radio-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));display:inline-flex}:host .radio{align-items:center;background:var(--_radio-bg);border:var(--radio-border-config,.125rem solid) currentColor;border-radius:var(--radio-border-radius,100%);color:var(--_radio-color);display:inline-flex;height:var(--radio-size,1.25rem);justify-content:center;outline:none;position:relative;transition:var(--radio-transition,background var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),border-color var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));-webkit-user-select:none;user-select:none;width:var(--radio-size,1.25rem)}:host .label{font-size:1.1em;margin-left:10px}:host(:not([disabled])){cursor:pointer}:host([checked]){--_radio-bg:var(--radio-bg-checked,#0000);--_radio-color:var(--radio-color-checked,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([checked]) #dot{transform:scale(1)}:host(:focus),:host(:hover){will-change:border,background}:host(:focus) #dot,:host(:hover) #dot{will-change:transform,background}:host([disabled]){--_radio-bg:var(--radio-bg-disabled,#0000);--_radio-color:var(--radio-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));pointer-events:none}:host([disabled][checked]){--_radio-bg:var(--radio-bg-disabled-checked,#0000);--_radio-color:var(--radio-color-disabled-checked,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}#dot{background:currentColor;border-radius:var(--radio-dot-border-radius,100%);height:var(--radio-dot-size,.625rem);transform:scale(0);transition:var(--radio-dot-transition,transform var(--transition-duration-medium,.18s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--radio-dot-size,.625rem)}#ripple{transform:var(--radio-ripple-transform,translate(-50%,-50%) scale(1.8))}")}`,e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkRadio.prototype,"name",void 0),e([ot({attribute:!0,type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkRadio.prototype,"checked",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkRadio.prototype,"required",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkRadio.prototype,"disabled",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkRadio.prototype,"readonly",void 0),e([ot({type:String,reflect:!0}),r("design:type",String)],t.TkRadio.prototype,"value",void 0),e([lt("input"),r("design:type",HTMLInputElement)],t.TkRadio.prototype,"$input",void 0),t.TkRadio=e([rt("tk-radio")],t.TkRadio);t.TkSelect=class extends tt{constructor(){super(...arguments),this.type="text",this.required=!1,this.disabled=!1,this.readonly=!1}set value(t){this.$select?(this.$select.value=t,this.refreshAttributes()):this.initialValue=t}get value(){return null!=this.$select?this.$select.value:this.initialValue||""}render(){return I`<div id="container"><slot id="before" name="before"></slot><div id="wrapper"><div id="label">${this.label}</div><slot id="slot"></slot><select id="${pt()}" @keydown="${this.handleChange.bind(this)}" @input="${this.handleChange.bind(this)}" @focusout="${this.handleChange.bind(this)}" @change="${this.handleChange.bind(this)}" .value="${this.initialValue}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" name="${dt(this.name)}" autocomplete="${dt(this.autocomplete)}" tabindex="${this.disabled?-1:0}"></select> <svg id="arrow" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 25" preserveAspectRatio="none"><polygon points="0,0 50,0 25,25"/></svg></div><slot id="after" name="after"></slot></div>`}handleChange(){this.refreshAttributes()}firstUpdated(){this.$select=this.shadowRoot?.querySelector("select"),this.appendChild(this.$select);this.querySelectorAll("option").forEach((t=>this.$select.appendChild(t))),this.initialValue&&(this.value=this.initialValue)}refreshAttributes(){this.$select.value?this.setAttribute("dirty",""):this.removeAttribute("dirty"),this.$select.checkValidity()?this.removeAttribute("invalid"):this.setAttribute("invalid",""),setTimeout((()=>this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))))}},t.TkSelect.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}#arrow{fill:var(--_input-state-color);height:8px;position:absolute;right:0;top:50%;transform:translate(-100%,-50%);z-index:-1}::slotted(option){display:none}:host(:not([dirty])) ::slotted(select){opacity:0}")}`,e([ot({type:String}),r("design:type",String),r("design:paramtypes",[String])],t.TkSelect.prototype,"value",null),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkSelect.prototype,"name",void 0),e([ot({type:String}),r("design:type",String)],t.TkSelect.prototype,"list",void 0),e([ot({type:String}),r("design:type",String)],t.TkSelect.prototype,"type",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSelect.prototype,"required",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSelect.prototype,"disabled",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSelect.prototype,"readonly",void 0),e([ot({type:String}),r("design:type",String)],t.TkSelect.prototype,"autocomplete",void 0),e([ot({type:String}),r("design:type",String)],t.TkSelect.prototype,"pattern",void 0),e([at(),r("design:type",String)],t.TkSelect.prototype,"initialValue",void 0),e([ot({type:String}),r("design:type",String)],t.TkSelect.prototype,"label",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSelect.prototype,"min",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSelect.prototype,"max",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSelect.prototype,"minLength",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSelect.prototype,"maxLength",void 0),e([st({passive:!0}),r("design:type",Function),r("design:paramtypes",[]),r("design:returntype",void 0)],t.TkSelect.prototype,"handleChange",null),t.TkSelect=e([rt("tk-select")],t.TkSelect);t.TkSlider=class extends tt{constructor(){super(...arguments),this.required=!1,this.disabled=!1,this.readonly=!1,this.thumbLabel=!1,this.thumbLabelPersist=!1,this.min=0,this.value=this.min,this.max=100}render(){return I`<div id="container"><slot id="before" name="before"></slot><div id="wrapper"><div id="label">${this.label}</div><div id="slot-wrapper"><input @input="${this.handleChange.bind(this)}" id="slider" type="range" .value="${this.value.toString()}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" aria-label="${dt(this.label)}" name="${dt(this.name)}" autocomplete="${dt(this.autocomplete)}" min="${dt(this.min)}" max="${dt(this.max)}" step="${dt(this.step)}" tabindex="0"> ${this.thumbLabel||this.thumbLabelPersist?I`<div id="thumb-container"><div id="thumb-label"><slot name="thumb-label">${this.value}</slot></div></div>`:""}</div><input id="${pt()}" class="hidden-input" type="hidden" value="${this.value.toString()}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" aria-label="${dt(this.label)}" name="${dt(this.name)}"></div><slot id="after" name="after"></slot></div>`}handleChange(t){t.target.checkValidity()?this.removeAttribute("invalid"):this.setAttribute("invalid",""),this.value=t.target.value.toString(),setTimeout((()=>this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))))}firstUpdated(){this.appendChild(this.$input),this.setAttribute("dirty","")}updated(){console.log("slider updated",this.$slider.valueAsNumber),requestAnimationFrame((()=>{this.style.setProperty("--_perc",((Number(this.value)-this.min)/(this.max-this.min)).toString())}))}},t.TkSlider.styles=l`${s('*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host{--_perc:0;--_slider-track-bg:var(--slider-bg,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_slider-track-bg-active:var(--slider-bg-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));--_slider-thumb-bg:var(--slider-thumb-bg,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));--_slider-thumb-border:var(--slider-thumb-bg,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([disabled]){--_slider-track-bg:var(--slider-bg-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_slider-track-bg-active:var(--slider-bg-active-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_slider-thumb-bg:var(--slider-thumb-bg-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_slider-thumb-border:var(--slider-thumb-bg,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host([thumblabel-persist]) #container,:host([thumblabel]) #container{padding-top:33px}#container{border:none;overflow:visible}#slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:linear-gradient(90deg,var(--_slider-track-bg-active) 0,var(--_slider-track-bg-active) calc(var(--_perc)*100%),var(--_slider-track-bg) calc(var(--_perc)*100%),var(--_slider-track-bg));border:none;border-radius:0;box-sizing:border-box;cursor:grab;height:var(--slider-height,.3125rem);margin:0;outline:none;top:calc(var(--slider-height, .3125rem)*-1/2)}#slider,#thumb-container{position:relative;width:100%}#thumb-label{--_thumb-label-transform-y:0.625rem;-webkit-text-fill-color:var(--slider-thumb-label-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));align-items:center;border-radius:var(--slider-thumb-label-border-radius,100%);bottom:calc(100% + var(--slider-thumb-size, .75rem) + var(--slider-height, .3125rem) + var(--slider-thumb-space, .75rem));color:var(--slider-thumb-label-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));display:flex;font-size:var(--slider-thumb-label-font-size,.75rem);height:var(--slider-thumb-label-size,1.875rem);justify-content:center;left:calc(var(--_perc)*100% - var(--slider-thumb-size, 1.2rem)*var(--_perc));opacity:0;pointer-events:none;text-overflow:ellipsis;transform:translate(calc(-50% + var(--slider-thumb-size, 1.2rem)/2),var(--_thumb-label-transform-y));transition:var(--slider-thumb-label-transition,opacity var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-label-size,1.875rem)}#thumb-label,#thumb-label:before{background:var(--slider-thumb-label-bg,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));position:absolute}#thumb-label:before{border-radius:0 50% 50% 50%;content:"";height:100%;left:0;top:0;transform:rotate(225deg);width:100%;z-index:-1}#slider:focus+#thumb-container #thumb-label,:host([thumblabel-persist]) #thumb-label,:host:focus #thumb-label{--_thumb-label-transform-y:0;opacity:1}#slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--_slider-thumb-bg);border:4px solid var(--_slider-thumb-border);border-radius:var(--slider-thumb-border-radius,100%);box-shadow:0 0 0 0 var(--slider-thumb-focus-ring-bg,#00000015);cursor:grab;height:var(--slider-thumb-size,1.2rem);position:relative;-webkit-transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-size,1.2rem)}#slider::-moz-range-thumb{-moz-appearance:none;appearance:none;background:var(--_slider-thumb-bg);border:none;border-radius:var(--slider-thumb-border-radius,100%);box-shadow:0 0 0 0 var(--slider-thumb-focus-ring-bg,#00000015);cursor:grab;height:var(--slider-thumb-size,1.2rem);position:relative;-moz-transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-size,1.2rem)}#slider:focus::-webkit-slider-thumb{box-shadow:0 0 0 var(--slider-thumb-focus-ring-size,.75rem) var(--slider-thumb-focus-ring-bg,#00000015);transform:var(--slider-thumb-transform-focus,scale(1.2))}#slider:focus::-moz-range-thumb{box-shadow:0 0 0 var(--slider-thumb-focus-ring-size,.75rem) var(--slider-thumb-focus-ring-bg,#00000015);transform:var(--slider-thumb-transform-focus,scale(1.2))}')}`,e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkSlider.prototype,"name",void 0),e([ot({type:String}),r("design:type",String)],t.TkSlider.prototype,"list",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSlider.prototype,"required",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSlider.prototype,"disabled",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSlider.prototype,"readonly",void 0),e([ot({type:String}),r("design:type",String)],t.TkSlider.prototype,"autocomplete",void 0),e([ot({type:Boolean,attribute:"thumblabel"}),r("design:type",Boolean)],t.TkSlider.prototype,"thumbLabel",void 0),e([ot({type:Boolean,attribute:"thumblabel-persist"}),r("design:type",Boolean)],t.TkSlider.prototype,"thumbLabelPersist",void 0),e([ot({type:String}),r("design:type",String)],t.TkSlider.prototype,"label",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSlider.prototype,"min",void 0),e([ot({type:Number,reflect:!0}),r("design:type",Number)],t.TkSlider.prototype,"value",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSlider.prototype,"max",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkSlider.prototype,"step",void 0),e([lt("#slider"),r("design:type",HTMLInputElement)],t.TkSlider.prototype,"$slider",void 0),e([lt(".hidden-input"),r("design:type",HTMLInputElement)],t.TkSlider.prototype,"$input",void 0),t.TkSlider=e([rt("tk-slider")],t.TkSlider);t.TkSwitch=class extends tt{constructor(){super(...arguments),this.checked=!1,this.required=!1,this.disabled=!1,this.readonly=!1}render(){return I`<tk-box direction="row" align-items="center"><span class="switch"><span id="knob"></span> </span><span class="label"><slot></slot></span></tk-box><input id="${pt()}" slot="none" style="display:none" type="radio" ?checked="${this.checked}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" value="${dt(this.value)}" name="${dt(this.name)}" aria-hidden="true" tabindex="-1">`}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.onKeyDown.bind(this))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.onKeyDown)}firstUpdated(){this.appendChild(this.$input)}onKeyDown(t){"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),t.stopPropagation(),this.click())}handleClick(){this.checked=!this.checked,this.checked&&this.name&&this.getRootNode().querySelectorAll(`tk-radio[name="${this.name}"]`).forEach((t=>t!=this?t.checked=!1:null)),setTimeout((()=>this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))))}},t.TkSwitch.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_switch-bg:var(--switch-bg,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_switch-color:var(--switch-color,var(--background,#f7f7f7))}:host .switch{align-items:center;background:var(--_switch-bg);border-radius:var(--switch-border-radius,.75rem);color:var(--_switch-color);display:inline-flex;height:var(--switch-height,.875rem);outline:none;position:relative;transition:var(--switch-transition,background var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));-webkit-user-select:none;user-select:none;width:var(--switch-width,2.125rem)}:host .switch #knob{background:currentColor;border-radius:var(--switch-knob-border-radius,100%);box-shadow:var(--switch-knob-elevation,var(--elevation-3,0 4px 8px var(--shadow)));height:var(--switch-knob-size,1.25rem);position:absolute;transition:var(--switch-knob-transition,background var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--switch-knob-size,1.25rem)}:host .label{font-size:1.1em;margin-left:10px}:host(:not([disabled])){cursor:pointer}:host([checked]){--_switch-bg:var(--switch-bg-checked,var(--primary-lighter,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*1.3))));--_switch-color:var(--switch-color-checked,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([checked]) .switch #knob{transform:translateX(calc(var(--switch-width, 2.125rem) - 100%))}:host(:focus),:host(:hover){will-change:background-color}:host([disabled]){--_switch-bg:var(--switch-bg-disabled,hsl(var(--shade-200,var(--shade-hue,200),var(--shade-saturation,4%),var(--shade-lightness,85%))));--_switch-color:var(\n \t--switch-color-disabled,hsl(var(--shade-300,var(--shade-hue,200),var(--shade-saturation,4%),var(--shade-lightness,75%)))\n );pointer-events:none}:host([disabled][checked]){--_switch-bg:var(\n \t--switch-bg-disabled-checked,hsla(var(--primary-400,var(--primary-hue,224),var(--primary-saturation,42%),var(--primary-lightness,52%)),0.1)\n );--_switch-color:var(\n \t--switch-color-disabled-checked,hsla(var(--primary-400,var(--primary-hue,224),var(--primary-saturation,42%),var(--primary-lightness,52%)),0.4)\n )}")}`,e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkSwitch.prototype,"name",void 0),e([ot({attribute:!0,type:Boolean,reflect:!0}),r("design:type",Boolean)],t.TkSwitch.prototype,"checked",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSwitch.prototype,"required",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSwitch.prototype,"disabled",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkSwitch.prototype,"readonly",void 0),e([ot({type:String,reflect:!0}),r("design:type",String)],t.TkSwitch.prototype,"value",void 0),e([lt("input"),r("design:type",HTMLInputElement)],t.TkSwitch.prototype,"$input",void 0),t.TkSwitch=e([rt("tk-switch")],t.TkSwitch);t.TkTabGroup=class extends tt{constructor(){super(),this.circle=!1,this.observe="",this.selected=""}render(){return I`<div class="tabs"><slot @click="${t=>this.clickOnTab(t.target)}" @slotchange="${()=>this.updateUnderline()}"></slot></div>${this.circle?I`<div class="circle"></div>`:I`<div class="underline"></div>`}`}firstUpdated(){if(IntersectionObserver){new IntersectionObserver(this.updateUnderline.bind(this)).observe(this)}else this.updateUnderline.bind(this)}updated(t){t.has("selected")&&(this.querySelectorAll("*").forEach((t=>t.removeAttribute("selected"))),this.querySelector(`[tab="${this.selected}"]`)?.setAttribute("selected","")),t.has("observe")&&(this.querySelector(`[tab="${this.selected}"]`)?.focus(),this.updateUnderline())}clickOnTab(t){this.querySelectorAll("*").forEach((t=>t.removeAttribute("selected"))),t.setAttribute("selected",""),this.updateUnderline(),this.dispatchEvent(new CustomEvent("change",{detail:t.getAttribute("tab"),composed:!0,bubbles:!0}))}updateUnderline(){const t=this.querySelector("[selected]");t&&setTimeout((()=>{this.circle?this.$circle.style.transform=`translate(${t.offsetLeft+t.clientWidth/2-this.$circle.clientWidth/2}px, -${this.$circle.clientWidth/2}px)`:(this.$underline.style.width=t.clientWidth+"px",this.$underline.style.transform=`translateX(${t.offsetLeft}px)`)}));
477
478
  // else {
478
479
  // if (this.circle) {
479
480
  // this.$circle.style.transform = `translate(-100px, -${this.$circle.clientWidth / 2}px)`;
@@ -481,4 +482,4 @@ class Lt extends class{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e
481
482
  // this.$underline.style.width = "0";
482
483
  // }
483
484
  // }
484
- }},t.TkTabGroup.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));display:inline-block;overflow:hidden;position:relative}:host([accent]){--color:var(--accent,hsl(var(--accent-h,8.76404),var(--accent-s,64.0288%),var(--accent-l,72.7451%)))}.tabs{display:flex}:host(:not([circle])) .tabs{border-bottom:2px solid var(--shade-lighter)}.underline{height:2px;margin-top:-2px;transition:transform .2s ease;width:0}.circle,.underline{background-color:var(--color)}.circle{border-radius:var(--border-radius-circle,50%);height:8px;transition:transform .3s ease;width:8px}")}`,e([ot({attribute:!0,type:Boolean}),r("design:type",Boolean)],t.TkTabGroup.prototype,"circle",void 0),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkTabGroup.prototype,"observe",void 0),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkTabGroup.prototype,"selected",void 0),e([st(".underline"),r("design:type",HTMLElement)],t.TkTabGroup.prototype,"$underline",void 0),e([st(".circle"),r("design:type",HTMLElement)],t.TkTabGroup.prototype,"$circle",void 0),t.TkTabGroup=e([rt("tk-tab-group"),r("design:paramtypes",[])],t.TkTabGroup);t.TkTag=class extends tt{render(){return I`<div class="tag"><slot></slot></div>`}},t.TkTag.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--primary);--text:var(--on-primary);background:var(--color);box-sizing:border-box;color:var(--text);display:flex;flex-grow:1;height:var(--navbar-height,48px);justify-content:space-between;padding:var(--navbar-padding,var(--spacing-s,.5rem));position:relative;transition:var(--nav-transition,background var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),transform var(--transition-duration-medium,.18s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-medium,.18s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));z-index:var(--navbar-z-index,100)}:host([inverted]){--color:var(--on-primary);--text:var(--primary)}:host([fixed]){left:0;position:fixed;top:0;width:100%}:host([shadow]){box-shadow:var(--nav-elevation,var(--elevation-5,0 12px 24px var(--shadow)))}#left,#right,#title,::slotted([slot=left]),::slotted([slot=right]),::slotted([slot=title]){align-items:center;display:flex;height:100%}#title,::slotted([slot=title]){font-size:var(--nav-title-font-size,var(--font-size-l,1.25rem));font-weight:var(--nav-title-font-weight,var(--font-weight-regular,500));margin:var(--nav-title-margin,0 0 0 var(--spacing-l,1.25rem))}")}`,t.TkTag=e([rt("tk-tag")],t.TkTag);t.TkTextarea=class extends tt{constructor(){super(...arguments),this._id=ct(),this.type="text",this.required=!1,this.disabled=!1,this.readonly=!1,this.rows=1}set value(t){this.$input?(this.$input.value=t,this.refreshAttributes()):this.initialValue=t}get value(){return null!=this.$input?this.$input.value:this.initialValue||""}render(){return I`<div id="container"><slot id="before" name="before"></slot><div id="wrapper"><div id="label">${this.label}</div><slot id="slot"></slot><textarea id="${this._id}" @keydown="${this.handleChange.bind(this)}" @input="${this.handleChange.bind(this)}" @focusout="${this.handleChange.bind(this)}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" aria-label="${ht(this.label)}" name="${ht(this.name)}" pattern="${ht(this.pattern)}" autocomplete="${ht(this.autocomplete)}" autocapitalize="${ht(this.autocapitalize)}" minlength="${ht(this.minLength)}" maxlength="${ht(this.maxLength)}" rows="${this.rows}" tabindex="${this.disabled?-1:0}"></textarea></div><slot id="after" name="after"></slot></div>`}handleChange(){this.refreshAttributes()}firstUpdated(){this.$input=this.shadowRoot?.querySelector("textarea"),this.appendChild(this.$input),this.initialValue&&(this.value=this.initialValue)}refreshAttributes(){this.$input.value?this.setAttribute("dirty",""):this.removeAttribute("dirty"),this.$input.checkValidity()?this.removeAttribute("invalid"):this.setAttribute("invalid","")}focus(){this.$input.focus()}},t.TkTextarea.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}#wrapper ::slotted(textarea){font-family:inherit;height:var(--textarea-height,var(--_textarea-height));max-height:var(--textarea-max-height);min-height:var(--textarea-min-height,var(--textarea-height,var(--_textarea-height)));resize:var(--textarea-resize,none)}:host(:focus) ::slotted(textarea),:host(:hover) ::slotted(textarea){will-change:height}")}`,e([ot({type:String}),r("design:type",String),r("design:paramtypes",[String])],t.TkTextarea.prototype,"value",null),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkTextarea.prototype,"name",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"list",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"type",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkTextarea.prototype,"required",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkTextarea.prototype,"disabled",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkTextarea.prototype,"readonly",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"autocomplete",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"autocapitalize",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"pattern",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"initialValue",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"label",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextarea.prototype,"minLength",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextarea.prototype,"maxLength",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextarea.prototype,"rows",void 0),e([nt({passive:!0}),r("design:type",Function),r("design:paramtypes",[]),r("design:returntype",void 0)],t.TkTextarea.prototype,"handleChange",null),t.TkTextarea=e([rt("tk-textarea")],t.TkTextarea);t.TkTheme=class extends tt{constructor(){super(...arguments),this.primary="#8970bf",this.onPrimary="#FFFFFF",this.accent="#E69A8D",this.onAccent="#FFFFFF",this.shade="#AAAAAA",this.onShade="#FFFFFF",this.error="#F44336",this.onError="#FFFFFF",this.foreground="#FFFFFF",this.background="#000",this.forceBody=!1,this.inverted=!1}render(){return I`<slot></slot>`}updated(){this.setThemeColor()}connectedCallback(){super.connectedCallback(),this.addEventListener("turn-theme-to-inverted",(()=>this.turnThemeToInverted()),{passive:!0}),this.addEventListener("turn-theme-to-non-inverted",(()=>this.turnThemeToNonInverted()),{passive:!0}),this.addEventListener("set-theme",this.setTheme),this.addEventListener("set-theme-font-size",this.setThemeFontSize)}disconnectedCallback(){this.removeEventListener("turn-theme-to-inverted",this.turnThemeToInverted),this.removeEventListener("turn-theme-to-non-inverted",this.turnThemeToNonInverted),this.removeEventListener("set-theme",this.setTheme),this.removeEventListener("set-theme-font-size",this.setThemeFontSize),super.disconnectedCallback()}setTheme(t){const e=t;this.background=e.detail.background?e.detail.background:this.background,this.foreground=e.detail.foreground?e.detail.foreground:this.foreground,this.primary=e.detail.primary?e.detail.primary:this.primary,this.onPrimary=e.detail.onPrimary?e.detail.onPrimary:this.onPrimary,this.accent=e.detail.accent?e.detail.accent:this.accent,this.onAccent=e.detail.onAccent?e.detail.onAccent:this.onAccent}setThemeFontSize(t){const e=t;console.log("ev",e),this.style.setProperty("--font-size",e.detail)}turnThemeToInverted(){this.inverted=!0,this.forceBody&&this.setBodyStyle()}turnThemeToNonInverted(){this.inverted=!1,this.forceBody&&this.setBodyStyle()}hexToHSL(t){const e=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})?$/i.exec(t);if(null==e)return["0","0%","0%"];const[,r,i,o]=e,a=parseInt(r,16)/255,n=parseInt(i,16)/255,s=parseInt(o,16)/255,l=Math.max(a,n,s),h=Math.min(a,n,s);let d=0,c=0,p=(l+h)/2;if(l!=h){const t=l-h;switch(c=p>.5?t/(2-l-h):t/(l+h),l){case a:d=(n-s)/t+(n<s?6:0);break;case n:d=(s-a)/t+2;break;case s:d=(a-n)/t+4}d/=6}return[(360*d).toString(),(100*c).toString()+"%",(100*p).toString()+"%"]}setThemeColor(){const t=this.hexToHSL(this.primary);this.style.setProperty("--primary-h",t[0]),this.style.setProperty("--primary-s",t[1]),this.style.setProperty("--primary-l",t[2]);const e=this.hexToHSL(this.onPrimary);this.style.setProperty("--on-primary-h",e[0]),this.style.setProperty("--on-primary-s",e[1]),this.style.setProperty("--on-primary-l",e[2]);const r=this.hexToHSL(this.accent);this.style.setProperty("--accent-h",r[0]),this.style.setProperty("--accent-s",r[1]),this.style.setProperty("--accent-l",r[2]);const i=this.hexToHSL(this.onAccent);this.style.setProperty("--on-accent-h",i[0]),this.style.setProperty("--on-accent-s",i[1]),this.style.setProperty("--on-accent-l",i[2]);const o=this.hexToHSL(this.shade);this.style.setProperty("--shade-h",o[0]),this.style.setProperty("--shade-s",o[1]),this.style.setProperty("--shade-l",o[2]);const a=this.hexToHSL(this.onShade);this.style.setProperty("--on-shade-h",a[0]),this.style.setProperty("--on-shade-s",a[1]),this.style.setProperty("--on-shade-l",a[2]);const n=this.hexToHSL(this.error);this.style.setProperty("--error-h",n[0]),this.style.setProperty("--error-s",n[1]),this.style.setProperty("--error-l",n[2]);const s=this.hexToHSL(this.onError);this.style.setProperty("--on-error-h",s[0]),this.style.setProperty("--on-error-s",s[1]),this.style.setProperty("--on-error-l",s[2]);const l=this.hexToHSL(this.foreground);this.style.setProperty("--theme-foreground",`hsl(${l[0]},${l[1]},${l[2]})`);const h=this.hexToHSL(this.background);this.style.setProperty("--theme-background",`hsl(${h[0]},${h[1]},${h[2]})`),this.forceBody&&this.setBodyStyle()}setBodyStyle(){let t=this.hexToHSL(this.foreground),e=this.hexToHSL(this.background);this.inverted&&(t=this.hexToHSL(this.background),e=this.hexToHSL(this.foreground)),document.body.style.setProperty("background",`hsl(${e[0]},${e[1]},${e[2]})`),document.body.style.setProperty("color",`hsl(${t[0]},${t[1]},${t[2]})`)}},t.TkTheme.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--background:var(--theme-background);--foreground:var(--theme-foreground);--primary-lighter:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*1.3));--primary-light:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*1.15));--primary:hsl(var(--primary-h),var(--primary-s),var(--primary-l));--primary-dark:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*0.85));--primary-darker:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*0.7));--on-primary-lighter:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*1.3));--on-primary-light:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*1.15));--on-primary:hsl(var(--on-primary-h),var(--on-primary-s),var(--on-primary-l));--on-primary-dark:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*0.85));--on-primary-darker:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*0.7));--accent-lighter:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*1.3));--accent-light:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*1.15));--accent:hsl(var(--accent-h),var(--accent-s),var(--accent-l));--accent-dark:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*0.85));--accent-darker:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*0.7));--on-accent-lighter:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*1.3));--on-accent-light:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*1.15));--on-accent:hsl(var(--on-accent-h),var(--on-accent-s),var(--on-accent-l));--on-accent-dark:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*0.85));--on-accent-darker:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*0.7));--shade-lighter:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*1.3));--shade-light:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*1.15));--shade:hsl(var(--shade-h),var(--shade-s),var(--shade-l));--shade-dark:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*0.85));--shade-darker:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*0.7));--on-shade-lighter:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*1.3));--on-shade-light:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*1.15));--on-shade:hsl(var(--on-shade-h),var(--on-shade-s),var(--on-shade-l));--on-shade-dark:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*0.85));--on-shade-darker:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*0.7));--error-lighter:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*1.3));--error-light:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*1.15));--error:hsl(var(--error-h),var(--error-s),var(--error-l));--error-dark:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*0.85));--error-darker:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*0.7));--on-error-lighter:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*1.3));--on-error-light:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*1.15));--on-error:hsl(var(--on-error-h),var(--on-error-s),var(--on-error-l));--on-error-dark:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*0.85));--on-error-darker:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*0.7));--shadow-lighter:#0000001a;--shadow-light:#00000026;--shadow:#0003;--shadow-dark:#0006;--shadow-darker:#0009;background-color:var(--background);color:var(--foreground);font-family:var(--font-family,Roboto,sans-serif);font-size:var(--font-size,1rem)}:host([inverted]){--background:var(--theme-foreground);--foreground:var(--theme-background);--primary-lighter:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*0.7));--primary-light:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*0.85));--primary:hsl(var(--primary-h),var(--primary-s),var(--primary-l));--primary-dark:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*1.15));--primary-darker:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*1.3));--on-primary-lighter:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*0.7));--on-primary-light:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*0.85));--on-primary:hsl(var(--on-primary-h),var(--on-primary-s),var(--on-primary-l));--on-primary-dark:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*1.15));--on-primary-darker:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*1.3));--accent-lighter:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*0.7));--accent-light:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*0.85));--accent:hsl(var(--accent-h),var(--accent-s),var(--accent-l));--accent-dark:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*1.15));--accent-darker:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*1.3));--on-accent-lighter:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*0.7));--on-accent-light:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*0.85));--on-accent:hsl(var(--on-accent-h),var(--on-accent-s),var(--on-accent-l));--on-accent-dark:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*1.15));--on-accent-darker:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*1.3));--shade-lighter:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*0.7));--shade-light:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*0.85));--shade:hsl(var(--shade-h),var(--shade-s),var(--shade-l));--shade-dark:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*1.15));--shade-darker:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*1.3));--on-shade-lighter:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*0.7));--on-shade-light:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*0.85));--on-shade:hsl(var(--on-shade-h),var(--on-shade-s),var(--on-shade-l));--on-shade-dark:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*1.15));--on-shade-darker:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*1.3));--error-lighter:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*0.7));--error-light:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*0.85));--error:hsl(var(--error-h),var(--error-s),var(--error-l));--error-dark:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*1.15));--error-darker:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*1.3));--on-error-lighter:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*0.7));--on-error-light:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*0.85));--on-error:hsl(var(--on-error-h),var(--on-error-s),var(--on-error-l));--on-error-dark:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*1.15));--on-error-darker:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*1.3));--shadow-lighter:#ffffff1a;--shadow-light:#ffffff26;--shadow:#fff3;--shadow-dark:#fff6;--shadow-darker:#fff9}")}`,e([ot(),r("design:type",String)],t.TkTheme.prototype,"primary",void 0),e([ot({attribute:"on-primary"}),r("design:type",String)],t.TkTheme.prototype,"onPrimary",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"accent",void 0),e([ot({attribute:"on-accent"}),r("design:type",String)],t.TkTheme.prototype,"onAccent",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"shade",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"onShade",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"error",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"onError",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"foreground",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"background",void 0),e([ot({type:Boolean,attribute:"force-body",reflect:!0}),r("design:type",Boolean)],t.TkTheme.prototype,"forceBody",void 0),e([ot({type:Boolean,attribute:!0,reflect:!0}),r("design:type",Boolean)],t.TkTheme.prototype,"inverted",void 0),t.TkTheme=e([rt("tk-theme")],t.TkTheme),Object.defineProperty(t,"__esModule",{value:!0})}));
485
+ }},t.TkTabGroup.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));display:inline-block;overflow:hidden;position:relative}:host([accent]){--color:var(--accent,hsl(var(--accent-h,8.76404),var(--accent-s,64.0288%),var(--accent-l,72.7451%)))}.tabs{display:flex}:host(:not([circle])) .tabs{border-bottom:2px solid var(--shade-lighter)}.underline{height:2px;margin-top:-2px;transition:transform .2s ease;width:0}.circle,.underline{background-color:var(--color)}.circle{border-radius:var(--border-radius-circle,50%);height:8px;transition:transform .3s ease;width:8px}")}`,e([ot({attribute:!0,type:Boolean}),r("design:type",Boolean)],t.TkTabGroup.prototype,"circle",void 0),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkTabGroup.prototype,"observe",void 0),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkTabGroup.prototype,"selected",void 0),e([lt(".underline"),r("design:type",HTMLElement)],t.TkTabGroup.prototype,"$underline",void 0),e([lt(".circle"),r("design:type",HTMLElement)],t.TkTabGroup.prototype,"$circle",void 0),t.TkTabGroup=e([rt("tk-tab-group"),r("design:paramtypes",[])],t.TkTabGroup);t.TkTag=class extends tt{render(){return I`<div class="tag"><slot></slot></div>`}},t.TkTag.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--primary);--text:var(--on-primary);background:var(--color);box-sizing:border-box;color:var(--text);display:flex;flex-grow:1;height:var(--navbar-height,48px);justify-content:space-between;padding:var(--navbar-padding,var(--spacing-s,.5rem));position:relative;transition:var(--nav-transition,background var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),transform var(--transition-duration-medium,.18s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-medium,.18s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));z-index:var(--navbar-z-index,100)}:host([inverted]){--color:var(--on-primary);--text:var(--primary)}:host([fixed]){left:0;position:fixed;top:0;width:100%}:host([shadow]){box-shadow:var(--nav-elevation,var(--elevation-5,0 12px 24px var(--shadow)))}#left,#right,#title,::slotted([slot=left]),::slotted([slot=right]),::slotted([slot=title]){align-items:center;display:flex;height:100%}#title,::slotted([slot=title]){font-size:var(--nav-title-font-size,var(--font-size-l,1.25rem));font-weight:var(--nav-title-font-weight,var(--font-weight-regular,500));margin:var(--nav-title-margin,0 0 0 var(--spacing-l,1.25rem))}")}`,t.TkTag=e([rt("tk-tag")],t.TkTag);t.TkTextarea=class extends tt{constructor(){super(...arguments),this._id=pt(),this.type="text",this.required=!1,this.disabled=!1,this.readonly=!1,this.rows=1}set value(t){this.$input?(this.$input.value=t,this.refreshAttributes()):this.initialValue=t}get value(){return null!=this.$input?this.$input.value:this.initialValue||""}render(){return I`<div id="container"><slot id="before" name="before"></slot><div id="wrapper"><div id="label">${this.label}</div><slot id="slot"></slot><textarea id="${this._id}" @keydown="${this.handleChange.bind(this)}" @input="${this.handleChange.bind(this)}" @focusout="${this.handleChange.bind(this)}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" aria-label="${dt(this.label)}" name="${dt(this.name)}" pattern="${dt(this.pattern)}" autocomplete="${dt(this.autocomplete)}" autocapitalize="${dt(this.autocapitalize)}" minlength="${dt(this.minLength)}" maxlength="${dt(this.maxLength)}" rows="${this.rows}" tabindex="${this.disabled?-1:0}"></textarea></div><slot id="after" name="after"></slot></div>`}handleChange(){this.refreshAttributes()}firstUpdated(){this.$input=this.shadowRoot?.querySelector("textarea"),this.appendChild(this.$input),this.initialValue&&(this.value=this.initialValue)}refreshAttributes(){this.$input.value?this.setAttribute("dirty",""):this.removeAttribute("dirty"),this.$input.checkValidity()?this.removeAttribute("invalid"):this.setAttribute("invalid","")}focus(){this.$input.focus()}},t.TkTextarea.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}#wrapper ::slotted(textarea){font-family:inherit;height:var(--textarea-height,var(--_textarea-height));max-height:var(--textarea-max-height);min-height:var(--textarea-min-height,var(--textarea-height,var(--_textarea-height)));resize:var(--textarea-resize,none)}:host(:focus) ::slotted(textarea),:host(:hover) ::slotted(textarea){will-change:height}")}`,e([ot({type:String}),r("design:type",String),r("design:paramtypes",[String])],t.TkTextarea.prototype,"value",null),e([ot({attribute:!0,type:String}),r("design:type",String)],t.TkTextarea.prototype,"name",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"list",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"type",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkTextarea.prototype,"required",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkTextarea.prototype,"disabled",void 0),e([ot({type:Boolean}),r("design:type",Boolean)],t.TkTextarea.prototype,"readonly",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"autocomplete",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"autocapitalize",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"pattern",void 0),e([at(),r("design:type",String)],t.TkTextarea.prototype,"initialValue",void 0),e([ot({type:String}),r("design:type",String)],t.TkTextarea.prototype,"label",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextarea.prototype,"minLength",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextarea.prototype,"maxLength",void 0),e([ot({type:Number}),r("design:type",Number)],t.TkTextarea.prototype,"rows",void 0),e([st({passive:!0}),r("design:type",Function),r("design:paramtypes",[]),r("design:returntype",void 0)],t.TkTextarea.prototype,"handleChange",null),t.TkTextarea=e([rt("tk-textarea")],t.TkTextarea);t.TkTheme=class extends tt{constructor(){super(...arguments),this.primary="#8970bf",this.onPrimary="#FFFFFF",this.accent="#E69A8D",this.onAccent="#FFFFFF",this.shade="#AAAAAA",this.onShade="#FFFFFF",this.error="#F44336",this.onError="#FFFFFF",this.foreground="#FFFFFF",this.background="#000",this.forceBody=!1,this.inverted=!1}render(){return I`<slot></slot>`}updated(){this.setThemeColor()}connectedCallback(){super.connectedCallback(),this.addEventListener("turn-theme-to-inverted",(()=>this.turnThemeToInverted()),{passive:!0}),this.addEventListener("turn-theme-to-non-inverted",(()=>this.turnThemeToNonInverted()),{passive:!0}),this.addEventListener("set-theme",this.setTheme),this.addEventListener("set-theme-font-size",this.setThemeFontSize)}disconnectedCallback(){this.removeEventListener("turn-theme-to-inverted",this.turnThemeToInverted),this.removeEventListener("turn-theme-to-non-inverted",this.turnThemeToNonInverted),this.removeEventListener("set-theme",this.setTheme),this.removeEventListener("set-theme-font-size",this.setThemeFontSize),super.disconnectedCallback()}setTheme(t){const e=t;this.background=e.detail.background?e.detail.background:this.background,this.foreground=e.detail.foreground?e.detail.foreground:this.foreground,this.primary=e.detail.primary?e.detail.primary:this.primary,this.onPrimary=e.detail.onPrimary?e.detail.onPrimary:this.onPrimary,this.accent=e.detail.accent?e.detail.accent:this.accent,this.onAccent=e.detail.onAccent?e.detail.onAccent:this.onAccent}setThemeFontSize(t){const e=t;console.log("ev",e),this.style.setProperty("--font-size",e.detail)}turnThemeToInverted(){this.inverted=!0,this.forceBody&&this.setBodyStyle()}turnThemeToNonInverted(){this.inverted=!1,this.forceBody&&this.setBodyStyle()}hexToHSL(t){const e=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})?$/i.exec(t);if(null==e)return["0","0%","0%"];const[,r,i,o]=e,a=parseInt(r,16)/255,n=parseInt(i,16)/255,s=parseInt(o,16)/255,l=Math.max(a,n,s),h=Math.min(a,n,s);let d=0,c=0,p=(l+h)/2;if(l!=h){const t=l-h;switch(c=p>.5?t/(2-l-h):t/(l+h),l){case a:d=(n-s)/t+(n<s?6:0);break;case n:d=(s-a)/t+2;break;case s:d=(a-n)/t+4}d/=6}return[(360*d).toString(),(100*c).toString()+"%",(100*p).toString()+"%"]}setThemeColor(){const t=this.hexToHSL(this.primary);this.style.setProperty("--primary-h",t[0]),this.style.setProperty("--primary-s",t[1]),this.style.setProperty("--primary-l",t[2]);const e=this.hexToHSL(this.onPrimary);this.style.setProperty("--on-primary-h",e[0]),this.style.setProperty("--on-primary-s",e[1]),this.style.setProperty("--on-primary-l",e[2]);const r=this.hexToHSL(this.accent);this.style.setProperty("--accent-h",r[0]),this.style.setProperty("--accent-s",r[1]),this.style.setProperty("--accent-l",r[2]);const i=this.hexToHSL(this.onAccent);this.style.setProperty("--on-accent-h",i[0]),this.style.setProperty("--on-accent-s",i[1]),this.style.setProperty("--on-accent-l",i[2]);const o=this.hexToHSL(this.shade);this.style.setProperty("--shade-h",o[0]),this.style.setProperty("--shade-s",o[1]),this.style.setProperty("--shade-l",o[2]);const a=this.hexToHSL(this.onShade);this.style.setProperty("--on-shade-h",a[0]),this.style.setProperty("--on-shade-s",a[1]),this.style.setProperty("--on-shade-l",a[2]);const n=this.hexToHSL(this.error);this.style.setProperty("--error-h",n[0]),this.style.setProperty("--error-s",n[1]),this.style.setProperty("--error-l",n[2]);const s=this.hexToHSL(this.onError);this.style.setProperty("--on-error-h",s[0]),this.style.setProperty("--on-error-s",s[1]),this.style.setProperty("--on-error-l",s[2]);const l=this.hexToHSL(this.foreground);this.style.setProperty("--theme-foreground",`hsl(${l[0]},${l[1]},${l[2]})`);const h=this.hexToHSL(this.background);this.style.setProperty("--theme-background",`hsl(${h[0]},${h[1]},${h[2]})`),this.forceBody&&this.setBodyStyle()}setBodyStyle(){let t=this.hexToHSL(this.foreground),e=this.hexToHSL(this.background);this.inverted&&(t=this.hexToHSL(this.background),e=this.hexToHSL(this.foreground)),document.body.style.setProperty("background",`hsl(${e[0]},${e[1]},${e[2]})`),document.body.style.setProperty("color",`hsl(${t[0]},${t[1]},${t[2]})`)}},t.TkTheme.styles=l`${s("*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--background:var(--theme-background);--foreground:var(--theme-foreground);--primary-lighter:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*1.3));--primary-light:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*1.15));--primary:hsl(var(--primary-h),var(--primary-s),var(--primary-l));--primary-dark:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*0.85));--primary-darker:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*0.7));--on-primary-lighter:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*1.3));--on-primary-light:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*1.15));--on-primary:hsl(var(--on-primary-h),var(--on-primary-s),var(--on-primary-l));--on-primary-dark:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*0.85));--on-primary-darker:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*0.7));--accent-lighter:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*1.3));--accent-light:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*1.15));--accent:hsl(var(--accent-h),var(--accent-s),var(--accent-l));--accent-dark:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*0.85));--accent-darker:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*0.7));--on-accent-lighter:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*1.3));--on-accent-light:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*1.15));--on-accent:hsl(var(--on-accent-h),var(--on-accent-s),var(--on-accent-l));--on-accent-dark:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*0.85));--on-accent-darker:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*0.7));--shade-lighter:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*1.3));--shade-light:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*1.15));--shade:hsl(var(--shade-h),var(--shade-s),var(--shade-l));--shade-dark:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*0.85));--shade-darker:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*0.7));--on-shade-lighter:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*1.3));--on-shade-light:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*1.15));--on-shade:hsl(var(--on-shade-h),var(--on-shade-s),var(--on-shade-l));--on-shade-dark:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*0.85));--on-shade-darker:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*0.7));--error-lighter:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*1.3));--error-light:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*1.15));--error:hsl(var(--error-h),var(--error-s),var(--error-l));--error-dark:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*0.85));--error-darker:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*0.7));--on-error-lighter:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*1.3));--on-error-light:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*1.15));--on-error:hsl(var(--on-error-h),var(--on-error-s),var(--on-error-l));--on-error-dark:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*0.85));--on-error-darker:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*0.7));--shadow-lighter:#0000001a;--shadow-light:#00000026;--shadow:#0003;--shadow-dark:#0006;--shadow-darker:#0009;background-color:var(--background);color:var(--foreground);font-family:var(--font-family,Roboto,sans-serif);font-size:var(--font-size,1rem)}:host([inverted]){--background:var(--theme-foreground);--foreground:var(--theme-background);--primary-lighter:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*0.7));--primary-light:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*0.85));--primary:hsl(var(--primary-h),var(--primary-s),var(--primary-l));--primary-dark:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*1.15));--primary-darker:hsl(var(--primary-h),var(--primary-s),calc(var(--primary-l)*1.3));--on-primary-lighter:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*0.7));--on-primary-light:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*0.85));--on-primary:hsl(var(--on-primary-h),var(--on-primary-s),var(--on-primary-l));--on-primary-dark:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*1.15));--on-primary-darker:hsl(var(--on-primary-h),var(--on-primary-s),calc(var(--on-primary-l)*1.3));--accent-lighter:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*0.7));--accent-light:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*0.85));--accent:hsl(var(--accent-h),var(--accent-s),var(--accent-l));--accent-dark:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*1.15));--accent-darker:hsl(var(--accent-h),var(--accent-s),calc(var(--accent-l)*1.3));--on-accent-lighter:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*0.7));--on-accent-light:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*0.85));--on-accent:hsl(var(--on-accent-h),var(--on-accent-s),var(--on-accent-l));--on-accent-dark:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*1.15));--on-accent-darker:hsl(var(--on-accent-h),var(--on-accent-s),calc(var(--on-accent-l)*1.3));--shade-lighter:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*0.7));--shade-light:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*0.85));--shade:hsl(var(--shade-h),var(--shade-s),var(--shade-l));--shade-dark:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*1.15));--shade-darker:hsl(var(--shade-h),var(--shade-s),calc(var(--shade-l)*1.3));--on-shade-lighter:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*0.7));--on-shade-light:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*0.85));--on-shade:hsl(var(--on-shade-h),var(--on-shade-s),var(--on-shade-l));--on-shade-dark:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*1.15));--on-shade-darker:hsl(var(--on-shade-h),var(--on-shade-s),calc(var(--on-shade-l)*1.3));--error-lighter:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*0.7));--error-light:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*0.85));--error:hsl(var(--error-h),var(--error-s),var(--error-l));--error-dark:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*1.15));--error-darker:hsl(var(--error-h),var(--error-s),calc(var(--error-l)*1.3));--on-error-lighter:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*0.7));--on-error-light:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*0.85));--on-error:hsl(var(--on-error-h),var(--on-error-s),var(--on-error-l));--on-error-dark:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*1.15));--on-error-darker:hsl(var(--on-error-h),var(--on-error-s),calc(var(--on-error-l)*1.3));--shadow-lighter:#ffffff1a;--shadow-light:#ffffff26;--shadow:#fff3;--shadow-dark:#fff6;--shadow-darker:#fff9}")}`,e([ot(),r("design:type",String)],t.TkTheme.prototype,"primary",void 0),e([ot({attribute:"on-primary"}),r("design:type",String)],t.TkTheme.prototype,"onPrimary",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"accent",void 0),e([ot({attribute:"on-accent"}),r("design:type",String)],t.TkTheme.prototype,"onAccent",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"shade",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"onShade",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"error",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"onError",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"foreground",void 0),e([ot(),r("design:type",String)],t.TkTheme.prototype,"background",void 0),e([ot({type:Boolean,attribute:"force-body",reflect:!0}),r("design:type",Boolean)],t.TkTheme.prototype,"forceBody",void 0),e([ot({type:Boolean,attribute:!0,reflect:!0}),r("design:type",Boolean)],t.TkTheme.prototype,"inverted",void 0),t.TkTheme=e([rt("tk-theme")],t.TkTheme),Object.defineProperty(t,"__esModule",{value:!0})}));