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

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

exports[`Transfer should render correctly 1`] = `
<div
  class="ant-transfer"
>
  <div
    class="ant-transfer-list"
  >
    <div
      class="ant-transfer-list-header"
    >
      <label
        class="ant-checkbox-wrapper ant-checkbox-wrapper-checked"
      >
        <span
          class="ant-checkbox ant-checkbox-checked"
        >
          <input
            checked=""
            class="ant-checkbox-input"
            type="checkbox"
          />
          <span
            class="ant-checkbox-inner"
          />
        </span>
      </label>
      <span
        class="ant-transfer-list-header-selected"
      >
        <span>
          1/2 items
        </span>
        <span
          class="ant-transfer-list-header-title"
        />
      </span>
    </div>
    <div
      class="ant-transfer-list-body"
    >
      <ul
        class="ant-transfer-list-content"
      >
        <li
          class="ant-transfer-list-content-item"
        >
          <label
            class="ant-checkbox-wrapper ant-checkbox-wrapper-checked"
          >
            <span
              class="ant-checkbox ant-checkbox-checked"
            >
              <input
                checked=""
                class="ant-checkbox-input"
                type="checkbox"
              />
              <span
                class="ant-checkbox-inner"
              />
            </span>
          </label>
          <span
            class="ant-transfer-list-content-item-text"
          />
        </li>
        <li
          class="ant-transfer-list-content-item ant-transfer-list-content-item-disabled"
        >
          <label
            class="ant-checkbox-wrapper ant-checkbox-wrapper-disabled"
          >
            <span
              class="ant-checkbox ant-checkbox-disabled"
            >
              <input
                class="ant-checkbox-input"
                disabled=""
                type="checkbox"
              />
              <span
                class="ant-checkbox-inner"
              />
            </span>
          </label>
          <span
            class="ant-transfer-list-content-item-text"
          />
        </li>
      </ul>
    </div>
  </div>
  <div
    class="ant-transfer-operation"
  >
    <button
      class="ant-btn ant-btn-primary ant-btn-sm ant-btn-icon-only"
      type="button"
    >
      right
    </button>
    <button
      class="ant-btn ant-btn-primary ant-btn-sm ant-btn-icon-only"
      disabled=""
      type="button"
    >
      left
    </button>
  </div>
  <div
    class="ant-transfer-list"
  >
    <div
      class="ant-transfer-list-header"
    >
      <label
        class="ant-checkbox-wrapper"
      >
        <span
          class="ant-checkbox"
        >
          <input
            class="ant-checkbox-input"
            type="checkbox"
          />
          <span
            class="ant-checkbox-inner"
          />
        </span>
      </label>
      <span
        class="ant-transfer-list-header-selected"
      >
        <span>
          1 item
        </span>
        <span
          class="ant-transfer-list-header-title"
        />
      </span>
    </div>
    <div
      class="ant-transfer-list-body"
    >
      <ul
        class="ant-transfer-list-content"
      >
        <li
          class="ant-transfer-list-content-item"
        >
          <label
            class="ant-checkbox-wrapper"
          >
            <span
              class="ant-checkbox"
            >
              <input
                class="ant-checkbox-input"
                type="checkbox"
              />
              <span
                class="ant-checkbox-inner"
              />
            </span>
          </label>
          <span
            class="ant-transfer-list-content-item-text"
          />
        </li>
      </ul>
    </div>
  </div>
</div>
`;

