{"version":3,"file":"static/chunks/797-5667847eaaeef4a3.js","mappings":"AAGA","sources":["webpack://_N_E/./src/components/Brand/BrandProvider.tsx","webpack://_N_E/./src/components/SEO.tsx","webpack://_N_E/./src/hooks/useDialog.ts","webpack://_N_E/./src/lib/web-ui/useDeviceType.tsx","webpack://_N_E/./src/components/Brand/BrandLNBMobile.tsx","webpack://_N_E/./src/components/Brand/BrandLNBPc.tsx","webpack://_N_E/./src/components/Brand/ContentsSection.tsx","webpack://_N_E/./src/components/Brand/CountLink.tsx","webpack://_N_E/./src/components/Brand/ShareButton.tsx","webpack://_N_E/./src/components/Brand/SubscribeCancel.tsx","webpack://_N_E/./src/components/Brand/SubscribeButton.tsx","webpack://_N_E/./src/components/Brand/AuthorProfile.tsx","webpack://_N_E/./src/components/Brand/BrandBanner.tsx","webpack://_N_E/./src/components/Brand/ProfileSection.tsx","webpack://_N_E/./src/modules/lab/components/BrandLayout.tsx","webpack://_N_E/<anon>"],"sourcesContent":["import { jsx as _jsx } from \"react/jsx-runtime\";\nimport { createContext, useContext, useState } from \"react\";\nimport { createStore, useStore } from \"zustand\";\nconst BrandContext = /*#__PURE__*/ createContext(null);\nexport const BrandProvider = (param)=>{\n    let { children , initialValues  } = param;\n    const [store] = useState(()=>createStore((set)=>({\n                brand: initialValues,\n                updateBrand: (brand)=>set({\n                        brand\n                    })\n            })));\n    return /*#__PURE__*/ _jsx(BrandContext.Provider, {\n        value: store,\n        children: children\n    });\n};\nexport const useBrandStore = (selector)=>{\n    const store = useContext(BrandContext);\n    if (!store) {\n        throw new Error(\"Missing BrandProvider\");\n    }\n    return useStore(store, selector);\n};\n","import { jsx as _jsx } from \"react/jsx-runtime\";\nimport _ from \"lodash\";\nimport { NextSeo } from \"next-seo\";\nconst SEO = (props)=>{\n    const openGraph = _.pickBy({\n        url: props.ogUrl,\n        title: props.ogTitle,\n        description: props.ogDescription,\n        images: _.identity(props.ogImage) ? [\n            {\n                url: props.ogImage\n            }\n        ] : undefined\n    }, _.identity);\n    const transformedProps = _.pickBy({\n        title: props.title,\n        description: props.description,\n        additionalMetaTags: _.identity(props.keywords) ? [\n            {\n                name: \"keywords\",\n                content: props.keywords\n            }\n        ] : undefined,\n        openGraph: _.isEmpty(openGraph) ? undefined : openGraph\n    }, _.identity);\n    return /*#__PURE__*/ _jsx(NextSeo, {\n        ...transformedProps\n    });\n};\nexport default SEO;\n","import { useCallback, useEffect, useState } from \"react\";\nconst useDialog = (defaultValues)=>{\n    const [isOpen, setIsOpen] = useState(false);\n    const DEFAULT_DIALOG_PROPS = {\n        onClose: ()=>setIsOpen(false),\n        open: isOpen\n    };\n    const [dialogProps, setDialogProps] = useState({\n        ...DEFAULT_DIALOG_PROPS,\n        ...defaultValues\n    });\n    useEffect(()=>{\n        setDialogProps((prev)=>({\n                ...prev,\n                open: isOpen\n            }));\n    }, [\n        isOpen\n    ]);\n    const close = ()=>{\n        setIsOpen(false);\n    };\n    const onOk = async ()=>{\n        try {\n            var _dialogProps_onOk;\n            await ((_dialogProps_onOk = dialogProps.onOk) === null || _dialogProps_onOk === void 0 ? void 0 : _dialogProps_onOk.call(dialogProps));\n        } catch (error) {\n            ;\n        } finally{\n            close();\n        }\n    };\n    const onCancel = async ()=>{\n        try {\n            var _dialogProps_onCancel;\n            await ((_dialogProps_onCancel = dialogProps.onCancel) === null || _dialogProps_onCancel === void 0 ? void 0 : _dialogProps_onCancel.call(dialogProps));\n        } catch (error) {\n            ;\n        } finally{\n            close();\n        }\n    };\n    const modifyDialog = useCallback((modifyProps)=>{\n        setDialogProps({\n            ...DEFAULT_DIALOG_PROPS,\n            ...modifyProps\n        });\n    }, []);\n    const open = useCallback((updateData)=>{\n        updateData && modifyDialog(updateData);\n        setIsOpen(true);\n    }, [\n        modifyDialog\n    ]);\n    return {\n        open,\n        close,\n        modifyDialog,\n        isOpen,\n        dialogProps: {\n            ...dialogProps,\n            onOk,\n            onCancel\n        }\n    };\n};\nexport default useDialog;\n","import { useEffect, useState } from \"react\";\nconst useDeviceType = ()=>{\n    const [deviceType, setDeviceType] = useState(\"desktop\");\n    const isIOS = ()=>{\n        if (/iPad|iPhone|iPod/.test(navigator.platform)) {\n            return true;\n        } else {\n            return !!(navigator.maxTouchPoints && navigator.maxTouchPoints > 2 && /MacIntel/.test(navigator.platform));\n        }\n    };\n    const isIpadOS = ()=>{\n        return !!(navigator.maxTouchPoints && navigator.maxTouchPoints > 2 && /MacIntel/.test(navigator.platform));\n    };\n    useEffect(()=>{\n        const userAgent = typeof window.navigator === \"undefined\" ? \"\" : navigator.userAgent;\n        const isMobile = /Android|webOS|BlackBerry|IEMobile|Opera Mini/i.test(userAgent) || isIOS() && !isIpadOS();\n        const isTablet = /Tablet|PlayBook/i.test(userAgent) || /Macintosh/i.test(userAgent) && \"ontouchend\" in document || isIpadOS();\n        if (isTablet) {\n            setDeviceType(\"tablet\");\n        } else if (isMobile) {\n            setDeviceType(\"mobile\");\n        } else {\n            setDeviceType(\"desktop\");\n        }\n    }, []);\n    return deviceType;\n};\nexport default useDeviceType;\n","import { jsx as _jsx } from \"react/jsx-runtime\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport { BRAND_PRODUCTS_PAGE } from \"@/settings/constant\";\nimport { Tabs } from \"@bookips/solvook-ui-library\";\nimport { styled } from \"@mui/material\";\nimport { useRouter } from \"next/router\";\nimport React, { useCallback, useEffect, useMemo } from \"react\";\nimport { useBrandStore } from \"./BrandProvider\";\nconst REFERRAL = \"referral\";\nexport const BrandLNBMobile = (param)=>{\n    let { links  } = param;\n    const { push , asPath  } = useRouter();\n    const name = useBrandStore((state)=>state.brand.name);\n    const checkPath = useCallback(()=>{\n        var _links_find, _links_find1, _links_find2;\n        const splitPath = (path)=>{\n            return decodeURIComponent(path.split(\"?\")[0].toLocaleLowerCase());\n        };\n        const currentPath = splitPath(asPath);\n        const productPath = BRAND_PRODUCTS_PAGE(name).toLocaleLowerCase();\n        const subUrlMatching = (_links_find = links.find((link)=>{\n            return currentPath.startsWith(productPath) && splitPath(link.path(name)) === productPath;\n        })) === null || _links_find === void 0 ? void 0 : _links_find.path(name);\n        const referralMatching = (_links_find1 = links.find((link)=>splitPath(link.path(name)) === currentPath && asPath.includes(REFERRAL))) === null || _links_find1 === void 0 ? void 0 : _links_find1.path(name);\n        if (subUrlMatching) return subUrlMatching;\n        if (referralMatching) return referralMatching;\n        return (_links_find2 = links.find((link)=>link.path(name) === asPath)) === null || _links_find2 === void 0 ? void 0 : _links_find2.path(name);\n    }, [\n        asPath,\n        links,\n        name\n    ]);\n    const initialPath = useMemo(()=>{\n        return checkPath();\n    }, [\n        checkPath\n    ]);\n    const { tabsProps  } = Tabs.useTabs(initialPath) //url 필요한\n    ;\n    const handleChange = useCallback((e, newValue)=>{\n        const path = checkPath();\n        tabsProps.onChange(e, newValue);\n        if (newValue === path && path !== asPath) {\n            return push(asPath, undefined, {\n                shallow: true\n            });\n        }\n        //mx-188 브랜드홈 메뉴 클릭시\n        mixpanelEvent(\"Brand Menu Clicked\", {\n            \"Brand Name\": name,\n            \"Menu Name\": newValue\n        });\n        push(newValue, undefined, {\n            shallow: true\n        });\n    }, [\n        push,\n        tabsProps,\n        asPath,\n        checkPath,\n        initialPath\n    ]);\n    useEffect(()=>{\n        const path = checkPath();\n        if (path !== tabsProps.value) {\n            handleChange(undefined, path);\n        }\n    }, [\n        checkPath,\n        handleChange,\n        initialPath\n    ]);\n    return /*#__PURE__*/ _jsx(MobileLNBContainer, {\n        children: /*#__PURE__*/ _jsx(Tabs, {\n            ...tabsProps,\n            onChange: handleChange,\n            size: \"sm\",\n            children: links.map((link)=>/*#__PURE__*/ _jsx(Tabs.Tab, {\n                    label: link.name,\n                    value: link.path(name),\n                    sx: {\n                        minWidth: \"28px\"\n                    }\n                }, link.index))\n        })\n    });\n};\nconst MobileLNBContainer = styled(\"div\")((param)=>{\n    let { theme  } = param;\n    return {\n        display: \"none\",\n        backgroundColor: theme.palette.background.paper,\n        borderBottom: \"1px solid \".concat(theme.palette.divider),\n        [theme.breakpoints.down(\"lg\")]: {\n            display: \"block\",\n            position: \"sticky\",\n            top: 0,\n            zIndex: 2,\n            padding: \"0 32px\"\n        },\n        [theme.breakpoints.down(\"sm\")]: {\n            padding: \"0 20px\"\n        }\n    };\n});\n","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport { BRAND_PRODUCTS_PAGE } from \"@/settings/constant\";\nimport { styled } from \"@mui/material\";\nimport Link from \"next/link\";\nimport { useRouter } from \"next/router\";\nimport { useMemo } from \"react\";\nimport Icon from \"../icon/Icon\";\nimport { Sizes, Triangle } from \"../icon/IconList\";\nimport { useBrandStore } from \"./BrandProvider\";\nexport const BrandLNBPc = (param)=>{\n    let { links  } = param;\n    const name = useBrandStore((state)=>state.brand.name);\n    return /*#__PURE__*/ _jsx(StyledNav, {\n        children: /*#__PURE__*/ _jsx(\"ul\", {\n            children: links.map((link)=>/*#__PURE__*/ _jsx(\"li\", {\n                    children: /*#__PURE__*/ _jsx(NavigationLink, {\n                        href: link.path(name),\n                        name: link.name,\n                        brandName: name\n                    })\n                }, link.index))\n        })\n    });\n};\nconst NavigationLink = (param)=>{\n    let { href , name , brandName  } = param;\n    const { asPath  } = useRouter();\n    const isActive = useMemo(()=>{\n        const splitPath = (path)=>{\n            return decodeURIComponent(path.split(\"?\")[0].toLocaleLowerCase());\n        };\n        const currentPath = splitPath(asPath);\n        const linkPath = splitPath(href);\n        const productPath = BRAND_PRODUCTS_PAGE(brandName).toLocaleLowerCase();\n        if (currentPath.startsWith(productPath) && linkPath === productPath) return true;\n        else return currentPath === href;\n    }, [\n        asPath,\n        href\n    ]);\n    return /*#__PURE__*/ _jsxs(StyledLink, {\n        href: href,\n        onClick: ()=>{\n            //mx-188 브랜드홈 메뉴 클릭시\n            mixpanelEvent(\"Brand Menu Clicked\", {\n                \"Brand Name\": brandName,\n                \"Menu Name\": name\n            });\n        },\n        className: isActive ? \"active\" : \"\",\n        children: [\n            isActive && /*#__PURE__*/ _jsx(Icon, {\n                icon: Triangle,\n                size: Sizes.small\n            }),\n            \" \",\n            name\n        ]\n    });\n};\nconst StyledNav = styled(\"nav\")((param)=>{\n    let { theme  } = param;\n    return {\n        width: \"320px\",\n        padding: \"20px\",\n        backgroundColor: theme.palette.grey[0],\n        height: \"fit-content\",\n        borderRadius: \"12px\",\n        flexShrink: 0,\n        ul: {\n            display: \"flex\",\n            flexDirection: \"column\",\n            gap: \"4px\"\n        },\n        [theme.breakpoints.down(\"lg\")]: {\n            display: \"none\"\n        }\n    };\n});\nconst StyledLink = styled(Link)((param)=>{\n    let { theme  } = param;\n    return {\n        padding: \"12px 20px\",\n        display: \"block\",\n        color: theme.palette.text.secondary,\n        borderRadius: \"6px\",\n        ...theme.typography.h6,\n        [\":hover\"]: {\n            backgroundColor: \"rgba(169, 175, 199, 0.20)\",\n            transition: \"background-color 0.3s\"\n        },\n        \"&.active\": {\n            color: theme.palette.text.title,\n            backgroundColor: \"rgba(169, 175, 199, 0.20)\",\n            padding: \"12px 14px\"\n        }\n    };\n});\n","import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport { BRAND_ABOUT_PAGE, BRAND_HOME_PAGE, BRAND_PRODUCTS_PAGE } from \"@/settings/constant\";\nimport { Stack, styled } from \"@mui/material\";\nimport React from \"react\";\nimport { BrandLNBMobile } from \"./BrandLNBMobile\";\nimport { BrandLNBPc } from \"./BrandLNBPc\";\nconst LINKS = [\n    {\n        name: \"홈\",\n        path: BRAND_HOME_PAGE,\n        index: 0\n    },\n    {\n        name: \"상품\",\n        path: BRAND_PRODUCTS_PAGE,\n        index: 1\n    },\n    {\n        name: \"소개\",\n        path: BRAND_ABOUT_PAGE,\n        index: 2\n    }\n];\nexport const ContentsSection = (param)=>{\n    let { children  } = param;\n    return /*#__PURE__*/ _jsxs(_Fragment, {\n        children: [\n            /*#__PURE__*/ _jsx(BrandLNBMobile, {\n                links: LINKS\n            }),\n            /*#__PURE__*/ _jsx(ContentsSectionContainer, {\n                children: /*#__PURE__*/ _jsxs(StyledStack, {\n                    children: [\n                        /*#__PURE__*/ _jsx(BrandLNBPc, {\n                            links: LINKS\n                        }),\n                        /*#__PURE__*/ _jsx(ChildrenContainer, {\n                            children: children\n                        })\n                    ]\n                })\n            })\n        ]\n    });\n};\nconst ContentsSectionContainer = styled(\"section\")((param)=>{\n    let { theme  } = param;\n    return {\n        borderTop: \"1px solid \".concat(theme.palette.divider),\n        [theme.breakpoints.down(\"lg\")]: {\n            borderTop: \"none\"\n        }\n    };\n});\nconst StyledStack = styled(Stack)((param)=>{\n    let { theme  } = param;\n    return {\n        maxWidth: \"1200px\",\n        margin: \"0 auto\",\n        gap: \"56px\",\n        padding: \"40px 0\",\n        display: \"flex\",\n        flexDirection: \"row\",\n        [theme.breakpoints.down(\"lg\")]: {\n            padding: \"32px 0\"\n        },\n        [theme.breakpoints.down(\"sm\")]: {\n            padding: \"28px 0\"\n        }\n    };\n});\nconst ChildrenContainer = styled(\"section\")((param)=>{\n    let { theme  } = param;\n    return {\n        width: \"100%\",\n        [theme.breakpoints.down(\"lg\")]: {}\n    };\n});\n","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { BRAND_PRODUCTS_PAGE } from \"@/settings/constant\";\nimport { styled, Typography } from \"@mui/material\";\nimport Link from \"next/link\";\nimport { useBrandStore } from \"./BrandProvider\";\nexport const CountLink = (param)=>{\n    let { count =0  } = param;\n    const name = useBrandStore((state)=>state.brand.name);\n    return /*#__PURE__*/ _jsxs(Link, {\n        href: BRAND_PRODUCTS_PAGE(name),\n        style: {\n            display: \"flex\",\n            gap: \"4px\"\n        },\n        children: [\n            /*#__PURE__*/ _jsx(Text, {\n                children: \"상품 수\"\n            }),\n            /*#__PURE__*/ _jsx(Count, {\n                children: count\n            })\n        ]\n    });\n};\nconst Text = styled(Typography)((param)=>{\n    let { theme  } = param;\n    return {\n        color: theme.palette.text.secondary,\n        ...theme.typography.body1,\n        [theme.breakpoints.down(\"sm\")]: {\n            ...theme.typography.body2\n        },\n        \":hover\": {\n            textDecoration: \"underline\",\n            cursor: \"pointer\",\n            b: {\n                textDecoration: \"none\"\n            }\n        }\n    };\n});\nconst Count = styled(Typography)((param)=>{\n    let { theme  } = param;\n    return {\n        color: theme.palette.text.primary,\n        ...theme.typography.subtitle1,\n        [theme.breakpoints.down(\"sm\")]: {\n            ...theme.typography.subtitle2\n        }\n    };\n});\n","import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport { useAuthStore } from \"@/lib/auth/AuthStore\";\nimport useDeviceType from \"@/lib/web-ui/useDeviceType\";\nimport { BRAND_HOME_PAGE } from \"@/settings/constant\";\nimport { Button } from \"@bookips/solvook-ui-library\";\nimport { Typography } from \"@mui/material\";\nimport { useRouter } from \"next/router\";\nimport { useCallback, useMemo, useState } from \"react\";\nimport useSnackbar, { IconWithSnackbarMessage, Snackbar, defaultSnackbarProps } from \"../common/Snackbar\";\nimport Icon from \"../icon/Icon\";\nimport { Copy_2px, Share, Sizes, Warning24FillRed } from \"../icon/IconList\";\nimport { useBrandStore } from \"./BrandProvider\";\nconst snackbarMessages = {\n    success: /*#__PURE__*/ _jsxs(Typography, {\n        variant: \"subtitle1\",\n        sx: {\n            display: \"flex\",\n            alignItems: \"center\",\n            gap: \"8px\",\n            color: \"#FFF\"\n        },\n        children: [\n            /*#__PURE__*/ _jsx(Icon, {\n                icon: Copy_2px,\n                size: Sizes.medium\n            }),\n            \"URL이 복사됐어요.\"\n        ]\n    }),\n    warning: /*#__PURE__*/ _jsx(_Fragment, {\n        children: /*#__PURE__*/ _jsxs(Typography, {\n            variant: \"subtitle1\",\n            sx: {\n                display: \"flex\",\n                alignItems: \"center\",\n                gap: \"8px\",\n                color: \"#FFF\"\n            },\n            children: [\n                /*#__PURE__*/ _jsx(Icon, {\n                    icon: Warning24FillRed,\n                    size: Sizes.medium\n                }),\n                \"URL 복사에 실패했어요. 다시 시도해주세요.\"\n            ]\n        })\n    })\n};\nexport const ShareButton = ()=>{\n    const { asPath , pathname  } = useRouter();\n    const { user  } = useAuthStore();\n    const name = useBrandStore((state)=>state.brand.name);\n    const nickname = useBrandStore((state)=>state.brand.nickname);\n    const keyword = useBrandStore((state)=>state.brand.keyword);\n    const { isShowSnackbar , showSnackbar , hideSnackbar  } = useSnackbar();\n    const [messageType, setMessageType] = useState(\"success\");\n    const deviceType = useDeviceType();\n    const referralCode = useMemo(()=>{\n        if (\"object\" === \"undefined\") return;\n        return user.id ? \"\".concat(window.location.origin).concat(BRAND_HOME_PAGE(name), \"?referral=\").concat(user.id) : \"\".concat(window.location.origin).concat(BRAND_HOME_PAGE(name), \"?referral=\");\n    }, [\n        user.id\n    ]);\n    const copyLink = useCallback(async (data)=>{\n        await window.navigator.clipboard.writeText(data.url).then((res)=>{\n            showSnackbar();\n        });\n    }, [\n        showSnackbar\n    ]);\n    const onClickShare = useCallback(async ()=>{\n        const data = {\n            // title: nickname,\n            // text: keyword,\n            url: referralCode !== null && referralCode !== void 0 ? referralCode : \"\"\n        };\n        if (deviceType !== \"desktop\" && window.navigator.share) {\n            try {\n                await window.navigator.share(data);\n            } catch (error) {\n                ;\n                setMessageType(\"warning\");\n                showSnackbar();\n            }\n        } else {\n            setMessageType(\"success\");\n            copyLink(data);\n        }\n    }, [\n        deviceType,\n        referralCode,\n        nickname,\n        keyword,\n        showSnackbar,\n        copyLink\n    ]);\n    return /*#__PURE__*/ _jsxs(Button, {\n        onClick: onClickShare,\n        variant: \"strokeSecondary\",\n        style: {\n            minWidth: \"unset\",\n            width: \"48px\",\n            height: \"48px\"\n        },\n        children: [\n            /*#__PURE__*/ _jsx(Icon, {\n                icon: Share,\n                color: \"#6A708A\",\n                size: Sizes.xmedium\n            }),\n            /*#__PURE__*/ _jsx(Snackbar, {\n                ...defaultSnackbarProps,\n                open: isShowSnackbar,\n                onClose: hideSnackbar,\n                message: /*#__PURE__*/ _jsx(IconWithSnackbarMessage, {\n                    text: snackbarMessages[messageType]\n                })\n            })\n        ]\n    });\n};\n","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport useWindowDimensions from \"@/lib/web-ui/useWindowDimensions\";\nimport { Button, ConfirmDialog, TextField } from \"@bookips/solvook-ui-library\";\nimport { Box, FormControl, FormControlLabel, Radio, RadioGroup, Stack, styled, Typography } from \"@mui/material\";\nimport { useMemo, useState } from \"react\";\nimport Icon from \"../icon/Icon\";\nimport { Close, Sizes } from \"../icon/IconList\";\nimport AnchorDrawer from \"../modal/AnchorDrawer\";\nimport { CancelReasonValue } from \"./SubscribeButton\";\nexport const SubscribeCancelDialog = (param)=>{\n    let { open , close , value , setValue , handleSubmit  } = param;\n    const { isMobile  } = useWindowDimensions();\n    const isEtc = useMemo(()=>value === CancelReasonValue[5], [\n        value\n    ]);\n    const [etcReason, setEtcReason] = useState(\"\");\n    const [isError, setIsError] = useState(false);\n    const submit = ()=>{\n        if (isEtc && !etcReason) {\n            //TODO 기타를 입력하지 않았을때.\n            setIsError(true);\n            return;\n        }\n        handleSubmit(etcReason);\n        //mx-9 소식 받기 해지 dialog 내 버튼 클릭 시\n        mixpanelEvent(\"Popup Button Clicked\", {\n            \"Popup Type\": \"Brand Unsubscription\",\n            \"Popup Title\": \"소식 받기를 해지하시겠어요?\",\n            \"Button Name\": \"소식 받지 않기\",\n            Reason: etcReason\n        });\n    };\n    const content = {\n        open: open,\n        close: close,\n        title: /*#__PURE__*/ _jsx(Typography, {\n            variant: \"h6\",\n            children: \"소식 받기를 해지하시겠어요? \"\n        }),\n        content: /*#__PURE__*/ _jsx(Typography, {\n            color: \"text.primary\",\n            variant: \"body1\",\n            children: \"더 이상 브랜드의 신규 상품 업로드나 할인 소식을 받아볼 수 없어요.\"\n        }),\n        subContent: /*#__PURE__*/ _jsx(RadioBox, {\n            children: /*#__PURE__*/ _jsx(CustomizedRadios, {\n                value: value,\n                setValue: setValue,\n                isError: isError,\n                setIsError: setIsError,\n                isEtc: isEtc,\n                etcReason: etcReason,\n                setEtcReason: setEtcReason\n            })\n        }),\n        footer: /*#__PURE__*/ _jsxs(Stack, {\n            display: \"flex\",\n            flexDirection: \"row\",\n            justifyContent: \"flex-end\",\n            gap: \"8px\",\n            children: [\n                /*#__PURE__*/ _jsx(Button, {\n                    variant: \"filledSecondary\",\n                    sx: {\n                        padding: \"12px 20px\"\n                    },\n                    onClick: ()=>{\n                        close();\n                        //mx-9\n                        mixpanelEvent(\"Popup Button Clicked\", {\n                            \"Popup Type\": \"Brand Unsubscription\",\n                            \"Popup Title\": \"소식 받기를 해지하시겠어요?\",\n                            \"Button Name\": \"닫기\"\n                        });\n                    },\n                    children: \"닫기\"\n                }),\n                /*#__PURE__*/ _jsx(Button, {\n                    variant: \"filledPrimary\",\n                    disabled: value === null,\n                    onClick: submit,\n                    sx: {\n                        padding: \"12px 20px\"\n                    },\n                    children: \"소식 받지 않기\"\n                })\n            ]\n        })\n    };\n    if (isMobile) return /*#__PURE__*/ _jsx(AnchorDrawer, {\n        open: content.open,\n        anchor: \"right\",\n        onClose: close,\n        children: /*#__PURE__*/ _jsxs(\"div\", {\n            children: [\n                /*#__PURE__*/ _jsxs(Typography, {\n                    variant: \"subtitle1\",\n                    sx: {\n                        padding: \"16px 20px\",\n                        display: \"flex\",\n                        justifyContent: \"space-between\",\n                        borderBottom: \"1px solid #F0F1F5\",\n                        alignItems: \"center\"\n                    },\n                    children: [\n                        \"소식 받기 해지\",\n                        /*#__PURE__*/ _jsx(Icon, {\n                            icon: Close,\n                            size: Sizes.small,\n                            onClick: close\n                        })\n                    ]\n                }),\n                /*#__PURE__*/ _jsxs(Stack, {\n                    sx: {\n                        padding: \"20px\",\n                        gap: \"28px\"\n                    },\n                    children: [\n                        content.title,\n                        content.content,\n                        content.subContent,\n                        content.footer\n                    ]\n                })\n            ]\n        })\n    });\n    return /*#__PURE__*/ _jsx(ConfirmDialog, {\n        open: content.open,\n        title: content.title,\n        content: content.content,\n        subContent: content.subContent,\n        footer: content.footer,\n        onClose: close\n    });\n};\nconst RadioBox = styled(\"div\")((param)=>{\n    let { theme  } = param;\n    return {\n        display: \"flex\",\n        padding: \"12px 20px 12px 8px\",\n        flexDirection: \"column\",\n        alignItems: \"flex-start\",\n        backgroundColor: theme.palette.grey[0],\n        borderRadius: \"4px\"\n    };\n});\nconst BpIcon = styled(\"span\")((param)=>{\n    let { theme  } = param;\n    return {\n        borderRadius: \"50%\",\n        width: 16,\n        height: 16,\n        boxShadow: \"inset 0 0 0 2px rgba(16,22,26,.2), inset 0 -1px 0 rgba(16,22,26,.1)\",\n        backgroundColor: \"#f5f8fa\",\n        backgroundImage: \"linear-gradient(180deg,hsla(0,0%,100%,.8),hsla(0,0%,100%,0))\",\n        \".Mui-focusVisible &\": {\n            outline: \"2px auto rgba(19,124,189,.6)\",\n            outlineOffset: 2\n        },\n        \"input:hover ~ &\": {\n            backgroundColor: \"#ebf1f5\",\n            ...theme.applyStyles(\"dark\", {\n                backgroundColor: \"#30404d\"\n            })\n        },\n        \"input:disabled ~ &\": {\n            boxShadow: \"none\",\n            background: \"rgba(206,217,224,.5)\",\n            ...theme.applyStyles(\"dark\", {\n                background: \"rgba(57,75,89,.5)\"\n            })\n        },\n        ...theme.applyStyles(\"dark\", {\n            boxShadow: \"0 0 0 1px rgb(16 22 26 / 40%)\",\n            backgroundColor: \"#394b59\",\n            backgroundImage: \"linear-gradient(180deg,hsla(0,0%,100%,.05),hsla(0,0%,100%,0))\"\n        })\n    };\n});\nconst BpCheckedIcon = styled(BpIcon)({\n    backgroundColor: \"#6950E5\",\n    boxShadow: \"inset 0 0 0 2px #6950E5, inset 0 -1px 0 #6950E5\",\n    backgroundImage: \"linear-gradient(180deg,hsla(0,0%,100%,.1),hsla(0,0%,100%,0))\",\n    \"&::before\": {\n        display: \"block\",\n        width: 16,\n        height: 16,\n        backgroundImage: \"radial-gradient(#fff,#fff 28%,transparent 32%)\",\n        content: '\"\"'\n    },\n    \"input:hover ~ &\": {\n        backgroundColor: \"#6950E5\"\n    }\n});\n// Inspired by blueprintjs\nfunction BpRadio(props) {\n    return /*#__PURE__*/ _jsx(Radio, {\n        disableRipple: true,\n        color: \"default\",\n        checkedIcon: /*#__PURE__*/ _jsx(BpCheckedIcon, {}),\n        icon: /*#__PURE__*/ _jsx(BpIcon, {}),\n        ...props\n    });\n}\nexport default function CustomizedRadios(param) {\n    let { value , setValue , isError , setIsError , etcReason , setEtcReason , isEtc  } = param;\n    return /*#__PURE__*/ _jsx(FormControl, {\n        sx: {\n            width: \"100%\"\n        },\n        children: /*#__PURE__*/ _jsxs(RadioGroup, {\n            value: value,\n            onChange: (event)=>setValue(event.target.value),\n            \"aria-labelledby\": \"demo-customized-radios\",\n            name: \"customized-radios\",\n            children: [\n                Object.values(CancelReasonValue).map((item)=>/*#__PURE__*/ _jsx(FormControlLabel, {\n                        sx: (theme)=>({\n                                \"& .MuiFormControlLabel-label\": {\n                                    padding: \"8px 0\",\n                                    color: theme.palette.text.primary,\n                                    ...theme.typography.body1\n                                },\n                                \"& .MuiRadio-root\": {\n                                    padding: \"12px\"\n                                }\n                            }),\n                        value: item,\n                        control: /*#__PURE__*/ _jsx(BpRadio, {}),\n                        label: item\n                    })),\n                isEtc && /*#__PURE__*/ _jsx(Box, {\n                    sx: {\n                        padding: \"0px 0px 8px 40px\"\n                    },\n                    children: /*#__PURE__*/ _jsx(TextField, {\n                        sx: {\n                            width: \"100%\"\n                        },\n                        error: isError,\n                        helperText: isError && \"반드시 작성이 필요해요.\",\n                        placeholder: \"해지 이유를 작성해 주세요.\",\n                        value: etcReason,\n                        onChange: (e)=>{\n                            setEtcReason(e.target.value);\n                            setIsError(false);\n                        }\n                    })\n                })\n            ]\n        })\n    });\n}\n","import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport useDialog from \"@/hooks/useDialog\";\nimport { useAuthStore } from \"@/lib/auth/AuthStore\";\nimport { mixpanelEvent } from \"@/lib/mixpanels/mixpanel\";\nimport { Button } from \"@bookips/solvook-ui-library\";\nimport { Snackbar, Typography } from \"@mui/material\";\nimport { useMutation } from \"@tanstack/react-query\";\nimport { useState } from \"react\";\nimport { postSubscribeBrand } from \"../../api/brand\";\nimport useSnackbar, { IconWithSnackbarMessage, defaultSnackbarProps } from \"../common/Snackbar\";\nimport Icon from \"../icon/Icon\";\nimport { Bell, Check_Thin, Sizes } from \"../icon/IconList\";\nimport CheckLoginDialog from \"../modal/CheckLoginDialog\";\nimport { useBrandStore } from \"./BrandProvider\";\nimport { SubscribeCancelDialog } from \"./SubscribeCancel\";\nexport const CancelReasonValue = {\n    0: \"더 이상 이 브랜드의 자료가 필요하지 않아요.\",\n    1: \"브랜드 상품에 불만족했어요.\",\n    2: \"브랜드 알림이 너무 자주 와요.\",\n    3: \"브랜드 업데이트 빈도가 너무 낮아요.\",\n    4: \"브랜드 소통이 만족스럽지 않아요.\",\n    5: \"기타\"\n};\nexport const SubscribeButton = ()=>{\n    //TODO 낙관적 업데이트를 위한 상태관리\n    const name = useBrandStore((state)=>state.brand.name);\n    const isSubscribed = useBrandStore((state)=>state.brand.isSubscribed);\n    const [subscribeStatus, setSubscribeStatus] = useState(isSubscribed);\n    const [loginDialogOpen, setLoginDialogOpen] = useState(false);\n    const [cancelRadioValue, setCancelRadioValue] = useState(null);\n    const { isShowSnackbar , showSnackbar , hideSnackbar  } = useSnackbar();\n    const { open , close , isOpen  } = useDialog();\n    const { isLoggedIn  } = useAuthStore();\n    const postSubscribeBrandMutation = useMutation(postSubscribeBrand);\n    //소식받기 기능\n    const onClickSubscribe = ()=>{\n        if (!isLoggedIn) {\n            setLoginDialogOpen(true);\n            return;\n        }\n        if (subscribeStatus) {\n            //@TODO 소식받기 취소\n            open();\n            return;\n        }\n        //@TODO 소식받기\n        handleSubmit();\n        //mx-187 소식받기 버튼 클릭시\n        mixpanelEvent(\"Subscribe Button Clicked\", {\n            Position: \"Brand Home\",\n            \"Button Name\": subscribeStatus ? \"소식 받는 중\" : \"소식 받기\",\n            \"Brand Name\": name\n        });\n    };\n    const handleSubmit = async (etcReason)=>{\n        try {\n            const response = await postSubscribeBrandMutation.mutateAsync({\n                name,\n                isSubscribed: !subscribeStatus,\n                ...subscribeStatus && cancelRadioValue ? {\n                    cancelReason: etcReason || cancelRadioValue\n                } : {}\n            });\n            if (response) {\n                setSubscribeStatus(!subscribeStatus);\n            }\n            // 소식받기 취소 성공시\n            if (response && subscribeStatus) {\n                showSnackbar();\n            }\n        } catch (e) {\n            window.alert(e.message);\n        }\n        close();\n    };\n    return /*#__PURE__*/ _jsxs(_Fragment, {\n        children: [\n            /*#__PURE__*/ _jsx(Button, {\n                variant: subscribeStatus ? \"strokeSecondary\" : \"filledPrimary\",\n                onClick: onClickSubscribe,\n                style: {\n                    gap: \"8px\",\n                    padding: \"12px 20px\"\n                },\n                children: subscribeStatus ? /*#__PURE__*/ _jsxs(_Fragment, {\n                    children: [\n                        /*#__PURE__*/ _jsx(Icon, {\n                            icon: Check_Thin,\n                            size: Sizes.small,\n                            color: \"#6A708A\"\n                        }),\n                        /*#__PURE__*/ _jsx(Typography, {\n                            variant: \"subtitle1\",\n                            color: \"text.secondary\",\n                            children: \"소식 받는 중\"\n                        })\n                    ]\n                }) : /*#__PURE__*/ _jsxs(_Fragment, {\n                    children: [\n                        /*#__PURE__*/ _jsx(Icon, {\n                            icon: Bell,\n                            color: \"#fff\",\n                            size: Sizes.small\n                        }),\n                        /*#__PURE__*/ _jsx(Typography, {\n                            variant: \"subtitle1\",\n                            color: \"background.paper\",\n                            children: \"소식 받기\"\n                        })\n                    ]\n                })\n            }),\n            /*#__PURE__*/ _jsx(SubscribeCancelDialog, {\n                open: isOpen,\n                close: close,\n                value: cancelRadioValue,\n                setValue: setCancelRadioValue,\n                handleSubmit: handleSubmit\n            }),\n            /*#__PURE__*/ _jsx(CheckLoginDialog, {\n                open: loginDialogOpen,\n                onClose: ()=>setLoginDialogOpen(false)\n            }),\n            /*#__PURE__*/ _jsx(Snackbar, {\n                ...defaultSnackbarProps,\n                open: isShowSnackbar,\n                onClose: hideSnackbar,\n                message: /*#__PURE__*/ _jsx(IconWithSnackbarMessage, {\n                    icon: \"success\",\n                    text: /*#__PURE__*/ _jsx(Typography, {\n                        variant: \"subtitle1\",\n                        sx: {\n                            display: \"flex\",\n                            alignItems: \"center\",\n                            gap: \"8px\",\n                            color: \"#FFF\"\n                        },\n                        children: \"이제 이 브랜드의 소식을 받지 않아요.\"\n                    })\n                })\n            })\n        ]\n    });\n};\n","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport Image from \"@/components/common/Image\";\nimport Icon from \"@/components/icon/Icon\";\nimport { Box, Stack, styled, Typography } from \"@mui/material\";\nimport { Sizes, Success24Fill } from \"../icon/IconList\";\nimport { useBrandStore } from \"./BrandProvider\";\nimport { CountLink } from \"./CountLink\";\nimport { ShareButton } from \"./ShareButton\";\nimport { SubscribeButton } from \"./SubscribeButton\";\nexport const AuthorProfile = ()=>{\n    const { productCount , profileImageUrl , nickname , keyword  } = useBrandStore((state)=>state.brand);\n    return /*#__PURE__*/ _jsxs(BrandProfileContainer, {\n        children: [\n            /*#__PURE__*/ _jsx(ProfileImage, {\n                width: 128,\n                height: 128,\n                src: profileImageUrl,\n                alt: \"profile\",\n                defaultImage: \"/static/images/profile_image_empty.png\"\n            }),\n            /*#__PURE__*/ _jsxs(Stack, {\n                alignItems: \"flex-start\",\n                gap: \"12px\",\n                sx: {\n                    textAlign: \"left\"\n                },\n                children: [\n                    /*#__PURE__*/ _jsx(Typography, {\n                        variant: \"h5\",\n                        color: \"text-title\",\n                        children: nickname\n                    }),\n                    keyword && /*#__PURE__*/ _jsxs(Description, {\n                        children: [\n                            /*#__PURE__*/ _jsx(Icon, {\n                                icon: Success24Fill,\n                                size: Sizes.small\n                            }),\n                            keyword\n                        ]\n                    }),\n                    /*#__PURE__*/ _jsx(CountLink, {\n                        count: productCount\n                    }),\n                    /*#__PURE__*/ _jsxs(Box, {\n                        gap: \"8px\",\n                        display: \"flex\",\n                        children: [\n                            /*#__PURE__*/ _jsx(SubscribeButton, {}),\n                            /*#__PURE__*/ _jsx(ShareButton, {})\n                        ]\n                    })\n                ]\n            })\n        ]\n    });\n};\nconst BrandProfileContainer = styled(\"div\")((param)=>{\n    let { theme  } = param;\n    return {\n        display: \"flex\",\n        gap: \"20px\",\n        marginBottom: \"40px\",\n        [theme.breakpoints.down(\"lg\")]: {\n            marginBottom: \"32px\"\n        },\n        [theme.breakpoints.down(\"sm\")]: {\n            gap: \"16px\",\n            marginBottom: \"28px\",\n            padding: \"0 20px\"\n        }\n    };\n});\nconst ProfileImage = styled(Image)((param)=>{\n    let { theme  } = param;\n    return {\n        width: 128,\n        height: 128,\n        borderRadius: \"50%\",\n        border: \"1px solid rgba(169, 175, 199, 0.20)\",\n        objectFit: \"contain\",\n        maxWidth: \"100%\",\n        maxHeight: \"100%\",\n        [theme.breakpoints.down(\"sm\")]: {\n            width: 80,\n            height: 80\n        }\n    };\n});\nconst Description = styled(Typography)((param)=>{\n    let { theme  } = param;\n    return {\n        display: \"flex\",\n        alignItems: \"start\",\n        gap: \"4px\",\n        color: theme.palette.primary.main,\n        ...theme.typography.subtitle1,\n        i: {\n            paddingTop: \"2px\"\n        },\n        [theme.breakpoints.down(\"sm\")]: {\n            ...theme.typography.subtitle2\n        }\n    };\n});\n","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport Image from \"@/components/common/Image\";\nimport { styled } from \"@mui/material\";\nimport { useBrandStore } from \"./BrandProvider\";\nexport const BrandBanner = ()=>{\n    const { subjectTitle , bgImageUrl  } = useBrandStore((state)=>state.brand);\n    return /*#__PURE__*/ _jsxs(BannerWrapper, {\n        className: \"brand-banner\",\n        children: [\n            subjectTitle && /*#__PURE__*/ _jsx(Badge, {\n                children: subjectTitle\n            }),\n            /*#__PURE__*/ _jsx(Image, {\n                src: bgImageUrl,\n                alt: \"brand-banner\",\n                width: 1200,\n                height: 240,\n                defaultImage: \"/static/images/brand_thumbnail_empty.jpg\"\n            })\n        ]\n    });\n};\nconst BannerWrapper = styled(\"div\")((param)=>{\n    let { theme  } = param;\n    return {\n        width: \"100%\",\n        minHeight: \"120px\",\n        aspectRatio: \"5 / 1\",\n        margin: \"40px 0\",\n        position: \"relative\",\n        overflow: \"hidden\",\n        borderRadius: \"12px\",\n        img: {\n            height: \"100%\",\n            width: \"100%\",\n            objectFit: \"cover\",\n            [theme.breakpoints.down(\"sm\")]: {}\n        },\n        [theme.breakpoints.down(\"lg\")]: {\n            margin: \"32px 0\"\n        },\n        [theme.breakpoints.down(\"sm\")]: {\n            margin: \"0 0 28px\",\n            borderRadius: \"0\"\n        }\n    };\n});\nconst Badge = styled(\"p\")((param)=>{\n    let { theme  } = param;\n    return {\n        position: \"absolute\",\n        top: 16,\n        left: 16,\n        boxShadow: theme.shadows[2],\n        padding: \"4px 12px\",\n        borderRadius: \"40px\",\n        color: theme.palette.text.primary,\n        backgroundColor: \"rgba(255, 255, 255, 0.9)\",\n        ...theme.typography.subtitle2\n    };\n});\n","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport useSearchParams from \"@/hooks/useSearchParams\";\nimport { styled } from \"@mui/material\";\nimport { useEffect } from \"react\";\nimport { AuthorProfile } from \"./AuthorProfile\";\nimport { BrandBanner } from \"./BrandBanner\";\nimport { useBrandStore } from \"./BrandProvider\";\nexport const ProfileSection = (param)=>{\n    let { data  } = param;\n    const searchParams = useSearchParams();\n    const updateBrand = useBrandStore((state)=>state.updateBrand);\n    const name = useBrandStore((state)=>state.brand.name);\n    useEffect(()=>{\n        if (searchParams.get(\"userId\") !== name) {\n            updateBrand(data);\n        }\n    }, [\n        searchParams\n    ]);\n    return /*#__PURE__*/ _jsxs(ProfileSectionContainer, {\n        children: [\n            /*#__PURE__*/ _jsx(BrandBanner, {}),\n            /*#__PURE__*/ _jsx(AuthorProfile, {})\n        ]\n    });\n};\nconst ProfileSectionContainer = styled(\"section\")((param)=>{\n    let { theme  } = param;\n    return {\n        width: \"100%\",\n        textAlign: \"center\",\n        maxWidth: \"1200px\",\n        margin: \"0 auto\",\n        [theme.breakpoints.down(\"lg\")]: {\n            padding: \"0 32px\"\n        },\n        [theme.breakpoints.down(\"sm\")]: {\n            padding: \"0\"\n        }\n    };\n});\n","import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport { BrandProvider } from \"@/components/Brand/BrandProvider\";\nimport { ContentsSection } from \"@/components/Brand/ContentsSection\";\nimport { ProfileSection } from \"@/components/Brand/ProfileSection\";\nimport SEO from \"@/components/SEO\";\nimport { LayoutContainer } from \"@/containers/Layout/Layout\";\nimport defaultSeoConfig from \"@/settings/next-seo.config\";\nimport { getCookies } from \"cookies-next\";\nimport React from \"react\";\nimport { getBrand } from \"../../../api/brand\";\nexport const BrandLayout = (param)=>{\n    let { children , author , labDataResult  } = param;\n    var _labDataResult_ogTitle, _labDataResult_ogDescription, _labDataResult_ogDescription1;\n    const metadata = {\n        title: (_labDataResult_ogTitle = labDataResult === null || labDataResult === void 0 ? void 0 : labDataResult.ogTitle) !== null && _labDataResult_ogTitle !== void 0 ? _labDataResult_ogTitle : defaultSeoConfig.title,\n        description: (_labDataResult_ogDescription = labDataResult === null || labDataResult === void 0 ? void 0 : labDataResult.ogDescription) !== null && _labDataResult_ogDescription !== void 0 ? _labDataResult_ogDescription : defaultSeoConfig.description,\n        keywords: labDataResult === null || labDataResult === void 0 ? void 0 : labDataResult.keyword,\n        ogDescription: (_labDataResult_ogDescription1 = labDataResult === null || labDataResult === void 0 ? void 0 : labDataResult.ogDescription) !== null && _labDataResult_ogDescription1 !== void 0 ? _labDataResult_ogDescription1 : defaultSeoConfig.description,\n        ogImage: labDataResult === null || labDataResult === void 0 ? void 0 : labDataResult.ogImage,\n        ogUrl: \"https://solvook.com/@\".concat(labDataResult.name)\n    };\n    return /*#__PURE__*/ _jsxs(_Fragment, {\n        children: [\n            /*#__PURE__*/ _jsx(SEO, {\n                ...metadata\n            }),\n            /*#__PURE__*/ _jsx(BrandProvider, {\n                initialValues: labDataResult,\n                children: /*#__PURE__*/ _jsxs(LayoutContainer, {\n                    children: [\n                        /*#__PURE__*/ _jsx(ProfileSection, {\n                            data: labDataResult\n                        }),\n                        /*#__PURE__*/ _jsx(ContentsSection, {\n                            children: children\n                        })\n                    ]\n                })\n            })\n        ]\n    });\n};\nexport function withBrandLayout(PageComponent) {\n    PageComponent.getLayout = (page)=>{\n        const { props  } = page;\n        return /*#__PURE__*/ _jsx(BrandLayout, {\n            author: props.author,\n            labDataResult: props.labDataResult,\n            children: page\n        });\n    };\n    return PageComponent;\n}\nexport const BrandServerSideProps = async (context)=>{\n    const { userId  } = context.query;\n    const { accessToken  } = getCookies(context) || {};\n    if (!userId) {\n        return {\n            notFound: true\n        };\n    }\n    try {\n        const labDataResult = await getBrand(userId.toString(), accessToken);\n        return {\n            props: {\n                labDataResult\n            }\n        };\n    } catch (error) {\n        return {\n            notFound: true\n        };\n    }\n};\n"],"names":[],"sourceRoot":""}