@xivart/tangram 0.0.1-security → 2.712.1

package/components/Card/Card.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var useLazyLoadingImage_1 = tslib_1.__importDefault(require("../../hooks/useLazyLoadingImage"));
+var S = tslib_1.__importStar(require("./styled"));
+var CardImage_1 = tslib_1.__importDefault(require("./CardImage"));
+var Corner_1 = tslib_1.__importDefault(require("../Corner"));
+var Card = function (_a) {
+    var _b = _a.rounded, rounded = _b === void 0 ? true : _b, _c = _a.roundedBottom, roundedBottom = _c === void 0 ? false : _c, _d = _a.roundedTop, roundedTop = _d === void 0 ? false : _d, _e = _a.showScrim, showScrim = _e === void 0 ? false : _e, _f = _a.hideShadow, hideShadow = _f === void 0 ? false : _f, backgroundImage = _a.backgroundImage, lazyLoad = _a.lazyLoad, children = _a.children, hideOnImageError = _a.hideOnImageError, dataAttrs = _a.dataAttrs, deEmphasize = _a.deEmphasize, fullHeight = _a.fullHeight, fallbackImage = _a.fallbackImage, cursor = _a.cursor, _g = _a.selected, selected = _g === void 0 ? false : _g, _h = _a.valid, valid = _h === void 0 ? false : _h;
+    var _j = tslib_1.__read(react_1.useState(hideOnImageError), 2), isHidden = _j[0], setIsHidden = _j[1];
+    var handleImageLoaded = function () { return setIsHidden(false); };
+    var handleImageErrored = function () { return setIsHidden(true); };
+    var cardRef = react_1.useRef(null);
+    var lazyLoadingBackgroundImage = useLazyLoadingImage_1.default(cardRef, backgroundImage, lazyLoad);
+    if (!backgroundImage && hideOnImageError) {
+        return null;
+    }
+    return (jsx_runtime_1.jsxs(S.Card, tslib_1.__assign({ ref: cardRef, backgroundImage: lazyLoadingBackgroundImage, cursor: cursor, deEmphasize: deEmphasize, display: isHidden ? 'none' : 'block', fallbackImage: fallbackImage, fullHeight: fullHeight, hideShadow: hideShadow, rounded: rounded, roundedBottom: roundedBottom, roundedTop: roundedTop, selected: selected, showScrim: showScrim }, dataAttrs, { children: [showScrim && jsx_runtime_1.jsx(S.CardScrim, tslib_1.__assign({}, dataAttrs), void 0),
+            jsx_runtime_1.jsx(S.CardContentWrapper, tslib_1.__assign({ fullHeight: fullHeight }, dataAttrs, { children: children }), void 0),
+            (selected || valid) && jsx_runtime_1.jsx(Corner_1.default, { rounded: rounded, valid: valid }, void 0),
+            backgroundImage && hideOnImageError && (jsx_runtime_1.jsx(CardImage_1.default, { dataAttrs: dataAttrs, display: "none", onError: handleImageErrored, onLoad: handleImageLoaded, src: backgroundImage }, void 0))] }), void 0));
+};
+exports.default = Card;
+//# sourceMappingURL=Card.js.map

package/components/Card/CardContent.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var Layout_1 = tslib_1.__importDefault(require("../Layout"));
+var CardContent = function (_a) {
+    var background = _a.background, children = _a.children, dataAttrs = _a.dataAttrs, fullHeight = _a.fullHeight;
+    return (jsx_runtime_1.jsx(Layout_1.default, tslib_1.__assign({ background: background, blockSize: fullHeight ? '100%' : undefined, dataAttrs: dataAttrs, padding: "s500" }, { children: children }), void 0));
+};
+exports.default = CardContent;
+//# sourceMappingURL=CardContent.js.map

