Components with separate parts: Bundle.fromParts

@foldkit/ui components export Model, Message, and an init that returns only the Model, and create() returns their { update, view } pair. Bundle.fromParts takes them as they are. A bundle's init returns a Model and Commands and never an OutMessage; a component whose open state needs Commands, such as Dialog.boot since @foldkit/ui 0.161, runs boot inside init and returns its Model and Commands from there.

import * as Tabs from '@foldkit/ui/tabs'

type Section = 'general' | 'billing'

const SectionTabs = Bundle.fromParts('SectionTabs', {
  Model: Tabs.Model,
  Message: Tabs.Message,
  init: (config: Tabs.InitConfig) => Tabs.init(config),
  parts: Tabs.create<Section>(),
})

// TabsPage is a parent scope whose Model has the declaration's `tabs` field and a `section`.
const TabsPlaced = TabsPage.at(Bundle.declare(SectionTabs, 'tabs'), {
  args: { id: 'sections' },
  onOut: selected => model => ({ model: { ...model, section: selected.value } }),
})

The component's view inputs pass through: TabsPlaced.view(model, h, { tabs, selectedValue, ariaLabel, toView }). fromParts accepts subscriptions and helpers too, but no Managed Resources. test/fromParts.test.ts runs this example.