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

package/dist/components/Structure/TitleMainsection.js

@@ -0,0 +1,35 @@
+"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 _constants = require("../../configuration/constants");
+
+function TitleMainsection({
+  children,
+  className = '',
+  ...restProps
+}) {
+  let htmlElement = /*#__PURE__*/_react.default.createElement('div');
+
+  const childrenArray = _react.default.Children.toArray(children);
+
+  if (childrenArray.length === 1 && typeof childrenArray[0] === 'string') {
+    htmlElement = /*#__PURE__*/_react.default.createElement('h2');
+  }
+
+  return /*#__PURE__*/_react.default.createElement(htmlElement.type, (0, _extends2.default)({}, restProps, {
+    className: `${_constants.CLASSPREFIX}-structure__title-mainsection ` + className
+  }), children);
+}
+
+var _default = TitleMainsection;
+exports.default = _default;

package/dist/components/Structure/TitleMainsection.jsx

@@ -0,0 +1,26 @@
+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 { CLASSPREFIX as eccgui } from "../../configuration/constants";
+function TitleMainsection(_a) {
+    var children = _a.children, _b = _a.className, className = _b === void 0 ? '' : _b, restProps = __rest(_a, ["children", "className"]);
+    var htmlElement = React.createElement('div');
+    var childrenArray = React.Children.toArray(children);
+    if (childrenArray.length === 1 &&
+        typeof childrenArray[0] === 'string') {
+        htmlElement = React.createElement('h2');
+    }
+    return (<htmlElement.type {...restProps} className={eccgui + "-structure__title-mainsection " + className}>
+            {children}
+        </htmlElement.type>);
+}
+export default TitleMainsection;

package/dist/components/Structure/TitlePage.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare function TitlePage({ children, className, ...restProps }: any): JSX.Element;
+export default TitlePage;

package/dist/components/Structure/TitlePage.js

@@ -0,0 +1,35 @@
+"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 _constants = require("../../configuration/constants");
+
+function TitlePage({
+  children,
+  className = '',
+  ...restProps
+}) {
+  let htmlElement = /*#__PURE__*/_react.default.createElement('div');
+
+  const childrenArray = _react.default.Children.toArray(children);
+
+  if (childrenArray.length === 1 && typeof childrenArray[0] === 'string') {
+    htmlElement = /*#__PURE__*/_react.default.createElement('h1');
+  }
+
+  return /*#__PURE__*/_react.default.createElement(htmlElement.type, (0, _extends2.default)({}, restProps, {
+    className: `${_constants.CLASSPREFIX}-structure__title-page ` + className
+  }), children);
+}
+
+var _default = TitlePage;
+exports.default = _default;

package/dist/components/Structure/TitlePage.jsx

@@ -0,0 +1,26 @@
+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 { CLASSPREFIX as eccgui } from "../../configuration/constants";
+function TitlePage(_a) {
+    var children = _a.children, _b = _a.className, className = _b === void 0 ? '' : _b, restProps = __rest(_a, ["children", "className"]);
+    var htmlElement = React.createElement('div');
+    var childrenArray = React.Children.toArray(children);
+    if (childrenArray.length === 1 &&
+        typeof childrenArray[0] === 'string') {
+        htmlElement = React.createElement('h1');
+    }
+    return (<htmlElement.type {...restProps} className={eccgui + "-structure__title-page " + className}>
+            {children}
+        </htmlElement.type>);
+}
+export default TitlePage;

package/dist/components/Structure/TitleSubsection.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare function TitleSubsection({ children, className, useHtmlElement, ...restProps }: any): JSX.Element;
+export default TitleSubsection;

package/dist/components/Structure/TitleSubsection.js

