# Tanvir Block

**Version:** 1.0.7 | **Requires WordPress:** 6.7+ | **Requires PHP:** 7.4+ | **License:** Proprietary — see [LICENSE.txt](LICENSE.txt)

A collection of custom Gutenberg blocks, block extensions, and site-enhancement features with a React-powered admin dashboard to enable or disable each item individually.

Items marked *(Pro)* require the **Tanvir Block Pro** companion plugin.

---

## Free Blocks

| Block | Description |
|-------|-------------|
| **My CTA** | Call-to-action with headline, description, and button |
| **My Icon / Image** | SVG icon or image with title, description, layout controls, and link |
| **My Image Box** | Image card with title, description, and responsive spacing |
| **My Mega Menu** | Full-featured mega menu using WordPress template parts |
| **My TOC** | Server-rendered in-page table of contents from page headings |
| **My Heading** | Responsive heading block |
| **My Separator** | Responsive separator |
| **My Group** | Responsive group container |
| **My Accordion** | Responsive accordion with collapsible inner blocks |
| **My Buttons** | Responsive buttons wrapper with button-item inner blocks |
| **My Logo Slider** | Responsive logo carousel with dual-row infinite scroll and media library image selection |
| **My Counter** | Animated number counter with prefix/suffix and responsive styling controls |
| **My FlipBox** | Two-sided flip card with front and back inner blocks, revealed on hover or click |

## Pro Blocks *(require Tanvir Block Pro)*

| Block | Description |
|-------|-------------|
| **My Contact** | Newsletter / contact form with optional double opt-in and background image |
| **My Columns** | Responsive columns layout extending core Columns with responsive controls |
| **My Countdown** | Live countdown timer to a target date with responsive styling controls |
| **My FlipBook** | Realistic page-flip book with multiple pages powered by react-pageflip |
| **My Tabs** | Tabbed content container using Tab Item inner blocks |
| **My Lottie Player** | Animated Lottie / JSON file player with loop and speed controls |
| **My Slider** | Responsive content slider powered by Swiper.js |
| **Post Shortcode List** | Renders a selected post shortcode (projects, related posts, gallery) with responsive controls |

## Extend Blocks

| Block | Description |
|-------|-------------|
| **Button Icons** | Adds icon support to the native WordPress Button block |
| **Gallery Lightbox** | Adds BaguetteBox lightbox to the native WordPress Gallery block |
| **Navigation Icons** | Adds icon support to the native WordPress Navigation & Submenu block |

## Extend Support

| Feature | Pro? | Description |
|---------|------|-------------|
| **SVG & JSON Upload** | Free | Enables SVG and JSON file types in the media library |
| **Hide Admin Bar** | Pro | Hides the admin bar on the front end for selected user roles |
| **Sticky Header** | Pro | Scroll-aware sticky header with background styles and mobile breakpoint |
| **Page Transitions** | Pro | View Transitions API animations between page navigations (13+ presets) |

## Dashboard

- **Getting Started** — quick-start guide and links to docs, tutorials, and support
- **Blocks** — toggle any block or extend block on/off; disabled blocks are never registered on the server
- **Settings** — global phone number, email, and WhatsApp sticky options saved via AJAX
- **Sticky Header** *(Pro)* — configure selector, scroll behaviour, background style, z-index, and mobile breakpoint
- **Page Transitions** *(Pro)* — choose animation type, duration, and CSS selectors
- **Upload & Admin Bar** — control SVG/JSON upload permissions and admin bar visibility per role *(Hide Admin Bar requires Pro)*

---

## Development

### Requirements

- Node.js 18+
- npm 8+

### Commands

```shell
# Install dependencies
npm install

# Start development build (watch mode)
npm start

# Production build
npm run build

# Build zip file under production folder
npm run production

# Format files
npm run format

# Lint CSS
npm run lint:css

# Lint JavaScript
npm run lint:js

# Create distributable zip
npm run plugin-zip

# Update WordPress packages
npm run packages-update
```

