@deviceinsight/ng-ui-basic-components 3.15.0-SNAPSHOT → 4.0.0-alpha.2

package/lib/cjs/components/tabs/Tabs.js

@@ -1,75 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
-const Bubble_1 = __importDefault(require("../bubble/Bubble"));
-/**
- * Tabs add the possibility to unite several homogeneous pages into one.
- * Unlike RouteTabs, Tabs cannot be accessed directly via the browser's history
- */
-class Tabs extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.state = {
-            currentTab: this.props.pages.length ? this.props.pages[0].name : null
-        };
-        this.handleClick = (tab) => {
-            if (this.props.onChange) {
-                this.props.onChange(tab);
-            }
-            else if (typeof this.props.currentTab === 'undefined') {
-                this.setState({
-                    currentTab: tab
-                });
-            }
-        };
-        this.currentTabPage = () => {
-            const currentTab = typeof this.props.currentTab === 'string' ? this.props.currentTab : this.state.currentTab;
-            return this.props.pages.find(({ name }) => currentTab === name);
-        };
-        this.isCurrentTab = (tab) => {
-            const currentTab = typeof this.props.currentTab === 'string' ? this.props.currentTab : this.state.currentTab;
-            return currentTab === tab;
-        };
-        this.renderBody = () => {
-            const page = this.currentTabPage();
-            if (page && typeof page.renderBody === 'function') {
-                return page.renderBody();
-            }
-            return null;
-        };
-    }
-    render() {
-        const { pages, disabled } = this.props;
-        return (React.createElement("div", null,
-            React.createElement("div", { className: "di tabs" }, pages.map(({ name, renderHeading, tabDescription }) => tabDescription ? (React.createElement(Bubble_1.default, { inverted: true, key: name, content: tabDescription, className: "bubble-tab-description" },
-                React.createElement("button", { "data-testid": "tab-button", className: `item ${disabled ? 'disabled' : ''} ${this.isCurrentTab(name) ? 'active' : ''}`, onClick: () => !disabled && this.handleClick(name) }, renderHeading()))) : (React.createElement("button", { "data-testid": "tab-button", key: name, className: `item ${disabled ? 'disabled' : ''} ${this.isCurrentTab(name) ? 'active' : ''}`, onClick: () => !disabled && this.handleClick(name) }, renderHeading())))),
-            this.renderBody()));
-    }
-}
-exports.default = Tabs;

package/lib/cjs/components/tooltip/Tooltip.d.ts

@@ -1,28 +0,0 @@
-import React from 'react';
-import { PopupDirection } from '../popup/Popup';
-export declare type Props = {
-    /** Content of the Tooltip */
-    content: React.ReactNode;
-    /** Enabler of the Tooltip */
-    children: React.ReactNode;
-    /** @ignore */
-    className?: string;
-    /** (Optional) if set, disables the <Tooltip/> from opening */
-    disabled?: boolean;
-    /** (Optional) if set, opens <Tooltip/> in given direction, defaults to 'right' */
-    direction?: PopupDirection;
-};
-declare type State = {
-    active: boolean;
-};
-/**
- * Tooltip is best used to display some short additional information or description
- */
-export default class Tooltip extends React.Component<Props, State> {
-    state: State;
-    handleMouseEnter: () => void;
-    handleMouseLeave: () => void;
-    render(): JSX.Element;
-}
-export {};
-//# sourceMappingURL=Tooltip.d.ts.map

package/lib/cjs/components/tooltip/Tooltip.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/tooltip/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAc,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAC;AAErD,oBAAY,KAAK,GAAG;IACnB,6BAA6B;IAC7B,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB,6BAA6B;IAC7B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B,cAAc;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,wFAAwF;IACxF,SAAS,CAAC,EAAE,cAAc,CAAC;CAC3B,CAAC;AAEF,aAAK,KAAK,GAAG;IACZ,MAAM,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,OAAQ,SAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC;IACjE,KAAK,EAAE,KAAK,CAEV;IAEF,gBAAgB,EAAE,MAAM,IAAI,CAQ1B;IAEF,gBAAgB,EAAE,MAAM,IAAI,CAI1B;IAEF,MAAM;CAmBN"}

