Changeset 2889116

Timestamp:

03/29/2023 11:15:52 AM (2 years ago)

Author:

jorisvanmontfort

Message:

1.2.0

Location:

jvm-rich-text-icons/trunk

Files:

• dist/blocks.build.js (modified) (1 diff)
• plugin.php (modified) (2 diffs)
• readme.txt (modified) (2 diffs)
• src/blocks.js (modified) (2 diffs)
• src/controls.js (modified) (1 diff)
• src/init.php (modified) (1 diff)

jvm-rich-text-icons/trunk/dist/blocks.build.js

@@ -1 @@
-!function(e){function t(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,t),r.l=!0,r.exports}var n={};t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,n){"use strict";function o(e,t){var n={};for(var o in e)t.indexOf(o)>=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}Object.defineProperty(t,"__esModule",{value:!0}),n.d(t,"icon",function(){return s});var r=n(1),__=wp.i18n.__,i=wp.richText.registerFormatType,c=wp.element.Fragment,a=wp.components,l=(a.Toolbar,a.Button,a.Popover,"jvm/insert-icons"),s={name:l,title:__("Insert Icon","jvm-richtext-icons"),tagName:"i",className:null,edit:function(e){var t=e.isOpen,n=e.value,o=e.onChange,i=e.activeAttributes;return wp.element.createElement(c,null,wp.element.createElement(r.a,{name:l,isOpen:t,value:n,onChange:o,activeAttributes:i}))}};wp.domReady(function(){[s].forEach(function(e){var t=e.name,n=o(e,["name"]);t&&i(t,n)})})},function(e,t,n){"use strict";function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!==typeof t&&"function"!==typeof t?e:t}function i(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var c=n(2),a=(n.n(c),function(){function e(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}return function(t,n,o){return n&&e(t.prototype,n),o&&e(t,o),t}}()),__=wp.i18n.__,l=wp.element,s=l.Component,u=l.Fragment,p=(wp.dom.getRectangleFromRange,wp.compose),m=p.compose,f=p.ifCondition,h=wp.data.withSelect,w=wp.blockEditor.BlockControls,v=wp.richText,d=v.toggleFormat,b=v.insert,g=v.create,y=wp.components,O=y.Toolbar,j=y.Popover,x=(y.Panel,y.ToolbarButton),_=y.Button,E=y.TextControl,k=y.Tooltip,C=jvm_richtext_icon_settings.iconset,T=jvm_richtext_icon_settings.base_class,P=function(e){function t(){o(this,t);var e=r(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments));return e.toggle=e.toggle.bind(e),e.state={icons:C,isOpen:!1,keyword:""},e}return i(t,e),a(t,[{key:"search",value:function(e){var t=[];Object(c.map)(C,function(n){-1!==n.toLowerCase().search(e.toLowerCase())&&t.push(n)}),this.setState({keyword:e,icons:t})}},{key:"toggle",value:function(){this.setState(function(e){return{isOpen:!e.isOpen}}),this.setState({keyword:"",icons:C});window.getSelection()}},{key:"render",value:function(){var e=this,t=this.state,n=t.isOpen,o=t.icons,r=t.keyword,i=this.props,a=i.name,l=i.value,s=i.onChange;return wp.element.createElement(u,null,wp.element.createElement(w,null,wp.element.createElement(O,{label:__("Insert Icon","jvm-richtext-icons")},wp.element.createElement(x,{icon:"flag","aria-haspopup":"true",tooltip:__("Insert Icon","jvm-richtext-icons"),onClick:this.toggle}),n&&wp.element.createElement(j,{className:"jvm-richtext-icons-popover",position:"bottom left",key:"icon-popover",onClick:function(){},expandOnMobile:!1,headerTitle:__("Insert Icon","jvm-richtext-icons"),onClose:function(){s(d(l,{type:a}))}},wp.element.createElement(E,{value:r,placeholder:__("Search","jvm-richtext-icons"),onChange:function(t){e.search(t)}}),wp.element.createElement("div",{className:"jvm-richtext-icons-panel"},o.length>0?wp.element.createElement("ul",{className:"jvm-richtext-icons-list"},Object(c.map)(o,function(t){return wp.element.createElement("li",{"data-key":t},wp.element.createElement(k,{text:t},wp.element.createElement(_,{isTertiary:!0,onClick:function(){var n=g({html:'<i class="'+T+" "+t+'" aria-hidden="true"> </i>'});s(b(l,n)),e.toggle()}},wp.element.createElement("i",{className:T+" "+t,"aria-hidden":"true"}))))})):wp.element.createElement("p",null,__("No characters found.","block-options")))))))}}]),t}(s);t.a=m(h(function(e){return{isDisabled:e("core/edit-post").isFeatureActive("disableJVMIconMap")}}),f(function(e){return!e.isDisabled}))(P)},function(e,t){e.exports=lodash}]);
+!function(e){function t(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,t),r.l=!0,r.exports}var n={};t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,n){"use strict";function o(e,t){var n={};for(var o in e)t.indexOf(o)>=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}Object.defineProperty(t,"__esModule",{value:!0}),n.d(t,"icon",function(){return f});var r=n(1),__=wp.i18n.__,i=wp.richText.registerFormatType,a=wp.element.Fragment,c=wp.components,l=(c.Toolbar,c.Button,c.Popover,wp.blocks.registerBlockType),s=wp.blockEditor.InspectorControls,u=wp.components.PanelBody,p=wp.components.ComboboxControl,m="jvm/insert-icons",f={name:m,title:__("Insert Icon","jvm-richtext-icons"),tagName:"i",className:null,edit:function(e){var t=e.isOpen,n=e.value,o=e.onChange,i=e.activeAttributes;return wp.element.createElement(a,null,wp.element.createElement(r.a,{name:m,isOpen:t,value:n,onChange:o,activeAttributes:i}))}};wp.domReady(function(){[f].forEach(function(e){var t=e.name,n=o(e,["name"]);t&&i(t,n)})}),l("jvm/single-icon",{title:__("Single icon"),icon:"flag",category:"common",keywords:[__("Icon")],attributes:{icon:{type:"string"}},edit:function(e){var t=jvm_richtext_icon_settings.iconset,n=[],o="",r=!0,i=!1,a=void 0;try{for(var c,l=t[Symbol.iterator]();!(r=(c=l.next()).done);r=!0){var m=c.value;n.push({value:m,label:m})}}catch(e){i=!0,a=e}finally{try{!r&&l.return&&l.return()}finally{if(i)throw a}}return void 0!==e.attributes.icon?o=e.attributes.icon:void 0!==t[0]&&(o=t[0]),e.setAttributes({icon:o}),[wp.element.createElement(s,null,wp.element.createElement(u,{label:__("Icon")},wp.element.createElement(p,{label:__("Icon"),value:o,onChange:function(t){t&&e.setAttributes({icon:t})},options:n,__experimentalRenderItem:function(e){return wp.element.createElement("span",null,wp.element.createElement("i",{class:e.item.value,"aria-hidden":"true"}," ")," ",e.item.value)},isMulti:"false"}))),wp.element.createElement("div",{className:e.className},wp.element.createElement("i",{class:e.attributes.icon,"aria-hidden":"true"}," "))]},save:function(e){return wp.element.createElement("div",{className:e.className},wp.element.createElement("i",{class:e.attributes.icon,"aria-hidden":"true"}," "))}})},function(e,t,n){"use strict";function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!==typeof t&&"function"!==typeof t?e:t}function i(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var a=n(2),c=(n.n(a),function(){function e(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}return function(t,n,o){return n&&e(t.prototype,n),o&&e(t,o),t}}()),__=wp.i18n.__,l=wp.element,s=l.Component,u=l.Fragment,p=(wp.dom.getRectangleFromRange,wp.compose),m=p.compose,f=p.ifCondition,w=wp.data.withSelect,h=wp.blockEditor.BlockControls,v=wp.richText,d=v.toggleFormat,b=v.insert,y=v.create,g=wp.components,E=g.Toolbar,_=g.Popover,x=(g.Panel,g.ToolbarButton),j=g.Button,O=g.TextControl,k=g.Tooltip,C=jvm_richtext_icon_settings.iconset,I=jvm_richtext_icon_settings.base_class,T=function(e){function t(){o(this,t);var e=r(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments));return e.toggle=e.toggle.bind(e),e.state={icons:C,isOpen:!1,keyword:""},e}return i(t,e),c(t,[{key:"search",value:function(e){var t=[];Object(a.map)(C,function(n){-1!==n.toLowerCase().search(e.toLowerCase())&&t.push(n)}),this.setState({keyword:e,icons:t})}},{key:"toggle",value:function(){this.setState(function(e){return{isOpen:!e.isOpen}}),this.setState({keyword:"",icons:C});window.getSelection()}},{key:"render",value:function(){var e=this,t=this.state,n=t.isOpen,o=t.icons,r=t.keyword,i=this.props,c=i.name,l=i.value,s=i.onChange;return wp.element.createElement(u,null,wp.element.createElement(h,null,wp.element.createElement(E,{label:__("Insert Icon","jvm-richtext-icons")},wp.element.createElement(x,{icon:"flag","aria-haspopup":"true",tooltip:__("Insert Icon","jvm-richtext-icons"),onClick:this.toggle}),n&&wp.element.createElement(_,{className:"jvm-richtext-icons-popover",position:"bottom left",key:"icon-popover",onClick:function(){},expandOnMobile:!1,headerTitle:__("Insert Icon","jvm-richtext-icons"),onClose:function(){s(d(l,{type:c}))}},wp.element.createElement(O,{value:r,placeholder:__("Search","jvm-richtext-icons"),onChange:function(t){e.search(t)}}),wp.element.createElement("div",{className:"jvm-richtext-icons-panel"},o.length>0?wp.element.createElement("ul",{className:"jvm-richtext-icons-list"},Object(a.map)(o,function(t){return wp.element.createElement("li",{"data-key":t},wp.element.createElement(k,{text:t},wp.element.createElement(j,{isTertiary:!0,onClick:function(){var n=y({html:'<i class="'+I+" "+t+'" aria-hidden="true"> </i>'});s(b(l,n)),e.toggle()}},wp.element.createElement("i",{className:I+" "+t,"aria-hidden":"true"}))))})):wp.element.createElement("p",null,__("No characters found.","block-options")))))))}}]),t}(s);t.a=m(w(function(e){return{isDisabled:e("core/edit-post").isFeatureActive("disableJVMIconMap")}}),f(function(e){return!e.isDisabled}))(T)},function(e,t){e.exports=lodash}]);

