@digigov/ui 2.0.0-aefd0709 → 2.0.0-b15d5d44

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

@@ -1,5 +1,6 @@
 import React from 'react';
 import { test, expect } from '@playwright/experimental-ct-react';
+import TestVariant from '@digigov/ui/utils/TestVariant'
 import { DarkVariant } from '@digigov/ui/content/Table/__stories__/DarkVariant';
 import { DarkVariantWithVerticalHeaders } from '@digigov/ui/content/Table/__stories__/DarkVariantWithVerticalHeaders';
 import { Default } from '@digigov/ui/content/Table/__stories__/Default';
@@ -18,75 +19,73 @@ import { WithFloatingScroll } from '@digigov/ui/content/Table/__stories__/WithFl
 import { WithLoader } from '@digigov/ui/content/Table/__stories__/WithLoader';
 import { WithSortFilters } from '@digigov/ui/content/Table/__stories__/WithSortFilters';
 import { ZebraProp } from '@digigov/ui/content/Table/__stories__/ZebraProp';
-import TestVariant from '@digigov/ui/utils/TestVariant';
 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 All Table variants', async ({ mount, page }) => {
   await mount(
-    <div>
-      <TestVariant title="DarkVariant">
-        <DarkVariant />
-      </TestVariant>
-      <TestVariant title="DarkVariantWithVerticalHeaders">
-        <DarkVariantWithVerticalHeaders />
-      </TestVariant>
-      <TestVariant title="Default">
-        <Default />
-      </TestVariant>
-      <TestVariant title="DefinedWidth">
-        <DefinedWidth />
-      </TestVariant>
-      <TestVariant title="Dense">
-        <Dense />
-      </TestVariant>
-      <TestVariant title="Full">
-        <Full />
-      </TestVariant>
-      <TestVariant title="MultipleProps">
-        <MultipleProps />
-      </TestVariant>
-      <TestVariant title="NoData">
-        <NoData />
-      </TestVariant>
-      <TestVariant title="NumericDataType">
-        <NumericDataType />
-      </TestVariant>
-      <TestVariant title="RowColors">
-        <RowColors />
-      </TestVariant>
-      <TestVariant title="Stacked">
-        <Stacked />
-      </TestVariant>
-      <TestVariant title="TableCaptions">
-        <TableCaptions />
-      </TestVariant>
-      <TestVariant title="VerticalBorders">
-        <VerticalBorders />
-      </TestVariant>
-      <TestVariant title="VerticalHeaders">
-        <VerticalHeaders />
-      </TestVariant>
-      <TestVariant title="WithFloatingScroll">
-        <WithFloatingScroll />
-      </TestVariant>
-      <TestVariant title="WithLoader">
-        <WithLoader />
-      </TestVariant>
-      <TestVariant title="WithSortFilters">
-        <WithSortFilters />
-      </TestVariant>
-      <TestVariant title="ZebraProp">
-        <ZebraProp />
-      </TestVariant>
-    </div>
-  );
+    
+  <div>
+    <TestVariant title="DarkVariant">
+      <DarkVariant />
+    </TestVariant>
+    <TestVariant title="DarkVariantWithVerticalHeaders">
+      <DarkVariantWithVerticalHeaders />
+    </TestVariant>
+    <TestVariant title="Default">
+      <Default />
+    </TestVariant>
+    <TestVariant title="DefinedWidth">
+      <DefinedWidth />
+    </TestVariant>
+    <TestVariant title="Dense">
+      <Dense />
+    </TestVariant>
+    <TestVariant title="Full">
+      <Full />
+    </TestVariant>
+    <TestVariant title="MultipleProps">
+      <MultipleProps />
+    </TestVariant>
+    <TestVariant title="NoData">
+      <NoData />
+    </TestVariant>
+    <TestVariant title="NumericDataType">
+      <NumericDataType />
+    </TestVariant>
+    <TestVariant title="RowColors">
+      <RowColors />
+    </TestVariant>
+    <TestVariant title="Stacked">
+      <Stacked />
+    </TestVariant>
+    <TestVariant title="TableCaptions">
+      <TableCaptions />
+    </TestVariant>
+    <TestVariant title="VerticalBorders">
+      <VerticalBorders />
+    </TestVariant>
+    <TestVariant title="VerticalHeaders">
+      <VerticalHeaders />
+    </TestVariant>
+    <TestVariant title="WithFloatingScroll">
+      <WithFloatingScroll />
+    </TestVariant>
+    <TestVariant title="WithLoader">
+      <WithLoader />
+    </TestVariant>
+    <TestVariant title="WithSortFilters">
+      <WithSortFilters />
+    </TestVariant>
+    <TestVariant title="ZebraProp">
+      <ZebraProp />
+    </TestVariant>
+  </div>
+  )
   await page.evaluate(() => document.fonts.ready);
   await delay(SCREENSHOT_DELAY);
 
