debug / SubscribeWorkflow Demo

Push required + email optional (form mode) + pwa optional. The most common setup for a book gate.

.require('push', { grants:['read','book-download'],
           label:'🔔 أريد الكتب المجانية' })
.optional('email', { emailMode:'form' })
.optional('pwa',   { label:'📲 أضف للشاشة' })
.onComplete(fn)
.showModal()

Single required push channel. No email or PWA. Resolves to mode:'push-only'.

.require('push', {
   label: '🔔 اشترك للوصول',
   grants: ['read', 'notifications']
})
.showModal()

Email required, inline form injected by EmailSubscribe. Resolves to mode:'email-only'.

.require('email', {
   label: '📧 اشترك عبر البريد',
   emailMode: 'form'
})
.showModal()

Email required as a plain link to the subscribe page. No inline form.

.require('email', {
   label: 'أو عبر البريد الإلكتروني',
   emailMode: 'link',
   url: '/subscribe-direct'
})
.showModal()

Push AND email are both required. Resolves to mode:'both' — shown together.

.require('push',  { label: '🔔 بالإشعارات' })
.require('email', {
   label: '📧 والبريد الإلكتروني',
   emailMode: 'form'
})
.showModal()

Push required, email optional link. After push subscribes, email follow-up appears inline. Resolves to mode:'sequential'.

.require('push',  { label: '🔔 اشترك بالإشعارات' })
.optional('email',{ label: 'أو عبر البريد' })
.showModal()

Push required, PWA optional. PWA button appears if deferredPrompt is available.

.require('push', {
   label: '🔔 اشترك للوصول',
   grants: ['read', 'book-download',
            'post-download', 'notifications']
})
.optional('pwa', {
   label: '📲 أضف التطبيق للشاشة الرئيسية'
})
.showModal()

All text overrides set explicitly. onComplete logs to debug panel instead of reloading.

.title('🔓 افتح المحتوى الحصري')
.desc('اشترك مجاناً للوصول الفوري...')
.require('push', {
   label: '🔔 فعّل الإشعارات',
   grants: ['read', 'notifications']
})
.optional('email', {
   label: 'أو عبر البريد الإلكتروني',
   emailMode: 'form'
})
.onComplete(() => log('✅ onComplete fired!'))
.showModal()

Renders the workflow as an inline GateCard into the slot below. Useful for embedding a subscribe CTA mid-page.

.title('اقرأ بلا حدود')
.require('push',  { label: '🔔 احصل على الوصول المجاني' })
.optional('email',{ emailMode: 'form' })
.onComplete(() => log('inline onComplete!'))
.renderInto(document.getElementById('inline-slot'))

Call toGateCardOpts() on any workflow without rendering. Shows the exact object passed to GateCard — useful for debugging mode resolution.

// click a button above