pds-dev-kit-web-test 2.5.402 → 2.5.406

package/dist/src/common/assets/icons/editorNavigationIcons/downIcons.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import type IconType from '../IconType';
+export declare const ArrowDownDesign01: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowDownDesign02: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowDownDesign03: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowDownDesign04: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowDownDesign05: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowDownDesign06: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowDownDesign07: ({ color, ...rest }: IconType) => JSX.Element;
+export declare const ArrowDownDesign08: ({ color, ...rest }: IconType) => JSX.Element;
+export declare const ArrowDownDesign09: ({ color, ...rest }: IconType) => JSX.Element;
+export declare const ArrowDownDesign10: ({ color, size, ...rest }: IconType) => JSX.Element;

package/dist/src/common/assets/icons/editorNavigationIcons/downIcons.js

@@ -0,0 +1,76 @@
+"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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ArrowDownDesign10 = exports.ArrowDownDesign09 = exports.ArrowDownDesign08 = exports.ArrowDownDesign07 = exports.ArrowDownDesign06 = exports.ArrowDownDesign05 = exports.ArrowDownDesign04 = exports.ArrowDownDesign03 = exports.ArrowDownDesign02 = exports.ArrowDownDesign01 = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var ArrowDownDesign01 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: ".5", d: "M15.577375,18.497375 L8.666375,11.586375 C8.341375,11.261375 8.341375,10.733375 8.666375,10.408375 L15.577375,3.497375", transform: "rotate(-90 12 10.997)" }) })));
+};
+exports.ArrowDownDesign01 = ArrowDownDesign01;
+var ArrowDownDesign02 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", d: "M15.5773125,18.5003005 L8.6668125,11.5898005 C8.3413125,11.2643005 8.3413125,10.7363005 8.6668125,10.4108005 L15.5773125,3.5003005", transform: "rotate(-90 12 11)" }) })));
+};
+exports.ArrowDownDesign02 = ArrowDownDesign02;
+var ArrowDownDesign03 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2.5", d: "M15.5774,18.5 L8.6664,11.589 C8.3414,11.264 8.3414,10.736 8.6664,10.411 L15.5774,3.5", transform: "rotate(-90 12 11)" }) })));
+};
+exports.ArrowDownDesign03 = ArrowDownDesign03;
+var ArrowDownDesign04 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("polyline", { fill: "none", stroke: color, strokeLinecap: "square", strokeWidth: "3", points: "8.001 3.499 16.001 11.499 8.001 19.501", transform: "rotate(90 12 11.5)" }) })));
+};
+exports.ArrowDownDesign04 = ArrowDownDesign04;
+var ArrowDownDesign05 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M4.55225015,11.9999287 L21,11.9999287 M10.4989308,19.4992872 L3,12.0003564 L10.4989308,4.5", transform: "rotate(-90 12 12)" }) })));
+};
+exports.ArrowDownDesign05 = ArrowDownDesign05;
+var ArrowDownDesign06 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "square", strokeWidth: "3", d: "M4.55225015,11.9999287 L21,11.9999287 M10.4989308,19.4992872 L3,12.0003564 L10.4989308,4.5", transform: "rotate(-90 12 12)" }) })));
+};
+exports.ArrowDownDesign06 = ArrowDownDesign06;
+var ArrowDownDesign07 = function (_a) {
+    var color = _a.color, rest = __rest(_a, ["color"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: "24", height: "32", viewBox: "0 0 24 32" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M-1.44774985,16.0002851 L27,16.0002851 M4.49893076,23.4996436 L-3,16.0007128 L4.49893076,8.50035641", transform: "rotate(-90 12 16)" }) })));
+};
+exports.ArrowDownDesign07 = ArrowDownDesign07;
+var ArrowDownDesign08 = function (_a) {
+    var color = _a.color, rest = __rest(_a, ["color"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: "24", height: "32", viewBox: "0 0 24 32" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "square", strokeWidth: "3", d: "M-0.448106259,15.8002851 L25.9996436,15.8002851 M5.49857435,23.2996436 L-2.00035641,15.8007128 L5.49857435,8.30035641", transform: "matrix(0 -1 -1 0 27.8 27.8)" }) })));
+};
+exports.ArrowDownDesign08 = ArrowDownDesign08;
+var ArrowDownDesign09 = function (_a) {
+    var color = _a.color, rest = __rest(_a, ["color"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: "24", height: "32", viewBox: "0 0 24 32" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M11.805,12.066 C11.805,12.066 4,19.871 4,19.871 L28.537,19.871", transform: "scale(1 -1) rotate(90 32.237 0)" }) })));
+};
+exports.ArrowDownDesign09 = ArrowDownDesign09;
+var ArrowDownDesign10 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("polygon", { fill: color, fillRule: "evenodd", points: "12 6 21 21 3 21", transform: "rotate(180 12 13.5)" }) })));
+};
+exports.ArrowDownDesign10 = ArrowDownDesign10;

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

