@eccenca/gui-elements 22.0.0-rc.6 → 22.1.0-rc.0

package/dist/cjs/components/AutoSuggestion/AutoSuggestionList.js

@@ -0,0 +1,81 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AutoSuggestionList = void 0;
+const react_1 = __importDefault(require("react"));
+const compute_scroll_into_view_1 = __importDefault(require("compute-scroll-into-view"));
+const __1 = require("./../../");
+const ListItem = ({ item }, ref) => {
+    const listItem = (react_1.default.createElement(__1.OverviewItem, { densityHigh: true },
+        react_1.default.createElement(__1.OverviewItemDescription, null,
+            react_1.default.createElement(__1.OverviewItemLine, null,
+                react_1.default.createElement(__1.OverflowText, { ellipsis: "reverse" },
+                    react_1.default.createElement(__1.Highlighter, { label: item.value, searchValue: item.query }))),
+            item.description ? (react_1.default.createElement(__1.OverviewItemLine, { small: true },
+                react_1.default.createElement(__1.OverflowText, null,
+                    react_1.default.createElement(__1.Highlighter, { label: item.description, searchValue: item.query })))) : null)));
+    return (react_1.default.createElement("div", { ref: ref }, !!item.description && item.description.length > 50 ? (react_1.default.createElement(__1.Tooltip, { content: item.description }, listItem)) : (react_1.default.createElement(react_1.default.Fragment, null, listItem))));
+};
+const Item = react_1.default.forwardRef(ListItem);
+/** A drop-down-like list that can be used in combination with other components to show and select items. */
+const AutoSuggestionList = ({ isOpen, options, loading, onItemSelectionChange, left, currentlyFocusedIndex, itemToHighlight, }) => {
+    const [hoveredItem, setHoveredItem] = react_1.default.useState(undefined);
+    // Refs of list items
+    const [refs] = react_1.default.useState([]);
+    const dropdownRef = react_1.default.useRef(null);
+    const generateRef = (index) => {
+        if (!refs[index]) {
+            refs[index] = react_1.default.createRef();
+        }
+        return refs[index];
+    };
+    react_1.default.useEffect(() => {
+        const listIndexNode = refs[currentlyFocusedIndex];
+        if ((dropdownRef === null || dropdownRef === void 0 ? void 0 : dropdownRef.current) && (listIndexNode === null || listIndexNode === void 0 ? void 0 : listIndexNode.current)) {
+            const actions = (0, compute_scroll_into_view_1.default)(listIndexNode.current, {
+                boundary: dropdownRef.current,
+                block: "nearest",
+                scrollMode: "if-needed",
+            });
+            actions.forEach(({ el, top, left }) => {
+                el.scrollTop = top;
+                el.scrollLeft = left;
+            });
+        }
+    }, [currentlyFocusedIndex, refs]);
+    const focusedItem = options[currentlyFocusedIndex];
+    // Decide which item to highlight
+    react_1.default.useEffect(() => {
+        itemToHighlight(!isOpen ? undefined : hoveredItem || focusedItem);
+    }, [
+        currentlyFocusedIndex,
+        itemToHighlight,
+        focusedItem,
+        isOpen,
+        hoveredItem,
+    ]);
+    const Loader = (react_1.default.createElement(__1.OverviewItem, { hasSpacing: true },
+        react_1.default.createElement(__1.OverviewItemLine, null, "Fetching suggestions"),
+        react_1.default.createElement(__1.Spacing, { size: "tiny", vertical: true }),
+        react_1.default.createElement(__1.Spinner, { position: "inline", description: "" })));
+    const loadingOrHasSuggestions = loading || options.length;
+    if (!loadingOrHasSuggestions || !isOpen)
+        return null;
+    return (react_1.default.createElement("div", { className: "ecc-auto-suggestion-box__dropdown", style: { left }, ref: dropdownRef }, loading ? (Loader) : (react_1.default.createElement(__1.Menu, null, options.map((item, index) => (react_1.default.createElement(__1.MenuItem, { key: index, internalProps: {
+            active: currentlyFocusedIndex === index,
+            onMouseDown: (e) => e.preventDefault(),
+            onClick: () => onItemSelectionChange(item),
+            text: (react_1.default.createElement(Item, { ref: generateRef(index), item: item })),
+            onMouseEnter: () => setHoveredItem(item),
+            onMouseLeave: () => setHoveredItem(undefined),
+            onMouseOver: () => {
+                if (item.value !== (hoveredItem === null || hoveredItem === void 0 ? void 0 : hoveredItem.value)) {
+                    setHoveredItem(item);
+                }
+            },
+        } })))))));
+};
+exports.AutoSuggestionList = AutoSuggestionList;
+//# sourceMappingURL=AutoSuggestionList.js.map

