@digigov/ui 2.0.0-af1b5f33 → 2.0.0-cbc56209

package/src/layouts/Basic/Masthead/index.mdx

@@ -1,65 +0,0 @@
----
-id: masthead
-title: Masthead
-parent: docs/ui/components
----
-
-# Masthead
-
-```jsx live path=layouts/Basic/index.tsx
-import Header, { HeaderTitle } from '@digigov/ui/app/Header';
-import GovGRLogo from '@digigov/ui/govgr/GovGRLogo';
-import Grid from '@digigov/react-core/Grid';
-import Paragraph from '@digigov/ui/typography/Paragraph';
-import PhaseBanner, { PhaseBannerTag } from '@digigov/ui/feedback/PhaseBanner';
-
-function Masthead{
-
- return (
-   <BasicLayout>
-    <Top>
-        <Header>
-          <GovGRLogo />
-          <HeaderTitle>
-            <PhaseBanner>
-              <PhaseBannerTag>ALPHA</PhaseBannerTag>
-            </PhaseBanner>
-          </HeaderTitle>
-        </Header>
-     </Top>
-    <Masthead>
-          <Caption>Powered by GRNET</Caption>
-            <Title size="xl">
-              Digigov creates tools that help teams build GOV.GR services
-            </Title>
-            <Paragraph>
-              Here you can find everything you&apos;d need to get started
-              building your shiny new service. We build and maintain libraries
-              SDKs that they help you create dynamic and responsive user
-              interface for a variety of devices.
-            </Paragraph>
-      </Masthead>
-      <Container>
-        Lorem ipsum dolor sit amet, consectetur adipiscing elit,
-        sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
-        Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
-        Excepteur sint occaecat cupidatat non proident,
-        sunt in culpa qui officia deserunt mollit anim id est laborum.
-      </Container>
-  </BasicLayout>
- )
-}
-export Masthead
-
-```
-
-<br />
-
-## How it works
-
-The Masthead component is a set of features or layout that marks the page and delivers identifying information to web users.
-
-## API
-
-<PropTypes packageName="@digigov/ui" component="Masthead" />

package/src/misc/KitchenSink/index.tsx

@@ -1,8 +0,0 @@
-export * from '@digigov/react-core/KitchenSinkAllComponents';
-export * from '@digigov/react-core/KitchenSinkCard';
-export * from '@digigov/react-core/KitchenSinkCategory';
-export * from '@digigov/react-core/KitchenSinkContent';
-export * from '@digigov/react-core/KitchenSinkContentInfo';
-export * from '@digigov/react-core/KitchenSinkContentTags';
-export * from '@digigov/react-core/KitchenSinkHeading';
-export * from '@digigov/react-core/KitchenSinkLetterContent';

package/src/utils/Kitchensink/AllComponents.tsx

@@ -1,6 +0,0 @@
-import React from 'react';
-
-import { stories } from '@digigov/ui/registry';
-import { KitchenSinkDashboard } from '@digigov/ui/utils/Kitchensink/KitchensinkDashboard';
-
-export const AllComponents = () => <KitchenSinkDashboard stories={stories} />;

package/src/utils/Kitchensink/KitchensinkByCategory.tsx

@@ -1,56 +0,0 @@
-import React from 'react';
-import {
-  KitchenSinkCategory,
-  KitchenSinkHeading,
-} from '@digigov/ui/misc/KitchenSink';
-import { KitchensinkByLetter } from '@digigov/ui/utils/Kitchensink/KitchensinkByLetter';
-
-export interface KitchensinkByCategoryInterface {
-  category: string;
-  stories: React.ReactElement[];
-}
-
-export const KitchensinkByCategory = ({
-  category,
-  stories,
-}: KitchensinkByCategoryInterface) => {
-  const alphabeticalOrder = Object.keys(stories).reduce(
-    (abStories, componentStoriesKey) => {
-      const componentStories = stories[componentStoriesKey];
-      if (!componentStories.default.component) {
-        throw new Error(`no component was found in ${componentStoriesKey}`);
-      }
-      const name = componentStories.default.displayName;
-      console.log('componentStories', componentStories, 'stories', stories);
-      if (!name) {
-        throw new Error(`no name was found for ${componentStoriesKey}`);
-      }
-      const letter = name[0];
-      if (abStories[letter]) {
-        abStories[letter].push(componentStories);
-      } else {
-        abStories[letter] = [componentStories];
-      }
-      return abStories;
-    },
-    {}
-  );
-  return (
-    <div>
-      <KitchenSinkHeading>{category}</KitchenSinkHeading>
-      <KitchenSinkCategory>
-        {Object.keys(alphabeticalOrder)
-          .sort()
-          .map((letter, index) => {
-            return (
-              <KitchensinkByLetter
-                letter={letter}
-                stories={alphabeticalOrder[letter]}
-                key={index}
-              />
-            );
-          })}
-      </KitchenSinkCategory>
-    </div>
-  );
-};

