@sociallane/elements 1.0.0

package/packages/widgets/widget-filter/widget-filter.php

@@ -0,0 +1,123 @@
+<?php
+/**
+ * Widget: Widget Filter
+ *
+ * Displays a grid of available widgets with category filtering.
+ *
+ * @package SocialLane_Elements
+ * @since   1.0.0
+ */
+
+namespace SocialLane\Elements;
+
+use Elementor\Widget_Base;
+use Elementor\Controls_Manager;
+use SocialLane\Elements\Traits\Animation_Controls;
+
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+/**
+ * Widget Filter Widget
+ */
+class Widget_Filter extends Widget_Base {
+
+	use Animation_Controls;
+
+	public function get_name(): string {
+		return 'widget-filter';
+	}
+
+	public function get_title(): string {
+		return esc_html__( 'Widget Filter', 'sociallane-elements' );
+	}
+
+	public function get_icon(): string {
+		return 'eicon-filter';
+	}
+
+	public function get_categories(): array {
+		return [ 'sociallane-content' ];
+	}
+
+	public function get_keywords(): array {
+		return [ 'widget', 'filter', 'browse', 'catalog', 'list', 'grid' ];
+	}
+
+	protected function register_controls(): void {
+		$this->register_content_section();
+		$this->register_animation_controls( true, true );
+	}
+
+	private function register_content_section(): void {
+		$this->start_controls_section(
+			'section_content',
+			[
+				'label' => esc_html__( 'Content', 'sociallane-elements' ),
+				'tab'   => Controls_Manager::TAB_CONTENT,
+			]
+		);
+
+		$this->add_control(
+			'headline',
+			[
+				'label'       => esc_html__( 'Headline', 'sociallane-elements' ),
+				'type'        => Controls_Manager::TEXT,
+				'default'     => esc_html__( 'Widget Catalog', 'sociallane-elements' ),
+				'label_block' => true,
+			]
+		);
+
+		$this->add_control(
+			'headline_tag',
+			[
+				'label'   => esc_html__( 'Headline Tag', 'sociallane-elements' ),
+				'type'    => Controls_Manager::SELECT,
+				'default' => 'h2',
+				'options' => [ 'h1' => 'H1', 'h2' => 'H2', 'h3' => 'H3' ],
+			]
+		);
+
+		$this->add_control(
+			'show_search',
+			[
+				'label'   => esc_html__( 'Show Search', 'sociallane-elements' ),
+				'type'    => Controls_Manager::SWITCHER,
+				'default' => 'yes',
+			]
+		);
+
+		$this->add_control(
+			'show_categories',
+			[
+				'label'   => esc_html__( 'Show Category Filter', 'sociallane-elements' ),
+				'type'    => Controls_Manager::SWITCHER,
+				'default' => 'yes',
+			]
+		);
+
+		$this->add_control(
+			'columns',
+			[
+				'label'   => esc_html__( 'Columns', 'sociallane-elements' ),
+				'type'    => Controls_Manager::SELECT,
+				'default' => '3',
+				'options' => [
+					'2' => esc_html__( '2 Columns', 'sociallane-elements' ),
+					'3' => esc_html__( '3 Columns', 'sociallane-elements' ),
+					'4' => esc_html__( '4 Columns', 'sociallane-elements' ),
+				],
+			]
+		);
+
+		$this->end_controls_section();
+	}
+
+	protected function render(): void {
+		$settings = $this->get_settings_for_display();
+		require_once __DIR__ . '/data/view.php';
+		$view = prepare_widget_filter_view( $settings, $this->get_id() );
+		include __DIR__ . '/templates/wrapper.php';
+	}
+}

package/scripts/scaffold-widget-packages.js

