@3t-transform/threeteeui 0.0.23 → 0.0.24

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 (87) hide show
  1. package/dist/cjs/{index-2943e8f8.js → index-bc080fb4.js} +64 -89
  2. package/dist/cjs/loader.cjs.js +3 -4
  3. package/dist/cjs/tttx-button.cjs.entry.js +1 -1
  4. package/dist/cjs/tttx-icon.cjs.entry.js +1 -1
  5. package/dist/cjs/tttx-keyvalue-block.cjs.entry.js +5 -8
  6. package/dist/cjs/tttx-list.cjs.entry.js +34 -0
  7. package/dist/cjs/tttx-loading-spinner.cjs.entry.js +1 -1
  8. package/dist/cjs/tttx-standalone-input.cjs.entry.js +1 -2
  9. package/dist/cjs/tttx-table.cjs.entry.js +60 -0
  10. package/dist/cjs/tttx.cjs.js +3 -7
  11. package/dist/collection/collection-manifest.json +5 -3
  12. package/dist/collection/components/atoms/tttx-button/test/tttx-button.e2e.js +9 -0
  13. package/dist/collection/components/atoms/tttx-button/test/tttx-button.spec.js +43 -0
  14. package/dist/collection/components/atoms/tttx-icon/test/tttx-icon.e2e.js +9 -0
  15. package/dist/collection/components/atoms/tttx-icon/test/tttx-icon.spec.js +16 -0
  16. package/dist/collection/components/atoms/tttx-keyvalue-block/test/tttx-keyvalue-block.spec.js +164 -0
  17. package/dist/collection/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.js +4 -7
  18. package/dist/collection/components/atoms/tttx-loading-spinner/Test/tttx-loading-spinner.spec.js +64 -0
  19. package/dist/collection/components/molecules/tttx-list/test/tttx-list.spec.js +151 -0
  20. package/dist/collection/components/molecules/tttx-list/tttx-list.css +53 -0
  21. package/dist/collection/components/molecules/tttx-list/tttx-list.js +79 -0
  22. package/dist/collection/components/molecules/tttx-list/tttx-list.stories.js +39 -0
  23. package/dist/collection/components/molecules/tttx-standalone-input/test/tttx-standalone-input.e2e.js +9 -0
  24. package/dist/collection/components/molecules/tttx-standalone-input/test/tttx-standalone-input.spec.js +146 -0
  25. package/dist/collection/components/molecules/tttx-standalone-input/tttx-standalone-input.js +0 -1
  26. package/dist/collection/components/molecules/tttx-table/test/tttx-table.e2e.js +9 -0
  27. package/dist/collection/components/molecules/tttx-table/tttx-table.css +166 -0
  28. package/dist/collection/components/molecules/tttx-table/tttx-table.js +174 -0
  29. package/dist/collection/components/molecules/tttx-table/tttx-table.stories.js +81 -0
  30. package/dist/components/index.d.ts +2 -9
  31. package/dist/components/index.js +3 -1
  32. package/dist/components/tttx-keyvalue-block.js +4 -7
  33. package/dist/components/tttx-list.d.ts +11 -0
  34. package/dist/components/tttx-list.js +56 -0
  35. package/dist/components/tttx-standalone-input.js +0 -1
  36. package/dist/components/tttx-table.d.ts +11 -0
  37. package/dist/components/tttx-table.js +85 -0
  38. package/dist/esm/{index-058a3cd0.js → index-901bfd55.js} +65 -89
  39. package/dist/esm/loader.js +3 -4
  40. package/dist/esm/polyfills/css-shim.js +1 -1
  41. package/dist/esm/tttx-button.entry.js +1 -1
  42. package/dist/esm/tttx-icon.entry.js +1 -1
  43. package/dist/esm/tttx-keyvalue-block.entry.js +5 -8
  44. package/dist/esm/tttx-list.entry.js +30 -0
  45. package/dist/esm/tttx-loading-spinner.entry.js +1 -1
  46. package/dist/esm/tttx-standalone-input.entry.js +1 -2
  47. package/dist/esm/tttx-table.entry.js +56 -0
  48. package/dist/esm/tttx.js +3 -4
  49. package/dist/tttx/{p-046868d9.entry.js → p-0ae51ec5.entry.js} +1 -1
  50. package/dist/tttx/p-1ec23160.entry.js +1 -0
  51. package/dist/tttx/p-300ff6a8.entry.js +1 -0
  52. package/dist/tttx/p-32ad02d3.entry.js +1 -0
  53. package/dist/tttx/p-80cf5236.entry.js +1 -0
  54. package/dist/tttx/{p-495cf4b3.entry.js → p-9a382959.entry.js} +1 -1
  55. package/dist/tttx/p-a1bd16a1.entry.js +1 -0
  56. package/dist/tttx/{p-1adb2b75.entry.js → p-a4077908.entry.js} +1 -1
  57. package/dist/tttx/p-a6953900.entry.js +1 -0
  58. package/dist/tttx/p-b46e3c59.entry.js +1 -0
  59. package/dist/tttx/p-c290160b.js +2 -0
  60. package/dist/tttx/p-dc179257.entry.js +1 -0
  61. package/dist/tttx/p-e19eb07e.entry.js +1 -0
  62. package/dist/tttx/p-e4341658.entry.js +1 -0
  63. package/dist/tttx/tttx.esm.js +1 -1
  64. package/dist/types/components/atoms/tttx-button/test/tttx-button.e2e.d.ts +1 -0
  65. package/dist/types/components/atoms/tttx-button/test/tttx-button.spec.d.ts +1 -0
  66. package/dist/types/components/atoms/tttx-icon/test/tttx-icon.e2e.d.ts +1 -0
  67. package/dist/types/components/atoms/tttx-icon/test/tttx-icon.spec.d.ts +1 -0
  68. package/dist/types/components/atoms/tttx-keyvalue-block/test/tttx-keyvalue-block.spec.d.ts +1 -0
  69. package/dist/types/components/atoms/tttx-loading-spinner/Test/tttx-loading-spinner.spec.d.ts +1 -0
  70. package/dist/types/components/molecules/tttx-list/interfaces.d.ts +4 -0
  71. package/dist/types/components/molecules/tttx-list/test/tttx-list.spec.d.ts +1 -0
  72. package/dist/types/components/molecules/tttx-list/tttx-list.d.ts +9 -0
  73. package/dist/types/components/molecules/tttx-list/tttx-list.stories.d.ts +7 -0
  74. package/dist/types/components/molecules/tttx-standalone-input/test/tttx-standalone-input.e2e.d.ts +1 -0
  75. package/dist/types/components/molecules/tttx-standalone-input/test/tttx-standalone-input.spec.d.ts +1 -0
  76. package/dist/types/components/molecules/tttx-standalone-input/tttx-standalone-input.d.ts +6 -6
  77. package/dist/types/components/molecules/tttx-table/test/tttx-table.e2e.d.ts +1 -0
  78. package/dist/types/components/molecules/tttx-table/tttx-table.d.ts +15 -0
  79. package/dist/types/components/molecules/tttx-table/tttx-table.stories.d.ts +21 -0
  80. package/dist/types/components.d.ts +48 -0
  81. package/dist/types/stencil-public-runtime.d.ts +3 -59
  82. package/loader/index.d.ts +0 -9
  83. package/package.json +2 -1
  84. package/readme.md +20 -0
  85. package/dist/tttx/p-a4d9929a.entry.js +0 -1
  86. package/dist/tttx/p-ad637dde.entry.js +0 -1
  87. package/dist/tttx/p-bbb7dbf7.js +0 -2
