@digigov/react-core 0.2.0 → 0.3.0

package/dist/es/CallToAction/index.js

@@ -1,24 +1,22 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["disabled", "className", "children"];
+var _excluded = ["className", "children"];
 import React from 'react';
 import clsx from 'clsx';
+import ButtonLink from '@digigov/react-core/ButtonLink';
 
 /**
  * Use this button for the main call to action on your service’s start page.
  */
 export var CallToAction = /*#__PURE__*/React.forwardRef(function CallToAction(_ref, ref) {
-  var disabled = _ref.disabled,
-      className = _ref.className,
+  var className = _ref.className,
       children = _ref.children,
       props = _objectWithoutProperties(_ref, _excluded);
 
-  return /*#__PURE__*/React.createElement("button", _extends({
-    disabled: disabled,
+  return /*#__PURE__*/React.createElement(ButtonLink, _extends({
     ref: ref,
-    className: clsx(className, disabled === true && 'govgr-btn-disabled', true && ['govgr-btn', 'govgr-btn-primary', 'govgr-btn-cta'])
+    className: clsx(className, true && ['govgr-btn', 'govgr-btn-primary', 'govgr-btn-cta'])
   }, props), children, /*#__PURE__*/React.createElement("span", {
-    ref: ref,
     className: clsx(className, true && 'right-arrow')
   }));
 });

package/dist/es/CheckboxItem/__snapshots__/index.test.tsx.snap

@@ -1,5 +1,47 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`renders the CheckboxItem with \`name\` prop 1`] = `
+<ForwardRef(CheckboxItem)
+  name="example"
+>
+  <div
+    className="govgr-checkboxes__item"
+  >
+    <input
+      className="govgr-checkboxes__input"
+      name="example"
+      type="checkbox"
+    />
+    <label
+      className="govgr-label govgr-checkboxes__label"
+    >
+      hello
+    </label>
+  </div>
+</ForwardRef(CheckboxItem)>
+`;
+
+exports[`renders the CheckboxItem with \`value\` prop 1`] = `
+<ForwardRef(CheckboxItem)
+  value="example"
+>
+  <div
+    className="govgr-checkboxes__item"
+  >
+    <input
+      className="govgr-checkboxes__input"
+      type="checkbox"
+      value="example"
+    />
+    <label
+      className="govgr-label govgr-checkboxes__label"
+    >
+      hello
+    </label>
+  </div>
+</ForwardRef(CheckboxItem)>
+`;
+
 exports[`renders the CheckboxItem with no props 1`] = `
 <ForwardRef(CheckboxItem)>
   <div

package/dist/es/Container/index.js

@@ -16,7 +16,6 @@ export var Container = /*#__PURE__*/React.forwardRef(function Container(_ref, re
     ref: ref,
     className: clsx(className, true && 'govgr-width-container')
   }, props), /*#__PURE__*/React.createElement("div", _extends({
-    ref: ref,
     className: clsx(true && 'govgr-main-wrapper')
   }, props), children));
 });

package/dist/es/Grid/__snapshots__/index.test.tsx.snap

@@ -0,0 +1,105 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders the Grid with \`container\` props 1`] = `
+<ForwardRef(Grid)
+  container={true}
+>
+  <div
+    className="govgr-grid"
+  >
+    hello
+  </div>
+</ForwardRef(Grid)>
+`;
+
+exports[`renders the Grid with \`inline\` props 1`] = `
+<ForwardRef(Grid)
+  inline={true}
+>
+  <div
+    className="govgr-grid-inline"
+  >
+    hello
+  </div>
+</ForwardRef(Grid)>
+`;
+
+exports[`renders the Grid with \`lg\` props 1`] = `
+<ForwardRef(Grid)
+  lg={6}
+>
+  <div
+    className="lg:govgr-grid__col-span-6"
+  >
+    hello
+  </div>
+</ForwardRef(Grid)>
+`;
+
+exports[`renders the Grid with \`md\` props 1`] = `
+<ForwardRef(Grid)
+  md={6}
+>
+  <div
+    className="md:govgr-grid__col-span-6"
+  >
+    hello
+  </div>
+</ForwardRef(Grid)>
+`;
+
+exports[`renders the Grid with \`sm\` props 1`] = `
+<ForwardRef(Grid)
+  sm={6}
+>
+  <div
+    className="sm:govgr-grid__col-span-6"
+  >
+    hello
+  </div>
+</ForwardRef(Grid)>
+`;
+
+exports[`renders the Grid with \`spacing\` props 1`] = `
+<ForwardRef(Grid)
+  spacing={2}
+>
+  <div
+    className=""
+  >
+    hello
+  </div>
+</ForwardRef(Grid)>
+`;
+
+exports[`renders the Grid with \`xl\` props 1`] = `
+<ForwardRef(Grid)
+  xl={6}
+>
+  <div
+    className="xl:govgr-grid__col-span-6"
+  >
+    hello
+  </div>
+</ForwardRef(Grid)>
+`;
+
+exports[`renders the Grid with no props 1`] = `
+<ForwardRef(Grid)>
+  <div
+    className=""
+  >
+    hello
+  </div>
+</ForwardRef(Grid)>
+`;
+
+exports[`renders the Top with no props 1`] = `
+<ForwardRef(Top)>
+  <div
+    className="govgr-top"
+  >
+    hello
+  </div>
+</ForwardRef(Top)>
+`;

package/dist/es/Grid/index.js

@@ -0,0 +1,31 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["className", "children", "container", "item", "spacing", "inline", "xs", "sm", "md", "lg", "xl"];
+import React from 'react';
+import clsx from 'clsx';
+
+/**
+ * Grid is used to arrange other components in complex grid configurations of rows and columns.
+ */
+export var Grid = /*#__PURE__*/React.forwardRef(function Grid(_ref, ref) {
+  var className = _ref.className,
+      children = _ref.children,
+      _ref$container = _ref.container,
+      container = _ref$container === void 0 ? false : _ref$container,
+      _ref$item = _ref.item,
+      item = _ref$item === void 0 ? true : _ref$item,
+      spacing = _ref.spacing,
+      inline = _ref.inline,
+      xs = _ref.xs,
+      sm = _ref.sm,
+      md = _ref.md,
+      lg = _ref.lg,
+      xl = _ref.xl,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React.createElement("div", _extends({
+    ref: ref,
+    className: clsx(className, container === true && [inline === true && 'govgr-grid-inline', 'govgr-grid'], container && [spacing === 1 && "govgr-grid__gap-1", spacing === 2 && "govgr-grid__gap-2", spacing === 4 && "govgr-grid__gap-4", spacing === 6 && "govgr-grid__gap-6"], item && [xs === 'auto' && "xs:govgr-grid__col-auto", sm === 'auto' && "sm:govgr-grid__col-auto", md === 'auto' && "md:govgr-grid__col-auto", lg === 'auto' && "lg:govgr-grid__col-auto", xl === 'auto' && "xl:govgr-grid__col-auto", xs === 10 && "xs:govgr-grid__col-span-10", xs === 11 && "xs:govgr-grid__col-span-11", xs === 12 && "xs:govgr-grid__col-span-12", sm === 10 && "sm:govgr-grid__col-span-10", sm === 11 && "sm:govgr-grid__col-span-11", sm === 12 && "sm:govgr-grid__col-span-12", md === 10 && "md:govgr-grid__col-span-10", md === 11 && "md:govgr-grid__col-span-11", md === 12 && "md:govgr-grid__col-span-12", lg === 10 && "lg:govgr-grid__col-span-10", lg === 11 && "lg:govgr-grid__col-span-11", lg === 12 && "lg:govgr-grid__col-span-12", xl === 10 && "xl:govgr-grid__col-span-10", xl === 11 && "xl:govgr-grid__col-span-11", xl === 12 && "xl:govgr-grid__col-span-12", xs === 1 && "xs:govgr-grid__col-span-1", xs === 2 && "xs:govgr-grid__col-span-2", xs === 3 && "xs:govgr-grid__col-span-3", xs === 4 && "xs:govgr-grid__col-span-4", xs === 5 && "xs:govgr-grid__col-span-5", xs === 6 && "xs:govgr-grid__col-span-6", xs === 7 && "xs:govgr-grid__col-span-7", xs === 8 && "xs:govgr-grid__col-span-8", xs === 9 && "xs:govgr-grid__col-span-9", sm === 1 && "sm:govgr-grid__col-span-1", sm === 2 && "sm:govgr-grid__col-span-2", sm === 3 && "sm:govgr-grid__col-span-3", sm === 4 && "sm:govgr-grid__col-span-4", sm === 5 && "sm:govgr-grid__col-span-5", sm === 6 && "sm:govgr-grid__col-span-6", sm === 7 && "sm:govgr-grid__col-span-7", sm === 8 && "sm:govgr-grid__col-span-8", sm === 9 && "sm:govgr-grid__col-span-9", md === 1 && "md:govgr-grid__col-span-1", md === 2 && "md:govgr-grid__col-span-2", md === 3 && "md:govgr-grid__col-span-3", md === 4 && "md:govgr-grid__col-span-4", md === 5 && "md:govgr-grid__col-span-5", md === 6 && "md:govgr-grid__col-span-6", md === 7 && "md:govgr-grid__col-span-7", md === 8 && "md:govgr-grid__col-span-8", md === 9 && "md:govgr-grid__col-span-9", lg === 1 && "lg:govgr-grid__col-span-1", lg === 2 && "lg:govgr-grid__col-span-2", lg === 3 && "lg:govgr-grid__col-span-3", lg === 4 && "lg:govgr-grid__col-span-4", lg === 5 && "lg:govgr-grid__col-span-5", lg === 6 && "lg:govgr-grid__col-span-6", lg === 7 && "lg:govgr-grid__col-span-7", lg === 8 && "lg:govgr-grid__col-span-8", lg === 9 && "lg:govgr-grid__col-span-9", xl === 1 && "xl:govgr-grid__col-span-1", xl === 2 && "xl:govgr-grid__col-span-2", xl === 3 && "xl:govgr-grid__col-span-3", xl === 4 && "xl:govgr-grid__col-span-4", xl === 5 && "xl:govgr-grid__col-span-5", xl === 6 && "xl:govgr-grid__col-span-6", xl === 7 && "xl:govgr-grid__col-span-7", xl === 8 && "xl:govgr-grid__col-span-8", xl === 9 && "xl:govgr-grid__col-span-9"])
+  }, props), children);
+});
+export default Grid;

package/dist/es/Grid/index.test.js

@@ -0,0 +1,65 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import Grid from '@digigov/react-core/Grid';
+
+var _ref = /*#__PURE__*/React.createElement(Grid, null, "hello");
+
+it('renders the Grid with no props', function () {
+  expect(mount(_ref)).toMatchSnapshot();
+});
+
+var _ref2 = /*#__PURE__*/React.createElement(Grid, {
+  container: true
+}, "hello");
+
+it('renders the Grid with `container` props', function () {
+  expect(mount(_ref2)).toMatchSnapshot();
+});
+
+var _ref3 = /*#__PURE__*/React.createElement(Grid, {
+  inline: true
+}, "hello");
+
+it('renders the Grid with `inline` props', function () {
+  expect(mount(_ref3)).toMatchSnapshot();
+});
+
+var _ref4 = /*#__PURE__*/React.createElement(Grid, {
+  spacing: 2
+}, "hello");
+
+it('renders the Grid with `spacing` props', function () {
+  expect(mount(_ref4)).toMatchSnapshot();
+});
+
+var _ref5 = /*#__PURE__*/React.createElement(Grid, {
+  sm: 6
+}, "hello");
+
+it('renders the Grid with `sm` props', function () {
+  expect(mount(_ref5)).toMatchSnapshot();
+});
+
+var _ref6 = /*#__PURE__*/React.createElement(Grid, {
+  lg: 6
+}, "hello");
+
+it('renders the Grid with `lg` props', function () {
+  expect(mount(_ref6)).toMatchSnapshot();
+});
+
+var _ref7 = /*#__PURE__*/React.createElement(Grid, {
+  md: 6
+}, "hello");
+
+it('renders the Grid with `md` props', function () {
+  expect(mount(_ref7)).toMatchSnapshot();
+});
+
+var _ref8 = /*#__PURE__*/React.createElement(Grid, {
+  xl: 6
+}, "hello");
+
+it('renders the Grid with `xl` props', function () {
+  expect(mount(_ref8)).toMatchSnapshot();
+});

package/dist/es/HeaderLogo/__snapshots__/index.test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`renders the HeaderLogo with no props 1`] = `
 <ForwardRef(HeaderLogo)>
   <a
-    className="govuk-header-link"
+    className="govgr-header-link"
     href="https://www.gov.gr/"
   >
     <img

package/dist/es/HeaderLogo/index.js

@@ -1,22 +1,24 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["className"];
+var _excluded = ["href", "src", "className"];
 import React from 'react';
 import clsx from 'clsx';
 
 /**
- * Use this component inside the Header to provide the gov.gr logo.
+ * Use this component inside the Header to provide a logo.
  */
 export var HeaderLogo = /*#__PURE__*/React.forwardRef(function HeaderLogo(_ref, ref) {
-  var className = _ref.className,
+  var href = _ref.href,
+      src = _ref.src,
+      className = _ref.className,
       props = _objectWithoutProperties(_ref, _excluded);
 
   return /*#__PURE__*/React.createElement("a", _extends({
-    href: "https://www.gov.gr/",
+    href: href,
     ref: ref,
-    className: clsx(className, true && 'govuk-header-link')
+    className: clsx(className, true && 'govgr-header-link')
   }, props), /*#__PURE__*/React.createElement("img", {
-    src: "https://www.gov.gr/gov_gr_logo.svg",
+    src: src,
     className: clsx(className, true && 'govgr-header-logo')
   }));
 });

package/dist/es/HeaderSecondaryLogo/__snapshots__/index.test.tsx.snap

@@ -5,7 +5,7 @@ exports[`renders the HeaderSecondaryLogo with src 1`] = `
   src="https://dilosi.services.gov.gr/minedu-logo.svg"
 >
   <a
