SurfaceCompositionSchema · types

Les types ci-dessous définissent les objets nommés et leurs relations. Les propriétés héritées sont incluses dans les tableaux. Les types dérivés d’un schéma renvoient à sa structure; une déclaration TypeScript ne remplace pas les contrôles sémantiques du compilateur.

SurfaceModelComposition

A detached closed spec contains declarations, not runtime values or retained authority.

export type SurfaceModelComposition = z.infer<typeof surfaceCompositionSpecSchema>;

SurfaceComposition

Concise name for the same sole compiled composition contract.

export type SurfaceComposition = SurfaceModelComposition;

SurfaceCompositionElement

Renderer narrowing uses this exact admitted union without assertions or schema copies.

export type SurfaceCompositionElement = z.infer<typeof surfaceCompositionElementSchema>;

SurfaceCompositionComponentName

A bundle advertises only the adapters it actually implements.

export type SurfaceCompositionComponentName = SurfaceCompositionElement['type'];

type SurfaceCompositionComponentName = "HomeHeader" | "HomeLaunchers" | "HomeLayout" | "HomeSection" | "HomeActivity" | "Page" | "Section" | "Stack" | "Grid" | "Card" | "Heading" | "Text" | "Badge" | "Icon" | "RecordIdentity" | "RecordField" | "RecordSettings" | "RecordTags" | "RecordMetric" | "RecordRelations" | "NativeContent" | "QueryTable" | "RecordCards" | "QueryGraph" | "QueryKanban" | "QueryGantt" | "QueryTimeline" | "QueryCalendar" | "ModelAction" | "RecordLayout" | "Tabs" | "TabPanel" | "ActionGroup" | "Header" | "WorkIdentity" | "WorkNavigation" | "WorkPanel" | "WorkStageRail" | "WorkTargetContent" | "WorkSources" | "WorkRequests" | "WorkCriteria" | "WorkAction";

SurfaceCompositionComponentProps

Precise props of the registered native adapter.

export type SurfaceCompositionComponentProps<K extends SurfaceCompositionComponentName> = Extract<
  SurfaceCompositionElement,
  { type: K }
>['props'];

Toutes les références

Exemples appliqués : Choisir le composant selon son rôle

Le Field édite Notes; le tableau présente les soumissions issues d’un groupe de relations.

Configuration

Propriétés du composant RecordField.props. Propriétés et valeurs admises.

{
  "recordProfileKey": "client",
  "fieldPath": "fields/notes"
}

Variante et raccordement

Propriétés du composant QueryTable.props. Propriétés et valeurs admises.

{
  "binding": {
    "kind": "record-relations",
    "recordProfileKey": "client",
    "groupKey": "quotes"
  }
}

Exemple de disposition UI

La disposition illustrative ci-dessous situe cette configuration dans l’app Clients/Soumissions. Chaque fragment s’insère à l’emplacement indiqué; ses références aux Fields, Queries et Actions correspondent aux déclarations du Model.

1. Identité du client
2. Notes et suivi
3. Paramètres
4. Soumissions liées

SurfaceClients / Atelier NordExemple

SurfaceCompositionSchema · typesChoisir le composant selon son rôle

Clients

AN

Atelier NordClient actif · Services professionnels

ÉtatActif ⌄

Notes et suivi

Le client souhaite préparer une proposition pour son nouveau projet. Préciser les besoins et confirmer le budget avant la revue.

Texte éditable dans la Surface

Paramètres de la fiche