@bynary.composables.attribute.Interface.IBindBooleanAttributeOptions

@bynary/composables / @bynary/composables/attribute / IBindBooleanAttributeOptions

Interface: IBindBooleanAttributeOptions

A set of options for bindBooleanAttribute

Extended by

• IUseBooleanAttributeOptions

Properties

defaultValue?

optional defaultValue: boolean

The default value of the attribute, as a fallback, when no initial value has been defined and no value has been assigned in the DOM

Examples

const isDisabled = useBooleanAttribute('disabled', { defaultValue: true });

Or with bindBooleanAttribute:

const isDisabled = signal<boolean | undefined>(undefined);
bindBooleanAttribute('disabled', isDisabled, { defaultValue: true });

<my-component></my-component>

This will output:

<my-component disabled></my-component>

const isDisabled = useBooleanAttribute('disabled', { defaultValue: false });

Or with bindBooleanAttribute:

const isDisabled = signal<boolean | undefined>(undefined);
bindBooleanAttribute('disabled', isDisabled, { defaultValue: false });

<my-component disabled></my-component>

This will output:

<my-component disabled></my-component>

Defined in

attribute/src/boolean-attribute.composable.ts:73

---

namespace?

optional namespace: string

The namespace of the attribute

Example

a namespace xyz will result in an attribute xyz:<attribute-name>:

const isDisabled = useBooleanAttribute('disabled', { namespace: 'xyz', initialValue: true });

Or with bindBooleanAttribute:

const isDisabled = signal(true);
bindBooleanAttribute('disabled', isDisabled, { namespace: 'xyz' });

This will output:

<my-component xyz:disabled></my-component>

Defined in

attribute/src/boolean-attribute.composable.ts:30

---

target?

optional target: Element

The target element on which the attribute should be bound. Can be any HTMLElement.

Example

const isDisabled = useBooleanAttribute('disabled', { target: document.body });

Or with bindBooleanAttribute:

const isDisabled = signal<boolean | undefined>(undefined);
bindBooleanAttribute('disabled', isDisabled, { target: document.body });

Defined in

attribute/src/boolean-attribute.composable.ts:88