@@ -0,0 +1,56 @@
1
+ import { r as registerInstance, c as createEvent, h, H as Host } from './index-901bfd55.js';
2
+
3
+ const tttxTableCss = "// SPACING $spacing-unit: 4px; // REGULAR $horizontal-spacing: $spacing-unit * 4; $vertical-spacing: $spacing-unit * 2; $base-padding: $vertical-spacing $horizontal-spacing; $base-height: $spacing-unit * 9; $component-spacing: $spacing-unit * 4; // SMALL $horizontal-spacing-sm: $spacing-unit * 2; $vertical-spacing-sm: $spacing-unit * 1; $base-padding-sm: $vertical-spacing-sm $horizontal-spacing-sm; $base-height-sm: $spacing-unit * 7; // COLOURS $grey-0: #212121; $grey-1: #363636; $grey-2: #4c4c4c; $grey-3: #636363; $grey-4: #757575; $grey-5: #9e9e9e; $grey-6: #aeaeae; $grey-7: #c8c8c8; $grey-8: #e3e3e3; $grey-9: #f0f0f0; $white: white; $black: $grey-0; $transparent: transparent; $blue-0: #00187c; $blue-1: #032e8c; $blue-2: #0849a3; $blue-3: #0951a8; $blue-4: #1169ba; $blue-5: #1479c6; $blue-6: #5194d2; $blue-7: #7aacdd; $blue-8: #b9d5ed; $blue-9: #e7f1f9; $red-0: #7c0000; $red-1: #8c0000; $red-2: #a30000; $red-3: #a80000; $red-4: #ba0000; $red-5: #dc0000; $red-6: #d25151; $red-7: #dd7a7a; $red-8: #edc1c1; $red-9: #f9e7e7; $black-1: #e6e6e6; $brand: $blue-0; $accent: $blue-5; $accent-selected: $blue-9; $error: $red-5; $severity-critical: #dc0000; $severity-warning: #f59500; $severity-success: #a2bb31; $severity-info: $accent; $ui-primary: $black; $ui-secondary: $grey-4; $ui-disabled: $grey-2; $ui-placeholder: $grey-5; $ui-background: $grey-9; $ui-sheet: $white; $ui-border: #d5d5d5; // BORDERS $ui-border-radius: 4px; $ui-border-width: 1px; // TYPOGRAPHY $font-size-default: 16px; $font-size-small: 14px; .material-symbols-rounded{font-variation-settings:'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24}.skeleton{animation:skeleton-loading 1s linear infinite alternate;border-radius:4px;width:100%}@keyframes skeleton-loading{0%{background-color:hsl(200, 20%, 80%)}100%{background-color:hsl(200, 20%, 95%)}}:host{display:block}table{box-sizing:border-box;width:100%;border-collapse:collapse;border-spacing:0;border:1px solid #ddd;border-bottom:none}thead tr{height:52px;color:#757575}tbody tr{height:48px;color:#212121}tr{font-family:'Roboto', sans-serif;font-weight:400;font-size:16px;display:flex;align-items:center;border-bottom:1px solid #ddd}.selected{background-color:#F0F0F0}.checked{background-color:#e7f1f9}td,th{min-width:300px;margin-left:16px;display:flex;align-items:left}.skeleton{height:24px;display:block}.align-right{margin-left:auto}";
4
+
5
+ const TttxTable = class {
6
+ constructor(hostRef) {
7
+ registerInstance(this, hostRef);
8
+ this.rowSelected = createEvent(this, "rowSelected", 7);
9
+ this.headerClicked = createEvent(this, "headerClicked", 7);
10
+ this.headers = [];
11
+ this.data = [];
12
+ this.loading = false;
13
+ this.selected = -1;
14
+ }
15
+ handleKeyDown(ev) {
16
+ if (ev.key === 'ArrowDown' || ev.key === 'ArrowUp') {
17
+ this.updateSelectedIndex(ev.key);
18
+ this.emitRowSelected();
19
+ }
20
+ }
21
+ updateSelectedIndex(key) {
22
+ if (this.selected === -1) {
23
+ this.selected = 0;
24
+ }
25
+ else {
26
+ const isArrowDown = key === 'ArrowDown';
27
+ const isArrowUp = key === 'ArrowUp';
28
+ if (isArrowDown && this.selected < this.data.length - 1) {
29
+ this.selected++;
30
+ }
31
+ else if (isArrowUp && this.selected > 0) {
32
+ this.selected--;
33
+ }
34
+ }
35
+ }
36
+ emitRowSelected() {
37
+ this.rowSelected.emit(this.data[this.selected]);
38
+ }
39
+ rowSelectedHandler(row) {
40
+ this.rowSelected.emit(row);
41
+ this.selected = this.data.findIndex((item) => item === row);
42
+ }
43
+ headerClickedHandler(key) {
44
+ this.headerClicked.emit(key);
45
+ }
46
+ render() {
47
+ return (h(Host, null, h("table", null, h("thead", null, h("tr", null, this.loading ?
48
+ [1, 2, 3].map(() => (h("th", null, h("div", { class: "skeleton" })))) :
49
+ this.headers && this.headers.map((header) => (h("th", { scope: "col", onClick: () => this.headerClickedHandler(header.key) }, header.label))))), h("tbody", null, this.loading ?
50
+ [1, 2, 3].map(() => (h("tr", null, h("td", null, h("div", { class: "skeleton" })), h("td", null, h("div", { class: "skeleton" })), h("td", null, h("div", { class: "skeleton" }))))) :
51
+ Object.keys(this.data).map((key, index) => (h("tr", { class: index === this.selected ? 'selected' : '', onClick: () => this.rowSelectedHandler(this.data[key]) }, this.headers.map((header) => (h("td", null, this.data[key][header.key], " ", header.actions && h("tttx-icon", { class: "align-right", icon: "more_vert" }, h("div", { slot: "popover" }, h("tttx-popover-content", { header: "The humble egg", body: "Most arthropods such as insects, vertebrates (excluding live-bearing mammals), and mollusks lay eggs, although some, such as scorpions, do not.", linkcontext: "Wikipedia_egg", linktext: "Learn more about eggs" })))))))))))));
52
+ }
53
+ };
54
+ TttxTable.style = tttxTableCss;
55
+
56
+ export { TttxTable as tttx_table };
package/dist/esm/tttx.js CHANGED
@@ -1,8 +1,7 @@
1
- import { p as promiseResolve, b as bootstrapLazy } from './index-058a3cd0.js';
2
- export { s as setNonce } from './index-058a3cd0.js';
1
+ import { p as promiseResolve, b as bootstrapLazy } from './index-901bfd55.js';
3
2
 
4
3
  /*
5
- Stencil Client Patch Browser v2.22.3 | MIT Licensed | https://stenciljs.com
4
+ Stencil Client Patch Browser v2.20.0 | MIT Licensed | https://stenciljs.com
6
5
  */
