godown 2.6.0 → 2.6.1

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 (109) hide show
  1. package/lib/event-collection.d.ts +1 -1
  2. package/package.json +4 -4
  3. package/react/index.d.ts +0 -1
  4. package/react/index.d.ts.map +1 -1
  5. package/react/index.js +0 -3
  6. package/react/index.js.map +1 -1
  7. package/web-components/a/avatar-a.js +40 -40
  8. package/web-components/a/avatar-a.js.map +1 -1
  9. package/web-components/a/super-a.js +22 -22
  10. package/web-components/a/super-a.js.map +1 -1
  11. package/web-components/button/base-button.js +86 -86
  12. package/web-components/button/base-button.js.map +1 -1
  13. package/web-components/carousel/carousel-slider.d.ts +1 -1
  14. package/web-components/carousel/carousel-slider.d.ts.map +1 -1
  15. package/web-components/carousel/carousel-slider.js +70 -70
  16. package/web-components/carousel/carousel-slider.js.map +1 -1
  17. package/web-components/form/base-form.js +15 -15
  18. package/web-components/form/base-form.js.map +1 -1
  19. package/web-components/group/avatar-group.js +13 -13
  20. package/web-components/group/avatar-group.js.map +1 -1
  21. package/web-components/group/details-group.js +7 -7
  22. package/web-components/group/details-group.js.map +1 -1
  23. package/web-components/group/tab-group.js +45 -45
  24. package/web-components/group/tab-group.js.map +1 -1
  25. package/web-components/index.d.ts +0 -1
  26. package/web-components/index.d.ts.map +1 -1
  27. package/web-components/index.js +0 -1
  28. package/web-components/index.js.map +1 -1
  29. package/web-components/input/base-input.js +73 -73
  30. package/web-components/input/base-input.js.map +1 -1
  31. package/web-components/input/input.js +15 -15
  32. package/web-components/input/input.js.map +1 -1
  33. package/web-components/input/label-input.js +49 -49
  34. package/web-components/input/label-input.js.map +1 -1
  35. package/web-components/input/search-input.js +53 -53
  36. package/web-components/input/search-input.js.map +1 -1
  37. package/web-components/input/select-input.js +88 -88
  38. package/web-components/input/select-input.js.map +1 -1
  39. package/web-components/input/split-input.js +51 -51
  40. package/web-components/input/split-input.js.map +1 -1
  41. package/web-components/input/switch-input.js +36 -36
  42. package/web-components/input/switch-input.js.map +1 -1
  43. package/web-components/items/alert-item.js +32 -33
  44. package/web-components/items/alert-item.js.map +1 -1
  45. package/web-components/items/card-item.js +54 -54
  46. package/web-components/items/card-item.js.map +1 -1
  47. package/web-components/items/drag-box.js +8 -8
  48. package/web-components/items/drag-box.js.map +1 -1
  49. package/web-components/items/time-bar.js +8 -9
  50. package/web-components/items/time-bar.js.map +1 -1
  51. package/web-components/layout/divider-line.js +11 -11
  52. package/web-components/layout/divider-line.js.map +1 -1
  53. package/web-components/layout/flex-flow.js +7 -7
  54. package/web-components/layout/flex-flow.js.map +1 -1
  55. package/web-components/layout/nav-aside.js +14 -14
  56. package/web-components/layout/nav-aside.js.map +1 -1
  57. package/web-components/layout/nav-layout.js +26 -26
  58. package/web-components/layout/nav-layout.js.map +1 -1
  59. package/web-components/loading/loading-progress.d.ts +1 -1
  60. package/web-components/loading/loading-progress.d.ts.map +1 -1
  61. package/web-components/loading/loading-progress.js +28 -28
  62. package/web-components/loading/loading-progress.js.map +1 -1
  63. package/web-components/loading/skeleton-screen.js +19 -19
  64. package/web-components/loading/skeleton-screen.js.map +1 -1
  65. package/web-components/open/open-details.d.ts.map +1 -1
  66. package/web-components/open/open-details.js +73 -22
  67. package/web-components/open/open-details.js.map +1 -1
  68. package/web-components/open/open-dialog.d.ts +5 -16
  69. package/web-components/open/open-dialog.d.ts.map +1 -1
  70. package/web-components/open/open-dialog.js +92 -102
  71. package/web-components/open/open-dialog.js.map +1 -1
  72. package/web-components/open/open-offset.d.ts +0 -1
  73. package/web-components/open/open-offset.d.ts.map +1 -1
  74. package/web-components/open/open-offset.js +50 -53
  75. package/web-components/open/open-offset.js.map +1 -1
  76. package/web-components/open/open-tooltip.d.ts +2 -2
  77. package/web-components/open/open-tooltip.d.ts.map +1 -1
  78. package/web-components/open/open-tooltip.js +14 -15
  79. package/web-components/open/open-tooltip.js.map +1 -1
  80. package/web-components/open/open.d.ts +3 -2
  81. package/web-components/open/open.d.ts.map +1 -1
  82. package/web-components/open/open.js +13 -59
  83. package/web-components/open/open.js.map +1 -1
  84. package/web-components/text/clip-text.js +8 -8
  85. package/web-components/text/clip-text.js.map +1 -1
  86. package/web-components/text/overbreath-text.js +17 -17
  87. package/web-components/text/overbreath-text.js.map +1 -1
  88. package/web-components/text/typewriter-text.js +32 -32
  89. package/web-components/text/typewriter-text.js.map +1 -1
  90. package/web-components/view/route-view.d.ts +2 -2
  91. package/web-components/view/route-view.js +7 -7
  92. package/web-components/view/route-view.js.map +1 -1
  93. package/web-components/view/scroll-x.js +29 -29
  94. package/web-components/view/scroll-x.js.map +1 -1
  95. package/web-components/view/wrap-view.d.ts +1 -1
  96. package/web-components/view/wrap-view.js +15 -15
  97. package/web-components/view/wrap-view.js.map +1 -1
  98. package/open-list.d.ts +0 -2
  99. package/open-list.d.ts.map +0 -1
  100. package/open-list.js +0 -2
  101. package/open-list.js.map +0 -1
  102. package/web-components/layout/index.d.ts +0 -5
  103. package/web-components/layout/index.d.ts.map +0 -1
  104. package/web-components/layout/index.js +0 -6
  105. package/web-components/layout/index.js.map +0 -1
  106. package/web-components/open/open-list.d.ts +0 -20
  107. package/web-components/open/open-list.d.ts.map +0 -1
  108. package/web-components/open/open-list.js +0 -71
  109. package/web-components/open/open-list.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"alert-item.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/items/alert-item.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, property, unsafeCSS } from \"../../deps.js\";\nimport { htmlSlot, type HTMLTemplate, svgX } from \"../../lib/templates.js\";\nimport { constructCSS } from \"../../lib/utils.js\";\nimport { createScope, define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"alert-item\";\nconst cssvarScope = createScope(defineName);\n\nconst currentColor = \"currentColor\";\n\nconst vars = [\"color\", \"background\", \"border\", \"super\"].map((v) => `${cssvarScope}--${v}`);\nconst colors = {\n success: [\"#3c763d\", \"#dff0d8\", \"#d6e9c6\", \"#2b542c\"],\n info: [\"#31708f\", \"#d9edf7\", \"#bce8f1\", \"#245269\"],\n warning: [\"#8a6d3b\", \"#fcf8e3\", \"#faebcc\", \"#66512c\"],\n danger: [\"#a94442\", \"#f2dede\", \"#ebccd1\", \"#843534\"],\n inherit: [currentColor, \"inherit\", currentColor, currentColor],\n};\n\n/**\n * AlertItem renders a alert.\n *\n * Inspired by Ant-design.\n */\n@define(defineName)\nexport class AlertItem extends GodownElement {\n /**\n * Type of performance.\n */\n @property() call: keyof typeof colors | \"hide\" = \"info\";\n /**\n * Close delay.\n */\n @property({ type: Number }) autoclose = 3000;\n /**\n * Alert title.\n */\n @property() title = \"\";\n /**\n * Alert content.\n */\n @property() content = \"\";\n\n static styles = [\n unsafeCSS(\n constructCSS(vars, colors, (raw) => {\n return `.${raw}`;\n }),\n ),\n css`\n :host {\n ${cssvarScope}--padding: .05em .25em .05em .35em;\n ${cssvarScope}--border-width: 0.15em;\n ${cssvarScope}--border-radius: 0.4em;\n border-radius: var(${cssvarScope}--border-radius);\n margin: 0 auto;\n display: block;\n }\n\n .hide {\n opacity: 0;\n transform: translateY(-100%);\n }\n\n .alert {\n transition: 0.25s;\n display: flex;\n justify-content: space-between;\n padding: var(${cssvarScope}--padding);\n border-radius: inherit;\n border: var(${cssvarScope}--border-width) solid var(${cssvarScope}--border);\n color: var(${cssvarScope}--color);\n background: var(${cssvarScope}--background);\n animation: alert 0.25s ease-in-out;\n }\n\n @keyframes alert {\n 0% {\n opacity: 0;\n transform: translateY(-50%);\n }\n 100% {\n opacity: 1;\n transform: none;\n }\n }\n\n div {\n min-height: 1.5em;\n line-height: 1.5em;\n }\n\n .close {\n height: fit-content;\n width: fit-content;\n border-radius: 50%;\n transition: inherit;\n }\n\n .close:hover {\n backdrop-filter: contrast(115%);\n }\n\n svg {\n display: block;\n height: 1.6em;\n width: 1.6em;\n }\n\n .close:hover path {\n stroke: var(${cssvarScope}--super);\n }\n\n path {\n stroke: var(${cssvarScope}--color);\n }\n `,\n ];\n\n protected render(): HTMLTemplate {\n if (this.autoclose) {\n setTimeout(() => this.close(), this.autoclose);\n }\n return html`<main class=\"${this.call} alert\">\n <div>\n <strong> ${this.title || htmlSlot(\"title\")}</strong>\n ${this.content || htmlSlot()}\n </div>\n <aside class=\"close\" @click=\"${this.close}\">${htmlSlot(\"close\", svgX(), this)}</aside>\n </main>`;\n }\n\n close() {\n this.shadowRoot.querySelector(\".alert\").classList.add(\"hide\");\n setTimeout(() => {\n this.remove();\n }, 250);\n }\n\n static alert(root: HTMLElement, option: Partial<AlertItem>): AlertItem {\n const ai = new AlertItem();\n Object.assign(ai, option);\n root.appendChild(ai);\n return ai;\n }\n}\n\nexport default AlertItem;\ndeclare global {\n interface HTMLElementTagNameMap {\n \"alert-item\": AlertItem;\n }\n}\n"]}
