@xfers/design-system 5.0.0-dev.95638b2cbd → 5.0.0-dev.a597d4d71a

package/dist/components/Input/inputStyles.js.map

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

package/dist/components/InputWithButton/index.js

@@ -0,0 +1,60 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("react");
+var styled_1 = require("@emotion/styled");
+var ThemeContext_1 = require("src/theme/ThemeContext");
+var TypographyStyles_1 = require("src/shared/TypographyStyles");
+var InputWithButton = function (_a) {
+    var buttonText = _a.buttonText, onButtonClick = _a.onButtonClick, prefix = _a.prefix, placeholder = _a.placeholder, value = _a.value, defaultValue = _a.defaultValue, onChange = _a.onChange, _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.disabledInput, disabledInput = _c === void 0 ? false : _c, _d = _a.disabledPrefix, disabledPrefix = _d === void 0 ? false : _d, _e = _a.staticPrefix, staticPrefix = _e === void 0 ? false : _e, _f = _a.error, error = _f === void 0 ? false : _f, className = _a.className;
+    var theme = (0, ThemeContext_1.useTheme)();
+    var inputDisabled = disabled || disabledInput;
+    var prefixDisabled = disabled || disabledPrefix;
+    var borderColor = error
+        ? theme.color.status.critical
+        : theme.color.base.line;
+    var prefixBorderColor = theme.color.base.line;
+    var getPrefixBgColor = function () {
+        if (prefixDisabled)
+            return theme.color.surface.disabledSurface;
+        if (staticPrefix)
+            return theme.color.surface.secondaryNeutral;
+        return theme.color.surface.neutral;
+    };
+    return (react_1.default.createElement(Container, { className: className },
+        prefix && (react_1.default.createElement(PrefixContainer, { borderColor: prefixBorderColor, bgColor: getPrefixBgColor(), hoverBgColor: prefixDisabled
+                ? theme.color.surface.disabledSurface
+                : theme.color.interactive.hoverSurface, textColor: prefixDisabled
+                ? theme.color.surface.disabledOnSurface
+                : theme.color.base.onNeutral, isDisabled: prefixDisabled }, prefix)),
+        react_1.default.createElement(StyledInput, { type: "text", placeholder: placeholder, value: value, defaultValue: defaultValue, onChange: onChange, disabled: inputDisabled, borderColor: borderColor, focusBorderColor: theme.color.base.primary2, textColor: theme.color.base.onNeutral, placeholderColor: theme.color.component.placeholderInput, disabledBgColor: theme.color.surface.disabledSurface, disabledTextColor: theme.color.surface.disabledOnSurface, hasPrefix: !!prefix, isDisabled: inputDisabled }),
+        react_1.default.createElement(StyledButton, { type: "button", onClick: onButtonClick, disabled: disabled || error, bgColor: theme.color.base.primary, disabledBgColor: theme.color.surface.disabledSurface, textColor: theme.color.base.onNeutral, disabledTextColor: theme.color.surface.disabledOnSurface, isDisabled: disabled || error }, buttonText)));
+};
+exports.default = InputWithButton;
+// ─── Styled Components ───
+var _a = TypographyStyles_1.SIZE_CONFIG.large, height = _a.height, borderRadius = _a.borderRadius, padding = _a.padding;
+var Container = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  height: ", ";\n  width: 100%;\n  position: relative;\n"], ["\n  display: flex;\n  height: ", ";\n  width: 100%;\n  position: relative;\n"])), height);
+var PrefixContainer = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  padding: 0 16px;\n  border: 1px solid ", ";\n  border-right: none;\n  border-radius: ", " 0 0 ", ";\n  background-color: ", ";\n  color: ", ";\n  font-family: ", ";\n  font-size: ", ";\n  white-space: nowrap;\n  cursor: ", ";\n  box-sizing: border-box;\n  overflow: visible;\n\n  & > * {\n    pointer-events: ", ";\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  padding: 0 16px;\n  border: 1px solid ", ";\n  border-right: none;\n  border-radius: ", " 0 0 ", ";\n  background-color: ", ";\n  color: ", ";\n  font-family: ", ";\n  font-size: ", ";\n  white-space: nowrap;\n  cursor: ", ";\n  box-sizing: border-box;\n  overflow: visible;\n\n  & > * {\n    pointer-events: ", ";\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n"])), function (props) { return props.borderColor; }, borderRadius, borderRadius, function (props) { return props.bgColor; }, function (props) { return props.textColor; }, TypographyStyles_1.MAIN_FONT, TypographyStyles_1.FONT_SIZE.P1, function (props) { return (props.isDisabled ? 'not-allowed' : 'default'); }, function (props) { return (props.isDisabled ? 'none' : 'auto'); }, function (props) {
+    return props.isDisabled ? props.bgColor : props.hoverBgColor;
+});
+var StyledInput = styled_1.default.input(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  flex: 1;\n  min-width: 0;\n  height: 100%;\n  padding: ", ";\n  border: 1px solid ", ";\n  border-radius: ", ";\n  font-family: ", ";\n  font-size: ", ";\n  color: ", ";\n  background-color: ", ";\n  outline: none;\n  box-sizing: border-box;\n  cursor: ", ";\n\n  &::placeholder {\n    color: ", ";\n    font-weight: 400;\n  }\n\n  &:focus {\n    border-color: ", ";\n  }\n\n  &:hover {\n    border-color: ", ";\n  }\n"], ["\n  flex: 1;\n  min-width: 0;\n  height: 100%;\n  padding: ", ";\n  border: 1px solid ", ";\n  border-radius: ", ";\n  font-family: ", ";\n  font-size: ", ";\n  color: ", ";\n  background-color: ", ";\n  outline: none;\n  box-sizing: border-box;\n  cursor: ", ";\n\n  &::placeholder {\n    color: ", ";\n    font-weight: 400;\n  }\n\n  &:focus {\n    border-color: ", ";\n  }\n\n  &:hover {\n    border-color: ", ";\n  }\n"])), padding, function (props) { return props.borderColor; }, function (props) {
+    return props.hasPrefix ? '0' : "".concat(borderRadius, " 0 0 ").concat(borderRadius);
+}, TypographyStyles_1.MAIN_FONT, TypographyStyles_1.FONT_SIZE.P1, function (props) {
+    return props.isDisabled ? props.disabledTextColor : props.textColor;
+}, function (props) {
+    return props.isDisabled ? props.disabledBgColor : 'transparent';
+}, function (props) { return (props.isDisabled ? 'not-allowed' : 'text'); }, function (props) { return props.placeholderColor; }, function (props) {
+    return props.isDisabled ? props.borderColor : props.focusBorderColor;
+}, function (props) {
+    return props.isDisabled ? props.borderColor : props.focusBorderColor;
+});
+var StyledButton = styled_1.default.button(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 24px;\n  border: none;\n  border-radius: 0 ", " ", " 0;\n  background-color: ", ";\n  color: ", ";\n  font-family: ", ";\n  font-size: ", ";\n  font-weight: 700;\n  white-space: nowrap;\n  cursor: ", ";\n  box-sizing: border-box;\n\n  &:hover {\n    opacity: ", ";\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 24px;\n  border: none;\n  border-radius: 0 ", " ", " 0;\n  background-color: ", ";\n  color: ", ";\n  font-family: ", ";\n  font-size: ", ";\n  font-weight: 700;\n  white-space: nowrap;\n  cursor: ", ";\n  box-sizing: border-box;\n\n  &:hover {\n    opacity: ", ";\n  }\n"])), borderRadius, borderRadius, function (props) {
+    return props.isDisabled ? props.disabledBgColor : props.bgColor;
+}, function (props) {
+    return props.isDisabled ? props.disabledTextColor : props.textColor;
+}, TypographyStyles_1.MAIN_FONT, TypographyStyles_1.FONT_SIZE.P1, function (props) { return (props.isDisabled ? 'not-allowed' : 'pointer'); }, function (props) { return (props.isDisabled ? 1 : 0.9); });
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
+//# sourceMappingURL=index.js.map

package/dist/components/InputWithButton/index.js.map

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

package/dist/components/Modal/DialogItems.js

@@ -0,0 +1,41 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("react");
+var styled_1 = require("@emotion/styled");
+var fontStyles_1 = require("src/constants/fontStyles");
+var DialogItem = function (_a) {
+    var label = _a.label, value = _a.value, _b = _a.variant, variant = _b === void 0 ? 'small' : _b;
+    return (react_1.default.createElement(Row, null,
+        react_1.default.createElement(Label, { variant: variant }, label),
+        react_1.default.createElement(Value, { variant: variant }, value)));
+};
+var DialogItems = function (_a) {
+    var items = _a.items, className = _a.className;
+    return (react_1.default.createElement(Container, { className: className }, items.map(function (item, index) { return (react_1.default.createElement(DialogItem, __assign({ key: index }, item))); })));
+};
+exports.default = DialogItems;
+var Container = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n"], ["\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n"])));
+var Row = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"])));
+var Label = styled_1.default.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  font-family: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: 1;\n  color: ", ";\n"], ["\n  font-family: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: 1;\n  color: ", ";\n"])), function (props) {
+    return props.variant === 'large' ? fontStyles_1.SECONDARY_FONT : fontStyles_1.MAIN_FONT;
+}, function (props) { return (props.variant === 'large' ? 700 : 400); }, function (props) { return (props.variant === 'large' ? '20px' : '14px'); }, function (props) { return (props.variant === 'large' ? '#002b2a' : '#505454'); });
+var Value = styled_1.default.span(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  font-family: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: 1;\n  color: #002b2a;\n"], ["\n  font-family: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: 1;\n  color: #002b2a;\n"])), function (props) {
+    return props.variant === 'large' ? fontStyles_1.SECONDARY_FONT : fontStyles_1.MAIN_FONT;
+}, function (props) { return (props.variant === 'large' ? 700 : 400); }, function (props) { return (props.variant === 'large' ? '20px' : '14px'); });
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
+//# sourceMappingURL=DialogItems.js.map