package/components/Card/CardImage.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var S = tslib_1.__importStar(require("./styled"));
+var CardImage = function (_a) {
+    var dataAttrs = _a.dataAttrs, display = _a.display, onError = _a.onError, onLoad = _a.onLoad, src = _a.src;
+    return (jsx_runtime_1.jsx(S.CardImage, tslib_1.__assign({ display: display, onError: onError, onLoad: onLoad, src: src }, dataAttrs), void 0));
+};
+exports.default = CardImage;
+//# sourceMappingURL=CardImage.js.map

package/components/Card/index.js

@@ -0,0 +1,11 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardContent = exports.default = void 0;
+var Card_1 = require("./Card");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Card_1).default; } });
+var CardContent_1 = require("./CardContent");
+Object.defineProperty(exports, "CardContent", { enumerable: true, get: function () { return __importDefault(CardContent_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/Card/styled/Card.js

@@ -0,0 +1,64 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importStar(require("../../../utils/themedStyledComponents"));
+var omitAttrs_1 = tslib_1.__importDefault(require("../../../utils/omitAttrs"));
+var CardContentWrapper_1 = tslib_1.__importDefault(require("./CardContentWrapper"));
+var getRounded = function () { return themedStyledComponents_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n\n  ", "\n\n  ", "\n"], ["\n  ",
+    "\n\n  ",
+    "\n\n  ",
+    "\n"])), function (_a) {
+    var theme = _a.theme, rounded = _a.rounded, roundedBottom = _a.roundedBottom, roundedTop = _a.roundedTop;
+    return rounded &&
+        !roundedBottom &&
+        !roundedTop &&
+        "\n      border-radius: " + theme.borders.radius.br200 + ";\n    ";
+}, function (_a) {
+    var theme = _a.theme, roundedBottom = _a.roundedBottom;
+    return roundedBottom &&
+        "\n      border-bottom-left-radius: " + theme.borders.radius.br200 + ";\n      border-bottom-right-radius: " + theme.borders.radius.br200 + ";\n    ";
+}, function (_a) {
+    var theme = _a.theme, roundedTop = _a.roundedTop;
+    return roundedTop &&
+        "\n      border-top-left-radius: " + theme.borders.radius.br200 + ";\n      border-top-right-radius: " + theme.borders.radius.br200 + ";\n    ";
+}); };
+var Card = themedStyledComponents_1.default.div.withConfig(omitAttrs_1.default('display', 'selected'))(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  background-color: ", ";\n  box-shadow: ", ";\n  cursor: ", ";\n  display: ", ";\n  height: ", ";\n  position: relative;\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n"], ["\n  background-color: ",
+    ";\n  box-shadow: ",
+    ";\n  cursor: ", ";\n  display: ", ";\n  height: ", ";\n  position: relative;\n\n  ",
+    "\n\n  ", "\n\n  ",
+    "\n\n  ",
+    "\n\n  ",
+    "\n"])), function (_a) {
+    var theme = _a.theme, deEmphasize = _a.deEmphasize;
+    return deEmphasize ? theme.colors.TERTIARY : theme.colors.CONTENT_BACKGROUND;
+}, function (_a) {
+    var hideShadow = _a.hideShadow;
+    return !hideShadow && '0 2px 3px 0 rgba(0, 0, 0, 0.15)';
+}, function (_a) {
+    var cursor = _a.cursor;
+    return cursor;
+}, function (_a) {
+    var display = _a.display;
+    return display;
+}, function (_a) {
+    var fullHeight = _a.fullHeight;
+    return fullHeight && '100%';
+}, function (_a) {
+    var backgroundImage = _a.backgroundImage, fallbackImage = _a.fallbackImage;
+    return backgroundImage &&
+        "\n      background: url(" + backgroundImage + ") " + (fallbackImage ? ", url(" + fallbackImage + ")" : '') + ";\n      background-repeat: no-repeat;\n      background-position: center;\n      background-size: cover;\n  ";
+}, getRounded, function (_a) {
+    var theme = _a.theme, selected = _a.selected;
+    return selected && themedStyledComponents_1.css(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n      &:after {\n        bottom: 0;\n        box-shadow: inset 0px 0px 0px ", "\n          ", ";\n        content: '';\n        left: 0;\n        pointer-events: none;\n        position: absolute;\n        right: 0;\n        top: 0;\n        ", "\n      }\n    "], ["\n      &:after {\n        bottom: 0;\n        box-shadow: inset 0px 0px 0px ", "\n          ", ";\n        content: '';\n        left: 0;\n        pointer-events: none;\n        position: absolute;\n        right: 0;\n        top: 0;\n        ", "\n      }\n    "])), theme.borders.width.bw200, theme.colors.ACTIVE, getRounded);
+}, function (_a) {
+    var theme = _a.theme, rounded = _a.rounded, roundedBottom = _a.roundedBottom, roundedTop = _a.roundedTop;
+    return (roundedTop || (rounded && !roundedBottom)) &&
+        "\n    " + CardContentWrapper_1.default + " > *:first-child {\n      border-top-left-radius: " + theme.borders.radius.br200 + ";\n      border-top-right-radius: " + theme.borders.radius.br200 + ";\n    }\n  ";
+}, function (_a) {
+    var theme = _a.theme, rounded = _a.rounded, roundedBottom = _a.roundedBottom, roundedTop = _a.roundedTop;
+    return (roundedBottom || (rounded && !roundedTop)) &&
+        "\n    " + CardContentWrapper_1.default + " > *:last-child {\n      border-bottom-left-radius: " + theme.borders.radius.br200 + ";\n      border-bottom-right-radius: " + theme.borders.radius.br200 + ";\n    }\n  ";
+});
+exports.default = Card;
+var templateObject_1, templateObject_2, templateObject_3;
+//# sourceMappingURL=Card.js.map

