@eccenca/gui-elements 6.3.0 → 22.0.0-rc.6

package/dist/components/AutocompleteField/AutoCompleteField.jsx

@@ -0,0 +1,295 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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 __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+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 __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import React, { useEffect, useRef, useState } from "react";
+import { Suggest } from "@blueprintjs/select";
+import { Highlighter, IconButton, Menu, MenuItem, OverflowText, Spinner } from "../../index";
+import { CLASSPREFIX as eccgui } from "../../configuration/constants";
+AutoCompleteField.defaultProps = {
+    autoFocus: false,
+    disabled: false,
+};
+/** Hook that returns the element width of the given ref.*/
+var elementWidth = function (elRef) {
+    if (elRef && elRef.current) {
+        return { width: elRef.current.offsetWidth + "px", maxWidth: "90vw" };
+    }
+    else {
+        return { width: "40rem", maxWidth: "90vw" };
+    }
+};
+/** Auto-complete input widget. */
+export function AutoCompleteField(props) {
+    var _this = this;
+    var _a;
+    var reset = props.reset, noResultText = props.noResultText, disabled = props.disabled, itemValueSelector = props.itemValueSelector, itemRenderer = props.itemRenderer, onSearch = props.onSearch, onChange = props.onChange, initialValue = props.initialValue, autoFocus = props.autoFocus, createNewItem = props.createNewItem, itemValueRenderer = props.itemValueRenderer, resetQueryToValue = props.resetQueryToValue, otherProps = __rest(props, ["reset", "noResultText", "disabled", "itemValueSelector", "itemRenderer", "onSearch", "onChange", "initialValue", "autoFocus", "createNewItem", "itemValueRenderer", "resetQueryToValue"]);
+    var _b = __read(useState(initialValue), 2), selectedItem = _b[0], setSelectedItem = _b[1];
+    // If the selection list elements are currently fetched from the backend
+    var _c = __read(useState(false), 2), listLoading = _c[0], setListLoading = _c[1];
+    var _d = __read(useState(""), 2), query = _d[0], setQuery = _d[1];
+    var _e = __read(useState(false), 2), hasFocus = _e[0], setHasFocus = _e[1];
+    var _f = __read(useState(true), 2), highlightingEnabled = _f[0], setHighlightingEnabled = _f[1];
+    // The suggestions that match the user's input
+    var _g = __read(useState([]), 2), filtered = _g[0], setFiltered = _g[1];
+    var SuggestAutocomplete = Suggest.ofType();
+    // Sets the query to the item value if it has a valid string value
+    var setQueryToSelectedValue = function (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.
+            var defaultResetValue = createNewItem && typeof itemValueSelector(item) === "string" ? itemValueSelector(item) : itemValueRenderer(item);
+            var resetVal = resetQueryToValue ? resetQueryToValue(item) : defaultResetValue;
+            setQuery(resetVal);
+        }
+    };
+    var fieldRef = useRef(null);
+    // The key for the option elements
+    var itemKey = function (item) {
+        var itemValue = itemValueSelector(item);
+        if (typeof itemValue !== "string") {
+            itemValue = itemValueRenderer(item);
+        }
+        return itemValue;
+    };
+    useEffect(function () {
+        setQueryToSelectedValue(selectedItem);
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [selectedItem]);
+    useEffect(function () {
+        if (!disabled && hasFocus) {
+            setListLoading(true);
+            var timeout_1 = window.setTimeout(function () { return __awaiter(_this, void 0, void 0, function () {
+                return __generator(this, function (_a) {
+                    fetchQueryResults(query);
+                    return [2 /*return*/];
+                });
+            }); }, 200);
+            return function () {
+                clearTimeout(timeout_1);
+                setListLoading(false);
+            };
+        }
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [hasFocus, query]);
+    var fieldWidthLimits = elementWidth(fieldRef);
+    // We need to fire some actions when the auto-complete widget gets or loses focus
+    var handleOnFocusIn = function () {
+        setHasFocus(true);
+    };
+    var handleOnFocusOut = function () {
+        setHasFocus(false);
+    };
+    // On popover close reset query to selected item
+    var onPopoverClose = function () {
+        // 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
+    var onSelectionChange = function (value, e) {
+        setSelectedItem(value);
+        onChange === null || onChange === void 0 ? void 0 : onChange(itemValueSelector(value), e);
+        setQueryToSelectedValue(value);
+    };
+    var areEqualItems = function (itemA, itemB) { return itemValueSelector(itemA) === itemValueSelector(itemB); };
+    // Return the index of the item in the array based on the itemValueRenderer value
+    var itemIndexOf = function (arr, searchItem) {
+        var idx = -1;
+        var searchItemString = itemValueSelector(searchItem);
+        arr.forEach(function (v, i) {
+            if (itemValueSelector(v) === searchItemString) {
+                idx = i;
+            }
+        });
+        return idx;
+    };
+    // Fetches the results for the given query
+    var fetchQueryResults = function (input) { return __awaiter(_this, void 0, void 0, function () {
+        var result, onlySelectItemReturned, enableHighlighting, emptyStringResults, e_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    setListLoading(true);
+                    _a.label = 1;
+                case 1:
+                    _a.trys.push([1, 5, 6, 7]);
+                    return [4 /*yield*/, onSearch(input)];
+                case 2:
+                    result = _a.sent();
+                    onlySelectItemReturned = result.length <= 1 && selectedItem && input.length > 0 &&
+                        (itemValueRenderer(selectedItem) === input || itemValueSelector(selectedItem) === input);
+                    enableHighlighting = true;
+                    if (!onlySelectItemReturned) return [3 /*break*/, 4];
+                    return [4 /*yield*/, onSearch("")];
+                case 3:
+                    emptyStringResults = _a.sent();
+                    // 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 = __spreadArray([selectedItem], __read(emptyStringResults), false);
+                    }
+                    else {
+                        result = emptyStringResults;
+                    }
+                    _a.label = 4;
+                case 4:
+                    setHighlightingEnabled(enableHighlighting);
+                    setFiltered(result);
+                    return [3 /*break*/, 7];
+                case 5:
+                    e_1 = _a.sent();
+                    console.log(e_1);
+                    return [3 /*break*/, 7];
+                case 6:
+                    setListLoading(false);
+                    return [7 /*endfinally*/];
+                case 7: return [2 /*return*/];
+            }
+        });
+    }); };
+    // Renders the item in the selection list
+    var optionRenderer = function (item, _a) {
+        var handleClick = _a.handleClick, modifiers = _a.modifiers, query = _a.query;
+        if (!modifiers.matchesPredicate) {
+            return null;
+        }
+        var relevantModifiers = {
+            active: modifiers.active,
+            disabled: modifiers.disabled,
+            styleWidth: fieldWidthLimits,
+            highlightingEnabled: highlightingEnabled,
+        };
+        var renderedItem = itemRenderer(item, query, relevantModifiers, handleClick);
+        if (typeof renderedItem === "string") {
+            return (<MenuItem active={modifiers.active} disabled={modifiers.disabled} key={itemKey(item)} onClick={handleClick} text={<OverflowText style={fieldWidthLimits}>
+                            {!highlightingEnabled ? renderedItem : <Highlighter label={renderedItem} searchValue={query}/>}
+                        </OverflowText>}/>);
+        }
+        else {
+            return renderedItem;
+        }
+    };
+    // Resets the selection
+    var clearSelection = function (resetValue) { return function () {
+        setSelectedItem(undefined);
+        onChange === null || onChange === void 0 ? void 0 : onChange(resetValue);
+        setQuery("");
+    }; };
+    // Optional clear button to reset the selected value
+    var clearButton = reset &&
+        selectedItem != null &&
+        reset.resettableValue(selectedItem) ? (<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
+    var updatedInputProps = __assign({ rightElement: clearButton, autoFocus: autoFocus, onBlur: handleOnFocusOut, onFocus: handleOnFocusIn }, otherProps.inputProps);
+    var updatedPopOverProps = __assign({ minimal: true, position: "bottom", popoverClassName: eccgui + "-autocompletefield__options", wrapperTagName: "div", 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
+    var createNewItemPosition = (createNewItem === null || createNewItem === void 0 ? void 0 : createNewItem.showNewItemOptionFirst) ? "first" : "last";
+    var createNewItemProps = createNewItem ? {
+        createNewItemFromQuery: createNewItem.itemFromQuery,
+        createNewItemRenderer: function (query, active, handleClick) {
+            if (selectedItem && query === itemValueSelector(selectedItem)) {
+                // Never show create new item option if the same item is already selected
+                return undefined;
+            }
+            else {
+                return createNewItem.itemRenderer(query, { active: active, styleWidth: fieldWidthLimits, highlightingEnabled: false }, handleClick);
+            }
+        },
+        createNewItemPosition: createNewItemPosition
+    } : {};
+    return (<div ref={fieldRef}>
+            <SuggestAutocomplete className={eccgui + "-autocompletefield__input"} disabled={disabled} items={filtered} inputValueRenderer={selectedItem !== undefined ? itemValueRenderer : function () { return ""; }} itemRenderer={optionRenderer} itemsEqual={areEqualItems} noResults={<MenuItem disabled={true} text={noResultText} style={fieldWidthLimits}/>} onItemSelect={onSelectionChange} onQueryChange={function (q) { return setQuery(q); }} closeOnSelect={true} query={query} 
+    // FIXME: This leads to odd compile errors without "as any"
+    popoverProps={updatedPopOverProps} selectedItem={selectedItem} fill {...createNewItemProps} 
+    // FIXME: This leads to odd compile errors without "as any"
+    inputProps={updatedInputProps} itemListRenderer={listLoading ? function () { return <Menu><MenuItem disabled={true} text={<Spinner position={"inline"}/>} style={fieldWidthLimits}/></Menu>; } : undefined}/>
+        </div>);
+}

package/dist/components/AutocompleteField/autoCompleteFieldUtils.js

@@ -0,0 +1,42 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createNewItemRendererFactory = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _OverflowText = _interopRequireDefault(require("../Typography/OverflowText"));
+
+var _MenuItem = _interopRequireDefault(require("../Menu/MenuItem"));
+
+/** Returns a function to be used in an AutoComplete widget for rendering custom elements based on the query string.
+ *
+ * @param itemTextRenderer The text or element that should be displayed for the new custom item suggestion.
+ * @param iconName Optional icon to show left to the text.
+ */
+const createNewItemRendererFactory = (itemTextRenderer, iconName) => {
+  // Return custom render function
+  return (query, modifiers, handleClick) => {
+    let textElement = itemTextRenderer(query, modifiers.styleWidth);
+
+    if (typeof textElement === "string") {
+      textElement = /*#__PURE__*/_react.default.createElement(_OverflowText.default, {
+        style: modifiers.styleWidth
+      }, `Create option '${query}'`);
+    }
+
+    return /*#__PURE__*/_react.default.createElement(_MenuItem.default, {
+      icon: iconName,
+      active: modifiers.active,
+      key: query,
+      onClick: handleClick,
+      text: textElement
+    });
+  };
+};
+
+exports.createNewItemRendererFactory = createNewItemRendererFactory;

package/dist/components/Breadcrumb/BreadcrumbItem.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { IBreadcrumbProps as IBlueprintBreadcrumbItemProps } from "@blueprintjs/core";
+export declare type IBreadcrumbItemProps = Omit<IBlueprintBreadcrumbItemProps, "icon" | "iconTitle" | "intent" | "target">;
+declare function BreadcrumbItem({ className, onClick, href, ...otherBlueprintBreadcrumbProps }: IBreadcrumbItemProps): JSX.Element;
+export default BreadcrumbItem;

package/dist/components/Breadcrumb/BreadcrumbItem.js

@@ -0,0 +1,45 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _core = require("@blueprintjs/core");
+
+var _constants = require("../../configuration/constants");
+
+var _openInNewTab = require("../../common/utils/openInNewTab");
+
+// import PropTypes from 'prop-types';
+function BreadcrumbItem({
+  className = "",
+  onClick,
+  href,
+  //itemDivider='',
+  ...otherBlueprintBreadcrumbProps
+}) {
+  /*
+      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 /*#__PURE__*/_react.default.createElement(_core.Breadcrumb, (0, _extends2.default)({}, otherBlueprintBreadcrumbProps, {
+    href: href,
+    onClick: e => (0, _openInNewTab.openInNewTab)(e, onClick, href),
+    className: `${_constants.CLASSPREFIX}-breadcrumb__item ` + className
+    /* data-divider={itemDivider ? itemDivider : ''} */
+
+  }));
+}
+
+var _default = BreadcrumbItem;
+exports.default = _default;

package/dist/components/Breadcrumb/BreadcrumbItem.jsx

@@ -0,0 +1,30 @@
+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;
+};
+import React from "react";
+// import PropTypes from 'prop-types';
+import { Breadcrumb as BlueprintBreadcrumbItem, } from "@blueprintjs/core";
+import { CLASSPREFIX as eccgui } from "../../configuration/constants";
+import { openInNewTab } from "../../common/utils/openInNewTab";
+function BreadcrumbItem(_a) {
+    var _b = _a.className, className = _b === void 0 ? "" : _b, onClick = _a.onClick, href = _a.href, 
+    //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 (<BlueprintBreadcrumbItem {...otherBlueprintBreadcrumbProps} href={href} onClick={function (e) { return openInNewTab(e, onClick, href); }} className={eccgui + "-breadcrumb__item " + className}/>);
+}
+export default BreadcrumbItem;

package/dist/components/Breadcrumb/BreadcrumbList.d.ts

@@ -0,0 +1,24 @@
+import React from "react";
+import { IBreadcrumbsProps as IBlueprintBreadcrumbsProps } from "@blueprintjs/core";
+import { IBreadcrumbItemProps } from "./BreadcrumbItem";
+declare type ReducedBreadcrumbsProps = Omit<IBlueprintBreadcrumbsProps, "breadcrumbRenderer" | "collapseFrom" | "currentBreadcrumbRenderer" | "minVisibleItems" | "overflowListProps" | "popoverProps">;
+interface IBreadcrumbListProps extends ReducedBreadcrumbsProps {
+    /**
+        list of breadcrumb items to display
+    */
+    items: IBreadcrumbItemProps[];
+    /**
+        click handler used on breadcrumb items
+    */
+    onItemClick?(itemUrl: string, event: object): any;
+    /**
+        native attributes for the unordered HTML list (ul)
+    */
+    htmlUlProps?: React.HTMLAttributes<HTMLUListElement>;
+    /**
+        char that devides breadcrumb items, default: "/" (currently unsupported)
+    */
+    itemDivider?: never;
+}
+declare function BreadcrumbList({ className, onItemClick, htmlUlProps, ...otherBlueprintBreadcrumbsProps }: IBreadcrumbListProps): JSX.Element;
+export default BreadcrumbList;

package/dist/components/Breadcrumb/BreadcrumbList.js

@@ -0,0 +1,60 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _core = require("@blueprintjs/core");
+
+var _constants = require("../../configuration/constants");
+
+var _BreadcrumbItem = _interopRequireDefault(require("./BreadcrumbItem"));
+
+function BreadcrumbList({
+  className = "",
+  // itemDivider = "/",
+  onItemClick,
+  htmlUlProps,
+  ...otherBlueprintBreadcrumbsProps
+}) {
+  const renderBreadcrumb = propsBreadcrumb => {
+    const {
+      onClick,
+      ...otherProps
+    } = propsBreadcrumb;
+    return /*#__PURE__*/_react.default.createElement(_BreadcrumbItem.default
+    /*itemDivider="/"*/
+    , (0, _extends2.default)({}, otherProps, {
+      onClick: onItemClick ? e => {
+        onItemClick(propsBreadcrumb.href, e);
+      } : onClick
+    }));
+  };
+
+  const renderCurrentBreadcrumb = propsBreadcrumb => {
+    return /*#__PURE__*/_react.default.createElement(_BreadcrumbItem.default, (0, _extends2.default)({}, propsBreadcrumb, {
+      current: true,
+      href: null,
+      onClick: null
+      /*itemDivider={itemDivider}*/
+
+    }));
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_core.Breadcrumbs, (0, _extends2.default)({}, otherBlueprintBreadcrumbsProps, htmlUlProps, {
+    className: `${_constants.CLASSPREFIX}-breadcrumb__list ` + className,
+    minVisibleItems: 1,
+    breadcrumbRenderer: renderBreadcrumb,
+    currentBreadcrumbRenderer: renderCurrentBreadcrumb
+  }));
+}
+
+var _default = BreadcrumbList;
+exports.default = _default;

package/dist/components/Breadcrumb/BreadcrumbList.jsx

@@ -0,0 +1,35 @@
+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;
+};
+import React from "react";
+import { Breadcrumbs as BlueprintBreadcrumbList, } from "@blueprintjs/core";
+import { CLASSPREFIX as eccgui } from "../../configuration/constants";
+import BreadcrumbItem from "./BreadcrumbItem";
+function BreadcrumbList(_a) {
+    var _b = _a.className, className = _b === void 0 ? "" : _b, 
+    // itemDivider = "/",
+    onItemClick = _a.onItemClick, htmlUlProps = _a.htmlUlProps, otherBlueprintBreadcrumbsProps = __rest(_a, ["className", "onItemClick", "htmlUlProps"]);
+    var renderBreadcrumb = function (propsBreadcrumb) {
+        var onClick = propsBreadcrumb.onClick, otherProps = __rest(propsBreadcrumb, ["onClick"]);
+        return (<BreadcrumbItem 
+        /*itemDivider="/"*/
+        {...otherProps} onClick={onItemClick
+                ? function (e) {
+                    onItemClick(propsBreadcrumb.href, e);
+                }
+                : onClick}/>);
+    };
+    var renderCurrentBreadcrumb = function (propsBreadcrumb) {
+        return <BreadcrumbItem {...propsBreadcrumb} current={true} href={null} onClick={null} /*itemDivider={itemDivider}*//>;
+    };
+    return (<BlueprintBreadcrumbList {...otherBlueprintBreadcrumbsProps} {...htmlUlProps} className={eccgui + "-breadcrumb__list " + className} minVisibleItems={1} breadcrumbRenderer={renderBreadcrumb} currentBreadcrumbRenderer={renderCurrentBreadcrumb}/>);
+}
+export default BreadcrumbList;

