lisn.js/dist/cjs/triggers/scroll-trigger.cjs.map

Simply handle user gestures and actions. Includes widgets.

{"version":3,"file":"scroll-trigger.cjs","names":["MC","_interopRequireWildcard","require","MH","_directions","_domSearch","_validation","_scrollWatcher","_trigger","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_defineProperty","_toPropertyKey","value","enumerable","configurable","writable","_toPrimitive","Symbol","toPrimitive","TypeError","String","Number","ScrollTrigger","Trigger","register","registerTrigger","S_SCROLL","element","args","actions","config","assign","directions","validateStrList","isValidXYDirection","newConfigValidator","constructor","once","S_UP","S_DOWN","S_LEFT","S_RIGHT","getConfig","copyObject","lengthOf","watcher","ScrollWatcher","reuse","scrollable","threshold","oppositeDirections","getOppositeXYDirections","onScroll","run","reverse","exports","key","_ref","isLiteralString","waitForReferenceElement","undefined","validateNumber"],"sources":["../../../src/ts/triggers/scroll-trigger.ts"],"sourcesContent":["/**\n * @module Triggers\n *\n * @categoryDescription Scroll\n * {@link ScrollTrigger} allows you to run actions when the user scrolls a\n * target element (or the main scrollable element) in a given direction, and\n * undo those actions when they scroll in the opposite direction.\n */\n\nimport * as MC from \"@lisn/globals/minification-constants\";\nimport * as MH from \"@lisn/globals/minification-helpers\";\n\nimport {\n  XYDirection,\n  CommaSeparatedStr,\n  ScrollTarget,\n} from \"@lisn/globals/types\";\n\nimport {\n  getOppositeXYDirections,\n  isValidXYDirection,\n} from \"@lisn/utils/directions\";\nimport { waitForReferenceElement } from \"@lisn/utils/dom-search\";\nimport { validateStrList, validateNumber } from \"@lisn/utils/validation\";\n\nimport { Action } from \"@lisn/actions/action\";\n\nimport { ScrollWatcher } from \"@lisn/watchers/scroll-watcher\";\n\nimport {\n  registerTrigger,\n  Trigger,\n  TriggerConfig,\n} from \"@lisn/triggers/trigger\";\n\nimport { WidgetConfigValidatorFunc } from \"@lisn/widgets/widget\";\n\n/**\n * {@link ScrollTrigger} allows you to run actions when the user scrolls a\n * target element (or the main scrollable element) in a given direction, and\n * undo those actions when they scroll in the opposite direction.\n *\n * -------\n *\n * To use with auto-widgets (HTML API), see {@link registerTrigger} for the\n * specification.\n *\n * - Arguments (optional): One or more (comma-separated) scroll directions.\n *   Note that if you do not specify any directions, then the trigger will just\n *   run once, on any scroll.\n * - Additional trigger options:\n *   - `scrollable`: A string element specification.\n *      See {@link Utils.getReferenceElement | getReferenceElement}.\n *   - `threshold`: A number.\n *\n * @example\n * Show the element when the user scrolls the page up, hide when scrolling\n * down. User scrolling left or right not trigger the action. See\n * {@link getOppositeXYDirections}:\n *\n * ```html\n * <div data-lisn-on-scroll=\"up @show\"></div>\n * ```\n *\n * @example\n * As above, but using a CSS class instead of data attribute:\n *\n * ```html\n * <div class=\"lisn-on-scroll--up@show\"></div>\n * ```\n *\n * @example\n * Show the element 1000ms after the first time the user scrolls the page up:\n *\n * ```html\n * <div data-lisn-on-scroll=\"up @show +once +delay=1000\"></div>\n * ```\n *\n * @example\n * Add class `scrolled` the first time the user scrolls the page in any\n * direction (note that the `once` option is implied here), and show the\n * element 1000ms after each time the user scrolls the page up, hide it as soon\n * as they scroll down:\n *\n * ```html\n * <div data-lisn-on-scroll=\"@add-class=scrolled ;\n *                           up @show +do-delay=1000\"\n * ></div>\n * ```\n *\n * @example\n * When the user scrolls up or down the closest ancestor with class `section`,\n * then add classes `c1` and `c2` and enable trigger `my-trigger` defined on\n * this same element; undo all of that when scrolling right or left:\n *\n * ```html\n * <div class=\"section\">\n *   <div data-lisn-on-scroll=\"up,down @add-class=c1,c2 @enable=my-trigger +scrollable=this.section\"\n *      data-lisn-on-run=\"@show +id=my-trigger\"\n *   ></div>\n *</div>\n * ```\n *\n * @example\n * As above, but using `data-lisn-ref` attribute instead of class selector.\n *\n * ```html\n * <div data-lisn-ref=\"section\">\n *   <div data-lisn-on-scroll=\"up,down @add-class=c1,c2 @enable=my-trigger +scrollable=this-section\"\n *      data-lisn-on-run=\"@show +id=my-trigger\"\n *   ></div>\n *</div>\n * ```\n *\n * @category Scroll\n */\nexport class ScrollTrigger extends Trigger {\n  readonly getConfig: () => ScrollTriggerConfig;\n\n  static register() {\n    registerTrigger(\n      MC.S_SCROLL,\n      (element, args, actions, config) => {\n        return new ScrollTrigger(\n          element,\n          actions,\n          MH.assign(config, {\n            directions: validateStrList(\"directions\", args, isValidXYDirection),\n          }),\n        );\n      },\n      newConfigValidator,\n    );\n  }\n\n  /**\n   * If no actions are supplied, nothing is done.\n   *\n   * @throws {@link Errors.LisnUsageError | LisnUsageError}\n   *                If the config is invalid.\n   */\n  constructor(\n    element: Element,\n    actions: Action[],\n    config?: ScrollTriggerConfig,\n  ) {\n    config ??= {};\n\n    let directions = config.directions;\n    if (!directions) {\n      config.once = true;\n      directions = [MC.S_UP, MC.S_DOWN, MC.S_LEFT, MC.S_RIGHT];\n    }\n\n    super(element, actions, config);\n    this.getConfig = () => MH.copyObject(config);\n\n    if (!MH.lengthOf(actions)) {\n      return;\n    }\n\n    const watcher = ScrollWatcher.reuse();\n    const scrollable = config.scrollable;\n    const threshold = config.threshold;\n\n    const oppositeDirections = directions\n      ? getOppositeXYDirections(directions)\n      : [];\n\n    watcher.onScroll(this.run, {\n      directions,\n      scrollable,\n      threshold,\n    });\n\n    if (MH.lengthOf(oppositeDirections)) {\n      watcher.onScroll(this.reverse, {\n        directions: oppositeDirections,\n        scrollable,\n        threshold,\n      });\n    }\n  }\n}\n\n/**\n * @category Scroll\n * @interface\n */\nexport type ScrollTriggerConfig = TriggerConfig & {\n  /**\n   * The {@link XYDirection}s to use as the trigger.\n   * See also {@link Watchers/ScrollWatcher.OnScrollOptions | OnScrollOptions}\n   *\n   * Actions will be \"done\" when the scroll direction is one of the given ones\n   * and \"undone\" when it's the opposite direction. E.g. for \"up\" the opposite\n   * is \"down\".\n   */\n  directions?: CommaSeparatedStr<XYDirection> | XYDirection[];\n\n  /**\n   * The scrolling element target to use for the ScrollWatcher.\n   * See {@link Watchers/ScrollWatcher.OnScrollOptions | OnScrollOptions}\n   *\n   * @defaultValue {@link ScrollWatcher} default, the main scrolling element\n   */\n  scrollable?: ScrollTarget;\n\n  /**\n   * The scroll threshold to pass to the {@link ScrollWatcher}.\n   * See also {@link Watchers/ScrollWatcher.OnScrollOptions | OnScrollOptions}\n   *\n   * @defaultValue {@link ScrollWatcher} default\n   */\n  threshold?: number;\n};\n\n// --------------------\n\nconst newConfigValidator: WidgetConfigValidatorFunc<\n  Omit<ScrollTriggerConfig, \"directions\">\n> = (element) => {\n  return {\n    scrollable: (key, value) =>\n      (MH.isLiteralString(value)\n        ? waitForReferenceElement(value, element)\n        : null) ?? undefined,\n    threshold: validateNumber,\n  };\n};\n"],"mappings":"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","ignoreList":[]}