package/dist/cjs/components/AutoSuggestion/AutoSuggestionList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutoSuggestionList.js","sourceRoot":"","sources":["../../../../src/components/AutoSuggestion/AutoSuggestionList.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/AutoSuggestion/SingleLineCodeEditor.js

@@ -0,0 +1,46 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+require("codemirror/addon/display/placeholder");
+require("codemirror/mode/sparql/sparql.js");
+const react_1 = __importDefault(require("react"));
+const react_codemirror2_1 = require("react-codemirror2");
+const core_1 = require("@blueprintjs/core");
+/** A single-line code editor. */
+const SingleLineCodeEditor = ({ setEditorInstance, onChange, onCursorChange, mode, initialValue, onFocusChange, onKeyDown, onSelection, enableTab = false, placeholder, showScrollBar = true }) => {
+    return (react_1.default.createElement("div", { className: "ecc-input-editor " + core_1.Classes.INPUT },
+        react_1.default.createElement(react_codemirror2_1.Controlled, { editorDidMount: (editor) => {
+                editor.on("beforeChange", (_, change) => {
+                    // Prevent the user from entering new-line characters, since this is supposed to be a one-line editor.
+                    const newText = change.text.join("").replace(/\n/g, "");
+                    //failing unexpectedly during undo and redo
+                    if (change.update && typeof change.update === "function") {
+                        change.update(change.from, change.to, [newText]);
+                    }
+                    return true;
+                });
+                setEditorInstance(editor);
+            }, value: initialValue, onFocus: () => onFocusChange(true), onBlur: () => onFocusChange(false), options: {
+                mode: mode,
+                lineNumbers: false,
+                theme: "xq-light",
+                extraKeys: enableTab ? undefined : { Tab: false },
+                placeholder,
+                scrollbarStyle: showScrollBar ? "native" : "null"
+            }, onSelection: (editor, data) => {
+                if (Array.isArray(data === null || data === void 0 ? void 0 : data.ranges)) {
+                    onSelection(data.ranges
+                        .map((r) => ({ from: r.from().ch, to: r.to().ch }))
+                        .filter((r) => r.from !== r.to));
+                }
+            }, onCursor: (editor, data) => {
+                onCursorChange(data, editor.cursorCoords(true, "div"));
+            }, onBeforeChange: (editor, data, value) => {
+                const trimmedValue = value.replace(/\n/g, "");
+                onChange(trimmedValue);
+            }, onKeyDown: (_, event) => onKeyDown(event) })));
+};
+exports.default = SingleLineCodeEditor;
+//# sourceMappingURL=SingleLineCodeEditor.js.map

package/dist/cjs/components/AutoSuggestion/SingleLineCodeEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleLineCodeEditor.js","sourceRoot":"","sources":["../../../../src/components/AutoSuggestion/SingleLineCodeEditor.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/AutocompleteField/AutoCompleteField.js