1
+ {"version":3,"file":"alert-item.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/items/alert-item.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, property, unsafeCSS } from \"../../deps.js\";\nimport { htmlSlot, type HTMLTemplate, svgX } from \"../../lib/templates.js\";\nimport { constructCSS } from \"../../lib/utils.js\";\nimport { createScope, define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"alert-item\";\nconst cssvarScope = createScope(defineName);\n\nconst currentColor = \"currentColor\";\n\nconst vars = [\"color\", \"background\", \"border\", \"super\"].map((v) => `${cssvarScope}--${v}`);\nconst colors = {\n success: [\"#3c763d\", \"#dff0d8\", \"#d6e9c6\", \"#2b542c\"],\n info: [\"#31708f\", \"#d9edf7\", \"#bce8f1\", \"#245269\"],\n warning: [\"#8a6d3b\", \"#fcf8e3\", \"#faebcc\", \"#66512c\"],\n danger: [\"#a94442\", \"#f2dede\", \"#ebccd1\", \"#843534\"],\n inherit: [currentColor, \"inherit\", currentColor, currentColor],\n};\n\n/**\n * AlertItem renders a alert.\n *\n * Inspired by Ant-design.\n */\n@define(defineName)\nexport class AlertItem extends GodownElement {\n /**\n * Type of performance.\n */\n @property() call: keyof typeof colors | \"hide\" = \"info\";\n /**\n * Close delay.\n */\n @property({ type: Number }) autoclose = 3000;\n /**\n * Alert title.\n */\n @property() title = \"\";\n /**\n * Alert content.\n */\n @property() content = \"\";\n\n static styles = [\n unsafeCSS(\n constructCSS(vars, colors, (raw) => {\n return `.${raw}`;\n }),\n ),\n css`\n :host {\n ${cssvarScope}--padding: .05em .25em .05em .35em;\n ${cssvarScope}--border-width: 0.15em;\n ${cssvarScope}--border-radius: 0.4em;\n border-radius: var(${cssvarScope}--border-radius);\n margin: 0 auto;\n display: block;\n }\n\n .hide {\n opacity: 0;\n transform: translateY(-100%);\n }\n\n .alert {\n transition: 0.25s;\n display: flex;\n justify-content: space-between;\n padding: var(${cssvarScope}--padding);\n border-radius: inherit;\n border: var(${cssvarScope}--border-width) solid var(${cssvarScope}--border);\n color: var(${cssvarScope}--color);\n background: var(${cssvarScope}--background);\n animation: alert 0.25s ease-in-out;\n }\n\n @keyframes alert {\n 0% {\n opacity: 0;\n transform: translateY(-50%);\n }\n 100% {\n opacity: 1;\n transform: none;\n }\n }\n\n div {\n min-height: 1.5em;\n line-height: 1.5em;\n }\n\n .close {\n height: fit-content;\n width: fit-content;\n border-radius: 50%;\n transition: inherit;\n }\n\n .close:hover {\n backdrop-filter: contrast(115%);\n }\n\n svg {\n display: block;\n height: 1.6em;\n width: 1.6em;\n }\n\n .close:hover path {\n stroke: var(${cssvarScope}--super);\n }\n\n path {\n stroke: var(${cssvarScope}--color);\n }\n `,\n ];\n\n protected render(): HTMLTemplate {\n if (this.autoclose) {\n setTimeout(() => this.close(), this.autoclose);\n }\n return html`<main class=\"${this.call} alert\">\n <div>\n <strong> ${this.title || htmlSlot(\"title\")}</strong>\n ${this.content || htmlSlot()}\n </div>\n <aside class=\"close\" @click=\"${this.close}\">${htmlSlot(\"close\", svgX(), this)}</aside>\n </main>`;\n }\n\n close() {\n this.shadowRoot.querySelector(\".alert\").classList.add(\"hide\");\n setTimeout(() => {\n this.remove();\n }, 250);\n }\n\n static alert(root: HTMLElement, option: Partial<AlertItem>): AlertItem {\n const ai = new AlertItem();\n Object.assign(ai, option);\n root.appendChild(ai);\n return ai;\n }\n}\n\nexport default AlertItem;\ndeclare global {\n interface HTMLElementTagNameMap {\n \"alert-item\": AlertItem;\n }\n}\n"]}
@@ -16,17 +16,65 @@ let CardItem = class CardItem extends GodownElement {
16
16
  */
17
17
  this.rotate = false;
18
18
  }