package/src/utils/Kitchensink/KitchensinkByLetter.tsx

@@ -1,35 +0,0 @@
-import React from 'react';
-import Heading from '@digigov/react-core/Heading';
-import { KitchenSinkLetterContent } from '@digigov/react-core/KitchenSinkLetterContent';
-import { KitchensinkComponent } from '@digigov/ui/utils/Kitchensink/KitchensinkComponent';
-
-export interface KitchensinkByLetterInterface {
-  letter: string;
-  stories: any;
-}
-
-export const KitchensinkByLetter = ({
-  letter,
-  stories,
-}: KitchensinkByLetterInterface) => {
-  return (
-    <div>
-      <Heading>{letter}</Heading>
-      <KitchenSinkLetterContent>
-        {stories.map((story, index) => {
-          return (
-            <KitchensinkComponent
-              tags={story.default.tags}
-              title={story.default.displayName}
-              description={story.default.description}
-              link={story.default.link}
-              width={story.default.defaultWidth}
-              stories={story}
-              key={index}
-            />
-          );
-        })}
-      </KitchenSinkLetterContent>
-    </div>
-  );
-};

package/src/utils/Kitchensink/KitchensinkComponent.tsx

@@ -1,70 +0,0 @@
-import React from 'react';
-import { KitchenSinkCard } from '@digigov/react-core/KitchenSinkCard';
-import { KitchenSinkContent } from '@digigov/react-core/KitchenSinkContent';
-import { KitchenSinkContentInfo } from '@digigov/react-core/KitchenSinkContentInfo';
-import { KitchenSinkContentTags } from '@digigov/react-core/KitchenSinkContentTags';
-import PhaseBanner, {
-  PhaseBannerTag,
-  PhaseBannerText,
-} from '@digigov/ui/feedback/PhaseBanner';
-import SectionBreak from '@digigov/ui/layouts/SectionBreak';
-import Link from '@digigov/ui/navigation/Link';
-import { Paragraph } from '@digigov/ui/typography';
-import Heading from '@digigov/ui/typography/Heading';
-
-export interface KitchensinkComponentInterface {
-  tags?: string[]; // ex. Experimental
-  title: string;
-  description?: string;
-  link?: string;
-  stories: React.ReactElement[];
-  width?: 'md' | 'lg';
-}
-export const KitchensinkComponent = ({
-  tags = [],
-  title,
-  description,
-  link,
-  stories,
-  width = 'md',
-}: KitchensinkComponentInterface) => {
-  return (
-    <KitchenSinkContent wide={width === 'lg'}>
-      <KitchenSinkContentInfo>
-        <KitchenSinkContentTags>
-          {tags &&
-            tags.map((tag, index) => {
-              return (
-                <PhaseBanner key={index}>
-                  <PhaseBannerTag>{tag}</PhaseBannerTag>
-                  <PhaseBannerText>
-                    Αυτή είναι μία νέα υπηρεσία – τα{' '}
-                    <Link href="#feedback">σχόλιά</Link> σας θα μας βοηθήσουν να
-                    τη βελτιώσουμε.
-                  </PhaseBannerText>
-                </PhaseBanner>
-              );
-            })}
-        </KitchenSinkContentTags>
-        <Heading size="lg">{title}</Heading>
-        <Paragraph>{description}</Paragraph>
-        {link && <Link href={link}>View on GOV.GR Design System</Link>}
-        <SectionBreak />
-      </KitchenSinkContentInfo>
-      {Object.keys(stories)
-        .filter((story) => story !== 'default')
-        .map((story, index) => {
-          const Component = stories[story];
-          return (
-            <div key={index}>
-              <SectionBreak />
-              <Heading size="sm">{story}</Heading>
-              <KitchenSinkCard>
-                <Component />
-              </KitchenSinkCard>
-            </div>
-          );
-        })}
-    </KitchenSinkContent>
-  );
-};