@@ -0,0 +1,43 @@
+/// <reference types="react" />
+export declare const editorNavigationIcons: {
+    ic_arrow_down_design_01: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_down_design_02: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_down_design_03: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_down_design_04: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_down_design_05: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_down_design_06: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_down_design_07: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_down_design_08: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_down_design_09: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_down_design_10: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_left_design_01: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_left_design_02: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_left_design_03: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_left_design_04: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_left_design_05: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_left_design_06: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_left_design_07: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_left_design_08: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_left_design_09: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_left_design_10: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_right_design_01: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_right_design_02: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_right_design_03: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_right_design_04: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_right_design_05: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_right_design_06: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_right_design_07: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_right_design_08: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_right_design_09: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_right_design_10: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_up_design_01: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_up_design_02: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_up_design_03: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_up_design_04: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_up_design_05: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_up_design_06: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_up_design_07: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_up_design_08: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_up_design_09: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
+    ic_arrow_up_design_10: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+};

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

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.editorNavigationIcons = void 0;
+var downIcons_1 = require("./downIcons");
+var leftIcons_1 = require("./leftIcons");
+var rightIcons_1 = require("./rightIcons");
+var upIcons_1 = require("./upIcons");
+exports.editorNavigationIcons = {
+    ic_arrow_down_design_01: downIcons_1.ArrowDownDesign01,
+    ic_arrow_down_design_02: downIcons_1.ArrowDownDesign02,
+    ic_arrow_down_design_03: downIcons_1.ArrowDownDesign03,
+    ic_arrow_down_design_04: downIcons_1.ArrowDownDesign04,
+    ic_arrow_down_design_05: downIcons_1.ArrowDownDesign05,
+    ic_arrow_down_design_06: downIcons_1.ArrowDownDesign06,
+    ic_arrow_down_design_07: downIcons_1.ArrowDownDesign07,
+    ic_arrow_down_design_08: downIcons_1.ArrowDownDesign08,
+    ic_arrow_down_design_09: downIcons_1.ArrowDownDesign09,
+    ic_arrow_down_design_10: downIcons_1.ArrowDownDesign10,
+    ic_arrow_left_design_01: leftIcons_1.ArrowLeftDesign01,
+    ic_arrow_left_design_02: leftIcons_1.ArrowLeftDesign02,
+    ic_arrow_left_design_03: leftIcons_1.ArrowLeftDesign03,
+    ic_arrow_left_design_04: leftIcons_1.ArrowLeftDesign04,
+    ic_arrow_left_design_05: leftIcons_1.ArrowLeftDesign05,
+    ic_arrow_left_design_06: leftIcons_1.ArrowLeftDesign06,
+    ic_arrow_left_design_07: leftIcons_1.ArrowLeftDesign07,
+    ic_arrow_left_design_08: leftIcons_1.ArrowLeftDesign08,
+    ic_arrow_left_design_09: leftIcons_1.ArrowLeftDesign09,
+    ic_arrow_left_design_10: leftIcons_1.ArrowLeftDesign10,
+    ic_arrow_right_design_01: rightIcons_1.ArrowRightDesign01,
+    ic_arrow_right_design_02: rightIcons_1.ArrowRightDesign02,
+    ic_arrow_right_design_03: rightIcons_1.ArrowRightDesign03,
+    ic_arrow_right_design_04: rightIcons_1.ArrowRightDesign04,
+    ic_arrow_right_design_05: rightIcons_1.ArrowRightDesign05,
+    ic_arrow_right_design_06: rightIcons_1.ArrowRightDesign06,
+    ic_arrow_right_design_07: rightIcons_1.ArrowRightDesign07,
+    ic_arrow_right_design_08: rightIcons_1.ArrowRightDesign08,
+    ic_arrow_right_design_09: rightIcons_1.ArrowRightDesign09,
+    ic_arrow_right_design_10: rightIcons_1.ArrowRightDesign10,
+    ic_arrow_up_design_01: upIcons_1.ArrowUpDesign01,
+    ic_arrow_up_design_02: upIcons_1.ArrowUpDesign02,
+    ic_arrow_up_design_03: upIcons_1.ArrowUpDesign03,
+    ic_arrow_up_design_04: upIcons_1.ArrowUpDesign04,
+    ic_arrow_up_design_05: upIcons_1.ArrowUpDesign05,
+    ic_arrow_up_design_06: upIcons_1.ArrowUpDesign06,
+    ic_arrow_up_design_07: upIcons_1.ArrowUpDesign07,
+    ic_arrow_up_design_08: upIcons_1.ArrowUpDesign08,
+    ic_arrow_up_design_09: upIcons_1.ArrowUpDesign09,
+    ic_arrow_up_design_10: upIcons_1.ArrowUpDesign10
+};

