Mixins / foldkit-mixins-ui

Alert

namespace · packages/mixins-ui/src/alert.ts:1

export * as Alert from './alert.js'

In the guides

Members

Alert.AlertSlots

const · packages/mixins-ui/src/alert.ts:11

const AlertSlots: Slots.Contract<{
  readonly root: Slot.UnnamedSlot<
    Capability.Capability<
      'Container',
      readonly [
        Capability.Capability<
          'Interactive',
          readonly [Capability.Capability<'Base', readonly []>]
        >,
      ]
    >,
    readonly Slot.EventName[],
    readonly Slot.AttributeName[],
    readonly Slot.RequirementName[],
    boolean
  >
  readonly icon: Slot.UnnamedSlot<
    Capability.Capability<
      'Container',
      readonly [
        Capability.Capability<
          'Interactive',
          readonly [Capability.Capability<'Base', readonly []>]
        >,
      ]
    >,
    readonly Slot.EventName[],
    readonly Slot.AttributeName[],
    readonly Slot.RequirementName[],
    boolean
  >
  readonly title: Slot.UnnamedSlot<
    Capability.Capability<
      'Container',
      readonly [
        Capability.Capability<
          'Interactive',
          readonly [Capability.Capability<'Base', readonly []>]
        >,
      ]
    >,
    readonly Slot.EventName[],
    readonly Slot.AttributeName[],
    readonly Slot.RequirementName[],
    boolean
  >
  readonly description: Slot.UnnamedSlot<
    Capability.Capability<
      'Container',
      readonly [
        Capability.Capability<
          'Interactive',
          readonly [Capability.Capability<'Base', readonly []>]
        >,
      ]
    >,
    readonly Slot.EventName[],
    readonly Slot.AttributeName[],
    readonly Slot.RequirementName[],
    boolean
  >
}>

An alert publishes its regions as slots; it owns no state, messages, or bundles. The tone comes from the recipe, the urgency from assertive: an assertive alert interrupts (role="alert"), anything else reports (role="status").

Alert.AlertTone

type · packages/mixins-ui/src/alert.ts:19

type AlertTone = 'info' | 'success' | 'warning' | 'error'

A feedback family the alert can take.

Alert.AlertView

interface · packages/mixins-ui/src/alert.ts:25

interface AlertView<Message = never> {
  readonly title: string
  readonly description?: string | undefined
  readonly icon?: Html | undefined
  readonly assertive?: boolean | undefined
  readonly style?: NamedStyle<typeof AlertSlots> | undefined
  readonly mixins?: MixinList<Message> | undefined
}

An alert in one call: what happened, what it means, an optional icon, and how urgently it speaks. No upstream component stands behind it.

Alert.view

function · packages/mixins-ui/src/alert.ts:36

function view<Message = never>(
  options: AlertView<Message>,
  h: HtmlBuilder<Message>,
): Html