npm - pds-dev-kit-web-test - Versions diffs - 0.1.0 → 0.1.2 - Mend

pds-dev-kit-web-test 0.1.0 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (397) hide show

package/dist/src/mobile/components/TextLabel/TextLabel.js CHANGED Viewed

@@ -30,8 +30,8 @@ var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importStar(require("styled-components"));
 var hybrid_1 = require("../../../hybrid");
 function TextLabel(_a) {
-    var text = _a.text, _b = _a.textAlign, textAlign = _b === void 0 ? 'left' : _b, _c = _a.styleTheme, styleTheme = _c === void 0 ? 'body2Bold' : _c, colorOverride = _a.colorOverride, _d = _a.colorTheme, colorTheme = _d === void 0 ? 'sysTextPrimary' : _d, _e = _a.singleLineMode, singleLineMode = _e === void 0 ? 'none' : _e, _f = _a.ellipsisMode, ellipsisMode = _f === void 0 ? 'none' : _f, lineLimit = _a.lineLimit, _g = _a.userSelectMode, userSelectMode = _g === void 0 ? 'none' : _g, customFontSize = _a.customFontSize, customFontWeight = _a.customFontWeight, _h = _a.textDecorationType, textDecorationType = _h === void 0 ? 'none' : _h, _j = _a.requirementMode, requirementMode = _j === void 0 ? 'none' : _j, _k = _a.bulletPointMode, bulletPointMode = _k === void 0 ? 'none' : _k, _l = _a.wordBreak, wordBreak = _l === void 0 ? 'keep_all' : _l;
-    return (react_1.default.createElement(S_TextLabel, { "x-pds-name": "TextLabel", "x-pds-element-type": "component", "x-pds-device-type": "mobile", textAlign: textAlign, styleTheme: styleTheme, colorOverride: colorOverride, colorTheme: colorTheme, singleLineMode: singleLineMode, ellipsisMode: ellipsisMode, lineLimit: lineLimit, userSelectMode: userSelectMode, customFontSize: customFontSize, customFontWeight: customFontWeight, textDecorationType: textDecorationType, bulletPointMode: bulletPointMode, wordBreak: wordBreak },
+    var text = _a.text, _b = _a.textAlign, textAlign = _b === void 0 ? 'left' : _b, _c = _a.styleTheme, styleTheme = _c === void 0 ? 'body2Bold' : _c, colorOverride = _a.colorOverride, _d = _a.colorTheme, colorTheme = _d === void 0 ? 'sysTextPrimary' : _d, _e = _a.singleLineMode, singleLineMode = _e === void 0 ? 'none' : _e, _f = _a.ellipsisMode, ellipsisMode = _f === void 0 ? 'none' : _f, lineLimit = _a.lineLimit, _g = _a.userSelectMode, userSelectMode = _g === void 0 ? 'none' : _g, customFontSize = _a.customFontSize, customFontWeight = _a.customFontWeight, _h = _a.textDecorationType, textDecorationType = _h === void 0 ? 'none' : _h, _j = _a.requirementMode, requirementMode = _j === void 0 ? 'none' : _j, _k = _a.bulletPointMode, bulletPointMode = _k === void 0 ? 'none' : _k, _l = _a.wordBreak, wordBreak = _l === void 0 ? 'keep_all' : _l, letterSpacing = _a.letterSpacing;
+    return (react_1.default.createElement(S_TextLabel, { "x-pds-name": "TextLabel", "x-pds-element-type": "component", "x-pds-device-type": "mobile", textAlign: textAlign, styleTheme: styleTheme, colorOverride: colorOverride, colorTheme: colorTheme, singleLineMode: singleLineMode, ellipsisMode: ellipsisMode, lineLimit: lineLimit, userSelectMode: userSelectMode, customFontSize: customFontSize, customFontWeight: customFontWeight, textDecorationType: textDecorationType, bulletPointMode: bulletPointMode, wordBreak: wordBreak, "$letterSpacing": letterSpacing },
         text,
         requirementMode === 'use' && (react_1.default.createElement(S_AfterTextBox, { styleTheme: styleTheme },
             react_1.default.createElement(S_IconWrapper, null,
@@ -47,7 +47,17 @@ var displayBold = (0, styled_components_1.css)(templateObject_1 || (templateObje
     var theme = _a.theme;
     return theme.fontWeight.bold;
 });
-var headingBold = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var wizardPageTitleBold = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.mobileFontSize.wizardPageTitle;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.mobileLineHeight.wizardPageTitle;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.fontWeight.bold;
+});
+var headingBold = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.heading;
 }, function (_a) {
@@ -57,7 +67,7 @@ var headingBold = (0, styled_components_1.css)(templateObject_2 || (templateObje
     var theme = _a.theme;
     return theme.fontWeight.bold;
 });
-var leadParaBold = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var leadParaBold = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.leadParagraph;
 }, function (_a) {
@@ -67,7 +77,7 @@ var leadParaBold = (0, styled_components_1.css)(templateObject_3 || (templateObj
     var theme = _a.theme;
     return theme.fontWeight.bold;
 });
-var leadParaRegular = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var leadParaRegular = (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.leadParagraph;
 }, function (_a) {
@@ -77,7 +87,7 @@ var leadParaRegular = (0, styled_components_1.css)(templateObject_4 || (template
     var theme = _a.theme;
     return theme.fontWeight.normal;
 });
-var subTitleBold = (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var subTitleBold = (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.subtitle;
 }, function (_a) {
@@ -87,7 +97,7 @@ var subTitleBold = (0, styled_components_1.css)(templateObject_5 || (templateObj
     var theme = _a.theme;
     return theme.fontWeight.bold;
 });
-var subTitleRegular = (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var subTitleRegular = (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.subtitle;
 }, function (_a) {
@@ -97,7 +107,7 @@ var subTitleRegular = (0, styled_components_1.css)(templateObject_6 || (template
     var theme = _a.theme;
     return theme.fontWeight.normal;
 });
-var body1Bold = (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var body1Bold = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.body1;
 }, function (_a) {
@@ -107,7 +117,7 @@ var body1Bold = (0, styled_components_1.css)(templateObject_7 || (templateObject
     var theme = _a.theme;
     return theme.fontWeight.bold;
 });
-var body1Regular = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var body1Regular = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.body1;
 }, function (_a) {
@@ -117,7 +127,7 @@ var body1Regular = (0, styled_components_1.css)(templateObject_8 || (templateObj
     var theme = _a.theme;
     return theme.fontWeight.normal;
 });
-var body2Bold = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var body2Bold = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.body2;
 }, function (_a) {
@@ -127,7 +137,7 @@ var body2Bold = (0, styled_components_1.css)(templateObject_9 || (templateObject
     var theme = _a.theme;
     return theme.fontWeight.bold;
 });
-var body2Regular = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var body2Regular = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.body2;
 }, function (_a) {
@@ -137,7 +147,7 @@ var body2Regular = (0, styled_components_1.css)(templateObject_10 || (templateOb
     var theme = _a.theme;
     return theme.fontWeight.normal;
 });
-var caption1Bold = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var caption1Bold = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.caption1;
 }, function (_a) {
@@ -147,7 +157,7 @@ var caption1Bold = (0, styled_components_1.css)(templateObject_11 || (templateOb
     var theme = _a.theme;
     return theme.fontWeight.bold;
 });
-var caption1Regular = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var caption1Regular = (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.caption1;
 }, function (_a) {
@@ -157,7 +167,7 @@ var caption1Regular = (0, styled_components_1.css)(templateObject_12 || (templat
     var theme = _a.theme;
     return theme.fontWeight.normal;
 });
-var caption2Bold = (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var caption2Bold = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.caption2;
 }, function (_a) {
@@ -167,7 +177,7 @@ var caption2Bold = (0, styled_components_1.css)(templateObject_13 || (templateOb
     var theme = _a.theme;
     return theme.fontWeight.bold;
 });
-var caption2Regular = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var caption2Regular = (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.caption2;
 }, function (_a) {
@@ -177,7 +187,7 @@ var caption2Regular = (0, styled_components_1.css)(templateObject_14 || (templat
     var theme = _a.theme;
     return theme.fontWeight.normal;
 });
-var form1Regular = (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var form1Regular = (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.form1;
 }, function (_a) {
@@ -187,7 +197,7 @@ var form1Regular = (0, styled_components_1.css)(templateObject_15 || (templateOb
     var theme = _a.theme;
     return theme.fontWeight.normal;
 });
-var form2Regular = (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var form2Regular = (0, styled_components_1.css)(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.form2;
 }, function (_a) {
@@ -197,7 +207,7 @@ var form2Regular = (0, styled_components_1.css)(templateObject_16 || (templateOb
     var theme = _a.theme;
     return theme.fontWeight.normal;
 });
-var blog1Regular = (0, styled_components_1.css)(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
+var blog1Regular = (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.mobileFontSize.blog1;
 }, function (_a) {
@@ -207,68 +217,72 @@ var blog1Regular = (0, styled_components_1.css)(templateObject_17 || (templateOb
     var theme = _a.theme;
     return theme.fontWeight.normal;
 });
-var sysTextPrimary = (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var sysTextPrimary = (0, styled_components_1.css)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_textlabel_sys_primary;
 });
-var sysTextSecondary = (0, styled_components_1.css)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var sysTextSecondary = (0, styled_components_1.css)(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_textlabel_sys_secondary;
 });
-var sysTextTertiary = (0, styled_components_1.css)(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var sysTextTertiary = (0, styled_components_1.css)(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_textlabel_sys_tertiary;
 });
-var sysTextWhite = (0, styled_components_1.css)(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var sysTextWhite = (0, styled_components_1.css)(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_textlabel_sys_white;
 });
-var sysTextError = (0, styled_components_1.css)(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var sysTextBlack = (0, styled_components_1.css)(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.ui_cpnt_textlabel_sys_black;
+});
+var sysTextError = (0, styled_components_1.css)(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_textlabel_sys_error;
 });
-var sysTextWarning = (0, styled_components_1.css)(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var sysTextWarning = (0, styled_components_1.css)(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_textlabel_sys_warning;
 });
-var sysTextBrandPrimary = (0, styled_components_1.css)(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var sysTextBrandPrimary = (0, styled_components_1.css)(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_textlabel_sys_brandprimary;
 });
-var sysTextBrandSeconVariant = (0, styled_components_1.css)(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var sysTextBrandSeconVariant = (0, styled_components_1.css)(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_textlabel_sys_brandseconvariant;
 });
-var usrTextBrandPrimary = (0, styled_components_1.css)(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var usrTextBrandPrimary = (0, styled_components_1.css)(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_textlabel_usr_brandprimary;
 });
-var usrTextBrandSeconVariant = (0, styled_components_1.css)(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var usrTextBrandSeconVariant = (0, styled_components_1.css)(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_textlabel_usr_brandseconvariant;
 });
-var usrTextBrandOnPrimary = (0, styled_components_1.css)(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var usrTextBrandOnPrimary = (0, styled_components_1.css)(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_textlabel_usr_brandonprimary;
 });
-var customFontStyle = (0, styled_components_1.css)(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: 1.5;\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: 1.5;\n  font-weight: ", ";\n"])), function (_a) {
+var customFontStyle = (0, styled_components_1.css)(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n  font-size: ", ";\n  line-height: 1.5;\n  font-weight: ", ";\n"], ["\n  font-size: ", ";\n  line-height: 1.5;\n  font-weight: ", ";\n"])), function (_a) {
     var customFontSize = _a.customFontSize;
     return customFontSize;
 }, function (_a) {
     var theme = _a.theme, customFontWeight = _a.customFontWeight;
     return customFontWeight === 'bold' ? theme.fontWeight.bold : theme.fontWeight.normal;
 });
-var colorOverrideStyle = (0, styled_components_1.css)(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var colorOverrideStyle = (0, styled_components_1.css)(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var colorOverride = _a.colorOverride, theme = _a.theme;
     return colorOverride && theme[colorOverride];
 });
-var ellipsisStyle = (0, styled_components_1.css)(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n  -webkit-box-orient: vertical;\n  display: -webkit-box;\n  -webkit-line-clamp: ", ";\n  overflow: hidden;\n  text-overflow: ellipsis;\n"], ["\n  -webkit-box-orient: vertical;\n  display: -webkit-box;\n  -webkit-line-clamp: ", ";\n  overflow: hidden;\n  text-overflow: ellipsis;\n"])), function (_a) {
+var ellipsisStyle = (0, styled_components_1.css)(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n  -webkit-box-orient: vertical;\n  display: -webkit-box;\n  -webkit-line-clamp: ", ";\n  overflow: hidden;\n  text-overflow: ellipsis;\n"], ["\n  -webkit-box-orient: vertical;\n  display: -webkit-box;\n  -webkit-line-clamp: ", ";\n  overflow: hidden;\n  text-overflow: ellipsis;\n"])), function (_a) {
     var lineLimit = _a.lineLimit;
     return lineLimit;
 });
-var userSelectModeStyle = (0, styled_components_1.css)(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n  -ms-user-select: none;\n  -moz-user-select: -moz-none;\n  -khtml-user-select: none;\n  -webkit-user-select: none;\n  user-select: none;\n"], ["\n  -ms-user-select: none;\n  -moz-user-select: -moz-none;\n  -khtml-user-select: none;\n  -webkit-user-select: none;\n  user-select: none;\n"])));
-var bulletPointModeStyle = (0, styled_components_1.css)(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n  padding-left: 16px;\n  ::before {\n    content: '\u2022';\n    position: absolute;\n    left: 0;\n    width: 16px;\n  }\n"], ["\n  padding-left: 16px;\n  ::before {\n    content: '\u2022';\n    position: absolute;\n    left: 0;\n    width: 16px;\n  }\n"])));
-var S_TextLabel = styled_components_1.default.div(templateObject_34 || (templateObject_34 = __makeTemplateObject(["\n  box-sizing: border-box;\n  text-align: ", ";\n  white-space: pre-wrap;\n  word-break: ", ";\n  overflow-wrap: break-word;\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"], ["\n  box-sizing: border-box;\n  text-align: ", ";\n  white-space: pre-wrap;\n  word-break: ", ";\n  overflow-wrap: break-word;\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"])), function (_a) {
+var userSelectModeStyle = (0, styled_components_1.css)(templateObject_34 || (templateObject_34 = __makeTemplateObject(["\n  -ms-user-select: none;\n  -moz-user-select: -moz-none;\n  -khtml-user-select: none;\n  -webkit-user-select: none;\n  user-select: none;\n"], ["\n  -ms-user-select: none;\n  -moz-user-select: -moz-none;\n  -khtml-user-select: none;\n  -webkit-user-select: none;\n  user-select: none;\n"])));
+var bulletPointModeStyle = (0, styled_components_1.css)(templateObject_35 || (templateObject_35 = __makeTemplateObject(["\n  padding-left: 16px;\n  ::before {\n    content: '\u2022';\n    position: absolute;\n    left: 0;\n    width: 16px;\n  }\n"], ["\n  padding-left: 16px;\n  ::before {\n    content: '\u2022';\n    position: absolute;\n    left: 0;\n    width: 16px;\n  }\n"])));
+var S_TextLabel = styled_components_1.default.div(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n  box-sizing: border-box;\n  text-align: ", ";\n  white-space: pre-wrap;\n  word-break: ", ";\n  overflow-wrap: break-word;\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"], ["\n  box-sizing: border-box;\n  text-align: ", ";\n  white-space: pre-wrap;\n  word-break: ", ";\n  overflow-wrap: break-word;\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"])), function (_a) {
     var textAlign = _a.textAlign;
     return textAlign;
 }, function (_a) {
@@ -280,11 +294,15 @@ var S_TextLabel = styled_components_1.default.div(templateObject_34 || (template
             keep_all: 'keep-all',
             break_word: 'break-word'
         }[wordBreak];
+}, function (_a) {
+    var $letterSpacing = _a.$letterSpacing;
+    return "letter-spacing: " + $letterSpacing;
 }, function (_a) {
     var styleTheme = _a.styleTheme;
     return styleTheme &&
         {
             displayBold: displayBold,
+            wizardPageTitleBold: wizardPageTitleBold,
             headingBold: headingBold,
             leadParaBold: leadParaBold,
             leadParaRegular: leadParaRegular,
@@ -310,6 +328,7 @@ var S_TextLabel = styled_components_1.default.div(templateObject_34 || (template
             sysTextSecondary: sysTextSecondary,
             sysTextTertiary: sysTextTertiary,
             sysTextWhite: sysTextWhite,
+            sysTextBlack: sysTextBlack,
             sysTextError: sysTextError,
             sysTextWarning: sysTextWarning,
             sysTextBrandPrimary: sysTextBrandPrimary,
@@ -346,7 +365,7 @@ var S_TextLabel = styled_components_1.default.div(templateObject_34 || (template
     var bulletPointMode = _a.bulletPointMode;
     return bulletPointMode === 'use' && bulletPointModeStyle;
 });
-var S_AfterTextBox = styled_components_1.default.div(templateObject_35 || (templateObject_35 = __makeTemplateObject(["\n  display: inline-block;\n  margin-left: ", ";\n  position: relative;\n\n  ", ";\n"], ["\n  display: inline-block;\n  margin-left: ", ";\n  position: relative;\n\n  ", ";\n"])), function (_a) {
+var S_AfterTextBox = styled_components_1.default.div(templateObject_37 || (templateObject_37 = __makeTemplateObject(["\n  display: inline-block;\n  margin-left: ", ";\n  position: relative;\n\n  ", ";\n"], ["\n  display: inline-block;\n  margin-left: ", ";\n  position: relative;\n\n  ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.spacing.spacingA;
 }, function (_a) {
@@ -362,6 +381,6 @@ var S_AfterTextBox = styled_components_1.default.div(templateObject_35 || (templ
             return 'vertical-align: middle';
     }
 });
-var S_IconWrapper = styled_components_1.default.div(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n"], ["\n  align-items: center;\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n"])));
+var S_IconWrapper = styled_components_1.default.div(templateObject_38 || (templateObject_38 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n"], ["\n  align-items: center;\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n"])));
 exports.default = TextLabel;
-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, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36;
+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, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38;

package/dist/src/mobile/components/UploadMainButton/UploadMainButton.d.ts CHANGED Viewed

@@ -11,7 +11,7 @@ declare type UploadMainButtonProps = {
     iconMode?: 'none' | 'left' | 'right';
     iconFillType?: 'fill' | 'line';
     iconName?: FillIconNameKeys | LineIconNameKeys;
-    colorTheme?: 'none' | 'line1' | 'line2' | 'line3';
+    colorTheme?: 'none' | 'line1' | 'line2' | 'line3' | 'primary1' | 'secondary1';
     state?: 'normal' | 'disabled';
     accept?: string;
     multipleMode?: 'none' | 'use';

package/dist/src/mobile/components/UploadMainButton/UploadMainButton.js CHANGED Viewed

@@ -42,9 +42,23 @@ function UploadMainButton(_a) {
         }
         e.target.value = '';
     };
+    var isLineColorTheme = colorTheme.includes('line');
+    var isPrimaryColorTheme = colorTheme.includes('primary');
+    var isSecondaryColorTheme = colorTheme.includes('secondary');
+    var lineColorThemeTextColor = function () {
+        if (colorTheme === 'line1') {
+            return 'ui_cpnt_button_text_error';
+        }
+        if (colorTheme === 'line2') {
+            return 'ui_cpnt_button_text_primary';
+        }
+        if (colorTheme === 'line3') {
+            return 'ui_cpnt_button_text_darktheme_enabled';
+        }
+    };
     var submittingProgressColor = function () {
-        if (fillType === 'line' && colorTheme !== 'none' && state !== 'disabled') {
-            return types_1.textThemeColorLines[colorTheme];
+        if (fillType === 'line' && isLineColorTheme && state !== 'disabled') {
+            return lineColorThemeTextColor();
         }
         if (fillType === 'fill') {
             return 'ui_cpnt_textlabel_usr_brandonprimary';
@@ -53,53 +67,98 @@ function UploadMainButton(_a) {
             return 'ui_cpnt_textlabel_sys_primary';
         }
         if (styleTheme === 'primary') {
+            if (colorTheme === 'primary1') {
+                return 'ui_cpnt_textlabel_usr_brandprimary';
+            }
             return 'ui_cpnt_textlabel_usr_brandonprimary';
         }
         if (styleTheme === 'secondary') {
+            if (colorTheme === 'secondary1') {
+                return 'ui_cpnt_textlabel_sys_white';
+            }
             return 'ui_cpnt_textlabel_usr_brandprimary';
         }
         return 'ui_cpnt_textlabel_usr_brandonprimary';
     };
-    var selectTextThemeColor = function () {
+    var textColor = function () {
+        if (fillType === 'fill') {
+            return 'usrTextBrandOnPrimary';
+        }
+        if (fillType === 'line') {
+            return 'sysTextPrimary';
+        }
+        if (styleTheme === 'primary') {
+            if (colorTheme === 'primary1') {
+                return 'usrTextBrandPrimary';
+            }
+            return 'usrTextBrandOnPrimary';
+        }
+        if (styleTheme === 'secondary') {
+            if (colorTheme === 'secondary1') {
+                return 'sysTextWhite';
+            }
+            return 'usrTextBrandPrimary';
+        }
+        return 'usrTextBrandOnPrimary';
+    };
+    var textColorOverride = function () {
         if (colorTheme === 'line3' && state === 'disabled') {
             return 'ui_cpnt_button_text_darktheme_disabled';
         }
-        if (fillType === 'line' && colorTheme !== 'none' && state !== 'disabled') {
-            return types_1.textThemeColorLines[colorTheme];
+        if (fillType === 'line' && isLineColorTheme && state !== 'disabled') {
+            return lineColorThemeTextColor();
+        }
+        if (styleTheme === 'secondary' && colorTheme === 'secondary1' && state === 'disabled') {
+            return 'ui_cpnt_button_text_secondary_variation_disabled';
         }
         return undefined;
     };
+    var lineColorThemeIconColor = function () {
+        if (colorTheme === 'line1') {
+            return 'ui_cpnt_button_icon_error';
+        }
+        if (colorTheme === 'line2') {
+            return 'ui_cpnt_button_icon_primary';
+        }
+        if (colorTheme === 'line3') {
+            return 'ui_cpnt_button_icon_darktheme_enabled';
+        }
+    };
+    var primaryColorThemeIconColor = function () {
+        if (colorTheme === 'primary1') {
+            return 'ui_cpnt_button_icon_primary';
+        }
+    };
+    var secondaryColorThemeIconColor = function () {
+        if (colorTheme === 'secondary1') {
+            return 'ui_cpnt_button_icon_on_primary';
+        }
+    };
     var iconColor = function () {
         if (state === 'disabled') {
             if (colorTheme === 'line3') {
                 return 'ui_cpnt_button_icon_darktheme_disabled';
             }
+            if (styleTheme === 'secondary' && colorTheme === 'secondary1') {
+                return 'ui_cpnt_button_icon_secondary_variation_disabled';
+            }
             return 'ui_cpnt_button_icon_disabled';
         }
-        if (fillType === 'line' && colorTheme !== 'none') {
-            return types_1.iconColorThemeLineColors[colorTheme];
+        if (fillType === 'line' && isLineColorTheme) {
+            return lineColorThemeIconColor();
         }
         if (fillType) {
             return types_1.iconFillTypeColors[fillType];
         }
-        if (styleTheme) {
-            return types_1.iconStyleThemeColors[styleTheme];
-        }
-    };
-    var textColor = function () {
-        if (fillType === 'fill') {
-            return 'usrTextBrandOnPrimary';
-        }
-        if (fillType === 'line') {
-            return 'sysTextPrimary';
+        if (styleTheme === 'primary' && isPrimaryColorTheme) {
+            return primaryColorThemeIconColor();
         }
-        if (styleTheme === 'primary') {
-            return 'usrTextBrandOnPrimary';
+        if (styleTheme === 'secondary' && isSecondaryColorTheme) {
+            return secondaryColorThemeIconColor();
         }
-        if (styleTheme === 'secondary') {
-            return 'usrTextBrandPrimary';
+        if (styleTheme) {
+            return types_1.iconStyleThemeColors[styleTheme];
         }
-        return 'usrTextBrandOnPrimary';
     };
     var UploadMainButtonVariation = function () {
         if (isLoading) {
@@ -116,7 +175,7 @@ function UploadMainButton(_a) {
             size !== 'xsmall' && iconMode === 'left' && (react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType }),
                 react_1.default.createElement(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }))),
-            react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: types_1.textStyles[size], singleLineMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : textColor(), colorOverride: selectTextThemeColor(), ellipsisMode: "use", lineLimit: 1, wordBreak: "break_all" }),
+            react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: types_1.textStyles[size], singleLineMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : textColor(), colorOverride: textColorOverride(), ellipsisMode: "use", lineLimit: 1, wordBreak: "break_all" }),
             size !== 'xsmall' && iconMode === 'right' && (react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }),
                 react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType })))));
@@ -201,7 +260,7 @@ var lineDisabled = (0, styled_components_1.css)(templateObject_11 || (templateOb
         ? theme.ui_cpnt_button_line_border_darktheme_disabled
         : theme.ui_cpnt_button_line_border_disabled;
 });
-var line = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  background-color: ", ";\n\n  &:active:not([disabled]) {\n    background-color: ", ";\n  }\n\n  &::before {\n    content: '';\n    display: none;\n  }\n  ", "\n\n  ", ";\n  ", "\n"], ["\n  background-color: ", ";\n\n  &:active:not([disabled]) {\n    background-color: ", ";\n  }\n\n  &::before {\n    content: '';\n    display: none;\n  }\n  ", "\n\n  ", ";\n  ", "\n"])), function (_a) {
+var line = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  background-color: ", ";\n\n  &:active:not([disabled]) {\n    background-color: ", ";\n  }\n\n  &::before {\n    content: '';\n    display: none;\n  }\n  ", "\n\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n\n  &:active:not([disabled]) {\n    background-color: ", ";\n  }\n\n  &::before {\n    content: '';\n    display: none;\n  }\n  ", "\n\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_button_line_base_default;
 }, function (_a) {
@@ -209,7 +268,18 @@ var line = (0, styled_components_1.css)(templateObject_12 || (templateObject_12
     return !isSubmitting && theme.ui_cpnt_button_line_base_pressed;
 }, transitionStyle_1.ButtonTransition, function (_a) {
     var colorTheme = _a.colorTheme;
-    return colorTheme && { none: none, line1: line1, line2: line2, line3: line3 }[colorTheme];
+    if (colorTheme === 'none') {
+        return none;
+    }
+    if (colorTheme === 'line1') {
+        return line1;
+    }
+    if (colorTheme === 'line2') {
+        return line2;
+    }
+    if (colorTheme === 'line3') {
+        return line3;
+    }
 }, function (_a) {
     var disabled = _a.disabled;
     return disabled && lineDisabled;
@@ -218,31 +288,55 @@ var primaryDisabled = (0, styled_components_1.css)(templateObject_13 || (templat
     var theme = _a.theme;
     return theme.ui_cpnt_button_fill_base_disabled;
 });
-var primary = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  background-color: ", ";\n  border: none;\n  position: relative;\n\n  &::before {\n    content: '';\n    border-radius: inherit;\n    position: absolute;\n    background-color: transparent;\n    height: 100%;\n    width: 100%;\n    padding: 0;\n    ", "\n  }\n\n  &:active:not([disabled])::before {\n    background-color: ", ";\n  }\n\n  ", "\n"], ["\n  background-color: ", ";\n  border: none;\n  position: relative;\n\n  &::before {\n    content: '';\n    border-radius: inherit;\n    position: absolute;\n    background-color: transparent;\n    height: 100%;\n    width: 100%;\n    padding: 0;\n    ", "\n  }\n\n  &:active:not([disabled])::before {\n    background-color: ", ";\n  }\n\n  ", "\n"])), function (_a) {
+var primary1 = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.ui_cpnt_button_primary_variation_base_enabled;
+});
+var primary = (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  background-color: ", ";\n  border: none;\n  position: relative;\n\n  &::before {\n    content: '';\n    border-radius: inherit;\n    position: absolute;\n    background-color: transparent;\n    height: 100%;\n    width: 100%;\n    padding: 0;\n    ", "\n  }\n\n  &:active:not([disabled])::before {\n    background-color: ", ";\n  }\n\n  ", "\n  ", "\n"], ["\n  background-color: ", ";\n  border: none;\n  position: relative;\n\n  &::before {\n    content: '';\n    border-radius: inherit;\n    position: absolute;\n    background-color: transparent;\n    height: 100%;\n    width: 100%;\n    padding: 0;\n    ", "\n  }\n\n  &:active:not([disabled])::before {\n    background-color: ", ";\n  }\n\n  ", "\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_button_fill_base_primary;
 }, transitionStyle_1.ButtonTransition, function (_a) {
     var theme = _a.theme, isSubmitting = _a.isSubmitting;
     return !isSubmitting && theme.ui_cpnt_button_fill_on_base_pressed;
+}, function (_a) {
+    var colorTheme = _a.colorTheme;
+    return colorTheme === 'primary1' && primary1;
 }, function (_a) {
     var disabled = _a.disabled;
     return disabled && primaryDisabled;
 });
-var secondaryDisabled = (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+var secondary1Disabled = (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.ui_cpnt_button_secondary_variation_base_default;
+});
+var secondaryDisabled = (0, styled_components_1.css)(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  background-color: ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_button_line_base_hover;
+}, function (_a) {
+    var colorTheme = _a.colorTheme;
+    return colorTheme === 'secondary1' && secondary1Disabled;
 });
-var secondary = (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  background-color: ", ";\n  border: none;\n  position: relative;\n\n  &::before {\n    content: '';\n    border-radius: inherit;\n    position: absolute;\n    background-color: transparent;\n    height: 100%;\n    width: 100%;\n    padding: 0;\n    ", "\n  }\n\n  &:active:not([disabled])::before {\n    background-color: ", ";\n  }\n\n  ", "\n"], ["\n  background-color: ", ";\n  border: none;\n  position: relative;\n\n  &::before {\n    content: '';\n    border-radius: inherit;\n    position: absolute;\n    background-color: transparent;\n    height: 100%;\n    width: 100%;\n    padding: 0;\n    ", "\n  }\n\n  &:active:not([disabled])::before {\n    background-color: ", ";\n  }\n\n  ", "\n"])), function (_a) {
+var secondary1 = (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  background-color: ", ";\n\n  &:active:not([disabled]) {\n    background-color: ", ";\n  }\n\n  &::before {\n    content: '';\n    display: none;\n  }\n\n  ", "\n"], ["\n  background-color: ", ";\n\n  &:active:not([disabled]) {\n    background-color: ", ";\n  }\n\n  &::before {\n    content: '';\n    display: none;\n  }\n\n  ", "\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.ui_cpnt_button_secondary_variation_base_default;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.ui_cpnt_button_secondary_variation_base_pressed;
+}, transitionStyle_1.ButtonTransition);
+var secondary = (0, styled_components_1.css)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n  background-color: ", ";\n  border: none;\n  position: relative;\n\n  &::before {\n    content: '';\n    border-radius: inherit;\n    position: absolute;\n    background-color: transparent;\n    height: 100%;\n    width: 100%;\n    padding: 0;\n    ", "\n  }\n\n  &:active:not([disabled])::before {\n    background-color: ", ";\n  }\n\n  ", "\n  ", "\n"], ["\n  background-color: ", ";\n  border: none;\n  position: relative;\n\n  &::before {\n    content: '';\n    border-radius: inherit;\n    position: absolute;\n    background-color: transparent;\n    height: 100%;\n    width: 100%;\n    padding: 0;\n    ", "\n  }\n\n  &:active:not([disabled])::before {\n    background-color: ", ";\n  }\n\n  ", "\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_button_line_base_hover;
 }, transitionStyle_1.ButtonTransition, function (_a) {
     var theme = _a.theme, isSubmitting = _a.isSubmitting;
-    return !isSubmitting && theme.ui_transition_test_main_button_secondary_active;
+    return !isSubmitting && theme.ui_cpnt_button_secondary_on_base_pressed;
+}, function (_a) {
+    var colorTheme = _a.colorTheme;
+    return colorTheme === 'secondary1' && secondary1;
 }, function (_a) {
     var disabled = _a.disabled;
     return disabled && secondaryDisabled;
 });
-var S_UploadMainButton = styled_components_1.default.label(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  justify-content: center;\n\n  & > div {\n    font-weight: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n  ", ";\n"], ["\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  justify-content: center;\n\n  & > div {\n    font-weight: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n  ", ";\n"])), function (_a) {
+var S_UploadMainButton = styled_components_1.default.label(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  justify-content: center;\n\n  & > div {\n    font-weight: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n  ", ";\n"], ["\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  justify-content: center;\n\n  & > div {\n    font-weight: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n  ", ";\n"])), function (_a) {
     var theme = _a.theme, fontWeight = _a.fontWeight;
     return fontWeight &&
         {
@@ -262,6 +356,6 @@ var S_UploadMainButton = styled_components_1.default.label(templateObject_17 ||
     var responsiveMode = _a.responsiveMode;
     return responsiveMode === 'use' && 'width: 100%';
 });
-var S_LoadingUploadMainButton = (0, styled_components_1.default)(S_UploadMainButton)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), styles_1.skeletonLoadingStyle);
+var S_LoadingUploadMainButton = (0, styled_components_1.default)(S_UploadMainButton)(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), styles_1.skeletonLoadingStyle);
 exports.default = UploadMainButton;
-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, templateObject_15, templateObject_16, templateObject_17, templateObject_18;
+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, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21;

package/dist/src/mobile/components/UploadMainButton/types.d.ts CHANGED Viewed

@@ -5,11 +5,6 @@ export declare const textStyles: {
     readonly small: "caption1Bold";
     readonly xsmall: "caption1Regular";
 };
-export declare const textThemeColorLines: {
-    readonly line1: "ui_cpnt_button_text_error";
-    readonly line2: "ui_cpnt_button_text_primary";
-    readonly line3: "ui_cpnt_button_text_darktheme_enabled";
-};
 export declare const iconFillTypeColors: {
     readonly fill: "ui_cpnt_button_icon_on_primary";
     readonly line: "ui_cpnt_button_icon_enabled";
@@ -18,8 +13,3 @@ export declare const iconStyleThemeColors: {
     readonly primary: "ui_cpnt_button_icon_on_primary";
     readonly secondary: "ui_cpnt_button_icon_primary";
 };
-export declare const iconColorThemeLineColors: {
-    readonly line1: "ui_cpnt_button_icon_error";
-    readonly line2: "ui_cpnt_button_icon_primary";
-    readonly line3: "ui_cpnt_button_icon_darktheme_enabled";
-};