@digigov/ui 0.12.2 → 0.13.0

package/src/app/QrCodeScanner/index.tsx

@@ -1,90 +0,0 @@
-import React from 'react';
-
-const QrReader = React.lazy(() => import('react-qr-reader'));
-
-export interface QrCodeScannerProps {
-  className?: string;
-  dataType?: 'url' | 'text';
-  children?: React.ReactNode;
-  legacyMode?: boolean;
-  validate?: (...args) => boolean;
-  onScan: (...args) => void;
-  onError: (err: any) => void;
-}
-
-/**
- * QRCodeScanner assumes that the data provided inside the QR code image,
- * are a HTTP link, thus it uses the `encodeURI` function to escape
- * all scanned data that will be forwarded to the `onScan` function
- *
- * When a QR code is scanned, before we run the `onScan` callback function,
- * we do the following:
- *
- * 1. Run a validator function provided in the props of QrCodeScanner component
- *    that receives the *raw* scanned data and returns a boolean type. (eg. check
- *    if it's a gov.gr subdomain, or that it matches the current domain)
- * 2. If the validator returns `true`, then construct a URL object from the data provided
- *    and check if the protocol is `https` and the `origin` is the same as the origin of this page
- * 2. Automatically fallback to the `onError` callback function, if the validation or url check fail
- * 3. Finally, run `onScan` callback function with the scanned data encoded as a URI.
- *
- */
-
-export const QrCodeScanner: React.FC<QrCodeScannerProps> = ({
-  className,
-  children,
-  validate,
-  onScan,
-  onError,
-  dataType = 'url',
-  legacyMode = false,
-}) => {
-  if (dataType === 'text') {
-    console.warn(
-      `Security Warning! The \`text\` dataType could be used to inject XSS code to your application database or user DOM.
-
-In order to be safe, you can:
-1. Use a sanitizer function inside the \`onScan\` callback function that makes sure the data is not posing a threat to your app
-2. Contact @digigov-ui for any further details and feature requests.
-3. Read more about xss https://owasp.org/www-community/attacks/xss/
-`
-    );
-  }
-  const handleOnScan = (data) => {
-    if (data) {
-      if (dataType === 'url') {
-        if (
-          !data.match(
-            /^https?:\/\/([a-z0-9-]*\.?)*(:?)(([a-z0-9-]*)\/)*([a-z0-9-]*)$/gi
-          )
-        ) {
-          return onError(
-            new Error(
-              '@digigov-ui XSS Validation failed: qr code payload should follow the pattern `https://example.com/data/:id`'
-            )
-          );
-        }
-      }
-      // run a validator function provided by the application code
-      if (validate && !validate(data)) {
-        return onError(new Error('Custom QR Code payload validation failed'));
-      }
-      // proceed with application defined callback function
-      onScan(data);
-    }
-  };
-  return (
-    <>
-      <QrReader
-        className={className}
-        delay={100}
-        onError={onError}
-        onScan={handleOnScan}
-        legacyMode={legacyMode}
-      />
-      {children}
-    </>
-  );
-};
-
-export default QrCodeScanner;

package/src/app/i18n.tsx

@@ -1,44 +0,0 @@
-import React from 'react';
-import el from '@digigov/ui/locales/el';
-export interface I18NContextProps {
-  t: (str: string) => string;
-  children?: React.ReactNode;
-  i18n?: any;
-}
-const defaultTranslate = (key) => {
-  try {
-    if (key.split('.').length > 0) {
-      return key.split('.').reduce((locale, path) => {
-        return locale[path] ? locale[path] : key;
-      }, el);
-    } else if (el[key]) {
-      return el[key];
-    } else {
-      return key;
-    }
-  } catch (err) {
-    console.error(`Translation key \`${key}\` not found`);
-    return key;
-  }
-};
-export const I18NContext = React.createContext<I18NContextProps>({
-  t: defaultTranslate,
-});
-
-export const I18NProvider: React.FC<I18NContextProps> = ({
-  t = defaultTranslate,
-  children,
-  ...props
-}: I18NContextProps) => {
-  return (
-    <I18NContext.Provider value={{ t, ...props }}>
-      {children}
-    </I18NContext.Provider>
-  );
-};
-
-export const useTranslation = (): I18NContextProps => {
-  return React.useContext(I18NContext);
-};
-
-export default I18NProvider;