package/components/Card/styled/CardContentWrapper.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importDefault(require("../../../utils/themedStyledComponents"));
+var CardContentWrapper = themedStyledComponents_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  position: relative;\n  ", "\n"], ["\n  position: relative;\n  ", "\n"])), function (_a) {
+    var fullHeight = _a.fullHeight;
+    return fullHeight && "height: 100%";
+});
+exports.default = CardContentWrapper;
+var templateObject_1;
+//# sourceMappingURL=CardContentWrapper.js.map

package/components/Card/styled/CardImage.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importDefault(require("../../../utils/themedStyledComponents"));
+var omitAttrs_1 = tslib_1.__importDefault(require("../../../utils/omitAttrs"));
+var Image = themedStyledComponents_1.default.img.withConfig(omitAttrs_1.default('display'))(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (_a) {
+    var display = _a.display;
+    return display && "display: " + display + ";";
+});
+exports.default = Image;
+var templateObject_1;
+//# sourceMappingURL=CardImage.js.map

package/components/Card/styled/CardScrim.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importDefault(require("../../../utils/themedStyledComponents"));
+var CardScrim = themedStyledComponents_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  background-image: linear-gradient(\n    to bottom,\n    rgba(0, 0, 0, 0),\n    rgba(0, 0, 0, 0.5)\n  );\n  border-radius: inherit;\n  bottom: 0;\n  left: 0;\n  opacity: 0.6;\n  position: absolute;\n  right: 0;\n  top: 0;\n"], ["\n  background-image: linear-gradient(\n    to bottom,\n    rgba(0, 0, 0, 0),\n    rgba(0, 0, 0, 0.5)\n  );\n  border-radius: inherit;\n  bottom: 0;\n  left: 0;\n  opacity: 0.6;\n  position: absolute;\n  right: 0;\n  top: 0;\n"])));
+exports.default = CardScrim;
+var templateObject_1;
+//# sourceMappingURL=CardScrim.js.map

