pds-dev-kit-web 2.0.8 → 2.0.9-alpha.1

package/dist/src/sub/DynamicLayout/sections/MembershipSection/constants.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MEMBERSHIP_SECTION_TONE_COLOR = void 0;
+exports.MEMBERSHIP_SECTION_TONE_COLOR = {
+    LIGHT: {
+        contentBackgroundDimColor: '#F5F5F8B3',
+        iconButtonBackgroundColor: '#FFFFFFFF',
+        iconButtonBorderColor: '#E3E5E9FF',
+        iconButtonDisabledBackgroundColor: '#FFFFFFFF',
+        iconButtonDisabledIconColor: '#AAAAB1FF',
+        iconButtonIconColor: '#1E1E20FF',
+        membershipPlanSheetBackgroundColor: '#EAEBEFFF',
+        membershipSheetBackgroundColor: '#F5F5F8FF',
+        membershipSheetTextLabelColor: '#1E1E20FF',
+        scrollbarColor: '#E3E5E9FF'
+    },
+    DARK: {
+        contentBackgroundDimColor: '#25252699',
+        iconButtonBackgroundColor: '#1E1E20FF',
+        iconButtonBorderColor: '#404042FF',
+        iconButtonDisabledBackgroundColor: '#151515FF',
+        iconButtonDisabledIconColor: '#68686CFF',
+        iconButtonIconColor: '#FDFDFDFF',
+        membershipPlanSheetBackgroundColor: '#303032FF',
+        membershipSheetBackgroundColor: '#252526FF',
+        membershipSheetTextLabelColor: '#FDFDFDFF',
+        scrollbarColor: '#404042FF'
+    }
+};

package/dist/src/sub/DynamicLayout/sections/MembershipSection/index.d.ts

@@ -0,0 +1,3 @@
+import { EditTypeMembershipSection } from './EditType';
+import { NormalTypeMembershipSection } from './NormalType';
+export { EditTypeMembershipSection, NormalTypeMembershipSection };

package/dist/src/sub/DynamicLayout/sections/MembershipSection/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NormalTypeMembershipSection = exports.EditTypeMembershipSection = void 0;
+var EditType_1 = require("./EditType");
+Object.defineProperty(exports, "EditTypeMembershipSection", { enumerable: true, get: function () { return EditType_1.EditTypeMembershipSection; } });
+var NormalType_1 = require("./NormalType");
+Object.defineProperty(exports, "NormalTypeMembershipSection", { enumerable: true, get: function () { return NormalType_1.NormalTypeMembershipSection; } });

package/dist/src/sub/DynamicLayout/sections/MembershipSection/type.d.ts

@@ -0,0 +1,5 @@
+export declare type TypeOfMembershipSectionToneColor = {
+    [key in colorTonePreset]: string;
+};
+declare type colorTonePreset = 'contentBackgroundDimColor' | 'iconButtonBackgroundColor' | 'iconButtonBorderColor' | 'iconButtonDisabledBackgroundColor' | 'iconButtonDisabledIconColor' | 'iconButtonIconColor' | 'membershipPlanSheetBackgroundColor' | 'membershipSheetBackgroundColor' | 'membershipSheetTextLabelColor' | 'scrollbarColor';
+export {};

package/dist/src/sub/DynamicLayout/sections/MembershipSection/type.js

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

package/dist/src/sub/DynamicLayout/sections/index.d.ts

@@ -3,4 +3,6 @@ export { ContentsSection } from './ContentsSection';
 export { FooterSection } from './FooterSection';
 export { InfoBoxSection } from './InfoBoxSection';
 export { IntroSection } from './IntroSection';
+export { EditTypeMembershipSection } from './MembershipSection';
+export { NormalTypeMembershipSection } from './MembershipSection';
 export { FullscreenIframeSection } from './FullscreenIframeSection';

package/dist/src/sub/DynamicLayout/sections/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.FullscreenIframeSection = exports.IntroSection = exports.InfoBoxSection = exports.FooterSection = exports.ContentsSection = exports.ContentsCarouselSection = void 0;
+exports.FullscreenIframeSection = exports.NormalTypeMembershipSection = exports.EditTypeMembershipSection = exports.IntroSection = exports.InfoBoxSection = exports.FooterSection = exports.ContentsSection = exports.ContentsCarouselSection = void 0;
 var ContentsCarouselSection_1 = require("./ContentsCarouselSection");
 Object.defineProperty(exports, "ContentsCarouselSection", { enumerable: true, get: function () { return ContentsCarouselSection_1.ContentsCarouselSection; } });
 var ContentsSection_1 = require("./ContentsSection");
