Options
All
  • Public
  • Public/Protected
  • All
Menu

Interface IWebElm<TAttrs, TEvents>

Represents the Mimbl component side of the custom element implementation.

Type parameters

  • TAttrs: {} = {}

    Type that maps attribute names to attribute types.

  • TEvents: {} = {}

    Type that maps event names (a.k.a event types) to either Event-derived classes (e.g. MouseEvent) or any other type. The latter will be interpreted as a type of the detail property of a CustomEvent.

Hierarchy

Index

Properties

Optional Readonly displayName

displayName?: string

Components can define display name for tracing purposes; if they don't the default name used is the component's class constructor name. Note that this method can be called before the virtual node is attached to the component.

Readonly isMounted

isMounted: boolean

Determines whether the component is currently mounted. If a component has asynchronous functionality (e.g. fetching data from a server), component's code may be executed after it was already unmounted. This property allows the component to handle this situation.

props

props: ComponentProps<TAttrs, TEvents>

Component properties. This is normally used only by managed components and is usually undefined for independent components. This object can contains every property from the TProps type and $on_ property for every event defined in the TEvents type.

Optional Readonly updateStrategy

updateStrategy?: UpdateStrategy

Optional update strategy object that determines different aspects of component behavior during updates.

Optional vn

Sets, gets or clears the virtual node object of the component. This property is set twice:

  1. Before the component is rendered for the first time: the component must remember the passed object.
  2. Before the component is destroyed: undefined is passed as a parameter and the component must release the remembered object.

Methods

Optional afterUpdate

  • afterUpdate(): void
  • If the component is scheduled to be updated, this method is invoked during the Mimbl tick after all components scheduled to be updated in this tick (including this one) has already been updated. This method should be implemented by components that require some DOM-writing after rendering. When this method is called, writing DOM information should be safe in regards to not causing layout thrashing. Don't do any DOM-reading activities in this method.

    Returns void

Optional beforeUpdate

  • beforeUpdate(): void
  • If the component is scheduled to be updated, this method is invoked during the Mimbl tick before any component scheduled to be updated in this tick (including this one) are updated. This method should be implemented by components that require some DOM-based calculations (like sizes and positions) for rendering. When this method is called, reading DOM information should be safe in regards to not causing layout thrashing. Don't do any DOM- writing activities in this method.

    Returns void