package/components/Card/styled/index.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardImage = exports.CardContentWrapper = exports.CardScrim = exports.Card = void 0;
+var Card_1 = require("./Card");
+Object.defineProperty(exports, "Card", { enumerable: true, get: function () { return __importDefault(Card_1).default; } });
+var CardScrim_1 = require("./CardScrim");
+Object.defineProperty(exports, "CardScrim", { enumerable: true, get: function () { return __importDefault(CardScrim_1).default; } });
+var CardContentWrapper_1 = require("./CardContentWrapper");
+Object.defineProperty(exports, "CardContentWrapper", { enumerable: true, get: function () { return __importDefault(CardContentWrapper_1).default; } });
+var CardImage_1 = require("./CardImage");
+Object.defineProperty(exports, "CardImage", { enumerable: true, get: function () { return __importDefault(CardImage_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/Checkbox/Checkbox.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var Icon_1 = tslib_1.__importDefault(require("../Icon"));
+var S = tslib_1.__importStar(require("./styled"));
+var Checkbox = (function (_super) {
+    tslib_1.__extends(Checkbox, _super);
+    function Checkbox(props) {
+        var _this = _super.call(this, props) || this;
+        _this.handleChange = function (e) {
+            var onChange = _this.props.onChange;
+            if (!('checked' in _this.props)) {
+                _this.setState({
+                    checked: e.target.checked,
+                });
+            }
+            onChange(e);
+        };
+        _this.state = {
+            checked: 'checked' in props ? props.checked : props.defaultChecked,
+        };
+        return _this;
+    }
+    Checkbox.prototype.UNSAFE_componentWillReceiveProps = function (nextProps) {
+        if ('checked' in nextProps) {
+            this.setState({
+                checked: nextProps.checked,
+            });
+        }
+    };
+    Checkbox.prototype.render = function () {
+        var _a = this
+            .props, inline = _a.inline, children = _a.children, disabled = _a.disabled, id = _a.id, name = _a.name, value = _a.value, dataAttrs = _a.dataAttrs;
+        var checked = this.state.checked;
+        var checkboxId = id || name + "_" + value;
+        return (jsx_runtime_1.jsxs(S.Wrapper, { children: [jsx_runtime_1.jsx(S.Checkbox, tslib_1.__assign({ checked: checked, disabled: disabled, id: checkboxId, name: name, onChange: this.handleChange, value: value }, dataAttrs), void 0),
+                jsx_runtime_1.jsxs(S.CheckboxLabel, tslib_1.__assign({ disabled: disabled, htmlFor: checkboxId, inline: inline }, { children: [checked && (jsx_runtime_1.jsx(S.CheckIcon, tslib_1.__assign({ disabled: disabled, inline: inline }, { children: jsx_runtime_1.jsx(Icon_1.default, { color: "CONTENT_BACKGROUND", height: 12, name: "check", width: 12 }, void 0) }), void 0)), children] }), void 0)] }, void 0));
+    };
+    Checkbox.defaultProps = {
+        dataAttrs: {},
+        defaultChecked: false,
+        disabled: false,
+        inline: false,
+        onChange: function () { },
+    };
+    return Checkbox;
+}(react_1.PureComponent));
+exports.default = Checkbox;
+//# sourceMappingURL=Checkbox.js.map

package/components/Checkbox/index.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var Checkbox_1 = require("./Checkbox");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Checkbox_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/Checkbox/styled/CheckIcon.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importDefault(require("../../../utils/themedStyledComponents"));
+var omitAttrs_1 = tslib_1.__importDefault(require("../../../utils/omitAttrs"));
+var CheckIcon = themedStyledComponents_1.default.div.withConfig(omitAttrs_1.default('disabled'))(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  cursor: pointer;\n  display: ", ";\n  left: 3px;\n  position: absolute;\n\n  ", ";\n"], ["\n  cursor: pointer;\n  display: ", ";\n  left: 3px;\n  position: absolute;\n\n  ",
+    ";\n"])), function (_a) {
+    var inline = _a.inline;
+    return !inline && "inline-flex";
+}, function (_a) {
+    var disabled = _a.disabled;
+    return disabled &&
+        "\n    cursor: default;\n  ";
+});
+exports.default = CheckIcon;
+var templateObject_1;
+//# sourceMappingURL=CheckIcon.js.map

package/components/Checkbox/styled/Checkbox.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importStar(require("../../../utils/themedStyledComponents"));
+var CheckboxLabel_1 = tslib_1.__importDefault(require("./CheckboxLabel"));
+var getDisabledStyle = function (_a) {
+    var disabled = _a.disabled, theme = _a.theme;
+    return disabled && themedStyledComponents_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n    &:checked + ", "::before {\n      background-color: ", ";\n      border-color: ", ";\n    }\n  "], ["\n    &:checked + ", "::before {\n      background-color: ", ";\n      border-color: ", ";\n    }\n  "])), CheckboxLabel_1.default, theme.colors.SECONDARY_LIGHT, theme.colors.SECONDARY_LIGHT);
+};
+var Checkbox = themedStyledComponents_1.default.input.attrs(function () { return ({
+    type: 'checkbox',
+}); })(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  display: none;\n\n  &:checked + ", "::before {\n    background-color: ", ";\n    border-color: ", ";\n  }\n\n  ", "\n"], ["\n  display: none;\n\n  &:checked + ", "::before {\n    background-color: ", ";\n    border-color: ", ";\n  }\n\n  ", "\n"])), CheckboxLabel_1.default, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.ACTIVE;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.ACTIVE;
+}, getDisabledStyle);
+exports.default = Checkbox;
+var templateObject_1, templateObject_2;
+//# sourceMappingURL=Checkbox.js.map

