Mixins / foldkit-mixins-ui

Textarea

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

export * as Textarea from './textarea.js'

In the guides

Members

Textarea.field

function · packages/mixins-ui/src/textarea.ts:115

function field<Message>(
  options: TextareaField<Message>,
  h: HtmlBuilder<Message>,
): Html

Textarea.resolve

function · packages/mixins-ui/src/textarea.ts:31

function resolve<Input, Message>(
  attributes: TextareaAttributes<Message>,
  mixins: MixinList<Message>,
  context: ResolveContext<Input, Message>,
): ResolvedTextarea<Message>

Applies mixins to the textarea's bundles.

Textarea.ResolvedTextarea

type · packages/mixins-ui/src/textarea.ts:23

type ResolvedTextarea<Message> = Omit<
  Resolved<TextareaAttributes<Message>, typeof TextareaSlots, Message>,
  'textarea'
> & {
  readonly textarea: ReadonlyArray<TextareaAttribute<Message> | ChildAttribute>
}

The textarea's bundles with the attached Mixins applied. textarea is typed for h.textarea, which refuses InnerHTML.

Textarea.TextareaField

interface · packages/mixins-ui/src/textarea.ts:101

interface TextareaField<Message> {
  readonly id: string
  readonly label: string
  readonly field: FieldValidation.Field<unknown>
  readonly changed: (value: string) => Message
  readonly rows?: number | undefined
  readonly placeholder?: string | undefined
  readonly style?: NamedStyle<typeof TextareaSlots> | undefined
  readonly mixins?: MixinList<Message> | undefined
  readonly draw?:
    ((parts: FieldParts, h: HtmlBuilder<Message>) => Html) | undefined
}

A textarea field in one call: a field's state drawn through view with its label, control, and description placed. The value is drawn with String(), as the base field view draws any draft. draw places the parts; the default stacks them. rows and placeholder ride through only where given. Custom drawers stay for controls with no shipped renderer.

Textarea.TextareaSlots

const · packages/mixins-ui/src/textarea.ts:9

const TextareaSlots: Slots.Contract<{
  readonly textarea: Slot.UnnamedSlot<
    Capability.Capability<
      'TextInput',
      readonly [
        Capability.Capability<
          'Focusable',
          readonly [
            Capability.Capability<
              'Interactive',
              readonly [Capability.Capability<'Base', readonly []>]
            >,
          ]
        >,
      ]
    >,
    readonly [
      Event.EventToken<'input'>,
      Event.EventToken<'focus'>,
      Event.EventToken<'blur'>,
    ],
    readonly [
      Attr.AttrToken<'aria-label'>,
      Attr.AttrToken<'aria-invalid'>,
      Attr.AttrToken<'disabled'>,
      Attr.AttrToken<'value'>,
    ],
    readonly Slot.RequirementName[],
    boolean
  >
  readonly label: 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
  >
}>

Textarea.TextareaView

interface · packages/mixins-ui/src/textarea.ts:55

interface TextareaView<Message> {
  readonly id: string
  readonly value?: string | undefined
  readonly onInput?: ((value: string) => Message) | undefined
  readonly disabled?: boolean | undefined
  readonly invalid?: boolean | undefined
  readonly described?: boolean | undefined
  readonly rows?: number | undefined
  readonly placeholder?: string | undefined
  readonly style?: NamedStyle<typeof TextareaSlots> | undefined
  readonly mixins?: MixinList<Message> | undefined
  readonly input?: unknown
  readonly draw: (
    resolved: ResolvedTextarea<Message>,
    h: HtmlBuilder<Message>,
  ) => Html
}

A textarea in one call: its value and Messages, a style for its slots, and the rest of @foldkit/ui's own config. draw places the resolved textarea, label, and description bundles.

Textarea.toView

function · packages/mixins-ui/src/textarea.ts:41

function toView<Message>(
  mixins: MixinList<Message>,
  context: ResolveContext<unknown, Message>,
  draw: (resolved: ResolvedTextarea<Message>) => Html,
): (attributes: TextareaAttributes<Message>) => Html

The textarea's toView: draw receives its bundles with mixins applied.

Textarea.view

function · packages/mixins-ui/src/textarea.ts:73

function view<Message>(
  options: TextareaView<Message>,
  h: HtmlBuilder<Message>,
): Html