ant-design/components/descriptions/__tests__/__snapshots__/index.test.js.snap

// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Descriptions Descriptions support colon 1`] = `
<Descriptions
  colon={false}
  column={
    Object {
      "lg": 3,
      "md": 3,
      "sm": 2,
      "xl": 3,
      "xs": 1,
      "xxl": 3,
    }
  }
  size="default"
>
  <div
    className="ant-descriptions"
  >
    <div
      className="ant-descriptions-view"
    >
      <table>
        <tbody>
          <tr
            className="ant-descriptions-row"
            key="0"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Product"
                  prefixCls="ant-descriptions"
                  span={1}
                >
                  Cloud Database
                </DescriptionsItem>
              }
              colon={false}
              key="label-0"
              layout="horizontal"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label"
                  key="label"
                >
                  Product
                </span>
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  Cloud Database
                </span>
              </td>
            </Col>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</Descriptions>
`;

exports[`Descriptions Descriptions support style 1`] = `
<Descriptions
  column={
    Object {
      "lg": 3,
      "md": 3,
      "sm": 2,
      "xl": 3,
      "xs": 1,
      "xxl": 3,
    }
  }
  size="default"
  style={
    Object {
      "backgroundColor": "#e8e8e8",
    }
  }
>
  <div
    className="ant-descriptions"
    style={
      Object {
        "backgroundColor": "#e8e8e8",
      }
    }
  >
    <div
      className="ant-descriptions-view"
    >
      <table>
        <tbody>
          <tr
            className="ant-descriptions-row"
            key="0"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  prefixCls="ant-descriptions"
                  span={1}
                >
                  Cloud Database
                </DescriptionsItem>
              }
              colon={true}
              key="label-0"
              layout="horizontal"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon ant-descriptions-item-no-label"
                  key="label"
                />
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  Cloud Database
                </span>
              </td>
            </Col>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</Descriptions>
`;

exports[`Descriptions Descriptions.Item support className 1`] = `
<Descriptions
  column={
    Object {
      "lg": 3,
      "md": 3,
      "sm": 2,
      "xl": 3,
      "xs": 1,
      "xxl": 3,
    }
  }
  size="default"
>
  <div
    className="ant-descriptions"
  >
    <div
      className="ant-descriptions-view"
    >
      <table>
        <tbody>
          <tr
            className="ant-descriptions-row"
            key="0"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  className="my-class"
                  label="Product"
                  prefixCls="ant-descriptions"
                  span={1}
                >
                  Cloud Database
                </DescriptionsItem>
              }
              colon={true}
              key="label-0"
              layout="horizontal"
              type="label"
            >
              <td
                className="ant-descriptions-item my-class"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  Product
                </span>
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  Cloud Database
                </span>
              </td>
            </Col>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</Descriptions>
`;

exports[`Descriptions column is number 1`] = `
<Descriptions
  column="3"
  size="default"
>
  <div
    className="ant-descriptions"
  >
    <div
      className="ant-descriptions-view"
    >
      <table>
        <tbody>
          <tr
            className="ant-descriptions-row"
            key="0"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Product"
                  prefixCls="ant-descriptions"
                >
                  Cloud Database
                </DescriptionsItem>
              }
              colon={true}
              key="label-0"
              layout="horizontal"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  Product
                </span>
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  Cloud Database
                </span>
              </td>
            </Col>
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Billing"
                  prefixCls="ant-descriptions"
                >
                  Prepaid
                </DescriptionsItem>
              }
              colon={true}
              key="label-1"
              layout="horizontal"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  Billing
                </span>
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  Prepaid
                </span>
              </td>
            </Col>
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="time"
                  prefixCls="ant-descriptions"
                >
                  18:00:00
                </DescriptionsItem>
              }
              colon={true}
              key="label-2"
              layout="horizontal"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  time
                </span>
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  18:00:00
                </span>
              </td>
            </Col>
          </tr>
          <tr
            className="ant-descriptions-row"
            key="1"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Amount"
                  prefixCls="ant-descriptions"
                  span={3}
                >
                  $80.00
                </DescriptionsItem>
              }
              colon={true}
              key="label-0"
              layout="horizontal"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={3}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  Amount
                </span>
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  $80.00
                </span>
              </td>
            </Col>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</Descriptions>
`;

exports[`Descriptions should work with React Fragment 1`] = `
<div
  class="ant-descriptions"
>
  <div
    class="ant-descriptions-view"
  >
    <table>
      <tbody>
        <tr
          class="ant-descriptions-row"
        >
          <td
            class="ant-descriptions-item"
            colspan="1"
          >
            <span
              class="ant-descriptions-item-label ant-descriptions-item-colon"
            >
              bamboo
            </span>
            <span
              class="ant-descriptions-item-content"
            >
              bamboo
            </span>
          </td>
        </tr>
        <tr
          class="ant-descriptions-row"
        >
          <td
            class="ant-descriptions-item"
            colspan="1"
          >
            <span
              class="ant-descriptions-item-label ant-descriptions-item-colon"
            >
              bamboo
            </span>
            <span
              class="ant-descriptions-item-content"
            >
              bamboo
            </span>
          </td>
        </tr>
        <tr
          class="ant-descriptions-row"
        >
          <td
            class="ant-descriptions-item"
            colspan="1"
          >
            <span
              class="ant-descriptions-item-label ant-descriptions-item-colon"
            >
              bamboo
            </span>
            <span
              class="ant-descriptions-item-content"
            >
              bamboo
            </span>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</div>
