@transferwise/components 46.126.0 → 46.128.0

package/src/avatarWrapper/__snapshots__/AvatarWrapper.test.tsx.snap

@@ -1,156 +0,0 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
-
-exports[`FlowNavigationAvatar with a name AND profileType FlowNavigationAvatar with a name AND profileType AND avatar url renders the image 1`] = `
-<div
-  class="tw-avatar tw-avatar--48 tw-avatar--thumbnail"
->
-  <div
-    class="tw-avatar__content"
-  >
-    <img
-      alt=""
-      src="https://wise.com"
-    />
-  </div>
-</div>
-`;
-
-exports[`FlowNavigationAvatar with a name AND profileType FlowNavigationAvatar with a name AND profileType renders as BUSINESS profile type with an icon 1`] = `
-<div
-  class="tw-avatar tw-avatar--48 tw-avatar--icon"
->
-  <div
-    class="tw-avatar__content"
-  >
-    <span
-      class="tw-icon tw-icon-briefcase "
-      data-testid="briefcase-icon"
-    >
-      <svg
-        aria-hidden="true"
-        fill="currentColor"
-        focusable="false"
-        height="24"
-        role="none"
-        viewBox="0 0 24 24"
-        width="24"
-      >
-        <path
-          clip-rule="evenodd"
-          d="M9.01 3A1.01 1.01 0 0 0 8 4.01V7H5a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3V4.01A1.01 1.01 0 0 0 14.99 3zM14 7V5h-4v2zm-4 2h4v9h-4zM8 9H5v9h3zm8 9V9h3v9z"
-          fill-rule="evenodd"
-        />
-      </svg>
-    </span>
-  </div>
-</div>
-`;
-
-exports[`FlowNavigationAvatar with a name AND profileType FlowNavigationAvatar with a name AND profileType renders as PERSONAL profile type with an icon 1`] = `
-<div
-  class="tw-avatar tw-avatar--48 tw-avatar--icon"
->
-  <div
-    class="tw-avatar__content"
-  >
-    <span
-      class="tw-icon tw-icon-person "
-      data-testid="person-icon"
-    >
-      <svg
-        aria-hidden="true"
-        fill="currentColor"
-        focusable="false"
-        height="24"
-        role="none"
-        viewBox="0 0 24 24"
-        width="24"
-      >
-        <path
-          clip-rule="evenodd"
-          d="M8 8a4 4 0 1 1 8 0 4 4 0 0 1-8 0m7.557 4.832a6 6 0 1 0-7.114 0A8 8 0 0 0 4 20v2h2v-2a6 6 0 0 1 12 0v2h2v-2a8 8 0 0 0-4.443-7.168"
-          fill-rule="evenodd"
-        />
-      </svg>
-    </span>
-  </div>
-</div>
-`;
-
-exports[`FlowNavigationAvatar with a name AND profileType with a badge url passed renders the badge 1`] = `
-<div
-  class="tw-badge tw-badge-border-light tw-badge-lg"
->
-  <div
-    class="tw-badge__children"
-  >
-    <div
-      class="tw-avatar tw-avatar--48 tw-avatar--icon"
-    >
-      <div
-        class="tw-avatar__content"
-      >
-        <span
-          class="tw-icon tw-icon-person "
-          data-testid="person-icon"
-        >
-          <svg
-            aria-hidden="true"
-            fill="currentColor"
-            focusable="false"
-            height="24"
-            role="none"
-            viewBox="0 0 24 24"
-            width="24"
-          >
-            <path
-              clip-rule="evenodd"
-              d="M8 8a4 4 0 1 1 8 0 4 4 0 0 1-8 0m7.557 4.832a6 6 0 1 0-7.114 0A8 8 0 0 0 4 20v2h2v-2a6 6 0 0 1 12 0v2h2v-2a8 8 0 0 0-4.443-7.168"
-              fill-rule="evenodd"
-            />
-          </svg>
-        </span>
-      </div>
-    </div>
-  </div>
-  <div
-    class="tw-badge__content"
-  >
-    <img
-      alt="badge alt text"
-      src="https://badge.com"
-    />
-  </div>
-</div>
-`;
-
-exports[`FlowNavigationAvatar with a name AND profileType with nothing passed renders a personal icon 1`] = `
-<div
-  class="tw-avatar tw-avatar--48 tw-avatar--icon"
->
-  <div
-    class="tw-avatar__content"
-  >
-    <span
-      class="tw-icon tw-icon-person "
-      data-testid="person-icon"
-    >
-      <svg
-        aria-hidden="true"
-        fill="currentColor"
-        focusable="false"
-        height="24"
-        role="none"
-        viewBox="0 0 24 24"
-        width="24"
-      >
-        <path
-          clip-rule="evenodd"
-          d="M8 8a4 4 0 1 1 8 0 4 4 0 0 1-8 0m7.557 4.832a6 6 0 1 0-7.114 0A8 8 0 0 0 4 20v2h2v-2a6 6 0 0 1 12 0v2h2v-2a8 8 0 0 0-4.443-7.168"
-          fill-rule="evenodd"
-        />
-      </svg>
-    </span>
-  </div>
-</div>
-`;

