pds-dev-kit-web-test 0.3.51 → 0.3.53

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

@@ -3,7 +3,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.usePrevious = exports.useDetectOverflow = exports.useAbsolutePositioner = void 0;
+exports.usePrevious = exports.useDetectOverflow = exports.useAbsolutePositioner = exports.useShortcutKeyContext = exports.ShortcutKeyProvider = exports.useShortcutKey = void 0;
+var useShortcutKey_1 = require("./useShortcutKey");
+Object.defineProperty(exports, "useShortcutKey", { enumerable: true, get: function () { return useShortcutKey_1.useShortcutKey; } });
+Object.defineProperty(exports, "ShortcutKeyProvider", { enumerable: true, get: function () { return useShortcutKey_1.ShortcutKeyProvider; } });
+Object.defineProperty(exports, "useShortcutKeyContext", { enumerable: true, get: function () { return useShortcutKey_1.useShortcutKeyContext; } });
 var useAbsolutePositioner_1 = require("./useAbsolutePositioner");
 Object.defineProperty(exports, "useAbsolutePositioner", { enumerable: true, get: function () { return __importDefault(useAbsolutePositioner_1).default; } });
 var useDetectOverflow_1 = require("./useDetectOverflow");

package/dist/src/common/hooks/useShortcutKey/ShortcutKeyProvider.d.ts

@@ -0,0 +1,27 @@
+import { ReactNode } from 'react';
+export type ShortcutKeyContextType = {
+    enabledScopes: string[];
+    enableScope: (scope: string) => void;
+    disableScope: (scope: string) => void;
+};
+type Props = {
+    initiallyActiveScopes?: string[];
+    children: ReactNode;
+};
+/**
+ * @param enabledScopes 초기에 단축키가 가능한 scopes, "*" 인 경우 전체 scope에서 가능
+ * @param enableScope 가능한 scope 등록하는 함수
+ * @param disableScope 불가능한 scope 등록하는 함수
+ * @examples
+ * 1. 단축키 scope을 적용시킬 최상단 컴포넌트에 ShortcutKeyProvider로 감싸주기
+ * <ShortcutKeyProvider><App /></ShortcutKeyProvider>
+ * 2. 단축키를 사용하는 컴포넌트에 아래와 같이 코드 적용
+ * const { enableScope, disableScope } = useShortcutKeyContext();
+ * useShortcutKey('ctrl+d' , callback, { scopes: "Preview" });
+ * 컴포넌트 클릭 시 enableScope('Preview')로 가능한 scope 설정, disableScope('Sidebar')로 불가능한 scope 설정
+ *
+ * @todo 추후 작업이 필요
+ */
+export declare const useShortcutKeyContext: () => ShortcutKeyContextType;
+export declare const ShortcutKeyProvider: ({ initiallyActiveScopes, children }: Props) => JSX.Element;
+export {};

package/dist/src/common/hooks/useShortcutKey/ShortcutKeyProvider.js

