@digigov/ui 2.0.0-113e6661 → 2.0.0-2177f152

package/src/lazy.js

@@ -1,25 +1,5 @@
 import { lazy } from 'react';
 export default {
-  APIError: lazy(() =>
-    import('@digigov/ui/api/APIErrors').then((module) => ({
-      default: module['APIError'],
-    }))
-  ),
-  APIErrors: lazy(() =>
-    import('@digigov/ui/api/APIErrors').then((module) => ({
-      default: module['APIErrors'],
-    }))
-  ),
-  APIContext: lazy(() =>
-    import('@digigov/ui/api/APIProvider').then((module) => ({
-      default: module['APIContext'],
-    }))
-  ),
-  APIProvider: lazy(() =>
-    import('@digigov/ui/api/APIProvider').then((module) => ({
-      default: module['APIProvider'],
-    }))
-  ),
   StaticApp: lazy(() =>
     import('@digigov/ui/app/App').then((module) => ({
       default: module['StaticApp'],
@@ -215,28 +195,28 @@ export default {
       default: module['LoaderContainer'],
     }))
   ),
-  CircularProgress: lazy(() =>
-    import('@digigov/ui/app/Loader').then((module) => ({
-      default: module['CircularProgress'],
-    }))
-  ),
   FullPageBackground: lazy(() =>
     import('@digigov/ui/app/Loader').then((module) => ({
       default: module['FullPageBackground'],
     }))
   ),
+  CircularProgress: lazy(() =>
+    import('@digigov/ui/app/Loader/index.web').then((module) => ({
+      default: module['CircularProgress'],
+    }))
+  ),
   Masthead: lazy(() =>
-    import('@digigov/ui/layouts/Basic/Masthead').then((module) => ({
+    import('@digigov/ui/app/Masthead').then((module) => ({
       default: module['Masthead'],
     }))
   ),
   MastheadBody: lazy(() =>
-    import('@digigov/ui/layouts/Basic/Masthead').then((module) => ({
+    import('@digigov/ui/app/Masthead').then((module) => ({
       default: module['MastheadBody'],
     }))
   ),
   MastheadLogo: lazy(() =>
-    import('@digigov/ui/layouts/Basic/Masthead').then((module) => ({
+    import('@digigov/ui/app/Masthead').then((module) => ({
       default: module['MastheadLogo'],
     }))
   ),
@@ -261,12 +241,12 @@ export default {
     }))
   ),
   Modal: lazy(() =>
-    import('@digigov/ui/app/Modal/Modal').then((module) => ({
+    import('@digigov/ui/app/Modal/index.web').then((module) => ({
       default: module['Modal'],
     }))
   ),
   ModalBase: lazy(() =>
-    import('@digigov/ui/app/Modal/Modal').then((module) => ({
+    import('@digigov/ui/app/Modal/index.web').then((module) => ({
       default: module['ModalBase'],
     }))
   ),
@@ -555,19 +535,14 @@ export default {
       default: module['TableSortLabel'],
     }))
   ),
-  Table: lazy(() =>
-    import('@digigov/ui/content/Table').then((module) => ({
-      default: module['Table'],
-    }))
-  ),
-  TableSortIconContainer: lazy(() =>
+  TableContainer: lazy(() =>
     import('@digigov/ui/content/Table').then((module) => ({
-      default: module['TableSortIconContainer'],
+      default: module['TableContainer'],
     }))
   ),
-  TableContainer: lazy(() =>
+  Table: lazy(() =>
     import('@digigov/ui/content/Table').then((module) => ({
-      default: module['TableContainer'],
+      default: module['Table'],
     }))
   ),
   TableBody: lazy(() =>
@@ -610,6 +585,11 @@ export default {
       default: module['TableLoaderBackground'],
     }))
   ),
+  TableSortIconContainer: lazy(() =>
+    import('@digigov/ui/content/Table').then((module) => ({
+      default: module['TableSortIconContainer'],
+    }))
+  ),
   TableFloatingScroll: lazy(() =>
     import('@digigov/ui/content/Table/TableFloatingScroll').then((module) => ({
       default: module['TableFloatingScroll'],
@@ -790,9 +770,9 @@ export default {
       default: module['AutoCompleteContainer'],
     }))
   ),
-  AutoCompleteInput: lazy(() =>
+  AutoCompleteInputBase: lazy(() =>
     import('@digigov/ui/form/AutoComplete').then((module) => ({
-      default: module['AutoCompleteInput'],
+      default: module['AutoCompleteInputBase'],
     }))
   ),
   AutoCompleteInputTypeahead: lazy(() =>
@@ -1051,115 +1031,120 @@ export default {
     }))
   ),
   AccessibilityIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['AccessibilityIcon'],
     }))
   ),
   ArrowIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['ArrowIcon'],
     }))
   ),
   BurgerIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['BurgerIcon'],
     }))
   ),
   CaretIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['CaretIcon'],
     }))
   ),
   CheckIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['CheckIcon'],
     }))
   ),
   ChevronIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['ChevronIcon'],
     }))
   ),
   UncheckIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['UncheckIcon'],
     }))
   ),
   CloseIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['CloseIcon'],
     }))
   ),
   GlobeIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['GlobeIcon'],
     }))
   ),
   MoreVertIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['MoreVertIcon'],
     }))
   ),
   CancelIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['CancelIcon'],
     }))
   ),
   LockIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['LockIcon'],
     }))
   ),
   DownloadIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['DownloadIcon'],
     }))
   ),
   PdfFileIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['PdfFileIcon'],
     }))
   ),
   PlusIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['PlusIcon'],
     }))
   ),
   MinusIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['MinusIcon'],
     }))
   ),
   LoginIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['LoginIcon'],
     }))
   ),
   RestoreIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['RestoreIcon'],
     }))
   ),
   ReplyIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['ReplyIcon'],
     }))
   ),
   ChatIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['ChatIcon'],
     }))
   ),
   ExclamationIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['ExclamationIcon'],
     }))
   ),
   PrintIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