package/src/utils/Kitchensink/KitchensinkDashboard.tsx

@@ -1,56 +0,0 @@
-import React from 'react';
-import { KitchenSinkAllComponents } from '@digigov/react-core/KitchenSinkAllComponents';
-import Paragraph from '@digigov/react-core/Paragraph';
-import { KitchensinkByCategory } from '@digigov/ui/utils/Kitchensink/KitchensinkByCategory';
-
-export interface KitchenSinkDashboardInterface {
-  stories: any;
-}
-
-export const KitchenSinkDashboard = ({
-  stories,
-}: KitchenSinkDashboardInterface) => {
-  const categoryOrder = Object.keys(stories).reduce(
-    (catStories, componentStoriesKey) => {
-      const componentStories = stories[componentStoriesKey];
-      if (componentStories.default.ignore) {
-        return catStories;
-      }
-      if (!componentStories.default.component) {
-        throw new Error(`no component was found in ${componentStoriesKey}`);
-      }
-      const title = componentStories.default.title.split('/')[1];
-      if (!title) {
-        throw new Error(`no title was found for ${componentStoriesKey}`);
-      }
-      const category = title;
-      if (catStories[category]) {
-        catStories[category].push(componentStories);
-      } else {
-        catStories[category] = [componentStories];
-      }
-      return catStories;
-    },
-    {}
-  );
-  return (
-    <div>
-      <Paragraph fontSize={72} fontWeight="bold">
-        Components
-      </Paragraph>
-      <KitchenSinkAllComponents>
-        {Object.keys(categoryOrder)
-          .sort((a, b) => (a > b ? -1 : 1))
-          .map((category, index) => {
-            return (
-              <KitchensinkByCategory
-                category={category}
-                stories={categoryOrder[category]}
-                key={index}
-              />
-            );
-          })}
-      </KitchenSinkAllComponents>
-    </div>
-  );
-};

package/utils/Kitchensink/AllComponents/index.js

@@ -1,9 +0,0 @@
-import React from 'react';
-import { stories } from '@digigov/ui/registry';
-import { KitchenSinkDashboard } from '@digigov/ui/utils/Kitchensink/KitchensinkDashboard';
-var _ref = /*#__PURE__*/React.createElement(KitchenSinkDashboard, {
-  stories: stories
-});
-export var AllComponents = function AllComponents() {
-  return _ref;
-};

package/utils/Kitchensink/AllComponents.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const AllComponents: () => JSX.Element;

package/utils/Kitchensink/KitchensinkByCategory/index.js

@@ -1,32 +0,0 @@
-import React from 'react';
-import { KitchenSinkCategory, KitchenSinkHeading } from '@digigov/ui/misc/KitchenSink';
-import { KitchensinkByLetter } from '@digigov/ui/utils/Kitchensink/KitchensinkByLetter';
-export var KitchensinkByCategory = function KitchensinkByCategory(_ref) {
-  var category = _ref.category,
-    stories = _ref.stories;
-  var alphabeticalOrder = Object.keys(stories).reduce(function (abStories, componentStoriesKey) {
-    var componentStories = stories[componentStoriesKey];
-    if (!componentStories["default"].component) {
-      throw new Error("no component was found in ".concat(componentStoriesKey));
-    }
-    var name = componentStories["default"].displayName;
-    console.log('componentStories', componentStories, 'stories', stories);
-    if (!name) {
-      throw new Error("no name was found for ".concat(componentStoriesKey));
-    }
-    var letter = name[0];
-    if (abStories[letter]) {
-      abStories[letter].push(componentStories);
-    } else {
-      abStories[letter] = [componentStories];
-    }
-    return abStories;
-  }, {});
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(KitchenSinkHeading, null, category), /*#__PURE__*/React.createElement(KitchenSinkCategory, null, Object.keys(alphabeticalOrder).sort().map(function (letter, index) {
-    return /*#__PURE__*/React.createElement(KitchensinkByLetter, {
-      letter: letter,
-      stories: alphabeticalOrder[letter],
-      key: index
-    });
-  })));
-};

