@xivart/tangram 0.0.1-security → 2.712.1

package/components/Dropdown/Dropdown.js

@@ -0,0 +1,146 @@
+"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 Flex_1 = tslib_1.__importDefault(require("../Flex"));
+var ChevronIcon_1 = tslib_1.__importDefault(require("../ChevronIcon"));
+var MessageHelper_1 = tslib_1.__importStar(require("../MessageHelper"));
+var ValidationIcon_1 = tslib_1.__importDefault(require("../ValidationIcon"));
+var S = tslib_1.__importStar(require("./styled"));
+var Dropdown = (function (_super) {
+    tslib_1.__extends(Dropdown, _super);
+    function Dropdown() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.selectRef = react_1.createRef();
+        _this.state = {
+            isActive: false,
+        };
+        _this.getReactElement = function (element) {
+            return typeof element === 'function' ? element() : element;
+        };
+        _this.handleClick = function (e) {
+            var isActive = _this.state.isActive;
+            var name = _this.props.name;
+            if (!isActive) {
+                return;
+            }
+            if (e.target instanceof HTMLSelectElement &&
+                e.target.dataset &&
+                e.target.dataset.name === name) {
+                return;
+            }
+            _this.setState({
+                isActive: false,
+            });
+        };
+        _this.handleMouseDown = function () {
+            _this.setState({
+                isActive: true,
+            });
+            document.addEventListener('mouseup', _this.handleMouseUp);
+        };
+        _this.handleMouseUp = function (e) {
+            var current = _this.selectRef.current;
+            var isSelectComponent = current && current.contains(e.target);
+            var isActive = _this.state.isActive;
+            if (!isSelectComponent && isActive) {
+                _this.setState({
+                    isActive: false,
+                });
+            }
+            document.removeEventListener('mouseup', _this.handleMouseUp);
+        };
+        _this.handleBlur = function () {
+            _this.setState({
+                isActive: false,
+            });
+        };
+        _this.handleFocus = function () {
+            _this.setState({
+                isActive: true,
+            });
+        };
+        _this.handleSelectChange = function (e) {
+            var onChange = _this.props.onChange;
+            _this.setState({
+                isActive: false,
+            });
+            onChange(e);
+        };
+        return _this;
+    }
+    Dropdown.prototype.componentDidMount = function () {
+        document.addEventListener('click', this.handleClick);
+    };
+    Dropdown.prototype.renderMessage = function () {
+        var _a = this
+            .props, message = _a.message, errorMessage = _a.errorMessage, childrenDataAttrs = _a.childrenDataAttrs;
+        if (message && !errorMessage) {
+            return (jsx_runtime_1.jsx(MessageHelper_1.default, tslib_1.__assign({ dataAttrs: childrenDataAttrs.message }, { children: this.getReactElement(message) }), void 0));
+        }
+        return null;
+    };
+    Dropdown.prototype.renderErrorMessage = function () {
+        var _a = this
+            .props, errorMessage = _a.errorMessage, childrenDataAttrs = _a.childrenDataAttrs;
+        if (errorMessage) {
+            return (jsx_runtime_1.jsx(MessageHelper_1.default, tslib_1.__assign({ dataAttrs: childrenDataAttrs.errorMessage, type: MessageHelper_1.MessageHelperTypes.Error }, { children: this.getReactElement(errorMessage) }), void 0));
+        }
+        return null;
+    };
+    Dropdown.prototype.renderIcon = function () {
+        var isActive = this.state.isActive;
+        var _a = this.props, valid = _a.valid, disabled = _a.disabled;
+        if (valid !== 'idle') {
+            return jsx_runtime_1.jsx(ValidationIcon_1.default, { valid: valid === 'valid' }, void 0);
+        }
+        var iconColor = 'PRIMARY_LIGHTER';
+        if (isActive) {
+            iconColor = 'ACTIVE';
+        }
+        else if (disabled) {
+            iconColor = 'SECONDARY_LIGHT';
+        }
+        return jsx_runtime_1.jsx(ChevronIcon_1.default, { color: iconColor, isActive: isActive }, void 0);
+    };
+    Dropdown.prototype.renderOptionList = function () {
+        var _a = this.props, options = _a.options, placeholder = _a.placeholder;
+        var optionList = options.map(function (_a) {
+            var value = _a.value, label = _a.label;
+            return (jsx_runtime_1.jsx("option", tslib_1.__assign({ value: value }, { children: label }), label + "-" + value));
+        });
+        if (placeholder) {
+            var placeholderOption = (jsx_runtime_1.jsx("option", tslib_1.__assign({ disabled: true, value: "" }, { children: placeholder }), "-1"));
+            optionList.unshift(placeholderOption);
+        }
+        return optionList;
+    };
+    Dropdown.prototype.render = function () {
+        var _a = this
+            .props, name = _a.name, disabled = _a.disabled, dataAttrs = _a.dataAttrs, childrenDataAttrs = _a.childrenDataAttrs, valid = _a.valid, value = _a.value;
+        var isActive = this.state.isActive;
+        return (jsx_runtime_1.jsxs(S.Container, tslib_1.__assign({}, dataAttrs, { children: [jsx_runtime_1.jsx(Flex_1.default, tslib_1.__assign({ justifyContent: "flex-end" }, { children: jsx_runtime_1.jsx(S.IconContainer, tslib_1.__assign({ valid: valid }, childrenDataAttrs.icon, { children: this.renderIcon() }), void 0) }), void 0),
+                jsx_runtime_1.jsx(S.Select, tslib_1.__assign({}, childrenDataAttrs.select, { ref: this.selectRef, active: isActive, "data-name": name, disabled: disabled, onBlur: this.handleBlur, onChange: this.handleSelectChange, onFocus: this.handleFocus, onMouseDown: this.handleMouseDown, valid: valid, value: value }, { children: this.renderOptionList() }), void 0), this.renderErrorMessage(), this.renderMessage()] }), void 0));
+    };
+    Dropdown.defaultProps = {
+        dataAttrs: {},
+        childrenDataAttrs: {
+            icon: {},
+            select: {},
+            message: {},
+            errorMessage: {},
+        },
+        disabled: false,
+        onChange: function () { },
+        options: [],
+        placeholder: '',
+        value: '',
+        errorMessage: '',
+        message: '',
+        valid: 'idle',
+    };
+    return Dropdown;
+}(react_1.PureComponent));
+exports.default = Dropdown;
+//# sourceMappingURL=Dropdown.js.map