@@ -0,0 +1,32 @@
+"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 _constants = require("../../configuration/constants");
+
+function TitleSubsection({
+  children,
+  className = "",
+  useHtmlElement,
+  ...restProps
+}) {
+  const childrenArray = _react.default.Children.toArray(children);
+
+  const defaultHtmlElement = childrenArray.length === 1 && typeof childrenArray[0] === "string" ? "h3" : "div";
+  const titleElement = useHtmlElement ? /*#__PURE__*/_react.default.createElement(useHtmlElement) : /*#__PURE__*/_react.default.createElement(defaultHtmlElement);
+  return /*#__PURE__*/_react.default.createElement(titleElement.type, (0, _extends2.default)({}, restProps, {
+    className: `${_constants.CLASSPREFIX}-structure__title-subsection ` + className
+  }), children);
+}
+
+var _default = TitleSubsection;
+exports.default = _default;

package/dist/components/Structure/TitleSubsection.jsx

@@ -0,0 +1,23 @@
+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 { CLASSPREFIX as eccgui } from "../../configuration/constants";
+function TitleSubsection(_a) {
+    var children = _a.children, _b = _a.className, className = _b === void 0 ? "" : _b, useHtmlElement = _a.useHtmlElement, restProps = __rest(_a, ["children", "className", "useHtmlElement"]);
+    var childrenArray = React.Children.toArray(children);
+    var defaultHtmlElement = childrenArray.length === 1 && typeof childrenArray[0] === "string" ? "h3" : "div";
+    var titleElement = useHtmlElement ? React.createElement(useHtmlElement) : React.createElement(defaultHtmlElement);
+    return (<titleElement.type {...restProps} className={eccgui + "-structure__title-subsection " + className}>
+            {children}
+        </titleElement.type>);
+}
+export default TitleSubsection;

package/dist/components/Switch/Switch.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+declare function Switch({ className, ...otherProps }: any): JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof Switch>;
+export default _default;

package/dist/components/Switch/Switch.js

@@ -0,0 +1,39 @@
+"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 = _interopRequireWildcard(require("react"));
+
+var _core = require("@blueprintjs/core");
+
+var _constants = require("../../configuration/constants");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function Switch({
+  className,
+  ...otherProps
+}) {
+  const handleChange = e => {
+    otherProps.onChange(e.target.checked);
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_core.Switch, (0, _extends2.default)({
+    className: `${_constants.CLASSPREFIX}-switch`
+  }, otherProps, {
+    onChange: handleChange
+  }));
+}
+
+var _default = /*#__PURE__*/(0, _react.memo)(Switch);
+
+exports.default = _default;

package/dist/components/Switch/Switch.jsx

@@ -0,0 +1,22 @@
+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, { memo } from 'react';
+import { Switch as BlueprintSwitch } from "@blueprintjs/core";
+import { CLASSPREFIX as eccgui } from "../../configuration/constants";
+function Switch(_a) {
+    var className = _a.className, otherProps = __rest(_a, ["className"]);
+    var handleChange = function (e) {
+        otherProps.onChange(e.target.checked);
+    };
+    return <BlueprintSwitch className={eccgui + "-switch"} {...otherProps} onChange={handleChange}/>;
+}
+export default memo(Switch);

package/dist/components/Tabs/Tabs.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { TabsProps as BlueprintTabsProbs, TabProps as BlueprintTabProbs } from "@blueprintjs/core";
+export interface TabProps extends BlueprintTabProbs {
+    titlePrefix?: React.ReactNode;
+    titleSuffix?: React.ReactNode;
+    dontShrink?: boolean;
+    large?: boolean;
+    small?: boolean;
+}
+export interface DeprecatedTabProps {
+    tabId: string;
+    tabTitle: React.ReactNode;
+    tabContent?: JSX.Element;
+    dontShrink?: boolean;
+}
+interface TabsProps extends Omit<BlueprintTabsProbs, "vertical" | "onChange" | "large"> {
+    activeTab: string;
+    tabs: any[];
+    onTabClick: ({ props }: any) => void;
+    prefixTabNames?: string;
+    allowScrollbars?: boolean;
+}
+declare function Tabs({ activeTab, tabs, onTabClick, prefixTabNames, className, allowScrollbars, ...restProps }: TabsProps): JSX.Element;
+export default Tabs;

