121 lines
3.1 KiB
JavaScript
121 lines
3.1 KiB
JavaScript
/**
|
|
* WooCommerce Smart Coupons Gutenberg
|
|
*
|
|
* @author StoreApps
|
|
* @since 4.0.0
|
|
* @version 1.0
|
|
*
|
|
* @package woocommerce-smart-coupons/includes/blocks
|
|
*/
|
|
|
|
( function( wp ) {
|
|
/**
|
|
* Registers a new block provided a unique name and an object defining its behavior.
|
|
*
|
|
* @see https://github.com/WordPress/gutenberg/tree/master/blocks#api
|
|
*/
|
|
const {registerBlockType} = wp.blocks;
|
|
/**
|
|
* Returns a new element of given type. Element is an abstraction layer atop React.
|
|
*
|
|
* @see https://github.com/WordPress/gutenberg/tree/master/element#element
|
|
*/
|
|
const createElement = wp.element.createElement;
|
|
/**
|
|
* Retrieves the translation of text.
|
|
*
|
|
* @see https://github.com/WordPress/gutenberg/tree/master/i18n#api
|
|
*/
|
|
const {__} = wp.i18n;
|
|
|
|
/**
|
|
* Every block starts by registering a new block type definition.
|
|
*
|
|
* @see https://wordpress.org/gutenberg/handbook/block-api/
|
|
*/
|
|
registerBlockType(
|
|
'woocommerce-smart-coupons/coupon',
|
|
{
|
|
/**
|
|
* This is the display title for our block, which can be translated with `i18n` functions.
|
|
* The block inserter will show this name.
|
|
*/
|
|
title: __( 'Smart Coupons', 'woocommerce-smart-coupons' ),
|
|
|
|
/**
|
|
* This is the block description for our block, which can be translated with `il8n` functions.
|
|
*/
|
|
description: __( 'Show any WooCommerce coupon with Smart Coupons.' ),
|
|
|
|
/**
|
|
* Blocks are grouped into categories to help users browse and discover them.
|
|
* The categories provided by core are `common`, `embed`, `formatting`, `layout` and `widgets`.
|
|
*/
|
|
category: 'embed',
|
|
|
|
/**
|
|
* Define block icon for our block.
|
|
*/
|
|
icon: 'heart',
|
|
|
|
/**
|
|
* This are the block keywords using which our block can be searched.
|
|
*/
|
|
keywords: [
|
|
__( 'Smart' ),
|
|
__( 'Coupons' ),
|
|
__( 'Store Credit' ),
|
|
],
|
|
|
|
/**
|
|
* Optional block extended support features.
|
|
*/
|
|
supports: {
|
|
// Removes support for an HTML mode.
|
|
html: false,
|
|
// align: [ 'wide', 'full' ],.
|
|
},
|
|
|
|
attributes: {
|
|
coupon_code: {
|
|
type: 'string',
|
|
},
|
|
},
|
|
|
|
/**
|
|
* 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://wordpress.org/gutenberg/handbook/block-edit-save/#edit
|
|
*
|
|
* @param {Object} [props] Properties passed from the editor.
|
|
* @return {Element} Element to render.
|
|
*/
|
|
edit: function( props ){
|
|
return createElement(
|
|
wp.editor.RichText,
|
|
{
|
|
className: 'coupon-container gb-active-coupon',
|
|
value: props.attributes.coupon_code,
|
|
onChange: function( coupon_code ) {
|
|
props.setAttributes( { coupon_code: coupon_code } );
|
|
}
|
|
}
|
|
);
|
|
},
|
|
|
|
/**
|
|
* The save function defines the way in which the different attributes should be combined
|
|
* into the final markup, which is then serialized by Gutenberg into `post_content`.
|
|
*
|
|
* @see https://wordpress.org/gutenberg/handbook/block-edit-save/#save
|
|
*
|
|
* @return {Element} Element to render.
|
|
*/
|
|
save:function( props ){
|
|
return null;
|
|
}
|
|
}
|
|
);
|
|
} )( window.wp );
|