@3t-transform/threeteeui 0.1.57 → 0.1.58
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/tttx-button.cjs.entry.js +1 -1
- package/dist/cjs/tttx-form.cjs.entry.js +1 -1
- package/dist/collection/components/atoms/tttx-button/tttx-button.css +37 -35
- package/dist/collection/components/molecules/tttx-form/tttx-form.css +37 -35
- package/dist/components/tttx-button2.js +1 -1
- package/dist/components/tttx-form.js +1 -1
- package/dist/esm/tttx-button.entry.js +1 -1
- package/dist/esm/tttx-form.entry.js +1 -1
- package/dist/tttx/{p-f37acea5.entry.js → p-28d80500.entry.js} +1 -1
- package/dist/tttx/{p-58d7c978.entry.js → p-811f3acf.entry.js} +1 -1
- package/dist/tttx/tttx.esm.js +1 -1
- package/package.json +1 -1
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-43af0e62.js');
|
|
6
6
|
|
|
7
|
-
const tttxButtonCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}button{cursor:pointer}.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:
|
|
7
|
+
const tttxButtonCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}button{cursor:pointer}.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:active{background:rgba(17, 17, 17, 0.2);border:1px solid #d5d5d5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:active{background:#1464a2;border:1px solid #1464a2}.borderless{background:transparent;border:none;color:#212121}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.danger{background:#dc0000;border:1px solid #dc0000;color:white}.danger:active{background:#b00000;border:1px solid #b00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}@media (hover: hover){.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #d5d5d5}.primary:hover{background:#146eb3;border:1px solid #146eb3}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.danger:hover{background:#c60000;border:1px solid #c60000}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}}:host{display:inline-block}tttx-icon{cursor:inherit}.spacingleft{margin-left:8px}";
|
|
8
8
|
|
|
9
9
|
const TttxButton = class {
|
|
10
10
|
constructor(hostRef) {
|
|
@@ -104,7 +104,7 @@ function setErrorState(target, hasError, errorMessage) {
|
|
|
104
104
|
}
|
|
105
105
|
}
|
|
106
106
|
|
|
107
|
-
const tttxFormCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.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:normal;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}.icon-left{margin-top:5px;margin-left:4px}.iconleft .input{padding-left:4px}.iconright .input{padding-right:4px}.input-icon{position:absolute;margin-top:9px;margin-left:4px}.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;line-height:16px;border-radius:none;z-index:2;color:#dc0000}.errormsg .validationicon{width:16px;height:16px;font-size:16px;line-height:19px;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.inputInline{display:flex;white-space:nowrap;align-items:center}label.inputInline .input-container{margin:0 4px;width:100%;display:flex;align-items:center;gap:4px;position:relative}label{font-weight:500;font-size:16px;line-height:19px;margin-bottom:16px}input:not([type=submit]){font-family:\"Roboto\", serif;box-sizing:border-box;width:100%;height:36px;padding:0 16px;font-size:16px;line-height:19px;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}@media (max-width: 600px){input[type=date]{padding-top:6px}}input.invalid:invalid,input.standalone.invalid{border:1px solid #dc0000}.input-icon~input{padding:0 32px}input~.errorBubble{position:relative;font-size:14px;line-height:16px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center;margin-top:4px}input~.errorBubble:not(.visible){display:none}input~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px}input.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000}input:focus{border-color:#1479c6}input:focus-visible{outline:none}.secondarylabel{color:#757575;font-size:14px;line-height:16px;font-weight:normal;display:flex;margin-top:4px}label.inputBlock.readonly{pointer-events:none;user-select:none;color:gray}input[readonly]{cursor:default;pointer-events:none;user-select:none;color:gray}button{cursor:pointer}.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:
|
|
107
|
+
const tttxFormCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.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:normal;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}.icon-left{margin-top:5px;margin-left:4px}.iconleft .input{padding-left:4px}.iconright .input{padding-right:4px}.input-icon{position:absolute;margin-top:9px;margin-left:4px}.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;line-height:16px;border-radius:none;z-index:2;color:#dc0000}.errormsg .validationicon{width:16px;height:16px;font-size:16px;line-height:19px;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.inputInline{display:flex;white-space:nowrap;align-items:center}label.inputInline .input-container{margin:0 4px;width:100%;display:flex;align-items:center;gap:4px;position:relative}label{font-weight:500;font-size:16px;line-height:19px;margin-bottom:16px}input:not([type=submit]){font-family:\"Roboto\", serif;box-sizing:border-box;width:100%;height:36px;padding:0 16px;font-size:16px;line-height:19px;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}@media (max-width: 600px){input[type=date]{padding-top:6px}}input.invalid:invalid,input.standalone.invalid{border:1px solid #dc0000}.input-icon~input{padding:0 32px}input~.errorBubble{position:relative;font-size:14px;line-height:16px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center;margin-top:4px}input~.errorBubble:not(.visible){display:none}input~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px}input.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000}input:focus{border-color:#1479c6}input:focus-visible{outline:none}.secondarylabel{color:#757575;font-size:14px;line-height:16px;font-weight:normal;display:flex;margin-top:4px}label.inputBlock.readonly{pointer-events:none;user-select:none;color:gray}input[readonly]{cursor:default;pointer-events:none;user-select:none;color:gray}button{cursor:pointer}.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:active{background:rgba(17, 17, 17, 0.2);border:1px solid #d5d5d5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:active{background:#1464a2;border:1px solid #1464a2}.borderless{background:transparent;border:none;color:#212121}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.danger{background:#dc0000;border:1px solid #dc0000;color:white}.danger:active{background:#b00000;border:1px solid #b00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}@media (hover: hover){.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #d5d5d5}.primary:hover{background:#146eb3;border:1px solid #146eb3}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.danger:hover{background:#c60000;border:1px solid #c60000}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}}:host{display:block}fieldset{margin:0;padding:0;border:none}label.inputBlock.inlineBlock{display:inline-block}.inlineLabel{font-weight:400;display:inline-block;vertical-align:top;padding-top:4px}input[type=checkbox]{width:18px;height:18px}input~label{font-weight:400}select{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}.placeholder{color:#9e9e9e}.placeholder option{color:initial}select.invalid:invalid{border:1px solid #dc0000}select~.errorBubble{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}select~.errorBubble:not(.visible){visibility:hidden}select~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px;height:16px}select.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000;visibility:visible}select:focus{border-color:#1479c6}select:focus-visible{outline:none}.button{padding:0 16px}.footer{display:flex;gap:16px;flex-direction:row-reverse}";
|
|
108
108
|
|
|
109
109
|
const TttxForm = class {
|
|
110
110
|
constructor(hostRef) {
|
|
@@ -30,7 +30,8 @@ button {
|
|
|
30
30
|
padding: 0 16px;
|
|
31
31
|
}
|
|
32
32
|
|
|
33
|
-
.icon-left,
|
|
33
|
+
.icon-left,
|
|
34
|
+
.icon-right {
|
|
34
35
|
margin-top: 4px;
|
|
35
36
|
}
|
|
36
37
|
|
|
@@ -54,14 +55,9 @@ button {
|
|
|
54
55
|
padding: 0 6px;
|
|
55
56
|
}
|
|
56
57
|
|
|
57
|
-
.button:hover {
|
|
58
|
-
background: rgba(17, 17, 17, 0.1);
|
|
59
|
-
border: 1px solid #D5D5D5;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
58
|
.button:active {
|
|
63
59
|
background: rgba(17, 17, 17, 0.2);
|
|
64
|
-
border: 1px solid #
|
|
60
|
+
border: 1px solid #d5d5d5;
|
|
65
61
|
}
|
|
66
62
|
|
|
67
63
|
.primary {
|
|
@@ -70,14 +66,9 @@ button {
|
|
|
70
66
|
color: white;
|
|
71
67
|
}
|
|
72
68
|
|
|
73
|
-
.primary:hover {
|
|
74
|
-
background: #146EB3;
|
|
75
|
-
border: 1px solid #146EB3;
|
|
76
|
-
}
|
|
77
|
-
|
|
78
69
|
.primary:active {
|
|
79
|
-
background: #
|
|
80
|
-
border: 1px solid #
|
|
70
|
+
background: #1464a2;
|
|
71
|
+
border: 1px solid #1464a2;
|
|
81
72
|
}
|
|
82
73
|
|
|
83
74
|
.borderless {
|
|
@@ -86,30 +77,20 @@ button {
|
|
|
86
77
|
color: #212121;
|
|
87
78
|
}
|
|
88
79
|
|
|
89
|
-
.borderless:hover {
|
|
90
|
-
background: rgba(17, 17, 17, 0.1);
|
|
91
|
-
border: none;
|
|
92
|
-
}
|
|
93
|
-
|
|
94
80
|
.borderless:active {
|
|
95
81
|
background: rgba(17, 17, 17, 0.2);
|
|
96
82
|
border: none;
|
|
97
83
|
}
|
|
98
84
|
|
|
99
85
|
.danger {
|
|
100
|
-
background: #
|
|
101
|
-
border: 1px solid #
|
|
86
|
+
background: #dc0000;
|
|
87
|
+
border: 1px solid #dc0000;
|
|
102
88
|
color: white;
|
|
103
89
|
}
|
|
104
90
|
|
|
105
|
-
.danger:hover {
|
|
106
|
-
background: #C60000;
|
|
107
|
-
border: 1px solid #C60000;
|
|
108
|
-
}
|
|
109
|
-
|
|
110
91
|
.danger:active {
|
|
111
|
-
background: #
|
|
112
|
-
border: 1px solid #
|
|
92
|
+
background: #b00000;
|
|
93
|
+
border: 1px solid #b00000;
|
|
113
94
|
}
|
|
114
95
|
|
|
115
96
|
.disabled {
|
|
@@ -119,13 +100,6 @@ button {
|
|
|
119
100
|
cursor: not-allowed;
|
|
120
101
|
}
|
|
121
102
|
|
|
122
|
-
.disabled:hover {
|
|
123
|
-
background: #aeaeae;
|
|
124
|
-
border: none;
|
|
125
|
-
color: #4c4c4c;
|
|
126
|
-
cursor: not-allowed;
|
|
127
|
-
}
|
|
128
|
-
|
|
129
103
|
.disabled:active {
|
|
130
104
|
background: #aeaeae;
|
|
131
105
|
border: none;
|
|
@@ -133,6 +107,34 @@ button {
|
|
|
133
107
|
cursor: not-allowed;
|
|
134
108
|
}
|
|
135
109
|
|
|
110
|
+
@media (hover: hover) {
|
|
111
|
+
.button:hover {
|
|
112
|
+
background: rgba(17, 17, 17, 0.1);
|
|
113
|
+
border: 1px solid #d5d5d5;
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
.primary:hover {
|
|
117
|
+
background: #146eb3;
|
|
118
|
+
border: 1px solid #146eb3;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
.borderless:hover {
|
|
122
|
+
background: rgba(17, 17, 17, 0.1);
|
|
123
|
+
border: none;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
.danger:hover {
|
|
127
|
+
background: #c60000;
|
|
128
|
+
border: 1px solid #c60000;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
.disabled:hover {
|
|
132
|
+
background: #aeaeae;
|
|
133
|
+
border: none;
|
|
134
|
+
color: #4c4c4c;
|
|
135
|
+
cursor: not-allowed;
|
|
136
|
+
}
|
|
137
|
+
}
|
|
136
138
|
:host {
|
|
137
139
|
display: inline-block;
|
|
138
140
|
}
|
|
@@ -259,7 +259,8 @@ button {
|
|
|
259
259
|
padding: 0 16px;
|
|
260
260
|
}
|
|
261
261
|
|
|
262
|
-
.icon-left,
|
|
262
|
+
.icon-left,
|
|
263
|
+
.icon-right {
|
|
263
264
|
margin-top: 4px;
|
|
264
265
|
}
|
|
265
266
|
|
|
@@ -283,14 +284,9 @@ button {
|
|
|
283
284
|
padding: 0 6px;
|
|
284
285
|
}
|
|
285
286
|
|
|
286
|
-
.button:hover {
|
|
287
|
-
background: rgba(17, 17, 17, 0.1);
|
|
288
|
-
border: 1px solid #D5D5D5;
|
|
289
|
-
}
|
|
290
|
-
|
|
291
287
|
.button:active {
|
|
292
288
|
background: rgba(17, 17, 17, 0.2);
|
|
293
|
-
border: 1px solid #
|
|
289
|
+
border: 1px solid #d5d5d5;
|
|
294
290
|
}
|
|
295
291
|
|
|
296
292
|
.primary {
|
|
@@ -299,14 +295,9 @@ button {
|
|
|
299
295
|
color: white;
|
|
300
296
|
}
|
|
301
297
|
|
|
302
|
-
.primary:hover {
|
|
303
|
-
background: #146EB3;
|
|
304
|
-
border: 1px solid #146EB3;
|
|
305
|
-
}
|
|
306
|
-
|
|
307
298
|
.primary:active {
|
|
308
|
-
background: #
|
|
309
|
-
border: 1px solid #
|
|
299
|
+
background: #1464a2;
|
|
300
|
+
border: 1px solid #1464a2;
|
|
310
301
|
}
|
|
311
302
|
|
|
312
303
|
.borderless {
|
|
@@ -315,30 +306,20 @@ button {
|
|
|
315
306
|
color: #212121;
|
|
316
307
|
}
|
|
317
308
|
|
|
318
|
-
.borderless:hover {
|
|
319
|
-
background: rgba(17, 17, 17, 0.1);
|
|
320
|
-
border: none;
|
|
321
|
-
}
|
|
322
|
-
|
|
323
309
|
.borderless:active {
|
|
324
310
|
background: rgba(17, 17, 17, 0.2);
|
|
325
311
|
border: none;
|
|
326
312
|
}
|
|
327
313
|
|
|
328
314
|
.danger {
|
|
329
|
-
background: #
|
|
330
|
-
border: 1px solid #
|
|
315
|
+
background: #dc0000;
|
|
316
|
+
border: 1px solid #dc0000;
|
|
331
317
|
color: white;
|
|
332
318
|
}
|
|
333
319
|
|
|
334
|
-
.danger:hover {
|
|
335
|
-
background: #C60000;
|
|
336
|
-
border: 1px solid #C60000;
|
|
337
|
-
}
|
|
338
|
-
|
|
339
320
|
.danger:active {
|
|
340
|
-
background: #
|
|
341
|
-
border: 1px solid #
|
|
321
|
+
background: #b00000;
|
|
322
|
+
border: 1px solid #b00000;
|
|
342
323
|
}
|
|
343
324
|
|
|
344
325
|
.disabled {
|
|
@@ -348,13 +329,6 @@ button {
|
|
|
348
329
|
cursor: not-allowed;
|
|
349
330
|
}
|
|
350
331
|
|
|
351
|
-
.disabled:hover {
|
|
352
|
-
background: #aeaeae;
|
|
353
|
-
border: none;
|
|
354
|
-
color: #4c4c4c;
|
|
355
|
-
cursor: not-allowed;
|
|
356
|
-
}
|
|
357
|
-
|
|
358
332
|
.disabled:active {
|
|
359
333
|
background: #aeaeae;
|
|
360
334
|
border: none;
|
|
@@ -362,6 +336,34 @@ button {
|
|
|
362
336
|
cursor: not-allowed;
|
|
363
337
|
}
|
|
364
338
|
|
|
339
|
+
@media (hover: hover) {
|
|
340
|
+
.button:hover {
|
|
341
|
+
background: rgba(17, 17, 17, 0.1);
|
|
342
|
+
border: 1px solid #d5d5d5;
|
|
343
|
+
}
|
|
344
|
+
|
|
345
|
+
.primary:hover {
|
|
346
|
+
background: #146eb3;
|
|
347
|
+
border: 1px solid #146eb3;
|
|
348
|
+
}
|
|
349
|
+
|
|
350
|
+
.borderless:hover {
|
|
351
|
+
background: rgba(17, 17, 17, 0.1);
|
|
352
|
+
border: none;
|
|
353
|
+
}
|
|
354
|
+
|
|
355
|
+
.danger:hover {
|
|
356
|
+
background: #c60000;
|
|
357
|
+
border: 1px solid #c60000;
|
|
358
|
+
}
|
|
359
|
+
|
|
360
|
+
.disabled:hover {
|
|
361
|
+
background: #aeaeae;
|
|
362
|
+
border: none;
|
|
363
|
+
color: #4c4c4c;
|
|
364
|
+
cursor: not-allowed;
|
|
365
|
+
}
|
|
366
|
+
}
|
|
365
367
|
:host {
|
|
366
368
|
display: block;
|
|
367
369
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
import { d as defineCustomElement$1 } from './tttx-icon2.js';
|
|
3
3
|
|
|
4
|
-
const tttxButtonCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}button{cursor:pointer}.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:
|
|
4
|
+
const tttxButtonCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}button{cursor:pointer}.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:active{background:rgba(17, 17, 17, 0.2);border:1px solid #d5d5d5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:active{background:#1464a2;border:1px solid #1464a2}.borderless{background:transparent;border:none;color:#212121}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.danger{background:#dc0000;border:1px solid #dc0000;color:white}.danger:active{background:#b00000;border:1px solid #b00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}@media (hover: hover){.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #d5d5d5}.primary:hover{background:#146eb3;border:1px solid #146eb3}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.danger:hover{background:#c60000;border:1px solid #c60000}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}}:host{display:inline-block}tttx-icon{cursor:inherit}.spacingleft{margin-left:8px}";
|
|
5
5
|
|
|
6
6
|
const TttxButton = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
7
7
|
constructor() {
|
|
@@ -99,7 +99,7 @@ function setErrorState(target, hasError, errorMessage) {
|
|
|
99
99
|
}
|
|
100
100
|
}
|
|
101
101
|
|
|
102
|
-
const tttxFormCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.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:normal;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}.icon-left{margin-top:5px;margin-left:4px}.iconleft .input{padding-left:4px}.iconright .input{padding-right:4px}.input-icon{position:absolute;margin-top:9px;margin-left:4px}.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;line-height:16px;border-radius:none;z-index:2;color:#dc0000}.errormsg .validationicon{width:16px;height:16px;font-size:16px;line-height:19px;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.inputInline{display:flex;white-space:nowrap;align-items:center}label.inputInline .input-container{margin:0 4px;width:100%;display:flex;align-items:center;gap:4px;position:relative}label{font-weight:500;font-size:16px;line-height:19px;margin-bottom:16px}input:not([type=submit]){font-family:\"Roboto\", serif;box-sizing:border-box;width:100%;height:36px;padding:0 16px;font-size:16px;line-height:19px;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}@media (max-width: 600px){input[type=date]{padding-top:6px}}input.invalid:invalid,input.standalone.invalid{border:1px solid #dc0000}.input-icon~input{padding:0 32px}input~.errorBubble{position:relative;font-size:14px;line-height:16px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center;margin-top:4px}input~.errorBubble:not(.visible){display:none}input~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px}input.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000}input:focus{border-color:#1479c6}input:focus-visible{outline:none}.secondarylabel{color:#757575;font-size:14px;line-height:16px;font-weight:normal;display:flex;margin-top:4px}label.inputBlock.readonly{pointer-events:none;user-select:none;color:gray}input[readonly]{cursor:default;pointer-events:none;user-select:none;color:gray}button{cursor:pointer}.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:
|
|
102
|
+
const tttxFormCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.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:normal;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}.icon-left{margin-top:5px;margin-left:4px}.iconleft .input{padding-left:4px}.iconright .input{padding-right:4px}.input-icon{position:absolute;margin-top:9px;margin-left:4px}.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;line-height:16px;border-radius:none;z-index:2;color:#dc0000}.errormsg .validationicon{width:16px;height:16px;font-size:16px;line-height:19px;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.inputInline{display:flex;white-space:nowrap;align-items:center}label.inputInline .input-container{margin:0 4px;width:100%;display:flex;align-items:center;gap:4px;position:relative}label{font-weight:500;font-size:16px;line-height:19px;margin-bottom:16px}input:not([type=submit]){font-family:\"Roboto\", serif;box-sizing:border-box;width:100%;height:36px;padding:0 16px;font-size:16px;line-height:19px;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}@media (max-width: 600px){input[type=date]{padding-top:6px}}input.invalid:invalid,input.standalone.invalid{border:1px solid #dc0000}.input-icon~input{padding:0 32px}input~.errorBubble{position:relative;font-size:14px;line-height:16px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center;margin-top:4px}input~.errorBubble:not(.visible){display:none}input~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px}input.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000}input:focus{border-color:#1479c6}input:focus-visible{outline:none}.secondarylabel{color:#757575;font-size:14px;line-height:16px;font-weight:normal;display:flex;margin-top:4px}label.inputBlock.readonly{pointer-events:none;user-select:none;color:gray}input[readonly]{cursor:default;pointer-events:none;user-select:none;color:gray}button{cursor:pointer}.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:active{background:rgba(17, 17, 17, 0.2);border:1px solid #d5d5d5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:active{background:#1464a2;border:1px solid #1464a2}.borderless{background:transparent;border:none;color:#212121}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.danger{background:#dc0000;border:1px solid #dc0000;color:white}.danger:active{background:#b00000;border:1px solid #b00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}@media (hover: hover){.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #d5d5d5}.primary:hover{background:#146eb3;border:1px solid #146eb3}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.danger:hover{background:#c60000;border:1px solid #c60000}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}}:host{display:block}fieldset{margin:0;padding:0;border:none}label.inputBlock.inlineBlock{display:inline-block}.inlineLabel{font-weight:400;display:inline-block;vertical-align:top;padding-top:4px}input[type=checkbox]{width:18px;height:18px}input~label{font-weight:400}select{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}.placeholder{color:#9e9e9e}.placeholder option{color:initial}select.invalid:invalid{border:1px solid #dc0000}select~.errorBubble{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}select~.errorBubble:not(.visible){visibility:hidden}select~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px;height:16px}select.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000;visibility:visible}select:focus{border-color:#1479c6}select:focus-visible{outline:none}.button{padding:0 16px}.footer{display:flex;gap:16px;flex-direction:row-reverse}";
|
|
103
103
|
|
|
104
104
|
const TttxForm$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
105
105
|
constructor() {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, h, H as Host } from './index-1c711ead.js';
|
|
2
2
|
|
|
3
|
-
const tttxButtonCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}button{cursor:pointer}.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:
|
|
3
|
+
const tttxButtonCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}button{cursor:pointer}.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:active{background:rgba(17, 17, 17, 0.2);border:1px solid #d5d5d5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:active{background:#1464a2;border:1px solid #1464a2}.borderless{background:transparent;border:none;color:#212121}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.danger{background:#dc0000;border:1px solid #dc0000;color:white}.danger:active{background:#b00000;border:1px solid #b00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}@media (hover: hover){.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #d5d5d5}.primary:hover{background:#146eb3;border:1px solid #146eb3}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.danger:hover{background:#c60000;border:1px solid #c60000}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}}:host{display:inline-block}tttx-icon{cursor:inherit}.spacingleft{margin-left:8px}";
|
|
4
4
|
|
|
5
5
|
const TttxButton = class {
|
|
6
6
|
constructor(hostRef) {
|
|
@@ -100,7 +100,7 @@ function setErrorState(target, hasError, errorMessage) {
|
|
|
100
100
|
}
|
|
101
101
|
}
|
|
102
102
|
|
|
103
|
-
const tttxFormCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.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:normal;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}.icon-left{margin-top:5px;margin-left:4px}.iconleft .input{padding-left:4px}.iconright .input{padding-right:4px}.input-icon{position:absolute;margin-top:9px;margin-left:4px}.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;line-height:16px;border-radius:none;z-index:2;color:#dc0000}.errormsg .validationicon{width:16px;height:16px;font-size:16px;line-height:19px;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.inputInline{display:flex;white-space:nowrap;align-items:center}label.inputInline .input-container{margin:0 4px;width:100%;display:flex;align-items:center;gap:4px;position:relative}label{font-weight:500;font-size:16px;line-height:19px;margin-bottom:16px}input:not([type=submit]){font-family:\"Roboto\", serif;box-sizing:border-box;width:100%;height:36px;padding:0 16px;font-size:16px;line-height:19px;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}@media (max-width: 600px){input[type=date]{padding-top:6px}}input.invalid:invalid,input.standalone.invalid{border:1px solid #dc0000}.input-icon~input{padding:0 32px}input~.errorBubble{position:relative;font-size:14px;line-height:16px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center;margin-top:4px}input~.errorBubble:not(.visible){display:none}input~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px}input.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000}input:focus{border-color:#1479c6}input:focus-visible{outline:none}.secondarylabel{color:#757575;font-size:14px;line-height:16px;font-weight:normal;display:flex;margin-top:4px}label.inputBlock.readonly{pointer-events:none;user-select:none;color:gray}input[readonly]{cursor:default;pointer-events:none;user-select:none;color:gray}button{cursor:pointer}.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:
|
|
103
|
+
const tttxFormCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.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:normal;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}.icon-left{margin-top:5px;margin-left:4px}.iconleft .input{padding-left:4px}.iconright .input{padding-right:4px}.input-icon{position:absolute;margin-top:9px;margin-left:4px}.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;line-height:16px;border-radius:none;z-index:2;color:#dc0000}.errormsg .validationicon{width:16px;height:16px;font-size:16px;line-height:19px;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.inputInline{display:flex;white-space:nowrap;align-items:center}label.inputInline .input-container{margin:0 4px;width:100%;display:flex;align-items:center;gap:4px;position:relative}label{font-weight:500;font-size:16px;line-height:19px;margin-bottom:16px}input:not([type=submit]){font-family:\"Roboto\", serif;box-sizing:border-box;width:100%;height:36px;padding:0 16px;font-size:16px;line-height:19px;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}@media (max-width: 600px){input[type=date]{padding-top:6px}}input.invalid:invalid,input.standalone.invalid{border:1px solid #dc0000}.input-icon~input{padding:0 32px}input~.errorBubble{position:relative;font-size:14px;line-height:16px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center;margin-top:4px}input~.errorBubble:not(.visible){display:none}input~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px}input.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000}input:focus{border-color:#1479c6}input:focus-visible{outline:none}.secondarylabel{color:#757575;font-size:14px;line-height:16px;font-weight:normal;display:flex;margin-top:4px}label.inputBlock.readonly{pointer-events:none;user-select:none;color:gray}input[readonly]{cursor:default;pointer-events:none;user-select:none;color:gray}button{cursor:pointer}.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:active{background:rgba(17, 17, 17, 0.2);border:1px solid #d5d5d5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:active{background:#1464a2;border:1px solid #1464a2}.borderless{background:transparent;border:none;color:#212121}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.danger{background:#dc0000;border:1px solid #dc0000;color:white}.danger:active{background:#b00000;border:1px solid #b00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}@media (hover: hover){.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #d5d5d5}.primary:hover{background:#146eb3;border:1px solid #146eb3}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.danger:hover{background:#c60000;border:1px solid #c60000}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}}:host{display:block}fieldset{margin:0;padding:0;border:none}label.inputBlock.inlineBlock{display:inline-block}.inlineLabel{font-weight:400;display:inline-block;vertical-align:top;padding-top:4px}input[type=checkbox]{width:18px;height:18px}input~label{font-weight:400}select{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}.placeholder{color:#9e9e9e}.placeholder option{color:initial}select.invalid:invalid{border:1px solid #dc0000}select~.errorBubble{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}select~.errorBubble:not(.visible){visibility:hidden}select~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px;height:16px}select.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000;visibility:visible}select:focus{border-color:#1479c6}select:focus-visible{outline:none}.button{padding:0 16px}.footer{display:flex;gap:16px;flex-direction:row-reverse}";
|
|
104
104
|
|
|
105
105
|
const TttxForm = class {
|
|
106
106
|
constructor(hostRef) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as o,h as t,H as r}from"./p-c544551b.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{cursor:pointer}.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:
|
|
1
|
+
import{r as o,h as t,H as r}from"./p-c544551b.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{cursor:pointer}.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:active{background:rgba(17, 17, 17, 0.2);border:1px solid #d5d5d5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:active{background:#1464a2;border:1px solid #1464a2}.borderless{background:transparent;border:none;color:#212121}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.danger{background:#dc0000;border:1px solid #dc0000;color:white}.danger:active{background:#b00000;border:1px solid #b00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}@media (hover: hover){.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #d5d5d5}.primary:hover{background:#146eb3;border:1px solid #146eb3}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.danger:hover{background:#c60000;border:1px solid #c60000}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}}:host{display:inline-block}tttx-icon{cursor:inherit}.spacingleft{margin-left:8px}';export{i as tttx_button}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as e,c as i,h as t,H as o}from"./p-c544551b.js";import{p as n,d as r}from"./p-d3835fde.js";import"./p-112455b1.js";function a(e,i,t){const o=e.parentElement.querySelector(".errorBubble");if(i){e.classList.add("invalid"),o.classList.add("visible");const i=document.createElement("span");i.className="material-symbols-rounded",i.textContent="warning",o.innerHTML="",o.append(i),o.append(t)}else o.classList.remove("visible"),e.classList.remove("invalid"),o.innerHTML=""}const l=class{constructor(t){e(this,t),this.dataSubmitted=i(this,"dataSubmitted",7),this.dataChanged=i(this,"dataChanged",7),this.template=document.createElement("template"),this.formschema=void 0,this.data=void 0}onFormSchemaChange(e){if(!this.data&&this.form&&this._formSchema){const e=new FormData(this.form);this._data=Object.fromEntries(Object.keys(this._formSchema.properties).map((i=>[i,e.get(i)])))}this._formSchema="string"==typeof e?JSON.parse(e):e}onDataChange(e){this._data="string"==typeof e?JSON.parse(e):e}fieldChanged(e){this.dataChanged.emit({name:e.target.name,value:e.target.value})}async submit(){this.submitButton.click()}doSubmit(e){e.preventDefault();const i=new FormData(e.target);this.dataSubmitted.emit(i)}componentWillLoad(){this.onFormSchemaChange(this.formschema),this.data&&this.onDataChange(this.data)}componentWillRender(){this.template=document.createElement("template"),this.populateFormFromSchema()}createSelect(e,i){const t=document.createElement("select");return t.setAttribute("name",e),i.options.forEach((e=>{this.appendOption(t,e)})),this._data&&this._data[e]&&t.classList.remove("placeholder"),t}appendOption(e,i){const t=document.createElement("option");t.setAttribute("value",i.value),i.placeholder&&(t.setAttribute("disabled",""),t.setAttribute("selected",""),t.setAttribute("hidden",""),e.classList.add("placeholder")),i.label&&(t.innerHTML=n.sanitize(i.label,r)),e.appendChild(t)}createInput(e,i){var t;const o=document.createElement("input");return o.name=e,o.type=i.type,o.placeholder=null!==(t=i.placeholder)&&void 0!==t?t:"",o.autocomplete="off",o.autocapitalize="off",i.readonly&&(o.readOnly=!0),o}applyValidation(e,i){var t,o;i.required&&(e.setAttribute("required",""),e.setAttribute("data-required",null!==(t=i.required.message)&&void 0!==t?t:"")),i.pattern&&(e.setAttribute("pattern",i.pattern.pattern),e.setAttribute("data-pattern",null!==(o=i.pattern.message)&&void 0!==o?o:"")),i.badInput&&e.setAttribute("data-badinput",i.badInput.message),i.minmax&&(e.setAttribute("min",i.minmax.min),e.setAttribute("max",i.minmax.max),e.setAttribute("data-range",i.minmax.message)),i.maxlength&&e.setAttribute("maxlength",i.maxlength)}createErrorBubble(){const e=document.createElement("div");return e.className="errorBubble",e}appendCheckboxInput(e,i,t){if(e.label){const e=document.createElement("br");t.appendChild(e)}if(t.appendChild(i),!e.inlineLabel)return;const o=document.createElement("span");o.className="inlineLabel",o.textContent=e.inlineLabel,t.appendChild(o)}createLabel(e,i,t){const o=document.createElement("label");if(o.className="inputBlock",o.innerText=e.label,!e.validation){const e=document.createElement("span");e.className="optional",e.innerHTML=" (optional)",o.appendChild(e)}return e.readonly&&o.classList.add("readonly"),"checkbox"===e.type?(o.className+=" inlineBlock",this.appendCheckboxInput(e,i,o)):o.appendChild(i),o.appendChild(t),o}populateFormFromSchema(){if(!this._formSchema)return;const e=this._formSchema.properties;Object.keys(e).forEach((i=>{const t=e[i].form,o="select"===t.type?this.createSelect(i,t):this.createInput(i,t);t.validation&&this.applyValidation(o,t.validation);const n=this.createErrorBubble(),r=this.createLabel(t,o,n);this.template.content.append(r)}))}componentDidRender(){if(!this._formSchema)return;const e=this.template.content.cloneNode(!0),i=this._formSchema.properties;Object.keys(i).forEach((t=>{var o;const n=e.querySelector(`[name=${t}]`);if(n.oninvalid=this.validityCheckWrapper.bind(this),n.onblur=this.validityCheckWrapper.bind(this),n.onkeyup=this.fieldChanged.bind(this),n.onchange=this.fieldChanged.bind(this),this._data&&null!=this._data[t]&&(n.value=this._data[t]),null===(o=i[t].form.validation)||void 0===o?void 0:o.invalid){const e=i[t].form.validation.invalid.message;n.setCustomValidity(e),a(n,!0,e)}"select"===i[t].form.type&&n.classList.contains("placeholder")&&n.addEventListener("change",(()=>{n.classList.remove("placeholder")}))})),this.fieldset.replaceChildren(e)}validityCheckWrapper(e){const{target:i,hasError:t,errorMessage:o}=function(e){var i,t,o,n;e.preventDefault();const r=e.target;let a=!0,l="";switch(!0){case r.validity.valueMissing:l=null!==(i=r.dataset.required)&&void 0!==i?i:"This field is required";break;case r.validity.patternMismatch:l=null!==(t=r.dataset.pattern)&&void 0!==t?t:"Incorrect format";break;case r.validity.badInput:l=null!==(o=r.dataset.badinput)&&void 0!==o?o:"Wrong input type";break;case r.validity.rangeOverflow||r.validity.rangeUnderflow:l=null!==(n=r.dataset.range)&&void 0!==n?n:"Invalid value";break;case r.validity.customError:l=r.validationMessage;break;default:a=!1}return{target:r,hasError:a,errorMessage:l}}(e);a(i,t,o)}render(){return t(o,null,t("form",{ref:e=>this.form=e,onSubmit:this.doSubmit.bind(this)},t("fieldset",{ref:e=>this.fieldset=e}),t("input",{type:"submit",ref:e=>this.submitButton=e,style:{display:"none"}})))}static get watchers(){return{formschema:["onFormSchemaChange"],data:["onDataChange"]}}};l.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.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:normal;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}.icon-left{margin-top:5px;margin-left:4px}.iconleft .input{padding-left:4px}.iconright .input{padding-right:4px}.input-icon{position:absolute;margin-top:9px;margin-left:4px}.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;line-height:16px;border-radius:none;z-index:2;color:#dc0000}.errormsg .validationicon{width:16px;height:16px;font-size:16px;line-height:19px;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.inputInline{display:flex;white-space:nowrap;align-items:center}label.inputInline .input-container{margin:0 4px;width:100%;display:flex;align-items:center;gap:4px;position:relative}label{font-weight:500;font-size:16px;line-height:19px;margin-bottom:16px}input:not([type=submit]){font-family:"Roboto", serif;box-sizing:border-box;width:100%;height:36px;padding:0 16px;font-size:16px;line-height:19px;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}@media (max-width: 600px){input[type=date]{padding-top:6px}}input.invalid:invalid,input.standalone.invalid{border:1px solid #dc0000}.input-icon~input{padding:0 32px}input~.errorBubble{position:relative;font-size:14px;line-height:16px;font-weight:normal;width:100%;font-family:"Roboto", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center;margin-top:4px}input~.errorBubble:not(.visible){display:none}input~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px}input.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:"Roboto", sans-serif;color:#dc0000}input:focus{border-color:#1479c6}input:focus-visible{outline:none}.secondarylabel{color:#757575;font-size:14px;line-height:16px;font-weight:normal;display:flex;margin-top:4px}label.inputBlock.readonly{pointer-events:none;user-select:none;color:gray}input[readonly]{cursor:default;pointer-events:none;user-select:none;color:gray}button{cursor:pointer}.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:block}fieldset{margin:0;padding:0;border:none}label.inputBlock.inlineBlock{display:inline-block}.inlineLabel{font-weight:400;display:inline-block;vertical-align:top;padding-top:4px}input[type=checkbox]{width:18px;height:18px}input~label{font-weight:400}select{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}.placeholder{color:#9e9e9e}.placeholder option{color:initial}select.invalid:invalid{border:1px solid #dc0000}select~.errorBubble{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}select~.errorBubble:not(.visible){visibility:hidden}select~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px;height:16px}select.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:"Roboto", sans-serif;color:#dc0000;visibility:visible}select:focus{border-color:#1479c6}select:focus-visible{outline:none}.button{padding:0 16px}.footer{display:flex;gap:16px;flex-direction:row-reverse}';export{l as tttx_form}
|
|
1
|
+
import{r as e,c as i,h as t,H as o}from"./p-c544551b.js";import{p as n,d as r}from"./p-d3835fde.js";import"./p-112455b1.js";function a(e,i,t){const o=e.parentElement.querySelector(".errorBubble");if(i){e.classList.add("invalid"),o.classList.add("visible");const i=document.createElement("span");i.className="material-symbols-rounded",i.textContent="warning",o.innerHTML="",o.append(i),o.append(t)}else o.classList.remove("visible"),e.classList.remove("invalid"),o.innerHTML=""}const l=class{constructor(t){e(this,t),this.dataSubmitted=i(this,"dataSubmitted",7),this.dataChanged=i(this,"dataChanged",7),this.template=document.createElement("template"),this.formschema=void 0,this.data=void 0}onFormSchemaChange(e){if(!this.data&&this.form&&this._formSchema){const e=new FormData(this.form);this._data=Object.fromEntries(Object.keys(this._formSchema.properties).map((i=>[i,e.get(i)])))}this._formSchema="string"==typeof e?JSON.parse(e):e}onDataChange(e){this._data="string"==typeof e?JSON.parse(e):e}fieldChanged(e){this.dataChanged.emit({name:e.target.name,value:e.target.value})}async submit(){this.submitButton.click()}doSubmit(e){e.preventDefault();const i=new FormData(e.target);this.dataSubmitted.emit(i)}componentWillLoad(){this.onFormSchemaChange(this.formschema),this.data&&this.onDataChange(this.data)}componentWillRender(){this.template=document.createElement("template"),this.populateFormFromSchema()}createSelect(e,i){const t=document.createElement("select");return t.setAttribute("name",e),i.options.forEach((e=>{this.appendOption(t,e)})),this._data&&this._data[e]&&t.classList.remove("placeholder"),t}appendOption(e,i){const t=document.createElement("option");t.setAttribute("value",i.value),i.placeholder&&(t.setAttribute("disabled",""),t.setAttribute("selected",""),t.setAttribute("hidden",""),e.classList.add("placeholder")),i.label&&(t.innerHTML=n.sanitize(i.label,r)),e.appendChild(t)}createInput(e,i){var t;const o=document.createElement("input");return o.name=e,o.type=i.type,o.placeholder=null!==(t=i.placeholder)&&void 0!==t?t:"",o.autocomplete="off",o.autocapitalize="off",i.readonly&&(o.readOnly=!0),o}applyValidation(e,i){var t,o;i.required&&(e.setAttribute("required",""),e.setAttribute("data-required",null!==(t=i.required.message)&&void 0!==t?t:"")),i.pattern&&(e.setAttribute("pattern",i.pattern.pattern),e.setAttribute("data-pattern",null!==(o=i.pattern.message)&&void 0!==o?o:"")),i.badInput&&e.setAttribute("data-badinput",i.badInput.message),i.minmax&&(e.setAttribute("min",i.minmax.min),e.setAttribute("max",i.minmax.max),e.setAttribute("data-range",i.minmax.message)),i.maxlength&&e.setAttribute("maxlength",i.maxlength)}createErrorBubble(){const e=document.createElement("div");return e.className="errorBubble",e}appendCheckboxInput(e,i,t){if(e.label){const e=document.createElement("br");t.appendChild(e)}if(t.appendChild(i),!e.inlineLabel)return;const o=document.createElement("span");o.className="inlineLabel",o.textContent=e.inlineLabel,t.appendChild(o)}createLabel(e,i,t){const o=document.createElement("label");if(o.className="inputBlock",o.innerText=e.label,!e.validation){const e=document.createElement("span");e.className="optional",e.innerHTML=" (optional)",o.appendChild(e)}return e.readonly&&o.classList.add("readonly"),"checkbox"===e.type?(o.className+=" inlineBlock",this.appendCheckboxInput(e,i,o)):o.appendChild(i),o.appendChild(t),o}populateFormFromSchema(){if(!this._formSchema)return;const e=this._formSchema.properties;Object.keys(e).forEach((i=>{const t=e[i].form,o="select"===t.type?this.createSelect(i,t):this.createInput(i,t);t.validation&&this.applyValidation(o,t.validation);const n=this.createErrorBubble(),r=this.createLabel(t,o,n);this.template.content.append(r)}))}componentDidRender(){if(!this._formSchema)return;const e=this.template.content.cloneNode(!0),i=this._formSchema.properties;Object.keys(i).forEach((t=>{var o;const n=e.querySelector(`[name=${t}]`);if(n.oninvalid=this.validityCheckWrapper.bind(this),n.onblur=this.validityCheckWrapper.bind(this),n.onkeyup=this.fieldChanged.bind(this),n.onchange=this.fieldChanged.bind(this),this._data&&null!=this._data[t]&&(n.value=this._data[t]),null===(o=i[t].form.validation)||void 0===o?void 0:o.invalid){const e=i[t].form.validation.invalid.message;n.setCustomValidity(e),a(n,!0,e)}"select"===i[t].form.type&&n.classList.contains("placeholder")&&n.addEventListener("change",(()=>{n.classList.remove("placeholder")}))})),this.fieldset.replaceChildren(e)}validityCheckWrapper(e){const{target:i,hasError:t,errorMessage:o}=function(e){var i,t,o,n;e.preventDefault();const r=e.target;let a=!0,l="";switch(!0){case r.validity.valueMissing:l=null!==(i=r.dataset.required)&&void 0!==i?i:"This field is required";break;case r.validity.patternMismatch:l=null!==(t=r.dataset.pattern)&&void 0!==t?t:"Incorrect format";break;case r.validity.badInput:l=null!==(o=r.dataset.badinput)&&void 0!==o?o:"Wrong input type";break;case r.validity.rangeOverflow||r.validity.rangeUnderflow:l=null!==(n=r.dataset.range)&&void 0!==n?n:"Invalid value";break;case r.validity.customError:l=r.validationMessage;break;default:a=!1}return{target:r,hasError:a,errorMessage:l}}(e);a(i,t,o)}render(){return t(o,null,t("form",{ref:e=>this.form=e,onSubmit:this.doSubmit.bind(this)},t("fieldset",{ref:e=>this.fieldset=e}),t("input",{type:"submit",ref:e=>this.submitButton=e,style:{display:"none"}})))}static get watchers(){return{formschema:["onFormSchemaChange"],data:["onDataChange"]}}};l.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.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:normal;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}.icon-left{margin-top:5px;margin-left:4px}.iconleft .input{padding-left:4px}.iconright .input{padding-right:4px}.input-icon{position:absolute;margin-top:9px;margin-left:4px}.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;line-height:16px;border-radius:none;z-index:2;color:#dc0000}.errormsg .validationicon{width:16px;height:16px;font-size:16px;line-height:19px;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.inputInline{display:flex;white-space:nowrap;align-items:center}label.inputInline .input-container{margin:0 4px;width:100%;display:flex;align-items:center;gap:4px;position:relative}label{font-weight:500;font-size:16px;line-height:19px;margin-bottom:16px}input:not([type=submit]){font-family:"Roboto", serif;box-sizing:border-box;width:100%;height:36px;padding:0 16px;font-size:16px;line-height:19px;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}@media (max-width: 600px){input[type=date]{padding-top:6px}}input.invalid:invalid,input.standalone.invalid{border:1px solid #dc0000}.input-icon~input{padding:0 32px}input~.errorBubble{position:relative;font-size:14px;line-height:16px;font-weight:normal;width:100%;font-family:"Roboto", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center;margin-top:4px}input~.errorBubble:not(.visible){display:none}input~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px}input.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:"Roboto", sans-serif;color:#dc0000}input:focus{border-color:#1479c6}input:focus-visible{outline:none}.secondarylabel{color:#757575;font-size:14px;line-height:16px;font-weight:normal;display:flex;margin-top:4px}label.inputBlock.readonly{pointer-events:none;user-select:none;color:gray}input[readonly]{cursor:default;pointer-events:none;user-select:none;color:gray}button{cursor:pointer}.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:active{background:rgba(17, 17, 17, 0.2);border:1px solid #d5d5d5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:active{background:#1464a2;border:1px solid #1464a2}.borderless{background:transparent;border:none;color:#212121}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.danger{background:#dc0000;border:1px solid #dc0000;color:white}.danger:active{background:#b00000;border:1px solid #b00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}@media (hover: hover){.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #d5d5d5}.primary:hover{background:#146eb3;border:1px solid #146eb3}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.danger:hover{background:#c60000;border:1px solid #c60000}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}}:host{display:block}fieldset{margin:0;padding:0;border:none}label.inputBlock.inlineBlock{display:inline-block}.inlineLabel{font-weight:400;display:inline-block;vertical-align:top;padding-top:4px}input[type=checkbox]{width:18px;height:18px}input~label{font-weight:400}select{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}.placeholder{color:#9e9e9e}.placeholder option{color:initial}select.invalid:invalid{border:1px solid #dc0000}select~.errorBubble{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}select~.errorBubble:not(.visible){visibility:hidden}select~.errorBubble span{color:#dc0000;font-size:16px;margin-right:4px;height:16px}select.invalid:invalid~.errorBubble{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:"Roboto", sans-serif;color:#dc0000;visibility:visible}select:focus{border-color:#1479c6}select:focus-visible{outline:none}.button{padding:0 16px}.footer{display:flex;gap:16px;flex-direction:row-reverse}';export{l as tttx_form}
|
package/dist/tttx/tttx.esm.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as
|
|
1
|
+
import{p as t,b as e}from"./p-c544551b.js";export{s as setNonce}from"./p-c544551b.js";(()=>{const e=import.meta.url,o={};return""!==e&&(o.resourcesUrl=new URL(".",e).href),t(o)})().then((t=>e([["p-909c090d",[[1,"tttx-dialog-box",{data:[1025],size:[1],elementSize:[32]},[[9,"resize","handleResize"]]]]],["p-a658e1ac",[[1,"tttx-filter",{filterKey:[1,"filter-key"],filterOptions:[1,"filter-options"],showSelectAll:[4,"show-select-all"],showSearchField:[4,"show-search-field"],showOptionIcons:[4,"show-option-icons"],filterButtonStyle:[1,"filter-button-style"],filterHeader:[1,"filter-header"],defaultFilterOptions:[1,"default-filter-options"],popoverWidth:[1,"popover-width"],showPopover:[32],displayedFilterSettings:[32],selectedFilters:[32],filterSearchTerm:[32],allSelected:[32]},[[0,"closeFilter","handleCloseFilter"]]]]],["p-8b511fff",[[1,"tttx-list",{data:[1025],name:[1]}]]],["p-225e6fa6",[[1,"tttx-sorter",{sorterKey:[1,"sorter-key"],defaultSortDirection:[1,"default-sort-direction"],fieldOptionsData:[1,"field-options-data"],defaultOption:[1,"default-option"],selectedField:[32],sortDirection:[32],dropdownExpand:[32],dropdownOptions:[32]},[[0,"closeSorter","handleCloseSorter"]]]]],["p-e6bbdae3",[[2,"tttx-standalone-input",{label:[1],secondarylabel:[1],showerrormsg:[4],showerrorbubble:[4],errormsg:[1],iconleft:[1],iconleftcolor:[1],iconright:[1],iconrightcolor:[1],inputicon:[1],inputiconcolor:[1],inline:[4],inputautocapitalize:[1],inputautofocus:[4],inputkeyhint:[1],inputindex:[8],inputtitle:[1],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-811f3acf",[[1,"tttx-form",{formschema:[1032],data:[1032],submit:[64]}]]],["p-f80ab1d8",[[1,"tttx-keyvalue-block",{keyvalues:[8],horizontal:[4]}]]],["p-3467c62e",[[1,"tttx-loading-spinner",{loadingMessage:[1028,"loading-message"],size:[1025]}]]],["p-cff962bf",[[1,"tttx-qrcode",{link:[1025],size:[1026]}]]],["p-4879a614",[[1,"tttx-toolbar",{border:[4]}]]],["p-53fa8b4d",[[1,"tttx-icon",{icon:[1],color:[1]}]]],["p-28d80500",[[1,"tttx-button",{notext:[4],icon:[1],iconposition:[1],design:[1]}]]]],t)));
|