package/dist/components/Tabs/Tabs.js

@@ -0,0 +1,95 @@
+"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 _Button = _interopRequireDefault(require("../Button/Button"));
+
+const createBlueprintTab = ({
+  titlePrefix,
+  title,
+  titleSuffix,
+  dontShrink = false,
+  large = false,
+  small = false,
+  ...otherBlueprintTabProperties
+}) => {
+  const extraStyles = dontShrink ? {
+    style: {
+      flexShrink: 0
+    }
+  } : {};
+  return /*#__PURE__*/_react.default.createElement(_core.Tab, (0, _extends2.default)({
+    key: otherBlueprintTabProperties.id,
+    title: /*#__PURE__*/_react.default.createElement(_Button.default //title={title}
+    , {
+      minimal: true,
+      tabIndex: -1,
+      text: title,
+      icon: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, titlePrefix),
+      rightIcon: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, titleSuffix),
+      small: small,
+      large: large
+    })
+  }, otherBlueprintTabProperties, extraStyles));
+}; // deprecated interface
+
+
+const createDeprecatedTab = ({
+  tabId,
+  tabTitle,
+  tabContent,
+  dontShrink = false
+}) => {
+  const extraStyles = dontShrink ? {
+    style: {
+      flexShrink: 0
+    }
+  } : {};
+  return /*#__PURE__*/_react.default.createElement(_core.Tab, (0, _extends2.default)({
+    key: tabId,
+    id: tabId,
+    title: tabTitle,
+    panel: tabContent
+  }, extraStyles));
+};
+
+function Tabs({
+  activeTab,
+  tabs = [],
+  onTabClick,
+  prefixTabNames = 'tabBar',
+  className = "",
+  allowScrollbars,
+  ...restProps
+}) {
+  return /*#__PURE__*/_react.default.createElement(_core.Tabs, (0, _extends2.default)({
+    onChange: onTabClick,
+    selectedTabId: activeTab,
+    className: className + (allowScrollbars ? ` ${_constants.CLASSPREFIX}-tabs--scrollablelist` : "")
+  }, restProps), tabs.map(tab => {
+    return !!tab.id ? createBlueprintTab({
+      className: `${prefixTabNames}-header-${tab.id}`,
+      ...tab
+    }) : createDeprecatedTab({
+      className: `${prefixTabNames}-header-${tab.tabId}`,
+      ...tab
+    });
+  }));
+}
+
+;
+var _default = Tabs;
+exports.default = _default;

package/dist/components/Tabs/Tabs.jsx

@@ -0,0 +1,49 @@
+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 __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 { Tabs as BlueprintTabs, Tab, } from "@blueprintjs/core";
+import { CLASSPREFIX as eccgui } from "../../configuration/constants";
+import Button from "../Button/Button";
+var createBlueprintTab = function (_a) {
+    var titlePrefix = _a.titlePrefix, title = _a.title, titleSuffix = _a.titleSuffix, _b = _a.dontShrink, dontShrink = _b === void 0 ? false : _b, _c = _a.large, large = _c === void 0 ? false : _c, _d = _a.small, small = _d === void 0 ? false : _d, otherBlueprintTabProperties = __rest(_a, ["titlePrefix", "title", "titleSuffix", "dontShrink", "large", "small"]);
+    var extraStyles = dontShrink ? { style: { flexShrink: 0 } } : {};
+    return <Tab key={otherBlueprintTabProperties.id} title={(<Button 
+        //title={title}
+        minimal tabIndex={-1} text={title} icon={<>{titlePrefix}</>} rightIcon={<>{titleSuffix}</>} small={small} large={large}/>)} {...otherBlueprintTabProperties} {...extraStyles}/>;
+};
+var createDeprecatedTab = function (_a) {
+    var tabId = _a.tabId, tabTitle = _a.tabTitle, tabContent = _a.tabContent, _b = _a.dontShrink, dontShrink = _b === void 0 ? false : _b;
+    var extraStyles = dontShrink ? { style: { flexShrink: 0 } } : {};
+    return <Tab key={tabId} id={tabId} title={tabTitle} panel={tabContent} {...extraStyles}/>;
+};
+function Tabs(_a) {
+    var activeTab = _a.activeTab, _b = _a.tabs, tabs = _b === void 0 ? [] : _b, onTabClick = _a.onTabClick, _c = _a.prefixTabNames, prefixTabNames = _c === void 0 ? 'tabBar' : _c, _d = _a.className, className = _d === void 0 ? "" : _d, allowScrollbars = _a.allowScrollbars, restProps = __rest(_a, ["activeTab", "tabs", "onTabClick", "prefixTabNames", "className", "allowScrollbars"]);
+    return (<BlueprintTabs onChange={onTabClick} selectedTabId={activeTab} className={className +
+            (allowScrollbars ? " " + eccgui + "-tabs--scrollablelist" : "")} {...restProps}>
+            {tabs.map(function (tab) {
+            return !!tab.id ? createBlueprintTab(__assign({ className: prefixTabNames + "-header-" + tab.id }, tab)) : createDeprecatedTab(__assign({ className: prefixTabNames + "-header-" + tab.tabId }, tab));
+        })}
+        </BlueprintTabs>);
+}
+;
+export default Tabs;

