{"code":"// Generated with util/create-component.js\r\nimport React, { useEffect, useState } from \"react\";\r\nimport Button from \"../UI/Button\";\r\nimport Heading from \"../UI/Heading\";\r\nimport { BookmarkDefault, BookmarkPressed, Close, Comment, Index, Share, } from \"../UI/Icon\";\r\nimport Text from \"../UI/Text\";\r\nvar ContentSidebar = function (props) {\r\n    var type = props.type, data = props.data;\r\n    var category = data.category, likeCount = data.likeCount, likeStatus = data.likeStatus, ShareButton = data.ShareButton, BookmarkButton = data.BookmarkButton, CommentButton = data.CommentButton, commentCount = data.commentCount, RecommendProductsButton = data.RecommendProductsButton, indexData = data.indexData;\r\n    var _a = useState(false), indexOpened = _a[0], setIndexOpend = _a[1];\r\n    return (React.createElement(\"div\", { \"data-testid\": \"ContentSidebar\", className: \"nrc--ContentSidebar w-[12.4rem] border-[1px] border-gray-3 rounded-[10px] p-[1.2rem] bg-white z-[200] relative\" },\r\n        type === \"purchaseGuide\" && indexData && indexOpened && (React.createElement(IndexView, { indexData: indexData, setIndexOpend: setIndexOpend })),\r\n        React.createElement(Text, { type: \"B5\", className: \"text-center text-gray-10 mb-[2rem]\" },\r\n            category,\r\n            \" \",\r\n            React.createElement(\"br\", null),\r\n            type === \"purchaseGuide\" ? \"구매가이드\" : \"가전백과\"),\r\n        React.createElement(\"div\", { className: \"w-full h-[1px] bg-gray-3\" }),\r\n        React.createElement(\"div\", { className: \"mt-[2rem]\" },\r\n            React.createElement(ActionButtons, { type: type, likeCount: likeCount, likeStatus: likeStatus, BookmarkButton: BookmarkButton, CommentButton: CommentButton, commentCount: commentCount, ShareButton: ShareButton, indexOpened: indexOpened, setIndexOpend: setIndexOpend }),\r\n            React.createElement(Button, { size: \"s\", type: \"outline\", onClick: function () {\r\n                    RecommendProductsButton && RecommendProductsButton();\r\n                } },\r\n                React.createElement(Text, { type: \"B8\", className: \"text-blue-7 whitespace-nowrap\" }, \"\\uCD94\\uCC9C\\uC81C\\uD488 \\uBCF4\\uAE30\")))));\r\n};\r\nexport default ContentSidebar;\r\nvar ActionButtons = function (props) {\r\n    var type = props.type, _a = props.likeCount, likeCount = _a === void 0 ? 0 : _a, _b = props.likeStatus, likeStatus = _b === void 0 ? false : _b, BookmarkButton = props.BookmarkButton, _c = props.commentCount, commentCount = _c === void 0 ? 0 : _c, CommentButton = props.CommentButton, ShareButton = props.ShareButton, setIndexOpend = props.setIndexOpend, indexOpened = props.indexOpened;\r\n    var _d = useState(likeCount), likeCountState = _d[0], setLikeCount = _d[1];\r\n    var _e = useState(likeStatus), isLiked = _e[0], setIsLiked = _e[1];\r\n    var onLikeCountStatus = function (likeCount) {\r\n        setLikeCount(likeCount);\r\n    };\r\n    var onLikeStatus = function (likeStatus) {\r\n        setIsLiked(likeStatus);\r\n    };\r\n    useEffect(function () {\r\n        setLikeCount(likeCount);\r\n        onLikeStatus(likeStatus);\r\n    }, [likeStatus]);\r\n    return (React.createElement(\"div\", { className: \"w-full flex flex-col justify-center items-center space-y-[2rem] mb-[2rem]\" },\r\n        type === \"purchaseGuide\" && (React.createElement(\"button\", { onClick: function (e) {\r\n                e.preventDefault();\r\n                if (e.target.nodeName === \"svg\" || \"path\") {\r\n                    setIndexOpend && setIndexOpend(!indexOpened);\r\n                }\r\n            } },\r\n            React.createElement(Index, { size: \"3rem\" }),\r\n            React.createElement(Text, { type: \"B10\", className: \"text-gray-10\" }, \"\\uBAA9\\uCC28\"))),\r\n        React.createElement(\"button\", { onClick: function (e) {\r\n                e.preventDefault();\r\n                if (e.target.nodeName === \"svg\" || \"path\") {\r\n                    BookmarkButton && BookmarkButton();\r\n                    if (isLiked)\r\n                        onLikeCountStatus(likeCount);\r\n                    else\r\n                        onLikeCountStatus(likeCount + 1);\r\n                    onLikeStatus(!isLiked);\r\n                }\r\n            } },\r\n            React.createElement(\"div\", { className: \"flex flex-col items-center\" },\r\n                isLiked ? (React.createElement(BookmarkPressed, { size: \"3rem\" })) : (React.createElement(BookmarkDefault, { size: \"3rem\" })),\r\n                React.createElement(Text, { type: \"B10\", className: \"whitespace-nowrap \".concat(isLiked ? \"text-primary\" : \"text-gray-10\") }, likeCountState))),\r\n        React.createElement(\"button\", { onClick: function (e) {\r\n                e.preventDefault();\r\n                if (e.target.nodeName === \"svg\" || \"path\") {\r\n                    ShareButton && ShareButton();\r\n                }\r\n            } },\r\n            React.createElement(Share, { size: \"3rem\" }),\r\n            React.createElement(Text, { type: \"B10\", className: \"text-gray-10\" }, \"\\uACF5\\uC720\")),\r\n        React.createElement(\"button\", { onClick: function (e) {\r\n                e.preventDefault();\r\n                if (e.target.nodeName === \"svg\" || \"path\") {\r\n                    CommentButton && CommentButton();\r\n                }\r\n            } },\r\n            React.createElement(Comment, { size: \"3rem\" }),\r\n            React.createElement(Text, { type: \"B10\", className: \"text-gray-10\" }, commentCount))));\r\n};\r\nvar IndexView = function (props) {\r\n    var indexData = props.indexData, setIndexOpend = props.setIndexOpend;\r\n    return (React.createElement(\"div\", { className: \"w-[32.3rem] border-[1px] border-gray-3 rounded-[10px] p-[2rem] bg-white z-[200] absolute top-0 right-[13.2rem]\" },\r\n        React.createElement(\"div\", { className: \"flex items-center justify-between mb-[2rem]\" },\r\n            React.createElement(Heading, { level: 4, className: \"text-gray-10\" }, \"\\uBAA9\\uCC28\"),\r\n            React.createElement(\"button\", { onClick: function () {\r\n                    setIndexOpend && setIndexOpend(false);\r\n                } },\r\n                React.createElement(Close, { size: \"2rem\" }))),\r\n        React.createElement(\"div\", { className: \"space-y-[2rem] cursor-pointer\" }, indexData.map(function (data, i) {\r\n            return React.createElement(IndexBox, { key: \"purchaseGuideIndex_\".concat(i), data: data });\r\n        }))));\r\n};\r\nvar IndexBox = function (props) {\r\n    var _a = props.data, title = _a.title, desc = _a.desc, onClickIndex = _a.onClickIndex;\r\n    return (React.createElement(\"div\", { onClick: function () {\r\n            onClickIndex && onClickIndex();\r\n        } },\r\n        React.createElement(\"div\", { className: \"w-full h-[1px] bg-gray-3\" }),\r\n        React.createElement(\"div\", { className: \"mt-[2rem]\" },\r\n            React.createElement(Heading, { level: 6, className: \"text-gray-10\" }, title),\r\n            React.createElement(Text, { type: \"B10\", className: \"text-gray-10\" }, desc))));\r\n};\r\n","references":["/Users/dongyoonkim/Dev/nosearch-react-component/node_modules/@types/react/index.d.ts","/Users/dongyoonkim/Dev/nosearch-react-component/src/components/UI/Button/index.ts","/Users/dongyoonkim/Dev/nosearch-react-component/src/components/UI/Heading/index.ts","/Users/dongyoonkim/Dev/nosearch-react-component/src/components/UI/Icon/index.ts","/Users/dongyoonkim/Dev/nosearch-react-component/src/components/UI/Text/index.ts","/Users/dongyoonkim/Dev/nosearch-react-component/src/components/ContentSidebar/ContentSidebar.types.ts"],"dts":{"name":"/Users/dongyoonkim/Dev/nosearch-react-component/lib/components/ContentSidebar/ContentSidebar.d.ts","writeByteOrderMark":false,"text":"import React from \"react\";\r\nimport { ContentSidebarProps } from \"./ContentSidebar.types\";\r\ndeclare const ContentSidebar: React.FC<ContentSidebarProps>;\r\nexport default ContentSidebar;\r\n"}}