@@ -0,0 +1,231 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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 __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AutoCompleteField = void 0;
+const react_1 = __importStar(require("react"));
+const select_1 = require("@blueprintjs/select");
+const index_1 = require("../../index");
+const constants_1 = require("../../configuration/constants");
+AutoCompleteField.defaultProps = {
+    autoFocus: false,
+    disabled: false,
+};
+/** Hook that returns the element width of the given ref.*/
+const elementWidth = (elRef) => {
+    if (elRef && elRef.current) {
+        return { width: elRef.current.offsetWidth + "px", maxWidth: "90vw" };
+    }
+    else {
+        return { width: "40rem", maxWidth: "90vw" };
+    }
+};
+/** Auto-complete input widget. */
+function AutoCompleteField(props) {
+    var _a;
+    const { reset, noResultText, disabled, itemValueSelector, itemRenderer, onSearch, onChange, initialValue, autoFocus, createNewItem, itemValueRenderer, resetQueryToValue, itemValueString } = props, otherProps = __rest(props, ["reset", "noResultText", "disabled", "itemValueSelector", "itemRenderer", "onSearch", "onChange", "initialValue", "autoFocus", "createNewItem", "itemValueRenderer", "resetQueryToValue", "itemValueString"]);
+    const [selectedItem, setSelectedItem] = (0, react_1.useState)(initialValue);
+    // If the selection list elements are currently fetched from the backend
+    const [listLoading, setListLoading] = (0, react_1.useState)(false);
+    const [query, setQuery] = (0, react_1.useState)("");
+    const [hasFocus, setHasFocus] = (0, react_1.useState)(false);
+    const [highlightingEnabled, setHighlightingEnabled] = (0, react_1.useState)(true);
+    // The suggestions that match the user's input
+    const [filtered, setFiltered] = (0, react_1.useState)([]);
+    const SuggestAutocomplete = select_1.Suggest.ofType();
+    // Sets the query to the item value if it has a valid string value
+    const setQueryToSelectedValue = (item) => {
+        if (item) {
+            // If new values can be created, always reset the query value to the actual value of the selected item.
+            // This e.g. prevents that the "create new" option will be shown, since an item with the same value already exists.
+            const defaultResetValue = createNewItem ? itemValueString(item) : itemValueRenderer(item);
+            const resetVal = resetQueryToValue ? resetQueryToValue(item) : defaultResetValue;
+            setQuery(resetVal);
+        }
+    };
+    const fieldRef = (0, react_1.useRef)(null);
+    // The key for the option elements
+    const itemKey = (item) => {
+        return itemValueString(item);
+    };
+    (0, react_1.useEffect)(() => {
+        setQueryToSelectedValue(selectedItem);
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [selectedItem]);
+    (0, react_1.useEffect)(() => {
+        if (!disabled && hasFocus) {
+            setListLoading(true);
+            const timeout = window.setTimeout(() => __awaiter(this, void 0, void 0, function* () {
+                fetchQueryResults(query);
+            }), 200);
+            return () => {
+                clearTimeout(timeout);
+                setListLoading(false);
+            };
+        }
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [hasFocus, query]);
+    const fieldWidthLimits = elementWidth(fieldRef);
+    // We need to fire some actions when the auto-complete widget gets or loses focus
+    const handleOnFocusIn = () => {
+        setHasFocus(true);
+    };
+    const handleOnFocusOut = () => {
+        setHasFocus(false);
+    };
+    // On popover close reset query to selected item
+    const onPopoverClose = () => {
+        // Reset query to selected value when loosing focus, so the selected value can always be edited.
+        setQueryToSelectedValue(selectedItem);
+        // Reset option list when the popover closes, so next use there is not displayed a stale list
+        setFiltered([]);
+    };
+    // Triggered when an item from the selection list gets selected
+    const onSelectionChange = (value, e) => {
+        setSelectedItem(value);
+        onChange === null || onChange === void 0 ? void 0 : onChange(itemValueSelector(value), e);
+        setQueryToSelectedValue(value);
+    };
+    const areEqualItems = (itemA, itemB) => itemValueSelector(itemA) === itemValueSelector(itemB);
+    // Return the index of the item in the array based on the itemValueRenderer value
+    const itemIndexOf = (arr, searchItem) => {
+        let idx = -1;
+        const searchItemString = itemValueString(searchItem);
+        arr.forEach((v, i) => {
+            if (itemValueString(v) === searchItemString) {
+                idx = i;
+            }
+        });
+        return idx;
+    };
+    // Fetches the results for the given query
+    const fetchQueryResults = (input) => __awaiter(this, void 0, void 0, function* () {
+        setListLoading(true);
+        try {
+            let result = yield onSearch(input);
+            const onlySelectItemReturned = result.length <= 1 && selectedItem && input.length > 0 &&
+                (itemValueRenderer(selectedItem) === input || itemValueString(selectedItem) === input);
+            let enableHighlighting = true;
+            if (onlySelectItemReturned) {
+                // If the auto-completion only returns no suggestion or the selected item itself, query with empty string.
+                const emptyStringResults = yield onSearch("");
+                // Disable highlighting, since we used empty string search
+                enableHighlighting = false;
+                // Put selected item at the top if it is not in the result list
+                if (!!selectedItem && itemIndexOf(emptyStringResults, selectedItem) === -1) {
+                    result = [selectedItem, ...emptyStringResults];
+                }
+                else {
+                    result = emptyStringResults;
+                }
+            }
+            setHighlightingEnabled(enableHighlighting);
+            setFiltered(result);
+        }
+        catch (e) {
+            console.log(e);
+        }
+        finally {
+            setListLoading(false);
+        }
+    });
+    // Renders the item in the selection list
+    const optionRenderer = (item, { handleClick, modifiers, query }) => {
+        if (!modifiers.matchesPredicate) {
+            return null;
+        }
+        const relevantModifiers = {
+            active: modifiers.active,
+            disabled: modifiers.disabled,
+            styleWidth: fieldWidthLimits,
+            highlightingEnabled: highlightingEnabled,
+        };
+        const renderedItem = itemRenderer(item, query, relevantModifiers, handleClick);
+        if (typeof renderedItem === "string") {
+            return (react_1.default.createElement(index_1.MenuItem, { active: modifiers.active, disabled: modifiers.disabled, key: itemKey(item), onClick: handleClick, text: react_1.default.createElement(index_1.OverflowText, { style: fieldWidthLimits }, !highlightingEnabled ? renderedItem : react_1.default.createElement(index_1.Highlighter, { label: renderedItem, searchValue: query })) }));
+        }
+        else {
+            return renderedItem;
+        }
+    };
+    // Resets the selection
+    const clearSelection = (resetValue) => () => {
+        setSelectedItem(undefined);
+        onChange === null || onChange === void 0 ? void 0 : onChange(resetValue);
+        setQuery("");
+    };
+    // Optional clear button to reset the selected value
+    const clearButton = reset &&
+        selectedItem != null &&
+        reset.resettableValue(selectedItem) ? (react_1.default.createElement(index_1.IconButton, { "data-test-id": (((_a = otherProps.inputProps) === null || _a === void 0 ? void 0 : _a.id) ? `${otherProps.inputProps.id}-` : "") + "auto-complete-clear-btn", name: "operation-clear", text: reset.resetButtonText, onClick: clearSelection(reset.resetValue) })) : undefined;
+    // Additional properties for the input element of the auto-completion widget
+    const updatedInputProps = Object.assign({ rightElement: clearButton, autoFocus: autoFocus, onBlur: handleOnFocusOut, onFocus: handleOnFocusIn }, otherProps.inputProps);
+    const updatedPopOverProps = Object.assign({ minimal: true, position: "bottom", popoverClassName: `${constants_1.CLASSPREFIX}-autocompletefield__options`, wrapperTagName: "div", boundary: "window", onClosed: onPopoverClose }, otherProps.popoverProps);
+    if (selectedItem !== undefined) {
+        // Makes sure that even when an empty string is selected, the placeholder won't be shown.
+        updatedInputProps.placeholder = "";
+    }
+    // For some reason Typescript is not able to infer the union type from the ternary expression
+    const createNewItemPosition = (createNewItem === null || createNewItem === void 0 ? void 0 : createNewItem.showNewItemOptionFirst) ? "first" : "last";
+    const createNewItemProps = createNewItem ? {
+        createNewItemFromQuery: createNewItem.itemFromQuery,
+        createNewItemRenderer: (query, active, handleClick) => {
+            if (selectedItem && query === itemValueString(selectedItem)) {
+                // Never show create new item option if the same item is already selected
+                return undefined;
+            }
+            else {
+                return createNewItem.itemRenderer(query, { active, styleWidth: fieldWidthLimits, highlightingEnabled: false }, handleClick);
+            }
+        },
+        createNewItemPosition
+    } : {};
+    return (react_1.default.createElement("div", { ref: fieldRef },
+        react_1.default.createElement(SuggestAutocomplete, Object.assign({ className: `${constants_1.CLASSPREFIX}-autocompletefield__input`, disabled: disabled, items: filtered, inputValueRenderer: selectedItem !== undefined ? itemValueRenderer : () => "", itemRenderer: optionRenderer, itemsEqual: areEqualItems, noResults: react_1.default.createElement(index_1.MenuItem, { disabled: true, text: noResultText, style: fieldWidthLimits }), onItemSelect: onSelectionChange, onQueryChange: (q) => setQuery(q), closeOnSelect: true, query: query, 
+            // FIXME: This leads to odd compile errors without "as any"
+            popoverProps: updatedPopOverProps, selectedItem: selectedItem, fill: true }, createNewItemProps, { 
+            // FIXME: This leads to odd compile errors without "as any"
+            inputProps: updatedInputProps, itemListRenderer: listLoading ? () => react_1.default.createElement(index_1.Menu, null,
+                react_1.default.createElement(index_1.MenuItem, { disabled: true, text: react_1.default.createElement(index_1.Spinner, { position: "inline" }), style: fieldWidthLimits })) : undefined }))));
+}
+exports.AutoCompleteField = AutoCompleteField;
+//# sourceMappingURL=AutoCompleteField.js.map

package/dist/cjs/components/AutocompleteField/AutoCompleteField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutoCompleteField.js","sourceRoot":"","sources":["../../../../src/components/AutocompleteField/AutoCompleteField.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/Breadcrumb/BreadcrumbItem.js

@@ -0,0 +1,36 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+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"));
+// import PropTypes from 'prop-types';
+const core_1 = require("@blueprintjs/core");
+const constants_1 = require("../../configuration/constants");
+const openInNewTab_1 = require("../../common/utils/openInNewTab");
+function BreadcrumbItem(_a) {
+    var { className = "", onClick, href } = _a, 
+    //itemDivider='',
+    otherBlueprintBreadcrumbProps = __rest(_a, ["className", "onClick", "href"]);
+    /*
+        TODO: adding `data-divider` does not work this way because BlueprintJS
+        breadcrumb component does not support (and forward) it on HTML element
+        level. The idea is to add the divider as data-* property to use it via
+        CSS/Sass as content for the pseudo element, currently done static in CSS
+        with slash char.
+    */
+    return (react_1.default.createElement(core_1.Breadcrumb, Object.assign({}, otherBlueprintBreadcrumbProps, { href: href, onClick: (e) => (0, openInNewTab_1.openInNewTab)(e, onClick, href), className: `${constants_1.CLASSPREFIX}-breadcrumb__item ` + className })));
+}
+exports.default = BreadcrumbItem;
+//# sourceMappingURL=BreadcrumbItem.js.map

package/dist/cjs/components/Breadcrumb/BreadcrumbItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreadcrumbItem.js","sourceRoot":"","sources":["../../../../src/components/Breadcrumb/BreadcrumbItem.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,sCAAsC;AACtC,4CAG2B;AAC3B,6DAAsE;AACtE,kEAA+D;AAY/D,SAAS,cAAc,CAAC,EAMD;QANC,EACpB,SAAS,GAAG,EAAE,EACd,OAAO,EACP,IAAI,OAGe;IAFnB,iBAAiB;IACd,6BAA6B,cALZ,gCAMvB,CADmC;IAGhC;;;;;;MAME;IACF,OAAO,CACL,8BAAC,iBAAuB,oBAClB,6BAA6B,IACjC,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAA,2BAAY,EAAC,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,EAC9C,SAAS,EAAE,GAAG,uBAAM,oBAAoB,GAAG,SAAS,IAEpD,CACH,CAAC;AACN,CAAC;AAED,kBAAe,cAAc,CAAC"}

package/dist/cjs/components/Breadcrumb/BreadcrumbList.js

@@ -0,0 +1,41 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+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 core_1 = require("@blueprintjs/core");
+const constants_1 = require("../../configuration/constants");
+const BreadcrumbItem_1 = __importDefault(require("./BreadcrumbItem"));
+function BreadcrumbList(_a) {
+    var { className = "", 
+    // itemDivider = "/",
+    onItemClick, htmlUlProps } = _a, otherBlueprintBreadcrumbsProps = __rest(_a, ["className", "onItemClick", "htmlUlProps"]);
+    const renderBreadcrumb = (propsBreadcrumb) => {
+        const { onClick } = propsBreadcrumb, otherProps = __rest(propsBreadcrumb, ["onClick"]);
+        return (react_1.default.createElement(BreadcrumbItem_1.default
+        /*itemDivider="/"*/
+        , Object.assign({}, otherProps, { onClick: onItemClick
+                ? (e) => {
+                    onItemClick(propsBreadcrumb.href, e);
+                }
+                : onClick })));
+    };
+    const renderCurrentBreadcrumb = (propsBreadcrumb) => {
+        return react_1.default.createElement(BreadcrumbItem_1.default, Object.assign({}, propsBreadcrumb, { current: true, href: null, onClick: null }));
+    };
+    return (react_1.default.createElement(core_1.Breadcrumbs, Object.assign({}, otherBlueprintBreadcrumbsProps, htmlUlProps, { className: `${constants_1.CLASSPREFIX}-breadcrumb__list ` + className, minVisibleItems: 1, breadcrumbRenderer: renderBreadcrumb, currentBreadcrumbRenderer: renderCurrentBreadcrumb })));
+}
+exports.default = BreadcrumbList;
+//# sourceMappingURL=BreadcrumbList.js.map

package/dist/cjs/components/Breadcrumb/BreadcrumbList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreadcrumbList.js","sourceRoot":"","sources":["../../../../src/components/Breadcrumb/BreadcrumbList.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,4CAG2B;AAC3B,6DAAsE;AACtE,sEAA8C;AAkC9C,SAAS,cAAc,CAAC,EAMD;QANC,EACpB,SAAS,GAAG,EAAE;IACd,qBAAqB;IACrB,WAAW,EACX,WAAW,OAEQ,EADhB,8BAA8B,cALb,2CAMvB,CADoC;IAEjC,MAAM,gBAAgB,GAAG,CAAC,eAAoB,EAAE,EAAE;QAC9C,MAAM,EAAC,OAAO,KAAmB,eAAe,EAA7B,UAAU,UAAI,eAAe,EAA1C,WAAwB,CAAkB,CAAC;QACjD,OAAO,CACH,8BAAC,wBAAc;QACX,mBAAmB;4BACf,UAAU,IACd,OAAO,EACH,WAAW;gBACP,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE;oBACF,WAAW,CAAC,eAAe,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;gBACzC,CAAC;gBACH,CAAC,CAAC,OAAO,IAEnB,CACL,CAAC;IACN,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,CAAC,eAAoB,EAAE,EAAE;QACrD,OAAO,8BAAC,wBAAc,oBAAK,eAAe,IAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,IAAkC,CAAC;IAC3H,CAAC,CAAC;IAEF,OAAO,CACH,8BAAC,kBAAuB,oBAChB,8BAA8B,EAC9B,WAAW,IACf,SAAS,EAAE,GAAG,uBAAM,oBAAoB,GAAG,SAAS,EACpD,eAAe,EAAE,CAAC,EAClB,kBAAkB,EAAE,gBAAgB,EACpC,yBAAyB,EAAE,uBAAuB,IACpD,CACL,CAAC;AACN,CAAC;AAED,kBAAe,cAAc,CAAC"}

package/dist/cjs/components/Button/Button.js

@@ -0,0 +1,51 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+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 core_1 = require("@blueprintjs/core");
+const Icon_1 = __importDefault(require("../Icon/Icon"));
+const Tooltip_1 = __importDefault(require("./../Tooltip/Tooltip"));
+const constants_1 = require("../../configuration/constants");
+/**
+ * Display a button element to enable user interaction.
+ * It normally should trigger action when clicked.
+ */
+function Button(_a) {
+    var { children, className = "", affirmative = false, disruptive = false, elevated = false, hasStatePrimary = false, hasStateSuccess = false, hasStateWarning = false, hasStateDanger = false, icon, rightIcon, tooltip = null, tooltipProperties } = _a, restProps = __rest(_a, ["children", "className", "affirmative", "disruptive", "elevated", "hasStatePrimary", "hasStateSuccess", "hasStateWarning", "hasStateDanger", "icon", "rightIcon", "tooltip", "tooltipProperties"]);
+    let intention;
+    switch (true) {
+        case affirmative || elevated || hasStatePrimary:
+            intention = core_1.Intent.PRIMARY;
+            break;
+        case hasStateSuccess:
+            intention = core_1.Intent.SUCCESS;
+            break;
+        case hasStateWarning:
+            intention = core_1.Intent.WARNING;
+            break;
+        case disruptive || hasStateDanger:
+            intention = core_1.Intent.DANGER;
+            break;
+        default:
+            break;
+    }
+    let ButtonType = restProps.href ? core_1.AnchorButton : core_1.Button;
+    const button = (react_1.default.createElement(ButtonType, Object.assign({}, restProps, { className: `${constants_1.CLASSPREFIX}-button ` + className, intent: intention, icon: typeof icon === "string" ? react_1.default.createElement(Icon_1.default, { name: icon }) : icon, rightIcon: typeof rightIcon === "string" ? react_1.default.createElement(Icon_1.default, { name: rightIcon }) : rightIcon }), children));
+    return tooltip ? (react_1.default.createElement(Tooltip_1.default, Object.assign({ content: tooltip }, tooltipProperties),
+        react_1.default.createElement("span", null, button))) : (button);
+}
+exports.default = Button;
+//# sourceMappingURL=Button.js.map

package/dist/cjs/components/Button/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/Button/Button.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,4CAM2B;AAC3B,wDAAgC;AAChC,mEAA6D;AAC7D,6DAAsE;AAsDtE;;;GAGG;AACH,SAAS,MAAM,CAAC,EAeoB;QAfpB,EACd,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,WAAW,GAAG,KAAK,EACnB,UAAU,GAAG,KAAK,EAClB,QAAQ,GAAG,KAAK,EAChB,eAAe,GAAG,KAAK,EACvB,eAAe,GAAG,KAAK,EACvB,eAAe,GAAG,KAAK,EACvB,cAAc,GAAG,KAAK,EACtB,IAAI,EACJ,SAAS,EACT,OAAO,GAAG,IAAI,EACd,iBAAiB,OAEiB,EAD/B,SAAS,cAdE,kMAef,CADa;IAEZ,IAAI,SAAS,CAAC;IACd,QAAQ,IAAI,EAAE;QACZ,KAAK,WAAW,IAAI,QAAQ,IAAI,eAAe;YAC7C,SAAS,GAAG,aAAe,CAAC,OAAO,CAAC;YACpC,MAAM;QACR,KAAK,eAAe;YAClB,SAAS,GAAG,aAAe,CAAC,OAAO,CAAC;YACpC,MAAM;QACR,KAAK,eAAe;YAClB,SAAS,GAAG,aAAe,CAAC,OAAO,CAAC;YACpC,MAAM;QACR,KAAK,UAAU,IAAI,cAAc;YAC/B,SAAS,GAAG,aAAe,CAAC,MAAM,CAAC;YACnC,MAAM;QACR;YACE,MAAM;KACT;IAED,IAAI,UAAU,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,mBAAqB,CAAC,CAAC,CAAC,aAAe,CAAC;IAE1E,MAAM,MAAM,GAAG,CACb,8BAAC,UAAU,oBACL,SAAS,IACb,SAAS,EAAE,GAAG,uBAAM,UAAU,GAAG,SAAS,EAC1C,MAAM,EAAE,SAAS,EACjB,IAAI,EAAE,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,8BAAC,cAAI,IAAC,IAAI,EAAE,IAAI,GAAI,CAAC,CAAC,CAAC,IAAI,EAC5D,SAAS,EACX,OAAO,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,8BAAC,cAAI,IAAC,IAAI,EAAE,SAAS,GAAI,CAAC,CAAC,CAAC,SAAS,KAGlE,QAAQ,CACE,CACd,CAAC;IAEF,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,8BAAC,iBAAO,kBAAC,OAAO,EAAE,OAAO,IAAM,iBAAiB;QAC9C,4CAAO,MAAM,CAAQ,CACb,CACX,CAAC,CAAC,CAAC,CACF,MAAM,CACP,CAAC;AACJ,CAAC;AAED,kBAAe,MAAM,CAAC"}

package/dist/cjs/components/Card/Card.js

@@ -0,0 +1,35 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+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 core_1 = require("@blueprintjs/core");
+const constants_1 = require("../../configuration/constants");
+/**
+ * Element to separate content sections from each other.
+ * Cards can include other cards but should not.
+ */
+function Card(_a) {
+    var { children, className = '', elevation = 1, isOnlyLayout = false, fullHeight = false, elevated = false, interactive } = _a, otherProps = __rest(_a, ["children", "className", "elevation", "isOnlyLayout", "fullHeight", "elevated", "interactive"]);
+    const cardElement = (react_1.default.createElement(core_1.Card, Object.assign({ className: `${constants_1.CLASSPREFIX}-card ` +
+            (fullHeight ? ` ${constants_1.CLASSPREFIX}-card--fullheight ` : '') +
+            (elevated ? ` ${constants_1.CLASSPREFIX}-card--elevated ` : '') +
+            className, elevation: elevation, interactive: !!otherProps.onClick ? true : interactive }, otherProps), children));
+    // TODO: improve Card element so it is itself a section html element
+    return isOnlyLayout === false ? react_1.default.createElement("section", null, cardElement) : cardElement;
+}
+;
+exports.default = Card;
+//# sourceMappingURL=Card.js.map

package/dist/cjs/components/Card/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../../src/components/Card/Card.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,4CAG2B;AAC3B,6DAAsE;AAkBtE;;;GAGG;AACH,SAAS,IAAI,CAAC,EASF;QATE,EACV,QAAQ,EACR,SAAS,GAAC,EAAE,EACZ,SAAS,GAAC,CAAC,EACX,YAAY,GAAC,KAAK,EAClB,UAAU,GAAC,KAAK,EAChB,QAAQ,GAAC,KAAK,EACd,WAAW,OAEH,EADL,UAAU,cARH,+FASb,CADgB;IAEb,MAAM,WAAW,GAAG,CAChB,8BAAC,WAAa,kBACV,SAAS,EACL,GAAG,uBAAM,QAAQ;YACjB,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,uBAAM,oBAAoB,CAAC,CAAC,CAAC,EAAE,CAAC;YAClD,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,uBAAM,kBAAkB,CAAC,CAAC,CAAC,EAAE,CAAC;YAC9C,SAAS,EAEb,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,IAClD,UAAU,GAEb,QAAQ,CACG,CACnB,CAAC;IAEF,oEAAoE;IACpE,OAAO,YAAY,KAAK,KAAK,CAAC,CAAC,CAAC,+CAAU,WAAW,CAAW,CAAC,CAAC,CAAC,WAAW,CAAC;AACnF,CAAC;AAAA,CAAC;AAEF,kBAAe,IAAI,CAAC"}

package/dist/cjs/components/Card/CardActions.js

@@ -0,0 +1,31 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+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 constants_1 = require("../../configuration/constants");
+/**
+ * Contains a footer with user-interaction elements like buttons for the `Card` element.
+ * Content must be ordered by importance, so the main action comes before other actions.
+ */
+function CardActions(_a) {
+    var { children, className = '', inverseDirection = false } = _a, otherProps = __rest(_a, ["children", "className", "inverseDirection"]);
+    return (react_1.default.createElement("footer", Object.assign({}, otherProps, { className: `${constants_1.CLASSPREFIX}-card__actions` +
+            (inverseDirection ? ` ${constants_1.CLASSPREFIX}-card__actions--inversedirection` : '') +
+            (className ? ' ' + className : '') }), children));
+}
+;
+exports.default = CardActions;
+//# sourceMappingURL=CardActions.js.map

package/dist/cjs/components/Card/CardActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardActions.js","sourceRoot":"","sources":["../../../../src/components/Card/CardActions.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,6DAAsE;AAUtE;;;GAGG;AACH,SAAS,WAAW,CAAE,EAKF;QALE,EAClB,QAAQ,EACR,SAAS,GAAC,EAAE,EACZ,gBAAgB,GAAC,KAAK,OAEN,EADb,UAAU,cAJK,6CAKrB,CADgB;IAEb,OAAO,CACH,0DACQ,UAAU,IACd,SAAS,EACL,GAAG,uBAAM,gBAAgB;YACzB,CAAC,gBAAgB,CAAC,CAAC,CAAC,IAAI,uBAAM,kCAAkC,CAAC,CAAC,CAAC,EAAE,CAAC;YACtE,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,GAAG,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,KAGrC,QAAQ,CACJ,CACZ,CAAC;AACN,CAAC;AAAA,CAAC;AAEF,kBAAe,WAAW,CAAC"}