Changeset 3797446

Timestamp:

11/12/2026 03:43:15 AM (17 hours ago)

Author:

gravitymaster97

Message:

Description of changes

Location:

gm-woo-product-list-widget

Files:

• assets/banner-1544x500.png (modified) ( previous)
• assets/banner-772x250.png (modified) ( previous)
• assets/icon-128x128.png (modified) ( previous)
• assets/icon-256x256.png (modified) ( previous)
• assets/screenshot-1.png (modified) ( previous)
• assets/screenshot-2.png (modified) ( previous)
• assets/screenshot-3.png (modified) ( previous)
• assets/screenshot-4.png (modified) ( previous)
• assets/screenshot-5.png (modified) ( previous)
• assets/screenshot-6.png (added)
• assets/screenshot-7.png (added)
• assets/screenshot-8.png (added)
• assets/screenshot-9.png (added)
• trunk/build/admin (added)
• trunk/build/admin/admin-app.asset.php (added)
• trunk/build/admin/admin-app.js (added)
• trunk/build/block.js (modified) (1 diff)
• trunk/build/frontend-app.js (added)
• trunk/css/admin-style.css (modified) (1 diff)
• trunk/css/block-editor.css (added)
• trunk/css/frontend-app.css (added)
• trunk/gm-woo-product-list-widget.php (modified) (2 diffs)
• trunk/includes/GMWPLW_Admin.php (modified) (1 diff)
• trunk/includes/GMWPLW_Api.php (added)
• trunk/includes/GMWPLW_Block.php (modified) (4 diffs)
• trunk/includes/GMWPLW_Frontend.php (modified) (1 diff)
• trunk/includes/GMWPLW_Store.php (added)
• trunk/package.json (added)
• trunk/readme.txt (modified) (2 diffs)
• trunk/src-admin (added)
• trunk/src-admin/admin-app.jsx (added)
• trunk/webpack.config.js (added)

gm-woo-product-list-widget/trunk/build/block.js

@@ -1 @@
-const { registerBlockType } = wp.blocks;
-const { SelectControl } = wp.components;
-const { createElement, useEffect } = wp.element;
+( function ( wp ) {
+        'use strict';
 
-registerBlockType('gmwplw/gmwplw-block', {
-    title: 'Product Shortcode - Widget - Block for Woocommerce',
-    category: 'common',
-    attributes: {
-        selectedOption: {
-            type: 'string',
-            default: ''
-        }
-    },
-    edit: (props) => {
-        const { attributes, setAttributes } = props;
+        var registerBlockType = wp.blocks.registerBlockType;
+        var el = wp.element.createElement;
+        var useEffect = wp.element.useEffect;
 
-        // Set the default value to the first option if none is selected
-        useEffect(() => {
-            if (!attributes.selectedOption && gmwplwBlockData.options.length > 0) {
-                setAttributes({ selectedOption: gmwplwBlockData.options[0].value });
-            }
-        }, []);
+        var options = ( window.gmwplwBlockData && window.gmwplwBlockData.options ) || [];
 
-        return createElement(SelectControl, {
-            label: 'Choose a Product Widget',
-            value: attributes.selectedOption,
-            options: gmwplwBlockData.options, // Access the PHP-passed options
-            onChange: (newValue) => setAttributes({ selectedOption: newValue })
-        });
-    },
-    save: () => {
-        return null; // Server-side rendering only
-    }
-});
+        registerBlockType( 'gmwplw/gmwplw-block', {
+                title: 'Product Shortcode - Widget - Block for Woocommerce',
+                icon: 'grid-view',
+                category: 'woocommerce',
+                attributes: {
+                        selectedOption: {
+                                type: 'string',
+                                default: '',
+                        },
+                },
+
+                edit: function ( props ) {
+                        var attributes = props.attributes;
+                        var setAttributes = props.setAttributes;
+
+                        useEffect( function () {
+                                if ( ! attributes.selectedOption && options.length > 0 ) {
+                                        setAttributes( { selectedOption: options[ 0 ].value } );
+                                }
+                        }, [] );
+
+                        if ( options.length === 0 ) {
+                                return el(
+                                        'div',
+                                        { className: 'gmwplw-block-card gmwplw-block-card--empty' },
+                                        el( 'div', { className: 'gmwplw-block-card__icon' }, '\u25A6' ),
+                                        el(
+                                                'p',
+                                                { className: 'gmwplw-block-card__empty-text' },
+                                                'No Product Builders found yet. Create one on the ',
+                                                el(
+                                                        'a',
+                                                        { href: ( window.gmwplwBlockData && window.gmwplwBlockData.buildersUrl ) || '#', target: '_blank', rel: 'noopener noreferrer' },
+                                                        'Product Builders'
+                                                ),
+                                                ' admin page, then come back and add this block.'
+                                        )
+                                );
+                        }
+
+                        var selected = options.find( function ( option ) {
+                                return option.value === attributes.selectedOption;
+                        } );
+
+                        return el(
+                                'div',
+                                { className: 'gmwplw-block-card' },
+                                el(
+                                        'div',
+                                        { className: 'gmwplw-block-card__header' },
+                                        el( 'span', { className: 'gmwplw-block-card__icon' }, '\u25A6' ),
+                                        el( 'span', { className: 'gmwplw-block-card__title' }, 'Product Builder' )
+                                ),
+                                el(
+                                        'label',
+                                        { className: 'gmwplw-block-card__label', htmlFor: 'gmwplw-block-select' },
+                                        'Choose a Product Builder'
+                                ),
+                                el(
+                                        'select',
+                                        {
+                                                id: 'gmwplw-block-select',
+                                                className: 'gmwplw-block-select',
+                                                value: attributes.selectedOption,
+                                                onChange: function ( event ) {
+                                                        setAttributes( { selectedOption: event.target.value } );
+                                                },
+                                        },
+                                        options.map( function ( option ) {
+                                                return el(
+                                                        'option',
+                                                        { key: option.value, value: option.value },
+                                                        option.label
+                                                );
+                                        } )
+                                ),
+                                selected &&
+                                        el(
+                                                'p',
+                                                { className: 'gmwplw-block-card__hint' },
+                                                'Showing: ',
+                                                el( 'strong', {}, selected.label )
+                                        )
+                        );
+                },
+
+                save: function () {
+                        return null; // Server-side rendering only.
+                },
+        } );
+} )( window.wp );

gm-woo-product-list-widget/trunk/css/admin-style.css