@@ -0,0 +1,109 @@
+#!/usr/bin/env node
+/**
+ * Scaffold widget packages from existing widgets/ directory.
+ *
+ * For each widget in widgets/, creates packages/widgets/{slug}/ with:
+ * - Copied widget files ({slug}.php, data/, templates/)
+ * - package.json with @sociallane/widget-{slug} and peerDep on @sociallane/core
+ *
+ * Usage: node scripts/scaffold-widget-packages.js [--dry-run]
+ * Run from plugin root (sociallane-elements/).
+ */
+
+import { readdirSync, cpSync, mkdirSync, writeFileSync, existsSync } from 'fs';
+import { join, resolve, dirname } from 'path';
+import { fileURLToPath } from 'url';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const pluginRoot = resolve(__dirname, '..');
+const widgetsSrc = join(pluginRoot, 'widgets');
+const widgetsDest = join(pluginRoot, 'packages', 'widgets');
+
+const dryRun = process.argv.includes('--dry-run');
+
+function kebabToPascal(slug) {
+  return slug
+    .split('-')
+    .map((p) => p.charAt(0).toUpperCase() + p.slice(1))
+    .join('_');
+}
+
+function getWidgetSlugs() {
+  if (!existsSync(widgetsSrc)) {
+    console.error('widgets/ directory not found');
+    process.exit(1);
+  }
+  const entries = readdirSync(widgetsSrc, { withFileTypes: true });
+  const slugs = [];
+  for (const entry of entries) {
+    if (!entry.isDirectory()) continue;
+    const slug = entry.name;
+    if (slug.startsWith('.')) continue;
+    const mainFile = join(widgetsSrc, slug, `${slug}.php`);
+    if (!existsSync(mainFile)) continue;
+    slugs.push(slug);
+  }
+  return slugs.sort();
+}
+
+function copyWidget(slug) {
+  const srcDir = join(widgetsSrc, slug);
+  const destDir = join(widgetsDest, slug);
+  if (dryRun) {
+    console.log(`[dry-run] Would create ${destDir}`);
+    return;
+  }
+  mkdirSync(destDir, { recursive: true });
+  const mainFile = join(srcDir, `${slug}.php`);
+  cpSync(mainFile, join(destDir, `${slug}.php`));
+  const dataDir = join(srcDir, 'data');
+  if (existsSync(dataDir)) {
+    cpSync(dataDir, join(destDir, 'data'), { recursive: true });
+  }
+  const templatesDir = join(srcDir, 'templates');
+  if (existsSync(templatesDir)) {
+    cpSync(templatesDir, join(destDir, 'templates'), { recursive: true });
+  }
+  console.log(`  Copied ${slug}`);
+}
+
+function writePackageJson(slug) {
+  const pkgName = `@sociallane/widget-${slug}`;
+  const destDir = join(widgetsDest, slug);
+  const pkg = {
+    name: pkgName,
+    version: '1.0.0',
+    private: true,
+    description: `SocialLane Elements widget: ${slug}`,
+    peerDependencies: {
+      '@sociallane/core': '^1.0.0',
+    },
+    scripts: {
+      build: 'echo "No widget-specific build"',
+    },
+  };
+  const path = join(destDir, 'package.json');
+  if (dryRun) {
+    console.log(`[dry-run] Would write ${path}`);
+    return;
+  }
+  writeFileSync(path, JSON.stringify(pkg, null, 2) + '\n');
+  console.log(`  Wrote package.json`);
+}
+
+function main() {
+  console.log('Scaffolding widget packages...\n');
+  const slugs = getWidgetSlugs();
+  console.log(`Found ${slugs.length} widgets.\n`);
+  if (!dryRun) {
+    mkdirSync(widgetsDest, { recursive: true });
+  }
+  for (const slug of slugs) {
+    console.log(slug);
+    copyWidget(slug);
+    writePackageJson(slug);
+  }
+  console.log(`\nDone. ${slugs.length} widget packages in packages/widgets/`);
+}
+
+main();

package/scripts/setup.sh

