@3t-transform/threeteeui 0.1.42 → 0.1.44
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/{domsanitiser.options-277161b9.js → domsanitiser.options-975e3317.js} +12 -12
- package/dist/cjs/{index-76f14107.js → index-2ea393bb.js} +146 -3
- package/dist/cjs/loader.cjs.js +4 -19
- package/dist/cjs/tttx-button.cjs.entry.js +24 -24
- package/dist/cjs/tttx-dialog-box.cjs.entry.js +80 -0
- package/dist/cjs/tttx-filter.cjs.entry.js +177 -159
- package/dist/cjs/tttx-form.cjs.entry.js +458 -458
- package/dist/cjs/tttx-icon.cjs.entry.js +11 -11
- package/dist/cjs/tttx-keyvalue-block.cjs.entry.js +59 -59
- package/dist/cjs/tttx-list.cjs.entry.js +32 -32
- package/dist/cjs/tttx-loading-spinner.cjs.entry.js +16 -16
- package/dist/cjs/tttx-sorter.cjs.entry.js +102 -102
- package/dist/cjs/tttx-standalone-input.cjs.entry.js +79 -79
- package/dist/cjs/tttx-toolbar.cjs.entry.js +10 -10
- package/dist/cjs/tttx.cjs.js +9 -117
- package/dist/collection/collection-manifest.json +3 -2
- package/dist/collection/components/atoms/tttx-button/tttx-button.js +110 -110
- package/dist/collection/components/atoms/tttx-button/tttx-button.stories.js +14 -14
- package/dist/collection/components/atoms/tttx-icon/tttx-icon.js +62 -62
- package/dist/collection/components/atoms/tttx-icon/tttx-icon.stories.js +22 -22
- package/dist/collection/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.js +109 -109
- package/dist/collection/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.stories.js +38 -38
- package/dist/collection/components/atoms/tttx-loading-spinner/tttx-loading-spinner.js +67 -67
- package/dist/collection/components/atoms/tttx-loading-spinner/tttx-loading-spinner.stories.js +17 -17
- package/dist/collection/components/molecules/tttx-dialog-box/tttx-dialog-box.css +146 -0
- package/dist/collection/components/molecules/tttx-dialog-box/tttx-dialog-box.js +172 -0
- package/dist/collection/components/molecules/tttx-dialog-box/tttx-dialog-box.stories.js +380 -0
- package/dist/collection/components/molecules/tttx-filter/tttx-filter.js +369 -334
- package/dist/collection/components/molecules/tttx-filter/tttx-filter.stories.js +73 -62
- package/dist/collection/components/molecules/tttx-form/lib/setErrorState.js +37 -37
- package/dist/collection/components/molecules/tttx-form/lib/validityCheck.js +61 -61
- package/dist/collection/components/molecules/tttx-form/tttx-form.js +479 -479
- package/dist/collection/components/molecules/tttx-form/tttx-form.stories.js +272 -272
- package/dist/collection/components/molecules/tttx-list/tttx-list.js +105 -105
- package/dist/collection/components/molecules/tttx-list/tttx-list.stories.js +43 -43
- package/dist/collection/components/molecules/tttx-sorter/tttx-sorter.js +224 -224
- package/dist/collection/components/molecules/tttx-sorter/tttx-sorter.stories.js +42 -42
- package/dist/collection/components/molecules/tttx-standalone-input/tttx-standalone-input.js +759 -759
- package/dist/collection/components/molecules/tttx-standalone-input/tttx-standalone-input.stories.js +172 -172
- package/dist/collection/components/molecules/tttx-toolbar/tttx-toolbar.js +44 -44
- package/dist/collection/components/molecules/tttx-toolbar/tttx-toolbar.stories.js +14 -14
- 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/collection/shared/domsanitiser.options.js +14 -14
- package/dist/components/domsanitiser.options.js +15 -45
- package/dist/components/index.d.ts +10 -0
- package/dist/components/index.js +2 -5
- package/dist/components/tttx-button.js +1 -54
- package/dist/{tttx/tttx-button.entry.js → components/tttx-button2.js} +52 -26
- package/dist/components/tttx-dialog-box.d.ts +11 -0
- package/dist/components/tttx-dialog-box.js +110 -0
- package/dist/components/tttx-filter.js +210 -191
- package/dist/components/tttx-form.js +475 -475
- package/dist/components/tttx-icon2.js +28 -28
- package/dist/components/tttx-keyvalue-block.js +76 -76
- package/dist/components/tttx-list.js +53 -53
- package/dist/components/tttx-loading-spinner.js +33 -33
- package/dist/components/tttx-sorter.js +130 -130
- package/dist/components/tttx-standalone-input.js +130 -130
- package/dist/components/tttx-toolbar.js +26 -26
- package/dist/esm/{domsanitiser.options-cc420431.js → domsanitiser.options-3c7ded83.js} +12 -12
- package/dist/esm/{index-9cde46a5.js → index-018a3e54.js} +146 -4
- package/dist/esm/loader.js +4 -19
- package/dist/esm/polyfills/core-js.js +0 -0
- package/dist/esm/polyfills/css-shim.js +1 -1
- 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 +24 -24
- package/dist/esm/tttx-dialog-box.entry.js +76 -0
- package/dist/esm/tttx-filter.entry.js +177 -159
- package/dist/esm/tttx-form.entry.js +458 -458
- package/dist/esm/tttx-icon.entry.js +11 -11
- package/dist/esm/tttx-keyvalue-block.entry.js +59 -59
- package/dist/esm/tttx-list.entry.js +32 -32
- package/dist/esm/tttx-loading-spinner.entry.js +16 -16
- package/dist/esm/tttx-sorter.entry.js +102 -102
- package/dist/esm/tttx-standalone-input.entry.js +79 -79
- package/dist/esm/tttx-toolbar.entry.js +10 -10
- package/dist/esm/tttx.js +6 -117
- package/dist/tttx/index.esm.js +0 -1
- package/dist/tttx/{p-e53c7f9d.entry.js → p-01863bf1.entry.js} +1 -1
- package/dist/tttx/{p-4e637d50.entry.js → p-0ed6f369.entry.js} +1 -1
- package/dist/tttx/p-2dd43e97.entry.js +1 -0
- package/dist/tttx/{p-aef96333.entry.js → p-2e135be9.entry.js} +1 -1
- package/dist/tttx/p-350ddb03.js +3 -0
- package/dist/tttx/{p-d2f1aa8e.entry.js → p-48b15a3d.entry.js} +1 -1
- package/dist/tttx/{p-561224f5.entry.js → p-5e91cf1c.entry.js} +1 -1
- package/dist/tttx/p-71c244bd.js +2 -0
- package/dist/tttx/{p-dc2a37b0.entry.js → p-7bba2014.entry.js} +1 -1
- package/dist/tttx/p-d075a2c0.entry.js +1 -0
- package/dist/tttx/{p-bd1edaed.entry.js → p-deec335c.entry.js} +1 -1
- package/dist/tttx/{p-9f1e9cc1.entry.js → p-e061910d.entry.js} +1 -1
- package/dist/tttx/{p-f885f17a.entry.js → p-f247a7bc.entry.js} +1 -1
- package/dist/tttx/tttx.esm.js +1 -129
- package/dist/types/components/atoms/tttx-button/tttx-button.d.ts +10 -10
- package/dist/types/components/atoms/tttx-button/tttx-button.stories.d.ts +10 -10
- package/dist/types/components/atoms/tttx-icon/tttx-icon.d.ts +5 -5
- package/dist/types/components/atoms/tttx-icon/tttx-icon.stories.d.ts +20 -20
- package/dist/types/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.d.ts +7 -7
- package/dist/types/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.stories.d.ts +9 -9
- 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/molecules/tttx-dialog-box/interfaces.d.ts +25 -0
- package/dist/types/components/molecules/tttx-dialog-box/tttx-dialog-box.d.ts +18 -0
- package/dist/types/components/molecules/tttx-dialog-box/tttx-dialog-box.stories.d.ts +23 -0
- package/dist/types/components/molecules/tttx-filter/tttx-filter.d.ts +41 -39
- package/dist/types/components/molecules/tttx-filter/tttx-filter.stories.d.ts +70 -68
- package/dist/types/components/molecules/tttx-form/lib/setErrorState.d.ts +13 -13
- package/dist/types/components/molecules/tttx-form/lib/validityCheck.d.ts +17 -17
- package/dist/types/components/molecules/tttx-form/tttx-form.d.ts +133 -133
- package/dist/types/components/molecules/tttx-form/tttx-form.stories.d.ts +278 -278
- package/dist/types/components/molecules/tttx-list/tttx-list.d.ts +11 -11
- package/dist/types/components/molecules/tttx-list/tttx-list.stories.d.ts +14 -14
- package/dist/types/components/molecules/tttx-sorter/tttx-sorter.d.ts +19 -19
- package/dist/types/components/molecules/tttx-sorter/tttx-sorter.stories.d.ts +30 -30
- package/dist/types/components/molecules/tttx-standalone-input/tttx-standalone-input.d.ts +69 -69
- package/dist/types/components/molecules/tttx-standalone-input/tttx-standalone-input.stories.d.ts +143 -143
- package/dist/types/components/molecules/tttx-toolbar/tttx-toolbar.d.ts +4 -4
- package/dist/types/components/molecules/tttx-toolbar/tttx-toolbar.stories.d.ts +13 -13
- package/dist/types/components/palette.stories.d.ts +6 -6
- package/dist/types/components.d.ts +26 -0
- 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/dist/types/shared/domsanitiser.options.d.ts +10 -10
- package/dist/types/stencil-public-runtime.d.ts +59 -3
- package/loader/index.d.ts +9 -0
- package/package.json +2 -2
- package/dist/cjs/app-globals-3a1e7e63.js +0 -5
- package/dist/cjs/css-shim-211819bc.js +0 -6
- package/dist/cjs/dom-9deb26c8.js +0 -75
- package/dist/cjs/domsanitiser.options-3f1501b5.js +0 -1697
- package/dist/cjs/index-39a867c5.js +0 -3298
- package/dist/cjs/shadow-css-bf3843d2.js +0 -389
- package/dist/esm/app-globals-0f993ce5.js +0 -3
- package/dist/esm/css-shim-9d54a2f2.js +0 -4
- package/dist/esm/dom-6be6f662.js +0 -73
- package/dist/esm/domsanitiser.options-6f2878c8.js +0 -1694
- package/dist/esm/index-e3e64631.js +0 -3262
- package/dist/esm/shadow-css-ed4599f8.js +0 -387
- package/dist/tttx/app-globals-0f993ce5.js +0 -3
- package/dist/tttx/css-shim-9d54a2f2.js +0 -4
- package/dist/tttx/dom-6be6f662.js +0 -73
- package/dist/tttx/domsanitiser.options-6f2878c8.js +0 -1694
- package/dist/tttx/index-e3e64631.js +0 -3262
- package/dist/tttx/p-3b1be372.entry.js +0 -1
- package/dist/tttx/p-b4290a5b.js +0 -3
- package/dist/tttx/p-d0ff9ad0.entry.js +0 -1
- package/dist/tttx/p-db059a69.js +0 -2
- package/dist/tttx/shadow-css-ed4599f8.js +0 -387
- package/dist/tttx/tttx-filter.entry.js +0 -165
- package/dist/tttx/tttx-form.entry.js +0 -468
- package/dist/tttx/tttx-icon.entry.js +0 -17
- package/dist/tttx/tttx-keyvalue-block.entry.js +0 -65
- package/dist/tttx/tttx-list.entry.js +0 -38
- package/dist/tttx/tttx-loading-spinner.entry.js +0 -22
- package/dist/tttx/tttx-sorter.entry.js +0 -108
- package/dist/tttx/tttx-standalone-input.entry.js +0 -85
- package/dist/tttx/tttx-toolbar.entry.js +0 -16
package/dist/collection/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
function tagRegXp(tagName) {
|
|
2
|
-
return RegExp(/^tttx-/).exec(tagName);
|
|
3
|
-
}
|
|
4
|
-
function attributeNameCheck() {
|
|
5
|
-
return true;
|
|
6
|
-
}
|
|
7
|
-
const domSanitiserOptions = {
|
|
8
|
-
CUSTOM_ELEMENT_HANDLING: {
|
|
9
|
-
tagNameCheck: tagRegXp,
|
|
10
|
-
attributeNameCheck: attributeNameCheck,
|
|
11
|
-
allowCustomizedBuiltInElements: false, // customized built-ins are not allowed
|
|
12
|
-
}
|
|
13
|
-
};
|
|
14
|
-
export default domSanitiserOptions;
|
|
1
|
+
function tagRegXp(tagName) {
|
|
2
|
+
return RegExp(/^tttx-/).exec(tagName);
|
|
3
|
+
}
|
|
4
|
+
function attributeNameCheck() {
|
|
5
|
+
return true;
|
|
6
|
+
}
|
|
7
|
+
const domSanitiserOptions = {
|
|
8
|
+
CUSTOM_ELEMENT_HANDLING: {
|
|
9
|
+
tagNameCheck: tagRegXp,
|
|
10
|
+
attributeNameCheck: attributeNameCheck,
|
|
11
|
+
allowCustomizedBuiltInElements: false, // customized built-ins are not allowed
|
|
12
|
+
}
|
|
13
|
+
};
|
|
14
|
+
export default domSanitiserOptions;
|
|
@@ -1,42 +1,15 @@
|
|
|
1
1
|
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
2
2
|
|
|
3
|
-
function getDefaultExportFromCjs (x) {
|
|
4
|
-
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
|
|
5
|
-
}
|
|
6
|
-
|
|
7
3
|
function createCommonjsModule(fn, basedir, module) {
|
|
8
4
|
return module = {
|
|
9
5
|
path: basedir,
|
|
10
6
|
exports: {},
|
|
11
7
|
require: function (path, base) {
|
|
12
|
-
return commonjsRequire(
|
|
8
|
+
return commonjsRequire();
|
|
13
9
|
}
|
|
14
10
|
}, fn(module, module.exports), module.exports;
|
|
15
11
|
}
|
|
16
12
|
|
|
17
|
-
function getDefaultExportFromNamespaceIfPresent (n) {
|
|
18
|
-
return n && Object.prototype.hasOwnProperty.call(n, 'default') ? n['default'] : n;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
function getDefaultExportFromNamespaceIfNotNamed (n) {
|
|
22
|
-
return n && Object.prototype.hasOwnProperty.call(n, 'default') && Object.keys(n).length === 1 ? n['default'] : n;
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
function getAugmentedNamespace(n) {
|
|
26
|
-
if (n.__esModule) return n;
|
|
27
|
-
var a = Object.defineProperty({}, '__esModule', {value: true});
|
|
28
|
-
Object.keys(n).forEach(function (k) {
|
|
29
|
-
var d = Object.getOwnPropertyDescriptor(n, k);
|
|
30
|
-
Object.defineProperty(a, k, d.get ? d : {
|
|
31
|
-
enumerable: true,
|
|
32
|
-
get: function () {
|
|
33
|
-
return n[k];
|
|
34
|
-
}
|
|
35
|
-
});
|
|
36
|
-
});
|
|
37
|
-
return a;
|
|
38
|
-
}
|
|
39
|
-
|
|
40
13
|
function commonjsRequire () {
|
|
41
14
|
throw new Error('Dynamic requires are not currently supported by @rollup/plugin-commonjs');
|
|
42
15
|
}
|
|
@@ -45,11 +18,8 @@ var purify = createCommonjsModule(function (module, exports) {
|
|
|
45
18
|
/*! @license DOMPurify 3.0.3 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.0.3/LICENSE */
|
|
46
19
|
|
|
47
20
|
(function (global, factory) {
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.DOMPurify = factory());
|
|
51
|
-
})(commonjsGlobal, (function () { 'use strict';
|
|
52
|
-
|
|
21
|
+
module.exports = factory() ;
|
|
22
|
+
})(commonjsGlobal, (function () {
|
|
53
23
|
const {
|
|
54
24
|
entries,
|
|
55
25
|
setPrototypeOf,
|
|
@@ -1677,18 +1647,18 @@ var purify = createCommonjsModule(function (module, exports) {
|
|
|
1677
1647
|
//# sourceMappingURL=purify.js.map
|
|
1678
1648
|
});
|
|
1679
1649
|
|
|
1680
|
-
function tagRegXp(tagName) {
|
|
1681
|
-
return RegExp(/^tttx-/).exec(tagName);
|
|
1682
|
-
}
|
|
1683
|
-
function attributeNameCheck() {
|
|
1684
|
-
return true;
|
|
1685
|
-
}
|
|
1686
|
-
const domSanitiserOptions = {
|
|
1687
|
-
CUSTOM_ELEMENT_HANDLING: {
|
|
1688
|
-
tagNameCheck: tagRegXp,
|
|
1689
|
-
attributeNameCheck: attributeNameCheck,
|
|
1690
|
-
allowCustomizedBuiltInElements: false, // customized built-ins are not allowed
|
|
1691
|
-
}
|
|
1650
|
+
function tagRegXp(tagName) {
|
|
1651
|
+
return RegExp(/^tttx-/).exec(tagName);
|
|
1652
|
+
}
|
|
1653
|
+
function attributeNameCheck() {
|
|
1654
|
+
return true;
|
|
1655
|
+
}
|
|
1656
|
+
const domSanitiserOptions = {
|
|
1657
|
+
CUSTOM_ELEMENT_HANDLING: {
|
|
1658
|
+
tagNameCheck: tagRegXp,
|
|
1659
|
+
attributeNameCheck: attributeNameCheck,
|
|
1660
|
+
allowCustomizedBuiltInElements: false, // customized built-ins are not allowed
|
|
1661
|
+
}
|
|
1692
1662
|
};
|
|
1693
1663
|
|
|
1694
1664
|
export { domSanitiserOptions as d, purify as p };
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
/* tttx custom elements */
|
|
2
2
|
export { TttxButton as TttxButton } from '../types/components/atoms/tttx-button/tttx-button';
|
|
3
|
+
export { TttxDialogBox as TttxDialogBox } from '../types/components/molecules/tttx-dialog-box/tttx-dialog-box';
|
|
3
4
|
export { TttxFilter as TttxFilter } from '../types/components/molecules/tttx-filter/tttx-filter';
|
|
4
5
|
export { TttxForm as TttxForm } from '../types/components/molecules/tttx-form/tttx-form';
|
|
5
6
|
export { TttxIcon as TttxIcon } from '../types/components/atoms/tttx-icon/tttx-icon';
|
|
@@ -22,6 +23,15 @@ export { TttxToolbar as TttxToolbar } from '../types/components/molecules/tttx-t
|
|
|
22
23
|
*/
|
|
23
24
|
export declare const setAssetPath: (path: string) => void;
|
|
24
25
|
|
|
26
|
+
/**
|
|
27
|
+
* Used to specify a nonce value that corresponds with an application's CSP.
|
|
28
|
+
* When set, the nonce will be added to all dynamically created script and style tags at runtime.
|
|
29
|
+
* Alternatively, the nonce value can be set on a meta tag in the DOM head
|
|
30
|
+
* (<meta name="csp-nonce" content="{ nonce value here }" />) which
|
|
31
|
+
* will result in the same behavior.
|
|
32
|
+
*/
|
|
33
|
+
export declare const setNonce: (nonce: string) => void
|
|
34
|
+
|
|
25
35
|
export interface SetPlatformOptions {
|
|
26
36
|
raf?: (c: FrameRequestCallback) => number;
|
|
27
37
|
ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
|
package/dist/components/index.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
export { setAssetPath, setPlatformOptions } from '@stencil/core/internal/client';
|
|
1
|
+
export { setAssetPath, setNonce, setPlatformOptions } from '@stencil/core/internal/client';
|
|
2
2
|
export { TttxButton, defineCustomElement as defineCustomElementTttxButton } from './tttx-button.js';
|
|
3
|
+
export { TttxDialogBox, defineCustomElement as defineCustomElementTttxDialogBox } from './tttx-dialog-box.js';
|
|
3
4
|
export { TttxFilter, defineCustomElement as defineCustomElementTttxFilter } from './tttx-filter.js';
|
|
4
5
|
export { TttxForm, defineCustomElement as defineCustomElementTttxForm } from './tttx-form.js';
|
|
5
6
|
export { TttxIcon, defineCustomElement as defineCustomElementTttxIcon } from './tttx-icon.js';
|
|
@@ -9,7 +10,3 @@ export { TttxLoadingSpinner, defineCustomElement as defineCustomElementTttxLoadi
|
|
|
9
10
|
export { TttxSorter, defineCustomElement as defineCustomElementTttxSorter } from './tttx-sorter.js';
|
|
10
11
|
export { TttxStandaloneInput, defineCustomElement as defineCustomElementTttxStandaloneInput } from './tttx-standalone-input.js';
|
|
11
12
|
export { TttxToolbar, defineCustomElement as defineCustomElementTttxToolbar } from './tttx-toolbar.js';
|
|
12
|
-
|
|
13
|
-
const globalScripts = () => {};
|
|
14
|
-
|
|
15
|
-
globalScripts();
|
|
@@ -1,57 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { d as defineCustomElement$2 } from './tttx-icon2.js';
|
|
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: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}tttx-icon{cursor:inherit}.spacingleft{margin-left:8px}";
|
|
5
|
-
|
|
6
|
-
const TttxButton$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
7
|
-
constructor() {
|
|
8
|
-
super();
|
|
9
|
-
this.__registerHost();
|
|
10
|
-
this.__attachShadow();
|
|
11
|
-
this._iconcolor = 'black';
|
|
12
|
-
this.notext = undefined;
|
|
13
|
-
this.icon = undefined;
|
|
14
|
-
this.iconposition = 'left';
|
|
15
|
-
this.design = 'default';
|
|
16
|
-
}
|
|
17
|
-
componentWillLoad() {
|
|
18
|
-
this._design = this.design;
|
|
19
|
-
const designs = ['primary', 'default', 'disabled', 'danger', 'borderless'];
|
|
20
|
-
if (!designs.includes(this.design)) {
|
|
21
|
-
this._design = 'default';
|
|
22
|
-
}
|
|
23
|
-
if (this._design === 'primary' || this._design === 'danger') {
|
|
24
|
-
this._iconcolor = 'white';
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
render() {
|
|
28
|
-
return (h(Host, null, h("button", { class: `button ${this._design} ${this.icon ? 'withicon' : ''} ${this.icon && this.iconposition ? 'icon' + this.iconposition : ''} ${this.notext ? 'notext' : ''}` }, this.icon && this.iconposition === 'left' && (h("div", { class: "icon-left" }, h("tttx-icon", { icon: this.icon, color: this._iconcolor }))), !this.notext && h("div", { class: "button-content" }, h("slot", null)), this.icon && this.iconposition === 'right' && (h("div", { class: "icon-right" }, h("tttx-icon", { icon: this.icon, color: this._iconcolor }))))));
|
|
29
|
-
}
|
|
30
|
-
static get style() { return tttxButtonCss; }
|
|
31
|
-
}, [1, "tttx-button", {
|
|
32
|
-
"notext": [4],
|
|
33
|
-
"icon": [1],
|
|
34
|
-
"iconposition": [1],
|
|
35
|
-
"design": [1]
|
|
36
|
-
}]);
|
|
37
|
-
function defineCustomElement$1() {
|
|
38
|
-
if (typeof customElements === "undefined") {
|
|
39
|
-
return;
|
|
40
|
-
}
|
|
41
|
-
const components = ["tttx-button", "tttx-icon"];
|
|
42
|
-
components.forEach(tagName => { switch (tagName) {
|
|
43
|
-
case "tttx-button":
|
|
44
|
-
if (!customElements.get(tagName)) {
|
|
45
|
-
customElements.define(tagName, TttxButton$1);
|
|
46
|
-
}
|
|
47
|
-
break;
|
|
48
|
-
case "tttx-icon":
|
|
49
|
-
if (!customElements.get(tagName)) {
|
|
50
|
-
defineCustomElement$2();
|
|
51
|
-
}
|
|
52
|
-
break;
|
|
53
|
-
} });
|
|
54
|
-
}
|
|
1
|
+
import { T as TttxButton$1, d as defineCustomElement$1 } from './tttx-button2.js';
|
|
55
2
|
|
|
56
3
|
const TttxButton = TttxButton$1;
|
|
57
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,30 +1,56 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
|
+
import { d as defineCustomElement$1 } from './tttx-icon2.js';
|
|
2
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: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}tttx-icon{cursor:inherit}.spacingleft{margin-left:8px}";
|
|
4
5
|
|
|
5
|
-
const TttxButton = class {
|
|
6
|
-
constructor(
|
|
7
|
-
|
|
8
|
-
this.
|
|
9
|
-
this.
|
|
10
|
-
this.
|
|
11
|
-
this.
|
|
12
|
-
this.
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
};
|
|
28
|
-
|
|
6
|
+
const TttxButton = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
7
|
+
constructor() {
|
|
8
|
+
super();
|
|
9
|
+
this.__registerHost();
|
|
10
|
+
this.__attachShadow();
|
|
11
|
+
this._iconcolor = 'black';
|
|
12
|
+
this.notext = undefined;
|
|
13
|
+
this.icon = undefined;
|
|
14
|
+
this.iconposition = 'left';
|
|
15
|
+
this.design = 'default';
|
|
16
|
+
}
|
|
17
|
+
componentWillLoad() {
|
|
18
|
+
this._design = this.design;
|
|
19
|
+
const designs = ['primary', 'default', 'disabled', 'danger', 'borderless'];
|
|
20
|
+
if (!designs.includes(this.design)) {
|
|
21
|
+
this._design = 'default';
|
|
22
|
+
}
|
|
23
|
+
if (this._design === 'primary' || this._design === 'danger') {
|
|
24
|
+
this._iconcolor = 'white';
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
render() {
|
|
28
|
+
return (h(Host, null, h("button", { class: `button ${this._design} ${this.icon ? 'withicon' : ''} ${this.icon && this.iconposition ? 'icon' + this.iconposition : ''} ${this.notext ? 'notext' : ''}` }, this.icon && this.iconposition === 'left' && (h("div", { class: "icon-left" }, h("tttx-icon", { icon: this.icon, color: this._iconcolor }))), !this.notext && h("div", { class: "button-content" }, h("slot", null)), this.icon && this.iconposition === 'right' && (h("div", { class: "icon-right" }, h("tttx-icon", { icon: this.icon, color: this._iconcolor }))))));
|
|
29
|
+
}
|
|
30
|
+
static get style() { return tttxButtonCss; }
|
|
31
|
+
}, [1, "tttx-button", {
|
|
32
|
+
"notext": [4],
|
|
33
|
+
"icon": [1],
|
|
34
|
+
"iconposition": [1],
|
|
35
|
+
"design": [1]
|
|
36
|
+
}]);
|
|
37
|
+
function defineCustomElement() {
|
|
38
|
+
if (typeof customElements === "undefined") {
|
|
39
|
+
return;
|
|
40
|
+
}
|
|
41
|
+
const components = ["tttx-button", "tttx-icon"];
|
|
42
|
+
components.forEach(tagName => { switch (tagName) {
|
|
43
|
+
case "tttx-button":
|
|
44
|
+
if (!customElements.get(tagName)) {
|
|
45
|
+
customElements.define(tagName, TttxButton);
|
|
46
|
+
}
|
|
47
|
+
break;
|
|
48
|
+
case "tttx-icon":
|
|
49
|
+
if (!customElements.get(tagName)) {
|
|
50
|
+
defineCustomElement$1();
|
|
51
|
+
}
|
|
52
|
+
break;
|
|
53
|
+
} });
|
|
54
|
+
}
|
|
29
55
|
|
|
30
|
-
export { TttxButton as
|
|
56
|
+
export { TttxButton as T, defineCustomElement as d };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../types/components";
|
|
2
|
+
|
|
3
|
+
interface TttxDialogBox extends Components.TttxDialogBox, HTMLElement {}
|
|
4
|
+
export const TttxDialogBox: {
|
|
5
|
+
prototype: TttxDialogBox;
|
|
6
|
+
new (): TttxDialogBox;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
|
|
2
|
+
import { p as purify, d as domSanitiserOptions } from './domsanitiser.options.js';
|
|
3
|
+
import { d as defineCustomElement$3 } from './tttx-button2.js';
|
|
4
|
+
import { d as defineCustomElement$2 } from './tttx-icon2.js';
|
|
5
|
+
|
|
6
|
+
const tttxDialogBoxCss = ".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}h3{margin-block-start:0em;margin-block-end:0em}.dialog-box{background-color:#ffffff;display:flex;flex-direction:column;border:1px solid #d5d5d5;border-radius:4px;box-shadow:0px 1px 5px #1111114d}.dialog-box.small{width:400px;min-height:200px;max-height:500px}.dialog-box.regular{width:600px;min-height:200px;max-height:500px}.dialog-box.large{width:900px;min-height:200px;max-height:500px}.dialog-box.mobile{max-width:424px;max-height:510px}.dialog-box-clickable{cursor:pointer}.dialog-box-padding{padding:8px 16px}.dialog-box-align-right{margin-left:auto;display:flex}.dialog-box-header-box{border-bottom:1px solid #d5d5d5;display:flex;flex-direction:row;height:36px}.dialog-box-header{display:flex;align-items:center;width:100%}.dialog-box-title{font-size:18;font-weight:600;font-family:\"Roboto\", serif}.dialog-box-icon{padding-right:8px;width:24px;height:24px}.dialog-box-icon-close{margin-left:auto;padding-top:3px;width:24px;height:24px}.dialog-box-content{font-size:16;font-weight:400;font-family:\"Roboto\", serif}.dialog-box-body-box{padding:16px}.dialog-box-footer-box{display:flex;flex-direction:row;margin-top:auto;border-top:1px solid #d5d5d5;height:36px}.dialog-box-footer{display:flex;align-items:center;width:100%}.dialog-box-spacing-button{margin-right:8px}.dialog-box-header-box.info{border-bottom:1px solid #1479c6}.dialog-box-header-box.success{border-bottom:1px solid #a2bb31}.dialog-box-header-box.warning{border-bottom:1px solid #f59500}.dialog-box-header-box.critical{border-bottom:1px solid #dc0000}";
|
|
7
|
+
|
|
8
|
+
const TttxDialogBox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
9
|
+
constructor() {
|
|
10
|
+
super();
|
|
11
|
+
this.__registerHost();
|
|
12
|
+
this.__attachShadow();
|
|
13
|
+
this.closeButtonClick = createEvent(this, "closeButtonClick", 6);
|
|
14
|
+
this.buttonClick = createEvent(this, "buttonClick", 7);
|
|
15
|
+
this.data = undefined;
|
|
16
|
+
this.size = 'regular';
|
|
17
|
+
this.elementSize = undefined;
|
|
18
|
+
}
|
|
19
|
+
handleResize() {
|
|
20
|
+
if (window.innerWidth < 698) {
|
|
21
|
+
this.elementSize = 'mobile';
|
|
22
|
+
}
|
|
23
|
+
else {
|
|
24
|
+
this.elementSize = this.size;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
onCloseClickHandler() {
|
|
28
|
+
this.closeButtonClick.emit({ close: true });
|
|
29
|
+
}
|
|
30
|
+
onButtonClickHandler(index) {
|
|
31
|
+
this.buttonClick.emit({ buttonNumber: index, buttonClicked: true });
|
|
32
|
+
}
|
|
33
|
+
renderHeader(header) {
|
|
34
|
+
const title = header.title;
|
|
35
|
+
const iconName = header.iconName;
|
|
36
|
+
const iconColor = header.iconColor;
|
|
37
|
+
const iconEnabled = header.hasIcon ? true : false;
|
|
38
|
+
const closeEnabled = header.hasClose ? true : false;
|
|
39
|
+
return (h("div", { class: "dialog-box-header" }, iconEnabled && h("tttx-icon", { class: "dialog-box-icon", icon: iconName, color: iconColor }), h("h3", { class: "dialog-box-title" }, title), closeEnabled && (h("div", { class: "dialog-box-align-right close-button", onClick: () => this.onCloseClickHandler() }, h("tttx-icon", { class: "dialog-box-icon-close dialog-box-clickable", icon: "close", color: "black" })))));
|
|
40
|
+
}
|
|
41
|
+
renderContent(content) {
|
|
42
|
+
if (content.isCustomHtml) {
|
|
43
|
+
const cleanHTML = purify.sanitize(content.customHtml, domSanitiserOptions);
|
|
44
|
+
return (h("div", { class: "dialog-box-body" }, h("div", { innerHTML: cleanHTML })));
|
|
45
|
+
}
|
|
46
|
+
else {
|
|
47
|
+
return (h("div", { class: "dialog-box-body" }, h("span", { class: "dialog-box-content" }, content.contentText)));
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
renderFooter(footer) {
|
|
51
|
+
const button = footer.buttons;
|
|
52
|
+
const button1Enabled = button.length > 0;
|
|
53
|
+
const button2Enabled = button.length > 1;
|
|
54
|
+
const button3Enabled = button.length == 3;
|
|
55
|
+
const isMobile = this.elementSize === 'mobile';
|
|
56
|
+
return (h("div", { class: "dialog-box-footer" }, h("div", { class: "dialog-box-align-right" }, button3Enabled && (h("tttx-button", { class: "dialog-box-spacing-button", onClick: () => this.onButtonClickHandler(3), design: button[2].type, notext: isMobile, icon: button[2].icon }, !isMobile && button[2].name)), button2Enabled && (h("tttx-button", { class: "dialog-box-spacing-button", onClick: () => this.onButtonClickHandler(2), design: button[1].type, icon: button[1].icon }, button[1].name)), button1Enabled && (h("tttx-button", { onClick: () => this.onButtonClickHandler(1), design: button[0].type, icon: button[0].icon }, button[0].name)))));
|
|
57
|
+
}
|
|
58
|
+
componentWillLoad() {
|
|
59
|
+
if (window.innerWidth < 698) {
|
|
60
|
+
this.elementSize = 'mobile';
|
|
61
|
+
}
|
|
62
|
+
else {
|
|
63
|
+
this.elementSize = this.size;
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
render() {
|
|
67
|
+
if (!this.data)
|
|
68
|
+
return;
|
|
69
|
+
if (typeof this.data === 'string') {
|
|
70
|
+
this._data = JSON.parse(this.data);
|
|
71
|
+
}
|
|
72
|
+
else {
|
|
73
|
+
this._data = this.data;
|
|
74
|
+
}
|
|
75
|
+
return (h("div", { class: `dialog-box ${this.elementSize}` }, h("div", { class: `dialog-box-padding dialog-box-header-box ${this._data.type || ''}` }, this.renderHeader(this._data.header)), h("div", { class: "dialog-box-padding dialog-box-body-box" }, this.renderContent(this._data.body)), h("div", { class: "dialog-box-padding dialog-box-footer-box" }, this.renderFooter(this._data.footer))));
|
|
76
|
+
}
|
|
77
|
+
static get style() { return tttxDialogBoxCss; }
|
|
78
|
+
}, [1, "tttx-dialog-box", {
|
|
79
|
+
"data": [1025],
|
|
80
|
+
"size": [1],
|
|
81
|
+
"elementSize": [32]
|
|
82
|
+
}, [[9, "resize", "handleResize"]]]);
|
|
83
|
+
function defineCustomElement$1() {
|
|
84
|
+
if (typeof customElements === "undefined") {
|
|
85
|
+
return;
|
|
86
|
+
}
|
|
87
|
+
const components = ["tttx-dialog-box", "tttx-button", "tttx-icon"];
|
|
88
|
+
components.forEach(tagName => { switch (tagName) {
|
|
89
|
+
case "tttx-dialog-box":
|
|
90
|
+
if (!customElements.get(tagName)) {
|
|
91
|
+
customElements.define(tagName, TttxDialogBox$1);
|
|
92
|
+
}
|
|
93
|
+
break;
|
|
94
|
+
case "tttx-button":
|
|
95
|
+
if (!customElements.get(tagName)) {
|
|
96
|
+
defineCustomElement$3();
|
|
97
|
+
}
|
|
98
|
+
break;
|
|
99
|
+
case "tttx-icon":
|
|
100
|
+
if (!customElements.get(tagName)) {
|
|
101
|
+
defineCustomElement$2();
|
|
102
|
+
}
|
|
103
|
+
break;
|
|
104
|
+
} });
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
const TttxDialogBox = TttxDialogBox$1;
|
|
108
|
+
const defineCustomElement = defineCustomElement$1;
|
|
109
|
+
|
|
110
|
+
export { TttxDialogBox, defineCustomElement };
|