7
6
  const patchBrowser = () => {
8
7
  const importMeta = import.meta.url;
@@ -14,5 +13,5 @@ const patchBrowser = () => {
14
13
  };
15
14
 
16
15
  patchBrowser().then(options => {
17
- return bootstrapLazy([["tttx-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"design":[1]}]]],["tttx-standalone-input",[[2,"tttx-standalone-input",{"label":[1],"showerrormsg":[4],"errormsg":[1],"iconleft":[1],"iconright":[1],"inputAutocapitalize":[1,"input-autocapitalize"],"inputAutofocus":[4,"input-autofocus"],"inputKeyhint":[1,"input-keyhint"],"inputIndex":[8,"input-index"],"inputTitle":[1,"input-title"],"autocomplete":[1],"checked":[4],"disabled":[4],"max":[8],"maxlength":[8],"min":[8],"minlength":[8],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[8],"required":[4],"step":[8],"type":[1],"value":[1032]}]]],["tttx-keyvalue-block",[[1,"tttx-keyvalue-block",{"keyvalues":[8],"horizontal":[4]}]]],["tttx-loading-spinner",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-icon",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]]], options);
16
+ return bootstrapLazy([["tttx-icon",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]],["tttx-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"design":[1]}]]],["tttx-list",[[1,"tttx-list",{"data":[1]}]]],["tttx-standalone-input",[[2,"tttx-standalone-input",{"label":[1],"showerrormsg":[4],"errormsg":[1],"iconleft":[1],"iconright":[1],"inputAutocapitalize":[1,"input-autocapitalize"],"inputAutofocus":[4,"input-autofocus"],"inputKeyhint":[1,"input-keyhint"],"inputIndex":[8,"input-index"],"inputTitle":[1,"input-title"],"autocomplete":[1],"checked":[4],"disabled":[4],"max":[8],"maxlength":[8],"min":[8],"minlength":[8],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[8],"required":[4],"step":[8],"type":[1],"value":[1032]}]]],["tttx-table",[[1,"tttx-table",{"headers":[16],"data":[16],"loading":[4],"selected":[2]},[[4,"keydown","handleKeyDown"]]]]],["tttx-keyvalue-block",[[1,"tttx-keyvalue-block",{"keyvalues":[8],"horizontal":[4]}]]],["tttx-loading-spinner",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]]], options);
18
17
  });
@@ -1 +1 @@
1
- import{r as o,h as t,H as r}from"./p-bbb7dbf7.js";const i=class{constructor(t){o(this,t),this._iconcolor="black",this.notext=void 0,this.icon=void 0,this.iconposition="left",this.design="default"}componentWillLoad(){this._design=this.design,["primary","default","disabled","danger","borderless"].includes(this.design)||(this._design="default"),"primary"!==this._design&&"danger"!==this._design||(this._iconcolor="white")}render(){return t(r,null,t("button",{class:`button ${this._design} ${this.icon?"withicon":""} ${this.icon&&this.iconposition?"icon"+this.iconposition:""} ${this.notext?"notext":""}`},this.icon&&"left"===this.iconposition&&t("div",{class:"icon-left"},t("tttx-icon",{icon:this.icon,color:this._iconcolor})),!this.notext&&t("div",{class:"button-content"},t("slot",null)),this.icon&&"right"===this.iconposition&&t("div",{class:"icon-right"},t("tttx-icon",{icon:this.icon,color:this._iconcolor}))))}};i.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.button{font-family:Roboto, serif;box-sizing:border-box;height:36px;min-width:36px;padding:0;margin:0;background:transparent;color:#212121;border:1px solid #c8c8c8;border-radius:4px;text-transform:uppercase;display:flex;justify-content:left;align-items:center;font-size:14px;font-weight:400}.button-content{display:block;padding:0 16px}.icon-left,.icon-right{margin-top:4px}.iconleft{padding-left:8px}.iconleft .button-content{padding-left:4px}.iconright{padding-right:8px}.iconright .button-content{padding-right:4px}.notext{padding:0 6px}.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #D5D5D5}.button:active{background:rgba(17, 17, 17, 0.2);border:1px solid #D5D5D5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:hover{background:#146EB3;border:1px solid #146EB3}.primary:active{background:#1464A2;border:1px solid #1464A2}.borderless{background:transparent;border:none;color:#212121}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.danger{background:#DC0000;border:1px solid #DC0000;color:white}.danger:hover{background:#C60000;border:1px solid #C60000}.danger:active{background:#B00000;border:1px solid #B00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}:host{display:inline-block}.spacingleft{margin-left:8px}';export{i as tttx_button}
1
+ import{r as o,h as t,H as r}from"./p-c290160b.js";const i=class{constructor(t){o(this,t),this._iconcolor="black",this.notext=void 0,this.icon=void 0,this.iconposition="left",this.design="default"}componentWillLoad(){this._design=this.design,["primary","default","disabled","danger","borderless"].includes(this.design)||(this._design="default"),"primary"!==this._design&&"danger"!==this._design||(this._iconcolor="white")}render(){return t(r,null,t("button",{class:`button ${this._design} ${this.icon?"withicon":""} ${this.icon&&this.iconposition?"icon"+this.iconposition:""} ${this.notext?"notext":""}`},this.icon&&"left"===this.iconposition&&t("div",{class:"icon-left"},t("tttx-icon",{icon:this.icon,color:this._iconcolor})),!this.notext&&t("div",{class:"button-content"},t("slot",null)),this.icon&&"right"===this.iconposition&&t("div",{class:"icon-right"},t("tttx-icon",{icon:this.icon,color:this._iconcolor}))))}};i.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.button{font-family:Roboto, serif;box-sizing:border-box;height:36px;min-width:36px;padding:0;margin:0;background:transparent;color:#212121;border:1px solid #c8c8c8;border-radius:4px;text-transform:uppercase;display:flex;justify-content:left;align-items:center;font-size:14px;font-weight:400}.button-content{display:block;padding:0 16px}.icon-left,.icon-right{margin-top:4px}.iconleft{padding-left:8px}.iconleft .button-content{padding-left:4px}.iconright{padding-right:8px}.iconright .button-content{padding-right:4px}.notext{padding:0 6px}.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #D5D5D5}.button:active{background:rgba(17, 17, 17, 0.2);border:1px solid #D5D5D5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:hover{background:#146EB3;border:1px solid #146EB3}.primary:active{background:#1464A2;border:1px solid #1464A2}.borderless{background:transparent;border:none;color:#212121}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.danger{background:#DC0000;border:1px solid #DC0000;color:white}.danger:hover{background:#C60000;border:1px solid #C60000}.danger:active{background:#B00000;border:1px solid #B00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}:host{display:inline-block}.spacingleft{margin-left:8px}';export{i as tttx_button}
@@ -0,0 +1 @@
1
+ import{r as t,h as l,H as i}from"./p-c290160b.js";const d=class{constructor(l){t(this,l),this.keyvalues=void 0,this.horizontal=void 0}renderSingleElements(t){const i=Object.keys(t),d=[];for(let o=0;o<i.length;o++)this.horizontal?d.push(l("div",null,l("dt",null,i[o]),l("dd",null,t[i[o]]))):(d.push(l("dt",null,i[o])),d.push(l("dd",null,t[i[o]])));return d}renderArrayElements(t){const i=[];for(let d=0;d<t.length;d++){const o=t[d];this.horizontal?i.push(l("div",null,l("dt",{class:"mainTitle"},o.title),l("dt",{class:"subTitle"},o.subTitle),l("dd",null,o.data))):(i.push(l("dt",{class:"mainTitle"},o.title)),i.push(l("dt",{class:"subTitle"},o.subTitle)),i.push(l("dd",null,o.data)))}return i}render(){let t,d;return t="string"==typeof this.keyvalues?JSON.parse(this.keyvalues):this.keyvalues,d=Array.isArray(t)?this.renderArrayElements(t):this.renderSingleElements(t),l(i,null,l("dl",{class:this.horizontal?"horizontal":null},d))}};d.style=':host{display:block}dl{margin:0;padding:0;font-family:"Roboto", sans-serif;cursor:default}dt{font-weight:400;line-height:21px;font-size:16px}dt,dt.subTitle{color:#757575}dt.mainTitle{color:#212121}dd{margin:0;font-weight:400;font-size:16px;color:#212121;line-height:21px;margin-bottom:18px}dl.horizontal{display:flex;flex-direction:row;width:100%}dl.horizontal div{flex-grow:1}@media (max-width: 769px){dl.horizontal{flex-wrap:wrap}dl.horizontal div{width:50%}}@media (max-width: 600px){dl.horizontal div{width:100%}}';export{d as tttx_keyvalue_block}
@@ -0,0 +1 @@
1
+ import{r as t,h as i}from"./p-c290160b.js";const e=class{constructor(i){t(this,i),this.data=void 0}renderListItem(t){return i("li",{class:"item"},t.element&&i("span",{innerHTML:t.element}),t.chevron&&i("tttx-icon",{class:"align-right",icon:"chevron_right"}))}render(){if(this.data)return this._data="string"==typeof this.data?JSON.parse(this.data):this.data,i("ul",{class:"list"},this._data&&this._data.map((t=>this.renderListItem(t))))}};e.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.material-symbols-rounded{font-family:"Material Symbols Rounded", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}:host{display:flex;flex-direction:column}.list{margin:0;padding:0}.item{list-style:none;margin:0;padding:0;border-bottom:1px solid #d5d5d5;height:36px;display:flex;align-items:center}.item:first-of-type{border-top:1px solid #d5d5d5}.align-right{margin-left:auto}';export{e as tttx_list}
@@ -0,0 +1 @@
1
+ import{r as t,h as i}from"./p-c290160b.js";const e=class{constructor(i){t(this,i),this.data=void 0}renderListItem(t){return i("li",{class:"item"},t.element&&i("span",{innerHTML:t.element}),t.chevron&&i("tttx-icon",{class:"align-right",icon:"chevron_right"}))}render(){if(this.data)return this._data="string"==typeof this.data?JSON.parse(this.data):this.data,i("ul",{class:"list"},this._data&&this._data.map((t=>this.renderListItem(t))))}};e.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.material-symbols-rounded{font-family:"Material Symbols Rounded", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}:host{display:flex;flex-direction:column}.list{margin:0;padding:0}.item{list-style:none;margin:0;padding:0;border-bottom:1px solid #d5d5d5;height:36px;display:flex;align-items:center}.item:first-of-type{border-top:1px solid #d5d5d5}.align-right{margin-left:auto}.item-text{display:flex;align-items:center}';export{e as tttx_list}
@@ -0,0 +1 @@
1
+ import{r as e,c as t,h as i,H as s}from"./p-c290160b.js";const r=class{constructor(i){e(this,i),this.rowSelected=t(this,"rowSelected",7),this.headerClicked=t(this,"headerClicked",7),this.headers=[],this.data=[],this.loading=!1,this.selected=-1}handleKeyDown(e){"ArrowDown"!==e.key&&"ArrowUp"!==e.key||(this.updateSelectedIndex(e.key),this.emitRowSelected())}updateSelectedIndex(e){if(-1===this.selected)this.selected=0;else{const t="ArrowUp"===e;"ArrowDown"===e&&this.selected<this.data.length-1?this.selected++:t&&this.selected>0&&this.selected--}}emitRowSelected(){this.rowSelected.emit(this.data[this.selected])}rowSelectedHandler(e){this.rowSelected.emit(e),this.selected=this.data.findIndex((t=>t===e))}headerClickedHandler(e){this.headerClicked.emit(e)}render(){return i(s,null,i("table",null,i("thead",null,i("tr",null,this.loading?[1,2,3].map((()=>i("th",null,i("div",{class:"skeleton"})))):this.headers&&this.headers.map((e=>i("th",{scope:"col",onClick:()=>this.headerClickedHandler(e.key)},e.label))))),i("tbody",null,this.loading?[1,2,3].map((()=>i("tr",null,i("td",null,i("div",{class:"skeleton"})),i("td",null,i("div",{class:"skeleton"})),i("td",null,i("div",{class:"skeleton"}))))):Object.keys(this.data).map(((e,t)=>i("tr",{class:t===this.selected?"selected":"",onClick:()=>this.rowSelectedHandler(this.data[e])},this.headers.map((t=>i("td",null,this.data[e][t.key]," ",t.actions&&i("tttx-icon",{class:"align-right",icon:"more_vert"},i("div",{slot:"popover"},i("tttx-popover-content",{header:"The humble egg",body:"Most arthropods such as insects, vertebrates (excluding live-bearing mammals), and mollusks lay eggs, although some, such as scorpions, do not.",linkcontext:"Wikipedia_egg",linktext:"Learn more about eggs"}))))))))))))}};r.style="// SPACING $spacing-unit: 4px; // REGULAR $horizontal-spacing: $spacing-unit * 4; $vertical-spacing: $spacing-unit * 2; $base-padding: $vertical-spacing $horizontal-spacing; $base-height: $spacing-unit * 9; $component-spacing: $spacing-unit * 4; // SMALL $horizontal-spacing-sm: $spacing-unit * 2; $vertical-spacing-sm: $spacing-unit * 1; $base-padding-sm: $vertical-spacing-sm $horizontal-spacing-sm; $base-height-sm: $spacing-unit * 7; // COLOURS $grey-0: #212121; $grey-1: #363636; $grey-2: #4c4c4c; $grey-3: #636363; $grey-4: #757575; $grey-5: #9e9e9e; $grey-6: #aeaeae; $grey-7: #c8c8c8; $grey-8: #e3e3e3; $grey-9: #f0f0f0; $white: white; $black: $grey-0; $transparent: transparent; $blue-0: #00187c; $blue-1: #032e8c; $blue-2: #0849a3; $blue-3: #0951a8; $blue-4: #1169ba; $blue-5: #1479c6; $blue-6: #5194d2; $blue-7: #7aacdd; $blue-8: #b9d5ed; $blue-9: #e7f1f9; $red-0: #7c0000; $red-1: #8c0000; $red-2: #a30000; $red-3: #a80000; $red-4: #ba0000; $red-5: #dc0000; $red-6: #d25151; $red-7: #dd7a7a; $red-8: #edc1c1; $red-9: #f9e7e7; $black-1: #e6e6e6; $brand: $blue-0; $accent: $blue-5; $accent-selected: $blue-9; $error: $red-5; $severity-critical: #dc0000; $severity-warning: #f59500; $severity-success: #a2bb31; $severity-info: $accent; $ui-primary: $black; $ui-secondary: $grey-4; $ui-disabled: $grey-2; $ui-placeholder: $grey-5; $ui-background: $grey-9; $ui-sheet: $white; $ui-border: #d5d5d5; // BORDERS $ui-border-radius: 4px; $ui-border-width: 1px; // TYPOGRAPHY $font-size-default: 16px; $font-size-small: 14px; .material-symbols-rounded{font-variation-settings:'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24}.skeleton{animation:skeleton-loading 1s linear infinite alternate;border-radius:4px;width:100%}@keyframes skeleton-loading{0%{background-color:hsl(200, 20%, 80%)}100%{background-color:hsl(200, 20%, 95%)}}:host{display:block}table{box-sizing:border-box;width:100%;border-collapse:collapse;border-spacing:0;border:1px solid #ddd;border-bottom:none}thead tr{height:52px;color:#757575}tbody tr{height:48px;color:#212121}tr{font-family:'Roboto', sans-serif;font-weight:400;font-size:16px;display:flex;align-items:center;border-bottom:1px solid #ddd}.selected{background-color:#F0F0F0}.checked{background-color:#e7f1f9}td,th{min-width:300px;margin-left:16px;display:flex;align-items:left}.skeleton{height:24px;display:block}.align-right{margin-left:auto}";export{r as tttx_table}
@@ -1 +1 @@
1
- import{r as o,h as t,H as e}from"./p-bbb7dbf7.js";const r=class{constructor(t){o(this,t),this.icon=void 0,this.color="grey"}render(){return t(e,null,t("span",{class:`material-symbols-rounded ${this.color?this.color:""}`},this.icon))}};r.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.material-symbols-rounded{font-family:"Material Symbols Rounded", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}:host{display:inline-block;cursor:default;user-select:none}.icon-size{width:24px;height:24px}.tooltip{background:#ffffff;color:#343434;font-weight:bold;padding:8px 16px;font-size:13px;border-radius:4px;box-shadow:0 0 5px 1px rgba(0, 0, 0, 0.3);display:none}.tooltip[data-show]{display:block}.arrow,.arrow::before{position:absolute;width:8px;height:8px;background:inherit}.arrow{visibility:hidden}.arrow::before{visibility:visible;content:"";transform:rotate(45deg)}.tooltip[data-popper-placement^=top]>.arrow{bottom:-4px}.tooltip[data-popper-placement^=bottom]>.arrow{top:-4px}.tooltip[data-popper-placement^=left]>.arrow{right:-4px}.tooltip[data-popper-placement^=right]>.arrow{left:-4px}.red{color:#dc0000}.orange{color:#f59500}.blue{color:#1479c6}.green{color:#a2bb31}.gray{color:#757575}.black{color:#212121}.white{color:white}';export{r as tttx_icon}
1
+ import{r as o,h as t,H as e}from"./p-c290160b.js";const r=class{constructor(t){o(this,t),this.icon=void 0,this.color="grey"}render(){return t(e,null,t("span",{class:`material-symbols-rounded ${this.color?this.color:""}`},this.icon))}};r.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.material-symbols-rounded{font-family:"Material Symbols Rounded", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}:host{display:inline-block;cursor:default;user-select:none}.icon-size{width:24px;height:24px}.tooltip{background:#ffffff;color:#343434;font-weight:bold;padding:8px 16px;font-size:13px;border-radius:4px;box-shadow:0 0 5px 1px rgba(0, 0, 0, 0.3);display:none}.tooltip[data-show]{display:block}.arrow,.arrow::before{position:absolute;width:8px;height:8px;background:inherit}.arrow{visibility:hidden}.arrow::before{visibility:visible;content:"";transform:rotate(45deg)}.tooltip[data-popper-placement^=top]>.arrow{bottom:-4px}.tooltip[data-popper-placement^=bottom]>.arrow{top:-4px}.tooltip[data-popper-placement^=left]>.arrow{right:-4px}.tooltip[data-popper-placement^=right]>.arrow{left:-4px}.red{color:#dc0000}.orange{color:#f59500}.blue{color:#1479c6}.green{color:#a2bb31}.gray{color:#757575}.black{color:#212121}.white{color:white}';export{r as tttx_icon}
@@ -0,0 +1 @@
1
+ import{r as t,c as i,h as n,H as s}from"./p-c290160b.js";const o=class{constructor(n){t(this,n),this.valueChanged=i(this,"valueChanged",7),this.focusChanged=i(this,"focusChanged",7),this.blurChanged=i(this,"blurChanged",7),this.invalidChanged=i(this,"invalidChanged",7),this.label=void 0,this.showerrormsg=void 0,this.errormsg=void 0,this.iconleft=void 0,this.iconright=void 0,this.inputAutocapitalize=void 0,this.inputAutofocus=void 0,this.inputKeyhint=void 0,this.inputIndex=void 0,this.inputTitle=void 0,this.autocomplete=void 0,this.checked=void 0,this.disabled=void 0,this.max=void 0,this.maxlength=void 0,this.min=void 0,this.minlength=void 0,this.name=void 0,this.pattern=void 0,this.placeholder=void 0,this.readonly=void 0,this.required=void 0,this.step=void 0,this.type="text",this.value=void 0}handleChange(t){const i=t.target;this.value=i.value,this.valueChanged.emit(i.value)}handleFocus(t){this.focusChanged.emit(t.target.value)}handleBlur(t){this.blurChanged.emit(t.target.value)}handleInvalid(t){this.invalidChanged.emit(t.target.value)}render(){const t=["standalone",this.showerrormsg?"invalid":""].join(" ");return n(s,null,n("label",{class:"inputBlock"},this.label,this.required?"":n("span",{class:"optional"}," (optional)"),this.iconleft&&n("div",{class:"icon-left"},n("tttx-icon",{icon:this.iconleft,color:"grey"})),n("input",{class:t,autocapitalize:this.inputAutocapitalize,autofocus:this.inputAutofocus,enterkeyhint:this.inputKeyhint,tabindex:this.inputIndex,title:this.inputTitle,autocomplete:this.autocomplete,checked:this.checked,disabled:this.disabled,max:this.max,maxlength:this.maxlength,min:this.min,minlength:this.minlength,name:this.name,pattern:this.pattern,placeholder:this.placeholder,readonly:this.readonly,required:this.required,step:this.step,type:this.type,value:this.value,onBlur:this.handleBlur.bind(this),onFocus:this.handleFocus.bind(this),onInput:this.handleChange.bind(this),onInvalid:this.handleInvalid.bind(this)}),this.iconright&&n("div",{class:"icon-right"},n("tttx-icon",{icon:this.iconright,color:"grey"})),n("span",{class:["errorBubble",this.showerrormsg&&this.errormsg?"visible":""].join(" ")},n("span",{class:"material-symbols-rounded validationicon"},"warning")," ",this.errormsg)))}};o.style='.material-symbols-rounded.sc-tttx-standalone-input{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.material-symbols-rounded.sc-tttx-standalone-input{font-family:"Material Symbols Rounded", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}.icon-left.sc-tttx-standalone-input,.icon-right.sc-tttx-standalone-input{flex-basis:24px}.icon-left.sc-tttx-standalone-input span.sc-tttx-standalone-input,.icon-right.sc-tttx-standalone-input span.sc-tttx-standalone-input{font-size:24px;line-height:24px;text-align:center;display:block;width:24px;height:24px;margin-top:4px}.icon-left.sc-tttx-standalone-input span.sc-tttx-standalone-input{margin-left:4px}.icon-right.sc-tttx-standalone-input span.sc-tttx-standalone-input{margin-right:4px}.icon-right.sc-tttx-standalone-input{margin-top:5px;margin-right:4px}.icon-left.sc-tttx-standalone-input{margin-top:5px;margin-left:4px}.iconleft.sc-tttx-standalone-input .input.sc-tttx-standalone-input{padding-left:4px}.iconright.sc-tttx-standalone-input .input.sc-tttx-standalone-input{padding-right:4px}.focused.sc-tttx-standalone-input{border-color:#1479c6}.errormsg.sc-tttx-standalone-input{display:flex;justify-content:center;align-items:center;float:left;margin-bottom:16px;box-sizing:border-box;background-color:transparent;height:26px;font-size:14px;border-radius:none;z-index:2;color:#dc0000}.errormsg.sc-tttx-standalone-input .validationicon.sc-tttx-standalone-input{width:16px;height:16px;font-size:16px;margin-right:4px;vertical-align:middle;color:#dc0000}.danger.sc-tttx-standalone-input{color:#dc0000}.optional.sc-tttx-standalone-input{color:#757575;font-weight:normal}label.inputBlock.sc-tttx-standalone-input{display:block;position:relative;line-height:21px}label.sc-tttx-standalone-input{font-weight:500;font-size:16px}input.sc-tttx-standalone-input:not([type=submit]){font-family:"Roboto", serif;box-sizing:border-box;width:100%;height:36px;padding:0 16px;font-size:16px;border:1px solid #d5d5d5;border-radius:4px;margin-top:4px}input[type=date].sc-tttx-standalone-input{background:white;display:block;min-width:calc(100% - 18px);line-height:37px}input.invalid.sc-tttx-standalone-input:invalid,input.standalone.invalid.sc-tttx-standalone-input{border:1px solid #dc0000}input.sc-tttx-standalone-input~.errorBubble.sc-tttx-standalone-input{min-height:27px;position:relative;font-size:14px;font-weight:normal;width:100%;font-family:"Roboto", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center}input.sc-tttx-standalone-input~.errorBubble.sc-tttx-standalone-input:not(.visible){visibility:hidden}input.sc-tttx-standalone-input~.errorBubble.sc-tttx-standalone-input span.sc-tttx-standalone-input{color:#dc0000;font-size:16px;margin-right:4px;height:16px}input.invalid.sc-tttx-standalone-input:invalid~.errorBubble.sc-tttx-standalone-input{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:"Roboto", sans-serif;color:#dc0000;visibility:visible}input.sc-tttx-standalone-input:focus{border-color:#1479c6}.sc-tttx-standalone-input-h{display:block}';export{o as tttx_standalone_input}
@@ -1 +1 @@
1
- import{r as t,h as i}from"./p-bbb7dbf7.js";const e=class{constructor(i){t(this,i),this.loadingMessage=void 0,this.size="large"}renderLoadingMessage(){return this.loadingMessage?i("div",{class:"loading-text"},"Loading, please wait..."):""}render(){return i("div",{class:"spinner-container"},i("div",{class:"loading-box"},i("span",{class:`spinner ${this.size}`})),this.renderLoadingMessage())}};e.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.spinner-container{position:absolute}.loading-box{display:flex;align-items:center;justify-content:center}.loading-text{font-size:16px;font-weight:400;padding-top:10px;text-align:center}.spinner{border:solid #1479c6;border-bottom-color:#d5d5d5;border-radius:50%;position:relative;box-sizing:border-box;animation:rotation 1s linear infinite}.spinner.small{height:20px;width:20px;border-width:4px}.spinner.large{height:60px;width:60px;border-width:8px}@keyframes rotation{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}';export{e as tttx_loading_spinner}
1
+ import{r as t,h as i}from"./p-c290160b.js";const e=class{constructor(i){t(this,i),this.loadingMessage=void 0,this.size="large"}renderLoadingMessage(){return this.loadingMessage?i("div",{class:"loading-text"},"Loading, please wait..."):""}render(){return i("div",{class:"spinner-container"},i("div",{class:"loading-box"},i("span",{class:`spinner ${this.size}`})),this.renderLoadingMessage())}};e.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.spinner-container{position:absolute}.loading-box{display:flex;align-items:center;justify-content:center}.loading-text{font-size:16px;font-weight:400;padding-top:10px;text-align:center}.spinner{border:solid #1479c6;border-bottom-color:#d5d5d5;border-radius:50%;position:relative;box-sizing:border-box;animation:rotation 1s linear infinite}.spinner.small{height:20px;width:20px;border-width:4px}.spinner.large{height:60px;width:60px;border-width:8px}@keyframes rotation{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}';export{e as tttx_loading_spinner}
@@ -0,0 +1 @@
1
+ import{r as t,c as i,h as e}from"./p-c290160b.js";const s=class{constructor(e){t(this,e),this.listSelectedEvent=i(this,"listItemClick",7),this.data=void 0}renderListItem(t){return e("li",{class:"item"},t.element&&e("span",{class:"item-content",innerHTML:t.element}),t.chevron&&e("tttx-icon",{class:"align-right",icon:"chevron_right"}))}render(){if(this.data)return this._data="string"==typeof this.data?JSON.parse(this.data):this.data,e("ul",{class:"list"},this._data&&this._data.map((t=>this.renderListItem(t))))}};s.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.material-symbols-rounded{font-family:"Material Symbols Rounded", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}:host{display:flex;flex-direction:column}.list{margin:0;padding:0}.item{list-style:none;margin:0;padding:0;border-bottom:1px solid #d5d5d5;height:36px;display:flex;align-items:center}.item:first-of-type{border-top:1px solid #d5d5d5}.align-right{margin-left:auto}.item-content{display:flex;align-items:center}';export{s as tttx_list}
@@ -0,0 +1 @@
1
+ import{r as t,h as i}from"./p-c290160b.js";const e=class{constructor(i){t(this,i),this.data=void 0}renderListItem(t){return i("li",{class:"item"},t.element&&i("span",{class:"item-content",innerHTML:t.element}),t.chevron&&i("tttx-icon",{class:"align-right",icon:"chevron_right"}))}render(){if(this.data)return this._data="string"==typeof this.data?JSON.parse(this.data):this.data,i("ul",{class:"list"},this._data&&this._data.map((t=>this.renderListItem(t))))}};e.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.material-symbols-rounded{font-family:"Material Symbols Rounded", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}:host{display:flex;flex-direction:column}.list{margin:0;padding:0}.item{list-style:none;margin:0;padding:0;border-bottom:1px solid #d5d5d5;height:36px;display:flex;align-items:center}.item:first-of-type{border-top:1px solid #d5d5d5}.align-right{margin-left:auto}.item-content{display:flex;align-items:center}';export{e as tttx_list}
@@ -0,0 +1,2 @@
1
+ let t,e,n=!1;const l={},s=t=>"object"==(t=typeof t)||"function"===t,o=(t,e,...n)=>{let l=null,o=!1,r=!1;const i=[],u=e=>{for(let n=0;n<e.length;n++)l=e[n],Array.isArray(l)?u(l):null!=l&&"boolean"!=typeof l&&((o="function"!=typeof t&&!s(l))&&(l+=""),o&&r?i[i.length-1].t+=l:i.push(o?c(null,l):l),r=o)};if(u(n),e){const t=e.className||e.class;t&&(e.class="object"!=typeof t?t:Object.keys(t).filter((e=>t[e])).join(" "))}const a=c(t,null);return a.l=e,i.length>0&&(a.o=i),a},c=(t,e)=>({i:0,u:t,t:e,h:null,o:null,l:null}),r={},i=(t,e,n)=>{const l=(t=>R(t).$)(t);return{emit:t=>u(l,e,{bubbles:!!(4&n),composed:!!(2&n),cancelable:!!(1&n),detail:t})}},u=(t,e,n)=>{const l=J.ce(e,n);return t.dispatchEvent(l),l},a=new WeakMap,f=t=>"sc-"+t.p,h=(t,e,n,l,o,c)=>{if(n!==l){let r=V(t,e),i=e.toLowerCase();if("class"===e){const e=t.classList,s=y(n),o=y(l);e.remove(...s.filter((t=>t&&!o.includes(t)))),e.add(...o.filter((t=>t&&!s.includes(t))))}else if(r||"o"!==e[0]||"n"!==e[1]){const i=s(l);if((r||i&&null!==l)&&!o)try{if(t.tagName.includes("-"))t[e]=l;else{const s=null==l?"":l;"list"===e?r=!1:null!=n&&t[e]==s||(t[e]=s)}}catch(t){}null==l||!1===l?!1===l&&""!==t.getAttribute(e)||t.removeAttribute(e):(!r||4&c||o)&&!i&&t.setAttribute(e,l=!0===l?"":l)}else e="-"===e[2]?e.slice(3):V(G,i)?i.slice(2):i[2]+e.slice(3),n&&J.rel(t,e,n,!1),l&&J.ael(t,e,l,!1)}},$=/\s/,y=t=>t?t.split($):[],d=(t,e,n,s)=>{const o=11===e.h.nodeType&&e.h.host?e.h.host:e.h,c=t&&t.l||l,r=e.l||l;for(s in c)s in r||h(o,s,c[s],void 0,n,e.i);for(s in r)h(o,s,c[s],r[s],n,e.i)},p=(e,n,l)=>{const s=n.o[l];let o,c,r=0;if(null!==s.t)o=s.h=I.createTextNode(s.t);else if(o=s.h=I.createElement(s.u),d(null,s,!1),null!=t&&o["s-si"]!==t&&o.classList.add(o["s-si"]=t),s.o)for(r=0;r<s.o.length;++r)c=p(e,s,r),c&&o.appendChild(c);return o},m=(t,n,l,s,o,c)=>{let r,i=t;for(i.shadowRoot&&i.tagName===e&&(i=i.shadowRoot);o<=c;++o)s[o]&&(r=p(null,l,o),r&&(s[o].h=r,i.insertBefore(r,n)))},b=(t,e,n,l)=>{for(;e<=n;++e)(l=t[e])&&l.h.remove()},w=(t,e)=>t.u===e.u,S=(t,e)=>{const n=e.h=t.h,l=t.o,s=e.o,o=e.t;null===o?("slot"===e.u||d(t,e,!1),null!==l&&null!==s?((t,e,n,l)=>{let s,o=0,c=0,r=e.length-1,i=e[0],u=e[r],a=l.length-1,f=l[0],h=l[a];for(;o<=r&&c<=a;)null==i?i=e[++o]:null==u?u=e[--r]:null==f?f=l[++c]:null==h?h=l[--a]:w(i,f)?(S(i,f),i=e[++o],f=l[++c]):w(u,h)?(S(u,h),u=e[--r],h=l[--a]):w(i,h)?(S(i,h),t.insertBefore(i.h,u.h.nextSibling),i=e[++o],h=l[--a]):w(u,f)?(S(u,f),t.insertBefore(u.h,i.h),u=e[--r],f=l[++c]):(s=p(e&&e[c],n,c),f=l[++c],s&&i.h.parentNode.insertBefore(s,i.h));o>r?m(t,null==l[a+1]?null:l[a+1].h,n,l,c,a):c>a&&b(e,o,r)})(n,l,e,s):null!==s?(null!==t.t&&(n.textContent=""),m(n,null,e,s,0,s.length-1)):null!==l&&b(l,0,l.length-1)):t.t!==o&&(n.data=o)},g=(t,e)=>{e&&!t.m&&e["s-p"]&&e["s-p"].push(new Promise((e=>t.m=e)))},j=(t,e)=>{if(t.i|=16,!(4&t.i))return g(t,t.S),lt((()=>v(t,e)));t.i|=512},v=(t,e)=>{const n=t.g;let l;return e&&(t.i|=256,t.j&&(t.j.map((([t,e])=>x(n,t,e))),t.j=null),l=x(n,"componentWillLoad")),P(l,(()=>M(t,n,e)))},M=async(t,e,n)=>{const l=t.$,s=l["s-rc"];n&&(t=>{const e=t.v,n=t.$,l=e.i,s=((t,e)=>{let n=f(e);const l=D.get(n);if(t=11===t.nodeType?t:I,l)if("string"==typeof l){let e,s=a.get(t=t.head||t);s||a.set(t,s=new Set),s.has(n)||(e=I.createElement("style"),e.innerHTML=l,t.insertBefore(e,t.querySelector("link")),s&&s.add(n))}else t.adoptedStyleSheets.includes(l)||(t.adoptedStyleSheets=[...t.adoptedStyleSheets,l]);return n})(n.shadowRoot?n.shadowRoot:n.getRootNode(),e);10&l&&(n["s-sc"]=s,n.classList.add(s+"-h"),2&l&&n.classList.add(s+"-s"))})(t);k(t,e),s&&(s.map((t=>t())),l["s-rc"]=void 0);{const e=l["s-p"],n=()=>C(t);0===e.length?n():(Promise.all(e).then(n),t.i|=4,e.length=0)}},k=(n,l)=>{try{l=l.render(),n.i&=-17,n.i|=2,((n,l)=>{const s=n.$,i=n.M||c(null,null),u=(t=>t&&t.u===r)(l)?l:o(null,null,l);e=s.tagName,u.u=null,u.i|=4,n.M=u,u.h=i.h=s.shadowRoot||s,t=s["s-sc"],S(i,u)})(n,l)}catch(t){_(t,n.$)}return null},C=t=>{const e=t.$,n=t.S;64&t.i||(t.i|=64,E(e),t.k(e),n||O()),t.m&&(t.m(),t.m=void 0),512&t.i&&nt((()=>j(t,!1))),t.i&=-517},O=()=>{E(I.documentElement),nt((()=>u(G,"appload",{detail:{namespace:"tttx"}})))},x=(t,e,n)=>{if(t&&t[e])try{return t[e](n)}catch(t){_(t)}},P=(t,e)=>t&&t.then?t.then(e):e(),E=t=>t.classList.add("hydrated"),L=(t,e,n)=>{if(e.C){const l=Object.entries(e.C),o=t.prototype;if(l.map((([t,[l]])=>{(31&l||2&n&&32&l)&&Object.defineProperty(o,t,{get(){return((t,e)=>R(this).O.get(e))(0,t)},set(n){((t,e,n,l)=>{const o=R(t),c=o.O.get(e),r=o.i,i=o.g;n=((t,e)=>null==t||s(t)?t:4&e?"false"!==t&&(""===t||!!t):2&e?parseFloat(t):1&e?t+"":t)(n,l.C[e][0]),8&r&&void 0!==c||n===c||Number.isNaN(c)&&Number.isNaN(n)||(o.O.set(e,n),i&&2==(18&r)&&j(o,!1))})(this,t,n,e)},configurable:!0,enumerable:!0})})),1&n){const e=new Map;o.attributeChangedCallback=function(t,n,l){J.jmp((()=>{const n=e.get(t);if(this.hasOwnProperty(n))l=this[n],delete this[n];else if(o.hasOwnProperty(n)&&"number"==typeof this[n]&&this[n]==l)return;this[n]=(null!==l||"boolean"!=typeof this[n])&&l}))},t.observedAttributes=l.filter((([t,e])=>15&e[0])).map((([t,n])=>{const l=n[1]||t;return e.set(l,t),l}))}}return t},N=(t,e={})=>{const n=[],l=e.exclude||[],s=G.customElements,o=I.head,c=o.querySelector("meta[charset]"),r=I.createElement("style"),i=[];let u,a=!0;Object.assign(J,e),J.P=new URL(e.resourcesUrl||"./",I.baseURI).href,t.map((t=>{t[1].map((e=>{const o={i:e[0],p:e[1],C:e[2],L:e[3]};o.C=e[2],o.L=e[3];const c=o.p,r=class extends HTMLElement{constructor(t){super(t),q(t=this,o),1&o.i&&t.attachShadow({mode:"open"})}connectedCallback(){u&&(clearTimeout(u),u=null),a?i.push(this):J.jmp((()=>(t=>{if(0==(1&J.i)){const e=R(t),n=e.v,l=()=>{};if(1&e.i)T(t,e,n.L);else{e.i|=1;{let n=t;for(;n=n.parentNode||n.host;)if(n["s-p"]){g(e,e.S=n);break}}n.C&&Object.entries(n.C).map((([e,[n]])=>{if(31&n&&t.hasOwnProperty(e)){const n=t[e];delete t[e],t[e]=n}})),(async(t,e,n,l,s)=>{if(0==(32&e.i)){{if(e.i|=32,(s=B(n)).then){const t=()=>{};s=await s,t()}s.isProxied||(L(s,n,2),s.isProxied=!0);const t=()=>{};e.i|=8;try{new s(e)}catch(t){_(t)}e.i&=-9,t()}if(s.style){let t=s.style;const e=f(n);if(!D.has(e)){const l=()=>{};((t,e,n)=>{let l=D.get(t);Q&&n?(l=l||new CSSStyleSheet,"string"==typeof l?l=e:l.replaceSync(e)):l=e,D.set(t,l)})(e,t,!!(1&n.i)),l()}}}const o=e.S,c=()=>j(e,!0);o&&o["s-rc"]?o["s-rc"].push(c):c()})(0,e,n)}l()}})(this)))}disconnectedCallback(){J.jmp((()=>(()=>{if(0==(1&J.i)){const t=R(this);t.N&&(t.N.map((t=>t())),t.N=void 0)}})()))}componentOnReady(){return R(this).T}};o.W=t[0],l.includes(c)||s.get(c)||(n.push(c),s.define(c,L(r,o,1)))}))})),r.innerHTML=n+"{visibility:hidden}.hydrated{visibility:inherit}",r.setAttribute("data-styles",""),o.insertBefore(r,c?c.nextSibling:o.firstChild),a=!1,i.length?i.map((t=>t.connectedCallback())):J.jmp((()=>u=setTimeout(O,30)))},T=(t,e,n)=>{n&&n.map((([n,l,s])=>{const o=A(t,n),c=W(e,s),r=F(n);J.ael(o,l,c,r),(e.N=e.N||[]).push((()=>J.rel(o,l,c,r)))}))},W=(t,e)=>n=>{try{256&t.i?t.g[e](n):(t.j=t.j||[]).push([e,n])}catch(t){_(t)}},A=(t,e)=>4&e?I:t,F=t=>0!=(2&t),H=new WeakMap,R=t=>H.get(t),U=(t,e)=>H.set(e.g=t,e),q=(t,e)=>{const n={i:0,$:t,v:e,O:new Map};return n.T=new Promise((t=>n.k=t)),t["s-p"]=[],t["s-rc"]=[],T(t,n,e.L),H.set(t,n)},V=(t,e)=>e in t,_=(t,e)=>(0,console.error)(t,e),z=new Map,B=t=>{const e=t.p.replace(/-/g,"_"),n=t.W,l=z.get(n);return l?l[e]:import(`./${n}.entry.js`).then((t=>(z.set(n,t),t[e])),_)
2
+ /*!__STENCIL_STATIC_IMPORT_SWITCH__*/},D=new Map,G="undefined"!=typeof window?window:{},I=G.document||{head:{}},J={i:0,P:"",jmp:t=>t(),raf:t=>requestAnimationFrame(t),ael:(t,e,n,l)=>t.addEventListener(e,n,l),rel:(t,e,n,l)=>t.removeEventListener(e,n,l),ce:(t,e)=>new CustomEvent(t,e)},K=t=>Promise.resolve(t),Q=(()=>{try{return new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replaceSync}catch(t){}return!1})(),X=[],Y=[],Z=(t,e)=>l=>{t.push(l),n||(n=!0,e&&4&J.i?nt(et):J.raf(et))},tt=t=>{for(let e=0;e<t.length;e++)try{t[e](performance.now())}catch(t){_(t)}t.length=0},et=()=>{tt(X),tt(Y),(n=X.length>0)&&J.raf(et)},nt=t=>K().then(t),lt=Z(Y,!0);export{r as H,N as b,i as c,o as h,K as p,U as r}
@@ -0,0 +1 @@
1
+ import{r as t,h as i}from"./p-c290160b.js";const e=class{constructor(i){t(this,i),this.data=void 0}renderListItem(t){return i("li",{class:"item"},t.element&&i("span",{innerHTML:t.element}),t.chevron&&i("tttx-icon",{class:"align-right",icon:"chevron_right"}))}render(){if(this.data)return this._data="string"==typeof this.data?JSON.parse(this.data):this.data,i("ul",{class:"list"},this._data&&this._data.map((t=>this.renderListItem(t))))}};e.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.material-symbols-rounded{font-family:"Material Symbols Rounded", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}:host{display:flex;flex-direction:column}.list{margin:0;padding:0}.item{list-style:none;margin:0;padding:0;border-bottom:1px solid #d5d5d5;height:36px;display:flex;align-items:center}.item:first-of-type{border-top:1px solid #d5d5d5}.align-right{margin-left:auto}.item-content{display:flex;align-items:center}';export{e as tttx_list}
@@ -0,0 +1 @@
1
+ import{r as t,c as i,h as e}from"./p-c290160b.js";const s=class{constructor(e){t(this,e),this.listSelectedEvent=i(this,"listItemClick",7),this.data=void 0}renderListItem(t){return e("li",{class:"item",onClick:()=>{this.listSelectedEvent.emit({})}},t.element&&e("span",{class:"item-content",innerHTML:t.element}),t.chevron&&e("tttx-icon",{class:"align-right",icon:"chevron_right"}))}render(){if(this.data)return this._data="string"==typeof this.data?JSON.parse(this.data):this.data,e("ul",{class:"list"},this._data&&this._data.map((t=>this.renderListItem(t))))}};s.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.material-symbols-rounded{font-family:"Material Symbols Rounded", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}:host{display:flex;flex-direction:column}.list{margin:0;padding:0}.item{list-style:none;margin:0;padding:0;border-bottom:1px solid #d5d5d5;height:36px;display:flex;align-items:center}.item:first-of-type{border-top:1px solid #d5d5d5}.align-right{margin-left:auto}.item-content{display:flex;align-items:center}';export{s as tttx_list}
@@ -0,0 +1 @@
1
+ import{r as t,h as i}from"./p-c290160b.js";const e=class{constructor(i){t(this,i),this.data=void 0}renderListItem(t){return i("li",{class:"item"},t.element&&i("span",{innerHTML:t.element}),t.chevron&&i("tttx-icon",{class:"align-right",icon:"chevron_right"}))}render(){if(this.data)return this._data="string"==typeof this.data?JSON.parse(this.data):this.data,i("ul",{class:"list"},this._data&&this._data.map((t=>this.renderListItem(t))))}};e.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.material-symbols-rounded{font-family:"Material Symbols Rounded", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}:host{display:flex;flex-direction:column}.list{margin:0;padding:0}.item{list-style:none;margin:0;padding:0;border-bottom:1px solid #d5d5d5;height:36px;display:flex;align-items:center}.align-right{margin-left:auto}.item-text{display:flex;align-items:center}';export{e as tttx_list}
@@ -1 +1 @@
1
- import{p as t,b as e}from"./p-bbb7dbf7.js";export{s as setNonce}from"./p-bbb7dbf7.js";(()=>{const e=import.meta.url,n={};return""!==e&&(n.resourcesUrl=new URL(".",e).href),t(n)})().then((t=>e([["p-046868d9",[[1,"tttx-button",{notext:[4],icon:[1],iconposition:[1],design:[1]}]]],["p-a4d9929a",[[2,"tttx-standalone-input",{label:[1],showerrormsg:[4],errormsg:[1],iconleft:[1],iconright:[1],inputAutocapitalize:[1,"input-autocapitalize"],inputAutofocus:[4,"input-autofocus"],inputKeyhint:[1,"input-keyhint"],inputIndex:[8,"input-index"],inputTitle:[1,"input-title"],autocomplete:[1],checked:[4],disabled:[4],max:[8],maxlength:[8],min:[8],minlength:[8],name:[1],pattern:[1],placeholder:[1],readonly:[8],required:[4],step:[8],type:[1],value:[1032]}]]],["p-ad637dde",[[1,"tttx-keyvalue-block",{keyvalues:[8],horizontal:[4]}]]],["p-1adb2b75",[[1,"tttx-loading-spinner",{loadingMessage:[1028,"loading-message"],size:[1025]}]]],["p-495cf4b3",[[1,"tttx-icon",{icon:[1],color:[1]}]]]],t)));
1
+ import{p as t,b as e}from"./p-c290160b.js";(()=>{const e=import.meta.url,n={};return""!==e&&(n.resourcesUrl=new URL(".",e).href),t(n)})().then((t=>e([["p-9a382959",[[1,"tttx-icon",{icon:[1],color:[1]}]]],["p-0ae51ec5",[[1,"tttx-button",{notext:[4],icon:[1],iconposition:[1],design:[1]}]]],["p-e19eb07e",[[1,"tttx-list",{data:[1]}]]],["p-a1bd16a1",[[2,"tttx-standalone-input",{label:[1],showerrormsg:[4],errormsg:[1],iconleft:[1],iconright:[1],inputAutocapitalize:[1,"input-autocapitalize"],inputAutofocus:[4,"input-autofocus"],inputKeyhint:[1,"input-keyhint"],inputIndex:[8,"input-index"],inputTitle:[1,"input-title"],autocomplete:[1],checked:[4],disabled:[4],max:[8],maxlength:[8],min:[8],minlength:[8],name:[1],pattern:[1],placeholder:[1],readonly:[8],required:[4],step:[8],type:[1],value:[1032]}]]],["p-80cf5236",[[1,"tttx-table",{headers:[16],data:[16],loading:[4],selected:[2]},[[4,"keydown","handleKeyDown"]]]]],["p-1ec23160",[[1,"tttx-keyvalue-block",{keyvalues:[8],horizontal:[4]}]]],["p-a4077908",[[1,"tttx-loading-spinner",{loadingMessage:[1028,"loading-message"],size:[1025]}]]]],t)));
@@ -0,0 +1,4 @@
1
+ export interface ListItem {
2
+ element: string;
3
+ chevron: boolean;
4
+ }
@@ -0,0 +1,9 @@
1
+ import { EventEmitter } from '../../../stencil-public-runtime';
2
+ import { ListItem } from './interfaces';
3
+ export declare class TttxList {
4
+ data: string | ListItem[];
5
+ listSelectedEvent: EventEmitter;
6
+ private _data;
7
+ renderListItem(item: ListItem): any;
8
+ render(): any;
9
+ }
@@ -0,0 +1,7 @@
1
+ declare const _default: {
2
+ title: string;
3
+ component: string;
4
+ };
5
+ export default _default;
6
+ export declare const BasicStringList: any;
7
+ export declare const BasicObjectList: any;
@@ -1,10 +1,10 @@
1
1
  import { EventEmitter } from '../../../stencil-public-runtime';
2
- export type DateSyntax = `${number}${number}${number}${number}-${number}${number}-${number}${number}`;
3
- export type MonthSyntax = `${number}${number}${number}${number}-${number}${number}`;
4
- export type WeekSyntax = `${number}${number}${number}${number}-W${number}${number}`;
5
- export type TimeSyntax = `${number}${number}:${number}${number}`;
6
- export type DateTimeLocalSyntax = `${number}${number}${number}${number}-${number}${number}-${number}${number}T${number}${number}:${number}${number}`;
7
- export type MinMaxDates = DateSyntax | MonthSyntax | WeekSyntax | TimeSyntax | DateTimeLocalSyntax;
2
+ export declare type DateSyntax = `${number}${number}${number}${number}-${number}${number}-${number}${number}`;
3
+ export declare type MonthSyntax = `${number}${number}${number}${number}-${number}${number}`;
4
+ export declare type WeekSyntax = `${number}${number}${number}${number}-W${number}${number}`;
5
+ export declare type TimeSyntax = `${number}${number}:${number}${number}`;
6
+ export declare type DateTimeLocalSyntax = `${number}${number}${number}${number}-${number}${number}-${number}${number}T${number}${number}:${number}${number}`;
7
+ export declare type MinMaxDates = DateSyntax | MonthSyntax | WeekSyntax | TimeSyntax | DateTimeLocalSyntax;
8
8
  export declare class TttxInput {
9
9
  label: string;
10
10
  showerrormsg: boolean;
@@ -0,0 +1,15 @@
1
+ import { EventEmitter } from '../../../stencil-public-runtime';
2
+ export declare class TttxTable {
3
+ headers: any[];
4
+ data: any[];
5
+ loading: boolean;
6
+ selected: number;
7
+ rowSelected: EventEmitter<any>;
8
+ headerClicked: EventEmitter<any>;
9
+ handleKeyDown(ev: KeyboardEvent): void;
10
+ updateSelectedIndex(key: string): void;
11
+ emitRowSelected(): void;
12
+ rowSelectedHandler(row: any): void;
13
+ headerClickedHandler(key: string): void;
14
+ render(): any;
15
+ }
@@ -0,0 +1,21 @@
1
+ declare const _default: {
2
+ title: string;
3
+ component: string;
4
+ argTypes: {
5
+ loading: {
6
+ control: {
7
+ type: string;
8
+ };
9
+ };
10
+ };
11
+ parameters: {
12
+ actions: {
13
+ handles: string[];
14
+ };
15
+ };
16
+ decorators: import("@storybook/types").Addon_DecoratorFunction<unknown>[];
17
+ };
18
+ export default _default;
19
+ export declare const BasicTable: any;
20
+ export declare const TablePreSelected: any;
21
+ export declare const TableLoading: any;
@@ -5,6 +5,7 @@
5
5
  * It contains typing information for all components that exist in this project.
6
6
  */
7
7
  import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
8
+ import { ListItem } from "./components/molecules/tttx-list/interfaces";
8
9
  import { MinMaxDates } from "./components/molecules/tttx-standalone-input/tttx-standalone-input";
9
10
  export namespace Components {
10
11
  interface TttxButton {
@@ -21,6 +22,9 @@ export namespace Components {
21
22
  "horizontal": boolean;
22
23
  "keyvalues": any | any[] | string;
23
24
  }
25
+ interface TttxList {
26
+ "data": string | ListItem[];
27
+ }
24
28
  interface TttxLoadingSpinner {
25
29
  "loadingMessage": boolean;
26
30
  "size": 'small' | 'large';
@@ -60,11 +64,25 @@ export namespace Components {
60
64
  "type": string;
61
65
  "value": string | number;
62
66
  }
67
+ interface TttxTable {
68
+ "data": any[];
69
+ "headers": any[];
70
+ "loading": boolean;
71
+ "selected": number;
72
+ }
73
+ }
74
+ export interface TttxListCustomEvent<T> extends CustomEvent<T> {
75
+ detail: T;
76
+ target: HTMLTttxListElement;
63
77
  }
64
78
  export interface TttxStandaloneInputCustomEvent<T> extends CustomEvent<T> {
65
79
  detail: T;
66
80
  target: HTMLTttxStandaloneInputElement;
67
81
  }
82
+ export interface TttxTableCustomEvent<T> extends CustomEvent<T> {
83
+ detail: T;
84
+ target: HTMLTttxTableElement;
85
+ }
68
86
  declare global {
69
87
  interface HTMLTttxButtonElement extends Components.TttxButton, HTMLStencilElement {
70
88
  }
@@ -84,6 +102,12 @@ declare global {
84
102
  prototype: HTMLTttxKeyvalueBlockElement;
85
103
  new (): HTMLTttxKeyvalueBlockElement;
86
104
  };
105
+ interface HTMLTttxListElement extends Components.TttxList, HTMLStencilElement {
106
+ }
107
+ var HTMLTttxListElement: {
108
+ prototype: HTMLTttxListElement;
109
+ new (): HTMLTttxListElement;
110
+ };
87
111
  interface HTMLTttxLoadingSpinnerElement extends Components.TttxLoadingSpinner, HTMLStencilElement {
88
112
  }
89
113
  var HTMLTttxLoadingSpinnerElement: {
@@ -96,12 +120,20 @@ declare global {
96
120
  prototype: HTMLTttxStandaloneInputElement;
97
121
  new (): HTMLTttxStandaloneInputElement;
98
122
  };
123
+ interface HTMLTttxTableElement extends Components.TttxTable, HTMLStencilElement {
124
+ }
125
+ var HTMLTttxTableElement: {
126
+ prototype: HTMLTttxTableElement;
127
+ new (): HTMLTttxTableElement;
128
+ };
99
129
  interface HTMLElementTagNameMap {
100
130
  "tttx-button": HTMLTttxButtonElement;
101
131
  "tttx-icon": HTMLTttxIconElement;
102
132
  "tttx-keyvalue-block": HTMLTttxKeyvalueBlockElement;
133
+ "tttx-list": HTMLTttxListElement;
103
134
  "tttx-loading-spinner": HTMLTttxLoadingSpinnerElement;
104
135
  "tttx-standalone-input": HTMLTttxStandaloneInputElement;
136
+ "tttx-table": HTMLTttxTableElement;
105
137
  }
106
138
  }
107
139
  declare namespace LocalJSX {
@@ -119,6 +151,10 @@ declare namespace LocalJSX {
119
151
  "horizontal"?: boolean;
120
152
  "keyvalues"?: any | any[] | string;
121
153
  }
154
+ interface TttxList {
155
+ "data"?: string | ListItem[];
156
+ "onListItemClick"?: (event: TttxListCustomEvent<any>) => void;
157
+ }
122
158
  interface TttxLoadingSpinner {
123
159
  "loadingMessage"?: boolean;
124
160
  "size"?: 'small' | 'large';
@@ -162,12 +198,22 @@ declare namespace LocalJSX {
162
198
  "type"?: string;
163
199
  "value"?: string | number;
164
200
  }
201
+ interface TttxTable {
202
+ "data"?: any[];
203
+ "headers"?: any[];
204
+ "loading"?: boolean;
205
+ "onHeaderClicked"?: (event: TttxTableCustomEvent<any>) => void;
206
+ "onRowSelected"?: (event: TttxTableCustomEvent<any>) => void;
207
+ "selected"?: number;
208
+ }
165
209
  interface IntrinsicElements {
166
210
  "tttx-button": TttxButton;
167
211
  "tttx-icon": TttxIcon;
168
212
  "tttx-keyvalue-block": TttxKeyvalueBlock;
213
+ "tttx-list": TttxList;
169
214
  "tttx-loading-spinner": TttxLoadingSpinner;
170
215
  "tttx-standalone-input": TttxStandaloneInput;
216
+ "tttx-table": TttxTable;
171
217
  }
172
218
  }
173
219
  export { LocalJSX as JSX };
@@ -177,8 +223,10 @@ declare module "@stencil/core" {
177
223
  "tttx-button": LocalJSX.TttxButton & JSXBase.HTMLAttributes<HTMLTttxButtonElement>;
178
224
  "tttx-icon": LocalJSX.TttxIcon & JSXBase.HTMLAttributes<HTMLTttxIconElement>;
179
225
  "tttx-keyvalue-block": LocalJSX.TttxKeyvalueBlock & JSXBase.HTMLAttributes<HTMLTttxKeyvalueBlockElement>;
226
+ "tttx-list": LocalJSX.TttxList & JSXBase.HTMLAttributes<HTMLTttxListElement>;
180
227
  "tttx-loading-spinner": LocalJSX.TttxLoadingSpinner & JSXBase.HTMLAttributes<HTMLTttxLoadingSpinnerElement>;
181
228
  "tttx-standalone-input": LocalJSX.TttxStandaloneInput & JSXBase.HTMLAttributes<HTMLTttxStandaloneInputElement>;
229
+ "tttx-table": LocalJSX.TttxTable & JSXBase.HTMLAttributes<HTMLTttxTableElement>;
182
230
  }
183
231
  }
184
232
  }
@@ -133,7 +133,7 @@ export interface ListenOptions {
133
133
  */
134
134
  passive?: boolean;
135
135
  }
136
- export type ListenTargetOptions = 'body' | 'document' | 'window';
136
+ export declare type ListenTargetOptions = 'body' | 'document' | 'window';
137
137
  export interface StateDecorator {
138
138
  (): PropertyDecorator;
139
139
  }
@@ -214,8 +214,8 @@ export declare const State: StateDecorator;
214
214
  * https://stenciljs.com/docs/reactive-data#watch-decorator
215
215
  */
216
216
  export declare const Watch: WatchDecorator;
217
- export type ResolutionHandler = (elm: HTMLElement) => string | undefined | null;
218
- export type ErrorHandler = (err: any, element?: HTMLElement) => void;
217
+ export declare type ResolutionHandler = (elm: HTMLElement) => string | undefined | null;
218
+ export declare type ErrorHandler = (err: any, element?: HTMLElement) => void;
219
219
  /**
220
220
  * `setMode()` is used for libraries which provide multiple "modes" for styles.
221
221
  */
@@ -257,15 +257,6 @@ export declare function getAssetPath(path: string): string;
257
257
  * @returns the set path
258
258
  */
259
259
  export declare function setAssetPath(path: string): string;
260
- /**
261
- * Used to specify a nonce value that corresponds with an application's
262
- * [Content Security Policy (CSP)](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP).
263
- * When set, the nonce will be added to all dynamically created script and style tags at runtime.
264
- * Alternatively, the nonce value can be set on a `meta` tag in the DOM head
265
- * (<meta name="csp-nonce" content="{ nonce value here }" />) and will result in the same behavior.
266
- * @param nonce The value to be used for the nonce attribute.
267
- */
268
- export declare function setNonce(nonce: string): void;
269
260
  /**
270
261
  * Retrieve a Stencil element for a given reference
271
262
  * @param ref the ref to get the Stencil element for
@@ -442,57 +433,13 @@ interface HostAttributes {
442
433
  ref?: (el: HTMLElement | null) => void;
443
434
  [prop: string]: any;
444
435
  }
445
- /**
446
- * Utilities for working with functional Stencil components. An object
447
- * conforming to this interface is passed by the Stencil runtime as the third
448
- * argument to a functional component, allowing component authors to work with
449
- * features like children.
450
- *
451
- * The children of a functional component will be passed as the second
452
- * argument, so a functional component which uses these utils to transform its
453
- * children might look like the following:
454
- *
455
- * ```ts
456
- * export const AddClass: FunctionalComponent = (_, children, utils) => (
457
- * utils.map(children, child => ({
458
- * ...child,
459
- * vattrs: {
460
- * ...child.vattrs,
461
- * class: `${child.vattrs.class} add-class`
462
- * }
463
- * }))
464
- * );
465
- * ```
466
- *
467
- * For more see the Stencil documentation, here:
468
- * https://stenciljs.com/docs/functional-components
469
- */
470
436
  export interface FunctionalUtilities {
471
- /**
472
- * Utility for reading the children of a functional component at runtime.
473
- * Since the Stencil runtime uses a different interface for children it is
474
- * not recommendeded to read the children directly, and is preferable to use
475
- * this utility to, for instance, perform a side effect for each child.
476
- */
477
437
  forEach: (children: VNode[], cb: (vnode: ChildNode, index: number, array: ChildNode[]) => void) => void;
478
- /**
479
- * Utility for transforming the children of a functional component. Given an
480
- * array of children and a callback this will return a list of the results of
481
- * passing each child to the supplied callback.
482
- */
483
438
  map: (children: VNode[], cb: (vnode: ChildNode, index: number, array: ChildNode[]) => ChildNode) => VNode[];
484
439
  }
485
440
  export interface FunctionalComponent<T = {}> {
486
441
  (props: T, children: VNode[], utils: FunctionalUtilities): VNode | VNode[];
487
442
  }
488
- /**
489
- * A Child VDOM node
490
- *
491
- * This has most of the same properties as {@link VNode} but friendlier names
492
- * (i.e. `vtag` instead of `$tag$`, `vchildren` instead of `$children$`) in
493
- * order to provide a friendlier public interface for users of the
494
- * {@link FunctionalUtilities}).
495
- */
496
443
  export interface ChildNode {
497
444
  vtag?: string | number | Function;
498
445
  vkey?: string | number;
@@ -539,9 +486,6 @@ export declare function h(sel: any, children: Array<VNode | undefined | null>):
539
486
  export declare function h(sel: any, data: VNodeData | null, text: string): VNode;
540
487
  export declare function h(sel: any, data: VNodeData | null, children: Array<VNode | undefined | null>): VNode;
541
488
  export declare function h(sel: any, data: VNodeData | null, children: VNode): VNode;
542
- /**
543
- * A virtual DOM node
544
- */
545
489
  export interface VNode {
546
490
  $flags$: number;
547
491
  $tag$: string | number | Function;
package/loader/index.d.ts CHANGED
@@ -10,12 +10,3 @@ export interface CustomElementsDefineOptions {
10
10
  }
11
11
  export declare function defineCustomElements(win?: Window, opts?: CustomElementsDefineOptions): Promise<void>;
12
12
  export declare function applyPolyfills(): Promise<void>;
13
-
14
- /**
15
- * Used to specify a nonce value that corresponds with an application's CSP.
16
- * When set, the nonce will be added to all dynamically created script and style tags at runtime.
17
- * Alternatively, the nonce value can be set on a meta tag in the DOM head
18
- * (<meta name="csp-nonce" content="{ nonce value here }" />) which
19
- * will result in the same behavior.
20
- */
21
- export declare function setNonce(nonce: string): void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@3t-transform/threeteeui",
3
- "version": "0.0.23",
3
+ "version": "0.0.24",
4
4
  "description": "3t Design System",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.js",
@@ -67,6 +67,7 @@
67
67
  "readme": "ERROR: No README data found!",
68
68
  "dependencies": {
69
69
  "@popperjs/core": "^2.11.7",
70
+ "dompurify": "^3.0.3",
70
71
  "storybook": "^7.0.6"
71
72
  }
72
73
  }