callMe

  • Schedules the given function to be called either before or after components update cycle.

    Parameters

    • func: ScheduledFuncType

      Function to be called

    • beforeUpdate: boolean

      If true, the function is called before the component updates cycle; if false - after the cycle.

    • Optional arg: any

      Argument that will be passed to the function.

    • Optional thisArg: any

      Object that will be used as "this" value when the function is called. If this parameter is undefined, the component instance will be used (which allows scheduling regular unbound components' methods). This parameter will be ignored if the function is already bound or is an arrow function.

    • Optional tickType: TickSchedulingType

      Defines whether and how Mimbl tick is scheduled after the function is called

    Returns void

Optional didReplace

  • This method is only used by independent components.

    Notifies the component that it replaced the given component. This allows the new component to copy whatever internal state it needs from the old component.

    Parameters

    Returns void

fireEvent

  • fireEvent<K>(eventType: K, detail: TEvents[K]): boolean
  • Fires an event of the given type. The detail parameter is interpreted differently for built-in and custom events. For built-in events (that is, events whose type derives from Event), this is the event object itself. For custom events, it becomes the value of the detail property of the CustomEvent object.

    Type parameters

    • K: string

      Defines a range of possible values for the eventType parameter. K is a key from the TEvent type.

    Parameters

    • eventType: K

      Event type name, which is a key from the TEvents type

    • detail: TEvents[K]

      Event data, whose type is defined by the type mapped to the key in the TEvents type.

    Returns boolean

getAttr

  • getAttr<K>(attrName: K): null | string
  • Gets the current string value of the given attribute.

    Type parameters

    • K: string

      Defines a range of possible values for the attrName parameter. K is a key from the TAttr type.

    Parameters

    • attrName: K

      Attribute name, which is a key from the TAttrs type

    Returns null | string

    The current value of the attribute.

getService

  • Retrieves the value for a service with the given ID registered by a closest ancestor component or the default value if none of the ancestor components registered a service with this ID. This method doesn't establish a subscription and only reflects the current state.

    Type parameters

    • K: "ErrorBoundary"

    Parameters

    • id: K

      Unique service identifier

    • Optional defaultValue: IServiceDefinitions[K]

      Default value to return if no publish service is found.

    • Optional useSelf: boolean

      Flag indicating whether the search for the service should start from the virtual node that calls this method. The default value is false meaning the search starts from the parent virtual node.

    Returns IServiceDefinitions[K]

    Current value of the service or default value if no published service is found.

Optional handleError

  • handleError(err: unknown): void
  • Handles an exception that occurred during the rendering of one of the component's children. If this method is not implemented or if it throws an error, the error will be propagated up the chain of components until it reaches a component that handles it. If none of the components can handle the error, the entire tree will be unmounted.

    This method should only change the internal state of the component so that the render method, which will be invoked right after the handleError method returns, will return content reflecting the error.

    Parameters

    • err: unknown

      An error object that was thrown during the component's own rendering or rendering of one of its descendants.

    Returns void

hasAttr

  • hasAttr<K>(attrName: K): boolean
  • Determines whether the element has the attribute with the given name.

    Type parameters

    • K: string

      Defines a range of possible values for the attrName parameter. K is a key from the TAttr type.

    Parameters

    • attrName: K

      Attribute name, which is a key from the TAttrs type

    Returns boolean

    True if the attribute with the given name exists on the element.

processStyles

  • processStyles(func: () => void, useAdoption?: boolean): void
  • Invokes the given function in the "style adoption context"; which allows all Mimcss style manipulations to be reflected in the adoption context of the element's shadow DOM.

    Parameters

    • func: () => void

      Function that is called while Mimcss adoption context related to the element's shadow root is set.

        • (): void
        • Returns void

    • Optional useAdoption: boolean

      Flag indicating that stylesheets should be adopted by instead of created under the shadow root. The flag is ignored if the adoption is not supported or if the shadow root does not exist.

    Returns void

publishService

  • Registers the given value as a service with the given ID that will be available for consumption by descendant components.

    Type parameters

    • K: "ErrorBoundary"

    Parameters

    • id: K

      Unique service identifier

    • value: IServiceDefinitions[K]

      Current value of the service

    • Optional depth: number

      Number of level to watch for changes. The default value is 1; that is, the subscribers will be notified if the service's value or the values of its properties have changed.

    Returns IPublication<K>

    Publication object, which allows setting a new value of the service or changing values of its properties.

render

  • render(): any
  • Returns the component's content that will be ultimately placed into the DOM tree.

    Returns any

setAttr

  • setAttr<K>(attrName: K, value: TAttrs[K]): void
  • Sets the value of the given attribute converting it to string if necessary.

    Type parameters

    • K: string

      Defines a range of possible values for the attrName parameter. K is a key from the TAttr type.

    Parameters

    • attrName: K

      Attribute name, which is a key from the TAttrs type

    • value: TAttrs[K]

      Value to set to the attribute. It is converted to string if necessary.

    Returns void

Optional shouldUpdate

  • shouldUpdate(newProps: TAttrs): boolean
  • This method is only used by managed components.

    Informs the component that new properties have been specified. At the time of the call this.props refers to the "old" properties. They will be changed to the new props right after the call returns. If the component returns true, then its render method will be called. If the component doesn't implement the shouldUpdate method it is as though true is returned. If the component returns false, the render method is not called and the DOM tree of the component remains unchanged. The component will have its props member set to the new properties regardless of this method's return value.

    If the component creates its internal structures based on properties, this call is the opportunity to change the internal structures to correspond to the new properties.

    Parameters

    • newProps: TAttrs

      The new properties that the parent component provides to this component.

    Returns boolean

    True if the component should have its render method called and false otherwise.

subscribeService

  • Subscribes to a service with the given ID. If the service with the given ID is registered by this or one of the ancestor components, the returned subscription object's value property will reference it; otherwise, the value will be set to the defaultValue (if specified) or will remain undefined. Whenever the value of the service that is registered by this or a closest ancestor component is changed, the subscription's value property will receive the new value.

    If the subscription object's value property is used in a component's rendering code, the component will be re-rendered every time the service value is changed.

    Type parameters

    • K: "ErrorBoundary"

    Parameters

    • id: K

      Unique service identifier

    • Optional defaultValue: IServiceDefinitions[K]

      Optional default value that will be assigned if the service is not published yet.

    • Optional useSelf: boolean

      Flag indicating whether the search for the service should start from the virtual node that calls this method. The default value is false meaning the search starts from the parent virtual node.

    Returns ISubscription<K>

    Subscription object, which provides the value of the service and allowes attaching to the event fired when the value is changed.

updateMe

  • updateMe(): void
  • This method is called by the component to request to be updated.

    Returns void

Optional willMount

  • willMount(): void
  • Notifies that the component is about to render its content for the first time. This method is called when the virtual node has already been set so the component can request services from it.

    Returns void

Optional willUnmount

  • willUnmount(): void
  • Notifies that the component's content is going to be removed from the DOM tree. After this method returns, a managed component is destroyed.

    Returns void

wrap

  • Type parameters

    • T: Function

    Parameters

    • func: T

      Callback function to be wrapped

    • Optional arg: any

      Optional argument to be passed to the callback in addition to the original callback arguments.

    • Optional thisArg: any

      Optional object to be used as this when calling the callback. If this parameter is not defined, the component instance is used, which allows wrapping regular unbound components' methods. This parameter will be ignored if the the function is already bound or is an arrow function.

    • Optional schedulingType: TickSchedulingType

      Type of scheduling the Mimbl tick after the callback function returns.

    Returns T

    Wrapped callback that will run the original callback in the proper context.