pds-dev-kit-web 0.6.2 → 0.6.5

package/dist/src/common/assets/icons/line/ArrowRoundLeft.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import IconType from '../IconType';
+declare const ArrowRoundLeft: ({ color, size, ...rest }: IconType) => JSX.Element;
+export default ArrowRoundLeft;

package/dist/src/common/assets/icons/line/ArrowRoundLeft.js

@@ -0,0 +1,34 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var ArrowRoundLeft = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return (react_1.default.createElement("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest),
+        react_1.default.createElement("path", { d: "M11.713386,2 C8.94538602,2 6.34438602,3.143 4.45738602,5.139 L4.45738602,3.46 C4.45738602,3.046 4.12138602,2.71 3.70738602,2.71 C3.29338602,2.71 2.95738602,3.046 2.95738602,3.46 L2.95738602,6.743 C2.95738602,7.311 3.41938602,7.772 3.98638602,7.772 L7.26938602,7.772 C7.68338602,7.772 8.01938602,7.437 8.01938602,7.022 C8.01938602,6.608 7.68338602,6.272 7.26938602,6.272 L5.44938602,6.272 C7.05938602,4.512 9.31338602,3.5 11.713386,3.5 C16.401386,3.5 20.215386,7.313 20.215386,12.002 C20.215386,16.69 16.401386,20.504 11.713386,20.504 C7.82638602,20.504 4.43938602,17.878 3.47638602,14.117 C3.37338602,13.716 2.96638602,13.478 2.56438602,13.577 C2.16238602,13.68 1.92138602,14.089 2.02338602,14.49 C3.15638602,18.914 7.14138602,22.004 11.713386,22.004 C17.228386,22.004 21.715386,17.517 21.715386,12.002 C21.715386,6.487 17.228386,2 11.713386,2", fill: color, fillRule: "evenodd" })));
+};
+exports.default = ArrowRoundLeft;

package/dist/src/common/assets/icons/line/PostVote.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import IconType from '../IconType';
+declare const PostVote: ({ color, size, ...rest }: IconType) => JSX.Element;
+export default PostVote;

package/dist/src/common/assets/icons/line/PostVote.js