exports[`Transfer should show sorted targetkey 1`] = `
<div
  class="ant-transfer"
>
  <div
    class="ant-transfer-list"
  >
    <div
      class="ant-transfer-list-header"
    >
      <label
        class="ant-checkbox-wrapper"
      >
        <span
          class="ant-checkbox"
        >
          <input
            class="ant-checkbox-input"
            type="checkbox"
          />
          <span
            class="ant-checkbox-inner"
          />
        </span>
      </label>
      <span
        class="ant-transfer-list-header-selected"
      >
        <span>
          1 item
        </span>
        <span
          class="ant-transfer-list-header-title"
        />
      </span>
    </div>
    <div
      class="ant-transfer-list-body"
    >
      <ul
        class="ant-transfer-list-content"
      >
        <li
          class="ant-transfer-list-content-item"
          title="a"
        >
          <label
            class="ant-checkbox-wrapper"
          >
            <span
              class="ant-checkbox"
            >
              <input
                class="ant-checkbox-input"
                type="checkbox"
              />
              <span
                class="ant-checkbox-inner"
              />
            </span>
          </label>
          <span
            class="ant-transfer-list-content-item-text"
          >
            a
          </span>
        </li>
      </ul>
    </div>
  </div>
  <div
    class="ant-transfer-operation"
  >
    <button
      class="ant-btn ant-btn-primary ant-btn-sm ant-btn-icon-only"
      disabled=""
      type="button"
    >
      right
    </button>
    <button
      class="ant-btn ant-btn-primary ant-btn-sm ant-btn-icon-only"
      disabled=""
      type="button"
    >
      left
    </button>
  </div>
  <div
    class="ant-transfer-list"
  >
    <div
      class="ant-transfer-list-header"
    >
      <label
        class="ant-checkbox-wrapper"
      >
        <span
          class="ant-checkbox"
        >
          <input
            class="ant-checkbox-input"
            type="checkbox"
          />
          <span
            class="ant-checkbox-inner"
          />
        </span>
      </label>
      <span
        class="ant-transfer-list-header-selected"
      >
        <span>
          2 items
        </span>
        <span
          class="ant-transfer-list-header-title"
        />
      </span>
    </div>
    <div
      class="ant-transfer-list-body"
    >
      <ul
        class="ant-transfer-list-content"
      >
        <li
          class="ant-transfer-list-content-item"
          title="c"
        >
          <label
            class="ant-checkbox-wrapper"
          >
            <span
              class="ant-checkbox"
            >
              <input
                class="ant-checkbox-input"
                type="checkbox"
              />
              <span
                class="ant-checkbox-inner"
              />
            </span>
          </label>
          <span
            class="ant-transfer-list-content-item-text"
          >
            c
          </span>
        </li>
        <li
          class="ant-transfer-list-content-item"
          title="b"
        >
          <label
            class="ant-checkbox-wrapper"
          >
            <span
              class="ant-checkbox"
            >
              <input
                class="ant-checkbox-input"
                type="checkbox"
              />
              <span
                class="ant-checkbox-inner"
              />
            </span>
          </label>
          <span
            class="ant-transfer-list-content-item-text"
          >
            b
          </span>
        </li>
      </ul>
    </div>
  </div>
</div>
`;

