@3t-transform/threeteeui 0.0.14 → 0.0.16
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.
- package/dist/cjs/{index-bf39be87.js → index-864b7110.js} +4 -3
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/tttx-button.cjs.entry.js +18 -18
- package/dist/cjs/tttx-checkbox.cjs.entry.js +18 -18
- package/dist/cjs/tttx-form.cjs.entry.js +364 -176
- package/dist/cjs/tttx-icon.cjs.entry.js +56 -54
- package/dist/cjs/tttx-list.cjs.entry.js +188 -188
- package/dist/cjs/tttx-loading-spinner.cjs.entry.js +16 -16
- package/dist/cjs/tttx-popover-content.cjs.entry.js +13 -13
- package/dist/cjs/tttx-standalone-input.cjs.entry.js +127 -127
- package/dist/cjs/tttx-table.cjs.entry.js +60 -0
- package/dist/cjs/tttx.cjs.js +2 -2
- package/dist/collection/collection-manifest.json +2 -1
- package/dist/collection/components/atoms/tttx-button/tttx-button.js +93 -93
- package/dist/collection/components/atoms/tttx-button/tttx-button.stories.js +25 -25
- package/dist/collection/components/atoms/tttx-icon/tttx-icon.js +116 -114
- package/dist/collection/components/atoms/tttx-icon/tttx-icon.stories.js +32 -32
- package/dist/collection/components/atoms/tttx-loading-spinner/tttx-loading-spinner.js +66 -66
- package/dist/collection/components/atoms/tttx-loading-spinner/tttx-loading-spinner.stories.js +17 -17
- package/dist/collection/components/atoms/tttx-popover-content/tttx-popover-content.js +96 -96
- package/dist/collection/components/atoms/tttx-popover-content/tttx-popover-content.stories.js +23 -23
- package/dist/collection/components/atoms/ttx-checkbox/tttx-checkbox.js +101 -101
- package/dist/collection/components/atoms/ttx-checkbox/tttx-checkbox.stories.js +9 -9
- package/dist/collection/components/molecules/tttx-form/tttx-form.js +451 -249
- package/dist/collection/components/molecules/tttx-form/tttx-form.stories.js +109 -102
- package/dist/collection/components/molecules/tttx-list/tttx-list.js +311 -311
- package/dist/collection/components/molecules/tttx-list/tttx-list.stories.js +15 -15
- package/dist/collection/components/molecules/tttx-standalone-input/tttx-standalone-input.js +569 -569
- package/dist/collection/components/molecules/tttx-standalone-input/tttx-standalone-input.stories.js +134 -134
- package/dist/collection/components/molecules/tttx-table/tttx-table.css +166 -0
- package/dist/collection/components/molecules/tttx-table/tttx-table.js +177 -0
- package/dist/collection/components/molecules/tttx-table/tttx-table.stories.js +81 -0
- package/dist/collection/components/palette.stories.js +7 -7
- package/dist/collection/docs/gettingstarted-developer.stories.js +5 -5
- package/dist/collection/icons.js +2838 -2838
- package/dist/collection/index.js +1 -1
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.js +1 -0
- package/dist/components/tttx-button.js +35 -35
- package/dist/components/tttx-checkbox.js +36 -36
- package/dist/components/tttx-form.js +381 -193
- package/dist/components/tttx-icon2.js +73 -71
- package/dist/components/tttx-list.js +214 -214
- package/dist/components/tttx-loading-spinner2.js +33 -33
- package/dist/components/tttx-popover-content.js +1 -37
- package/dist/components/tttx-popover-content2.js +39 -0
- package/dist/components/tttx-standalone-input.js +169 -168
- package/dist/components/tttx-table.d.ts +11 -0
- package/dist/components/tttx-table.js +91 -0
- package/dist/esm/{index-63c4d25e.js → index-232e347b.js} +4 -3
- package/dist/esm/loader.js +3 -3
- package/dist/esm/polyfills/core-js.js +0 -0
- package/dist/esm/polyfills/dom.js +0 -0
- package/dist/esm/polyfills/es5-html-element.js +0 -0
- package/dist/esm/polyfills/index.js +0 -0
- package/dist/esm/polyfills/system.js +0 -0
- package/dist/esm/tttx-button.entry.js +18 -18
- package/dist/esm/tttx-checkbox.entry.js +18 -18
- package/dist/esm/tttx-form.entry.js +364 -176
- package/dist/esm/tttx-icon.entry.js +56 -54
- package/dist/esm/tttx-list.entry.js +188 -188
- package/dist/esm/tttx-loading-spinner.entry.js +16 -16
- package/dist/esm/tttx-popover-content.entry.js +13 -13
- package/dist/esm/tttx-standalone-input.entry.js +127 -127
- package/dist/esm/tttx-table.entry.js +56 -0
- package/dist/esm/tttx.js +3 -3
- package/dist/tttx/{p-2d54f8aa.entry.js → p-01e1894e.entry.js} +1 -1
- package/dist/tttx/{p-709246f5.entry.js → p-10316ff1.entry.js} +1 -1
- package/dist/tttx/p-125f06b3.entry.js +1 -0
- package/dist/tttx/p-184c4fae.js +2 -0
- package/dist/tttx/{p-ad0c3fe4.entry.js → p-3973b7dd.entry.js} +1 -1
- package/dist/tttx/p-5ce1ba22.entry.js +1 -0
- package/dist/tttx/{p-4c57bcbd.entry.js → p-6828fe6f.entry.js} +1 -1
- package/dist/tttx/p-b1c22f5f.entry.js +1 -0
- package/dist/tttx/{p-1a4eb1f3.entry.js → p-c7f9be65.entry.js} +1 -1
- package/dist/tttx/{p-2b6720ac.entry.js → p-fe4c70b2.entry.js} +1 -1
- package/dist/tttx/tttx.esm.js +1 -1
- package/dist/types/components/atoms/tttx-button/tttx-button.d.ts +9 -9
- package/dist/types/components/atoms/tttx-button/tttx-button.stories.d.ts +20 -20
- package/dist/types/components/atoms/tttx-icon/tttx-icon.d.ts +14 -14
- package/dist/types/components/atoms/tttx-icon/tttx-icon.stories.d.ts +21 -21
- package/dist/types/components/atoms/tttx-loading-spinner/tttx-loading-spinner.d.ts +6 -6
- package/dist/types/components/atoms/tttx-loading-spinner/tttx-loading-spinner.stories.d.ts +17 -17
- package/dist/types/components/atoms/tttx-popover-content/tttx-popover-content.d.ts +7 -7
- package/dist/types/components/atoms/tttx-popover-content/tttx-popover-content.stories.d.ts +18 -18
- package/dist/types/components/atoms/ttx-checkbox/tttx-checkbox.d.ts +9 -9
- package/dist/types/components/atoms/ttx-checkbox/tttx-checkbox.stories.d.ts +6 -6
- package/dist/types/components/molecules/tttx-form/tttx-form.d.ts +134 -18
- package/dist/types/components/molecules/tttx-form/tttx-form.stories.d.ts +12 -6
- package/dist/types/components/molecules/tttx-list/tttx-list.d.ts +51 -51
- package/dist/types/components/molecules/tttx-list/tttx-list.stories.d.ts +13 -13
- package/dist/types/components/molecules/tttx-standalone-input/tttx-standalone-input.d.ts +38 -38
- package/dist/types/components/molecules/tttx-standalone-input/tttx-standalone-input.stories.d.ts +106 -106
- package/dist/types/components/molecules/tttx-table/tttx-table.d.ts +15 -0
- package/dist/types/components/molecules/tttx-table/tttx-table.stories.d.ts +21 -0
- package/dist/types/components/palette.stories.d.ts +6 -6
- package/dist/types/components.d.ts +29 -1
- package/dist/types/docs/gettingstarted-developer.stories.d.ts +5 -5
- package/dist/types/icons.d.ts +2 -2
- package/dist/types/index.d.ts +1 -1
- package/package.json +7 -4
- package/dist/tttx/p-28e4c359.entry.js +0 -1
- package/dist/tttx/p-95a29e09.entry.js +0 -1
- package/dist/tttx/p-bec472d8.js +0 -2
package/dist/collection/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -7,6 +7,7 @@ export { TttxList as TttxList } from '../types/components/molecules/tttx-list/tt
|
|
|
7
7
|
export { TttxLoadingSpinner as TttxLoadingSpinner } from '../types/components/atoms/tttx-loading-spinner/tttx-loading-spinner';
|
|
8
8
|
export { TttxPopoverContent as TttxPopoverContent } from '../types/components/atoms/tttx-popover-content/tttx-popover-content';
|
|
9
9
|
export { TttxInput as TttxStandaloneInput } from '../types/components/molecules/tttx-standalone-input/tttx-standalone-input';
|
|
10
|
+
export { TttxTable as TttxTable } from '../types/components/molecules/tttx-table/tttx-table';
|
|
10
11
|
|
|
11
12
|
/**
|
|
12
13
|
* Used to manually set the base path where assets can be found.
|
package/dist/components/index.js
CHANGED
|
@@ -7,3 +7,4 @@ export { TttxList, defineCustomElement as defineCustomElementTttxList } from './
|
|
|
7
7
|
export { TttxLoadingSpinner, defineCustomElement as defineCustomElementTttxLoadingSpinner } from './tttx-loading-spinner.js';
|
|
8
8
|
export { TttxPopoverContent, defineCustomElement as defineCustomElementTttxPopoverContent } from './tttx-popover-content.js';
|
|
9
9
|
export { TttxStandaloneInput, defineCustomElement as defineCustomElementTttxStandaloneInput } from './tttx-standalone-input.js';
|
|
10
|
+
export { TttxTable, defineCustomElement as defineCustomElementTttxTable } from './tttx-table.js';
|
|
@@ -2,41 +2,41 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
|
|
|
2
2
|
|
|
3
3
|
const tttxButtonCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.button{height:36px;padding:8px 16px;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:hover{background:#f0f0f0}.button:active{background:#e3e3e3}.primary-blue{background:#1479c6;border:1px solid #1479c6;color:white}.primary-blue:hover{background:#1169ba}.primary-blue:active{background:#0951a8}.secondary-white{background:white;border:1px solid #212121}:host{display:inline-block}.spacingleft{margin-left:8px}.font-white{color:white}.font-black{color:#212121}";
|
|
4
4
|
|
|
5
|
-
const TttxButton$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
6
|
-
constructor() {
|
|
7
|
-
super();
|
|
8
|
-
this.__registerHost();
|
|
9
|
-
this.__attachShadow();
|
|
10
|
-
this.clickEvent = createEvent(this, "clickEvent", 7);
|
|
11
|
-
this.fontColor = undefined;
|
|
12
|
-
this.buttonStyle = undefined;
|
|
13
|
-
}
|
|
14
|
-
onClick() {
|
|
15
|
-
this.clickEvent.emit('clicked');
|
|
16
|
-
}
|
|
17
|
-
onClicked(event) {
|
|
18
|
-
console.log('Picked up a clickEvent', event);
|
|
19
|
-
}
|
|
20
|
-
render() {
|
|
21
|
-
return (h(Host, null, h("button", { onClick: this.onClick.bind(this), class: `button ${this.fontColor} ${this.buttonStyle}` }, h("span", null, h("slot", null)))));
|
|
22
|
-
}
|
|
23
|
-
static get style() { return tttxButtonCss; }
|
|
24
|
-
}, [1, "tttx-button", {
|
|
25
|
-
"fontColor": [1, "font-color"],
|
|
26
|
-
"buttonStyle": [1, "button-style"]
|
|
27
|
-
}, [[0, "clickEvent", "onClicked"]]]);
|
|
28
|
-
function defineCustomElement$1() {
|
|
29
|
-
if (typeof customElements === "undefined") {
|
|
30
|
-
return;
|
|
31
|
-
}
|
|
32
|
-
const components = ["tttx-button"];
|
|
33
|
-
components.forEach(tagName => { switch (tagName) {
|
|
34
|
-
case "tttx-button":
|
|
35
|
-
if (!customElements.get(tagName)) {
|
|
36
|
-
customElements.define(tagName, TttxButton$1);
|
|
37
|
-
}
|
|
38
|
-
break;
|
|
39
|
-
} });
|
|
5
|
+
const TttxButton$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
6
|
+
constructor() {
|
|
7
|
+
super();
|
|
8
|
+
this.__registerHost();
|
|
9
|
+
this.__attachShadow();
|
|
10
|
+
this.clickEvent = createEvent(this, "clickEvent", 7);
|
|
11
|
+
this.fontColor = undefined;
|
|
12
|
+
this.buttonStyle = undefined;
|
|
13
|
+
}
|
|
14
|
+
onClick() {
|
|
15
|
+
this.clickEvent.emit('clicked');
|
|
16
|
+
}
|
|
17
|
+
onClicked(event) {
|
|
18
|
+
console.log('Picked up a clickEvent', event);
|
|
19
|
+
}
|
|
20
|
+
render() {
|
|
21
|
+
return (h(Host, null, h("button", { onClick: this.onClick.bind(this), class: `button ${this.fontColor} ${this.buttonStyle}` }, h("span", null, h("slot", null)))));
|
|
22
|
+
}
|
|
23
|
+
static get style() { return tttxButtonCss; }
|
|
24
|
+
}, [1, "tttx-button", {
|
|
25
|
+
"fontColor": [1, "font-color"],
|
|
26
|
+
"buttonStyle": [1, "button-style"]
|
|
27
|
+
}, [[0, "clickEvent", "onClicked"]]]);
|
|
28
|
+
function defineCustomElement$1() {
|
|
29
|
+
if (typeof customElements === "undefined") {
|
|
30
|
+
return;
|
|
31
|
+
}
|
|
32
|
+
const components = ["tttx-button"];
|
|
33
|
+
components.forEach(tagName => { switch (tagName) {
|
|
34
|
+
case "tttx-button":
|
|
35
|
+
if (!customElements.get(tagName)) {
|
|
36
|
+
customElements.define(tagName, TttxButton$1);
|
|
37
|
+
}
|
|
38
|
+
break;
|
|
39
|
+
} });
|
|
40
40
|
}
|
|
41
41
|
|
|
42
42
|
const TttxButton = TttxButton$1;
|
|
@@ -2,42 +2,42 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
|
|
|
2
2
|
|
|
3
3
|
const tttxCheckboxCss = ".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}.icon-left,.icon-right{flex-basis:24px}.icon-left span,.icon-right span{font-size:24px;line-height:24px;text-align:center;display:block;width:24px;height:24px;margin-top:4px}.icon-left span{margin-left:4px}.icon-right span{margin-right:4px}.icon-right{margin-top:5px;margin-right:4px}.icon-left{margin-top:5px;margin-left:4px}.iconleft .input{padding-left:4px}.iconright .input{padding-right:4px}.focused{border-color:#1479c6}.errormsg{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 .validationicon{width:16px;height:16px;font-size:16px;margin-right:4px;vertical-align:middle;color:#dc0000}.danger{color:#dc0000}.optional{color:#757575;font-weight:normal}label.inputBlock{display:block;position:relative;line-height:21px}label{font-weight:500;font-size:16px}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]{background:white;display:block;min-width:calc(100% - 18px);line-height:37px}input.invalid:invalid,input.standalone.invalid{border:1px solid #dc0000}input~.errorBubble{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~.errorBubble:not(.visible){visibility:hidden}input~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px;height:16px}input.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000;visibility:visible}input:focus{border-color:#1479c6}:host{display:block}.spacing{margin-bottom:16px}";
|
|
4
4
|
|
|
5
|
-
const TttxCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
6
|
-
constructor() {
|
|
7
|
-
super();
|
|
8
|
-
this.__registerHost();
|
|
9
|
-
this.__attachShadow();
|
|
10
|
-
this.valueChanged = createEvent(this, "valueChanged", 7);
|
|
11
|
-
this.value = undefined;
|
|
12
|
-
this.label = undefined;
|
|
13
|
-
this.required = undefined;
|
|
14
|
-
}
|
|
15
|
-
handleClick(event) {
|
|
16
|
-
const target = event.target;
|
|
17
|
-
this.value = target.checked;
|
|
18
|
-
this.valueChanged.emit(target.checked);
|
|
19
|
-
}
|
|
20
|
-
render() {
|
|
21
|
-
return (h(Host, null, h("div", { class: "field spacing" }, this.label && (h("label", { class: "label" }, this.label, !this.required ? h("span", { class: "optional" }, " (optional)") : '')), h("input", { type: "checkbox", class: "input", onChange: event => this.handleClick(event), checked: this.value }))));
|
|
22
|
-
}
|
|
23
|
-
static get style() { return tttxCheckboxCss; }
|
|
24
|
-
}, [1, "tttx-checkbox", {
|
|
25
|
-
"value": [4],
|
|
26
|
-
"label": [1],
|
|
27
|
-
"required": [4]
|
|
28
|
-
}]);
|
|
29
|
-
function defineCustomElement$1() {
|
|
30
|
-
if (typeof customElements === "undefined") {
|
|
31
|
-
return;
|
|
32
|
-
}
|
|
33
|
-
const components = ["tttx-checkbox"];
|
|
34
|
-
components.forEach(tagName => { switch (tagName) {
|
|
35
|
-
case "tttx-checkbox":
|
|
36
|
-
if (!customElements.get(tagName)) {
|
|
37
|
-
customElements.define(tagName, TttxCheckbox$1);
|
|
38
|
-
}
|
|
39
|
-
break;
|
|
40
|
-
} });
|
|
5
|
+
const TttxCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
6
|
+
constructor() {
|
|
7
|
+
super();
|
|
8
|
+
this.__registerHost();
|
|
9
|
+
this.__attachShadow();
|
|
10
|
+
this.valueChanged = createEvent(this, "valueChanged", 7);
|
|
11
|
+
this.value = undefined;
|
|
12
|
+
this.label = undefined;
|
|
13
|
+
this.required = undefined;
|
|
14
|
+
}
|
|
15
|
+
handleClick(event) {
|
|
16
|
+
const target = event.target;
|
|
17
|
+
this.value = target.checked;
|
|
18
|
+
this.valueChanged.emit(target.checked);
|
|
19
|
+
}
|
|
20
|
+
render() {
|
|
21
|
+
return (h(Host, null, h("div", { class: "field spacing" }, this.label && (h("label", { class: "label" }, this.label, !this.required ? h("span", { class: "optional" }, " (optional)") : '')), h("input", { type: "checkbox", class: "input", onChange: event => this.handleClick(event), checked: this.value }))));
|
|
22
|
+
}
|
|
23
|
+
static get style() { return tttxCheckboxCss; }
|
|
24
|
+
}, [1, "tttx-checkbox", {
|
|
25
|
+
"value": [4],
|
|
26
|
+
"label": [1],
|
|
27
|
+
"required": [4]
|
|
28
|
+
}]);
|
|
29
|
+
function defineCustomElement$1() {
|
|
30
|
+
if (typeof customElements === "undefined") {
|
|
31
|
+
return;
|
|
32
|
+
}
|
|
33
|
+
const components = ["tttx-checkbox"];
|
|
34
|
+
components.forEach(tagName => { switch (tagName) {
|
|
35
|
+
case "tttx-checkbox":
|
|
36
|
+
if (!customElements.get(tagName)) {
|
|
37
|
+
customElements.define(tagName, TttxCheckbox$1);
|
|
38
|
+
}
|
|
39
|
+
break;
|
|
40
|
+
} });
|
|
41
41
|
}
|
|
42
42
|
|
|
43
43
|
const TttxCheckbox = TttxCheckbox$1;
|