@@ -0,0 +1,74 @@
+"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 __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ShortcutKeyProvider = exports.useShortcutKeyContext = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var ShortcutKeyContext = (0, react_1.createContext)({
+    enabledScopes: [],
+    enableScope: function () {
+        return;
+    },
+    disableScope: function () {
+        return;
+    }
+});
+/**
+ * @param enabledScopes 초기에 단축키가 가능한 scopes, "*" 인 경우 전체 scope에서 가능
+ * @param enableScope 가능한 scope 등록하는 함수
+ * @param disableScope 불가능한 scope 등록하는 함수
+ * @examples
+ * 1. 단축키 scope을 적용시킬 최상단 컴포넌트에 ShortcutKeyProvider로 감싸주기
+ * <ShortcutKeyProvider><App /></ShortcutKeyProvider>
+ * 2. 단축키를 사용하는 컴포넌트에 아래와 같이 코드 적용
+ * const { enableScope, disableScope } = useShortcutKeyContext();
+ * useShortcutKey('ctrl+d' , callback, { scopes: "Preview" });
+ * 컴포넌트 클릭 시 enableScope('Preview')로 가능한 scope 설정, disableScope('Sidebar')로 불가능한 scope 설정
+ *
+ * @todo 추후 작업이 필요
+ */
+var useShortcutKeyContext = function () {
+    return (0, react_1.useContext)(ShortcutKeyContext);
+};
+exports.useShortcutKeyContext = useShortcutKeyContext;
+var ShortcutKeyProvider = function (_a) {
+    var _b = _a.initiallyActiveScopes, initiallyActiveScopes = _b === void 0 ? ['*'] : _b, children = _a.children;
+    var _c = (0, react_1.useState)((initiallyActiveScopes === null || initiallyActiveScopes === void 0 ? void 0 : initiallyActiveScopes.length) > 0 ? initiallyActiveScopes : ['*']), activeScopes = _c[0], setActiveScopes = _c[1];
+    var enableScope = (0, react_1.useCallback)(function (scope) {
+        setActiveScopes(function (prev) {
+            if (prev.includes('*')) {
+                return [scope];
+            }
+            return Array.from(new Set(__spreadArray(__spreadArray([], prev, true), [scope], false)));
+        });
+    }, []);
+    var disableScope = (0, react_1.useCallback)(function (scope) {
+        setActiveScopes(function (prev) {
+            if (prev.filter(function (s) { return s !== scope; }).length === 0) {
+                return ['*'];
+            }
+            return prev.filter(function (s) { return s !== scope; });
+        });
+    }, []);
+    return ((0, jsx_runtime_1.jsx)(ShortcutKeyContext.Provider, __assign({ value: { enabledScopes: activeScopes, enableScope: enableScope, disableScope: disableScope } }, { children: children })));
+};
+exports.ShortcutKeyProvider = ShortcutKeyProvider;

package/dist/src/common/hooks/useShortcutKey/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const reservedModifierKeywords: string[];
+export declare const mappedKeys: Record<string, string>;

package/dist/src/common/hooks/useShortcutKey/constants.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mappedKeys = exports.reservedModifierKeywords = void 0;
+exports.reservedModifierKeywords = ['shift', 'alt', 'meta', 'mod', 'ctrl'];
+exports.mappedKeys = {
+    esc: 'escape',
+    return: 'enter',
+    '.': 'period',
+    ',': 'comma',
+    '-': 'slash',
+    ' ': 'space',
+    '`': 'backquote',
+    '#': 'backslash',
+    '+': 'bracketright',
+    ShiftLeft: 'shift',
+    ShiftRight: 'shift',
+    AltLeft: 'alt',
+    AltRight: 'alt',
+    MetaLeft: 'meta',
+    MetaRight: 'meta',
+    OSLeft: 'meta',
+    OSRight: 'meta',
+    ControlLeft: 'ctrl',
+    ControlRight: 'ctrl'
+};

package/dist/src/common/hooks/useShortcutKey/index.d.ts

@@ -0,0 +1,3 @@
+import { ShortcutKeyProvider, useShortcutKeyContext } from './ShortcutKeyProvider';
+import { useShortcutKey } from './useShortcutKey';
+export { useShortcutKey, ShortcutKeyProvider, useShortcutKeyContext };

package/dist/src/common/hooks/useShortcutKey/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useShortcutKeyContext = exports.ShortcutKeyProvider = exports.useShortcutKey = void 0;
+var ShortcutKeyProvider_1 = require("./ShortcutKeyProvider");
+Object.defineProperty(exports, "ShortcutKeyProvider", { enumerable: true, get: function () { return ShortcutKeyProvider_1.ShortcutKeyProvider; } });
+Object.defineProperty(exports, "useShortcutKeyContext", { enumerable: true, get: function () { return ShortcutKeyProvider_1.useShortcutKeyContext; } });
+var useShortcutKey_1 = require("./useShortcutKey");
+Object.defineProperty(exports, "useShortcutKey", { enumerable: true, get: function () { return useShortcutKey_1.useShortcutKey; } });

package/dist/src/common/hooks/useShortcutKey/types.d.ts