@@ -1 @@
-.showc_taxonomy_val{
-    display: none;
-}
+#gmwplw-metabox-root,
+#gmwplw-builder-app-root {
+        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+}
+
+#gmwplw-builder-app-root * {
+        box-sizing: border-box;
+}
+
+.gmwplw-page {
+        max-width: 1180px;
+        margin: 24px 20px 40px 0;
+        display: flex;
+        flex-direction: column;
+        gap: 22px;
+}
+
+/* Page header ---------------------------------------------------------- */
+
+.gmwplw-page-header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 20px;
+        background: linear-gradient(135deg, #6C4CF1, #5433D6);
+        border-radius: 14px;
+        padding: 24px 28px;
+        color: #fff;
+}
+
+.gmwplw-page-header__brand {
+        display: flex;
+        align-items: center;
+        gap: 16px;
+}
+
+.gmwplw-page-header__logo {
+        width: 46px;
+        height: 46px;
+        flex-shrink: 0;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: rgba(255, 255, 255, 0.15);
+        border-radius: 12px;
+        font-size: 22px;
+}
+
+.gmwplw-page-header__title {
+        font-size: 20px;
+        font-weight: 700;
+        margin: 0 0 4px 0;
+        color: #fff;
+}
+
+.gmwplw-page-header__desc {
+        font-size: 13px;
+        margin: 0;
+        color: rgba(255, 255, 255, 0.85);
+}
+
+.gmwplw-page-header__support {
+        flex-shrink: 0;
+        background: rgba(255, 255, 255, 0.12) !important;
+        border-color: rgba(255, 255, 255, 0.4) !important;
+        color: #fff !important;
+        white-space: nowrap;
+}
+
+.gmwplw-page-header__support:hover {
+        background: rgba(255, 255, 255, 0.22) !important;
+        border-color: #fff !important;
+        color: #fff !important;
+}
+
+.gmwplw-page-footer {
+        text-align: center;
+        font-size: 12.5px;
+        color: #ADA6BE;
+        padding: 4px 0 8px;
+}
+
+.gmwplw-page-footer a {
+        color: #6C4CF1;
+        text-decoration: none;
+        font-weight: 600;
+}
+
+.gmwplw-page-footer a:hover {
+        text-decoration: underline;
+}
+
+/* Stat cards -------------------------------------------------------- */
+
+.gmwplw-stats-row {
+        display: grid;
+        grid-template-columns: repeat(4, 1fr);
+        gap: 14px;
+        margin-bottom: 20px;
+}
+
+.gmwplw-stat-card {
+        background: #fff;
+        border: 1px solid #E7E3F3;
+        border-radius: 12px;
+        padding: 16px 18px;
+        display: flex;
+        flex-direction: column;
+        gap: 2px;
+}
+
+.gmwplw-stat-card__value {
+        font-size: 22px;
+        font-weight: 700;
+        color: #1E1B2E;
+}
+
+.gmwplw-stat-card__label {
+        font-size: 12px;
+        color: #6B6478;
+}
+
+/* General layout ------------------------------------------------------ */
+
+.gmwplw-admin-listhead {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 20px;
+        margin-bottom: 4px;
+}
+
+.gmwplw-admin-listhead__title {
+        font-size: 16px;
+        font-weight: 600;
+        margin: 0;
+        color: #1E1B2E;
+}
+
+.gmwplw-admin-listhead__desc {
+        font-size: 13px;
+        color: #6B6478;
+        margin: 0;
+        max-width: 520px;
+}
+
+.gmwplw-admin-empty {
+        color: #6B6478;
+        font-size: 13px;
+        padding: 20px 0;
+}
+
+.gmwplw-admin-table {
+        width: 100%;
+        border-collapse: collapse;
+        font-size: 13px;
+}
+
+.gmwplw-admin-table th {
+        text-align: left;
+        padding: 10px 12px;
+        font-size: 11px;
+        font-weight: 600;
+        text-transform: uppercase;
+        letter-spacing: 0.03em;
+        color: #6B6478;
+        border-bottom: 1px solid #E7E3F3;
+}
+
+.gmwplw-admin-table td {
+        padding: 12px;
+        border-bottom: 1px solid #F0EDF9;
+        vertical-align: middle;
+}
+
+.gmwplw-admin-table tr:hover td {
+        background: #FBFAFE;
+}
+
+.gmwplw-admin-table code {
+        background: #F8F7FC;
+        color: #5433D6;
+        padding: 2px 8px;
+        border-radius: 4px;
+        font-size: 12px;
+}
+
+.gmwplw-admin-table__actions {
+        display: flex;
+        gap: 6px;
+        justify-content: flex-end;
+}
+
+.gmwplw-admin-icon-btn {
+        appearance: none;
+        border: 1px solid #E7E3F3;
+        background: #fff;
+        color: #6B6478;
+        border-radius: 7px;
+        width: 30px;
+        height: 30px;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        cursor: pointer;
+        transition: all 0.15s ease;
+}
+
+.gmwplw-admin-icon-btn:hover {
+        border-color: #6C4CF1;
+        color: #6C4CF1;
+}
+
+.gmwplw-admin-icon-btn--danger:hover {
+        border-color: #E24444;
+        color: #E24444;
+}
+
+.gmwplw-admin-icon-btn:disabled {
+        opacity: 0.5;
+        cursor: not-allowed;
+}
+
+.gmwplw-icon {
+        display: block;
+}
+
+.gmwplw-admin-badge {
+        display: inline-block;
+        padding: 3px 10px;
+        border-radius: 999px;
+        font-size: 11px;
+        font-weight: 600;
+        text-transform: capitalize;
+        background: #EFEAFF;
+        color: #5433D6;
+}
+
+.gmwplw-admin-badge--table {
+        background: #FFF3D6;
+        color: #8A6300;
+}
+
+.gmwplw-admin-badge--grid {
+        background: #DFF5E9;
+        color: #14804A;
+}
+
+.gmwplw-admin-back {
+        appearance: none;
+        border: none;
+        background: none;
+        color: #6C4CF1;
+        font-size: 13px;
+        font-weight: 600;
+        cursor: pointer;
+        padding: 0;
+        align-self: flex-start;
+}
+
+.gmwplw-admin-back:hover {
+        text-decoration: underline;
+}
+
+.gmwplw-admin-card {
+        position: relative;
+        display: flex;
+        flex-direction: column;
+        gap: 18px;
+        background: #fff;
+        border: 1px solid #E7E3F3;
+        border-radius: 14px;
+        padding: 22px 24px;
+}
+
+.gmwplw-admin-loading {
+        align-items: center;
+        justify-content: center;
+        padding: 40px 0;
+}
+
+.gmwplw-admin-spinner {
+        width: 22px;
+        height: 22px;
+        border-radius: 50%;
+        border: 2px solid #E7E3F3;
+        border-top-color: #6C4CF1;
+        animation: gmwplw-admin-spin 0.7s linear infinite;
+        display: inline-block;
+}
+
+@keyframes gmwplw-admin-spin {
+        to { transform: rotate(360deg); }
+}
+
+.gmwplw-admin-shortcode {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        padding: 10px 14px;
+        background: #F8F7FC;
+        border: 1px solid #E7E3F3;
+        border-radius: 8px;
+        font-size: 12.5px;
+}
+
+.gmwplw-admin-shortcode code {
+        flex: 1;
+}
+
+.gmwplw-copy-link {
+        appearance: none;
+        border: none;
+        background: none;
+        color: #6C4CF1;
+        font-size: 12px;
+        font-weight: 600;
+        cursor: pointer;
+        display: inline-flex;
+        align-items: center;
+        gap: 4px;
+        padding: 0;
+        margin-left: auto;
+}
+
+.gmwplw-copy-link:hover {
+        text-decoration: underline;
+}
+
+.gmwplw-admin-shortcode span {
+        font-weight: 600;
+        color: #6B6478;
+        text-transform: uppercase;
+        font-size: 11px;
+        letter-spacing: 0.03em;
+}
+
+.gmwplw-admin-shortcode code {
+        background: #EFEAFF;
+        color: #5433D6;
+        padding: 2px 8px;
+        border-radius: 4px;
+}
+
+/* Tabs ------------------------------------------------------------- */
+
+.gmwplw-tabs {
+        display: flex;
+        gap: 4px;
+        border-bottom: 1px solid #E7E3F3;
+        margin-bottom: 4px;
+}
+
+.gmwplw-tab {
+        appearance: none;
+        border: none;
+        background: none;
+        padding: 10px 16px;
+        font-size: 13px;
+        font-weight: 600;
+        color: #6B6478;
+        cursor: pointer;
+        border-bottom: 2px solid transparent;
+        margin-bottom: -1px;
+        transition: color 0.15s ease, border-color 0.15s ease;
+}
+
+.gmwplw-tab:hover {
+        color: #1E1B2E;
+}
+
+.gmwplw-tab.is-active {
+        color: #6C4CF1;
+        border-bottom-color: #6C4CF1;
+}
+
+.gmwplw-tabpanel {
+        display: flex;
+        flex-direction: column;
+        gap: 16px;
+        padding-top: 6px;
+}
+
+/* Fields ------------------------------------------------------------ */
+
+.gmwplw-admin-field {
+        display: flex;
+        flex-direction: column;
+        gap: 6px;
+}
+
+.gmwplw-admin-field--inline {
+        flex-direction: row;
+        align-items: center;
+        justify-content: space-between;
+}
+
+.gmwplw-admin-field__label {
+        font-size: 12px;
+        font-weight: 600;
+        color: #1E1B2E;
+}
+
+.gmwplw-admin-field__hint {
+        font-size: 11.5px;
+        color: #6B6478;
+        margin: 0;
+        font-style: italic;
+}
+
+.gmwplw-admin-pills {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+}
+
+.gmwplw-admin-pill {
+        appearance: none;
+        border: 1px solid #E7E3F3;
+        background: #fff;
+        color: #1E1B2E;
+        padding: 8px 16px;
+        border-radius: 999px;
+        font-size: 12.5px;
+        font-weight: 500;
+        cursor: pointer;
+        display: inline-flex;
+        align-items: center;
+        gap: 6px;
+        transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
+}
+
+.gmwplw-admin-pill__icon {
+        font-size: 13px;
+}
+
+.gmwplw-admin-pill:hover {
+        border-color: #6C4CF1;
+}
+
+.gmwplw-admin-pill.is-active {
+        background: #6C4CF1;
+        border-color: #6C4CF1;
+        color: #fff;
+}
+
+.gmwplw-admin-input,
+.gmwplw-admin-select {
+        width: 100%;
+        max-width: 320px;
+        box-sizing: border-box;
+        padding: 8px 12px;
+        font-size: 13px;
+        color: #1E1B2E;
+        background: #fff;
+        border: 1px solid #E7E3F3;
+        border-radius: 8px;
+        outline: none;
+        transition: border-color 0.15s ease, box-shadow 0.15s ease;
+}
+
+.gmwplw-admin-input:focus,
+.gmwplw-admin-select:focus {
+        border-color: #6C4CF1;
+        box-shadow: 0 0 0 3px #EFEAFF;
+}
+
+.gmwplw-range-inputs {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        max-width: 320px;
+}
+
+.gmwplw-range-inputs .gmwplw-admin-input {
+        max-width: none;
+}
+
+.gmwplw-range-sep {
+        color: #ADA6BE;
+}
+
+/* Toggle switch ------------------------------------------------------ */
+
+.gmwplw-toggle {
+        appearance: none;
+        border: none;
+        background: none;
+        display: inline-flex;
+        align-items: center;
+        gap: 10px;
+        cursor: pointer;
+        padding: 0;
+}
+
+.gmwplw-toggle__track {
+        width: 38px;
+        height: 22px;
+        border-radius: 999px;
+        background: #E7E3F3;
+        position: relative;
+        transition: background 0.15s ease;
+        flex-shrink: 0;
+}
+
+.gmwplw-toggle__thumb {
+        position: absolute;
+        top: 2px;
+        left: 2px;
+        width: 18px;
+        height: 18px;
+        border-radius: 50%;
+        background: #fff;
+        box-shadow: 0 1px 3px rgba(30, 27, 46, 0.25);
+        transition: transform 0.15s ease;
+}
+
+.gmwplw-toggle.is-on .gmwplw-toggle__track {
+        background: #6C4CF1;
+}
+
+.gmwplw-toggle.is-on .gmwplw-toggle__thumb {
+        transform: translateX(16px);
+}
+
+.gmwplw-toggle__label {
+        font-size: 12.5px;
+        color: #6B6478;
+}
+
+/* Buttons ------------------------------------------------------------ */
+
+.gmwplw-admin-actionbar {
+        margin-top: 4px;
+}
+
+.gmwplw-admin-btn {
+        appearance: none;
+        border: none;
+        border-radius: 8px;
+        padding: 10px 22px;
+        font-size: 13px;
+        font-weight: 600;
+        cursor: pointer;
+        display: inline-flex;
+        align-items: center;
+        gap: 6px;
+        transition: background 0.15s ease, opacity 0.15s ease;
+}
+
+.gmwplw-admin-btn--primary {
+        background: #6C4CF1;
+        color: #fff;
+}
+
+.gmwplw-admin-btn--primary:hover {
+        background: #5433D6;
+}
+
+.gmwplw-admin-btn--primary:disabled {
+        opacity: 0.6;
+        cursor: not-allowed;
+}
+
+.gmwplw-admin-btn--outline {
+        background: #fff;
+        border: 1px solid #E7E3F3;
+        color: #1E1B2E;
+}
+
+.gmwplw-admin-btn--outline:hover {
+        border-color: #6C4CF1;
+        color: #6C4CF1;
+}
+
+.gmwplw-admin-btn--ghost {
+        background: none;
+        color: #6B6478;
+}
+
+.gmwplw-admin-btn--danger {
+        background: #E24444;
+        color: #fff;
+}
+
+.gmwplw-admin-btn--danger:hover {
+        background: #C62F2F;
+}
+
+.gmwplw-admin-toast {
+        position: fixed;
+        bottom: 24px;
+        right: 24px;
+        background: #1E1B2E;
+        color: #fff;
+        padding: 12px 20px;
+        border-radius: 10px;
+        font-size: 13px;
+        font-weight: 500;
+        box-shadow: 0 4px 16px rgba(30, 27, 46, 0.16);
+        z-index: 100000;
+}
+
+/* Confirm modal -------------------------------------------------------- */
+
+.gmwplw-modal-overlay {
+        position: fixed;
+        inset: 0;
+        background: rgba(30, 27, 46, 0.45);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        z-index: 100000;
+}
+
+.gmwplw-modal {
+        background: #fff;
+        border-radius: 12px;
+        padding: 22px 24px;
+        max-width: 380px;
+        width: 90%;
+        box-shadow: 0 12px 32px rgba(30, 27, 46, 0.2);
+}
+
+.gmwplw-modal__title {
+        margin: 0 0 8px 0;
+        font-size: 16px;
+        color: #1E1B2E;
+}
+
+.gmwplw-modal__message {
+        margin: 0 0 18px 0;
+        font-size: 13px;
+        color: #6B6478;
+        line-height: 1.5;
+}
+
+.gmwplw-modal__actions {
+        display: flex;
+        justify-content: flex-end;
+        gap: 10px;
+}
+
+/* Editor two-column layout -------------------------------------------- */
+
+.gmwplw-editor-grid {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) 320px;
+        gap: 20px;
+        align-items: start;
+}
+
+.gmwplw-editor-side {
+        position: sticky;
+        top: 32px;
+}
+
+@media (max-width: 960px) {
+        .gmwplw-stats-row {
+                grid-template-columns: repeat(2, 1fr);
+        }
+        .gmwplw-page-header {
+                flex-direction: column;
+                align-items: flex-start;
+        }
+}
+
+/* Checkbox list (categories/tags/attributes) ---------------------------- */
+
+.gmwplw-checkbox-list {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px 16px;
+        max-height: 220px;
+        overflow-y: auto;
+        padding: 12px;
+        border: 1px solid #E7E3F3;
+        border-radius: 8px;
+        background: #FBFAFE;
+}
+
+.gmwplw-checkbox-item {
+        display: flex;
+        align-items: center;
+        gap: 6px;
+        font-size: 12.5px;
+        color: #1E1B2E;
+        cursor: pointer;
+        white-space: nowrap;
+}
+
+/* Color input ------------------------------------------------------------ */
+
+.gmwplw-color-input {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        max-width: 320px;
+}
+
+.gmwplw-color-input input[type="color"] {
+        width: 40px;
+        height: 36px;
+        padding: 2px;
+        border: 1px solid #E7E3F3;
+        border-radius: 8px;
+        cursor: pointer;
+        background: #fff;
+}
+
+.gmwplw-color-input .gmwplw-admin-input {
+        max-width: none;
+}
+
+/* Column builder ----------------------------------------------------------- */
+
+.gmwplw-column-builder {
+        display: flex;
+        flex-direction: column;
+        gap: 12px;
+}
+
+.gmwplw-column-list {
+        display: flex;
+        flex-direction: column;
+        gap: 6px;
+}
+
+.gmwplw-column-row {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        padding: 8px 10px;
+        border: 1px solid #E7E3F3;
+        border-radius: 8px;
+        background: #fff;
+        cursor: grab;
+}
+
+.gmwplw-column-row.is-dragging {
+        opacity: 0.5;
+        border-style: dashed;
+}
+
+.gmwplw-column-row__grip {
+        color: #ADA6BE;
+        display: flex;
+        flex-shrink: 0;
+}
+
+.gmwplw-column-row__label {
+        flex: 1;
+        font-size: 13px;
+        font-weight: 600;
+        color: #1E1B2E;
+        display: flex;
+        align-items: center;
+        gap: 8px;
+}
+
+.gmwplw-column-row__tag {
+        font-size: 11px;
+        font-weight: 400;
+        color: #ADA6BE;
+        font-style: italic;
+}
+
+.gmwplw-column-row__actions {
+        display: flex;
+        align-items: center;
+        gap: 6px;
+        flex-shrink: 0;
+}
+
+.gmwplw-mini-btn {
+        appearance: none;
+        border: 1px solid #E7E3F3;
+        background: #fff;
+        color: #6B6478;
+        width: 26px;
+        height: 26px;
+        border-radius: 6px;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        cursor: pointer;
+        font-size: 12px;
+        transition: all 0.15s ease;
+}
+
+.gmwplw-mini-btn:hover:not(:disabled) {
+        border-color: #6C4CF1;
+        color: #6C4CF1;
+}
+
+.gmwplw-mini-btn:disabled {
+        opacity: 0.35;
+        cursor: not-allowed;
+}
+
+.gmwplw-mini-btn--danger:hover {
+        border-color: #E24444;
+        color: #E24444;
+}
+
+.gmwplw-column-add {
+        display: flex;
+        flex-direction: column;
+        gap: 10px;
+        padding-top: 8px;
+        border-top: 1px dashed #E7E3F3;
+}
+
+.gmwplw-column-add__row {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+        align-items: center;
+}
+
+.gmwplw-column-add__row .gmwplw-admin-input,
+.gmwplw-column-add__row .gmwplw-admin-select {
+        max-width: 240px;
+}