19
- static { this.styles = [
20
- GodownElement.styles,
21
- css `
19
+ render() {
20
+ const HEADER = "header";
21
+ const FOOTER = "footer";
22
+ return html `<div>
23
+ <aside></aside>
24
+ <main>
25
+ ${ifValue(this.querySlot(HEADER), html `
26
+ ${htmlSlot(HEADER)}
27
+ <hr />
28
+ `)}
29
+ ${htmlSlot()}
30
+ ${ifValue(this.querySlot(FOOTER), html `
31
+ <hr />
32
+ ${htmlSlot(FOOTER)}
33
+ `)}
34
+ </main>
35
+ </div>`;
36
+ }
37
+ firstUpdated() {
38
+ if (this.rotate) {
39
+ this.addEvent(this._main, "mousemove", this._drawRotate.bind(this));
40
+ this.addEvent(this._aside, "mouseleave", this.reset.bind(this));
41
+ }
42
+ }
43
+ /**
44
+ * Cancel the aside offset.
45
+ */
46
+ reset() {
47
+ this._main.style.transition = ".5s";
48
+ this._main.style.transform = "none";
49
+ }
50
+ /**
51
+ * Offset aside.
52
+ * @param e Mouse move event.
53
+ */
54
+ _drawRotate(e) {
55
+ const { left, top, width, height } = this._main.getBoundingClientRect();
56
+ const { clientX, clientY } = e;
57
+ const offsetX = clientX - left;
58
+ const offsetY = clientY - top;
59
+ const rotate = 30;
60
+ const rotateX = -(rotate * (offsetY - height / 2)) / height / 1.5;
61
+ const rotateY = (rotate * (offsetX - width / 2)) / width / 1.5;
62
+ this._main.style.transform = `rotateX(${rotateX}deg) rotateY(${rotateY}deg)`;
63
+ this._main.style.transition = "none";
64
+ }
65
+ };
66
+ CardItem.styles = [
67
+ GodownElement.styles,
68
+ css `
22
69
  :host {
23
70
  ${cssvarScope}--offset: .25em;
24
71
  ${cssvarScope}--background: var(${cssvarValues.main});
25
72
  ${cssvarScope}--wapper-background: none;
26
73
  ${cssvarScope}--outline: 0;
27
- ${cssvarScope}--box-shadow: 0 .05em .4em 0 rgb(var(${cssvarValues.mainRGB}) / 60%);
74
+ ${cssvarScope}--box-shadow: 0 .05em 1.2em 0 rgb(var(${cssvarValues.textRGB}) / 12%);
28
75
  ${cssvarScope}--hr-width: 100%;
29
76
  ${cssvarScope}--hr-height: .05em;
77
+ ${cssvarScope}--hr-background: #80808080;
30
78
  ${cssvarScope}--padding: .75em;
31
79
  margin: auto;
32
80
  display: block;
@@ -75,8 +123,7 @@ let CardItem = class CardItem extends GodownElement {
75
123
  height: var(${cssvarScope}--hr-height);
76
124
  margin: auto;
77
125
  display: block;
78
- background: currentColor;
79
- opacity: 0.5;
126
+ background: var(${cssvarScope}--hr-background);
80
127
  }
81
128
 
82
129
  slot {
@@ -84,54 +131,7 @@ let CardItem = class CardItem extends GodownElement {
84
131
  padding: var(${cssvarScope}--padding);
85
132
  }
86
133
  `,
87
- ]; }
88
- render() {
89
- const HEADER = "header";
90
- const FOOTER = "footer";
91
- return html `<div>
92
- <aside></aside>
93
- <main>
94
- ${ifValue(this.querySlot(HEADER), html `
95
- ${htmlSlot(HEADER)}
96
- <hr />
97
- `)}
98
- ${htmlSlot()}
99
- ${ifValue(this.querySlot(FOOTER), html `
100
- <hr />
101
- ${htmlSlot(FOOTER)}
102
- `)}
103
- </main>
104
- </div>`;
105
- }
106
- firstUpdated() {
107
- if (this.rotate) {
108
- this.addEvent(this._main, "mousemove", this._drawRotate.bind(this));
109
- this.addEvent(this._aside, "mouseleave", this.reset.bind(this));
110
- }
111
- }
112
- /**
113
- * Cancel the aside offset.
114
- */
115
- reset() {
116
- this._main.style.transition = ".5s";
117
- this._main.style.transform = "none";
118
- }
119
- /**
120
- * Offset aside.
121
- * @param e Mouse move event.
122
- */
123
- _drawRotate(e) {
124
- const { left, top, width, height } = this._main.getBoundingClientRect();
125
- const { clientX, clientY } = e;
126
- const offsetX = clientX - left;
127
- const offsetY = clientY - top;
128
- const rotate = 30;
129
- const rotateX = -(rotate * (offsetY - height / 2)) / height / 1.5;
130
- const rotateY = (rotate * (offsetX - width / 2)) / width / 1.5;
131
- this._main.style.transform = `rotateX(${rotateX}deg) rotateY(${rotateY}deg)`;
132
- this._main.style.transition = "none";
133
- }
134
- };
134
+ ];
135
135
  __decorate([
136
136
  property({ type: Boolean })
137
137
  ], CardItem.prototype, "rotate", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"card-item.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/items/card-item.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAuB,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAChF,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAClD,OAAO,EAAE,QAAQ,EAAqB,MAAM,wBAAwB,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEjF,MAAM,UAAU,GAAG,WAAW,CAAC;AAC/B,MAAM,WAAW,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;AAE5C;;GAEG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,aAAa;IAApC;;QACL;;WAEG;QAC0B,WAAM,GAAG,KAAK,CAAC;IAkI9C,CAAC;aA7HQ,WAAM,GAAG;QACd,aAAa,CAAC,MAAM;QACpB,GAAG,CAAA;;UAEG,WAAW;UACX,WAAW,qBAAqB,YAAY,CAAC,IAAI;UACjD,WAAW;UACX,WAAW;UACX,WAAW,wCAAwC,YAAY,CAAC,OAAO;UACvE,WAAW;UACX,WAAW;UACX,WAAW;;;;qBAIA,YAAY,CAAC,IAAI;;;;;;;;;;;uBAWf,WAAW;0BACR,WAAW;0BACX,WAAW;;;;;;;;;;;0BAWX,WAAW;;uBAEd,WAAW;gCACF,WAAW;;;;;;;;;;;;;qBAatB,WAAW;sBACV,WAAW;;;;;;;;;uBASV,WAAW;;KAE7B;KACgB,AApEN,CAoEO;IAEV,MAAM;QACd,MAAM,MAAM,GAAG,QAAQ,CAAC;QACxB,MAAM,MAAM,GAAG,QAAQ,CAAC;QACxB,OAAO,IAAI,CAAA;;;UAGL,OAAO,CACP,IAAI,CAAC,SAAS,CAAC,MAAM,CAAuB,EAC5C,IAAI,CAAA;cACA,QAAQ,CAAC,MAAM,CAAC;;WAEnB,CACF;UACC,QAAQ,EAAE;UACV,OAAO,CACP,IAAI,CAAC,SAAS,CAAC,MAAM,CAAuB,EAC5C,IAAI,CAAA;;cAEA,QAAQ,CAAC,MAAM,CAAC;WACnB,CACF;;WAEE,CAAC;IACV,CAAC;IAES,YAAY;QACpB,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;YACpE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,EAAE,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAClE,CAAC;IACH,CAAC;IAED;;OAEG;IACH,KAAK;QACH,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,GAAG,KAAK,CAAC;QACpC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IACtC,CAAC;IAED;;;OAGG;IACO,WAAW,CAAC,CAAa;QACjC,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,qBAAqB,EAAE,CAAC;QACxE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,CAAC,CAAC;QAC/B,MAAM,OAAO,GAAG,OAAO,GAAG,IAAI,CAAC;QAC/B,MAAM,OAAO,GAAG,OAAO,GAAG,GAAG,CAAC;QAC9B,MAAM,MAAM,GAAG,EAAE,CAAC;QAClB,MAAM,OAAO,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,OAAO,GAAG,MAAM,GAAG,CAAC,CAAC,CAAC,GAAG,MAAM,GAAG,GAAG,CAAC;QAClE,MAAM,OAAO,GAAG,CAAC,MAAM,GAAG,CAAC,OAAO,GAAG,KAAK,GAAG,CAAC,CAAC,CAAC,GAAG,KAAK,GAAG,GAAG,CAAC;QAC/D,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS,GAAG,WAAW,OAAO,gBAAgB,OAAO,MAAM,CAAC;QAC7E,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,GAAG,MAAM,CAAC;IACvC,CAAC;;AAjI4B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wCAAgB;AAEnB;IAAxB,KAAK,CAAC,MAAM,CAAC;uCAA+B;AACnB;IAAzB,KAAK,CAAC,OAAO,CAAC;wCAAgC;AAPpC,QAAQ;IADpB,MAAM,CAAC,UAAU,CAAC;GACN,QAAQ,CAsIpB;;AAED,eAAe,QAAQ,CAAC","sourcesContent":["import { css, type CSSResultGroup, html, property, query } from \"../../deps.js\";\nimport { ifValue } from \"../../lib/directives.js\";\nimport { htmlSlot, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { createScope, cssvarValues, define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"card-item\";\nconst cssvarScope = createScope(defineName);\n\n/**\n * CardItem renders a card.\n */\n@define(defineName)\nexport class CardItem extends GodownElement {\n /**\n * Enable rotate.\n */\n @property({ type: Boolean }) rotate = false;\n\n @query(\"main\") protected _main!: HTMLElement;\n @query(\"aside\") protected _aside!: HTMLElement;\n\n static styles = [\n GodownElement.styles,\n css`\n :host {\n ${cssvarScope}--offset: .25em;\n ${cssvarScope}--background: var(${cssvarValues.main});\n ${cssvarScope}--wapper-background: none;\n ${cssvarScope}--outline: 0;\n ${cssvarScope}--box-shadow: 0 .05em .4em 0 rgb(var(${cssvarValues.mainRGB}) / 60%);\n ${cssvarScope}--hr-width: 100%;\n ${cssvarScope}--hr-height: .05em;\n ${cssvarScope}--padding: .75em;\n margin: auto;\n display: block;\n width: fit-content;\n color: var(${cssvarValues.text});\n border-radius: 0.2em;\n }\n\n * {\n border-radius: inherit;\n min-height: inherit;\n min-width: inherit;\n }\n\n main {\n outline: var(${cssvarScope}--outline);\n box-shadow: var(${cssvarScope}--box-shadow);\n background: var(${cssvarScope}--background);\n z-index: 2;\n position: relative;\n }\n\n aside {\n box-sizing: content-box;\n z-index: 0;\n height: 100%;\n width: 100%;\n position: absolute;\n background: var(${cssvarScope}--wapper-background);\n filter: blur(1em);\n padding: var(${cssvarScope}--offset);\n margin: calc(-1 * var(${cssvarScope}--offset));\n }\n\n div {\n width: fit-content;\n position: relative;\n }\n\n i {\n position: absolute;\n }\n\n hr {\n width: var(${cssvarScope}--hr-width);\n height: var(${cssvarScope}--hr-height);\n margin: auto;\n display: block;\n background: currentColor;\n opacity: 0.5;\n }\n\n slot {\n display: block;\n padding: var(${cssvarScope}--padding);\n }\n `,\n ] as CSSResultGroup;\n\n protected render(): HTMLTemplate {\n const HEADER = \"header\";\n const FOOTER = \"footer\";\n return html`<div>\n <aside></aside>\n <main>\n ${ifValue(\n this.querySlot(HEADER) as unknown as boolean,\n html`\n ${htmlSlot(HEADER)}\n <hr />\n `,\n )}\n ${htmlSlot()}\n ${ifValue(\n this.querySlot(FOOTER) as unknown as boolean,\n html`\n <hr />\n ${htmlSlot(FOOTER)}\n `,\n )}\n </main>\n </div>`;\n }\n\n protected firstUpdated() {\n if (this.rotate) {\n this.addEvent(this._main, \"mousemove\", this._drawRotate.bind(this));\n this.addEvent(this._aside, \"mouseleave\", this.reset.bind(this));\n }\n }\n\n /**\n * Cancel the aside offset.\n */\n reset() {\n this._main.style.transition = \".5s\";\n this._main.style.transform = \"none\";\n }\n\n /**\n * Offset aside.\n * @param e Mouse move event.\n */\n protected _drawRotate(e: MouseEvent) {\n const { left, top, width, height } = this._main.getBoundingClientRect();\n const { clientX, clientY } = e;\n const offsetX = clientX - left;\n const offsetY = clientY - top;\n const rotate = 30;\n const rotateX = -(rotate * (offsetY - height / 2)) / height / 1.5;\n const rotateY = (rotate * (offsetX - width / 2)) / width / 1.5;\n this._main.style.transform = `rotateX(${rotateX}deg) rotateY(${rotateY}deg)`;\n this._main.style.transition = \"none\";\n }\n}\n\nexport default CardItem;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"card-item\": CardItem;\n }\n}\n"]}
1
+ {"version":3,"file":"card-item.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/items/card-item.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, type CSSResultGroup, html, property, query } from \"../../deps.js\";\nimport { ifValue } from \"../../lib/directives.js\";\nimport { htmlSlot, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { createScope, cssvarValues, define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"card-item\";\nconst cssvarScope = createScope(defineName);\n\n/**\n * CardItem renders a card.\n */\n@define(defineName)\nexport class CardItem extends GodownElement {\n /**\n * Enable rotate.\n */\n @property({ type: Boolean }) rotate = false;\n\n @query(\"main\") protected _main!: HTMLElement;\n @query(\"aside\") protected _aside!: HTMLElement;\n\n static styles = [\n GodownElement.styles,\n css`\n :host {\n ${cssvarScope}--offset: .25em;\n ${cssvarScope}--background: var(${cssvarValues.main});\n ${cssvarScope}--wapper-background: none;\n ${cssvarScope}--outline: 0;\n ${cssvarScope}--box-shadow: 0 .05em 1.2em 0 rgb(var(${cssvarValues.textRGB}) / 12%);\n ${cssvarScope}--hr-width: 100%;\n ${cssvarScope}--hr-height: .05em;\n ${cssvarScope}--hr-background: #80808080;\n ${cssvarScope}--padding: .75em;\n margin: auto;\n display: block;\n width: fit-content;\n color: var(${cssvarValues.text});\n border-radius: 0.2em;\n }\n\n * {\n border-radius: inherit;\n min-height: inherit;\n min-width: inherit;\n }\n\n main {\n outline: var(${cssvarScope}--outline);\n box-shadow: var(${cssvarScope}--box-shadow);\n background: var(${cssvarScope}--background);\n z-index: 2;\n position: relative;\n }\n\n aside {\n box-sizing: content-box;\n z-index: 0;\n height: 100%;\n width: 100%;\n position: absolute;\n background: var(${cssvarScope}--wapper-background);\n filter: blur(1em);\n padding: var(${cssvarScope}--offset);\n margin: calc(-1 * var(${cssvarScope}--offset));\n }\n\n div {\n width: fit-content;\n position: relative;\n }\n\n i {\n position: absolute;\n }\n\n hr {\n width: var(${cssvarScope}--hr-width);\n height: var(${cssvarScope}--hr-height);\n margin: auto;\n display: block;\n background: var(${cssvarScope}--hr-background);\n }\n\n slot {\n display: block;\n padding: var(${cssvarScope}--padding);\n }\n `,\n ] as CSSResultGroup;\n\n protected render(): HTMLTemplate {\n const HEADER = \"header\";\n const FOOTER = \"footer\";\n return html`<div>\n <aside></aside>\n <main>\n ${ifValue(\n this.querySlot(HEADER) as unknown as boolean,\n html`\n ${htmlSlot(HEADER)}\n <hr />\n `,\n )}\n ${htmlSlot()}\n ${ifValue(\n this.querySlot(FOOTER) as unknown as boolean,\n html`\n <hr />\n ${htmlSlot(FOOTER)}\n `,\n )}\n </main>\n </div>`;\n }\n\n protected firstUpdated() {\n if (this.rotate) {\n this.addEvent(this._main, \"mousemove\", this._drawRotate.bind(this));\n this.addEvent(this._aside, \"mouseleave\", this.reset.bind(this));\n }\n }\n\n /**\n * Cancel the aside offset.\n */\n reset() {\n this._main.style.transition = \".5s\";\n this._main.style.transform = \"none\";\n }\n\n /**\n * Offset aside.\n * @param e Mouse move event.\n */\n protected _drawRotate(e: MouseEvent) {\n const { left, top, width, height } = this._main.getBoundingClientRect();\n const { clientX, clientY } = e;\n const offsetX = clientX - left;\n const offsetY = clientY - top;\n const rotate = 30;\n const rotateX = -(rotate * (offsetY - height / 2)) / height / 1.5;\n const rotateY = (rotate * (offsetX - width / 2)) / width / 1.5;\n this._main.style.transform = `rotateX(${rotateX}deg) rotateY(${rotateY}deg)`;\n this._main.style.transition = \"none\";\n }\n}\n\nexport default CardItem;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"card-item\": CardItem;\n }\n}\n"]}
@@ -18,14 +18,6 @@ let DragBox = class DragBox extends GodownElement {
18
18
  */
19
19
  this.y = "auto";
20
20
  }
21
- static { this.styles = [
22
- css `
23
- :host {
24
- position: relative;
25
- display: inline-flex;
26
- }
27
- `,
28
- ]; }
29
21
  render() {
30
22
  return html `<div @mousedown="${this._handleDragStart}" @mouseup="${this._handleDragEnd}">${htmlSlot()}</div>`;
31
23
  }
@@ -81,6 +73,14 @@ let DragBox = class DragBox extends GodownElement {
81
73
  }
82
74
  }
83
75
  };
76
+ DragBox.styles = [
77
+ css `
78
+ :host {
79
+ position: relative;
80
+ display: inline-flex;
81
+ }
82
+ `,
83
+ ];
84
84
  __decorate([
85
85
  property()
86
86
  ], DragBox.prototype, "x", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"drag-box.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/items/drag-box.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, property } from \"../../deps.js\";\nimport { htmlSlot, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"drag-box\";\n\n/**\n * The DragBox does not extend beyond the range of {@linkcode DragBox.offsetsWidth} and {@linkcode DragBox.offsetsHeight}.\n */\n@define(defineName)\nexport class DragBox extends GodownElement {\n drag: boolean;\n t: number;\n l: number;\n cx: number;\n cy: number;\n\n /**\n * Position x.\n */\n @property() x = \"auto\";\n /**\n * Position y.\n */\n @property() y = \"auto\";\n\n static styles = [\n css`\n :host {\n position: relative;\n display: inline-flex;\n }\n `,\n ];\n\n protected render(): HTMLTemplate {\n return html`<div @mousedown=\"${this._handleDragStart}\" @mouseup=\"${this._handleDragEnd}\">${htmlSlot()}</div>`;\n }\n\n protected firstUpdated() {\n this.reset();\n this.addEvent(document, \"mouseup\", this._handleDragEnd.bind(this));\n }\n\n protected _handleDragStart(e: MouseEvent) {\n this.cx = e.clientX;\n this.cy = e.clientY;\n this.t = this.offsetTop;\n this.l = this.offsetLeft;\n this.drag = true;\n this.addEvent(document, \"mousemove\", this._handleDrag.bind(this), undefined, \"0\");\n }\n\n protected _handleDragEnd() {\n this.drag = false;\n this.removeEvent(document, \"mousemove\", \"0\");\n }\n\n protected _handleDrag(e: MouseEvent) {\n if (!this.drag) {\n return;\n }\n const nl = e.clientX - (this.cx - this.l);\n const nt = e.clientY - (this.cy - this.t);\n if (nl < 0) {\n this.style.left = \"0\";\n } else if (nl < this.offsetsWidth - this.offsetWidth) {\n this.style.left = `${nl}px`;\n } else {\n this.style.left = `${this.offsetsWidth - this.offsetWidth}\"px\"`;\n }\n if (nt < 0) {\n this.style.top = \"0\";\n } else if (nt < this.offsetsHeight - this.offsetHeight) {\n this.style.top = `${nt}px`;\n } else {\n this.style.top = `${this.offsetsHeight - this.offsetHeight}px`;\n }\n }\n\n reset() {\n this.style.left = this.x || \"0\";\n this.style.top = this.y || \"0\";\n if (this.offsetLeft > this.offsetsWidth - this.offsetWidth) {\n this.style.left = `${this.offsetsWidth - this.offsetWidth}px`;\n }\n if (this.offsetTop > this.offsetsHeight - this.offsetHeight) {\n this.style.top = `${this.offsetsHeight - this.offsetHeight}px`;\n }\n }\n}\n\nexport default DragBox;\ndeclare global {\n interface HTMLElementTagNameMap {\n \"drag-box\": DragBox;\n }\n}\n"]}
1
+ {"version":3,"file":"drag-box.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/items/drag-box.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, property } from \"../../deps.js\";\nimport { htmlSlot, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"drag-box\";\n\n/**\n * The DragBox does not extend beyond the range of {@linkcode DragBox.offsetsWidth} and {@linkcode DragBox.offsetsHeight}.\n */\n@define(defineName)\nexport class DragBox extends GodownElement {\n drag: boolean;\n t: number;\n l: number;\n cx: number;\n cy: number;\n\n /**\n * Position x.\n */\n @property() x = \"auto\";\n /**\n * Position y.\n */\n @property() y = \"auto\";\n\n static styles = [\n css`\n :host {\n position: relative;\n display: inline-flex;\n }\n `,\n ];\n\n protected render(): HTMLTemplate {\n return html`<div @mousedown=\"${this._handleDragStart}\" @mouseup=\"${this._handleDragEnd}\">${htmlSlot()}</div>`;\n }\n\n protected firstUpdated() {\n this.reset();\n this.addEvent(document, \"mouseup\", this._handleDragEnd.bind(this));\n }\n\n protected _handleDragStart(e: MouseEvent) {\n this.cx = e.clientX;\n this.cy = e.clientY;\n this.t = this.offsetTop;\n this.l = this.offsetLeft;\n this.drag = true;\n this.addEvent(document, \"mousemove\", this._handleDrag.bind(this), undefined, \"0\");\n }\n\n protected _handleDragEnd() {\n this.drag = false;\n this.removeEvent(document, \"mousemove\", \"0\");\n }\n\n protected _handleDrag(e: MouseEvent) {\n if (!this.drag) {\n return;\n }\n const nl = e.clientX - (this.cx - this.l);\n const nt = e.clientY - (this.cy - this.t);\n if (nl < 0) {\n this.style.left = \"0\";\n } else if (nl < this.offsetsWidth - this.offsetWidth) {\n this.style.left = `${nl}px`;\n } else {\n this.style.left = `${this.offsetsWidth - this.offsetWidth}\"px\"`;\n }\n if (nt < 0) {\n this.style.top = \"0\";\n } else if (nt < this.offsetsHeight - this.offsetHeight) {\n this.style.top = `${nt}px`;\n } else {\n this.style.top = `${this.offsetsHeight - this.offsetHeight}px`;\n }\n }\n\n reset() {\n this.style.left = this.x || \"0\";\n this.style.top = this.y || \"0\";\n if (this.offsetLeft > this.offsetsWidth - this.offsetWidth) {\n this.style.left = `${this.offsetsWidth - this.offsetWidth}px`;\n }\n if (this.offsetTop > this.offsetsHeight - this.offsetHeight) {\n this.style.top = `${this.offsetsHeight - this.offsetHeight}px`;\n }\n }\n}\n\nexport default DragBox;\ndeclare global {\n interface HTMLElementTagNameMap {\n \"drag-box\": DragBox;\n }\n}\n"]}
@@ -6,7 +6,7 @@ const defineName = "time-bar";
6
6
  /**
7
7
  * TimeBar renders a formatting time.
8
8
  */
9
- let TimeBar = class TimeBar extends GodownElement {
9
+ let TimeBar = TimeBar_1 = class TimeBar extends GodownElement {
10
10
  constructor() {
11
11
  super(...arguments);
12
12
  /**
@@ -31,14 +31,6 @@ let TimeBar = class TimeBar extends GodownElement {
31
31
  */
32
32
  this.gap = 0;
33
33
  }
34
- static { TimeBar_1 = this; }
35
- static { this.styles = [
36
- css `
37
- :host {
38
- text-align: center;
39
- }
40
- `,
41
- ]; }
42
34
  render() {
43
35
  return this.value || TimeBar_1.fmt(this.format, this.time);
44
36
  }
@@ -102,6 +94,13 @@ let TimeBar = class TimeBar extends GodownElement {
102
94
  });
103
95
  }
104
96
  };