@@ -0,0 +1,38 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var PostVote = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return (react_1.default.createElement("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest),
+        react_1.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24" },
+            react_1.default.createElement("g", { fill: "none", fillRule: "evenodd" },
+                react_1.default.createElement("path", { fill: color, d: "M20.9009,14.3097 L2.8079,14.3097 C2.3619,14.3097 1.9999,14.6717 1.9999,15.1177 L1.9999,20.0557 C1.9999,21.4367 3.1199,22.5557 4.4999,22.5557 L19.2089,22.5557 C20.5899,22.5557 21.7089,21.4367 21.7089,20.0557 L21.7089,15.1177 C21.7089,14.6717 21.3479,14.3097 20.9009,14.3097 L20.9009,14.3097 Z M20.2089,15.8097 L20.2089,20.0557 C20.2089,20.6067 19.7609,21.0557 19.2089,21.0557 L4.4999,21.0557 C3.9489,21.0557 3.4999,20.6067 3.4999,20.0557 L3.4999,15.8097 L20.2089,15.8097 Z" }),
+                react_1.default.createElement("path", { stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M16.8862,10.5243 L17.8352,10.5243 C18.4132,10.5243 18.9402,10.8563 19.1892,11.3783 L20.9232,15.0113 M2.8081,15.0116 L4.8051,11.3116 C5.0671,10.8266 5.5741,10.5246 6.1251,10.5246 L6.9291,10.5246" }),
+                react_1.default.createElement("path", { stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M16.7806,12.768 L6.9286,12.768 L6.9286,4 C6.9286,3.171 7.6006,2.5 8.4286,2.5 L15.2806,2.5 C16.1086,2.5 16.7806,3.171 16.7806,4 L16.7806,12.768 Z M9.4939,7.325 L11.2569,9.35 L14.0359,6.278" })))));
+};
+exports.default = PostVote;

package/dist/src/common/assets/icons/line/TenSecBackArrow.js

@@ -29,6 +29,6 @@ var react_1 = __importDefault(require("react"));
 var TenSecBackArrow = function (_a) {
     var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
     return (react_1.default.createElement("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest),
-        react_1.default.createElement("path", { d: "M11.7259917,3.4677 L12.9139917,2.2797 C13.2069917,1.9867 13.2069917,1.5127 12.9139917,1.2197 C12.6209917,0.9267 12.1469917,0.9267 11.8539917,1.2197 L9.53299167,3.5397 C9.13099167,3.9407 9.13099167,4.5957 9.53299167,4.9967 L11.8539917,7.3167 C12,7.4637 12.1919917,7.5367 12.3839917,7.5367 C12.5759917,7.5367 12.7679917,7.4637 12.9139917,7.3167 C13.2069917,7.0237 13.2069917,6.5497 12.9139917,6.2567 L11.6289917,4.9707 C14.0139917,4.8687 16.3209917,5.7417 18.0169917,7.4387 C19.6229917,9.0437 20.5069917,11.1797 20.5069917,13.4497 C20.5069917,15.7217 19.6229917,17.8567 18.0169917,19.4617 C14.7019917,22.7757 9.30899167,22.7757 5.99399167,19.4617 C3.24499167,16.7137 2.70699167,12.4617 4.68499167,9.1217 C4.89599167,8.7657 4.77799167,8.3057 4.42099167,8.0947 C4.06599167,7.8827 3.60499167,8.0017 3.39399167,8.3577 C1.06799167,12.2877 1.70099167,17.2897 4.93299167,20.5227 C6.88299167,22.4727 9.44399167,23.4467 12.0059917,23.4467 C14.5659917,23.4467 17.1279917,22.4727 19.0779917,20.5227 C20.9669917,18.6337 22.0069917,16.1217 22.0069917,13.4497 C22.0069917,10.7787 20.9669917,8.2677 19.0779917,6.3777 C17.1209917,4.4207 14.4699917,3.3967 11.7259917,3.4677 Z", fill: color, fillRule: "evenodd" })));
+        react_1.default.createElement("path", { d: "M18.6549432,19.1 C16.8049432,20.94 14.3649432,21.96 11.7549432,21.96 C9.1549432,21.96 6.7049432,20.94 4.8649432,19.1 C1.7049432,15.95 1.0949432,11.07 3.3549432,7.24 C3.5049432,7 3.8049432,6.92 4.0449432,7.06 C4.2849432,7.2 4.3649432,7.51 4.2249432,7.75 C2.1849432,11.19 2.7349432,15.56 5.5649432,18.39 C7.2249432,20.05 9.4149432,20.96 11.7549432,20.96 C14.0949432,20.96 16.2949432,20.05 17.9449432,18.39 C21.3549432,14.98 21.3549432,9.43 17.9449432,6.01 C16.0949432,4.16 13.5249432,3.24 10.9149432,3.49 C10.8649432,3.49 10.8249432,3.48 10.7749432,3.47 L12.4849432,5.19 C12.6849432,5.38 12.6849432,5.7 12.4849432,5.89 C12.3949432,5.99 12.2649432,6.04 12.1349432,6.04 C12.0049432,6.04 11.8749432,5.99 11.7849432,5.89 L9.4549432,3.57 C9.1549432,3.27 9.1549432,2.77 9.4549432,2.47 L11.7849432,0.15 C11.9749432,-0.05 12.2949432,-0.05 12.4849432,0.15 C12.6849432,0.34 12.6849432,0.66 12.4849432,0.86 L10.8449432,2.49 C13.7549432,2.23 16.5949432,3.25 18.6549432,5.31 C22.4549432,9.11 22.4549432,15.3 18.6549432,19.1", fill: color, fillRule: "evenodd" })));
 };
 exports.default = TenSecBackArrow;

package/dist/src/common/assets/icons/line/TenSecForwardArrow.js

@@ -29,6 +29,6 @@ var react_1 = __importDefault(require("react"));
 var TenSecForwardArrow = function (_a) {
     var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
     return (react_1.default.createElement("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest),
-        react_1.default.createElement("path", { d: "M20.613,8.35875 C20.402,8.00175 19.942,7.88375 19.585,8.09475 C19.229,8.30575 19.111,8.76575 19.322,9.12275 C21.3,12.46275 20.761,16.71375 18.013,19.46275 C16.407,21.06775 14.273,21.95275 12.002,21.95275 C9.731,21.95275 7.596,21.06775 5.99,19.46275 C4.384,17.85675 3.5,15.72175 3.5,13.45075 C3.5,11.17975 4.384,9.04475 5.99,7.43875 C7.686,5.74175 9.992,4.86575 12.379,4.97075 L11.093,6.25675 C10.8,6.54975 10.8,7.02475 11.093,7.31775 C11.239,7.46375 11.431,7.53775 11.623,7.53775 C11.815,7.53775 12.007,7.46375 12.154,7.31775 L14.476,4.99675 C14.875,4.59475 14.875,3.94275 14.475,3.54075 L12.154,1.21975 C11.861,0.92675 11.386,0.92675 11.093,1.21975 C10.8,1.51275 10.8,1.98775 11.093,2.28075 L12.28,3.46775 C9.534,3.39275 6.886,4.42175 4.929,6.37875 C3.04,8.26675 2,10.77975 2,13.45075 C2,16.12275 3.04,18.63375 4.929,20.52275 C6.818,22.41275 9.33,23.45275 12.002,23.45275 C14.674,23.45275 17.185,22.41275 19.074,20.52275 C22.307,17.29075 22.94,12.28875 20.613,8.35875", fill: color, fillRule: "evenodd" })));
+        react_1.default.createElement("path", { d: "M18.64,19.1 C16.8,20.94 14.35,21.96 11.75,21.96 C9.14,21.96 6.69,20.94 4.85,19.1 C1.05,15.3 1.05,9.11 4.85,5.31 C6.91,3.25 9.76,2.23 12.65,2.49 L11.01,0.86 C10.82,0.66 10.82,0.34 11.01,0.15 C11.21,-0.05 11.53,-0.05 11.72,0.15 L14.04,2.47 C14.35,2.77 14.35,3.27 14.04,3.57 L11.72,5.89 C11.62,5.99 11.5,6.04 11.37,6.04 C11.24,6.04 11.11,5.99 11.01,5.89 C10.82,5.7 10.82,5.38 11.01,5.19 L12.73,3.47 C12.68,3.48 12.63,3.49 12.58,3.49 C9.97,3.23 7.41,4.16 5.56,6.01 C2.15,9.43 2.15,14.98 5.56,18.39 C7.21,20.05 9.41,20.96 11.75,20.96 C14.08,20.96 16.28,20.05 17.93,18.39 C20.76,15.56 21.32,11.19 19.28,7.75 C19.14,7.51 19.22,7.2 19.46,7.06 C19.7,6.92 20,7 20.14,7.24 C22.41,11.07 21.79,15.95 18.64,19.1", fill: color, fillRule: "evenodd" })));
 };
 exports.default = TenSecForwardArrow;

package/dist/src/common/assets/icons/line/index.d.ts

@@ -8,6 +8,7 @@ declare const lineIcons: {
     readonly ic_arrow_right: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_arrow_right_2: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_arrow_right_bold: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    readonly ic_arrow_round_left: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_arrow_up: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_arrow_up_bold: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_bell: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
@@ -75,6 +76,7 @@ declare const lineIcons: {
     readonly ic_post_promotion: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_post_promotion_p: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_post_social: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    readonly ic_post_vote: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_post_welcome: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_profit: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_qr: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;

package/dist/src/common/assets/icons/line/index.js

@@ -11,6 +11,7 @@ var ArrowLeftBold_1 = __importDefault(require("./ArrowLeftBold"));
 var ArrowRight_1 = __importDefault(require("./ArrowRight"));
 var ArrowRight2_1 = __importDefault(require("./ArrowRight2"));
 var ArrowRightBold_1 = __importDefault(require("./ArrowRightBold"));
+var ArrowRoundLeft_1 = __importDefault(require("./ArrowRoundLeft"));
 var ArrowUp_1 = __importDefault(require("./ArrowUp"));
 var ArrowUpBold_1 = __importDefault(require("./ArrowUpBold"));
 var Bell_1 = __importDefault(require("./Bell"));
@@ -78,6 +79,7 @@ var PostPhotobook_1 = __importDefault(require("./PostPhotobook"));
 var PostPromotion_1 = __importDefault(require("./PostPromotion"));
 var PostPromotionP_1 = __importDefault(require("./PostPromotionP"));
 var PostSocial_1 = __importDefault(require("./PostSocial"));
+var PostVote_1 = __importDefault(require("./PostVote"));
 var PostWelcome_1 = __importDefault(require("./PostWelcome"));
 var Profit_1 = __importDefault(require("./Profit"));
 var Qr_1 = __importDefault(require("./Qr"));
@@ -135,6 +137,7 @@ var lineIcons = {
     ic_arrow_right: ArrowRight_1.default,
     ic_arrow_right_2: ArrowRight2_1.default,
     ic_arrow_right_bold: ArrowRightBold_1.default,
+    ic_arrow_round_left: ArrowRoundLeft_1.default,
     ic_arrow_up: ArrowUp_1.default,
     ic_arrow_up_bold: ArrowUpBold_1.default,
     ic_bell: Bell_1.default,
@@ -202,6 +205,7 @@ var lineIcons = {
     ic_post_promotion: PostPromotion_1.default,
     ic_post_promotion_p: PostPromotionP_1.default,
     ic_post_social: PostSocial_1.default,
+    ic_post_vote: PostVote_1.default,
     ic_post_welcome: PostWelcome_1.default,
     ic_profit: Profit_1.default,
     ic_qr: Qr_1.default,

package/dist/src/common/styles/colorSet/PaletteColor_Dark.json

@@ -124,5 +124,8 @@
     "sys_widget_green_01": "darkgreen500",
     "sys_component_base_black_opacity30": "black/opacity30",
     "sys_area_background": "darkgrey50/opacity65",
-    "sys_border_white_opacity30": "white/opacity30"
+    "sys_border_white_opacity30": "white/opacity30",
+    "sys_container_background_wt": "grey950",
+    "sys_channeldesc_grey_03": "darkgrey400",
+    "sys_channeldesc_border_grey_03": "darkgrey100"
 }

package/dist/src/common/styles/colorSet/PaletteColor_light.json

@@ -124,5 +124,8 @@
     "sys_widget_green_01": "green500",
     "sys_component_base_black_opacity30": "black/opacity30",
     "sys_area_background": "darkgrey50/opacity65",
-    "sys_border_white_opacity30": "white/opacity30"
+    "sys_border_white_opacity30": "white/opacity30",
+    "sys_container_background_wt": "grey30",
+    "sys_channeldesc_grey_03": "darkgrey400",
+    "sys_channeldesc_border_grey_03": "darkgrey100"
 }

package/dist/src/common/styles/colorSet/SemanticColor.json

@@ -51,5 +51,6 @@
     "navy100": "#6E77A9",
     "darknavy100": "#7A82B2",
     "opacity80": "CC",
-    "opacity50": "80"
+    "opacity50": "80",
+    "grey30": "#f9fafb"
 }

package/dist/src/common/styles/colorSet/UIColor.json

@@ -47,7 +47,7 @@
     "ui_cpnt_tabbar_base_area_sub": "sys_component_base_01",
     "ui_cpnt_tabbar_border_active_indicator_primary": "usr_brand_primary",
     "ui_cpnt_tabbar_text_active_primary": "usr_brand_primary",
-    "ui_cpnt_tabbar_border_active_indicator": "sys_border_line_01",
+    "ui_cpnt_tabbar_border_active_indicator": "sys_border_line_05",
     "ui_cpnt_tabbar_text_active": "sys_text_grey_01",
     "ui_cpnt_tabbar_text_inactive_01": "sys_text_grey_02",
     "ui_2": "sys_text_grey_01",
@@ -280,8 +280,8 @@
     "ui_cpnt_card_icon_basic": "sys_widget_primary_01",
     "ui_cpnt_card_icon_custom": "sys_widget_grey_01",
     "ui_cpnt_card_icon_create": "sys_widget_grey_01",
-    "ui_cpnt_modal_dimmed": "sys_background_dimmed_65",
-    "ui_cpnt_alertdialog_dimmed": "sys_background_dimmed_65",
+    "ui_cpnt_modal_dimmed": "sys_background_dimmed_20",
+    "ui_cpnt_alertdialog_dimmed": "sys_background_dimmed_20",
     "ui_cpnt_bottomsheet_base": "sys_component_base_02",
     "ui_cpnt_bottomsheet_icon_03": "sys_widget_grey_03",
     "ui_cpnt_button_icon_white": "sys_widget_white",
@@ -447,5 +447,14 @@
     "ui_36": "sys_component_base_black_opacity80",
     "ui_37": "sys_component_base_black_opacity30",
     "ui_39": "sys_area_background",
-    "ui_cpnt_divider_white_opacity30": "sys_border_white_opacity30"
+    "ui_cpnt_divider_white_opacity30": "sys_border_white_opacity30",
+    "ui_toppagemenucontainer_background_wt_m": "sys_container_background_wt",
+    "ui_contentscontainer_background_wt_m": "sys_container_background_wt",
+    "ui_toppagemenuarea_background_wt_m": "sys_container_background_01",
+    "ui_contentsarea_background_wt_m": "sys_container_background_01",
+    "ui_cpnt_standardbanner_base_default": "sys_component_base_02",
+    "ui_channeldesc_white": "sys_text_white",
+    "ui_channeldesc_grey_03": "sys_channeldesc_grey_03",
+    "ui_channeldesc_border_grey_03": "sys_channeldesc_border_grey_03",
+    "ui_cpnt_bottomsheet_border": "sys_border_line_01"
 }

package/dist/src/common/styles/colorSet/index.d.ts

@@ -1,59 +1,4 @@
 declare const colorSet: {
-    readonly SemanticColor: {
-        blue500: string;
-        blue700: string;
-        blue300: string;
-        green700: string;
-        green500: string;
-        green300: string;
-        red500: string;
-        grey900: string;
-        grey500: string;
-        grey400: string;
-        grey100: string;
-        grey50: string;
-        white: string;
-        black: string;
-        darkblue500: string;
-        grey950: string;
-        darkgrey900: string;
-        darkgrey500: string;
-        darkgrey400: string;
-        darkgrey100: string;
-        darkgrey50: string;
-        darkred500: string;
-        darkgreen700: string;
-        orange500: string;
-        darkorange500: string;
-        opacity00: string;
-        opacity20: string;
-        opacity30: string;
-        opacity65: string;
-        darkgreen500: string;
-        grey70: string;
-        navy500: string;
-        lightgreen500: string;
-        pink500: string;
-        darkgrey70: string;
-        darknavy500: string;
-        darkpink500: string;
-        darklightgreen500: string;
-        opacity10: string;
-        grey600: string;
-        darkgrey600: string;
-        skyblue500: string;
-        skyblue300: string;
-        pink300: string;
-        lightpink500: string;
-        darkblue300: string;
-        darkblue700: string;
-        darkgreen300: string;
-        darkskyblue500: string;
-        navy100: string;
-        darknavy100: string;
-        opacity80: string;
-        opacity50: string;
-    };
     readonly PaletteColor_Dark: {
         sys_container_background_01: string;
         sys_container_background_02: string;
@@ -181,6 +126,65 @@ declare const colorSet: {
         sys_component_base_black_opacity30: string;
         sys_area_background: string;
         sys_border_white_opacity30: string;
+        sys_container_background_wt: string;
+        sys_channeldesc_grey_03: string;
+        sys_channeldesc_border_grey_03: string;
+    };
+    readonly SemanticColor: {
+        blue500: string;
+        blue700: string;
+        blue300: string;
+        green700: string;
+        green500: string;
+        green300: string;
+        red500: string;
+        grey900: string;
+        grey500: string;
+        grey400: string;
+        grey100: string;
+        grey50: string;
+        white: string;
+        black: string;
+        darkblue500: string;
+        grey950: string;
+        darkgrey900: string;
+        darkgrey500: string;
+        darkgrey400: string;
+        darkgrey100: string;
+        darkgrey50: string;
+        darkred500: string;
+        darkgreen700: string;
+        orange500: string;
+        darkorange500: string;
+        opacity00: string;
+        opacity20: string;
+        opacity30: string;
+        opacity65: string;
+        darkgreen500: string;
+        grey70: string;
+        navy500: string;
+        lightgreen500: string;
+        pink500: string;
+        darkgrey70: string;
+        darknavy500: string;
+        darkpink500: string;
+        darklightgreen500: string;
+        opacity10: string;
+        grey600: string;
+        darkgrey600: string;
+        skyblue500: string;
+        skyblue300: string;
+        pink300: string;
+        lightpink500: string;
+        darkblue300: string;
+        darkblue700: string;
+        darkgreen300: string;
+        darkskyblue500: string;
+        navy100: string;
+        darknavy100: string;
+        opacity80: string;
+        opacity50: string;
+        grey30: string;
     };
     readonly UIColor: {
         ui_cpnt_button_fill_base_primary: string;
@@ -632,6 +636,15 @@ declare const colorSet: {
         ui_37: string;
         ui_39: string;
         ui_cpnt_divider_white_opacity30: string;
+        ui_toppagemenucontainer_background_wt_m: string;
+        ui_contentscontainer_background_wt_m: string;
+        ui_toppagemenuarea_background_wt_m: string;
+        ui_contentsarea_background_wt_m: string;
+        ui_cpnt_standardbanner_base_default: string;
+        ui_channeldesc_white: string;
+        ui_channeldesc_grey_03: string;
+        ui_channeldesc_border_grey_03: string;
+        ui_cpnt_bottomsheet_border: string;
     };
     readonly PaletteColor_light: {
         sys_container_background_01: string;
@@ -760,6 +773,9 @@ declare const colorSet: {
         sys_component_base_black_opacity30: string;
         sys_area_background: string;
         sys_border_white_opacity30: string;
+        sys_container_background_wt: string;
+        sys_channeldesc_grey_03: string;
+        sys_channeldesc_border_grey_03: string;
     };
 };
 export default colorSet;

package/dist/src/common/styles/colorSet/index.js

@@ -4,13 +4,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 /* eslint-disable import/order */
-var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
 var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
+var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
 var UIColor_json_1 = __importDefault(require("./UIColor.json"));
 var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
 var colorSet = {
-    SemanticColor: SemanticColor_json_1.default,
     PaletteColor_Dark: PaletteColor_Dark_json_1.default,
+    SemanticColor: SemanticColor_json_1.default,
     UIColor: UIColor_json_1.default,
     PaletteColor_light: PaletteColor_light_json_1.default
 };

package/dist/src/common/styles/colorSet/ui-type.d.ts

@@ -448,4 +448,13 @@ export interface UITheme {
     ui_37: string;
     ui_39: string;
     ui_cpnt_divider_white_opacity30: string;
+    ui_toppagemenucontainer_background_wt_m: string;
+    ui_contentscontainer_background_wt_m: string;
+    ui_toppagemenuarea_background_wt_m: string;
+    ui_contentsarea_background_wt_m: string;
+    ui_cpnt_standardbanner_base_default: string;
+    ui_channeldesc_white: string;
+    ui_channeldesc_grey_03: string;
+    ui_channeldesc_border_grey_03: string;
+    ui_cpnt_bottomsheet_border: string;
 }

package/dist/src/common/styles/index.d.ts

@@ -29,7 +29,6 @@ export declare const theme: {
         form2: string;
         blog1: string;
         singleLine: string;
-        btn: string;
     };
     mobileFontSize: {
         displayHeading: string;
@@ -57,7 +56,6 @@ export declare const theme: {
         form2: string;
         blog1: string;
         singleLine: string;
-        btn: string;
     };
     uiColors: import("..").UITheme;
 };

package/dist/src/common/styles/theme.d.ts

@@ -29,7 +29,6 @@ export declare const desktopLineHeight: {
     form2: string;
     blog1: string;
     singleLine: string;
-    btn: string;
 };
 export declare const mobileFontSize: {
     displayHeading: string;
@@ -57,7 +56,6 @@ export declare const mobileLineHeight: {
     form2: string;
     blog1: string;
     singleLine: string;
-    btn: string;
 };
 export declare const boxShadow: {
     elevation0: string;

package/dist/src/common/styles/theme.js

@@ -42,8 +42,7 @@ exports.desktopLineHeight = {
     form1: '1.6',
     form2: '1.6',
     blog1: '1.6',
-    singleLine: 'normal',
-    btn: '1'
+    singleLine: '1'
 };
 exports.mobileFontSize = {
     displayHeading: '32px',
@@ -70,8 +69,7 @@ exports.mobileLineHeight = {
     form1: '1.6',
     form2: '1.6',
     blog1: '1.6',
-    singleLine: 'normal',
-    btn: '1'
+    singleLine: '1'
 };
 exports.boxShadow = {
     elevation0: '0 0 0 0 #0003',

package/dist/src/common/types/styled-components.d.ts

@@ -30,7 +30,6 @@ export interface PdsDevKitTheme {
         form2: string;
         blog1: string;
         singleLine: string;
-        btn: string;
     };
     mobileFontSize: {
         displayHeading: string;
@@ -58,7 +57,6 @@ export interface PdsDevKitTheme {
         form2: string;
         blog1: string;
         singleLine: string;
-        btn: string;
     };
     boxShadow: {
         elevation0: string;

package/dist/src/desktop/common/components/TextFieldBase/TextFieldBase.js

@@ -202,7 +202,7 @@ var disabled = (0, styled_components_1.css)(templateObject_3 || (templateObject_
             dark: theme.ui_cpnt_textfield_text_darktheme_disabled
         }[colorTheme];
 });
-var basicStyle = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: inline-flex;\n  justify-content: center;\n  background-color: transparent;\n  border: none;\n  box-sizing: border-box;\n  color: ", ";\n  font-size: ", ";\n  font-weight: ", ";\n  height: 100%;\n  line-height: ", ";\n  outline: 0;\n  overflow: hidden;\n  padding: 0;\n  width: 100%;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n  &::placeholder {\n    color: ", ";\n  }\n\n  ", ";\n  ", "\n"], ["\n  display: inline-flex;\n  justify-content: center;\n  background-color: transparent;\n  border: none;\n  box-sizing: border-box;\n  color: ", ";\n  font-size: ", ";\n  font-weight: ", ";\n  height: 100%;\n  line-height: ", ";\n  outline: 0;\n  overflow: hidden;\n  padding: 0;\n  width: 100%;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n  &::placeholder {\n    color: ", ";\n  }\n\n  ", ";\n  ", "\n"])), function (_a) {
+var basicStyle = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: inline-flex;\n  justify-content: center;\n  background-color: transparent;\n  border: none;\n  box-sizing: border-box;\n  color: ", ";\n  font-size: ", ";\n  font-weight: ", ";\n  height: 100%;\n  line-height: ", ";\n  outline: 0;\n  overflow: hidden;\n  padding: 0;\n  width: 100%;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n  &::placeholder {\n    color: ", ";\n    font-size: ", ";\n    font-weight: ", ";\n    line-height: ", ";\n  }\n\n  ", ";\n  ", "\n"], ["\n  display: inline-flex;\n  justify-content: center;\n  background-color: transparent;\n  border: none;\n  box-sizing: border-box;\n  color: ", ";\n  font-size: ", ";\n  font-weight: ", ";\n  height: 100%;\n  line-height: ", ";\n  outline: 0;\n  overflow: hidden;\n  padding: 0;\n  width: 100%;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n  &::placeholder {\n    color: ", ";\n    font-size: ", ";\n    font-weight: ", ";\n    line-height: ", ";\n  }\n\n  ", ";\n  ", "\n"])), function (_a) {
     var theme = _a.theme, colorTheme = _a.colorTheme;
     return colorTheme &&
         {
@@ -225,6 +225,15 @@ var basicStyle = (0, styled_components_1.css)(templateObject_4 || (templateObjec
             none: theme.ui_cpnt_textfield_text_hint,
             dark: theme.ui_cpnt_textfield_text_darktheme_hint
         }[colorTheme];
+}, function (_a) {
+    var textSize = _a.textSize;
+    return common_1.desktopFontSize[textSize];
+}, function (_a) {
+    var textWeight = _a.textWeight;
+    return common_1.fontWeight[textWeight];
+}, function (_a) {
+    var textSize = _a.textSize;
+    return common_1.desktopLineHeight[textSize];
 }, function (_a) {
     var state = _a.state;
     return state &&

package/dist/src/desktop/components/Chip/Chip.js

@@ -29,21 +29,21 @@ function Chip(_a) {
                 return (react_1.default.createElement(S_CategoryChoiceChip, { isActive: chipId === activeChipId, onClick: handleClick },
                     chipId !== activeChipId && (react_1.default.createElement(S_CategoryIconWrapper, { isActive: chipId === activeChipId },
                         react_1.default.createElement(Icon_1.Icon, { size: 16, fillType: "line", iconName: "ic_filter", colorKey: "ui_cpnt_chip_line_icon_01" }))),
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", btnMode: "use", colorTheme: chipId === activeChipId ? 'usrTextBrandOnPrimary' : 'sysTextPrimary' }),
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: chipId === activeChipId ? 'usrTextBrandOnPrimary' : 'sysTextPrimary' }),
                     chipId === activeChipId && (react_1.default.createElement(S_CategoryIconWrapper, { isActive: chipId === activeChipId },
                         react_1.default.createElement(Icon_1.Icon, { size: 12, fillType: "line", iconName: "ic_xmark", colorKey: "ui_cpnt_chip_fill_icon_active_01" })))));
             case 'information':
                 return (react_1.default.createElement(S_InfoChip, { onClick: handleClick },
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Regular", btnMode: "use", colorTheme: "sysTextPrimary" })));
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Regular", singleLineMode: "use", colorTheme: "sysTextPrimary" })));
             case 'label':
                 return (react_1.default.createElement(S_LabelChip, { onClick: handleClick },
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", btnMode: "use", colorTheme: "sysTextTertiary" })));
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextTertiary" })));
             case 'time':
                 return (react_1.default.createElement(S_TimeChip, { onClick: handleClick },
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", btnMode: "use", colorTheme: "sysTextWhite" })));
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextWhite" })));
             case 'removable':
                 return (react_1.default.createElement(S_RemovableChip, { onClick: handleClick },
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", btnMode: "use", colorTheme: "sysTextSecondary" }),
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: "sysTextSecondary" }),
                     react_1.default.createElement(S_XIconWrapper, { onClick: handleClickXMarkIcon },
                         react_1.default.createElement(Icon_1.Icon, { size: 12, iconName: "ic_xmark", fillType: "line", colorKey: "ui_cpnt_chip_fill_icon_inactive" }))));
             default:
@@ -52,7 +52,7 @@ function Chip(_a) {
                         react_1.default.createElement(Icon_1.Icon, { fillType: iconFillType, iconName: iconName, size: 16, colorKey: chipId === activeChipId
                                 ? 'ui_cpnt_chip_fill_icon_active_01'
                                 : 'ui_cpnt_chip_line_icon_02' }))),
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", btnMode: "use", colorTheme: chipId === activeChipId ? 'usrTextBrandOnPrimary' : 'sysTextSecondary' })));
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: chipId === activeChipId ? 'usrTextBrandOnPrimary' : 'sysTextSecondary' })));
         }
     };
     return react_1.default.createElement(S_ChipWrapper, null, chipType());

package/dist/src/desktop/components/DesktopTabBar/DesktopTabBar.js

@@ -41,7 +41,7 @@ function DesktopTabBar(_a) {
     };
     var textLabel = function (value, isSubText) {
         if (isSubText) {
-            return (react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: pathname === value.path ? 'caption1Bold' : 'caption1Regular', colorTheme: pathname === value.path ? 'sysTextPrimary' : 'sysTextSecondary', btnMode: "use" }));
+            return (react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: pathname === value.path ? 'caption1Bold' : 'caption1Regular', colorTheme: pathname === value.path ? 'sysTextPrimary' : 'sysTextSecondary', singleLineMode: "use" }));
         }
         if (styleTheme === 'content') {
             return (react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: pathname === value.path ? 'caption1Bold' : 'caption1Regular', colorTheme: pathname === value.path ? 'sysTextPrimary' : 'sysTextSecondary', singleLineMode: "use" }));
@@ -52,7 +52,7 @@ function DesktopTabBar(_a) {
     };
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(S_TabBox, null,
-            textArray.map(function (value) { return (react_1.default.createElement(S_TabWrapper, { key: value.path, isActive: pathname.includes(value.path), onClick: function () {
+            textArray.map(function (value) { return (react_1.default.createElement(S_TabWrapper, { key: value.path, isActive: pathname.includes(value.path), styleTheme: styleTheme, onClick: function () {
                     handleClick(value);
                 } },
                 textLabel(value, false),
@@ -69,8 +69,10 @@ var mediumStyle = (0, styled_components_1.css)(templateObject_1 || (templateObje
     var theme = _a.theme;
     return theme.spacing.spacingB;
 }, function (_a) {
-    var theme = _a.theme;
-    return theme.ui_cpnt_tabbar_border_active_indicator_primary;
+    var theme = _a.theme, styleTheme = _a.styleTheme;
+    return styleTheme === 'content'
+        ? theme.ui_cpnt_tabbar_border_active_indicator
+        : theme.ui_cpnt_tabbar_border_active_indicator_primary;
 }, function (_a) {
     var isActive = _a.isActive;
     return !isActive && "display: none;";

package/dist/src/desktop/components/EditApplyTextField/EditApplyTextField.js

@@ -101,6 +101,7 @@ function EditApplyTextField(_a) {
     }
     var handleKeyUp = function (e) {
         if (textLineType === 'single' && e.key === 'Enter') {
+            e.preventDefault();
             e.target.blur();
             handleSubmit();
         }

package/dist/src/desktop/components/FloatingActionButton/FloatingActionButton.js

@@ -59,11 +59,11 @@ function FloatingActionButton(_a) {
         displayType === 'icon_only' && (react_1.default.createElement(S_ButtonIconOnly, { size: size, fontWeight: fontWeight, colorTheme: colorTheme, state: state, disabled: state === 'disabled', onClick: handleClick, onMouseDown: handleMouseDown },
             react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' ? 20 : 24, colorKey: iconColor(), fillType: iconFillType }))),
         displayType !== 'icon_only' && (react_1.default.createElement(S_Button, { size: size, fontWeight: fontWeight, colorTheme: colorTheme, state: state, disabled: state === 'disabled', onClick: handleClick, onMouseDown: handleMouseDown },
-            displayType === 'text_only' && (react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "body1Bold", btnMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandOnPrimary', colorOverride: state === 'disabled' ? 'ui_cpnt_button_text_darktheme_disabled' : undefined })),
+            displayType === 'text_only' && (react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "body1Bold", singleLineMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandOnPrimary', colorOverride: state === 'disabled' ? 'ui_cpnt_button_text_darktheme_disabled' : undefined })),
             displayType === 'icon_text' && (react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: 20, colorKey: iconColor(), fillType: iconFillType }),
                 react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }),
-                react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "body1Bold", btnMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandOnPrimary', colorOverride: state === 'disabled' ? 'ui_cpnt_button_text_darktheme_disabled' : undefined })))))));
+                react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "body1Bold", singleLineMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandOnPrimary', colorOverride: state === 'disabled' ? 'ui_cpnt_button_text_darktheme_disabled' : undefined })))))));
 }
 var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border-radius: 24px;\n  height: 48px;\n  width: 48px;\n"], ["\n  border-radius: 24px;\n  height: 48px;\n  width: 48px;\n"])));
 var xlarge = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  border-radius: 32px;\n  height: 64px;\n  width: 64px;\n"], ["\n  border-radius: 32px;\n  height: 64px;\n  width: 64px;\n"])));