gm-woo-product-list-widget/trunk/gm-woo-product-list-widget.php

@@ -1 +1 @@
 <?php
 /**
- * Plugin Name: Product List / Grid View for Woocommerce
- * Description: GM Woo Product list Widget to show product list in widget with verious option
- * Version:     1.0
+ * Plugin Name: Product Table, Grid, List Builder For WooCommerce
+ * Description: Build reusable product Table, Grid, and List layouts for WooCommerce, insert them anywhere via shortcode or block.
+ * Version:     3.4.0
  * Author:      Gravity Master
  * License:     GPLv2 or later
@@ -44 +44 @@
 spl_autoload_register('gmwplw_class_auto_loader');
 
+/**
+ * Declare compatibility with WooCommerce High-Performance Order Storage (HPOS).
+ * This plugin doesn't touch order data directly, so it's compatible as-is.
+ */
+add_action( 'before_woocommerce_init', function () {
+        if ( class_exists( '\Automattic\WooCommerce\Utilities\FeaturesUtil' ) ) {
+                \Automattic\WooCommerce\Utilities\FeaturesUtil::declare_compatibility( 'custom_order_tables', __FILE__, true );
+        }
+} );
+
 /* Initialize all modules now. */
 
-new GMWPLW_Comman();
+new GMWPLW_Store();
 new GMWPLW_Admin();
 new GMWPLW_Block();
 new GMWPLW_Frontend();