package/src/core/Accordion/index.spec.tsx

@@ -1,30 +0,0 @@
-import * as React from 'react';
-import { mount } from 'enzyme';
-
-import {
-  Accordion,
-  AccordionItem,
-  AccordionItemDetails,
-  AccordionItemSummary,
-} from '@digigov/ui/core/Accordion';
-
-it('renders the Accordion', () => {
-  expect(
-    mount(
-      <Accordion>
-        <AccordionItem>
-          <AccordionItemSummary>Βασικες Ρυθμισεις</AccordionItemSummary>
-          <AccordionItemDetails>
-            Περιεχομενο Βασικων Ρυθμισεων
-          </AccordionItemDetails>
-        </AccordionItem>
-        <AccordionItem>
-          <AccordionItemSummary>Υπολοιπες Ρυθμισεις</AccordionItemSummary>
-          <AccordionItemDetails>
-            Περιεχομενο Υπολοιπων Ρυθμισεων
-          </AccordionItemDetails>
-        </AccordionItem>
-      </Accordion>
-    )
-  ).toMatchSnapshot();
-});

package/src/core/Accordion/index.tsx

@@ -1,86 +0,0 @@
-/* eslint-disable react-hooks/exhaustive-deps */
-import Accordion from '@digigov/react-core/Accordion';
-import AccordionSection from '@digigov/react-core/AccordionSection';
-import AccordionSectionContent from '@digigov/react-core/AccordionSectionContent';
-import AccordionSectionHeader from '@digigov/react-core/AccordionSectionHeader';
-import AccordionControls from '@digigov/react-core/AccordionControls';
-import withDeprecation from '@digigov/ui/utils/withDeprecation';
-import {
-  useTogglableSections,
-  UseTogglableSectionsReturn,
-} from '@digigov/ui/hooks/useTogglableSections';
-import React, { useCallback, useMemo } from 'react';
-
-export const AccordionItemDetails = withDeprecation(AccordionSectionContent, {
-  name: 'AccordionItemDetails',
-  rename: 'AccordionSectionContent',
-});
-
-export const AccordionItemSummary = withDeprecation(AccordionSectionHeader, {
-  name: 'AccordionItemSummary',
-  rename: 'AccordionSectionHeader',
-});
-
-export const AccordionItem = withDeprecation(
-  React.memo(AccordionSection, (prev, next) => prev.open === next.open),
-  {
-    name: 'AccordionItem',
-    rename: 'AccordionSection',
-  }
-);
-export interface UseAccordionProps {
-  singleOpen?: boolean;
-}
-export interface UseAccordionReturn extends UseTogglableSectionsReturn {
-  isOpenAll: boolean;
-  openAll: () => void;
-  closeAll: () => void;
-}
-const useAccordion = (props: UseAccordionProps): UseAccordionReturn => {
-  const {
-    register,
-    setOpened,
-    opened,
-    registered,
-    ...rest
-  } = useTogglableSections({
-    toggleProperty: 'open',
-    onToggleProperty: 'onClick',
-    singleOpen: props && !!props.singleOpen,
-  });
-  const keys = useMemo(() => Object.keys(registered.current), [
-    registered.current.length,
-  ]);
-  const openAll = useCallback(() => {
-    setOpened(
-      keys.reduce(
-        (newOpened, key) => ({
-          ...newOpened,
-          [key]: true,
-        }),
-        {}
-      )
-    );
-  }, [keys]);
-  const closeAll = useCallback(() => setOpened({}), []);
-
-  return {
-    register,
-    openAll,
-    closeAll,
-    isOpenAll: keys.length ? keys.every((v) => opened[v]) : false,
-    setOpened,
-    opened,
-    registered,
-    ...rest,
-  };
-};
-export {
-  Accordion,
-  AccordionControls,
-  AccordionSection,
-  AccordionSectionContent,
-  AccordionSectionHeader,
-  useAccordion,
-};
-export default Accordion;

