@digigov/ui 0.31.0 → 0.32.0

package/src/core/NavList/__stories__/NavListSecondaryAutoExample.tsx

@@ -1,284 +0,0 @@
-import React, { useState } from 'react';
-import { NavListAuto, NavListLayout } from '@digigov/ui/core/NavList';
-import NavListItemAuto from '@digigov/ui/core/NavList/NavListAuto/NavListItemAuto';
-import FieldContainer, { Fieldset } from '@digigov/ui/core/FieldContainer';
-import Hint from '@digigov/ui/typography/Hint';
-import { RadioContainer, RadioItem } from '@digigov/ui/core/RadioContainer';
-import { SectionBreak } from '@digigov/ui/core/SectionBreak';
-
-const links = [
-  {
-    name: 'Nav1',
-    label: 'Item list 1',
-    menu: {
-      title: 'This is the first Menu',
-      links: [
-        {
-          name: 'Nav1__Nav1.1',
-          label: 'link navigation',
-          href: '?q=item',
-        },
-        {
-          name: 'Nav1__Nav1.2',
-          label: 'link navigation',
-          href: '?q=item',
-        },
-      ],
-    },
-  },
-  {
-    name: 'Nav2',
-    label: 'Item list 2',
-    menu: {
-      title: 'This is the second Menu',
-      links: [
-        {
-          name: 'Nav2__Nav2.1',
-          label: 'link navigation',
-          href: '?q=item',
-        },
-        {
-          name: 'Nav2__Nav2.2',
-          label: 'link navigation',
-          href: '?q=item',
-        },
-        {
-          name: 'Nav2__Nav2.3',
-          label: 'link navigation',
-          href: '?q=item',
-        },
-        {
-          name: 'Nav2__Nav2.4',
-          label: 'link navigation',
-          href: '?q=item',
-        },
-        {
-          name: 'Nav2__Nav2.5',
-          label: 'link navigation',
-          href: '?q=item',
-        },
-        {
-          name: 'Nav2__Nav2.6',
-          label: 'link navigation',
-          href: '?q=item',
-        },
-        {
-          name: 'Nav2__Nav2.7',
-          label: 'link navigation',
-          href: '?q=item',
-        },
-      ],
-    },
-  },
-  {
-    name: 'Nav3',
-    label: 'Item list 3',
-    subMenu: [
-      {
-        name: 'Nav3__Nav3.1',
-        label: 'Item list 4',
-        href: '?q=item4',
-      },
-      {
-        name: 'Nav3__Nav3.2',
-        label: 'Item list 5',
-        subMenu: [
-          {
-            name: 'Nav3__Nav3.2__Nav3.2.1',
-            label: 'Item list 5.2',
-            menu: {
-              title: 'This is the fifth Menu',
-              links: [
-                {
-                  name: 'Nav3__Nav3.2__Nav3.2.1__Nav3.2.1.1',
-                  label: 'link navigation',
-                  href: '?q=item',
-                },
-                {
-                  name: 'Nav3__Nav3.2__Nav3.2.1__Nav3.2.1.2',
-                  label: 'link navigation',
-                  href: '?q=item',
-                },
-                {
-                  name: 'Nav3__Nav3.2__Nav3.2.1__Nav3.2.1.3',
-                  label: 'link navigation',
-                  href: '?q=item',
-                },
-                {
-                  name: 'Nav3__Nav3.2__Nav3.2.1__Nav3.2.1.4',
-                  label: 'link navigation',
-                  href: '?q=item',
-                },
-                {
-                  name: 'Nav3__Nav3.2__Nav3.2.1__Nav3.2.1.5',
-                  label: 'link navigation',
-                  href: '?q=item',
-                },
-                {
-                  name: 'Nav3__Nav3.2__Nav3.2.1__Nav3.2.1.6',
-                  label: 'link navigation',
-                  href: '?q=item',
-                },
-                {
-                  name: 'Nav3__Nav3.2__Nav3.2.1__Nav3.2.1.7',
-                  label: 'link navigation',
-                  href: '?q=item',
-                },
-              ],
-            },
-          },
-        ],
-      },
-      {
-        name: 'Nav3__Nav3.3',
-        label: 'Item list 6',
-        menu: {
-          title: 'This is the sixth Menu',
-          links: [
-            {
-              name: 'Nav3__Nav3.3__Nav3.3.1',
-              label: 'link navigation',
-              href: '?q=item',
-            },
-            {
-              name: 'Nav3__Nav3.3__Nav3.3.2',
-              label: 'link navigation',
-              href: '?q=item',
-            },
-            {
-              name: 'Nav3__Nav3.3__Nav3.3.3',
-              label: 'link navigation',
-              href: '?q=item',
-            },
-            {
-              name: 'Nav3__Nav3.3__Nav3.3.4',
-              label: 'link navigation',
-              href: '?q=item',
-            },
-            {
-              name: 'Nav3__Nav3.3__Nav3.3.5',
-              label: 'link navigation',
-              href: '?q=item',
-            },
-            {
-              name: 'Nav3__Nav3.3__Nav3.3.6',
-              label: 'link navigation',
-              href: '?q=item',
-            },
-            {
-              name: 'Nav3__Nav3.3__Nav3.3.7',
-              label: 'link navigation',
-              href: '?q=item',
-            },
-            {
-              name: 'Nav3__Nav3.3__Nav3.3.8',
-              label: 'link navigation',
-              href: '?q=item',
-            },
-            {
-              name: 'Nav3__Nav3.3__Nav3.3.9',
-              label: 'link navigation',
-              href: '?q=item',
-            },
-            {
-              name: 'Nav3__Nav3.3__Nav3.3.10',
-              label: 'link navigation',
-              href: '?q=item',
-            },
-            {
-              name: 'Nav3__Nav3.3__Nav3.3.11',
-              label: 'link navigation',
-              href: '?q=item',
-            },
-          ],
-        },
-      },
-    ],
-  },
-];
-
-export const NavListSecondaryAutoExample = () => {
-  const [layout, setLayout] = useState<NavListLayout>('horizontal');
-  const [border, setBorder] = useState<string>('no');
-  const [fixed, setFixed] = useState<string>('no');
-
-  return (
-    <>
-      <NavListAuto
-        layout={layout}
-        border={border === 'yes'}
-        fixed={fixed === 'yes'}
-        links={links}
-        aria-label="Nav list"
-      >
-        {links.map((item, key) => (
-          <NavListItemAuto key={key} item={item} />
-        ))}
-      </NavListAuto>
-      <SectionBreak visible={false} size="l" />
-      <FieldContainer>
-        <Fieldset aria-describedby="name-hint">
-          <Hint id="name-hint">Layout options:</Hint>
-          <RadioContainer inline>
-            <RadioItem
-              defaultChecked={layout === 'vertical'}
-              name="changed_display"
-              value="vertical"
-              onClick={() => setLayout('vertical')}
-            >
-              Vertical
-            </RadioItem>
-            <RadioItem
-              defaultChecked={layout === 'horizontal'}
-              name="changed_display"
-              value="horizontal"
-              onClick={() => setLayout('horizontal')}
-            >
-              Horizontal
-            </RadioItem>
-          </RadioContainer>
-          <Hint id="name-hint">Bottom border:</Hint>
-          <RadioContainer inline>
-            <RadioItem
-              defaultChecked={border === 'yes'}
-              name="changed_border"
-              value="yes"
-              onClick={() => setBorder('yes')}
-            >
-              Yes
-            </RadioItem>
-            <RadioItem
-              defaultChecked={border === 'no'}
-              name="changed_border"
-              value="no"
-              onClick={() => setBorder('no')}
-            >
-              No
-            </RadioItem>
-          </RadioContainer>
-          <Hint id="name-hint">Position fixed:</Hint>
-          <RadioContainer inline>
-            <RadioItem
-              defaultChecked={fixed === 'yes'}
-              name="changed_position"
-              value="yes"
-              onClick={() => setFixed('yes')}
-            >
-              Yes
-            </RadioItem>
-            <RadioItem
-              defaultChecked={fixed === 'no'}
-              name="changed_position"
-              value="no"
-              onClick={() => setFixed('no')}
-            >
-              No
-            </RadioItem>
-          </RadioContainer>
-        </Fieldset>
-      </FieldContainer>
-    </>
-  );
-};
-
-export default NavListSecondaryAutoExample;