package/dist/src/common/assets/icons/editorNavigationIcons/leftIcons.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import type IconType from '../IconType';
+export declare const ArrowLeftDesign01: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowLeftDesign02: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowLeftDesign03: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowLeftDesign04: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowLeftDesign05: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowLeftDesign06: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowLeftDesign07: ({ color, ...rest }: IconType) => JSX.Element;
+export declare const ArrowLeftDesign08: ({ color, ...rest }: IconType) => JSX.Element;
+export declare const ArrowLeftDesign09: ({ color, ...rest }: IconType) => JSX.Element;
+export declare const ArrowLeftDesign10: ({ color, size, ...rest }: IconType) => JSX.Element;

package/dist/src/common/assets/icons/editorNavigationIcons/leftIcons.js

@@ -0,0 +1,76 @@
+"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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ArrowLeftDesign10 = exports.ArrowLeftDesign09 = exports.ArrowLeftDesign08 = exports.ArrowLeftDesign07 = exports.ArrowLeftDesign06 = exports.ArrowLeftDesign05 = exports.ArrowLeftDesign04 = exports.ArrowLeftDesign03 = exports.ArrowLeftDesign02 = exports.ArrowLeftDesign01 = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var ArrowLeftDesign01 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: ".5", d: "M14.5773,19.5001 L7.6663,12.5891 C7.3413,12.2641 7.3413,11.7361 7.6663,11.4111 L14.5773,4.5001" }) })));
+};
+exports.ArrowLeftDesign01 = ArrowLeftDesign01;
+var ArrowLeftDesign02 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", d: "M14.5776,19.5003 L7.6671,12.5898 C7.3416,12.2643 7.3416,11.7363 7.6671,11.4108 L14.5776,4.5003" }) })));
+};
+exports.ArrowLeftDesign02 = ArrowLeftDesign02;
+var ArrowLeftDesign03 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2.5", d: "M14.5774,19.5 L7.6664,12.589 C7.3414,12.264 7.3414,11.736 7.6664,11.411 L14.5774,4.5" }) })));
+};
+exports.ArrowLeftDesign03 = ArrowLeftDesign03;
+var ArrowLeftDesign04 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("polyline", { fill: "none", stroke: color, strokeLinecap: "square", strokeWidth: "3", points: "7.5 4 15.5 12 7.5 20.002", transform: "rotate(180 11.5 12)" }) })));
+};
+exports.ArrowLeftDesign04 = ArrowLeftDesign04;
+var ArrowLeftDesign05 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M4.55225015,11.9999287 L21,11.9999287 M10.4989308,19.4992872 L3,12.0003564 L10.4989308,4.5" }) })));
+};
+exports.ArrowLeftDesign05 = ArrowLeftDesign05;
+var ArrowLeftDesign06 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "square", strokeWidth: "3", d: "M4.55225015,11.9999287 L21,11.9999287 M10.4989308,19.4992872 L3,12.0003564 L10.4989308,4.5" }) })));
+};
+exports.ArrowLeftDesign06 = ArrowLeftDesign06;
+var ArrowLeftDesign07 = function (_a) {
+    var color = _a.color, rest = __rest(_a, ["color"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: "32", height: "24", viewBox: "0 0 32 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M2.55225015,11.9999287 L31,11.9999287 M8.49893076,19.4992872 L1,12.0003564 L8.49893076,4.5" }) })));
+};
+exports.ArrowLeftDesign07 = ArrowLeftDesign07;
+var ArrowLeftDesign08 = function (_a) {
+    var color = _a.color, rest = __rest(_a, ["color"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: "32", height: "24", viewBox: "0 0 32 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "square", strokeWidth: "3", d: "M3.75225015,11.9999287 L30.2,11.9999287 M9.69893076,19.4992872 L2.2,12.0003564 L9.69893076,4.5" }) })));
+};
+exports.ArrowLeftDesign08 = ArrowLeftDesign08;
+var ArrowLeftDesign09 = function (_a) {
+    var color = _a.color, rest = __rest(_a, ["color"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: "32", height: "24", viewBox: "0 0 32 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M11.505,4.5 C11.505,4.5 3.7,12.305 3.7,12.305 L28.237,12.305" }) })));
+};
+exports.ArrowLeftDesign09 = ArrowLeftDesign09;
+var ArrowLeftDesign10 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("polygon", { fill: color, fillRule: "evenodd", points: "10.5 4.5 19.5 19.5 1.5 19.5", transform: "rotate(-90 10.5 12)" }) })));
+};
+exports.ArrowLeftDesign10 = ArrowLeftDesign10;