package/src/checkbox/__snapshots__/Checkbox.test.tsx.snap

@@ -1,40 +0,0 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
-
-exports[`Checkbox renders the given label 1`] = `
-<div>
-  <div
-    class="np-checkbox checkbox"
-  >
-    <label
-      class="np-checkbox-label"
-    >
-      <span
-        class="np-checkbox-button p-r-2"
-      >
-        <input
-          type="checkbox"
-        />
-        <span
-          class="tw-checkbox-button"
-        >
-          <span
-            class="tw-checkbox-check"
-          />
-          <span
-            class="np-tw-checkbox-indeterminate"
-          />
-        </span>
-      </span>
-      <span
-        class="np-text-body-large np-checkbox__text"
-      >
-        <span>
-          <b>
-            hello
-          </b>
-        </span>
-      </span>
-    </label>
-  </div>
-</div>
-`;

package/src/chevron/__snapshots__/Chevron.test.tsx.snap

@@ -1,24 +0,0 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
-
-exports[`Chevron custom xs icon renders 1`] = `
-<div>
-  <span
-    aria-hidden="true"
-    class="tw-icon tw-icon-chevron tw-chevron chevron-color bottom"
-    role="presentation"
-  >
-    <svg
-      fill="currentColor"
-      focusable="false"
-      height="10"
-      viewBox="0 0 10 10"
-      width="10"
-    >
-      <path
-        d="M4.9995 2.0865L0.0635004 6.7645L1.2745 7.9125L4.9995 4.3835L8.7245 7.9135L9.9355 6.7645L4.9995 2.0865Z"
-        fill-rule="evenodd"
-      />
-    </svg>
-  </span>
-</div>
-`;

package/src/chips/__snapshots__/Chips.test.tsx.snap