package/dist/components/Tag/Tag.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+import { TagProps as BlueprintTagProps } from "@blueprintjs/core";
+import Color from "color";
+interface TagProps extends Omit<BlueprintTagProps, "active" | "fill" | "large" | "multiline" | "intent" | "rightIcon" | "round"> {
+    /**
+     * Sets the background color of a tag, depends on the `Color` object provided by the
+     * [npm color module](https://www.npmjs.com/package/color) v3. You can use it with
+     * all allowed [CSS color values](https://developer.mozilla.org/de/docs/Web/CSS/color_value).
+     *
+     * The front color is set automatically, so the tag label is always readable.
+     */
+    backgroundColor?: Color | string;
+    /**
+     * visual appearance and "thickness" of the tag
+     */
+    emphasis?: "stronger" | "strong" | "normal" | "weak" | "weaker";
+    /**
+     * display tag in a small version
+     */
+    small?: boolean;
+    /**
+     * **deprecated**, use `minimal=false` plus `emphasis="stronger"`
+     */
+    emphasized?: never;
+}
+declare function Tag({ children, className, emphasis, minimal, small, backgroundColor, ...otherProps }: TagProps): JSX.Element;
+export default Tag;

package/dist/components/Tag/Tag.js

@@ -0,0 +1,50 @@
+"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 _color = _interopRequireDefault(require("color"));
+
+var _constants = require("../../configuration/constants");
+
+function Tag({
+  children,
+  className = '',
+  emphasis = "normal",
+  minimal = true,
+  small = false,
+  backgroundColor,
+  ...otherProps
+}) {
+  otherProps['interactive'] = otherProps.interactive ?? !!otherProps.onClick ? true : false;
+
+  if (!!backgroundColor) {
+    const additionalStyles = otherProps.style ?? {};
+    const color = (0, _color.default)(backgroundColor);
+    otherProps['style'] = { ...additionalStyles,
+      ...{
+        backgroundColor: color.rgb().toString(),
+        color: color.isLight() ? "#000" : "#fff"
+      }
+    };
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_core.Tag, (0, _extends2.default)({}, otherProps, {
+    className: `${_constants.CLASSPREFIX}-tag__item ${_constants.CLASSPREFIX}-tag--${emphasis}emphasis` + (small ? ` ${_constants.CLASSPREFIX}-tag--small` : '') + (className ? ' ' + className : ''),
+    minimal: minimal
+  }), children);
+}
+
+;
+var _default = Tag;
+exports.default = _default;

package/dist/components/Tag/Tag.jsx