package/dist/components/Modal/DialogItems.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogItems.js","sourceRoot":"","sources":["../../../src/components/Modal/DialogItems.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,+BAAyB;AACzB,0CAAoC;AACpC,uDAAoE;AAUpE,IAAM,UAAU,GAAG,UAAC,EAAoD;QAAlD,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,eAAiB,EAAjB,OAAO,mBAAG,OAAO,KAAA;IACnD,OAAO,CACL,8BAAC,GAAG;QACF,8BAAC,KAAK,IAAC,OAAO,EAAE,OAAO,IAAG,KAAK,CAAS;QACxC,8BAAC,KAAK,IAAC,OAAO,EAAE,OAAO,IAAG,KAAK,CAAS,CACpC,CACP,CAAA;AACH,CAAC,CAAA;AAOD,IAAM,WAAW,GAAG,UAAC,EAAsC;QAApC,KAAK,WAAA,EAAE,SAAS,eAAA;IACrC,OAAO,CACL,8BAAC,SAAS,IAAC,SAAS,EAAE,SAAS,IAC5B,KAAK,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,KAAK,IAAK,OAAA,CAC1B,8BAAC,UAAU,aAAC,GAAG,EAAE,KAAK,IAAM,IAAI,EAAI,CACrC,EAF2B,CAE3B,CAAC,CACQ,CACb,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,WAAW,CAAA;AAE1B,IAAM,SAAS,GAAG,gBAAM,CAAC,GAAG,kIAAA,+DAI3B,IAAA,CAAA;AAED,IAAM,GAAG,GAAG,gBAAM,CAAC,GAAG,oJAAA,iFAIrB,IAAA,CAAA;AAED,IAAM,KAAK,GAAG,gBAAM,CAAC,IAAI,0KAAgC,mBACxC,EACyC,oBACzC,EAAkD,kBACpD,EAAwD,iCAE5D,EAA8D,KACxE,KANgB,UAAC,KAAK;IACnB,OAAA,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,2BAAc,CAAC,CAAC,CAAC,sBAAS;AAAtD,CAAsD,EACzC,UAAC,KAAK,IAAK,OAAA,CAAC,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,EAAvC,CAAuC,EACpD,UAAC,KAAK,IAAK,OAAA,CAAC,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,EAA7C,CAA6C,EAE5D,UAAC,KAAK,IAAK,OAAA,CAAC,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,EAAnD,CAAmD,CACxE,CAAA;AAED,IAAM,KAAK,GAAG,gBAAM,CAAC,IAAI,6KAAgC,mBACxC,EACyC,oBACzC,EAAkD,kBACpD,EAAwD,2CAGtE,KANgB,UAAC,KAAK;IACnB,OAAA,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,2BAAc,CAAC,CAAC,CAAC,sBAAS;AAAtD,CAAsD,EACzC,UAAC,KAAK,IAAK,OAAA,CAAC,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,EAAvC,CAAuC,EACpD,UAAC,KAAK,IAAK,OAAA,CAAC,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,EAA7C,CAA6C,CAGtE,CAAA"}

package/dist/components/Modal/index.js

@@ -1,42 +1,39 @@
 "use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = require("react");
-var styled_1 = require("@emotion/styled");
-var Typography_1 = require("src/components/Typography");
-var Divider_1 = require("src/components/Divider");
 var Cross_1 = require("src/icons/Cross");
 var ThemeContext_1 = require("src/theme/ThemeContext");
-var spacing_1 = require("src/constants/spacing");
+var styles_1 = require("./styles");
 var ModalContent = function (_a) {
-    var onClose = _a.onClose, icon = _a.icon, title = _a.title, children = _a.children, footer = _a.footer, disabledCloseIcon = _a.disabledCloseIcon, className = _a.className;
+    var onClose = _a.onClose, _b = _a.variant, variant = _b === void 0 ? 'default' : _b, _c = _a.size, size = _c === void 0 ? 'small' : _c, title = _a.title, children = _a.children, footer = _a.footer, disabledCloseIcon = _a.disabledCloseIcon, className = _a.className, illustration = _a.illustration, headerImage = _a.headerImage;
     var neutral = (0, ThemeContext_1.useTheme)().neutral;
-    return (react_1.default.createElement(ModalContentWrapper, { className: className },
-        (icon || title || !disabledCloseIcon) && (react_1.default.createElement(ModalHeader, { hasIcon: Boolean(icon) },
-            react_1.default.createElement(TitleContainer, null,
-                react_1.default.createElement(Title, null,
-                    icon,
-                    react_1.default.createElement(Typography_1.H2, null, title || '')),
-                !disabledCloseIcon && (react_1.default.createElement(Close, { onClick: function () { return onClose(); } },
-                    react_1.default.createElement(Cross_1.default, { color: neutral.text, width: 18 })))),
-            react_1.default.createElement(Divider_1.default, null))),
-        react_1.default.createElement(ModalBody, null, children),
-        footer && react_1.default.createElement(ModalFooter, null, footer)));
+    var resolvedSize = variant === 'newFeature' ? 'medium' : size;
+    var closeIcon = !disabledCloseIcon && (react_1.default.createElement(styles_1.Close, { onClick: function () { return onClose(); } },
+        react_1.default.createElement(Cross_1.default, { color: neutral.text, width: 18 })));
+    var renderHeader = function () {
+        switch (variant) {
+            case 'illustration':
+                return (react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement(styles_1.IllustrationCloseBar, null, closeIcon),
+                    react_1.default.createElement(styles_1.IllustrationContainer, null,
+                        illustration && (react_1.default.createElement(styles_1.IllustrationWrapper, null, illustration)),
+                        title && react_1.default.createElement(styles_1.CenteredTitle, null, title))));
+            case 'newFeature':
+                return (react_1.default.createElement(react_1.default.Fragment, null,
+                    headerImage && (react_1.default.createElement(styles_1.NewFeatureImageContainer, null, headerImage)),
+                    title && (react_1.default.createElement(styles_1.CenteredTitleFrame, null,
+                        react_1.default.createElement(styles_1.NewFeatureTitle, null, title)))));
+            default:
+                return ((title || !disabledCloseIcon) && (react_1.default.createElement(styles_1.ModalHeader, null,
+                    react_1.default.createElement(styles_1.TitleContainer, null,
+                        react_1.default.createElement(styles_1.Title, null, title || ''),
+                        closeIcon))));
+        }
+    };
+    return (react_1.default.createElement(styles_1.ModalContentWrapper, { modalSize: resolvedSize, className: className },
+        renderHeader(),
+        react_1.default.createElement(styles_1.ModalBody, null, children),
+        footer && react_1.default.createElement(styles_1.ModalFooter, null, footer)));
 };
 exports.default = ModalContent;