@@ -11,5 +11,9 @@ var InfoBoxSection_1 = require("./InfoBoxSection");
 Object.defineProperty(exports, "InfoBoxSection", { enumerable: true, get: function () { return InfoBoxSection_1.InfoBoxSection; } });
 var IntroSection_1 = require("./IntroSection");
 Object.defineProperty(exports, "IntroSection", { enumerable: true, get: function () { return IntroSection_1.IntroSection; } });
+var MembershipSection_1 = require("./MembershipSection");
+Object.defineProperty(exports, "EditTypeMembershipSection", { enumerable: true, get: function () { return MembershipSection_1.EditTypeMembershipSection; } });
+var MembershipSection_2 = require("./MembershipSection");
+Object.defineProperty(exports, "NormalTypeMembershipSection", { enumerable: true, get: function () { return MembershipSection_2.NormalTypeMembershipSection; } });
 var FullscreenIframeSection_1 = require("./FullscreenIframeSection");
 Object.defineProperty(exports, "FullscreenIframeSection", { enumerable: true, get: function () { return FullscreenIframeSection_1.FullscreenIframeSection; } });

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

@@ -1,9 +1,11 @@
+/// <reference types="react" />
 import type { TypeOfSectionAction } from './sectionActionTypes';
 export { TypeOfSectionAction };
-export declare type TypeOfSectionManifestSchema = 'BASE_INTRO' | 'BASE_CONTENTS' | 'BASE_CONTENTS_CAROUSEL' | 'BASE_FOOTER' | 'BASE_INFO_BOX' | 'EXP_IFRAME';
-export declare type TypeofSectionTemplate = 'BASE_INTRO_A' | 'BASE_INTRO_B' | 'BASE_INTRO_C' | 'BASE_INTRO_D' | 'BASE_CONTENTS_A' | 'BASE_CONTENTS_B' | 'BASE_CONTENTS_CAROUSEL_A' | 'BASE_CONTENTS_CAROUSEL_B' | 'BASE_FOOTER_A' | 'BASE_FOOTER_B' | 'BASE_INFO_BOX_A' | 'EXP_IFRAME_A';
+export declare type TypeOfSectionManifestSchema = 'BASE_INTRO' | 'BASE_CONTENTS' | 'BASE_CONTENTS_CAROUSEL' | 'BASE_FOOTER' | 'BASE_INFO_BOX' | 'EXP_IFRAME' | 'PRG_MEMBERSHIP_DISPLAY';
+export declare type TypeofSectionTemplate = 'BASE_INTRO_A' | 'BASE_INTRO_B' | 'BASE_INTRO_C' | 'BASE_INTRO_D' | 'BASE_CONTENTS_A' | 'BASE_CONTENTS_B' | 'BASE_CONTENTS_CAROUSEL_A' | 'BASE_CONTENTS_CAROUSEL_B' | 'BASE_FOOTER_A' | 'BASE_FOOTER_B' | 'BASE_INFO_BOX_A' | 'EXP_IFRAME_A' | 'PRG_MEMBERSHIP_DISPLAY_A' | 'PRG_MEMBERSHIP_DISPLAY_B';
 export declare type TypeOfSectionContentMediaType = 'IMAGE' | 'YOUTUBE';
 export declare type TypeOfSectionLinkType = 'WEB_LINK' | 'INTERNAL_LINK' | 'NONE';
+export declare type TypeOfSectionType = 'PROGRAMMED' | 'DESIGNED';
 export declare type TypeOfCarouselAutoplayMode = 'AUTO' | 'MANUAL';
 export declare type TypeOfCarouselInfiniteLoopMode = 'USE' | 'NO_USE';
 export declare type TypeOfBackgroundMediaType = 'IMAGE' | 'YOUTUBE';