package/lib/cjs/components/tooltip/Tooltip.js

@@ -1,39 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const Popup_1 = __importDefault(require("../popup/Popup"));
-/**
- * Tooltip is best used to display some short additional information or description
- */
-class Tooltip extends react_1.default.Component {
-    constructor() {
-        super(...arguments);
-        this.state = {
-            active: false
-        };
-        this.handleMouseEnter = () => {
-            const { disabled } = this.props;
-            if (!disabled) {
-                this.setState({
-                    active: true
-                });
-            }
-        };
-        this.handleMouseLeave = () => {
-            this.setState({
-                active: false
-            });
-        };
-    }
-    render() {
-        const { content, children, className, direction, ...otherProps } = this.props;
-        const { active } = this.state;
-        return (react_1.default.createElement("span", { onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave },
-            react_1.default.createElement(Popup_1.default, { ...otherProps, active: active, onHide: () => { }, handler: children, direction: direction ? direction : 'right', onHandlerClick: () => { }, className: `tooltip inverted ${className ? className : ''}` },
-                react_1.default.createElement("span", { className: "tooltip-content" }, content))));
-    }
-}
-exports.default = Tooltip;

package/lib/cjs/hooks/useOutsideClick.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useOutsideClick.d.ts","sourceRoot":"","sources":["../../../src/hooks/useOutsideClick.ts"],"names":[],"mappings":"AAqBA,QAAA,MAAM,eAAe,aACV,MAAM,WAAW,GAAG,IAAI,CAAC,kBACnB,UAAU,GAAG,UAAU,GAAG,SAAS,KAAK,IAAI,SA6B5D,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/lib/cjs/hooks/useOutsideClick.js

@@ -1,42 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
-const isTouchEvent = (event) => {
-    return !!event.touches;
-};
-const isInsideBoundingRect = (element, event) => {
-    const rect = element.getBoundingClientRect();
-    let x, y;
-    if (isTouchEvent(event)) {
-        x = event.touches[0].pageX;
-        y = event.touches[0].pageY;
-    }
-    else {
-        x = event.pageX;
-        y = event.pageY;
-    }
-    return rect.left <= x && rect.right >= x && rect.top <= y && rect.bottom >= y;
-};
-const useOutsideClick = (elements, callback) => {
-    const callbackRef = (0, react_1.useRef)(callback);
-    (0, react_1.useEffect)(() => {
-        callbackRef.current = callback;
-    }, [callback]);
-    (0, react_1.useEffect)(() => {
-        const listener = (event) => {
-            const elementsNonNull = elements.filter((element) => element != null);
-            if (elementsNonNull.every((element) => element !== event.target &&
-                !element.contains(event.target) &&
-                !isInsideBoundingRect(element, event))) {
-                callbackRef.current(event);
-            }
-        };
-        document.addEventListener('mousedown', listener, true);
-        document.addEventListener('touchstart', listener, true);
-        return () => {
-            document.removeEventListener('mousedown', listener, true);
-            document.removeEventListener('touchstart', listener, true);
-        };
-    }, [elements]);
-};
-exports.default = useOutsideClick;

package/lib/cjs/index.js