-var ModalHeader = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n  padding-left: ", ";\n  padding-right: ", ";\n"], ["\n  ", "\n  padding-left: ", ";\n  padding-right: ", ";\n"])), function (props) {
-    return props.hasIcon
-        ? "\n      height: 86px;\n    "
-        : "\n      height: 73px;\n    ";
-}, spacing_1.EXTRA_LARGE_SPACING, spacing_1.EXTRA_LARGE_SPACING);
-var ModalBody = (0, styled_1.default)(Typography_1.P1)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  border-bottom: 1px solid #e8e8e8;\n  padding-top: ", ";\n  padding-left: ", ";\n  padding-right: ", ";\n  padding-bottom: ", ";\n"], ["\n  border-bottom: 1px solid #e8e8e8;\n  padding-top: ", ";\n  padding-left: ", ";\n  padding-right: ", ";\n  padding-bottom: ", ";\n"])), spacing_1.LARGE_SPACING, spacing_1.EXTRA_LARGE_SPACING, spacing_1.EXTRA_LARGE_SPACING, spacing_1.EXTRA_LARGE_SPACING);
-var ModalFooter = styled_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  background: #f6f7f9;\n  display: flex;\n  justify-content: flex-end;\n  padding-right: ", ";\n  padding-top: ", ";\n  padding-bottom: ", ";\n"], ["\n  background: #f6f7f9;\n  display: flex;\n  justify-content: flex-end;\n  padding-right: ", ";\n  padding-top: ", ";\n  padding-bottom: ", ";\n"])), spacing_1.EXTRA_LARGE_SPACING, spacing_1.SMALL_SPACING, spacing_1.SMALL_SPACING);
-var TitleContainer = styled_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"], ["\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"])));
-var Title = styled_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  user-select: none;\n  & :not(:last-child) {\n    margin-right: 10px;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  user-select: none;\n  & :not(:last-child) {\n    margin-right: 10px;\n  }\n"])));
-var Close = styled_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  cursor: pointer;\n  padding-left: 5px;\n  padding-right: 5px;\n  margin-right: -5px;\n"], ["\n  cursor: pointer;\n  padding-left: 5px;\n  padding-right: 5px;\n  margin-right: -5px;\n"])));
-var ModalContentWrapper = styled_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  width: calc(100vw - 32px);\n  max-width: 400px;\n  background: white;\n  box-shadow: 0px 4px 10px rgba(170, 170, 170, 0.25);\n  border-radius: 5px;\n  overflow: hidden;\n  -webkit-font-smoothing: antialiased;\n  margin-bottom: 1.7vh;\n  position: absolute;\n  top: 6.8vh;\n  left: 50%;\n  transform: translateX(-50%);\n"], ["\n  width: calc(100vw - 32px);\n  max-width: 400px;\n  background: white;\n  box-shadow: 0px 4px 10px rgba(170, 170, 170, 0.25);\n  border-radius: 5px;\n  overflow: hidden;\n  -webkit-font-smoothing: antialiased;\n  margin-bottom: 1.7vh;\n  position: absolute;\n  top: 6.8vh;\n  left: 50%;\n  transform: translateX(-50%);\n"])));
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
 //# sourceMappingURL=index.js.map

package/dist/components/Modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":";;;;;;AAAA,+BAAyB;AACzB,0CAAoC;AACpC,wDAAkD;AAClD,kDAA4C;AAC5C,yCAAuC;AACvC,uDAAiD;AACjD,iDAI8B;AAY9B,IAAM,YAAY,GAAG,UAAC,EAQF;QAPlB,OAAO,aAAA,EACP,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,MAAM,YAAA,EACN,iBAAiB,uBAAA,EACjB,SAAS,eAAA;IAED,IAAA,OAAO,GAAK,IAAA,uBAAQ,GAAE,QAAf,CAAe;IAE9B,OAAO,CACL,8BAAC,mBAAmB,IAAC,SAAS,EAAE,SAAS;QACtC,CAAC,IAAI,IAAI,KAAK,IAAI,CAAC,iBAAiB,CAAC,IAAI,CACxC,8BAAC,WAAW,IAAC,OAAO,EAAE,OAAO,CAAC,IAAI,CAAC;YACjC,8BAAC,cAAc;gBACb,8BAAC,KAAK;oBACH,IAAI;oBACL,8BAAC,eAAE,QAAE,KAAK,IAAI,EAAE,CAAM,CAChB;gBACP,CAAC,iBAAiB,IAAI,CACrB,8BAAC,KAAK,IAAC,OAAO,EAAE,cAAM,OAAA,OAAO,EAAE,EAAT,CAAS;oBAC7B,8BAAC,eAAS,IAAC,KAAK,EAAE,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,GAAI,CACvC,CACT,CACc;YACjB,8BAAC,iBAAO,OAAG,CACC,CACf;QACD,8BAAC,SAAS,QAAE,QAAQ,CAAa;QAChC,MAAM,IAAI,8BAAC,WAAW,QAAE,MAAM,CAAe,CAC1B,CACvB,CAAA;AACH,CAAC,CAAA;AACD,kBAAe,YAAY,CAAA;AAE3B,IAAM,WAAW,GAAG,gBAAM,CAAC,GAAG,8HAAsB,MAChD,EAOC,oBACa,EAAmB,sBAClB,EAAmB,KACrC,KAVG,UAAA,KAAK;IACL,OAAA,KAAK,CAAC,OAAO;QACX,CAAC,CAAC,6BAEH;QACC,CAAC,CAAC,6BAEH;AAND,CAMC,EACa,6BAAmB,EAClB,6BAAmB,CACrC,CAAA;AAED,IAAM,SAAS,GAAG,IAAA,gBAAM,EAAC,eAAE,CAAC,0MAAA,wDAEX,EAAa,qBACZ,EAAmB,sBAClB,EAAmB,uBAClB,EAAmB,KACtC,KAJgB,uBAAa,EACZ,6BAAmB,EAClB,6BAAmB,EAClB,6BAAmB,CACtC,CAAA;AAED,IAAM,WAAW,GAAG,gBAAM,CAAC,GAAG,sNAAA,6FAIX,EAAmB,oBACrB,EAAa,uBACV,EAAa,KAChC,KAHkB,6BAAmB,EACrB,uBAAa,EACV,uBAAa,CAChC,CAAA;AAED,IAAM,cAAc,GAAG,gBAAM,CAAC,GAAG,qKAAA,kGAKhC,IAAA,CAAA;AAED,IAAM,KAAK,GAAG,gBAAM,CAAC,GAAG,8LAAA,2HAOvB,IAAA,CAAA;AAED,IAAM,KAAK,GAAG,gBAAM,CAAC,GAAG,+JAAA,4FAKvB,IAAA,CAAA;AAED,IAAM,mBAAmB,GAAG,gBAAM,CAAC,GAAG,wYAAA,qUAarC,IAAA,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":";;AAAA,+BAAyB;AACzB,yCAAuC;AACvC,uDAAiD;AACjD,mCAgBiB;AAmBjB,IAAM,YAAY,GAAG,UAAC,EAWF;QAVlB,OAAO,aAAA,EACP,eAAmB,EAAnB,OAAO,mBAAG,SAAS,KAAA,EACnB,YAAc,EAAd,IAAI,mBAAG,OAAO,KAAA,EACd,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,MAAM,YAAA,EACN,iBAAiB,uBAAA,EACjB,SAAS,eAAA,EACT,YAAY,kBAAA,EACZ,WAAW,iBAAA;IAEH,IAAA,OAAO,GAAK,IAAA,uBAAQ,GAAE,QAAf,CAAe;IAC9B,IAAM,YAAY,GAAc,OAAO,KAAK,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA;IAE1E,IAAM,SAAS,GAAG,CAAC,iBAAiB,IAAI,CACtC,8BAAC,cAAK,IAAC,OAAO,EAAE,cAAM,OAAA,OAAO,EAAE,EAAT,CAAS;QAC7B,8BAAC,eAAS,IAAC,KAAK,EAAE,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,GAAI,CACvC,CACT,CAAA;IAED,IAAM,YAAY,GAAG;QACnB,QAAQ,OAAO,EAAE,CAAC;YAChB,KAAK,cAAc;gBACjB,OAAO,CACL;oBACE,8BAAC,6BAAoB,QAAE,SAAS,CAAwB;oBACxD,8BAAC,8BAAqB;wBACnB,YAAY,IAAI,CACf,8BAAC,4BAAmB,QAAE,YAAY,CAAuB,CAC1D;wBACA,KAAK,IAAI,8BAAC,sBAAa,QAAE,KAAK,CAAiB,CAC1B,CACvB,CACJ,CAAA;YAEH,KAAK,YAAY;gBACf,OAAO,CACL;oBACG,WAAW,IAAI,CACd,8BAAC,iCAAwB,QAAE,WAAW,CAA4B,CACnE;oBACA,KAAK,IAAI,CACR,8BAAC,2BAAkB;wBACjB,8BAAC,wBAAe,QAAE,KAAK,CAAmB,CACvB,CACtB,CACA,CACJ,CAAA;YAEH;gBACE,OAAO,CACL,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAC/B,8BAAC,oBAAW;oBACV,8BAAC,uBAAc;wBACb,8BAAC,cAAK,QAAE,KAAK,IAAI,EAAE,CAAS;wBAC3B,SAAS,CACK,CACL,CACf,CACF,CAAA;QACL,CAAC;IACH,CAAC,CAAA;IAED,OAAO,CACL,8BAAC,4BAAmB,IAAC,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS;QAC/D,YAAY,EAAE;QACf,8BAAC,kBAAS,QAAE,QAAQ,CAAa;QAChC,MAAM,IAAI,8BAAC,oBAAW,QAAE,MAAM,CAAe,CAC1B,CACvB,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,YAAY,CAAA"}

package/dist/components/Modal/styles.js

@@ -0,0 +1,42 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Close = exports.ModalFooter = exports.ModalBody = exports.NewFeatureTitle = exports.CenteredTitleFrame = exports.NewFeatureImageContainer = exports.CenteredTitle = exports.IllustrationWrapper = exports.IllustrationContainer = exports.IllustrationCloseBar = exports.Title = exports.TitleContainer = exports.ModalHeader = exports.ModalContentWrapper = void 0;
+var styled_1 = require("@emotion/styled");
+var fontStyles_1 = require("src/constants/fontStyles");
+var spacing_1 = require("src/constants/spacing");
+var WIDTH_MAP = {
+    small: '400px',
+    medium: '600px',
+};
+exports.ModalContentWrapper = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: calc(100vw - 32px);\n  max-width: ", ";\n  background: white;\n  box-shadow:\n    0px 20px 24px -4px rgba(10, 13, 18, 0.08),\n    0px 8px 8px -4px rgba(10, 13, 18, 0.03);\n  border-radius: 12px;\n  overflow: hidden;\n  -webkit-font-smoothing: antialiased;\n  margin-bottom: 1.7vh;\n  position: absolute;\n  top: 6.8vh;\n  left: 50%;\n  transform: translateX(-50%);\n"], ["\n  width: calc(100vw - 32px);\n  max-width: ", ";\n  background: white;\n  box-shadow:\n    0px 20px 24px -4px rgba(10, 13, 18, 0.08),\n    0px 8px 8px -4px rgba(10, 13, 18, 0.03);\n  border-radius: 12px;\n  overflow: hidden;\n  -webkit-font-smoothing: antialiased;\n  margin-bottom: 1.7vh;\n  position: absolute;\n  top: 6.8vh;\n  left: 50%;\n  transform: translateX(-50%);\n"
+    // ─── Default variant ───
+])), function (props) { return WIDTH_MAP[props.modalSize]; });
+// ─── Default variant ───
+exports.ModalHeader = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  padding: 16px ", ";\n"], ["\n  padding: 16px ", ";\n"])), spacing_1.LARGE_SPACING);
+exports.TitleContainer = styled_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding-top: 4px;\n  padding-bottom: 16px;\n  border-bottom: 1px solid #d8d8d8;\n"], ["\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding-top: 4px;\n  padding-bottom: 16px;\n  border-bottom: 1px solid #d8d8d8;\n"])));
+exports.Title = styled_1.default.h2(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  flex: 1 0 0;\n  min-width: 0;\n  margin: 0;\n  font-family: ", ";\n  font-weight: 700;\n  font-size: 20px;\n  line-height: 1;\n  color: #002b2a;\n"], ["\n  flex: 1 0 0;\n  min-width: 0;\n  margin: 0;\n  font-family: ", ";\n  font-weight: 700;\n  font-size: 20px;\n  line-height: 1;\n  color: #002b2a;\n"
+    // ─── Illustration variant ───
+])), fontStyles_1.SECONDARY_FONT);
+// ─── Illustration variant ───
+exports.IllustrationCloseBar = styled_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  padding: 16px ", ";\n  height: 56px;\n  box-sizing: border-box;\n"], ["\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  padding: 16px ", ";\n  height: 56px;\n  box-sizing: border-box;\n"])), spacing_1.LARGE_SPACING);
+exports.IllustrationContainer = styled_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding: 0 ", ";\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding: 0 ", ";\n"])), spacing_1.LARGE_SPACING);
+exports.IllustrationWrapper = styled_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  width: 160px;\n  height: 160px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"], ["\n  width: 160px;\n  height: 160px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"])));
+exports.CenteredTitle = styled_1.default.h2(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  margin: 16px 0 8px;\n  font-family: ", ";\n  font-weight: 700;\n  font-size: 20px;\n  line-height: 1.3;\n  color: #002b2a;\n  text-align: center;\n  width: 100%;\n"], ["\n  margin: 16px 0 8px;\n  font-family: ", ";\n  font-weight: 700;\n  font-size: 20px;\n  line-height: 1.3;\n  color: #002b2a;\n  text-align: center;\n  width: 100%;\n"
+    // ─── New Feature variant ───
+])), fontStyles_1.SECONDARY_FONT);
+// ─── New Feature variant ───
+exports.NewFeatureImageContainer = styled_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  padding: 40px ", " 0;\n  overflow: hidden;\n\n  img {\n    width: 100%;\n    display: block;\n    border-radius: 8px;\n  }\n"], ["\n  padding: 40px ", " 0;\n  overflow: hidden;\n\n  img {\n    width: 100%;\n    display: block;\n    border-radius: 8px;\n  }\n"])), spacing_1.LARGE_SPACING);
+exports.CenteredTitleFrame = styled_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  padding: 16px ", ";\n  text-align: center;\n"], ["\n  padding: 16px ", ";\n  text-align: center;\n"])), spacing_1.LARGE_SPACING);
+exports.NewFeatureTitle = styled_1.default.h2(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  margin: 0;\n  font-family: ", ";\n  font-weight: 700;\n  font-size: 20px;\n  line-height: 1.3;\n  color: #002b2a;\n"], ["\n  margin: 0;\n  font-family: ", ";\n  font-weight: 700;\n  font-size: 20px;\n  line-height: 1.3;\n  color: #002b2a;\n"
+    // ─── Shared ───
+])), fontStyles_1.SECONDARY_FONT);
+// ─── Shared ───
+exports.ModalBody = styled_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  padding: 0 ", " 16px;\n  font-family: ", ";\n  font-size: 14px;\n  line-height: 1.4;\n  color: #002b2a;\n"], ["\n  padding: 0 ", " 16px;\n  font-family: ", ";\n  font-size: 14px;\n  line-height: 1.4;\n  color: #002b2a;\n"])), spacing_1.LARGE_SPACING, fontStyles_1.MAIN_FONT);
+exports.ModalFooter = styled_1.default.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  background: #f6f7f9;\n  display: flex;\n  gap: 16px;\n  padding: ", ";\n\n  > * {\n    flex: 1 0 0;\n  }\n"], ["\n  background: #f6f7f9;\n  display: flex;\n  gap: 16px;\n  padding: ", ";\n\n  > * {\n    flex: 1 0 0;\n  }\n"])), spacing_1.LARGE_SPACING);
+exports.Close = styled_1.default.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  cursor: pointer;\n  flex-shrink: 0;\n"], ["\n  cursor: pointer;\n  flex-shrink: 0;\n"])));
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14;
+//# sourceMappingURL=styles.js.map