package/components/Dropdown/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 Dropdown_1 = require("./Dropdown");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Dropdown_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/Dropdown/styled/Container.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 MessageHelper_1 = tslib_1.__importDefault(require("../../MessageHelper/styled/MessageHelper"));
+var Container = themedStyledComponents_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  background-color: ", ";\n  border-radius: ", ";\n  margin: 0;\n  padding: 0;\n  position: relative;\n\n  ", " {\n    margin-top: -4px;\n  }\n"], ["\n  background-color: ", ";\n  border-radius: ", ";\n  margin: 0;\n  padding: 0;\n  position: relative;\n\n  ", " {\n    margin-top: -4px;\n  }\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.colors.CONTENT_BACKGROUND;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.borders.radius.br200;
+}, MessageHelper_1.default);
+exports.default = Container;
+var templateObject_1;
+//# sourceMappingURL=Container.js.map

package/components/Dropdown/styled/IconContainer.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 IconContainer = themedStyledComponents_1.default.span(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  flex-flow: row nowrap;\n  height: 48px;\n  justify-content: center;\n  width: 46px;\n\n  ", "\n"], ["\n  align-items: center;\n  display: flex;\n  flex-flow: row nowrap;\n  height: 48px;\n  justify-content: center;\n  width: 46px;\n\n  ",
+    "\n"])), function (_a) {
+    var _b = _a.theme, borders = _b.borders, dropdown = _b.dropdown, colors = _b.colors, valid = _a.valid;
+    return "\n    border-left: " + borders.width.bw200 + " " + dropdown.BORDER_STYLE + " " + (valid === 'invalid' ? colors.NEGATIVE_LIGHT : colors.SECONDARY_LIGHT) + ";\n  ";
+});
+exports.default = IconContainer;
+var templateObject_1;
+//# sourceMappingURL=IconContainer.js.map

package/components/Dropdown/styled/PrefixContent.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importDefault(require("../../../utils/themedStyledComponents"));
+var PrefixContent = themedStyledComponents_1.default.span(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  display: flex;\n  position: absolute;\n  left: 0;\n  align-items: center;\n  flex-flow: row nowrap;\n  justify-content: center;\n  width: ", ";\n  height: ", ";\n  overflow: hidden;\n"], ["\n  display: flex;\n  position: absolute;\n  left: 0;\n  align-items: center;\n  flex-flow: row nowrap;\n  justify-content: center;\n  width: ", ";\n  height: ", ";\n  overflow: hidden;\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacings.s1000;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacings.s1000;
+});
+exports.default = PrefixContent;
+var templateObject_1;
+//# sourceMappingURL=PrefixContent.js.map