package/components/Checkbox/styled/CheckboxIcon.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CheckboxIcon = void 0;
+var tslib_1 = require("tslib");
+var styled_components_1 = require("styled-components");
+var themedStyledComponents_1 = tslib_1.__importDefault(require("../../../utils/themedStyledComponents"));
+var omitAttrs_1 = tslib_1.__importDefault(require("../../../utils/omitAttrs"));
+exports.CheckboxIcon = themedStyledComponents_1.default.span.withConfig(omitAttrs_1.default('checked', 'disabled', 'inline'))(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  background-color: ", ";\n  border: ", ";\n  border-radius: ", ";\n  content: '';\n  cursor: pointer;\n  height: 18px;\n  left: 0;\n  line-height: 16px;\n  text-align: center;\n  visibility: visible;\n  width: 18px;\n\n  ", "\n\n  ", " \n\n  ", "\n"], ["\n  background-color: ", ";\n  border: ",
+    ";\n  border-radius: ", ";\n  content: '';\n  cursor: pointer;\n  height: 18px;\n  left: 0;\n  line-height: 16px;\n  text-align: center;\n  visibility: visible;\n  width: 18px;\n\n  ",
+    "\n\n  ",
+    " \n\n  ",
+    "\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.colors.CONTENT_BACKGROUND;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.borders.width.bw200 + " " + theme.borders.style.SOLID + " " + theme.colors.SECONDARY;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.borders.radius.br200;
+}, function (_a) {
+    var inline = _a.inline, theme = _a.theme;
+    return inline
+        ? "float: left; margin-right: " + theme.spacings.s300 + ";"
+        : "position: absolute;";
+}, function (_a) {
+    var checked = _a.checked, theme = _a.theme;
+    return checked &&
+        "\n    background-color: " + theme.colors.ACTIVE + ";\n    border-color: " + theme.colors.ACTIVE + ";\n  ";
+}, function (_a) {
+    var checked = _a.checked, disabled = _a.disabled, theme = _a.theme;
+    return disabled && styled_components_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n      border-color: ", ";\n      cursor: default;\n      ", "\n    "], ["\n      border-color: ", ";\n      cursor: default;\n      ", "\n    "])), theme.colors.SECONDARY_LIGHT, checked && "background-color: " + theme.colors.SECONDARY_LIGHT + ";");
+});
+var templateObject_1, templateObject_2;
+//# sourceMappingURL=CheckboxIcon.js.map