package/src/core/Blockquote/index.spec.tsx

@@ -1,10 +0,0 @@
-import * as React from 'react';
-import { mount } from 'enzyme';
-
-import Component from '@digigov/ui/core/Blockquote';
-
-it('renders the Blockquote with sample data', () => {
-  expect(
-    mount(<Component>this is some random data</Component>)
-  ).toMatchSnapshot();
-});

package/src/core/Button/ButtonLink.tsx

@@ -1,20 +0,0 @@
-import CoreButtonLink, {
-  ButtonLinkProps as CoreButtonLinkProps,
-} from '@digigov/react-core/ButtonLink';
-import withDeprecation from '@digigov/ui/utils/withDeprecation';
-
-export type ButtonLinkProps = CoreButtonLinkProps;
-export const ButtonLink = withDeprecation(CoreButtonLink, {
-  name: 'ButtonLink',
-  props: {
-    variant: {
-      error: true,
-    },
-    size: {
-      error: true,
-    },
-    xsFullWidth: {
-      error: true,
-    },
-  },
-});

package/src/core/Button/CallToAction.tsx

@@ -1,31 +0,0 @@
-import React from 'react';
-import CoreCallToAction, {
-  CallToActionProps as CoreCallToActionProps,
-} from '@digigov/react-core/CallToAction';
-import withDeprecation from '@digigov/ui/utils/withDeprecation';
-
-export interface CallToActionProps extends CoreCallToActionProps {
-  label?: string;
-}
-
-export const CallToAction: React.FC<CallToActionProps> = withDeprecation(
-  ({ label = 'Start here', children, ...props }) => {
-    return <CoreCallToAction {...props}>{children || label}</CoreCallToAction>;
-  },
-  {
-    name: 'CallToAction',
-    props: {
-      variant: {
-        error: true,
-      },
-      size: {
-        error: true,
-      },
-      xsFullWidth: {
-        error: true,
-      },
-    },
-  }
-);
-
-export default CallToAction;

package/src/core/Button/Icon.tsx

@@ -1,9 +0,0 @@
-import withDeprecation from '@digigov/ui/utils/withDeprecation';
-
-// eslint-disable-next-line @typescript-eslint/no-empty-function
-export const ButtonIcon = withDeprecation(() => {}, {
-  name: 'ButtonIcon',
-  error: true,
-});
-
-export default ButtonIcon;

package/src/core/Button/index.spec.tsx

@@ -1,8 +0,0 @@
-import * as React from 'react';
-import { mount } from 'enzyme';
-
-import Component from '@digigov/ui/core/Button';
-
-it('renders the button', () => {
-  expect(mount(<Component>hello</Component>)).toMatchSnapshot();
-});

package/src/core/Button/index.tsx

@@ -1,46 +0,0 @@
-import React from 'react';
-import CoreButton, {
-  ButtonProps as CoreButtonProps,
-} from '@digigov/react-core/Button';
-import withDeprecation from '@digigov/ui/utils/withDeprecation';
-
-export type ButtonProps = CoreButtonProps;
-
-export const Button = withDeprecation(CoreButton, {
-  name: 'Button',
-  props: {
-    href: {
-      error: 'To use a button with a link import ButtonLink instead',
-    },
-    /* variant: {
-      error: true,
-    }, */
-    size: {
-      error: true,
-    },
-    xsFullWidth: {
-      error: true,
-    },
-  },
-});
-
-export default Button;
-
-export interface ContinueButtonProps extends ButtonProps {
-  label?: string;
-  ref?: React.Ref<HTMLButtonElement>;
-}
-
-export const ContinueButton: React.FC<ContinueButtonProps> = ({
-  label = 'Continue',
-  children,
-  ...props
-}) => {
-  return <Button {...props}>{label || children}</Button>;
-};
-
-export * from '@digigov/ui/core/Button/BackButton';
-export * from '@digigov/ui/core/Button/CallToAction';
-export * from '@digigov/ui/core/Button/ButtonLink';
-export * from '@digigov/ui/core/Button/Icon';
-export * from '@digigov/react-core/ButtonGroup';

