@digigov/ui 2.0.0-298cfc51 → 2.0.0-2a26e869

package/src/content/Markdown/__stories__/Default.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
-import Grid from '@digigov/ui/layouts/Grid';
 import Markdown from '@digigov/ui/content/Markdown';
 import { SectionBreak } from '@digigov/ui/layouts';
+import Grid from '@digigov/ui/layouts/Grid';
 
 const markdownExamples = [
   '## Παράδειγμα h2',
@@ -35,7 +35,8 @@ export const Default = () => {
           </Grid>
         </Grid>
       ))}
-    </>);
+    </>
+  );
 };
 
 export default Default;

package/src/content/Markdown/index.tsx

@@ -2,11 +2,17 @@ import React from 'react';
 import { useMarkdownToHTML } from '@digigov/ui/content/Markdown/useMarkdownToHTML';
 import SafeHTML from '@digigov/ui/content/SafeHTML';
 
-export const Markdown = ({ children, content }: { children?: React.ReactNode; content?: string }) => {
-  content = content || children as string;
+export const Markdown = ({
+  children,
+  content,
+}: {
+  children?: React.ReactNode;
+  content?: string;
+}) => {
+  content = content || (children as string);
 
   const html = useMarkdownToHTML(content);
   return <SafeHTML content={html} />;
 };
 
-export default Markdown;
+export default Markdown;

package/src/content/SafeHTML/SafeHTML.stories.js

@@ -1,8 +1,7 @@
 import SafeHTML from '@digigov/ui/content/SafeHTML';
 export default {
   title: 'Digigov UI/content/SafeHTML',
-  description:
-    'Display html content',
+  description: 'Display html content',
   component: SafeHTML,
   displayName: 'SafeHTML',
 };

package/src/content/SafeHTML/__stories__/Default.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
-import Grid from '@digigov/ui/layouts/Grid';
 import SafeHTML from '@digigov/ui/content/SafeHTML';
 import { SectionBreak } from '@digigov/ui/layouts';
+import Grid from '@digigov/ui/layouts/Grid';
 
 const htmlExamples = [
   '<h1>Παράδειγμα h1</h1>',
@@ -35,7 +35,8 @@ export const Default = () => {
           </Grid>
         </Grid>
       ))}
-    </>);
+    </>
+  );
 };
 
-export default Default;
+export default Default;

package/src/content/SafeHTML/index.tsx

