center-center 0.0.44 → 0.0.45

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "center-center",
-  "version": "0.0.44",
+  "version": "0.0.45",
   "description": "Position an element at the center center of a container",
   "main": "./src/index.mjs",
   "type": "module",
@@ -24,7 +24,6 @@
     "lint:mts:fix": "npm run lint:mts -- --fix",
     "test": "cross-env NODE_ENV=test mocha test --recursive",
     "prepare": "husky",
-    "types": "tsc",
     "start": "DEBUG=center-center* nodemon docs/index.mjs --watch ."
   },
   "dependencies": {
@@ -36,6 +35,7 @@
     "@babel/eslint-parser": "^7.23.10",
     "@babel/preset-env": "^7.24.0",
     "@sequencemedia/hooks": "^1.0.483",
+    "@types/debug": "^4.1.12",
     "@typescript-eslint/eslint-plugin": "^7.1.1",
     "@typescript-eslint/parser": "^7.1.1",
     "chai": "^5.1.0",

package/src/common/index.d.mts

@@ -1,57 +1,64 @@
-/**
- *  The document `scrollingElement`
- */
-export interface ScrollingElement {
-  scrollLeft: number
-  scrollTop: number
-}
+declare namespace CenterCenterTypes {
+  /**
+   *  The document `scrollingElement`
+   */
+  export interface ScrollingElement {
+    scrollLeft: number
+    scrollTop: number
+  }
 
-/**
- * A Center Center `Rect`
- */
-export interface CenterCenterRect {
-  left: number
-  top: number
-  width: number
-  height: number
-  right: number
-  bottom: number
-}
+  /**
+   * A Center Center `Rect`
+   */
+  export interface CenterCenterRect {
+    left: number
+    top: number
+    width: number
+    height: number
+    right: number
+    bottom: number
+  }
 
-/**
- * Center Center `Rects`
- */
-export interface CenterCenterRects {
-  viewport: CenterCenterRect
-  container: CenterCenterRect
-  target: CenterCenterRect
+  /**
+   * Center Center `Rects`
+   */
+  export interface CenterCenterRects {
+    viewport: CenterCenterRect
+    container: CenterCenterRect
+    target: CenterCenterRect
+  }
 }
 
-export function getScrollingElement (): ScrollingElement
+declare module 'center-center/common' {
+  export type ScrollingElement = CenterCenterTypes.ScrollingElement
+  export type CenterCenterRect = CenterCenterTypes.CenterCenterRect
+  export type CenterCenterRects = CenterCenterTypes.CenterCenterRects
 
-export function createViewportRect (): CenterCenterRect
-export function createDOMElementRect (element: Element): CenterCenterRect
-export function createSVGElementRect (element: SVGElement): CenterCenterRect
-export function createDOMRects (container: Element, target: Element): CenterCenterRect
-export function createSVGRects (container: Element, target: SVGElement): CenterCenterRect
+  export function getScrollingElement (): ScrollingElement
+  export function createViewportRect (): CenterCenterRect
+  export function createDOMElementRect (element: Element): CenterCenterRect
+  export function createSVGElementRect (element: SVGElement): CenterCenterRect
+  export function createDOMRects (container: Element, target: Element): CenterCenterRect
+  export function createSVGRects (container: Element, target: SVGElement): CenterCenterRect
 
-export function getRectLeft (rect: CenterCenterRect): number
-export function getRectTop (rect: CenterCenterRect): number
-export function getRectWidth (rect: CenterCenterRect): number
-export function getRectHeight (rect: CenterCenterRect): number
+  export function getRectLeft (rect: CenterCenterRect): number
+  export function getRectTop (rect: CenterCenterRect): number
+  export function getRectWidth (rect: CenterCenterRect): number
+  export function getRectHeight (rect: CenterCenterRect): number
 
-export function getViewportRect (rects: CenterCenterRects): CenterCenterRect
-export function getContainerRect (rects: CenterCenterRects): CenterCenterRect
-export function getTargetRect (rects: CenterCenterRects): CenterCenterRect
+  export function getViewportRect (rects: CenterCenterRects): CenterCenterRect
+  export function getContainerRect (rects: CenterCenterRects): CenterCenterRect
+  export function getTargetRect (rects: CenterCenterRects): CenterCenterRect
 
-export function calculateRectX (rect: CenterCenterRect): number
-export function calculateRectY (rect: CenterCenterRect): number
+  export function calculateRectX (rect: CenterCenterRect): number
+  export function calculateRectY (rect: CenterCenterRect): number
 
-export function calculateBoundaryX (rects: CenterCenterRects): number
-export function calculateBoundaryY (rects: CenterCenterRects): number
+  export function calculateBoundaryX (rects: CenterCenterRects): number
+  export function calculateBoundaryY (rects: CenterCenterRects): number
 
-export function calculateContainerX (rects: CenterCenterRects): number
-export function calculateContainerY (rects: CenterCenterRects): number
+  export function calculateContainerX (rects: CenterCenterRects): number
+  export function calculateContainerY (rects: CenterCenterRects): number
 
-export function calculateTargetX (rects: CenterCenterRects): number
-export function calculateTargetY (rects: CenterCenterRects): number
+  export function calculateTargetX (rects: CenterCenterRects): number
+  export function calculateTargetY (rects: CenterCenterRects): number
+}

package/src/common/index.mjs

@@ -1,7 +1,7 @@
 /**
- * @typedef {import('./index.mjs').ScrollingElement} ScrollingElement
- * @typedef {import('./index.mjs').CenterCenterRect} CenterCenterRect
- * @typedef {import('./index.mjs').CenterCenterRects} CenterCenterRects
+ * @typedef {import('center-center/common').ScrollingElement} ScrollingElement
+ * @typedef {import('center-center/common').CenterCenterRect} CenterCenterRect
+ * @typedef {import('center-center/common').CenterCenterRects} CenterCenterRects
  */
 
 /**
@@ -104,7 +104,10 @@ export function createSVGElementRect (element) {
 }
 
 /**
- * Creates `Rects` for the viewport as well as the DOM container and DOM target elements
+ * Creates a collection of `Rects` describing
+ *  1. The viewport
+ *  2. The DOM container element
+ *  3. The DOM target element
  *
  * @param {Element} container
  * @param {Element} target
@@ -119,7 +122,10 @@ export function createDOMRects (container, target) {
 }
 
 /**
- * Creates `Rects` for the viewport as well as the DOM container and SVG target elements
+ * Creates a collection of `Rects` describing
+ *  1. The viewport
+ *  2. The DOM container element
+ *  3. The SVG target element
  *
  * @param {Element} container
  * @param {SVGElement} target
@@ -174,7 +180,7 @@ export function getRectHeight ({ height }) {
 }
 
 /**
- * Destructures the viewport `Rect`
+ * Destructures the viewport `Rect` from a collection of `Rects`
  *
  * @param {CenterCenterRects} rects
  * @returns {CenterCenterRect}
@@ -184,7 +190,7 @@ export function getViewportRect ({ viewport }) {
 }
 
 /**
- * Destructures the container `Rect`
+ * Destructures the container `Rect` from a collection of `Rects`
  *
  * @param {CenterCenterRects} rects
  * @returns {CenterCenterRect}
@@ -194,7 +200,7 @@ export function getContainerRect ({ container }) {
 }
 
 /**
- * Destructures the target `Rect`
+ * Destructures the target `Rect` from a collection of `Rects`
  *
  * @param {CenterCenterRects} rects
  * @returns {CenterCenterRect}
@@ -206,7 +212,7 @@ export function getTargetRect ({ target }) {
 /**
  * Calculates the `x` coordinate of a `Rect`
  *
- * @param {CenterCenterRect}
+ * @param {CenterCenterRect} rect
  * @returns {number}
  */
 export function calculateRectX ({ left: l, width: w }) {
@@ -216,7 +222,7 @@ export function calculateRectX ({ left: l, width: w }) {
 /**
  * Calculates the `y` coordinate of a `Rect`
  *
- * @param {CenterCenterRect}
+ * @param {CenterCenterRect} rect
  * @returns {number}
  */
 export function calculateRectY ({ top: t, height: h }) {
@@ -226,7 +232,7 @@ export function calculateRectY ({ top: t, height: h }) {
 /**
  * Calculates the right-most boundary `x` coordinate of the target in the container
  *
- * The range for target `x` is from left-most 0 to right-most boundary, inclusive
+ * The range is inclusive from left-most 0 to right-most boundary `x`
  *
  * @param {CenterCenterRects} rects
  * @returns {number}
@@ -241,7 +247,7 @@ export function calculateBoundaryX (rects) {
 /**
  * Calculates the bottom-most boundary `y` coordinate of the target in the container
  *
- * The range for target `y` is from top-most 0 to bottom-most boundary, inclusive
+ * The range is inclusive from top-most 0 to bottom-most boundary `y`
  *
  * @param {CenterCenterRects} rects
  * @returns {number}

package/src/dom/index.d.mts

@@ -1,7 +1,9 @@
-import {
-  type CenterCenterRects
-} from '#center-center/common'
+declare module 'center-center/dom' {
+  import {
+    type CenterCenterRects
+  } from 'center-center/common'
 
-export function createRects (container: Element, target: Element): CenterCenterRects
-export function calculateLeft (rects: CenterCenterRects): number
-export function calculateTop (rects: CenterCenterRects): number
+  export function createRects (container: Element, target: Element): CenterCenterRects
+  export function calculateLeft (rects: CenterCenterRects): number
+  export function calculateTop (rects: CenterCenterRects): number
+}

package/src/dom/index.mjs

@@ -1,5 +1,5 @@
 /**
- * @typedef {import('../common/index.mjs').CenterCenterRects} CenterCenterRects
+ * @typedef {import('center-center/common').CenterCenterRects} CenterCenterRects
  */
 
 import {

package/src/index.d.mts

@@ -1,11 +1,13 @@
-export type {
-  ScrollingElement,
-  CenterCenterRects,
-  CenterCenterRect
-} from '#center-center/common'
+declare module 'center-center' {
+  export type {
+    ScrollingElement,
+    CenterCenterRects,
+    CenterCenterRect
+  } from 'center-center/common'
 
-export {
-  createRects,
-  calculateLeft,
-  calculateTop
-} from '#center-center'
+  export {
+    createRects,
+    calculateLeft,
+    calculateTop
+  } from '#center-center'
+}

package/src/svg/index.d.mts

@@ -1,7 +1,9 @@
-import {
-  type CenterCenterRects
-} from '#center-center/common'
+declare module 'center-center/svg' {
+  import {
+    type CenterCenterRects
+  } from 'center-center/common'
 
-export function createRects (container: Element, target: SVGElement): CenterCenterRects
-export function calculateX (rects: CenterCenterRects): number
-export function calculateX (rects: CenterCenterRects): number
+  export function createRects (container: Element, target: SVGElement): CenterCenterRects
+  export function calculateX (rects: CenterCenterRects): number
+  export function calculateX (rects: CenterCenterRects): number
+}

package/src/svg/index.mjs

@@ -1,5 +1,5 @@
 /**
- * @typedef {import('../common/index.mjs').CenterCenterRects} CenterCenterRects
+ * @typedef {import('center-center/common').CenterCenterRects} CenterCenterRects
  */
 
 import {

package/src/svg/view-box/index.d.mts

@@ -0,0 +1,26 @@
+declare module 'center-center/svg/view-box' {
+  export const X: number
+  export const Y: number
+  export const W: number
+  export const H: number
+
+  function toRound (s: string): number
+
+  export function getXFor (svg: Element): number
+
+  export function getYFor (svg: Element): number
+
+  export function getWFor (svg: Element): number
+
+  export function getHFor (svg: Element): number
+
+  export function getX (viewBox: number[]): number
+
+  export function getY (viewBox: number[]): number
+
+  export function getW (viewBox: number[]): number
+
+  export function getH (viewBox: number[]): number
+
+  export default function getViewBox (svg: Element): number[]
+}

package/src/svg/view-box/index.mjs

@@ -1,12 +1,12 @@
 /**
  *  An `<svg />` is of type `Element`
  *
- *  Its children are of `SVGElement`
+ *  Its children are of type `SVGElement`
  */
 
 import debug from 'debug'
 
-const log = debug('center-center:view-box')
+const log = debug('center-center:svg:view-box')
 
 export const X = 0
 export const Y = 1
@@ -31,9 +31,9 @@ function toRound (s) {
  * @param {Element} svg
  * @returns {number}
  */
-export function getViewBoxXFor (svg) {
+export function getXFor (svg) {
   return (
-    getViewBoxX(getViewBox(svg))
+    getX(getViewBox(svg))
   )
 }
 
@@ -43,9 +43,9 @@ export function getViewBoxXFor (svg) {
  * @param {Element} svg
  * @returns {number}
  */
-export function getViewBoxYFor (svg) {
+export function getYFor (svg) {
   return (
-    getViewBoxY(getViewBox(svg))
+    getY(getViewBox(svg))
   )
 }
 
@@ -55,9 +55,9 @@ export function getViewBoxYFor (svg) {
  * @param {Element} svg
  * @returns {number}
  */
-export function getViewBoxWFor (svg) {
+export function getWFor (svg) {
   return (
-    getViewBoxW(getViewBox(svg))
+    getW(getViewBox(svg))
   )
 }
 
@@ -67,9 +67,9 @@ export function getViewBoxWFor (svg) {
  * @param {Element} svg
  * @returns {number}
  */
-export function getViewBoxHFor (svg) {
+export function getHFor (svg) {
   return (
-    getViewBoxH(getViewBox(svg))
+    getH(getViewBox(svg))
   )
 }
 
@@ -79,9 +79,7 @@ export function getViewBoxHFor (svg) {
  * @param {number[]}
  * @returns {number}
  */
-export function getViewBoxX ({
-  [X]: x = 0
-}) {
+export function getX ({ [X]: x = 0 }) {
   return x
 }
 
@@ -91,7 +89,7 @@ export function getViewBoxX ({
  * @param {number[]}
  * @returns {number}
  */
-export function getViewBoxY ({ [Y]: y = 0 }) {
+export function getY ({ [Y]: y = 0 }) {
   return y
 }
 
@@ -101,7 +99,7 @@ export function getViewBoxY ({ [Y]: y = 0 }) {
  * @param {number[]}
  * @returns {number}
  */
-export function getViewBoxW ({ [W]: w = 0 }) {
+export function getW ({ [W]: w = 0 }) {
   return w
 }
 
@@ -111,7 +109,7 @@ export function getViewBoxW ({ [W]: w = 0 }) {
  * @param {number[]}
  * @returns {number}
  */
-export function getViewBoxH ({ [H]: h = 0 }) {
+export function getH ({ [H]: h = 0 }) {
   return h
 }