-  const screenshot = await page.screenshot({
-    fullPage: true,
-    animations: 'disabled',
-  });
+  const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
   expect(screenshot).toMatchSnapshot();
 });
+  

package/src/content/TaskList/index.test.tsx

@@ -1,25 +1,24 @@
 import React from 'react';
 import { test, expect } from '@playwright/experimental-ct-react';
+import TestVariant from '@digigov/ui/utils/TestVariant'
 import { Default } from '@digigov/ui/content/TaskList/__stories__/Default';
 import { Dense } from '@digigov/ui/content/TaskList/__stories__/Dense';
-import TestVariant from '@digigov/ui/utils/TestVariant';
 
 test('renders the All TaskList variants', async ({ mount, page }) => {
   await mount(
-    <div>
-      <TestVariant title="Default">
-        <Default />
-      </TestVariant>
-      <TestVariant title="Dense">
-        <Dense />
-      </TestVariant>
-    </div>
-  );
+    
+  <div>
+    <TestVariant title="Default">
+      <Default />
+    </TestVariant>
+    <TestVariant title="Dense">
+      <Dense />
+    </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/content/Timeline/index.test.tsx

@@ -1,25 +1,24 @@
 import React from 'react';
 import { test, expect } from '@playwright/experimental-ct-react';
+import TestVariant from '@digigov/ui/utils/TestVariant'
 import { Default } from '@digigov/ui/content/Timeline/__stories__/Default';
 import { Dense } from '@digigov/ui/content/Timeline/__stories__/Dense';
-import TestVariant from '@digigov/ui/utils/TestVariant';
 
 test('renders the All Timeline variants', async ({ mount, page }) => {
   await mount(
-    <div>
-      <TestVariant title="Default">
-        <Default />
-      </TestVariant>
-      <TestVariant title="Dense">
-        <Dense />
-      </TestVariant>
-    </div>
-  );
+    
+  <div>
+    <TestVariant title="Default">
+      <Default />
+    </TestVariant>
+    <TestVariant title="Dense">
+      <Dense />
+    </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/feedback/CopyToClipboard/index.test.tsx

@@ -1,29 +1,28 @@
 import React from 'react';
 import { test, expect } from '@playwright/experimental-ct-react';
+import TestVariant from '@digigov/ui/utils/TestVariant'
 import { Banner } from '@digigov/ui/feedback/CopyToClipboard/__stories__/Banner';
 import { Default } from '@digigov/ui/feedback/CopyToClipboard/__stories__/Default';
 import { Dense } from '@digigov/ui/feedback/CopyToClipboard/__stories__/Dense';
-import TestVariant from '@digigov/ui/utils/TestVariant';
 
 test('renders the All CopyToClipboard variants', async ({ mount, page }) => {
   await mount(
-    <div>
-      <TestVariant title="Banner">
-        <Banner />
-      </TestVariant>
-      <TestVariant title="Default">
-        <Default />
-      </TestVariant>
-      <TestVariant title="Dense">
-        <Dense />
-      </TestVariant>
-    </div>
-  );
+    
+  <div>
+    <TestVariant title="Banner">
+      <Banner />
+    </TestVariant>
+    <TestVariant title="Default">
+      <Default />
+    </TestVariant>
+    <TestVariant title="Dense">
+      <Dense />
+    </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/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/index.test.tsx

@@ -1,41 +1,44 @@
 import React from 'react';
 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';
 import { WithBackLinkAndButton } from '@digigov/ui/feedback/ErrorSummary/__stories__/WithBackLinkAndButton';
-import TestVariant from '@digigov/ui/utils/TestVariant';
 
 test('renders the All ErrorSummary variants', async ({ mount, page }) => {
   await mount(
-    <div>
-      <TestVariant title="Default">
-        <Default />
-      </TestVariant>
-      <TestVariant title="Dense">
-        <Dense />
-      </TestVariant>
-      <TestVariant title="LinkedToCheckbox">
-        <LinkedToCheckbox />
-      </TestVariant>
-      <TestVariant title="LinkedToField">
-        <LinkedToField />
-      </TestVariant>
-      <TestVariant title="LinkedToInput">
-        <LinkedToInput />
-      </TestVariant>
-      <TestVariant title="WithBackLinkAndButton">
-        <WithBackLinkAndButton />
-      </TestVariant>
-    </div>
-  );
+    
+  <div>
+    <TestVariant title="Default">
+      <Default />
+    </TestVariant>
+    <TestVariant title="Dense">
+      <Dense />
+    </TestVariant>
+    <TestVariant title="ErrorGroupLinkedToInput">
+      <ErrorGroupLinkedToInput />
+    </TestVariant>
+    <TestVariant title="LinkedToCheckbox">
+      <LinkedToCheckbox />
+    </TestVariant>
+    <TestVariant title="LinkedToField">
+      <LinkedToField />
+    </TestVariant>
+    <TestVariant title="LinkedToInput">
+      <LinkedToInput />
+    </TestVariant>
+    <TestVariant title="WithBackLinkAndButton">
+      <WithBackLinkAndButton />
+    </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/feedback/NotificationBanner/index.test.tsx

@@ -1,29 +1,28 @@
 import React from 'react';
 import { test, expect } from '@playwright/experimental-ct-react';
+import TestVariant from '@digigov/ui/utils/TestVariant'
 import { Default } from '@digigov/ui/feedback/NotificationBanner/__stories__/Default';
 import { Dense } from '@digigov/ui/feedback/NotificationBanner/__stories__/Dense';
 import { Success } from '@digigov/ui/feedback/NotificationBanner/__stories__/Success';
-import TestVariant from '@digigov/ui/utils/TestVariant';
 
 test('renders the All NotificationBanner variants', async ({ mount, page }) => {
   await mount(
-    <div>
-      <TestVariant title="Default">
-        <Default />
-      </TestVariant>
-      <TestVariant title="Dense">
-        <Dense />
-      </TestVariant>
-      <TestVariant title="Success">
-        <Success />
-      </TestVariant>
-    </div>
-  );
+    
+  <div>
+    <TestVariant title="Default">
+      <Default />
+    </TestVariant>
+    <TestVariant title="Dense">
+      <Dense />
+    </TestVariant>
+    <TestVariant title="Success">
+      <Success />
+    </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/feedback/PhaseBanner/index.test.tsx

@@ -1,25 +1,24 @@
 import React from 'react';
 import { test, expect } from '@playwright/experimental-ct-react';
+import TestVariant from '@digigov/ui/utils/TestVariant'
 import { Default } from '@digigov/ui/feedback/PhaseBanner/__stories__/Default';
 import { Underlined } from '@digigov/ui/feedback/PhaseBanner/__stories__/Underlined';
-import TestVariant from '@digigov/ui/utils/TestVariant';
 
 test('renders the All PhaseBanner variants', async ({ mount, page }) => {
   await mount(
-    <div>
-      <TestVariant title="Default">
-        <Default />
-      </TestVariant>
-      <TestVariant title="Underlined">
-        <Underlined />
-      </TestVariant>
-    </div>
-  );
+    
+  <div>
+    <TestVariant title="Default">
+      <Default />
+    </TestVariant>
+    <TestVariant title="Underlined">
+      <Underlined />
+    </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/feedback/WarningText/index.test.tsx

@@ -1,29 +1,28 @@
 import React from 'react';
 import { test, expect } from '@playwright/experimental-ct-react';
+import TestVariant from '@digigov/ui/utils/TestVariant'
 import { AssistiveText } from '@digigov/ui/feedback/WarningText/__stories__/AssistiveText';
 import { Default } from '@digigov/ui/feedback/WarningText/__stories__/Default';
 import { Dense } from '@digigov/ui/feedback/WarningText/__stories__/Dense';
-import TestVariant from '@digigov/ui/utils/TestVariant';
 
 test('renders the All WarningText variants', async ({ mount, page }) => {
   await mount(
-    <div>
-      <TestVariant title="AssistiveText">
-        <AssistiveText />
-      </TestVariant>
-      <TestVariant title="Default">
-        <Default />
-      </TestVariant>
-      <TestVariant title="Dense">
-        <Dense />
-      </TestVariant>
-    </div>
-  );
+    
+  <div>
+    <TestVariant title="AssistiveText">
+      <AssistiveText />
+    </TestVariant>
+    <TestVariant title="Default">
+      <Default />
+    </TestVariant>
+    <TestVariant title="Dense">
+      <Dense />
+    </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/form/AutoComplete/index.test.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { test, expect } from '@playwright/experimental-ct-react';
+import TestVariant from '@digigov/ui/utils/TestVariant'
 import { Default } from '@digigov/ui/form/AutoComplete/__stories__/Default';
 import { Multiple } from '@digigov/ui/form/AutoComplete/__stories__/Multiple';
 import { MultipleShowingTwoSelected } from '@digigov/ui/form/AutoComplete/__stories__/MultipleShowingTwoSelected';
@@ -10,48 +11,46 @@ import { WithDefaultValue } from '@digigov/ui/form/AutoComplete/__stories__/With
 import { WithMinLength } from '@digigov/ui/form/AutoComplete/__stories__/WithMinLength';
 import { WithPlaceHolder } from '@digigov/ui/form/AutoComplete/__stories__/WithPlaceHolder';
 import { WithShowAllValues } from '@digigov/ui/form/AutoComplete/__stories__/WithShowAllValues';
-import TestVariant from '@digigov/ui/utils/TestVariant';
 
 test('renders the All AutoComplete variants', async ({ mount, page }) => {
   await mount(
-    <div>
-      <TestVariant title="Default">
-        <Default />
-      </TestVariant>
-      <TestVariant title="Multiple">
-        <Multiple />
-      </TestVariant>
-      <TestVariant title="MultipleShowingTwoSelected">
-        <MultipleShowingTwoSelected />
-      </TestVariant>
-      <TestVariant title="MultipleWithDefaultValues">
-        <MultipleWithDefaultValues />
-      </TestVariant>
-      <TestVariant title="MultipleWithMinLength">
-        <MultipleWithMinLength />
-      </TestVariant>
-      <TestVariant title="WithAutoSelect">
-        <WithAutoSelect />
-      </TestVariant>
-      <TestVariant title="WithDefaultValue">
-        <WithDefaultValue />
-      </TestVariant>
-      <TestVariant title="WithMinLength">
-        <WithMinLength />
-      </TestVariant>
-      <TestVariant title="WithPlaceHolder">
-        <WithPlaceHolder />
-      </TestVariant>
-      <TestVariant title="WithShowAllValues">
-        <WithShowAllValues />
-      </TestVariant>
-    </div>
-  );
+    
+  <div>
+    <TestVariant title="Default">
+      <Default />
+    </TestVariant>
+    <TestVariant title="Multiple">
+      <Multiple />
+    </TestVariant>
+    <TestVariant title="MultipleShowingTwoSelected">
+      <MultipleShowingTwoSelected />
+    </TestVariant>
+    <TestVariant title="MultipleWithDefaultValues">
+      <MultipleWithDefaultValues />
+    </TestVariant>
+    <TestVariant title="MultipleWithMinLength">
+      <MultipleWithMinLength />
+    </TestVariant>
+    <TestVariant title="WithAutoSelect">
+      <WithAutoSelect />
+    </TestVariant>
+    <TestVariant title="WithDefaultValue">
+      <WithDefaultValue />
+    </TestVariant>
+    <TestVariant title="WithMinLength">
+      <WithMinLength />
+    </TestVariant>
+    <TestVariant title="WithPlaceHolder">
+      <WithPlaceHolder />
+    </TestVariant>
+    <TestVariant title="WithShowAllValues">
+      <WithShowAllValues />
+    </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();
 });
+