pds-dev-kit-web 1.4.10 → 1.4.13

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

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

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

@@ -0,0 +1,36 @@
+"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 Internal = 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("g", { fill: "none", fillRule: "evenodd" },
+            react_1.default.createElement("path", { fill: color, d: "M14.7582,12.7939 L10.8292,16.2299 C10.3482,16.6499 9.5962,16.3079 9.5972,15.6689 L9.5992,14.4879 C5.4052,14.4259 2.3502,10.9379 1.0372,8.1439 C0.8732,7.7959 1.2792,7.4679 1.5952,7.6859 C5.5832,10.4329 9.0162,9.9579 9.6062,9.8499 C9.6062,9.8499 9.6072,9.3539 9.6072,8.7879 C9.6082,8.1489 10.3612,7.8079 10.8402,8.2299 L14.7602,11.6769 C15.0972,11.9739 15.0962,12.4989 14.7582,12.7939" }),
+            react_1.default.createElement("path", { stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M5.6353,7.6233 C5.6353,5.6903 7.2023,4.1233 9.1353,4.1233 L17.8883,4.1233 C19.8213,4.1233 21.3883,5.6903 21.3883,7.6233 L21.3883,16.3763 C21.3883,18.3093 19.8213,19.8763 17.8883,19.8763 L9.1353,19.8763 C7.2023,19.8763 5.6353,18.3093 5.6353,16.3763" }))));
+};
+exports.default = Internal;

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

@@ -46,6 +46,7 @@ declare const lineIcons: {
     readonly ic_filter: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_folder: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_information: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    readonly ic_internal: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_language: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_links: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_live: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;

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

@@ -49,6 +49,7 @@ var EyeClose_1 = __importDefault(require("./EyeClose"));
 var Filter_1 = __importDefault(require("./Filter"));
 var Folder_1 = __importDefault(require("./Folder"));
 var Information_1 = __importDefault(require("./Information"));
+var Internal_1 = __importDefault(require("./Internal"));
 var Language_1 = __importDefault(require("./Language"));
 var Links_1 = __importDefault(require("./Links"));
 var Live_1 = __importDefault(require("./Live"));
@@ -187,6 +188,7 @@ var lineIcons = {
     ic_filter: Filter_1.default,
     ic_folder: Folder_1.default,
     ic_information: Information_1.default,
+    ic_internal: Internal_1.default,
     ic_language: Language_1.default,
     ic_links: Links_1.default,
     ic_live: Live_1.default,

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

@@ -20,6 +20,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importStar(require("react"));
+var react_router_dom_1 = require("react-router-dom");
 var styled_components_1 = require("styled-components");
 var desktop_1 = require("../../../desktop");
 var components_1 = require("../../../desktop/components");
@@ -364,12 +365,26 @@ function ToneTest() {
         }
     };
     return (react_1.default.createElement("div", null,
-        react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
-        react_1.default.createElement(components_1.MainButton, { iconName: "ic_arrow_round_left", text: "Toggle Tone", onClick: changeTone, styleTheme: "secondary" }),
-        react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
-        react_1.default.createElement(components_1.TextLabel, { text: "\uC774\uACF3\uC740 toggled\uB41C tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }),
-        react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
-        react_1.default.createElement(styled_components_1.ThemeProvider, { theme: (0, theme_1.themeByGivenTone)(customTone) },
+        react_1.default.createElement(react_router_dom_1.BrowserRouter, null,
+            react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
+            react_1.default.createElement(components_1.MainButton, { iconName: "ic_arrow_round_left", text: "Toggle Tone", onClick: changeTone, styleTheme: "secondary" }),
+            react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
+            react_1.default.createElement(components_1.TextLabel, { text: "\uC774\uACF3\uC740 toggled\uB41C tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }),
+            react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
+            react_1.default.createElement(styled_components_1.ThemeProvider, { theme: (0, theme_1.themeByGivenTone)(customTone) },
+                react_1.default.createElement(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
+                        src: 'http://i.imgur.com/zVKjblJ.png',
+                        text: 'PEPSI',
+                        href: '/'
+                    }, userProfile: {
+                        src: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSL5qfISvgI8p95f3w5lZN9XNwYh1mRiIqEaQ&usqp=CAU',
+                        href: '/'
+                    }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" })),
+            react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_e" }),
+            react_1.default.createElement(hybrid_1.Divider, null),
+            react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
+            react_1.default.createElement(components_1.TextLabel, { text: "\uC774\uACF3\uC740 \uAE30\uBCF8 tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }),
+            react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
             react_1.default.createElement(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
                     src: 'http://i.imgur.com/zVKjblJ.png',
                     text: 'PEPSI',
@@ -377,19 +392,6 @@ function ToneTest() {
                 }, userProfile: {
                     src: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSL5qfISvgI8p95f3w5lZN9XNwYh1mRiIqEaQ&usqp=CAU',
                     href: '/'
-                }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" })),
-        react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_e" }),
-        react_1.default.createElement(hybrid_1.Divider, null),
-        react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
-        react_1.default.createElement(components_1.TextLabel, { text: "\uC774\uACF3\uC740 \uAE30\uBCF8 tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }),
-        react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
-        react_1.default.createElement(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
-                src: 'http://i.imgur.com/zVKjblJ.png',
-                text: 'PEPSI',
-                href: '/'
-            }, userProfile: {
-                src: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSL5qfISvgI8p95f3w5lZN9XNwYh1mRiIqEaQ&usqp=CAU',
-                href: '/'
-            }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" })));
+                }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" }))));
 }
 exports.default = ToneTest;

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

@@ -28,7 +28,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BasePathContext = void 0;
 var react_1 = __importStar(require("react"));
-var react_router_dom_1 = require("react-router-dom");
 var styled_components_1 = __importDefault(require("styled-components"));
 var BoxLayout_1 = require("../../../common/components/BoxLayout");
 var blocks_1 = require("./blocks");
@@ -42,13 +41,12 @@ function DynamicDesktopNavBar(_a) {
     var slicedPrimaryMenus = (0, react_1.useMemo)(function () { return primaryMenus === null || primaryMenus === void 0 ? void 0 : primaryMenus.slice(0, primaryMenuOptions.maxLength); }, [primaryMenus, primaryMenuOptions]);
     var slicedSecondaryMenus = (0, react_1.useMemo)(function () { var _a; return (_a = secondaryMenus === null || secondaryMenus === void 0 ? void 0 : secondaryMenus.slice(0, secondaryMenuOptions.maxLength)) !== null && _a !== void 0 ? _a : []; }, [secondaryMenus, secondaryMenuOptions]);
     return (react_1.default.createElement(exports.BasePathContext.Provider, { value: { basePath: basePath } },
-        react_1.default.createElement(react_router_dom_1.BrowserRouter, { basename: basePath },
-            react_1.default.createElement(S_DynamicDesktopNavBar, { isPreview: isPreview },
-                react_1.default.createElement(S_Grid, { className: "DynamicDesktopNavBarGrid", gridTemplate: gridTemplate, style: gridStyle },
-                    react_1.default.createElement(blocks_1.BrandLogo, { to: brandLogo.href, logoSrc: brandLogo.src, fallbackText: brandLogo.text }),
-                    react_1.default.createElement(blocks_1.PrimaryMenu, { menus: slicedPrimaryMenus, showMenuAsIcon: primaryMenuOptions.showMenuAsIcon, style: primaryMenuOptions.style }),
-                    showSecondaryMenu && (react_1.default.createElement(blocks_1.SecondaryMenu, { menus: slicedSecondaryMenus, showMenuAsIcon: secondaryMenuOptions.showMenuAsIcon, style: secondaryMenuOptions.style })),
-                    react_1.default.createElement(blocks_1.UserProfile, { src: userProfile.src, to: userProfile.href, style: userProfileOptions.style }))))));
+        react_1.default.createElement(S_DynamicDesktopNavBar, { isPreview: isPreview },
+            react_1.default.createElement(S_Grid, { className: "DynamicDesktopNavBarGrid", gridTemplate: gridTemplate, style: gridStyle },
+                react_1.default.createElement(blocks_1.BrandLogo, { to: brandLogo.href, logoSrc: brandLogo.src, fallbackText: brandLogo.text }),
+                react_1.default.createElement(blocks_1.PrimaryMenu, { menus: slicedPrimaryMenus, showMenuAsIcon: primaryMenuOptions.showMenuAsIcon, style: primaryMenuOptions.style }),
+                showSecondaryMenu && (react_1.default.createElement(blocks_1.SecondaryMenu, { menus: slicedSecondaryMenus, showMenuAsIcon: secondaryMenuOptions.showMenuAsIcon, style: secondaryMenuOptions.style })),
+                react_1.default.createElement(blocks_1.UserProfile, { src: userProfile.src, to: userProfile.href, style: userProfileOptions.style })))));
 }
 var S_Grid = (0, styled_components_1.default)(BoxLayout_1.Grid)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  justify-items: center;\n  gap: 24px;\n  padding-left: ", ";\n  padding-right: ", ";\n"], ["\n  align-items: center;\n  justify-items: center;\n  gap: 24px;\n  padding-left: ", ";\n  padding-right: ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/desktop/components/DynamicDesktopNavBar/components/MenuItemNav/components/PAppMenuItemNav.js

@@ -35,15 +35,15 @@ function PAppMenuItemNav(_a) {
     var activeMatch = (0, react_router_dom_1.useRouteMatch)(basePath + "/:activeKey");
     var isActive = (0, react_1.useMemo)(function () {
         return (activeMatch === null || activeMatch === void 0 ? void 0 : activeMatch.params.activeKey) === menu.pAppCode;
-    }, [match, activeMatch]);
+    }, [menu, match, activeMatch]);
     if (showMenuAsIcon) {
         if (menu.iconSrc) {
-            return react_1.default.createElement(ImageIconNav_1.default, { to: "/" + menu.pAppCode, iconSrc: menu.iconSrc, openNewTab: false });
+            return (react_1.default.createElement(ImageIconNav_1.default, { to: basePath + "/" + menu.pAppCode, iconSrc: menu.iconSrc, openNewTab: false }));
         }
         if (menu.iconName) {
-            return react_1.default.createElement(IconNav_1.default, { to: "/" + menu.pAppCode, iconName: menu.iconName });
+            return react_1.default.createElement(IconNav_1.default, { to: basePath + "/" + menu.pAppCode, iconName: menu.iconName });
         }
     }
-    return isContextMenu ? (react_1.default.createElement(Navigations_1.ContextTextLabelNav, { isActive: isActive, preventLineChange: true, openNewTab: false, to: "/" + menu.pAppCode, text: menu.name })) : (react_1.default.createElement(Navigations_1.TextLabelNav, { isActive: isActive, preventLineChange: true, openNewTab: false, to: "/" + menu.pAppCode, text: menu.name }));
+    return isContextMenu ? (react_1.default.createElement(Navigations_1.ContextTextLabelNav, { isActive: isActive, preventLineChange: true, openNewTab: false, to: basePath + "/" + menu.pAppCode, text: menu.name })) : (react_1.default.createElement(Navigations_1.TextLabelNav, { isActive: isActive, preventLineChange: true, openNewTab: false, to: basePath + "/" + menu.pAppCode, text: menu.name }));
 }
 exports.default = PAppMenuItemNav;

package/dist/src/desktop/components/DynamicDesktopNavBar/types.d.ts

@@ -1,4 +1,5 @@
 import { PDSIconType } from '../../../common';
+export type { DynamicDesktopTemplateType, TemplateNamesType, TemplatesDataType } from './templates/types';
 export declare type ParsedNode = {
     menuItemType: 'NAV_P_APP' | 'WEB_LINK';
     type: 'GENERAL_NODE';

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

@@ -19,9 +19,12 @@ function Switch(_a) {
         react_1.default.createElement(S_Label, { htmlFor: name, disabled: state === 'disabled' })));
 }
 var S_Switch = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  width: 56px;\n  height: 32px;\n"], ["\n  position: relative;\n  width: 56px;\n  height: 32px;\n"])));
-var S_Label = styled_components_1.default.label(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 56px;\n  height: 32px;\n  border-radius: 24px;\n  background: ", ";\n  cursor: pointer;\n\n  &::after {\n    content: '';\n    display: block;\n    border-radius: 24px;\n    width: 24px;\n    height: 24px;\n    margin: ", ";\n    background: ", ";\n  }\n"], ["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 56px;\n  height: 32px;\n  border-radius: 24px;\n  background: ", ";\n  cursor: pointer;\n\n  &::after {\n    content: '';\n    display: block;\n    border-radius: 24px;\n    width: 24px;\n    height: 24px;\n    margin: ", ";\n    background: ", ";\n  }\n"])), function (_a) {
+var S_Label = styled_components_1.default.label(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 56px;\n  height: 32px;\n  border-radius: 24px;\n  background: ", ";\n  cursor: ", ";\n\n  &::after {\n    content: '';\n    display: block;\n    border-radius: 24px;\n    width: 24px;\n    height: 24px;\n    margin: ", ";\n    background: ", ";\n  }\n"], ["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 56px;\n  height: 32px;\n  border-radius: 24px;\n  background: ", ";\n  cursor: ", ";\n\n  &::after {\n    content: '';\n    display: block;\n    border-radius: 24px;\n    width: 24px;\n    height: 24px;\n    margin: ", ";\n    background: ", ";\n  }\n"])), function (_a) {
     var theme = _a.theme, disabled = _a.disabled;
     return disabled ? theme.ui_cpnt_selcontrols_base_off_disabled : theme.ui_cpnt_selcontrols_base_off;
+}, function (_a) {
+    var disabled = _a.disabled;
+    return (disabled ? 'default' : 'pointer');
 }, function (_a) {
     var theme = _a.theme;
     return theme.spacing.spacingA;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pds-dev-kit-web",
-  "version": "1.4.10",
+  "version": "1.4.13",
   "license": "MIT",
   "private": false,
   "main": "dist/index.js",

package/release-note.md

@@ -1,16 +1,8 @@
 # PDS-DEV-KIT-WEB Release Notes
-## [v1.4.10]
-
-### Package
-* 스토리북 정렬 순서 알파벳순으로 변경
-* theme과 따로 쓸 수 있는 themeByGivenTone 생성
+## [v1.4.13]
 
 ### Component
-* IconButton
-  * 내부에서 사용하던 customTheme제거(theme을 사용하도록 수정)
-* TextLabel
-  * 내부에서 사용하던 customTheme제거(theme을 사용하도록 수정)
-* UploadIconButton
-  * 내부에서 사용하던 customTheme제거(theme을 사용하도록 수정)
 * Icon
-  * 내부에서 사용하던 customTheme제거(theme을 사용하도록 수정)
+  * ic_internal line추가
+* Switch
+  * disabled 상태일 때의 커서를 기본 상태로 변경