package/src/core/Details/index.spec.tsx

@@ -1,38 +0,0 @@
-import * as React from 'react';
-import { mount } from 'enzyme';
-
-import {
-  Details,
-  DetailsContent,
-  DetailsSummary,
-} from '@digigov/ui/core/Details';
-
-it('renders the closed Details component', () => {
-  expect(
-    mount(
-      <Details>
-        <DetailsSummary>Help with nationality</DetailsSummary>
-        <DetailsContent>
-          We need to know your nationality so we can work out which elections
-          you’re entitled to vote in. If you cannot provide your nationality,
-          you’ll have to send copies of identity documents through the post.
-        </DetailsContent>
-      </Details>
-    )
-  ).toMatchSnapshot();
-});
-
-it('renders the open Details component', () => {
-  expect(
-    mount(
-      <Details open>
-        <DetailsSummary>Help with nationality</DetailsSummary>
-        <DetailsContent>
-          We need to know your nationality so we can work out which elections
-          you’re entitled to vote in. If you cannot provide your nationality,
-          you’ll have to send copies of identity documents through the post.
-        </DetailsContent>
-      </Details>
-    )
-  ).toMatchSnapshot();
-});

package/src/core/Divider/index.tsx

@@ -1,13 +0,0 @@
-import CoreSectionBreak, {
-  SectionBreakProps as CoreSectionBreakProps,
-} from '@digigov/react-core/SectionBreak';
-import withDeprecation from '@digigov/ui/utils/withDeprecation';
-
-export type SectionBreakProps = CoreSectionBreakProps;
-
-export const SectionBreak = withDeprecation(CoreSectionBreak, {
-  name: 'Divider',
-  rename: 'SectionBreak',
-});
-
-export default SectionBreak;

package/src/core/ErrorSummary/index.spec.tsx

@@ -1,10 +0,0 @@
-import * as React from 'react';
-import mountWithTheme from '@digigov/ui/test-utils/mountWithTheme';
-
-import Component from '.';
-
-it('renders the ErrorSummary with sample data', () => {
-  expect(
-    mountWithTheme(<Component>this is some random warning text</Component>)
-  ).toMatchSnapshot();
-});

package/src/core/Link/index.spec.tsx

@@ -1,22 +0,0 @@
-import * as React from 'react';
-import { mount } from 'enzyme';
-
-import Component, { LinkProvider } from '@digigov/ui/core/Link';
-
-const CustomLink: React.FC<{}> = (props) => {
-  return <div>{props.children}</div>;
-};
-
-it('renders the Link', () => {
-  expect(mount(<Component>hello</Component>)).toMatchSnapshot();
-});
-
-it('Provider', () => {
-  expect(
-    mount(
-      <LinkProvider component={CustomLink}>
-        <Component>hello</Component>
-      </LinkProvider>
-    )
-  ).toMatchSnapshot();
-});

package/src/core/Link/index.tsx

@@ -1,41 +0,0 @@
-import * as React from 'react';
-import { LinkProps as CoreLinkProps } from '@digigov/react-core/Link';
-
-export interface LinkComponentContextProps {
-  component: React.ElementType<LinkProps>;
-}
-
-export const CommonLink: React.FC<LinkProps> = (props) => (
-  <a {...props}>{props.children}</a>
-);
-
-const LinkComponentContext = React.createContext<React.ElementType<LinkProps>>(
-  CommonLink
-);
-export const LinkProvider: React.FC<LinkComponentContextProps> = (props) => {
-  return (
-    <LinkComponentContext.Provider value={props.component}>
-      {props.children}
-    </LinkComponentContext.Provider>
-  );
-};
-
-export interface LinkProps extends CoreLinkProps {
-  ref?: React.Ref<HTMLAnchorElement>;
-}
-
-const Link: React.ExoticComponent<LinkProps> = React.forwardRef(
-  function WrappedLink(
-    { children, href = '', ...props },
-    ref: React.Ref<HTMLAnchorElement>
-  ) {
-    const LinkComponent = React.useContext(LinkComponentContext);
-    return (
-      <LinkComponent ref={ref} href={href} {...props}>
-        {children}
-      </LinkComponent>
-    );
-  }
-);
-
-export default Link;