+    import('@digigov/ui/icons/Icon').then((module) => ({
       default: module['PrintIcon'],
     }))
   ),
+  IconBase: lazy(() =>
+    import('@digigov/ui/icons/IconBase').then((module) => ({
+      default: module['IconBase'],
+    }))
+  ),
   ImageLogo: lazy(() =>
     import('@digigov/ui/icons/ImageLogo').then((module) => ({
       default: module['ImageLogo'],
@@ -1170,6 +1155,11 @@ export default {
       default: module['ImageLogoSet'],
     }))
   ),
+  SvgIcon: lazy(() =>
+    import('@digigov/ui/icons/SvgIcon').then((module) => ({
+      default: module['SvgIcon'],
+    }))
+  ),
   AdminLayout: lazy(() =>
     import('@digigov/ui/layouts/Admin').then((module) => ({
       default: module['AdminLayout'],
@@ -1275,11 +1265,21 @@ export default {
       default: module['BreadcrumbsList'],
     }))
   ),
-  BreadcrumbsListItem: lazy(() =>
+  BreadcrumbsListItemBase: lazy(() =>
+    import('@digigov/ui/navigation/Breadcrumbs').then((module) => ({
+      default: module['BreadcrumbsListItemBase'],
+    }))
+  ),
+  BreadcrumbsListItemLink: lazy(() =>
     import('@digigov/ui/navigation/Breadcrumbs').then((module) => ({
-      default: module['BreadcrumbsListItem'],
+      default: module['BreadcrumbsListItemLink'],
     }))
   ),
+  BreadcrumbsListItem: lazy(() =>
+    import('@digigov/ui/navigation/Breadcrumbs/BreadcrumbsListItem').then(
+      (module) => ({ default: module['BreadcrumbsListItem'] })
+    )
+  ),
   Drawer: lazy(() =>
     import('@digigov/ui/navigation/Drawer').then((module) => ({
       default: module['Drawer'],
@@ -1330,11 +1330,6 @@ export default {
       default: module['LinkProvider'],
     }))
   ),
-  NavList: lazy(() =>
-    import('@digigov/ui/navigation/NavList/NavList').then((module) => ({
-      default: module['NavList'],
-    }))
-  ),
   NavListAuto: lazy(() =>
     import('@digigov/ui/navigation/NavList/NavListAuto').then((module) => ({
       default: module['NavListAuto'],
@@ -1355,6 +1350,11 @@ export default {
       default: module['Nav'],
     }))
   ),
+  NavList: lazy(() =>
+    import('@digigov/ui/navigation/NavList/NavList').then((module) => ({
+      default: module['NavList'],
+    }))
+  ),
   NavMenuContainer: lazy(() =>
     import('@digigov/ui/navigation/NavList').then((module) => ({
       default: module['NavMenuContainer'],
@@ -1425,6 +1425,11 @@ export default {
       default: module['Pagination'],
     }))
   ),
+  PaginationList: lazy(() =>
+    import('@digigov/ui/navigation/Pagination').then((module) => ({
+      default: module['PaginationList'],
+    }))
+  ),
   PaginationListItem: lazy(() =>
     import('@digigov/ui/navigation/Pagination').then((module) => ({
       default: module['PaginationListItem'],
@@ -1495,11 +1500,6 @@ export default {
       default: module['Base'],
     }))
   ),
-  SvgIcon: lazy(() =>
-    import('@digigov/ui/utils/SvgIcon').then((module) => ({
-      default: module['SvgIcon'],
-    }))
-  ),
   VisuallyHidden: lazy(() =>
     import('@digigov/ui/utils/VisuallyHidden').then((module) => ({
       default: module['VisuallyHidden'],
@@ -1520,11 +1520,6 @@ export default {
       default: module['BackToTop'],
     }))
   ),
-  BackToTopContainer: lazy(() =>
-    import('@digigov/ui/navigation/BackToTopLink').then((module) => ({
-      default: module['BackToTopContainer'],
-    }))
-  ),
   BackToTopLink: lazy(() =>
     import('@digigov/ui/navigation/BackToTopLink').then((module) => ({
       default: module['BackToTopLink'],
@@ -1540,6 +1535,21 @@ export default {
       default: module['BackToTopContainer'],
     }))
   ),
+  BreadcrumbsAuto: lazy(() =>
+    import('@digigov/ui/navigation/Breadcrumbs/auto').then((module) => ({
+      default: module['BreadcrumbsAuto'],
+    }))
+  ),
+  BreadcrumbsContext: lazy(() =>
+    import('@digigov/ui/navigation/Breadcrumbs/auto').then((module) => ({
+      default: module['BreadcrumbsContext'],
+    }))
+  ),
+  BreadcrumbsListAuto: lazy(() =>
+    import('@digigov/ui/navigation/Breadcrumbs/auto').then((module) => ({
+      default: module['BreadcrumbsListAuto'],
+    }))
+  ),
   DrawerAuto: lazy(() =>
     import('@digigov/ui/navigation/Drawer/auto').then((module) => ({
       default: module['DrawerAuto'],

package/src/navigation/BackLink/{index.mdx → doc.mdx}

@@ -9,11 +9,7 @@ Use the back link component to help users go back to the previous page in a mult
 
 ## How to use
 
-<Story
-  packageName="@digigov/ui"
-  component="navigation/BackLink"
-  story="Default.tsx"
-/>
+<code src="@digigov/ui/navigation/BackLink/__stories__/Default.tsx" />
 
 ## API
 

package/src/navigation/BackLink/index.test.tsx

@@ -1,20 +1,21 @@
 import React from 'react';
 import { test, expect } from '@playwright/experimental-ct-react';
-import TestVariant from '@digigov/ui/utils/TestVariant'
 import { Default } from '@digigov/ui/navigation/BackLink/__stories__/Default';
+import TestVariant from '@digigov/ui/utils/TestVariant';
 
 test('renders the All BackLink variants', async ({ mount, page }) => {
   await mount(
-    
-  <div>
-    <TestVariant title="Default">
-      <Default />
-    </TestVariant>
-  </div>
-  )
+    <div>
+      <TestVariant title="Default">
+        <Default />
+      </TestVariant>
+    </div>
+  );
   await page.evaluate(() => document.fonts.ready);
 
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  

package/src/navigation/BackLink/interaction.test.tsx

@@ -4,12 +4,12 @@ import { test, expect } from '@playwright/experimental-ct-react';
 import { Default } from '@digigov/ui/navigation/BackLink/__stories__/Default';
 
 test('renders the Default Click link', async ({ mount, page }) => {
-  await mount(
-    <Default />
-  )
+  await mount(<Default />);
   await page.evaluate(() => document.fonts.ready);
- await page.locator("#root>a").click();
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  await page.locator('#root>a').click();
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  

package/src/navigation/BackToTopLink/index.test.tsx

@@ -1,24 +1,25 @@
 import React from 'react';
 import { test, expect } from '@playwright/experimental-ct-react';
-import TestVariant from '@digigov/ui/utils/TestVariant'
 import { Default } from '@digigov/ui/navigation/BackToTopLink/__stories__/Default';
 import { InMain } from '@digigov/ui/navigation/BackToTopLink/__stories__/InMain';
+import TestVariant from '@digigov/ui/utils/TestVariant';
 
 test('renders the All BackToTopLink variants', async ({ mount, page }) => {
   await mount(
-    
-  <div>
-    <TestVariant title="Default">
-      <Default />
-    </TestVariant>
-    <TestVariant title="InMain">
-      <InMain />
-    </TestVariant>
-  </div>
-  )
+    <div>
+      <TestVariant title="Default">
+        <Default />
+      </TestVariant>
+      <TestVariant title="InMain">
+        <InMain />
+      </TestVariant>
+    </div>
+  );
   await page.evaluate(() => document.fonts.ready);
 
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  

package/src/navigation/BackToTopLink/index.tsx

@@ -34,9 +34,8 @@ export const BackToTop: React.FC<BackToTopProps> = React.forwardRef(
     ...props
   }) {
     const [persistent, setPersistent] = useState<boolean>(false);
-    const callSetPersistent = (value) => {
+    const callSetPersistent = (value) =>
       window.scrollY > 0 && setPersistent(value);
-    };
     useObserver(topLimitId, callSetPersistent);
     useObserver('back-to-top-element', callSetPersistent);
 

package/src/navigation/Breadcrumbs/Breadcrumbs.stories.js

@@ -10,5 +10,5 @@ export default {
 export { Default } from '@digigov/ui/navigation/Breadcrumbs/__stories__/Default';
 export { WithoutCurrentPage } from '@digigov/ui/navigation/Breadcrumbs/__stories__/WithoutCurrentPage';
 export { WithHook } from '@digigov/ui/navigation/Breadcrumbs/__stories__/WithHook';
+export { WithProvider } from '@digigov/ui/navigation/Breadcrumbs/__stories__/WithProvider';
 export { Auto } from '@digigov/ui/navigation/Breadcrumbs/__stories__/Auto';
-

package/src/navigation/Breadcrumbs/BreadcrumbsListItem.tsx

@@ -0,0 +1,34 @@
+import React from 'react';
+import clsx from 'clsx';
+import BreadcrumbsListItemBase, {
+  BreadcrumbsListItemBaseProps,
+} from '@digigov/react-core/BreadcrumbsListItem';
+import Link from '@digigov/ui/navigation/Link';
+
+export interface BreadcrumbsListItemProps extends BreadcrumbsListItemBaseProps {
+  href?: string;
+}
+
+const BreadcrumbsListItem: React.FC<BreadcrumbsListItemProps> = ({
+  href,
+  children,
+  ...props
+}) => {
+  return (
+    <BreadcrumbsListItemBase {...props}>
+      <Link
+        href={href}
+        defaultStyle={false}
+        className={clsx({
+          'ds-breadcrumbs__link': true,
+          'ds-breadcrumbs__link--inactive': href === undefined,
+        })}
+      >
+        {children}
+      </Link>
+    </BreadcrumbsListItemBase>
+  );
+};
+
+export { BreadcrumbsListItem };
+export default BreadcrumbsListItem;

package/src/navigation/Breadcrumbs/__stories__/Auto.tsx

@@ -1,16 +1,15 @@
 import React from 'react';
 import { List, ListItem } from '@digigov/ui/content/List';
+import { Button } from '@digigov/ui/form/Button/';
 import {
   BreadcrumbsAuto,
   BreadcrumbsListAuto,
   useBreadcrumbsContext,
 } from '@digigov/ui/navigation/Breadcrumbs/auto';
+import { BreadcrumbItem } from '@digigov/ui/navigation/Breadcrumbs/hooks';
 import { Heading } from '@digigov/ui/typography';
-import { slug } from '@digigov/ui/navigation/Breadcrumbs/slug';
-import { Button } from '@digigov/ui/form/Button/';
-import { ConfigData, } from '@digigov/ui/navigation/Breadcrumbs/hooks';
 
-const items: ConfigData[] = [
+const items: BreadcrumbItem[] = [
   {
     title: 'Νομοθεσία Πυροπροστασίας',
     children: [
@@ -147,16 +146,26 @@ const items: ConfigData[] = [
 
 const getListChild = (item, setActive) => {
   return item.children ? (
-    <List listStyle="number">
-      <ListItem>
-        <Heading size="md">{item.title}</Heading>
+    <>
+      <Heading size="sm" mb={0}>
+        {item.title}
+      </Heading>
+      <List listStyle="number">
         {item.children?.map((subMenu, key) => (
           <ListItem key={key}>{getListChild(subMenu, setActive)}</ListItem>
         ))}
-      </ListItem>
-    </List>
+      </List>
+    </>
   ) : (
-    <Button variant='link' role="menuitem" id={item.title} onClick={(e) => { e.preventDefault(), setActive(item) }}>
+    <Button
+      variant="link"
+      role="menuitem"
+      id={item.title}
+      onClick={(e) => {
+        e.preventDefault();
+        setActive(item);
+      }}
+    >
       {item.title}
     </Button>
   );
@@ -164,22 +173,29 @@ const getListChild = (item, setActive) => {
 
 export const Auto = () => {
   return (
-    <BreadcrumbsAuto items={items} hrefGenerator={(item) => { return item.href ? item.href : slug(item.title, 100) }}>
-      <BreadcrumbsListAuto />
+    <BreadcrumbsAuto
+      items={items}
+      initialUrlRoute="/nomothesia-pyroprostasias/odigies-epi-protypon-pyroprostasias"
+    >
+      <BreadcrumbsListAuto mb={8} />
       <ContentRoutes />
     </BreadcrumbsAuto>
   );
 };
 
 const ContentRoutes = () => {
-  const { active, setActive } = useBreadcrumbsContext();
+  const { breadcrumbs, setActiveItem } = useBreadcrumbsContext();
 
-  return <>
-    <Heading size="xl">
-      {active?.title}
-    </Heading>
-    {items.map((item) => getListChild(item, setActive))}
-  </>;
+  return (
+    <>
+      {breadcrumbs.length > 0 && (
+        <Heading size="xl">
+          {breadcrumbs[breadcrumbs.length - 1]?.title}
+        </Heading>
+      )}
+      {items.map((item) => getListChild(item, setActiveItem))}
+    </>
+  );
 };
 
-export default Auto;
+export default Auto;