@jetshop/ui 5.13.12-0 → 5.14.0-alpha.49df897e

package/Menu/MenuContainer.test.js

@@ -1,245 +1,245 @@
-import { render } from '@testing-library/react';
-import React from 'react';
-import MenuContainer from './MenuContainer';
-
-const MOCK_CATEGORIES = [
-  {
-    id: 159,
-    name: 'News!',
-    level: 1,
-    parentId: null,
-    primaryRoute: {
-      path: '/news',
-      __typename: 'Route'
-    },
-    subcategories: [
-      {
-        id: 160,
-        name: 'All products',
-        level: 2,
-        parentId: 159,
-        primaryRoute: {
-          path: '/news/all-products',
-          __typename: 'Route'
-        },
-        subcategories: [],
-        __typename: 'Category'
-      },
-      {
-        id: 161,
-        name: 'Ladies',
-        level: 2,
-        parentId: 159,
-        primaryRoute: {
-          path: '/news/ladies',
-          __typename: 'Route'
-        },
-        subcategories: [],
-        __typename: 'Category'
-      },
-      {
-        id: 162,
-        name: 'Mens',
-        level: 2,
-        parentId: 159,
-        primaryRoute: {
-          path: '/news/mens',
-          __typename: 'Route'
-        },
-        subcategories: [],
-        __typename: 'Category'
-      },
-      {
-        id: 164,
-        name: 'Kids',
-        level: 2,
-        parentId: 159,
-        primaryRoute: {
-          path: '/news/kids',
-          __typename: 'Route'
-        },
-        subcategories: [
-          {
-            id: 302,
-            name: 'Tier 3',
-            level: 3,
-            parentId: 164,
-            primaryRoute: null,
-            __typename: 'Category'
-          }
-        ],
-        __typename: 'Category'
-      }
-    ],
-    __typename: 'Category'
-  },
-  {
-    id: 1159,
-    name: 'News!',
-    level: 1,
-    parentId: null,
-    primaryRoute: {
-      path: '/news',
-      __typename: 'Route'
-    },
-    subcategories: [
-      {
-        id: 1160,
-        name: 'All products',
-        level: 2,
-        parentId: 1159,
-        primaryRoute: {
-          path: '/news/all-products',
-          __typename: 'Route'
-        },
-        subcategories: [],
-        __typename: 'Category'
-      },
-      {
-        id: 1161,
-        name: 'Ladies',
-        level: 2,
-        parentId: 1159,
-        primaryRoute: {
-          path: '/news/ladies',
-          __typename: 'Route'
-        },
-        subcategories: [],
-        __typename: 'Category'
-      },
-      {
-        id: 1162,
-        name: 'Mens',
-        level: 2,
-        parentId: 1159,
-        primaryRoute: {
-          path: '/news/mens',
-          __typename: 'Route'
-        },
-        subcategories: [],
-        __typename: 'Category'
-      },
-      {
-        id: 1164,
-        name: 'Kids',
-        level: 2,
-        parentId: 1159,
-        primaryRoute: {
-          path: '/news/kids',
-          __typename: 'Route'
-        },
-        subcategories: [
-          {
-            id: 3102,
-            name: 'Tier 3',
-            level: 3,
-            parentId: 1164,
-            primaryRoute: null,
-            __typename: 'Category'
-          }
-        ],
-        __typename: 'Category'
-      }
-    ],
-    __typename: 'Category'
-  }
-];
-
-describe('MenuContainer', () => {
-  it('renders child as fn with args', () => {
-    const { renderArg } = setup();
-    expect(renderArg).toMatchSnapshot();
-  });
-
-  it('renders isActiveCategory as true when given an active category', () => {
-    const { renderArg } = setup();
-    expect(renderArg.isActiveCategory(MOCK_CATEGORIES[0])).not.toBeTruthy();
-    renderArg.setActiveCategory(MOCK_CATEGORIES[0]);
-
-    expect(renderArg.isActiveCategory(MOCK_CATEGORIES[0])).toBeTruthy();
-    expect(renderArg.isActiveCategory(MOCK_CATEGORIES[1])).not.toBeTruthy();
-  });
-
-  it('can clear all active categories', () => {
-    const { renderArg, childrenSpy } = setup();
-
-    renderArg.setActiveCategory(MOCK_CATEGORIES[0]);
-    expect(childrenSpy).toHaveBeenCalledWith(
-      expect.objectContaining({
-        activeCategories: [MOCK_CATEGORIES[0]]
-      })
-    );
-    renderArg.clearActiveCategories();
-    expect(childrenSpy).toHaveBeenLastCalledWith(
-      expect.objectContaining({
-        activeCategories: []
-      })
-    );
-  });
-
-  it('persists other active navs when one is removed', () => {
-    const { renderArg, childrenSpy } = setup();
-    renderArg.setActiveCategory(MOCK_CATEGORIES[0]);
-    renderArg.setActiveCategory(MOCK_CATEGORIES[1]);
-    renderArg.removeActiveCategory(MOCK_CATEGORIES[0]);
-    expect(childrenSpy).toHaveBeenCalledWith(
-      expect.objectContaining({
-        activeCategories: [MOCK_CATEGORIES[1]]
-      })
-    );
-  });
-
-  it('allows only one active nav when allowMultipleActive prop is false', () => {
-    const { renderArg, childrenSpy } = setup({
-      allowMultipleActive: false
-    });
-    renderArg.setActiveCategory(MOCK_CATEGORIES[0]);
-    expect(childrenSpy).toHaveBeenCalledWith(
-      expect.objectContaining({ activeCategories: [MOCK_CATEGORIES[0]] })
-    );
-    renderArg.setActiveCategory(MOCK_CATEGORIES[1]);
-    expect(childrenSpy).toHaveBeenLastCalledWith(
-      expect.objectContaining({ activeCategories: [MOCK_CATEGORIES[1]] })
-    );
-    expect(childrenSpy).not.toHaveBeenLastCalledWith(
-      expect.objectContaining({ activeCategories: [MOCK_CATEGORIES[0]] })
-    );
-  });
-
-  it('can toggle the active category', () => {
-    const { renderArg, childrenSpy } = setup();
-
-    renderArg.toggleActiveCategory(MOCK_CATEGORIES[0]);
-
-    expect(childrenSpy).toHaveBeenCalledWith(
-      expect.objectContaining({
-        activeCategories: [MOCK_CATEGORIES[0]]
-      })
-    );
-
-    renderArg.toggleActiveCategory(MOCK_CATEGORIES[0]);
-
-    expect(childrenSpy).toHaveBeenCalledWith(
-      expect.objectContaining({
-        activeCategories: [MOCK_CATEGORIES[0]]
-      })
-    );
-  });
-});
-
-function setup(containerProps = {}, renderFn) {
-  let renderArg;
-
-  const childrenSpy = jest.fn(controllerArg => {
-    renderArg = controllerArg;
-
-    if (renderFn) return renderFn;
-    return <div />;
-  });
-
-  const utils = render(
-    <MenuContainer {...containerProps}>{childrenSpy}</MenuContainer>
-  );
-
-  return { ...utils, childrenSpy, renderArg };
-}
+import { render } from '@testing-library/react';
+import React from 'react';
+import MenuContainer from './MenuContainer';
+
+const MOCK_CATEGORIES = [
+  {
+    id: 159,
+    name: 'News!',
+    level: 1,
+    parentId: null,
+    primaryRoute: {
+      path: '/news',
+      __typename: 'Route'
+    },
+    subcategories: [
+      {
+        id: 160,
+        name: 'All products',
+        level: 2,
+        parentId: 159,
+        primaryRoute: {
+          path: '/news/all-products',
+          __typename: 'Route'
+        },
+        subcategories: [],
+        __typename: 'Category'
+      },
+      {
+        id: 161,
+        name: 'Ladies',
+        level: 2,
+        parentId: 159,
+        primaryRoute: {
+          path: '/news/ladies',
+          __typename: 'Route'
+        },
+        subcategories: [],
+        __typename: 'Category'
+      },
+      {
+        id: 162,
+        name: 'Mens',
+        level: 2,
+        parentId: 159,
+        primaryRoute: {
+          path: '/news/mens',
+          __typename: 'Route'
+        },
+        subcategories: [],
+        __typename: 'Category'
+      },
+      {
+        id: 164,
+        name: 'Kids',
+        level: 2,
+        parentId: 159,
+        primaryRoute: {
+          path: '/news/kids',
+          __typename: 'Route'
+        },
+        subcategories: [
+          {
+            id: 302,
+            name: 'Tier 3',
+            level: 3,
+            parentId: 164,
+            primaryRoute: null,
+            __typename: 'Category'
+          }
+        ],
+        __typename: 'Category'
+      }
+    ],
+    __typename: 'Category'
+  },
+  {
+    id: 1159,
+    name: 'News!',
+    level: 1,
+    parentId: null,
+    primaryRoute: {
+      path: '/news',
+      __typename: 'Route'
+    },
+    subcategories: [
+      {
+        id: 1160,
+        name: 'All products',
+        level: 2,
+        parentId: 1159,
+        primaryRoute: {
+          path: '/news/all-products',
+          __typename: 'Route'
+        },
+        subcategories: [],
+        __typename: 'Category'
+      },
+      {
+        id: 1161,
+        name: 'Ladies',
+        level: 2,
+        parentId: 1159,
+        primaryRoute: {
+          path: '/news/ladies',
+          __typename: 'Route'
+        },
+        subcategories: [],
+        __typename: 'Category'
+      },
+      {
+        id: 1162,
+        name: 'Mens',
+        level: 2,
+        parentId: 1159,
+        primaryRoute: {
+          path: '/news/mens',
+          __typename: 'Route'
+        },
+        subcategories: [],
+        __typename: 'Category'
+      },
+      {
+        id: 1164,
+        name: 'Kids',
+        level: 2,
+        parentId: 1159,
+        primaryRoute: {
+          path: '/news/kids',
+          __typename: 'Route'
+        },
+        subcategories: [
+          {
+            id: 3102,
+            name: 'Tier 3',
+            level: 3,
+            parentId: 1164,
+            primaryRoute: null,
+            __typename: 'Category'
+          }
+        ],
+        __typename: 'Category'
+      }
+    ],
+    __typename: 'Category'
+  }
+];
+
+describe('MenuContainer', () => {
+  it('renders child as fn with args', () => {
+    const { renderArg } = setup();
+    expect(renderArg).toMatchSnapshot();
+  });
+
+  it('renders isActiveCategory as true when given an active category', () => {
+    const { renderArg } = setup();
+    expect(renderArg.isActiveCategory(MOCK_CATEGORIES[0])).not.toBeTruthy();
+    renderArg.setActiveCategory(MOCK_CATEGORIES[0]);
+
+    expect(renderArg.isActiveCategory(MOCK_CATEGORIES[0])).toBeTruthy();
+    expect(renderArg.isActiveCategory(MOCK_CATEGORIES[1])).not.toBeTruthy();
+  });
+
+  it('can clear all active categories', () => {
+    const { renderArg, childrenSpy } = setup();
+
+    renderArg.setActiveCategory(MOCK_CATEGORIES[0]);
+    expect(childrenSpy).toHaveBeenCalledWith(
+      expect.objectContaining({
+        activeCategories: [MOCK_CATEGORIES[0]]
+      })
+    );
+    renderArg.clearActiveCategories();
+    expect(childrenSpy).toHaveBeenLastCalledWith(
+      expect.objectContaining({
+        activeCategories: []
+      })
+    );
+  });
+
+  it('persists other active navs when one is removed', () => {
+    const { renderArg, childrenSpy } = setup();
+    renderArg.setActiveCategory(MOCK_CATEGORIES[0]);
+    renderArg.setActiveCategory(MOCK_CATEGORIES[1]);
+    renderArg.removeActiveCategory(MOCK_CATEGORIES[0]);
+    expect(childrenSpy).toHaveBeenCalledWith(
+      expect.objectContaining({
+        activeCategories: [MOCK_CATEGORIES[1]]
+      })
+    );
+  });
+
+  it('allows only one active nav when allowMultipleActive prop is false', () => {
+    const { renderArg, childrenSpy } = setup({
+      allowMultipleActive: false
+    });
+    renderArg.setActiveCategory(MOCK_CATEGORIES[0]);
+    expect(childrenSpy).toHaveBeenCalledWith(
+      expect.objectContaining({ activeCategories: [MOCK_CATEGORIES[0]] })
+    );
+    renderArg.setActiveCategory(MOCK_CATEGORIES[1]);
+    expect(childrenSpy).toHaveBeenLastCalledWith(
+      expect.objectContaining({ activeCategories: [MOCK_CATEGORIES[1]] })
+    );
+    expect(childrenSpy).not.toHaveBeenLastCalledWith(
+      expect.objectContaining({ activeCategories: [MOCK_CATEGORIES[0]] })
+    );
+  });
+
+  it('can toggle the active category', () => {
+    const { renderArg, childrenSpy } = setup();
+
+    renderArg.toggleActiveCategory(MOCK_CATEGORIES[0]);
+
+    expect(childrenSpy).toHaveBeenCalledWith(
+      expect.objectContaining({
+        activeCategories: [MOCK_CATEGORIES[0]]
+      })
+    );
+
+    renderArg.toggleActiveCategory(MOCK_CATEGORIES[0]);
+
+    expect(childrenSpy).toHaveBeenCalledWith(
+      expect.objectContaining({
+        activeCategories: [MOCK_CATEGORIES[0]]
+      })
+    );
+  });
+});
+
+function setup(containerProps = {}, renderFn) {
+  let renderArg;
+
+  const childrenSpy = jest.fn(controllerArg => {
+    renderArg = controllerArg;
+
+    if (renderFn) return renderFn;
+    return <div />;
+  });
+
+  const utils = render(
+    <MenuContainer {...containerProps}>{childrenSpy}</MenuContainer>
+  );
+
+  return { ...utils, childrenSpy, renderArg };
+}