package/components/Dropdown/styled/Select.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importDefault(require("../../../utils/themedStyledComponents"));
+var getBorderColor = function (_a) {
+    var valid = _a.valid, active = _a.active, disabled = _a.disabled;
+    if (active) {
+        return 'ACTIVE';
+    }
+    if (valid === 'invalid') {
+        return 'NEGATIVE_LIGHT';
+    }
+    if (disabled) {
+        return 'SECONDARY_LIGHT';
+    }
+    return 'SECONDARY';
+};
+var Select = themedStyledComponents_1.default.select(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  appearance: none;\n  background-color: transparent;\n  height: 48px;\n  outline: none;\n  position: absolute;\n  top: 0;\n  width: 100%;\n\n  ", "\n"], ["\n  appearance: none;\n  background-color: transparent;\n  height: 48px;\n  outline: none;\n  position: absolute;\n  top: 0;\n  width: 100%;\n\n  ",
+    "\n"])), function (_a) {
+    var _b = _a.theme, colors = _b.colors, _c = _b.fonts, primary = _c.primary, sizes = _c.sizes, spacings = _b.spacings, borders = _b.borders, disabled = _a.disabled, active = _a.active, value = _a.value, valid = _a.valid;
+    return "\n    border: " + borders.width.bw200 + " " + borders.style.SOLID + " " + colors[getBorderColor({ valid: valid, active: active, disabled: disabled })] + ";\n    border-radius: " + borders.radius.br200 + ";\n    color: " + (!value || disabled ? colors.TEXT_LIGHT : colors.TEXT_DARK) + ";\n    font-family: " + primary.fontFamily + ";\n    font-size: " + sizes.fs400 + ";\n    font-weight: " + primary.weight.fw400 + ";\n    padding: " + spacings.s400 + ";\n  ";
+});
+exports.default = Select;
+var templateObject_1;
+//# sourceMappingURL=Select.js.map

package/components/Dropdown/styled/SubInfo.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 SubInfo = themedStyledComponents_1.default.span(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n\n  ", "\n"], ["\n  align-items: center;\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n\n  ",
+    "\n"])), function (_a) {
+    var _b = _a.theme, sizes = _b.fonts.sizes, colors = _b.colors, spacings = _b.spacings;
+    return "\n    font-size: " + sizes.fs200 + ";\n    color: " + colors.TEXT + ";\n    margin-right:" + spacings.s400 + ";\n  ";
+});
+exports.default = SubInfo;
+var templateObject_1;
+//# sourceMappingURL=SubInfo.js.map

package/components/Dropdown/styled/index.js

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

package/components/DropdownButton/DropdownButton.js

@@ -0,0 +1,31 @@
+"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 S = tslib_1.__importStar(require("./styled"));
+var DropdownButton = function (_a) {
+    var children = _a.children, dropdown = _a.dropdown, fullWidth = _a.fullWidth, _b = _a.align, align = _b === void 0 ? 'right' : _b;
+    var _c = tslib_1.__read(react_1.useState(false), 2), popupVisible = _c[0], setPopupVisible = _c[1];
+    var dropdownButtonRef = react_1.useRef(null);
+    var togglePopupVisible = function () {
+        return setPopupVisible(!popupVisible);
+    };
+    react_1.useEffect(function () {
+        var handleClick = function (event) {
+            var _a;
+            if ((_a = dropdownButtonRef.current) === null || _a === void 0 ? void 0 : _a.contains(event.target))
+                return;
+            setPopupVisible(false);
+        };
+        if (popupVisible) {
+            document.addEventListener('click', handleClick);
+        }
+        return function () {
+            document.removeEventListener('click', handleClick);
+        };
+    }, [popupVisible]);
+    return (jsx_runtime_1.jsxs(S.DropdownButton, tslib_1.__assign({ ref: dropdownButtonRef, fullWidth: fullWidth, onClick: togglePopupVisible }, { children: [children, popupVisible && (jsx_runtime_1.jsx(S.DropdownPopup, tslib_1.__assign({ align: align }, { children: dropdown }), void 0))] }), void 0));
+};
+exports.default = DropdownButton;
+//# sourceMappingURL=DropdownButton.js.map

