@donotdev/cli 0.0.19 → 0.0.20

package/templates/app-demo/src/entities/onboarding.ts.example

@@ -0,0 +1,160 @@
+// apps/demo/src/entities/onboarding.ts
+
+import { defineEntity, when } from '@donotdev/core';
+import { defineWorkflow } from '@donotdev/crud';
+
+/**
+ * Entities for the Customer Onboarding workflow demo.
+ * Each entity represents one step in the wizard.
+ */
+
+export const companyEntity = defineEntity({
+  name: 'Company',
+  collection: 'companies',
+  fields: {
+    name: {
+      name: 'name',
+      type: 'text',
+      label: 'Company Name',
+      visibility: 'user',
+      validation: { required: true, minLength: 2 },
+    },
+    industry: {
+      name: 'industry',
+      type: 'select',
+      label: 'Industry',
+      visibility: 'user',
+      validation: {
+        required: true,
+        options: [
+          { value: 'tech', label: 'Technology' },
+          { value: 'finance', label: 'Finance' },
+          { value: 'healthcare', label: 'Healthcare' },
+          { value: 'retail', label: 'Retail' },
+          { value: 'other', label: 'Other' },
+        ],
+      },
+    },
+    size: {
+      name: 'size',
+      type: 'number',
+      label: 'Number of Employees',
+      visibility: 'user',
+      validation: { required: true, min: 1 },
+    },
+    website: {
+      name: 'website',
+      type: 'url',
+      label: 'Website',
+      visibility: 'user',
+    },
+  },
+});
+
+export const contactEntity = defineEntity({
+  name: 'Contact',
+  collection: 'contacts',
+  fields: {
+    firstName: {
+      name: 'firstName',
+      type: 'text',
+      label: 'First Name',
+      visibility: 'user',
+      validation: { required: true },
+    },
+    lastName: {
+      name: 'lastName',
+      type: 'text',
+      label: 'Last Name',
+      visibility: 'user',
+      validation: { required: true },
+    },
+    email: {
+      name: 'email',
+      type: 'email',
+      label: 'Email',
+      visibility: 'user',
+      validation: { required: true },
+    },
+    phone: {
+      name: 'phone',
+      type: 'tel',
+      label: 'Phone',
+      visibility: 'user',
+    },
+  },
+});
+
+export const preferencesEntity = defineEntity({
+  name: 'Preferences',
+  collection: 'preferences',
+  fields: {
+    language: {
+      name: 'language',
+      type: 'select',
+      label: 'Language',
+      visibility: 'user',
+      validation: {
+        options: [
+          { value: 'en', label: 'English' },
+          { value: 'fr', label: 'French' },
+          { value: 'de', label: 'German' },
+          { value: 'es', label: 'Spanish' },
+        ],
+      },
+    },
+    notifications: {
+      name: 'notifications',
+      type: 'switch',
+      label: 'Enable Email Notifications',
+      visibility: 'user',
+    },
+  },
+});
+
+/**
+ * Customer Onboarding Workflow
+ *
+ * 4 steps:
+ * 1. Company Info (required)
+ * 2. Primary Contact (required)
+ * 3. Preferences (skippable)
+ * 4. Billing — only shown if company size > 10
+ */
+export const onboardingWorkflow = defineWorkflow({
+  id: 'customer-onboarding',
+  name: 'Customer Onboarding',
+  persist: true,
+
+  steps: [
+    {
+      id: 'company',
+      title: 'Company Info',
+      entity: companyEntity,
+      fields: ['name', 'industry', 'size', 'website'],
+    },
+    {
+      id: 'contact',
+      title: 'Primary Contact',
+      entity: contactEntity,
+      fields: ['firstName', 'lastName', 'email', 'phone'],
+    },
+    {
+      id: 'preferences',
+      title: 'Preferences',
+      entity: preferencesEntity,
+      fields: ['language', 'notifications'],
+      allowSkip: true,
+    },
+    {
+      id: 'billing',
+      title: 'Billing',
+      description: 'Required for companies with more than 10 employees',
+      entity: companyEntity,
+      fields: ['website'], // placeholder — real app would have billing entity
+      conditions: {
+        visible: when('size').greaterThan(10),
+      },
+    },
+  ],
+});

package/templates/app-demo/src/entities/product.ts.example