@@ -26,7 +26,7 @@ const elementClassNameMapping = {
 };
 
 if (typeof window !== 'undefined') {
-  DomPurify.addHook('afterSanitizeAttributes', function(node) {
+  DomPurify.addHook('afterSanitizeAttributes', function (node) {
     if (node.tagName.toLowerCase() in elementClassNameMapping) {
       node.setAttribute(
         'class',
@@ -43,7 +43,7 @@ if (typeof window !== 'undefined') {
 
 export const getClosingTags = (htmlString) => {
   const tags = htmlString.match(/<[^>]+\/?>/g);
-  const stack: Array<string> = [];
+  const stack: string[] = [];
   if (!tags) {
     return stack;
   }
@@ -64,7 +64,7 @@ export const getClosingTags = (htmlString) => {
 
 export interface SafeHTMLProps {
   content: string;
-  tags?: Array<string>;
+  tags?: string[];
   Tag?: string;
   style?: React.CSSProperties;
 }

package/src/content/StepNav/__stories__/Auto.tsx

@@ -9,7 +9,6 @@ import {
   StepNavAccordionSummaryHeading,
   StepNavAccordionHeadingTitle,
   StepNavAccordionHeadingText,
-
 } from '@digigov/ui/content/StepNav';
 import {
   StepNavAuto,

package/src/content/StepNav/auto.tsx

@@ -5,9 +5,11 @@ import {
   StepNavAccordion,
   StepNavAccordionProps,
 } from '@digigov/react-core/StepNavAccordion';
-import { UseAccordionReturn as useStepNavReturn } from '@digigov/ui/content/Accordion/hooks';
-import { AccordionItemId as StepNavItemId } from '@digigov/ui/content/Accordion/hooks';
-import { useAccordion as useStepNav } from '@digigov/ui/content/Accordion/hooks';
+import {
+  UseAccordionReturn as useStepNavReturn,
+  AccordionItemId as StepNavItemId,
+  useAccordion as useStepNav,
+} from '@digigov/ui/content/Accordion/hooks';
 
 export interface ButtonAutoProps extends ButtonProps {}
 export interface StepNavAccordionAutoProps extends StepNavAccordionProps {

package/src/content/StepNav/interaction.test.tsx

@@ -4,15 +4,23 @@ import { test, expect } from '@playwright/experimental-ct-react';
 import { Default } from '@digigov/ui/content/StepNav/__stories__/Default';
 
 test('renders the Default Click 1st and all', async ({ mount, page }) => {
-  await mount(
-    <Default />
-  )
+  await mount(<Default />);
   await page.evaluate(() => document.fonts.ready);
- await page.locator("#root>div>ol>li:nth-child(1)>details>summary>h2>div>span:nth-child(1)").hover();
- await page.locator("#root>div>ol>li:nth-child(1)>details>summary>h2>div>span:nth-child(1)").click();
- await page.locator("#root>div>div>button").click();
+  await page
+    .locator(
+      '#root>div>ol>li:nth-child(1)>details>summary>h2>div>span:nth-child(1)'
+    )
+    .hover();
+  await page
+    .locator(
+      '#root>div>ol>li:nth-child(1)>details>summary>h2>div>span:nth-child(1)'
+    )
+    .click();
+  await page.locator('#root>div>div>button').click();
 
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  

package/src/content/SummaryList/interaction.test.tsx

@@ -3,15 +3,18 @@ import { test, expect } from '@playwright/experimental-ct-react';
 
 import { WithActions } from '@digigov/ui/content/SummaryList/__stories__/WithActions';
 
-test('renders the WithActions Navigate with keyboard', async ({ mount, page }) => {
-  await mount(
-    <WithActions />
-  )
+test('renders the WithActions Navigate with keyboard', async ({
+  mount,
+  page,
+}) => {
+  await mount(<WithActions />);
   await page.evaluate(() => document.fonts.ready);
- await page.keyboard.press("Tab");
- await page.keyboard.press("Tab");
+  await page.keyboard.press('Tab');
+  await page.keyboard.press('Tab');
 
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  

package/src/content/Table/TableFloatingScroll.tsx

@@ -42,7 +42,6 @@ export function TableFloatingScroll(props) {
       if (ref.current?.offsetWidth) {
         // @ts-ignore
         setContainerWidth(ref.current.offsetWidth);
-
       }
       if (contentRef.current?.offsetWidth) {
         // @ts-ignore

package/src/content/Table/__stories__/WithLoader.tsx

@@ -1,9 +1,8 @@
 // @delay-test-snapshot
 import React, { useState } from 'react';
-import { CircularProgress } from '@digigov/ui/app/Loader';
-import { LoaderContainer } from '@digigov/ui/app/Loader';
-import { TableLoaderBackground } from '@digigov/ui/content/Table';
+import { CircularProgress, LoaderContainer } from '@digigov/ui/app/Loader';
 import {
+  TableLoaderBackground,
   TableContainer,
   Table,
   TableCaption,

package/src/content/Table/hooks/useSort.tsx

@@ -1,5 +1,4 @@
-import { useState } from 'react';
-import { useMemo } from 'react';
+import { useState, useMemo } from 'react';
 
 export type SortDirection = 1 | -1 | 0;
 

package/src/content/Table/index.tsx

@@ -36,7 +36,7 @@ export const TableSortLabel = React.forwardRef<
     <Dropdown
       ref={(el) => {
         dropdownRef.current = el;
-        typeof ref === 'function' && ref(el);
+        if (typeof ref === 'function') ref(el);
       }}
       disabled={disabled}
       {...props}
@@ -63,12 +63,12 @@ export const TableSortLabel = React.forwardRef<
             tabIndex={0}
             onClick={() => {
               onSort(1);
-              dropdownRef.current && (dropdownRef.current.open = false);
+              if (dropdownRef.current) dropdownRef.current.open = false;
             }}
             onKeyDown={(e) => {
               if (e.key === 'Enter') {
                 onSort(1);
-                dropdownRef.current && (dropdownRef.current.open = false);
+                if (dropdownRef.current) dropdownRef.current.open = false;
               }
             }}
           >
@@ -85,12 +85,12 @@ export const TableSortLabel = React.forwardRef<
             tabIndex={0}
             onClick={() => {
               onSort(-1);
-              dropdownRef.current && (dropdownRef.current.open = false);
+              if (dropdownRef.current) dropdownRef.current.open = false;
             }}
             onKeyDown={(e) => {
               if (e.key === 'Enter') {
                 onSort(-1);
-                dropdownRef.current && (dropdownRef.current.open = false);
+                if (dropdownRef.current) dropdownRef.current.open = false;
               }
             }}
           >

package/src/content/Table/interaction.test.tsx

@@ -4,29 +4,33 @@ import { test, expect } from '@playwright/experimental-ct-react';
 import { WithLoader } from '@digigov/ui/content/Table/__stories__/WithLoader';
 import { WithSortFilters } from '@digigov/ui/content/Table/__stories__/WithSortFilters';
 const SCREENSHOT_DELAY = 2_000;
-const delay = ms => new Promise(resolve => setTimeout(resolve, ms));
+const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
 
 test('renders the WithLoader Toggle Loading', async ({ mount, page }) => {
-  await mount(
-    <WithLoader />
-  )
+  await mount(<WithLoader />);
   await page.evaluate(() => document.fonts.ready);
   await delay(SCREENSHOT_DELAY);
- await page.locator("#root>button").click();
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  await page.locator('#root>button').click();
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  
 
-
-test('renders the WithSortFilters Click on header cell', async ({ mount, page }) => {
-  await mount(
-    <WithSortFilters />
-  )
+test('renders the WithSortFilters Click on header cell', async ({
+  mount,
+  page,
+}) => {
+  await mount(<WithSortFilters />);
   await page.evaluate(() => document.fonts.ready);
   await delay(SCREENSHOT_DELAY);
- await page.locator("#root>div>table>thead>tr>th:nth-child(1)>details>summary").click();
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  await page
+    .locator('#root>div>table>thead>tr>th:nth-child(1)>details>summary')
+    .click();
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  

package/src/feedback/CopyToClipboard/index.tsx

@@ -41,7 +41,7 @@ export const CopyToClipboard = React.forwardRef<
   }, [enabled]);
 
   function copyToClipboard() {
-    onCopy && onCopy();
+    if (onCopy) onCopy();
     navigator.clipboard.writeText(text);
     setEnabled(true);
   }

package/src/feedback/CopyToClipboard/interaction.test.tsx

@@ -6,36 +6,34 @@ import { Default } from '@digigov/ui/feedback/CopyToClipboard/__stories__/Defaul
 import { Dense } from '@digigov/ui/feedback/CopyToClipboard/__stories__/Dense';
 
 test('renders the Banner Click button', async ({ mount, page }) => {
-  await mount(
-    <Banner />
-  )
+  await mount(<Banner />);
   await page.evaluate(() => document.fonts.ready);
- await page.locator("#root>div>div>button").click();
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  await page.locator('#root>div>div>button').click();
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  
-
 
 test('renders the Default Click button', async ({ mount, page }) => {
-  await mount(
-    <Default />
-  )
+  await mount(<Default />);
   await page.evaluate(() => document.fonts.ready);
- await page.locator("#root>div>div>button").click();
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  await page.locator('#root>div>div>button').click();
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  
-
 
 test('renders the Dense Click button', async ({ mount, page }) => {
-  await mount(
-    <Dense />
-  )
+  await mount(<Dense />);
   await page.evaluate(() => document.fonts.ready);
- await page.locator("#root>div>div>button").click();
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  await page.locator('#root>div>div>button').click();
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  

package/src/feedback/ErrorSummary/ErrorSummary.stories.js

@@ -12,4 +12,5 @@ export { Dense } from '@digigov/ui/feedback/ErrorSummary/__stories__/Dense';
 export { LinkedToInput } from '@digigov/ui/feedback/ErrorSummary/__stories__/LinkedToInput';
 export { LinkedToField } from '@digigov/ui/feedback/ErrorSummary/__stories__/LinkedToField';
 export { LinkedToCheckbox } from '@digigov/ui/feedback/ErrorSummary/__stories__/LinkedToCheckbox';
+export { ErrorGroupLinkedToInput } from '@digigov/ui/feedback/ErrorSummary/__stories__/ErrorGroupLinkedToInput';
 export { WithBackLinkAndButton } from '@digigov/ui/feedback/ErrorSummary/__stories__/WithBackLinkAndButton';

package/src/feedback/ErrorSummary/__stories__/ErrorGroupLinkedToInput.tsx

@@ -0,0 +1,47 @@
+import React from 'react';
+import { List, ListItem } from '@digigov/ui/content/List';
+import { ErrorSummary } from '@digigov/ui/feedback/ErrorSummary';
+import { FieldContainer } from '@digigov/ui/form/FieldContainer';
+import { LabelContainer, LabelTitle } from '@digigov/ui/form/LabelContainer';
+import { TextInput } from '@digigov/ui/form/TextInput';
+import { Link } from '@digigov/ui/navigation/Link';
+import { Heading } from '@digigov/ui/typography/Heading';
+import { Hint } from '@digigov/ui/typography/Hint';
+
+export const ErrorGroupLinkedToInput = () => (
+  <div>
+    <ErrorSummary variant="error-group">
+      <Heading size="md">Τα παρακάτω πεδία της φόρμας ειναι λάθος.</Heading>
+      <List listStyle="bullet">
+        <ListItem>
+          <b>Όνομα επιχείρησης:</b>{' '}
+          <Link href="#business-name">
+            Πρέπει να συμπληρώσετε το όνομα της επιχείρησης
+          </Link>
+        </ListItem>
+        <ListItem>
+          <b>Διεύθυνση επιχείρησης:</b>{' '}
+          <Link href="#address-name">
+            Πρέπει να συμπληρώσετε τη διεύθυνση της επιχείρησης
+          </Link>
+        </ListItem>
+      </List>
+    </ErrorSummary>
+    <FieldContainer error>
+      <LabelContainer>
+        <LabelTitle size="md">Όνομα επιχείρησης</LabelTitle>
+        <Hint>Ποιο είναι το όνομα της επιχείρησης;</Hint>
+        <TextInput error name="inputext" id="business-name"></TextInput>
+      </LabelContainer>
+    </FieldContainer>
+    <FieldContainer error>
+      <LabelContainer>
+        <LabelTitle size="md">Διεύθυνση επιχείρησης</LabelTitle>
+        <Hint>Ποια είναι η διεύθυνση της επιχείρησης;</Hint>
+        <TextInput error name="inputext" id="business-address"></TextInput>
+      </LabelContainer>
+    </FieldContainer>
+  </div>
+);
+
+export default ErrorGroupLinkedToInput;

package/src/feedback/ErrorSummary/__stories__/LinkedToInput.tsx

@@ -2,8 +2,7 @@ import React from 'react';
 import { ErrorSummary } from '@digigov/ui/feedback/ErrorSummary';
 import { ErrorMessage } from '@digigov/ui/form/ErrorMessage';
 import { FieldContainer } from '@digigov/ui/form/FieldContainer';
-import { LabelContainer } from '@digigov/ui/form/LabelContainer';
-import { LabelTitle } from '@digigov/ui/form/LabelContainer';
+import { LabelContainer, LabelTitle } from '@digigov/ui/form/LabelContainer';
 import { TextInput } from '@digigov/ui/form/TextInput';
 import { Link } from '@digigov/ui/navigation/Link';
 import { Heading } from '@digigov/ui/typography/Heading';

package/src/feedback/ErrorSummary/index.test.tsx

@@ -3,6 +3,7 @@ import { test, expect } from '@playwright/experimental-ct-react';
 import TestVariant from '@digigov/ui/utils/TestVariant'
 import { Default } from '@digigov/ui/feedback/ErrorSummary/__stories__/Default';
 import { Dense } from '@digigov/ui/feedback/ErrorSummary/__stories__/Dense';
+import { ErrorGroupLinkedToInput } from '@digigov/ui/feedback/ErrorSummary/__stories__/ErrorGroupLinkedToInput';
 import { LinkedToCheckbox } from '@digigov/ui/feedback/ErrorSummary/__stories__/LinkedToCheckbox';
 import { LinkedToField } from '@digigov/ui/feedback/ErrorSummary/__stories__/LinkedToField';
 import { LinkedToInput } from '@digigov/ui/feedback/ErrorSummary/__stories__/LinkedToInput';
@@ -18,6 +19,9 @@ test('renders the All ErrorSummary variants', async ({ mount, page }) => {
     <TestVariant title="Dense">
       <Dense />
     </TestVariant>
+    <TestVariant title="ErrorGroupLinkedToInput">
+      <ErrorGroupLinkedToInput />
+    </TestVariant>
     <TestVariant title="LinkedToCheckbox">
       <LinkedToCheckbox />
     </TestVariant>

package/src/feedback/ErrorSummary/interaction.test.tsx

@@ -4,14 +4,14 @@ import { test, expect } from '@playwright/experimental-ct-react';
 import { LinkedToCheckbox } from '@digigov/ui/feedback/ErrorSummary/__stories__/LinkedToCheckbox';
 
 test('renders the LinkedToCheckbox Go to checkbox', async ({ mount, page }) => {
-  await mount(
-    <LinkedToCheckbox />
-  )
+  await mount(<LinkedToCheckbox />);
   await page.evaluate(() => document.fonts.ready);
- await page.keyboard.press("Tab");
- await page.keyboard.press("Enter");
+  await page.keyboard.press('Tab');
+  await page.keyboard.press('Enter');
 
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  

package/src/feedback/NotificationBanner/interaction.test.tsx

@@ -5,28 +5,27 @@ import { Default } from '@digigov/ui/feedback/NotificationBanner/__stories__/Def
 import { Success } from '@digigov/ui/feedback/NotificationBanner/__stories__/Success';
 
 test('renders the Default Hover and click', async ({ mount, page }) => {
-  await mount(
-    <Default />
-  )
+  await mount(<Default />);
   await page.evaluate(() => document.fonts.ready);
- await page.locator("#root>div>div:nth-child(2)>h3>a").hover();
- await page.locator("#root>div>div:nth-child(2)>h3>a").click();
+  await page.locator('#root>div>div:nth-child(2)>h3>a').hover();
+  await page.locator('#root>div>div:nth-child(2)>h3>a').click();
 
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  
-
 
 test('renders the Success Hover and click', async ({ mount, page }) => {
-  await mount(
-    <Success />
-  )
+  await mount(<Success />);
   await page.evaluate(() => document.fonts.ready);
- await page.locator("#root>div>div:nth-child(2)>h3>a").hover();
- await page.locator("#root>div>div:nth-child(2)>h3>a").click();
+  await page.locator('#root>div>div:nth-child(2)>h3>a').hover();
+  await page.locator('#root>div>div:nth-child(2)>h3>a').click();
 
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  

package/src/feedback/PhaseBanner/interaction.test.tsx

@@ -4,12 +4,12 @@ import { test, expect } from '@playwright/experimental-ct-react';
 import { Default } from '@digigov/ui/feedback/PhaseBanner/__stories__/Default';
 
 test('renders the Default pressing Tab', async ({ mount, page }) => {
-  await mount(
-    <Default />
-  )
+  await mount(<Default />);
   await page.evaluate(() => document.fonts.ready);
- await page.keyboard.press("Tab");
-  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
+  await page.keyboard.press('Tab');
+  const screenshot = await page.screenshot({
+    fullPage: true,
+    animations: 'disabled',
+  });
   expect(screenshot).toMatchSnapshot();
 });
-  

package/src/form/AutoComplete/Status/index.tsx

@@ -26,7 +26,7 @@ const debounce = function (
 };
 const statusDebounceMillis = 1400;
 
-type StatusProps = {
+interface StatusProps {
   id: string;
   length: number;
   queryLength: number;
@@ -39,13 +39,13 @@ type StatusProps = {
   tNoResults?: () => string;
   tSelectedOption: (x: string, y: number, z: number) => string;
   tResults?: (x: number, y: string) => string;
-};
+}
 
-type StateProps = {
+interface StateProps {
   bump: boolean;
   debounced: boolean;
   silenced: boolean;
-};
+}
 
 export default class Status extends Component<StatusProps, StateProps> {
   static defaultProps = {

package/src/form/AutoComplete/__stories__/Multiple.tsx

@@ -8,7 +8,12 @@ export const Multiple = () => (
   <div>
     <FieldContainer>
       <Fieldset marginBottom={4}>
-        <AutoComplete source={suggest} multiple width="50%" id="multiple-select-default" />
+        <AutoComplete
+          source={suggest}
+          multiple
+          width="50%"
+          id="multiple-select-default"
+        />
       </Fieldset>
     </FieldContainer>
     <Button>Υποβολή</Button>

package/src/form/AutoComplete/__stories__/MultipleShowingTwoSelected.tsx

@@ -7,7 +7,13 @@ import { FieldContainer } from '@digigov/ui/form/FieldContainer';
 export const MultipleShowingTwoSelected = () => (
   <div>
     <FieldContainer>
-      <AutoComplete source={suggest} multiple width='75%' id="multiple-showing-two-selected" numberOfSelected={2} />
+      <AutoComplete
+        source={suggest}
+        multiple
+        width="75%"
+        id="multiple-showing-two-selected"
+        numberOfSelected={2}
+      />
     </FieldContainer>
     <Button>Υποβολή</Button>
   </div>

package/src/form/AutoComplete/__stories__/MultipleWithDefaultValues.tsx

@@ -7,7 +7,13 @@ import { FieldContainer } from '@digigov/ui/form/FieldContainer';
 export const MultipleWithDefaultValues = () => (
   <div>
     <FieldContainer>
-      <AutoComplete source={suggest} multiple defaultValue={['Ελλάδα', 'Ιταλία']} width="50%" id="govgr" />
+      <AutoComplete
+        source={suggest}
+        multiple
+        defaultValue={['Ελλάδα', 'Ιταλία']}
+        width="50%"
+        id="govgr"
+      />
     </FieldContainer>
     <Button>Υποβολή</Button>
   </div>

package/src/form/AutoComplete/__stories__/MultipleWithMinLength.tsx

@@ -8,8 +8,8 @@ import Paragraph from '@digigov/ui/typography/Paragraph';
 export const MultipleWithMinLength = () => (
   <div>
     <Paragraph>
-      Εδώ, ο ελάχιστος αριθμός χαρακτήρων που πρέπει να
-      εισαχθεί ώστε να αρχίσει να φιλτράρεται η αναζήτηση είναι 2.
+      Εδώ, ο ελάχιστος αριθμός χαρακτήρων που πρέπει να εισαχθεί ώστε να αρχίσει
+      να φιλτράρεται η αναζήτηση είναι 2.
     </Paragraph>
     <FieldContainer>
       <Fieldset marginBottom={4}>

package/src/form/AutoComplete/__stories__/WithShowAllValues.tsx

@@ -7,11 +7,7 @@ import { FieldContainer } from '@digigov/ui/form/FieldContainer';
 export const WithShowAllValues = () => (
   <div>
     <FieldContainer>
-      <AutoComplete
-        source={suggest}
-        autoselect={true}
-        id="govgr"
-      />
+      <AutoComplete source={suggest} autoselect={true} id="govgr" />
     </FieldContainer>
     <Button>Υποβολή</Button>
   </div>