Merge branch 'release/1.2' of github.com:bigbite/build-tools into rel…

…ease/1.2

configs/eslint.js

@@ -40,6 +40,7 @@ module.exports = (projectConfig) => {
       'react/jsx-filename-extension': [1, { extensions: ['.js', '.jsx'] }],
       'react/react-in-jsx-scope': 0,
       'react/forbid-prop-types': 0,
+      'react/require-default-props': 0,
       'arrow-parens': 2,
       'jsdoc/require-jsdoc': [
         'error',

example-site/package.json

@@ -1,3 +1,6 @@
 {
-    "name": "test-project"
-}
+    "name": "test-project",
+    "dependencies": {
+        "prop-types": "^15.8.1"
+    }
+}

example-site/plugins/test-plugin/src/components/DisplayComponent.js

@@ -2,6 +2,8 @@ import SVGAsComponent from '@Static/logo.svg';
 import SVGAsURL from '@Static/svg-file.svg?url';
 import MailIconPNG from '@Static/mail-icon.png';
 
+import TestComponent from './TestComponent';
+
 /**
  * Display Component for an example block.
  */
@@ -12,6 +14,7 @@ export default () => (
       <img src={SVGAsURL} alt="Reference and SVG as the url" />
     </div>
     <div>Example Block</div>
+    <TestComponent additionalValue="This is not hidden" />
     <div>
       <img src={MailIconPNG} alt="PNG Mail Icon for testing usage." />
     </div>

example-site/plugins/test-plugin/src/components/TestComponent.js

@@ -0,0 +1,24 @@
+import PropTypes from 'prop-types';
+import { __ } from '@wordpress/i18n';
+
+/**
+ *
+ * @param {object} props Props for the component.
+ * @param {boolean} props.hiddenText Whether to hide the text.
+ * @param {string} props.additionalValue The value to output when text is not hidden.
+ * @returns
+ */
+const TestComponent = ({ hiddenText = false, additionalValue }) => {
+  if (hiddenText) {
+    return <div>{__('Hidden', 'bigbite-build-tools')}</div>;
+  }
+
+  return <div>{__(`My additional value is ${additionalValue}`, 'bigbite-build-tools')}</div>;
+};
+
+TestComponent.propTypes = {
+  hiddenText: PropTypes.bool,
+  additionalValue: PropTypes.string.isRequired,
+};
+
+export default TestComponent;