package/dist/components/Modal/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/Modal/styles.ts"],"names":[],"mappings":";;;;;;;AAAA,0CAAoC;AACpC,uDAAoE;AACpE,iDAAqD;AAIrD,IAAM,SAAS,GAA8B;IAC3C,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,OAAO;CAChB,CAAA;AAEY,QAAA,mBAAmB,GAAG,gBAAM,CAAC,GAAG,8bAA0B,+CAExD,EAAqC,0UAanD;IAED,0BAA0B;KAfX,UAAC,KAAK,IAAK,OAAA,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,EAA1B,CAA0B,EAanD;AAED,0BAA0B;AAEb,QAAA,WAAW,GAAG,gBAAM,CAAC,GAAG,8FAAA,oBACnB,EAAa,KAC9B,KADiB,uBAAa,EAC9B;AAEY,QAAA,cAAc,GAAG,gBAAM,CAAC,GAAG,kNAAA,+IAOvC,KAAA;AAEY,QAAA,KAAK,GAAG,gBAAM,CAAC,EAAE,2NAAA,kEAIb,EAAc,oFAK9B;IAED,+BAA+B;KAPd,2BAAc,EAK9B;AAED,+BAA+B;AAElB,QAAA,oBAAoB,GAAG,gBAAM,CAAC,GAAG,kNAAA,4FAI5B,EAAa,iDAG9B,KAHiB,uBAAa,EAG9B;AAEY,QAAA,qBAAqB,GAAG,gBAAM,CAAC,GAAG,gKAAA,sFAIhC,EAAa,KAC3B,KADc,uBAAa,EAC3B;AAEY,QAAA,mBAAmB,GAAG,gBAAM,CAAC,GAAG,gLAAA,6GAM5C,KAAA;AAEY,QAAA,aAAa,GAAG,gBAAM,CAAC,EAAE,4OAAA,0CAErB,EAAc,6HAO9B;IAED,8BAA8B;KATb,2BAAc,EAO9B;AAED,8BAA8B;AAEjB,QAAA,wBAAwB,GAAG,gBAAM,CAAC,GAAG,qMAAA,oBAChC,EAAa,4GAQ9B,KARiB,uBAAa,EAQ9B;AAEY,QAAA,kBAAkB,GAAG,gBAAM,CAAC,GAAG,uHAAA,oBAC1B,EAAa,4BAE9B,KAFiB,uBAAa,EAE9B;AAEY,QAAA,eAAe,GAAG,gBAAM,CAAC,EAAE,8LAAA,iCAEvB,EAAc,sFAK9B;IAED,iBAAiB;KAPA,2BAAc,EAK9B;AAED,iBAAiB;AAEJ,QAAA,SAAS,GAAG,gBAAM,CAAC,GAAG,oLAAA,iBACpB,EAAa,yBACX,EAAS,iEAIzB,KALc,uBAAa,EACX,sBAAS,EAIzB;AAEY,QAAA,WAAW,GAAG,gBAAM,CAAC,GAAG,qLAAA,uEAIxB,EAAa,uCAKzB,KALY,uBAAa,EAKzB;AAEY,QAAA,KAAK,GAAG,gBAAM,CAAC,GAAG,gHAAA,2CAG9B,KAAA"}

package/dist/components/Radio/index.js