97
+ TimeBar.styles = [
98
+ css `
99
+ :host {
100
+ text-align: center;
101
+ }
102
+ `,
103
+ ];
105
104
  __decorate([
106
105
  property()
107
106
  ], TimeBar.prototype, "format", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"time-bar.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/items/time-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, type CSSResultGroup, property } from \"../../deps.js\";\nimport { define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"time-bar\";\n\n/**\n * TimeBar renders a formatting time.\n */\n@define(defineName)\nexport class TimeBar extends GodownElement {\n /**\n * Format strings.\n * {@linkcode TimeBar.fmt}\n */\n @property() format = \"YYYY-MM-DD hh:mm:ss UTFZ\";\n /**\n * Display content.\n */\n @property() value = \"\";\n /**\n * Time.\n */\n @property({ type: Object }) time = new Date();\n /**\n * If there is a value, update every gap or timeout.\n */\n @property({ type: Number }) timeout = 0;\n /**\n * The number of milliseconds that change with each update.\n */\n @property({ type: Number }) gap = 0;\n\n intervalID: number;\n\n static styles: CSSResultGroup = [\n css`\n :host {\n text-align: center;\n }\n `,\n ];\n\n protected render(): string {\n return this.value || TimeBar.fmt(this.format, this.time);\n }\n\n protected firstUpdated() {\n if (this.timeout) {\n this.intervalID = setInterval(() => {\n this.time = new Date(this.time.getTime() + (this.gap || this.timeout));\n }, Math.abs(this.timeout));\n }\n }\n\n disconnectedCallback() {\n clearInterval(this.intervalID);\n }\n\n /**\n * @param fm Format string.\n * @param tm Time.\n * @returns F.ormat result\\\n *\n * Y for years\\\n * M for months\\\n * D for days\\\n * h for hours\\\n * m for minutes\\\n * s for seconds\\\n * Z for time zones.\n */\n static fmt(fm: string, tm: Date): string {\n if (fm === \"\") {\n return fm;\n }\n const rest = [];\n fm = fm.replace(/%([ZYMDhms%])/g, (_, p1) => {\n rest.push(p1);\n return \"%%\";\n });\n const formatNumber = (date: number) => date.toString().padStart(2, \"0\").split(\"\");\n const z = tm.getTimezoneOffset() / -60;\n const switcher: Record<string, string[]> = {\n Z: [z >= 0 ? \"+\" + z.toString() : z.toString()],\n Y: tm.getFullYear().toString().split(\"\"),\n M: formatNumber(tm.getMonth() + 1),\n D: formatNumber(tm.getDate()),\n h: formatNumber(tm.getHours()),\n m: formatNumber(tm.getMinutes()),\n s: formatNumber(tm.getSeconds()),\n };\n const result: string[] = [];\n for (const f of fm.split(\"\").reverse()) {\n if (switcher[f]) {\n result.push(switcher[f]?.pop());\n } else {\n result.push(f);\n }\n }\n return result\n .reverse()\n .join(\"\")\n .replace(/%%/g, () => {\n return rest.shift();\n });\n }\n}\n\nexport default TimeBar;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"time-bar\": TimeBar;\n }\n}\n"]}
