import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
import * as __WEBPACK_EXTERNAL_MODULE__chakra_ui_react__ from "@chakra-ui/react";
import * as __WEBPACK_EXTERNAL_MODULE__Heading_mjs__ from "./Heading.mjs";
const lorem = `
  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
  labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
  laboris nisi ut aliquip ex ea commodo consequat.
`;
const LoremIpsum = ({ iterations = 1, ...rest })=>{
    const texts = [];
    for(let i = 0; i < iterations; i++)texts.push(/*#__PURE__*/ React.createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, rest, lorem));
    return /*#__PURE__*/ React.createElement(React.Fragment, null, texts);
};
/* ESM default export */ const content_helper = LoremIpsum;
const meta = {
    title: 'Components/Redpanda Heading',
    component: __WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"],
    parameters: {
        design: {
            type: 'figma',
            url: 'https://www.figma.com/file/bJcVrZNilxa06jYuVCGWYd/Redpanda-Design-System-2023?type=design&node-id=1-2031&mode=design&t=lRtlpY3KCbpBSSnj-4'
        }
    },
    argTypes: {
        variant: {
            control: 'select',
            options: [
                'sm',
                'md',
                'lg - default',
                'xl'
            ],
            mapping: {
                'lg - default': 'lg'
            }
        },
        noOfLines: {
            control: 'number'
        }
    },
    args: {
        variant: void 0,
        noOfLines: void 0
    }
};
/* ESM default export */ const Heading_stories_rslib_entry_ = meta;
const Default = {
    render: (args)=>/*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, null, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], args, "Lorem ipsum dolor sit amet consectetur - ", args.variant))
};
const Variants = {
    render: (args)=>/*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Stack, {
            spacing: "4"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            variant: "xl"
        }, "Extra Large Variant (", /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "code"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "mark"
        }, 'variant="xl"')), ")"), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(content_helper, null), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], null, "Large Variant (Default)"), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(content_helper, null), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            variant: "md"
        }, "Medium Variant (", /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "code"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "mark"
        }, 'variant="md"')), ")"), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(content_helper, null), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            variant: "sm"
        }, "Small Variant (", /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "code"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "mark"
        }, 'variant="sm"')), ")"), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(content_helper, null))
};
const VariantsAndAsCombined = {
    name: 'Variants & As',
    render: ()=>/*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, null, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, null, "Headings can also combine", ' ', /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "mark"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "code"
        }, "variant")), ' ', "and", ' ', /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "mark"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "code"
        }, "as")), ' ', "props to render a variant style with an alternate ", /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "code"
        }, "<hN>"), " tag:"), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, {
            my: "6"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            variant: "xl",
            as: "h4"
        }, 'Heading (variant="xl" as="h4")'), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            variant: "sm",
            as: "h1"
        }, 'Heading (variant="sm" as="h1")')))
};
const SizeToVariants = {
    render: (args)=>/*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, null, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            variant: "xl",
            mb: "2"
        }, "Conversion: Sizes to Variants"), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, null, "For backwards compatability, Redpanda", ' ', /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "mark"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "code"
        }, "<Heading />")), ' ', "components will automatically convert Chakra's", ' ', /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "mark"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "code"
        }, "size")), ' ', "prop to Redpanda's Design System variants."), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, {
            my: "6"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            size: "xs",
            mb: "2"
        }, 'size="xs" --> variant="sm"'), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            size: "sm",
            mb: "2"
        }, 'size="sm" --> variant="md"'), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            size: "md",
            mb: "2"
        }, 'size="md" --> variant="lg"'), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            size: "lg",
            mb: "2"
        }, 'size="lg" --> variant="xl"'), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            size: "xl",
            mb: "2"
        }, 'size="xl" --> variant="xl"')))
};
const AsToVariants = {
    render: (args)=>/*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, null, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            variant: "xl",
            mb: "2"
        }, "Conversion: As to Variants"), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            mb: "4"
        }, "For backwards compatability, Redpanda", ' ', /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "mark"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "code"
        }, "<Heading />")), ' ', "components will automatically convert Chakra's", ' ', /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "mark"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "code"
        }, "as")), ' ', "prop to Redpanda's Design System variants."), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, null, "Note: ", /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "code"
        }, "<h5>"), " and ", /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, {
            as: "code"
        }, "<h6>"), ' will default to the "sm" variant (the smallest variant in our Design System.'), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, {
            my: "6"
        }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            as: "h1"
        }, 'Heading (as="h1")'), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            as: "h2"
        }, 'Heading (as="h2")'), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            as: "h3"
        }, 'Heading (as="h3")'), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            as: "h4"
        }, 'Heading (as="h4")'), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            as: "h5"
        }, 'Heading (as="h5")'), /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__Heading_mjs__["default"], {
            as: "h6"
        }, 'Heading (as="h6")')))
};
export { AsToVariants, Default, SizeToVariants, Variants, VariantsAndAsCombined, Heading_stories_rslib_entry_ as default };