@@ -1,46 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Popup = exports.SearchBox = exports.Tabs = exports.Tooltip = exports.Bubble = exports.Label = exports.Icon = exports.useConfirm = exports.withConfirm = exports.ConfirmProvider = exports.Checkbox = exports.SpinnerContainer = exports.Spinner = exports.ModalContainer = exports.Modal = exports.ButtonRow = exports.Button = exports.AccordionItem = exports.Accordion = void 0;
-require("./assets/style.css");
-// Components
-var Accordion_1 = require("./components/accordion/Accordion");
-Object.defineProperty(exports, "Accordion", { enumerable: true, get: function () { return __importDefault(Accordion_1).default; } });
-var AccordionItem_1 = require("./components/accordionComponents/AccordionItem");
-Object.defineProperty(exports, "AccordionItem", { enumerable: true, get: function () { return __importDefault(AccordionItem_1).default; } });
-var Button_1 = require("./components/button/Button");
-Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return __importDefault(Button_1).default; } });
-var ButtonRow_1 = require("./components/button/ButtonRow");
-Object.defineProperty(exports, "ButtonRow", { enumerable: true, get: function () { return __importDefault(ButtonRow_1).default; } });
-var Modal_1 = require("./components/modal/Modal");
-Object.defineProperty(exports, "Modal", { enumerable: true, get: function () { return __importDefault(Modal_1).default; } });
-var ModalContainer_1 = require("./components/modalComponents/ModalContainer");
-Object.defineProperty(exports, "ModalContainer", { enumerable: true, get: function () { return __importDefault(ModalContainer_1).default; } });
-var Spinner_1 = require("./components/spinner/Spinner");
-Object.defineProperty(exports, "Spinner", { enumerable: true, get: function () { return __importDefault(Spinner_1).default; } });
-var SpinnerContainer_1 = require("./components/spinner/SpinnerContainer");
-Object.defineProperty(exports, "SpinnerContainer", { enumerable: true, get: function () { return __importDefault(SpinnerContainer_1).default; } });
-var Checkbox_1 = require("./components/input/Checkbox");
-Object.defineProperty(exports, "Checkbox", { enumerable: true, get: function () { return __importDefault(Checkbox_1).default; } });
-var ConfirmProvider_1 = require("./components/confirm/ConfirmProvider");
-Object.defineProperty(exports, "ConfirmProvider", { enumerable: true, get: function () { return __importDefault(ConfirmProvider_1).default; } });
-var withConfirm_1 = require("./components/confirm/withConfirm");
-Object.defineProperty(exports, "withConfirm", { enumerable: true, get: function () { return __importDefault(withConfirm_1).default; } });
-var useConfirm_1 = require("./components/confirm/useConfirm");
-Object.defineProperty(exports, "useConfirm", { enumerable: true, get: function () { return __importDefault(useConfirm_1).default; } });
-var Icon_1 = require("./components/icon/Icon");
-Object.defineProperty(exports, "Icon", { enumerable: true, get: function () { return __importDefault(Icon_1).default; } });
-var Label_1 = require("./components/label/Label");
-Object.defineProperty(exports, "Label", { enumerable: true, get: function () { return __importDefault(Label_1).default; } });
-var Bubble_1 = require("./components/bubble/Bubble");
-Object.defineProperty(exports, "Bubble", { enumerable: true, get: function () { return __importDefault(Bubble_1).default; } });
-var Tooltip_1 = require("./components/tooltip/Tooltip");
-Object.defineProperty(exports, "Tooltip", { enumerable: true, get: function () { return __importDefault(Tooltip_1).default; } });
-var Tabs_1 = require("./components/tabs/Tabs");
-Object.defineProperty(exports, "Tabs", { enumerable: true, get: function () { return __importDefault(Tabs_1).default; } });
-var SearchBox_1 = require("./components/input/SearchBox");
-Object.defineProperty(exports, "SearchBox", { enumerable: true, get: function () { return __importDefault(SearchBox_1).default; } });
-var Popup_1 = require("./components/popup/Popup");
-Object.defineProperty(exports, "Popup", { enumerable: true, get: function () { return __importDefault(Popup_1).default; } });

package/lib/cjs/types/i18n.d.ts

@@ -1,5 +0,0 @@
-export declare type TranslationDescriptor = {
-    id: string;
-    defaultValue: string;
-};
-//# sourceMappingURL=i18n.d.ts.map

package/lib/cjs/types/i18n.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"i18n.d.ts","sourceRoot":"","sources":["../../../src/types/i18n.ts"],"names":[],"mappings":"AAAA,oBAAY,qBAAqB,GAAG;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,YAAY,EAAE,MAAM,CAAC;CACrB,CAAC"}

package/lib/cjs/types/i18n.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/lib/esm/__mocks__/react-i18next.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=react-i18next.d.ts.map

package/lib/esm/__mocks__/react-i18next.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"react-i18next.d.ts","sourceRoot":"","sources":["../../../src/__mocks__/react-i18next.ts"],"names":[],"mappings":""}