@@ -0,0 +1,27 @@
+import type { DependencyList } from 'react';
+export type KeyboardModifiers = {
+    alt?: boolean;
+    ctrl?: boolean;
+    meta?: boolean;
+    shift?: boolean;
+    mod?: boolean;
+};
+export type KeysEvent = KeyboardModifiers & {
+    keys?: readonly string[];
+};
+export type FormTags = 'input' | 'textarea' | 'select' | 'INPUT' | 'TEXTAREA' | 'SELECT';
+export type Scopes = string | readonly string[];
+export type Callback = (keyboardEvent: KeyboardEvent, keysEvent: KeysEvent) => void;
+export type Options = {
+    disabled?: boolean;
+    splitKey?: string;
+    scopes?: Scopes;
+    enableOnFormTags?: readonly FormTags[] | boolean;
+};
+export type RefType<T> = T | null;
+export type OptionsOrDependencyArray = Options | DependencyList;
+type DuplicateKeyboardShortcut = 'ctrl+d, meta+d' | 'meta+d, ctrl+d';
+type DeleteKeyboardShortcut = 'delete, backspace' | 'backspace, delete';
+type AcceptKeyboardShortcut = 'enter';
+export type TargetKeys = DuplicateKeyboardShortcut | DeleteKeyboardShortcut | AcceptKeyboardShortcut;
+export {};

package/dist/src/common/hooks/useShortcutKey/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/src/common/hooks/useShortcutKey/useShortcutKey.d.ts

@@ -0,0 +1,3 @@
+import { DependencyList } from 'react';
+import type { Callback, Options, TargetKeys } from './types';
+export declare function useShortcutKey(targetKeys: TargetKeys, callback: Callback, options?: Options, deps?: DependencyList): void;

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

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useShortcutKey = void 0;
+var react_1 = require("react");
+var ShortcutKeyProvider_1 = require("./ShortcutKeyProvider");
+var validators_1 = require("./validators");
+/**
+ * @param targetKeys 사용할 단축키
+ * @param callback 단축키를 눌렀을 때 실행시킬 콜백 함수
+ * @param deps 단축키가 실행될 때 호출되는 콜백 함수와 관련된 의존성으로 변경될 때마다 단축키 관련 동작을 다시 설정하도록 하기
+ * @param options disabled 단축키 비활성화 여부, scopes 해당 단축키 사용 범위 설정
+ * @example
+ * useKeyboardShortcut('ctrl+d, meta+d', handleDuplicate, [id]);
+ * useKeyboardShortcut('delete, backspace', handleDelete, [id], { disabled: true });
+ */
+var useSafeLayoutEffect = typeof window !== 'undefined' ? react_1.useLayoutEffect : react_1.useEffect;
+function useShortcutKey(targetKeys, callback, options, deps) {
+    var cbRef = (0, react_1.useRef)(callback);
+    var memoisedCB = (0, react_1.useCallback)(callback, deps !== null && deps !== void 0 ? deps : []);
+    if (deps) {
+        cbRef.current = memoisedCB;
+    }
+    else {
+        cbRef.current = callback;
+    }
+    var enabledScopes = (0, ShortcutKeyProvider_1.useShortcutKeyContext)().enabledScopes;
+    useSafeLayoutEffect(function () {
+        if ((options === null || options === void 0 ? void 0 : options.disabled) === false || !(0, validators_1.isScopeActive)(enabledScopes, options === null || options === void 0 ? void 0 : options.scopes))
+            return;
+        var listener = function (e) {
+            if ((0, validators_1.isKeyboardEventTriggeredByInput)(e) &&
+                !(0, validators_1.isShortcutkeyEnabledOnTag)(e, options === null || options === void 0 ? void 0 : options.enableOnFormTags)) {
+                return;
+            }
+            (0, validators_1.parseMultipleShortcutKeys)(targetKeys).forEach(function (key) {
+                var keys = (0, validators_1.parseKey)(key);
+                if ((0, validators_1.isKeyMatchingKeyboardEvent)(e, keys)) {
+                    e.preventDefault();
+                    cbRef.current(e, keys);
+                }
+            });
+        };
+        var handleKeyPress = function (e) {
+            if (e.key === undefined || e.repeat)
+                return;
+            (0, validators_1.pushToCurrentlyPressedKeys)((0, validators_1.mapKey)(e.code));
+            listener(e);
+        };
+        var handleKeyUp = function (e) {
+            if (e.key === undefined)
+                return;
+            (0, validators_1.removeFromCurrentlyPressedKeys)((0, validators_1.mapKey)(e.code));
+        };
+        document.addEventListener('keydown', handleKeyPress);
+        document.addEventListener('keyup', handleKeyUp);
+        return function () {
+            document.removeEventListener('keydown', handleKeyPress);
+            document.removeEventListener('keyup', handleKeyUp);
+        };
+    }, [targetKeys, options, enabledScopes]);
+}
+exports.useShortcutKey = useShortcutKey;