package/Menu/RecursiveTree.d.ts

@@ -1,28 +1,28 @@
-import { Category } from '@jetshop/core/types';
-import React from 'react';
-import { MenuContainerRender } from './MenuContainer';
-import { RouteChildrenProps } from 'react-router';
-export interface RecursiveTreeProps {
-    /** The base category to render */
-    category: Category;
-    children(args: RecursiveTreeRender): React.ReactNode;
-    initialOpenMatchingCategories?: boolean;
-}
-export interface RecursiveTreeRender {
-    /** Execute to fetch the next 3 levels of subcategories */
-    fetchMore(): void;
-    /** Props passed through from MenuContainer UI component */
-    menuContainerProps: MenuContainerRender;
-    /** Whether or not the current category has subcategories */
-    hasSubcategories: boolean;
-    /** An array of subcategories at the current level */
-    subcategories: Category[];
-    /** The current category being rendered */
-    category: Category;
-    /** The current category level */
-    level: number;
-    /** Execute to recursively render subcategories in place */
-    renderSubnav: React.ReactNode[];
-}
-declare const _default: React.ComponentClass<Pick<RecursiveTreeProps & RouteChildrenProps<{}, any>, keyof RecursiveTreeProps>, any> & import("react-router").WithRouterStatics<React.FC<RecursiveTreeProps & RouteChildrenProps<{}, any>>>;
-export default _default;
+import { Category } from '@jetshop/core/types';
+import React from 'react';
+import { MenuContainerRender } from './MenuContainer';
+import { RouteChildrenProps } from 'react-router';
+export interface RecursiveTreeProps {
+    /** The base category to render */
+    category: Category;
+    children(args: RecursiveTreeRender): React.ReactNode;
+    initialOpenMatchingCategories?: boolean;
+}
+export interface RecursiveTreeRender {
+    /** Execute to fetch the next 3 levels of subcategories */
+    fetchMore(): void;
+    /** Props passed through from MenuContainer UI component */
+    menuContainerProps: MenuContainerRender;
+    /** Whether or not the current category has subcategories */
+    hasSubcategories: boolean;
+    /** An array of subcategories at the current level */
+    subcategories: Category[];
+    /** The current category being rendered */
+    category: Category;
+    /** The current category level */
+    level: number;
+    /** Execute to recursively render subcategories in place */
+    renderSubnav: React.ReactNode[];
+}
+declare const _default: React.ComponentClass<Pick<RecursiveTreeProps & RouteChildrenProps<{}, any>, keyof RecursiveTreeProps>, any> & import("react-router").WithRouterStatics<React.FC<RecursiveTreeProps & RouteChildrenProps<{}, any>>>;
+export default _default;