package/lib/esm/__mocks__/react-i18next.js

@@ -1,17 +0,0 @@
-module.exports = {
-    withTranslation: () => (Component) => {
-        Component.defaultProps = {
-            ...Component.defaultProps,
-            t: (key) => key,
-            i18n: {
-                language: 'de-DE'
-            }
-        };
-        return Component;
-    },
-    Trans: ({ i18nKey, children }) => i18nKey || children,
-    useTranslation: () => ({
-        t: (key) => key
-    })
-};
-export {};

package/lib/esm/assets/search-box.css

@@ -1,29 +0,0 @@
-
-.search-box {
-	height: 32px;
-	padding: 0 30px 0 0;
-	border: 1px solid #ccc;
-	border-radius: 5px;
-	position: relative;
-	background: #fff;
-}
-
-.search-box input {
-	width: 100%;
-	height: 30px;
-	padding: 0 8px 0 15px;
-	background: none;
-	margin-top: 0;
-	border: none;
-	outline: none;
-	font-size: 12px;
-	box-shadow: none;
-	border-radius: 0;
-}
-
-.search-box .di.button {
-	position: absolute;
-	right: 0;
-	margin-right: 0;
-	padding: 7px 10px;
-}

package/lib/esm/assets/style.css

@@ -1,219 +0,0 @@
-/**
-* CS NG
-* UI Components
-*/
-
-/* Button */
-.di.button * {vertical-align:middle;}
-.di.button {height:32px; font-size:11px; font-weight:bold; padding:0 15px; margin:0 4px 0 0; display:inline-block; color:#333; background-color:#fff; border-radius:3px; cursor:pointer; border:1px solid #ddd; border-bottom:1px solid #aaa;}
-.di.button img {opacity:0.8; margin:0;}
-.di.button img + span {margin:0 0 0 8px;}
-.di.button:hover {background-color:rgba(0,0,0,0.07);}
-.di.button:active,
-.di.button.active {background-color:rgba(0,0,0,.1);}
-.di.button.active {border:1px solid #333;}
-.di.button.small {height:24px; margin: 0 1px; padding:0 10px;}
-.di.button.link {display:inline-block; border:none; background-color:transparent; box-shadow:none; cursor:pointer;}
-.di.button.link:hover {text-decoration: none; background-color:rgba(0,0,0,.07); border-radius:3px;}
-.di.button.link:active {background-color:rgba(0,0,0,.1);}
-.di.button.primary {background-color:var(--primary-color, #1a8ed3); border:none; color:#fff; border:1px solid var(--primary-color, #1a8ed3); border-bottom:1px solid var(--primary-color-darker, #1575ad);}
-.di.button.primary:hover,
-.di.button.primary:focus,
-.di.button.primary:active {background-color:var(--primary-color-darker, #1575ad); color:#fff}
-.di.button.danger {background-color:#FF494F; border:none; color:#fff; border:1px solid #FF494F; border-bottom:1px solid #E1494F;}
-.di.button.danger:hover,
-.di.button.danger:focus,
-.di.button.danger:active {background-color:#E1494F; color:#fff;}
-.di.button:disabled,
-.di.button.disabled {opacity:0.35; cursor:default; pointer-events:none; filter:grayscale(100%)}
-
-.di.button::-moz-focus-inner {border:0; padding:0;}
-
-/* ButtonRow */
-.di.button-row {margin:30px 0 40px; display:flex;}
-.di.button-row.dividing {padding:25px 0 0; border-top:1px solid #ddd;}
-.di.button-row .button {min-width:70px;}
-
-/* Modal */
-.di.modal {position:fixed; top:0; right:0; bottom:0; left:0; background-color:rgba(255, 255, 255, 0); z-index: 99999; }
-.di.modal {transition:all .15s linear; pointer-events:none;}
-.di.modal .modal-window {margin:7vh auto 0; border-radius:4px; background-color: #fff; box-shadow:0 5px 10px rgba(0,0,0,0.2); overflow:hidden;}
-.di.modal .modal-window {transition:margin .3s ease-out .2s, opacity .3s ease-out .2s; opacity:0;}
-.di.modal .modal-header {padding:20px 30px; min-height:60px; cursor: move; font-size:20px; line-height:25px; border-bottom:1px solid #ddd;}
-.di.modal .modal-content {padding:20px 30px; max-height:calc(80vh - 100px); overflow:auto; clear:both;}
-.di.modal .modal-footer {margin:0px 0 0 0; text-align:right; padding:20px 30px; border-radius:0 0 4px 4px; border-top:1px solid #ddd;}
-
-.di.modal.show {background-color:rgba(0,0,0,0.5); pointer-events:auto;}
-.di.modal.show .modal-window {margin:10vh auto 0; opacity:1;}
-
-/* Spinner */
-.di.spinner {border: 2px solid #bababa; border-top: 2px solid var(--primary-color, #1a8ed3); border-radius:50%; animation: spin 1s linear infinite; flex-shrink:0;}
-.di.spinner-wrapper {position:relative; height:100%; z-index:0;}
-.di.spinner-wrapper .spinner-container {opacity:0; transition:opacity .1s ease; background-color:rgba(255,255,255,.75);}
-.di.spinner-wrapper .spinner-container {position:absolute; left:0; right:0; top:0; bottom:0; z-index:1; visibility:hidden;}
-.di.spinner-wrapper .spinner-container.visible {opacity:1; visibility:visible;}
-
-@keyframes spin {
-    0% { transform: rotate(0deg); }
-    100% { transform: rotate(360deg); }
-}
-
-/* Checkbox */
-.di.toggle { position: relative; display: inline-block; width: 60px; height: 30px; }
-.di.toggle input { display: none; }
-.di.toggle .switch { position: absolute; background-color: grey; border-radius: 15px; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; }
-.di.toggle .switch:before { content: ''; width: 28px; height: 28px; background-color: white; position: absolute; right: 1px; top: 1px; border-radius: 14px;}
-.di.toggle .switch, .di.toggle .switch:before { transition: transform 0.1s ease-out, background-color 0.05s ease-out 0.05s; }
-.di.toggle input:checked + .switch:before { transform: translateX(0px); }
-.di.toggle input + .switch:before { transform: translateX(-30px); }
-
-.di.toggle-small { width: 40px; height: 20px; }
-.di.toggle .switch-small:before { width: 18px; height: 18px; }
-.di.toggle input + .switch-small:before { transform: translateX(-20px); }
-
-.di.checkbox { cursor: pointer; }
-.di.checkbox > input:disabled + div, .di.toggle > input:disabled + div { opacity: 0.4; cursor: auto; }
-.di.checkbox > input { display: none; }
-.di.checkbox .box, .di.checkbox .radio { display: inline-block; text-align: left; width: 16px; height: 16px; border: 1px solid black; vertical-align: middle; }
-.di.checkbox .radio { border-radius: 10px; }
-.di.checkbox input:checked + .box:before { content: '\2713'; /* checkbox tick */ left: -1px; top:0; position: relative; float: right; font-size: 14px; line-height: 14px; }
-.di.checkbox input:checked + .radio:before { content: ''; display: block; position: relative; height: 6px; width: 6px; background-color: #222; border-radius: 3px; top: 4px; left: 4px; }
-.di .textlabel { user-select: none; font-size: 12px; vertical-align: middle; padding-left: 5px; }
-
-/* Label */
-.di.label {height:22px; padding:0 10px; margin-right:6px; color: #333; border:1px solid #bbb; border-radius:20px; display:inline-flex; align-items:center; font-size:12px; white-space:nowrap;}
-
-.di.label.removable {padding-right:0}
-.di.label .remove {margin:0 2px 0 8px; width:18px; height:18px; display:flex; justify-content: center; align-items: center;}
-.di.label .remove {background-color:rgba(0,0,0,0.3); border-radius:50%; cursor:pointer;}
-.di.label .remove:hover {background-color:rgba(0,0,0,0.5);}
-.di.label .remove:active {background-color:rgba(0,0,0,0.7);}
-.di.label .remove img {flex-shrink:0;}
-
-.di.label.danger {background-color:#e50000; border-color:transparent; color:#fff;}
-.di.label.success {background-color:#00cc0a; border-color:transparent; color:#fff;}
-.di.label.warning {background-color:#ffb400; border-color:transparent; color: #fff;}
-.di.label.neutral {background-color:#ddd; border-color:transparent;}
-
-.di.label.small {height:16px; font-size:11px;}
-.di.label.small .remove {width:12px; height:12px;}
-.di.label.small .remove img {width:10px}
-.di.label.large {height:30px;}
-.di.label.large .remove {width:24px; height:24px;}
-
-.di.label.clickable {cursor:pointer;}
-
-a .di.label {text-decoration:solid inherit underline; font-weight:normal;}
-a .di.label:hover {background-color:rgba(0,0,0,.07); text-decoration:underline;}
-a .di.label:active {background-color:rgba(0,0,0,.1);}
-
-/* misc */
-.clearfix::after {content:""; clear:both; display:block; visibility:hidden; height:0px;}
-.disabled {opacity:0.35; pointer-events:none; cursor:default;}
-
-/* Tabs */
-.di.tabs {margin:5px 0 20px 0; border-bottom:1px solid #ddd; display:flex; flex-wrap:wrap; align-items:center;}
-.di.tabs .item {padding:12px 15px; margin-bottom:-1px; font-size:14px; text-decoration:none; border-bottom:2px solid transparent; color:#666; background:none; border-top:0; border-left:0; border-right:0; border-radius:0; cursor:pointer;}
-.di.tabs .item:hover {background-color:rgba(0, 0, 0, 0.07);}
-.di.tabs .item:active {background-color:rgba(0, 0, 0, 0.1);}
-.di.tabs .item.active, .dragging.item.active {font-weight:bold; color:#333; border-bottom:2px solid var(--primary-color, #1a8ed3); }
-.di.tabs .item.disabled {opacity:0.35; pointer-events:none; cursor:default;}
-.di.tabs .item .add {background:url('./svg/icon_add.svg') no-repeat center; padding:0 25px; background-size: 16px 16px;}
-.dragging.item {padding:12px 15px; margin-bottom:-1px; font-size:14px; text-decoration:none; border-bottom:2px solid transparent; color:#666; background-color:rgba(0, 0, 0, 0.1); border-top:0; border-left:0; border-right:0; border-radius:0; cursor: move; white-space: nowrap;}
-.draggable-area * { cursor: move;}
-.di.tabs .tab-header, .dragging .tab-header { position: relative;}
-.di.tabs .tab-header:after, .dragging .tab-header:after { position: absolute; content: ''; top: 0; bottom: 0; right: 0; left: 0; }
-
-/* Accordion */
-.di.accordion {width:auto;}
-.di.accordion .item {border-bottom:1px solid #bbb;}
-.di.accordion .head {display:flex; align-items:center; justify-content: space-between; transition:.1s all ease;}
-.di.accordion .head:hover {background-color:rgba(0,0,0,.07); transition-duration: 0s;}
-.di.accordion .head::before {content:''; position:absolute;display:inline-block; width:0; height:0; margin:0 0 0 3px; border-top:4px solid transparent; border-bottom:4px solid transparent; border-left:4px solid black;pointer-events:none;}
-.di.accordion .head::before {transition:.1s all ease;}
-.di.accordion .title {width:100%; padding:15px 15px 15px 20px; display:flex; align-items:center; cursor:pointer;}
-.di.accordion .title * {margin:initial} /* h1, h2 etc. no IE11 */
-.di.accordion .title span {margin-right:10px;}
-.di.accordion .tools {padding:0 0 0 15px; display:flex; align-items:center;}
-.di.accordion .cont {height:0px; overflow:hidden; padding:0 0 0 25px; opacity:.3; transition:.25s all ease; transform:scaleY(.90); transform-origin: top left;}
-.di.accordion .item.open .cont {height:auto; padding:15px 0 15px 25px; opacity:1; transform:scaleY(1)}
-.di.accordion .item.open .head:before {transform:rotate(90deg); transition:.3s ease;}
-.di.accordion .item.open .head {border-bottom:1px dashed #eee;}
-.di.accordion .accordion {background-color:rgba(0,0,0,.05);} /* nested */
-.di.accordion h2 {margin-top:0px !important;}
-
-/* Popup */
-.di.popup {min-width:40px; margin-top:-3px; z-index:1000; top:0; left:0; background-color:#fff; border:1px solid rgba(0,0,0,.2); box-shadow:0 1px 3px rgba(0,0,0,0.2); border-radius:3px; opacity:0}
-.di.popup {transition:opacity .1s ease, margin .1s ease;}
-.di.popup-wrapper.hidden, .di.popup-wrapper.hidden > * {opacity: 0 !important; pointer-events: none;}
-.di.popup-wrapper {transition: opacity 200ms ease;}
-
-.di.popup[class*='bottom'],
-.di.popup[class*='top'],
-.di.popup[class*='right'],
-.di.popup[class*='left'] {opacity:1;}
-.di.popup[class*='bottom'] {margin-top:12px;}
-.di.popup[class*='top'] {margin-top:-12px;}
-.di.popup[class*='right'] {margin-left:12px;}
-.di.popup[class*='left'] {margin-right:15px;}
-
-.di.popup .popup-arrow {width:10px; height:10px; margin:0; background-color:#fff; position:absolute; z-index:0; border:1px solid rgba(0,0,0,0.2); border-right:none; border-bottom:none;}
-.di.popup .popup-arrow[class*='bottom'] {top: -6px;}
-.di.popup .popup-arrow[class*='top'] {bottom: -6px;}
-.di.popup .popup-arrow[class*='left'] {right: -6px;}
-.di.popup .popup-arrow[class*='right'] {left: -6px;}
-
-.di.popup .popup-arrow[class*='bottom']::before {
-    border-bottom: none;
-    border-right: none;
-    transform: rotate(45deg);
-}
-
-.di.popup .popup-arrow[class*='top']::before {
-    border-bottom: none;
-    border-right: none;
-    transform: rotate(-135deg);
-}
-
-.di.popup .popup-arrow[class*='left']::before {
-    border-bottom: none;
-    border-right: none;
-    transform: rotate(135deg);
-}
-
-.di.popup .popup-arrow[class*='right']::before {
-    border-bottom: none;
-    border-right: none;
-    transform: rotate(-45deg);
-}
-.di.popup .popup-arrow, .di.popup .popup-arrow::before {
-    position: absolute;
-    width: 8px;
-    height: 8px;
-    background: inherit;
-    border: 1px solid rgba(0, 0, 0, 0.2)
-}
-
-.di.popup .popup-arrow {
-    visibility: hidden;
-}
-
-.di.popup .popup-arrow::before {
-     visibility: visible;
-     content: '';
- }
-
-.di.popup .popup-content {margin:10px;}
-
-.di.popup.inverted {background-color:#333; box-shadow:none;}
-.di.popup.inverted .popup-arrow {background-color:#333; border:none;}
-.di.popup.inverted .popup-content {color:#fff;}
-.di.popup.inverted a {color:#fff; text-decoration:none; vertical-align:middle;}
-.di.popup.inverted a:hover {text-decoration:underline;}
-
-/* Bubble */
-.di.popup.bubble .bubble-content {padding:5px; white-space:nowrap; display:inline-block;}
-
-/* Tooltip */
-.di.popup.tooltip {transition:none; transition:opacity .1s ease;}
-.di.popup.tooltip .tooltip-content{white-space:nowrap; display:inline-block; line-height:12px;}

package/lib/esm/assets/svg/icon_add.svg

@@ -1,3 +0,0 @@
-<svg id="icon-add_24_sga" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
-  <polygon id="plus" points="20 10 14 10 14 4 10 4 10 10 4 10 4 14 10 14 10 20 14 20 14 14 20 14 20 10"/>
-</svg>

package/lib/esm/assets/svg/icon_calendar.svg

@@ -1,50 +0,0 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fff;
-      }
-    </style>
-  </defs>
-  <g>
-    <g>
-      <rect class="cls-1" x="3.5" y="7.5" width="2" height="2"/>
-      <path d="M5,8V9H4V8H5M6,7H3v3H6V7Z"/>
-    </g>
-    <g>
-      <rect class="cls-1" x="8" y="7" width="1" height="1"/>
-      <polygon points="9 7 8 7 8 8 9 8 9 7 9 7"/>
-    </g>
-    <g>
-      <rect class="cls-1" x="10" y="7" width="1" height="1"/>
-      <polygon points="11 7 10 7 10 8 11 8 11 7 11 7"/>
-    </g>
-    <g>
-      <rect class="cls-1" x="12" y="7" width="1" height="1"/>
-      <polygon points="13 7 12 7 12 8 13 8 13 7 13 7"/>
-    </g>
-    <g>
-      <rect class="cls-1" x="8" y="9" width="1" height="1"/>
-      <polygon points="9 9 8 9 8 10 9 10 9 9 9 9"/>
-    </g>
-    <g>
-      <rect class="cls-1" x="8" y="11" width="1" height="1"/>
-      <polygon points="9 11 8 11 8 12 9 12 9 11 9 11"/>
-    </g>
-    <g>
-      <rect class="cls-1" x="6" y="11" width="1" height="1"/>
-      <polygon points="7 11 6 11 6 12 7 12 7 11 7 11"/>
-    </g>
-    <g>
-      <rect class="cls-1" x="4" y="11" width="1" height="1"/>
-      <polygon points="5 11 4 11 4 12 5 12 5 11 5 11"/>
-    </g>
-    <g>
-      <rect class="cls-1" x="10.5" y="9.5" width="2" height="2"/>
-      <path d="M12,10v1H11V10h1m1-1H10v3h3V9Z"/>
-    </g>
-    <path d="M15.31,2H.69A.69.69,0,0,0,0,2.69V14.31A.69.69,0,0,0,.69,15H15.31a.69.69,0,0,0,.69-.69V2.69A.69.69,0,0,0,15.31,2ZM14,13H2V6H14Z"/>
-  </g>
-  <rect x="3" width="3" height="2"/>
-  <rect x="10" width="3" height="2"/>
-</svg>

package/lib/esm/assets/svg/icon_chevron_left.svg

@@ -1,6 +0,0 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
-  <g>
-    <polygon points="3.59 8 9.94 1.65 11.35 3.06 6.41 8 11.35 12.94 9.94 14.35 3.59 8"/>
-    <path d="M9.94,2.35l.71.71L6.41,7.29,5.71,8l.7.71,4.24,4.23-.71.71L4.29,8,9.94,2.35m0-1.41L2.88,8l7.06,7.06,2.12-2.12L7.12,8l4.94-4.94L9.94.94Z"/>
-  </g>
-</svg>

package/lib/esm/assets/svg/icon_chevron_right.svg

@@ -1,6 +0,0 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
-  <g>
-    <polygon points="3.59 12.94 8.53 8 3.59 3.06 5 1.65 11.35 8 5 14.35 3.59 12.94"/>
-    <path d="M5,2.35,10.65,8,5,13.65l-.71-.71L8.53,8.71,9.23,8l-.7-.71L4.29,3.06,5,2.35M5,.94,2.88,3.06,7.82,8,2.88,12.94,5,15.06,12.06,8,5,.94Z"/>
-  </g>
-</svg>

package/lib/esm/assets/svg/icon_cross.svg

@@ -1,3 +0,0 @@
-<svg id="icon-cross_24_sga" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
-  <polygon id="icon-cross_24" points="20 6.28 17.87 4 12 9.78 6.13 4 4 6.28 9.78 11.97 4 17.66 6.13 19.93 12 14.15 17.87 19.93 20 17.66 14.22 11.97 20 6.28"/>
-</svg>

package/lib/esm/assets/svg/icon_download.svg

@@ -1,5 +0,0 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
-  <polygon points="7.92 12 2.84 7 13 7 7.92 12"/>
-  <rect x="5" y="2" width="6" height="5"/>
-  <rect x="2" y="14" width="12" height="1"/>
-</svg>