package/components/DropdownButton/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 DropdownButton_1 = require("./DropdownButton");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(DropdownButton_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/DropdownButton/styled/DropdownButton.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 DropdownButton = themedStyledComponents_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  position: relative;\n  display: inline-block;\n  cursor: pointer;\n  width: ", ";\n  -webkit-tap-highlight-color: transparent;\n"], ["\n  position: relative;\n  display: inline-block;\n  cursor: pointer;\n  width: ", ";\n  -webkit-tap-highlight-color: transparent;\n"])), function (_a) {
+    var fullWidth = _a.fullWidth;
+    return fullWidth && '100%';
+});
+exports.default = DropdownButton;
+var templateObject_1;
+//# sourceMappingURL=DropdownButton.js.map

package/components/DropdownButton/styled/DropdownPopup.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importStar(require("../../../utils/themedStyledComponents"));
+var styles = themedStyledComponents_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  position: absolute;\n  margin-top: 4px;\n  border-radius: 4px;\n  overflow: hidden;\n  box-shadow: 0px 0px 3px rgba(0, 63, 127, 0.15),\n    0px 2px 3px rgba(0, 63, 127, 0.15);\n  z-index: ", ";\n"], ["\n  position: absolute;\n  margin-top: 4px;\n  border-radius: 4px;\n  overflow: hidden;\n  box-shadow: 0px 0px 3px rgba(0, 63, 127, 0.15),\n    0px 2px 3px rgba(0, 63, 127, 0.15);\n  z-index: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.zIndexes.dropdown;
+});
+var DropdownPopup = themedStyledComponents_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  ", "\n  ", "\n"], ["\n  ", "\n  ",
+    "\n"])), styles, function (_a) {
+    var align = _a.align;
+    return "\n    " + (align === 'right' ? 'right: 0;' : 'left: 0;') + "\n  ";
+});
+exports.default = DropdownPopup;
+var templateObject_1, templateObject_2;
+//# sourceMappingURL=DropdownPopup.js.map