@@ -32,9 +32,9 @@ var colors_1 = require("src/constants/Colors/colors");
 function RadioButton(_a) {
     var children = _a.children, disabled = _a.disabled, rest = __rest(_a, ["children", "disabled"]);
     var brand = (0, ThemeContext_1.useTheme)().brand;
-    var style = "\n    &.ant-radio-button-wrapper {\n      ".concat(!disabled ? "color: ".concat(ColorStyles_1.NEUTRAL_COLORS.BLACK, ";") : '', "\n      -webkit-font-smoothing: antialiased;\n      display: block;\n      width: 100%;\n      font-family: ").concat(TypographyStyles_1.MAIN_FONT, ";\n      font-weight: 400;\n      border-radius: 5px;\n      border: 1px solid ").concat(ColorStyles_1.NEUTRAL_COLORS.G200, ";\n      user-select: none;\n    }\n\n    .ant-radio-group-large &.ant-radio-button-wrapper {\n      height: 44px;\n    }\n\n    &.ant-radio-button-wrapper:first-child, &.ant-radio-button-wrapper:last-child {\n      border-radius: 5px;\n    }\n\n    &.ant-radio-button-wrapper:first-child:last-child {\n      border-radius: 5px;\n    }\n\n    .ant-radio-group &.ant-radio-button-wrapper {\n      font-size: 14px;\n    }\n\n    &.ant-radio-button-wrapper:not(:first-child)::before {\n      display: none;\n    }\n\n    &.ant-radio-button-wrapper:hover {\n      ").concat(!disabled
-        ? "\n        border-color: ".concat(brand.primary.default, ";\n        color: ").concat(ColorStyles_1.NEUTRAL_COLORS.BLACK, ";\n      ")
-        : '', "\n    }\n\n    &.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled),\n    &.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):hover,\n    &.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):first-child {\n      border: 2px solid ").concat(brand.primary.default, ";\n      color: ").concat(brand.primary.default, ";\n\n      circle {\n        transition: all 0.3s;\n      }\n\n      circle.center {\n        fill: ").concat(colors_1.GREEN.S500, ";\n      }\n\n      circle.border {\n        stroke: ").concat(brand.primary.default, ";\n      }\n    }\n\n    &.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):active {\n      border-color: ").concat(brand.primary.default, ";\n      color: ").concat(brand.primary.default, ";\n    }\n\n    &.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled).ant-radio-button-wrapper:first-child{\n      border-right-color: ").concat(ColorStyles_1.NEUTRAL_COLORS.BLACK, ";\n    }\n  ");
+    var style = "\n    &.ant-radio-button-wrapper {\n      ".concat(!disabled ? "color: ".concat(ColorStyles_1.NEUTRAL_COLORS.BLACK, " !important;") : '', "\n      -webkit-font-smoothing: antialiased !important;\n      display: block !important;\n      width: 100% !important;\n      font-family: ").concat(TypographyStyles_1.MAIN_FONT, " !important;\n      font-weight: 400 !important;\n      border-radius: 5px !important;\n      border: 1px solid ").concat(ColorStyles_1.NEUTRAL_COLORS.G200, " !important;\n      user-select: none !important;\n    }\n\n    .ant-radio-group-large &.ant-radio-button-wrapper {\n      height: 44px !important;\n    }\n\n    &.ant-radio-button-wrapper:first-child, &.ant-radio-button-wrapper:last-child {\n      border-radius: 5px !important;\n    }\n\n    &.ant-radio-button-wrapper:first-child:last-child {\n      border-radius: 5px !important;\n    }\n\n    .ant-radio-group &.ant-radio-button-wrapper {\n      font-size: 14px !important;\n    }\n\n    &.ant-radio-button-wrapper:not(:first-child)::before {\n      display: none !important;\n    }\n\n    &.ant-radio-button-wrapper:hover {\n      ").concat(!disabled
+        ? "\n        border-color: ".concat(brand.primary.default, " !important;\n        color: ").concat(ColorStyles_1.NEUTRAL_COLORS.BLACK, " !important;\n      ")
+        : '', "\n    }\n\n    &.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled),\n    &.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):hover,\n    &.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):first-child {\n      border: 2px solid ").concat(brand.primary.default, " !important;\n      color: ").concat(brand.primary.default, " !important;\n\n      circle {\n        transition: all 0.3s !important;\n      }\n\n      circle.center {\n        fill: ").concat(colors_1.GREEN.S500, " !important;\n      }\n\n      circle.border {\n        stroke: ").concat(brand.primary.default, " !important;\n      }\n    }\n\n    &.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):active {\n      border-color: ").concat(brand.primary.default, " !important;\n      color: ").concat(brand.primary.default, " !important;\n    }\n\n    &.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled).ant-radio-button-wrapper:first-child{\n      border-right-color: ").concat(ColorStyles_1.NEUTRAL_COLORS.BLACK, " !important;\n    }\n  ");
     return (react_1.default.createElement(antd_1.Radio.Button, __assign({ className: (0, emotion_1.css)(style), disabled: disabled }, rest),
         react_1.default.createElement("div", { style: {
                 display: 'flex',

package/dist/components/Radio/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Radio/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAAyB;AACzB,mCAA6B;AAC7B,6BAA4B;AAC5B,sDAAuD;AACvD,gEAAuD;AACvD,uDAAiD;AACjD,sDAAmD;AASnD,SAAS,WAAW,CAAC,EAAsC;IAApC,IAAA,QAAQ,cAAA,EAAE,QAAQ,cAAA,EAAK,IAAI,cAA7B,wBAA+B,CAAF;IACxC,IAAA,KAAK,GAAK,IAAA,uBAAQ,GAAE,MAAf,CAAe;IAE5B,IAAM,KAAK,GAAG,oDAER,CAAC,QAAQ,CAAC,CAAC,CAAC,iBAAU,4BAAc,CAAC,KAAK,MAAG,CAAC,CAAC,CAAC,EAAE,yHAIrC,4BAAS,4FAGJ,4BAAc,CAAC,IAAI,6jBA0BrC,CAAC,QAAQ;QACP,CAAC,CAAC,kCACY,KAAK,CAAC,OAAO,CAAC,OAAO,+BAC5B,4BAAc,CAAC,KAAK,cAC9B;QACG,CAAC,CAAC,EAAE,sTAOY,KAAK,CAAC,OAAO,CAAC,OAAO,6BAChC,KAAK,CAAC,OAAO,CAAC,OAAO,iHAOpB,cAAK,CAAC,IAAI,kEAIR,KAAK,CAAC,OAAO,CAAC,OAAO,+IAKjB,KAAK,CAAC,OAAO,CAAC,OAAO,6BAC5B,KAAK,CAAC,OAAO,CAAC,OAAO,yKAIR,4BAAc,CAAC,KAAK,iBAE7C,CAAA;IAED,OAAO,CACL,8BAAC,YAAK,CAAC,MAAM,aAAC,SAAS,EAAE,IAAA,aAAG,EAAC,KAAK,CAAC,EAAE,QAAQ,EAAE,QAAQ,IAAM,IAAI;QAC/D,uCACE,KAAK,EAAE;gBACL,OAAO,EAAE,MAAM;gBACf,MAAM,EAAE,MAAM;gBACd,UAAU,EAAE,QAAQ;aACrB;YAED,uCACE,KAAK,EAAE;oBACL,KAAK,EAAE,MAAM;oBACb,MAAM,EAAE,MAAM;oBACd,UAAU,EAAE,MAAM;oBAClB,WAAW,EAAE,MAAM;iBACpB;gBAED,uCACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B;oBAElC,0CACE,SAAS,EAAC,QAAQ,EAClB,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,IAAI,EACP,CAAC,EAAC,KAAK,EACP,MAAM,EAAC,SAAS,GAChB;oBACF,0CACE,SAAS,EAAC,QAAQ,EAClB,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,IAAI,EACP,CAAC,EAAC,GAAG,EACL,IAAI,EAAC,kBAAkB,GACvB,CACE,CACF;YACL,QAAQ,CACL,CACO,CAChB,CAAA;AACH,CAAC;AAED,kBAAe;IACb,KAAK,EAAE,UAAC,KAA+C,IAAK,OAAA,CAC1D,8BAAC,YAAK,CAAC,KAAK,aAAC,IAAI,EAAC,OAAO,EAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,IAAM,KAAK,EAAI,CAClE,EAF2D,CAE3D;IACD,MAAM,EAAE,WAAW;CACpB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Radio/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAAyB;AACzB,mCAA6B;AAC7B,6BAA4B;AAC5B,sDAAuD;AACvD,gEAAuD;AACvD,uDAAiD;AACjD,sDAAmD;AASnD,SAAS,WAAW,CAAC,EAAsC;IAApC,IAAA,QAAQ,cAAA,EAAE,QAAQ,cAAA,EAAK,IAAI,cAA7B,wBAA+B,CAAF;IACxC,IAAA,KAAK,GAAK,IAAA,uBAAQ,GAAE,MAAf,CAAe;IAE5B,IAAM,KAAK,GAAG,oDAER,CAAC,QAAQ,CAAC,CAAC,CAAC,iBAAU,4BAAc,CAAC,KAAK,iBAAc,CAAC,CAAC,CAAC,EAAE,0JAIhD,4BAAS,6HAGJ,4BAAc,CAAC,IAAI,0oBA0BrC,CAAC,QAAQ;QACP,CAAC,CAAC,kCACY,KAAK,CAAC,OAAO,CAAC,OAAO,0CAC5B,4BAAc,CAAC,KAAK,yBAC9B;QACG,CAAC,CAAC,EAAE,sTAOY,KAAK,CAAC,OAAO,CAAC,OAAO,wCAChC,KAAK,CAAC,OAAO,CAAC,OAAO,uIAOpB,cAAK,CAAC,IAAI,6EAIR,KAAK,CAAC,OAAO,CAAC,OAAO,0JAKjB,KAAK,CAAC,OAAO,CAAC,OAAO,wCAC5B,KAAK,CAAC,OAAO,CAAC,OAAO,oLAIR,4BAAc,CAAC,KAAK,4BAE7C,CAAA;IAED,OAAO,CACL,8BAAC,YAAK,CAAC,MAAM,aAAC,SAAS,EAAE,IAAA,aAAG,EAAC,KAAK,CAAC,EAAE,QAAQ,EAAE,QAAQ,IAAM,IAAI;QAC/D,uCACE,KAAK,EAAE;gBACL,OAAO,EAAE,MAAM;gBACf,MAAM,EAAE,MAAM;gBACd,UAAU,EAAE,QAAQ;aACrB;YAED,uCACE,KAAK,EAAE;oBACL,KAAK,EAAE,MAAM;oBACb,MAAM,EAAE,MAAM;oBACd,UAAU,EAAE,MAAM;oBAClB,WAAW,EAAE,MAAM;iBACpB;gBAED,uCACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B;oBAElC,0CACE,SAAS,EAAC,QAAQ,EAClB,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,IAAI,EACP,CAAC,EAAC,KAAK,EACP,MAAM,EAAC,SAAS,GAChB;oBACF,0CACE,SAAS,EAAC,QAAQ,EAClB,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,IAAI,EACP,CAAC,EAAC,GAAG,EACL,IAAI,EAAC,kBAAkB,GACvB,CACE,CACF;YACL,QAAQ,CACL,CACO,CAChB,CAAA;AACH,CAAC;AAED,kBAAe;IACb,KAAK,EAAE,UAAC,KAA+C,IAAK,OAAA,CAC1D,8BAAC,YAAK,CAAC,KAAK,aAAC,IAAI,EAAC,OAAO,EAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,IAAM,KAAK,EAAI,CAClE,EAF2D,CAE3D;IACD,MAAM,EAAE,WAAW;CACpB,CAAA"}

package/dist/components/RangePicker/index.js

@@ -25,14 +25,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = default_1;
 var react_1 = require("react");
 var emotion_1 = require("emotion");
-var antd_1 = require("antd");
+var momentDatePicker_1 = require("src/shared/momentDatePicker");
 var TypographyStyles_1 = require("src/shared/TypographyStyles");
-var ColorStyles_1 = require("src/shared/ColorStyles");
-var theme_1 = require("src/theme/theme");
+var ThemeContext_1 = require("src/theme/ThemeContext");
+var inputStyles_1 = require("../Input/inputStyles");
 function default_1(_a) {
-    var _b = _a.format, format = _b === void 0 ? 'DD/MM/YYYY' : _b, rest = __rest(_a, ["format"]);
-    var style = "\n    -webkit-font-smoothing: antialiased;\n    height: 36px;\n\n    &.ant-picker {\n      border-radius: 5px;\n      border-color: #E8E8E8;\n      transition: 0.3s all ease;\n\n      &:hover {\n        border-color: ".concat(theme_1.straitsXTheme.brand.primary.default, ";\n      }\n\n      &.ant-picker-focused {\n        border-color: ").concat(theme_1.straitsXTheme.brand.primary.default, ";\n        box-shadow: 0 0 0 2px ").concat(theme_1.straitsXTheme.brand.primary.background, ";\n      }\n\n      .ant-picker-active-bar {\n        background: ").concat(theme_1.straitsXTheme.brand.primary.default, ";\n      }\n    }\n\n\n    &.ant-picker > .ant-picker-input {\n      font-family: ").concat(TypographyStyles_1.MAIN_FONT, ";\n      font-style: normal;\n      font-weight: normal;\n      font-size: 14px;\n      line-height: 22px;\n      color: #121212;\n    }\n\n    & .ant-picker-input > input {\n      color: #121212;\n    }\n\n    & .ant-picker-input > input::placeholder {\n      color: ").concat(ColorStyles_1.NEUTRAL_COLORS.G400, ";\n    }\n  ");
-    var dropdownStyle = "\n    .ant-picker-cell.ant-picker-cell-in-view.ant-picker-cell-range-end > .ant-picker-cell-inner {\n      background-color: ".concat(theme_1.straitsXTheme.brand.primary.default, ";\n    }\n\n    .ant-picker-cell.ant-picker-cell-in-view.ant-picker-cell-range-start > .ant-picker-cell-inner {\n      background-color: ").concat(theme_1.straitsXTheme.brand.primary.default, ";\n    }\n\n    .ant-picker-cell.ant-picker-cell-in-view {\n      &.ant-picker-cell-in-range::before {\n        background-color: #F0FFF9;\n      }\n\n      &.ant-picker-cell-range-end::before {\n        background-color: #F0FFF9;\n      }\n\n      &.ant-picker-cell-range-start::before {\n        background-color: #F0FFF9;\n      }\n    } \n  ");
-    return (react_1.default.createElement(antd_1.DatePicker.RangePicker, __assign({ className: "".concat((0, emotion_1.css)(style)), format: format, popupClassName: (0, emotion_1.css)(dropdownStyle) }, rest)));
+    var _b = _a.format, format = _b === void 0 ? 'DD-MM-YYYY' : _b, _c = _a.size, size = _c === void 0 ? 'large' : _c, rest = __rest(_a, ["format", "size"]);
+    var theme = (0, ThemeContext_1.useTheme)();
+    var _d = inputStyles_1.SIZE_CONFIG[size], height = _d.height, borderRadius = _d.borderRadius, padding = _d.padding;
+    var style = "\n    -webkit-font-smoothing: antialiased;\n    height: ".concat(height, " !important;\n\n    &.ant-picker {\n      border-radius: ").concat(borderRadius, " !important;\n      border-color: ").concat(theme.color.base.line, " !important;\n      padding: ").concat(padding, " !important;\n      transition: 0.3s all ease !important;\n\n      &:hover {\n        border-color: ").concat(theme.color.base.primary2, " !important;\n      }\n\n      &.ant-picker-focused {\n        border-color: ").concat(theme.color.base.primary2, " !important;\n        box-shadow: none !important;\n        -webkit-box-shadow: none !important;\n      }\n\n      .ant-picker-active-bar {\n        background: ").concat(theme.color.base.primary2, " !important;\n      }\n    }\n\n\n    &.ant-picker > .ant-picker-input {\n      font-family: ").concat(TypographyStyles_1.MAIN_FONT, " !important;\n      font-style: normal !important;\n      font-weight: normal !important;\n      font-size: 14px !important;\n      line-height: 22px !important;\n      color: ").concat(theme.color.base.onNeutral, " !important;\n    }\n\n    & .ant-picker-input > input {\n      color: ").concat(theme.color.base.onNeutral, " !important;\n    }\n\n    & .ant-picker-input > input::placeholder {\n      color: ").concat(theme.color.component.placeholderInput, " !important;\n    }\n  ");
+    var dropdownStyle = "\n    .ant-picker-cell.ant-picker-cell-in-view.ant-picker-cell-range-end > .ant-picker-cell-inner {\n      background-color: ".concat(theme.color.base.primary2, " !important;\n    }\n\n    .ant-picker-cell.ant-picker-cell-in-view.ant-picker-cell-range-start > .ant-picker-cell-inner {\n      background-color: ").concat(theme.color.base.primary2, " !important;\n    }\n\n    .ant-picker-cell.ant-picker-cell-in-view {\n      &.ant-picker-cell-in-range::before {\n        background-color: ").concat(theme.color.interactive.selected, " !important;\n      }\n\n      &.ant-picker-cell-range-end::before {\n        background-color: ").concat(theme.color.interactive.selected, " !important;\n      }\n\n      &.ant-picker-cell-range-start::before {\n        background-color: ").concat(theme.color.interactive.selected, " !important;\n      }\n    }\n  ");
+    return (react_1.default.createElement(momentDatePicker_1.default.RangePicker, __assign({ className: "".concat((0, emotion_1.css)(style)), format: format, popupClassName: (0, emotion_1.css)(dropdownStyle) }, rest)));
 }
 //# sourceMappingURL=index.js.map

package/dist/components/RangePicker/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/RangePicker/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAuBA,4BA2EC;AAlGD,+BAAyB;AACzB,mCAA6B;AAC7B,6BAAiC;AACjC,gEAAuD;AACvD,sDAAuD;AACvD,yCAA+C;AAkB/C,mBAAyB,EAAyC;IAAvC,IAAA,cAAqB,EAArB,MAAM,mBAAG,YAAY,KAAA,EAAK,IAAI,cAAhC,UAAkC,CAAF;IACvD,IAAM,KAAK,GAAG,mOAUQ,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,+EAInC,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,8CAC3B,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,+EAIhD,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,+FAMpC,4BAAS,yRAaf,4BAAc,CAAC,IAAI,iBAE/B,CAAA;IAED,IAAM,aAAa,GAAG,uIAEE,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,sJAInC,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,8VAgB1D,CAAA;IAED,OAAO,CACL,8BAAC,iBAAU,CAAC,WAAW,aACrB,SAAS,EAAE,UAAG,IAAA,aAAG,EAAC,KAAK,CAAC,CAAE,EAC1B,MAAM,EAAE,MAAM,EACd,cAAc,EAAE,IAAA,aAAG,EAAC,aAAa,CAAC,IAC9B,IAAI,EACR,CACH,CAAA;AACH,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/RangePicker/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAwBA,4BAoFC;AA5GD,+BAAyB;AAEzB,mCAA6B;AAC7B,gEAA0D;AAC1D,gEAAuD;AACvD,uDAAiD;AACjD,oDAA6D;AAkB7D,mBAAyB,EAIjB;IAHN,IAAA,cAAqB,EAArB,MAAM,mBAAG,YAAY,KAAA,EACrB,YAAc,EAAd,IAAI,mBAAG,OAAO,KAAA,EACX,IAAI,cAHgB,kBAIxB,CADQ;IAEP,IAAM,KAAK,GAAG,IAAA,uBAAQ,GAAE,CAAA;IAClB,IAAA,KAAoC,yBAAW,CAAC,IAAI,CAAC,EAAnD,MAAM,YAAA,EAAE,YAAY,kBAAA,EAAE,OAAO,aAAsB,CAAA;IAE3D,IAAM,KAAK,GAAG,kEAEF,MAAM,sEAGG,YAAY,+CACb,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,0CAC1B,OAAO,iHAIA,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,QAAQ,0FAIzB,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,QAAQ,8KAM3B,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,QAAQ,0GAM1B,4BAAS,6LAKf,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,oFAI1B,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,iGAI1B,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,gBAAgB,4BAElD,CAAA;IAED,IAAM,aAAa,GAAG,uIAEE,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,QAAQ,iKAIzB,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,QAAQ,0JAKvB,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,QAAQ,6GAIhC,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,QAAQ,+GAIhC,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,QAAQ,qCAGzD,CAAA;IAED,OAAO,CACL,8BAAC,0BAAgB,CAAC,WAAW,aAC3B,SAAS,EAAE,UAAG,IAAA,aAAG,EAAC,KAAK,CAAC,CAAE,EAC1B,MAAM,EAAE,MAAM,EACd,cAAc,EAAE,IAAA,aAAG,EAAC,aAAa,CAAC,IAC9B,IAAI,EACR,CACH,CAAA;AACH,CAAC"}

package/dist/components/Select/const.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OPTIONS_TEXT_SIZE = exports.PLACEHOLDER_TEXT_SIZE = void 0;
+exports.PLACEHOLDER_TEXT_SIZE = {
+    sm: 'md',
+    lg: 'lg',
+};
+exports.OPTIONS_TEXT_SIZE = {
+    sm: 'md',
+    lg: 'lg',
+};
+//# sourceMappingURL=const.js.map

package/dist/components/Select/const.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"const.js","sourceRoot":"","sources":["../../../src/components/Select/const.ts"],"names":[],"mappings":";;;AAAa,QAAA,qBAAqB,GAAG;IACnC,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;CACA,CAAA;AAEG,QAAA,iBAAiB,GAAG;IAC/B,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;CACA,CAAA"}

package/dist/components/Select/helpers.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getCustomSelectTag = exports.renderHelperText = exports.renderOptions = exports.getPlaceholder = exports.renderLabel = exports.getSuffixIcon = void 0;
+var react_1 = require("react");
+var theme_1 = require("src/theme/theme");
+var antd_1 = require("antd");
+var index_1 = require("src/components/Tooltip/index");
+var Tag_1 = require("src/components/Tag");
+var Typography_1 = require("src/constants/Typography/Typography");
+var MaterialSymbols_1 = require("src/icons/MaterialSymbols");
+var style_1 = require("./style");
+var const_1 = require("./const");
+var getSuffixIcon = function (secondaryText) { return (react_1.default.createElement(react_1.default.Fragment, null,
+    secondaryText && (react_1.default.createElement(Typography_1.Typography.Body, { color: theme_1.straitsXTheme.color.base.onNeutralSecondary, size: "sm" }, secondaryText)),
+    react_1.default.createElement(MaterialSymbols_1.MaterialSymbols, { icon: "keyboard_arrow_down" }))); };
+exports.getSuffixIcon = getSuffixIcon;
+var renderLabel = function (label, tooltip) {
+    return label ? (react_1.default.createElement(style_1.LabelContainer, null,
+        react_1.default.createElement(Typography_1.Typography.Body, { size: "md" }, label),
+        tooltip ? (react_1.default.createElement(index_1.default, { placement: "top", title: "I'm Tooltip Component", content: tooltip },
+            react_1.default.createElement("span", null,
+                react_1.default.createElement(MaterialSymbols_1.MaterialSymbols, { icon: "info", size: "xs" })))) : null)) : null;
+};
+exports.renderLabel = renderLabel;
+var getPlaceholder = function (size, placeholder) {
+    return placeholder ? (react_1.default.createElement(Typography_1.Typography.Body, { size: const_1.PLACEHOLDER_TEXT_SIZE[size] }, placeholder)) : null;
+};
+exports.getPlaceholder = getPlaceholder;
+var renderOptions = function (options, size) {
+    return options.map(function (_a) {
+        var value = _a.value, label = _a.label, Icon = _a.icon, disabled = _a.disabled;
+        return (react_1.default.createElement(antd_1.Select.Option, { key: value, value: value, disabled: disabled },
+            react_1.default.createElement(style_1.OptionContainer, null,
+                Icon && react_1.default.createElement(Icon, { style: { width: '16px', height: '16px' } }),
+                react_1.default.createElement(Typography_1.Typography.Body, { size: const_1.OPTIONS_TEXT_SIZE[size] }, label))));
+    });
+};
+exports.renderOptions = renderOptions;
+var renderHelperText = function (helperText) {
+    return helperText ? (react_1.default.createElement(Typography_1.Typography.Body, { color: theme_1.straitsXTheme.color.base.onNeutralSecondary, size: "sm" }, helperText)) : null;
+};
+exports.renderHelperText = renderHelperText;
+var getCustomSelectTag = function (mode, disabled, size) {
+    return mode === 'multiple'
+        ? function (_a) {
+            var label = _a.label, onClose = _a.onClose;
+            return (react_1.default.createElement(Tag_1.default, { type: disabled ? 'disabled' : 'positive', variant: "removable", size: size, onClick: disabled ? undefined : onClose }, label));
+        }
+        : undefined;
+};
+exports.getCustomSelectTag = getCustomSelectTag;
+//# sourceMappingURL=helpers.js.map

package/dist/components/Select/helpers.js.map

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

package/dist/components/Select/index.js

@@ -1,8 +1,4 @@
 "use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -27,31 +23,20 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = require("react");
-var emotion_1 = require("emotion");
 var antd_1 = require("antd");
-var Typography_1 = require("src/components/Typography");
-var ThemeContext_1 = require("src/theme/ThemeContext");
-var ColorStyles_1 = require("src/shared/ColorStyles");
-var TypographyStyles_1 = require("src/shared/TypographyStyles");
+var Typography_1 = require("src/constants/Typography/Typography");
+var helpers_1 = require("./helpers");
 var style_1 = require("./style");
-(0, emotion_1.injectGlobal)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  .ant-select-dropdown .ant-select-item-option {\n    -webkit-font-smoothing: antialiased;\n    color: ", ";\n    font-family: ", ";\n    font-size: ", ";\n    font-weight: 400;\n    padding-top: 10px;\n    padding-bottom: 10px;\n  }\n\n  .ant-select-dropdown .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {\n    font-weight: 500;\n  }\n\n  div.ant-select-dropdown {\n    border-radius: 5px;\n    max-height: 100vh;\n    overflow-y: scroll;\n  }\n"], ["\n  .ant-select-dropdown .ant-select-item-option {\n    -webkit-font-smoothing: antialiased;\n    color: ", ";\n    font-family: ", ";\n    font-size: ", ";\n    font-weight: 400;\n    padding-top: 10px;\n    padding-bottom: 10px;\n  }\n\n  .ant-select-dropdown .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {\n    font-weight: 500;\n  }\n\n  div.ant-select-dropdown {\n    border-radius: 5px;\n    max-height: 100vh;\n    overflow-y: scroll;\n  }\n"])), ColorStyles_1.MAIN_COLORS.PRIMARY_BLACK, TypographyStyles_1.MAIN_FONT, TypographyStyles_1.FONT_SIZE.P1);
 var Select = function (_a) {
-    var _b = _a.className, className = _b === void 0 ? '' : _b, children = _a.children, _c = _a.disabled, disabled = _c === void 0 ? false : _c, type = _a.type, mode = _a.mode, label = _a.label, selectRef = _a.selectRef, rest = __rest(_a, ["className", "children", "disabled", "type", "mode", "label", "selectRef"]);
-    var _d = (0, ThemeContext_1.useTheme)(), spacing = _d.spacing, brand = _d.brand;
-    (0, emotion_1.injectGlobal)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    .ant-select-dropdown .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {\n      background-color: #F0FFF9 /* ", " */;\n\n      .ant-select-item-option-state {\n        color: #00D37E /* ", " */;\n\n        &:hover {\n          border-color: ", ";\n        }\n  \n        &.ant-picker-focused {\n          border-color: ", ";\n        }\n  \n        .ant-picker-active-bar {\n          background: ", ";\n        }\n      }\n    }\n  "], ["\n    .ant-select-dropdown .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {\n      background-color: #F0FFF9 /* ", " */;\n\n      .ant-select-item-option-state {\n        color: #00D37E /* ", " */;\n\n        &:hover {\n          border-color: ", ";\n        }\n  \n        &.ant-picker-focused {\n          border-color: ", ";\n        }\n  \n        .ant-picker-active-bar {\n          background: ", ";\n        }\n      }\n    }\n  "])), brand.primary.background, brand.primary.illustration, brand.primary.default, brand.primary.default, brand.primary.default);
-    var styleString = (0, style_1.default)({ mode: mode, disabled: disabled, type: type });
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        label && react_1.default.createElement(Typography_1.P1Bold, { style: { marginBottom: spacing.xs } }, label),
-        react_1.default.createElement(antd_1.Select, __assign({ className: "".concat((0, emotion_1.css)(styleString), " ").concat(className), disabled: disabled, mode: mode, ref: selectRef }, rest), children)));
-};
-Select.Tag = function (_a) {
-    var _b = _a.className, className = _b === void 0 ? '' : _b, props = __rest(_a, ["className"]);
-    var primary = (0, ThemeContext_1.useTheme)().brand.primary;
-    var tagStyle = "\n    height: 28px;\n    color: #FFFFFF;\n    background: ".concat(primary.default, ";\n    border-radius: 23px;\n    border: 0;\n    display: inline-flex;\n    align-items: center;\n    font-style: normal;\n    font-weight: normal;\n    font-size: 14px;\n    line-height: 20px;\n    padding-left: 10px;\n    cursor: pointer;\n    font-family: ").concat(TypographyStyles_1.MAIN_FONT, ";\n    padding-right: 10px;\n    margin-right: 4px;\n\n    &:hover {\n      opacity: 1;\n    }\n\n    &.ant-tag .anticon-close {\n      color: white;\n      margin-left: 5px;\n      margin-top: 0px;\n    }\n  ");
-    return react_1.default.createElement(antd_1.Tag, __assign({ className: "".concat((0, emotion_1.css)(tagStyle), " ").concat(className) }, props));
+    var children = _a.children, _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.size, size = _c === void 0 ? 'sm' : _c, mode = _a.mode, label = _a.label, labelTooltip = _a.labelTooltip, selectRef = _a.selectRef, placeholder = _a.placeholder, _d = _a.error, error = _d === void 0 ? false : _d, secondaryText = _a.secondaryText, helperText = _a.helperText, options = _a.options, rest = __rest(_a, ["children", "disabled", "size", "mode", "label", "labelTooltip", "selectRef", "placeholder", "error", "secondaryText", "helperText", "options"]);
+    var internalRef = (0, react_1.useRef)(null);
+    var ref = selectRef || internalRef;
+    return (react_1.default.createElement(style_1.SelectContainer, null,
+        label && (0, helpers_1.renderLabel)(label, labelTooltip),
+        react_1.default.createElement(style_1.StyledAntSelect, __assign({ disabled: disabled, mode: mode, ref: ref, "$size": size, "$mode": mode, getPopupContainer: function () { return document.body; } }, rest, { error: error, dropdownRender: function (menu) { return (react_1.default.createElement(style_1.StyledDropdown, { "$size": size },
+                react_1.default.createElement(Typography_1.Typography.Body, { size: size === 'sm' ? 'md' : 'lg' }, menu))); }, dropdownStyle: style_1.dropdownStyle, suffixIcon: (0, helpers_1.getSuffixIcon)(secondaryText), placeholder: (0, helpers_1.getPlaceholder)(size, placeholder), showArrow: true, tagRender: (0, helpers_1.getCustomSelectTag)(mode, disabled, size), maxTagCount: 999 }), options ? (0, helpers_1.renderOptions)(options, size) : children),
+        (0, helpers_1.renderHelperText)(helperText)));
 };
-Select.OptGroup = antd_1.Select.OptGroup;
 Select.Option = antd_1.Select.Option;
 exports.default = Select;
-var templateObject_1, templateObject_2;
 //# sourceMappingURL=index.js.map

package/dist/components/Select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAAwC;AACxC,mCAA2C;AAC3C,6BAAsE;AAEtE,wDAAkD;AAClD,uDAAiD;AACjD,sDAAoD;AACpD,gEAAkE;AAElE,iCAA2B;AAE3B,IAAA,sBAAY,giBAAA,2GAGC,EAAyB,sBACnB,EAAS,oBACX,EAAY,iUAe5B,KAjBY,yBAAW,CAAC,aAAa,EACnB,4BAAS,EACX,4BAAS,CAAC,EAAE,EAe5B;AAoBD,IAAM,MAAM,GAAG,UAAU,EASjB;IARN,IAAA,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACd,QAAQ,cAAA,EACR,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAChB,IAAI,UAAA,EACJ,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,SAAS,eAAA,EACN,IAAI,cARgB,2EASxB,CADQ;IAED,IAAA,KAAqB,IAAA,uBAAQ,GAAE,EAA7B,OAAO,aAAA,EAAE,KAAK,WAAe,CAAA;IAErC,IAAA,sBAAY,khBAAA,0IAEuB,EAAwB,2EAGjC,EAA0B,qDAG5B,EAAqB,4EAIrB,EAAqB,4EAIvB,EAAqB,kCAI1C,KAlBkC,KAAK,CAAC,OAAO,CAAC,UAAU,EAGjC,KAAK,CAAC,OAAO,CAAC,YAAY,EAG5B,KAAK,CAAC,OAAO,CAAC,OAAO,EAIrB,KAAK,CAAC,OAAO,CAAC,OAAO,EAIvB,KAAK,CAAC,OAAO,CAAC,OAAO,EAI1C;IAED,IAAM,WAAW,GAAG,IAAA,eAAK,EAAC,EAAE,IAAI,MAAA,EAAE,QAAQ,UAAA,EAAE,IAAI,MAAA,EAAE,CAAC,CAAA;IAEnD,OAAO,CACL;QACG,KAAK,IAAI,8BAAC,mBAAM,IAAC,KAAK,EAAE,EAAE,YAAY,EAAE,OAAO,CAAC,EAAE,EAAE,IAAG,KAAK,CAAU;QACvE,8BAAC,aAAS,aACR,SAAS,EAAE,UAAG,IAAA,aAAG,EAAC,WAAW,CAAC,cAAI,SAAS,CAAE,EAC7C,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,SAAS,IACV,IAAI,GAEP,QAAQ,CACC,CACX,CACJ,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,GAAG,GAAG,UAAU,EAMtB;IALC,IAAA,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA,EACX,KAAK,cAFa,aAGtB,CADS;IAMG,IAAA,OAAO,GACd,IAAA,uBAAQ,GAAE,cADI,CACJ;IAEd,IAAM,QAAQ,GAAG,oEAGD,OAAO,CAAC,OAAO,gRAWd,4BAAS,sNAazB,CAAA;IACD,OAAO,8BAAC,UAAM,aAAC,SAAS,EAAE,UAAG,IAAA,aAAG,EAAC,QAAQ,CAAC,cAAI,SAAS,CAAE,IAAM,KAAK,EAAI,CAAA;AAC1E,CAAC,CAAA;AAED,MAAM,CAAC,QAAQ,GAAG,aAAS,CAAC,QAAQ,CAAA;AACpC,MAAM,CAAC,MAAM,GAAG,aAAS,CAAC,MAAM,CAAA;AAEhC,kBAAe,MAAM,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAAgD;AAChD,6BAAuD;AAGvD,kEAAgE;AAChE,qCAOkB;AAClB,iCAKgB;AAyBhB,IAAM,MAAM,GAAG,UAAU,EAcjB;IAbN,IAAA,QAAQ,cAAA,EACR,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAChB,YAAW,EAAX,IAAI,mBAAG,IAAI,KAAA,EACX,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,YAAY,kBAAA,EACZ,SAAS,eAAA,EACT,WAAW,iBAAA,EACX,aAAa,EAAb,KAAK,mBAAG,KAAK,KAAA,EACb,aAAa,mBAAA,EACb,UAAU,gBAAA,EACV,OAAO,aAAA,EACJ,IAAI,cAbgB,gJAcxB,CADQ;IAEP,IAAM,WAAW,GAAG,IAAA,cAAM,EAAgB,IAAI,CAAC,CAAA;IAC/C,IAAM,GAAG,GAAG,SAAS,IAAI,WAAW,CAAA;IAEpC,OAAO,CACL,8BAAC,uBAAe;QACb,KAAK,IAAI,IAAA,qBAAW,EAAC,KAAK,EAAE,YAAY,CAAC;QAC1C,8BAAC,uBAAe,aACd,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAAG,WACD,IAAI,WACJ,IAAI,EACX,iBAAiB,EAAE,cAAM,OAAA,QAAQ,CAAC,IAAI,EAAb,CAAa,IAClC,IAAI,IACR,KAAK,EAAE,KAAK,EACZ,cAAc,EAAE,UAAC,IAAI,IAAK,OAAA,CACxB,8BAAC,sBAAc,aAAQ,IAAI;gBACzB,8BAAC,uBAAU,CAAC,IAAI,IAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,IAC/C,IAAI,CACW,CACH,CAClB,EANyB,CAMzB,EACD,aAAa,EAAE,qBAAa,EAC5B,UAAU,EAAE,IAAA,uBAAa,EAAC,aAAa,CAAC,EACxC,WAAW,EAAE,IAAA,wBAAc,EAAC,IAAI,EAAE,WAAW,CAAC,EAC9C,SAAS,QACT,SAAS,EAAE,IAAA,4BAAkB,EAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,EACnD,WAAW,EAAE,GAAG,KAEf,OAAO,CAAC,CAAC,CAAC,IAAA,uBAAa,EAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,CAClC;QACjB,IAAA,0BAAgB,EAAC,UAAU,CAAC,CACb,CACnB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,GAAG,aAAS,CAAC,MAAM,CAAA;AAChC,kBAAe,MAAM,CAAA"}