improve initialization and types

config/rollup/pipeline.build.js

@@ -27,14 +27,10 @@ const createOutputWithMinifiedVersion = (output, esm, buildMinifiedVersion) =>
               rollupTerser({
                 ecma: esm ? 2015 : 5,
                 safari10: true,
-                mangle: {
-                  safari10: true,
-                  properties: {
-                    regex: /^_/,
-                  },
-                },
                 compress: {
                   evaluate: false,
+                  module: !!esm,
+                  passes: 3,
                 },
               }),
             ],
@@ -63,6 +59,30 @@ module.exports = (esm, options, { declarationFiles = false, outputStyle = false
       format: esm ? 'esm' : 'umd',
       generatedCode: esm ? 'es2015' : 'es5',
       file: path.resolve(distPath, `${file}${esm ? '.esm' : ''}.js`),
+      plugins: [
+        rollupTerser({
+          ecma: esm ? 2015 : 5,
+          safari10: true,
+
+          mangle: {
+            safari10: true,
+            keep_fnames: true, // eslint-disable-line camelcase
+            properties: {
+              regex: /^_/,
+            },
+          },
+          compress: {
+            defaults: false,
+            hoist_funs: true, // eslint-disable-line camelcase
+          },
+          format: {
+            beautify: true,
+            max_line_len: 80, // eslint-disable-line camelcase
+            braces: true,
+            indent_level: 2, // eslint-disable-line camelcase
+          },
+        }),
+      ],
     },
     esm,
     buildMinifiedVersion

package.json

@@ -55,11 +55,11 @@
     "rollup-plugin-scss": "^3.0.0",
     "rollup-plugin-serve": "^1.1.0",
     "rollup-plugin-styles": "^3.10.0",
-    "rollup-plugin-terser": "^6.1.0",
+    "rollup-plugin-terser": "^7.0.2",
-    "rollup-plugin-ts": "^3.0.1",
+    "rollup-plugin-ts": "^3.0.2",
     "should": "^13.2.3",
     "tslib": "^2.4.0",
-    "typescript": "^4.7.3",
+    "typescript": "^4.7.4",
     "utf-8-validate": "^5.0.2"
   },
   "scripts": {

packages/overlayscrollbars/src/environment.ts

@@ -27,81 +27,31 @@ import {
   classNameEnvironmentFlexboxGlueMax,
   classNameViewportScrollbarStyling,
 } from 'classnames';
-import { OSOptions, defaultOptions } from 'options';
+import { Options, defaultOptions } from 'options';
-import { OSTargetElement, PartialOptions } from 'typings';
+import { PartialOptions } from 'typings';
-
+import { InitializationStrategy } from 'initialization';
-type StructureInitializationStrategyElementFn<T> =
-  | ((target: OSTargetElement) => HTMLElement | T)
-  | T;
-
-type ScrollbarsInitializationStrategyElementFn<T> =
-  | ((target: OSTargetElement, host: HTMLElement, viewport: HTMLElement) => HTMLElement | T)
-  | T;
-
-/**
- * A Static element is an element which MUST be generated.
- * If null or undefined (or the returned result is null or undefined), the initialization function is generatig the element, otherwise
- * the element returned by the function acts as the generated element.
- */
-export type StructureInitializationStrategyStaticElement = StructureInitializationStrategyElementFn<
-  null | undefined
->;
-
-/**
- * A Dynamic element is an element which CAN be generated.
- * If boolean (or the returned result is boolean), the generation of the element is forced (or not).
- * If the function returns and element, the element returned by the function acts as the generated element.
- */
-export type StructureInitializationStrategyDynamicElement =
-  StructureInitializationStrategyElementFn<boolean>;
-
-export interface StructureInitializationStrategy {
-  _host: StructureInitializationStrategyStaticElement;
-  _viewport: StructureInitializationStrategyStaticElement;
-  _padding: StructureInitializationStrategyDynamicElement;
-  _content: StructureInitializationStrategyDynamicElement;
-}
-
-export interface ScrollbarsInitializationStrategy {
-  /**
-   * The scrollbars slot.  If null or undefined (or the returned result is null or undefined), the initialization function is deciding the element, otherwise
-   * the element returned by the function acts as the scrollbars slot.
-   */
-  _scrollbarsSlot: ScrollbarsInitializationStrategyElementFn<null | undefined>;
-}
-
-export interface InitializationStrategy
-  extends StructureInitializationStrategy,
-    ScrollbarsInitializationStrategy {}
-
-export type DefaultInitializationStrategy = {
-  [K in keyof InitializationStrategy]: Extract<
-    InitializationStrategy[K],
-    boolean | null | undefined
-  >;
-};
 
 export interface EnvironmentListenersNameArgsMap {
   _: undefined;
 }
 
-export interface Environment {
+export interface InternalEnvironment {
   readonly _nativeScrollbarSize: XY;
   readonly _nativeScrollbarIsOverlaid: XY<boolean>;
   readonly _nativeScrollbarStyling: boolean;
   readonly _rtlScrollBehavior: { n: boolean; i: boolean };
   readonly _flexboxGlue: boolean;
   readonly _cssCustomProperties: boolean;
-  readonly _defaultInitializationStrategy: DefaultInitializationStrategy;
+  readonly _defaultInitializationStrategy: InitializationStrategy;
-  readonly _defaultDefaultOptions: OSOptions;
+  readonly _defaultDefaultOptions: Options;
   _addListener(listener: EventListener<EnvironmentListenersNameArgsMap, '_'>): () => void;
   _getInitializationStrategy(): InitializationStrategy;
   _setInitializationStrategy(newInitializationStrategy: Partial<InitializationStrategy>): void;
-  _getDefaultOptions(): OSOptions;
+  _getDefaultOptions(): Options;
-  _setDefaultOptions(newDefaultOptions: PartialOptions<OSOptions>): void;
+  _setDefaultOptions(newDefaultOptions: PartialOptions<Options>): void;
 }
 
-let environmentInstance: Environment;
+let environmentInstance: InternalEnvironment;
 const { abs, round } = Math;
 
 const diffBiggerThanOne = (valOne: number, valTwo: number): boolean => {
@@ -199,15 +149,12 @@ const getWindowDPR = (): number => {
 
 const getDefaultInitializationStrategy = (
   nativeScrollbarStyling: boolean
-): DefaultInitializationStrategy => ({
+): InitializationStrategy => ({
-  _host: null,
-  _viewport: null,
   _padding: !nativeScrollbarStyling,
   _content: false,
-  _scrollbarsSlot: null,
 });
 
-const createEnvironment = (): Environment => {
+const createEnvironment = (): InternalEnvironment => {
   const { body } = document;
   const envDOM = createDOM(`<div class="${classNameEnvironment}"><div></div></div>`);
   const envElm = envDOM[0] as HTMLElement;
@@ -226,7 +173,7 @@ const createEnvironment = (): Environment => {
   const initializationStrategy = getDefaultInitializationStrategy(nativeScrollbarStyling);
   const defaultDefaultOptions = assignDeep({}, defaultOptions);
 
-  const env: Environment = {
+  const env: InternalEnvironment = {
     _nativeScrollbarSize: nativeScrollbarSize,
     _nativeScrollbarIsOverlaid: nativeScrollbarIsOverlaid,
     _nativeScrollbarStyling: nativeScrollbarStyling,
@@ -242,11 +189,7 @@ const createEnvironment = (): Environment => {
     _setInitializationStrategy(newInitializationStrategy) {
       assignDeep(initializationStrategy, newInitializationStrategy);
     },
-    _getDefaultOptions: assignDeep<OSOptions, OSOptions>.bind(
+    _getDefaultOptions: assignDeep<Options, Options>.bind(0, {} as Options, defaultDefaultOptions),
-      0,
-      {} as OSOptions,
-      defaultDefaultOptions
-    ),
     _setDefaultOptions(newDefaultOptions) {
       assignDeep(defaultDefaultOptions, newDefaultOptions);
     },
@@ -305,9 +248,11 @@ const createEnvironment = (): Environment => {
   return env;
 };
 
-export const getEnvironment = (): Environment => {
+const getEnvironment = (): InternalEnvironment => {
   if (!environmentInstance) {
     environmentInstance = createEnvironment();
   }
   return environmentInstance;
 };
+
+export { getEnvironment };

packages/overlayscrollbars/src/eventListeners.ts

@@ -1,59 +0,0 @@
-import { OSOptions } from 'options';
-import { createEventListenerHub } from 'support';
-import { PartialOptions } from 'typings';
-import type {
-  InitialEventListeners,
-  AddEventListener,
-  RemoveEventListener,
-  TriggerEventListener,
-  EventListener,
-} from 'support/eventListeners';
-/*
-onScrollStart               : null,
-onScroll                    : null,
-onScrollStop                : null,
-onOverflowChanged           : null,
-onOverflowAmountChanged     : null, // fusion with onOverflowChanged
-onDirectionChanged          : null, // gone
-onContentSizeChanged        : null, // gone
-onHostSizeChanged           : null, // gone
-*/
-
-export interface OnUpdatedEventListenerArgs {
-  updateHints: {
-    sizeChanged: boolean;
-    directionChanged: boolean;
-    heightIntrinsicChanged: boolean;
-    overflowAmountChanged: boolean;
-    overflowStyleChanged: boolean;
-    hostMutation: boolean;
-    contentMutation: boolean;
-  };
-  changedOptions: PartialOptions<OSOptions>;
-  force: boolean;
-}
-
-export interface OSEventListenersNameArgsMap {
-  initialized: undefined;
-  initializationWithdrawn: undefined;
-  updated: OnUpdatedEventListenerArgs;
-  destroyed: undefined;
-}
-
-export type OSEventListener<
-  N extends Extract<keyof OSEventListenersNameArgsMap, string> = Extract<
-    keyof OSEventListenersNameArgsMap,
-    string
-  >
-> = EventListener<OSEventListenersNameArgsMap, N>;
-
-export type AddOSEventListener = AddEventListener<OSEventListenersNameArgsMap>;
-
-export type RemoveOSEventListener = RemoveEventListener<OSEventListenersNameArgsMap>;
-
-export type TriggerOSEventListener = TriggerEventListener<OSEventListenersNameArgsMap>;
-
-export type InitialOSEventListeners = InitialEventListeners<OSEventListenersNameArgsMap>;
-
-export const createOSEventListenerHub = (initialEventListeners?: InitialOSEventListeners) =>
-  createEventListenerHub(initialEventListeners);

packages/overlayscrollbars/src/initialization.ts

@@ -0,0 +1,87 @@
+import { isFunction, isBoolean, isNull, isUndefined } from 'support';
+import type {
+  StructureInitialization,
+  StructureInitializationStrategy,
+} from 'setups/structureSetup';
+import type {
+  ScrollbarsInitialization,
+  ScrollbarsInitializationStrategy,
+} from 'setups/scrollbarsSetup';
+
+type StaticInitialization = HTMLElement | null | undefined;
+type DynamicInitialization = HTMLElement | boolean | null | undefined;
+
+export type InitializationTargetElement = HTMLElement | HTMLTextAreaElement;
+
+export type InitializationTargetObject = StructureInitialization & ScrollbarsInitialization;
+
+export type InitializationTarget = InitializationTargetElement | InitializationTargetObject;
+
+export type InitializationStrategy = StructureInitializationStrategy &
+  ScrollbarsInitializationStrategy;
+
+/**
+ * Static elements MUST be present.
+ * Null or undefined behave like if this element wasn't specified during initialization.
+ */
+export type StaticInitializationElement<Args extends any[]> =
+  | ((...args: Args) => StaticInitialization)
+  | StaticInitialization;
+
+/**
+ * Dynamic element CAN be present.
+ * If its a element the element will be handled as the repsective element.
+ * True means that the respective dynamic element is forced to be generated.
+ * False means that the respective dynamic element is forced NOT to be generated.
+ * Null or undefined behave like if this element wasn't specified during initialization.
+ */
+export type DynamicInitializationElement<Args extends any[]> =
+  | ((...args: Args) => DynamicInitialization)
+  | DynamicInitialization;
+
+export type InitializtationElementStrategy<InitElm> = Exclude<InitElm, HTMLElement>;
+
+export type DefaultInitializtationElementStrategy<
+  InitElm extends StaticInitializationElement<any> | DynamicInitializationElement<any>
+> = Extract<InitElm, (...args: any[]) => any> extends (...args: infer P) => any
+  ? (...args: P) => HTMLElement
+  : never;
+
+const staticInitializationElement = <T extends StaticInitializationElement<any>>(
+  args: Parameters<Extract<T, (...args: any[]) => any>>,
+  defaultStaticInitializationElement: DefaultInitializtationElementStrategy<T>,
+  staticInitializationElementStrategy?: InitializtationElementStrategy<T>,
+  staticInitializationElementValue?: T | false
+): HTMLElement => {
+  const result =
+    staticInitializationElementValue ||
+    (isFunction(staticInitializationElementStrategy)
+      ? staticInitializationElementStrategy.apply(0, args)
+      : staticInitializationElementStrategy);
+
+  return (
+    (isFunction(result) ? result.apply(0, args) : result) ||
+    defaultStaticInitializationElement.apply(0, args)
+  );
+};
+
+const dynamicInitializationElement = <T extends DynamicInitializationElement<any>>(
+  args: Parameters<Extract<T, (...args: any[]) => any>>,
+  defaultDynamicInitializationElement: DefaultInitializtationElementStrategy<T>,
+  dynamicInitializationElementStrategy?: InitializtationElementStrategy<T>,
+  dynamicInitializationElementValue?: T | false
+): HTMLElement | false => {
+  const takeInitializationValue =
+    isBoolean(dynamicInitializationElementValue) || !!dynamicInitializationElementValue;
+  const result = takeInitializationValue
+    ? (dynamicInitializationElementValue as boolean | HTMLElement)
+    : isFunction(dynamicInitializationElementStrategy)
+    ? dynamicInitializationElementStrategy.apply(0, args)
+    : dynamicInitializationElementStrategy;
+
+  return result === true || isNull(result) || isUndefined(result) || isFunction(result)
+    ? defaultDynamicInitializationElement.apply(0, args)
+    : result;
+};
+
+export { staticInitializationElement, dynamicInitializationElement };

packages/overlayscrollbars/src/options.ts

@@ -1,7 +1,7 @@
 import { assignDeep, each, isObject, keys, isArray, hasOwnProperty, isFunction } from 'support';
 import { PartialOptions, ReadonlyOptions } from 'typings';
 
-const stringify = (value: any) =>
+const opsStringify = (value: any) =>
   JSON.stringify(value, (_, val) => {
     if (isFunction(val)) {
       throw new Error();
@@ -38,7 +38,7 @@ export type SizeChangedCallback = (this: any, args?: SizeChangedArgs) => void;
 
 export type UpdatedCallback = (this: any, args?: UpdatedArgs) => void;
 
-export interface OSOptions {
+export interface Options {
   paddingAbsolute: boolean;
   updating: {
     elementEvents: Array<[elementSelector: string, eventNames: string]> | null;
@@ -64,7 +64,7 @@ export interface OSOptions {
   };
 }
 
-export type ReadonlyOSOptions = ReadonlyOptions<OSOptions>;
+export type ReadonlyOSOptions = ReadonlyOptions<Options>;
 
 export interface OverflowChangedArgs {
   x: boolean;
@@ -93,7 +93,7 @@ export interface UpdatedArgs {
   forced: boolean;
 }
 
-export const defaultOptions: OSOptions = {
+export const defaultOptions: Options = {
   // resize: 'none', // none || both  || horizontal || vertical || n || b || h || v
   paddingAbsolute: false, // true || false
   updating: {
@@ -145,7 +145,7 @@ export const getOptionsDiff = <T>(
 
       if (isArray(currOptionValue) || isArray(newOptionValue)) {
         try {
-          if (stringify(currOptionValue) === stringify(newOptionValue)) {
+          if (opsStringify(currOptionValue) === opsStringify(newOptionValue)) {
             isDiff = false;
           }
         } catch {}

packages/overlayscrollbars/src/overlayscrollbars.ts

@@ -1,4 +1,3 @@
-import { OSTarget, OSInitializationObject, PartialOptions, OverflowStyle } from 'typings';
 import {
   assignDeep,
   isEmptyObject,
@@ -8,10 +7,11 @@ import {
   isHTMLElement,
   XY,
   TRBL,
+  createEventListenerHub,
 } from 'support';
 import { createStructureSetup, createScrollbarsSetup } from 'setups';
-import { getOptionsDiff, OSOptions, ReadonlyOSOptions } from 'options';
+import { getOptionsDiff, Options, ReadonlyOSOptions } from 'options';
-import { DefaultInitializationStrategy, getEnvironment, InitializationStrategy } from 'environment';
+import { getEnvironment } from 'environment';
 import {
   getPlugins,
   addPlugin,
@@ -20,41 +20,56 @@ import {
   OptionsValidationPluginInstance,
 } from 'plugins';
 import { addInstance, getInstance, removeInstance } from 'instances';
-import {
+import type { PartialOptions, OverflowStyle } from 'typings';
-  createOSEventListenerHub,
+import type {
-  InitialOSEventListeners,
+  InitializationTarget,
-  AddOSEventListener,
+  InitializationTargetObject,
-  RemoveOSEventListener,
+  InitializationStrategy,
-} from 'eventListeners';
+} from 'initialization';
+import type {
+  InitialEventListeners as GeneralInitialEventListeners,
+  EventListener as GeneralEventListener,
+} from 'support/eventListeners';
+
+/*
+onScrollStart               : null,
+onScroll                    : null,
+onScrollStop                : null,
+onOverflowChanged           : null,
+onOverflowAmountChanged     : null, // fusion with onOverflowChanged
+onDirectionChanged          : null, // gone
+onContentSizeChanged        : null, // gone
+onHostSizeChanged           : null, // gone
+*/
 
 export interface OverlayScrollbarsStatic {
   (
-    target: OSTarget | OSInitializationObject,
+    target: InitializationTarget | InitializationTargetObject,
-    options?: PartialOptions<OSOptions>,
+    options?: PartialOptions<Options>,
-    eventListeners?: InitialOSEventListeners
+    eventListeners?: GeneralInitialEventListeners<EventListenerMap>
   ): OverlayScrollbars;
 
   plugin(osPlugin: OSPlugin | OSPlugin[]): void;
-  env(): OverlayScrollbarsEnv;
+  env(): Environment;
 }
 
-export interface OverlayScrollbarsEnv {
+export interface Environment {
   scrollbarSize: XY<number>;
   scrollbarIsOverlaid: XY<boolean>;
   scrollbarStyling: boolean;
   rtlScrollBehavior: { n: boolean; i: boolean };
   flexboxGlue: boolean;
   cssCustomProperties: boolean;
-  defaultInitializationStrategy: DefaultInitializationStrategy;
+  defaultInitializationStrategy: InitializationStrategy;
-  defaultDefaultOptions: OSOptions;
+  defaultDefaultOptions: Options;
 
   getInitializationStrategy(): InitializationStrategy;
   setInitializationStrategy(newInitializationStrategy: Partial<InitializationStrategy>): void;
-  getDefaultOptions(): OSOptions;
+  getDefaultOptions(): Options;
-  setDefaultOptions(newDefaultOptions: PartialOptions<OSOptions>): void;
+  setDefaultOptions(newDefaultOptions: PartialOptions<Options>): void;
 }
 
-export interface OverlayScrollbarsState {
+export interface State {
   padding: TRBL;
   paddingAbsolute: boolean;
   overflowAmount: XY<number>;
@@ -62,7 +77,7 @@ export interface OverlayScrollbarsState {
   hasOverflow: XY<boolean>;
 }
 
-export interface OverlayScrollbarsElements {
+export interface Elements {
   target: HTMLElement;
   host: HTMLElement;
   padding: HTMLElement;
@@ -70,18 +85,51 @@ export interface OverlayScrollbarsElements {
   content: HTMLElement;
 }
 
+export interface OnUpdatedEventListenerArgs {
+  updateHints: {
+    sizeChanged: boolean;
+    directionChanged: boolean;
+    heightIntrinsicChanged: boolean;
+    overflowAmountChanged: boolean;
+    overflowStyleChanged: boolean;
+    hostMutation: boolean;
+    contentMutation: boolean;
+  };
+  changedOptions: PartialOptions<Options>;
+  force: boolean;
+}
+
+export interface EventListenerMap {
+  initialized: undefined;
+  initializationWithdrawn: undefined;
+  updated: OnUpdatedEventListenerArgs;
+  destroyed: undefined;
+}
+
+export type InitialEventListeners = GeneralInitialEventListeners<EventListenerMap>;
+
+export type EventListener<Name extends keyof EventListenerMap> = GeneralEventListener<
+  EventListenerMap,
+  Name
+>;
+
 export interface OverlayScrollbars {
-  options(): OSOptions;
+  options(): Options;
-  options(newOptions?: PartialOptions<OSOptions>): OSOptions;
+  options(newOptions?: PartialOptions<Options>): Options;
 
   update(force?: boolean): void;
+
   destroy(): void;
 
-  state(): OverlayScrollbarsState;
+  state(): State;
-  elements(): OverlayScrollbarsElements;
 
-  on: AddOSEventListener;
+  elements(): Elements;
-  off: RemoveOSEventListener;
+
+  on<Name extends keyof EventListenerMap>(name: Name, listener: EventListener<Name>): () => void;
+  on<Name extends keyof EventListenerMap>(name: Name, listener: EventListener<Name>[]): () => void;
+
+  off<Name extends keyof EventListenerMap>(name: Name, listener?: EventListener<Name>): void;
+  off<Name extends keyof EventListenerMap>(name: Name, listener?: EventListener<Name>[]): void;
 }
 
 /**
@@ -109,7 +157,7 @@ export const OverlayScrollbars: OverlayScrollbarsStatic = (
   const optionsValidationPlugin = plugins[
     optionsValidationPluginName
   ] as OptionsValidationPluginInstance;
-  const validateOptions = (newOptions?: PartialOptions<OSOptions>) => {
+  const validateOptions = (newOptions?: PartialOptions<Options>) => {
     const opts = newOptions || {};
     const validate = optionsValidationPlugin && optionsValidationPlugin._;
     return validate ? validate(opts, true) : opts;
@@ -119,7 +167,7 @@ export const OverlayScrollbars: OverlayScrollbarsStatic = (
     _getDefaultOptions(),
     validateOptions(options)
   );
-  const [addEvent, removeEvent, triggerEvent] = createOSEventListenerHub(eventListeners);
+  const [addEvent, removeEvent, triggerEvent] = createEventListenerHub(eventListeners);
 
   if (
     _nativeScrollbarIsOverlaid.x &&
@@ -139,7 +187,7 @@ export const OverlayScrollbars: OverlayScrollbarsStatic = (
     structureState._elements
   );
 
-  const update = (changedOptions: PartialOptions<OSOptions>, force?: boolean) => {
+  const update = (changedOptions: PartialOptions<Options>, force?: boolean) => {
     updateStructure(changedOptions, force);
     updateScrollbars(changedOptions, force);
   };
@@ -173,7 +221,7 @@ export const OverlayScrollbars: OverlayScrollbarsStatic = (
   });
 
   const instance: OverlayScrollbars = {
-    options(newOptions?: PartialOptions<OSOptions>) {
+    options(newOptions?: PartialOptions<Options>) {
       if (newOptions) {
         const changedOptions = getOptionsDiff(currentOptions, validateOptions(newOptions));
 

packages/overlayscrollbars/src/plugins/optionsValidation/optionsValidation.ts

@@ -1,5 +1,5 @@
 import { OSPlugin } from 'plugins';
-import { OSOptions, OverflowBehavior, VisibilityBehavior, AutoHideBehavior } from 'options';
+import { Options, OverflowBehavior, VisibilityBehavior, AutoHideBehavior } from 'options';
 import {
   validateOptions,
   OptionsTemplate,
@@ -18,7 +18,7 @@ const scrollbarsVisibilityAllowedValues: OptionsTemplateValue<VisibilityBehavior
 const scrollbarsAutoHideAllowedValues: OptionsTemplateValue<AutoHideBehavior> =
   'never scroll leavemove';
 
-const optionsTemplate: OptionsTemplate<OSOptions> = {
+const optionsTemplate: OptionsTemplate<Options> = {
   // resize: resizeAllowedValues, // none || both  || horizontal || vertical || n || b ||
   paddingAbsolute: booleanAllowedValues, // true || false
   updating: {
@@ -53,7 +53,7 @@ const optionsTemplate: OptionsTemplate<OSOptions> = {
 };
 
 export type OptionsValidationPluginInstance = {
-  _: (options: PartialOptions<OSOptions>, doWriteErrors?: boolean) => PartialOptions<OSOptions>;
+  _: (options: PartialOptions<Options>, doWriteErrors?: boolean) => PartialOptions<Options>;
 };
 
 export const optionsValidationPluginName = '__osOptionsValidationPlugin';
@@ -61,7 +61,7 @@ export const optionsValidationPluginName = '__osOptionsValidationPlugin';
 export const optionsValidationPlugin: OSPlugin<OptionsValidationPluginInstance> = [
   optionsValidationPluginName,
   {
-    _: (options: PartialOptions<OSOptions>, doWriteErrors?: boolean) => {
+    _: (options: PartialOptions<Options>, doWriteErrors?: boolean) => {
       const [validated, foreign] = validateOptions(optionsTemplate, options, doWriteErrors);
       return { ...foreign, ...validated };
     },

packages/overlayscrollbars/src/setups/scrollbarsSetup/index.ts

@@ -1 +1,2 @@
 export * from 'setups/scrollbarsSetup/scrollbarsSetup';
+export * from 'setups/scrollbarsSetup/scrollbarsSetup.initialization';

packages/overlayscrollbars/src/setups/scrollbarsSetup/scrollbarsSetup.elements.ts

@@ -1,4 +1,4 @@
-import { appendChildren, createDiv, removeElements, isFunction } from 'support';
+import { appendChildren, createDiv, removeElements } from 'support';
 import {
   classNameScrollbar,
   classNameScrollbarHorizontal,
@@ -6,9 +6,15 @@ import {
   classNameScrollbarTrack,
   classNameScrollbarHandle,
 } from 'classnames';
-import { getEnvironment, ScrollbarsInitializationStrategy } from 'environment';
+import { getEnvironment } from 'environment';
-import { OSTarget, ScrollbarsInitialization } from 'typings';
+import { dynamicInitializationElement as generalDynamicInitializationElement } from 'initialization';
+import type { InitializationTarget } from 'initialization';
 import type { StructureSetupElementsObj } from 'setups/structureSetup/structureSetup.elements';
+import type {
+  ScrollbarsInitialization,
+  ScrollbarsInitializationStrategy,
+  ScrollbarsDynamicInitializationElement,
+} from 'setups/scrollbarsSetup/scrollbarsSetup.initialization';
 
 export interface ScrollbarStructure {
   _scrollbar: HTMLElement;
@@ -39,7 +45,7 @@ const generateScrollbarDOM = (scrollbarClassName: string): ScrollbarStructure =>
 };
 
 export const createScrollbarsSetupElements = (
-  target: OSTarget,
+  target: InitializationTarget,
   structureSetupElements: StructureSetupElementsObj
 ): ScrollbarsSetupElements => {
   const { _getInitializationStrategy } = getEnvironment();
@@ -48,15 +54,13 @@ export const createScrollbarsSetupElements = (
   const { _target, _host, _viewport, _targetIsElm } = structureSetupElements;
   const initializationScrollbarSlot =
     !_targetIsElm && (target as ScrollbarsInitialization).scrollbarsSlot;
-  const initializationScrollbarSlotResult = isFunction(initializationScrollbarSlot)
-    ? initializationScrollbarSlot(_target, _host, _viewport)
-    : initializationScrollbarSlot;
   const evaluatedScrollbarSlot =
-    initializationScrollbarSlotResult ||
+    generalDynamicInitializationElement<ScrollbarsDynamicInitializationElement>(
-    (isFunction(environmentScrollbarSlot)
+      [_target, _host, _viewport],
-      ? environmentScrollbarSlot(_target, _host, _viewport)
+      () => _host,
-      : environmentScrollbarSlot) ||
+      environmentScrollbarSlot,
-    _host;
+      initializationScrollbarSlot
+    );
 
   const horizontalScrollbarStructure = generateScrollbarDOM(classNameScrollbarHorizontal);
   const verticalScrollbarStructure = generateScrollbarDOM(classNameScrollbarVertical);

packages/overlayscrollbars/src/setups/scrollbarsSetup/scrollbarsSetup.initialization.ts

@@ -0,0 +1,27 @@
+import type {
+  InitializationTargetElement,
+  InitializtationElementStrategy,
+  DynamicInitializationElement,
+} from 'initialization';
+
+export type ScrollbarsDynamicInitializationElement = DynamicInitializationElement<
+  [target: InitializationTargetElement, host: HTMLElement, viewport: HTMLElement]
+>;
+
+/**
+ * Object for special initialization.
+ *
+ * If element is provided, the provided element takes all its responsibilities.
+ * DOM hierarchy isn't checked in this case, its assumed that hieararchy is correct in such a case.
+ *
+ * Null or Undefined means that the environment initialization strategy is used.
+ */
+export interface ScrollbarsInitialization {
+  scrollbarsSlot?: ScrollbarsDynamicInitializationElement;
+}
+
+export type ScrollbarsInitializationStrategy = {
+  [K in keyof ScrollbarsInitialization as `_${K}`]: InitializtationElementStrategy<
+    ScrollbarsInitialization[K]
+  >;
+};

packages/overlayscrollbars/src/setups/scrollbarsSetup/scrollbarsSetup.ts

@@ -6,7 +6,7 @@ import {
 import type { StructureSetupElementsObj } from 'setups/structureSetup/structureSetup.elements';
 import type { ReadonlyOSOptions } from 'options';
 import type { Setup } from 'setups';
-import type { OSTarget } from 'typings';
+import type { InitializationTarget } from 'initialization';
 
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
 export interface ScrollbarsSetupState {}
@@ -16,7 +16,7 @@ export interface ScrollbarsSetupStaticState {
 }
 
 export const createScrollbarsSetup = (
-  target: OSTarget,
+  target: InitializationTarget,
   options: ReadonlyOSOptions,
   structureSetupElements: StructureSetupElementsObj
 ): Setup<ScrollbarsSetupState, ScrollbarsSetupStaticState> => {

packages/overlayscrollbars/src/setups/setups.ts

@@ -1,13 +1,10 @@
 import { assignDeep, hasOwnProperty } from 'support';
-import type { OSOptions, ReadonlyOSOptions } from 'options';
+import type { Options, ReadonlyOSOptions } from 'options';
 import type { PartialOptions } from 'typings';
 
 export type SetupElements<T extends Record<string, any>> = [elements: T, destroy: () => void];
 
-export type SetupUpdate<T = void> = (
+export type SetupUpdate<T = void> = (changedOptions: PartialOptions<Options>, force?: boolean) => T;
-  changedOptions: PartialOptions<OSOptions>,
-  force?: boolean
-) => T;
 
 export type SetupUpdateCheckOption = <T>(path: string) => [value: T, changed: boolean];
 
@@ -36,7 +33,7 @@ const getPropByPath = <T>(obj: any, path: string): T =>
 export const createOptionCheck =
   (
     options: ReadonlyOSOptions,
-    changedOptions: PartialOptions<OSOptions>,
+    changedOptions: PartialOptions<Options>,
     force?: boolean
   ): SetupUpdateCheckOption =>
   (path: string) =>

packages/overlayscrollbars/src/setups/structureSetup/index.ts

@@ -1 +1,2 @@
 export * from 'setups/structureSetup/structureSetup';
+export * from 'setups/structureSetup/structureSetup.initialization';

packages/overlayscrollbars/src/setups/structureSetup/structureSetup.elements.ts

@@ -1,8 +1,8 @@
 import {
   isHTMLElement,
   appendChildren,
-  is,
   createDiv,
+  is,
   contents,
   insertAfter,
   addClass,
@@ -15,8 +15,6 @@ import {
   runEach,
   insertBefore,
   attr,
-  isBoolean,
-  isFunction,
   keys,
   removeAttr,
   attrClass,
@@ -33,17 +31,22 @@ import {
   classNameContent,
   classNameViewportScrollbarStyling,
 } from 'classnames';
+import { getEnvironment } from 'environment';
 import {
-  getEnvironment,
+  staticInitializationElement as generalStaticInitializationElement,
-  StructureInitializationStrategyStaticElement,
+  dynamicInitializationElement as generalDynamicInitializationElement,
-  StructureInitializationStrategyDynamicElement,
+} from 'initialization';
-} from 'environment';
+import type { InitializationTarget, InitializationTargetElement } from 'initialization';
-import { OSTarget, OSTargetElement, StructureInitialization } from 'typings';
+import type {
+  StructureDynamicInitializationElement,
+  StructureInitialization,
+  StructureStaticInitializationElement,
+} from 'setups/structureSetup/structureSetup.initialization';
 
 export type StructureSetupElements = [targetObj: StructureSetupElementsObj, destroy: () => void];
 
 export interface StructureSetupElementsObj {
-  _target: OSTargetElement;
+  _target: InitializationTargetElement;
   _host: HTMLElement;
   _viewport: HTMLElement;
   _padding: HTMLElement | false;
@@ -64,6 +67,8 @@ export interface StructureSetupElementsObj {
 
 let contentArrangeCounter = 0;
 
+const createNewDiv = createDiv.bind(0, '');
+
 const unwrap = (elm: HTMLElement | false | null | undefined) => {
   appendChildren(parent(elm), contents(elm));
   removeElements(elm);
@@ -87,38 +92,14 @@ const createUniqueViewportArrangeElement = (): HTMLStyleElement | false => {
   return result;
 };
 
-const staticCreationFromStrategy = (
-  target: OSTargetElement,
-  initializationValue?: HTMLElement | undefined,
-  strategy?: StructureInitializationStrategyStaticElement
-): HTMLElement => {
-  const result =
-    initializationValue ||
-    (isFunction(strategy) ? strategy(target) : (strategy as null | undefined));
-  return result || createDiv();
-};
-
-const dynamicCreationFromStrategy = (
-  target: OSTargetElement,
-  initializationValue: HTMLElement | boolean | undefined,
-  strategy: StructureInitializationStrategyDynamicElement
-): HTMLElement | false => {
-  const takeInitializationValue = isBoolean(initializationValue) || initializationValue;
-  const result = takeInitializationValue
-    ? (initializationValue as boolean | HTMLElement)
-    : isFunction(strategy)
-    ? strategy(target)
-    : strategy;
-
-  return result === true ? createDiv() : result;
-};
-
 const addDataAttrHost = (elm: HTMLElement, value?: string | false | null | undefined) => {
   attr(elm, dataAttributeHost, value || '');
   return removeAttr.bind(0, elm, dataAttributeHost);
 };
 
-export const createStructureSetupElements = (target: OSTarget): StructureSetupElements => {
+export const createStructureSetupElements = (
+  target: InitializationTarget
+): StructureSetupElements => {
   const { _getInitializationStrategy, _nativeScrollbarStyling } = getEnvironment();
   const {
     _host: hostInitializationStrategy,
@@ -129,7 +110,7 @@ export const createStructureSetupElements = (target: OSTarget): StructureSetupEl
   const targetIsElm = isHTMLElement(target);
   const targetStructureInitialization = target as StructureInitialization;
   const targetElement = targetIsElm
-    ? (target as OSTargetElement)
+    ? (target as InitializationTargetElement)
     : targetStructureInitialization.target;
   const isTextarea = is(targetElement, 'textarea');
   const isBody = !isTextarea && is(targetElement, 'body');
@@ -137,36 +118,44 @@ export const createStructureSetupElements = (target: OSTarget): StructureSetupEl
   const bodyElm = ownerDocument.body as HTMLBodyElement;
   const wnd = ownerDocument.defaultView as Window;
   const singleElmSupport = !!ResizeObserverConstructor && _nativeScrollbarStyling;
-  const potentialViewportElement = staticCreationFromStrategy(
+  const staticInitializationElement =
-    targetElement,
+    generalStaticInitializationElement<StructureStaticInitializationElement>.bind(0, [
-    targetStructureInitialization.viewport,
+      targetElement,
-    viewportInitializationStrategy
+    ]);
+  const dynamicInitializationElement =
+    generalDynamicInitializationElement<StructureDynamicInitializationElement>.bind(0, [
+      targetElement,
+    ]);
+  const potentialViewportElement = staticInitializationElement(
+    createNewDiv,
+    viewportInitializationStrategy,
+    targetStructureInitialization.viewport
   );
   const potentiallySingleElm = potentialViewportElement === targetElement;
   const viewportIsTarget = singleElmSupport && potentiallySingleElm;
   const viewportElement =
     potentiallySingleElm && !viewportIsTarget
-      ? staticCreationFromStrategy(targetElement)
+      ? staticInitializationElement(createNewDiv)
       : potentialViewportElement;
   const evaluatedTargetObj: StructureSetupElementsObj = {
     _target: targetElement,
     _host: isTextarea
-      ? staticCreationFromStrategy(
+      ? staticInitializationElement(
-          targetElement,
+          createNewDiv,
-          targetStructureInitialization.host,
+          hostInitializationStrategy,
-          hostInitializationStrategy
+          targetStructureInitialization.host
         )
       : (targetElement as HTMLElement),
     _viewport: viewportElement,
-    _padding: dynamicCreationFromStrategy(
+    _padding: dynamicInitializationElement(
-      targetElement,
+      createNewDiv,
-      targetStructureInitialization.padding,
+      paddingInitializationStrategy,
-      paddingInitializationStrategy
+      targetStructureInitialization.padding
     ),
-    _content: dynamicCreationFromStrategy(
+    _content: dynamicInitializationElement(
-      targetElement,
+      createNewDiv,
-      targetStructureInitialization.content,
+      contentInitializationStrategy,
-      contentInitializationStrategy
+      targetStructureInitialization.content
     ),
     _viewportArrange: !viewportIsTarget && createUniqueViewportArrangeElement(),
     _windowElm: wnd,

packages/overlayscrollbars/src/setups/structureSetup/structureSetup.initialization.ts

@@ -0,0 +1,38 @@
+import type {
+  InitializationTargetElement,
+  StaticInitializationElement,
+  DynamicInitializationElement,
+  InitializtationElementStrategy,
+} from 'initialization';
+
+export type StructureStaticInitializationElement = StaticInitializationElement<
+  [target: InitializationTargetElement]
+>;
+
+export type StructureDynamicInitializationElement = DynamicInitializationElement<
+  [target: InitializationTargetElement]
+>;
+
+/**
+ * Object for special initialization.
+ *
+ * Target is always required, if element is not provided or undefined it will be generated.
+ *
+ * If element is provided, the provided element takes all its responsibilities.
+ * DOM hierarchy isn't checked in this case, its assumed that hieararchy is correct in such a case.
+ *
+ * Null or Undefined means that the environment initialization strategy is used.
+ */
+export interface StructureInitialization {
+  target: InitializationTargetElement;
+  host?: StructureStaticInitializationElement; // only relevant for textarea
+  viewport?: StructureStaticInitializationElement;
+  padding?: StructureDynamicInitializationElement;
+  content?: StructureDynamicInitializationElement;
+}
+
+export type StructureInitializationStrategy = {
+  [K in keyof Omit<StructureInitialization, 'target'> as `_${K}`]: InitializtationElementStrategy<
+    StructureInitialization[K]
+  >;
+};

packages/overlayscrollbars/src/setups/structureSetup/structureSetup.ts

@@ -6,9 +6,10 @@ import { createStructureSetupObservers } from 'setups/structureSetup/structureSe
 import type { StructureSetupUpdateHints } from 'setups/structureSetup/structureSetup.update';
 import type { StructureSetupElementsObj } from 'setups/structureSetup/structureSetup.elements';
 import type { TRBL, XY } from 'support';
-import type { OSOptions, ReadonlyOSOptions } from 'options';
+import type { Options, ReadonlyOSOptions } from 'options';
 import type { Setup } from 'setups';
-import type { OSTarget, PartialOptions, StyleObject, OverflowStyle } from 'typings';
+import type { InitializationTarget } from 'initialization';
+import type { PartialOptions, StyleObject, OverflowStyle } from 'typings';
 
 export interface StructureSetupState {
   _padding: TRBL;
@@ -28,7 +29,7 @@ export interface StructureSetupStaticState {
 
 export type OnUpdatedListener = (
   updateHints: StructureSetupUpdateHints,
-  changedOptions: PartialOptions<OSOptions>,
+  changedOptions: PartialOptions<Options>,
   force: boolean
 ) => void;
 
@@ -66,7 +67,7 @@ const initialStructureSetupUpdateState: StructureSetupState = {
 };
 
 export const createStructureSetup = (
-  target: OSTarget,
+  target: InitializationTarget,
   options: ReadonlyOSOptions
 ): Setup<StructureSetupState, StructureSetupStaticState> => {
   const checkOptionsFallback = createOptionCheck(options, {});
@@ -75,7 +76,7 @@ export const createStructureSetup = (
   const [getState] = state;
   const runOnUpdatedListeners = (
     updateHints: StructureSetupUpdateHints,
-    changedOptions?: PartialOptions<OSOptions>,
+    changedOptions?: PartialOptions<Options>,
     force?: boolean
   ) => {
     runEach(onUpdatedListeners, [updateHints, changedOptions || {}, !!force]);

packages/overlayscrollbars/src/support/dom/manipulation.ts

@@ -12,11 +12,11 @@ type NodeCollection = ArrayLike<Node> | Node | false | null | undefined;
  */
 const before = (
   parentElm: Node | false | null | undefined,
-  preferredAnchor: Node | null | undefined,
+  preferredAnchor: Node | false | null | undefined,
   insertedElms: NodeCollection
 ): void => {
   if (insertedElms) {
-    let anchor: Node | null | undefined = preferredAnchor;
+    let anchor: Node | false | null | undefined = preferredAnchor;
     let fragment: DocumentFragment | Node | null | undefined;
 
     // parent must be defined
@@ -54,7 +54,10 @@ const before = (
  * @param node The Node to which the children shall be appended.
  * @param children The Nodes which shall be appended.
  */
-export const appendChildren = (node: Node | null | undefined, children: NodeCollection): void => {
+export const appendChildren = (
+  node: Node | false | null | undefined,
+  children: NodeCollection
+): void => {
   before(node, null, children);
 };
 
@@ -63,7 +66,10 @@ export const appendChildren = (node: Node | null | undefined, children: NodeColl
  * @param node The Node to which the children shall be prepended.
  * @param children The Nodes which shall be prepended.
  */
-export const prependChildren = (node: Node | null | undefined, children: NodeCollection): void => {
+export const prependChildren = (
+  node: Node | false | null | undefined,
+  children: NodeCollection
+): void => {
   before(node, node && node.firstChild, children);
 };
 
@@ -73,7 +79,7 @@ export const prependChildren = (node: Node | null | undefined, children: NodeCol
  * @param insertedNodes The Nodes which shall be inserted.
  */
 export const insertBefore = (
-  node: Node | null | undefined,
+  node: Node | false | null | undefined,
   insertedNodes: NodeCollection
 ): void => {
   before(parent(node), node, insertedNodes);
@@ -84,7 +90,10 @@ export const insertBefore = (
  * @param node The Node after which the given Nodes shall be inserted.
  * @param insertedNodes The Nodes which shall be inserted.
  */
-export const insertAfter = (node: Node | null | undefined, insertedNodes: NodeCollection): void => {
+export const insertAfter = (
+  node: Node | false | null | undefined,
+  insertedNodes: NodeCollection
+): void => {
   before(parent(node), node && node.nextSibling, insertedNodes);
 };
 

packages/overlayscrollbars/src/support/eventListeners.ts

@@ -3,96 +3,102 @@ import { keys } from 'support/utils/object';
 import { each, from } from 'support/utils/array';
 
 export type EventListener<
-  NameArgsMap extends Record<string, any>,
+  EventMap extends Record<string, any>,
-  Name extends Extract<keyof NameArgsMap, string> = Extract<keyof NameArgsMap, string>
+  Name extends keyof EventMap = keyof EventMap
-> = (...args: NameArgsMap[Name] extends undefined ? [] : [args: NameArgsMap[Name]]) => void;
+> = (...args: EventMap[Name] extends undefined ? [] : [args: EventMap[Name]]) => void;
 
-export type EventListenerGroup<
+export type InitialEventListeners<EventMap extends Record<string, any>> = {
-  NameArgsMap extends Record<string, any>,
+  [K in keyof EventMap]?: EventListener<EventMap> | EventListener<EventMap>[];
-  Name extends Extract<keyof NameArgsMap, string> = Extract<keyof NameArgsMap, string>
-> = EventListener<NameArgsMap, Name> | EventListener<NameArgsMap, Name>[];
-
-export type AddEventListener<NameArgsMap extends Record<string, any>> = <
-  Name extends Extract<keyof NameArgsMap, string>
->(
-  name: Name,
-  listener: EventListenerGroup<NameArgsMap, Name>
-) => () => void;
-
-export type RemoveEventListener<NameArgsMap extends Record<string, any>> = <
-  Name extends Extract<keyof NameArgsMap, string>
->(
-  name?: Name,
-  listener?: EventListenerGroup<NameArgsMap, Name>
-) => void;
-
-export type TriggerEventListener<NameArgsMap extends Record<string, any>> = <
-  Name extends Extract<keyof NameArgsMap, string>
->(
-  name: Name,
-  ...args: NameArgsMap[Name] extends undefined ? [] : [args: NameArgsMap[Name]]
-) => void;
-
-export type InitialEventListeners<NameArgsMap extends Record<string, any>> = {
-  [K in Extract<keyof NameArgsMap, string>]?: EventListenerGroup<NameArgsMap, K>;
 };
 
-const manageListener = <NameArgsMap extends Record<string, any>>(
+const manageListener = <EventMap extends Record<string, any>>(
-  callback: (listener?: EventListener<NameArgsMap>) => void,
+  callback: (listener?: EventListener<EventMap>) => void,
-  listener?: EventListener<NameArgsMap> | EventListener<NameArgsMap>[]
+  listener?: EventListener<EventMap> | EventListener<EventMap>[]
 ) => {
   each(isArray(listener) ? listener : [listener], callback);
 };
 
-export const createEventListenerHub = <NameArgsMap extends Record<string, any>>(
+export const createEventListenerHub = <EventMap extends Record<string, any>>(
-  initialEventListeners?: InitialEventListeners<NameArgsMap>
+  initialEventListeners?: InitialEventListeners<EventMap>
-): [
+) => {
-  AddEventListener<NameArgsMap>,
+  type EventListener<Name extends keyof EventMap = keyof EventMap> = (
-  RemoveEventListener<NameArgsMap>,
+    ...args: EventMap[Name] extends undefined ? [] : [args: EventMap[Name]]
-  TriggerEventListener<NameArgsMap>
+  ) => void;
-] => {
+
-  const events = new Map<Extract<keyof NameArgsMap, string>, Set<EventListener<NameArgsMap>>>();
+  const events = new Map<keyof EventMap, Set<EventListener>>();
-  const removeEvent: RemoveEventListener<NameArgsMap> = (name?, listener?) => {
+
+  function removeEvent<Name extends keyof EventMap>(
+    name?: Name,
+    listener?: EventListener<Name>
+  ): void;
+  function removeEvent<Name extends keyof EventMap>(
+    name?: Name,
+    listener?: EventListener<Name>[]
+  ): void;
+  function removeEvent<Name extends keyof EventMap>(
+    name?: Name,
+    listener?: EventListener<Name> | EventListener<Name>[]
+  ): void {
     if (name) {
       const eventSet = events.get(name);
       manageListener((currListener) => {
         if (eventSet) {
           eventSet[currListener ? 'delete' : 'clear'](currListener!);
         }
-      }, listener as EventListenerGroup<NameArgsMap> | undefined);
+      }, listener as any);
     } else {
       events.forEach((eventSet) => {
         eventSet.clear();
       });
       events.clear();
     }
-  };
+  }
-  const addEvent: AddEventListener<NameArgsMap> = (name, listener) => {
+
+  function addEvent<Name extends keyof EventMap>(
+    name: Name,
+    listener: EventListener<Name>
+  ): () => void;
+  function addEvent<Name extends keyof EventMap>(
+    name: Name,
+    listener: EventListener<Name>[]
+  ): () => void;
+  function addEvent<Name extends keyof EventMap>(
+    name: Name,
+    listener: EventListener<Name> | EventListener<Name>[]
+  ): () => void {
     const eventSet = events.get(name) || new Set();
     events.set(name, eventSet);
 
     manageListener((currListener) => {
       currListener && eventSet.add(currListener);
-    }, listener as EventListenerGroup<NameArgsMap>);
+    }, listener as any);
 
-    return removeEvent.bind(0, name as any, listener as EventListenerGroup<NameArgsMap>);
+    return removeEvent.bind(0, name as any, listener as any);
-  };
+  }
-  const triggerEvent: TriggerEventListener<NameArgsMap> = (name, args?) => {
+
+  function triggerEvent<Name extends keyof EventMap>(
+    name: Name,
+    ...args: EventMap[Name] extends undefined ? [] : [args: EventMap[Name]]
+  ): void {
     const eventSet = events.get(name);
 
     each(from(eventSet), (event) => {
       if (args) {
-        (event as (args: NameArgsMap[Extract<keyof NameArgsMap, string>]) => void)(args as any);
+        (event as (args: EventMap[keyof EventMap]) => void)(args as any);
       } else {
         (event as () => void)();
       }
     });
-  };
+  }
 
-  const initialListenerKeys = keys(initialEventListeners) as Extract<keyof NameArgsMap, string>[];
+  const initialListenerKeys = keys(initialEventListeners) as Extract<keyof EventMap, string>[];
   each(initialListenerKeys, (key) => {
     addEvent(key, initialEventListeners![key] as any);
   });
 
-  return [addEvent, removeEvent, triggerEvent];
+  return [addEvent, removeEvent, triggerEvent] as [
+    typeof addEvent,
+    typeof removeEvent,
+    typeof triggerEvent
+  ];
 };

packages/overlayscrollbars/src/typings.ts

@@ -14,59 +14,6 @@ export type StyleObject<CustomCssProps = ''> = {
     | number;
 };
 
-export type InternalVersionOf<T> = {
-  [K in keyof T as `_${Uncapitalize<string & K>}`]: T[K];
-};
-
-export type OSTargetElement = HTMLElement | HTMLTextAreaElement;
-
-/**
- * Static elements MUST be present.
- */
-type StructureInitializationStaticElement = HTMLElement;
-
-/**
- * Dynamic element CAN be present.
- * If its a element the element will be handled as the repsective element.
- * True means that the respective dynamic element is forced to be generated.
- * False means that the respective dynamic element is forced NOT to be generated.
- */
-type StructureInitializationDynamicElement = HTMLElement | boolean;
-
-/**
- * Object for special initialization.
- *
- * Target is always required, if element is not provided or undefined it will be generated.
- *
- * If element is provided, the provided element takes all its responsibilities.
- * DOM hierarchy isn't checked in this case, its assumed that hieararchy is correct in such a case.
- *
- * Undefined means that the environment initialization strategy for the respective element is used.
- */
-export interface StructureInitialization {
-  target: OSTargetElement;
-  host?: StructureInitializationStaticElement; // only relevant for textarea
-  viewport?: StructureInitializationStaticElement;
-  padding?: StructureInitializationDynamicElement;
-  content?: StructureInitializationDynamicElement;
-}
-
-/**
- * Object for special initialization.
- *
- * scrollbarsSlot is the element to which the scrollbars are applied to. If null or undefined the plugin decides by itself whats the scrollbars slot.
- */
-export interface ScrollbarsInitialization {
-  scrollbarsSlot?:
-    | null
-    | HTMLElement
-    | ((target: OSTargetElement, host: HTMLElement, viewport: HTMLElement) => null | HTMLElement);
-}
-
-export interface OSInitializationObject extends StructureInitialization, ScrollbarsInitialization {}
-
-export type OSTarget = OSTargetElement | OSInitializationObject;
-
 export type OverflowStyle = 'scroll' | 'hidden' | 'visible';
 
 /*

packages/overlayscrollbars/tests/jest/setups/structureSetup/structureSetup.elements.test.ts

@@ -1,13 +1,14 @@
-import {
+import { InternalEnvironment } from 'environment';
-  Environment,
-  StructureInitializationStrategyStaticElement,
-  StructureInitializationStrategyDynamicElement,
-} from 'environment';
-import { OSTarget, StructureInitialization } from 'typings';
 import {
   createStructureSetupElements,
   StructureSetupElementsObj,
 } from 'setups/structureSetup/structureSetup.elements';
+import type { InitializationTarget, InitializtationElementStrategy } from 'initialization';
+import type {
+  StructureInitialization,
+  StructureStaticInitializationElement,
+  StructureDynamicInitializationElement,
+} from 'setups/structureSetup/structureSetup.initialization';
 import { isHTMLElement } from 'support';
 
 const mockGetEnvironment = jest.fn();
@@ -16,7 +17,7 @@ jest.mock('environment', () => ({
 }));
 
 interface StructureSetupElementsProxy {
-  input: OSTarget;
+  input: InitializationTarget;
   elements: StructureSetupElementsObj;
   destroy: () => void;
 }
@@ -95,7 +96,7 @@ const assertCorrectDOMStructure = (textarea?: boolean) => {
 };
 
 const createStructureSetupProxy = (
-  target: OSTarget | StructureInitialization
+  target: InitializationTarget | StructureInitialization
 ): StructureSetupElementsProxy => {
   const [elements, destroy] = createStructureSetupElements(target);
   return {
@@ -108,7 +109,7 @@ const createStructureSetupProxy = (
 const assertCorrectSetupElements = (
   textarea: boolean,
   setupElementsProxy: StructureSetupElementsProxy,
-  environment: Environment
+  environment: InternalEnvironment
 ): [StructureSetupElementsObj, () => void] => {
   const { input, elements, destroy } = setupElementsProxy;
   const { _target, _host, _padding, _viewport, _content } = elements;
@@ -165,11 +166,11 @@ const assertCorrectSetupElements = (
   const styleElm = document.querySelector('style');
   const checkStrategyDependendElements = (
     elm: Element | null,
-    input: HTMLElement | boolean | undefined,
+    input: StructureStaticInitializationElement | StructureDynamicInitializationElement,
     isStaticStrategy: boolean,
     strategy:
-      | StructureInitializationStrategyStaticElement
+      | InitializtationElementStrategy<StructureStaticInitializationElement>
-      | StructureInitializationStrategyDynamicElement
+      | InitializtationElementStrategy<StructureDynamicInitializationElement>
   ) => {
     if (input) {
       expect(elm).toBeTruthy();
@@ -179,7 +180,8 @@ const assertCorrectSetupElements = (
       }
       if (input === undefined) {
         if (isStaticStrategy) {
-          strategy = strategy as StructureInitializationStrategyStaticElement;
+          strategy =
+            strategy as InitializtationElementStrategy<StructureStaticInitializationElement>;
           if (typeof strategy === 'function') {
             const result = strategy(target);
             if (result) {
@@ -191,14 +193,13 @@ const assertCorrectSetupElements = (
             expect(elm).toBeTruthy();
           }
         } else {
-          strategy = strategy as StructureInitializationStrategyDynamicElement;
+          strategy =
+            strategy as InitializtationElementStrategy<StructureDynamicInitializationElement>;
           expect(strategy).not.toBe(null);
           expect(strategy).not.toBe(undefined);
           if (typeof strategy === 'function') {
             const result = strategy(target);
             const resultIsBoolean = typeof result === 'boolean';
-            expect(result).not.toBe(null);
-            expect(result).not.toBe(undefined);
             if (resultIsBoolean) {
               if (result) {
                 expect(elm).toBeTruthy();
@@ -265,7 +266,7 @@ const assertCorrectDestroy = (snapshot: string, destroy: () => void) => {
   expect(snapshot).toBe(getSnapshot());
 };
 
-const env: Environment = jest.requireActual('environment').getEnvironment();
+const env: InternalEnvironment = jest.requireActual('environment').getEnvironment();
 const envDefault = {
   name: 'default',
   env,
@@ -317,12 +318,8 @@ const envInitStrategyAssigned = {
     _getInitializationStrategy: () => ({
       _host: () => document.querySelector('#host1') as HTMLElement,
       _viewport: (target: HTMLElement) => target.querySelector('#viewport') as HTMLElement,
-      _content: (target: HTMLElement) =>
+      _content: (target: HTMLElement) => target.querySelector<HTMLElement>('#content'),
-        target.querySelector<HTMLElement>('#content') ||
+      _padding: (target: HTMLElement) => target.querySelector<HTMLElement>('#padding'),
-        env._defaultInitializationStrategy._content,
-      _padding: (target: HTMLElement) =>
-        target.querySelector<HTMLElement>('#padding') ||
-        env._defaultInitializationStrategy._padding,
       _scrollbarsSlot: null,
     }),
   },

packages/overlayscrollbars/tests/playwright/environment/index.test.ts

@@ -1,14 +1,14 @@
 // @ts-ignore
 import { playwrightRollup } from '@/playwright/rollup';
 import { test } from '@playwright/test';
-import { Environment } from 'environment';
+import { InternalEnvironment } from 'environment';
 
 playwrightRollup();
 
 test.describe('Environment', () => {
   test('page should be titled "Environment"', async ({ page }) => {
     // @ts-ignore
-    const a: Environment = await page.evaluate(() => window.environment.envInstance);
+    const a: InternalEnvironment = await page.evaluate(() => window.environment.envInstance);
     console.log(a);
     await expect(page.title()).resolves.toMatch('environment');
   });

packages/overlayscrollbars/tests/playwright/setups/structureSetup/update/index.browser.ts

@@ -22,7 +22,7 @@ import { resize } from '@/testing-browser/Resize';
 import { setTestResult, waitForOrFailTest } from '@/testing-browser/TestResult';
 import { generateClassChangeSelectCallback, iterateSelect } from '@/testing-browser/Select';
 import { timeout } from '@/testing-browser/timeout';
-import { OSOptions } from 'options';
+import { Options } from 'options';
 import { PartialOptions } from 'typings';
 
 interface Metrics {
@@ -572,7 +572,7 @@ const iterateMinMax = async (afterEach?: () => any) => {
   await iterate(containerMinMaxSelect, afterEach);
 };
 
-const overflowTest = async (osOptions?: PartialOptions<OSOptions>) => {
+const overflowTest = async (osOptions?: PartialOptions<Options>) => {
   const additiveOverflow = () => {
     if (isFractionalPixelRatio()) {
       return 1;

packages/overlayscrollbars/types/overlayscrollbars.d.ts

@@ -1,46 +1,6 @@
 type PartialOptions<T> = {
     [P in keyof T]?: T[P] extends Record<string, unknown> ? PartialOptions<T[P]> : T[P];
 };
-type OSTargetElement = HTMLElement | HTMLTextAreaElement;
-/**
- * Static elements MUST be present.
- */
-type StructureInitializationStaticElement = HTMLElement;
-/**
- * Dynamic element CAN be present.
- * If its a element the element will be handled as the repsective element.
- * True means that the respective dynamic element is forced to be generated.
- * False means that the respective dynamic element is forced NOT to be generated.
- */
-type StructureInitializationDynamicElement = HTMLElement | boolean;
-/**
- * Object for special initialization.
- *
- * Target is always required, if element is not provided or undefined it will be generated.
- *
- * If element is provided, the provided element takes all its responsibilities.
- * DOM hierarchy isn't checked in this case, its assumed that hieararchy is correct in such a case.
- *
- * Undefined means that the environment initialization strategy for the respective element is used.
- */
-interface StructureInitialization {
-    target: OSTargetElement;
-    host?: StructureInitializationStaticElement; // only relevant for textarea
-    viewport?: StructureInitializationStaticElement;
-    padding?: StructureInitializationDynamicElement;
-    content?: StructureInitializationDynamicElement;
-}
-/**
- * Object for special initialization.
- *
- * scrollbarsSlot is the element to which the scrollbars are applied to. If null or undefined the plugin decides by itself whats the scrollbars slot.
- */
-interface ScrollbarsInitialization {
-    scrollbarsSlot?: null | HTMLElement | ((target: OSTargetElement, host: HTMLElement, viewport: HTMLElement) => null | HTMLElement);
-}
-interface OSInitializationObject extends StructureInitialization, ScrollbarsInitialization {
-}
-type OSTarget = OSTargetElement | OSInitializationObject;
 type OverflowStyle = "scroll" | "hidden" | "visible";
 interface TRBL {
     t: number;
@@ -52,20 +12,17 @@ interface XY<T> {
     x: T;
     y: T;
 }
-type EventListener<NameArgsMap extends Record<string, any>, Name extends Extract<keyof NameArgsMap, string>> = (...args: NameArgsMap[Name] extends undefined ? [
+type EventListener<EventMap extends Record<string, any>, Name extends keyof EventMap> = (...args: EventMap[Name] extends undefined ? [
 ] : [
-    args: NameArgsMap[Name]
+    args: EventMap[Name]
 ]) => void;
-type EventListenerGroup<NameArgsMap extends Record<string, any>, Name extends Extract<keyof NameArgsMap, string>> = EventListener<NameArgsMap, Name> | EventListener<NameArgsMap, Name>[];
+type InitialEventListeners<EventMap extends Record<string, any>> = {
-type AddEventListener<NameArgsMap extends Record<string, any>> = <Name extends Extract<keyof NameArgsMap, string>>(name: Name, listener: EventListenerGroup<NameArgsMap, Name>) => () => void;
+    [K in keyof EventMap]?: EventListener<EventMap> | EventListener<EventMap>[];
-type RemoveEventListener<NameArgsMap extends Record<string, any>> = <Name extends Extract<keyof NameArgsMap, string>>(name?: Name, listener?: EventListenerGroup<NameArgsMap, Name>) => void;
-type InitialEventListeners<NameArgsMap extends Record<string, any>> = {
-    [K in Extract<keyof NameArgsMap, string>]?: EventListenerGroup<NameArgsMap, K>;
 };
 type OverflowBehavior = "hidden" | "scroll" | "visible" | "visible-hidden" | "visible-scroll";
 type VisibilityBehavior = "visible" | "hidden" | "auto";
 type AutoHideBehavior = "never" | "scroll" | "leave" | "move";
-interface OSOptions {
+interface Options {
     paddingAbsolute: boolean;
     updating: {
         elementEvents: Array<[
@@ -96,43 +53,78 @@ interface OSOptions {
         initialize: boolean;
     };
 }
-type StructureInitializationStrategyElementFn<T> = ((target: OSTargetElement) => HTMLElement | T) | T;
-type ScrollbarsInitializationStrategyElementFn<T> = ((target: OSTargetElement, host: HTMLElement, viewport: HTMLElement) => HTMLElement | T) | T;
-/**
- * A Static element is an element which MUST be generated.
- * If null or undefined (or the returned result is null or undefined), the initialization function is generatig the element, otherwise
- * the element returned by the function acts as the generated element.
- */
-type StructureInitializationStrategyStaticElement = StructureInitializationStrategyElementFn<null | undefined>;
-/**
- * A Dynamic element is an element which CAN be generated.
- * If boolean (or the returned result is boolean), the generation of the element is forced (or not).
- * If the function returns and element, the element returned by the function acts as the generated element.
- */
-type StructureInitializationStrategyDynamicElement = StructureInitializationStrategyElementFn<boolean>;
-interface StructureInitializationStrategy {
-    _host: StructureInitializationStrategyStaticElement;
-    _viewport: StructureInitializationStrategyStaticElement;
-    _padding: StructureInitializationStrategyDynamicElement;
-    _content: StructureInitializationStrategyDynamicElement;
-}
-interface ScrollbarsInitializationStrategy {
-    /**
-     * The scrollbars slot.  If null or undefined (or the returned result is null or undefined), the initialization function is deciding the element, otherwise
-     * the element returned by the function acts as the scrollbars slot.
-     */
-    _scrollbarsSlot: ScrollbarsInitializationStrategyElementFn<null | undefined>;
-}
-interface InitializationStrategy extends StructureInitializationStrategy, ScrollbarsInitializationStrategy {
-}
-type DefaultInitializationStrategy = {
-    [K in keyof InitializationStrategy]: Extract<InitializationStrategy[K], boolean | null | undefined>;
-};
 type OSPluginInstance = Record<string, unknown> | ((staticObj: OverlayScrollbarsStatic, instanceObj: OverlayScrollbars) => void);
 type OSPlugin<T extends OSPluginInstance> = [
     string,
     T
 ];
+type ScrollbarsDynamicInitializationElement = DynamicInitializationElement<[
+    target: InitializationTargetElement,
+    host: HTMLElement,
+    viewport: HTMLElement
+]>;
+/**
+ * Object for special initialization.
+ *
+ * If element is provided, the provided element takes all its responsibilities.
+ * DOM hierarchy isn't checked in this case, its assumed that hieararchy is correct in such a case.
+ *
+ * Null or Undefined means that the environment initialization strategy is used.
+ */
+interface ScrollbarsInitialization {
+    scrollbarsSlot?: ScrollbarsDynamicInitializationElement;
+}
+type ScrollbarsInitializationStrategy = {
+    [K in keyof ScrollbarsInitialization as `_${K}`]: InitializtationElementStrategy<ScrollbarsInitialization[K]>;
+};
+type StructureStaticInitializationElement = StaticInitializationElement<[
+    target: InitializationTargetElement
+]>;
+type StructureDynamicInitializationElement = DynamicInitializationElement<[
+    target: InitializationTargetElement
+]>;
+/**
+ * Object for special initialization.
+ *
+ * Target is always required, if element is not provided or undefined it will be generated.
+ *
+ * If element is provided, the provided element takes all its responsibilities.
+ * DOM hierarchy isn't checked in this case, its assumed that hieararchy is correct in such a case.
+ *
+ * Null or Undefined means that the environment initialization strategy is used.
+ */
+interface StructureInitialization {
+    target: InitializationTargetElement;
+    host?: StructureStaticInitializationElement; // only relevant for textarea
+    viewport?: StructureStaticInitializationElement;
+    padding?: StructureDynamicInitializationElement;
+    content?: StructureDynamicInitializationElement;
+}
+type StructureInitializationStrategy = {
+    [K in keyof Omit<StructureInitialization, "target"> as `_${K}`]: InitializtationElementStrategy<StructureInitialization[K]>;
+};
+type StaticInitialization = HTMLElement | null | undefined;
+type DynamicInitialization = HTMLElement | boolean | null | undefined;
+type InitializationTargetElement = HTMLElement | HTMLTextAreaElement;
+type InitializationTargetObject = StructureInitialization & ScrollbarsInitialization;
+type InitializationTarget = InitializationTargetElement | InitializationTargetObject;
+type InitializationStrategy = StructureInitializationStrategy & ScrollbarsInitializationStrategy;
+/**
+ * Static elements MUST be present.
+ * Null or undefined behave like if this element wasn't specified during initialization.
+ */
+type StaticInitializationElement<Args extends any[]> = ((...args: Args) => StaticInitialization) | StaticInitialization;
+/**
+ * Dynamic element CAN be present.
+ * If its a element the element will be handled as the repsective element.
+ * True means that the respective dynamic element is forced to be generated.
+ * False means that the respective dynamic element is forced NOT to be generated.
+ * Null or undefined behave like if this element wasn't specified during initialization.
+ */
+type DynamicInitializationElement<Args extends any[]> = ((...args: Args) => DynamicInitialization) | DynamicInitialization;
+type InitializtationElementStrategy<InitElm> = Exclude<InitElm, HTMLElement>;
+type GeneralInitialEventListeners = InitialEventListeners;
+type GeneralEventListener = EventListener;
 /*
 onScrollStart               : null,
 onScroll                    : null,
@@ -143,6 +135,42 @@ onDirectionChanged          : null, // gone
 onContentSizeChanged        : null, // gone
 onHostSizeChanged           : null, // gone
 */
+interface OverlayScrollbarsStatic {
+    (target: InitializationTarget | InitializationTargetObject, options?: PartialOptions<Options>, eventListeners?: GeneralInitialEventListeners<EventListenerMap>): OverlayScrollbars;
+    plugin(osPlugin: OSPlugin | OSPlugin[]): void;
+    env(): Environment;
+}
+interface Environment {
+    scrollbarSize: XY<number>;
+    scrollbarIsOverlaid: XY<boolean>;
+    scrollbarStyling: boolean;
+    rtlScrollBehavior: {
+        n: boolean;
+        i: boolean;
+    };
+    flexboxGlue: boolean;
+    cssCustomProperties: boolean;
+    defaultInitializationStrategy: InitializationStrategy;
+    defaultDefaultOptions: Options;
+    getInitializationStrategy(): InitializationStrategy;
+    setInitializationStrategy(newInitializationStrategy: Partial<InitializationStrategy>): void;
+    getDefaultOptions(): Options;
+    setDefaultOptions(newDefaultOptions: PartialOptions<Options>): void;
+}
+interface State {
+    padding: TRBL;
+    paddingAbsolute: boolean;
+    overflowAmount: XY<number>;
+    overflowStyle: XY<OverflowStyle>;
+    hasOverflow: XY<boolean>;
+}
+interface Elements {
+    target: HTMLElement;
+    host: HTMLElement;
+    padding: HTMLElement;
+    viewport: HTMLElement;
+    content: HTMLElement;
+}
 interface OnUpdatedEventListenerArgs {
     updateHints: {
         sizeChanged: boolean;
@@ -153,63 +181,27 @@ interface OnUpdatedEventListenerArgs {
         hostMutation: boolean;
         contentMutation: boolean;
     };
-    changedOptions: PartialOptions<OSOptions>;
+    changedOptions: PartialOptions<Options>;
     force: boolean;
 }
-interface OSEventListenersNameArgsMap {
+interface EventListenerMap {
     initialized: undefined;
     initializationWithdrawn: undefined;
     updated: OnUpdatedEventListenerArgs;
     destroyed: undefined;
 }
-type AddOSEventListener = AddEventListener<OSEventListenersNameArgsMap>;
+type EventListener$0<Name extends keyof EventListenerMap> = GeneralEventListener<EventListenerMap, Name>;
-type RemoveOSEventListener = RemoveEventListener<OSEventListenersNameArgsMap>;
-type InitialOSEventListeners = InitialEventListeners<OSEventListenersNameArgsMap>;
-interface OverlayScrollbarsStatic {
-    (target: OSTarget | OSInitializationObject, options?: PartialOptions<OSOptions>, eventListeners?: InitialOSEventListeners): OverlayScrollbars;
-    plugin(osPlugin: OSPlugin | OSPlugin[]): void;
-    env(): OverlayScrollbarsEnv;
-}
-interface OverlayScrollbarsEnv {
-    scrollbarSize: XY<number>;
-    scrollbarIsOverlaid: XY<boolean>;
-    scrollbarStyling: boolean;
-    rtlScrollBehavior: {
-        n: boolean;
-        i: boolean;
-    };
-    flexboxGlue: boolean;
-    cssCustomProperties: boolean;
-    defaultInitializationStrategy: DefaultInitializationStrategy;
-    defaultDefaultOptions: OSOptions;
-    getInitializationStrategy(): InitializationStrategy;
-    setInitializationStrategy(newInitializationStrategy: Partial<InitializationStrategy>): void;
-    getDefaultOptions(): OSOptions;
-    setDefaultOptions(newDefaultOptions: PartialOptions<OSOptions>): void;
-}
-interface OverlayScrollbarsState {
-    padding: TRBL;
-    paddingAbsolute: boolean;
-    overflowAmount: XY<number>;
-    overflowStyle: XY<OverflowStyle>;
-    hasOverflow: XY<boolean>;
-}
-interface OverlayScrollbarsElements {
-    target: HTMLElement;
-    host: HTMLElement;
-    padding: HTMLElement;
-    viewport: HTMLElement;
-    content: HTMLElement;
-}
 interface OverlayScrollbars {
-    options(): OSOptions;
+    options(): Options;
-    options(newOptions?: PartialOptions<OSOptions>): OSOptions;
+    options(newOptions?: PartialOptions<Options>): Options;
     update(force?: boolean): void;
     destroy(): void;
-    state(): OverlayScrollbarsState;
+    state(): State;
-    elements(): OverlayScrollbarsElements;
+    elements(): Elements;
-    on: AddOSEventListener;
+    on<Name extends keyof EventListenerMap>(name: Name, listener: EventListener$0<Name>): () => void;
-    off: RemoveOSEventListener;
+    on<Name extends keyof EventListenerMap>(name: Name, listener: EventListener$0<Name>[]): () => void;
+    off<Name extends keyof EventListenerMap>(name: Name, listener?: EventListener$0<Name>): void;
+    off<Name extends keyof EventListenerMap>(name: Name, listener?: EventListener$0<Name>[]): void;
 }
 /**
  * Notes:

yarn.lock

@@ -17,7 +17,7 @@
   dependencies:
     "@babel/highlight" "^7.10.4"
 
-"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.10.4", "@babel/code-frame@^7.12.13", "@babel/code-frame@^7.16.7", "@babel/code-frame@^7.8.3":
+"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.10.4", "@babel/code-frame@^7.12.13", "@babel/code-frame@^7.16.7":
   version "7.16.7"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.16.7.tgz#44416b6bd7624b998f5b1af5d470856c40138789"
   integrity sha512-iAXqUn8IIeBTNd72xsFlgaXHkMBMt6y4HJp1tIaK465CWLT/fG1aqB7ykr95gHHmlBdGbFeWWfyB4NJJ0nmeIg==
@@ -1248,6 +1248,14 @@
   resolved "https://registry.yarnpkg.com/@jridgewell/set-array/-/set-array-1.1.1.tgz#36a6acc93987adcf0ba50c66908bd0b70de8afea"
   integrity sha512-Ct5MqZkLGEXTVmQYbGtx9SVqD2fqwvdubdps5D3djjAkgkKwT918VNOz65pEHFaYTeWcukmJmH5SwsA9Tn2ObQ==
 
+"@jridgewell/source-map@^0.3.2":
+  version "0.3.2"
+  resolved "https://registry.yarnpkg.com/@jridgewell/source-map/-/source-map-0.3.2.tgz#f45351aaed4527a298512ec72f81040c998580fb"
+  integrity sha512-m7O9o2uR8k2ObDysZYzdfhb08VuEml5oWGiosa1VdaPZ/A6QyPkAJuwN0Q1lhULOf6B7MtQmHENS743hWtCrgw==
+  dependencies:
+    "@jridgewell/gen-mapping" "^0.3.0"
+    "@jridgewell/trace-mapping" "^0.3.9"
+
 "@jridgewell/sourcemap-codec@^1.4.10":
   version "1.4.13"
   resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.13.tgz#b6461fb0c2964356c469e115f504c95ad97ab88c"
@@ -4784,7 +4792,7 @@ jest-watcher@^28.1.1:
     jest-util "^28.1.1"
     string-length "^4.0.1"
 
-jest-worker@^26.0.0:
+jest-worker@^26.2.1:
   version "26.6.2"
   resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-26.6.2.tgz#7f72cbc4d643c365e27b9fd775f9d0eaa9c7a8ed"
   integrity sha512-KWYVV1c4i+jbMpaBC+U++4Va0cp8OisU185o73T1vo99hqi7w8tSJfUXYswwqqrjzwxa6KpRK54WhPvwf5w6PQ==
@@ -6574,17 +6582,17 @@ rollup-plugin-styles@^3.10.0:
     source-map "^0.7.3"
     tslib "^2.1.0"
 
-rollup-plugin-terser@^6.1.0:
+rollup-plugin-terser@^7.0.2:
-  version "6.1.0"
+  version "7.0.2"
-  resolved "https://registry.yarnpkg.com/rollup-plugin-terser/-/rollup-plugin-terser-6.1.0.tgz#071866585aea104bfbb9dd1019ac523e63c81e45"
+  resolved "https://registry.yarnpkg.com/rollup-plugin-terser/-/rollup-plugin-terser-7.0.2.tgz#e8fbba4869981b2dc35ae7e8a502d5c6c04d324d"
-  integrity sha512-4fB3M9nuoWxrwm39habpd4hvrbrde2W2GG4zEGPQg1YITNkM3Tqur5jSuXlWNzbv/2aMLJ+dZJaySc3GCD8oDw==
+  integrity sha512-w3iIaU4OxcF52UUXiZNsNeuXIMDvFrr+ZXK6bFZ0Q60qyVfq4uLptoS4bbq3paG3x216eQllFZX7zt6TIImguQ==
   dependencies:
-    "@babel/code-frame" "^7.8.3"
+    "@babel/code-frame" "^7.10.4"
-    jest-worker "^26.0.0"
+    jest-worker "^26.2.1"
-    serialize-javascript "^3.0.0"
+    serialize-javascript "^4.0.0"
-    terser "^4.7.0"
+    terser "^5.0.0"
 
-rollup-plugin-ts@^3.0.1:
+rollup-plugin-ts@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/rollup-plugin-ts/-/rollup-plugin-ts-3.0.2.tgz#ee1a3f9ffe202ceff0b4d2f725fa268fa0c921bf"
   integrity sha512-67qi2QTHewhLyKDG6fX3jpohWpmUPPIT/xJ7rsYK46X6MqmoWy64Ti0y8ygPfLv8mXDCdRZUofM3mTxDfCswRA==
@@ -6688,10 +6696,10 @@ semver@^7.2.1, semver@^7.3.2, semver@^7.3.4, semver@^7.3.5, semver@^7.3.7:
   dependencies:
     lru-cache "^6.0.0"
 
-serialize-javascript@^3.0.0:
+serialize-javascript@^4.0.0:
-  version "3.1.0"
+  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-3.1.0.tgz#8bf3a9170712664ef2561b44b691eafe399214ea"
+  resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-4.0.0.tgz#b525e1238489a5ecfc42afacc3fe99e666f4b1aa"
-  integrity sha512-JIJT1DGiWmIKhzRsG91aS6Ze4sFUrYbltlkg2onR5OrnNM02Kl/hnY/T4FN2omvyeBbQmMJv+K4cPOpGzOTFBg==
+  integrity sha512-GaNA54380uFefWghODBWEGisLZFj00nS5ACs6yHa9nLqlLpVLO8ChDGeKRjZnV4Nh4n0Qi7nhYZD/9fCPzEqkw==
   dependencies:
     randombytes "^2.1.0"
 
@@ -6845,7 +6853,7 @@ source-map-support@0.5.13:
     buffer-from "^1.0.0"
     source-map "^0.6.0"
 
-source-map-support@~0.5.12:
+source-map-support@~0.5.20:
   version "0.5.21"
   resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.21.tgz#04fe7c7f9e1ed2d662233c28cb2b35b9f63f6e4f"
   integrity sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==
@@ -7145,14 +7153,15 @@ terminal-link@^2.0.0:
     ansi-escapes "^4.2.1"
     supports-hyperlinks "^2.0.0"
 
-terser@^4.7.0:
+terser@^5.0.0:
-  version "4.8.0"
+  version "5.14.1"
-  resolved "https://registry.yarnpkg.com/terser/-/terser-4.8.0.tgz#63056343d7c70bb29f3af665865a46fe03a0df17"
+  resolved "https://registry.yarnpkg.com/terser/-/terser-5.14.1.tgz#7c95eec36436cb11cf1902cc79ac564741d19eca"
-  integrity sha512-EAPipTNeWsb/3wLPeup1tVPaXfIaU68xMnVdPafIL1TV05OhASArYyIfFvnvJCNrR2NIOvDVNNTFRa+Re2MWyw==
+  integrity sha512-+ahUAE+iheqBTDxXhTisdA8hgvbEG1hHOQ9xmNjeUJSoi6DU/gMrKNcfZjHkyY6Alnuyc+ikYJaxxfHkT3+WuQ==
   dependencies:
+    "@jridgewell/source-map" "^0.3.2"
+    acorn "^8.5.0"
     commander "^2.20.0"
-    source-map "~0.6.1"
+    source-map-support "~0.5.20"
-    source-map-support "~0.5.12"
 
 test-exclude@^6.0.0:
   version "6.0.0"
@@ -7326,7 +7335,7 @@ type-fest@^0.8.1:
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.8.1.tgz#09e249ebde851d3b1e48d27c105444667f17b83d"
   integrity sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA==
 
-typescript@^4.5.4, typescript@^4.7.3:
+typescript@^4.5.4, typescript@^4.7.4:
   version "4.7.4"
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.7.4.tgz#1a88596d1cf47d59507a1bcdfb5b9dfe4d488235"
   integrity sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==