Oryx application feature

Edit on GitHub

AppFeature is a higher level collection of lower-level primitives, such as the following:

Features are useful to structure and organize code and functionality into logical groups and to make them easier to reuse in different scenarios.

Every Oryx package exposes such features for an easy integration in your application.

To register AppFeature in an Oryx application, use the appBuilder.withFeature() API:

import { appBuilder, AppFeature } from '@spryker-oryx/core';

const myFeature: AppFeature = {...};

const app = appBuilder().withFeature(myFeature);

AppFeature is represented as an interface, and you can create interfaces as simple object literals:

import { AppFeature } from '@spryker-oryx/core';

const mySimpleFeature: AppFeature = {
  components: [...],
  providers: [...],

When you want them to be configurable and more flexible, create them as classes or functions:

class MyConfigurableFeature implements AppFeature {

  constructor(config: MyConfigurableFeatureConfig) {
    // Use `config` to customize your feature here
    this.components = [...];
    this.providers = [...];

Extend features

Depending on how a feature is defined, you can extend it as follows.

For features defined as object literals, you can use spread operators to customize some parts of it:

const myExtendedFeature = {
  components: [
      /* Custom components here */

For features defined as classes or functions, to be able to accept the configuration and pass it to the original feature, you also have to use a class or function:

class MyExtendedFeature extends MyConfigurableFeature {
  constructor(config: MyConfigurableFeatureConfig) {
    this.components = [
        /* Custom components here */

Feature options

If you want the feature to accept options when it’s going to be integrated, you can use the FeatureOptionsService.getFeatureOptions() API:

import { FeatureOptionsService } from '@spryker-oryx/core';

class MyService {
  constructor(private featureOptionsService = inject(FeatureOptionsService)) {
    const options = FeatureOptionsService.getFeatureOptions('your-feature-key');
    // Use your options here

This lets the developer who’s integrating the feature to pass options via appBuilder.withOptions(), and it’s going to be fully typed and typesafe:

import { appBuilder } from '@spryker-oryx/core';

appBuilder().withOptions({'your-feature-key': {...}});

Define default values for feature options

To avoid forcing users to repeatedly pass the same kind of values, you can provide default values for your feature options. After you define AppFeature.defaultOptions for a feature, it is used when a user does not provide any option:

import { AppFeature } from '@spryker-oryx/core';

const yourFeature: AppFeature = {
  defaultOptions: {...} // <-- Put your default options here