lisn.js/dist/cjs/actions/scroll-to.cjs.map

Simply handle user gestures and actions. Includes widgets.

{"version":3,"file":"scroll-to.cjs","names":["MH","_interopRequireWildcard","require","MC","_domSearch","_misc","_validation","_scrollWatcher","_action","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","ScrollTo","register","registerAction","element","args","config","offset","left","offsetX","top","offsetY","undefined","duration","scrollable","newConfigValidator","constructor","watcher","ScrollWatcher","reuse","prevScrollTop","prevScrollLeft","do","current","fetchCurrentScroll","S_SCROLL_TOP","S_SCROLL_LEFT","action","scrollTo","waitFor","undo","omitKeys","S_TOGGLE","start","canReverse","hasReversed","altTarget","merge","exports","key","_validateNumber","validateNumber","_validateNumber2","_ref","isLiteralString","waitForReferenceElement"],"sources":["../../../src/ts/actions/scroll-to.ts"],"sourcesContent":["/**\n * @module Actions\n *\n * @categoryDescription Scrolling\n * {@link ScrollTo} scrolls to the given element or to the previous scroll\n * position.\n */\n\nimport * as MH from \"@lisn/globals/minification-helpers\";\nimport * as MC from \"@lisn/globals/minification-constants\";\n\nimport { CoordinateOffset } from \"@lisn/globals/types\";\n\nimport { waitForReferenceElement } from \"@lisn/utils/dom-search\";\nimport { omitKeys } from \"@lisn/utils/misc\";\nimport { validateNumber } from \"@lisn/utils/validation\";\n\nimport { ScrollWatcher } from \"@lisn/watchers/scroll-watcher\";\n\nimport { Action, registerAction } from \"@lisn/actions/action\";\n\nimport { WidgetConfigValidatorFunc } from \"@lisn/widgets/widget\";\n\n/**\n * Scrolls to the given element or to the previous scroll position.\n *\n * -------\n *\n * To use with auto-widgets (HTML API) as part of a trigger specification:\n * - Action name: \"scroll-to\".\n * - Accepted string arguments: none\n * - Accepted options:\n *   - `offsetX`: A number.\n *   - `offsetY`: A number.\n *   - `duration`: A number.\n *   - `scrollable`: A string element specification for an element (see\n *     {@link Utils.getReferenceElement | getReferenceElement}). Note that,\n *     unless it's a DOM ID, the specification is parsed relative to the\n *     element being acted on and not the element the trigger is defined on (in\n *     case you've used the `act-on` trigger option).\n *\n * **NOTE:** Do not place a + sign in front of the offset values (just omit it\n * if you want a positive offset). Otherwise it will be interpreted as a\n * trigger option.\n *\n * @example\n * When the user clicks the button, scroll the main scrolling element to\n * element's position:\n *\n * ```html\n * <button id=\"btn\">Scroll to/back</button>\n * <div data-lisn-on-click=\"@scroll-to +target=#btn\"></div>\n * ```\n *\n * @example\n * When the user clicks the button, scroll the main scrolling element to\n * element's position +10px down:\n *\n * ```html\n * <button id=\"btn\">Scroll to/back</button>\n * <div data-lisn-on-click=\"@scroll-to: offsetY=10 +target=#btn\"></div>\n * ```\n *\n * @example\n * When the user clicks the button, scroll the main scrolling element to\n * element's position 10px _down_ and 50px _left_, with a duration of 200ms:\n *\n * ```html\n * <button id=\"btn\">Scroll to/back</button>\n * <div data-lisn-on-click=\"@scroll-to: offsetY=10, offsetX=-50, duration=200 +target=#btn\"></div>\n * ```\n *\n * @example\n * When the user clicks the button, scroll the closest parent element with\n * class `scrollable` to the element's position:\n *\n * ```html\n * <button id=\"btn\">Scroll to/back</button>\n * <div class=\"scrollable\">\n *   <div data-lisn-on-click=\"@scroll-to: scrollable=this.scrollable +target=#btn\"></div>\n * </div>\n * ```\n *\n * @example\n * As above, but using `data-lisn-ref` attribute instead of class selector.\n *\n * ```html\n * <button id=\"btn\">Scroll to/back</button>\n * <div data-lisn-ref=\"scrollable\">\n *   <div data-lisn-on-click=\"@scroll-to: scrollable=this-scrollable +target=#btn\"></div>\n * </div>\n * ```\n *\n * @category Scrolling\n */\nexport class ScrollTo implements Action {\n  /**\n   * Scrolls the main scrolling element to the element's position.\n   */\n  readonly do: () => Promise<void>;\n\n  /**\n   * Scrolls the main scrolling element to the last scroll position before the\n   * action was {@link do}ne. If the action had never been done, does nothing.\n   */\n  readonly undo: () => Promise<void>;\n\n  /**\n   * Scrolls the main scrolling element to the element's position, if it's not\n   * already there, or otherwise scrolls the main scrolling element to the\n   * previous saved scroll position.\n   */\n  readonly toggle: () => Promise<void>;\n\n  static register() {\n    registerAction(\n      \"scroll-to\",\n      (element, args, config) => {\n        const offset = config\n          ? {\n              left: config.offsetX,\n              top: config.offsetY,\n            }\n          : undefined;\n\n        return new ScrollTo(element, {\n          offset,\n          duration: config?.duration,\n          scrollable: config?.scrollable,\n        });\n      },\n      newConfigValidator,\n    );\n  }\n\n  constructor(element: Element, config?: ScrollToConfig) {\n    const watcher = ScrollWatcher.reuse();\n    const { scrollable } = config ?? {};\n    let prevScrollTop = -1,\n      prevScrollLeft = -1;\n\n    this.do = async () => {\n      const current = await watcher.fetchCurrentScroll(scrollable);\n      prevScrollTop = current[MC.S_SCROLL_TOP];\n      prevScrollLeft = current[MC.S_SCROLL_LEFT];\n\n      const action = await watcher.scrollTo(element, config);\n      await action?.waitFor();\n    };\n\n    this.undo = async () => {\n      if (prevScrollTop !== -1) {\n        const action = await watcher.scrollTo(\n          {\n            top: prevScrollTop,\n            left: prevScrollLeft,\n          },\n          omitKeys(config ?? {}, { offset: true }), // no offset when undoing\n        );\n        await action?.waitFor();\n      }\n    };\n\n    this[MC.S_TOGGLE] = async () => {\n      const start = await watcher.fetchCurrentScroll(scrollable);\n\n      const canReverse = prevScrollTop !== -1;\n      let hasReversed = false;\n\n      // Try to scroll to the element, but if we're already close to it, then\n      // reverse to previous position if any.\n      const altTarget = {\n        top: () => {\n          hasReversed = true; // detect if we have reversed\n          return prevScrollTop;\n        },\n        left: prevScrollLeft,\n      };\n\n      const action = await watcher.scrollTo(\n        element,\n        MH.merge(\n          config,\n          canReverse\n            ? { altTarget } // no altOffset when reversing\n            : {},\n        ),\n      );\n      await action?.waitFor();\n\n      if (!hasReversed) {\n        // We've scrolled to the element, so save the starting position as the\n        // previous one.\n        prevScrollTop = start[MC.S_SCROLL_TOP];\n        prevScrollLeft = start[MC.S_SCROLL_LEFT];\n      }\n    };\n  }\n}\n\n/**\n * @interface\n * @category Scrolling\n */\nexport type ScrollToConfig = {\n  /**\n   * See {@link Utils.ScrollToOptions.offset}.\n   *\n   * @defaultValue undefined // none\n   */\n  offset?: CoordinateOffset;\n\n  /**\n   * The duration in milliseconds of the scroll animation.\n   *\n   * @defaultValue {@link ScrollWatcher} default\n   */\n  duration?: number;\n\n  /**\n   * The element that should be scrolled.\n   *\n   * @defaultValue {@link ScrollWatcher} default\n   */\n  scrollable?: Element;\n};\n\n// --------------------\n\nconst newConfigValidator: WidgetConfigValidatorFunc<{\n  offsetX: number;\n  offsetY: number;\n  duration: number | undefined;\n  scrollable?: Element;\n}> = (element) => {\n  return {\n    offsetX: (key, value) => validateNumber(key, value) ?? 0,\n    offsetY: (key, value) => validateNumber(key, value) ?? 0,\n    duration: (key, value) => validateNumber(key, value),\n    scrollable: (key, value) =>\n      (MH.isLiteralString(value)\n        ? waitForReferenceElement(value, element)\n        : null) ?? undefined,\n  };\n};\n"],"mappings":"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","ignoreList":[]}