@@ -1,153 +0,0 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
-
-exports[`Chips Choice Chips renders as expected 1`] = `
-<div>
-  <div
-    aria-label="Please select a category"
-    class="np-chips d-flex"
-    role="radiogroup"
-  >
-    <div
-      aria-checked="false"
-      class="np-chip d-flex align-items-center justify-content-between text-xs-nowrap"
-      role="radio"
-      tabindex="0"
-    >
-      <div
-        aria-hidden="false"
-        class="np-text-body-default-bold"
-      >
-        Accounting
-      </div>
-    </div>
-    <div
-      aria-checked="true"
-      class="np-chip d-flex align-items-center justify-content-between text-xs-nowrap np-chip--selected"
-      role="radio"
-      tabindex="0"
-    >
-      <div
-        aria-hidden="false"
-        class="np-text-body-default-bold"
-      >
-        Payroll
-      </div>
-    </div>
-    <div
-      aria-checked="false"
-      class="np-chip d-flex align-items-center justify-content-between text-xs-nowrap"
-      role="radio"
-      tabindex="0"
-    >
-      <div
-        aria-hidden="false"
-        class="np-text-body-default-bold"
-      >
-        Reporting
-      </div>
-    </div>
-    <div
-      aria-checked="false"
-      class="np-chip d-flex align-items-center justify-content-between text-xs-nowrap"
-      role="radio"
-      tabindex="0"
-    >
-      <div
-        aria-hidden="false"
-        class="np-text-body-default-bold"
-      >
-        Payments
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Chips Filter Chips renders as expected 1`] = `
-<div>
-  <div
-    aria-label="Filter by categories"
-    class="np-chips d-flex"
-    role="group"
-  >
-    <div
-      aria-checked="false"
-      class="np-chip d-flex align-items-center justify-content-between text-xs-nowrap"
-      role="checkbox"
-      tabindex="0"
-    >
-      <div
-        aria-hidden="false"
-        class="np-text-body-default-bold"
-      >
-        Accounting
-      </div>
-    </div>
-    <div
-      aria-checked="false"
-      class="np-chip d-flex align-items-center justify-content-between text-xs-nowrap"
-      role="checkbox"
-      tabindex="0"
-    >
-      <div
-        aria-hidden="false"
-        class="np-text-body-default-bold"
-      >
-        Payroll
-      </div>
-    </div>
-    <div
-      aria-checked="false"
-      class="np-chip d-flex align-items-center justify-content-between text-xs-nowrap"
-      role="checkbox"
-      tabindex="0"
-    >
-      <div
-        aria-hidden="false"
-        class="np-text-body-default-bold"
-      >
-        Reporting
-      </div>
-    </div>
-    <div
-      aria-checked="true"
-      class="np-chip d-flex align-items-center justify-content-between np-chip--removable text-xs-nowrap np-chip--selected p-r-1"
-      role="checkbox"
-      tabindex="-1"
-    >
-      <div
-        aria-hidden="true"
-        class="np-text-body-default-bold"
-      >
-        Payments
-      </div>
-      <button
-        aria-label="Clear Payments"
-        class="np-close-button close btn-link text-no-decoration btn-unstyled"
-        type="button"
-      >
-        <span
-          class="tw-icon tw-icon-cross-circle-fill "
-          data-testid="cross-circle-fill-icon"
-        >
-          <svg
-            aria-hidden="true"
-            fill="currentColor"
-            focusable="false"
-            height="16"
-            role="none"
-            viewBox="0 0 24 24"
-            width="16"
-          >
-            <path
-              clip-rule="evenodd"
-              d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10m-4.707-6.707L10.586 12 7.293 8.707l1.414-1.414L12 10.586l3.293-3.293 1.414 1.414L13.414 12l3.293 3.293-1.414 1.414L12 13.414l-3.293 3.293z"
-              fill-rule="evenodd"
-            />
-          </svg>
-        </span>
-      </button>
-    </div>
-  </div>
-</div>
-`;

package/src/common/RadioButton/__snapshots__/RadioButton.test.tsx.snap

@@ -1,58 +0,0 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
-
-exports[`Radio button renders checked state correctly 1`] = `
-<div>
-  <input
-    checked=""
-    class="sr-only"
-    name="radio-name"
-    type="radio"
-    value=""
-  />
-  <span
-    class="tw-radio-button checked"
-  >
-    <span
-      class="tw-radio-check"
-    />
-  </span>
-</div>
-`;
-
-exports[`Radio button renders correctly 1`] = `
-<div>
-  <input
-    class="sr-only"
-    id="an-id"
-    name="a-name"
-    type="radio"
-    value="a-value"
-  />
-  <span
-    class="tw-radio-button"
-  >
-    <span
-      class="tw-radio-check"
-    />
-  </span>
-</div>
-`;
-
-exports[`Radio button renders disabled state correctly 1`] = `
-<div>
-  <input
-    class="sr-only"
-    disabled=""
-    name="radio-name"
-    type="radio"
-    value=""
-  />
-  <span
-    class="tw-radio-button disabled"
-  >
-    <span
-      class="tw-radio-check"
-    />
-  </span>
-</div>
-`;

package/src/common/bottomSheet/__snapshots__/BottomSheet.test.tsx.snap