package/dist/src/common/assets/icons/editorNavigationIcons/rightIcons.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import type IconType from '../IconType';
+export declare const ArrowRightDesign01: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowRightDesign02: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowRightDesign03: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowRightDesign04: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowRightDesign05: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowRightDesign06: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowRightDesign07: ({ color, ...rest }: IconType) => JSX.Element;
+export declare const ArrowRightDesign08: ({ color, ...rest }: IconType) => JSX.Element;
+export declare const ArrowRightDesign09: ({ color, ...rest }: IconType) => JSX.Element;
+export declare const ArrowRightDesign10: ({ color, size, ...rest }: IconType) => JSX.Element;

package/dist/src/common/assets/icons/editorNavigationIcons/rightIcons.js

@@ -0,0 +1,76 @@
+"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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ArrowRightDesign10 = exports.ArrowRightDesign09 = exports.ArrowRightDesign08 = exports.ArrowRightDesign07 = exports.ArrowRightDesign06 = exports.ArrowRightDesign05 = exports.ArrowRightDesign04 = exports.ArrowRightDesign03 = exports.ArrowRightDesign02 = exports.ArrowRightDesign01 = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var ArrowRightDesign01 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: ".5", d: "M16.5773,19.5001 L9.6663,12.5891 C9.3413,12.2641 9.3413,11.7361 9.6663,11.4111 L16.5773,4.5001", transform: "rotate(180 13 12)" }) })));
+};
+exports.ArrowRightDesign01 = ArrowRightDesign01;
+var ArrowRightDesign02 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", d: "M16.5776,19.5003 L9.6671,12.5898 C9.3416,12.2643 9.3416,11.7363 9.6671,11.4108 L16.5776,4.5003", transform: "rotate(180 13 12)" }) })));
+};
+exports.ArrowRightDesign02 = ArrowRightDesign02;
+var ArrowRightDesign03 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2.5", d: "M16.5774,19.5 L9.6664,12.589 C9.3414,12.264 9.3414,11.736 9.6664,11.411 L16.5774,4.5", transform: "rotate(180 13 12)" }) })));
+};
+exports.ArrowRightDesign03 = ArrowRightDesign03;
+var ArrowRightDesign04 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("polyline", { fill: "none", stroke: color, strokeLinecap: "square", strokeWidth: "3", points: "8.5 4 16.5 12 8.5 20.002" }) })));
+};
+exports.ArrowRightDesign04 = ArrowRightDesign04;
+var ArrowRightDesign05 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M4.55225015,11.9999287 L21,11.9999287 M10.4989308,19.4992872 L3,12.0003564 L10.4989308,4.5", transform: "rotate(180 12 12)" }) })));
+};
+exports.ArrowRightDesign05 = ArrowRightDesign05;
+var ArrowRightDesign06 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "square", strokeWidth: "3", d: "M4.55225015,11.9999287 L21,11.9999287 M10.4989308,19.4992872 L3,12.0003564 L10.4989308,4.5", transform: "rotate(180 12 12)" }) })));
+};
+exports.ArrowRightDesign06 = ArrowRightDesign06;
+var ArrowRightDesign07 = function (_a) {
+    var color = _a.color, rest = __rest(_a, ["color"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: "32", height: "24", viewBox: "0 0 32 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M2.55225015,11.9999287 L31,11.9999287 M8.49893076,19.4992872 L1,12.0003564 L8.49893076,4.5", transform: "rotate(180 16 12)" }) })));
+};
+exports.ArrowRightDesign07 = ArrowRightDesign07;
+var ArrowRightDesign08 = function (_a) {
+    var color = _a.color, rest = __rest(_a, ["color"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: "32", height: "24", viewBox: "0 0 32 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "square", strokeWidth: "3", d: "M3.35225015,11.9999287 L29.8,11.9999287 M9.29893076,19.4992872 L1.8,12.0003564 L9.29893076,4.5", transform: "rotate(180 15.8 12)" }) })));
+};
+exports.ArrowRightDesign08 = ArrowRightDesign08;
+var ArrowRightDesign09 = function (_a) {
+    var color = _a.color, rest = __rest(_a, ["color"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: "32", height: "24", viewBox: "0 0 32 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M11.505,4.5 C11.505,4.5 3.7,12.305 3.7,12.305 L28.237,12.305", transform: "matrix(-1 0 0 1 31.937 0)" }) })));
+};
+exports.ArrowRightDesign09 = ArrowRightDesign09;
+var ArrowRightDesign10 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("polygon", { fill: color, fillRule: "evenodd", points: "13.5 4.5 22.5 19.5 4.5 19.5", transform: "rotate(90 13.5 12)" }) })));
+};
+exports.ArrowRightDesign10 = ArrowRightDesign10;