+new GMWPLW_Api();
 
-include(GMWPLW_PLUGIN_DIR . 'includes/GMWPLW_Widget.php');
+/**
+ * Add a "Settings" link on the Plugins page pointing to the Product Builders screen.
+ */
+if ( ! function_exists( 'gmwplw_plugin_action_links' ) ) {
+        function gmwplw_plugin_action_links( $links ) {
+                $settings_link = '<a href="' . esc_url( admin_url( 'admin.php?page=gmwplw-builders' ) ) . '">' . __( 'Settings', 'gmwplw' ) . '</a>';
+                array_unshift( $links, $settings_link );
+                return $links;
+        }
+}
+add_filter( 'plugin_action_links_' . GMWPLW_PLUGIN_BASENAME, 'gmwplw_plugin_action_links' );
 
-add_action( 'wp_enqueue_scripts',  'gmwplw_insta_scritps'  );
-function gmwplw_insta_scritps () {
-                wp_enqueue_style('gmwqp-style', GMWPLW_PLUGIN_URL . '/css/style.css', array(), '1.0.0', 'all');
-        }
-?>

gm-woo-product-list-widget/trunk/includes/GMWPLW_Admin.php

@@ -2 +2 @@
 
 /**
- * This class is loaded on the back-end since its main job is 
- * to display the Admin to box.
+ * This class registers the top-level "Product Builders" admin page.
+ * The page itself is a React app written in real JSX (src-admin/admin-app.jsx),
+ * compiled ahead of time with @wordpress/scripts (see package.json — run
+ * `npm install && npm run build` after editing the source file). It talks
+ * to the REST endpoints in GMWPLW_Api / GMWPLW_Store.
  */
 
 class GMWPLW_Admin {
-        
-        protected static $instance = NULL;
 
+        const PAGE_SLUG = 'gmwplw-builders';
 
         public function __construct () {
-                add_action( 'init', array( $this, 'GMWPLW_init' ) );
-                add_action( 'add_meta_boxes', array($this, 'GMWPLW_add_meta_box'));
-                add_action('admin_enqueue_scripts', array($this, 'GMWPLW_scripts'));
-                
-                add_action( 'wp_ajax_gmwqp_change_tax', array( $this, 'gmwqp_change_tax' ));
-                add_action( 'wp_ajax_nopriv_gmwqp_change_tax', array( $this, 'gmwqp_change_tax' ));
-
-                add_action( 'edit_post', array($this, 'GMWPLW_meta_save'), 10, 2);
+                add_action( 'admin_menu', array( $this, 'GMWPLW_admin_menu' ) );
+                add_action( 'admin_enqueue_scripts', array( $this, 'GMWPLW_scripts' ) );
         }
 
-        public function GMWPLW_init () {
-                
-                $args = array(
-                'label'  => __( 'Product Widget', 'gmwrpm' ),
-                'public'             => false, // Set to false to hide it from the frontend.
-                'publicly_queryable' => false, // Set to false to prevent queries from the frontend.
-                'show_ui'            => true, // Show in the admin dashboard.
-                'show_in_admin_bar'  => true, // Show in the admin bar.
-                'query_var'          => false, // Disable query variable.
-                'rewrite'            => false, // Disable URL rewriting.
-                'capability_type'    => 'post',
-                'has_archive'        => false, // Disable archives.
-                'menu_position'      => null,
-                'supports'  => array( 'title' ),
-            );
-            register_post_type( 'product_widget', $args );
-
+        public function GMWPLW_admin_menu() {
+                add_menu_page(
+                        __( 'Product Builders', 'gmwplw' ),
+                        __( 'Product Builders', 'gmwplw' ),
+                        'manage_woocommerce',
+                        self::PAGE_SLUG,
+                        array( $this, 'GMWPLW_render_page' ),
+                        'dashicons-grid-view',
+                        56
+                );
         }
 
-        public function GMWPLW_add_meta_box() {
-            add_meta_box(
-                'GMWPLW_metabox',
-                __( 'Product Widget Settings', 'gmwrpm' ),
-                array($this, 'GMWPLW_metabox_rule'),
-                'product_widget',
-                'normal'
-            );
-   }
-   public function GMWPLW_meta_save( $post_id, $post ) {
-                if ($post->post_type != 'product_widget') { return; }
-                if ( !current_user_can( 'edit_post', $post_id )) return;
+        public function GMWPLW_render_page() {
+                $asset_file = GMWPLW_PLUGIN_DIR . 'build/admin/admin-app.asset.php';
 
-                update_post_meta($post_id, 'gmwplw_select_type', sanitize_text_field($_POST['gmwplw_select_type']));
-            update_post_meta($post_id, 'gmwplw_product_show', intval($_POST['gmwplw_product_show']));
-            update_post_meta($post_id, 'gmwplw_show_per_column', intval($_POST['gmwplw_show_per_column']));
-            update_post_meta($post_id, 'gmwplw_thum', sanitize_text_field($_POST['gmwplw_thum']));
-            update_post_meta($post_id, 'gmwplw_order_by', sanitize_text_field($_POST['gmwplw_order_by']));
-            update_post_meta($post_id, 'gmwplw_order', sanitize_text_field($_POST['gmwplw_order']));
-            update_post_meta($post_id, 'gmwplw_select_tax_val', sanitize_text_field($_POST['gmwplw_select_tax_val']));
-            update_post_meta($post_id, 'gmwplw_layout', sanitize_text_field($_POST['gmwplw_layout']));
-            
-   }
-   public function GMWPLW_metabox_rule( $post ) {
-        $gmwplw_select_type = get_post_meta( $post->ID,'gmwplw_select_type', true);
-        if (empty($gmwplw_select_type)) {
-            $gmwplw_select_type = 'all';
-        }
-        $gmwplw_product_show = get_post_meta( $post->ID,'gmwplw_product_show', true);
-        if (empty($gmwplw_product_show)) {
-            $gmwplw_product_show = 5;
-        }
-        $gmwplw_show_per_column = get_post_meta( $post->ID,'gmwplw_show_per_column', true);
-        if (empty($gmwplw_show_per_column)) {
-            $gmwplw_show_per_column = 3;
+                if ( ! file_exists( $asset_file ) ) {
+                        echo '<div class="notice notice-error"><p>';
+                        echo esc_html__( 'Product Builders: the admin app has not been built yet. Run "npm install && npm run build" in the plugin folder.', 'gmwplw' );
+                        echo '</p></div>';
+                        return;
+                }
+
+                echo '<div id="gmwplw-builder-app-root"></div>';
         }
 
-        
-        $gmwplw_thum = get_post_meta( $post->ID,'gmwplw_thum', true);
-        if (empty($gmwplw_thum)) {
-            $gmwplw_thum = 'yes';
-        }
-        $gmwplw_order_by = get_post_meta( $post->ID,'gmwplw_order_by', true);
-        $gmwplw_order = get_post_meta( $post->ID,'gmwplw_order', true);
-        $gmwplw_select_tax_val = get_post_meta( $post->ID,'gmwplw_select_tax_val', true);
-        $gmwplw_layout = get_post_meta( $post->ID,'gmwplw_layout', true);
-        if (empty($gmwplw_layout)) {
-            $gmwplw_layout = 'list';
-        }
-        
-        
-        ?>
-        <div class="gmwplw_settings">
-                <table>
-                        <tr>
-                                <td>Shortcode</td>
-                                <td>
-                                        <code>[gmwplw_product_layout id="<?php echo $post->ID;?>"]</code>
-                                </td>
-                        </tr>
-                        <tr>
-                                <td>Display Layout</td>
-                                <td>
-                                        <input  name="gmwplw_layout" type="radio" value="list" <?php checked( $gmwplw_layout, 'list' ); ?> /> List
-                                        <input  name="gmwplw_layout" type="radio" value="grid" <?php checked( $gmwplw_layout, 'grid' ); ?> /> Grid
-                                </td>
-                        </tr>
-                        <tr>
-                                <td>Select Type</td>
-                                <td>
-                                        <?php
-                                        $taxonomies=get_object_taxonomies( 'product', 'objects' ); 
-                        
-                                        $taxc = array();
-                                        foreach ($taxonomies as $key => $value) {
-                                                if($value->show_ui){
-                                                        $taxc[$key] = $value->label;
-                                                }
-                                        }
-                                        ?>
-                                        <input  
-                                        name="gmwplw_select_type" 
-                                        type="radio" 
-                                        value="all"  
-                                        iscal="no" 
-                                        <?php checked( $gmwplw_select_type, 'all' ); ?>  
-                                        class="changecat"/> All<br/>
-                                        <input  
-                                        name="gmwplw_select_type" 
-                                        type="radio" 
-                                        value="featured"  
-                                        iscal="no" 
-                                        <?php checked( $gmwplw_select_type, 'featured' ); ?>  
-                                        class="changecat"/> Featured<br/>
-                                        <input  
-                                        name="gmwplw_select_type" 
-                                        type="radio" 
-                                        value="sale" 
-                                        iscal="no"  
-                                        <?php checked( $gmwplw_select_type, 'sale' ); ?>  
-                                        class="changecat"/> On-Sale<br/>
-                                        <?php 
-                                        foreach($taxc as $taxckey=>$taxcval){
-                                                $isselcted = (($gmwplw_select_type ==$taxckey) ? 'checked' : '');
-                                                $arr_make = array('product_cat','product_tag');
-                                                $isdisabled = ((!in_array($taxckey,$arr_make)) ? 'disabled' : '');
-                                                echo '<input  
-                                                                name="gmwplw_select_type" 
-                                                                type="radio" 
-                                                                value="'.$taxckey.'" 
-                                                                iscal="yes"  
-                                                                '.$isselcted.' 
-                                                                '.$isdisabled.' 
-                                                                class="changecat"/> '.$taxcval;
-                                                if($isdisabled=='disabled'){
-                                                        echo "&nbsp;&nbsp;<a href='https://www.codesmade.com/store/product-list-widget-for-woocommerce-pro/' target='_blank'>Get Pro</a>";
-                                                }
-                                                echo '<br/>';
-                                                /*echo '<option  
-                                                iscal="yes"  
-                                                value="'.$taxckey.'" 
-                                                '.$isselcted.'
-                                                 '.$isdisabled.'>'.$taxcval.'</option>';*/
-                                        }
-                                        ?>
-                                        
-                                </td>
-                        </tr>
-                        <?php 
-                        if (array_key_exists($gmwplw_select_type, $taxc)) {
-                                $istax=true;
-                        }else{
-                                $istax=false;
-                        }
-                        ?>
-                        <tr class="showc_taxonomy_val" style="<?php echo ($istax == true) ? 'display: table-row' : ''; ?>">
-                                <td>Select Taxonomy Value</td>
-                                <td>
-                                        <?php
-                                        if($istax == true){
-                                                $terms = get_terms( $gmwplw_select_type, array(
-                                                            'hide_empty' => false,
-                                                        ) );
-                                                $taxc = array();
-                                                foreach ($terms as $key => $value) {
-                                                        $taxc[$value->term_id] = $value->name;
-                                                }
-                                        }
-                                        ?>
-                                        <select class='changetax_val widefat' name="gmwplw_select_tax_val" >
-                                                <?php 
-                                                if($istax == true){
-                                                        foreach($taxc as $taxckey=>$taxcval){
-                                                                echo '<option value="'.$taxckey.'" '.(($gmwplw_select_tax_val==$taxckey) ? 'selected' : '').'>'.$taxcval.'</option>';
-                                                        }
-                                                }
-                                                ?>
-                                        </select>
-                                </td>
-                        </tr>
-                        <tr>
-                                <td>No of Products Per Column <i>(Just work for grid layout)</i></td>
-                                <td>
-                                        <input type="number" name="gmwplw_show_per_column"  class="widefat" value="<?php echo esc_attr($gmwplw_show_per_column); ?>">
-                                </td>
-                        </tr>
-                        <tr>
-                                <td>No of Products </td>
-                                <td>
-                                        <input type="number" name="gmwplw_product_show"  class="widefat" value="<?php echo esc_attr($gmwplw_product_show); ?>">
-                                </td>
-                        </tr>
-                        <tr>
-                                <td>Show product thumbnails?</td>
-                                <td>
-                                        <input  name="gmwplw_thum" type="radio" value="yes" <?php checked( $gmwplw_thum, 'yes' ); ?> /> Yes
-                                        <input  name="gmwplw_thum" type="radio" value="no" <?php checked( $gmwplw_thum, 'no' ); ?> /> No
-                                </td>
-                        </tr>
-                        
-                        <tr>
-                                <td>Order By</td>
-                                <td>
-                                        <select  name="gmwplw_order_by"  class="widefat">
-                                                <option value='post_title' <?php echo ($gmwplw_order_by == 'post_title') ? 'selected' : ''; ?>>Product Name</option>
-                                                <option value='id' <?php echo ($gmwplw_order_by == 'id') ? 'selected' : ''; ?>>Product ID</option>
-                                                <option value='date' <?php echo ($gmwplw_order_by == 'date') ? 'selected' : ''; ?>>Date Published</option>
-                                                <option value='modified' <?php echo ($gmwplw_order_by == 'modified') ? 'selected' : ''; ?>>Last Modified</option>
-                                                <option value='rand' <?php echo ($gmwplw_order_by == 'rand') ? 'selected' : ''; ?>>Random</option>
-                                                <option value='total_sales' <?php echo ($gmwplw_order_by == 'total_sales') ? 'selected' : ''; ?>>Total Sales</option>
-                                                <option value='none' <?php echo ($gmwplw_order_by == 'none') ? 'selected' : ''; ?>>None</option>
-                                        </select>
-                                </td>
-                        </tr>
-                        <tr>
-                                <td>Order By</td>
-                                <td>
-                                        <select  name="gmwplw_order" class="widefat">
-                                                <option value='ASC' <?php echo ($gmwplw_order == 'ASC') ? 'selected' : ''; ?>>Ascending</option>
-                                                <option value='DESC' <?php echo ($gmwplw_order == 'DESC') ? 'selected' : ''; ?>>Descending</option>
-                                        </select>
-                                </td>
-                        </tr>
-                </table>
-        </div>
-        <?php
-   }
+        public function GMWPLW_scripts( $hook ) {
+                if ( 'toplevel_page_' . self::PAGE_SLUG !== $hook ) {
+                        return;
+                }
 
-        public static function get_instance()
-    {
-        if ( NULL === self::$instance )
-            self::$instance = new self;
+                $asset_file = GMWPLW_PLUGIN_DIR . 'build/admin/admin-app.asset.php';
+                if ( ! file_exists( $asset_file ) ) {
+                        return;
+                }
+                $asset = include $asset_file;
 
-        return self::$instance;
-    }
-        
-        
-        public function gmwqp_change_tax() {
-                $htmlfinal = '';
-                $terms = get_terms( sanitize_text_field($_REQUEST['option']), array(
-                                                    'hide_empty' => false,
-                                                ) );
-                foreach ($terms as $key => $value) {
-                        $htmlfinal .= '<option value="'.$value->term_id.'" >'.$value->name.'</option>';
-                }
-                echo html_entity_decode(esc_html($htmlfinal)) ;
-                
-                exit;
-        }
-        
+                wp_enqueue_script(
+                        'gmwplw-admin-app',
+                        GMWPLW_PLUGIN_URL . 'build/admin/admin-app.js',
+                        $asset['dependencies'],
+                        $asset['version'],
+                        true
+                );
 
+                wp_enqueue_style( 'gmwplw_admin_css', GMWPLW_PLUGIN_URL . 'css/admin-style.css', array(), $asset['version'] );
 
-        public function GMWPLW_scripts(){
-                wp_enqueue_script('gmwplwadmin-script', GMWPLW_PLUGIN_URL . '/js/admin-script.js', array(), '1.0.0', true );
-                wp_localize_script( 'gmwplwadmin-script', 'gmwplw_ajax_object', array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
-                wp_enqueue_style('gmwplw_admin_css', GMWPLW_PLUGIN_URL.'css/admin-style.css');
+                wp_localize_script( 'gmwplw-admin-app', 'gmwplwAdminData', array(
+                        'restRoot' => esc_url_raw( rest_url() ),
+                        'nonce'    => wp_create_nonce( 'wp_rest' ),
+                ) );
         }
 
-        
-
 }
-
-?>

gm-woo-product-list-widget/trunk/includes/GMWPLW_Block.php

@@ -1 +1 @@
 <?php
 class GMWPLW_Block {
-        
+
         protected static $instance = NULL;
 
@@ -7 +7 @@
         public function __construct () {
                 add_action( 'init', array( $this, 'GMWPLW_init' ) );
-                
+
         }
 
@@ -15 +15 @@
                 GMWPLW_PLUGIN_URL . '/build/block.js',
                 array('wp-blocks', 'wp-element', 'wp-editor'),
-                '1.0.0',
+                '3.4.0',
                 true
             );
-            $args = array(
-                            'post_type' => 'product_widget',
-                            'posts_per_page' => -1, 
-                            'orderby' => 'date',
-                            'order' => 'DESC',
-                            'post_status' => 'publish', // Retrieve only published posts.
-                        );
-            $posts = get_posts($args);
-            $arr= array();
-            foreach ($posts as $post) {
-                $arr[]= array('label' => $post->post_title, 'value' => $post->ID);
+            wp_register_style(
+                'gmwplw-block-editor-style',
+                GMWPLW_PLUGIN_URL . '/css/block-editor.css',
+                array(),
+                '3.4.0'
+            );
+
+            $builders = GMWPLW_Store::get_all();
+            $arr = array();
+            foreach ( $builders as $id => $builder ) {
+                $arr[] = array(
+                        'label' => isset( $builder['name'] ) ? $builder['name'] : 'Untitled Builder',
+                        'value' => $id,
+                );
             }
-             // Pass dynamic options to JavaScript
+            // Pass dynamic options to JavaScript
             wp_localize_script('gmwplw-block-script', 'gmwplwBlockData', array(
-                'options' => $arr
+                'options' => $arr,
+                'buildersUrl' => admin_url( 'admin.php?page=gmwplw-builders' ),
             ));
 
             register_block_type('gmwplw/gmwplw-block', array(
                 'editor_script' => 'gmwplw-block-script',
+                'editor_style'  => 'gmwplw-block-editor-style',
                 'render_callback' => array( $this,'gmwplw_block_render'),
             ));
@@ -42 +47 @@
 
         public function gmwplw_block_render($attributes) {
-            if(isset($attributes['selectedOption'])){
-                ob_start();
-                GMWPLW_returndata($attributes['selectedOption']);
-                $output = ob_get_clean();
-                return $output ;
-            }else{
-                return 'No option selected';
+            if ( empty( $attributes['selectedOption'] ) ) {
+                return 'No Product Builder selected.';
             }
-            
+
+            $builder_id = sanitize_text_field( $attributes['selectedOption'] );
+            if ( null === GMWPLW_Store::get( $builder_id ) ) {
+                return 'Product Builder not found.';
+            }
+
+            // Ensure the shared front-end script/style are registered even if
+            // GMWPLW_Frontend::GMWPLW_register_assets() hasn't run yet in this context.
+            if ( ! wp_script_is( 'gmwplw-frontend-app', 'registered' ) ) {
+                wp_register_script(
+                        'gmwplw-frontend-app',
+                        GMWPLW_PLUGIN_URL . '/build/frontend-app.js',
+                        array( 'wp-element' ),
+                        '3.4.0',
+                        true
+                );
+                wp_register_style(
+                        'gmwplw-frontend-app-style',
+                        GMWPLW_PLUGIN_URL . '/css/frontend-app.css',
+                        array(),
+                        '3.4.0'
+                );
+                wp_localize_script( 'gmwplw-frontend-app', 'gmwplwFrontendData', array(
+                        'restRoot' => esc_url_raw( rest_url() ),
+                        'ajaxUrl'  => admin_url( 'admin-ajax.php' ),
+                        'cartUrl'  => function_exists( 'wc_get_cart_url' ) ? wc_get_cart_url() : '',
+                ) );
+            }
+
+            wp_enqueue_script( 'gmwplw-frontend-app' );
+            wp_enqueue_style( 'gmwplw-frontend-app-style' );
+
+            return sprintf(
+                '<div class="gmwplw-mount" data-widget-id="%s"></div>',
+                esc_attr( $builder_id )
+            );
         }
 

gm-woo-product-list-widget/trunk/includes/GMWPLW_Frontend.php

@@ -2 +2 @@
 
 class GMWPLW_Frontend {
-        
+
         protected static $instance = NULL;
 
         public function __construct () {
+                add_action( 'wp_enqueue_scripts', array( $this, 'GMWPLW_register_assets' ) );
                 add_shortcode( 'gmwplw_product_layout', array( $this, 'gmwplw_product_layout' ) );
-
         }
 
-        public function gmwplw_product_layout($atts) {
-                
-        $atts = shortcode_atts(array(
-            'id' => '',
-        ), $atts);
+        /**
+         * Registers (but does not necessarily enqueue) the shared React
+         * front-end script/style, and localizes the REST root once so both
+         * the shortcode and the block's view script can rely on it.
+         */
+        public function GMWPLW_register_assets() {
+                wp_register_script(
+                        'gmwplw-frontend-app',
+                        GMWPLW_PLUGIN_URL . '/build/frontend-app.js',
+                        array( 'wp-element' ),
+                        '3.4.0',
+                        true
+                );
+                wp_register_style(
+                        'gmwplw-frontend-app-style',
+                        GMWPLW_PLUGIN_URL . '/css/frontend-app.css',
+                        array(),
+                        '3.4.0'
+                );
+                wp_localize_script( 'gmwplw-frontend-app', 'gmwplwFrontendData', array(
+                        'restRoot' => esc_url_raw( rest_url() ),
+                        'ajaxUrl'  => admin_url( 'admin-ajax.php' ),
+                        'cartUrl'  => function_exists( 'wc_get_cart_url' ) ? wc_get_cart_url() : '',
+                ) );
+        }
 
-        if (!empty($atts['id'])) {
-            $post_id = intval($atts['id']);
+        public function gmwplw_product_layout( $atts ) {
+                $atts = shortcode_atts( array(
+                        'id' => '',
+                ), $atts );
 
-            // Now you can use $product_id in your layout logic
-            // Example: Fetch and display product details based on $product_id
-            
-            ob_start();
-            GMWPLW_returndata($post_id);
-            $html_output = ob_get_clean();
+                if ( empty( $atts['id'] ) ) {
+                        return "<p>Error: Missing 'id' attribute in the shortcode.</p>";
+                }
 
-            return $html_output;
-        } else {
-            // Handle the case where 'id' attribute is missing
-            return "<p>Error: Missing 'id' attribute in the shortcode.</p>";
-        }
-    }
+                $builder_id = sanitize_text_field( $atts['id'] );
 
-        
+                if ( null === GMWPLW_Store::get( $builder_id ) ) {
+                        return '<p>Error: Product Builder not found.</p>';
+                }
+
+                wp_enqueue_script( 'gmwplw-frontend-app' );
+                wp_enqueue_style( 'gmwplw-frontend-app-style' );
+
+                return sprintf(
+                        '<div class="gmwplw-mount" data-widget-id="%s"></div>',
+                        esc_attr( $builder_id )
+                );
+        }
 
 }

gm-woo-product-list-widget/trunk/readme.txt

@@ -1 @@
-=== Product List / Grid View for Woocommerce ===
-Tested up to: 7.0
-stable tag:1.0
-Tags: product widget woocommerce,product list for woocommerce , category filter woocommerce, woocommerce widget product, woocommerce best sale product
+=== Product Table, Grid, List Builder For WooCommerce ===
+Tested up to: 6.2
+Stable tag: 3.4.0
+Tags: product table woocommerce, product grid woocommerce, product list builder, woocommerce shortcode builder, category filter woocommerce
 License: GPLv2 or later
 License URI: http://www.gnu.org/licenses/gpl-3.0.html
@@ -8 +8 @@
 == Description ==
 
-**WooCommerce Products List / Grid View** allows you to display a Fileter selection of products. woocommerce Product display shortcode uses the same styling as the WooCommerce built-in Product List widget. The products are being displayed in the order of much of filter like Product name, Product Id, Date Published, Random, Last Modified .
+**Product Table, Grid, List Builder For WooCommerce** lets you build unlimited, reusable product displays for your WooCommerce store — no coding required. Design a layout once in the visual builder, then drop it anywhere on your site with a short, simple shortcode or the built-in Gutenberg block.
 
-[Demo](https://codesmade.com/demo/blog/) | [Support](https://www.codesmade.com/contact-us/) 
+= Key Features =
 
+* **Drag-and-Drop Column Builder** — Visually add, remove, and reorder table/grid/list columns: Image, Name, SKU, Price, Categories, Tags, Attributes, Variations, Rating, Stock, and Add to Cart.
+* **Custom Field Columns** — Pull in any product custom field (post meta) as its own column, with a custom label.
+* **Three Display Layouts** — List, Grid, and Table, all driven by the same column configuration so you can switch layouts without rebuilding anything.
+* **Advanced Query Builder** — Filter products by category, tag, and attribute (combinable), quick filters for Featured/On Sale/Best Sellers, price range, stock status, and specific product exclusions.
+* **Front-end Search** — Let shoppers search within a builder's products directly from the widget.
+* **Front-end Filters** — Optional category, tag, attribute, price range, and in-stock filter controls for visitors, with a one-click "Clear filters" reset.
+* **Sortable Columns** — Let visitors click Name or Price column headers (table layout) to sort products live.
+* **Add to Cart From the Table** — Ajax add-to-cart straight from the list, grid, or table — no page reload, with instant "Added ✓" feedback.
+* **Floating Cart** — Optional floating cart bubble so shoppers always see they've added something.
+* **Appearance Customization** — Accent color, text color, border color, font size, border radius, border width, and hover effects (lift, zoom, or none) — all per builder.
+* **Flexible Pagination** — Load More button, numbered pages, or no pagination at all.
+* **Duplicate & Reuse** — Clone any builder in one click and tweak the copy instead of starting from scratch.
+* **Unlimited Builders** — Create as many Table, Grid, or List builders as you need, each with its own simple shortcode (e.g. `[gmwplw_product_layout id="1"]`) and optional Gutenberg block.
+* **WooCommerce HPOS Compatible** — Fully compatible with WooCommerce's High-Performance Order Storage.
 
+= How It Works =
 
-**Woocommerce Display Products by Category** easy to show in widget with display category wise product in woocommerce.
+1. Go to **Product Builders** in your WordPress admin.
+2. Click **New Builder**, choose a layout (List, Grid, or Table), and configure your columns, filters, and appearance.
+3. Copy the generated shortcode (or use the Gutenberg block) and paste it into any post, page, or template.
 
-#### Features
+== Changelog ==
 
-<ul>
-<li>One Click installation</li>
-<li>Filter by Custom Taxonomy</li>
-<li>Filter by <strong>WooCommerce List Products By Category Widget</strong></li>
-<li>Filter by Product Attribute <a href="https://www.codesmade.com/store/product-list-widget-for-woocommerce-pro/">Get Pro</a></li>
-<li>Filter by Product Featured</li>
-<li>Filter by Product On-sale</li>
-<li>Filter by <strong>Best Selling Products Widget</strong></li>
-<li>Order by Product name, Product Id, Date Published, Random, Last Modified, None</li>
-<li>Mobile Friendly</li>
-<li>Easy To use</li>
-<li>Shorcode Support [gmwplw_product_layout id="168"]</li>
-<li>List and Grid  layout</li>
-</ul>
+= 3.4.0 =
+* Expanded the front-end filter bar with price range and in-stock filters, plus a "Clear filters" reset
+* Column builder: drag-and-drop reordering, enable/disable any column, and custom field columns
+* Advanced query builder: multi-select category, tag, and attribute filtering
+* Front-end search, sortable table columns, ajax add-to-cart, and an optional floating cart
+* New Appearance tab: accent/text/border colors, font size, border radius/width, hover effects
+* Simple, sequential shortcode IDs instead of long UUIDs
+* Declared WooCommerce HPOS compatibility
+* Refreshed admin UI (page header with Support link) and a full front-end visual redesign
 
+= 3.0 =
+* Renamed to "Product Table, Grid, List Builder For WooCommerce" to reflect what it actually does
+* Removed the "Product Widget" custom post type entirely — layouts ("Builders") are now stored as plugin settings, managed from a dedicated top-level admin page
+* New "Product Builders" admin page: create, edit, and delete unlimited Table/Grid/List builders, each with its own shortcode, from one screen — no more separate post-per-layout editor
+* The admin page is a real React app written in JSX (src-admin/admin-app.jsx), built with @wordpress/scripts (package.json + webpack.config.js included) — run `npm install && npm run build` after editing it
+* New REST endpoints for full builder CRUD (list, get, create, update, delete)
+* Added a Settings link on the Plugins page pointing to the new Product Builders screen
 
-<h4>Our More Plugins</h4>
+= 2.1 =
+* Removed the legacy PHP-rendered fallback entirely — the front end is now 100% React (wp.element), with no server-rendered markup path left
+* Added "Load More" pagination to the front-end list, grid, and table views
+* Moved from in-browser Babel compilation to a proper build step (@wordpress/scripts) for the admin app, so there's a real package.json to install and rebuild from
 
-[Short Description and Attributes Show Loop For Woocommerce](https://wordpress.org/plugins/short-description-and-attribute-show-loop-for-woocommerce/) To create a product loop in WooCommerce that displays a short description and selected product attributes, you can customize the WooCommerce template or use hooks.
+= 2.0 =
+* Removed the classic WordPress sidebar Widget entirely — use the shortcode or the block instead
+* Added a Table display layout alongside List and Grid
+* Rebuilt both the admin settings screen and the front-end product display as React apps (using wp.element, no @wordpress/components) backed by a new REST API, replacing the old PHP form and server-rendered markup
 
-[Add to Quote For Woocommerce](https://wordpress.org/plugins/product-quote-cart-for-wc/) feature to WooCommerce with a brief, one-line product description, you can either use a plugin or manually customize the WooCommerce product loop.
-
-[Product Shortcode – Widget – Block for Woocommerce](https://wordpress.org/plugins/gm-woo-product-list-widget/) in WooCommerce for displaying products with descriptions, you can leverage the built-in WooCommerce shortcodes or customize them to suit your needs.
-
-[Show Variations On Shop & Category WooCommerce](https://wordpress.org/plugins/woo-show-single-variations-shop-category/) you can show product variations directly on the shop and category pages.
-
-[Variation Dropdown to Radio For Woocommerce](https://wordpress.org/plugins/gm-variations-radio-buttons-for-woocommerce/) enhancing user experience. Customers can easily see and select variations at a glance.
-
-[Product Enquiry for WooCommerce](https://wordpress.org/plugins/gm-woocommerce-quote-popup/) This plugin enables customers to submit inquiries directly from product pages.
-
-[PDF Catalog Woocommerce](https://wordpress.org/plugins/pdf-catalog-woocommerce/) This plugin allows you to generate customizable catalogs featuring product images, descriptions, and prices. 
-
-[Restrict Payment Methods For WooCommerce](https://wordpress.org/plugins/restrict-payment-methods-for-woocommerce/) allows you to restrict payment methods, ensuring customers can only use suitable options at checkout.
-
-[Display Product Variations Dropdown On Shop Page For Woocommerce](https://wordpress.org/plugins/display-product-variations-dropdown-on-shop-page-for-woocommerce/) Enhance your shop page by displaying product variation dropdowns directly on the product listings.
+= 1.1 =
+* Rebuilt the Gutenberg block editor picker with a custom, elegant design instead of the default @wordpress/components dropdown