jvm-rich-text-icons/trunk/plugin.php

@@ -3 +3 @@
  * Plugin Name: JVM rich text icons
  * Description: Add Font Awesome icons, or icons from a custom icon set to rich text fields in the Gutenberg block editor.
- * Version: 1.1.9
+ * Version: 1.2.0
  * Author: Joris van Montfort
  * Author URI: https://jorisvm.nl
@@ -11 +11 @@
  * @category Gutenberg
  * @author Joris van Montfort
- * @version 1.1.9
+ * @version 1.2.0
  * @package JVM rich text icons
  */

jvm-rich-text-icons/trunk/readme.txt

@@ -12 +12 @@
 
 == Description ==
-Add inline icons to rich text fields like: paragraphs, headings, lists or buttons anywhere in the Gutenberg block editor. This plugin ships with the free Font Awesome icon set as default icon set. You can choose between version 4.x, 5.x and version 6.x.
+This plugin is a nice toolset for anyone wanting to integrate icons into the Gutenberg editor or options created with Advanced Custom Fields. 
+
+Add inline icons to rich text fields like: paragraphs, headings, lists or buttons anywhere in the Gutenberg block editor, or add a dedicated icon block from within the Gutenberg editor.
+
+This plugin ships with the free Font Awesome icon set as default icon set. You can choose between version 4.x, 5.x and version 6.x.
 This plugin also provides an easy to use interface for creating a custom icon set based on SVG icons. Custom icons can be upload from the plugin settings using an easy to use drag & drop uploader.
 