@@ -1,80 +0,0 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
-
-exports[`BottomSheet renders content when open 1`] = `
-<body>
-  <div />
-  <div
-    class="np-theme-personal"
-  >
-    <span
-      data-focus-scope-start="true"
-      hidden=""
-    />
-    <div
-      tabindex="-1"
-    >
-      <div
-        class="dimmer"
-        role="presentation"
-      >
-        <div
-          class="dimmer-content-positioner"
-        >
-          <div
-            class="sliding-panel sliding-panel--open-bottom np-bottom-sheet sliding-panel-appear sliding-panel-appear-active"
-          >
-            <div
-              aria-modal="true"
-              role="dialog"
-            >
-              <div
-                class="np-bottom-sheet--top-bar"
-              >
-                <div
-                  class="np-bottom-sheet--handler"
-                />
-                <button
-                  aria-label="Close"
-                  class="np-close-button close btn-link text-no-decoration sr-only np-bottom-sheet--close-btn"
-                  type="button"
-                >
-                  <span
-                    class="tw-icon tw-icon-cross "
-                    data-testid="cross-icon"
-                  >
-                    <svg
-                      aria-hidden="true"
-                      fill="currentColor"
-                      focusable="false"
-                      height="16"
-                      role="none"
-                      viewBox="0 0 24 24"
-                      width="16"
-                    >
-                      <path
-                        d="m12 13.414-7.293 7.293-1.414-1.414L10.586 12 3.293 4.707l1.414-1.414L12 10.586l7.293-7.293 1.414 1.414L13.414 12l7.293 7.293-1.414 1.414z"
-                      />
-                    </svg>
-                  </span>
-                </button>
-              </div>
-              <div
-                class="np-bottom-sheet--content"
-                style="max-height: calc(768px - 64px - 32px);"
-              >
-                <b>
-                  Test Content
-                </b>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <span
-      data-focus-scope-end="true"
-      hidden=""
-    />
-  </div>
-</body>
-`;

package/src/common/card/__snapshots__/Card.test.tsx.snap

@@ -1,10 +0,0 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
-
-exports[`Card matches snapshot 1`] = `
-<div
-  class="np-Card"
-  data-testid="test-card"
->
-  Test Content
-</div>
-`;

package/src/common/closeButton/__snapshots__/CloseButton.test.tsx.snap

@@ -1,30 +0,0 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
-
-exports[`CloseButton renders as expected 1`] = `
-<div>
-  <button
-    aria-label="Close"
-    class="np-close-button close btn-link text-no-decoration np-close-button--large className"
-    type="button"
-  >
-    <span
-      class="tw-icon tw-icon-cross "
-      data-testid="cross-icon"
-    >
-      <svg
-        aria-hidden="true"
-        fill="currentColor"
-        focusable="false"
-        height="24"
-        role="none"
-        viewBox="0 0 24 24"
-        width="24"
-      >
-        <path
-          d="m12 13.414-7.293 7.293-1.414-1.414L10.586 12 3.293 4.707l1.414-1.414L12 10.586l7.293-7.293 1.414 1.414L13.414 12l7.293 7.293-1.414 1.414z"
-        />
-      </svg>
-    </span>
-  </button>
-</div>
-`;

package/src/common/flowHeader/FlowHeader.test.tsx

@@ -1,22 +0,0 @@
-import { render } from '@testing-library/react';
-
-import { Layout } from '../propsValues/layouts';
-
-import FlowHeader from './FlowHeader';
-import type { FlowHeaderProps } from './FlowHeader';
-
-describe('FlowHeader', () => {
-  const props = {
-    leftContent: 'leftContent',
-    rightContent: 'rightContent',
-    bottomContent: 'bottomContent',
-    className: 'className',
-  } satisfies FlowHeaderProps;
-  it('renders as expected', () => {
-    expect(render(<FlowHeader {...props} />).container).toMatchSnapshot();
-  });
-
-  it('renders as expected with vertical layout', () => {
-    expect(render(<FlowHeader {...props} layout={Layout.VERTICAL} />).container).toMatchSnapshot();
-  });
-});

package/src/common/flowHeader/__snapshots__/FlowHeader.test.tsx.snap

@@ -1,33 +0,0 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
-
-exports[`FlowHeader renders as expected 1`] = `
-<div>
-  <div
-    class="np-flow-header d-flex flex-wrap align-items-center justify-content-between flex__item--12 className"
-  >
-    leftContent
-    rightContent
-    <div
-      class="align-items-center d-flex justify-content-center order-1 flex-grow-1"
-    >
-      bottomContent
-    </div>
-  </div>
-</div>
-`;
-
-exports[`FlowHeader renders as expected with vertical layout 1`] = `
-<div>
-  <div
-    class="np-flow-header d-flex flex-wrap align-items-center justify-content-between flex__item--12 className"
-  >
-    leftContent
-    rightContent
-    <div
-      class="align-items-center d-flex justify-content-center flex__item--12"
-    >
-      bottomContent
-    </div>
-  </div>
-</div>
-`;

package/src/common/panel/__snapshots__/Panel.test.tsx.snap

@@ -1,3 +0,0 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
-
-exports[`Panel renders 1`] = `<div />`;