package/utils/Kitchensink/KitchensinkByCategory.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-export interface KitchensinkByCategoryInterface {
-    category: string;
-    stories: React.ReactElement[];
-}
-export declare const KitchensinkByCategory: ({ category, stories, }: KitchensinkByCategoryInterface) => JSX.Element;

package/utils/Kitchensink/KitchensinkByLetter/index.js

@@ -1,19 +0,0 @@
-import React from 'react';
-import Heading from '@digigov/react-core/Heading';
-import { KitchenSinkLetterContent } from '@digigov/react-core/KitchenSinkLetterContent';
-import { KitchensinkComponent } from '@digigov/ui/utils/Kitchensink/KitchensinkComponent';
-export var KitchensinkByLetter = function KitchensinkByLetter(_ref) {
-  var letter = _ref.letter,
-    stories = _ref.stories;
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Heading, null, letter), /*#__PURE__*/React.createElement(KitchenSinkLetterContent, null, stories.map(function (story, index) {
-    return /*#__PURE__*/React.createElement(KitchensinkComponent, {
-      tags: story["default"].tags,
-      title: story["default"].displayName,
-      description: story["default"].description,
-      link: story["default"].link,
-      width: story["default"].defaultWidth,
-      stories: story,
-      key: index
-    });
-  })));
-};

package/utils/Kitchensink/KitchensinkByLetter/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "main": "../../../cjs/utils/Kitchensink/KitchensinkByLetter/index.js"
-}

package/utils/Kitchensink/KitchensinkByLetter.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-export interface KitchensinkByLetterInterface {
-    letter: string;
-    stories: any;
-}
-export declare const KitchensinkByLetter: ({ letter, stories, }: KitchensinkByLetterInterface) => JSX.Element;

package/utils/Kitchensink/KitchensinkComponent/index.js

@@ -1,45 +0,0 @@
-import React from 'react';
-import { KitchenSinkCard } from '@digigov/react-core/KitchenSinkCard';
-import { KitchenSinkContent } from '@digigov/react-core/KitchenSinkContent';
-import { KitchenSinkContentInfo } from '@digigov/react-core/KitchenSinkContentInfo';
-import { KitchenSinkContentTags } from '@digigov/react-core/KitchenSinkContentTags';
-import PhaseBanner, { PhaseBannerTag, PhaseBannerText } from '@digigov/ui/feedback/PhaseBanner';
-import SectionBreak from '@digigov/ui/layouts/SectionBreak';
-import Link from '@digigov/ui/navigation/Link';
-import { Paragraph } from '@digigov/ui/typography';
-import Heading from '@digigov/ui/typography/Heading';
-var _ref2 = /*#__PURE__*/React.createElement(PhaseBannerText, null, "\u0391\u03C5\u03C4\u03AE \u03B5\u03AF\u03BD\u03B1\u03B9 \u03BC\u03AF\u03B1 \u03BD\u03AD\u03B1 \u03C5\u03C0\u03B7\u03C1\u03B5\u03C3\u03AF\u03B1 \u2013 \u03C4\u03B1", ' ', /*#__PURE__*/React.createElement(Link, {
-  href: "#feedback"
-}, "\u03C3\u03C7\u03CC\u03BB\u03B9\u03AC"), " \u03C3\u03B1\u03C2 \u03B8\u03B1 \u03BC\u03B1\u03C2 \u03B2\u03BF\u03B7\u03B8\u03AE\u03C3\u03BF\u03C5\u03BD \u03BD\u03B1 \u03C4\u03B7 \u03B2\u03B5\u03BB\u03C4\u03B9\u03CE\u03C3\u03BF\u03C5\u03BC\u03B5.");
-var _ref3 = /*#__PURE__*/React.createElement(SectionBreak, null);
-var _ref4 = /*#__PURE__*/React.createElement(SectionBreak, null);
-export var KitchensinkComponent = function KitchensinkComponent(_ref) {
-  var _ref$tags = _ref.tags,
-    tags = _ref$tags === void 0 ? [] : _ref$tags,
-    title = _ref.title,
-    description = _ref.description,
-    link = _ref.link,
-    stories = _ref.stories,
-    _ref$width = _ref.width,
-    width = _ref$width === void 0 ? 'md' : _ref$width;
-  return /*#__PURE__*/React.createElement(KitchenSinkContent, {
-    wide: width === 'lg'
-  }, /*#__PURE__*/React.createElement(KitchenSinkContentInfo, null, /*#__PURE__*/React.createElement(KitchenSinkContentTags, null, tags && tags.map(function (tag, index) {
-    return /*#__PURE__*/React.createElement(PhaseBanner, {
-      key: index
-    }, /*#__PURE__*/React.createElement(PhaseBannerTag, null, tag), _ref2);
-  })), /*#__PURE__*/React.createElement(Heading, {
-    size: "lg"
-  }, title), /*#__PURE__*/React.createElement(Paragraph, null, description), link && /*#__PURE__*/React.createElement(Link, {
-    href: link
-  }, "View on GOV.GR Design System"), _ref3), Object.keys(stories).filter(function (story) {
-    return story !== 'default';
-  }).map(function (story, index) {
-    var Component = stories[story];
-    return /*#__PURE__*/React.createElement("div", {
-      key: index
-    }, _ref4, /*#__PURE__*/React.createElement(Heading, {
-      size: "sm"
-    }, story), /*#__PURE__*/React.createElement(KitchenSinkCard, null, /*#__PURE__*/React.createElement(Component, null)));
-  }));
-};