@@ -1,3 +1,5 @@
+// apps/demo/src/entities/product.ts
+
 import { defineEntity } from '@donotdev/core';
 
 export const productEntity = defineEntity({
@@ -5,20 +7,28 @@ export const productEntity = defineEntity({
   collection: 'products',
   fields: {
     name: {
+      name: 'name',
+      label: 'Name',
       type: 'text',
       visibility: 'user',
       validation: { required: true, minLength: 3 },
     },
     description: {
+      name: 'description',
+      label: 'Description',
       type: 'textarea',
       visibility: 'user',
     },
     price: {
+      name: 'price',
+      label: 'Price',
       type: 'number',
       visibility: 'user',
       validation: { required: true, min: 0 },
     },
     category: {
+      name: 'category',
+      label: 'Category',
       type: 'select',
       visibility: 'user',
       validation: {
@@ -31,6 +41,8 @@ export const productEntity = defineEntity({
       },
     },
     image: {
+      name: 'image',
+      label: 'Image',
       type: 'image',
       visibility: 'user',
     },

package/templates/app-demo/src/entities/quote.ts.example

@@ -0,0 +1,70 @@
+// apps/demo/src/entities/quote.ts
+
+import { defineEntity, when } from '@donotdev/core';
+
+/**
+ * Insurance Quote entity — demonstrates conditional field visibility.
+ *
+ * - licensePlate: only visible when productType === 'car'
+ * - propertyAddress: only visible when productType === 'home'
+ * - estimatedValue: visible for car OR home (not health)
+ * - notes: disabled until productType is selected
+ */
+export const quoteEntity = defineEntity({
+  name: 'Quote',
+  collection: 'quotes',
+  fields: {
+    productType: {
+      name: 'productType',
+      type: 'select',
+      label: 'Product',
+      visibility: 'user',
+      validation: {
+        required: true,
+        options: [
+          { value: 'health', label: 'Health Insurance' },
+          { value: 'car', label: 'Car Insurance' },
+          { value: 'home', label: 'Home Insurance' },
+        ],
+      },
+    },
+    licensePlate: {
+      name: 'licensePlate',
+      type: 'text',
+      label: 'License Plate',
+      visibility: 'user',
+      conditions: {
+        visible: when('productType').equals('car'),
+        required: when('productType').equals('car'),
+      },
+    },
+    propertyAddress: {
+      name: 'propertyAddress',
+      type: 'address',
+      label: 'Property Address',
+      visibility: 'user',
+      conditions: {
+        visible: when('productType').equals('home'),
+        required: when('productType').equals('home'),
+      },
+    },
+    estimatedValue: {
+      name: 'estimatedValue',
+      type: 'number',
+      label: 'Estimated Value',
+      visibility: 'user',
+      conditions: {
+        visible: when('productType').in(['car', 'home']),
+      },
+    },
+    notes: {
+      name: 'notes',
+      type: 'textarea',
+      label: 'Additional Notes',
+      visibility: 'user',
+      conditions: {
+        disabled: when('productType').notExists(),
+      },
+    },
+  },
+});

package/templates/app-demo/src/pages/ChangelogPage.tsx.example

@@ -1,3 +1,5 @@
+// apps/demo/src/pages/ChangelogPage.tsx
+
 import { History } from 'lucide-react';
 
 import { WhatsNewTemplate } from '@donotdev/templates';
@@ -10,5 +12,30 @@ export const meta: PageMeta = {
 };
 
 export default function ChangelogPage() {
-  return <WhatsNewTemplate />;
+  return (
+    <WhatsNewTemplate
+      changelog={[
+        {
+          version: '1.0.0',
+          date: '2026-01-15',
+          type: 'major',
+          title: 'Initial Release',
+          description: 'First public release of the demo app.',
+          changes: [
+            {
+              type: 'added',
+              items: [
+                'Condition builder with when() API',
+                'Multi-step workflow engine',
+              ],
+            },
+            {
+              type: 'changed',
+              items: ['Entity form renderer supports dynamic fields'],
+            },
+          ],
+        },
+      ]}
+    />
+  );
 }

package/templates/app-demo/src/pages/ConditionalFormPage.tsx.example

@@ -0,0 +1,88 @@
+// apps/demo/src/pages/ConditionalFormPage.tsx
+
+import { SlidersHorizontal } from 'lucide-react';
+
+import { Card, Tabs } from '@donotdev/components';
+import { EntityFormRenderer } from '@donotdev/ui';
+
+import { quoteEntity } from '../entities/quote';
+import { bookingEntity } from '../entities/booking';
+
+import type { PageMeta } from '@donotdev/core';
+
+export const meta: PageMeta = {
+  icon: <SlidersHorizontal />,
+  title: 'Conditional Forms',
+  preset: 'admin',
+};
+
+/**
+ * Conditional Forms Demo — shows field visibility driven by `when()` conditions.
+ *
+ * Two examples:
+ * 1. Insurance Quote — fields appear/disappear based on product type
+ * 2. Booking — complex conditions with .or() combinator
+ */
+export default function ConditionalFormPage() {
+  return (
+    <div style={{ maxWidth: 640, margin: '0 auto' }}>
+      <Card
+        title="Conditional Forms"
+        content="Fields appear, hide, or become required based on other field values. Powered by when() condition builder."
+      >
+        <Tabs
+          items={[
+            {
+              value: 'quote',
+              label: 'Insurance Quote',
+              content: (
+                <Card
+                  title="Insurance Quote"
+                  content='Select a product type to see conditional fields appear. "Car" shows license plate, "Home" shows address, both show estimated value.'
+                >
+                  <EntityFormRenderer
+                    entity={quoteEntity}
+                    operation="create"
+                    onSubmit={async (data) => {
+                      alert(
+                        `Quote submitted: ${JSON.stringify(data, null, 2)}`
+                      );
+                    }}
+                    submitText="Get Quote"
+                    cancelText={null}
+                    warnOnUnsavedChanges={false}
+                    hideVisibilityInfo
+                  />
+                </Card>
+              ),
+            },
+            {
+              value: 'booking',
+              label: 'Booking',
+              content: (
+                <Card
+                  title="Booking Form"
+                  content='"Group" shows group size, "Corporate" shows company name. Invoice address appears for corporate OR groups with 10+ people.'
+                >
+                  <EntityFormRenderer
+                    entity={bookingEntity}
+                    operation="create"
+                    onSubmit={async (data) => {
+                      alert(
+                        `Booking submitted: ${JSON.stringify(data, null, 2)}`
+                      );
+                    }}
+                    submitText="Book Now"
+                    cancelText={null}
+                    warnOnUnsavedChanges={false}
+                    hideVisibilityInfo
+                  />
+                </Card>
+              ),
+            },
+          ]}
+        />
+      </Card>
+    </div>
+  );
+}

package/templates/app-demo/src/pages/DashboardPage.tsx.example

@@ -1,3 +1,5 @@
+// apps/demo/src/pages/DashboardPage.tsx
+
 import { LayoutDashboard } from 'lucide-react';
 
 import { DashboardTemplate } from '@donotdev/templates';