package/dist/src/common/assets/icons/editorNavigationIcons/upIcons.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import type IconType from '../IconType';
+export declare const ArrowUpDesign01: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowUpDesign02: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowUpDesign03: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowUpDesign04: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowUpDesign05: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowUpDesign06: ({ color, size, ...rest }: IconType) => JSX.Element;
+export declare const ArrowUpDesign07: ({ color, ...rest }: IconType) => JSX.Element;
+export declare const ArrowUpDesign08: ({ color, ...rest }: IconType) => JSX.Element;
+export declare const ArrowUpDesign09: ({ color, ...rest }: IconType) => JSX.Element;
+export declare const ArrowUpDesign10: ({ color, size, ...rest }: IconType) => JSX.Element;

package/dist/src/common/assets/icons/editorNavigationIcons/upIcons.js

@@ -0,0 +1,76 @@
+"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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ArrowUpDesign10 = exports.ArrowUpDesign09 = exports.ArrowUpDesign08 = exports.ArrowUpDesign07 = exports.ArrowUpDesign06 = exports.ArrowUpDesign05 = exports.ArrowUpDesign04 = exports.ArrowUpDesign03 = exports.ArrowUpDesign02 = exports.ArrowUpDesign01 = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var ArrowUpDesign01 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: ".5", d: "M15.577375,18.497375 L8.666375,11.586375 C8.341375,11.261375 8.341375,10.733375 8.666375,10.408375 L15.577375,3.497375", transform: "rotate(90 12 10.997)" }) })));
+};
+exports.ArrowUpDesign01 = ArrowUpDesign01;
+var ArrowUpDesign02 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", d: "M15.5773125,18.5003005 L8.6668125,11.5898005 C8.3413125,11.2643005 8.3413125,10.7363005 8.6668125,10.4108005 L15.5773125,3.5003005", transform: "rotate(90 12 11)" }) })));
+};
+exports.ArrowUpDesign02 = ArrowUpDesign02;
+var ArrowUpDesign03 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2.5", d: "M15.5774,18.5 L8.6664,11.589 C8.3414,11.264 8.3414,10.736 8.6664,10.411 L15.5774,3.5", transform: "rotate(90 12 11)" }) })));
+};
+exports.ArrowUpDesign03 = ArrowUpDesign03;
+var ArrowUpDesign04 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("polyline", { fill: "none", stroke: color, strokeLinecap: "square", strokeWidth: "3", points: "8.001 3.499 16.001 11.499 8.001 19.501", transform: "rotate(-90 12 11.5)" }) })));
+};
+exports.ArrowUpDesign04 = ArrowUpDesign04;
+var ArrowUpDesign05 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M4.55225015,11.9999287 L21,11.9999287 M10.4989308,19.4992872 L3,12.0003564 L10.4989308,4.5", transform: "rotate(90 12 12)" }) })));
+};
+exports.ArrowUpDesign05 = ArrowUpDesign05;
+var ArrowUpDesign06 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "square", strokeWidth: "3", d: "M4.55225015,11.9999287 L21,11.9999287 M10.4989308,19.4992872 L3,12.0003564 L10.4989308,4.5", transform: "rotate(90 12 12)" }) })));
+};
+exports.ArrowUpDesign06 = ArrowUpDesign06;
+var ArrowUpDesign07 = function (_a) {
+    var color = _a.color, rest = __rest(_a, ["color"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: "24", height: "32", viewBox: "0 0 24 32" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M-1.44774985,16.0002851 L27,16.0002851 M4.49893076,23.4996436 L-3,16.0007128 L4.49893076,8.50035641", transform: "rotate(90 12 16)" }) })));
+};
+exports.ArrowUpDesign07 = ArrowUpDesign07;
+var ArrowUpDesign08 = function (_a) {
+    var color = _a.color, rest = __rest(_a, ["color"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: "24", height: "32", viewBox: "0 0 24 32" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "square", strokeWidth: "3", d: "M-0.448106259,16.2002851 L25.9996436,16.2002851 M5.49857435,23.6996436 L-2.00035641,16.2007128 L5.49857435,8.70035641", transform: "rotate(90 12 16.2)" }) })));
+};
+exports.ArrowUpDesign08 = ArrowUpDesign08;
+var ArrowUpDesign09 = function (_a) {
+    var color = _a.color, rest = __rest(_a, ["color"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: "24", height: "32", viewBox: "0 0 24 32" }, rest, { children: (0, jsx_runtime_1.jsx)("path", { fill: "none", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M11.805,12.066 C11.805,12.066 4,19.871 4,19.871 L28.537,19.871", transform: "rotate(90 16.268 15.969)" }) })));
+};
+exports.ArrowUpDesign09 = ArrowUpDesign09;
+var ArrowUpDesign10 = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsx)("polygon", { fill: color, fillRule: "evenodd", points: "12 3 21 18 3 18" }) })));
+};
+exports.ArrowUpDesign10 = ArrowUpDesign10;