1
+ {"version":3,"file":"time-bar.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/items/time-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, type CSSResultGroup, property } from \"../../deps.js\";\nimport { define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"time-bar\";\n\n/**\n * TimeBar renders a formatting time.\n */\n@define(defineName)\nexport class TimeBar extends GodownElement {\n /**\n * Format strings.\n * {@linkcode TimeBar.fmt}\n */\n @property() format = \"YYYY-MM-DD hh:mm:ss UTFZ\";\n /**\n * Display content.\n */\n @property() value = \"\";\n /**\n * Time.\n */\n @property({ type: Object }) time = new Date();\n /**\n * If there is a value, update every gap or timeout.\n */\n @property({ type: Number }) timeout = 0;\n /**\n * The number of milliseconds that change with each update.\n */\n @property({ type: Number }) gap = 0;\n\n intervalID: number;\n\n static styles: CSSResultGroup = [\n css`\n :host {\n text-align: center;\n }\n `,\n ];\n\n protected render(): string {\n return this.value || TimeBar.fmt(this.format, this.time);\n }\n\n protected firstUpdated() {\n if (this.timeout) {\n this.intervalID = setInterval(() => {\n this.time = new Date(this.time.getTime() + (this.gap || this.timeout));\n }, Math.abs(this.timeout));\n }\n }\n\n disconnectedCallback() {\n clearInterval(this.intervalID);\n }\n\n /**\n * @param fm Format string.\n * @param tm Time.\n * @returns F.ormat result\\\n *\n * Y for years\\\n * M for months\\\n * D for days\\\n * h for hours\\\n * m for minutes\\\n * s for seconds\\\n * Z for time zones.\n */\n static fmt(fm: string, tm: Date): string {\n if (fm === \"\") {\n return fm;\n }\n const rest = [];\n fm = fm.replace(/%([ZYMDhms%])/g, (_, p1) => {\n rest.push(p1);\n return \"%%\";\n });\n const formatNumber = (date: number) => date.toString().padStart(2, \"0\").split(\"\");\n const z = tm.getTimezoneOffset() / -60;\n const switcher: Record<string, string[]> = {\n Z: [z >= 0 ? \"+\" + z.toString() : z.toString()],\n Y: tm.getFullYear().toString().split(\"\"),\n M: formatNumber(tm.getMonth() + 1),\n D: formatNumber(tm.getDate()),\n h: formatNumber(tm.getHours()),\n m: formatNumber(tm.getMinutes()),\n s: formatNumber(tm.getSeconds()),\n };\n const result: string[] = [];\n for (const f of fm.split(\"\").reverse()) {\n if (switcher[f]) {\n result.push(switcher[f]?.pop());\n } else {\n result.push(f);\n }\n }\n return result\n .reverse()\n .join(\"\")\n .replace(/%%/g, () => {\n return rest.shift();\n });\n }\n}\n\nexport default TimeBar;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"time-bar\": TimeBar;\n }\n}\n"]}
@@ -15,8 +15,16 @@ let DividerLine = class DividerLine extends GodownElement {
15
15
  */
16
16
  this.v = false;
17
17
  }