package/utils/Kitchensink/KitchensinkComponent/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "main": "../../../cjs/utils/Kitchensink/KitchensinkComponent/index.js"
-}

package/utils/Kitchensink/KitchensinkComponent.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-export interface KitchensinkComponentInterface {
-    tags?: string[];
-    title: string;
-    description?: string;
-    link?: string;
-    stories: React.ReactElement[];
-    width?: 'md' | 'lg';
-}
-export declare const KitchensinkComponent: ({ tags, title, description, link, stories, width, }: KitchensinkComponentInterface) => JSX.Element;

package/utils/Kitchensink/KitchensinkDashboard/index.js

@@ -1,40 +0,0 @@
-import React from 'react';
-import { KitchenSinkAllComponents } from '@digigov/react-core/KitchenSinkAllComponents';
-import Paragraph from '@digigov/react-core/Paragraph';
-import { KitchensinkByCategory } from '@digigov/ui/utils/Kitchensink/KitchensinkByCategory';
-var _ref2 = /*#__PURE__*/React.createElement(Paragraph, {
-  fontSize: 72,
-  fontWeight: "bold"
-}, "Components");
-export var KitchenSinkDashboard = function KitchenSinkDashboard(_ref) {
-  var stories = _ref.stories;
-  var categoryOrder = Object.keys(stories).reduce(function (catStories, componentStoriesKey) {
-    var componentStories = stories[componentStoriesKey];
-    if (componentStories["default"].ignore) {
-      return catStories;
-    }
-    if (!componentStories["default"].component) {
-      throw new Error("no component was found in ".concat(componentStoriesKey));
-    }
-    var title = componentStories["default"].title.split('/')[1];
-    if (!title) {
-      throw new Error("no title was found for ".concat(componentStoriesKey));
-    }
-    var category = title;
-    if (catStories[category]) {
-      catStories[category].push(componentStories);
-    } else {
-      catStories[category] = [componentStories];
-    }
-    return catStories;
-  }, {});
-  return /*#__PURE__*/React.createElement("div", null, _ref2, /*#__PURE__*/React.createElement(KitchenSinkAllComponents, null, Object.keys(categoryOrder).sort(function (a, b) {
-    return a > b ? -1 : 1;
-  }).map(function (category, index) {
-    return /*#__PURE__*/React.createElement(KitchensinkByCategory, {
-      category: category,
-      stories: categoryOrder[category],
-      key: index
-    });
-  })));
-};

package/utils/Kitchensink/KitchensinkDashboard/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "main": "../../../cjs/utils/Kitchensink/KitchensinkDashboard/index.js"
-}

package/utils/Kitchensink/KitchensinkDashboard.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-export interface KitchenSinkDashboardInterface {
-    stories: any;
-}
-export declare const KitchenSinkDashboard: ({ stories, }: KitchenSinkDashboardInterface) => JSX.Element;