Merge pull request #171 from WebDevStudios/fix/split-lazyblocks

Fix/split lazyblocks

Author: Greg Rickaby

components/atoms/Code/Code.js

@@ -1,19 +1,18 @@
 import PropTypes from 'prop-types'
 import React from 'react'
-import styles from './Code.module.css'
 import {Prism as SyntaxHighlighter} from 'react-syntax-highlighter'
 import {tomorrow} from 'react-syntax-highlighter/dist/cjs/styles/prism'
+import styles from './Code.module.css'
 
 /**
  * Render the Code component.
  *
  * @author WebDevStudios
- * @param {object}      props           The component attributes as props.
- * @param {string}      props.className Optional classname.
- * @param props.id
- * @param props.content
- * @param {boolean}     props.fullWidth Is this a fullwidth block.
- * @return {Element} The Code component.
+ * @param {object} props           The component attributes as props.
+ * @param {string} props.className Optional classname.
+ * @param {string} props.id        The optional ID.
+ * @param {string} props.content   The content for inside the code block.
+ * @return {Element}               The Code component.
  */
 export default function Code({id, className, content}) {
   // Use the className to pass the langauge.

components/atoms/Image/Image.js

@@ -1,26 +1,26 @@
+import RichText from '@/components/atoms/RichText'
+import cn from 'classnames'
 import Link from 'next/link'
 import PropTypes from 'prop-types'
 import React from 'react'
-import RichText from '@/components/atoms/RichText'
 import styles from './Image.module.css'
-import cn from 'classnames'
 
 /**
  * Render the Image component.
  *
  * @author WebDevStudios
- * @param {string} anchor     The anchor/id of the block.
- * @param {string} alt        The image alt text.
- * @param {string} caption    The image caption.
- * @param {string} className  The image class.
- * @param {string} id         The image ID.
- * @param {string} href       The URL of the link.
- * @param {string} linkTarget Target for the link.
- * @param {string} linkClass  Class for the link.
- * @param {string} rel        The rel attribute for the link.
- * @param {string} sizeSlug   The WP image size.
- * @param {string} url        The full URL path of the image.
- * @return {Element} The Image component.
+ * @param {object} props            The component properties.
+ * @param {string} props.anchor     The anchor/id of the block.
+ * @param {string} props.alt        The image alt text.
+ * @param {string} props.caption    The image caption.
+ * @param {string} props.className  The image class.
+ * @param {string} props.id         The image ID.
+ * @param {string} props.href       The URL of the link.
+ * @param {string} props.linkTarget Target for the link.
+ * @param {string} props.linkClass  Class for the link.
+ * @param {string} props.rel        The rel attribute for the link.
+ * @param {string} props.url        The full URL path of the image.
+ * @return {Element}                The Image component.
  */
 export default function Image({
   alt,
@@ -80,6 +80,5 @@ Image.propTypes = {
   linkClass: PropTypes.string,
   linkTarget: PropTypes.string,
   rel: PropTypes.string,
-  sizeSlug: PropTypes.string,
   url: PropTypes.string
 }

components/atoms/PullQuote/PullQuote.js

@@ -7,11 +7,12 @@ import styles from './PullQuote.module.css'
  * PullQuote Block
  *
  * @author WebDevStudios
- * @param {string} value     The pull quote content of the block.
- * @param {string} citation  The optional author citation.
- * @param {string} id        Optional anchor/id.
- * @param {string} className Optional classnames.
- * @return {Element} The PullQuote component.
+ * @param {object} props           The component properties.
+ * @param {string} props.value     The pull quote content of the block.
+ * @param {string} props.citation  The optional author citation.
+ * @param {string} props.id        Optional anchor/id.
+ * @param {string} props.className Optional classnames.
+ * @return {Element}               The PullQuote component.
  */
 export default function PullQuote({value, citation, id, className}) {
   return (

components/atoms/Quote/Quote.js

@@ -9,11 +9,12 @@ import styles from './Quote.module.css'
  * The core Quote block from Gutenberg.
  *
  * @author WebDevStudios
- * @param {string} value     The quote content of the block.
- * @param {string} citation  The optional author citation.
- * @param {string} id        Optional anchor/id.
- * @param {string} className Optional classnames.
- * @return {Element} The Quote component.
+ * @param {object} props           The component properties.
+ * @param {string} props.value     The quote content of the block.
+ * @param {string} props.citation  The optional author citation.
+ * @param {string} props.id        Optional anchor/id.
+ * @param {string} props.className Optional classnames.
+ * @return {Element}               The Quote component.
  */
 export default function Quote({value, citation, id, className}) {
   return (

components/atoms/Separator/Separator.js

@@ -8,9 +8,10 @@ import styles from './Separator.module.css'
  * Render the Separator component.
  *
  * @author WebDevStudios
- * @param {string}  className Optional classname.
- * @param {boolean} fullWidth Is this a fullwidth block.
- * @return {Element} The Separator component.
+ * @param {object}  props           The component properties.
+ * @param {string}  props.className Optional classname.
+ * @param {boolean} props.fullWidth Is this a fullwidth block.
+ * @return {Element}                The Separator component.
  */
 export default function Separator({className, fullWidth}) {
   return (

components/atoms/Spacer/Spacer.js

@@ -5,9 +5,10 @@ import React from 'react'
  * Render the Spacer component.
  *
  * @author WebDevStudios
- * @param {string} anchor Optional anchor/id.
- * @param {number} height The height of the spacer.
- * @return {Element} The Spacer component.
+ * @param {object} props        The component properties.
+ * @param {string} props.anchor Optional anchor/id.
+ * @param {number} props.height The height of the spacer.
+ * @return {Element}            The Spacer component.
  */
 export default function Spacer({height, anchor}) {
   const rootEmVal = 16

components/atoms/Table/Table.js

@@ -7,14 +7,14 @@ import styles from './Table.module.css'
  * Table Block
  *
  * @author WebDevStudios
- * @param {string} id        Optional anchor/id.
- * @param {string} head      The optional table head array.
- * @param {string} body      The table body array.
- * @param {string} body      The table body array.
- * @param {string} foot      The optional table foorter array.
- * @param {string} caption   Optional table caption.
- * @param {string} className Optional classnames.
- * @return {Element} The Table component.
+ * @param {object} props           The component properties.
+ * @param {string} props.id        Optional anchor/id.
+ * @param {string} props.head      The optional table head array.
+ * @param {string} props.body      The table body array.
+ * @param {string} props.foot      The optional table foorter array.
+ * @param {string} props.caption   Optional table caption.
+ * @param {string} props.className Optional classnames.
+ * @return {Element}               The Table component.
  */
 export default function Table({id, head, body, foot, caption, className}) {
   return (

components/blocks/BlockHero/index.js

@@ -6,7 +6,9 @@ import PropTypes from 'prop-types'
  * A custom ACF Block for displaying accordions.
  *
  * @author WebDevStudios
- * @param {object} props The component attributes as props.
+ * @param {object} props       The component props.
+ * @param {object} props.props The component attributes as props.
+ * @return {Element}           The Accordion component.
  */
 export default function BlockAccordions({props}) {
   const {