@@ -0,0 +1,56 @@
+#!/usr/bin/env bash
+#
+# SocialLane Elements — post-clone setup
+# Run from plugin root: ./scripts/setup.sh
+#
+# - Checks Node.js version (18+)
+# - Verifies packages/core exists
+# - Runs npm install
+# - Runs npm run build
+# - Optionally copies widgets.json.minimal → widgets.json if widgets.json missing
+#
+
+set -e
+
+PLUGIN_ROOT="$(cd "$(dirname "$0")/.." && pwd)"
+cd "$PLUGIN_ROOT"
+
+echo "SocialLane Elements setup (from $PLUGIN_ROOT)"
+
+# Node.js version check (18+)
+if command -v node >/dev/null 2>&1; then
+  NODE_VER=$(node -v | sed 's/^v//' | cut -d. -f1)
+  if [ -n "$NODE_VER" ] && [ "$NODE_VER" -lt 18 ]; then
+    echo "Error: Node.js 18+ required. Current: $(node -v)"
+    exit 1
+  fi
+  echo "Node: $(node -v)"
+else
+  echo "Error: Node.js not found. Install Node.js 18+ and run again."
+  exit 1
+fi
+
+# Verify packages/core
+if [ ! -d "packages/core" ]; then
+  echo "Error: packages/core not found. Ensure the repo is complete."
+  exit 1
+fi
+echo "packages/core OK"
+
+# Install and build
+echo "Running npm install..."
+npm install
+
+echo "Running npm run build..."
+npm run build
+
+# Optional: copy minimal widgets.json if no widgets.json; otherwise sync with disk
+if [ ! -f "widgets.json" ] && [ -f "widgets.json.minimal" ]; then
+  cp widgets.json.minimal widgets.json
+  echo "Created widgets.json from widgets.json.minimal"
+else
+  echo "Syncing widgets.json with packages/widgets..."
+  node scripts/sync-widgets.js
+fi
+
+echo "Setup complete. Activate the plugin in WordPress → Plugins."

package/scripts/split-widget.js