exports[`Transfer should support render value and label in item 1`] = `
<Transfer
  dataSource={
    Array [
      Object {
        "key": "a",
        "title": "title",
      },
    ]
  }
  locale={Object {}}
  render={[Function]}
  showSearch={false}
>
  <LocaleReceiver
    componentName="Transfer"
    defaultLocale={
      Object {
        "itemUnit": "item",
        "itemsUnit": "items",
        "searchPlaceholder": "Search here",
        "titles": Array [
          "",
          "",
        ],
      }
    }
  >
    <div
      className="ant-transfer"
    >
      <TransferList
        checkedKeys={Array []}
        dataSource={
          Array [
            Object {
              "key": "a",
              "title": "title",
            },
          ]
        }
        direction="left"
        handleClear={[Function]}
        handleFilter={[Function]}
        itemUnit="item"
        itemsUnit="items"
        lazy={Object {}}
        notFoundContent={
          <Context.Consumer>
            [Function]
          </Context.Consumer>
        }
        onItemSelect={[Function]}
        onItemSelectAll={[Function]}
        onScroll={[Function]}
        prefixCls="ant-transfer-list"
        render={[Function]}
        searchPlaceholder="Search here"
        showSearch={false}
        titleText=""
        titles={
          Array [
            "",
            "",
          ]
        }
      >
        <div
          className="ant-transfer-list"
        >
          <div
            className="ant-transfer-list-header"
          >
            <Checkbox
              checked={false}
              indeterminate={false}
              onChange={[Function]}
            >
              <label
                className="ant-checkbox-wrapper"
              >
                <Checkbox
                  checked={false}
                  className=""
                  defaultChecked={false}
                  onBlur={[Function]}
                  onChange={[Function]}
                  onFocus={[Function]}
                  prefixCls="ant-checkbox"
                  style={Object {}}
                  type="checkbox"
                >
                  <span
                    className="ant-checkbox"
                    style={Object {}}
                  >
                    <input
                      checked={false}
                      className="ant-checkbox-input"
                      onBlur={[Function]}
                      onChange={[Function]}
                      onFocus={[Function]}
                      type="checkbox"
                    />
                    <span
                      className="ant-checkbox-inner"
                    />
                  </span>
                </Checkbox>
              </label>
            </Checkbox>
            <span
              className="ant-transfer-list-header-selected"
            >
              <span>
                1
                 
                item
              </span>
              <span
                className="ant-transfer-list-header-title"
              />
            </span>
          </div>
          <div
            className="ant-transfer-list-body"
          >
            <ListBody
              dataSource={
                Array [
                  Object {
                    "key": "a",
                    "title": "title",
                  },
                ]
              }
              direction="left"
              filteredItems={
                Array [
                  Object {
                    "key": "a",
                    "title": "title",
                  },
                ]
              }
              filteredRenderItems={
                Array [
                  Object {
                    "item": Object {
                      "key": "a",
                      "title": "title",
                    },
                    "renderedEl": "label",
                    "renderedText": "title value",
                  },
                ]
              }
              itemUnit="item"
              itemsUnit="items"
              lazy={Object {}}
              notFoundContent={
                <Context.Consumer>
                  [Function]
                </Context.Consumer>
              }
              onItemSelect={[Function]}
              onItemSelectAll={[Function]}
              onScroll={[Function]}
              prefixCls="ant-transfer-list"
              render={[Function]}
              searchPlaceholder="Search here"
              selectedKeys={Array []}
              showSearch={false}
              titleText=""
              titles={
                Array [
                  "",
                  "",
                ]
              }
            >
              <Animate
                animation={Object {}}
                className="ant-transfer-list-content"
                component="ul"
                componentProps={
                  Object {
                    "onScroll": [Function],
                  }
                }
                onAppear={[Function]}
                onEnd={[Function]}
                onEnter={[Function]}
                onLeave={[Function]}
                transitionAppear={false}
                transitionEnter={true}
                transitionLeave={false}
                transitionName=""
              >
                <ul
                  className="ant-transfer-list-content"
                  onScroll={[Function]}
                >
                  <AnimateChild
                    animation={Object {}}
                    key="a"
                    transitionAppear={false}
                    transitionEnter={true}
                    transitionLeave={false}
                    transitionName=""
                  >
                    <ListItem
                      checked={false}
                      item={
                        Object {
                          "key": "a",
                          "title": "title",
                        }
                      }
                      key="a"
                      lazy={Object {}}
                      onClick={[Function]}
                      prefixCls="ant-transfer-list"
                      renderedEl="label"
                      renderedText="title value"
                    >
                      <LazyLoad
                        debounce={false}
                        elementType="div"
                        height={32}
                        offset={500}
                        offsetBottom={0}
                        offsetHorizontal={0}
                        offsetLeft={0}
                        offsetRight={0}
                        offsetTop={0}
                        offsetVertical={0}
                        throttle={0}
                      >
                        <div
                          className="LazyLoad"
                          style={
                            Object {
                              "height": 32,
                              "width": undefined,
                            }
                          }
                        />
                      </LazyLoad>
                    </ListItem>
                  </AnimateChild>
                </ul>
              </Animate>
            </ListBody>
          </div>
        </div>
      </TransferList>
      <Operation
        className="ant-transfer-operation"
        leftActive={false}
        moveToLeft={[Function]}
        moveToRight={[Function]}
        rightActive={false}
      >
        <div
          className="ant-transfer-operation"
        >
          <Button
            block={false}
            disabled={true}
            ghost={false}
            htmlType="button"
            icon="right"
            loading={false}
            onClick={[Function]}
            size="small"
            type="primary"
          >
            <Wave>
              <button
                className="ant-btn ant-btn-primary ant-btn-sm ant-btn-icon-only"
                disabled={true}
                onClick={[Function]}
                type="button"
              >
                right
              </button>
            </Wave>
          </Button>
          <Button
            block={false}
            disabled={true}
            ghost={false}
            htmlType="button"
            icon="left"
            loading={false}
            onClick={[Function]}
            size="small"
            type="primary"
          >
            <Wave>
              <button
                className="ant-btn ant-btn-primary ant-btn-sm ant-btn-icon-only"
                disabled={true}
                onClick={[Function]}
                type="button"
              >
                left
              </button>
            </Wave>
          </Button>
        </div>
      </Operation>
      <TransferList
        checkedKeys={Array []}
        dataSource={Array []}
        direction="right"
        handleClear={[Function]}
        handleFilter={[Function]}
        itemUnit="item"
        itemsUnit="items"
        lazy={Object {}}
        notFoundContent={
          <Context.Consumer>
            [Function]
          </Context.Consumer>
        }
        onItemSelect={[Function]}
        onItemSelectAll={[Function]}
        onScroll={[Function]}
        prefixCls="ant-transfer-list"
        render={[Function]}
        searchPlaceholder="Search here"
        showSearch={false}
        titleText=""
        titles={
          Array [
            "",
            "",
          ]
        }
      >
        <div
          className="ant-transfer-list"
        >
          <div
            className="ant-transfer-list-header"
          >
            <Checkbox
              checked={false}
              indeterminate={false}
              onChange={[Function]}
            >
              <label
                className="ant-checkbox-wrapper"
              >
                <Checkbox
                  checked={false}
                  className=""
                  defaultChecked={false}
                  onBlur={[Function]}
                  onChange={[Function]}
                  onFocus={[Function]}
                  prefixCls="ant-checkbox"
                  style={Object {}}
                  type="checkbox"
                >
                  <span
                    className="ant-checkbox"
                    style={Object {}}
                  >
                    <input
                      checked={false}
                      className="ant-checkbox-input"
                      onBlur={[Function]}
                      onChange={[Function]}
                      onFocus={[Function]}
                      type="checkbox"
                    />
                    <span
                      className="ant-checkbox-inner"
                    />
                  </span>
                </Checkbox>
              </label>
            </Checkbox>
            <span
              className="ant-transfer-list-header-selected"
            >
              <span>
                0
                 
                item
              </span>
              <span
                className="ant-transfer-list-header-title"
              />
            </span>
          </div>
          <div
            className="ant-transfer-list-body"
          >
            <div
              className="ant-transfer-list-body-not-found"
            >
              <Empty
                className="ant-empty-small"
                image={<Simple />}
              >
                <LocaleReceiver
                  componentName="Empty"
                >
                  <div
                    className="ant-empty ant-empty-normal ant-empty-small"
                  >
                    <div
                      className="ant-empty-image"
                    >
                      <Simple>
                        <svg
                          height="41"
                          viewBox="0 0 64 41"
                          width="64"
                          xmlns="http://www.w3.org/2000/svg"
                        >
                          <g
                            fill="none"
                            fillRule="evenodd"
                            transform="translate(0 1)"
                          >
                            <ellipse
                              cx="32"
                              cy="33"
                              fill="#F5F5F5"
                              rx="32"
                              ry="7"
                            />
                            <g
                              fillRule="nonzero"
                              stroke="#D9D9D9"
                            >
                              <path
                                d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"
                              />
                              <path
                                d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z"
                                fill="#FAFAFA"
                              />
                            </g>
                          </g>
                        </svg>
                      </Simple>
                    </div>
                    <p
                      className="ant-empty-description"
                    >
                      No Data
                    </p>
                  </div>
                </LocaleReceiver>
              </Empty>
            </div>
          </div>
        </div>
      </TransferList>
    </div>
  </LocaleReceiver>
</Transfer>
`;