package/dist/src/common/hooks/useTooltip.js

@@ -66,7 +66,7 @@ function UseTooltip(_a) {
         systemUIPosition: tooltipPosition,
         distance: distance
     });
-    return tooltipText ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(S_TooltipWrapper, __assign({ className: "TooltipWrapper", ref: tooltipRef, tooltipPositionCss: tooltipPositionCss }, { children: tooltipText })), document.body) })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}));
+    return tooltipText ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(S_TooltipWrapper, __assign({ className: "TooltipWrapper", ref: tooltipRef, tooltipPositionCss: tooltipPositionCss }, { children: tooltipText })), document.getElementById('root')) })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}));
 }
 var S_TooltipWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n\n  ", ";\n"], ["\n  ", "\n\n  ", ";\n"])), systemUI_1.TooltipWrapperStyle, function (_a) {
     var tooltipPositionCss = _a.tooltipPositionCss;

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

@@ -123,7 +123,7 @@ declare const colorSet: {
         grey450: string;
         darkgrey450: string;
     };
-    readonly PaletteColor_light: {
+    readonly PaletteColor_Dark: {
         sys_container_background_01: string;
         sys_container_background_02: string;
         sys_container_background_03: string;
@@ -503,7 +503,7 @@ declare const colorSet: {
         sys_cpnt_sheet_base_54: string;
         sys_component_border_01: string;
     };
-    readonly PaletteColor_Dark: {
+    readonly PaletteColor_light: {
         sys_container_background_01: string;
         sys_container_background_02: string;
         sys_container_background_03: string;

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

@@ -5,13 +5,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_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
 var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
+var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
 var UIColor_json_1 = __importDefault(require("./UIColor.json"));
 var colorSet = {
     SemanticColor: SemanticColor_json_1.default,
-    PaletteColor_light: PaletteColor_light_json_1.default,
     PaletteColor_Dark: PaletteColor_Dark_json_1.default,
+    PaletteColor_light: PaletteColor_light_json_1.default,
     UIColor: UIColor_json_1.default
 };
 exports.default = colorSet;

package/dist/src/common/types/icon.d.ts

@@ -1,10 +1,12 @@
 import fillIcons from '../assets/icons/fill';
 import { imageIconSrcSet } from '../assets/icons/image';
 import lineIcons from '../assets/icons/line';
+import type { editorNavigationIcons } from '../assets/icons/editorNavigationIcons';
 export type FillIconNameKeys = keyof typeof fillIcons;
 export type LineIconNameKeys = keyof typeof lineIcons;
 export type ImageIconNameKeys = keyof typeof imageIconSrcSet;
-export type PDSIconType = FillIconNameKeys | LineIconNameKeys | ImageIconNameKeys;
+export type EditorNavigationIconNameKeys = keyof typeof editorNavigationIcons;
+export type PDSIconType = FillIconNameKeys | LineIconNameKeys | ImageIconNameKeys | EditorNavigationIconNameKeys;
 export declare const fillIconkeys: string[];
 export declare const lineIconkeys: string[];
 export declare const imageIconKeys: string[];

package/dist/src/common/utils/SystemUIPositionGenerator/hoverTypeSystemUICssGenerator.js

@@ -10,7 +10,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 function hoverTypeSystemUICssGenerator(_a) {
     var baseSize = _a.baseSize, sizeOffset = _a.sizeOffset, positionOffset = _a.positionOffset, systemUIPosition = _a.systemUIPosition, _b = _a.distance, distance = _b === void 0 ? 8 : _b;
     if (!sizeOffset || !positionOffset) {
-        return '';
+        return 'visibility: hidden;';
     }
     var end = positionOffset.left, bottom = positionOffset.bottom, top = positionOffset.top;
     var width = sizeOffset.width, height = sizeOffset.height;

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

@@ -105,7 +105,7 @@ function BasicButtonGroup(_a) {
             var isHoveredButton = index === hoveredButtonIndex;
             return ((0, jsx_runtime_1.jsxs)(S_BasicButton, __assign({ size: size, onClick: function (e) { return onClick && onClick(e); }, onMouseDown: function (e) { return onMouseDown && onMouseDown(e); }, onPointerEnter: function () { return setHoveredButtonIndex(index); }, onPointerLeave: function () { return setHoveredButtonIndex(null); }, disabled: state === 'disabled' || buttonState === 'disabled', backgroundColorTheme: backgroundColorTheme }, { children: [(0, jsx_runtime_1.jsx)(components_1.Icon, { iconName: iconName, size: size === 'small' ? 20 : 24, fillType: iconFillType, colorKey: getColorKey(buttonState, iconColorTheme) }), tooltipText &&
                         isHoveredButton &&
-                        (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(S_TooltipWrapper, __assign({ className: "TooltipWrapper", ref: tooltipRef, tooltipPositionCss: tooltipPositionCss, size: size }, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: tooltipText, colorOverride: "ui_cpnt_textlabel_button_tooltip", styleTheme: "caption2Regular", colorTheme: "sysTextSecondary" }) })), document.body)] }), iconName + index));
+                        (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(S_TooltipWrapper, __assign({ className: "TooltipWrapper", ref: tooltipRef, tooltipPositionCss: tooltipPositionCss, size: size }, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: tooltipText, colorOverride: "ui_cpnt_textlabel_button_tooltip", styleTheme: "caption2Regular", colorTheme: "sysTextSecondary" }) })), document.getElementById('tooltip-root'))] }), iconName + index));
         }) })));
 }
 var S_BasicButtonGroup = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  width: max-content;\n\n  & > button:not(:last-child) {\n    margin-right: ", ";\n  }\n"], ["\n  align-items: center;\n  display: flex;\n  width: max-content;\n\n  & > button:not(:last-child) {\n    margin-right: ", ";\n  }\n"])), function (_a) {

