@bynary/composables / @bynary/composables/class / IUseModifierOptions

Interface: IUseModifierOptions

A set of options for useModifier

Extends

• IBindModifierOptions

Properties

baseClass?

optional baseClass: string

The base class. There is usually one base class per component.

While you're always able to explicitly set a base class via the options, it's recommended to use the provideBaseClass function to provide the base class to the component. Especially, when using useModifier/bindModifier or useModifierGroup/bindModifierGroup multiple times in one directive or component.

WARNING: If you don't provide a base class either via options.baseClass or via provideBaseClass, an error will be thrown!

Example

const isLoading = signal(false);

bindModifier('is-loading', isLoading, { baseClass: 'my-button' }); // <my-component class="my-button"></my-component>

Inherited from

IBindModifierOptions.baseClass

Defined in

class/src/modifier.composable.ts:26

---

initialValue?

optional initialValue: boolean

Whether the modifier should be applied initially. Defaults to true

Examples

When set to true or not defined, the modifier will be applied initially:

// with a base class `my-component`
const isLoading = useModifier('is-loading', { initialValue: true }); // <my-component class="my-component my-component--is-loading"></my-component>

When set to false, the modifier will not be applied initially:

// with a base class `my-component`
const isLoading = useModifier('is-loading', { initialValue: false }); // <my-component class="my-component"></my-component>

Defined in

class/src/modifier.composable.ts:149