package/components/Checkbox/styled/CheckboxLabel.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importStar(require("../../../utils/themedStyledComponents"));
+var Label_1 = tslib_1.__importDefault(require("../../Label"));
+var alignLabelStyles = themedStyledComponents_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  padding-left: ", ";\n"], ["\n  align-items: center;\n  display: flex;\n  padding-left: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacings.s900;
+});
+var CheckboxLabel = themedStyledComponents_1.default(Label_1.default)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  margin-bottom: 0;\n\n  ", "\n\n  &:before {\n    background-color: ", ";\n    border-radius: ", ";\n    border: ", ";\n    content: '';\n    cursor: ", ";\n    height: 18px;\n    left: 0;\n    visibility: visible;\n    width: 18px;\n\n    ", "\n  }\n"], ["\n  margin-bottom: 0;\n\n  ", "\n\n  &:before {\n    background-color: ", ";\n    border-radius: ", ";\n    border: ",
+    ";\n    content: '';\n    cursor: ", ";\n    height: 18px;\n    left: 0;\n    visibility: visible;\n    width: 18px;\n\n    ",
+    "\n  }\n"])), function (_a) {
+    var inline = _a.inline;
+    return !inline && alignLabelStyles;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.CONTENT_BACKGROUND;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.borders.radius.br200;
+}, function (_a) {
+    var theme = _a.theme, disabled = _a.disabled;
+    return theme.borders.width.bw200 + " " + theme.borders.style.SOLID + " " + (disabled ? theme.colors.SECONDARY_LIGHT : theme.colors.SECONDARY);
+}, function (_a) {
+    var disabled = _a.disabled;
+    return (disabled ? 'default' : 'pointer');
+}, function (_a) {
+    var inline = _a.inline, theme = _a.theme;
+    return inline
+        ? "float: left; margin-right: " + theme.spacings.s300 + ";"
+        : "position: absolute;";
+});
+exports.default = CheckboxLabel;
+var templateObject_1, templateObject_2;
+//# sourceMappingURL=CheckboxLabel.js.map

package/components/Checkbox/styled/Wrapper.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importDefault(require("../../../utils/themedStyledComponents"));
+var Wrapper = themedStyledComponents_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  align-items: center;\n  display: inline-flex;\n  min-height: 22px;\n  position: relative;\n"], ["\n  align-items: center;\n  display: inline-flex;\n  min-height: 22px;\n  position: relative;\n"])));
+exports.default = Wrapper;
+var templateObject_1;
+//# sourceMappingURL=Wrapper.js.map