package/dist/src/common/hooks/useShortcutKey/validators.d.ts

@@ -0,0 +1,20 @@
+import type { FormTags, KeysEvent, Scopes } from './types';
+export declare function mapKey(key: string): string;
+export declare function parseKey(shortcutKey: string, combinationKey?: string): {
+    keys: string[];
+    alt?: boolean | undefined;
+    ctrl?: boolean | undefined;
+    meta?: boolean | undefined;
+    shift?: boolean | undefined;
+    mod?: boolean | undefined;
+};
+export declare function parseMultipleShortcutKeys(keys: string, splitKey?: string): string[];
+export declare function isKeyMatchingKeyboardEvent(e: KeyboardEvent, key: KeysEvent): boolean;
+export declare function isReadonlyArray(value: unknown): value is readonly unknown[];
+export declare function isKeyPressed(shortcutKey: string | readonly string[], splitKey?: string): boolean;
+export declare function isKeyModifier(key: string): boolean;
+export declare function pushToCurrentlyPressedKeys(key: string | string[]): void;
+export declare function removeFromCurrentlyPressedKeys(key: string | string[]): void;
+export declare function isScopeActive(activeScopes: string[], scopes?: Scopes): boolean;
+export declare function isKeyboardEventTriggeredByInput(e: KeyboardEvent): boolean;
+export declare function isShortcutkeyEnabledOnTag({ target }: KeyboardEvent, enabledOnTags?: readonly FormTags[] | boolean): boolean;

package/dist/src/common/hooks/useShortcutKey/validators.js