@@ -83 +87 @@
 
 == Changelog ==
+
+= 1.2.0 =
+Added a dedicated single icon blok for Gutenberg.
 
 = 1.1.9 =

jvm-rich-text-icons/trunk/src/blocks.js

@@ -6 +6 @@
 const { Fragment } = wp.element;
 const { Toolbar, Button, Popover } = wp.components;
+
+// For the single icon blok
+const { registerBlockType } = wp.blocks; 
+const { InspectorControls } = wp.blockEditor;
+const { PanelBody } = wp.components;
+const { ComboboxControl } = wp.components;
 
 //import icon from './icon';
@@ -48 +54 @@
     } );   
 });
+
+registerBlockType( 'jvm/single-icon', {
+    // Block name. Block names must be string that contains a namespace prefix. Example: my-plugin/my-custom-block.
+    title: __( 'Single icon' ), // Block title.
+    icon: 'flag', // Block icon from Dashicons → https://developer.wordpress.org/resource/dashicons/.
+    category: 'common', // Block category — Group blocks together based on common traits E.g. common, formatting, layout widgets, embed.
+    keywords: [
+        __( 'Icon' )
+    ],
+
+
+    attributes: {
+        icon: {
+            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.
+     *
+     * The "edit" property must be a valid function.
+     *
+     * @link https://wordpress.org/gutenberg/handbook/block-api/block-edit-save/
+     *
+     * @param {Object} props Props.
+     * @returns {Mixed} JSX Component.
+     */
+    edit: ( props ) => {
+        let icons = jvm_richtext_icon_settings.iconset;
+        let options = [];
+        let selectectValue = '';
+
+        for (let icon of icons) {
+            options.push({
+                value : icon,
+                label : icon
+            });
+        }
+
+        // Get the current or first icon
+        if (props.attributes.icon !== undefined) {
+            selectectValue = props.attributes.icon;
+        }else {
+            if (icons[0] !== undefined) {
+                selectectValue = icons[0];
+            }
+        }
+
+        // Update the proerties
+        props.setAttributes( { icon: selectectValue } );
+
+        return [
+            <InspectorControls>
+                <PanelBody
+                    label={__( 'Icon' )}
+                >
+                    <ComboboxControl
+                        label={__('Icon')}
+                        value={selectectValue}
+                        onChange={(i) => {
+                            if (i) {
+                                props.setAttributes( { icon: i } );
+                            }
+                        }}
+                        options={options}
+                        __experimentalRenderItem={(opt) => {
+                            return <span><i class={opt.item.value} aria-hidden="true"> </i> {opt.item.value}</span>;
+                        }}
+            isMulti='false'
+                        />
+                </PanelBody>
+
+            </InspectorControls>
+            ,
+            
+            <div className={ props.className }>
+                <i class={props.attributes.icon} aria-hidden="true"> </i>
+            </div>
+        ];
+    },
+
+    /**
+     * 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.
+     *
+     * The "save" property must be specified and must be a valid function.
+     *
+     * @link https://wordpress.org/gutenberg/handbook/block-api/block-edit-save/
+     *
+     * @param {Object} props Props.
+     * @returns {Mixed} JSX Frontend HTML.
+     */
+    save: ( props ) => {
+        return (
+            <div className={ props.className }>
+               <i class={props.attributes.icon} aria-hidden="true"> </i>
+            </div>
+        );
+    },
+} );

jvm-rich-text-icons/trunk/src/controls.js

@@ -2 +2 @@
  * External dependencies
  */
-import { map, upperFirst } from 'lodash';
+import { map } from 'lodash';
 
 /**

jvm-rich-text-icons/trunk/src/init.php

@@ -29 +29 @@
         add_filter( 'plugin_action_links', array( $this, 'plugin_action_links' ), 10, 2 );
         add_filter( 'plugin_row_meta', array( $this, 'plugin_row_meta' ), 10, 2 );
+
+
+        /**
+         * Register Gutenberg block on server-side.
+         *
+         * Register the block on server-side to ensure that the block
+         * scripts and styles for both frontend and backend are
+         * enqueued when the editor loads.
+         *
+         * @link https://wordpress.org/gutenberg/handbook/blocks/writing-your-first-block-type#enqueuing-block-scripts
+         * @since 1.16.0
+         */
+        register_block_type(
+            'jvm/single-icon', array(
+                // Enqueue blocks.style.build.css on both frontend & backend.
+                //'style'         => 'jvm_details_summary-cgb-style-css',
+                // Enqueue blocks.build.js in the editor only.
+                'editor_script' => 'jvm-rich-text-icons-js',
+                // Enqueue blocks.editor.build.css in the editor only.
+                'editor_style'  => 'jvm-rich-text-icons-editor-css',
+            )
+        );
     }