package/src/core/NavList/__stories__/NavListVerticalAutoExample.tsx

@@ -1,65 +0,0 @@
-import React from 'react';
-import { NavListAuto } from '@digigov/ui/core/NavList';
-import NavListItemAuto from '@digigov/ui/core/NavList/NavListAuto/NavListItemAuto';
-
-const links = [
-  {
-    name: 'Nav1',
-    label: 'Nav list item 1',
-    href: '#',
-  },
-  {
-    name: 'Nav2',
-    label: 'Nav list item 2',
-    menu: {
-      title: 'This is the first Menu',
-      links: [
-        {
-          name: 'Nav2.1',
-          label: 'link navigation',
-          href: '#',
-        },
-        {
-          name: 'Nav2.2',
-          label: 'link navigation',
-          href: '#',
-        },
-        {
-          name: 'Nav2.3',
-          label: 'link navigation',
-          href: '#',
-        },
-        {
-          name: 'Nav2.4',
-          label: 'link navigation',
-          href: '#',
-        },
-      ],
-    },
-  },
-  {
-    name: 'Nav3',
-    label: 'Nav list item 3',
-    href: '#',
-  },
-];
-
-export const NavListVerticalAutoExample = () => {
-  const layout = 'vertical';
-  const border = false;
-
-  return (
-    <NavListAuto
-      layout={layout}
-      border={border}
-      links={links}
-      aria-label="Nav list"
-    >
-      {links.map((item, key) => (
-        <NavListItemAuto key={key} item={item} />
-      ))}
-    </NavListAuto>
-  );
-};
-
-export default NavListVerticalAutoExample;