@3t-transform/threeteeui 0.1.7 → 0.1.10

package/dist/cjs/tttx.cjs.js

@@ -1,131 +1,19 @@
 'use strict';
 
-const index = require('./index-11cfdabe.js');
-const appGlobals = require('./app-globals-3a1e7e63.js');
+const index = require('./index-dc6cc829.js');
 
 /*
  Stencil Client Patch Browser v2.20.0 | MIT Licensed | https://stenciljs.com
  */
-const getDynamicImportFunction = (namespace) => `__sc_import_${namespace.replace(/\s|-/g, '_')}`;
 const patchBrowser = () => {
-    // NOTE!! This fn cannot use async/await!
-    if (index.BUILD.isDev && !index.BUILD.isTesting) {
-        index.consoleDevInfo('Running in development mode.');
-    }
-    if (index.BUILD.cssVarShim) {
-        // shim css vars
-        index.plt.$cssShim$ = index.win.__cssshim;
-    }
-    if (index.BUILD.cloneNodeFix) {
-        // opted-in to polyfill cloneNode() for slot polyfilled components
-        patchCloneNodeFix(index.H.prototype);
-    }
-    if (index.BUILD.profile && !performance.mark) {
-        // not all browsers support performance.mark/measure (Safari 10)
-        // because the mark/measure APIs are designed to write entries to a buffer in the browser that does not exist,
-        // simply stub the implementations out.
-        // TODO(STENCIL-323): Remove this patch when support for older browsers is removed (breaking)
-        // @ts-ignore
-        performance.mark = performance.measure = () => {
-            /*noop*/
-        };
-        performance.getEntriesByName = () => [];
-    }
-    // @ts-ignore
-    const scriptElm = index.BUILD.scriptDataOpts || index.BUILD.safari10 || index.BUILD.dynamicImportShim
-        ? Array.from(index.doc.querySelectorAll('script')).find((s) => new RegExp(`\/${index.NAMESPACE}(\\.esm)?\\.js($|\\?|#)`).test(s.src) ||
-            s.getAttribute('data-stencil-namespace') === index.NAMESPACE)
-        : null;
     const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('tttx.cjs.js', document.baseURI).href));
-    const opts = index.BUILD.scriptDataOpts ? scriptElm['data-opts'] || {} : {};
-    if (index.BUILD.safari10 && 'onbeforeload' in scriptElm && !history.scrollRestoration /* IS_ESM_BUILD */) {
-        // Safari < v11 support: This IF is true if it's Safari below v11.
-        // This fn cannot use async/await since Safari didn't support it until v11,
-        // however, Safari 10 did support modules. Safari 10 also didn't support "nomodule",
-        // so both the ESM file and nomodule file would get downloaded. Only Safari
-        // has 'onbeforeload' in the script, and "history.scrollRestoration" was added
-        // to Safari in v11. Return a noop then() so the async/await ESM code doesn't continue.
-        // IS_ESM_BUILD is replaced at build time so this check doesn't happen in systemjs builds.
-        return {
-            then() {
-                /* promise noop */
-            },
-        };
-    }
-    if (!index.BUILD.safari10 && importMeta !== '') {
+    const opts = {};
+    if (importMeta !== '') {
         opts.resourcesUrl = new URL('.', importMeta).href;
     }
-    else if (index.BUILD.dynamicImportShim || index.BUILD.safari10) {
-        opts.resourcesUrl = new URL('.', new URL(scriptElm.getAttribute('data-resources-url') || scriptElm.src, index.win.location.href)).href;
-        if (index.BUILD.dynamicImportShim) {
-            patchDynamicImport(opts.resourcesUrl, scriptElm);
-        }
-        if (index.BUILD.dynamicImportShim && !index.win.customElements) {
-            // module support, but no custom elements support (Old Edge)
-            // @ts-ignore
-            return Promise.resolve().then(function () { return require(/* webpackChunkName: "polyfills-dom" */ './dom-9deb26c8.js'); }).then(() => opts);
-        }
-    }
     return index.promiseResolve(opts);
 };