@@ -0,0 +1,176 @@
+#!/usr/bin/env node
+/**
+ * Widget Layout Split Generator
+ *
+ * Copies a widget that has layout variants into a new widget directory with
+ * a single fixed layout. Use after reading elementor-widget-structure and
+ * animation-controls skills. Output still requires manual cleanup:
+ * - Remove layout control and layout-conditioned controls from the widget class
+ * - Simplify wrapper.php to a single branch (remove layout conditionals)
+ *
+ * Usage:
+ *   node scripts/split-widget.js <source-slug> <layout-value> <new-slug> [display-title]
+ *
+ * Example:
+ *   node scripts/split-widget.js newsletter card newsletter-card "Newsletter (Card)"
+ */
+
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+const PLUGIN_ROOT = path.resolve(__dirname, '..');
+const PACKAGES_WIDGETS = path.join(PLUGIN_ROOT, 'packages', 'widgets');
+const WIDGETS_LEGACY = path.join(PLUGIN_ROOT, 'widgets');
+
+function slugToPascal(slug) {
+	return slug
+		.split('-')
+		.map((p) => p.charAt(0).toUpperCase() + p.slice(1).toLowerCase())
+		.join('_');
+}
+
+function copyRecursive(src, dest) {
+	const stat = fs.statSync(src);
+	if (stat.isDirectory()) {
+		if (!fs.existsSync(dest)) {
+			fs.mkdirSync(dest, { recursive: true });
+		}
+		for (const entry of fs.readdirSync(src)) {
+			copyRecursive(path.join(src, entry), path.join(dest, entry));
+		}
+	} else {
+		fs.copyFileSync(src, dest);
+	}
+}
+
+function transformMainPhp(content, sourceSlug, newSlug, displayTitle) {
+	const sourceClass = slugToPascal(sourceSlug);
+	const newClass = slugToPascal(newSlug);
+	const title = displayTitle || newSlug.replace(/-/g, ' ').replace(/\b\w/g, (c) => c.toUpperCase());
+
+	let out = content
+		.replace(new RegExp(`return\\s+['"]${sourceSlug}['"]\\s*;`, 'g'), `return '${newSlug}';`)
+		.replace(new RegExp(`return\\s+esc_html__\\(\\s*['"].*?['"]\\s*,\\s*['"]sociallane-elements['"]\\s*\\)\\s*;`, 'g'), `return esc_html__( '${title}', 'sociallane-elements' );`)
+		.replace(new RegExp(`class\\s+${sourceClass}\\s+extends`, 'g'), `class ${newClass} extends`);
+
+	return out;
+}
+
+function transformViewPhp(content, layoutKey, layoutValue) {
+	// Hardcode layout: common patterns
+	const patterns = [
+		[/\$layout\s*=\s*[^;]+;/, `$layout = '${layoutValue}';`],
+		[/\$view\s*\[\s*['"]layout['"]\s*\]\s*=\s*[^;]+;/, `$view['layout'] = '${layoutValue}';`],
+		[/\$\w+layout\w*\s*=\s*\([^)]+\)\s*\?\s*[^:]+:[^;]+;/, `$layout = '${layoutValue}';`],
+	];
+	for (const [re, replacement] of patterns) {
+		if (re.test(content)) {
+			return content.replace(re, replacement);
+		}
+	}
+	// Fallback: add at top of function if layout is assigned in return
+	const returnMatch = content.match(/(['"]layout['"]\s*=>)\s*[^,]+/);
+	if (returnMatch) {
+		content = content.replace(returnMatch[0], `${returnMatch[1]} '${layoutValue}'`);
+	}
+	return content;
+}
+
+function run() {
+	const args = process.argv.slice(2);
+	if (args.length < 3) {
+		console.error('Usage: node scripts/split-widget.js <source-slug> <layout-value> <new-slug> [display-title]');
+		process.exit(1);
+	}
+
+	const [sourceSlug, layoutValue, newSlug, displayTitle] = args;
+
+	let sourceDir = path.join(PACKAGES_WIDGETS, sourceSlug);
+	if (!fs.existsSync(sourceDir)) {
+		sourceDir = path.join(WIDGETS_LEGACY, sourceSlug);
+	}
+	if (!fs.existsSync(sourceDir)) {
+		console.error(`Source widget not found: ${sourceSlug} (checked packages/widgets and widgets)`);
+		process.exit(1);
+	}
+
+	const destDir = path.join(PACKAGES_WIDGETS, newSlug);
+	if (fs.existsSync(destDir)) {
+		console.error(`Destination already exists: ${destDir}`);
+		process.exit(1);
+	}
+
+	console.log(`Copying ${sourceSlug} -> ${newSlug} (layout: ${layoutValue})`);
+	copyRecursive(sourceDir, destDir);
+
+	// Rename main PHP file if slug changed
+	const mainPhpOld = path.join(destDir, `${sourceSlug}.php`);
+	const mainPhpNew = path.join(destDir, `${newSlug}.php`);
+	if (fs.existsSync(mainPhpOld) && mainPhpOld !== mainPhpNew) {
+		fs.renameSync(mainPhpOld, mainPhpNew);
+	}
+
+	// Transform main widget PHP
+	const mainPhpPath = path.join(destDir, `${newSlug}.php`);
+	if (fs.existsSync(mainPhpPath)) {
+		let mainPhp = fs.readFileSync(mainPhpPath, 'utf8');
+		mainPhp = transformMainPhp(mainPhp, sourceSlug, newSlug, displayTitle);
+		fs.writeFileSync(mainPhpPath, mainPhp);
+	}
+
+	// Prepare function name for new slug (used in view.php and main .php)
+	const newPrepareFunc = `prepare_${newSlug.replace(/-/g, '_')}_view`;
+
+	// Transform data/view.php - hardcode layout and rename prepare function
+	const viewPath = path.join(destDir, 'data', 'view.php');
+	if (fs.existsSync(viewPath)) {
+		let viewPhp = fs.readFileSync(viewPath, 'utf8');
+		viewPhp = viewPhp.replace(/\bfunction\s+prepare_\w+_view\s*\(/g, `function ${newPrepareFunc}(`);
+		viewPhp = transformViewPhp(viewPhp, 'layout', layoutValue);
+		fs.writeFileSync(viewPath, viewPhp);
+	}
+
+	// Update package.json if present
+	const pkgPath = path.join(destDir, 'package.json');
+	if (fs.existsSync(pkgPath)) {
+		const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf8'));
+		pkg.name = `@sociallane/widget-${newSlug}`;
+		pkg.description = `SocialLane Elements widget: ${newSlug}`;
+		fs.writeFileSync(pkgPath, JSON.stringify(pkg, null, 2));
+	} else {
+		fs.writeFileSync(
+			pkgPath,
+			JSON.stringify(
+				{
+					name: `@sociallane/widget-${newSlug}`,
+					version: '1.0.0',
+					private: true,
+					description: `SocialLane Elements widget: ${newSlug}`,
+					peerDependencies: { '@sociallane/core': '^1.0.0' },
+					scripts: { build: 'echo "No widget-specific build"' },
+				},
+				null,
+				2
+			)
+		);
+	}
+
+	// Update render() in main PHP to call correct prepare_*_view
+	const mainPhpPath2 = path.join(destDir, `${newSlug}.php`);
+	const sourcePrepareFunc = `prepare_${sourceSlug.replace(/-/g, '_')}_view`;
+	if (fs.existsSync(mainPhpPath2)) {
+		let mainPhp = fs.readFileSync(mainPhpPath2, 'utf8');
+		if (mainPhp.includes(sourcePrepareFunc)) {
+			mainPhp = mainPhp.split(sourcePrepareFunc).join(newPrepareFunc);
+			fs.writeFileSync(mainPhpPath2, mainPhp);
+		}
+	}
+
+	console.log(`Created ${destDir}`);
+	console.log('Next: remove layout control from widget class and simplify wrapper.php to a single layout branch.');
+}
+
+run();

package/scripts/sync-widgets.js

@@ -0,0 +1,69 @@
+#!/usr/bin/env node
+/**
+ * Sync widgets.json with packages/widgets on disk.
+ * Adds slugs for new widget directories, removes slugs for missing ones.
+ * Run from plugin root: npm run sync-widgets
+ *
+ * A valid widget is a directory under packages/widgets/{slug} with {slug}.php inside.
+ */
+
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+const PLUGIN_ROOT = path.resolve(__dirname, '..');
+const WIDGETS_DIR = path.join(PLUGIN_ROOT, 'packages', 'widgets');
+const WIDGETS_JSON = path.join(PLUGIN_ROOT, 'widgets.json');
+
+function getSlugsOnDisk() {
+	if (!fs.existsSync(WIDGETS_DIR)) {
+		return [];
+	}
+	const entries = fs.readdirSync(WIDGETS_DIR, { withFileTypes: true });
+	const slugs = [];
+	for (const ent of entries) {
+		if (!ent.isDirectory()) continue;
+		const slug = ent.name;
+		const phpFile = path.join(WIDGETS_DIR, slug, `${slug}.php`);
+		if (fs.existsSync(phpFile)) {
+			slugs.push(slug);
+		}
+	}
+	return slugs.sort((a, b) => a.localeCompare(b));
+}
+
+function getExistingSlugs() {
+	if (!fs.existsSync(WIDGETS_JSON)) {
+		return [];
+	}
+	const raw = fs.readFileSync(WIDGETS_JSON, 'utf8');
+	const data = JSON.parse(raw);
+	if (!Array.isArray(data.widgets)) return [];
+	return data.widgets;
+}
+
+function main() {
+	const onDisk = getSlugsOnDisk();
+	const existing = getExistingSlugs();
+
+	// Preserve existing order where possible; append new slugs (sorted) at the end
+	const existingSet = new Set(existing);
+	const ordered = existing.filter((s) => onDisk.includes(s));
+	const newSlugs = onDisk.filter((s) => !existingSet.has(s));
+	const widgets = [...ordered, ...newSlugs];
+
+	const output = {
+		widgets,
+	};
+	fs.writeFileSync(WIDGETS_JSON, JSON.stringify(output, null, 2) + '\n', 'utf8');
+
+	const added = newSlugs.length;
+	const removed = existing.filter((s) => !onDisk.includes(s)).length;
+	if (added > 0 || removed > 0) {
+		console.log(`widgets.json updated: ${added} added, ${removed} removed. Total: ${widgets.length}`);
+	}
+}
+
+main();

package/sociallane-elements.php

@@ -0,0 +1,104 @@
+<?php
+/**
+ * Plugin Name: SocialLane Elements
+ * Plugin URI: https://sociallane.com
+ * Description: Custom Elementor widgets and elements with Tailwind CSS for SocialLane.
+ * Version: 1.0.0
+ * Author: SocialLane
+ * Text Domain: sociallane-elements
+ * Requires at least: 6.0
+ * Requires PHP: 8.0
+ *
+ * @package SocialLane_Elements
+ */
+
+namespace SocialLane\Elements;
+
+// Prevent direct access
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+define( 'SOCIALLANE_ELEMENTS_VERSION', '1.0.0' );
+define( 'SOCIALLANE_ELEMENTS_PATH', plugin_dir_path( __FILE__ ) );
+define( 'SOCIALLANE_ELEMENTS_URL', plugin_dir_url( __FILE__ ) );
+define( 'SOCIALLANE_CORE_PATH', SOCIALLANE_ELEMENTS_PATH . 'packages/core/' );
+define( 'SOCIALLANE_CORE_URL', SOCIALLANE_ELEMENTS_URL . 'packages/core/' );
+
+/**
+ * Check Elementor is active
+ */
+function sociallane_elements_requires_elementor(): bool {
+	return defined( 'ELEMENTOR_VERSION' );
+}
+
+/**
+ * Admin notice when Elementor is missing
+ */
+function sociallane_elements_admin_notice(): void {
+	?>
+	<div class="notice notice-error">
+		<p><?php esc_html_e( 'SocialLane Elements requires Elementor to be installed and activated.', 'sociallane-elements' ); ?></p>
+	</div>
+	<?php
+}
+
+/**
+ * Whether the plugin is in package mode (widgets.json exists).
+ * In package mode, only widget components are available; no admin UI, previews, or management.
+ *
+ * @return bool
+ */
+function sociallane_is_package_mode(): bool {
+	return file_exists( SOCIALLANE_ELEMENTS_PATH . 'widgets.json' );
+}
+
+/**
+ * Initialize plugin
+ */
+function sociallane_elements_init(): void {
+	if ( ! sociallane_elements_requires_elementor() ) {
+		add_action( 'admin_notices', __NAMESPACE__ . '\\sociallane_elements_admin_notice' );
+		return;
+	}
+
+	require_once SOCIALLANE_CORE_PATH . 'includes/helpers.php';
+	require_once SOCIALLANE_CORE_PATH . 'includes/traits/trait-common-controls.php';
+	require_once SOCIALLANE_CORE_PATH . 'includes/traits/trait-animation-controls.php';
+	require_once SOCIALLANE_ELEMENTS_PATH . 'includes/button-presets.php';
+	require_once SOCIALLANE_ELEMENTS_PATH . 'includes/class-widget-manager.php';
+	require_once SOCIALLANE_CORE_PATH . 'includes/class-vite-assets.php';
+	require_once SOCIALLANE_CORE_PATH . 'includes/class-widgets-loader.php';
+	if ( ! sociallane_is_package_mode() ) {
+		require_once SOCIALLANE_ELEMENTS_PATH . 'includes/class-onboarding.php';
+		require_once SOCIALLANE_ELEMENTS_PATH . 'includes/class-admin-settings.php';
+		require_once SOCIALLANE_ELEMENTS_PATH . 'includes/class-widget-preview.php';
+	}
+	require_once SOCIALLANE_ELEMENTS_PATH . 'includes/class-setup-widget-catalog.php';
+	require_once SOCIALLANE_ELEMENTS_PATH . 'includes/class-disable-reset-css.php';
+	require_once SOCIALLANE_ELEMENTS_PATH . 'includes/class-gravity-forms-styles.php';
+	require_once SOCIALLANE_CORE_PATH . 'includes/class-plugin.php';
+
+	$plugin = new Plugin();
+	$plugin->init();
+
+	Setup_Widget_Catalog::init();
+
+	if ( ! sociallane_is_package_mode() ) {
+		if ( Widget_Preview::is_enabled() ) {
+			$widget_preview = new Widget_Preview();
+			$widget_preview->init();
+		}
+	}
+}
+
+add_action( 'plugins_loaded', __NAMESPACE__ . '\\sociallane_elements_init' );
+
+register_activation_hook( __FILE__, function () {
+	set_transient( '_sociallane_activation_redirect', true, 30 );
+} );
+
+register_deactivation_hook( __FILE__, function () {
+	delete_transient( '_sociallane_activation_redirect' );
+	flush_rewrite_rules();
+} );