@@ -0,0 +1,46 @@
+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 __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 { Tag as BlueprintTag } from "@blueprintjs/core";
+import Color from "color";
+import { CLASSPREFIX as eccgui } from "../../configuration/constants";
+function Tag(_a) {
+    var _b, _c;
+    var children = _a.children, _d = _a.className, className = _d === void 0 ? '' : _d, _e = _a.emphasis, emphasis = _e === void 0 ? "normal" : _e, _f = _a.minimal, minimal = _f === void 0 ? true : _f, _g = _a.small, small = _g === void 0 ? false : _g, backgroundColor = _a.backgroundColor, otherProps = __rest(_a, ["children", "className", "emphasis", "minimal", "small", "backgroundColor"]);
+    otherProps['interactive'] = ((_b = otherProps.interactive) !== null && _b !== void 0 ? _b : !!otherProps.onClick) ? true : false;
+    if (!!backgroundColor) {
+        var additionalStyles = (_c = otherProps.style) !== null && _c !== void 0 ? _c : {};
+        var color = Color(backgroundColor);
+        otherProps['style'] = __assign(__assign({}, additionalStyles), {
+            backgroundColor: color.rgb().toString(),
+            color: color.isLight() ? "#000" : "#fff",
+        });
+    }
+    return (<BlueprintTag {...otherProps} className={eccgui + "-tag__item " + eccgui + "-tag--" + emphasis + "emphasis" +
+            (small ? " " + eccgui + "-tag--small" : '') +
+            (className ? ' ' + className : '')} minimal={minimal}>
+            {children}
+        </BlueprintTag>);
+}
+;
+export default Tag;

package/dist/components/Tag/TagList.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare function TagList({ children, className, label, ...otherProps }: any): JSX.Element;
+export default TagList;

package/dist/components/Tag/TagList.js

@@ -0,0 +1,44 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _constants = require("../../configuration/constants");
+
+function TagList({
+  children,
+  className = '',
+  label = '',
+  ...otherProps
+}) {
+  const tagList = /*#__PURE__*/_react.default.createElement("ul", {
+    className: `${_constants.CLASSPREFIX}-tag__list` + (className && label ? ' ' + className : '')
+  }, _react.default.Children.map(children, (child, i) => {
+    return /*#__PURE__*/_react.default.createElement("li", {
+      className: `${_constants.CLASSPREFIX}-tag__list-item`,
+      key: 'tagitem_' + i
+    }, child);
+  }));
+
+  if (label) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: `${_constants.CLASSPREFIX}-tag__list-wrapper` + (className ? ' ' + className : '')
+    }, /*#__PURE__*/_react.default.createElement("strong", {
+      className: `${_constants.CLASSPREFIX}-tag__list-label`
+    }, label), /*#__PURE__*/_react.default.createElement("span", {
+      className: `${_constants.CLASSPREFIX}-tag__list-content`
+    }, tagList));
+  }
+
+  return tagList;
+}
+
+;
+var _default = TagList;
+exports.default = _default;

package/dist/components/Tag/TagList.jsx

@@ -0,0 +1,38 @@
+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 { CLASSPREFIX as eccgui } from "../../configuration/constants";
+function TagList(_a) {
+    var children = _a.children, _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.label, label = _c === void 0 ? '' : _c, otherProps = __rest(_a, ["children", "className", "label"]);
+    var tagList = (<ul className={eccgui + "-tag__list" +
+            ((className && label) ? ' ' + className : '')}>
+            {React.Children.map(children, function (child, i) {
+            return <li className={eccgui + "-tag__list-item"} key={'tagitem_' + i}>
+                        {child}
+                    </li>;
+        })}
+        </ul>);
+    if (label) {
+        return (<div className={eccgui + "-tag__list-wrapper" +
+                (className ? ' ' + className : '')}>
+                <strong className={eccgui + "-tag__list-label"}>
+                    {label}
+                </strong>
+                <span className={eccgui + "-tag__list-content"}>
+                    {tagList}
+                </span>
+            </div>);
+    }
+    return tagList;
+}
+;
+export default TagList;