-const patchDynamicImport = (base, orgScriptElm) => {
-    const importFunctionName = getDynamicImportFunction(index.NAMESPACE);
-    try {
-        // test if this browser supports dynamic imports
-        // There is a caching issue in V8, that breaks using import() in Function
-        // By generating a random string, we can workaround it
-        // Check https://bugs.chromium.org/p/chromium/issues/detail?id=990810 for more info
-        index.win[importFunctionName] = new Function('w', `return import(w);//${Math.random()}`);
-    }
-    catch (e) {
-        // this shim is specifically for browsers that do support "esm" imports
-        // however, they do NOT support "dynamic" imports
-        // basically this code is for old Edge, v18 and below
-        const moduleMap = new Map();
-        index.win[importFunctionName] = (src) => {
-            const url = new URL(src, base).href;
-            let mod = moduleMap.get(url);
-            if (!mod) {
-                const script = index.doc.createElement('script');
-                script.type = 'module';
-                script.crossOrigin = orgScriptElm.crossOrigin;
-                script.src = URL.createObjectURL(new Blob([`import * as m from '${url}'; window.${importFunctionName}.m = m;`], {
-                    type: 'application/javascript',
-                }));
-                mod = new Promise((resolve) => {
-                    script.onload = () => {
-                        resolve(index.win[importFunctionName].m);
-                        script.remove();
-                    };
-                });
-                moduleMap.set(url, mod);
-                index.doc.head.appendChild(script);
-            }
-            return mod;
-        };
-    }
-};
-const patchCloneNodeFix = (HTMLElementPrototype) => {
-    const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;
-    HTMLElementPrototype.cloneNode = function (deep) {
-        if (this.nodeName === 'TEMPLATE') {
-            return nativeCloneNodeFn.call(this, deep);
-        }
-        const clonedNode = nativeCloneNodeFn.call(this, false);
-        const srcChildNodes = this.childNodes;
-        if (deep) {
-            for (let i = 0; i < srcChildNodes.length; i++) {
-                // Node.ATTRIBUTE_NODE === 2, and checking because IE11
-                if (srcChildNodes[i].nodeType !== 2) {
-                    clonedNode.appendChild(srcChildNodes[i].cloneNode(true));
-                }
-            }
-        }
-        return clonedNode;
-    };
-};
 
 patchBrowser().then(options => {
-  appGlobals.globalScripts();
-  return index.bootstrapLazy([["tttx-button.cjs",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"design":[1]}]]],["tttx-list.cjs",[[1,"tttx-list",{"data":[1025],"name":[1]}]]],["tttx-standalone-input.cjs",[[2,"tttx-standalone-input",{"label":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"iconleft":[1],"iconright":[1],"inputicon":[1],"inline":[4],"inputAutocapitalize":[1,"input-autocapitalize"],"inputAutofocus":[4,"input-autofocus"],"inputKeyhint":[1,"input-keyhint"],"inputIndex":[8,"input-index"],"inputTitle":[1,"input-title"],"autocomplete":[1],"checked":[4],"disabled":[4],"max":[8],"maxlength":[8],"min":[8],"minlength":[8],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[8],"required":[4],"step":[8],"type":[1],"value":[1032]}]]],["tttx-form.cjs",[[1,"tttx-form",{"formschema":[1032],"submitValue":[1032,"submit-value"]}]]],["tttx-keyvalue-block.cjs",[[1,"tttx-keyvalue-block",{"keyvalues":[8],"horizontal":[4]}]]],["tttx-loading-spinner.cjs",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-toolbar.cjs",[[1,"tttx-toolbar",{"border":[4]}]]],["tttx-icon.cjs",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]]], options);
+  return index.bootstrapLazy([["tttx-button.cjs",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"design":[1]}]]],["tttx-filter.cjs",[[1,"tttx-filter",{"filterKey":[1,"filter-key"],"filterOptions":[16],"showSelectAll":[4,"show-select-all"],"showSearchField":[4,"show-search-field"],"showOptionIcons":[4,"show-option-icons"],"filterButtonStyle":[1,"filter-button-style"],"filterHeader":[1,"filter-header"],"showPopover":[32],"selectedFilters":[32],"filterSearchTerm":[32],"displayedFilterSettings":[32],"allSelected":[32]}]]],["tttx-list.cjs",[[1,"tttx-list",{"data":[1025],"name":[1]}]]],["tttx-standalone-input.cjs",[[2,"tttx-standalone-input",{"label":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"iconleft":[1],"iconright":[1],"inputicon":[1],"inline":[4],"inputAutocapitalize":[1,"input-autocapitalize"],"inputAutofocus":[4,"input-autofocus"],"inputKeyhint":[1,"input-keyhint"],"inputIndex":[8,"input-index"],"inputTitle":[1,"input-title"],"autocomplete":[1],"checked":[4],"disabled":[4],"max":[8],"maxlength":[8],"min":[8],"minlength":[8],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[8],"required":[4],"step":[8],"type":[1],"value":[1032]}]]],["tttx-form.cjs",[[1,"tttx-form",{"formschema":[1032],"submitValue":[1032,"submit-value"]}]]],["tttx-keyvalue-block.cjs",[[1,"tttx-keyvalue-block",{"keyvalues":[8],"horizontal":[4]}]]],["tttx-loading-spinner.cjs",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-toolbar.cjs",[[1,"tttx-toolbar",{"border":[4]}]]],["tttx-icon.cjs",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]]], options);
 });