package/dist/components/Button/Button.d.ts

@@ -0,0 +1,58 @@
+import React from "react";
+import { ButtonProps as BlueprintButtonProps, AnchorButtonProps as BlueprintAnchorButtonProps } from "@blueprintjs/core";
+import { TooltipProps } from "./../Tooltip/Tooltip";
+export declare type AnchorOrButtonProps = Omit<BlueprintButtonProps, "elementRef" | "icon" | "rightIcon"> | Omit<BlueprintAnchorButtonProps, "elementRef" | "icon" | "rightIcon">;
+export interface ButtonProps extends React.HTMLAttributes<HTMLElement> {
+    /**
+    * Always use this when the button triggers an affirmative action, e.g. confirm a process.
+    * The button is displayed with primary color scheme.
+    */
+    affirmative?: boolean;
+    /**
+    * Always use this when the button triggers an disruptive action, e.g. delete or remove.
+    * The button is displayed with primary color scheme.
+    */
+    disruptive?: boolean;
+    /**
+    * Use this when a button is important enough to highlight it in a set of other buttons.
+    * The button is displayed with primary color scheme.
+    */
+    elevated?: boolean;
+    /**
+    * The button is displayed with primary color scheme.
+    */
+    hasStatePrimary?: boolean;
+    /**
+    * The button is displayed with success (some type of green) color scheme.
+    */
+    hasStateSuccess?: boolean;
+    /**
+    * The button is displayed with warning (some type of orange) color scheme.
+    */
+    hasStateWarning?: boolean;
+    /**
+    * The button is displayed with danger (some type of red) color scheme.
+    */
+    hasStateDanger?: boolean;
+    /**
+    * takes in either a string of text or a react element to display as a tooltip when the button is hovered.
+    */
+    tooltip?: string | JSX.Element | null;
+    /**
+    * Object with additional properties for the tooltip.
+    */
+    tooltipProperties?: Partial<Omit<TooltipProps, "content" | "children">>;
+    /**
+    * If an URL is set then the button is included as HTML anchor element instead of a button form element.
+    */
+    href?: string;
+    icon?: string | JSX.Element;
+    rightIcon?: string | JSX.Element;
+    target?: string;
+}
+/**
+ * Display a button element to enable user interaction.
+ * It normally should trigger action when clicked.
+ */
+declare function Button({ children, className, affirmative, disruptive, elevated, hasStatePrimary, hasStateSuccess, hasStateWarning, hasStateDanger, icon, rightIcon, tooltip, tooltipProperties, ...restProps }: ButtonProps & AnchorOrButtonProps): JSX.Element;
+export default Button;