@@ -0,0 +1,150 @@
+"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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isShortcutkeyEnabledOnTag = exports.isKeyboardEventTriggeredByInput = exports.isScopeActive = exports.removeFromCurrentlyPressedKeys = exports.pushToCurrentlyPressedKeys = exports.isKeyModifier = exports.isKeyPressed = exports.isReadonlyArray = exports.isKeyMatchingKeyboardEvent = exports.parseMultipleShortcutKeys = exports.parseKey = exports.mapKey = void 0;
+var constants_1 = require("./constants");
+// NOTE - keydown된 key를 원하는 형태로 mapping해주는 함수입니다.
+function mapKey(key) {
+    return (constants_1.mappedKeys[key] || key)
+        .trim()
+        .toLocaleLowerCase()
+        .replace(/key|digit|numpad|arrow/, '');
+}
+exports.mapKey = mapKey;
+// NOTE - 단축키로 등록한 keys들을 key의 단위로 분리하여 parse해주는 함수입니다.
+function parseKey(shortcutKey, combinationKey) {
+    if (combinationKey === void 0) { combinationKey = '+'; }
+    var keys = shortcutKey
+        .toLocaleLowerCase()
+        .split(combinationKey)
+        .map(function (k) { return mapKey(k); });
+    var modifiers = {
+        alt: keys.includes('alt'),
+        ctrl: keys.includes('ctrl') || keys.includes('control'),
+        shift: keys.includes('shift'),
+        meta: keys.includes('meta'),
+        mod: keys.includes('mod')
+    };
+    var singleCharKeys = keys.filter(function (k) { return !constants_1.reservedModifierKeywords.includes(k); });
+    return __assign(__assign({}, modifiers), { keys: singleCharKeys });
+}
+exports.parseKey = parseKey;
+function parseMultipleShortcutKeys(keys, splitKey) {
+    if (splitKey === void 0) { splitKey = ','; }
+    return keys.split(splitKey);
+}
+exports.parseMultipleShortcutKeys = parseMultipleShortcutKeys;
+// NOTE - 설정한 단축키와 사용자가 누르고 있는 key의 일치여부를 판단하는 함수입니다.
+function isKeyMatchingKeyboardEvent(e, key) {
+    var alt = key.alt, meta = key.meta, mod = key.mod, shift = key.shift, ctrl = key.ctrl, shortcutKey = key.keys;
+    var pressedKeyUppercase = e.key, code = e.code, ctrlKey = e.ctrlKey, metaKey = e.metaKey, shiftKey = e.shiftKey, altKey = e.altKey;
+    var keyCode = mapKey(code);
+    var pressedKey = pressedKeyUppercase.toLowerCase();
+    if (alt === !altKey && pressedKey !== 'alt')
+        return false;
+    if (shift === !shiftKey && pressedKey !== 'shift')
+        return false;
+    // NOTE - mod는 macOS에 meta 그리고 다른 platform에서 ctrl을 확인하는 key name입니다.
+    if (mod) {
+        if (!metaKey && !ctrlKey) {
+            return false;
+        }
+    }
+    else {
+        if (meta === !metaKey && pressedKey !== 'meta' && pressedKey !== 'os') {
+            return false;
+        }
+        if (ctrl === !ctrlKey && pressedKey !== 'ctrl' && pressedKey !== 'control') {
+            return false;
+        }
+    }
+    if (shortcutKey &&
+        shortcutKey.length === 1 &&
+        (shortcutKey.includes(pressedKey) || shortcutKey.includes(keyCode))) {
+        return true;
+    }
+    if (shortcutKey)
+        return isKeyPressed(shortcutKey);
+    if (!shortcutKey)
+        return true;
+    return false;
+}
+exports.isKeyMatchingKeyboardEvent = isKeyMatchingKeyboardEvent;
+// NOTE - 현재 누른 key를 추적하기 위해 중복 요소를 허용하지 않는 데이터 구조인 변수입니다.
+var currentlyPressedKeys = new Set();
+// NOTE - 배열이 초기 생성된 이후 불변성을 유지하고 우발적이거나 무단의 변경을 방지하고 배열인지를 판단하는 함수입니다.
+function isReadonlyArray(value) {
+    return Array.isArray(value);
+}
+exports.isReadonlyArray = isReadonlyArray;
+// NOTE - 설정된 단축키와 현재 누른 key의 일치여부를 판단하는 함수입니다.
+function isKeyPressed(shortcutKey, splitKey) {
+    if (splitKey === void 0) { splitKey = ','; }
+    var keyArray = isReadonlyArray(shortcutKey) ? shortcutKey : shortcutKey.split(splitKey);
+    return keyArray.every(function (key) { return currentlyPressedKeys.has(key.trim().toLowerCase()); });
+}
+exports.isKeyPressed = isKeyPressed;
+function isKeyModifier(key) {
+    return constants_1.reservedModifierKeywords.includes(key);
+}
+exports.isKeyModifier = isKeyModifier;
+// NOTE - keydown시 누른 key 저장
+function pushToCurrentlyPressedKeys(key) {
+    var keyArray = Array.isArray(key) ? key : [key];
+    if (currentlyPressedKeys.has('meta')) {
+        currentlyPressedKeys.forEach(function (key) { return !isKeyModifier(key) && currentlyPressedKeys.delete(key.toLowerCase()); });
+    }
+    keyArray.forEach(function (key) { return currentlyPressedKeys.add(key.toLowerCase()); });
+}
+exports.pushToCurrentlyPressedKeys = pushToCurrentlyPressedKeys;
+// NOTE - keyup시 누른 key 삭제
+function removeFromCurrentlyPressedKeys(key) {
+    var keyArray = Array.isArray(key) ? key : [key];
+    if (key === 'meta') {
+        currentlyPressedKeys.clear();
+    }
+    else {
+        keyArray.forEach(function (key) { return currentlyPressedKeys.delete(key.toLowerCase()); });
+    }
+}
+exports.removeFromCurrentlyPressedKeys = removeFromCurrentlyPressedKeys;
+// NOTE - 다른 컴포넌트에 동일한 단축키를 사용하는 경우에 서로 다른 scope을 주어 단축키가 가능한 scope인지 아닌지를 판단하는 함수입니다.
+function isScopeActive(activeScopes, scopes) {
+    if (activeScopes.length === 0 && scopes) {
+        // eslint-disable-next-line no-console
+        console.warn('A shortcutKey has the "scopes" option set, however no active scopes were found. If you want to use the global scopes feature, you need to wrap your app in a <ShortcutKeyProvider>');
+        return true;
+    }
+    if (!scopes) {
+        return true;
+    }
+    return activeScopes.some(function (scope) { return scopes.includes(scope); }) || activeScopes.includes('*');
+}
+exports.isScopeActive = isScopeActive;
+// NOTE - keydown 하는 tag의 위치가 input, textarea, select인 경우에는 단축키가 동작하지 않도록 판단하는 함수입니다.
+function isKeyboardEventTriggeredByInput(e) {
+    return isShortcutkeyEnabledOnTag(e, ['input', 'textarea', 'select']);
+}
+exports.isKeyboardEventTriggeredByInput = isKeyboardEventTriggeredByInput;
+function isShortcutkeyEnabledOnTag(_a, enabledOnTags) {
+    var target = _a.target;
+    if (enabledOnTags === void 0) { enabledOnTags = false; }
+    var targetTagName = target && target.tagName;
+    if (isReadonlyArray(enabledOnTags)) {
+        return Boolean(targetTagName &&
+            enabledOnTags &&
+            enabledOnTags.some(function (tag) { return tag.toLowerCase() === targetTagName.toLowerCase(); }));
+    }
+    return Boolean(targetTagName && enabledOnTags && enabledOnTags === true);
+}
+exports.isShortcutkeyEnabledOnTag = isShortcutkeyEnabledOnTag;

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

