Plugin Tabs noticias

Wordpress/wordpress/wp-content/plugins/all-bootstrap-blocks/blocks/toast/block.js

@@ -0,0 +1,86 @@
+import * as areoi from '../_components/Core.js';
+import meta from './block.json';
+
+const ALLOWED_BLOCKS = [ 'areoi/toast-header', 'areoi/toast-body' ];
+const BLOCKS_TEMPLATE = [
+    [ 'areoi/toast-header', {} ],
+    [ 'areoi/toast-body', {} ],
+];
+
+const blockIcon = <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M21 3H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H3V5h18v14zm-10-7h9v6h-9z"/></svg>;
+
+areoi.blocks.registerBlockType( meta, {
+    icon: blockIcon,
+    edit: props => {
+        const {
+            attributes,
+            setAttributes,
+            clientId
+        } = props;
+
+        const { block_id } = attributes;
+        if ( !block_id ) {
+            setAttributes( { block_id: clientId } );
+        }
+
+        const classes = [
+            'toast',
+            attributes.background,
+            attributes.text_color,
+            attributes.border_color
+        ];
+
+        const blockProps = areoi.editor.useBlockProps( {
+            className: areoi.helper.GetClassName( classes ),
+            style: { cssText: areoi.helper.GetStyles( attributes ) }
+        } );
+
+        function onChange( key, value ) {
+            setAttributes( { [key]: value } );
+        }
+
+        return (
+            <>
+                { areoi.DisplayPreview( areoi, attributes, onChange, 'toast' ) }
+
+                { !attributes.preview &&
+                    <div { ...blockProps } data-anchor={ attributes.anchor ? ' : #' + attributes.anchor : '' }>
+                        <areoi.editor.InspectorControls key="setting">
+
+                            <areoi.components.PanelBody title={ 'Settings' } initialOpen={ false }>
+
+                                <areoi.components.PanelRow className="areoi-panel-row">
+                                    <areoi.components.SelectControl
+                                        label="Placement"
+                                        labelPosition="top"
+                                        help="Place toasts with custom CSS as you need them. The top right is often used for notifications, as is the top middle. If you’re only ever going to show one toast at a time, put the positioning styles right on the .toast."
+                                        value={ attributes.placement }
+                                        options={ [
+                                            { label: 'Top Left', value: 'top-0 start-0' },
+                                            { label: 'Top Right', value: 'top-0 end-0' },
+                                            { label: 'Bottom Right', value: 'bottom-0 end-0' },
+                                            { label: 'Bottom Left', value: 'bottom-0 start-0' },
+                                        ] }
+                                        onChange={ ( value ) => onChange( 'placement', value ) }
+                                    />
+                                </areoi.components.PanelRow>
+
+                                { areoi.Colors( areoi, attributes, onChange ) }
+
+                            </areoi.components.PanelBody>
+                                
+                        </areoi.editor.InspectorControls>
+
+                        <areoi.editor.InnerBlocks template={ BLOCKS_TEMPLATE } allowedBlocks={ ALLOWED_BLOCKS } />
+     
+                    </div>
+                }
+            </>
+        );
+    },
+    save: () => { 
+        return (
+            <areoi.editor.InnerBlocks.Content/>
+        );
+    },
+});

Wordpress/wordpress/wp-content/plugins/all-bootstrap-blocks/blocks/toast/block.json

@@ -0,0 +1,53 @@
+{
+	"apiVersion": 2,
+	"name": "areoi/toast",
+	"title": "Toast",
+	"category": "areoi-components",
+	"description": "Push notifications to your visitors with a toast, a lightweight and easily customizable alert message.",
+	"textdomain": "default",
+	"keywords": [ "areoi", "bootstrap", "layout" ],
+	"example": {
+		"attributes": {
+			"preview": true
+		}
+	},
+	"attributes": {
+		"preview": {
+			"type": "boolean",
+			"default": false
+		},
+		"anchor": {
+			"type": "string",
+			"default": false
+		},
+		"block_id": {
+			"type": "string",
+			"default": null
+		},
+
+		"placement": {
+			"type": "string",
+			"default": "bottom-0 end-0"
+		},
+		"background": {
+			"type": "string",
+			"default": null
+		},
+		"text_color": {
+			"type": "string",
+			"default": null
+		},
+		"border_color": {
+			"type": "string",
+			"default": null
+		}
+	},
+	"supports": {
+		"anchor": true,
+		"align": false,
+		"html": false
+	},
+	"editorScript": "areoi-blocks",
+    "editorStyle": "file:./index.css",
+    "style": "file:../../build/style.css"
+}

Wordpress/wordpress/wp-content/plugins/all-bootstrap-blocks/blocks/toast/index.css

@@ -0,0 +1,7 @@
+.wp-block-areoi-toast {
+	position: relative !important;
+	display: block !important;
+	z-index: 1 !important;
+	visibility: visible !important;
+	opacity:  1 !important;
+}