package/src/core/List/ListItemContent.tsx

@@ -1,32 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-import { makeStyles } from '@material-ui/core/styles';
-
-export const useListItemContenttyles = makeStyles(
-  (theme) => ({
-    root: {
-      flexGrow: 1,
-      padding: theme.spacing(0, 2),
-    },
-  }),
-  { name: 'MuiListItemContent' }
-);
-
-export interface ListItemContentProps {
-  className?: string;
-}
-
-export const ListItemContent: React.FC<ListItemContentProps> = ({
-  className,
-  children,
-  ...props
-}) => {
-  const classes = useListItemContenttyles();
-  return (
-    <div className={clsx(className, classes.root)} {...props}>
-      {children}
-    </div>
-  );
-};
-
-export default ListItemContent;

package/src/core/List/ListItemIcon.tsx

@@ -1,31 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-import { makeStyles } from '@material-ui/core/styles';
-import Avatar, { AvatarProps } from '@material-ui/core/Avatar';
-
-export const useListItemIconStyles = makeStyles(
-  () => ({
-    root: {},
-  }),
-  { name: 'MuiListItemIcon' }
-);
-
-export interface ListItemIconProps extends AvatarProps {}
-
-export const ListItemIcon: React.FC<ListItemIconProps> = ({
-  className,
-  children,
-  style,
-  ...props
-}) => {
-  const classes = useListItemIconStyles();
-  return (
-    <div style={style} className={clsx(className, classes.root)}>
-      <Avatar variant="rounded" {...props}>
-        {children}
-      </Avatar>
-    </div>
-  );
-};
-
-export default ListItemIcon;

package/src/core/List/ListItemText.tsx

@@ -1,23 +0,0 @@
-import React from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import NormalText, { NormalTextProps } from '@digigov/ui/typography/NormalText';
-
-export const useListItemTextStyles = makeStyles(
-  () => ({
-    root: {},
-  }),
-  { name: 'MuiListItemText' }
-);
-
-export interface ListItemTextProps extends NormalTextProps {
-  ref?: React.Ref<HTMLSpanElement>;
-}
-
-export const ListItemText: React.FC<ListItemTextProps> = ({
-  children,
-  ...props
-}) => {
-  return <NormalText {...props}>{children}</NormalText>;
-};
-
-export default ListItemText;

package/src/core/List/ListItemTitle.tsx

@@ -1,37 +0,0 @@
-import React from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import Title, { TitleProps } from '@digigov/ui/typography/Title';
-import Link, { LinkProps } from '@digigov/ui/core/Link';
-
-export const useListItemTitleStyles = makeStyles(
-  () => ({
-    root: {},
-  }),
-  { name: 'MuiListItemTitle' }
-);
-
-export interface ListItemTitleProps extends TitleProps {
-  href?: string;
-  linkProps?: Omit<LinkProps, 'href'>;
-}
-
-export const ListItemTitle: React.FC<ListItemTitleProps> = ({
-  href,
-  linkProps,
-  children,
-  ...props
-}) => {
-  return (
-    <Title {...props}>
-      {href ? (
-        <Link href={href} {...linkProps}>
-          {children}
-        </Link>
-      ) : (
-        children
-      )}
-    </Title>
-  );
-};
-
-export default ListItemTitle;

package/src/core/List/index.spec.tsx

@@ -1,10 +0,0 @@
-import * as React from 'react';
-import mountWithTheme from '@digigov/ui/test-utils/mountWithTheme';
-
-import Component from '@digigov/ui/core/List';
-
-it('renders the ErrorSummary with sample data', () => {
-  expect(
-    mountWithTheme(<Component>this is some random warning text</Component>)
-  ).toMatchSnapshot();
-});