pds-dev-kit-web 1.4.10 → 1.4.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -20,6 +20,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
20
20
  };
21
21
  Object.defineProperty(exports, "__esModule", { value: true });
22
22
  var react_1 = __importStar(require("react"));
23
+ var react_router_dom_1 = require("react-router-dom");
23
24
  var styled_components_1 = require("styled-components");
24
25
  var desktop_1 = require("../../../desktop");
25
26
  var components_1 = require("../../../desktop/components");
@@ -364,12 +365,26 @@ function ToneTest() {
364
365
  }
365
366
  };
366
367
  return (react_1.default.createElement("div", null,
367
- react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
368
- react_1.default.createElement(components_1.MainButton, { iconName: "ic_arrow_round_left", text: "Toggle Tone", onClick: changeTone, styleTheme: "secondary" }),
369
- react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
370
- react_1.default.createElement(components_1.TextLabel, { text: "\uC774\uACF3\uC740 toggled\uB41C tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }),
371
- react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
372
- react_1.default.createElement(styled_components_1.ThemeProvider, { theme: (0, theme_1.themeByGivenTone)(customTone) },
368
+ react_1.default.createElement(react_router_dom_1.BrowserRouter, null,
369
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
370
+ react_1.default.createElement(components_1.MainButton, { iconName: "ic_arrow_round_left", text: "Toggle Tone", onClick: changeTone, styleTheme: "secondary" }),
371
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
372
+ react_1.default.createElement(components_1.TextLabel, { text: "\uC774\uACF3\uC740 toggled\uB41C tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }),
373
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
374
+ react_1.default.createElement(styled_components_1.ThemeProvider, { theme: (0, theme_1.themeByGivenTone)(customTone) },
375
+ react_1.default.createElement(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
376
+ src: 'http://i.imgur.com/zVKjblJ.png',
377
+ text: 'PEPSI',
378
+ href: '/'
379
+ }, userProfile: {
380
+ src: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSL5qfISvgI8p95f3w5lZN9XNwYh1mRiIqEaQ&usqp=CAU',
381
+ href: '/'
382
+ }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" })),
383
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_e" }),
384
+ react_1.default.createElement(hybrid_1.Divider, null),
385
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
386
+ react_1.default.createElement(components_1.TextLabel, { text: "\uC774\uACF3\uC740 \uAE30\uBCF8 tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }),
387
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
373
388
  react_1.default.createElement(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
374
389
  src: 'http://i.imgur.com/zVKjblJ.png',
375
390
  text: 'PEPSI',
@@ -377,19 +392,6 @@ function ToneTest() {
377
392
  }, userProfile: {
378
393
  src: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSL5qfISvgI8p95f3w5lZN9XNwYh1mRiIqEaQ&usqp=CAU',
379
394
  href: '/'
380
- }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" })),
381
- react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_e" }),
382
- react_1.default.createElement(hybrid_1.Divider, null),
383
- react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
384
- react_1.default.createElement(components_1.TextLabel, { text: "\uC774\uACF3\uC740 \uAE30\uBCF8 tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }),
385
- react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
386
- react_1.default.createElement(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
387
- src: 'http://i.imgur.com/zVKjblJ.png',
388
- text: 'PEPSI',
389
- href: '/'
390
- }, userProfile: {
391
- src: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSL5qfISvgI8p95f3w5lZN9XNwYh1mRiIqEaQ&usqp=CAU',
392
- href: '/'
393
- }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" })));
395
+ }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" }))));
394
396
  }
395
397
  exports.default = ToneTest;
@@ -28,7 +28,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
28
28
  Object.defineProperty(exports, "__esModule", { value: true });
29
29
  exports.BasePathContext = void 0;
30
30
  var react_1 = __importStar(require("react"));
31
- var react_router_dom_1 = require("react-router-dom");
32
31
  var styled_components_1 = __importDefault(require("styled-components"));
33
32
  var BoxLayout_1 = require("../../../common/components/BoxLayout");
34
33
  var blocks_1 = require("./blocks");
@@ -42,13 +41,12 @@ function DynamicDesktopNavBar(_a) {
42
41
  var slicedPrimaryMenus = (0, react_1.useMemo)(function () { return primaryMenus === null || primaryMenus === void 0 ? void 0 : primaryMenus.slice(0, primaryMenuOptions.maxLength); }, [primaryMenus, primaryMenuOptions]);
43
42
  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]);
44
43
  return (react_1.default.createElement(exports.BasePathContext.Provider, { value: { basePath: basePath } },
45
- react_1.default.createElement(react_router_dom_1.BrowserRouter, { basename: basePath },
46
- react_1.default.createElement(S_DynamicDesktopNavBar, { isPreview: isPreview },
47
- react_1.default.createElement(S_Grid, { className: "DynamicDesktopNavBarGrid", gridTemplate: gridTemplate, style: gridStyle },
48
- react_1.default.createElement(blocks_1.BrandLogo, { to: brandLogo.href, logoSrc: brandLogo.src, fallbackText: brandLogo.text }),
49
- react_1.default.createElement(blocks_1.PrimaryMenu, { menus: slicedPrimaryMenus, showMenuAsIcon: primaryMenuOptions.showMenuAsIcon, style: primaryMenuOptions.style }),
50
- showSecondaryMenu && (react_1.default.createElement(blocks_1.SecondaryMenu, { menus: slicedSecondaryMenus, showMenuAsIcon: secondaryMenuOptions.showMenuAsIcon, style: secondaryMenuOptions.style })),
51
- react_1.default.createElement(blocks_1.UserProfile, { src: userProfile.src, to: userProfile.href, style: userProfileOptions.style }))))));
44
+ react_1.default.createElement(S_DynamicDesktopNavBar, { isPreview: isPreview },
45
+ react_1.default.createElement(S_Grid, { className: "DynamicDesktopNavBarGrid", gridTemplate: gridTemplate, style: gridStyle },
46
+ react_1.default.createElement(blocks_1.BrandLogo, { to: brandLogo.href, logoSrc: brandLogo.src, fallbackText: brandLogo.text }),
47
+ react_1.default.createElement(blocks_1.PrimaryMenu, { menus: slicedPrimaryMenus, showMenuAsIcon: primaryMenuOptions.showMenuAsIcon, style: primaryMenuOptions.style }),
48
+ showSecondaryMenu && (react_1.default.createElement(blocks_1.SecondaryMenu, { menus: slicedSecondaryMenus, showMenuAsIcon: secondaryMenuOptions.showMenuAsIcon, style: secondaryMenuOptions.style })),
49
+ react_1.default.createElement(blocks_1.UserProfile, { src: userProfile.src, to: userProfile.href, style: userProfileOptions.style })))));
52
50
  }
53
51
  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) {
54
52
  var theme = _a.theme;
@@ -35,15 +35,15 @@ function PAppMenuItemNav(_a) {
35
35
  var activeMatch = (0, react_router_dom_1.useRouteMatch)(basePath + "/:activeKey");
36
36
  var isActive = (0, react_1.useMemo)(function () {
37
37
  return (activeMatch === null || activeMatch === void 0 ? void 0 : activeMatch.params.activeKey) === menu.pAppCode;
38
- }, [match, activeMatch]);
38
+ }, [menu, match, activeMatch]);
39
39
  if (showMenuAsIcon) {
40
- if (menu.iconSrc) {
41
- return react_1.default.createElement(ImageIconNav_1.default, { to: "/" + menu.pAppCode, iconSrc: menu.iconSrc, openNewTab: false });
42
- }
43
40
  if (menu.iconName) {
44
- return react_1.default.createElement(IconNav_1.default, { to: "/" + menu.pAppCode, iconName: menu.iconName });
41
+ return react_1.default.createElement(IconNav_1.default, { to: basePath + "/" + menu.pAppCode, iconName: menu.iconName });
42
+ }
43
+ if (menu.iconSrc) {
44
+ return (react_1.default.createElement(ImageIconNav_1.default, { to: basePath + "/" + menu.pAppCode, iconSrc: menu.iconSrc, openNewTab: false }));
45
45
  }
46
46
  }
47
- 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 }));
47
+ 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 }));
48
48
  }
