@prezly/theme-kit-ui
Version:
UI components for Prezly themes
36 lines (35 loc) • 1.21 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.ColorPalette = ColorPalette;
var _react = _interopRequireDefault(require("react"));
var _tailwindMerge = require("tailwind-merge");
var _ColorSwatch = require("./ColorSwatch.cjs");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function ColorPalette(_ref) {
var {
title,
description,
colors
} = _ref;
return /*#__PURE__*/_react.default.createElement("div", {
className: (0, _tailwindMerge.twMerge)('mt-16', 'sb-unstyled')
}, /*#__PURE__*/_react.default.createElement("h3", {
className: "text-base leading-6 font-medium text-gray-500 mb-2"
}, title), description && /*#__PURE__*/_react.default.createElement("h4", {
className: "mb-5 text-sm leading-5 text-gray-500"
}, description), /*#__PURE__*/_react.default.createElement("div", {
className: "grid gap-x-6 gap-y-10 grid-cols-[repeat(auto-fill,minmax(200px,1fr))]"
}, colors.map(_ref2 => {
var {
name,
hex
} = _ref2;
return /*#__PURE__*/_react.default.createElement(_ColorSwatch.ColorSwatch, {
key: hex,
value: name,
hex: hex
});
})));
}