compilerExport

The compilerExport function is a utility that helps in working with component variants by applying a given function to the default settings of a component. This function is typically used in the variant definition file to modify the default settings and create a new variant configuration.

Parameters

  • defaultSettings: This parameter accepts either an object containing the default settings or a function that returns an object containing the default settings. It represents the base configuration of the component.
  • input: This is a function that takes the default settings as an input and returns the modified settings. This function is responsible for modifying the component's default settings to create a new variant configuration.

Usage

The compilerExport function is used in the variant definition file to apply the variant-specific modifications to the component's default settings. It checks if the current environment is Node.js (IS_NODE) and, if so, applies the input function to the deep-copied default settings, then assigns the modified settings to the global settings object. This makes the new variant configuration available for further usage.

Here's an example of using the compilerExport function in a variant definition file:

import {Variant} from '@unless/component-library.display.display'
import {InlineSettings} from '@unless/component-library.display.inline'
import {TwoRowLogosSettings} from '@unless/component-library.layout.two-row-logos'
import {compilerExport} from '@unless/component-library.utils.helpers'
import {InlineTwoRowLogos} from '../inline-two-row-logos'
import base from './base'

const announcement: Variant<InlineSettings> = (settings) => {
  const baseSettings = base(settings)

  const layout = baseSettings.instance.content.stepper.steps[0] as TwoRowLogosSettings

  layout.header.title.value = 'We integrate with:'

  return baseSettings
}

export default announcement

compilerExport(InlineTwoRowLogos.defaultSettings, announcement)

In this example, the compilerExport function is used to apply the announcement function to the default settings of the InlineTwoRowLogos component. The modified settings are then made available for further usage in the Node.js environment. This approach ensures that the variant configurations are correctly applied to the component, making it easy to create and manage different component variants.


What’s Next