18
- static { this.styles = [
19
- css `
18
+ render() {
19
+ return html `<div class="${this.v ? "v" : ""}">
20
+ <hr class="before" />
21
+ ${htmlSlot()}
22
+ <hr class="after" />
23
+ </div>`;
24
+ }
25
+ };
26
+ DividerLine.styles = [
27
+ css `
20
28
  :host {
21
29
  ${cssvarScope}--before-length: auto;
22
30
  ${cssvarScope}--after-length: auto;
@@ -64,15 +72,7 @@ let DividerLine = class DividerLine extends GodownElement {
64
72
  max-height: var(${cssvarScope}--after-length);
65
73
  }
66
74
  `,
67
- ]; }
68
- render() {
69
- return html `<div class="${this.v ? "v" : ""}">
70
- <hr class="before" />
71
- ${htmlSlot()}
72
- <hr class="after" />
73
- </div>`;
74
- }
75
- };
75
+ ];
76
76
  __decorate([
77
77
  property({ type: Boolean })
78
78
  ], DividerLine.prototype, "v", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"divider-line.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/divider-line.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAqB,MAAM,wBAAwB,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEnE,MAAM,UAAU,GAAG,cAAc,CAAC;AAClC,MAAM,WAAW,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;AAE5C;;GAEG;AAEI,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,aAAa;IAAvC;;QACL;;WAEG;QAC0B,MAAC,GAAG,KAAK,CAAC;IA4DzC,CAAC;aA1DQ,WAAM,GAAG;QACd,GAAG,CAAA;;UAEG,WAAW;UACX,WAAW;UACX,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBA4BC,WAAW;yBACR,WAAW;;;sBAGd,WAAW;yBACR,WAAW;;;qBAGf,WAAW;0BACN,WAAW;;;qBAGhB,WAAW;0BACN,WAAW;;KAEhC;KACF,AAjDY,CAiDX;IAEQ,MAAM;QACd,OAAO,IAAI,CAAA,eAAe,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE;;QAEvC,QAAQ,EAAE;;WAEP,CAAC;IACV,CAAC;;AA3D4B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;sCAAW;AAJ5B,WAAW;IADvB,MAAM,CAAC,UAAU,CAAC;GACN,WAAW,CAgEvB;;AAED,eAAe,WAAW,CAAC","sourcesContent":["import { css, html, property } from \"../../deps.js\";\nimport { htmlSlot, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { createScope, define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"divider-line\";\nconst cssvarScope = createScope(defineName);\n\n/**\n * DividerLine similar to hr.\n */\n@define(defineName)\nexport class DividerLine extends GodownElement {\n /**\n * Enable vertical.\n */\n @property({ type: Boolean }) v = false;\n\n static styles = [\n css`\n :host {\n ${cssvarScope}--before-length: auto;\n ${cssvarScope}--after-length: auto;\n ${cssvarScope}--breadth: .125em;\n display: block;\n color: currentColor;\n background: none;\n }\n\n div {\n display: flex;\n align-items: center;\n border-radius: inherit;\n width: 100%;\n }\n\n hr {\n border-radius: inherit;\n margin: 0;\n border: 0;\n flex: 1;\n background: currentColor;\n }\n\n .v {\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n\n .before {\n height: var(${cssvarScope}--breadth);\n max-width: var(${cssvarScope}--before-length);\n }\n .after {\n height: var(${cssvarScope}--breadth);\n max-width: var(${cssvarScope}--after-length);\n }\n .v .before {\n width: var(${cssvarScope}--breadth);\n max-height: var(${cssvarScope}--before-length);\n }\n .v .after {\n width: var(${cssvarScope}--breadth);\n max-height: var(${cssvarScope}--after-length);\n }\n `,\n ];\n\n protected render(): HTMLTemplate {\n return html`<div class=\"${this.v ? \"v\" : \"\"}\">\n <hr class=\"before\" />\n ${htmlSlot()}\n <hr class=\"after\" />\n </div>`;\n }\n}\n\nexport default DividerLine;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"divider-line\": DividerLine;\n }\n}\n"]}
1
+ {"version":3,"file":"divider-line.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/divider-line.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAqB,MAAM,wBAAwB,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEnE,MAAM,UAAU,GAAG,cAAc,CAAC;AAClC,MAAM,WAAW,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;AAE5C;;GAEG;AAEI,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,aAAa;IAAvC;;QACL;;WAEG;QAC0B,MAAC,GAAG,KAAK,CAAC;IA4DzC,CAAC;IAPW,MAAM;QACd,OAAO,IAAI,CAAA,eAAe,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE;;QAEvC,QAAQ,EAAE;;WAEP,CAAC;IACV,CAAC;;AAzDM,kBAAM,GAAG;IACd,GAAG,CAAA;;UAEG,WAAW;UACX,WAAW;UACX,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBA4BC,WAAW;yBACR,WAAW;;;sBAGd,WAAW;yBACR,WAAW;;;qBAGf,WAAW;0BACN,WAAW;;;qBAGhB,WAAW;0BACN,WAAW;;KAEhC;CACF,AAjDY,CAiDX;AAnD2B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;sCAAW;AAJ5B,WAAW;IADvB,MAAM,CAAC,UAAU,CAAC;GACN,WAAW,CAgEvB;;AAED,eAAe,WAAW,CAAC","sourcesContent":["import { css, html, property } from \"../../deps.js\";\nimport { htmlSlot, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { createScope, define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"divider-line\";\nconst cssvarScope = createScope(defineName);\n\n/**\n * DividerLine similar to hr.\n */\n@define(defineName)\nexport class DividerLine extends GodownElement {\n /**\n * Enable vertical.\n */\n @property({ type: Boolean }) v = false;\n\n static styles = [\n css`\n :host {\n ${cssvarScope}--before-length: auto;\n ${cssvarScope}--after-length: auto;\n ${cssvarScope}--breadth: .125em;\n display: block;\n color: currentColor;\n background: none;\n }\n\n div {\n display: flex;\n align-items: center;\n border-radius: inherit;\n width: 100%;\n }\n\n hr {\n border-radius: inherit;\n margin: 0;\n border: 0;\n flex: 1;\n background: currentColor;\n }\n\n .v {\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n\n .before {\n height: var(${cssvarScope}--breadth);\n max-width: var(${cssvarScope}--before-length);\n }\n .after {\n height: var(${cssvarScope}--breadth);\n max-width: var(${cssvarScope}--after-length);\n }\n .v .before {\n width: var(${cssvarScope}--breadth);\n max-height: var(${cssvarScope}--before-length);\n }\n .v .after {\n width: var(${cssvarScope}--breadth);\n max-height: var(${cssvarScope}--after-length);\n }\n `,\n ];\n\n protected render(): HTMLTemplate {\n return html`<div class=\"${this.v ? \"v\" : \"\"}\">\n <hr class=\"before\" />\n ${htmlSlot()}\n <hr class=\"after\" />\n </div>`;\n }\n}\n\nexport default DividerLine;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"divider-line\": DividerLine;\n }\n}\n"]}
@@ -18,13 +18,6 @@ let FlexFlow = class FlexFlow extends GodownElement {
18
18
  */
19
19
  this.mobile = "720px";
20
20
  }
21
- static { this.styles = [
22
- css `
23
- :host {
24
- display: flex !important;
25
- }
26
- `,
27
- ]; }
28
21
  render() {
29
22
  const flexflow = this.flexflow.split(/\s+/);
30
23
  const flexDirection = flexflow[0] || "row";
@@ -36,6 +29,13 @@ let FlexFlow = class FlexFlow extends GodownElement {
36
29
  return html `${htmlSlot()} ${htmlStyle(style)}`;
37
30
  }
38
31
  };
32
+ FlexFlow.styles = [
33
+ css `
34
+ :host {
35
+ display: flex !important;
36
+ }
37
+ `,
38
+ ];
39
39
  __decorate([
40
40
  property()
41
41
  ], FlexFlow.prototype, "flexflow", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"flex-flow.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/flex-flow.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAqB,MAAM,wBAAwB,CAAC;AAChF,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEtD,MAAM,UAAU,GAAG,WAAW,CAAC;AAE/B;;GAEG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,aAAa;IAApC;;QACL;;WAEG;QACS,aAAQ,GAAG,0BAA0B,CAAC;QAClD;;WAEG;QACS,WAAM,GAAG,OAAO,CAAC;IAoB/B,CAAC;aAlBQ,WAAM,GAAG;QACd,GAAG,CAAA;;;;KAIF;KACF,AANY,CAMX;IAEQ,MAAM;QACd,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC5C,MAAM,aAAa,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC;QAC3C,MAAM,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,QAAQ,CAAC;QACzC,MAAM,cAAc,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,aAAa,IAAI,QAAQ,CAAC;QAChE,MAAM,SAAS,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,QAAQ,IAAI,QAAQ,CAAC;QACtD,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,IAAI,OAAO,CAAC;QACjC,MAAM,KAAK,GAAG,wBAAwB,aAAa,cAAc,QAAQ,uBAAuB,CAAC,0BAA0B,cAAc,cAAc,SAAS,GAAG,CAAC;QACpK,OAAO,IAAI,CAAA,GAAG,QAAQ,EAAE,IAAI,SAAS,CAAC,KAAK,CAAC,EAAE,CAAC;IACjD,CAAC;;AAvBW;IAAX,QAAQ,EAAE;0CAAuC;AAItC;IAAX,QAAQ,EAAE;wCAAkB;AARlB,QAAQ;IADpB,MAAM,CAAC,UAAU,CAAC;GACN,QAAQ,CA4BpB;;AAED,eAAe,QAAQ,CAAC","sourcesContent":["import { css, html, property } from \"../../deps.js\";\nimport { htmlSlot, htmlStyle, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"flex-flow\";\n\n/**\n * FlexFlow controls the flex layout based on the width of the screen.\n */\n@define(defineName)\nexport class FlexFlow extends GodownElement {\n /**\n * The flex-flow behavior.\n */\n @property() flexflow = \"row nowrap column nowrap\";\n /**\n * The width of the screen for the position change.\n */\n @property() mobile = \"720px\";\n\n static styles = [\n css`\n :host {\n display: flex !important;\n }\n `,\n ];\n\n protected render(): HTMLTemplate {\n const flexflow = this.flexflow.split(/\\s+/);\n const flexDirection = flexflow[0] || \"row\";\n const flexWrap = flexflow[1] || \"nowrap\";\n const flexDirectionM = flexflow[2] || flexDirection || \"column\";\n const flexWrapM = flexflow[3] || flexWrap || \"nowrap\";\n const m = this.mobile || \"720px\";\n const style = `:host{flex-direction:${flexDirection};flex-wrap:${flexWrap};}@media(max-width: ${m}){:host{flex-direction:${flexDirectionM};flex-wrap:${flexWrapM}}`;\n return html`${htmlSlot()} ${htmlStyle(style)}`;\n }\n}\n\nexport default FlexFlow;\ndeclare global {\n interface HTMLElementTagNameMap {\n \"flex-flow\": FlexFlow;\n }\n}\n"]}
1
+ {"version":3,"file":"flex-flow.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/flex-flow.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAqB,MAAM,wBAAwB,CAAC;AAChF,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEtD,MAAM,UAAU,GAAG,WAAW,CAAC;AAE/B;;GAEG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,aAAa;IAApC;;QACL;;WAEG;QACS,aAAQ,GAAG,0BAA0B,CAAC;QAClD;;WAEG;QACS,WAAM,GAAG,OAAO,CAAC;IAoB/B,CAAC;IAVW,MAAM;QACd,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC5C,MAAM,aAAa,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC;QAC3C,MAAM,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,QAAQ,CAAC;QACzC,MAAM,cAAc,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,aAAa,IAAI,QAAQ,CAAC;QAChE,MAAM,SAAS,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,QAAQ,IAAI,QAAQ,CAAC;QACtD,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,IAAI,OAAO,CAAC;QACjC,MAAM,KAAK,GAAG,wBAAwB,aAAa,cAAc,QAAQ,uBAAuB,CAAC,0BAA0B,cAAc,cAAc,SAAS,GAAG,CAAC;QACpK,OAAO,IAAI,CAAA,GAAG,QAAQ,EAAE,IAAI,SAAS,CAAC,KAAK,CAAC,EAAE,CAAC;IACjD,CAAC;;AAjBM,eAAM,GAAG;IACd,GAAG,CAAA;;;;KAIF;CACF,AANY,CAMX;AAZU;IAAX,QAAQ,EAAE;0CAAuC;AAItC;IAAX,QAAQ,EAAE;wCAAkB;AARlB,QAAQ;IADpB,MAAM,CAAC,UAAU,CAAC;GACN,QAAQ,CA4BpB;;AAED,eAAe,QAAQ,CAAC","sourcesContent":["import { css, html, property } from \"../../deps.js\";\nimport { htmlSlot, htmlStyle, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"flex-flow\";\n\n/**\n * FlexFlow controls the flex layout based on the width of the screen.\n */\n@define(defineName)\nexport class FlexFlow extends GodownElement {\n /**\n * The flex-flow behavior.\n */\n @property() flexflow = \"row nowrap column nowrap\";\n /**\n * The width of the screen for the position change.\n */\n @property() mobile = \"720px\";\n\n static styles = [\n css`\n :host {\n display: flex !important;\n }\n `,\n ];\n\n protected render(): HTMLTemplate {\n const flexflow = this.flexflow.split(/\\s+/);\n const flexDirection = flexflow[0] || \"row\";\n const flexWrap = flexflow[1] || \"nowrap\";\n const flexDirectionM = flexflow[2] || flexDirection || \"column\";\n const flexWrapM = flexflow[3] || flexWrap || \"nowrap\";\n const m = this.mobile || \"720px\";\n const style = `:host{flex-direction:${flexDirection};flex-wrap:${flexWrap};}@media(max-width: ${m}){:host{flex-direction:${flexDirectionM};flex-wrap:${flexWrapM}}`;\n return html`${htmlSlot()} ${htmlStyle(style)}`;\n }\n}\n\nexport default FlexFlow;\ndeclare global {\n interface HTMLElementTagNameMap {\n \"flex-flow\": FlexFlow;\n }\n}\n"]}
@@ -19,9 +19,19 @@ let NavAside = class NavAside extends GodownElement {
19
19
  */
20
20
  this.position = "sticky fixed";
21
21
  }
22
- static { this.styles = [
23
- GodownElement.styles,
24
- css `
22
+ render() {
23
+ const position = this.position.split(/\s+/);
24
+ const p = position[0] || "sticky";
25
+ const pm = position[1] || "fixed";
26
+ const m = this.mobile || "720px";
27
+ const style = `:host{position:${p} !important;}@media(min-width:${m}){:host{position:${pm} !important;width:fit-content !important;height:100% !important;}nav{display: flex !important;justify-content: space-between !important;flex-direction: column !important;align-content: flex-start !important;align-items: stretch !important;}}`;
28
+ return html `<nav>${htmlSlot()}</nav>
29
+ ${htmlStyle(style)}`;
30
+ }
31
+ };
32
+ NavAside.styles = [
33
+ GodownElement.styles,
34
+ css `
25
35
  :host {
26
36
  ${cssvarScope}--text: var(${cssvarValues.text});
27
37
  ${cssvarScope}--background: var(${cssvarValues.main});
@@ -45,17 +55,7 @@ let NavAside = class NavAside extends GodownElement {
45
55
  box-sizing: border-box;
46
56
  }
47
57
  `,
48
- ]; }
49
- render() {
50
- const position = this.position.split(/\s+/);
51
- const p = position[0] || "sticky";
52
- const pm = position[1] || "fixed";
53
- const m = this.mobile || "720px";
54
- const style = `:host{position:${p} !important;}@media(min-width:${m}){:host{position:${pm} !important;width:fit-content !important;height:100% !important;}nav{display: flex !important;justify-content: space-between !important;flex-direction: column !important;align-content: flex-start !important;align-items: stretch !important;}}`;
55
- return html `<nav>${htmlSlot()}</nav>
56
- ${htmlStyle(style)}`;
57
- }
58
- };
58
+ ];
59
59
  __decorate([
60
60
  property()
61
61
  ], NavAside.prototype, "mobile", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"nav-aside.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/nav-aside.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAuB,IAAI,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAqB,MAAM,wBAAwB,CAAC;AAChF,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEjF,MAAM,UAAU,GAAG,WAAW,CAAC;AAC/B,MAAM,WAAW,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;AAE5C;;GAEG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,aAAa;IAApC;;QACL;;WAEG;QACS,WAAM,GAAG,OAAO,CAAC;QAC7B;;WAEG;QACS,aAAQ,GAAG,cAAc,CAAC;IAuCxC,CAAC;aArCQ,WAAM,GAAG;QACd,aAAa,CAAC,MAAM;QACpB,GAAG,CAAA;;UAEG,WAAW,eAAe,YAAY,CAAC,IAAI;UAC3C,WAAW,qBAAqB,YAAY,CAAC,IAAI;qBACtC,WAAW;0BACN,WAAW;;;;;;;;;;;;;;;;;;KAkBhC;KACgB,AA1BN,CA0BO;IAEV,MAAM;QACd,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC5C,MAAM,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,QAAQ,CAAC;QAClC,MAAM,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,OAAO,CAAC;QAClC,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,IAAI,OAAO,CAAC;QACjC,MAAM,KAAK,GAAG,kBAAkB,CAAC,iCAAiC,CAAC,oBAAoB,EAAE,mPAAmP,CAAC;QAC7U,OAAO,IAAI,CAAA,QAAQ,QAAQ,EAAE;QACzB,SAAS,CAAC,KAAK,CAAC,EAAE,CAAC;IACzB,CAAC;;AA1CW;IAAX,QAAQ,EAAE;wCAAkB;AAIjB;IAAX,QAAQ,EAAE;0CAA2B;AAR3B,QAAQ;IADpB,MAAM,CAAC,UAAU,CAAC;GACN,QAAQ,CA+CpB;;AAED,eAAe,QAAQ,CAAC","sourcesContent":["import { css, type CSSResultGroup, html, property } from \"../../deps.js\";\nimport { htmlSlot, htmlStyle, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { createScope, cssvarValues, define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"nav-aside\";\nconst cssvarScope = createScope(defineName);\n\n/**\n * NavAside renders a side or top navigation.\n */\n@define(defineName)\nexport class NavAside extends GodownElement {\n /**\n * The width of the screen for the position change.\n */\n @property() mobile = \"720px\";\n /**\n * The position behavior.\n */\n @property() position = \"sticky fixed\";\n\n static styles = [\n GodownElement.styles,\n css`\n :host {\n ${cssvarScope}--text: var(${cssvarValues.text});\n ${cssvarScope}--background: var(${cssvarValues.main});\n color: var(${cssvarScope}--text);\n background: var(${cssvarScope}--background);\n top: 0;\n left: 0;\n bottom: 0;\n width: 100%;\n height: fit-content;\n display: flex;\n }\n\n nav {\n height: inherit;\n width: inherit;\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n justify-content: space-between;\n box-sizing: border-box;\n }\n `,\n ] as CSSResultGroup;\n\n protected render(): HTMLTemplate {\n const position = this.position.split(/\\s+/);\n const p = position[0] || \"sticky\";\n const pm = position[1] || \"fixed\";\n const m = this.mobile || \"720px\";\n const style = `:host{position:${p} !important;}@media(min-width:${m}){:host{position:${pm} !important;width:fit-content !important;height:100% !important;}nav{display: flex !important;justify-content: space-between !important;flex-direction: column !important;align-content: flex-start !important;align-items: stretch !important;}}`;\n return html`<nav>${htmlSlot()}</nav>\n ${htmlStyle(style)}`;\n }\n}\n\nexport default NavAside;\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nav-aside\": NavAside;\n }\n}\n"]}
1
+ {"version":3,"file":"nav-aside.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/nav-aside.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAuB,IAAI,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAqB,MAAM,wBAAwB,CAAC;AAChF,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEjF,MAAM,UAAU,GAAG,WAAW,CAAC;AAC/B,MAAM,WAAW,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;AAE5C;;GAEG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,aAAa;IAApC;;QACL;;WAEG;QACS,WAAM,GAAG,OAAO,CAAC;QAC7B;;WAEG;QACS,aAAQ,GAAG,cAAc,CAAC;IAuCxC,CAAC;IATW,MAAM;QACd,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC5C,MAAM,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,QAAQ,CAAC;QAClC,MAAM,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,OAAO,CAAC;QAClC,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,IAAI,OAAO,CAAC;QACjC,MAAM,KAAK,GAAG,kBAAkB,CAAC,iCAAiC,CAAC,oBAAoB,EAAE,mPAAmP,CAAC;QAC7U,OAAO,IAAI,CAAA,QAAQ,QAAQ,EAAE;QACzB,SAAS,CAAC,KAAK,CAAC,EAAE,CAAC;IACzB,CAAC;;AApCM,eAAM,GAAG;IACd,aAAa,CAAC,MAAM;IACpB,GAAG,CAAA;;UAEG,WAAW,eAAe,YAAY,CAAC,IAAI;UAC3C,WAAW,qBAAqB,YAAY,CAAC,IAAI;qBACtC,WAAW;0BACN,WAAW;;;;;;;;;;;;;;;;;;KAkBhC;CACgB,AA1BN,CA0BO;AAhCR;IAAX,QAAQ,EAAE;wCAAkB;AAIjB;IAAX,QAAQ,EAAE;0CAA2B;AAR3B,QAAQ;IADpB,MAAM,CAAC,UAAU,CAAC;GACN,QAAQ,CA+CpB;;AAED,eAAe,QAAQ,CAAC","sourcesContent":["import { css, type CSSResultGroup, html, property } from \"../../deps.js\";\nimport { htmlSlot, htmlStyle, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { createScope, cssvarValues, define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"nav-aside\";\nconst cssvarScope = createScope(defineName);\n\n/**\n * NavAside renders a side or top navigation.\n */\n@define(defineName)\nexport class NavAside extends GodownElement {\n /**\n * The width of the screen for the position change.\n */\n @property() mobile = \"720px\";\n /**\n * The position behavior.\n */\n @property() position = \"sticky fixed\";\n\n static styles = [\n GodownElement.styles,\n css`\n :host {\n ${cssvarScope}--text: var(${cssvarValues.text});\n ${cssvarScope}--background: var(${cssvarValues.main});\n color: var(${cssvarScope}--text);\n background: var(${cssvarScope}--background);\n top: 0;\n left: 0;\n bottom: 0;\n width: 100%;\n height: fit-content;\n display: flex;\n }\n\n nav {\n height: inherit;\n width: inherit;\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n justify-content: space-between;\n box-sizing: border-box;\n }\n `,\n ] as CSSResultGroup;\n\n protected render(): HTMLTemplate {\n const position = this.position.split(/\\s+/);\n const p = position[0] || \"sticky\";\n const pm = position[1] || \"fixed\";\n const m = this.mobile || \"720px\";\n const style = `:host{position:${p} !important;}@media(min-width:${m}){:host{position:${pm} !important;width:fit-content !important;height:100% !important;}nav{display: flex !important;justify-content: space-between !important;flex-direction: column !important;align-content: flex-start !important;align-items: stretch !important;}}`;\n return html`<nav>${htmlSlot()}</nav>\n ${htmlStyle(style)}`;\n }\n}\n\nexport default NavAside;\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nav-aside\": NavAside;\n }\n}\n"]}
@@ -19,9 +19,31 @@ let NavLayout = class NavLayout extends GodownElement {
19
19
  */
20
20
  this.subhead = "";
21
21
  }
22
- static { this.styles = [
23
- GodownElement.styles,
24
- css `
22
+ render() {
23
+ return html ` ${htmlSlot("header")} ${this.renderNav()}
24
+ <main>${htmlSlot()}</main>
25
+ ${htmlSlot("footer")}`;
26
+ }
27
+ renderNav() {
28
+ if (this.querySelector("[slot=nav]")) {
29
+ return htmlSlot("nav");
30
+ }
31
+ return html `<nav>
32
+ <h1>
33
+ <slot name="host"></slot>
34
+ <a href="/">${this.host}</a>${this.subhead &&
35
+ html `<span></span>
36
+ <div>${this.subhead}</div>`}
37
+ </h1>
38
+ <div>
39
+ <slot name="opt"></slot>
40
+ </div>
41
+ </nav>`;
42
+ }
43
+ };
44
+ NavLayout.styles = [
45
+ GodownElement.styles,
46
+ css `
25
47
  :host {
26
48
  ${cssvarScope}--text: var(${cssvarValues.text});
27
49
  ${cssvarScope}--background: var(${cssvarValues.main});
@@ -101,29 +123,7 @@ let NavLayout = class NavLayout extends GodownElement {
101
123
  }
102
124
  }
103
125
  `,
104
- ]; }
105
- render() {
106
- return html ` ${htmlSlot("header")} ${this.renderNav()}
107
- <main>${htmlSlot()}</main>
108
- ${htmlSlot("footer")}`;
109
- }
110
- renderNav() {
111
- if (this.querySelector("[slot=nav]")) {
112
- return htmlSlot("nav");
113
- }
114
- return html `<nav>
115
- <h1>
116
- <slot name="host"></slot>
117
- <a href="/">${this.host}</a>${this.subhead &&
118
- html `<span></span>
119
- <div>${this.subhead}</div>`}
120
- </h1>
121
- <div>
122
- <slot name="opt"></slot>
123
- </div>
124
- </nav>`;
125
- }
126
- };
126
+ ];
127
127
  __decorate([
128
128
  property()
129
129
  ], NavLayout.prototype, "host", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"nav-layout.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/nav-layout.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAuB,IAAI,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzE,OAAO,EAAE,QAAQ,EAAqB,MAAM,wBAAwB,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEjF,MAAM,UAAU,GAAG,YAAY,CAAC;AAChC,MAAM,WAAW,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;AAE5C;;GAEG;AAEI,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,aAAa;IAArC;;QACL;;WAEG;QACS,SAAI,GAAG,EAAE,CAAC;QACtB;;WAEG;QACS,YAAO,GAAG,EAAE,CAAC;IAiH3B,CAAC;aA1GQ,WAAM,GAAG;QACd,aAAa,CAAC,MAAM;QACpB,GAAG,CAAA;;UAEG,WAAW,eAAe,YAAY,CAAC,IAAI;UAC3C,WAAW,qBAAqB,YAAY,CAAC,IAAI;UACjD,WAAW,0BAA0B,YAAY,CAAC,KAAK;UACvD,WAAW;UACX,WAAW,uBAAuB,WAAW;;;;;;;;;;;qBAWlC,WAAW;0BACN,WAAW;;;;sBAIf,WAAW;0BACP,WAAW;;;;;;;;;;;;;;;;;;;yBAmBZ,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAqC/B;KACgB,AAlFN,CAkFO;IAEV,MAAM;QACd,OAAO,IAAI,CAAA,IAAI,QAAQ,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,SAAS,EAAE;cAC3C,QAAQ,EAAE;QAChB,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC;IAC3B,CAAC;IAEO,SAAS;QACf,IAAI,IAAI,CAAC,aAAa,CAAC,YAAY,CAAC,EAAE,CAAC;YACrC,OAAO,QAAQ,CAAC,KAAK,CAAC,CAAC;QACzB,CAAC;QACD,OAAO,IAAI,CAAA;;;sBAGO,IAAI,CAAC,IAAI,OAAO,IAAI,CAAC,OAAO;YAC1C,IAAI,CAAA;iBACK,IAAI,CAAC,OAAO,QAAQ;;;;;WAK1B,CAAC;IACV,CAAC;;AApHW;IAAX,QAAQ,EAAE;uCAAW;AAIV;IAAX,QAAQ,EAAE;0CAAc;AARd,SAAS;IADrB,MAAM,CAAC,UAAU,CAAC;GACN,SAAS,CAyHrB;;AAED,eAAe,SAAS,CAAC","sourcesContent":["import { css, type CSSResultGroup, html, property } from \"../../deps.js\";\nimport { htmlSlot, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { createScope, cssvarValues, define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"nav-layout\";\nconst cssvarScope = createScope(defineName);\n\n/**\n * NavLayout renders a navigation, an optional top header, an optional bottom footer.\n */\n@define(defineName)\nexport class NavLayout extends GodownElement {\n /**\n * Main heading.\n */\n @property() host = \"\";\n /**\n * Subheading.\n */\n @property() subhead = \"\";\n\n /**\n * @deprecated\n */\n set: 0 | 1 | 2;\n\n static styles = [\n GodownElement.styles,\n css`\n :host {\n ${cssvarScope}--text: var(${cssvarValues.text});\n ${cssvarScope}--background: var(${cssvarValues.main});\n ${cssvarScope}--super-background:var(${cssvarValues.input}--true);\n ${cssvarScope}--height: 2.4em;\n ${cssvarScope}--h1-size: calc(var(${cssvarScope}--height) / 2);\n width: 100%;\n height: 100%;\n display: flex;\n flex-flow: column nowrap;\n justify-content: space-between;\n align-items: center;\n min-height: 100%;\n }\n\n nav {\n color: var(${cssvarScope}--text);\n background: var(${cssvarScope}--background);\n }\n\n nav {\n height: var(${cssvarScope}--height);\n min-height: var(${cssvarScope}--height);\n display: flex;\n justify-content: space-between;\n align-items: center;\n width: 100%;\n padding: 0 2.5%;\n box-sizing: border-box;\n margin: auto;\n position: relative;\n z-index: 2;\n }\n\n a {\n text-decoration: none;\n color: currentColor;\n }\n\n h1 {\n font-weight: normal;\n font-size: var(${cssvarScope}--h1-size);\n margin: 0;\n display: flex;\n align-items: center;\n }\n\n h1 span {\n height: 1em;\n width: 0.1em;\n background: currentColor;\n margin: 0.24em;\n }\n\n h1 > * {\n white-space: nowrap;\n }\n\n main {\n flex: 1;\n width: inherit;\n display: flex;\n flex-direction: column;\n z-index: 1;\n position: relative;\n }\n\n nav > div {\n height: 100%;\n display: flex;\n flex-direction: row;\n }\n\n @media screen and (max-width: 540px) {\n h1 a ~ * {\n display: none;\n }\n }\n `,\n ] as CSSResultGroup;\n\n protected render(): HTMLTemplate {\n return html` ${htmlSlot(\"header\")} ${this.renderNav()}\n <main>${htmlSlot()}</main>\n ${htmlSlot(\"footer\")}`;\n }\n\n private renderNav(): HTMLTemplate {\n if (this.querySelector(\"[slot=nav]\")) {\n return htmlSlot(\"nav\");\n }\n return html`<nav>\n <h1>\n <slot name=\"host\"></slot>\n <a href=\"/\">${this.host}</a>${this.subhead &&\n html`<span></span>\n <div>${this.subhead}</div>`}\n </h1>\n <div>\n <slot name=\"opt\"></slot>\n </div>\n </nav>`;\n }\n}\n\nexport default NavLayout;\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nav-layout\": NavLayout;\n }\n}\n"]}
1
+ {"version":3,"file":"nav-layout.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/nav-layout.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAuB,IAAI,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzE,OAAO,EAAE,QAAQ,EAAqB,MAAM,wBAAwB,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAEjF,MAAM,UAAU,GAAG,YAAY,CAAC;AAChC,MAAM,WAAW,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;AAE5C;;GAEG;AAEI,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,aAAa;IAArC;;QACL;;WAEG;QACS,SAAI,GAAG,EAAE,CAAC;QACtB;;WAEG;QACS,YAAO,GAAG,EAAE,CAAC;IAiH3B,CAAC;IAtBW,MAAM;QACd,OAAO,IAAI,CAAA,IAAI,QAAQ,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,SAAS,EAAE;cAC3C,QAAQ,EAAE;QAChB,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC;IAC3B,CAAC;IAEO,SAAS;QACf,IAAI,IAAI,CAAC,aAAa,CAAC,YAAY,CAAC,EAAE,CAAC;YACrC,OAAO,QAAQ,CAAC,KAAK,CAAC,CAAC;QACzB,CAAC;QACD,OAAO,IAAI,CAAA;;;sBAGO,IAAI,CAAC,IAAI,OAAO,IAAI,CAAC,OAAO;YAC1C,IAAI,CAAA;iBACK,IAAI,CAAC,OAAO,QAAQ;;;;;WAK1B,CAAC;IACV,CAAC;;AAzGM,gBAAM,GAAG;IACd,aAAa,CAAC,MAAM;IACpB,GAAG,CAAA;;UAEG,WAAW,eAAe,YAAY,CAAC,IAAI;UAC3C,WAAW,qBAAqB,YAAY,CAAC,IAAI;UACjD,WAAW,0BAA0B,YAAY,CAAC,KAAK;UACvD,WAAW;UACX,WAAW,uBAAuB,WAAW;;;;;;;;;;;qBAWlC,WAAW;0BACN,WAAW;;;;sBAIf,WAAW;0BACP,WAAW;;;;;;;;;;;;;;;;;;;yBAmBZ,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAqC/B;CACgB,AAlFN,CAkFO;AA7FR;IAAX,QAAQ,EAAE;uCAAW;AAIV;IAAX,QAAQ,EAAE;0CAAc;AARd,SAAS;IADrB,MAAM,CAAC,UAAU,CAAC;GACN,SAAS,CAyHrB;;AAED,eAAe,SAAS,CAAC","sourcesContent":["import { css, type CSSResultGroup, html, property } from \"../../deps.js\";\nimport { htmlSlot, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { createScope, cssvarValues, define, GodownElement } from \"../../root.js\";\n\nconst defineName = \"nav-layout\";\nconst cssvarScope = createScope(defineName);\n\n/**\n * NavLayout renders a navigation, an optional top header, an optional bottom footer.\n */\n@define(defineName)\nexport class NavLayout extends GodownElement {\n /**\n * Main heading.\n */\n @property() host = \"\";\n /**\n * Subheading.\n */\n @property() subhead = \"\";\n\n /**\n * @deprecated\n */\n set: 0 | 1 | 2;\n\n static styles = [\n GodownElement.styles,\n css`\n :host {\n ${cssvarScope}--text: var(${cssvarValues.text});\n ${cssvarScope}--background: var(${cssvarValues.main});\n ${cssvarScope}--super-background:var(${cssvarValues.input}--true);\n ${cssvarScope}--height: 2.4em;\n ${cssvarScope}--h1-size: calc(var(${cssvarScope}--height) / 2);\n width: 100%;\n height: 100%;\n display: flex;\n flex-flow: column nowrap;\n justify-content: space-between;\n align-items: center;\n min-height: 100%;\n }\n\n nav {\n color: var(${cssvarScope}--text);\n background: var(${cssvarScope}--background);\n }\n\n nav {\n height: var(${cssvarScope}--height);\n min-height: var(${cssvarScope}--height);\n display: flex;\n justify-content: space-between;\n align-items: center;\n width: 100%;\n padding: 0 2.5%;\n box-sizing: border-box;\n margin: auto;\n position: relative;\n z-index: 2;\n }\n\n a {\n text-decoration: none;\n color: currentColor;\n }\n\n h1 {\n font-weight: normal;\n font-size: var(${cssvarScope}--h1-size);\n margin: 0;\n display: flex;\n align-items: center;\n }\n\n h1 span {\n height: 1em;\n width: 0.1em;\n background: currentColor;\n margin: 0.24em;\n }\n\n h1 > * {\n white-space: nowrap;\n }\n\n main {\n flex: 1;\n width: inherit;\n display: flex;\n flex-direction: column;\n z-index: 1;\n position: relative;\n }\n\n nav > div {\n height: 100%;\n display: flex;\n flex-direction: row;\n }\n\n @media screen and (max-width: 540px) {\n h1 a ~ * {\n display: none;\n }\n }\n `,\n ] as CSSResultGroup;\n\n protected render(): HTMLTemplate {\n return html` ${htmlSlot(\"header\")} ${this.renderNav()}\n <main>${htmlSlot()}</main>\n ${htmlSlot(\"footer\")}`;\n }\n\n private renderNav(): HTMLTemplate {\n if (this.querySelector(\"[slot=nav]\")) {\n return htmlSlot(\"nav\");\n }\n return html`<nav>\n <h1>\n <slot name=\"host\"></slot>\n <a href=\"/\">${this.host}</a>${this.subhead &&\n html`<span></span>\n <div>${this.subhead}</div>`}\n </h1>\n <div>\n <slot name=\"opt\"></slot>\n </div>\n </nav>`;\n }\n}\n\nexport default NavLayout;\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nav-layout\": NavLayout;\n }\n}\n"]}
@@ -30,7 +30,7 @@ export declare class LoadingProgress extends GodownElement {
30
30
  export default LoadingProgress;
31
31
  declare global {
32
32
  interface HTMLElementTagNameMap {
33
- "load-track": LoadingProgress;
33
+ "loading-progress": LoadingProgress;
34
34
  }
35
35
  }
36
36
  //# sourceMappingURL=loading-progress.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"loading-progress.d.ts","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/loading/loading-progress.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,cAAc,EAAkB,MAAM,eAAe,CAAC;AACzE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAwB,aAAa,EAAE,MAAM,eAAe,CAAC;AAIpE;;GAEG;AACH,qBACa,eAAgB,SAAQ,aAAa;IAChD;;OAEG;IACyB,GAAG,SAAK;IACpC;;OAEG;IACyB,GAAG,SAAK;IACpC;;OAEG;IACwC,KAAK,MAAQ;IAExD,MAAM,CAAC,MAAM,iBAuCO;IAEpB,SAAS,CAAC,MAAM,IAAI,YAAY;IAYhC;;;;;OAKG;IACH,YAAY,CAAC,CAAC,GAAE,MAAM,GAAG,MAAY,GAAG,MAAM;CAM/C;AAED,eAAe,eAAe,CAAC;AAE/B,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,eAAe,CAAC;KAC/B;CACF"}
1
+ {"version":3,"file":"loading-progress.d.ts","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/loading/loading-progress.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,cAAc,EAAkB,MAAM,eAAe,CAAC;AACzE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAwB,aAAa,EAAE,MAAM,eAAe,CAAC;AAIpE;;GAEG;AACH,qBACa,eAAgB,SAAQ,aAAa;IAChD;;OAEG;IACyB,GAAG,SAAK;IACpC;;OAEG;IACyB,GAAG,SAAK;IACpC;;OAEG;IACwC,KAAK,MAAQ;IAExD,MAAM,CAAC,MAAM,iBAuCO;IAEpB,SAAS,CAAC,MAAM,IAAI,YAAY;IAYhC;;;;;OAKG;IACH,YAAY,CAAC,CAAC,GAAE,MAAM,GAAG,MAAY,GAAG,MAAM;CAM/C;AAED,eAAe,eAAe,CAAC;AAE/B,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,eAAe,CAAC;KACrC;CACF"}