package/dist/collection/collection-manifest.json

@@ -1,5 +1,6 @@
 {
   "entries": [
+    "./components/molecules/tttx-filter/tttx-filter.js",
     "./components/molecules/tttx-standalone-input/tttx-standalone-input.js",
     "./components/atoms/tttx-button/tttx-button.js",
     "./components/atoms/tttx-icon/tttx-icon.js",

package/dist/collection/components/atoms/tttx-button/tttx-button.css

@@ -133,6 +133,14 @@
   display: inline-block;
 }
 
+button {
+  cursor: pointer;
+}
+
+tttx-icon {
+  cursor: inherit;
+}
+
 .spacingleft {
   margin-left: 8px;
 }

package/dist/collection/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.css

@@ -23,6 +23,10 @@ dt.mainTitle {
   color: #212121;
 }
 
+dt, dd {
+  overflow-wrap: anywhere;
+}
+
 dd {
   margin: 0;
   font-weight: 400;

package/dist/collection/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.js

@@ -21,10 +21,11 @@ export class TttxKeyvalueBlock {
   }
   renderArrayElements(values) {
     const elements = [];
+    const divSize = (100 / values.length).toString();
     for (let i = 0; i < values.length; i++) {
       const value = values[i];
       if (this.horizontal) {
-        elements.push(h("div", null, h("dt", { class: 'mainTitle' }, value.title), h("dt", { class: 'subTitle' }, value.subTitle), h("dd", null, value.data)));
+        elements.push(h("div", { style: { maxWidth: divSize } }, h("dt", { class: 'mainTitle' }, value.title), h("dt", { class: 'subTitle' }, value.subTitle), h("dd", null, value.data)));
       }
       else {
         elements.push(h("dt", { class: 'mainTitle' }, value.title));

package/dist/collection/components/molecules/tttx-filter/tttx-filter.css

@@ -0,0 +1,215 @@
+.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;
+}
+
+.filter-container .filter-button {
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 14px;
+  font-weight: 400;
+  font-family: "Roboto", serif;
+  text-transform: uppercase;
+  color: #212121;
+  border: 1px solid #d5d5d5;
+  border-radius: 4px;
+  background: transparent;
+  height: 36px;
+  width: 95px;
+  margin: 0;
+  padding-right: 16px;
+}
+.filter-container .filter-button .filter-icon {
+  padding-left: 8px;
+  padding-right: 4px;
+}
+.filter-container .filter-button.--list-icon {
+  font-size: 0;
+  width: 36px;
+  height: 36px;
+  padding: 0;
+}
+.filter-container .filter-button.--list-icon .filter-icon {
+  padding: 0;
+}
+.filter-container .filter-button.--list-icon:hover {
+  background: #e3e3e3;
+}
+.filter-container .filter-button.--table-icon {
+  font-size: 0;
+  width: 36px;
+  height: 36px;
+  padding: 0;
+  border: none;
+}
+.filter-container .filter-button.--table-icon .filter-icon {
+  padding: 0;
+  width: 24px;
+  height: 24px;
+}
+.filter-container .filter-button.--table-icon:hover {
+  background: #e3e3e3;
+  border-radius: 50%;
+  width: 36px;
+  height: 36px;
+}
+.filter-container .filter-button:hover {
+  background: #e3e3e3;
+}
+.filter-container .filter-popover-container {
+  display: block;
+  width: 196px;
+  border-radius: 4px;
+  box-shadow: 0px 1px 5px #1111114D;
+  position: absolute;
+}
+.filter-container .filter-popover-container .filter-header {
+  color: #757575;
+  text-transform: uppercase;
+  font-size: 14px;
+  font-weight: 500;
+  font-family: "Roboto", serif;
+  padding-left: 16px;
+  padding-top: 12px;
+  padding-bottom: 12px;
+  margin: 0;
+}
+.filter-container .filter-popover-container .popover-divider {
+  border: none;
+  width: 164px;
+  display: flex;
+  margin-left: auto;
+  margin-right: auto;
+  margin-top: 0;
+  margin-bottom: 8px;
+  height: 1px;
+  background-color: #d5d5d5;
+}
+.filter-container .filter-popover-container .filter-option {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  height: 36px;
+  padding-left: 22px;
+  padding-bottom: 4px;
+}
+.filter-container .filter-popover-container .filter-option .select-all-icon {
+  padding-right: 6px;
+}
+.filter-container .filter-popover-container .filter-option .checkbox-icon {
+  padding-right: 8px;
+}
+.filter-container .filter-popover-container .filter-option .filter-label {
+  padding-left: 8px;
+  padding-bottom: 3px;
+  font-size: 16px;
+  font-weight: 500;
+  font-family: "Roboto", serif;
+}
+.filter-container .filter-popover-container .filter-option:first-child {
+  margin-top: 8px;
+}
+.filter-container .filter-popover-container .filter-option:last-child {
+  margin-bottom: 8px;
+}
+.filter-container .filter-popover-container .filter-popover-button-container {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  padding-bottom: 8px;
+}
+.filter-container .filter-popover-container .filter-popover-button-container .close-button {
+  height: 36px;
+  width: 74px;
+  background-color: white;
+  border: 1px solid #d5d5d5;
+  border-radius: 4px;
+  text-transform: uppercase;
+  margin-right: 8px;
+  font-size: 14px;
+  font-weight: 400;
+  font-family: "Roboto", serif;
+}
+.filter-container .filter-popover-container .filter-popover-button-container .apply-button {
+  height: 36px;
+  width: 73px;
+  background-color: #1479c6;
+  color: white;
+  border-radius: 4px;
+  border: none;
+  text-transform: uppercase;
+  margin-right: 16px;
+  font-size: 14px;
+  font-weight: 400;
+  font-family: "Roboto", serif;
+}
+.filter-container .filter-popover-container.--with-search-field {
+  width: 252px;
+}
+.filter-container .filter-popover-container.--with-search-field .popover-divider {
+  width: 220px;
+}
+.filter-container .filter-popover-container.--with-search-field .popover-divider:first-child {
+  top: 44px;
+}
+.filter-container .filter-popover-container.--with-search-field .search-field-container {
+  position: relative;
+  color: #d5d5d5;
+  width: 220px;
+  height: 36px;
+  padding: 0 16px;
+}
+.filter-container .filter-popover-container.--with-search-field .search-field-container .search-icon {
+  position: absolute;
+  top: 50%;
+  padding-left: 8px;
+  padding-bottom: 9.2px;
+  height: 17px;
+  width: 17px;
+  transform: translateY(-50%);
+}
+.filter-container .filter-popover-container.--with-search-field .search-field-container .search-input {
+  padding-left: 36px;
+  border: 1px solid #d5d5d5;
+  border-radius: 4px;
+  height: 36px;
+  width: 220px;
+  font-size: 16px;
+  font-family: "Roboto", serif;
+  font-weight: 500;
+  color: #9e9e9e;
+  box-sizing: border-box;
+}
+.filter-container .filter-popover-container.--with-search-field .search-field-container .search-input:focus-visible, .filter-container .filter-popover-container.--with-search-field .search-field-container .search-input:focus {
+  outline: none;
+  border: 1px solid #1479c6;
+}
+.filter-container .filter-popover-container.--with-search-field .search-field-container .search-input::placeholder {
+  color: #9e9e9e;
+  font-size: 16px;
+  font-family: "Roboto", serif;
+  font-weight: 500;
+}
+.filter-container .filter-popover-container.--with-search-field .search-field-container .popover-divider {
+  margin-top: 8px;
+}
+.filter-container .filter-popover-container.--with-search-field .filter-option:first-child {
+  padding-top: 8px;
+}