{"code":"// Generated with util/create-component.js\r\nimport React, { useMemo } from \"react\";\r\nimport { COLOR_CHIPS, COLOR_CHIP_PATTERN, } from \"./ColorChips.types\";\r\nvar ColorChips = function (props) {\r\n    var colors = props.colors, chipHeight = props.chipHeight, chipWidth = props.chipWidth, _a = props.direction, direction = _a === void 0 ? \"row\" : _a, _b = props.shape, shape = _b === void 0 ? \"circle\" : _b, _c = props.size, size = _c === void 0 ? 6 : _c;\r\n    var refinedColors = useMemo(function () {\r\n        return colors.split(\"/\").slice(0, size);\r\n    }, [colors]);\r\n    return (React.createElement(\"div\", { \"data-testid\": \"ColorChips\", className: \"nrc--ColorChips \".concat(direction === \"row\"\r\n            ? \"flex space-x-[0.3rem]\"\r\n            : \"flex flex-col space-y-[0.5rem]\") }, refinedColors.map(function (color, index) {\r\n        if (color === \"패턴\") {\r\n            return (React.createElement(ColorChipPattern, { key: \"colorChipPattern\".concat(index), width: chipWidth, height: chipHeight, shape: shape }));\r\n        }\r\n        if (color.indexOf(\"+\") !== -1) {\r\n            var combinationColors = color.split(\"+\");\r\n            return (React.createElement(ColorChipCombination, { key: \"colorChipCombination\".concat(index), colors: combinationColors, direction: \"column\", width: chipWidth, height: chipHeight, shape: shape }));\r\n        }\r\n        if (COLOR_CHIPS[color]) {\r\n            var colorHexValue = COLOR_CHIPS[color];\r\n            return (React.createElement(\"div\", { \"data-testid\": \"ColorChip\", key: \"colorChip\".concat(index), className: \"\".concat(shape === \"circle\" && \"rounded-full\", \" \").concat(colorHexValue === \"#FFFFFF\"\r\n                    ? \"border-[1px] border-gray-3\"\r\n                    : \"border-none\"), style: {\r\n                    backgroundColor: colorHexValue,\r\n                    width: \"\".concat(chipWidth, \"rem\"),\r\n                    height: \"\".concat(chipHeight, \"rem\"),\r\n                } }));\r\n        }\r\n    })));\r\n};\r\nexport default ColorChips;\r\nvar ColorChipPattern = function (props) {\r\n    var width = props.width, height = props.height, _a = props.shape, shape = _a === void 0 ? \"circle\" : _a;\r\n    return (React.createElement(\"div\", { \"data-testid\": \"ColorChipPattern\", className: \"inline-grid overflow-hidden \".concat(shape === \"circle\" && \"rounded-full\"), style: {\r\n            gridTemplateColumns: \"\".concat(+width / 2, \"rem \").concat(+width / 2, \"rem\"),\r\n            gridTemplateRows: \"\".concat(+height / 2, \"rem \").concat(+height / 2, \"rem\"),\r\n        } }, COLOR_CHIP_PATTERN.map(function (color, index) {\r\n        return (React.createElement(\"div\", { className: \"pattern-part\", key: \"patternPart\".concat(index), style: {\r\n                backgroundColor: color,\r\n            } }));\r\n    })));\r\n};\r\nvar ColorChipCombination = function (props) {\r\n    var colors = props.colors, direction = props.direction, width = props.width, height = props.height, _a = props.shape, shape = _a === void 0 ? \"circle\" : _a;\r\n    return (React.createElement(\"div\", { \"data-testid\": \"ColorChipCombination\", className: \"\".concat(colors.indexOf(\"화이트\") !== -1\r\n            ? \"border-1px border-solid border-[#e5e5e5]\"\r\n            : \"border-none\", \" \").concat(direction === \"row\" ? \"flex\" : \"flex-col\", \" \").concat(shape === \"circle\" && \"rounded-full\", \" inline-flex overflow-hidden\"), style: { width: \"\".concat(width, \"rem\"), height: \"\".concat(height, \"rem\") } }, colors.map(function (color, index) {\r\n        return (React.createElement(\"div\", { key: \"combinationColor\".concat(index), style: {\r\n                backgroundColor: COLOR_CHIPS[color],\r\n                flexBasis: \"50%\",\r\n            } }));\r\n    })));\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/ColorChips/ColorChips.types.ts"],"dts":{"name":"/Users/dongyoonkim/Dev/nosearch-react-component/lib/components/ColorChips/ColorChips.d.ts","writeByteOrderMark":false,"text":"import React from \"react\";\r\nimport { ColorChipsProps } from \"./ColorChips.types\";\r\ndeclare const ColorChips: React.FC<ColorChipsProps>;\r\nexport default ColorChips;\r\n"}}