package/components/Checkbox/styled/index.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Wrapper = exports.CheckIcon = exports.CheckboxLabel = exports.Checkbox = void 0;
+var Checkbox_1 = require("./Checkbox");
+Object.defineProperty(exports, "Checkbox", { enumerable: true, get: function () { return __importDefault(Checkbox_1).default; } });
+var CheckboxLabel_1 = require("./CheckboxLabel");
+Object.defineProperty(exports, "CheckboxLabel", { enumerable: true, get: function () { return __importDefault(CheckboxLabel_1).default; } });
+var CheckIcon_1 = require("./CheckIcon");
+Object.defineProperty(exports, "CheckIcon", { enumerable: true, get: function () { return __importDefault(CheckIcon_1).default; } });
+var Wrapper_1 = require("./Wrapper");
+Object.defineProperty(exports, "Wrapper", { enumerable: true, get: function () { return __importDefault(Wrapper_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/ChevronIcon/ChevronIcon.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var Icon_1 = tslib_1.__importDefault(require("../Icon"));
+var ChevronIcon = function (_a) {
+    var isActive = _a.isActive, color = _a.color, dataAttrs = _a.dataAttrs, _b = _a.height, height = _b === void 0 ? 15 : _b, _c = _a.width, width = _c === void 0 ? 15 : _c;
+    return (jsx_runtime_1.jsx(Icon_1.default, { color: color, dataAttrs: dataAttrs, height: height, name: "chevron-vertical", rotate: isActive ? 180 : undefined, width: width }, void 0));
+};
+exports.default = ChevronIcon;
+//# sourceMappingURL=ChevronIcon.js.map

package/components/ChevronIcon/index.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var ChevronIcon_1 = require("./ChevronIcon");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(ChevronIcon_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/Chip/Chip.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Chip = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var Flex_1 = (0, tslib_1.__importDefault)(require("../Flex"));
+var Icon_1 = (0, tslib_1.__importDefault)(require("../Icon"));
+var Text_1 = (0, tslib_1.__importDefault)(require("../Text"));
+var S = (0, tslib_1.__importStar)(require("./styled"));
+var Chip = function (_a) {
+    var background = _a.background, children = _a.children, iconName = _a.iconName;
+    return ((0, jsx_runtime_1.jsx)(S.Chip, (0, tslib_1.__assign)({ background: background }, { children: (0, jsx_runtime_1.jsxs)(Flex_1.default, (0, tslib_1.__assign)({ paddingInline: "s300" }, { children: [(0, jsx_runtime_1.jsx)(Flex_1.default, (0, tslib_1.__assign)({ paddingBlock: "s200" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { color: "CONTENT_BACKGROUND", height: 12, name: iconName, width: 12 }, void 0) }), void 0), (0, jsx_runtime_1.jsx)(Flex_1.default, (0, tslib_1.__assign)({ paddingInlineStart: "s200" }, { children: (0, jsx_runtime_1.jsx)(Text_1.default, (0, tslib_1.__assign)({ color: "CONTENT_BACKGROUND", fontSize: "fs200", lineHeight: 1.67 }, { children: children }), void 0) }), void 0)] }), void 0) }), void 0));
+};
+exports.Chip = Chip;
+//# sourceMappingURL=Chip.js.map

package/components/Chip/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Chip = void 0;
+var Chip_1 = require("./Chip");
+Object.defineProperty(exports, "Chip", { enumerable: true, get: function () { return Chip_1.Chip; } });
+//# sourceMappingURL=index.js.map

package/components/Chip/styled/Chip.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Chip = void 0;
+var tslib_1 = require("tslib");
+var styled_components_1 = (0, tslib_1.__importDefault)(require("styled-components"));
+exports.Chip = styled_components_1.default.div(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  background-color: ", ";\n  color: ", ";\n  border-radius: 16px;\n  height: 20px;\n  display: inline-block;\n"], ["\n  background-color: ", ";\n  color: ", ";\n  border-radius: 16px;\n  height: 20px;\n  display: inline-block;\n"])), function (_a) {
+    var theme = _a.theme, background = _a.background;
+    return theme.colors[background];
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.CONTENT_BACKGROUND;
+});
+var templateObject_1;
+//# sourceMappingURL=Chip.js.map

package/components/Chip/styled/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Chip = void 0;
+var Chip_1 = require("./Chip");
+Object.defineProperty(exports, "Chip", { enumerable: true, get: function () { return Chip_1.Chip; } });
+//# sourceMappingURL=index.js.map

package/components/Circle/Circle.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var S = tslib_1.__importStar(require("./styled"));
+var Circle = function (props) { return jsx_runtime_1.jsx(S.Circle, tslib_1.__assign({}, props), void 0); };
+exports.default = Circle;
+//# sourceMappingURL=Circle.js.map

package/components/Circle/index.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var Circle_1 = require("./Circle");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Circle_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/Circle/styled/Circle.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importDefault(require("../../../utils/themedStyledComponents"));
+var omitAttrs_1 = tslib_1.__importDefault(require("../../../utils/omitAttrs"));
+var Circle = themedStyledComponents_1.default.div.withConfig(omitAttrs_1.default('size'))(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n\n  width: ", ";\n  height: ", ";\n\n  border-radius: 100%;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n\n  width: ", ";\n  height: ", ";\n\n  border-radius: 100%;\n"])), function (_a) {
+    var size = _a.size;
+    return size + "px";
+}, function (_a) {
+    var size = _a.size;
+    return size + "px";
+});
+exports.default = Circle;
+var templateObject_1;
+//# sourceMappingURL=Circle.js.map

package/components/Circle/styled/index.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Circle = void 0;
+var Circle_1 = require("./Circle");
+Object.defineProperty(exports, "Circle", { enumerable: true, get: function () { return __importDefault(Circle_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/Collapse/Collapse.js

@@ -0,0 +1,88 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var CollapseItem_1 = tslib_1.__importDefault(require("./CollapseItem"));
+var collapseDefaultProps = {
+    onChange: function () { },
+    isAccordion: false,
+    activeKeys: [],
+};
+var Collapse = (function (_super) {
+    tslib_1.__extends(Collapse, _super);
+    function Collapse(props) {
+        var _this = _super.call(this, props) || this;
+        _this.getActiveKeys = function (key) {
+            var isAccordion = _this.props.isAccordion;
+            var activeKeys = _this.state.activeKeys;
+            var index = activeKeys.indexOf(key);
+            if (isAccordion) {
+                return index >= 0 ? [] : [key];
+            }
+            return index >= 0
+                ? activeKeys.filter(function (item) { return item !== key; })
+                : tslib_1.__spreadArray(tslib_1.__spreadArray([], tslib_1.__read(activeKeys)), [key]);
+        };
+        _this.handleItemClick = function (e, key) {
+            var onChange = _this.props.onChange;
+            var activeKeys = _this.getActiveKeys(key);
+            _this.setState({
+                activeKeys: activeKeys,
+            });
+            onChange(e, key);
+        };
+        var state = {
+            activeKeys: tslib_1.__spreadArray([], tslib_1.__read(props.activeKeys)),
+        };
+        _this.state = state;
+        return _this;
+    }
+    Collapse.getDerivedStateFromProps = function (props, state) {
+        if (props.isAccordion && state.activeKeys.length > 1) {
+            return {
+                activeKeys: props.activeKeys.slice(0, 1),
+            };
+        }
+        return null;
+    };
+    Collapse.prototype.componentDidUpdate = function (prevProps) {
+        var activeKeys = this.props.activeKeys;
+        if (activeKeys.toString() !== prevProps.activeKeys.toString()) {
+            this.setState({
+                activeKeys: activeKeys,
+            });
+        }
+    };
+    Collapse.prototype.renderItems = function () {
+        var _this = this;
+        var _a = this.props, children = _a.children, theme = _a.theme, themeType = _a.themeType;
+        return react_1.Children.map(children, function (child, index) {
+            if (!child) {
+                return null;
+            }
+            var activeKeys = _this.state.activeKeys;
+            var activeIndex = activeKeys.indexOf(child.props.id);
+            var isActive = activeIndex >= 0;
+            if (child.type !== CollapseItem_1.default) {
+                return react_1.cloneElement(child, {
+                    id: child.props.id,
+                    isActive: isActive,
+                    key: index,
+                    renderTitle: child.props.renderTitle,
+                    disabled: child.props.disabled,
+                    onClick: _this.handleItemClick,
+                });
+            }
+            return (jsx_runtime_1.jsx(CollapseItem_1.default, tslib_1.__assign({ dataAttrs: child.props.dataAttrs, disabled: child.props.disabled, hideContentPadding: child.props.hideContentPadding, id: child.props.id, isActive: isActive, onClick: _this.handleItemClick, renderTitle: child.props.renderTitle, theme: theme, themeType: themeType }, { children: child.props.children }), child.props.id));
+        });
+    };
+    Collapse.prototype.render = function () {
+        return jsx_runtime_1.jsx(jsx_runtime_1.Fragment, { children: this.renderItems() }, void 0);
+    };
+    Collapse.CollapseItem = CollapseItem_1.default;
+    Collapse.defaultProps = collapseDefaultProps;
+    return Collapse;
+}(react_1.Component));
+exports.default = Collapse;
+//# sourceMappingURL=Collapse.js.map