@caweb/cli 1.1.0 → 1.2.0

package/lib/template/assets/css/popover.css

@@ -0,0 +1,80 @@
+
+  .popover-content {
+    position: absolute;
+    display: flex;
+    flex-direction: column-reverse;
+    row-gap: .5rem;
+    left: -10000px;
+    top: auto;
+    width: 1px;
+    height: 1px;
+    background-color: white;
+    padding: 1rem;
+    z-index: 100;
+    outline: 0;
+    border-radius: .5rem;
+    overflow: visible;
+    pointer-events: none;
+    --shadow-color: 220 3% 15%;
+    --shadow-strength: 1%;
+    box-shadow:  5px 7px 15px grey;
+  }
+  .popover-content:focus {
+    outline: 2px solid var(--highlight-color, #fec02f);
+  }
+  
+  .popover-container {
+    position: relative;
+    width: fit-content;
+  }
+  
+  .popover-content::before {
+    content: '';
+    position: absolute;
+    width: 1rem;
+    height: 1rem;
+    left: 0;
+    top: 50%;
+    background-color: white;
+    transform: translate(-50%, -50%) rotate(45deg);
+  }
+  .popover-revealed {
+    width: max-content;
+    height: max-content;
+    left: var(--x);
+    top: var(--y);
+    transform: translateY(-50%);
+  }
+  @media screen and (max-width: 950px) {
+    .popover-content::before {
+      content: none;
+    }
+    .popover-revealed {
+      left: calc(50% + var(--x-offset-m, 0%));
+      transform: translate(-50%, 0);
+    }
+  }
+  
+  .popover-legend {
+    display: flex;
+    flex-direction: row;
+    gap: .75rem;
+    align-items: flex-start;
+  }
+  
+  .popover-legend svg {
+    height: 1.5em;
+  }
+
+  .popover-revealed p {
+    font-weight: 400;
+    font-size: 1em;
+  }
+  
+  .popover-header {
+    margin: 0;
+  }
+  
+  .popover-stat {
+    margin: 0 0 .5rem 0;
+  }

package/lib/template/assets/js/popover.js

@@ -0,0 +1,30 @@
+jQuery( document ).ready( function ( $ ) { // eslint-disable-line
+	$( document ).on( 'mouseover', '.popover', function ( ele ) {
+		togglePopover( ele.currentTarget.id );
+	} );
+
+	$( document ).on( 'mouseout', '.popover', function ( ele ) {
+		togglePopover( ele.currentTarget.id, false );
+	} );
+
+	function togglePopover( id, popin = true ) {
+		if ( undefined !== id ) {
+			const current = $( '#' + id );
+			const popver = $( '#' + id + '-popover' );
+
+			if ( popin ) {
+				current.addClass( 'highlighted' );
+
+				if ( undefined !== popver ) {
+					$( popver ).addClass( 'popover-revealed' );
+				}
+			} else {
+				current.removeClass( 'highlighted' );
+
+				if ( undefined !== popver ) {
+					$( popver ).removeClass( 'popover-revealed' );
+				}
+			}
+		}
+	}
+} );

package/lib/template/block/edit.js.mustache

@@ -0,0 +1,48 @@
+/**
+ * Retrieves the translation of text.
+ *
+ * @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-i18n/
+ */
+import { __ } from '@wordpress/i18n';
+
+/**
+ * React hook that is used to mark the block wrapper element.
+ * It provides all the necessary props like the class name.
+ *
+ * @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-block-editor/
+ * @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-block-editor/#useblockprops
+ * @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-block-editor/#richtext
+ * @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-block-editor/#innerblocks
+ */
+import { useBlockProps, RichText, InnerBlocks } from '@wordpress/block-editor';
+
+/**
+ * Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
+ * Those files can contain any CSS code that gets applied to the editor.
+ *
+ * @see https://www.npmjs.com/package/@wordpress/scripts#using-css
+ */
+import './editor.scss';
+
+/**
+ * The edit function describes the structure of your block in the context of the
+ * editor. This represents what the editor will render when the block is used.
+ *
+ * @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-edit-save/#edit
+ *
+ * @return {WPElement} Element to render.
+ */
+export default function Edit(props) {
+	let { 
+		setAttributes, 
+		attributes: {}
+	} = props;
+
+	const blockProps = useBlockProps();
+
+    return(
+		<div {...blockProps}>
+			<p>Render Block Output</p>
+		</div>
+	);
+}

package/lib/template/block/editor.scss.mustache

@@ -0,0 +1,5 @@
+/**
+ * The following styles get applied inside the editor only.
+ *
+ * Replace them with your own styles or remove the file completely.
+ */

package/lib/template/block/index.js.mustache

@@ -0,0 +1,40 @@
+/**
+ * Registers a new block provided a unique name and an object defining its behavior.
+ *
+ * @see https://developer.wordpress.org/block-editor/developers/block-api/#registering-a-block
+ */
+import { registerBlockType } from '@wordpress/blocks';
+
+/**
+ * Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
+ * All files containing `style` keyword are bundled together. The code used
+ * gets applied both to the front of your site and to the editor. All other files
+ * get applied to the editor only.
+ *
+ * @see https://www.npmjs.com/package/@wordpress/scripts#using-css
+ */
+import './style.scss';
+import './editor.scss';
+
+/**
+ * Internal dependencies
+ */
+import Edit from './edit';
+import save from './save';
+import metadata from './block.json';
+
+/**
+ * Every block starts by registering a new block type definition.
+ *
+ * @see https://developer.wordpress.org/block-editor/developers/block-api/#registering-a-block
+ */
+registerBlockType( metadata.name, {
+	/**
+	 * @see ./edit.js
+	 */
+	edit: Edit,
+	/**
+	 * @see ./save.js
+	 */
+	save,
+} );

package/lib/template/block/save.js.mustache

@@ -0,0 +1,21 @@
+/**
+ * React hook that is used to mark the block wrapper element.
+ * It provides all the necessary props like the class name.
+ *
+ * @see https://developer.wordpress.org/block-editor/packages/packages-block-editor/#useBlockProps
+ */
+ import { InnerBlocks } from '@wordpress/block-editor';
+
+ /**
+  * The save function defines the way in which the different attributes should
+  * be combined into the final markup, which is then serialized by the block
+  * editor into `post_content`.
+  *
+  * @see https://developer.wordpress.org/block-editor/developers/block-api/block-edit-save/#save
+  *
+  * @return {WPElement} Element to render.
+  */
+ export default function save(props) {
+	 return <InnerBlocks.Content />;
+ }
+ 

package/lib/template/block/style.scss.mustache

@@ -0,0 +1,6 @@
+/**
+ * The following styles get applied both on the front of your site
+ * and in the editor.
+ *
+ * Replace them with your own styles or remove the file completely.
+ */

package/lib/template/index.cjs

@@ -0,0 +1,48 @@
+/**
+ * External dependencies
+ */
+const { join } = require( 'path' );
+const { capitalCase } = require( 'change-case' );
+
+/**
+ * Internal dependencies
+ */
+const blockSlug = process.argv[ 2 ];
+const blockSlugTitle = capitalCase( blockSlug );
+
+const customScripts = {};
+
+const npmDependencies = [ 
+	'@wordpress/icons@9.22.0' 
+];
+
+const npmDevDependencies = [];
+
+// assetsPath: join( __dirname, 'assets' ),
+module.exports = {
+	pluginTemplatesPath: join( __dirname, 'plugin' ),
+	blockTemplatesPath: join( __dirname, 'block' ),
+	defaultValues: {
+		pluginURI: `https://github.com/CAWebPublishing/${ blockSlug }`,
+		plugin: true,
+		description: `${ blockSlugTitle } Gutenberg Block`,
+		version: '1.2.0',
+		author: 'CAWebPublishing',
+		license: 'GPL-2.0-or-later',
+		licenseURI: 'https://www.gnu.org/licenses/gpl-2.0.html',
+		namespace: 'caweb',
+		category: 'cagov-design-system',
+		textdomain: 'cagov-design-system',
+		dashicon: 'format-aside',
+		supports: {
+			html: true,
+		},
+		attributes: {},
+		example: {
+			attributes: {}
+		},
+		customScripts: customScripts,
+		npmDependencies: npmDependencies,
+		npmDevDependencies: npmDevDependencies,
+	},
+};

package/lib/template/plugin/$slug.php.mustache

@@ -0,0 +1,135 @@
+<?php
+/**
+ * Plugin Name:       {{title}}
+{{#pluginURI}}
+ * Plugin URI:        {{{pluginURI}}}
+{{/pluginURI}}
+{{#description}}
+ * Description:       {{description}}
+{{/description}}
+ * Version:           {{version}}
+ * Requires at least: 6.2
+ * Requires PHP:      8.1
+{{#author}}
+ * Author:            {{author}}
+{{/author}}
+{{#license}}
+ * License:           {{license}}
+{{/license}}
+{{#licenseURI}}
+ * License URI:       {{{licenseURI}}}
+{{/licenseURI}}
+ * Text Domain:       {{textdomain}}
+{{#domainPath}}
+ * Domain Path:       {{{domainPath}}}
+{{/domainPath}}
+{{#updateURI}}
+ * Update URI:        {{{updateURI}}}
+{{/updateURI}}
+ *
+ * @package           cagov-design-system
+ */
+
+if ( ! defined('{{slugPascalCase}}_URI') ){
+	$cagov_design_system_{{slugSnakeCase}}_doc_root = isset( $_SERVER['DOCUMENT_ROOT'] ) ? sanitize_text_field( wp_unslash( $_SERVER['DOCUMENT_ROOT'] ) ) : '';
+	define( '{{slugPascalCase}}_URI', esc_url( str_replace( $cagov_design_system_{{slugSnakeCase}}_doc_root, '', __DIR__ ) ) );
+}
+
+if ( ! defined( 'CAGOV_DESIGN_SYSTEM_DEBUG' ) ) {
+	define( 'CAGOV_DESIGN_SYSTEM_DEBUG', false );
+}
+
+// Include {{title}} Core Functionality.
+foreach ( glob( __DIR__ . '/core/*.php' ) as $file ) {
+	require_once $file;
+}
+
+// Include {{title}} Functionality.
+foreach ( glob( __DIR__ . '/inc/*.php' ) as $file ) {
+	require_once $file;
+}
+
+/**
+ * Plugin API/Action Reference
+ * Actions Run During a Typical Request
+ *
+ * @link https://codex.wordpress.org/Plugin_API/Action_Reference#Actions_Run_During_a_Typical_Request
+ */
+add_action( 'init', 'cagov_design_system_{{slugSnakeCase}}_init' );
+add_action( 'wp_enqueue_scripts', 'cagov_design_system_{{slugSnakeCase}}_wp_enqueue_scripts' );
+
+if ( ! function_exists( 'cagov_design_system_{{slugSnakeCase}}_init' ) ) {
+	/**
+	 * {{title}} Initialization
+	 *
+	 * Fires after WordPress has finished loading but before any headers are sent.
+	 * Include Gutenberg Block assets by getting the index file of each block build file.
+	 *
+	 * @link https://developer.wordpress.org/reference/hooks/init/
+	 * @return void
+	 */
+	function cagov_design_system_{{slugSnakeCase}}_init() {
+		global $pagenow;
+
+		if ( ! function_exists( 'get_plugin_data' ) ) {
+			require_once ABSPATH . 'wp-admin/includes/plugin.php';
+		}
+
+		$version = get_plugin_data( __FILE__ )['Version'];
+
+		/**
+		* Enqueues the default ThickBox js and css. (if not on the login page or customizer page)
+		*
+		* @link https://developer.wordpress.org/reference/functions/add_thickbox/
+		*/
+		if ( ! in_array( $pagenow, array( 'wp-login.php', 'customize.php' ), true ) ) {
+			add_thickbox();
+		}
+
+		// if editing a page/post register compiled Gutenberg Block bundles.
+		if ( in_array( $pagenow, array( 'post.php', 'post-new.php' ), true ) ) {
+
+			wp_enqueue_style( 'cagov-design-system-{{slug}}', cagov_design_system_{{slugSnakeCase}}_get_min_file( '/css/{{slug}}.css' ), array(), $version );
+		}
+
+		$block_args = array(
+			'render_callback' => 'cagov_design_system_{{slugSnakeCase}}_block_renderer',
+		);
+
+		/**
+		 * Registers the block using the metadata loaded from the `block.json` file.
+		 * Behind the scenes, it registers also all assets so they can be enqueued
+		 * through the block editor in the corresponding context.
+		 *
+		 * @see https://developer.wordpress.org/reference/functions/register_block_type/
+		*/
+		register_block_type( __DIR__ . '/build', $block_args );
+	}
+}
+
+if ( ! function_exists( 'cagov_design_system_{{slugSnakeCase}}_wp_enqueue_scripts' ) ) {
+	/**
+	 * Register {{title}} scripts/styles
+	 *
+	 * Fires when scripts and styles are enqueued.
+	 *
+	 * @category add_action( 'wp_enqueue_scripts', 'cagov_design_system_{{slugSnakeCase}}_wp_enqueue_scripts' );
+	 * @link https://developer.wordpress.org/reference/hooks/wp_enqueue_scripts/
+	 *
+	 * @return void
+	 */
+	function cagov_design_system_{{slugSnakeCase}}_wp_enqueue_scripts() {
+
+		if ( ! function_exists( 'get_plugin_data' ) ) {
+			require_once ABSPATH . 'wp-admin/includes/plugin.php';
+		}
+
+		$version = get_plugin_data( __FILE__ )['Version'];
+
+		// Register compiled Gutenberg Block bundles.
+		wp_enqueue_script( 'cagov-design-system-{{slug}}', cagov_design_system_{{slugSnakeCase}}_get_min_file( '/js/{{slug}}.js', 'js' ), array(), $version, true );
+
+		wp_enqueue_style( 'cagov-design-system-{{slug}}', cagov_design_system_{{slugSnakeCase}}_get_min_file( '/css/{{slug}}.css' ), array(), $version );
+
+	}
+}

package/lib/template/plugin/core/cdec-api.php.mustache

@@ -0,0 +1,44 @@
+<?php
+/**
+ * {{title}} CDEC REST API
+ *
+ * @see https://cdec.water.ca.gov/resapp/
+ *
+ * @package cagov-design-system
+ */
+
+if ( ! function_exists( 'cagov_design_system_cdec_reservoir_conditions_api' ) ) {
+	/**
+	 * Retrieve data from the CDEC Reservoir API
+	 *
+	 * @see https://cdec.water.ca.gov/resapp/service/res/conditions
+	 * @param  string $station_id Major reservoirs station that were recommended by CDEC.
+	 * @return string
+	 */
+	function cagov_design_system_cdec_reservoir_conditions_api( $station_id = '' ) {
+		$result = 'No Results';
+
+		if ( empty( $station_id ) ) {
+			return $result;
+		}
+
+		$date = gmdate( 'Y-m-d' );
+
+		$url = "https://cdec.water.ca.gov/resapp/service/res/conditions?date=$date&stationIds=$station_id";
+
+		$args = array(
+			'headers' => array(
+				'Content-Type' => 'application/json',
+			),
+		);
+
+		$response = wp_remote_get( $url, $args );
+
+		if ( 200 === wp_remote_retrieve_response_code( $response ) ) {
+			$result = wp_remote_retrieve_body( $response );
+
+			return json_decode( $result, true )[0];
+		}
+
+	}
+}

package/lib/template/plugin/core/filters.php.mustache

@@ -0,0 +1,111 @@
+<?php
+/**
+ * {{title}} Filters
+ *
+ * @package cagov-design-system
+ */
+
+global $wp_version;
+
+$cagov_design_system_is_under_5_8 = version_compare( $wp_version, '5.8', '<' ) ? '' : '_all';
+
+add_filter( "block_categories$cagov_design_system_is_under_5_8", 'cagov_design_system_block_categories', 10, 2 );
+add_filter( 'script_loader_tag', 'cagov_design_system_{{slugSnakeCase}}_script_loader_tag', 10, 3 );
+add_filter( "allowed_block_types$cagov_design_system_is_under_5_8", 'cagov_design_system_allowed_block_types' );
+
+if ( ! function_exists( 'cagov_design_system_block_categories' ) ) {
+	/**
+	 * Register {{title}} Gutenberg Block categories to the Block editor
+	 *
+	 * @link https://developer.wordpress.org/reference/hooks/block_categories_all/
+	 *
+	 * @param  array                   $categories Array of categories for block types.
+	 * @param  WP_Block_Editor_Context $post The current block editor context.
+	 * @return array
+	 */
+	function cagov_design_system_block_categories( $categories, $post ) {
+		return array_merge(
+			array(
+				array(
+					'slug'  => 'cagov-design-system',
+					'title' => 'CA Design System',
+				),
+			),
+			array(
+				array(
+					'slug'  => 'cagov-data-viz',
+					'title' => 'CA Data Visualization',
+				),
+			),
+			$categories
+		);
+	}
+}
+
+if ( ! function_exists( 'cagov_design_system_allowed_block_types' ) ) {
+	/**
+	 * {{title}} Allowed Block Types
+	 *
+	 * Removes all blocks or patterns from Gutenberg and returns {{title}} Blocks.
+	 *
+	 * @link https://developer.wordpress.org/reference/hooks/allowed_block_types_all/
+	 *
+	 * @param  bool|array $allowed_blocks Array of block type slugs, or boolean to enable/disable all. Default true (all registered block types supported).
+	 * @return array
+	 */
+	function cagov_design_system_allowed_block_types( $allowed_blocks ) {
+
+		// if not debugging, return all blocks.
+		if ( ! CAGOV_DESIGN_SYSTEM_DEBUG ) {
+			return $allowed_blocks;
+		}
+
+		remove_theme_support( 'core-block-patterns' );
+
+		// Core Components.
+		$core = array(
+			'core/image',
+			'core/paragraph',
+			'core/button',
+			'core/table',
+			'core/heading',
+			'core/list',
+			'core/custom-html',
+			'core/classic',
+		);
+
+		// Dynamically get a list of the cagov-design-system blocks.
+		$cagov_blocks = array();
+		/*
+		array_map(
+			function( $b ) {
+				return 'cagov-design-system/' . basename( $b );
+			},
+			glob( '/blocks/*' )
+		);
+		*/
+
+		// Return the desired components.
+		return array_merge( $core, $cagov_blocks );
+	}
+}
+
+if ( ! function_exists( 'cagov_design_system_{{slugSnakeCase}}_script_loader_tag' ) ) {
+	/**
+	 * Filters the HTML script tag of an enqueued script.
+	 *
+	 * @param  mixed $tag The <script> tag for the enqueued script.
+	 * @param  mixed $handle The script's registered handle.
+	 * @param  mixed $src The script's source URL.
+	 * @return string
+	 */
+	function cagov_design_system_{{slugSnakeCase}}_script_loader_tag( $tag, $handle, $src ) {
+		// Register script as module.
+		if ( 'cagov-design-system-{{slug}}' === $handle ) {
+			$tag = sprintf( '<script type="module" id="cagov-design-system-{{slug}}-js" src="%1$s"></script>', $src );
+		}
+
+		return $tag;
+	}
+}
+

package/lib/template/plugin/core/functions.php.mustache

@@ -0,0 +1,25 @@
+<?php
+/**
+ * {{title}} Helper Functions
+ *
+ * @package cagov-design-system
+ */
+
+if ( ! function_exists( 'cagov_design_system_{{slugSnakeCase}}_get_min_file' ) ) {
+	/**
+	 * Load Minified Version of a file
+	 *
+	 * @param  string $f File to load.
+	 * @param  string $ext Extension of file, default css.
+	 *
+	 * @return string
+	 */
+	function cagov_design_system_{{slugSnakeCase}}_get_min_file( $f, $ext = 'css' ) {
+		// if not debugging and a minified version exists load it.
+		if ( ! CAGOV_DESIGN_SYSTEM_DEBUG && file_exists( __DIR__ . str_replace( ".$ext", ".min.$ext", $f ) ) ) {
+			return {{slugPascalCase}}_URI . str_replace( ".$ext", ".min.$ext", $f );
+		} else {
+			return {{slugPascalCase}}_URI . $f;
+		}
+	}
+}

package/lib/template/plugin/inc/renderer.php.mustache

@@ -0,0 +1,25 @@
+<?php
+/**
+ * {{title}} Dynamic Renderer Functions
+ *
+ * @package {{namespace}}
+ */
+
+if ( ! function_exists( 'cagov_design_system_{{slugSnakeCase}}_block_renderer' ) ) {
+	/**
+	 * Dynamic Renderer for {{title}} Block
+	 *
+	 * @see https://developer.wordpress.org/block-editor/how-to-guides/block-tutorial/creating-dynamic-blocks/
+	 *
+	 * @param array         $attributes Block attributes.
+	 * @param string        $content    Block content.
+	 * @param  WP_Block_Type $block Current Block Type.
+	 * @return string Rendered block type output.
+	 */
+	function cagov_design_system_{{slugSnakeCase}}_block_renderer( $attributes, $content, $block ) {
+
+		$output = sprintf( '<p>Render Block Output</p>' );
+
+		return $output;
+	}
+}