diff --git a/CHANGELOG.md b/CHANGELOG.md index 818e12f8..b42b0326 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,18 @@ # Changelog +## [9.0.4](https://github.com/phun-ky/speccer/compare/v9.0.3...v9.0.4) (2024-02-16) + + +### Tasks + +* 🤖 Adjust dev script ([9316d0a](https://github.com/phun-ky/speccer/commit/9316d0a41da30a764f94a59ffe0330b118700bf8)) + + +### Bug + +* 🐛 Add test for typography position util ([39f3ae4](https://github.com/phun-ky/speccer/commit/39f3ae4a1f3a632fd909b054419ec12329f963b2)) +* 🐛 Revert `for..of` to `.forEach` to solve racing condition ([55c2cde](https://github.com/phun-ky/speccer/commit/55c2cde9fe6cae4106250c75d5fc350b04c1efba)), closes [#106](https://github.com/phun-ky/speccer/issues/106) + ## [9.0.3](https://github.com/phun-ky/speccer/compare/v9.0.2...v9.0.3) (2024-02-13) ## [9.0.2](https://github.com/phun-ky/speccer/compare/v9.0.1...v9.0.2) (2024-02-13) diff --git a/api/README.md b/api/README.md index 863cf71e..87e59013 100644 --- a/api/README.md +++ b/api/README.md @@ -12,6 +12,7 @@ - [features/spacing](modules/features_spacing.md) - [features/spacing/utils/position](modules/features_spacing_utils_position.md) - [features/typography](modules/features_typography.md) +- [features/typography/utils/\_\_tests\_\_/position](modules/features_typography_utils___tests___position.md) - [features/typography/utils/position](modules/features_typography_utils_position.md) - [features/typography/utils/template](modules/features_typography_utils_template.md) - [main](modules/main.md) @@ -25,6 +26,7 @@ - [types/interfaces/position](modules/types_interfaces_position.md) - [types/position](modules/types_position.md) - [types/speccer](modules/types_speccer.md) +- [types/xy](modules/types_xy.md) - [utils/\_\_tests\_\_/angle](modules/utils___tests___angle.md) - [utils/\_\_tests\_\_/area](modules/utils___tests___area.md) - [utils/\_\_tests\_\_/attributes](modules/utils___tests___attributes.md) @@ -43,6 +45,7 @@ - [utils/\_\_tests\_\_/position](modules/utils___tests___position.md) - [utils/\_\_tests\_\_/styles](modules/utils___tests___styles.md) - [utils/\_\_tests\_\_/wait](modules/utils___tests___wait.md) +- [utils/\_\_tests\_\_/xy](modules/utils___tests___xy.md) - [utils/angle](modules/utils_angle.md) - [utils/area](modules/utils_area.md) - [utils/attributes](modules/utils_attributes.md) diff --git a/api/modules/features_dissect_utils_styles.md b/api/modules/features_dissect_utils_styles.md index d1b92793..1bea4f08 100644 --- a/api/modules/features_dissect_utils_styles.md +++ b/api/modules/features_dissect_utils_styles.md @@ -38,4 +38,4 @@ console.log(styles); #### Defined in -[features/dissect/utils/styles.ts:31](https://github.com/phun-ky/speccer/blob/main/src/features/dissect/utils/styles.ts#L31) +[features/dissect/utils/styles.ts:32](https://github.com/phun-ky/speccer/blob/main/src/features/dissect/utils/styles.ts#L32) diff --git a/api/modules/utils_xy.md b/api/modules/utils_xy.md index 4e213178..ab984f0f 100644 --- a/api/modules/utils_xy.md +++ b/api/modules/utils_xy.md @@ -14,24 +14,24 @@ Object containing functions to retrieve specific x and y coordinates from a DOMR | Name | Type | Description | | :------ | :------ | :------ | -| `bottom` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the bottom center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const bottomCenterCoordinates = xy.bottom(rect); // bottomCenterCoordinates.x and bottomCenterCoordinates.y will contain the coordinates ``` | -| `bottom-center` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the bottom center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const bottomCenterCoordinates = xy['bottom-center'](rect); // bottomCenterCoordinates.x and bottomCenterCoordinates.y will contain the coordinates ``` | -| `bottom-left` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the bottom left of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const bottomLeftCoordinates = xy['bottom-left'](rect); // bottomLeftCoordinates.x and bottomLeftCoordinates.y will contain the coordinates ``` | -| `bottom-right` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the bottom right of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const bottomRight = xy['bottom-right'](rect); // bottomRight.x and bottomRight.y will contain the coordinates ``` | -| `center` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const centerCoordinates = xy.center(rect); // centerCoordinates.x and centerCoordinates.y will contain the coordinates ``` | -| `left` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the left of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const leftCoordinates = xy.left(rect); // leftCoordinates.x and leftCoordinates.y will contain the coordinates ``` | -| `left-bottom` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the left bottom of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const leftBottomCoordinates = xy['left-bottom'](rect); // leftBottomCoordinates.x and leftBottomCoordinates.y will contain the coordinates ``` | -| `left-center` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the left center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const leftCenterCoordinates = xy['left-center'](rect); // leftCenterCoordinates.x and leftCenterCoordinates.y will contain the coordinates ``` | -| `left-top` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the left top of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const leftTop = xy['left-top'](rect); // leftTop.x and leftTop.y will contain the coordinates ``` | -| `right` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the right center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const rightCenterCoordinates = xy.right(rect); // rightCenterCoordinates.x and rightCenterCoordinates.y will contain the coordinates ``` | -| `right-bottom` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the right bottom of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const rightBottomCoordinates = xy['right-bottom'](rect); // rightBottomCoordinates.x and rightBottomCoordinates.y will contain the coordinates ``` | -| `right-center` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the right center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const rightCenterCoordinates = xy['right-center'](rect); // rightCenterCoordinates.x and rightCenterCoordinates.y will contain the coordinates ``` | +| `bottom` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the bottom center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const bottomCenterCoordinates = xy.bottom(rect); // bottomCenterCoordinates.x and bottomCenterCoordinates.y will contain the coordinates ``` | +| `bottom-center` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the bottom center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const bottomCenterCoordinates = xy['bottom-center'](rect); // bottomCenterCoordinates.x and bottomCenterCoordinates.y will contain the coordinates ``` | +| `bottom-left` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the bottom left of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const bottomLeftCoordinates = xy['bottom-left'](rect); // bottomLeftCoordinates.x and bottomLeftCoordinates.y will contain the coordinates ``` | +| `bottom-right` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the bottom right of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const bottomRight = xy['bottom-right'](rect); // bottomRight.x and bottomRight.y will contain the coordinates ``` | +| `center` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const centerCoordinates = xy.center(rect); // centerCoordinates.x and centerCoordinates.y will contain the coordinates ``` | +| `left` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the left of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const leftCoordinates = xy.left(rect); // leftCoordinates.x and leftCoordinates.y will contain the coordinates ``` | +| `left-bottom` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the left bottom of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const leftBottomCoordinates = xy['left-bottom'](rect); // leftBottomCoordinates.x and leftBottomCoordinates.y will contain the coordinates ``` | +| `left-center` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the left center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const leftCenterCoordinates = xy['left-center'](rect); // leftCenterCoordinates.x and leftCenterCoordinates.y will contain the coordinates ``` | +| `left-top` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the left top of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const leftTop = xy['left-top'](rect); // leftTop.x and leftTop.y will contain the coordinates ``` | +| `right` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the right center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const rightCenterCoordinates = xy.right(rect); // rightCenterCoordinates.x and rightCenterCoordinates.y will contain the coordinates ``` | +| `right-bottom` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the right bottom of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const rightBottomCoordinates = xy['right-bottom'](rect); // rightBottomCoordinates.x and rightBottomCoordinates.y will contain the coordinates ``` | +| `right-center` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the right center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const rightCenterCoordinates = xy['right-center'](rect); // rightCenterCoordinates.x and rightCenterCoordinates.y will contain the coordinates ``` | | `right-top` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | - | -| `top` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the top center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const topCenterCoordinates = xy.top(rect); // topCenterCoordinates.x and topCenterCoordinates.y will contain the coordinates ``` | -| `top-center` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the top center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const topCenterCoordinates = xy['top-center'](rect); // topCenterCoordinates.x and topCenterCoordinates.y will contain the coordinates ``` | -| `top-left` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the top left of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const topLeftCoordinates = xy['top-left'](rect); // topLeftCoordinates.x and topLeftCoordinates.y will contain the coordinates ``` | -| `top-right` | (`rect`: `DOMRect`) => \{ `x`: `number` ; `y`: `number` } | Get the x and y coordinates of the top right of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const topRightCoordinates = xy['top-right'](rect); // topRightCoordinates.x and topRightCoordinates.y will contain the coordinates ``` | +| `top` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the top center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const topCenterCoordinates = xy.top(rect); // topCenterCoordinates.x and topCenterCoordinates.y will contain the coordinates ``` | +| `top-center` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the top center of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const topCenterCoordinates = xy['top-center'](rect); // topCenterCoordinates.x and topCenterCoordinates.y will contain the coordinates ``` | +| `top-left` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the top left of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const topLeftCoordinates = xy['top-left'](rect); // topLeftCoordinates.x and topLeftCoordinates.y will contain the coordinates ``` | +| `top-right` | (`rect`: `DOMRect`) => [`SpeccerCoordinatesInterface`](../interfaces/types_xy.SpeccerCoordinatesInterface.md) | Get the x and y coordinates of the top right of a DOMRect. **`Example`** ```ts const rect = element.getBoundingClientRect(); const topRightCoordinates = xy['top-right'](rect); // topRightCoordinates.x and topRightCoordinates.y will contain the coordinates ``` | #### Defined in -[utils/xy.ts:6](https://github.com/phun-ky/speccer/blob/main/src/utils/xy.ts#L6) +[utils/xy.ts:8](https://github.com/phun-ky/speccer/blob/main/src/utils/xy.ts#L8) diff --git a/package-lock.json b/package-lock.json index 0aaf274d..b2cf5c3f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@phun-ky/speccer", - "version": "9.0.3", + "version": "9.0.4", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@phun-ky/speccer", - "version": "9.0.3", + "version": "9.0.4", "license": "MIT", "devDependencies": { "@release-it/conventional-changelog": "^7.0.1", diff --git a/package.json b/package.json index 2d88ce77..d013cc8d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@phun-ky/speccer", - "version": "9.0.3", + "version": "9.0.4", "description": "A script to annotate, show spacing specs and to display typography information in documentation/website on HTML elements", "main": "dist/speccer.js", "module": "dist/speccer.esm.js",