### Build output

| Source | Output |
|--------|--------|
| `src/blocks/*/` | `build/blocks/*/` |
| `src/extend_blocks/*/` | `build/extend_blocks/*/` |
| `src/extend_support/*/` | `build/extend_support/*/` |
| `src/dashboard/index.js` | `build/dashboard/index.js` |
| `src/dashboard/index.scss` | `build/dashboard/style.css` |

### Project structure

```
tanvir-block/
├── src/
│   ├── blocks/             # Block source (JSX + SCSS)
│   │   ├── my-cta/
│   │   ├── my-icon-img/
│   │   ├── my-img-box/
│   │   ├── my-mega-menu/
│   │   ├── my-toc/
│   │   ├── my-heading/
│   │   ├── my-separator/
│   │   ├── my-group/
│   │   ├── my-accordion/
│   │   ├── my-buttons/
│   │   ├── my-logo-slide/
│   │   ├── my-counter/
│   │   ├── my-flipbox/
│   │   ├── my-contact/       # Pro block (registered by Tanvir Block Pro)
│   │   ├── my-columns/       # Pro block
│   │   ├── my-countdown/     # Pro block
│   │   ├── my-flipbook/      # Pro block
│   │   ├── my-tabs/          # Pro block
│   │   ├── my-lottie-player/ # Pro block
│   │   ├── my-slider/        # Pro block
│   │   ├── post-shortcode-list/ # Pro block
│   │   ├── slide/            # Child block of my-slider
│   │   ├── accordion-item/   # Child block of my-accordion
│   │   ├── button-item/      # Child block of my-buttons
│   │   ├── tab-item/         # Child block of my-tabs
│   │   ├── my-flipbox-front/ # Child block of my-flipbox
│   │   └── my-flipbox-back/  # Child block of my-flipbox
│   ├── extend_blocks/      # Native block extensions
│   │   ├── wp-button-icons/
│   │   ├── wp-gallery-lightbox/
│   │   └── wp-navigation-icons/
│   ├── extend_support/     # Site-wide feature modules
│   │   ├── my-upload-support/
│   │   ├── my-hide-admin-bar/
│   │   ├── my-sticky-header/
│   │   └── my-page-transitions/
│   └── dashboard/          # React admin dashboard
├── build/                  # Compiled output
├── wp-backend/             # PHP dashboard class
├── others/                 # WhatsApp chat shortcode & helpers
├── assets/                 # Admin and frontend CSS
└── tanvir-block.php        # Plugin entry point
```

---

## Next Work Will Be

- **Update Block** — Necessary update for first release.
- **Fixed My Mega Menu** — Need to check and fix the spatial x-axis scroll when aligning the item to the middle.
- Update My Button Block — add hover color for text & bg.
- Update My Counter Block — add speed control option and more control add in controle penal.


## Changelog

### 1.0.7
- Fixed: Megamenu issue


### 1.0.6
- Fixed: Responsive work only when `tanvir-block-pro` is active.
- Update: Tanvir Block 

### 1.0.5
- Fixed: Additional css and Create/Edit Navigation link fixed in admin panel.
- Fixed: My Heading font size synk in site editor
- Added: My Typography res control - sync default typography front size like S M L XL XXL from site editor style.
- Added: My TOC Block - Collapsible In-Page TOC and Floating Sidebar TOC.
- Updated: My FlipBox - Block add more res control and style controls for backend and frontend.
- Fixed: My Accordion Block - accordion items removed exter blank space form frontend.
- Updated: My Logo Slider - Block add more res control and style controls for backend and frontend.

### 1.0.4
- Added: Custom CSS ID support for all blocks.
- Added: My buttons Block add Link Control Option.
- Fixed: My Group Block style not working on front-end.

