"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.basic = void 0;
const react_1 = __importDefault(require("react"));
const addon_knobs_1 = require("@storybook/addon-knobs");
const Text_1 = require("../Text");
const storybook_utilities_1 = require("../../storybook-utilities");
const Icon_1 = require("../Icon");
const InlineStack_1 = require("../InlineStack");
const Tooltip_1 = require("../Tooltip");
const Divider_1 = require("../Divider");
const MoneyLines_1 = require("./MoneyLines");
const _1 = require(".");
const meta = {
    decorators: [addon_knobs_1.withKnobs, storybook_utilities_1.themeWithKnobs('headingLevel1')],
    component: MoneyLines_1.MoneyLines,
    subComponents: { MoneyLine: _1.MoneyLine, MoneySummary: _1.MoneySummary },
    title: 'checkout-web-ui/MoneyLines',
};
exports.default = meta;
exports.basic = () => (<MoneyLines_1.MoneyLines title="Cost summary">
    <_1.MoneyLine label="Subtotal" value="$3,300.00"/>
    <_1.MoneyLine label="Shipping" value="Calculated at next" subdued/>
    <_1.MoneyLine>
      <_1.MoneyLineHeader>
        <InlineStack_1.InlineStack>
          <Text_1.Text>Taxes</Text_1.Text>
        </InlineStack_1.InlineStack>
      </_1.MoneyLineHeader>
      <_1.MoneyLineContent>
        <InlineStack_1.InlineStack>
          <Text_1.Text emphasized>$429.00</Text_1.Text>
          <Tooltip_1.Tooltip content="Tooltip">
            <Icon_1.Icon source="questionFill" size="large" appearance="subdued" accessibilityLabel="Tooltip"/>
          </Tooltip_1.Tooltip>
        </InlineStack_1.InlineStack>
      </_1.MoneyLineContent>
    </_1.MoneyLine>
    <_1.MoneyLine>
      <_1.MoneyLineHeader>
        <InlineStack_1.InlineStack>
          <Text_1.Text>Discount</Text_1.Text>
          <InlineStack_1.InlineStack alignment="center" spacing="extraTight">
            <Icon_1.Icon source="discount" size="large"/>
            <Text_1.Text>SPRINGSALE10</Text_1.Text>
          </InlineStack_1.InlineStack>
        </InlineStack_1.InlineStack>
      </_1.MoneyLineHeader>
      <_1.MoneyLineContent>
        <Text_1.Text emphasized>$10</Text_1.Text>
      </_1.MoneyLineContent>
    </_1.MoneyLine>
    <Divider_1.Divider blockSpacing="loose"/>
    <_1.MoneySummary label="Total" value="$3,719.00" prefix="CAD"/>
  </MoneyLines_1.MoneyLines>);