SmartCloud Flow – Block‑based Forms & Workflow Automation
| 开发者 | smartcloud |
|---|---|
| 更新时间 | 2026年6月1日 22:57 |
| PHP版本: | 8.1 及以上 |
| WordPress版本: | 7.0 |
| 版权: | MIT |
| 版权网址: | 版权信息 |
详情介绍:
SmartCloud Flow is a block-based forms and workflow plugin for WordPress.
It combines a modern Gutenberg editor experience with a React/Mantine runtime for forms, a native
<dialog>-based light-DOM modal block, and an optional AWS backend, so site owners can design forms and supporting UI in WordPress while choosing where submissions should be posted and, in Pro, running submissions, templates, workflows, and integrations in their own AWS account.
Flow is part of the WPSuite family of plugins by Smart Cloud Solutions, Inc.
Free mode
Flow does not require a hosted SaaS backend or a WPSuite connection to render forms.
In Free mode, each form can post directly from the browser to a URL you define per form. That endpoint may be:
- your own custom endpoint,
- a WordPress-side endpoint you implement yourself, or
- the Flow backend submission endpoint, if you later deploy it.
- deploy the Flow backend to AWS,
- add the published backend API base URL to Gatey as a separate API,
- choose the desired protection mode for that API (
IAMorCOGNITO, matching the backend deployment), - then select that API in SmartCloud → Flow Settings → API Settings.
- Gutenberg form builder — Build forms with a dedicated Form block, layout/container blocks, and rich field blocks.
- Single React runtime per form — Front-end forms run as one mounted React tree.
- Light-DOM modal block — Wrap any Gutenberg content in a native dialog with class and data-attribute triggers, hash opening, default header/body/actions slots, action-role aware buttons, and a stable browser API on
WpSuite.plugins.flow.modals. - Light-DOM gallery block — Build a Mantine-free gallery/lightbox from core Image blocks with previous/next controls, optional thumbnails, optional captions/counter, and modal-aware start positions driven by outer trigger classes.
- Rich display & content blocks — Use styled content primitives such as blockquotes, marks, badges, code blocks, spoilers, lists, tables, timelines, and overflow lists alongside inputs.
- API-backed options & request controls — Load select, radio, checkbox-group, and tags options from API/autocomplete endpoints with configurable methods, headers, parameters, selected-value mapping, and runtime interpolation.
- Conditional logic & validation — Show/hide, enable/disable, require/optional, and other rule-based field behavior.
- Theme overrides & design tokens — Theme both interactive controls and display/content blocks inside the Shadow DOM with Mantine variables and stable
--flow-*CSS tokens. - Shortcodes & Elementor support — Reuse forms or content roots via shortcode and Elementor integrations.
- Flexible submission target model — Submit directly from the browser to a per-form endpoint URL with configurable HTTP methods, optional request headers, and runtime interpolation.
- Runtime events & host-page integration — Listen for submit, draft, wizard, modal, and API-loading error events from outer-page JavaScript.
- Pro: backend-aware operation — Connect Flow to the AWS-hosted Flow backend for durable submissions, admin tooling, templates, workflows, and webhook-driven automation.
- Pro: backend form sync — Optionally sync Gutenberg-defined forms into canonical backend form definitions stored in AWS.
- Pro: admin application — Manage submissions, templates, workflows, and backend/API settings from WordPress admin.
- Pro: workflow automation — Event-driven automation for emails, webhooks, status changes, and related operational flows.
- Pro: security & ownership — Deploy into your own AWS account and choose auth modes such as
IAMorCOGNITO.
安装:
- Upload the plugin ZIP (or install from the WordPress plugin repository).
- Activate the plugin through the “Plugins” screen in WordPress.
- Go to WP Admin → SmartCloud → Flow Settings, review the configuration.
- Build a form in Gutenberg and configure its submission target.
- Optionally, for Pro:
- connect the site to a WPSuite workspace,
- deploy the WP Suite Flow Backend into AWS,
- add the backend API to Gatey,
- then select that API in SmartCloud → Flow Settings → API Settings.
屏幕截图:
常见问题:
Does Flow work without an AWS backend?
Yes. Flow can render forms and submit them directly from the browser to any endpoint URL you configure for the form.
Does Flow store submissions in WordPress?
Not by default. Flow posts to the configured endpoint. If you want WordPress to receive and store submissions, you need to implement a receiving endpoint on the WordPress side yourself.
Does Flow send my data to third parties?
Only when your configured submission target or protection settings require it. For example, if you enable reCAPTCHA or post to an external backend endpoint, the browser will make external network calls. See External Services below.
What is the easiest Pro setup?
Deploy the WP Suite Flow Backend into your own AWS account, register its API base URL in Gatey as a separate API, configure the matching protection mode (IAM or COGNITO), and then select that API in SmartCloud → Flow Settings → API Settings.
What happens if I disable the backend?
Forms can still work as long as they submit to another valid configured endpoint. Backend-dependent features such as submissions management, templates, workflows, and related admin tooling will no longer be available through that backend connection.
Will it work with static exports?
Yes. Flow runs in the browser and can submit directly to the configured endpoint, so WordPress/PHP does not need to proxy the request.
Does this work outside Gutenberg?
Yes. Use the [smartcloud-flow-form] or [smartcloud-flow-content-root] shortcode, or the Elementor Flow Form / Flow Content Root widgets. Developers can also integrate the JavaScript APIs directly.
Can Flow load field options from my API?
Yes. Select, radio, checkbox-group, and tags fields can fetch options from API or autocomplete endpoints. You can configure request methods, headers, parameters, response mapping, selected-value mapping, and runtime interpolation tokens.
Can host-page JavaScript react to Flow runtime errors?
Yes. Flow emits browser events such as smartcloud-flow:submit-success, smartcloud-flow:error, smartcloud-flow:options-request-error, and modal lifecycle events so host pages can show custom UI, analytics, or recovery flows.
Can I reuse a Flow Content Root outside Gutenberg?
Yes. Use [smartcloud-flow-content-root id="123"] with a reusable block / pattern that contains a Flow Content Root block.
Can Flow open Gutenberg content in a modal?
Yes. Flow includes a dedicated Modal top-level block that renders in the light DOM with the native <dialog> element. You can open it from class-based triggers, data-wps-flow-* attributes, URL hashes, or the browser API on WpSuite.plugins.flow.modals. The editor can seed header, body, and actions sections, and action buttons inside the modal actions area can be assigned primary, secondary, or dismiss behavior from the core/button toolbar.
Can Flow open a shared gallery at a specific image?
Yes. Put a Gallery block inside a Flow Modal, give the gallery a galleryId, and open the modal from a neighboring core Image or core Button block whose wrapper includes wps-flow-modal-open--{modalId}, wps-flow-gallery-target--{galleryId}, and wps-flow-gallery-index--N. The gallery starts on the requested 1-based image and visitors can keep browsing with previous/next controls and optional thumbnail navigation.
更新日志:
1.1.10
- Performance: Added schedule-after-initial-paint mounting so frontend UI yields the main thread sooner and improves early paint metrics where supported.
- Feature: Added the Gallery block with modal-aware start-position support, so outer trigger CSS/classes can open a Flow modal directly on a selected gallery item.
- Feature: Flow now loads shared WPSuite Theme CSS inside supported shadow-root UI for reusable site-wide styling alongside per-block overrides.
- Feature: Added pattern override support so synced patterns can override selected original block attributes without duplicating the whole pattern.
- Performance: Moved frontend runtime scripts and shared vendor assets to the footer and enabled deferred loading where safe, reducing render-blocking work during initial page load.
- Internal: Improved script loading order so lightweight bootstrap data can be available early without forcing heavier frontend dependencies into the page head.
- Fix: Added explicit escaped output handling for the modal block rendered content template to satisfy WordPress plugin security checks.
- Fix: Added explicit escaped output handling for the Flow Patterns shortcode column markup in wp-admin to satisfy WordPress plugin security checks.
- Fix: Async modal actions now expose a generic pending state on the active trigger while awaited handlers are running.
- Fix: Modal header spacing now only reserves room for the built-in close button when that button is actually rendered.
- Docs: Expanded the modal API documentation for dismiss lifecycle handling, role-based actions, and async action behavior.
- Fix: Modal triggers now detect class-based hooks on Gutenberg button wrapper elements more reliably.
- Fix: Modal dismiss and default actions now run more consistently for overlay clicks, Escape, close buttons, and other close paths.
- Fix: Modal sizing and scroll behavior are more stable for full-height dialogs, sticky header/actions slots, background scroll locking, and slot wrappers converted between Group/Stack layouts.
- Fix: The modal editor now seeds safer default header/body/actions sections and adds toolbar actions to insert or replace those sections.
- UX: Modal action behavior is now edited on the selected core/button toolbar, with clearer current-state feedback for primary, secondary, and dismiss roles.
- Feature: Added the new light-DOM Modal top-level block with native
<dialog>runtime, class/data/hash triggers, and browser helpers onWpSuite.plugins.flow.modals. - Fix: Custom submit endpoints now support configurable
GET/POST/PUT/PATCHmethods, optional browser-side request headers, and runtime interpolation for endpoint paths and header values. - Fix: API/autocomplete-backed select, radio, checkbox-group, and tags fields now interpolate endpoint URLs, headers, and parameters from runtime values and avoid repeated option-endpoint refetch loops.
- Fix: Flow now emits
smartcloud-flow:options-request-errorfor API-backed option failures, and field-level errors show a user-facing message instead of raw JSON responses. - Fix: Multi-select option UIs now support clear-all behavior for API-backed checkbox groups, improve checkbox pointer affordance, and stop hidden-field wrappers from affecting runtime layout gaps.
- Fix: Added legacy Gutenberg save deprecations for older serialized Flow block payloads so previously saved blocks no longer require recovery after serializer changes.
- Docs: Expanded plugin, shortcode, JavaScript API, and knowledge-base documentation for the modal runtime, custom endpoint request settings, interpolation, and runtime error handling.
- Fix: Flow Patterns now includes reusable blocks that contain either a Flow Form or a Flow Content Root block.
- Fix: The shortcode column now shows the matching copy-ready shortcode for each Flow pattern, including content-root entries.
- Docs: Expanded the readme shortcode guidance to cover Flow Content Root reuse outside Gutenberg.
- Fix: JavaScript-set field defaults are now scoped by
formId, so prefilled values no longer bleed across multiple forms on the same page. - Fix: Flow now publishes browser helper methods on
WpSuite.plugins.flowfor setting, clearing, and reading per-form field defaults. - Maintenance: Updated the Flow JavaScript API and field-default documentation for the new form-scoped default-value model.
- Fix: Admin-side form sync now resolves the correct source entity in WordPress 7.0 Site Editor, including template and template-part contexts.
- Fix: Validation now uses the current field values on submit, including minimal or unlabeled text/email fields.
- Fix: Custom submit endpoints now handle absolute URLs correctly and support runtime interpolation tokens from WordPress, location, query string and host-page globals.
- Fix: Flow design token selectors now align with the emitted runtime class names, so theme overrides apply more reliably to submit buttons and field controls.
- Fix: Backend form sync now resolves the correct numeric source ID in WordPress 7.0 Site Editor and template part contexts.
- Fix: Sync metadata requests now guard against invalid source IDs and use the current editor entity metadata more reliably.
- Fix: Flow design token selectors now align with the runtime class names, so theme overrides apply more reliably to action buttons and field controls.
- Maintenance: Updated the admin UI dependency stack, including the shared UI React packages used by WPSuite admin screens.
- Maintenance: Updated shared Gatey Core and WPSuite Core dependencies used by Flow integrations.
- Compatibility: Updated the "Tested up to" value for WordPress 7.0.
- Internal cleanup: Refreshed related frontend and shared runtime dependencies for better alignment across WPSuite plugins.
- Fix: The optional "Powered by" attribution now renders correctly below the Flow content root / form when
enablePoweredByis enabled in the admin settings.
- Initial release.
- Gutenberg form builder with React/Mantine runtime.
- Conditional logic, shortcode support, and Elementor integration.
- Flexible per-form submission target model.
- Optional Pro integration with the WP Suite Flow Backend and Gatey-aware authenticated API access.