@@ -12,8 +14,10 @@ export declare type TypeOfItemButtonDesignType = 'A' | 'B' | 'C' | 'D' | 'E' | '
 export declare type TypeOfItemManifestSchema = 'BASE_CONTENTS_CAROUSEL_ITEM' | 'BASE_FOOTER_ITEM' | 'BASE_INFO_BOX_ITEM';
 export declare type TypeOfItemLinkMethod = 'CLICK_ITEM' | 'CLICK_BUTTON_IN_ITEM' | 'NONE';
 export declare type TypeOfItemLinkType = 'WEB_LINK' | 'INTERNAL_LINK' | 'NONE';
+export declare type TypeOfItemToneType = 'LIGHT' | 'DARK';
+export declare type TypeOfProgrammedItemActionButtonTextType = 'A' | 'B' | 'C' | 'D' | 'E';
 declare type KeyOfSectionProperties = 'title' | 'description' | 'section_content_media_type' | 'section_content_media_src' | 'button_alpha_label' | 'button_alpha_link_type' | 'button_alpha_link_src' | 'button_bravo_label' | 'button_bravo_link_type' | 'button_bravo_link_src' | 'button_charlie_label' | 'button_charlie_link_type' | 'button_charlie_link_src' | 'button_delta_label' | 'button_delta_link_type' | 'button_delta_link_src' | 'button_echo_label' | 'button_echo_link_type' | 'button_echo_link_src' | 'carousel_autoplay_mode' | 'carousel_autoplay_time' | 'carousel_infinite_loop_mode' | 'item_link_method' | 'multi_purpose_url';
