@sitecore/sc-contenthub-blok
Version:
A UI library for [Sitecore Content Hub](https://doc.sitecore.com/ch/).
28 lines • 2.31 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.PlayGround = exports.Icons = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const BlokAlert_1 = require("../BlokAlert/BlokAlert");
const BlokIcon_1 = require("./BlokIcon");
const meta = {
title: "Components/Media and icons/BlokIcon",
component: BlokIcon_1.BlokIcon,
tags: ["autodocs"],
argTypes: {},
args: {},
};
exports.default = meta;
exports.Icons = {
parameters: {
viewMode: "story",
controls: { disable: true, expanded: false },
options: { showPanel: false },
},
render: () => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(BlokAlert_1.BlokAlert, { children: ["When using icons make sure that there is a ", (0, jsx_runtime_1.jsx)("code", { children: "DIV" }), " with an id of ", (0, jsx_runtime_1.jsx)("code", { children: "\"icons-wrapper\"" }), " in the dom. ContentHub already includes this div.", (0, jsx_runtime_1.jsxs)("p", { children: ["All icons can be found in the", " ", (0, jsx_runtime_1.jsx)("a", { href: "https://github.com/Sitecore-PD/sitecore.contenthub.icons/tree/master/dist/icons", target: "_blank", children: "Sitecore Content Hub Icons" }), " ", "repository."] }), (0, jsx_runtime_1.jsxs)("p", { children: ["A visual overview of the icons can be found", " ", (0, jsx_runtime_1.jsx)("a", { href: "https://ch-webapp.sitecorecontenthub.cloud/css/m-icons-demo/demo", target: "_blank", children: "here" }), "."] })] }), (0, jsx_runtime_1.jsxs)("div", { style: { fontSize: "22px", display: "flex", gap: 8 }, children: [(0, jsx_runtime_1.jsx)(BlokIcon_1.BlokIcon, { icon: "m-icon-trash" }), (0, jsx_runtime_1.jsx)(BlokIcon_1.BlokIcon, { icon: "m-icon-trash", iconColor: "red" }), (0, jsx_runtime_1.jsx)(BlokIcon_1.BlokIcon, { icon: "m-icon-trash", iconColor: "red", iconBackgroundColor: "red" }), (0, jsx_runtime_1.jsx)(BlokIcon_1.BlokIcon, { icon: "m-icon-trash", iconSize: "small" }), (0, jsx_runtime_1.jsx)(BlokIcon_1.BlokIcon, { icon: "m-icon-trash", iconSize: "extraSmall" }), (0, jsx_runtime_1.jsx)(BlokIcon_1.BlokIcon, { icon: "m-icon-trash", fontSize: "100px" })] })] })),
};
exports.PlayGround = {
args: {
icon: "trash",
},
};
//# sourceMappingURL=BlokIcon.stories.js.map