package/components/DropdownButton/styled/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.DropdownPopup = exports.DropdownButton = void 0;
+var DropdownButton_1 = require("./DropdownButton");
+Object.defineProperty(exports, "DropdownButton", { enumerable: true, get: function () { return __importDefault(DropdownButton_1).default; } });
+var DropdownPopup_1 = require("./DropdownPopup");
+Object.defineProperty(exports, "DropdownPopup", { enumerable: true, get: function () { return __importDefault(DropdownPopup_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/Fade/Fade.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 Fade = function (_a) {
+    var children = _a.children, restProps = tslib_1.__rest(_a, ["children"]);
+    return (jsx_runtime_1.jsx(S.Fade, tslib_1.__assign({}, restProps, { children: children }), void 0));
+};
+exports.default = Fade;
+//# sourceMappingURL=Fade.js.map

package/components/Fade/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 Fade_1 = require("./Fade");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Fade_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/Fade/styled/Fade.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Fade = void 0;
+var tslib_1 = require("tslib");
+var styled_1 = require("../../../components/Flex/styled");
+var themedStyledComponents_1 = tslib_1.__importStar(require("../../../utils/themedStyledComponents"));
+var fadeInAnimation = themedStyledComponents_1.keyframes(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n"], ["\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n"])));
+var fadeAnimation = function (_a) {
+    var _b = _a.delay, delay = _b === void 0 ? 0 : _b, _c = _a.duration, duration = _c === void 0 ? 600 : _c;
+    return themedStyledComponents_1.css(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  opacity: 0;\n  animation-name: ", ";\n  animation-duration: ", "ms;\n  animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1);\n  animation-delay: ", "ms;\n  animation-fill-mode: forwards;\n"], ["\n  opacity: 0;\n  animation-name: ", ";\n  animation-duration: ", "ms;\n  animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1);\n  animation-delay: ", "ms;\n  animation-fill-mode: forwards;\n"])), fadeInAnimation, duration, delay);
+};
+exports.Fade = themedStyledComponents_1.default(styled_1.Flex)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), fadeAnimation);
+var templateObject_1, templateObject_2, templateObject_3;
+//# sourceMappingURL=Fade.js.map

package/components/Fade/styled/index.js

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

package/components/Fieldset/Fieldset.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 = (0, tslib_1.__importStar)(require("./styled"));
+var Fieldset = function (_a) {
+    var disabled = _a.disabled, children = _a.children;
+    return ((0, jsx_runtime_1.jsx)(S.Fieldset, (0, tslib_1.__assign)({ disabled: disabled }, { children: children }), void 0));
+};
+exports.default = Fieldset;
+//# sourceMappingURL=Fieldset.js.map

package/components/Fieldset/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 Fieldset_1 = require("./Fieldset");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Fieldset_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/Fieldset/styled/Fieldset.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = (0, tslib_1.__importDefault)(require("../../../utils/themedStyledComponents"));
+var Fieldset = themedStyledComponents_1.default.fieldset(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  display: block;\n  border: none;\n"], ["\n  display: block;\n  border: none;\n"])));
+exports.default = Fieldset;
+var templateObject_1;
+//# sourceMappingURL=Fieldset.js.map

package/components/Fieldset/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.Fieldset = void 0;
+var Fieldset_1 = require("./Fieldset");
+Object.defineProperty(exports, "Fieldset", { enumerable: true, get: function () { return __importDefault(Fieldset_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/Flex/Flex.js

@@ -0,0 +1,12 @@
+"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 S = tslib_1.__importStar(require("./styled"));
+var Flex = react_1.forwardRef(function (_a, ref) {
+    var dataAttrs = _a.dataAttrs, props = tslib_1.__rest(_a, ["dataAttrs"]);
+    return (jsx_runtime_1.jsx(S.Flex, tslib_1.__assign({ ref: ref }, dataAttrs, props), void 0));
+});
+exports.default = Flex;
+//# sourceMappingURL=Flex.js.map

package/components/Flex/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 Flex_1 = require("./Flex");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Flex_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/Flex/styled/Flex.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importStar(require("../../../utils/themedStyledComponents"));
+var media_1 = require("../../../utils/media");
+var S = tslib_1.__importStar(require("../../Layout/styled"));
+var getResponsiveStyles = function (_a) {
+    var flexDirection = _a.flexDirection, flexWrap = _a.flexWrap, alignItems = _a.alignItems, alignContent = _a.alignContent, justifyContent = _a.justifyContent, flexGrow = _a.flexGrow, flexShrink = _a.flexShrink, flexBasis = _a.flexBasis, alignSelf = _a.alignSelf, order = _a.order;
+    return themedStyledComponents_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  flex-direction: ", ";\n  flex-wrap: ", ";\n  align-items: ", ";\n  align-content: ", ";\n  justify-content: ", ";\n"], ["\n  flex-direction: ", ";\n  flex-wrap: ", ";\n  align-items: ", ";\n  align-content: ", ";\n  justify-content: ", ";\n"])), flexDirection, flexWrap, alignItems, alignContent, justifyContent);
+};
+var Flex = themedStyledComponents_1.default(S.Layout).attrs(function (props) {
+    var _a;
+    return ({
+        display: (_a = props.display) !== null && _a !== void 0 ? _a : 'flex',
+        extended: tslib_1.__spread(props.extended, [media_1.interpolate(props, getResponsiveStyles)]),
+    });
+})(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), getResponsiveStyles);
+exports.default = Flex;
+var templateObject_1, templateObject_2;
+//# sourceMappingURL=Flex.js.map

package/components/Flex/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.Flex = void 0;
+var Flex_1 = require("./Flex");
+Object.defineProperty(exports, "Flex", { enumerable: true, get: function () { return __importDefault(Flex_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/FlightDateSelector/FlightDateSelector.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var Flex_1 = tslib_1.__importDefault(require("../Flex"));
+var Icon_1 = tslib_1.__importDefault(require("../Icon"));
+var Text_1 = tslib_1.__importDefault(require("../Text"));
+var S = tslib_1.__importStar(require("./styled"));
+var FlightDateSelector = function (_a) {
+    var active = _a.active, iconName = _a.iconName, text = _a.text, value = _a.value;
+    return (jsx_runtime_1.jsx(S.FlightDateSelector, tslib_1.__assign({ active: active }, { children: jsx_runtime_1.jsxs(Flex_1.default, tslib_1.__assign({ alignItems: "center", inlineSize: "100%" }, { children: [jsx_runtime_1.jsx(Flex_1.default, tslib_1.__assign({ alignItems: "center", flexShrink: 0 }, { children: jsx_runtime_1.jsx(Icon_1.default, { color: active ? 'CONTENT_BACKGROUND' : 'SECONDARY_DARK', height: 20, name: iconName, width: 20 }, void 0) }), void 0),
+                jsx_runtime_1.jsxs(Flex_1.default, tslib_1.__assign({ alignItems: value ? 'stretch' : 'center', flexDirection: value ? 'column' : 'row', flexGrow: 1, justifyContent: value ? 'center' : 'flex-start', marginInlineStart: "s400", overflow: "hidden" }, { children: [jsx_runtime_1.jsx(Text_1.default, tslib_1.__assign({ color: active ? 'CONTENT_BACKGROUND' : 'TEXT', fontSize: value ? 'fs200' : 'fs300', lineHeight: value ? 1.2 : undefined, withEllipsis: true }, { children: text }), void 0),
+                        value && (jsx_runtime_1.jsx(Text_1.default, tslib_1.__assign({ color: active ? 'CONTENT_BACKGROUND' : 'PRIMARY_DARK', fontSize: "fs300", lineHeight: 1.2, withEllipsis: true }, { children: value }), void 0))] }), void 0)] }), void 0) }), void 0));
+};
+exports.default = FlightDateSelector;
+//# sourceMappingURL=FlightDateSelector.js.map

package/components/FlightDateSelector/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 FlightDateSelector_1 = require("./FlightDateSelector");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(FlightDateSelector_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/FlightDateSelector/styled/FlightDateSelector.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var themedStyledComponents_1 = tslib_1.__importDefault(require("../../../utils/themedStyledComponents"));
+var styles = function (_a) {
+    var theme = _a.theme;
+    var _b = theme.borders, br200 = _b.radius.br200, SOLID = _b.style.SOLID, bw100 = _b.width.bw100, _c = theme.colors, SECONDARY_LIGHT = _c.SECONDARY_LIGHT, CONTENT_BACKGROUND = _c.CONTENT_BACKGROUND, _d = theme.spacings, s300 = _d.s300, s400 = _d.s400;
+    return "\n    background: " + CONTENT_BACKGROUND + ";\n    border-radius: " + br200 + ";\n    border: " + bw100 + " " + SOLID + " " + SECONDARY_LIGHT + ";\n    cursor: pointer;\n    display: flex;\n    min-height: 48px;\n    padding: " + s300 + " " + s400 + " " + s300 + " " + s400 + ";\n    position: relative;\n    width: 100%;\n  ";
+};
+var activeStyles = function (_a) {
+    var theme = _a.theme, active = _a.active;
+    var ACTIVE = theme.colors.ACTIVE;
+    return (active &&
+        "\n      background: " + ACTIVE + ";\n      border-color: " + ACTIVE + ";\n\n      &:after {\n        background: " + ACTIVE + ";\n        content: '';\n        position: absolute;\n        bottom: -4px;\n        width: 8px;\n        height: 8px;\n        left: calc(50% - 4px);\n        transform: rotate(45deg);\n      }\n    ");
+};
+var FlightDateSelector = themedStyledComponents_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n  ", "\n"], ["\n  ", "\n  ", "\n"])), styles, activeStyles);
+exports.default = FlightDateSelector;
+var templateObject_1;
+//# sourceMappingURL=FlightDateSelector.js.map

package/components/FlightDateSelector/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.FlightDateSelector = void 0;
+var FlightDateSelector_1 = require("./FlightDateSelector");
+Object.defineProperty(exports, "FlightDateSelector", { enumerable: true, get: function () { return __importDefault(FlightDateSelector_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/FlightInfoBox/FlightInfoBox.js

@@ -0,0 +1,20 @@
+"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 S = tslib_1.__importStar(require("./styled"));
+var FlightInfoBox = (function (_super) {
+    tslib_1.__extends(FlightInfoBox, _super);
+    function FlightInfoBox() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    FlightInfoBox.prototype.render = function () {
+        var _a = this.props, children = _a.children, withArrow = _a.withArrow;
+        return jsx_runtime_1.jsx(S.FlightInfoBox, tslib_1.__assign({ withArrow: withArrow }, { children: children }), void 0);
+    };
+    FlightInfoBox.Content = S.Content;
+    return FlightInfoBox;
+}(react_1.Component));
+exports.default = FlightInfoBox;
+//# sourceMappingURL=FlightInfoBox.js.map

package/components/FlightInfoBox/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 FlightInfoBox_1 = require("./FlightInfoBox");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(FlightInfoBox_1).default; } });
+//# sourceMappingURL=index.js.map

package/components/FlightInfoBox/styled/Content.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 Content = themedStyledComponents_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  padding: ", ";\n"], ["\n  padding: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacings.s400;
+});
+exports.default = Content;
+var templateObject_1;
+//# sourceMappingURL=Content.js.map