-declare type KeyOfSectionStyles = 'title_color_in_hex' | 'description_color_in_hex' | 'background_color_in_hex' | 'background_media_type' | 'background_media_src' | 'background_overlay_color_in_hex' | 'button_alpha_design_type' | 'button_alpha_background_color_in_hex' | 'button_alpha_label_color_in_hex' | 'button_bravo_design_type' | 'button_bravo_background_color_in_hex' | 'button_bravo_label_color_in_hex' | 'button_charlie_design_type' | 'button_charlie_background_color_in_hex' | 'button_charlie_label_color_in_hex' | 'button_delta_design_type' | 'button_delta_background_color_in_hex' | 'button_delta_label_color_in_hex' | 'button_echo_design_type' | 'button_echo_background_color_in_hex' | 'button_echo_label_color_in_hex' | 'item_title_color_in_hex' | 'item_description_color_in_hex' | 'item_button_design_type' | 'item_button_background_color_in_hex' | 'item_button_label_color_in_hex';
+declare type KeyOfSectionStyles = 'title_color_in_hex' | 'description_color_in_hex' | 'background_color_in_hex' | 'background_media_type' | 'background_media_src' | 'background_overlay_color_in_hex' | 'button_alpha_design_type' | 'button_alpha_background_color_in_hex' | 'button_alpha_label_color_in_hex' | 'button_bravo_design_type' | 'button_bravo_background_color_in_hex' | 'button_bravo_label_color_in_hex' | 'button_charlie_design_type' | 'button_charlie_background_color_in_hex' | 'button_charlie_label_color_in_hex' | 'button_delta_design_type' | 'button_delta_background_color_in_hex' | 'button_delta_label_color_in_hex' | 'button_echo_design_type' | 'button_echo_background_color_in_hex' | 'button_echo_label_color_in_hex' | 'item_title_color_in_hex' | 'item_description_color_in_hex' | 'item_button_design_type' | 'item_button_background_color_in_hex' | 'item_button_label_color_in_hex' | 'item_highlighting_color_in_hex' | 'item_tone_type' | 'programmed_item_action_button_text_type';
 declare type KeyOfItemProperties = 'title' | 'description' | 'body' | 'logo_image_src' | 'image_src' | 'link_type' | 'link_src' | 'button_label';
 export interface ISection {
     id: number;
@@ -31,6 +35,11 @@ export interface ISection {
     dynamicLayoutSectionItems: Array<IItem> | null;
     insertedAt: string;
     updatedAt: string;
+    type?: TypeOfSectionType;
+    program?: 'MEMBERSHIP_DISPLAY';
+    programData?: {
+        mdid: string;
+    };
 }
 export interface ISectionProperties {
     title: string;
@@ -85,6 +94,9 @@ export interface ISectionStyles {
     itemButtonDesignType: TypeOfItemButtonDesignType;
     itemButtonBackgroundColorInHex: string;
     itemButtonLabelColorInHex: string;
+    itemHighlightingColorInHex: string;
+    itemToneType: TypeOfItemToneType;
+    programmedItemActionButtonTextType: TypeOfProgrammedItemActionButtonTextType;
 }
 export interface IItem {
     id: number;
@@ -99,7 +111,7 @@ export interface IItem {
     insertedAt: string;
     updatedAt: string;
 }
-interface IItemProperties {
+export interface IItemProperties {
     title: string;
     description: string;
     body: string;
@@ -178,4 +190,72 @@ export declare type DynamicLayoutProps = {
     navigationHandler?: (linkType: 'WEB_LINK' | 'INTERNAL_LINK' | 'NONE', src: string) => void;
     onClickEditSection?: (section: ISection) => void;
     sectionActionHandler?: (action: TypeOfSectionAction) => void;
+    programmedSectionComponents?: IProgrammedSectionComponents;
+    programmedSectionPreviewData?: IProgrammedSectionPreviewData;
+};
+declare type SubscriptionProductType = 'FREE_INFINITE' | 'FREE_FINITE' | 'ONCE_INFINITE' | 'ONCE_FINITE' | 'COUPON_FREE_INFINITE' | 'COUPON_FREE_FINITE' | 'COUPON_ONCE_INFINITE' | 'COUPON_ONCE_FINITE' | 'SUBSCRIPTION_30DAYS' | 'SUBSCRIPTION_90DAYS' | 'SUBSCRIPTION_180DAYS' | 'SUBSCRIPTION_365DAYS';
+declare type ExpiryPeriodInDaysType = 1 | 3 | 7 | 14 | 30;
+export declare type IMembershipCardTemplate = {
+    backgroundImageSrc: string;
+    logoImageSrc: string;
+    overlayType: 'NONE' | 'SOLID' | 'GRADIENT';
+    overlayColorPrimary: string;
+    overlayColorSecondary: string;
+    designSchema: 'A' | 'B' | 'C';
+};
+export declare type IMembershipBenefitInfo = {
+    benefitAlpha?: string;
+    benefitBravo?: string;
+    benefitCharlie?: string;
+    benefitDelta?: string;
+    benefitEcho?: string;
+};
+export declare type IConnectedSubscriptionProducts = {
+    id: number;
+    order: number;
+    connectedMembershipId: number;
+    subscriptionProductId: number;
+    subscriptionProduct: {
+        id: number;
+        type: SubscriptionProductType;
+        title: string;
+        alias: string;
+        expiryPeriodInDays: ExpiryPeriodInDaysType;
+        isDeactivated: boolean;
+        fee: number | string;
+        insertedAt: string;
+        updatedAt: string;
+    };
+};
+export declare type IMembership = {
+    id: number;
+    type: 'SYSTEM_GUEST' | 'SYSTEM_MEMBER' | 'SYSTEM_P_APP_UNLOCK' | 'GENERAL';
+    mid: string;
+    title: string;
+    insertedAt: string;
+    updatedAt: string;
+    membershipCardTemplate: IMembershipCardTemplate;
+    membershipBenefitInfo: IMembershipBenefitInfo;
+    totalSubscriptionProducts: number;
+};
+export declare type IConnectedMembership = {
+    id: number;
+    order: number;
+    mdid: string;
+    mid: string;
+    membership: IMembership;
+    connectedSubscriptionProducts: IConnectedSubscriptionProducts[];
+};
+export declare type IProgrammedSectionComponents = {
+    [key in TypeOfSectionManifestSchema]?: JSX.Element;
+};
+export declare type IMembershipDisplay = {
+    id: number;
+    mdid: string;
+    title: string;
+    isDefault: boolean;
+    connectedMemberships: IConnectedMembership[];
+};
+export declare type IProgrammedSectionPreviewData = {
+    MEMBERSHIP_DISPLAY?: IMembershipDisplay;
 };

package/package.json

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

package/release-note.md

@@ -1,8 +1,8 @@
 # PDS-DEV-KIT-WEB Release Notes
-## [v2.0.8]
+## [v2.0.9-alpha.1]
 
-## daily|https://design.storybook.publ.biz/
+## alpha|https://staging.storybook.publ.biz/
 
-### Layout
-* mobile 유형 전체
-    * min-width 제거
+### sub
+* DynamicLayout
+    * programmedSectionComponent 관련 에러 수정

package/webhook/node_modules/esrecurse/.babelrc

@@ -0,0 +1,3 @@
+{
+    "presets": ["es2015"]
+}