`;

exports[`Descriptions vertical layout 1`] = `
<Descriptions
  column={
    Object {
      "lg": 3,
      "md": 3,
      "sm": 2,
      "xl": 3,
      "xs": 1,
      "xxl": 3,
    }
  }
  layout="vertical"
  size="default"
>
  <div
    className="ant-descriptions"
  >
    <div
      className="ant-descriptions-view"
    >
      <table>
        <tbody>
          <tr
            className="ant-descriptions-row"
            key="label-0"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Product"
                  prefixCls="ant-descriptions"
                >
                  Cloud Database
                </DescriptionsItem>
              }
              colon={true}
              key="label-0"
              layout="vertical"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  Product
                </span>
              </td>
            </Col>
          </tr>
          <tr
            className="ant-descriptions-row"
            key="content-0"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Product"
                  prefixCls="ant-descriptions"
                >
                  Cloud Database
                </DescriptionsItem>
              }
              colon={true}
              key="content-0"
              layout="vertical"
              type="content"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  Cloud Database
                </span>
              </td>
            </Col>
          </tr>
          <tr
            className="ant-descriptions-row"
            key="label-1"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Billing"
                  prefixCls="ant-descriptions"
                >
                  Prepaid
                </DescriptionsItem>
              }
              colon={true}
              key="label-0"
              layout="vertical"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  Billing
                </span>
              </td>
            </Col>
          </tr>
          <tr
            className="ant-descriptions-row"
            key="content-1"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Billing"
                  prefixCls="ant-descriptions"
                >
                  Prepaid
                </DescriptionsItem>
              }
              colon={true}
              key="content-0"
              layout="vertical"
              type="content"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  Prepaid
                </span>
              </td>
            </Col>
          </tr>
          <tr
            className="ant-descriptions-row"
            key="label-2"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="time"
                  prefixCls="ant-descriptions"
                >
                  18:00:00
                </DescriptionsItem>
              }
              colon={true}
              key="label-0"
              layout="vertical"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  time
                </span>
              </td>
            </Col>
          </tr>
          <tr
            className="ant-descriptions-row"
            key="content-2"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="time"
                  prefixCls="ant-descriptions"
                >
                  18:00:00
                </DescriptionsItem>
              }
              colon={true}
              key="content-0"
              layout="vertical"
              type="content"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  18:00:00
                </span>
              </td>
            </Col>
          </tr>
          <tr
            className="ant-descriptions-row"
            key="label-3"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Amount"
                  prefixCls="ant-descriptions"
                  span={1}
                >
                  $80.00
                </DescriptionsItem>
              }
              colon={true}
              key="label-0"
              layout="vertical"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  Amount
                </span>
              </td>
            </Col>
          </tr>
          <tr
            className="ant-descriptions-row"
            key="content-3"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Amount"
                  prefixCls="ant-descriptions"
                  span={1}
                >
                  $80.00
                </DescriptionsItem>
              }
              colon={true}
              key="content-0"
              layout="vertical"
              type="content"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  $80.00
                </span>
              </td>
            </Col>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</Descriptions>
`;

exports[`Descriptions when item is rendered conditionally 1`] = `
<Descriptions
  column={
    Object {
      "lg": 3,
      "md": 3,
      "sm": 2,
      "xl": 3,
      "xs": 1,
      "xxl": 3,
    }
  }
  size="default"
>
  <div
    className="ant-descriptions"
  >
    <div
      className="ant-descriptions-view"
    >
      <table>
        <tbody>
          <tr
            className="ant-descriptions-row"
            key="0"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Product"
                  prefixCls="ant-descriptions"
                >
                  Cloud Database
                </DescriptionsItem>
              }
              colon={true}
              key="label-0"
              layout="horizontal"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  Product
                </span>
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  Cloud Database
                </span>
              </td>
            </Col>
          </tr>
          <tr
            className="ant-descriptions-row"
            key="1"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Billing"
                  prefixCls="ant-descriptions"
                >
                  Prepaid
                </DescriptionsItem>
              }
              colon={true}
              key="label-0"
              layout="horizontal"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  Billing
                </span>
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  Prepaid
                </span>
              </td>
            </Col>
          </tr>
          <tr
            className="ant-descriptions-row"
            key="2"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="time"
                  prefixCls="ant-descriptions"
                >
                  18:00:00
                </DescriptionsItem>
              }
              colon={true}
              key="label-0"
              layout="horizontal"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  time
                </span>
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  18:00:00
                </span>
              </td>
            </Col>
          </tr>
          <tr
            className="ant-descriptions-row"
            key="3"
          >
            <Col
              bordered={false}
              child={
                <DescriptionsItem
                  label="Amount"
                  prefixCls="ant-descriptions"
                  span={1}
                >
                  $80.00
                </DescriptionsItem>
              }
              colon={true}
              key="label-0"
              layout="horizontal"
              type="label"
            >
              <td
                className="ant-descriptions-item"
                colSpan={1}
              >
                <span
                  className="ant-descriptions-item-label ant-descriptions-item-colon"
                  key="label"
                >
                  Amount
                </span>
                <span
                  className="ant-descriptions-item-content"
                  key="content"
                >
                  $80.00
                </span>
              </td>
            </Col>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</Descriptions>
`;