pds-dev-kit-web 2.0.7 → 2.0.9-alpha.0

package/dist/src/sub/DynamicLayout/mock_samplePage.js

@@ -1,7 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.samplePage = exports.samplePageFullscreenIframeSection = exports.samplePageFooterSection = exports.samplePageIntroSection3 = exports.samplePageInfoBoxSection = exports.samplePageContentsSection = exports.samplePageIntroSection2 = exports.samplePageContentsCarouselSection = exports.samplePageIntroSection = void 0;
+exports.samplePage = exports.samplePageMemberships = exports.samplePageMembershipSection = exports.samplePageFullscreenIframeSection = exports.samplePageFooterSection = exports.samplePageIntroSection3 = exports.samplePageInfoBoxSection = exports.samplePageContentsSection = exports.samplePageIntroSection2 = exports.samplePageContentsCarouselSection = exports.samplePageIntroSection = void 0;
 exports.samplePageIntroSection = {
+    type: 'DESIGNED',
     display: true,
     dynamicLayoutSectionItems: [],
     id: 8,
@@ -93,12 +94,16 @@ exports.samplePageIntroSection = {
         itemButtonLabelColorInHex: '#FFFFFFFF',
         itemDescriptionColorInHex: '#68686BFF',
         itemTitleColorInHex: '#1E1E20FF',
-        titleColorInHex: '#FFFFFFFF'
+        itemHighlightingColorInHex: '#455EEFFF',
+        itemToneType: 'DARK',
+        titleColorInHex: '#FFFFFFFF',
+        programmedItemActionButtonTextType: 'A'
     },
     template: 'BASE_INTRO_A',
     updatedAt: '2023-01-06T09:05:45'
 };
 exports.samplePageContentsCarouselSection = {
+    type: 'DESIGNED',
     display: true,
     dynamicLayoutSectionItems: [
         {
@@ -362,12 +367,16 @@ exports.samplePageContentsCarouselSection = {
         itemButtonLabelColorInHex: '#FF2150FF',
         itemDescriptionColorInHex: '#FFFFFFFF',
         itemTitleColorInHex: '#FFFFFFFF',
-        titleColorInHex: '#FFFFFFFF'
+        itemHighlightingColorInHex: '#455EEFFF',
+        itemToneType: 'LIGHT',
+        titleColorInHex: '#FFFFFFFF',
+        programmedItemActionButtonTextType: 'A'
     },
     template: 'BASE_CONTENTS_CAROUSEL_A',
     updatedAt: '2023-01-06T09:05:45'
 };
 exports.samplePageIntroSection2 = {
+    type: 'DESIGNED',
     display: true,
     dynamicLayoutSectionItems: [],
     id: 10,
@@ -459,12 +468,16 @@ exports.samplePageIntroSection2 = {
         itemButtonLabelColorInHex: '#FFFFFFFF',
         itemDescriptionColorInHex: '#68686BFF',
         itemTitleColorInHex: '#1E1E20FF',
-        titleColorInHex: '#FFFFFFFF'
+        itemHighlightingColorInHex: '#455EEFFF',
+        itemToneType: 'LIGHT',
+        titleColorInHex: '#FFFFFFFF',
+        programmedItemActionButtonTextType: 'A'
     },
     template: 'BASE_INTRO_D',
     updatedAt: '2023-01-06T09:05:45'
 };
 exports.samplePageContentsSection = {
+    type: 'DESIGNED',
     display: true,
     dynamicLayoutSectionItems: [],
     id: 11,
@@ -546,12 +559,16 @@ exports.samplePageContentsSection = {
         itemButtonLabelColorInHex: '#FFFFFFFF',
         itemDescriptionColorInHex: '#68686BFF',
         itemTitleColorInHex: '#1E1E20FF',
-        titleColorInHex: '#FFFFFFFF'
+        itemHighlightingColorInHex: '#455EEFFF',
+        itemToneType: 'LIGHT',
+        titleColorInHex: '#FFFFFFFF',
+        programmedItemActionButtonTextType: 'A'
     },
     template: 'BASE_CONTENTS_B',
     updatedAt: '2023-01-06T09:05:45'
 };
 exports.samplePageInfoBoxSection = {
+    type: 'DESIGNED',
     display: true,
     dynamicLayoutSectionItems: [
         {
@@ -722,12 +739,16 @@ exports.samplePageInfoBoxSection = {
         itemButtonLabelColorInHex: '#FFFFFFFF',
         itemDescriptionColorInHex: '#FFFFFFE8',
         itemTitleColorInHex: '#FFFFFFFF',
-        titleColorInHex: '#FFFFFFFF'
+        itemHighlightingColorInHex: '#455EEFFF',
+        itemToneType: 'LIGHT',
+        titleColorInHex: '#FFFFFFFF',
+        programmedItemActionButtonTextType: 'A'
     },
     template: 'BASE_INFO_BOX_A',
     updatedAt: '2023-01-06T09:05:45'
 };
 exports.samplePageIntroSection3 = {
+    type: 'DESIGNED',
     display: true,
     dynamicLayoutSectionItems: [],
     id: 13,
@@ -819,12 +840,16 @@ exports.samplePageIntroSection3 = {
         itemButtonLabelColorInHex: '#FFFFFFFF',
         itemDescriptionColorInHex: '#68686BFF',
         itemTitleColorInHex: '#1E1E20FF',
-        titleColorInHex: '#FFFFFFFF'
+        itemHighlightingColorInHex: '#455EEFFF',
+        itemToneType: 'LIGHT',
+        titleColorInHex: '#FFFFFFFF',
+        programmedItemActionButtonTextType: 'A'
     },
     template: 'BASE_INTRO_D',
     updatedAt: '2023-01-06T09:05:45'
 };
 exports.samplePageFooterSection = {
+    type: 'DESIGNED',
     display: true,
     dynamicLayoutSectionItems: [
         {
@@ -897,7 +922,7 @@ exports.samplePageFooterSection = {
         backgroundColorInHex: '#0F0F10FF',
         backgroundMediaSrc: '',
         backgroundMediaType: 'IMAGE',
-        backgroundOverlayColorInHex: '#00000000',
+        backgroundOverlayColorInHex: '#FFFFFFFF',
         buttonAlphaBackgroundColorInHex: '#455EEFFF',
         buttonAlphaDesignType: 'A',
         buttonAlphaLabelColorInHex: '#FFFFFFFF',
@@ -919,12 +944,16 @@ exports.samplePageFooterSection = {
         itemButtonLabelColorInHex: '#FFFFFFFF',
         itemDescriptionColorInHex: '#676970FF',
         itemTitleColorInHex: '#1E1E20FF',
-        titleColorInHex: '#1E1E20FF'
+        itemHighlightingColorInHex: '#455EEFFF',
+        itemToneType: 'LIGHT',
+        titleColorInHex: '#1E1E20FF',
+        programmedItemActionButtonTextType: 'A'
     },
     template: 'BASE_FOOTER_B',
     updatedAt: '2023-01-06T09:05:45'
 };
 exports.samplePageFullscreenIframeSection = {
+    type: 'DESIGNED',
     display: false,
     dynamicLayoutSectionItems: null,
     id: 999,
@@ -988,11 +1017,189 @@ exports.samplePageFullscreenIframeSection = {
         itemButtonLabelColorInHex: '#FFFFFFFF',
         itemDescriptionColorInHex: '#676970FF',
         itemTitleColorInHex: '#1E1E20FF',
-        titleColorInHex: '#1E1E20FF'
+        itemHighlightingColorInHex: '#465FF0FF',
+        itemToneType: 'LIGHT',
+        titleColorInHex: '#1E1E20FF',
+        programmedItemActionButtonTextType: 'A'
     },
     template: 'EXP_IFRAME_A',
     updatedAt: '2023-01-06T09:05:45'
 };
+exports.samplePageMembershipSection = {
+    type: 'PROGRAMMED',
+    program: 'MEMBERSHIP_DISPLAY',
+    display: true,
+    dynamicLayoutSectionItems: null,
+    id: 15,
+    insertedAt: '2023-01-06T09:05:45',
+    manifest: {
+        availableProperties: [
+            'title',
+            'description',
+            'button_alpha_label',
+            'button_alpha_link_type',
+            'button_alpha_link_src',
+            'section_content_media_type',
+            'section_content_media_src'
+        ],
+        availableStyles: [
+            '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',
+            'item_highlighting_color_in_hex',
+            'item_tone_type',
+            'programmed_item_action_button_text_type'
+        ],
+        availableTemplates: ['PRG_MEMBERSHIP_DISPLAY_A', 'PRG_MEMBERSHIP_DISPLAY_B'],
+        schema: 'PRG_MEMBERSHIP_DISPLAY'
+    },
+    order: 8,
+    properties: {
+        buttonAlphaLabel: 'Lorem Ipsum',
+        buttonAlphaLinkSrc: 'https://team.publ.space',
+        buttonAlphaLinkType: 'WEB_LINK',
+        buttonBravoLabel: '',
+        buttonBravoLinkSrc: '',
+        buttonBravoLinkType: 'WEB_LINK',
+        buttonCharlieLabel: '',
+        buttonCharlieLinkSrc: '',
+        buttonCharlieLinkType: 'WEB_LINK',
+        buttonDeltaLabel: '',
+        buttonDeltaLinkSrc: '',
+        buttonDeltaLinkType: 'WEB_LINK',
+        buttonEchoLabel: '',
+        buttonEchoLinkSrc: '',
+        buttonEchoLinkType: 'WEB_LINK',
+        carouselAutoplayMode: 'MANUAL',
+        carouselAutoplayTime: 3,
+        carouselInfiniteLoopMode: 'NO_USE',
+        description: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
+        itemLinkMethod: 'CLICK_BUTTON_IN_ITEM',
+        sectionContentMediaSrc: '',
+        sectionContentMediaType: 'IMAGE',
+        title: 'Lorem Ipsum',
+        multiPurposeUrl: 'https://app.publr.co/'
+    },
+    styles: {
+        backgroundColorInHex: '#FF1D973B',
+        backgroundMediaSrc: '',
+        backgroundMediaType: 'IMAGE',
+        backgroundOverlayColorInHex: '#FFFFFF00',
+        buttonAlphaBackgroundColorInHex: '#FFC0CBFF',
+        buttonAlphaDesignType: 'C',
+        buttonAlphaLabelColorInHex: '#f5efd9FF',
+        buttonBravoBackgroundColorInHex: '#FFC0CBFF',
+        buttonBravoDesignType: 'E',
+        buttonBravoLabelColorInHex: '#FFFFFFFF',
+        buttonCharlieBackgroundColorInHex: '#465FF000',
+        buttonCharlieDesignType: 'E',
+        buttonCharlieLabelColorInHex: '#FFFFFFFF',
+        buttonDeltaBackgroundColorInHex: '#FFC0CBFF',
+        buttonDeltaDesignType: 'A',
+        buttonDeltaLabelColorInHex: '#FFFFFFFF',
+        buttonEchoBackgroundColorInHex: '#FFC0CBFF',
+        buttonEchoDesignType: 'A',
+        buttonEchoLabelColorInHex: '#FFFFFFFF',
+        descriptionColorInHex: '#FEECD8FF',
+        itemButtonBackgroundColorInHex: '#FFC0CBFF',
+        itemButtonDesignType: 'A',
+        itemButtonLabelColorInHex: '#FFFFFFFF',
+        itemDescriptionColorInHex: '#68686BFF',
+        itemTitleColorInHex: '#1E1E20FF',
+        itemHighlightingColorInHex: '#FF1D97FF',
+        itemToneType: 'LIGHT',
+        titleColorInHex: '#F8FFACFF',
+        programmedItemActionButtonTextType: 'A'
+    },
+    template: 'PRG_MEMBERSHIP_DISPLAY_B',
+    updatedAt: '2023-01-06T09:05:45'
+};
+exports.samplePageMemberships = {
+    id: 1,
+    mdid: "MEMBERSHIP_DISPLAY_MD_ID",
+    title: "MEMBERSHIP_DISPLAY_MD_TITLE",
+    isDefault: true,
+    connectedMemberships: Array.from({ length: 6 }, function (_, i) {
+        var alphabet = ['A', 'B', 'C', 'D', 'E', 'F'];
+        var cardImage = [
+            'https://cdn.dev.publishingkit.net/7f3f7a31-023b-4852-9a11-cbac31d25d93',
+            'https://cdn.dev.publishingkit.net/c8973261-6c2a-4833-9b9f-20ee355647e4',
+            'https://cdn.dev.publishingkit.net/8e585c93-9591-4300-ad93-d002560cbeae',
+            'https://cdn.dev.publishingkit.net/4aaa2811-b3ff-435c-b50a-9486376ab230',
+            'https://cdn.dev.publishingkit.net/5111c33c-07ba-4b91-8eb6-9975f4cd906a',
+            'https://cdn.dev.publishingkit.net/16ac0a8a-acb1-465b-960c-6be66f2a04e8.jpg'
+        ];
+        var getOverlayType = function () {
+            if (i % 3 === 1)
+                return 'SOLID';
+            if (i % 3 === 2)
+                return 'GRADIENT';
+            return 'NONE';
+        };
+        var getDesignSchema = function () {
+            if (i % 3 === 1)
+                return 'B';
+            if (i % 3 === 2)
+                return 'C';
+            return 'A';
+        };
+        return {
+            id: i + 1,
+            order: i,
+            mdid: "CONNECTED_MEMBERSHIPS_" + alphabet[i] + "_MD_ID",
+            mid: "CONNECTED_MEMBERSHIPS_" + alphabet[i] + "_M_ID",
+            membership: {
+                id: i + 1,
+                type: 'GENERAL',
+                mid: "MEMBERSHIP_" + alphabet[i] + "_MID",
+                title: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
+                insertedAt: '2023-01-06T09:05:45',
+                updatedAt: '2023-01-06T09:05:45',
+                membershipCardTemplate: {
+                    backgroundImageSrc: cardImage[i],
+                    logoImageSrc: 'https://publ-upload-local.s3.ap-northeast-2.amazonaws.com/e11d1a92-a1c0-4faa-b341-13a32f21828d_image',
+                    overlayType: getOverlayType(),
+                    overlayColorPrimary: '#FFC0CB',
+                    overlayColorSecondary: '#313131',
+                    designSchema: getDesignSchema()
+                },
+                membershipBenefitInfo: {
+                    benefitAlpha: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
+                    benefitBravo: 'Lorem ipsum dolor sit amet. Et magnam molestiae.',
+                    benefitCharlie: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
+                    benefitDelta: 'Lorem ipsum dolor sit amet. Et magnam molestiae.',
+                    benefitEcho: 'Lorem ipsum dolor sit amet. Et magnam molestiae.'
+                },
+                totalSubscriptionProducts: 3
+            },
+            connectedSubscriptionProducts: Array.from({ length: 5 }, function (_, i) {
+                return {
+                    id: i + 1,
+                    order: i,
+                    connectedMembershipId: i + 1,
+                    subscriptionProductId: i + 1,
+                    subscriptionProduct: {
+                        id: i + 1,
+                        type: 'COUPON_ONCE_FINITE',
+                        title: '청춘이 황금시대를 우리의 같은 무엇을',
+                        alias: "CONNECTED_SUBSCRIPTION_PRODUCTS_" + alphabet[i] + "_ALIAS",
+                        expiryPeriodInDays: 7,
+                        isDeactivated: i % 2 === 0,
+                        fee: 5000,
+                        insertedAt: '2023-01-06T09:05:45',
+                        updatedAt: '2023-01-06T09:05:45'
+                    }
+                };
+            })
+        };
+    })
+};
 exports.samplePage = [
     exports.samplePageIntroSection,
     exports.samplePageContentsCarouselSection,
@@ -1000,5 +1207,6 @@ exports.samplePage = [
     exports.samplePageContentsSection,
     exports.samplePageInfoBoxSection,
     exports.samplePageIntroSection3,
-    exports.samplePageFooterSection
+    exports.samplePageFooterSection,
+    exports.samplePageMembershipSection
 ];

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

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import type DynamicLayout from './DynamicLayout';
+import type { IProgrammedSectionPreviewData } from './types';
+export declare const SampleSectionsMock: React.ComponentProps<typeof DynamicLayout>['sections'];
+export declare const MembershipSectionsMock: React.ComponentProps<typeof DynamicLayout>['sections'];
+export declare const MembershipPreviewDataMock: IProgrammedSectionPreviewData;