[Contexts](https://oods-foundry.com/contexts) / form

# form

An object as a form.

Generated from @oods/foundry 0.10.2

## The same context across several objects

Each is its object's generated screen in this context, in React and Vue, with the calls that made it. Open an object for its other contexts.

[User form screen generated by OODS Foundry in React](https://oods-foundry.com/objects/user/screens/form-react)

React app · sample records Maturity: stable `sha256:d2bda633e857…` [Open full size: User form screen generated by OODS Foundry in React](https://oods-foundry.com/objects/user/screens/form-react)

Vue app · sample records Maturity: stable `sha256:7fffbf99d80d…` [Open full size: User form screen generated by OODS Foundry in Vue](https://oods-foundry.com/objects/user/screens/form-vue)

React app · sample records Maturity: beta `sha256:062d4b0b456a…` [Open full size: Invoice form screen generated by OODS Foundry in React](https://oods-foundry.com/objects/invoice/screens/form-react)

Vue app · sample records Maturity: beta `sha256:edb30ad46a2a…` [Open full size: Invoice form screen generated by OODS Foundry in Vue](https://oods-foundry.com/objects/invoice/screens/form-vue)

React app · sample records Maturity: beta `sha256:19177946e041…` [Open full size: Plan form screen generated by OODS Foundry in React](https://oods-foundry.com/objects/plan/screens/form-react)

Vue app · sample records Maturity: beta `sha256:3abc0cc85124…` [Open full size: Plan form screen generated by OODS Foundry in Vue](https://oods-foundry.com/objects/plan/screens/form-vue)

React app · sample records Maturity: beta `sha256:4ec092f76727…` [Open full size: Subscription form screen generated by OODS Foundry in React](https://oods-foundry.com/objects/subscription/screens/form-react)

Vue app · sample records Maturity: beta `sha256:c610e0e03690…` [Open full size: Subscription form screen generated by OODS Foundry in Vue](https://oods-foundry.com/objects/subscription/screens/form-vue)

The calls that made the User form apps, in React and Vue

3 calls, as the pipeline sent them

```
design_compose {
  "object": "User",
  "context": "form",
  "preferences": {
    "brand": "Aquex",
    "theme": "light"
  }
}

code_generate {
  "schemaRef": "compose-b71ee238",
  "framework": "react",
  "profile": "build",
  "options": {
    "output": "application",
    "brand": "Aquex",
    "theme": "light",
    "payloadMode": "file"
  }
}

code_generate {
  "schemaRef": "compose-b71ee238",
  "framework": "vue",
  "profile": "build",
  "options": {
    "output": "application",
    "brand": "Aquex",
    "theme": "light",
    "payloadMode": "file"
  }
}
```

The React app's content hash: `sha256:d2bda633e857e37264c42b9363fe8e8bf9c843bfd571e302680ca2b9d040696e`. Its `src/` folder: App.tsx, GeneratedUI.tsx, app.css, main.tsx, oods-brand-aquex.css

The Vue app's content hash: `sha256:7fffbf99d80d6830392523794b6f5a49e7e2bd4f5800b6ede94135ee71a4066f`. Its `src/` folder: App.vue, GeneratedUI.vue, app.css, main.ts, oods-brand-aquex.css

What `design_compose` reported:

- `OODS-V121` Object 'Invoice' has maturity 'beta' — composed output may change.
- `OODS-V119` No view_extensions found for context "form" in object "Invoice". Available contexts: list, card, detail, dashboard

The calls that made the Invoice form apps, in React and Vue

3 calls, as the pipeline sent them

```
design_compose {
  "object": "Invoice",
  "context": "form",
  "preferences": {
    "brand": "Aquex",
    "theme": "light"
  }
}

code_generate {
  "schemaRef": "compose-ef3b11ef",
  "framework": "react",
  "profile": "build",
  "options": {
    "output": "application",
    "brand": "Aquex",
    "theme": "light",
    "payloadMode": "file"
  }
}

code_generate {
  "schemaRef": "compose-ef3b11ef",
  "framework": "vue",
  "profile": "build",
  "options": {
    "output": "application",
    "brand": "Aquex",
    "theme": "light",
    "payloadMode": "file"
  }
}
```

The React app's content hash: `sha256:062d4b0b456a31846f480da86d6cf152f5ffd2a5bcf2375289228e4680ee31a7`. Its `src/` folder: App.tsx, GeneratedUI.tsx, app.css, main.tsx, oods-brand-aquex.css

The Vue app's content hash: `sha256:edb30ad46a2ae71c13d68aeee9b4015a1eda6684a19c1de373dba2806e9a8742`. Its `src/` folder: App.vue, GeneratedUI.vue, app.css, main.ts, oods-brand-aquex.css

What `design_compose` reported:

- `OODS-V121` Object 'Plan' has maturity 'beta' — composed output may change.
- `OODS-V119` No view_extensions found for context "form" in object "Plan". Available contexts: list, card, detail

The calls that made the Plan form apps, in React and Vue

3 calls, as the pipeline sent them

```
design_compose {
  "object": "Plan",
  "context": "form",
  "preferences": {
    "brand": "Aquex",
    "theme": "light"
  }
}

code_generate {
  "schemaRef": "compose-5c3e6512",
  "framework": "react",
  "profile": "build",
  "options": {
    "output": "application",
    "brand": "Aquex",
    "theme": "light",
    "payloadMode": "file"
  }
}

code_generate {
  "schemaRef": "compose-5c3e6512",
  "framework": "vue",
  "profile": "build",
  "options": {
    "output": "application",
    "brand": "Aquex",
    "theme": "light",
    "payloadMode": "file"
  }
}
```

The React app's content hash: `sha256:19177946e041dc724bd3a0d812db1e12b16c0576de883ef1a431f7bef0cdc4be`. Its `src/` folder: App.tsx, GeneratedUI.tsx, app.css, main.tsx, oods-brand-aquex.css

The Vue app's content hash: `sha256:3abc0cc8512462814f988b22e4b48f7bf88e848cb760e4356dd524ab3be70f58`. Its `src/` folder: App.vue, GeneratedUI.vue, app.css, main.ts, oods-brand-aquex.css

What `design_compose` reported:

- `OODS-V121` Object 'Subscription' has maturity 'beta' — composed output may change.
- `OODS-V117` Subscription refines 11 fields its traits define, and its own definitions are used: lifecycle/Stateful (status); lifecycle/Cancellable (cancel_at_period_end, cancellation_reason, cancellation_requested_at); financial/Billable (amount, currency, billing_interval, current_period_start, current_period_end, current_period_progress, next_payment_due_at).

The calls that made the Subscription form apps, in React and Vue

3 calls, as the pipeline sent them

```
design_compose {
  "object": "Subscription",
  "context": "form",
  "preferences": {
    "brand": "Aquex",
    "theme": "light"
  }
}

code_generate {
  "schemaRef": "compose-3696cc29",
  "framework": "react",
  "profile": "build",
  "options": {
    "output": "application",
    "brand": "Aquex",
    "theme": "light",
    "payloadMode": "file"
  }
}

code_generate {
  "schemaRef": "compose-3696cc29",
  "framework": "vue",
  "profile": "build",
  "options": {
    "output": "application",
    "brand": "Aquex",
    "theme": "light",
    "payloadMode": "file"
  }
}
```

The React app's content hash: `sha256:4ec092f767279a592addf1db8bf6792733165512e0605207e084ece7cdb55379`. Its `src/` folder: App.tsx, GeneratedUI.tsx, app.css, main.tsx, oods-brand-aquex.css

The Vue app's content hash: `sha256:c610e0e03690b21a000908fc2eaf0a0a350a5754efec406ee0fb3cd18d4f9eb8`. Its `src/` folder: App.vue, GeneratedUI.vue, app.css, main.ts, oods-brand-aquex.css

## What traits place here

- [Addressable](https://oods-foundry.com/traits/addressable)

  `AddressEditor`

- [Authable](https://oods-foundry.com/traits/authable)

  `RoleAssignmentForm`

- [Billable](https://oods-foundry.com/traits/billable)

  `BillingIntervalSelector`, `BillingAmountInput`

- [Cancellable](https://oods-foundry.com/traits/cancellable)

  `CancellationForm`

- [Classifiable](https://oods-foundry.com/traits/classifiable)

  `ClassificationEditor`

- [Colorized](https://oods-foundry.com/traits/colorized)

  `ColorStatePicker`

- [Communicable](https://oods-foundry.com/traits/communicable)

  `TemplatePicker`

- [EncodingColor](https://oods-foundry.com/traits/encoding-color)

  `VizColorControls`, `VizColorLegendConfig`

- [EncodingOpacity](https://oods-foundry.com/traits/encoding-opacity)

  `VizOpacityControls`

- [EncodingPositionX](https://oods-foundry.com/traits/encoding-position-x)

  `VizAxisControls`

- [EncodingPositionY](https://oods-foundry.com/traits/encoding-position-y)

  `VizAxisControls`

- [EncodingShape](https://oods-foundry.com/traits/encoding-shape)

  `VizShapeControls`, `VizShapeLegend`

- [EncodingSize](https://oods-foundry.com/traits/encoding-size)

  `VizSizeControls`

- [Geocodable](https://oods-foundry.com/traits/geocodable)

  `GeoFieldMappingForm`

- [Labelled](https://oods-foundry.com/traits/labelled)

  `FormLabelGroup`

- [MarkArea](https://oods-foundry.com/traits/mark-area)

  `VizAreaControls`

- [MarkBar](https://oods-foundry.com/traits/mark-bar)

  `VizMarkControls`

- [MarkLine](https://oods-foundry.com/traits/mark-line)

  `VizLineControls`

- [MarkPoint](https://oods-foundry.com/traits/mark-point)

  `VizPointControls`

- [MarkRect](https://oods-foundry.com/traits/mark-rect)

  `VizHeatmapControls`

- [Preferenceable](https://oods-foundry.com/traits/preferenceable)

  `PreferenceEditor`

- [ScaleLinear](https://oods-foundry.com/traits/scale-linear)

  `VizScaleControls`

- [ScaleTemporal](https://oods-foundry.com/traits/scale-temporal)

  `VizScaleControls`

- [ScatterPlot](https://oods-foundry.com/traits/scatter-plot)

  `VizScatterControls`

- [Stateful](https://oods-foundry.com/traits/stateful)

  `StatusSelector`

- [Statusable](https://oods-foundry.com/traits/statusable)

  `StatusBadge`

- [Taggable](https://oods-foundry.com/traits/taggable)

  `TagInput`

## Objects that compose in it

- [Article](https://oods-foundry.com/objects/article#screen-form)
- [Invoice](https://oods-foundry.com/objects/invoice#screen-form)
- [Media](https://oods-foundry.com/objects/media#screen-form)
- [Organization](https://oods-foundry.com/objects/organization#screen-form)
- [Plan](https://oods-foundry.com/objects/plan#screen-form)
- [Product](https://oods-foundry.com/objects/product#screen-form)
- [Relationship](https://oods-foundry.com/objects/relationship#screen-form)
- [Subscription](https://oods-foundry.com/objects/subscription#screen-form)
- [Transaction](https://oods-foundry.com/objects/transaction#screen-form)
- [Usage](https://oods-foundry.com/objects/usage#screen-form)
- [User](https://oods-foundry.com/objects/user#screen-form)
