"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.nested = exports.allAlignments = exports.allSpacings = exports.defaultState = void 0;
const react_1 = __importDefault(require("react"));
const addon_knobs_1 = require("@storybook/addon-knobs");
const storybook_utilities_1 = require("../../storybook-utilities");
const TextBlock_1 = require("../TextBlock");
const Heading_1 = require("../Heading");
const HeadingGroup_1 = require("../HeadingGroup");
const InlineStack_1 = require("../InlineStack");
const TextContainer_1 = require("./TextContainer");
const meta = {
    component: TextContainer_1.TextContainer,
    title: 'checkout-web-ui/TextContainer',
    decorators: [addon_knobs_1.withKnobs, storybook_utilities_1.themeWithKnobs('headingLevel2', 'headingLevel3')],
};
exports.default = meta;
function ExampleText() {
    return (<TextBlock_1.TextBlock>
      Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae enim
      veniam natus facilis. Nemo nisi assumenda alias dolore saepe quia! Sed
      perspiciatis veritatis nesciunt vitae nobis distinctio quod illo neque?
    </TextBlock_1.TextBlock>);
}
exports.defaultState = () => (<TextContainer_1.TextContainer>
    <ExampleText />
    <ExampleText />
    <ExampleText />
    <ExampleText />
  </TextContainer_1.TextContainer>);
exports.allSpacings = () => (<InlineStack_1.InlineStack>
    <TextContainer_1.TextContainer spacing="none">
      <Heading_1.Heading>Tight</Heading_1.Heading>
      <ExampleText />
      <ExampleText />
    </TextContainer_1.TextContainer>

    <TextContainer_1.TextContainer spacing="tight">
      <Heading_1.Heading>Tight</Heading_1.Heading>
      <ExampleText />
      <ExampleText />
    </TextContainer_1.TextContainer>

    <TextContainer_1.TextContainer>
      <Heading_1.Heading>Default</Heading_1.Heading>
      <ExampleText />
      <ExampleText />
    </TextContainer_1.TextContainer>

    <TextContainer_1.TextContainer spacing="loose">
      <Heading_1.Heading>Loose</Heading_1.Heading>
      <ExampleText />
      <ExampleText />
    </TextContainer_1.TextContainer>
  </InlineStack_1.InlineStack>);
exports.allAlignments = () => (<InlineStack_1.InlineStack>
    <TextContainer_1.TextContainer>
      <ExampleText />
      <ExampleText />
    </TextContainer_1.TextContainer>
    <TextContainer_1.TextContainer alignment="center">
      <ExampleText />
      <ExampleText />
    </TextContainer_1.TextContainer>
    <TextContainer_1.TextContainer alignment="trailing">
      <ExampleText />
      <ExampleText />
    </TextContainer_1.TextContainer>
  </InlineStack_1.InlineStack>);
exports.nested = () => (<TextContainer_1.TextContainer alignment="trailing">
    <Heading_1.Heading>Default</Heading_1.Heading>
    <ExampleText />
    <ExampleText />
    <HeadingGroup_1.HeadingGroup>
      <TextContainer_1.TextContainer spacing="tight">
        <Heading_1.Heading>Nested with tight spacing</Heading_1.Heading>
        <ExampleText />
        <ExampleText />
      </TextContainer_1.TextContainer>
    </HeadingGroup_1.HeadingGroup>
  </TextContainer_1.TextContainer>);