### 1.0.3
- Added: "Show Image Only" control option to My Image Box block (hides text content when enabled).
- Added: New controls to My Icon / Image block (icon color, custom margins/padding spacing, border styling, and description typography controls).
- Fixed: Button Icons and Navigation Icons block extensions not working even when Pro is active.
- Fixed: WhatsApp Sticky mobile display issues where the button would not stick on mobile screens.
- Fixed: SVG and JSON File Upload modules now function correctly when Pro is active.
- Fixed: Front-end styling issues with My Group block where the inline style tag was not rendering correctly.
- Fixed: General styling and functional bugs in My CTA block.
- Updated: My Logo Slider block by removing unnecessary typography settings.
- Updated: Dashboard Pricing tab information according to virza.com/price.

### 1.0.0
- Pro/free split complete — Tanvir Block Pro companion plugin now manages pro block registration and pro features.
- Fixed: Pro block toggles now persist correctly across page reloads.
- Fixed: My Lottie Player and My Slider blocks auto-register when Pro is first activated.
- Fixed: Settings persistence for Sticky Header, Page Transitions, and Hide Admin Bar when Pro is active.
- Fixed: Page Transitions — CSS/JS build assets now correctly copied to build directory.
- Fixed: Sticky Header now activates correctly; hook timing and `enabled` flag fixed.
- Pro blocks (My Contact, My Columns, My Countdown, My FlipBook, My Tabs, My Lottie Player, My Slider, Post Shortcode List) marked in dashboard — require Pro to enable.

### 0.2.9
- Optimization — Necessary optimization because plugin is large.
- Production Version — Create Build/Production version plugin via gulpfile.js.

### 0.2.8
- Added Layout Importer block — upload existing pattern in edit page.
- Download block layout from virza.top.

### 0.2.7
- Added Post Shortcode List block — renders a selected post shortcode with responsive controls.

### 0.2.6
- Added My Counter block — animated number counter with prefix/suffix and responsive styling.
- Added My Countdown block — live countdown timer to a target date with responsive controls.
- Added My FlipBook block — realistic page-flip book with multiple pages powered by react-pageflip.
- Added My FlipBox block — two-sided flip card with front (my-flipbox-front) and back (my-flipbox-back) inner blocks.
- Added My Tabs block — tabbed content container with Tab Item inner blocks.

### 0.2.5
- Added My Separator block — responsive separator extending core Separator.
- Added My Group block — responsive group container extending core Group.
- Added My Columns block — responsive columns layout extending core Columns.
- Added My Accordion block — responsive accordion with collapsible accordion-item inner blocks.
- Added My Buttons block — responsive buttons wrapper with button-item inner blocks.
- Added My Logo Slider block — dual-row infinite-scroll logo carousel with media library image selection.

### 0.2.4
- Added My Heading block.
- Added Project CPT and Settings toggle.
- Added Hide Specific Devices control for all blocks.
- Added responsive controls (height, width, border, color, typography, bg gradient, bg image) for all blocks.

### 0.2.3
- Added Navigation Icons extend block.
- Added Create/Edit Navigation option link under General Settings.
- Added Icons library in Button Icons extend block.
- Fixed Button Icons extend block frontend/backend sync.
- Fixed My Lottie Player block media preview and frontend/backend sync.

### 0.2.2
- Added My Lottie Player block.
- Added My TOC block.
- Added Sticky Header extend support module.
- Added Page Transitions extend support module.
- Added SVG & JSON Upload extend support.
- Added Hide Admin Bar extend support.
- Expanded dashboard from 3 to 6 tabs.

### 0.2.0
- Added React-powered admin dashboard with Getting Started, Blocks, and Settings tabs.
- Per-block enable/disable toggle — disabled blocks not registered on server.
- Settings saved via AJAX — no page reload required.

### 0.1.7
- Performance: blocks-manifest for faster block type registration (WP 6.7+).
- Added Gallery Lightbox extend block.

### 0.1.0
- Initial release with My CTA, My Icon / Image, My Image Box, My Mega Menu, My Slider, and Button Icons.