package/dist/src/hybrid/components/Icon/Icon.js

@@ -4,6 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
+var editorNavigationIcons_1 = require("../../../common/assets/icons/editorNavigationIcons");
 var styled_components_1 = require("styled-components");
 var fill_1 = __importDefault(require("../../../common/assets/icons/fill"));
 var image_1 = require("../../../common/assets/icons/image");
@@ -19,6 +20,11 @@ var Icon = function (_a) {
         fill: fill_1.default[iconName] || line_1.default[iconName]
     };
     var SelectedSVGIcon = svgIcons[fillType];
+    // NOTE: DynamicLayoutEditor 환경에서만 사용되는 아이콘셋입니다.
+    if (iconName in editorNavigationIcons_1.editorNavigationIcons) {
+        var EditorNavigationIcon = editorNavigationIcons_1.editorNavigationIcons[iconName];
+        return ((0, jsx_runtime_1.jsx)(EditorNavigationIcon, { "x-pds-name": "Icon", "x-pds-element-type": "component", "x-pds-device-type": "hybrid", color: theme[colorKey], size: size, style: isFixedSize ? undefined : { minWidth: size, minHeight: size } }));
+    }
     if (icon_1.imageIconKeys.includes(iconName)) {
         return ((0, jsx_runtime_1.jsx)("img", { "x-pds-name": "Icon", "x-pds-element-type": "component", "x-pds-device-type": "hybrid", src: image_1.imageIconSrcSet[iconName], width: size, height: size }));
     }

package/dist/src/sub/DynamicLayout/CompositionEditor/CompositionEditor.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import type { TypeOfCompositionAction } from '../compositionActionTypes';
+import type { CustomSectionShortcutKeysType, IComposition } from '../types';
+import type { Layout } from 'publ-echo/dist/lib/GridLayoutEditor/types';
+export type LayoutsType = {
+    sm: Layout;
+    lg: Layout;
+};
+export type CompositionEditorCanvasProps = {
+    device: 'DESKTOP' | 'MOBILE';
+    zoomScale: number;
+    shortcutKeyMode: CustomSectionShortcutKeysType | '';
+    compositionActionHandler: (action: TypeOfCompositionAction) => void;
+};
+export type CompositionEditorProps = {
+    compositionData: IComposition;
+    editorProps: CompositionEditorCanvasProps;
+};
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<CompositionEditorProps & React.RefAttributes<unknown>>>;
+export default _default;