49
49
  exports.default = PAppMenuItemNav;
@@ -1,4 +1,5 @@
1
1
  import { PDSIconType } from '../../../common';
2
+ export type { DynamicDesktopTemplateType, TemplateNamesType, TemplatesDataType } from './templates/types';
2
3
  export declare type ParsedNode = {
3
4
  menuItemType: 'NAV_P_APP' | 'WEB_LINK';
4
5
  type: 'GENERAL_NODE';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "1.4.10",
3
+ "version": "1.4.11",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,16 +1,6 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v1.4.10]
3
-
4
- ### Package
5
- * 스토리북 정렬 순서 알파벳순으로 변경
6
- * theme과 따로 쓸 수 있는 themeByGivenTone 생성
2
+ ## [v1.4.11]
7
3
 
8
4
  ### Component
9
- * IconButton
10
- * 내부에서 사용하던 customTheme제거(theme을 사용하도록 수정)
11
- * TextLabel
12
- * 내부에서 사용하던 customTheme제거(theme을 사용하도록 수정)
13
- * UploadIconButton
14
- * 내부에서 사용하던 customTheme제거(theme을 사용하도록 수정)
15
- * Icon
16
- * 내부에서 사용하던 customTheme제거(theme을 사용하도록 수정)
5
+ * DynamicDesktopNavBar
6
+ * 내부에 있던 browserRouter 제거(컴포넌트 사용시에 각자 넣어서 사용하도록)