@@ -344,5 +344,13 @@
     "sys_text_grey_05": "darkgrey400/opacity20",
     "sys_text_white_02": "white/opacity50",
     "sys_component_base_45": "darkgreen300",
-    "sys_component_base_46": "black/opacity90"
+    "sys_component_base_46": "black/opacity90",
+    "sys_cpnt_list_chatbubble_download_button_base": "white/opacity20",
+    "sys_cpnt_sheet_base_11": "darkgrey10",
+    "sys_cpnt_sheet_base_12": "white/opacity20",
+    "sys_sw_sidebar_item_text_emphasis": "darkgreen500",
+    "sys_sw_sidebar_item_icon_emphasis": "darkgreen500",
+    "sys_sw_sidebar_divider_vertical": "darkgrey100",
+    "sys_cpnt_sheet_base_13": "grey50",
+    "sys_cpnt_sheet_base_14": "grey900"
 }

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

@@ -314,7 +314,7 @@
     "sys_icon_grey_darktheme_03": "darkgrey400",
     "sys_widget_grey_01_opacity_50": "grey900/opacity50",
     "sys_editor_layout_header": "white",
-    "sys_editor_layout_navigation_panel": "grey50",
+    "sys_editor_layout_navigation_panel": "grey70",
     "sys_editor_layout_canvas_area": "grey30",
     "sys_editor_layout_control_panel": "white",
     "sys_editor_layout_property_panel": "white",
@@ -344,5 +344,13 @@
     "sys_text_grey_05": "grey400/opacity20",
     "sys_text_white_02": "white/opacity50",
     "sys_component_base_45": "green300",
-    "sys_component_base_46": "black/opacity90"
+    "sys_component_base_46": "black/opacity90",
+    "sys_cpnt_list_chatbubble_download_button_base": "black/opacity40",
+    "sys_cpnt_sheet_base_11": "grey10",
+    "sys_cpnt_sheet_base_12": "white/opacity20",
+    "sys_sw_sidebar_item_text_emphasis": "darkgreen500",
+    "sys_sw_sidebar_item_icon_emphasis": "darkgreen500",
+    "sys_sw_sidebar_divider_vertical": "darkgrey100",
+    "sys_cpnt_sheet_base_13": "grey50",
+    "sys_cpnt_sheet_base_14": "grey900"
 }

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

@@ -841,5 +841,14 @@
     "ui_110": "sys_component_base_black_opacity50",
     "ui_contentscontainer03_background": "sys_container_background_01",
     "ui_contents_dimmed": "sys_component_base_46",
-    "ui_cpnt_list_chatbubble_base_transparent": "sys_component_base_white_opacity00"
+    "ui_cpnt_list_chatbubble_base_transparent": "sys_component_base_white_opacity00",
+    "ui_cpnt_list_chatbubble_download_button_base": "sys_cpnt_list_chatbubble_download_button_base",
+    "ui_111": "sys_cpnt_sheet_base_11",
+    "ui_112": "sys_cpnt_sheet_base_12",
+    "ui_sw_sidebar_label_text_emphasis": "sys_sw_sidebar_item_text_emphasis",
+    "ui_cpnt_sidebar_label_icon_green": "sys_sw_sidebar_item_icon_emphasis",
+    "ui_sw_sidebar_divider_vertical": "sys_sw_sidebar_divider_vertical",
+    "ui_113": "sys_cpnt_sheet_base_13",
+    "ui_114": "sys_component_base_26",
+    "ui_115": "sys_cpnt_sheet_base_14"
 }