@mjhls/mjh-framework 1.0.14 → 1.0.16

package/dist/index.es.js

@@ -1,10 +1,12 @@
-import React__default, { Component, createElement, createContext } from 'react';
+import React__default, { Component, useState, createElement, createContext } from 'react';
 import Row from 'react-bootstrap/Row';
 import Col from 'react-bootstrap/Col';
 import Card from 'react-bootstrap/Card';
 import Link from 'next/link';
 import ListGroup from 'react-bootstrap/ListGroup';
 import Head from 'next/head';
+import Accordion from 'react-bootstrap/Accordion';
+import { useAccordionToggle } from 'react-bootstrap/AccordionToggle';
 import Container from 'react-bootstrap/Container';
 import Nav from 'react-bootstrap/Nav';
 import Navbar from 'react-bootstrap/Navbar';
@@ -13,6 +15,8 @@ import Form from 'react-bootstrap/Form';
 import FormControl from 'react-bootstrap/FormControl';
 import Button from 'react-bootstrap/Button';
 import PropTypes from 'prop-types';
+import { Figure, Carousel } from 'react-bootstrap';
+import imageUrlBuilder from '@sanity/image-url';
 
 /*! *****************************************************************************
 Copyright (c) Microsoft Corporation. All rights reserved.
@@ -480,6 +484,44 @@ var possibleConstructorReturn = function (self, call) {
   return call && (typeof call === "object" || typeof call === "function") ? call : self;
 };
 
+var slicedToArray = function () {
+  function sliceIterator(arr, i) {
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _e = undefined;
+
+    try {
+      for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+        _arr.push(_s.value);
+
+        if (i && _arr.length === i) break;
+      }
+    } catch (err) {
+      _d = true;
+      _e = err;
+    } finally {
+      try {
+        if (!_n && _i["return"]) _i["return"]();
+      } finally {
+        if (_d) throw _e;
+      }
+    }
+
+    return _arr;
+  }
+
+  return function (arr, i) {
+    if (Array.isArray(arr)) {
+      return arr;
+    } else if (Symbol.iterator in Object(arr)) {
+      return sliceIterator(arr, i);
+    } else {
+      throw new TypeError("Invalid attempt to destructure non-iterable instance");
+    }
+  };
+}();
+
 var toConsumableArray = function (arr) {
   if (Array.isArray(arr)) {
     for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];
@@ -1148,6 +1190,88 @@ function IconBase(props) {
   }) : elem(DefaultContext);
 }
 
+// THIS FILE IS AUTO GENERATED
+var IoMdArrowDropdown = function (props) {
+  return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 512 512"},"child":[{"tag":"path","attr":{"d":"M128 192l128 128 128-128z"}}]})(props);
+};
+IoMdArrowDropdown.displayName = "IoMdArrowDropdown";
+
+var AccordionPanel = function AccordionPanel(props) {
+  var accordionClassName = props.accordionClassName,
+      data = props.data;
+
+  var _useState = useState('0'),
+      _useState2 = slicedToArray(_useState, 2),
+      activeAccordionKey = _useState2[0],
+      setaAtiveAccordionKey = _useState2[1];
+
+  var handleAccordion = function handleAccordion(id) {
+    setaAtiveAccordionKey(id);
+  };
+
+  var CustomToggle = function CustomToggle(_ref) {
+    var children = _ref.children,
+        eventKey = _ref.eventKey;
+
+    var decoratedOnClick = useAccordionToggle(eventKey, function () {
+      return handleAccordion(eventKey);
+    });
+    return React__default.createElement(
+      'div',
+      { onMouseEnter: decoratedOnClick, className: 'accordion-head' },
+      children
+    );
+  };
+
+  return React__default.createElement(
+    React__default.Fragment,
+    null,
+    data && data.length && React__default.createElement(
+      Accordion,
+      { defaultActiveKey: '0', activeKey: activeAccordionKey, className: accordionClassName },
+      data.map(function (item) {
+        return React__default.createElement(
+          React__default.Fragment,
+          null,
+          React__default.createElement(
+            CustomToggle,
+            { key: item.id, eventKey: item.id },
+            React__default.createElement(
+              Link,
+              { href: item.url },
+              React__default.createElement(
+                React__default.Fragment,
+                null,
+                item.title,
+                item.subItems && React__default.createElement(IoMdArrowDropdown, null)
+              )
+            )
+          ),
+          React__default.createElement(
+            Accordion.Collapse,
+            { eventKey: item.id },
+            React__default.createElement(
+              'div',
+              null,
+              item.subItems && item.subItems.map(function (subItem) {
+                return React__default.createElement(
+                  Link,
+                  { href: subItem.url },
+                  React__default.createElement(
+                    'div',
+                    { key: subItem.id, className: 'accordion-sub-item' },
+                    subItem.title
+                  )
+                );
+              })
+            )
+          )
+        );
+      })
+    )
+  );
+};
+
 // THIS FILE IS AUTO GENERATED
 var MdSearch = function (props) {
   return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 24 24"},"child":[{"tag":"path","attr":{"d":"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"}}]})(props);
@@ -1300,7 +1424,9 @@ var NavMagazine = function NavMagazine(props) {
 
 var NavNative = function NavNative(props) {
   var logo = props.logo,
-      dataObject = props.dataObject;
+      dataObject = props.dataObject,
+      _props$variant = props.variant,
+      variant = _props$variant === undefined ? 'dark' : _props$variant;
 
 
   return React__default.createElement(
@@ -1308,7 +1434,7 @@ var NavNative = function NavNative(props) {
     null,
     React__default.createElement(
       Navbar,
-      { variant: 'dark', expand: 'lg', bg: 'primary' },
+      { variant: variant, expand: 'lg', bg: 'primary' },
       React__default.createElement(
         Container,
         null,
@@ -1324,29 +1450,38 @@ var NavNative = function NavNative(props) {
           React__default.createElement(
             Nav,
             { className: 'mr-auto' },
-            dataObject && dataObject.map(function (row) {
-              if (row.type === 'dropdown') {
+            dataObject && dataObject.map(function (row, index) {
+              if (row.subQuery.length > 1) {
                 return React__default.createElement(
                   NavDropdown,
                   { title: row.name, id: 'basic-nav-dropdown' },
-                  row.dropdown && row.dropdown.map(function (ddRow) {
+                  row.subQuery && row.subQuery.map(function (ddRow, subIndex) {
                     if (ddRow.type === 'divider') {
                       return React__default.createElement(NavDropdown.Divider, null);
                     } else {
                       return React__default.createElement(
-                        NavDropdown.Item,
+                        Link,
                         { href: ddRow.url },
-                        ddRow.name
+                        React__default.createElement(
+                          'a',
+                          { key: subIndex, className: 'dropdown-item' },
+                          ddRow.name
+                        )
                       );
                     }
                   })
                 );
               } else {
                 // Link default
+                // return <Nav.Link href={row.url} key={index}>{row.name}</Nav.Link>
                 return React__default.createElement(
-                  Nav.Link,
+                  Link,
                   { href: row.url },
-                  row.name
+                  React__default.createElement(
+                    'a',
+                    { key: index, className: 'nav-link' },
+                    row.name
+                  )
                 );
               }
             })
@@ -1449,6 +1584,126 @@ var NavNormal = function NavNormal(props) {
   );
 };
 
+var NavDvm = function NavDvm(props) {
+  var logo = props.logo,
+      dataObject = props.dataObject,
+      subNavHeads = props.subNavHeads;
+
+
+  return React__default.createElement(
+    'section',
+    null,
+    React__default.createElement(
+      Navbar,
+      { expand: 'md', className: 'header-container', style: { background: '#151F5D' } },
+      React__default.createElement(
+        Container,
+        { className: 'd-flex px-0' },
+        React__default.createElement(
+          'div',
+          { className: 'd-flex' },
+          React__default.createElement('img', { src: logo, className: 'h-100' }),
+          React__default.createElement('div', { className: ' ml-4' })
+        ),
+        React__default.createElement(
+          'div',
+          { className: 'login-right-wrapper w-50  my-3', style: { background: 'linear-gradient(to right,#104676,#01ABB5)' } },
+          React__default.createElement(
+            'div',
+            { className: 'row' },
+            subNavHeads && subNavHeads.map(function (item, index) {
+              return React__default.createElement(
+                'div',
+                { key: index, className: 'col-3 py-1', style: { fontSize: '12px' } },
+                React__default.createElement(
+                  'span',
+                  { style: { color: '#fff' } },
+                  item.name,
+                  ' '
+                )
+              );
+            })
+          )
+        )
+      )
+    ),
+    React__default.createElement(
+      Navbar,
+      { variant: 'dark', className: 'dvm-nav p-0', style: { background: 'linear-gradient(to right,#FFB71C,#ED4303,#EB3300)' } },
+      React__default.createElement(
+        Container,
+        null,
+        React__default.createElement(Navbar.Toggle, { 'aria-controls': 'basic-navbar-nav' }),
+        React__default.createElement(
+          Navbar.Collapse,
+          { id: 'basic-navbar-nav' },
+          React__default.createElement(
+            Nav,
+            { className: 'mr-auto' },
+            dataObject && dataObject.map(function (row, index) {
+              if (row.subQuery.length > 1) {
+                return React__default.createElement(
+                  NavDropdown,
+                  { key: index, title: row.name, id: 'basic-nav-dropdown' },
+                  row.subQuery && row.subQuery.map(function (ddRow, ddItems, subIndex) {
+                    if (ddRow.type === 'divider') {
+                      return React__default.createElement(NavDropdown.Divider, { key: subIndex });
+                    } else {
+                      return React__default.createElement(
+                        Link,
+                        { href: ddRow.url },
+                        React__default.createElement(
+                          'a',
+                          { key: subIndex, className: 'dropdown-item' },
+                          ddRow.name
+                        )
+                      );
+                    }
+                  })
+                );
+              } else {
+                return React__default.createElement(
+                  Link,
+                  { href: row.url },
+                  React__default.createElement(
+                    'a',
+                    { key: index, className: 'nav-link' },
+                    row.name
+                  )
+                );
+              }
+            })
+          ),
+          React__default.createElement(
+            'div',
+            { className: 'login-subscibe', style: { fontSize: '12px' } },
+            React__default.createElement(
+              'span',
+              { style: { color: '#FFDC3F' } },
+              '>> ',
+              React__default.createElement(
+                'span',
+                { style: { color: '#fff' } },
+                ' Login'
+              )
+            ),
+            React__default.createElement(
+              'span',
+              { style: { color: '#FFDC3F' } },
+              '>> ',
+              React__default.createElement(
+                'span',
+                { style: { color: '#fff' } },
+                ' Register'
+              )
+            )
+          )
+        )
+      )
+    )
+  );
+};
+
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
 function unwrapExports (x) {
@@ -3177,6 +3432,8 @@ var TemplateNormal = function TemplateNormal(props) {
         return React__default.createElement(NavMagazine, { logo: website.logo, dataObject: config.navItems });
       case 'native':
         return React__default.createElement(NavNative, { logo: website.logo, dataObject: config.navItems });
+      case 'dvm':
+        return React__default.createElement(NavDvm, { logo: website.logo, dataObject: config.navItems });
       default:
         return React__default.createElement('noNav', null);
     }
@@ -3244,6 +3501,46 @@ var AD300x250x600 = function AD300x250x600(_ref) {
   });
 };
 
+var FigureComponent = function FigureComponent(_ref) {
+  var caption = _ref.caption,
+      url = _ref.url;
+
+  return React__default.createElement(
+    'div',
+    { style: { textAlign: 'center', marginTop: '1em', marginBottom: '1em' } },
+    React__default.createElement(
+      Figure,
+      null,
+      React__default.createElement(Figure.Image, { alt: caption, src: url }),
+      React__default.createElement(
+        Figure.Caption,
+        null,
+        caption
+      )
+    )
+  );
+};
+
+var Slideshow = function Slideshow(_ref) {
+  var slides = _ref.slides;
+
+  return React__default.createElement(
+    'div',
+    { style: { marginTop: '1em', marginBottom: '1em' } },
+    React__default.createElement(
+      Carousel,
+      null,
+      slides && slides.map(function (slide) {
+        return React__default.createElement(
+          Carousel.Item,
+          { key: slide._key },
+          React__default.createElement('img', { style: { width: '100%' }, src: slide.url, alt: slide.asset.originalFilename })
+        );
+      })
+    )
+  );
+};
+
 var getYoutubeId = createCommonjsModule(function (module, exports) {
 (function (root, factory) {
   {
@@ -5909,19 +6206,45 @@ YouTube.PlayerState = {
   CUED: 5
 };
 
-var getSerializers = function getSerializers() {
+var YouTubePlayer$1 = function YouTubePlayer(_ref) {
+  var url = _ref.url;
+
+  var id = getYoutubeId(url);
+  return React__default.createElement(YouTube, { videoId: id, opts: { width: '100%' } });
+};
+
+var urlFor = function urlFor(source, client) {
+  return imageUrlBuilder(client).image(source);
+};
+
+var getSerializers = function getSerializers(client) {
   return {
     types: {
       youtube: function youtube(_ref) {
         var node = _ref.node;
         var url = node.url;
 
-        var id = getYoutubeId(url);
-        return React__default.createElement(YouTube, { videoId: id, className: 'youtube' });
+        return React__default.createElement(YouTubePlayer$1, { url: url });
+      },
+      figure: function figure(_ref2) {
+        var node = _ref2.node;
+        var asset = node.asset,
+            caption = node.caption;
+
+        var url = urlFor(asset, client).url();
+        return React__default.createElement(FigureComponent, { caption: caption, url: url });
+      },
+      slideshow: function slideshow(_ref3) {
+        var node = _ref3.node;
+
+        var slides = node.slides && node.slides.map(function (slide) {
+          return Object.assign(slide, { url: urlFor(slide.asset, client).url() });
+        });
+        return React__default.createElement(Slideshow, { slides: slides });
       }
     }
   };
 };
 
-export { DeckContent, DeckQueue, Column1, Column2, Column3, Header, LeftNav, NavMagazine, NavNative, NavNormal, TemplateNormal, AD300x250, AD300x250x600, AD728x90, getSerializers };
+export { DeckContent, DeckQueue, Column1, Column2, Column3, Header, LeftNav, AccordionPanel, NavMagazine, NavNative, NavNormal, NavDvm, TemplateNormal, AD300x250, AD300x250x600, AD728x90, getSerializers };
 //# sourceMappingURL=index.es.js.map