Interface LibraryPresetEmphasisEffects

defaultConfig: {
    cssClasses: {
        toAddOnStart: ["webchalk-highlightable"];
    };
}

• ReadonlycssClasses: {
      toAddOnStart: ["webchalk-highlightable"];
  }

  • ReadonlytoAddOnStart: ["webchalk-highlightable"]

effectCompositionFrequency: "on-every-play"

immutableConfig: {
    composite: "replace";
}

• Readonlycomposite: "replace"

composeEffect:function

• composeEffect(color?): {
      backwardKeyframesGenerator: (() => ({
          --webchalk-highlight-color: string;
          backgroundPositionX?: undefined;
          easing: string;
          offset?: undefined;
      } | {
          --webchalk-highlight-color?: undefined;
          backgroundPositionX: string;
          easing?: undefined;
          offset: number;
      } | {
          --webchalk-highlight-color: string;
          backgroundPositionX?: undefined;
          easing?: undefined;
          offset?: undefined;
      })[]);
      forwardKeyframesGenerator: (() => ({
          --webchalk-highlight-color: string;
          backgroundPositionX?: undefined;
          easing: string;
          offset?: undefined;
      } | {
          --webchalk-highlight-color?: undefined;
          backgroundPositionX: string;
          easing?: undefined;
          offset: number;
      } | {
          --webchalk-highlight-color: string;
          backgroundPositionX?: undefined;
          easing?: undefined;
          offset?: undefined;
      })[]);
  }

• Parameters

  • color: string = 'default'

    color to use for the highlight

  Returns {
      backwardKeyframesGenerator: (() => ({
          --webchalk-highlight-color: string;
          backgroundPositionX?: undefined;
          easing: string;
          offset?: undefined;
      } | {
          --webchalk-highlight-color?: undefined;
          backgroundPositionX: string;
          easing?: undefined;
          offset: number;
      } | {
          --webchalk-highlight-color: string;
          backgroundPositionX?: undefined;
          easing?: undefined;
          offset?: undefined;
      })[]);
      forwardKeyframesGenerator: (() => ({
          --webchalk-highlight-color: string;
          backgroundPositionX?: undefined;
          easing: string;
          offset?: undefined;
      } | {
          --webchalk-highlight-color?: undefined;
          backgroundPositionX: string;
          easing?: undefined;
          offset: number;
      } | {
          --webchalk-highlight-color: string;
          backgroundPositionX?: undefined;
          easing?: undefined;
          offset?: undefined;
      })[]);
  }

  • backwardKeyframesGenerator: (() => ({
        --webchalk-highlight-color: string;
        backgroundPositionX?: undefined;
        easing: string;
        offset?: undefined;
    } | {
        --webchalk-highlight-color?: undefined;
        backgroundPositionX: string;
        easing?: undefined;
        offset: number;
    } | {
        --webchalk-highlight-color: string;
        backgroundPositionX?: undefined;
        easing?: undefined;
        offset?: undefined;
    })[])

    • • (): ({
            --webchalk-highlight-color: string;
            backgroundPositionX?: undefined;
            easing: string;
            offset?: undefined;
        } | {
            --webchalk-highlight-color?: undefined;
            backgroundPositionX: string;
            easing?: undefined;
            offset: number;
        } | {
            --webchalk-highlight-color: string;
            backgroundPositionX?: undefined;
            easing?: undefined;
            offset?: undefined;
        })[]

      • Returns ({
            --webchalk-highlight-color: string;
            backgroundPositionX?: undefined;
            easing: string;
            offset?: undefined;
        } | {
            --webchalk-highlight-color?: undefined;
            backgroundPositionX: string;
            easing?: undefined;
            offset: number;
        } | {
            --webchalk-highlight-color: string;
            backgroundPositionX?: undefined;
            easing?: undefined;
            offset?: undefined;
        })[]

  • forwardKeyframesGenerator: (() => ({
        --webchalk-highlight-color: string;
        backgroundPositionX?: undefined;
        easing: string;
        offset?: undefined;
    } | {
        --webchalk-highlight-color?: undefined;
        backgroundPositionX: string;
        easing?: undefined;
        offset: number;
    } | {
        --webchalk-highlight-color: string;
        backgroundPositionX?: undefined;
        easing?: undefined;
        offset?: undefined;
    })[])

    • • (): ({
            --webchalk-highlight-color: string;
            backgroundPositionX?: undefined;
            easing: string;
            offset?: undefined;
        } | {
            --webchalk-highlight-color?: undefined;
            backgroundPositionX: string;
            easing?: undefined;
            offset: number;
        } | {
            --webchalk-highlight-color: string;
            backgroundPositionX?: undefined;
            easing?: undefined;
            offset?: undefined;
        })[]

      • Returns ({
            --webchalk-highlight-color: string;
            backgroundPositionX?: undefined;
            easing: string;
            offset?: undefined;
        } | {
            --webchalk-highlight-color?: undefined;
            backgroundPositionX: string;
            easing?: undefined;
            offset: number;
        } | {
            --webchalk-highlight-color: string;
            backgroundPositionX?: undefined;
            easing?: undefined;
            offset?: undefined;
        })[]

defaultConfig: {
    cssClasses: {
        toRemoveOnFinish: ["webchalk-highlightable"];
    };
}

• ReadonlycssClasses: {
      toRemoveOnFinish: ["webchalk-highlightable"];
  }

  • ReadonlytoRemoveOnFinish: ["webchalk-highlightable"]

effectCompositionFrequency: "on-every-play"

immutableConfig: {
    composite: "replace";
}

• Readonlycomposite: "replace"

composeEffect:function

• composeEffect(): {
      forwardKeyframesGenerator: (() => {
          backgroundPositionX: string;
      }[]);
  }

• Returns {
      forwardKeyframesGenerator: (() => {
          backgroundPositionX: string;
      }[]);
  }

  • ReadonlyforwardKeyframesGenerator: (() => {
        backgroundPositionX: string;
    }[])

    • • (): {
            backgroundPositionX: string;
        }[]

      • Returns {
            backgroundPositionX: string;
        }[]