-    className="govuk-header-link"
+    className="govgr-header-link"
   >
     <img
       className="govgr-header-secondary-logo"
@@ -21,7 +21,7 @@ exports[`renders the HeaderSecondaryLogo with src and href 1`] = `
   src="https://dilosi.services.gov.gr/minedu-logo.svg"
 >
   <a
-    className="govuk-header-link"
+    className="govgr-header-link"
     href="https://www.minedu.gov.gr/"
   >
     <img

package/dist/es/HeaderSecondaryLogo/index.js

@@ -16,7 +16,7 @@ export var HeaderSecondaryLogo = /*#__PURE__*/React.forwardRef(function HeaderSe
   return /*#__PURE__*/React.createElement("a", _extends({
     href: href,
     ref: ref,
-    className: clsx(className, true && 'govuk-header-link')
+    className: clsx(className, true && 'govgr-header-link')
   }, props), /*#__PURE__*/React.createElement("img", {
     src: src,
     className: clsx(className, true && 'govgr-header-secondary-logo')

package/dist/es/Heading/index.js

@@ -4,20 +4,39 @@ var _excluded = ["size", "element", "className", "children"];
 import React from 'react';
 import clsx from 'clsx';
 
+var getComponentBySize = function getComponentBySize(size) {
+  switch (size) {
+    case 'xl':
+      return 'h1';
+
+    case 'l':
+      return 'h2';
+
+    case 'm':
+      return 'h3';
+
+    case 's':
+      return 'h4';
+
+    default:
+      return 'h1';
+  }
+};
 /**
  * Heading component is used to place a title in a the page.
  * Heading component must be wraped inside Main component.
  */
+
+
 export var Heading = /*#__PURE__*/React.forwardRef(function Heading(_ref, ref) {
   var _ref$size = _ref.size,
       size = _ref$size === void 0 ? 'xl' : _ref$size,
-      _ref$element = _ref.element,
-      element = _ref$element === void 0 ? 'h1' : _ref$element,
+      element = _ref.element,
       className = _ref.className,
       children = _ref.children,
       props = _objectWithoutProperties(_ref, _excluded);
 
-  var Component = element;
+  var Component = element ? element : getComponentBySize(size);
   return /*#__PURE__*/React.createElement(Component, _extends({
     ref: ref,
     className: clsx(className, size === 'xl' && 'govgr-heading-xl', size === 'l' && 'govgr-heading-l', size === 'm' && 'govgr-heading-m', size === 's' && 'govgr-heading-s')

package/dist/es/HellenicRepublicLogo/index.js

@@ -1,22 +1,24 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["src", "className", "children"];
+var _excluded = ["lang", "className", "children"];
 import React from 'react';
 import clsx from 'clsx';
+import logoEl from '@digigov/react-core/HellenicRepublicLogo/logo-el';
+import logoEn from '@digigov/react-core/HellenicRepublicLogo/logo-en';
 
 /**
  * HellenicRepublicLogo is used mainly at the Footer.
  * This component can't have children.
  */
 export var HellenicRepublicLogo = /*#__PURE__*/React.forwardRef(function HellenicRepublicLogo(_ref, ref) {
-  var _ref$src = _ref.src,
-      src = _ref$src === void 0 ? 'https://government.gov.gr/wp-content/uploads/2017/09/kyvernisi-logo-small-1.png' : _ref$src,
+  var lang = _ref.lang,
       className = _ref.className,
       children = _ref.children,
       props = _objectWithoutProperties(_ref, _excluded);
 
+  var logo = lang === 'en' ? logoEn : logoEl;
   return /*#__PURE__*/React.createElement("img", _extends({
-    src: src,
+    src: logo,
     ref: ref,
     className: clsx(className, true && 'govgr-footer__government-logo')
   }, props), children);