@phun-ky/speccer 6.3.2 → 6.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +62 -45
- package/package.json +14 -52
- package/speccer.css +9 -0
- package/speccer.js +1 -1
- package/speccer.js.map +1 -1
- package/speccer.min.css +1 -1
package/README.md
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
# @phun-ky/speccer
|
|
2
2
|
|
|
3
|
-
|
|
4
4
|
|
|
5
|
-
[](http://commitizen.github.io/cz-cli/) [](http://makeapullrequest.com) [](http://semver.org/spec/v2.0.0.html)    
|
|
5
|
+
[](http://commitizen.github.io/cz-cli/) [](http://makeapullrequest.com) [](http://semver.org/spec/v2.0.0.html)      
|
|
6
6
|
|
|
7
7
|
> A zero dependency package to show specifications on components in your design system documentation
|
|
8
8
|
|
|
@@ -12,6 +12,9 @@
|
|
|
12
12
|
- [ESM](#esm)
|
|
13
13
|
- [Script](#script)
|
|
14
14
|
- [React](#react)
|
|
15
|
+
- [Advanced usage](#advanced-usage)
|
|
16
|
+
- [Lazy](#lazy)
|
|
17
|
+
- [Features](#features)
|
|
15
18
|
- [Element spacing](#element-spacing)
|
|
16
19
|
- [Element dimensions](#element-dimensions)
|
|
17
20
|
- [Subtle measure](#subtle-measure)
|
|
@@ -19,8 +22,7 @@
|
|
|
19
22
|
- [Subtle anatomy](#subtle-anatomy)
|
|
20
23
|
- [Curly brackets](#curly-brackets)
|
|
21
24
|
- [Element typogpraphy](#element-typogpraphy)
|
|
22
|
-
|
|
23
|
-
- [Lazy](#lazy)
|
|
25
|
+
- [Mark elements](#mark-elements)
|
|
24
26
|
- [Customization](#customization)
|
|
25
27
|
|
|
26
28
|
## About
|
|
@@ -93,9 +95,50 @@ const Component = () => {
|
|
|
93
95
|
export default Component;
|
|
94
96
|
```
|
|
95
97
|
|
|
98
|
+
## Advanced usage
|
|
99
|
+
|
|
100
|
+
If you want to control speccer a bit more, you have some options. Apply one of these attributes to the script element for different types of initialization:
|
|
101
|
+
|
|
102
|
+
```html
|
|
103
|
+
<script src="../speccer.js" data-<manual|instant|dom|lazy></script>
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
| Tag | Description |
|
|
107
|
+
| -------------- | ------------------------------------------------------------------- |
|
|
108
|
+
| `data-manual` | Makes `window.speccer()` available to be used when you feel like it |
|
|
109
|
+
| `data-instant` | fires off `speccer()` right away |
|
|
110
|
+
| `data-dom` | Waits for `DOMContentLoaded` |
|
|
111
|
+
| `data-lazy` | Lazy loads `speccer()` per specced element |
|
|
112
|
+
|
|
113
|
+
If no attribute is applied, it will default to `data-dom`, as in, it will initialize when `DOMContentLoaded` is fired.
|
|
114
|
+
|
|
115
|
+
### Lazy
|
|
116
|
+
|
|
117
|
+
If you're importing speccer instead of with a script tag, you can use the following approach to apply lazy loading:
|
|
118
|
+
|
|
119
|
+
```javascript
|
|
120
|
+
import { dissect } from '@phun-ky/speccer';
|
|
121
|
+
|
|
122
|
+
let dissectElementObserver = new IntersectionObserver((entries, observer) => {
|
|
123
|
+
entries.forEach((entry) => {
|
|
124
|
+
const targets = entry.target.querySelectorAll('[data-anatomy]');
|
|
125
|
+
if (entry.intersectionRatio > 0) {
|
|
126
|
+
targets.forEach(dissect.element);
|
|
127
|
+
observer.unobserve(entry.target);
|
|
128
|
+
}
|
|
129
|
+
});
|
|
130
|
+
});
|
|
131
|
+
|
|
132
|
+
document.querySelectorAll('[data-anatomy-section]').forEach((el) => {
|
|
133
|
+
dissectElementObserver.observe(el);
|
|
134
|
+
});
|
|
135
|
+
```
|
|
136
|
+
|
|
137
|
+
## Features
|
|
138
|
+
|
|
96
139
|
### Element spacing
|
|
97
140
|
|
|
98
|
-
|
|
99
142
|
|
|
100
143
|
In your component examples, use the following attribute:
|
|
101
144
|
|
|
@@ -107,7 +150,7 @@ This will display the element _and all of it's children_ padding and margin.
|
|
|
107
150
|
|
|
108
151
|
### Element dimensions
|
|
109
152
|
|
|
110
|
-
|
|
111
154
|
|
|
112
155
|
In your component examples, use the following attribute:
|
|
113
156
|
|
|
@@ -122,7 +165,7 @@ Where `height` and `width` comes with placement flags. Default for `height` is `
|
|
|
122
165
|
|
|
123
166
|
#### Subtle measure
|
|
124
167
|
|
|
125
|
-
|
|
126
169
|
|
|
127
170
|
You can also give a more subtle touch to the measure elements.
|
|
128
171
|
|
|
@@ -134,7 +177,7 @@ This will give a dashed border.
|
|
|
134
177
|
|
|
135
178
|
### Highlight the anatomy of an element
|
|
136
179
|
|
|
137
|
-
|
|
138
181
|
|
|
139
182
|
In your component examples, use the following attribute. Remember to use the `data-anatomy-section` as an attribute on a parent element to scope the marking.
|
|
140
183
|
|
|
@@ -151,7 +194,7 @@ This will place a pin to the outline of the element. Default is `top`.
|
|
|
151
194
|
|
|
152
195
|
#### Subtle anatomy
|
|
153
196
|
|
|
154
|
-
|
|
155
198
|
|
|
156
199
|
You can also give a more subtle touch to the anatomy elements.
|
|
157
200
|
|
|
@@ -165,7 +208,8 @@ You can also give a more subtle touch to the anatomy elements.
|
|
|
165
208
|
|
|
166
209
|
You can use curly brackets with the `curly` tag in `data-anatomy` along side `outline full` to provide a more sleek look to the style.
|
|
167
210
|
|
|
168
|
-
|
|
211
|
+
> [!NOTE]
|
|
212
|
+
> Only works with `outline full`
|
|
169
213
|
|
|
170
214
|
The curly brackets are made with SVG paths, and it is required to have the following snippet on your page for it to render:
|
|
171
215
|
|
|
@@ -190,7 +234,7 @@ This will give a dashed border, and a more subtle pin style.
|
|
|
190
234
|
|
|
191
235
|
### Element typogpraphy
|
|
192
236
|
|
|
193
|
-
|
|
194
238
|
|
|
195
239
|
In your component examples, use the following attribute.
|
|
196
240
|
|
|
@@ -202,48 +246,21 @@ In your component examples, use the following attribute.
|
|
|
202
246
|
|
|
203
247
|
This will place a box to display typography information. Default is `left`.
|
|
204
248
|
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
If you want to control speccer a bit more, you have some options. Apply one of these attributes to the script element for different types of initialization:
|
|
208
|
-
|
|
209
|
-
```html
|
|
210
|
-
<script src="../speccer.js" data-<manual|instant|dom|lazy></script>
|
|
211
|
-
```
|
|
212
|
-
|
|
213
|
-
| Tag | Description |
|
|
214
|
-
| -------------- | ------------------------------------------------------------------- |
|
|
215
|
-
| `data-manual` | Makes `window.speccer()` available to be used when you feel like it |
|
|
216
|
-
| `data-instant` | fires off `speccer()` right away |
|
|
217
|
-
| `data-dom` | Waits for `DOMContentLoaded` |
|
|
218
|
-
| `data-lazy` | Lazy loads `speccer()` per specced element |
|
|
249
|
+
### Mark elements
|
|
219
250
|
|
|
220
|
-
|
|
251
|
+
|
|
221
252
|
|
|
222
|
-
|
|
253
|
+
This will mark the given elements.
|
|
223
254
|
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
```javascript
|
|
227
|
-
import { dissect } from '@phun-ky/speccer';
|
|
228
|
-
|
|
229
|
-
let dissectElementObserver = new IntersectionObserver((entries, observer) => {
|
|
230
|
-
entries.forEach((entry) => {
|
|
231
|
-
const targets = entry.target.querySelectorAll('[data-anatomy]');
|
|
232
|
-
if (entry.intersectionRatio > 0) {
|
|
233
|
-
targets.forEach(dissect.element);
|
|
234
|
-
observer.unobserve(entry.target);
|
|
235
|
-
}
|
|
236
|
-
});
|
|
237
|
-
});
|
|
255
|
+
In your component examples, use the following attribute.
|
|
238
256
|
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
});
|
|
257
|
+
```html
|
|
258
|
+
<div data-speccer-mark …>…</div>
|
|
242
259
|
```
|
|
243
260
|
|
|
244
261
|
## Customization
|
|
245
262
|
|
|
246
|
-
|
|
247
264
|
|
|
248
265
|
Allthough the styling works nicely with dark mode, you can use the provided CSS variables to customize the look and feel. If more control is needed, you can use CSS overrides :)
|
|
249
266
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@phun-ky/speccer",
|
|
3
|
-
"version": "6.
|
|
3
|
+
"version": "6.4.0",
|
|
4
4
|
"description": "A script to annotate, show spacing specs and to display typography information in documentation/website on HTML elements",
|
|
5
5
|
"main": "speccer.js",
|
|
6
6
|
"publishConfig": {
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
"postcss": "rm -rf ./speccer.min.css && postcss ./speccer.css -o speccer.min.css",
|
|
19
19
|
"dev": "npx browser-sync start --server --files \"dev/*.html\" \"*.css\" --index \"dev/index.html\" --serveStatic \"/dev/*.html\"",
|
|
20
20
|
"commit": "npx git-cz",
|
|
21
|
-
"release": "
|
|
21
|
+
"release": "release-it"
|
|
22
22
|
},
|
|
23
23
|
"files": [
|
|
24
24
|
"/speccer.js",
|
|
@@ -26,54 +26,6 @@
|
|
|
26
26
|
"/speccer.min.css",
|
|
27
27
|
"/speccer.css"
|
|
28
28
|
],
|
|
29
|
-
"standard-version": {
|
|
30
|
-
"scripts": {
|
|
31
|
-
"prerelease": "npm run build && git add .",
|
|
32
|
-
"posttag": "git push --follow-tags origin main"
|
|
33
|
-
},
|
|
34
|
-
"types": [
|
|
35
|
-
{
|
|
36
|
-
"type": "chore",
|
|
37
|
-
"section": "Tasks",
|
|
38
|
-
"hidden": true
|
|
39
|
-
},
|
|
40
|
-
{
|
|
41
|
-
"type": "docs",
|
|
42
|
-
"section": "Documentation"
|
|
43
|
-
},
|
|
44
|
-
{
|
|
45
|
-
"type": "feat",
|
|
46
|
-
"section": "Feature"
|
|
47
|
-
},
|
|
48
|
-
{
|
|
49
|
-
"type": "fix",
|
|
50
|
-
"section": "Bug"
|
|
51
|
-
},
|
|
52
|
-
{
|
|
53
|
-
"type": "perf",
|
|
54
|
-
"section": "Performance change"
|
|
55
|
-
},
|
|
56
|
-
{
|
|
57
|
-
"type": "refactor",
|
|
58
|
-
"section": "Refactoring"
|
|
59
|
-
},
|
|
60
|
-
{
|
|
61
|
-
"type": "release",
|
|
62
|
-
"section": "Create a release commit",
|
|
63
|
-
"hidden": true
|
|
64
|
-
},
|
|
65
|
-
{
|
|
66
|
-
"type": "style",
|
|
67
|
-
"section": "Markup, white-space, formatting, missing semi-colons...",
|
|
68
|
-
"hidden": true
|
|
69
|
-
},
|
|
70
|
-
{
|
|
71
|
-
"type": "test",
|
|
72
|
-
"section": "Adding missing tests",
|
|
73
|
-
"hidden": true
|
|
74
|
-
}
|
|
75
|
-
]
|
|
76
|
-
},
|
|
77
29
|
"repository": {
|
|
78
30
|
"type": "git",
|
|
79
31
|
"url": "git+https://github.com/phun-ky/speccer.git"
|
|
@@ -81,6 +33,8 @@
|
|
|
81
33
|
"keywords": [
|
|
82
34
|
"html",
|
|
83
35
|
"css",
|
|
36
|
+
"design",
|
|
37
|
+
"design system",
|
|
84
38
|
"javascript",
|
|
85
39
|
"spec",
|
|
86
40
|
"inspect",
|
|
@@ -107,6 +61,7 @@
|
|
|
107
61
|
},
|
|
108
62
|
"homepage": "https://github.com/phun-ky/speccer#readme",
|
|
109
63
|
"devDependencies": {
|
|
64
|
+
"@release-it/conventional-changelog": "^7.0.1",
|
|
110
65
|
"@rollup/plugin-commonjs": "^17.1.0",
|
|
111
66
|
"@rollup/plugin-node-resolve": "^11.2.0",
|
|
112
67
|
"@testing-library/dom": "^7.29.4",
|
|
@@ -124,18 +79,25 @@
|
|
|
124
79
|
"eslint-plugin-prettier": "^4.0.0",
|
|
125
80
|
"eslint-plugin-react": "^7.23.2",
|
|
126
81
|
"eslint-plugin-react-hooks": "^4.2.0",
|
|
82
|
+
"git-cz": "^4.9.0",
|
|
127
83
|
"jest": "^26.6.3",
|
|
128
84
|
"network-information-types": "^0.1.1",
|
|
129
85
|
"postcss": "^8.3.0",
|
|
130
86
|
"postcss-cli": "^8.3.1",
|
|
131
87
|
"prettier": "^2.4.1",
|
|
132
88
|
"prettier-eslint": "^13.0.0",
|
|
89
|
+
"release-it": "^16.1.5",
|
|
133
90
|
"rollup": "^2.39.0",
|
|
134
91
|
"rollup-plugin-dts": "^4.0.1",
|
|
135
92
|
"rollup-plugin-terser": "^7.0.2",
|
|
136
|
-
"rollup-plugin-typescript2": "^0.
|
|
137
|
-
"stylus": "^0.
|
|
93
|
+
"rollup-plugin-typescript2": "^0.35.0",
|
|
94
|
+
"stylus": "^0.60.0",
|
|
138
95
|
"tslib": "^2.3.1",
|
|
139
96
|
"typescript": "^4.5.4"
|
|
97
|
+
},
|
|
98
|
+
"config": {
|
|
99
|
+
"commitizen": {
|
|
100
|
+
"path": "./node_modules/git-cz"
|
|
101
|
+
}
|
|
140
102
|
}
|
|
141
103
|
}
|
package/speccer.css
CHANGED
|
@@ -6,6 +6,8 @@
|
|
|
6
6
|
--ph-speccer-color-text-light: #fff;
|
|
7
7
|
--ph-speccer-color-text-dark: #333;
|
|
8
8
|
--ph-speccer-color-contrast: #ff3aa8;
|
|
9
|
+
--ph-speccer-mark-background-color: rgba(255,58,168,0.2);
|
|
10
|
+
--ph-speccer-mark-border-color: #ff3aa8;
|
|
9
11
|
--ph-speccer-spacing-color: var(--ph-speccer-color-contrast);
|
|
10
12
|
--ph-speccer-measure-color: #f00;
|
|
11
13
|
--ph-speccer-pin-color: var(--ph-speccer-color-contrast);
|
|
@@ -725,3 +727,10 @@ svg.ph .ph.path {
|
|
|
725
727
|
.ph.speccer.measure.subtle.height.left {
|
|
726
728
|
border-right: none;
|
|
727
729
|
}
|
|
730
|
+
.ph.speccer.mark {
|
|
731
|
+
background-color: var(--ph-speccer-mark-background-color);
|
|
732
|
+
border-color: var(--ph-speccer-mark-border-color);
|
|
733
|
+
border-width: 1px;
|
|
734
|
+
border-style: solid;
|
|
735
|
+
position: absolute;
|
|
736
|
+
}
|
package/speccer.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).speccer={})}(this,(function(t){"use strict";const e=(t,e,o="noop")=>{t&&(!e||e&&0===e.length||e.trim().split(" ").filter((t=>t!==o)).forEach((e=>t.classList.add(e))))},o=(t,e)=>t?e||"string"==typeof t?`${t} ${e?Object.keys(e).filter((t=>e[t])).join(" "):""}`.trim():`${Object.keys(t).filter((e=>t[e])).join(" ")}`.trim():"",i=[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ"],n=t=>parseInt(t,10),r=t=>n(getComputedStyle(t).getPropertyValue("--ph-speccer-pin-space"))||48,s=()=>new Promise(requestAnimationFrame),a=async(t,e)=>{!t||!e||"string"==typeof e||"number"==typeof e||"boolean"==typeof e||Array.isArray(e)&&0===e.length||0===Object.keys(e).length&&e.constructor===Object||(await s(),Array.isArray(e)?e.forEach((e=>t.style[e.key]=e.value)):Object.keys(e).forEach((o=>t.style[o]=e[o])))},p=async t=>(await s(),getComputedStyle(t,null)),c=(t,e,o)=>t-e.width/2+o.width/2,l=(t,e,o)=>t-e.height/2+o.height/2,h=async t=>{await s();const e=t.getBoundingClientRect(),o=e.top+window.pageYOffset,i=e.left+window.pageXOffset;return{height:e.height,width:e.width,top:o,left:i}},d=async(t,e)=>{await s();const o=t.getBoundingClientRect(),i=await h(e),n=await(async(t,e)=>{await s();const o=t.getBoundingClientRect(),i=e.getBoundingClientRect(),n=i.top+window.pageYOffset,r=i.left+window.pageXOffset;return{height:i.height,width:i.width,top:l(n,o,i),left:c(r,o,i)}})(t,e),r=i.height,a=i.width,p=o.height,d=o.width;return{absolute:()=>({top:i.top,left:i.left,height:r,width:a}),toTop:({center:t=!1,sourceHeight:e=p,modifier:o=0}={})=>({top:i.top+e+o,left:t?n.left:i.left,height:r,width:a}),fromTop:({center:t=!1,sourceHeight:e=p,modifier:o=0}={})=>({top:i.top-e-o,left:t?n.left:i.left,height:r,width:a}),toBottom:({center:t=!1,sourceHeight:e=p,targetHeight:o=r,modifier:s=0}={})=>({top:i.top+o-(e+s),left:t?n.left:i.left,height:r,width:a}),fromBottom:({center:t=!1,targetHeight:e=r,modifier:o=0}={})=>({top:i.top+e+o,left:t?n.left:i.left,height:r,width:a}),toLeft:({center:t=!1,sourceWidth:e=d,modifier:o=0}={})=>({top:t?n.top:i.top,left:i.left+e+o,height:r,width:a}),fromLeft:({center:t=!1,sourceWidth:e=d,modifier:o=0}={})=>({top:t?n.top:i.top,left:i.left-e-o,height:r,width:a}),toRight:({center:t=!1,sourceWidth:e=d,targetWidth:o=a,modifier:s=0}={})=>({top:t?n.top:i.top,left:i.left+o-(e+s),height:r,width:a}),fromRight:({center:t=!1,targetWidth:e=a,modifier:o=0}={})=>({top:t?n.top:i.top,left:i.left+e+o,height:r,width:a})}},f=(t="",o="span")=>{const i=document.createElement(o),n=document.createTextNode(t+"");return i.appendChild(n),i.setAttribute("title",t+"px"),e(i,"ph speccer spacing"),i},u=async t=>{if(!t)return;const o=await p(t);if("none"===o.display||"0"===o.opacity||"hidden"===o.visibility)return;const i=(t=>{const{marginTop:e,marginBottom:o,marginLeft:i,marginRight:n,paddingTop:r,paddingBottom:s,paddingLeft:a,paddingRight:p}=t;return{marginTop:e,marginBottom:o,marginLeft:i,marginRight:n,paddingTop:r,paddingBottom:s,paddingLeft:a,paddingRight:p}})(o),r=Object.keys(i).filter((t=>"0px"!==i[t]));0!==r.length&&r.forEach((async o=>{const r=n(i[o]),p=f(r),c=(t=>-1!==t.indexOf("Top")?t.replace("Top"," top"):-1!==t.indexOf("Right")?t.replace("Right"," right"):-1!==t.indexOf("Bottom")?t.replace("Bottom"," bottom"):-1!==t.indexOf("Left")?t.replace("Left"," left"):"")(o);e(p,c),document.body.appendChild(p),t.classList.add("is-specced"),await(async(t,e,o,i)=>{await s();const n=i.getBoundingClientRect(),r=await h(i);"marginTop"===t&&a(o,{height:`${e}px`,width:n.width+"px",left:r.left+"px",top:r.top-e+"px"}),"marginRight"===t&&a(o,{height:n.height+"px",width:`${e}px`,left:r.left+parseInt(n.width+"",10)+"px",top:r.top+"px"}),"marginBottom"===t&&a(o,{height:`${e}px`,width:n.width+"px",left:r.left+"px",top:r.top+parseInt(n.height+"",10)+"px"}),"marginLeft"===t&&a(o,{height:n.height+"px",width:`${e}px`,left:r.left-e+"px",top:r.top+"px"}),"paddingTop"===t&&a(o,{height:`${e}px`,width:n.width+"px",left:r.left+"px",top:r.top+"px"}),"paddingBottom"===t&&a(o,{height:`${e}px`,width:n.width+"px",left:r.left+"px",top:r.top+(parseInt(n.height+"",10)-e)+"px"}),"paddingRight"===t&&a(o,{height:n.height+"px",width:`${e}px`,left:r.left+(parseInt(n.width+"",10)-e)+"px",top:r.top+"px"}),"paddingLeft"===t&&a(o,{height:n.height+"px",width:`${e}px`,left:r.left+"px",top:r.top+"px"})})(o,r,p,t)}))};var m=Object.freeze({__proto__:null,create:f,element:u});function g(t,e,o,i){if("a"===o&&!i)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e||!i:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===o?i:"a"===o?i.call(t):i?i.value:e.get(t)}function y(t,e,o,i,n){if("m"===i)throw new TypeError("Private method is not writable");if("a"===i&&!n)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?t!==e||!n:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===i?n.call(t,o):n?n.value=o:e.set(t,o),o}const w=()=>"_"+Math.random().toString(36).substring(2,11),x=t=>t.top,b=t=>t.left+t.width,E=t=>t.top+t.height,$=t=>t.left,v=t=>t.left+t.width/2,A=t=>t.top+t.height/2,S={center:t=>({x:v(t),y:A(t)}),top:t=>({x:v(t),y:x(t)}),right:t=>({x:b(t),y:A(t)}),bottom:t=>({x:v(t),y:E(t)}),left:t=>({x:$(t),y:A(t)}),"right-top":t=>({x:b(t),y:x(t)}),"right-bottom":t=>({x:b(t),y:E(t)}),"left-top":t=>({x:$(t),y:x(t)}),"left-bottom":t=>({x:$(t),y:E(t)}),"top-left":t=>({x:$(t),y:x(t)}),"top-right":t=>({x:b(t),y:x(t)}),"bottom-left":t=>({x:$(t),y:E(t)}),"bottom-right":t=>({x:b(t),y:E(t)}),"top-center":t=>({x:v(t),y:x(t)}),"right-center":t=>({x:b(t),y:A(t)}),"bottom-center":t=>({x:v(t),y:E(t)}),"left-center":t=>({x:$(t),y:A(t)})},O=async(t,e,o="center",i="center")=>{if(!t||!e)throw"No element given";const{x:n,y:r}=await C(t,o),{x:s,y:a}=await C(e,i);return{x1:n,y1:r,x2:s,y2:a}},C=async(t,e="center")=>{if(!e)throw"No position given";if("string"!=typeof e)throw"The position given is not the required type: pos: "+typeof e;const o=["center","left","right","top","bottom","right-top","right-bottom","left-top","left-bottom","top-left","top-right","bottom-left","bottom-right","top-center","right-center","bottom-center","left-center"];if(!o.includes(e))throw`The position given does not match allowed positions to use! Valid positions are: ${o.join(", ")}`;await s();const i=t.getBoundingClientRect();return S[e](i)},B=async({start:t,stop:e,crude:o=!1})=>{const{x1:i,y1:n,x2:r,y2:s}=await O(t,e),a=((t,e,o,i,n=!0)=>{if(!(t&&e&&o&&i))throw new SyntaxError("Missing input for `angle`");if("number"!=typeof t||"number"!=typeof e||"number"!=typeof o||"number"!=typeof i)throw new TypeError(`Parameters for \`angle\` does not have required type. Requires number! Got: ${typeof t} ${typeof e} ${typeof o} ${typeof i}`);const r=i-e,s=o-t;let a=Math.atan2(r,s);return a*=180/Math.PI,n&&a<0&&(a=360+a),a})(i,n,r,s);return o?T(a):R(a)},R=t=>{if(t>360)throw RangeError("parameter cannot exceed 360");if(t<0)throw RangeError("parameter cannot be lower than 0");return t>=0&&t<=22.5?"east":t>=22.5&&t<=67.5?"south-east":t>=67.5&&t<=112.5?"south":t>=112.5&&t<=157.5?"south-west":t>=157.5&&t<=202.5?"west":t>=202.5&&t<=247.5?"north-west":t>=247.5&&t<=292.5?"north":t>=292.5&&t<=337.5?"north-east":"east"},T=t=>{if(t>360)throw RangeError("parameter cannot exceed 360");if(t<0)throw RangeError("parameter cannot be lower than 0");return t>=45&&t<=135?"south":t>135&&t<=225?"west":t>225&&t<=315?"north":"east"},L=(t,e)=>{const{x1:o,x2:i,y1:n,y2:r}=t,{direct:s=!1,firstSet:a=!1,direction:p}=e;let c={x:o+(i-o)/2,y:n},l={x:o+(i-o)/2,y:r};return s&&(a?"west"===p?(c={x:o-32,y:n-8},l={x:i+32,y:r}):"south"===p?(c={x:o-8,y:n+32},l={x:i,y:r-32}):"east"===p?(c={x:o+32,y:n-8},l={x:i-32,y:r}):(c={x:o-8,y:n-32},l={x:i,y:r+32}):"west"===p?(c={x:o-32,y:n+8},l={x:i+32,y:r}):"south"===p?(c={x:o+8,y:n+32},l={x:i,y:r-32}):"east"===p?(c={x:o+32,y:n+8},l={x:i-32,y:r}):(c={x:o+8,y:n-32},l={x:i,y:r+32})),{firstPoint:{x:o,y:n},firstControl:c,lastPoint:{x:i,y:r},lastControl:l}},P=async(t,e,o)=>{const{pos1:i,pos2:n,firstSet:r=!1,direction:s}=o,{x1:a,y1:p,x2:c,y2:l}=await O(t,e,i,n);let h=0,d=0;"north"==s?d=8:"west"==s?h=8:"east"==s?h=-8:"south"==s&&(d=-8);const f=L({x1:a+0,x2:c+h,y1:p+0,y2:l+d},{direct:!0,firstSet:r,direction:s}),{firstPoint:u,firstControl:m,lastControl:g,lastPoint:y}=f;return"M "+u.x+" "+u.y+"C "+m.x+" "+m.y+", "+g.x+" "+g.y+", "+y.x+" "+y.y};var _,M,j,k,N,W,I,z,q,H,V,F;class D{constructor(t,e){_.add(this),M.set(this,void 0),j.set(this,void 0),g(this,_,"m",k).call(this,t,e)}connect(){this.draw(g(this,j,"f"))}async draw(t){if(!t)throw"No path given to draw!";const e=`ph_draw_path-path-${w()}`,o=t.cloneNode(!1);if(o.setAttribute("id",e),o.setAttribute("data-start-el",this.startElement.getAttribute("id")||"no-id-found"),o.classList.remove("original"),o.classList.add("speccer"),!t.parentNode)throw"No parentNode found for path";this.line=t.parentNode.insertBefore(o,t.nextSibling);const i=await B({start:this.startElement,stop:this.stopElement,crude:!0}),{pos1:n,pos2:r}=(t=>{let e,o;switch(t){case"east":e="right",o="left";break;case"south":e="bottom",o="top";break;case"west":e="left",o="right";break;default:e="top",o="bottom"}return{pos1:e,pos2:o}})(i),s=await(async(t,e,o)=>{const{pos1:i,pos2:n}=o,{x1:r,y1:s,x2:a,y2:p}=await O(t,e,i,n),c=L({x1:r,x2:a,y1:s,y2:p},{direction:""}),{firstPoint:l,firstControl:h,lastControl:d,lastPoint:f}=c;return"M "+l.x+" "+l.y+"C "+h.x+" "+h.y+", "+d.x+" "+d.y+", "+f.x+" "+f.y})(this.startElement,this.stopElement,{pos1:n,pos2:r});this.line.setAttribute("data-direction",i),this.line.setAttribute("data-pos1",n),this.line.setAttribute("data-pos2",r),this.line.setAttribute("d",s)}}M=new WeakMap,j=new WeakMap,_=new WeakSet,k=function(t,e){if(!t||!e)throw"Missing inputs startElement and stopElement";if(!document.body.contains(e))throw"stopElement is not in the DOM";if(!document.body.contains(t))throw"startElement is not in the DOM";if(this.startElement=t,this.stopElement=e,y(this,M,document.getElementById("ph-speccer-svg"),"f"),y(this,j,document.getElementById("ph-speccer-path"),"f"),!g(this,j,"f")||!g(this,M,"f"))throw"Missing required SVG element to draw lines. Please see the documentation";this.connect()},window.DrawSVGLine=D;class G{constructor(t,e){N.add(this),W.set(this,void 0),I.set(this,void 0),g(this,N,"m",z).call(this,t,e)}connect(){this.draw(g(this,I,"f"))}async draw(t){if(!t)throw"No path given to draw!";const e=g(this,N,"m",q).call(this,t),o=g(this,N,"m",q).call(this,t);if(!t.parentNode)throw"No parentNode found for path";this.firstPathElement=t.parentNode.insertBefore(e,t.nextSibling),this.secondPathElement=t.parentNode.insertBefore(o,t.nextSibling);const i=await B({stop:this.stopElement,start:this.startElement,crude:!0}),{path1pos1:n,path1pos2:r,path2pos1:s,path2pos2:a}=(t=>{let e,o,i,n;switch(t){case"east":e="right-top",o="left-center",i="right-bottom",n="left-center";break;case"south":e="bottom-left",o="top-center",i="bottom-right",n="top-center";break;case"west":e="left-top",o="right-center",i="left-bottom",n="right-center";break;default:e="top-left",o="bottom-center",i="top-right",n="bottom-center"}return{path1pos1:e,path1pos2:o,path2pos1:i,path2pos2:n}})(i),p=await P(this.startElement,this.stopElement,{pos1:n,pos2:r,firstSet:!0,direction:i}),c=await P(this.startElement,this.stopElement,{pos1:s,pos2:a,direction:i});this.firstPathElement.setAttribute("data-direction",i),this.firstPathElement.setAttribute("data-pos1",n),this.firstPathElement.setAttribute("data-pos2",r),this.firstPathElement.setAttribute("d",p),this.secondPathElement.setAttribute("data-direction",i),this.secondPathElement.setAttribute("data-pos1",s),this.secondPathElement.setAttribute("data-pos2",a),this.secondPathElement.setAttribute("d",c)}}W=new WeakMap,I=new WeakMap,N=new WeakSet,z=function(t,e){if(!t||!e)throw"Missing inputs startElement and stopElement";if(!document.body.contains(e))throw"stopElement is not in the DOM";if(!document.body.contains(t))throw"startElement is not in the DOM";if(this.startElement=t,this.stopElement=e,y(this,W,document.getElementById("ph-speccer-svg"),"f"),y(this,I,document.getElementById("ph-speccer-path"),"f"),!g(this,I,"f")||!g(this,W,"f"))throw"Missing required SVG element to draw lines. Please see the documentation";this.connect()},q=function(t){if(!t)throw"No path given to #getPathElement!";const e=`ph_draw_path-path-${w()}`,o=t.cloneNode(!1);return o.setAttribute("data-start-el",this.startElement.getAttribute("id")||"no-id-found"),o.setAttribute("id",e),o.classList.remove("original"),o.classList.add("speccer"),o},window.DrawSVGCurlyBracket=G,function(t){t.Empty="",t.Left="left",t.Right="right",t.Bottom="bottom",t.Top="top"}(H||(H={})),function(t){t.Outline="outline",t.Enclose="enclose",t.Full="full",t.Left="left",t.Right="right",t.Bottom="bottom",t.Top="top",t.SVG="svg",t.Curly="curly"}(V||(V={})),function(t){t.Width="width",t.Height="height",t.Left="left",t.Right="right",t.Bottom="bottom",t.Top="top"}(F||(F={}));const X=t=>t.split(" "),Y=t=>X(t).includes(V.Right),J=t=>X(t).includes(V.Bottom),K=t=>X(t).includes(V.Full),Q=t=>X(t).includes(V.Enclose),U=t=>-1!==t.indexOf(V.Full)&&-1!==t.indexOf(V.Curly),Z=async(t,e,o,i)=>{const{isCurly:s}=i,a=r(o),p=n(getComputedStyle(o).getPropertyValue("--ph-speccer-measure-size"))||8;const c=await d(o,e);if(Q(t)){const{left:t,top:e,height:o,width:i}=c.absolute();return{left:`${t}px`,top:`${e}px`,height:`${o}px`,width:`${i}px`}}if(X(t).includes(V.Left)){if(K(t)&&!s){const{left:t,top:e,height:o}=c.fromLeft({sourceWidth:p});return{left:`${t}px`,top:`${e}px`,height:`${o}px`}}{const{left:t,top:e}=c.fromLeft({center:!0,modifier:s?a/1.5:a});return{left:`${t}px`,top:`${e}px`}}}if(Y(t)){if(K(t)&&!s){const{left:t,top:e,height:o}=c.fromRight({center:!1});return{left:`${t}px`,top:`${e}px`,height:`${o}px`}}{const{left:t,top:e}=c.fromRight({center:!0,modifier:s?a/1.5:a});return{left:`${t}px`,top:`${e}px`}}}if(J(t)){if(K(t)&&!s){const{left:t,top:e,width:o}=c.fromBottom({center:!1});return{left:`${t}px`,top:`${e}px`,width:`${o}px`}}{const{left:t,top:e}=c.fromBottom({center:!0,modifier:s?a/1.5:a});return{left:`${t}px`,top:`${e}px`}}}if(K(t)&&!s){const{left:t,top:e,width:o}=c.fromTop({center:!1});return{left:`${t}px`,top:`${e}px`,width:`${o}px`}}{const{left:t,top:e}=c.fromTop({center:!0,modifier:s?a/1.5:a});return{left:`${t}px`,top:`${e}px`}}},tt=(t="",i,n="span")=>{const r=document.createElement(n),s=document.createTextNode(t),a={};null!==i&&""!==i&&(a[i]=!0),!K(i)&&!Q(i)||K(i)&&U(i)?r.appendChild(s):(K(i)||Q(i))&&r.setAttribute("data-dissection-counter",t);const p=o("ph speccer dissection",a);return e(r,p),r},et=t=>{if(!t)return;const e=t.querySelectorAll("[data-anatomy]");if(e){let t=0;e.forEach((async(e,o)=>{if(!e)return Promise.resolve();const n=e.getAttribute("data-anatomy")||"";if(!n||""===n||-1===n.indexOf(V.Outline))return;let r=i[o];r||(r=`${i[t]}${i[t].toLowerCase()}`,t++);const s=tt(r,n);document.body.appendChild(s);const p=await Z(n,e,s,{isCurly:U(n)});var c;await a(s,p),-1===(c=n).indexOf(V.Curly)&&-1===c.indexOf(V.Full)&&-1===c.indexOf(V.Enclose)&&-1!==c.indexOf(V.SVG)?new D(e,s):U(n)&&new G(e,s)}))}};const ot=(t="",o="",i="span")=>{const n=document.createElement(i);return n.setAttribute("title",t+"px"),n.setAttribute("data-measure",parseInt(t+"",10)+"px"),e(n,`ph speccer measure ${o}`),n},it=async t=>{if(!t)return;const e=t.getAttribute("data-speccer-measure");if(""===e||!e)return;const o=await p(t);if("none"===o.display||"0"===o.opacity||"hidden"===o.visibility)return;await s();const i=t.getBoundingClientRect();if(X(e).includes(F.Width))if(J(e)){const o=ot(i.width,e);document.body.appendChild(o);const n=await d(o,t),{left:r,top:s,width:p}=n.fromBottom({center:!1});await a(o,{left:`${r}px`,top:`${s}px`,width:`${p}px`})}else{const o=ot(i.width,e);document.body.appendChild(o);const n=await d(o,t),{left:r,top:s,width:p}=n.fromTop({center:!1,modifier:-8});await a(o,{left:`${r}px`,top:`${s}px`,width:`${p}px`})}else if((t=>X(t).includes(F.Height))(e))if(Y(e)){const o=ot(i.height,e);document.body.appendChild(o);const n=await d(o,t),{left:r,top:s,height:p}=n.fromRight({center:!1});await a(o,{left:`${r}px`,top:`${s}px`,height:`${p}px`})}else{const o=ot(i.height,e);document.body.appendChild(o);const n=await d(o,t),{left:r,top:s,height:p}=n.fromLeft({center:!1,modifier:-8});await a(o,{left:`${r}px`,top:`${s}px`,height:`${p}px`})}};const nt=(t,e=3)=>parseFloat(t+"").toFixed(e),rt=(t,i)=>{const n=document.createElement("div"),r={};null!==i&&""!==i&&(r[i]=!0);const s=o("ph speccer typography",r);return n.innerHTML=t,e(n,s),n};const st=t=>{const e=()=>function(t,e,o){let i;return function(n,...r){const s=o&&!i;i&&clearTimeout(i),i=setTimeout((function(){i=null,o||t.apply(n,r)}),e),s&&t.apply(n,r)}}((()=>{t()}),300);window.removeEventListener("resize",e),window.addEventListener("resize",e)},at=t=>{"loading"===document.readyState?document.addEventListener("DOMContentLoaded",(()=>{t()})):t()},pt=()=>{const t=new IntersectionObserver(((t,e)=>{t.forEach((t=>{t.intersectionRatio>0&&(u(t.target),e.unobserve(t.target))}))}));document.querySelectorAll("[data-speccer],[data-speccer] *:not(td):not(tr):not(th):not(tfoot):not(thead):not(tbody)").forEach((e=>{t.observe(e)}));const e=new IntersectionObserver(((t,e)=>{t.forEach((t=>{t.intersectionRatio>0&&(it(t.target),e.unobserve(t.target))}))}));document.querySelectorAll("[data-speccer-measure]").forEach((t=>{e.observe(t)}));const o=new IntersectionObserver(((t,e)=>{t.forEach((t=>{t.intersectionRatio>0&&(et(t.target),e.unobserve(t.target))}))}));document.querySelectorAll("[data-anatomy-section]").forEach((t=>{o.observe(t)}))},ct=t=>{window.speccer=t},lt=t=>{const e=document.currentScript;if(e){const o=e.getAttribute("src");!o||-1===o.indexOf("speccer.js")&&-1===o.indexOf("JaXpOK.js")||(e.hasAttribute("data-manual")?ct(t):e.hasAttribute("data-instant")?t():e.hasAttribute("data-dom")?at(t):e.hasAttribute("data-lazy")?pt():at(t),e.hasAttribute("data-manual")||e.hasAttribute("data-lazy")||st(t))}};const ht=m,dt=Object.freeze({__proto__:null,create:tt,element:et}),ft=Object.freeze({__proto__:null,element:it}),ut=Object.freeze({__proto__:null,create:rt,element:async t=>{if(!t)return;const e=t.getAttribute("data-speccer-typography"),o=await p(t);if("none"===o.display||"0"===o.opacity||"hidden"===o.visibility)return;t.classList.add("is-specced");const i=await(async t=>{const e=(t=>{const{lineHeight:e,letterSpacing:o,fontFamily:i,fontSize:n,fontStyle:r,fontVariationSettings:s,fontWeight:a}=t;return{lineHeight:e,letterSpacing:o,fontFamily:i,fontSize:n,fontStyle:r,fontVariationSettings:s,fontWeight:a}})(await p(t)),o="normal"!==e.lineHeight?parseInt(e.lineHeight,10)/16+"rem":"normal";return`\nfont-styles: {<ul class="speccer-styles"> <li><span class="property">font-family:</span> ${e.fontFamily};</li> <li><span class="property">font-size:</span> ${e.fontSize} / ${parseInt(e.fontSize,10)/16}rem;</li> <li><span class="property">font-weight:</span> ${e.fontWeight};</li> <li><span class="property">font-variation-settings:</span> ${e.fontVariationSettings};</li> <li><span class="property">line-height:</span> ${e.lineHeight} / ${o};</li> <li><span class="property">letter-spacing:</span> ${e.letterSpacing};</li> <li><span class="property">font-style:</span> ${e.fontStyle};</li></ul>}`})(t),n=rt(i,e);document.body.appendChild(n);const s=await(async(t,e,o)=>{const i=e.getBoundingClientRect(),n=r(o),s=o.getBoundingClientRect(),a=await h(e),p=a.left-s.width-n+"px",d=nt(l(a.top,s,i))+"px",f=a.left+i.width+n+"px",u=nt(l(a.top,s,i))+"px",m=nt(c(a.left,s,i))+"px",g=a.top-s.height-n+"px",y=nt(c(a.left,s,i))+"px",w=a.top+i.height+n+"px";let x={left:p,top:d};return t&&-1!==t.indexOf(H.Right)?x={left:f,top:u}:t&&-1!==t.indexOf(H.Top)?x={left:m,top:g}:t&&-1!==t.indexOf(H.Bottom)&&(x={left:y,top:w}),x})(e,t,n);a(n,s)}}),mt=Object.freeze({__proto__:null,dom:at,lazy:pt,manual:ct,activate:lt}),gt=()=>{((t,e=document)=>{[].forEach.call(e.querySelectorAll(t),(function(t){t.remove()}))})(".speccer");const t=document.querySelectorAll("[data-speccer],[data-speccer] *:not(td):not(tr):not(th):not(tfoot):not(thead):not(tbody)"),e=document.querySelectorAll("[data-speccer-measure]"),o=document.querySelectorAll("[data-speccer-typography]"),i=document.querySelectorAll("[data-anatomy-section]");t.forEach(ht.element),e.forEach(ft.element),o.forEach(ut.element),i.forEach(dt.element)};lt(gt),t.default=gt,t.dissect=dt,t.measure=ft,t.modes=mt,t.spacing=ht,t.typography=ut,Object.defineProperty(t,"__esModule",{value:!0})}));
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).speccer={})}(this,(function(t){"use strict";const e=(t,e,o="noop")=>{t&&(!e||e&&0===e.length||e.trim().split(" ").filter((t=>t!==o)).forEach((e=>t.classList.add(e))))},o=(t,e)=>t?e||"string"==typeof t?`${t} ${e?Object.keys(e).filter((t=>e[t])).join(" "):""}`.trim():`${Object.keys(t).filter((e=>t[e])).join(" ")}`.trim():"",n=[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ"],i=t=>parseInt(t,10),r=t=>i(getComputedStyle(t).getPropertyValue("--ph-speccer-pin-space"))||48,s=()=>new Promise(requestAnimationFrame),a=async(t,e)=>{!t||!e||"string"==typeof e||"number"==typeof e||"boolean"==typeof e||Array.isArray(e)&&0===e.length||0===Object.keys(e).length&&e.constructor===Object||(await s(),Array.isArray(e)?e.forEach((e=>t.style[e.key]=e.value)):Object.keys(e).forEach((o=>t.style[o]=e[o])))},p=async t=>(await s(),getComputedStyle(t,null)),c=(t,e,o)=>t-e.width/2+o.width/2,l=(t,e,o)=>t-e.height/2+o.height/2,h=async t=>{await s();const e=t.getBoundingClientRect(),o=e.top+window.pageYOffset,n=e.left+window.pageXOffset;return{height:e.height,width:e.width,top:o,left:n}},d=async(t,e)=>{await s();const o=t.getBoundingClientRect(),n=await h(e),i=await(async(t,e)=>{await s();const o=t.getBoundingClientRect(),n=e.getBoundingClientRect(),i=n.top+window.pageYOffset,r=n.left+window.pageXOffset;return{height:n.height,width:n.width,top:l(i,o,n),left:c(r,o,n)}})(t,e),r=n.height,a=n.width,p=o.height,d=o.width;return{absolute:()=>({top:n.top,left:n.left,height:r,width:a}),toTop:({center:t=!1,sourceHeight:e=p,modifier:o=0}={})=>({top:n.top+e+o,left:t?i.left:n.left,height:r,width:a}),fromTop:({center:t=!1,sourceHeight:e=p,modifier:o=0}={})=>({top:n.top-e-o,left:t?i.left:n.left,height:r,width:a}),toBottom:({center:t=!1,sourceHeight:e=p,targetHeight:o=r,modifier:s=0}={})=>({top:n.top+o-(e+s),left:t?i.left:n.left,height:r,width:a}),fromBottom:({center:t=!1,targetHeight:e=r,modifier:o=0}={})=>({top:n.top+e+o,left:t?i.left:n.left,height:r,width:a}),toLeft:({center:t=!1,sourceWidth:e=d,modifier:o=0}={})=>({top:t?i.top:n.top,left:n.left+e+o,height:r,width:a}),fromLeft:({center:t=!1,sourceWidth:e=d,modifier:o=0}={})=>({top:t?i.top:n.top,left:n.left-e-o,height:r,width:a}),toRight:({center:t=!1,sourceWidth:e=d,targetWidth:o=a,modifier:s=0}={})=>({top:t?i.top:n.top,left:n.left+o-(e+s),height:r,width:a}),fromRight:({center:t=!1,targetWidth:e=a,modifier:o=0}={})=>({top:t?i.top:n.top,left:n.left+e+o,height:r,width:a})}},f=(t="",o="span")=>{const n=document.createElement(o),i=document.createTextNode(t+"");return n.appendChild(i),n.setAttribute("title",t+"px"),e(n,"ph speccer spacing"),n},u=async t=>{if(!t)return;const o=await p(t);if("none"===o.display||"0"===o.opacity||"hidden"===o.visibility)return;const n=(t=>{const{marginTop:e,marginBottom:o,marginLeft:n,marginRight:i,paddingTop:r,paddingBottom:s,paddingLeft:a,paddingRight:p}=t;return{marginTop:e,marginBottom:o,marginLeft:n,marginRight:i,paddingTop:r,paddingBottom:s,paddingLeft:a,paddingRight:p}})(o),r=Object.keys(n).filter((t=>"0px"!==n[t]));0!==r.length&&r.forEach((async o=>{const r=i(n[o]),p=f(r),c=(t=>-1!==t.indexOf("Top")?t.replace("Top"," top"):-1!==t.indexOf("Right")?t.replace("Right"," right"):-1!==t.indexOf("Bottom")?t.replace("Bottom"," bottom"):-1!==t.indexOf("Left")?t.replace("Left"," left"):"")(o);e(p,c),document.body.appendChild(p),t.classList.add("is-specced"),await(async(t,e,o,n)=>{await s();const i=n.getBoundingClientRect(),r=await h(n);"marginTop"===t&&a(o,{height:`${e}px`,width:i.width+"px",left:r.left+"px",top:r.top-e+"px"}),"marginRight"===t&&a(o,{height:i.height+"px",width:`${e}px`,left:r.left+parseInt(i.width+"",10)+"px",top:r.top+"px"}),"marginBottom"===t&&a(o,{height:`${e}px`,width:i.width+"px",left:r.left+"px",top:r.top+parseInt(i.height+"",10)+"px"}),"marginLeft"===t&&a(o,{height:i.height+"px",width:`${e}px`,left:r.left-e+"px",top:r.top+"px"}),"paddingTop"===t&&a(o,{height:`${e}px`,width:i.width+"px",left:r.left+"px",top:r.top+"px"}),"paddingBottom"===t&&a(o,{height:`${e}px`,width:i.width+"px",left:r.left+"px",top:r.top+(parseInt(i.height+"",10)-e)+"px"}),"paddingRight"===t&&a(o,{height:i.height+"px",width:`${e}px`,left:r.left+(parseInt(i.width+"",10)-e)+"px",top:r.top+"px"}),"paddingLeft"===t&&a(o,{height:i.height+"px",width:`${e}px`,left:r.left+"px",top:r.top+"px"})})(o,r,p,t)}))};var m,g,w,y=Object.freeze({__proto__:null,create:f,element:u});!function(t){t.Empty="",t.Left="left",t.Right="right",t.Bottom="bottom",t.Top="top"}(m||(m={})),function(t){t.Outline="outline",t.Enclose="enclose",t.Full="full",t.Left="left",t.Right="right",t.Bottom="bottom",t.Top="top",t.SVG="svg",t.Curly="curly"}(g||(g={})),function(t){t.Width="width",t.Height="height",t.Left="left",t.Right="right",t.Bottom="bottom",t.Top="top"}(w||(w={}));const x=t=>t.split(" "),b=t=>x(t).includes(g.Right),E=t=>x(t).includes(g.Bottom),$=t=>x(t).includes(g.Full),v=t=>x(t).includes(g.Enclose),A=t=>t.includes(g.Curly)&&t.includes(g.Full);function S(t,e,o,n){if("a"===o&&!n)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e||!n:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===o?n:"a"===o?n.call(t):n?n.value:e.get(t)}function C(t,e,o,n,i){if("m"===n)throw new TypeError("Private method is not writable");if("a"===n&&!i)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?t!==e||!i:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===n?i.call(t,o):i?i.value=o:e.set(t,o),o}const O=()=>"_"+Math.random().toString(36).substring(2,11),B=t=>t.top,R=t=>t.left+t.width,P=t=>t.top+t.height,T=t=>t.left,L=t=>t.left+t.width/2,_=t=>t.top+t.height/2,k={center:t=>({x:L(t),y:_(t)}),top:t=>({x:L(t),y:B(t)}),right:t=>({x:R(t),y:_(t)}),bottom:t=>({x:L(t),y:P(t)}),left:t=>({x:T(t),y:_(t)}),"right-top":t=>({x:R(t),y:B(t)}),"right-bottom":t=>({x:R(t),y:P(t)}),"left-top":t=>({x:T(t),y:B(t)}),"left-bottom":t=>({x:T(t),y:P(t)}),"top-left":t=>({x:T(t),y:B(t)}),"top-right":t=>({x:R(t),y:B(t)}),"bottom-left":t=>({x:T(t),y:P(t)}),"bottom-right":t=>({x:R(t),y:P(t)}),"top-center":t=>({x:L(t),y:B(t)}),"right-center":t=>({x:R(t),y:_(t)}),"bottom-center":t=>({x:L(t),y:P(t)}),"left-center":t=>({x:T(t),y:_(t)})},M=async(t,e="center")=>{if(!e)throw new Error("No position given");if("string"!=typeof e)throw new Error("The position given is not the required type: pos: "+typeof e);const o=["center","left","right","top","bottom","right-top","right-bottom","left-top","left-bottom","top-left","top-right","bottom-left","bottom-right","top-center","right-center","bottom-center","left-center"];if(!o.includes(e))throw new Error(`The position given does not match allowed positions to use! Valid positions are: ${o.join(", ")}`);await s();const n=t.getBoundingClientRect();return k[e](n)},j=async(t,e,o="center",n="center")=>{if(!t||!e)throw new Error("No element given");const{x:i,y:r}=await M(t,o),{x:s,y:a}=await M(e,n);return{x1:i,y1:r,x2:s,y2:a}},N=(t,e)=>{const{x1:o,x2:n,y1:i,y2:r}=t,{direct:s=!1,firstSet:a=!1,direction:p}=e;let c={x:o+(n-o)/2,y:i},l={x:o+(n-o)/2,y:r};return s&&(a?"west"===p?(c={x:o-32,y:i-8},l={x:n+32,y:r}):"south"===p?(c={x:o-8,y:i+32},l={x:n,y:r-32}):"east"===p?(c={x:o+32,y:i-8},l={x:n-32,y:r}):(c={x:o-8,y:i-32},l={x:n,y:r+32}):"west"===p?(c={x:o-32,y:i+8},l={x:n+32,y:r}):"south"===p?(c={x:o+8,y:i+32},l={x:n,y:r-32}):"east"===p?(c={x:o+32,y:i+8},l={x:n-32,y:r}):(c={x:o+8,y:i-32},l={x:n,y:r+32})),{firstPoint:{x:o,y:i},firstControl:c,lastPoint:{x:n,y:r},lastControl:l}},W=async(t,e,o)=>{const{pos1:n,pos2:i,firstSet:r=!1,direction:s}=o,{x1:a,y1:p,x2:c,y2:l}=await j(t,e,n,i);let h=0,d=0;"north"==s?d=8:"west"==s?h=8:"east"==s?h=-8:"south"==s&&(d=-8);const f=N({x1:a+0,x2:c+h,y1:p+0,y2:l+d},{direct:!0,firstSet:r,direction:s}),{firstPoint:u,firstControl:m,lastControl:g,lastPoint:w}=f;return`M ${u.x} ${u.y}C ${m.x} ${m.y}, ${g.x} ${g.y}, ${w.x} ${w.y}`},z=async({start:t,stop:e,crude:o=!1})=>{const{x1:n,y1:i,x2:r,y2:s}=await j(t,e),a=((t,e,o,n,i=!0)=>{if(!(t&&e&&o&&n))throw new SyntaxError("Missing input for `angle`");if("number"!=typeof t||"number"!=typeof e||"number"!=typeof o||"number"!=typeof n)throw new TypeError(`Parameters for \`angle\` do not have the required type. Requires number! Got: ${typeof t} ${typeof e} ${typeof o} ${typeof n}`);const r=n-e,s=o-t;let a=Math.atan2(r,s);return a*=180/Math.PI,i&&a<0&&(a=360+a),a})(n,i,r,s);return o?(t=>{if(t>360)throw new RangeError("Parameter cannot exceed 360");if(t<0)throw new RangeError("Parameter cannot be lower than 0");return t>=45&&t<=135?"south":t>135&&t<=225?"west":t>225&&t<=315?"north":"east"})(a):(t=>{if(t>360)throw new RangeError("Parameter cannot exceed 360");if(t<0)throw new RangeError("Parameter cannot be lower than 0");return t>=0&&t<=22.5?"east":t>=22.5&&t<=67.5?"south-east":t>=67.5&&t<=112.5?"south":t>=112.5&&t<=157.5?"south-west":t>=157.5&&t<=202.5?"west":t>=202.5&&t<=247.5?"north-west":t>=247.5&&t<=292.5?"north":t>=292.5&&t<=337.5?"north-east":"east"})(a)};var I,q,H,V,F,D,G,X,Y;class J{constructor(t,e){I.add(this),q.set(this,void 0),H.set(this,void 0),S(this,I,"m",V).call(this,t,e)}connect(){this.draw(S(this,H,"f"))}async draw(t){if(!t)throw new Error("No path given to draw!");const e=`ph_draw_path-path-${O()}`,o=t.cloneNode(!1);if(o.setAttribute("id",e),o.setAttribute("data-start-el",this.startElement.getAttribute("id")||"no-id-found"),o.classList.remove("original"),o.classList.add("speccer"),!t.parentNode)throw new Error("No parentNode found for path");this.line=t.parentNode.insertBefore(o,t.nextSibling);const n=await z({start:this.startElement,stop:this.stopElement,crude:!0}),{pos1:i,pos2:r}=(t=>{let e,o;switch(t){case"east":e="right",o="left";break;case"south":e="bottom",o="top";break;case"west":e="left",o="right";break;default:e="top",o="bottom"}return{pos1:e,pos2:o}})(n),s=await(async(t,e,o)=>{const{pos1:n,pos2:i}=o,{x1:r,y1:s,x2:a,y2:p}=await j(t,e,n,i),c=N({x1:r,x2:a,y1:s,y2:p},{direction:""}),{firstPoint:l,firstControl:h,lastControl:d,lastPoint:f}=c;return`M ${l.x} ${l.y}C ${h.x} ${h.y}, ${d.x} ${d.y}, ${f.x} ${f.y}`})(this.startElement,this.stopElement,{pos1:i,pos2:r});this.line.setAttribute("data-direction",n),this.line.setAttribute("data-pos1",i),this.line.setAttribute("data-pos2",r),this.line.setAttribute("d",s)}}q=new WeakMap,H=new WeakMap,I=new WeakSet,V=function(t,e){if(!t||!e)throw new Error("Missing inputs startElement and stopElement");if(!document.body.contains(e))throw new Error("stopElement is not in the DOM");if(!document.body.contains(t))throw new Error("startElement is not in the DOM");if(this.startElement=t,this.stopElement=e,C(this,q,document.getElementById("ph-speccer-svg"),"f"),C(this,H,document.getElementById("ph-speccer-path"),"f"),!S(this,H,"f")||!S(this,q,"f"))throw new Error("Missing required SVG element to draw lines. Please see the documentation");this.connect()},window.DrawSVGLine=J;class K{constructor(t,e){F.add(this),D.set(this,void 0),G.set(this,void 0),S(this,F,"m",X).call(this,t,e)}connect(){this.draw(S(this,G,"f"))}async draw(t){if(!t)throw new Error("No path given to draw!");const e=S(this,F,"m",Y).call(this,t),o=S(this,F,"m",Y).call(this,t);if(!t.parentNode)throw new Error("No parentNode found for path");this.firstPathElement=t.parentNode.insertBefore(e,t.nextSibling),this.secondPathElement=t.parentNode.insertBefore(o,t.nextSibling);const n=await z({stop:this.stopElement,start:this.startElement,crude:!0}),{path1pos1:i,path1pos2:r,path2pos1:s,path2pos2:a}=(t=>{let e,o,n,i;switch(t){case"east":e="right-top",o="left-center",n="right-bottom",i="left-center";break;case"south":e="bottom-left",o="top-center",n="bottom-right",i="top-center";break;case"west":e="left-top",o="right-center",n="left-bottom",i="right-center";break;default:e="top-left",o="bottom-center",n="top-right",i="bottom-center"}return{path1pos1:e,path1pos2:o,path2pos1:n,path2pos2:i}})(n),p=await W(this.startElement,this.stopElement,{pos1:i,pos2:r,firstSet:!0,direction:n}),c=await W(this.startElement,this.stopElement,{pos1:s,pos2:a,direction:n});this.firstPathElement.setAttribute("data-direction",n),this.firstPathElement.setAttribute("data-pos1",i),this.firstPathElement.setAttribute("data-pos2",r),this.firstPathElement.setAttribute("d",p),this.secondPathElement.setAttribute("data-direction",n),this.secondPathElement.setAttribute("data-pos1",s),this.secondPathElement.setAttribute("data-pos2",a),this.secondPathElement.setAttribute("d",c)}}D=new WeakMap,G=new WeakMap,F=new WeakSet,X=function(t,e){if(!t||!e)throw new Error("Missing inputs startElement and stopElement");if(!document.body.contains(e))throw new Error("stopElement is not in the DOM");if(!document.body.contains(t))throw new Error("startElement is not in the DOM");if(this.startElement=t,this.stopElement=e,C(this,D,document.getElementById("ph-speccer-svg"),"f"),C(this,G,document.getElementById("ph-speccer-path"),"f"),!S(this,G,"f")||!S(this,D,"f"))throw new Error("Missing required SVG element to draw lines. Please see the documentation");this.connect()},Y=function(t){if(!t)throw new Error("No path given to #getPathElement!");const e=`ph_draw_path-path-${O()}`,o=t.cloneNode(!1);return o.setAttribute("data-start-el",this.startElement.getAttribute("id")||"no-id-found"),o.setAttribute("id",e),o.classList.remove("original"),o.classList.add("speccer"),o},window.DrawSVGCurlyBracket=K;const Q=async(t,e,o,n)=>{const{isCurly:s=!1}=n||{},a=r(o),p=i(getComputedStyle(o).getPropertyValue("--ph-speccer-measure-size"))||8;const c=await d(o,e);if(v(t)){const{left:t,top:e,height:o,width:n}=c.absolute();return{left:`${t}px`,top:`${e}px`,height:`${o}px`,width:`${n}px`}}if(x(t).includes(g.Left)){if($(t)&&!s){const{left:t,top:e,height:o}=c.fromLeft({sourceWidth:p});return{left:`${t}px`,top:`${e}px`,height:`${o}px`}}{const{left:t,top:e}=c.fromLeft({center:!0,modifier:s?a/1.5:a});return{left:`${t}px`,top:`${e}px`}}}if(b(t)){if($(t)&&!s){const{left:t,top:e,height:o}=c.fromRight({center:!1});return{left:`${t}px`,top:`${e}px`,height:`${o}px`}}{const{left:t,top:e}=c.fromRight({center:!0,modifier:s?a/1.5:a});return{left:`${t}px`,top:`${e}px`}}}if(E(t)){if($(t)&&!s){const{left:t,top:e,width:o}=c.fromBottom({center:!1});return{left:`${t}px`,top:`${e}px`,width:`${o}px`}}{const{left:t,top:e}=c.fromBottom({center:!0,modifier:s?a/1.5:a});return{left:`${t}px`,top:`${e}px`}}}if($(t)&&!s){const{left:t,top:e,width:o}=c.fromTop({center:!1});return{left:`${t}px`,top:`${e}px`,width:`${o}px`}}{const{left:t,top:e}=c.fromTop({center:!0,modifier:s?a/1.5:a});return{left:`${t}px`,top:`${e}px`}}},U=(t="",n,i="span")=>{const r=document.createElement(i),s=document.createTextNode(t),a={};null!==n&&""!==n&&(a[n]=!0),!$(n)&&!v(n)||$(n)&&A(n)?r.appendChild(s):($(n)||v(n))&&r.setAttribute("data-dissection-counter",t);const p=o("ph speccer dissection",a);return e(r,p),r},Z=t=>{if(!t)return;const e=t.querySelectorAll("[data-anatomy]");if(e){let t=0;e.forEach((async(e,o)=>{if(!e)return Promise.resolve();const i=e.getAttribute("data-anatomy")||"";if(!i||""===i||-1===i.indexOf(g.Outline))return;let r=n[o];r||(r=`${n[t]}${n[t].toLowerCase()}`,t++);const s=U(r,i);document.body.appendChild(s);const p=await Q(i,e,s,{isCurly:A(i)});var c;await a(s,p),(c=i).includes(g.SVG)||c.includes(g.Curly)||c.includes(g.Full)||c.includes(g.Enclose)?new J(e,s):A(i)&&new K(e,s)}))}};const tt=(t="",o="",n="span")=>{const i=document.createElement(n);return i.setAttribute("title",t+"px"),i.setAttribute("data-measure",parseInt(t+"",10)+"px"),e(i,`ph speccer measure ${o}`),i},et=async t=>{if(!t)return;const e=t.getAttribute("data-speccer-measure");if(""===e||!e)return;const o=await p(t);if("none"===o.display||"0"===o.opacity||"hidden"===o.visibility)return;await s();const n=t.getBoundingClientRect();if(x(e).includes(w.Width))if(E(e)){const o=tt(n.width,e);document.body.appendChild(o);const i=await d(o,t),{left:r,top:s,width:p}=i.fromBottom({center:!1});await a(o,{left:`${r}px`,top:`${s}px`,width:`${p}px`})}else{const o=tt(n.width,e);document.body.appendChild(o);const i=await d(o,t),{left:r,top:s,width:p}=i.fromTop({center:!1,modifier:-8});await a(o,{left:`${r}px`,top:`${s}px`,width:`${p}px`})}else if((t=>x(t).includes(w.Height))(e))if(b(e)){const o=tt(n.height,e);document.body.appendChild(o);const i=await d(o,t),{left:r,top:s,height:p}=i.fromRight({center:!1});await a(o,{left:`${r}px`,top:`${s}px`,height:`${p}px`})}else{const o=tt(n.height,e);document.body.appendChild(o);const i=await d(o,t),{left:r,top:s,height:p}=i.fromLeft({center:!1,modifier:-8});await a(o,{left:`${r}px`,top:`${s}px`,height:`${p}px`})}};const ot=(t="span")=>{const n=document.createElement(t),i=o("ph speccer mark");return e(n,i),n};const nt=(t,e=3)=>parseFloat(t+"").toFixed(e),it=(t,n)=>{const i=document.createElement("div"),r={};null!==n&&""!==n&&(r[n]=!0);const s=o("ph speccer typography",r);return i.innerHTML=t,e(i,s),i};const rt=t=>{const e=()=>((t,e,o=!1)=>{let n;return function(i,...r){const s=o&&!n;n&&clearTimeout(n),n=setTimeout((function(){n=null,o||t.apply(i,r)}),e),s&&t.apply(i,r)}})((()=>{t()}),300);window.removeEventListener("resize",e),window.addEventListener("resize",e)},st=t=>{"loading"===document.readyState?document.addEventListener("DOMContentLoaded",(()=>{t()})):t()},at=()=>{const t=new IntersectionObserver(((t,e)=>{t.forEach((t=>{t.intersectionRatio>0&&(u(t.target),e.unobserve(t.target))}))}));document.querySelectorAll("[data-speccer],[data-speccer] *:not(td):not(tr):not(th):not(tfoot):not(thead):not(tbody)").forEach((e=>{t.observe(e)}));const e=new IntersectionObserver(((t,e)=>{t.forEach((t=>{t.intersectionRatio>0&&(et(t.target),e.unobserve(t.target))}))}));document.querySelectorAll("[data-speccer-measure]").forEach((t=>{e.observe(t)}));const o=new IntersectionObserver(((t,e)=>{t.forEach((t=>{t.intersectionRatio>0&&(Z(t.target),e.unobserve(t.target))}))}));document.querySelectorAll("[data-anatomy-section]").forEach((t=>{o.observe(t)}))},pt=t=>{window.speccer=t},ct=t=>{const e=document.currentScript;if(e){const o=e.getAttribute("src");!o||-1===o.indexOf("speccer.js")&&-1===o.indexOf("JaXpOK.js")||(e.hasAttribute("data-manual")?pt(t):e.hasAttribute("data-instant")?t():e.hasAttribute("data-dom")?st(t):e.hasAttribute("data-lazy")?at():st(t),e.hasAttribute("data-manual")||e.hasAttribute("data-lazy")||rt(t))}};const lt=y,ht=Object.freeze({__proto__:null,create:U,element:Z}),dt=Object.freeze({__proto__:null,element:et}),ft=Object.freeze({__proto__:null,create:ot,element:async t=>{if(!t)return Promise.resolve();const e=ot();document.body.appendChild(e);const o=await d(e,t),{left:n,top:i,height:r,width:s}=o.absolute(),p={left:`${n}px`,top:`${i}px`,height:`${r}px`,width:`${s}px`};await a(e,p)}}),ut=Object.freeze({__proto__:null,create:it,element:async t=>{if(!t)return;const e=t.getAttribute("data-speccer-typography"),o=await p(t);if("none"===o.display||"0"===o.opacity||"hidden"===o.visibility)return;t.classList.add("is-specced");const n=await(async t=>{const e=(t=>{const{lineHeight:e,letterSpacing:o,fontFamily:n,fontSize:i,fontStyle:r,fontVariationSettings:s,fontWeight:a}=t;return{lineHeight:e,letterSpacing:o,fontFamily:n,fontSize:i,fontStyle:r,fontVariationSettings:s,fontWeight:a}})(await p(t)),o="normal"!==e.lineHeight?parseInt(e.lineHeight,10)/16+"rem":"normal";return`\nfont-styles: {<ul class="speccer-styles"> <li><span class="property">font-family:</span> ${e.fontFamily};</li> <li><span class="property">font-size:</span> ${e.fontSize} / ${parseInt(e.fontSize,10)/16}rem;</li> <li><span class="property">font-weight:</span> ${e.fontWeight};</li> <li><span class="property">font-variation-settings:</span> ${e.fontVariationSettings};</li> <li><span class="property">line-height:</span> ${e.lineHeight} / ${o};</li> <li><span class="property">letter-spacing:</span> ${e.letterSpacing};</li> <li><span class="property">font-style:</span> ${e.fontStyle};</li></ul>}`})(t),i=it(n,e);document.body.appendChild(i);const s=await(async(t,e,o)=>{const n=e.getBoundingClientRect(),i=r(o),s=o.getBoundingClientRect(),a=await h(e),p=a.left-s.width-i+"px",d=nt(l(a.top,s,n))+"px",f=a.left+n.width+i+"px",u=nt(l(a.top,s,n))+"px",g=nt(c(a.left,s,n))+"px",w=a.top-s.height-i+"px",y=nt(c(a.left,s,n))+"px",x=a.top+n.height+i+"px";let b={left:p,top:d};return t&&-1!==t.indexOf(m.Right)?b={left:f,top:u}:t&&-1!==t.indexOf(m.Top)?b={left:g,top:w}:t&&-1!==t.indexOf(m.Bottom)&&(b={left:y,top:x}),b})(e,t,i);a(i,s)}}),mt=Object.freeze({__proto__:null,dom:st,lazy:at,manual:pt,activate:ct}),gt=()=>{((t,e=document)=>{[].forEach.call(e.querySelectorAll(t),(function(t){t.remove()}))})(".speccer");const t=document.querySelectorAll("[data-speccer],[data-speccer] *:not(td):not(tr):not(th):not(tfoot):not(thead):not(tbody)"),e=document.querySelectorAll("[data-speccer-measure]"),o=document.querySelectorAll("[data-speccer-typography]"),n=document.querySelectorAll("[data-anatomy-section]");document.querySelectorAll("[data-speccer-mark]").forEach(ft.element),t.forEach(lt.element),e.forEach(dt.element),o.forEach(ut.element),n.forEach(ht.element)};ct(gt),t.default=gt,t.dissect=ht,t.mark=ft,t.measure=dt,t.modes=mt,t.spacing=lt,t.typography=ut,Object.defineProperty(t,"__esModule",{value:!0})}));
|
|
2
2
|
//# sourceMappingURL=speccer.js.map
|
package/speccer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"speccer.js","sources":["src/lib/node.ts","src/lib/classnames.ts","src/lib/constants.ts","src/lib/css.ts","src/lib/wait.ts","src/lib/styles.ts","src/lib/position.ts","src/tasks/spec.ts","src/helpers/spacing/position.ts","node_modules/tslib/tslib.es6.js","src/lib/id.ts","src/lib/cardinal.ts","src/lib/bezier.ts","src/enums/area.ts","src/lib/classes/DrawSVGLine.ts","src/lib/classes/DrawSVGCurlyBracket.ts","src/lib/area.ts","src/helpers/dissect/styles.ts","src/tasks/dissect.ts","src/tasks/measure.ts","src/lib/number.ts","src/tasks/typography.ts","src/lib/debounce.ts","src/lib/resize.ts","src/browser.ts","src/index.ts","src/helpers/typography/template.ts","src/helpers/typography/position.ts"],"sourcesContent":["export const after = (el: HTMLElement | null, newSibling: HTMLElement) =>\n el && el.insertAdjacentElement('afterend', newSibling);\n\nexport const removeAll = (selector: string, el: Document = document) => {\n [].forEach.call(el.querySelectorAll(selector), function (e: HTMLElement) {\n e.remove();\n });\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport { ClassNamesObjectMapInterface } from 'interfaces/classnames';\n\nexport const set = (el: HTMLElement, cls: string, avoid = 'noop') => {\n if (!el) return;\n\n if (!cls || (cls && cls.length === 0)) return;\n\n cls\n .trim()\n .split(' ')\n .filter((cl) => cl !== avoid)\n .forEach((cl) => el.classList.add(cl));\n};\n\nexport const toggle = (el: HTMLElement, cls: string, avoid = 'noop') => {\n if (!el) return;\n\n if (!cls || (cls && cls.length === 0)) return;\n\n cls\n .trim()\n .split(' ')\n .filter((cl) => cl !== avoid)\n .forEach((cl) => el.classList.toggle(cl));\n};\n\nexport const remove = (el: HTMLElement, cls: string, avoid = 'noop') => {\n if (!el) return;\n\n if (!cls || (cls && cls.length === 0)) return;\n\n cls\n .trim()\n .split(' ')\n .filter((cl) => cl !== avoid)\n .forEach((cl) => el.classList.remove(cl));\n};\n\nexport const cx = (\n cls: string,\n cls_obj?: ClassNamesObjectMapInterface\n): string => {\n if (!cls) return '';\n\n if (!cls_obj && typeof cls !== 'string') {\n return `${Object.keys(cls)\n .filter((classname) => cls[classname])\n .join(' ')}`.trim();\n }\n\n return `${cls} ${\n cls_obj\n ? Object.keys(cls_obj)\n .filter((classname) => cls_obj[classname])\n .join(' ')\n : ''\n }`.trim();\n};\n","/* eslint no-console:0 */\n'use strict';\n\nexport const SPECCER_LITERALS = [...'ABCDEFGHIJKLMNOPQRSTUVWXYZ'];\n\nexport const SPECCER_TAGS_TO_AVOID = [\n 'TR',\n 'TH',\n 'TD',\n 'TBODY',\n 'THEAD',\n 'TFOOT'\n];\n\nexport const SPECCER_DEFAULT_PIN_SPACE = 48;\n\nexport const SPECCER_DEFAULT_PIN_SPACE_NEG = SPECCER_DEFAULT_PIN_SPACE * -1;\n\nexport const SPECCER_DEFAULT_MEASURE_SIZE = 8;\n\nexport const SPECCER_DEFAULT_MEASURE_SIZE_NEG =\n SPECCER_DEFAULT_MEASURE_SIZE * -1;\n\nexport const SPECCER_DEFAULT_LINE_WIDTH = 1;\n","/* eslint no-console:0 */\n'use strict';\nimport {\n SPECCER_DEFAULT_PIN_SPACE,\n SPECCER_DEFAULT_MEASURE_SIZE,\n SPECCER_DEFAULT_LINE_WIDTH\n} from './constants';\nimport {\n SpacingCSSPropertiesType,\n TypographyCSSPropertiesType\n} from '../types/css';\n\nexport const getNumberValue = (value: string): number => parseInt(value, 10);\n\nexport const normalizeNumberValue = (value: string | number): number => {\n const _value = parseFloat(value + '');\n\n return (_value >= 0 && _value < 1) || (_value <= 0 && _value > -1)\n ? 0\n : _value;\n};\n\nexport const getClassNameFromCSSProperty = (property: string) => {\n if (property.indexOf('Top') !== -1) {\n return property.replace('Top', ' top');\n } else if (property.indexOf('Right') !== -1) {\n return property.replace('Right', ' right');\n } else if (property.indexOf('Bottom') !== -1) {\n return property.replace('Bottom', ' bottom');\n } else if (property.indexOf('Left') !== -1) {\n return property.replace('Left', ' left');\n }\n\n return '';\n};\n\nexport const getSpacing = (\n style: SpacingCSSPropertiesType\n): SpacingCSSPropertiesType => {\n const {\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n paddingTop,\n paddingBottom,\n paddingLeft,\n paddingRight\n } = style;\n\n return {\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n paddingTop,\n paddingBottom,\n paddingLeft,\n paddingRight\n };\n};\n\nexport const getTypography = (\n style: TypographyCSSPropertiesType\n): TypographyCSSPropertiesType => {\n const {\n lineHeight,\n letterSpacing,\n fontFamily,\n fontSize,\n fontStyle,\n fontVariationSettings,\n fontWeight\n } = style;\n\n return {\n lineHeight,\n letterSpacing,\n fontFamily,\n fontSize,\n fontStyle,\n fontVariationSettings,\n fontWeight\n };\n};\n\nexport const pinSpace = (el: HTMLElement): number =>\n getNumberValue(\n getComputedStyle(el).getPropertyValue('--ph-speccer-pin-space')\n ) || SPECCER_DEFAULT_PIN_SPACE;\n\nexport const measureSize = (el: HTMLElement): number =>\n getNumberValue(\n getComputedStyle(el).getPropertyValue('--ph-speccer-measure-size')\n ) || SPECCER_DEFAULT_MEASURE_SIZE;\n\nexport const lineWidth = (el: HTMLElement): number =>\n getNumberValue(\n getComputedStyle(el).getPropertyValue('--ph-speccer-line-width')\n ) || SPECCER_DEFAULT_LINE_WIDTH;\n","export const waitFor = (ms: number) =>\n new Promise((resolve) => setTimeout(resolve, ms));\n\nexport const waitForFrame = () => new Promise(requestAnimationFrame);\n","/* eslint no-console:0 */\n'use strict';\nimport { waitForFrame } from './wait';\n\nexport const add = async (el: HTMLElement, styles: [] | object) => {\n if (\n !el ||\n !styles ||\n typeof styles === 'string' ||\n typeof styles === 'number' ||\n typeof styles === 'boolean' ||\n (Array.isArray(styles) && styles.length === 0) ||\n (Object.keys(styles).length === 0 && styles.constructor === Object)\n ) {\n return;\n }\n\n await waitForFrame();\n\n if (Array.isArray(styles)) {\n styles.forEach(\n (style: { key: string; value: string }) =>\n (el.style[style.key] = style.value)\n );\n } else {\n Object.keys(styles).forEach((key) => (el.style[key] = styles[key]));\n }\n};\n\nexport const get = async (el: HTMLElement): Promise<CSSStyleDeclaration> => {\n await waitForFrame();\n\n return getComputedStyle(el, null);\n};\n","import { waitForFrame } from './wait';\n\nimport { PositionPropertiesType, PositionInputType } from '../types/position';\nimport { GetRecPropertiesInterface } from 'interfaces/position';\n\nexport const get_horizontal_center_of_els = (\n modifier: number,\n startRect: DOMRect,\n targetRect: DOMRect\n): number => modifier - startRect.width / 2 + targetRect.width / 2;\n\nexport const get_vertical_center_of_els = (\n modifier: number,\n startRect: DOMRect,\n targetRect: DOMRect\n): number => modifier - startRect.height / 2 + targetRect.height / 2;\n\nexport const offset = async (\n targetEl: HTMLElement\n): Promise<PositionPropertiesType> => {\n await waitForFrame();\n\n const _target_rect = targetEl.getBoundingClientRect();\n const _el_offset_top = _target_rect.top + window.pageYOffset;\n const _el_offset_left = _target_rect.left + window.pageXOffset;\n\n return {\n height: _target_rect.height,\n width: _target_rect.width,\n top: _el_offset_top,\n left: _el_offset_left\n };\n};\n\nexport const offsetWithCenter = async (\n sourceEl: HTMLElement,\n targetEl: HTMLElement\n): Promise<PositionPropertiesType> => {\n await waitForFrame();\n\n const _source_rect = sourceEl.getBoundingClientRect();\n const _target_rect = targetEl.getBoundingClientRect();\n const _el_offset_top = _target_rect.top + window.pageYOffset;\n const _el_offset_left = _target_rect.left + window.pageXOffset;\n\n return {\n height: _target_rect.height,\n width: _target_rect.width,\n top: get_vertical_center_of_els(_el_offset_top, _source_rect, _target_rect),\n left: get_horizontal_center_of_els(\n _el_offset_left,\n _source_rect,\n _target_rect\n )\n };\n};\n\nexport const getRec = async (\n sourceEl: HTMLElement,\n targetEl: HTMLElement\n): Promise<GetRecPropertiesInterface> => {\n await waitForFrame();\n\n const _source_rect = sourceEl.getBoundingClientRect();\n const _target_offset = await offset(targetEl);\n const _target_offset_center = await offsetWithCenter(sourceEl, targetEl);\n const _target_height = _target_offset.height;\n const _target_width = _target_offset.width;\n const _source_height = _source_rect.height;\n const _source_width = _source_rect.width;\n\n return {\n absolute: (): PositionPropertiesType => {\n return {\n top: _target_offset.top,\n left: _target_offset.left,\n height: _target_height,\n width: _target_width\n };\n },\n toTop: ({\n center = false,\n sourceHeight = _source_height,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: _target_offset.top + sourceHeight + modifier,\n left: center ? _target_offset_center.left : _target_offset.left,\n height: _target_height,\n width: _target_width\n };\n },\n\n fromTop: ({\n center = false,\n sourceHeight = _source_height,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: _target_offset.top - sourceHeight - modifier,\n left: center ? _target_offset_center.left : _target_offset.left,\n height: _target_height,\n width: _target_width\n };\n },\n\n toBottom: ({\n center = false,\n sourceHeight = _source_height,\n targetHeight = _target_height,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: _target_offset.top + targetHeight - (sourceHeight + modifier),\n left: center ? _target_offset_center.left : _target_offset.left,\n height: _target_height,\n width: _target_width\n };\n },\n fromBottom: ({\n center = false,\n targetHeight = _target_height,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: _target_offset.top + targetHeight + modifier,\n left: center ? _target_offset_center.left : _target_offset.left,\n height: _target_height,\n width: _target_width\n };\n },\n\n toLeft: ({\n center = false,\n sourceWidth = _source_width,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: center ? _target_offset_center.top : _target_offset.top,\n left: _target_offset.left + sourceWidth + modifier,\n height: _target_height,\n width: _target_width\n };\n },\n\n fromLeft: ({\n center = false,\n sourceWidth = _source_width,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: center ? _target_offset_center.top : _target_offset.top,\n left: _target_offset.left - sourceWidth - modifier,\n height: _target_height,\n width: _target_width\n };\n },\n\n toRight: ({\n center = false,\n sourceWidth = _source_width,\n targetWidth = _target_width,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: center ? _target_offset_center.top : _target_offset.top,\n left: _target_offset.left + targetWidth - (sourceWidth + modifier),\n height: _target_height,\n width: _target_width\n };\n },\n\n fromRight: ({\n center = false,\n targetWidth = _target_width,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: center ? _target_offset_center.top : _target_offset.top,\n left: _target_offset.left + targetWidth + modifier,\n height: _target_height,\n width: _target_width\n };\n }\n };\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport * as classnames from '../lib/classnames';\nimport * as css from '../lib/css';\nimport * as styles from '../lib/styles';\nimport * as helpers from '../helpers/spacing';\n\nexport const create = (text: string | number = '', tag = 'span') => {\n const _el = document.createElement(tag);\n const _text_content = document.createTextNode(text + '');\n\n _el.appendChild(_text_content);\n _el.setAttribute('title', text + 'px');\n classnames.set(_el, 'ph speccer spacing');\n\n return _el;\n};\n\nexport const element = async (targetEl: HTMLElement) => {\n if (!targetEl) return;\n\n const _target_styles = await styles.get(targetEl);\n\n if (\n _target_styles.display === 'none' ||\n _target_styles.opacity === '0' ||\n _target_styles.visibility === 'hidden'\n ) {\n return;\n }\n\n const _target_spacing_styles = css.getSpacing(_target_styles);\n const _target_pruned_spacing_styles = Object.keys(\n _target_spacing_styles\n ).filter((property) => {\n const _value = _target_spacing_styles[property];\n\n return _value !== '0px';\n });\n\n if (_target_pruned_spacing_styles.length === 0) return;\n\n _target_pruned_spacing_styles.forEach(async (property) => {\n const _value = css.getNumberValue(_target_spacing_styles[property]);\n const _speccer_el = create(_value);\n const _class_name = css.getClassNameFromCSSProperty(property);\n\n classnames.set(_speccer_el, _class_name);\n document.body.appendChild(_speccer_el);\n\n targetEl.classList.add('is-specced');\n await helpers.position(property, _value, _speccer_el, targetEl);\n });\n};\n","import * as styles from '../../lib/styles';\nimport { offset } from '../../lib/position';\nimport { waitForFrame } from '../../lib/wait';\n\nexport const position = async (\n property: string,\n value: number,\n spacingEl: HTMLElement,\n targetEl: HTMLElement\n) => {\n await waitForFrame();\n\n const _target_rect = targetEl.getBoundingClientRect();\n const _target_offset = await offset(targetEl);\n\n if (property === 'marginTop') {\n styles.add(spacingEl, {\n height: `${value}px`,\n width: _target_rect.width + 'px',\n left: _target_offset.left + 'px',\n top: _target_offset.top - value + 'px'\n });\n }\n\n if (property === 'marginRight') {\n styles.add(spacingEl, {\n height: _target_rect.height + 'px',\n width: `${value}px`,\n left: _target_offset.left + parseInt(_target_rect.width + '', 10) + 'px',\n top: _target_offset.top + 'px'\n });\n }\n\n if (property === 'marginBottom') {\n styles.add(spacingEl, {\n height: `${value}px`,\n width: _target_rect.width + 'px',\n left: _target_offset.left + 'px',\n top: _target_offset.top + parseInt(_target_rect.height + '', 10) + 'px'\n });\n }\n\n if (property === 'marginLeft') {\n styles.add(spacingEl, {\n height: _target_rect.height + 'px',\n width: `${value}px`,\n left: _target_offset.left - value + 'px',\n top: _target_offset.top + 'px'\n });\n }\n\n if (property === 'paddingTop') {\n styles.add(spacingEl, {\n height: `${value}px`,\n width: _target_rect.width + 'px',\n left: _target_offset.left + 'px',\n top: _target_offset.top + 'px'\n });\n }\n\n if (property === 'paddingBottom') {\n styles.add(spacingEl, {\n height: `${value}px`,\n width: _target_rect.width + 'px',\n left: _target_offset.left + 'px',\n top:\n _target_offset.top +\n (parseInt(_target_rect.height + '', 10) - value) +\n 'px'\n });\n }\n\n if (property === 'paddingRight') {\n styles.add(spacingEl, {\n height: _target_rect.height + 'px',\n width: `${value}px`,\n left:\n _target_offset.left +\n (parseInt(_target_rect.width + '', 10) - value) +\n 'px',\n top: _target_offset.top + 'px'\n });\n }\n\n if (property === 'paddingLeft') {\n styles.add(spacingEl, {\n height: _target_rect.height + 'px',\n width: `${value}px`,\n left: _target_offset.left + 'px',\n top: _target_offset.top + 'px'\n });\n }\n};\n","/******************************************************************************\r\nCopyright (c) Microsoft Corporation.\r\n\r\nPermission to use, copy, modify, and/or distribute this software for any\r\npurpose with or without fee is hereby granted.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\r\nREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY\r\nAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\r\nINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM\r\nLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR\r\nOTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR\r\nPERFORMANCE OF THIS SOFTWARE.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n if (typeof b !== \"function\" && b !== null)\r\n throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n t[p[i]] = s[p[i]];\r\n }\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (_) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport var __createBinding = Object.create ? (function(o, m, k, k2) {\r\n if (k2 === undefined) k2 = k;\r\n var desc = Object.getOwnPropertyDescriptor(m, k);\r\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\r\n desc = { enumerable: true, get: function() { return m[k]; } };\r\n }\r\n Object.defineProperty(o, k2, desc);\r\n}) : (function(o, m, k, k2) {\r\n if (k2 === undefined) k2 = k;\r\n o[k2] = m[k];\r\n});\r\n\r\nexport function __exportStar(m, o) {\r\n for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);\r\n}\r\n\r\nexport function __values(o) {\r\n var s = typeof Symbol === \"function\" && Symbol.iterator, m = s && o[s], i = 0;\r\n if (m) return m.call(o);\r\n if (o && typeof o.length === \"number\") return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n throw new TypeError(s ? \"Object is not iterable.\" : \"Symbol.iterator is not defined.\");\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spreadArrays() {\r\n for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;\r\n for (var r = Array(s), k = 0, i = 0; i < il; i++)\r\n for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)\r\n r[k] = a[j];\r\n return r;\r\n}\r\n\r\nexport function __spreadArray(to, from, pack) {\r\n if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\r\n if (ar || !(i in from)) {\r\n if (!ar) ar = Array.prototype.slice.call(from, 0, i);\r\n ar[i] = from[i];\r\n }\r\n }\r\n return to.concat(ar || Array.prototype.slice.call(from));\r\n}\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nvar __setModuleDefault = Object.create ? (function(o, v) {\r\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\r\n}) : function(o, v) {\r\n o[\"default\"] = v;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\r\n __setModuleDefault(result, mod);\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n\r\nexport function __classPrivateFieldGet(receiver, state, kind, f) {\r\n if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a getter\");\r\n if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot read private member from an object whose class did not declare it\");\r\n return kind === \"m\" ? f : kind === \"a\" ? f.call(receiver) : f ? f.value : state.get(receiver);\r\n}\r\n\r\nexport function __classPrivateFieldSet(receiver, state, value, kind, f) {\r\n if (kind === \"m\") throw new TypeError(\"Private method is not writable\");\r\n if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a setter\");\r\n if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot write private member to an object whose class did not declare it\");\r\n return (kind === \"a\" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;\r\n}\r\n\r\nexport function __classPrivateFieldIn(state, receiver) {\r\n if (receiver === null || (typeof receiver !== \"object\" && typeof receiver !== \"function\")) throw new TypeError(\"Cannot use 'in' operator on non-object\");\r\n return typeof state === \"function\" ? receiver === state : state.has(receiver);\r\n}\r\n","/* eslint no-console:0 */\n'use strict';\n\nexport const uniqueID = () => '_' + Math.random().toString(36).substring(2, 11);\n","/* eslint no-console:0 */\n'use strict';\n\nimport { waitForFrame } from './wait';\n\n/**\n * Returns the angle between two sets of coordinates\n *\n * See {@link https://stackoverflow.com/a/9614122/460422}\n * @param cx {number}\n * @param cy {number}\n * @param ex {number}\n * @param ey {number}\n * @param [normalize=true] {bool} If the angle output should be normalized to return value between 0° and 360°\n * @returns {number} The angle of the given coordinates\n */\nexport const angle = (\n cx: number,\n cy: number,\n ex: number,\n ey: number,\n normalize = true\n) => {\n if (!cx || !cy || !ex || !ey) {\n throw new SyntaxError('Missing input for `angle`');\n }\n\n if (\n typeof cx !== 'number' ||\n typeof cy !== 'number' ||\n typeof ex !== 'number' ||\n typeof ey !== 'number'\n ) {\n throw new TypeError(\n `Parameters for \\`angle\\` does not have required type. Requires number! Got: ${typeof cx} ${typeof cy} ${typeof ex} ${typeof ey}`\n );\n }\n\n const dy = ey - cy;\n const dx = ex - cx;\n\n let theta = Math.atan2(dy, dx); // range (-PI, PI]\n\n theta *= 180 / Math.PI; // rads to degs, range (-180, 180]\n\n if (normalize && theta < 0) theta = 360 + theta; // range [0, 360)\n\n return theta;\n};\n\nexport const coords = {\n top: (rect: DOMRect) => rect.top,\n right: (rect: DOMRect) => rect.left + rect.width,\n bottom: (rect: DOMRect) => rect.top + rect.height,\n left: (rect: DOMRect) => rect.left,\n center_x: (rect: DOMRect) => rect.left + rect.width / 2,\n center_y: (rect: DOMRect) => rect.top + rect.height / 2\n};\n\nexport const xy = {\n center: (rect: DOMRect) => ({\n x: coords.center_x(rect),\n y: coords.center_y(rect)\n }),\n top: (rect: DOMRect) => ({ x: coords.center_x(rect), y: coords.top(rect) }),\n right: (rect: DOMRect) => ({\n x: coords.right(rect),\n y: coords.center_y(rect)\n }),\n bottom: (rect: DOMRect) => ({\n x: coords.center_x(rect),\n y: coords.bottom(rect)\n }),\n left: (rect: DOMRect) => ({ x: coords.left(rect), y: coords.center_y(rect) }),\n 'right-top': (rect: DOMRect) => ({\n x: coords.right(rect),\n y: coords.top(rect)\n }),\n 'right-bottom': (rect: DOMRect) => ({\n x: coords.right(rect),\n y: coords.bottom(rect)\n }),\n 'left-top': (rect: DOMRect) => ({\n x: coords.left(rect),\n y: coords.top(rect)\n }),\n 'left-bottom': (rect: DOMRect) => ({\n x: coords.left(rect),\n y: coords.bottom(rect)\n }),\n 'top-left': (rect: DOMRect) => ({\n x: coords.left(rect),\n y: coords.top(rect)\n }),\n 'top-right': (rect: DOMRect) => ({\n x: coords.right(rect),\n y: coords.top(rect)\n }),\n 'bottom-left': (rect: DOMRect) => ({\n x: coords.left(rect),\n y: coords.bottom(rect)\n }),\n 'bottom-right': (rect: DOMRect) => ({\n x: coords.right(rect),\n y: coords.bottom(rect)\n }),\n 'top-center': (rect: DOMRect) => ({\n x: coords.center_x(rect),\n y: coords.top(rect)\n }),\n 'right-center': (rect: DOMRect) => ({\n x: coords.right(rect),\n y: coords.center_y(rect)\n }),\n 'bottom-center': (rect: DOMRect) => ({\n x: coords.center_x(rect),\n y: coords.bottom(rect)\n }),\n 'left-center': (rect: DOMRect) => ({\n x: coords.left(rect),\n y: coords.center_y(rect)\n })\n};\n\nexport const get_coords_pair_from_objects = async (\n el1: HTMLElement,\n el2: HTMLElement,\n pos1 = 'center',\n pos2 = 'center'\n) => {\n if (!el1 || !el2) {\n throw 'No element given';\n }\n\n const { x: x1, y: y1 } = await intrinsic_coords(el1, pos1);\n const { x: x2, y: y2 } = await intrinsic_coords(el2, pos2);\n\n return {\n x1,\n y1,\n x2,\n y2\n };\n};\n\nexport const intrinsic_coords = async (el: HTMLElement, pos = 'center') => {\n if (!pos) {\n throw 'No position given';\n }\n\n if (typeof pos !== 'string') {\n throw `The position given is not the required type: pos: ${typeof pos}`;\n }\n\n const _allowed_positions = [\n 'center',\n 'left',\n 'right',\n 'top',\n 'bottom',\n 'right-top',\n 'right-bottom',\n 'left-top',\n 'left-bottom',\n 'top-left',\n 'top-right',\n 'bottom-left',\n 'bottom-right',\n 'top-center',\n 'right-center',\n 'bottom-center',\n 'left-center'\n ];\n\n if (!_allowed_positions.includes(pos)) {\n throw `The position given does not match allowed positions to use! Valid positions are: ${_allowed_positions.join(\n ', '\n )}`;\n }\n\n await waitForFrame();\n\n const _el_rect = el.getBoundingClientRect();\n\n return xy[pos](_el_rect);\n};\n\nexport const direction_of_element = async ({ start, stop, crude = false }) => {\n const { x1, y1, x2, y2 } = await get_coords_pair_from_objects(start, stop);\n const _angle = angle(x1, y1, x2, y2);\n const _direction = crude\n ? cardinal_direction_crude(_angle)\n : cardinal_direction(_angle);\n\n return _direction;\n};\n\n/**\n * Gives you the cardinal direction based on degrees\n * Note! The degrees start at 0, which is EAST (orignally, north should be 0, but here, north is 270),\n * and we travel clockwise\n */\nexport const cardinal_direction = (degrees: number): string => {\n if (degrees > 360) throw RangeError('parameter cannot exceed 360');\n\n if (degrees < 0) throw RangeError('parameter cannot be lower than 0');\n\n if (degrees >= 0 && degrees <= 22.5) {\n return 'east';\n } else if (degrees >= 22.5 && degrees <= 67.5) {\n return 'south-east';\n } else if (degrees >= 67.5 && degrees <= 112.5) {\n return 'south';\n } else if (degrees >= 112.5 && degrees <= 157.5) {\n return 'south-west';\n } else if (degrees >= 157.5 && degrees <= 202.5) {\n return 'west';\n } else if (degrees >= 202.5 && degrees <= 247.5) {\n return 'north-west';\n } else if (degrees >= 247.5 && degrees <= 292.5) {\n return 'north';\n } else if (degrees >= 292.5 && degrees <= 337.5) {\n return 'north-east';\n } else {\n return 'east';\n }\n};\n\n/**\n * Note! The degrees start at 0, which is EAST (orignally, north should be 0, but here, north is 270),\n * and we travel clockwise\n */\nexport const cardinal_direction_crude = (degrees: number): string => {\n if (degrees > 360) throw RangeError('parameter cannot exceed 360');\n\n if (degrees < 0) throw RangeError('parameter cannot be lower than 0');\n\n if (degrees >= 45 && degrees <= 135) {\n return 'south';\n } else if (degrees > 135 && degrees <= 225) {\n return 'west';\n } else if (degrees > 225 && degrees <= 315) {\n return 'north';\n } else if (degrees > 315) {\n return 'east';\n } else {\n return 'east';\n }\n};\n","import {\n BezierPathOptions,\n CreateCoordinatesForCurveCoordParamType,\n CreateCoordinatesForCurveOptionsParamType,\n CurlyBezierPathOptions\n} from 'types/bezier';\nimport * as cardinal from './cardinal';\n\nexport const createCoordinatesForCurve = (\n coords: CreateCoordinatesForCurveCoordParamType,\n options: CreateCoordinatesForCurveOptionsParamType\n) => {\n const { x1, x2, y1, y2 } = coords;\n const { direct = false, firstSet = false, direction } = options;\n const firstPoint = { x: x1, y: y1 }; // The first point of line\n const lastPoint = { x: x2, y: y2 }; // The last point of line\n\n let firstControl = { x: x1 + (x2 - x1) / 2, y: y1 }; // Controller for p0\n let lastControl = { x: x1 + (x2 - x1) / 2, y: y2 }; // Controller for p1\n\n if (direct) {\n // first part of the curly bracket\n\n if (firstSet) {\n if (direction === 'west') {\n firstControl = { x: x1 - 32, y: y1 - 16 / 2 }; // Controller for p0\n lastControl = { x: x2 + 32, y: y2 }; // Controller for p1\n } else if (direction === 'south') {\n firstControl = { x: x1 - 16 / 2, y: y1 + 32 }; // Controller for p0\n lastControl = { x: x2, y: y2 - 32 }; // Controller for p1\n } else if (direction === 'east') {\n firstControl = { x: x1 + 32, y: y1 - 16 / 2 }; // Controller for p0\n lastControl = { x: x2 - 32, y: y2 }; // Controller for p1\n } else {\n firstControl = { x: x1 - 16 / 2, y: y1 - 32 }; // Controller for p0\n lastControl = { x: x2, y: y2 + 32 }; // Controller for p1\n }\n } else {\n if (direction === 'west') {\n firstControl = { x: x1 - 32, y: y1 + 16 / 2 }; // Controller for p0\n lastControl = { x: x2 + 32, y: y2 }; // Controller for p1\n } else if (direction === 'south') {\n firstControl = { x: x1 + 16 / 2, y: y1 + 32 }; // Controller for p0\n lastControl = { x: x2, y: y2 - 32 }; // Controller for p1\n } else if (direction === 'east') {\n firstControl = { x: x1 + 32, y: y1 + 16 / 2 }; // Controller for p0\n lastControl = { x: x2 - 32, y: y2 }; // Controller for p1\n } else {\n firstControl = { x: x1 + 16 / 2, y: y1 - 32 }; // Controller for p0\n lastControl = { x: x2, y: y2 + 32 }; // Controller for p1\n }\n }\n }\n\n return {\n firstPoint,\n firstControl,\n lastPoint,\n lastControl\n };\n};\n\nexport const getCurlySVGPath = async (\n startEl: HTMLElement,\n stopEl: HTMLElement,\n options: CurlyBezierPathOptions\n) => {\n const { pos1, pos2, firstSet = false, direction } = options;\n const { x1, y1, x2, y2 } = await cardinal.get_coords_pair_from_objects(\n startEl,\n stopEl,\n pos1,\n pos2\n );\n const x1modifier = 0;\n const y1modifier = 0;\n\n let x2modifier = 0;\n let y2modifier = 0;\n\n // make a gap between the pin and the bracket center\n if (direction == 'north') {\n y2modifier = 8;\n } else if (direction == 'west') {\n x2modifier = 8;\n } else if (direction == 'east') {\n x2modifier = -8;\n } else if (direction == 'south') {\n y2modifier = -8;\n }\n\n const _coordinates = createCoordinatesForCurve(\n {\n x1: x1 + x1modifier,\n x2: x2 + x2modifier,\n y1: y1 + y1modifier,\n y2: y2 + y2modifier\n },\n {\n direct: true,\n firstSet,\n direction\n }\n );\n const { firstPoint, firstControl, lastControl, lastPoint } = _coordinates;\n\n return (\n 'M ' +\n firstPoint.x +\n ' ' +\n firstPoint.y +\n 'C ' +\n firstControl.x +\n ' ' +\n firstControl.y +\n ', ' +\n lastControl.x +\n ' ' +\n lastControl.y +\n ', ' +\n lastPoint.x +\n ' ' +\n lastPoint.y\n );\n};\n\nexport const getSVGPath = async (\n startEl: HTMLElement,\n stopEl: HTMLElement,\n options: BezierPathOptions\n) => {\n const { pos1, pos2 } = options;\n const { x1, y1, x2, y2 } = await cardinal.get_coords_pair_from_objects(\n startEl,\n stopEl,\n pos1,\n pos2\n );\n const _coordinates = createCoordinatesForCurve(\n { x1, x2, y1, y2 },\n {\n direction: ''\n }\n );\n const { firstPoint, firstControl, lastControl, lastPoint } = _coordinates;\n\n return (\n 'M ' +\n firstPoint.x +\n ' ' +\n firstPoint.y +\n 'C ' +\n firstControl.x +\n ' ' +\n firstControl.y +\n ', ' +\n lastControl.x +\n ' ' +\n lastControl.y +\n ', ' +\n lastPoint.x +\n ' ' +\n lastPoint.y\n );\n};\n\nexport const getPositionsForSVGPath = (direction: string) => {\n let _pos1: string;\n let _pos2: string;\n\n switch (direction) {\n case 'east': {\n _pos1 = 'right';\n _pos2 = 'left';\n break;\n }\n case 'south': {\n _pos1 = 'bottom';\n _pos2 = 'top';\n break;\n }\n\n case 'west': {\n _pos1 = 'left';\n _pos2 = 'right';\n break;\n }\n case 'north':\n default: {\n _pos1 = 'top';\n _pos2 = 'bottom';\n break;\n }\n }\n\n return {\n pos1: _pos1,\n pos2: _pos2\n };\n};\n\nexport const getPositionsForCurlySVGPath = (direction: string) => {\n let _path1_pos1: string;\n let _path1_pos2: string;\n let _path2_pos1: string;\n let _path2_pos2: string;\n\n switch (direction) {\n case 'east': {\n _path1_pos1 = 'right-top';\n _path1_pos2 = 'left-center';\n _path2_pos1 = 'right-bottom';\n _path2_pos2 = 'left-center';\n break;\n }\n case 'south': {\n _path1_pos1 = 'bottom-left';\n _path1_pos2 = 'top-center';\n _path2_pos1 = 'bottom-right';\n _path2_pos2 = 'top-center';\n break;\n }\n case 'west': {\n _path1_pos1 = 'left-top';\n _path1_pos2 = 'right-center';\n _path2_pos1 = 'left-bottom';\n _path2_pos2 = 'right-center';\n break;\n }\n case 'north':\n default: {\n _path1_pos1 = 'top-left';\n _path1_pos2 = 'bottom-center';\n _path2_pos1 = 'top-right';\n _path2_pos2 = 'bottom-center';\n break;\n }\n }\n\n return {\n path1pos1: _path1_pos1,\n path1pos2: _path1_pos2,\n path2pos1: _path2_pos1,\n path2pos2: _path2_pos2\n };\n};\n","/* eslint-disable no-unused-vars */\n\nexport enum SpeccerAreaEnum {\n Empty = '',\n Left = 'left',\n Right = 'right',\n Bottom = 'bottom',\n Top = 'top',\n}\n\nexport enum DissectAreaEnum {\n Outline = 'outline',\n Enclose = 'enclose',\n Full = 'full',\n Left = 'left',\n Right = 'right',\n Bottom = 'bottom',\n Top = 'top',\n SVG = 'svg',\n Curly = 'curly',\n}\n\nexport enum MeasureAreaEnum {\n Width = 'width',\n Height = 'height',\n Left = 'left',\n Right = 'right',\n Bottom = 'bottom',\n Top = 'top',\n}\n","'use strict';\n\nimport { uniqueID } from '../id';\nimport * as cardinal from '../cardinal';\nimport { getPositionsForSVGPath, getSVGPath } from 'lib/bezier';\n\nexport class DrawSVGLine {\n #canvas: HTMLElement | SVGElement | null;\n #originalPathElement: HTMLElement | SVGPathElement | null;\n startElement: HTMLElement;\n stopElement: HTMLElement;\n line: SVGPathElement;\n\n constructor(startElement: HTMLElement, stopElement: HTMLElement) {\n this.#init(startElement, stopElement);\n }\n\n #init(startElement: HTMLElement, stopElement: HTMLElement) {\n if (!startElement || !stopElement) {\n throw 'Missing inputs startElement and stopElement';\n }\n\n if (!document.body.contains(stopElement)) {\n throw 'stopElement is not in the DOM';\n }\n\n if (!document.body.contains(startElement)) {\n throw 'startElement is not in the DOM';\n }\n\n this.startElement = startElement;\n this.stopElement = stopElement;\n\n this.#canvas = document.getElementById('ph-speccer-svg');\n this.#originalPathElement = document.getElementById('ph-speccer-path');\n\n if (!this.#originalPathElement || !this.#canvas) {\n throw 'Missing required SVG element to draw lines. Please see the documentation';\n }\n\n this.connect();\n }\n\n connect() {\n this.draw(this.#originalPathElement as SVGPathElement);\n }\n\n async draw(path: SVGPathElement) {\n if (!path) {\n throw 'No path given to draw!';\n }\n\n const _id = uniqueID();\n const _path_el_id = `ph_draw_path-path-${_id}`;\n const _new_path = path.cloneNode(false) as SVGPathElement;\n\n _new_path.setAttribute('id', _path_el_id);\n _new_path.setAttribute(\n 'data-start-el',\n this.startElement.getAttribute('id') || 'no-id-found'\n );\n _new_path.classList.remove('original');\n _new_path.classList.add('speccer');\n\n if (path.parentNode) {\n this.line = path.parentNode.insertBefore(_new_path, path.nextSibling);\n } else {\n throw 'No parentNode found for path';\n }\n\n const _direction = await cardinal.direction_of_element({\n start: this.startElement,\n stop: this.stopElement,\n crude: true\n });\n const { pos1, pos2 } = getPositionsForSVGPath(_direction);\n const _d = await getSVGPath(this.startElement, this.stopElement, {\n pos1,\n pos2\n });\n\n this.line.setAttribute('data-direction', _direction);\n this.line.setAttribute('data-pos1', pos1);\n this.line.setAttribute('data-pos2', pos2);\n\n this.line.setAttribute('d', _d); //svg attributes\n }\n}\n\nwindow.DrawSVGLine = DrawSVGLine;\n","'use strict';\n\nimport { uniqueID } from '../id';\nimport * as cardinal from '../cardinal';\nimport { getCurlySVGPath, getPositionsForCurlySVGPath } from 'lib/bezier';\n\nexport class DrawSVGCurlyBracket {\n #canvas: HTMLElement | SVGElement | null;\n #originalPathElement: HTMLElement | SVGPathElement | null;\n startElement: HTMLElement;\n stopElement: HTMLElement;\n firstPathElement: SVGPathElement;\n secondPathElement: SVGPathElement;\n\n constructor(startElement: HTMLElement, stopElement: HTMLElement) {\n this.#init(startElement, stopElement);\n }\n\n #init(startElement: HTMLElement, stopElement: HTMLElement) {\n if (!startElement || !stopElement) {\n throw 'Missing inputs startElement and stopElement';\n }\n\n if (!document.body.contains(stopElement)) {\n throw 'stopElement is not in the DOM';\n }\n\n if (!document.body.contains(startElement)) {\n throw 'startElement is not in the DOM';\n }\n\n this.startElement = startElement;\n this.stopElement = stopElement;\n\n this.#canvas = document.getElementById('ph-speccer-svg');\n this.#originalPathElement = document.getElementById('ph-speccer-path');\n\n if (!this.#originalPathElement || !this.#canvas) {\n throw 'Missing required SVG element to draw lines. Please see the documentation';\n }\n\n this.connect();\n }\n\n connect() {\n this.draw(this.#originalPathElement as SVGPathElement);\n }\n\n #getPathElement(path: SVGPathElement) {\n if (!path) {\n throw 'No path given to #getPathElement!';\n }\n\n const _id = uniqueID();\n const _path_el_id = `ph_draw_path-path-${_id}`;\n const _new_path = path.cloneNode(false) as SVGPathElement;\n\n _new_path.setAttribute(\n 'data-start-el',\n this.startElement.getAttribute('id') || 'no-id-found'\n );\n _new_path.setAttribute('id', _path_el_id);\n _new_path.classList.remove('original');\n _new_path.classList.add('speccer');\n\n return _new_path;\n }\n\n async draw(path: SVGPathElement) {\n if (!path) {\n throw 'No path given to draw!';\n }\n\n const _first_path_element = this.#getPathElement(path);\n const _second_path_element = this.#getPathElement(path);\n\n if (path.parentNode) {\n this.firstPathElement = path.parentNode.insertBefore(\n _first_path_element,\n path.nextSibling\n );\n this.secondPathElement = path.parentNode.insertBefore(\n _second_path_element,\n path.nextSibling\n );\n } else {\n throw 'No parentNode found for path';\n }\n\n const _direction = await cardinal.direction_of_element({\n stop: this.stopElement,\n start: this.startElement,\n crude: true\n });\n const { path1pos1, path1pos2, path2pos1, path2pos2 } =\n getPositionsForCurlySVGPath(_direction);\n const _first_path_d = await getCurlySVGPath(\n this.startElement,\n this.stopElement,\n {\n pos1: path1pos1,\n pos2: path1pos2,\n firstSet: true,\n direction: _direction\n }\n );\n const _second_path_d = await getCurlySVGPath(\n this.startElement,\n this.stopElement,\n {\n pos1: path2pos1,\n pos2: path2pos2,\n direction: _direction\n }\n );\n\n this.firstPathElement.setAttribute('data-direction', _direction);\n this.firstPathElement.setAttribute('data-pos1', path1pos1);\n this.firstPathElement.setAttribute('data-pos2', path1pos2);\n this.firstPathElement.setAttribute('d', _first_path_d); //svg attributes\n this.secondPathElement.setAttribute('data-direction', _direction);\n this.secondPathElement.setAttribute('data-pos1', path2pos1);\n this.secondPathElement.setAttribute('data-pos2', path2pos2);\n this.secondPathElement.setAttribute('d', _second_path_d); //svg attributes\n }\n}\n\nwindow.DrawSVGCurlyBracket = DrawSVGCurlyBracket;\n","import { DissectAreaEnum, MeasureAreaEnum } from 'enums/area';\n\nexport const getAreasFromString = (areaString: string): string[] =>\n areaString.split(' ');\n\nexport const isLeftArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(DissectAreaEnum.Left);\n};\n\nexport const isRightArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(DissectAreaEnum.Right);\n};\n\nexport const isTopArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(DissectAreaEnum.Top);\n};\n\nexport const isBottomArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(DissectAreaEnum.Bottom);\n};\n\nexport const isFullArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(DissectAreaEnum.Full);\n};\n\nexport const isEncloseArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(DissectAreaEnum.Enclose);\n};\n\nexport const isHeightArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(MeasureAreaEnum.Height);\n};\n\nexport const isWidthArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(MeasureAreaEnum.Width);\n};\n\nexport const useSVG = (areaString: string): boolean =>\n areaString.indexOf(DissectAreaEnum.Curly) === -1 &&\n areaString.indexOf(DissectAreaEnum.Full) === -1 &&\n areaString.indexOf(DissectAreaEnum.Enclose) === -1 &&\n areaString.indexOf(DissectAreaEnum.SVG) !== -1;\n\nexport const isCurly = (areaString: string): boolean =>\n areaString.indexOf(DissectAreaEnum.Full) !== -1 &&\n areaString.indexOf(DissectAreaEnum.Curly) !== -1;\n","import * as css from '../../lib/css';\nimport * as position from '../../lib/position';\nimport {\n isBottomArea,\n isEncloseArea,\n isFullArea,\n isLeftArea,\n isRightArea\n} from 'lib/area';\nimport { DissectStylesOptionsType } from 'types/bezier';\n\nexport const styles = async (\n area: string,\n targetEl: HTMLElement,\n dissectionEl: HTMLElement,\n options: DissectStylesOptionsType\n) => {\n const { isCurly } = options;\n const SPECCER_PIN_SPACE = css.pinSpace(dissectionEl);\n const SPECCER_MEASURE_SIZE = css.measureSize(dissectionEl);\n const _positional_styles = await position.getRec(dissectionEl, targetEl);\n\n if (isEncloseArea(area)) {\n const { left, top, height, width } = _positional_styles.absolute();\n\n return {\n left: `${left}px`,\n top: `${top}px`,\n height: `${height}px`,\n width: `${width}px`\n };\n }\n\n if (isLeftArea(area)) {\n if (isFullArea(area) && !isCurly) {\n const { left, top, height } = _positional_styles.fromLeft({\n sourceWidth: SPECCER_MEASURE_SIZE\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`,\n height: `${height}px`\n };\n } else {\n const { left, top } = _positional_styles.fromLeft({\n center: true,\n modifier: isCurly ? SPECCER_PIN_SPACE / 1.5 : SPECCER_PIN_SPACE\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`\n };\n }\n } else if (isRightArea(area)) {\n if (isFullArea(area) && !isCurly) {\n const { left, top, height } = _positional_styles.fromRight({\n center: false\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`,\n height: `${height}px`\n };\n } else {\n const { left, top } = _positional_styles.fromRight({\n center: true,\n modifier: isCurly ? SPECCER_PIN_SPACE / 1.5 : SPECCER_PIN_SPACE\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`\n };\n }\n } else if (isBottomArea(area)) {\n if (isFullArea(area) && !isCurly) {\n const { left, top, width } = _positional_styles.fromBottom({\n center: false\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`,\n width: `${width}px`\n };\n } else {\n const { left, top } = _positional_styles.fromBottom({\n center: true,\n modifier: isCurly ? SPECCER_PIN_SPACE / 1.5 : SPECCER_PIN_SPACE\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`\n };\n }\n } else {\n if (isFullArea(area) && !isCurly) {\n const { left, top, width } = _positional_styles.fromTop({\n center: false\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`,\n width: `${width}px`\n };\n } else {\n const { left, top } = _positional_styles.fromTop({\n center: true,\n modifier: isCurly ? SPECCER_PIN_SPACE / 1.5 : SPECCER_PIN_SPACE\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`\n };\n }\n }\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport * as styles from '../lib/styles';\nimport { DrawSVGLine, DrawSVGCurlyBracket } from '../lib/classes';\nimport * as classnames from '../lib/classnames';\nimport { DissectAreaEnum } from '../enums/area';\nimport * as helpers from '../helpers/dissect';\nimport { SPECCER_LITERALS } from '../lib/constants';\nimport { isCurly, isEncloseArea, isFullArea, useSVG } from 'lib/area';\n\nexport const create = (textContent = '', area: string, n = 'span') => {\n const _el = document.createElement(n);\n const _text_node = document.createTextNode(textContent);\n const _extra_class_names = {};\n\n if (area !== null && area !== '') {\n _extra_class_names[area] = true;\n }\n\n if (\n (!isFullArea(area) && !isEncloseArea(area)) ||\n (isFullArea(area) && isCurly(area))\n ) {\n _el.appendChild(_text_node);\n } else if (isFullArea(area) || isEncloseArea(area)) {\n _el.setAttribute('data-dissection-counter', textContent);\n }\n\n const _class_names = classnames.cx(\n 'ph speccer dissection',\n _extra_class_names\n );\n\n classnames.set(_el, _class_names);\n\n return _el;\n};\n\nexport const element = (sectionEl: HTMLElement) => {\n if (!sectionEl) return;\n\n const _dissection_els = sectionEl.querySelectorAll('[data-anatomy]');\n\n if (_dissection_els) {\n let _index_to_use = 0;\n\n _dissection_els.forEach(async (targetEl: HTMLElement, targetIndex) => {\n if (!targetEl) return Promise.resolve();\n\n const _areas_string: string = targetEl.getAttribute('data-anatomy') || '';\n\n if (\n !_areas_string ||\n _areas_string === '' ||\n _areas_string.indexOf(DissectAreaEnum.Outline) === -1\n )\n return;\n\n /**\n * If we're running out of literals to use,\n * make a new one with uppercase and lower case pairs\n */\n let _literal_to_use = SPECCER_LITERALS[targetIndex];\n\n if (!_literal_to_use) {\n _literal_to_use = `${SPECCER_LITERALS[_index_to_use]}${SPECCER_LITERALS[\n _index_to_use\n ].toLowerCase()}`;\n _index_to_use++;\n }\n\n const _dissection_el = create(_literal_to_use, _areas_string);\n\n document.body.appendChild(_dissection_el);\n\n const _dissection_styles = await helpers.styles(\n _areas_string,\n targetEl,\n _dissection_el,\n {\n isCurly: isCurly(_areas_string)\n }\n );\n\n await styles.add(_dissection_el, _dissection_styles);\n\n if (useSVG(_areas_string)) {\n new DrawSVGLine(targetEl, _dissection_el);\n } else if (isCurly(_areas_string)) {\n new DrawSVGCurlyBracket(targetEl, _dissection_el);\n }\n });\n }\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport { isBottomArea, isHeightArea, isRightArea, isWidthArea } from 'lib/area';\nimport * as classnames from '../lib/classnames';\nimport * as styles from '../lib/styles';\nimport { waitForFrame } from '../lib/wait';\nimport * as position from '../lib/position';\nimport { SPECCER_DEFAULT_MEASURE_SIZE_NEG } from 'lib/constants';\n\nconst create = (\n text: string | number = '',\n area: string | null = '',\n tag = 'span'\n) => {\n const _el = document.createElement(tag);\n\n _el.setAttribute('title', text + 'px');\n _el.setAttribute('data-measure', parseInt(text + '', 10) + 'px');\n\n classnames.set(_el, `ph speccer measure ${area}`);\n\n return _el;\n};\n\nexport const element = async (targetEl: HTMLElement) => {\n if (!targetEl) return;\n\n const _areas_string: string | null = targetEl.getAttribute(\n 'data-speccer-measure'\n );\n\n if (_areas_string === '' || !_areas_string) {\n return;\n }\n\n const _target_styles = await styles.get(targetEl);\n\n if (\n _target_styles.display === 'none' ||\n _target_styles.opacity === '0' ||\n _target_styles.visibility === 'hidden'\n ) {\n return;\n }\n\n await waitForFrame();\n\n const _target_rect = targetEl.getBoundingClientRect();\n\n if (isWidthArea(_areas_string)) {\n if (isBottomArea(_areas_string)) {\n const _measure_el = create(_target_rect.width, _areas_string);\n\n document.body.appendChild(_measure_el);\n\n const _positional_styles = await position.getRec(_measure_el, targetEl);\n const { left, top, width } = _positional_styles.fromBottom({\n center: false\n });\n\n await styles.add(_measure_el, {\n left: `${left}px`,\n top: `${top}px`,\n width: `${width}px`\n });\n } else {\n const _measure_el = create(_target_rect.width, _areas_string);\n\n document.body.appendChild(_measure_el);\n\n const _positional_styles = await position.getRec(_measure_el, targetEl);\n const { left, top, width } = _positional_styles.fromTop({\n center: false,\n modifier: SPECCER_DEFAULT_MEASURE_SIZE_NEG\n });\n\n await styles.add(_measure_el, {\n left: `${left}px`,\n top: `${top}px`,\n width: `${width}px`\n });\n }\n } else if (isHeightArea(_areas_string)) {\n if (isRightArea(_areas_string)) {\n const _measure_el = create(_target_rect.height, _areas_string);\n\n document.body.appendChild(_measure_el);\n\n const _positional_styles = await position.getRec(_measure_el, targetEl);\n const { left, top, height } = _positional_styles.fromRight({\n center: false\n });\n\n await styles.add(_measure_el, {\n left: `${left}px`,\n top: `${top}px`,\n height: `${height}px`\n });\n } else {\n const _measure_el = create(_target_rect.height, _areas_string);\n\n document.body.appendChild(_measure_el);\n\n const _positional_styles = await position.getRec(_measure_el, targetEl);\n const { left, top, height } = _positional_styles.fromLeft({\n center: false,\n modifier: SPECCER_DEFAULT_MEASURE_SIZE_NEG\n });\n\n await styles.add(_measure_el, {\n left: `${left}px`,\n top: `${top}px`,\n height: `${height}px`\n });\n }\n }\n};\n","/* eslint no-console:0 */\n'use strict';\n\nexport const decimal = (number: string | number, decimals = 3): string =>\n parseFloat(number + '').toFixed(decimals);\n","/* eslint no-console:0 */\n'use strict';\n\nimport * as classnames from '../lib/classnames';\nimport * as styles from '../lib/styles';\nimport * as helpers from '../helpers/typography';\n\nexport const create = (html: string, area: string | null) => {\n const _el = document.createElement('div');\n const _extra_class_names = {};\n\n if (area !== null && area !== '') {\n _extra_class_names[area] = true;\n }\n\n const _class_names = classnames.cx(\n 'ph speccer typography',\n _extra_class_names\n );\n\n _el.innerHTML = html;\n\n classnames.set(_el, _class_names);\n\n return _el;\n};\n\nexport const element = async (targetEl: HTMLElement) => {\n if (!targetEl) return;\n\n const _area: string | null = targetEl.getAttribute('data-speccer-typography');\n const _target_styles = await styles.get(targetEl);\n\n if (\n _target_styles.display === 'none' ||\n _target_styles.opacity === '0' ||\n _target_styles.visibility === 'hidden'\n ) {\n return;\n }\n\n targetEl.classList.add('is-specced');\n\n const _html = await helpers.template(targetEl);\n const _speccer_el = create(_html, _area);\n\n document.body.appendChild(_speccer_el);\n\n const _position = await helpers.position(_area, targetEl, _speccer_el);\n\n styles.add(_speccer_el, _position);\n};\n","/* eslint @typescript-eslint/no-explicit-any: [\"error\", { \"fixToUnknown\": true }] */\n'use strict';\n\nimport { DebounceAnyFunctionType } from 'types/debounce';\n\nconst debounce = function (\n func: DebounceAnyFunctionType,\n wait: number,\n immediate?: boolean\n): DebounceAnyFunctionType {\n let timeout: null | ReturnType<typeof setTimeout>;\n\n return function (context: unknown, ...args: unknown[]) {\n const later = function () {\n timeout = null;\n\n if (!immediate) func.apply(context, args);\n };\n const callNow = immediate && !timeout;\n\n if (timeout) {\n clearTimeout(timeout);\n }\n\n timeout = setTimeout(later, wait);\n\n if (callNow) func.apply(context, args);\n };\n};\n\nexport default debounce;\n","'use strict';\n\nimport { SpeccerFunctionType } from 'types/speccer';\n\nimport debounce from './debounce';\n\nexport const activate = (speccer: SpeccerFunctionType) => {\n const speccerEventFunc = () =>\n debounce(() => {\n speccer();\n }, 300);\n\n window.removeEventListener('resize', speccerEventFunc);\n window.addEventListener('resize', speccerEventFunc);\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport { SpeccerFunctionType } from 'types/speccer';\n\nimport * as resize from './lib/resize';\n\nimport * as spec from './tasks/spec';\nimport * as measure from './tasks/measure';\nimport * as dissect from './tasks/dissect';\n\nexport const dom = (speccer: SpeccerFunctionType) => {\n if (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', () => {\n speccer();\n });\n } else {\n // `DOMContentLoaded` already fired\n speccer();\n }\n};\n\nexport const lazy = () => {\n const _spec_observer = new IntersectionObserver((els, observer) => {\n els.forEach((el: IntersectionObserverEntry) => {\n if (el.intersectionRatio > 0) {\n spec.element(el.target as HTMLElement);\n observer.unobserve(el.target);\n }\n });\n });\n\n document\n .querySelectorAll(\n '[data-speccer],[data-speccer] *:not(td):not(tr):not(th):not(tfoot):not(thead):not(tbody)'\n )\n .forEach((el) => {\n _spec_observer.observe(el);\n });\n\n const _measure_observer = new IntersectionObserver((els, observer) => {\n els.forEach((el) => {\n if (el.intersectionRatio > 0) {\n measure.element(el.target as HTMLElement);\n observer.unobserve(el.target);\n }\n });\n });\n\n document.querySelectorAll('[data-speccer-measure]').forEach((el) => {\n _measure_observer.observe(el);\n });\n\n const _dissect_observer = new IntersectionObserver((els, observer) => {\n els.forEach((el) => {\n if (el.intersectionRatio > 0) {\n dissect.element(el.target as HTMLElement);\n observer.unobserve(el.target);\n }\n });\n });\n\n document.querySelectorAll('[data-anatomy-section]').forEach((el) => {\n _dissect_observer.observe(el);\n });\n};\n\nexport const manual = (speccer: SpeccerFunctionType) => {\n window.speccer = speccer;\n};\n\nexport const activate = (speccer: SpeccerFunctionType) => {\n const _script = document.currentScript;\n\n if (_script) {\n const _speccer_script_src = _script.getAttribute('src');\n\n if (\n _speccer_script_src &&\n (_speccer_script_src.indexOf('speccer.js') !== -1 ||\n // for codepen\n _speccer_script_src.indexOf('JaXpOK.js') !== -1)\n ) {\n if (_script.hasAttribute('data-manual')) {\n manual(speccer);\n } else if (_script.hasAttribute('data-instant')) {\n speccer();\n } else if (_script.hasAttribute('data-dom')) {\n dom(speccer);\n } else if (_script.hasAttribute('data-lazy')) {\n lazy();\n } else {\n dom(speccer);\n }\n\n if (\n !_script.hasAttribute('data-manual') &&\n !_script.hasAttribute('data-lazy')\n ) {\n resize.activate(speccer);\n }\n }\n }\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport './interfaces/global';\nimport * as node from './lib/node';\nimport * as __spacing from './tasks/spec';\nimport * as __dissect from './tasks/dissect';\nimport * as __measure from './tasks/measure';\nimport * as __typography from './tasks/typography';\nimport * as browser from './browser';\n\nexport const spacing = __spacing;\n\nexport const dissect = __dissect;\n\nexport const measure = __measure;\n\nexport const typography = __typography;\n\nexport const modes = browser;\n\nconst speccer = () => {\n node.removeAll('.speccer');\n\n const _els_to_be_specced = document.querySelectorAll(\n '[data-speccer],[data-speccer] *:not(td):not(tr):not(th):not(tfoot):not(thead):not(tbody)'\n );\n const _els_to_be_measured = document.querySelectorAll(\n '[data-speccer-measure]'\n );\n const _els_to_be_typography_specced = document.querySelectorAll(\n '[data-speccer-typography]'\n );\n const _els_to_be_dissected = document.querySelectorAll(\n '[data-anatomy-section]'\n );\n\n _els_to_be_specced.forEach(spacing.element);\n _els_to_be_measured.forEach(measure.element);\n _els_to_be_typography_specced.forEach(typography.element);\n _els_to_be_dissected.forEach(dissect.element);\n};\n\nexport default speccer;\n\nbrowser.activate(speccer);\n","import * as css from '../../lib/css';\nimport * as styles from '../../lib/styles';\n\nexport const template = async (targetEl: HTMLElement): Promise<string> => {\n const _target_styles = await styles.get(targetEl);\n const _styles = css.getTypography(_target_styles);\n const _line_height =\n _styles['lineHeight'] !== 'normal'\n ? parseInt(_styles['lineHeight'], 10) / 16 + 'rem'\n : 'normal';\n\n return (\n `\n` +\n 'font-styles: {' +\n '<ul class=\"speccer-styles\">' +\n ` <li><span class=\"property\">font-family:</span> ${_styles['fontFamily']};</li>` +\n ` <li><span class=\"property\">font-size:</span> ${_styles['fontSize']} / ${\n parseInt(_styles['fontSize'], 10) / 16\n }rem;</li>` +\n ` <li><span class=\"property\">font-weight:</span> ${_styles['fontWeight']};</li>` +\n ` <li><span class=\"property\">font-variation-settings:</span> ${_styles['fontVariationSettings']};</li>` +\n ` <li><span class=\"property\">line-height:</span> ${_styles['lineHeight']} / ${_line_height};</li>` +\n ` <li><span class=\"property\">letter-spacing:</span> ${_styles['letterSpacing']};</li>` +\n ` <li><span class=\"property\">font-style:</span> ${_styles['fontStyle']};</li>` +\n '</ul>' +\n '}'\n );\n};\n","import * as css from '../../lib/css';\nimport * as number from '../../lib/number';\nimport {\n get_horizontal_center_of_els,\n get_vertical_center_of_els,\n offset\n} from '../../lib/position';\nimport { SpeccerAreaEnum } from '../../enums/area';\n\nexport const position = async (\n area: string | null,\n targetEl: HTMLElement,\n speccerEl: HTMLElement\n) => {\n const _target_rect = targetEl.getBoundingClientRect();\n const SPECCER_PIN_SPACE = css.pinSpace(speccerEl);\n const _speccer_el_rect = speccerEl.getBoundingClientRect();\n const _el_offset = await offset(targetEl);\n const _left_layout_position_left =\n _el_offset.left - _speccer_el_rect.width - SPECCER_PIN_SPACE + 'px';\n const _left_layout_position_top =\n number.decimal(\n get_vertical_center_of_els(_el_offset.top, _speccer_el_rect, _target_rect)\n ) + 'px';\n const _right_layout_position_left =\n _el_offset.left + _target_rect.width + SPECCER_PIN_SPACE + 'px';\n const _right_layout_position_top =\n number.decimal(\n get_vertical_center_of_els(_el_offset.top, _speccer_el_rect, _target_rect)\n ) + 'px';\n const _top_layout_position_left =\n number.decimal(\n get_horizontal_center_of_els(\n _el_offset.left,\n _speccer_el_rect,\n _target_rect\n )\n ) + 'px';\n const _top_layout_position_top =\n _el_offset.top - _speccer_el_rect.height - SPECCER_PIN_SPACE + 'px';\n const _bottom_layout_position_left =\n number.decimal(\n get_horizontal_center_of_els(\n _el_offset.left,\n _speccer_el_rect,\n _target_rect\n )\n ) + 'px';\n const _bottom_layout_position_top =\n _el_offset.top + _target_rect.height + SPECCER_PIN_SPACE + 'px';\n\n let _position = {\n left: _left_layout_position_left,\n top: _left_layout_position_top\n };\n\n if (area && area.indexOf(SpeccerAreaEnum.Right) !== -1) {\n _position = {\n left: _right_layout_position_left,\n top: _right_layout_position_top\n };\n } else if (area && area.indexOf(SpeccerAreaEnum.Top) !== -1) {\n _position = {\n left: _top_layout_position_left,\n top: _top_layout_position_top\n };\n } else if (area && area.indexOf(SpeccerAreaEnum.Bottom) !== -1) {\n _position = {\n left: _bottom_layout_position_left,\n top: _bottom_layout_position_top\n };\n }\n\n return _position;\n};\n"],"names":["set","el","cls","avoid","length","trim","split","filter","cl","forEach","classList","add","cx","cls_obj","Object","keys","classname","join","SPECCER_LITERALS","getNumberValue","value","parseInt","pinSpace","getComputedStyle","getPropertyValue","waitForFrame","Promise","requestAnimationFrame","async","styles","Array","isArray","constructor","style","key","get","get_horizontal_center_of_els","modifier","startRect","targetRect","width","get_vertical_center_of_els","height","offset","targetEl","_target_rect","getBoundingClientRect","_el_offset_top","top","window","pageYOffset","_el_offset_left","left","pageXOffset","getRec","sourceEl","_source_rect","_target_offset","_target_offset_center","offsetWithCenter","_target_height","_target_width","_source_height","_source_width","absolute","toTop","center","sourceHeight","fromTop","toBottom","targetHeight","fromBottom","toLeft","sourceWidth","fromLeft","toRight","targetWidth","fromRight","create","text","tag","_el","document","createElement","_text_content","createTextNode","appendChild","setAttribute","classnames.set","element","_target_styles","styles.get","display","opacity","visibility","_target_spacing_styles","marginTop","marginBottom","marginLeft","marginRight","paddingTop","paddingBottom","paddingLeft","paddingRight","css.getSpacing","_target_pruned_spacing_styles","property","_value","css.getNumberValue","_speccer_el","_class_name","indexOf","replace","css.getClassNameFromCSSProperty","body","spacingEl","styles.add","helpers.position","__classPrivateFieldGet","receiver","state","kind","f","TypeError","has","call","__classPrivateFieldSet","uniqueID","Math","random","toString","substring","coords","rect","xy","x","y","right","bottom","get_coords_pair_from_objects","el1","el2","pos1","pos2","x1","y1","intrinsic_coords","x2","y2","pos","_allowed_positions","includes","_el_rect","direction_of_element","start","stop","crude","_angle","cy","ex","ey","normalize","SyntaxError","dy","dx","theta","atan2","PI","angle","cardinal_direction_crude","cardinal_direction","degrees","RangeError","createCoordinatesForCurve","options","direct","firstSet","direction","firstControl","lastControl","firstPoint","lastPoint","getCurlySVGPath","startEl","stopEl","cardinal.get_coords_pair_from_objects","x2modifier","y2modifier","_coordinates","SpeccerAreaEnum","DissectAreaEnum","MeasureAreaEnum","DrawSVGLine","startElement","stopElement","_DrawSVGLine_canvas","this","_DrawSVGLine_originalPathElement","connect","draw","path","_path_el_id","_new_path","cloneNode","getAttribute","remove","parentNode","line","insertBefore","nextSibling","_direction","cardinal.direction_of_element","_pos1","_pos2","getPositionsForSVGPath","_d","getSVGPath","WeakMap","_DrawSVGLine_instances","WeakSet","_DrawSVGLine_init","contains","getElementById","DrawSVGCurlyBracket","_DrawSVGCurlyBracket_canvas","_DrawSVGCurlyBracket_originalPathElement","_first_path_element","_DrawSVGCurlyBracket_instances","_DrawSVGCurlyBracket_getPathElement","_second_path_element","firstPathElement","secondPathElement","path1pos1","path1pos2","path2pos1","path2pos2","_path1_pos1","_path1_pos2","_path2_pos1","_path2_pos2","getPositionsForCurlySVGPath","_first_path_d","_second_path_d","_DrawSVGCurlyBracket_init","getAreasFromString","areaString","isRightArea","Right","isBottomArea","Bottom","isFullArea","Full","isEncloseArea","Enclose","isCurly","Curly","area","dissectionEl","SPECCER_PIN_SPACE","css.pinSpace","SPECCER_MEASURE_SIZE","_positional_styles","position.getRec","Left","textContent","n","_text_node","_extra_class_names","_class_names","classnames.cx","sectionEl","_dissection_els","querySelectorAll","_index_to_use","targetIndex","resolve","_areas_string","Outline","_literal_to_use","toLowerCase","_dissection_el","_dissection_styles","helpers.styles","SVG","Width","_measure_el","SPECCER_DEFAULT_MEASURE_SIZE","Height","isHeightArea","decimal","number","decimals","parseFloat","toFixed","html","innerHTML","activate","speccer","speccerEventFunc","func","wait","immediate","timeout","context","args","callNow","clearTimeout","setTimeout","apply","debounce","removeEventListener","addEventListener","dom","readyState","lazy","_spec_observer","IntersectionObserver","els","observer","intersectionRatio","spec.element","target","unobserve","observe","_measure_observer","measure.element","_dissect_observer","dissect.element","manual","_script","currentScript","_speccer_script_src","hasAttribute","resize.activate","spacing","__spacing","dissect","measure","typography","_area","_html","_styles","lineHeight","letterSpacing","fontFamily","fontSize","fontStyle","fontVariationSettings","fontWeight","css.getTypography","_line_height","helpers.template","_position","speccerEl","_speccer_el_rect","_el_offset","_left_layout_position_left","_left_layout_position_top","number.decimal","_right_layout_position_left","_right_layout_position_top","_top_layout_position_left","_top_layout_position_top","_bottom_layout_position_left","_bottom_layout_position_top","Top","modes","selector","e","node.removeAll","_els_to_be_specced","_els_to_be_measured","_els_to_be_typography_specced","_els_to_be_dissected"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"speccer.js","sources":["src/utils/node.ts","src/utils/classnames.ts","src/utils/constants.ts","src/utils/css.ts","src/utils/wait.ts","src/utils/styles.ts","src/utils/position.ts","src/features/spacing/index.ts","src/features/spacing/utils/position.ts","src/types/enums/area.ts","src/utils/area.ts","node_modules/tslib/tslib.es6.js","src/utils/id.ts","src/utils/coords.ts","src/utils/xy.ts","src/utils/intrinsic-coords.ts","src/utils/get-coords-pair-from-objects.ts","src/utils/bezier.ts","src/utils/direction-of-element.ts","src/utils/angle.ts","src/utils/cardinal.ts","src/utils/classes/DrawSVGLine.ts","src/utils/classes/DrawSVGCurlyBracket.ts","src/features/dissect/utils/styles.ts","src/features/dissect/index.ts","src/features/measure/index.ts","src/features/mark/index.ts","src/utils/number.ts","src/features/typography/index.ts","src/utils/debounce.ts","src/utils/resize.ts","src/config/browser.ts","src/main.ts","src/features/typography/utils/template.ts","src/features/typography/utils/position.ts"],"sourcesContent":["/**\n * Inserts an HTML element after another element in the DOM.\n *\n * @param {HTMLElement | null} el - The reference element after which the new element will be inserted.\n * @param {HTMLElement} newSibling - The new element to be inserted.\n * @returns {Element|null}\n *\n * @example\n * // Insert an element after another element\n * const referenceElement = document.getElementById('reference-element');\n * const newElement = document.createElement('div');\n * after(referenceElement, newElement);\n */\nexport const after = (\n el: HTMLElement | null,\n newSibling: HTMLElement\n): Element | null => el && el.insertAdjacentElement('afterend', newSibling);\n\n/**\n * Removes all elements matching a selector from the DOM.\n *\n * @param {string} selector - The CSS selector used to select elements for removal.\n * @param {Document} el - The document context (default is the global `document` object).\n * @returns {void}\n *\n * @example\n * // Remove all elements with a specific class from the document\n * removeAll('.my-class');\n */\nexport const removeAll = (selector: string, el: Document = document): void => {\n [].forEach.call(el.querySelectorAll(selector), function (e: HTMLElement) {\n e.remove();\n });\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport { ClassNamesObjectMapInterface } from 'types/interfaces/classnames';\n\n/**\n * Add CSS classes to an HTML element.\n *\n * @param {HTMLElement} el - The HTML element to which classes should be added.\n * @param {string} cls - The CSS classes to add, separated by spaces.\n * @param {string} [avoid='noop'] - Classes to avoid adding.\n * @returns {void}\n * @example\n * // Add classes to an HTML element\n * const element = document.getElementById('example');\n * set(element, 'class1 class2');\n */\nexport const set = (el: HTMLElement, cls: string, avoid = 'noop') => {\n if (!el) return;\n\n if (!cls || (cls && cls.length === 0)) return;\n\n cls\n .trim()\n .split(' ')\n .filter((cl) => cl !== avoid)\n .forEach((cl) => el.classList.add(cl));\n};\n\n/**\n * Toggle CSS classes on an HTML element.\n *\n * @param {HTMLElement} el - The HTML element on which classes should be toggled.\n * @param {string} cls - The CSS classes to toggle, separated by spaces.\n * @param {string} [avoid='noop'] - Classes to avoid toggling.\n * @returns {void}\n * @example\n * // Toggle classes on an HTML element\n * const element = document.getElementById('example');\n * toggle(element, 'class1 class2');\n */\nexport const toggle = (el: HTMLElement, cls: string, avoid = 'noop') => {\n if (!el) return;\n\n if (!cls || (cls && cls.length === 0)) return;\n\n cls\n .trim()\n .split(' ')\n .filter((cl) => cl !== avoid)\n .forEach((cl) => el.classList.toggle(cl));\n};\n\n/**\n * Remove CSS classes from an HTML element.\n *\n * @param {HTMLElement} el - The HTML element from which classes should be removed.\n * @param {string} cls - The CSS classes to remove, separated by spaces.\n * @param {string} [avoid='noop'] - Classes to avoid removing.\n * @returns {void}\n * @example\n * // Remove classes from an HTML element\n * const element = document.getElementById('example');\n * remove(element, 'class1 class2');\n */\nexport const remove = (el: HTMLElement, cls: string, avoid = 'noop') => {\n if (!el) return;\n\n if (!cls || (cls && cls.length === 0)) return;\n\n cls\n .trim()\n .split(' ')\n .filter((cl) => cl !== avoid)\n .forEach((cl) => el.classList.remove(cl));\n};\n\n/**\n * Generate CSS classes from a string and an object.\n *\n * @param {string} cls - Additional CSS classes as a string.\n * @param {ClassNamesObjectMapInterface} cls_obj - A mapping of class names to boolean values.\n * @returns {string} - A space-separated string of CSS class names.\n * @example\n * // Generate CSS classes from a string and an object\n * const classNames = cx('class1', { class2: true, class3: false });\n * console.log(classNames); // Example output: 'class1 class2'\n */\nexport const cx = (\n cls: string,\n cls_obj?: ClassNamesObjectMapInterface\n): string => {\n if (!cls) return '';\n\n if (!cls_obj && typeof cls !== 'string') {\n return `${Object.keys(cls)\n .filter((classname) => cls[classname])\n .join(' ')}`.trim();\n }\n\n return `${cls} ${\n cls_obj\n ? Object.keys(cls_obj)\n .filter((classname) => cls_obj[classname])\n .join(' ')\n : ''\n }`.trim();\n};\n","/* eslint no-console:0 */\n'use strict';\n\n/**\n * Array of uppercase letters.\n *\n * @type {string[]}\n * @example\n * // Access the array of uppercase letters\n * const letters = SPECCER_LITERALS;\n * console.log(letters); // Example output: ['A', 'B', 'C', ...]\n */\nexport const SPECCER_LITERALS = [...'ABCDEFGHIJKLMNOPQRSTUVWXYZ'];\n\n/**\n * Array of HTML tags to avoid when processing.\n *\n * @type {string[]}\n * @example\n * // Access the array of tags to avoid\n * const tagsToAvoid = SPECCER_TAGS_TO_AVOID;\n * console.log(tagsToAvoid); // Example output: ['TR', 'TH', 'TD', ...]\n */\nexport const SPECCER_TAGS_TO_AVOID = [\n 'TR',\n 'TH',\n 'TD',\n 'TBODY',\n 'THEAD',\n 'TFOOT'\n];\n\n/**\n * Default value for pin space.\n *\n * @type {number}\n * @example\n * // Access the default pin space value\n * const defaultPinSpace = SPECCER_DEFAULT_PIN_SPACE;\n * console.log(defaultPinSpace); // Example output: 48\n */\nexport const SPECCER_DEFAULT_PIN_SPACE = 48;\n\n/**\n * Negative default value for pin space.\n *\n * @type {number}\n * @example\n * // Access the negative default pin space value\n * const negativeDefaultPinSpace = SPECCER_DEFAULT_PIN_SPACE_NEG;\n * console.log(negativeDefaultPinSpace); // Example output: -48\n */\nexport const SPECCER_DEFAULT_PIN_SPACE_NEG = SPECCER_DEFAULT_PIN_SPACE * -1;\n\n/**\n * Default value for measure size.\n *\n * @type {number}\n * @example\n * // Access the default measure size value\n * const defaultMeasureSize = SPECCER_DEFAULT_MEASURE_SIZE;\n * console.log(defaultMeasureSize); // Example output: 8\n */\nexport const SPECCER_DEFAULT_MEASURE_SIZE = 8;\n\n/**\n * Negative default value for measure size.\n *\n * @type {number}\n * @example\n * // Access the negative default measure size value\n * const negativeDefaultMeasureSize = SPECCER_DEFAULT_MEASURE_SIZE_NEG;\n * console.log(negativeDefaultMeasureSize); // Example output: -8\n */\nexport const SPECCER_DEFAULT_MEASURE_SIZE_NEG =\n SPECCER_DEFAULT_MEASURE_SIZE * -1;\n\n/**\n * Default line width value.\n *\n * @type {number}\n * @example\n * // Access the default line width value\n * const defaultLineWidth = SPECCER_DEFAULT_LINE_WIDTH;\n * console.log(defaultLineWidth); // Example output: 1\n */\nexport const SPECCER_DEFAULT_LINE_WIDTH = 1;\n","/* eslint no-console:0 */\n'use strict';\nimport {\n SPECCER_DEFAULT_PIN_SPACE,\n SPECCER_DEFAULT_MEASURE_SIZE,\n SPECCER_DEFAULT_LINE_WIDTH\n} from './constants';\nimport {\n SpacingCSSPropertiesType,\n TypographyCSSPropertiesType\n} from '../types/css';\n\n/**\n * Parses a string value into an integer.\n *\n * @param {string} value - The string value to parse.\n * @returns {number} - The parsed integer value.\n *\n * @example\n * // Parse a string value into an integer\n * const intValue = getNumberValue(\"42\");\n * console.log(intValue); // Example output: 42\n */\nexport const getNumberValue = (value: string): number => parseInt(value, 10);\n\n/**\n * Normalizes a string or number value to ensure it's a valid number.\n * If the value is within the range [0, 1] or [-1, 0), it's normalized to 0.\n *\n * @param {string | number} value - The value to normalize.\n * @returns {number} - The normalized number value.\n *\n * @example\n * // Normalize a value to ensure it's a valid number\n * const normalizedValue = normalizeNumberValue(\"0.5\");\n * console.log(normalizedValue); // Example output: 0.5\n */\nexport const normalizeNumberValue = (value: string | number): number => {\n const _value = parseFloat(value + '');\n\n return (_value >= 0 && _value < 1) || (_value <= 0 && _value > -1)\n ? 0\n : _value;\n};\n\n/**\n * Converts a CSS property name with \"Top\", \"Right\", \"Bottom\", or \"Left\" into a class name.\n *\n * @param {string} property - The CSS property name.\n * @returns {string} - The corresponding class name.\n *\n * @example\n * // Convert a CSS property name to a class name\n * const className = getClassNameFromCSSProperty(\"marginTop\");\n * console.log(className); // Example output: \"margin top\"\n */\nexport const getClassNameFromCSSProperty = (property: string): string => {\n if (property.indexOf('Top') !== -1) {\n return property.replace('Top', ' top');\n } else if (property.indexOf('Right') !== -1) {\n return property.replace('Right', ' right');\n } else if (property.indexOf('Bottom') !== -1) {\n return property.replace('Bottom', ' bottom');\n } else if (property.indexOf('Left') !== -1) {\n return property.replace('Left', ' left');\n }\n\n return '';\n};\n\n/**\n * Extracts spacing-related CSS properties from a style object.\n *\n * @param {SpacingCSSPropertiesType} style - The style object.\n * @returns {SpacingCSSPropertiesType} - The extracted spacing-related properties.\n *\n * @example\n * // Extract spacing-related properties from a style object\n * const spacing = getSpacing({\n * marginTop: \"10px\",\n * marginLeft: \"20px\",\n * });\n * console.log(spacing); // Example output: { marginTop: \"10px\", marginLeft: \"20px\" }\n */\nexport const getSpacing = (\n style: SpacingCSSPropertiesType\n): SpacingCSSPropertiesType => {\n const {\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n paddingTop,\n paddingBottom,\n paddingLeft,\n paddingRight\n } = style;\n\n return {\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n paddingTop,\n paddingBottom,\n paddingLeft,\n paddingRight\n };\n};\n\n/**\n * Extracts typography-related CSS properties from a style object.\n *\n * @param {TypographyCSSPropertiesType} style - The style object.\n * @returns {TypographyCSSPropertiesType} - The extracted typography-related properties.\n *\n * @example\n * // Extract typography-related properties from a style object\n * const typography = getTypography({\n * fontSize: \"16px\",\n * fontWeight: \"bold\",\n * });\n * console.log(typography); // Example output: { fontSize: \"16px\", fontWeight: \"bold\" }\n */\nexport const getTypography = (\n style: TypographyCSSPropertiesType\n): TypographyCSSPropertiesType => {\n const {\n lineHeight,\n letterSpacing,\n fontFamily,\n fontSize,\n fontStyle,\n fontVariationSettings,\n fontWeight\n } = style;\n\n return {\n lineHeight,\n letterSpacing,\n fontFamily,\n fontSize,\n fontStyle,\n fontVariationSettings,\n fontWeight\n };\n};\n\n/**\n * Retrieves the value of a custom CSS property \"--ph-speccer-pin-space\" from an element.\n *\n * @param {HTMLElement} el - The HTML element.\n * @returns {number} - The parsed value of the CSS property or a default value.\n *\n * @example\n * // Get the value of a custom CSS property from an element\n * const value = pinSpace(document.body);\n * console.log(value); // Example output: 10\n */\nexport const pinSpace = (el: HTMLElement): number =>\n getNumberValue(\n getComputedStyle(el).getPropertyValue('--ph-speccer-pin-space')\n ) || SPECCER_DEFAULT_PIN_SPACE;\n\n/**\n * Retrieves the value of a custom CSS property \"--ph-speccer-measure-size\" from an element.\n *\n * @param {HTMLElement} el - The HTML element.\n * @returns {number} - The parsed value of the CSS property or a default value.\n *\n * @example\n * // Get the value of a custom CSS property from an element\n * const value = measureSize(document.body);\n * console.log(value); // Example output: 20\n */\nexport const measureSize = (el: HTMLElement): number =>\n getNumberValue(\n getComputedStyle(el).getPropertyValue('--ph-speccer-measure-size')\n ) || SPECCER_DEFAULT_MEASURE_SIZE;\n\n/**\n * Retrieves the value of a custom CSS property \"--ph-speccer-line-width\" from an element.\n *\n * @param {HTMLElement} el - The HTML element.\n * @returns {number} - The parsed value of the CSS property or a default value.\n *\n * @example\n * // Get the value of a custom CSS property from an element\n * const value = lineWidth(document.body);\n * console.log(value); // Example output: 1.5\n */\nexport const lineWidth = (el: HTMLElement): number =>\n getNumberValue(\n getComputedStyle(el).getPropertyValue('--ph-speccer-line-width')\n ) || SPECCER_DEFAULT_LINE_WIDTH;\n","/**\n * Waits for the specified amount of time in milliseconds.\n *\n * @param {number} ms - The number of milliseconds to wait.\n * @returns {Promise<void>} - A Promise that resolves after the specified time.\n *\n * @example\n * // Wait for 1 second (1000 milliseconds)\n * await waitFor(1000);\n */\nexport const waitFor = (ms: number): Promise<void> =>\n new Promise((resolve) => setTimeout(resolve, ms));\n\n/**\n * Waits for the next animation frame using requestAnimationFrame.\n *\n * @returns {Promise<number>} - A Promise that resolves with the timestamp of the next animation frame.\n *\n * @example\n * // Wait for the next animation frame and get the rect\n * await waitForFrame();\n * const rect = el.getBoundingClientRect();\n * // Wait for the next animation frame and get the timestamp\n * const timestamp = await waitForFrame();\n */\nexport const waitForFrame = (): Promise<number> =>\n new Promise(requestAnimationFrame);\n","/* eslint no-console:0 */\n'use strict';\nimport { waitForFrame } from './wait';\n\n/**\n * Adds CSS styles to an HTMLElement.\n *\n * @param {HTMLElement} el - The HTMLElement to apply styles to.\n * @param {object | Array<{ key: string; value: string }>} styles - An object or an array of objects containing CSS styles to apply.\n * @returns {Promise<void>} - A Promise that resolves after styles are applied.\n *\n * @example\n * // Apply styles as an object\n * const element = document.getElementById('my-element');\n * await add(element, { color: 'red', fontSize: '16px' });\n *\n * // Apply styles as an array of objects\n * const styles = [\n * { key: 'color', value: 'blue' },\n * { key: 'backgroundColor', value: 'yellow' }\n * ];\n * await add(element, styles);\n */\nexport const add = async (\n el: HTMLElement,\n styles: object | Array<{ key: string; value: string }>\n): Promise<void> => {\n if (\n !el ||\n !styles ||\n typeof styles === 'string' ||\n typeof styles === 'number' ||\n typeof styles === 'boolean' ||\n (Array.isArray(styles) && styles.length === 0) ||\n (Object.keys(styles).length === 0 && styles.constructor === Object)\n ) {\n return;\n }\n\n await waitForFrame();\n\n if (Array.isArray(styles)) {\n styles.forEach(\n (style: { key: string; value: string }) =>\n (el.style[style.key] = style.value)\n );\n } else {\n Object.keys(styles).forEach((key) => (el.style[key] = styles[key]));\n }\n};\n\n/**\n * Gets the computed CSS styles of an HTMLElement.\n *\n * @param {HTMLElement} el - The HTMLElement to get computed styles from.\n * @returns {Promise<CSSStyleDeclaration>} - A Promise that resolves with the computed CSS styles.\n *\n * @example\n * // Get computed styles of an element\n * const element = document.getElementById('my-element');\n * const computedStyles = await get(element);\n * console.log(computedStyles.color); // Logs the color property value\n */\nexport const get = async (el: HTMLElement): Promise<CSSStyleDeclaration> => {\n await waitForFrame();\n\n return getComputedStyle(el, null);\n};\n","import { waitForFrame } from './wait';\n\nimport { PositionPropertiesType, PositionInputType } from '../types/position';\nimport { GetRecPropertiesInterface } from 'types/interfaces/position';\n\n/**\n * Calculates the horizontal center of two elements.\n *\n * @param {number} modifier - A modifier value.\n * @param {DOMRect} startRect - The starting element's rectangle.\n * @param {DOMRect} targetRect - The target element's rectangle.\n * @returns {number} - The horizontal center position.\n *\n * @example\n * // Calculate the horizontal center of two elements\n * const center = get_horizontal_center_of_els(0, startRect, targetRect);\n */\nexport const get_horizontal_center_of_els = (\n modifier: number,\n startRect: DOMRect,\n targetRect: DOMRect\n): number => modifier - startRect.width / 2 + targetRect.width / 2;\n\n/**\n * Calculates the vertical center of two elements.\n *\n * @param {number} modifier - A modifier value.\n * @param {DOMRect} startRect - The starting element's rectangle.\n * @param {DOMRect} targetRect - The target element's rectangle.\n * @returns {number} - The vertical center position.\n *\n * @example\n * // Calculate the vertical center of two elements\n * const center = get_vertical_center_of_els(0, startRect, targetRect);\n */\nexport const get_vertical_center_of_els = (\n modifier: number,\n startRect: DOMRect,\n targetRect: DOMRect\n): number => modifier - startRect.height / 2 + targetRect.height / 2;\n\n/**\n * Gets the offset properties of an HTML element.\n *\n * @param {HTMLElement} targetEl - The target HTML element.\n * @returns {Promise<PositionPropertiesType>} - A promise that resolves to the offset properties.\n *\n * @example\n * // Get the offset properties of an element\n * const offsetProps = await offset(targetElement);\n */\nexport const offset = async (\n targetEl: HTMLElement\n): Promise<PositionPropertiesType> => {\n await waitForFrame();\n\n const _target_rect = targetEl.getBoundingClientRect();\n const _el_offset_top = _target_rect.top + window.pageYOffset;\n const _el_offset_left = _target_rect.left + window.pageXOffset;\n\n return {\n height: _target_rect.height,\n width: _target_rect.width,\n top: _el_offset_top,\n left: _el_offset_left\n };\n};\n\n/**\n * Gets the offset properties of an HTML element with its center aligned to another element.\n *\n * @param {HTMLElement} sourceEl - The source HTML element.\n * @param {HTMLElement} targetEl - The target HTML element.\n * @returns {Promise<PositionPropertiesType>} - A promise that resolves to the offset properties.\n *\n * @example\n * // Get the offset properties of an element with its center aligned to another element\n * const offsetProps = await offsetWithCenter(sourceElement, targetElement);\n */\nexport const offsetWithCenter = async (\n sourceEl: HTMLElement,\n targetEl: HTMLElement\n): Promise<PositionPropertiesType> => {\n await waitForFrame();\n\n const _source_rect = sourceEl.getBoundingClientRect();\n const _target_rect = targetEl.getBoundingClientRect();\n const _el_offset_top = _target_rect.top + window.pageYOffset;\n const _el_offset_left = _target_rect.left + window.pageXOffset;\n\n return {\n height: _target_rect.height,\n width: _target_rect.width,\n top: get_vertical_center_of_els(_el_offset_top, _source_rect, _target_rect),\n left: get_horizontal_center_of_els(\n _el_offset_left,\n _source_rect,\n _target_rect\n )\n };\n};\n\n/**\n * Gets various positioning properties between two HTML elements.\n *\n * @param {HTMLElement} sourceEl - The source HTML element.\n * @param {HTMLElement} targetEl - The target HTML element.\n * @returns {Promise<GetRecPropertiesInterface>} - A promise that resolves to an object with positioning functions.\n *\n * @example\n * // Get positioning properties between two elements\n * const recProps = await getRec(sourceElement, targetElement);\n *\n * // Get the absolute position properties\n * const absoluteProps = recProps.absolute();\n *\n * // Get the position properties with the source element above the target element\n * const aboveProps = recProps.toTop();\n */\nexport const getRec = async (\n sourceEl: HTMLElement,\n targetEl: HTMLElement\n): Promise<GetRecPropertiesInterface> => {\n await waitForFrame();\n\n const _source_rect = sourceEl.getBoundingClientRect();\n const _target_offset = await offset(targetEl);\n const _target_offset_center = await offsetWithCenter(sourceEl, targetEl);\n const _target_height = _target_offset.height;\n const _target_width = _target_offset.width;\n const _source_height = _source_rect.height;\n const _source_width = _source_rect.width;\n\n return {\n absolute: (): PositionPropertiesType => {\n return {\n top: _target_offset.top,\n left: _target_offset.left,\n height: _target_height,\n width: _target_width\n };\n },\n toTop: ({\n center = false,\n sourceHeight = _source_height,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: _target_offset.top + sourceHeight + modifier,\n left: center ? _target_offset_center.left : _target_offset.left,\n height: _target_height,\n width: _target_width\n };\n },\n\n fromTop: ({\n center = false,\n sourceHeight = _source_height,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: _target_offset.top - sourceHeight - modifier,\n left: center ? _target_offset_center.left : _target_offset.left,\n height: _target_height,\n width: _target_width\n };\n },\n\n toBottom: ({\n center = false,\n sourceHeight = _source_height,\n targetHeight = _target_height,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: _target_offset.top + targetHeight - (sourceHeight + modifier),\n left: center ? _target_offset_center.left : _target_offset.left,\n height: _target_height,\n width: _target_width\n };\n },\n fromBottom: ({\n center = false,\n targetHeight = _target_height,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: _target_offset.top + targetHeight + modifier,\n left: center ? _target_offset_center.left : _target_offset.left,\n height: _target_height,\n width: _target_width\n };\n },\n\n toLeft: ({\n center = false,\n sourceWidth = _source_width,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: center ? _target_offset_center.top : _target_offset.top,\n left: _target_offset.left + sourceWidth + modifier,\n height: _target_height,\n width: _target_width\n };\n },\n\n fromLeft: ({\n center = false,\n sourceWidth = _source_width,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: center ? _target_offset_center.top : _target_offset.top,\n left: _target_offset.left - sourceWidth - modifier,\n height: _target_height,\n width: _target_width\n };\n },\n\n toRight: ({\n center = false,\n sourceWidth = _source_width,\n targetWidth = _target_width,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: center ? _target_offset_center.top : _target_offset.top,\n left: _target_offset.left + targetWidth - (sourceWidth + modifier),\n height: _target_height,\n width: _target_width\n };\n },\n\n fromRight: ({\n center = false,\n targetWidth = _target_width,\n modifier = 0\n }: PositionInputType = {}): PositionPropertiesType => {\n return {\n top: center ? _target_offset_center.top : _target_offset.top,\n left: _target_offset.left + targetWidth + modifier,\n height: _target_height,\n width: _target_width\n };\n }\n };\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport * as classnames from '../../utils/classnames';\nimport * as css from '../../utils/css';\nimport * as styles from '../../utils/styles';\nimport { position } from './utils/position';\n\nexport const create = (text: string | number = '', tag = 'span') => {\n const _el = document.createElement(tag);\n const _text_content = document.createTextNode(text + '');\n\n _el.appendChild(_text_content);\n _el.setAttribute('title', text + 'px');\n classnames.set(_el, 'ph speccer spacing');\n\n return _el;\n};\n\nexport const element = async (targetEl: HTMLElement) => {\n if (!targetEl) return;\n\n const _target_styles = await styles.get(targetEl);\n\n if (\n _target_styles.display === 'none' ||\n _target_styles.opacity === '0' ||\n _target_styles.visibility === 'hidden'\n ) {\n return;\n }\n\n const _target_spacing_styles = css.getSpacing(_target_styles);\n const _target_pruned_spacing_styles = Object.keys(\n _target_spacing_styles\n ).filter((property) => {\n const _value = _target_spacing_styles[property];\n\n return _value !== '0px';\n });\n\n if (_target_pruned_spacing_styles.length === 0) return;\n\n _target_pruned_spacing_styles.forEach(async (property) => {\n const _value = css.getNumberValue(_target_spacing_styles[property]);\n const _speccer_el = create(_value);\n const _class_name = css.getClassNameFromCSSProperty(property);\n\n classnames.set(_speccer_el, _class_name);\n document.body.appendChild(_speccer_el);\n\n targetEl.classList.add('is-specced');\n await position(property, _value, _speccer_el, targetEl);\n });\n};\n","import * as styles from '../../../utils/styles';\nimport { offset } from '../../../utils/position';\nimport { waitForFrame } from '../../../utils/wait';\n\nexport const position = async (\n property: string,\n value: number,\n spacingEl: HTMLElement,\n targetEl: HTMLElement\n) => {\n await waitForFrame();\n\n const _target_rect = targetEl.getBoundingClientRect();\n const _target_offset = await offset(targetEl);\n\n if (property === 'marginTop') {\n styles.add(spacingEl, {\n height: `${value}px`,\n width: _target_rect.width + 'px',\n left: _target_offset.left + 'px',\n top: _target_offset.top - value + 'px'\n });\n }\n\n if (property === 'marginRight') {\n styles.add(spacingEl, {\n height: _target_rect.height + 'px',\n width: `${value}px`,\n left: _target_offset.left + parseInt(_target_rect.width + '', 10) + 'px',\n top: _target_offset.top + 'px'\n });\n }\n\n if (property === 'marginBottom') {\n styles.add(spacingEl, {\n height: `${value}px`,\n width: _target_rect.width + 'px',\n left: _target_offset.left + 'px',\n top: _target_offset.top + parseInt(_target_rect.height + '', 10) + 'px'\n });\n }\n\n if (property === 'marginLeft') {\n styles.add(spacingEl, {\n height: _target_rect.height + 'px',\n width: `${value}px`,\n left: _target_offset.left - value + 'px',\n top: _target_offset.top + 'px'\n });\n }\n\n if (property === 'paddingTop') {\n styles.add(spacingEl, {\n height: `${value}px`,\n width: _target_rect.width + 'px',\n left: _target_offset.left + 'px',\n top: _target_offset.top + 'px'\n });\n }\n\n if (property === 'paddingBottom') {\n styles.add(spacingEl, {\n height: `${value}px`,\n width: _target_rect.width + 'px',\n left: _target_offset.left + 'px',\n top:\n _target_offset.top +\n (parseInt(_target_rect.height + '', 10) - value) +\n 'px'\n });\n }\n\n if (property === 'paddingRight') {\n styles.add(spacingEl, {\n height: _target_rect.height + 'px',\n width: `${value}px`,\n left:\n _target_offset.left +\n (parseInt(_target_rect.width + '', 10) - value) +\n 'px',\n top: _target_offset.top + 'px'\n });\n }\n\n if (property === 'paddingLeft') {\n styles.add(spacingEl, {\n height: _target_rect.height + 'px',\n width: `${value}px`,\n left: _target_offset.left + 'px',\n top: _target_offset.top + 'px'\n });\n }\n};\n","/* eslint-disable no-unused-vars */\n\n/**\n * Enum representing different areas in Speccer.\n */\nexport enum SpeccerAreaEnum {\n Empty = '', // Represents an empty area\n Left = 'left', // Represents the left area\n Right = 'right', // Represents the right area\n Bottom = 'bottom',// Represents the bottom area\n Top = 'top', // Represents the top area\n}\n\n/**\n * Enum representing different areas in Dissect.\n */\nexport enum DissectAreaEnum {\n Outline = 'outline', // Represents an outline area\n Enclose = 'enclose', // Represents an enclose area\n Full = 'full', // Represents a full area\n Left = 'left', // Represents the left area\n Right = 'right', // Represents the right area\n Bottom = 'bottom', // Represents the bottom area\n Top = 'top', // Represents the top area\n SVG = 'svg', // Represents an SVG area\n Curly = 'curly', // Represents a curly area\n}\n\n/**\n * Enum representing different measurement areas.\n */\nexport enum MeasureAreaEnum {\n Width = 'width', // Represents the width measurement area\n Height = 'height', // Represents the height measurement area\n Left = 'left', // Represents the left measurement area\n Right = 'right', // Represents the right measurement area\n Bottom = 'bottom', // Represents the bottom measurement area\n Top = 'top', // Represents the top measurement area\n}\n","import { DissectAreaEnum, MeasureAreaEnum } from 'types/enums/area';\n\n/**\n * Splits a string containing areas into an array of strings.\n *\n * @param areaString - The string containing areas.\n * @returns An array of area strings.\n *\n * @example\n * const areas = getAreasFromString('left right top');\n * // areas: ['left', 'right', 'top']\n */\nexport const getAreasFromString = (areaString: string): string[] =>\n areaString.split(' ');\n\n/**\n * Checks if 'left' area is present in the provided areaString.\n *\n * @param areaString - The string containing areas.\n * @returns `true` if 'left' is present, otherwise `false`.\n */\nexport const isLeftArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(DissectAreaEnum.Left);\n};\n\n/**\n * Checks if 'right' area is present in the provided areaString.\n *\n * @param areaString - The string containing areas.\n * @returns `true` if 'right' is present, otherwise `false`.\n */\nexport const isRightArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(DissectAreaEnum.Right);\n};\n\n/**\n * Checks if 'top' area is present in the provided areaString.\n *\n * @param areaString - The string containing areas.\n * @returns `true` if 'top' is present, otherwise `false`.\n */\nexport const isTopArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(DissectAreaEnum.Top);\n};\n\n/**\n * Checks if 'bottom' area is present in the provided areaString.\n *\n * @param areaString - The string containing areas.\n * @returns `true` if 'bottom' is present, otherwise `false`.\n */\nexport const isBottomArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(DissectAreaEnum.Bottom);\n};\n\n/**\n * Checks if 'full' area is present in the provided areaString.\n *\n * @param areaString - The string containing areas.\n * @returns `true` if 'full' is present, otherwise `false`.\n */\nexport const isFullArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(DissectAreaEnum.Full);\n};\n\n/**\n * Checks if 'enclose' area is present in the provided areaString.\n *\n * @param areaString - The string containing areas.\n * @returns `true` if 'enclose' is present, otherwise `false`.\n */\nexport const isEncloseArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(DissectAreaEnum.Enclose);\n};\n\n/**\n * Checks if 'height' area is present in the provided areaString.\n *\n * @param areaString - The string containing areas.\n * @returns `true` if 'height' is present, otherwise `false`.\n */\nexport const isHeightArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(MeasureAreaEnum.Height);\n};\n\n/**\n * Checks if 'width' area is present in the provided areaString.\n *\n * @param areaString - The string containing areas.\n * @returns `true` if 'width' is present, otherwise `false`.\n */\nexport const isWidthArea = (areaString: string): boolean => {\n const areas = getAreasFromString(areaString);\n\n return areas.includes(MeasureAreaEnum.Width);\n};\n\n/**\n * Checks if the provided areaString contains SVG-related areas.\n *\n * @param areaString - The string containing areas.\n * @returns `true` if any SVG-related area is present, otherwise `false`.\n */\nexport const useSVG = (areaString: string): boolean =>\n areaString.includes(DissectAreaEnum.SVG) ||\n areaString.includes(DissectAreaEnum.Curly) ||\n areaString.includes(DissectAreaEnum.Full) ||\n areaString.includes(DissectAreaEnum.Enclose);\n\n/**\n * Checks if the provided areaString contains 'curly' and 'full' areas.\n *\n * @param areaString - The string containing areas.\n * @returns `true` if both 'curly' and 'full' are present, otherwise `false`.\n */\nexport const isCurly = (areaString: string): boolean =>\n areaString.includes(DissectAreaEnum.Curly) &&\n areaString.includes(DissectAreaEnum.Full);\n","/******************************************************************************\r\nCopyright (c) Microsoft Corporation.\r\n\r\nPermission to use, copy, modify, and/or distribute this software for any\r\npurpose with or without fee is hereby granted.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\r\nREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY\r\nAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\r\nINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM\r\nLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR\r\nOTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR\r\nPERFORMANCE OF THIS SOFTWARE.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n if (typeof b !== \"function\" && b !== null)\r\n throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n t[p[i]] = s[p[i]];\r\n }\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (_) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport var __createBinding = Object.create ? (function(o, m, k, k2) {\r\n if (k2 === undefined) k2 = k;\r\n var desc = Object.getOwnPropertyDescriptor(m, k);\r\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\r\n desc = { enumerable: true, get: function() { return m[k]; } };\r\n }\r\n Object.defineProperty(o, k2, desc);\r\n}) : (function(o, m, k, k2) {\r\n if (k2 === undefined) k2 = k;\r\n o[k2] = m[k];\r\n});\r\n\r\nexport function __exportStar(m, o) {\r\n for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);\r\n}\r\n\r\nexport function __values(o) {\r\n var s = typeof Symbol === \"function\" && Symbol.iterator, m = s && o[s], i = 0;\r\n if (m) return m.call(o);\r\n if (o && typeof o.length === \"number\") return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n throw new TypeError(s ? \"Object is not iterable.\" : \"Symbol.iterator is not defined.\");\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spreadArrays() {\r\n for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;\r\n for (var r = Array(s), k = 0, i = 0; i < il; i++)\r\n for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)\r\n r[k] = a[j];\r\n return r;\r\n}\r\n\r\nexport function __spreadArray(to, from, pack) {\r\n if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\r\n if (ar || !(i in from)) {\r\n if (!ar) ar = Array.prototype.slice.call(from, 0, i);\r\n ar[i] = from[i];\r\n }\r\n }\r\n return to.concat(ar || Array.prototype.slice.call(from));\r\n}\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nvar __setModuleDefault = Object.create ? (function(o, v) {\r\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\r\n}) : function(o, v) {\r\n o[\"default\"] = v;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\r\n __setModuleDefault(result, mod);\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n\r\nexport function __classPrivateFieldGet(receiver, state, kind, f) {\r\n if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a getter\");\r\n if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot read private member from an object whose class did not declare it\");\r\n return kind === \"m\" ? f : kind === \"a\" ? f.call(receiver) : f ? f.value : state.get(receiver);\r\n}\r\n\r\nexport function __classPrivateFieldSet(receiver, state, value, kind, f) {\r\n if (kind === \"m\") throw new TypeError(\"Private method is not writable\");\r\n if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a setter\");\r\n if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot write private member to an object whose class did not declare it\");\r\n return (kind === \"a\" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;\r\n}\r\n\r\nexport function __classPrivateFieldIn(state, receiver) {\r\n if (receiver === null || (typeof receiver !== \"object\" && typeof receiver !== \"function\")) throw new TypeError(\"Cannot use 'in' operator on non-object\");\r\n return typeof state === \"function\" ? receiver === state : state.has(receiver);\r\n}\r\n","/* eslint no-console:0 */\n'use strict';\n\n/**\n * Generates a unique ID consisting of an underscore followed by a random alphanumeric string.\n *\n * @returns {string} - A unique ID.\n *\n * @example\n * // Generate a unique ID\n * const id = uniqueID();\n * console.log(id); // Example output: \"_abc123def\"\n */\nexport const uniqueID = (): string =>\n '_' + Math.random().toString(36).substring(2, 11);\n","/**\n * Coordinates object containing functions to retrieve specific coordinates from a DOMRect.\n */\nexport const coords = {\n top: (rect: DOMRect) => rect.top,\n right: (rect: DOMRect) => rect.left + rect.width,\n bottom: (rect: DOMRect) => rect.top + rect.height,\n left: (rect: DOMRect) => rect.left,\n center_x: (rect: DOMRect) => rect.left + rect.width / 2,\n center_y: (rect: DOMRect) => rect.top + rect.height / 2\n};\n","import { coords } from './coords';\n\n/**\n * Coordinates object containing functions to retrieve specific x and y coordinates from a DOMRect.\n */\nexport const xy = {\n center: (rect: DOMRect) => ({\n x: coords.center_x(rect),\n y: coords.center_y(rect)\n }),\n top: (rect: DOMRect) => ({ x: coords.center_x(rect), y: coords.top(rect) }),\n right: (rect: DOMRect) => ({\n x: coords.right(rect),\n y: coords.center_y(rect)\n }),\n bottom: (rect: DOMRect) => ({\n x: coords.center_x(rect),\n y: coords.bottom(rect)\n }),\n left: (rect: DOMRect) => ({ x: coords.left(rect), y: coords.center_y(rect) }),\n 'right-top': (rect: DOMRect) => ({\n x: coords.right(rect),\n y: coords.top(rect)\n }),\n 'right-bottom': (rect: DOMRect) => ({\n x: coords.right(rect),\n y: coords.bottom(rect)\n }),\n 'left-top': (rect: DOMRect) => ({\n x: coords.left(rect),\n y: coords.top(rect)\n }),\n 'left-bottom': (rect: DOMRect) => ({\n x: coords.left(rect),\n y: coords.bottom(rect)\n }),\n 'top-left': (rect: DOMRect) => ({\n x: coords.left(rect),\n y: coords.top(rect)\n }),\n 'top-right': (rect: DOMRect) => ({\n x: coords.right(rect),\n y: coords.top(rect)\n }),\n 'bottom-left': (rect: DOMRect) => ({\n x: coords.left(rect),\n y: coords.bottom(rect)\n }),\n 'bottom-right': (rect: DOMRect) => ({\n x: coords.right(rect),\n y: coords.bottom(rect)\n }),\n 'top-center': (rect: DOMRect) => ({\n x: coords.center_x(rect),\n y: coords.top(rect)\n }),\n 'right-center': (rect: DOMRect) => ({\n x: coords.right(rect),\n y: coords.center_y(rect)\n }),\n 'bottom-center': (rect: DOMRect) => ({\n x: coords.center_x(rect),\n y: coords.bottom(rect)\n }),\n 'left-center': (rect: DOMRect) => ({\n x: coords.left(rect),\n y: coords.center_y(rect)\n })\n};\n","import { waitForFrame } from './wait';\nimport { xy } from './xy';\n\n/**\n * Get the intrinsic coordinates of an element based on a specified position.\n *\n * @param {HTMLElement} el - The HTML element.\n * @param {string} [pos='center'] - The position to use.\n * @throws {Error} No position given.\n * @throws {Error} The position given is not the required type.\n * @returns {Promise<{ x: number, y: number }>} - An object containing the coordinates.\n * @example\n * // Get intrinsic coordinates for an element\n * const element = document.getElementById('example');\n * const coordinates = await intrinsic_coords(element, 'top-left');\n */\nexport const intrinsic_coords = async (\n el: HTMLElement,\n pos = 'center'\n): Promise<{ x: number; y: number }> => {\n if (!pos) {\n throw new Error('No position given');\n }\n\n if (typeof pos !== 'string') {\n throw new Error(\n `The position given is not the required type: pos: ${typeof pos}`\n );\n }\n\n const _allowed_positions = [\n 'center',\n 'left',\n 'right',\n 'top',\n 'bottom',\n 'right-top',\n 'right-bottom',\n 'left-top',\n 'left-bottom',\n 'top-left',\n 'top-right',\n 'bottom-left',\n 'bottom-right',\n 'top-center',\n 'right-center',\n 'bottom-center',\n 'left-center'\n ];\n\n if (!_allowed_positions.includes(pos)) {\n throw new Error(\n `The position given does not match allowed positions to use! Valid positions are: ${_allowed_positions.join(\n ', '\n )}`\n );\n }\n\n await waitForFrame();\n\n const _el_rect = el.getBoundingClientRect();\n\n return xy[pos](_el_rect);\n};\n","import { intrinsic_coords } from './intrinsic-coords';\n\n/**\n * Get the x and y coordinates of two elements and return them as an object.\n *\n * @param {HTMLElement} el1 - The first HTML element.\n * @param {HTMLElement} el2 - The second HTML element.\n * @param {string} [pos1='center'] - The position to use for the first element.\n * @param {string} [pos2='center'] - The position to use for the second element.\n * @throws {Error} No element given.\n * @returns {Promise<{ x1: number, y1: number, x2: number, y2: number }>} - An object containing the coordinates.\n * @example\n * // Get coordinates for two elements\n * const element1 = document.getElementById('element1');\n * const element2 = document.getElementById('element2');\n * const coordinates = await get_coords_pair_from_objects(element1, element2);\n */\nexport const getCoordsPairFromObjects = async (\n el1: HTMLElement,\n el2: HTMLElement,\n pos1 = 'center',\n pos2 = 'center'\n): Promise<{ x1: number; y1: number; x2: number; y2: number }> => {\n if (!el1 || !el2) {\n throw new Error('No element given');\n }\n\n const { x: x1, y: y1 } = await intrinsic_coords(el1, pos1);\n const { x: x2, y: y2 } = await intrinsic_coords(el2, pos2);\n\n return {\n x1,\n y1,\n x2,\n y2\n };\n};\n","import {\n BezierPathOptionsType,\n CreateCoordinatesForCurveCoordParamType,\n CreateCoordinatesForCurveOptionsParamType,\n CurlyBezierPathOptionsType\n} from 'types/bezier';\nimport { getCoordsPairFromObjects } from './get-coords-pair-from-objects';\n\n/**\n * Calculates coordinates for a Bezier curve between two points.\n *\n * @param coords - The coordinates of the start and end points.\n * @param options - Options for controlling the curve's shape.\n * @returns Coordinates for the Bezier curve.\n *\n * @example\n * const coordinates = createBezierCurveCoordinates(\n * { x1: 0, x2: 100, y1: 0, y2: 100 },\n * { direct: true, firstSet: true, direction: 'west' }\n * );\n */\nexport const createBezierCurveCoordinates = (\n coords: CreateCoordinatesForCurveCoordParamType,\n options: CreateCoordinatesForCurveOptionsParamType\n) => {\n const { x1, x2, y1, y2 } = coords;\n const { direct = false, firstSet = false, direction } = options;\n const firstPoint = { x: x1, y: y1 }; // The first point of the curve\n const lastPoint = { x: x2, y: y2 }; // The last point of the curve\n\n let firstControl = { x: x1 + (x2 - x1) / 2, y: y1 }; // Control point for the first point\n let lastControl = { x: x1 + (x2 - x1) / 2, y: y2 }; // Control point for the last point\n\n if (direct) {\n if (firstSet) {\n if (direction === 'west') {\n firstControl = { x: x1 - 32, y: y1 - 16 / 2 };\n lastControl = { x: x2 + 32, y: y2 };\n } else if (direction === 'south') {\n firstControl = { x: x1 - 16 / 2, y: y1 + 32 };\n lastControl = { x: x2, y: y2 - 32 };\n } else if (direction === 'east') {\n firstControl = { x: x1 + 32, y: y1 - 16 / 2 };\n lastControl = { x: x2 - 32, y: y2 };\n } else {\n firstControl = { x: x1 - 16 / 2, y: y1 - 32 };\n lastControl = { x: x2, y: y2 + 32 };\n }\n } else {\n if (direction === 'west') {\n firstControl = { x: x1 - 32, y: y1 + 16 / 2 };\n lastControl = { x: x2 + 32, y: y2 };\n } else if (direction === 'south') {\n firstControl = { x: x1 + 16 / 2, y: y1 + 32 };\n lastControl = { x: x2, y: y2 - 32 };\n } else if (direction === 'east') {\n firstControl = { x: x1 + 32, y: y1 + 16 / 2 };\n lastControl = { x: x2 - 32, y: y2 };\n } else {\n firstControl = { x: x1 + 16 / 2, y: y1 - 32 };\n lastControl = { x: x2, y: y2 + 32 };\n }\n }\n }\n\n return {\n firstPoint,\n firstControl,\n lastPoint,\n lastControl\n };\n};\n\n/**\n * Generates an SVG path for a curved line between two HTML elements.\n *\n * @param startEl - The starting HTML element.\n * @param stopEl - The ending HTML element.\n * @param options - Options for controlling the curved line.\n * @returns The SVG path string for the curved line.\n *\n * @example\n * const svgPath = getCurlySVGPath(startElement, stopElement, {\n * pos1: 'top',\n * pos2: 'bottom',\n * firstSet: true,\n * direction: 'south',\n * });\n */\nexport const getCurlySVGPath = async (\n startEl: HTMLElement,\n stopEl: HTMLElement,\n options: CurlyBezierPathOptionsType\n) => {\n const { pos1, pos2, firstSet = false, direction } = options;\n const { x1, y1, x2, y2 } = await getCoordsPairFromObjects(\n startEl,\n stopEl,\n pos1,\n pos2\n );\n const x1modifier = 0;\n const y1modifier = 0;\n\n let x2modifier = 0;\n let y2modifier = 0;\n\n // Create a gap between the pin and the bracket center\n if (direction == 'north') {\n y2modifier = 8;\n } else if (direction == 'west') {\n x2modifier = 8;\n } else if (direction == 'east') {\n x2modifier = -8;\n } else if (direction == 'south') {\n y2modifier = -8;\n }\n\n const coordinates = createBezierCurveCoordinates(\n {\n x1: x1 + x1modifier,\n x2: x2 + x2modifier,\n y1: y1 + y1modifier,\n y2: y2 + y2modifier\n },\n {\n direct: true,\n firstSet,\n direction\n }\n );\n const { firstPoint, firstControl, lastControl, lastPoint } = coordinates;\n\n return (\n `M ${firstPoint.x} ${firstPoint.y}` +\n `C ${firstControl.x} ${firstControl.y}, ${lastControl.x} ${lastControl.y}, ${lastPoint.x} ${lastPoint.y}`\n );\n};\n\n/**\n * Generates an SVG path for a straight line between two HTML elements.\n *\n * @param startEl - The starting HTML element.\n * @param stopEl - The ending HTML element.\n * @param options - Options for controlling the straight line.\n * @returns The SVG path string for the straight line.\n *\n * @example\n * const svgPath = getSVGPath(startElement, stopElement, {\n * pos1: 'left',\n * pos2: 'right',\n * });\n */\nexport const getSVGPath = async (\n startEl: HTMLElement,\n stopEl: HTMLElement,\n options: BezierPathOptionsType\n) => {\n const { pos1, pos2 } = options;\n const { x1, y1, x2, y2 } = await getCoordsPairFromObjects(\n startEl,\n stopEl,\n pos1,\n pos2\n );\n const coordinates = createBezierCurveCoordinates(\n { x1, x2, y1, y2 },\n { direction: '' }\n );\n const { firstPoint, firstControl, lastControl, lastPoint } = coordinates;\n\n return (\n `M ${firstPoint.x} ${firstPoint.y}` +\n `C ${firstControl.x} ${firstControl.y}, ${lastControl.x} ${lastControl.y}, ${lastPoint.x} ${lastPoint.y}`\n );\n};\n\n/**\n * Returns positions for creating an SVG path based on a cardinal direction.\n *\n * @param direction - The cardinal direction ('east', 'west', 'south', 'north').\n * @returns Positions for creating an SVG path.\n *\n * @example\n * const positions = getPositionsForSVGPath('east');\n */\nexport const getPositionsForSVGPath = (direction: string) => {\n let pos1: string;\n let pos2: string;\n\n switch (direction) {\n case 'east':\n pos1 = 'right';\n pos2 = 'left';\n break;\n case 'south':\n pos1 = 'bottom';\n pos2 = 'top';\n break;\n case 'west':\n pos1 = 'left';\n pos2 = 'right';\n break;\n case 'north':\n default:\n pos1 = 'top';\n pos2 = 'bottom';\n break;\n }\n\n return { pos1, pos2 };\n};\n\n/**\n * Returns positions for creating an SVG path for a curved line based on a cardinal direction.\n *\n * @param direction - The cardinal direction ('east', 'west', 'south', 'north').\n * @returns Positions for creating an SVG path for a curved line.\n *\n * @example\n * const positions = getPositionsForCurlySVGPath('west');\n */\nexport const getPositionsForCurlySVGPath = (direction: string) => {\n let path1pos1: string;\n let path1pos2: string;\n let path2pos1: string;\n let path2pos2: string;\n\n switch (direction) {\n case 'east':\n path1pos1 = 'right-top';\n path1pos2 = 'left-center';\n path2pos1 = 'right-bottom';\n path2pos2 = 'left-center';\n break;\n case 'south':\n path1pos1 = 'bottom-left';\n path1pos2 = 'top-center';\n path2pos1 = 'bottom-right';\n path2pos2 = 'top-center';\n break;\n case 'west':\n path1pos1 = 'left-top';\n path1pos2 = 'right-center';\n path2pos1 = 'left-bottom';\n path2pos2 = 'right-center';\n break;\n case 'north':\n default:\n path1pos1 = 'top-left';\n path1pos2 = 'bottom-center';\n path2pos1 = 'top-right';\n path2pos2 = 'bottom-center';\n break;\n }\n\n return {\n path1pos1,\n path1pos2,\n path2pos1,\n path2pos2\n };\n};\n","import { angle } from './angle';\nimport { cardinal_direction, cardinal_direction_crude } from './cardinal';\nimport { getCoordsPairFromObjects } from './get-coords-pair-from-objects';\n\n/**\n * Get the direction of an element based on its position relative to another element.\n *\n * @param {Object} options - Options for direction calculation.\n * @param {HTMLElement} options.start - The starting HTML element.\n * @param {HTMLElement} options.stop - The stopping HTML element.\n * @param {boolean} [options.crude=false] - If the direction should be calculated crudely (NSEW).\n * @returns {Promise<string>} - The calculated direction.\n * @example\n * // Get the direction of one element relative to another\n * const startElement = document.getElementById('startElement');\n * const stopElement = document.getElementById('stopElement');\n * const direction = await direction_of_element({ start: startElement, stop: stopElement });\n */\nexport const direction_of_element = async ({\n start,\n stop,\n crude = false\n}: {\n start: HTMLElement;\n stop: HTMLElement;\n crude?: boolean;\n}): Promise<string> => {\n const { x1, y1, x2, y2 } = await getCoordsPairFromObjects(start, stop);\n const _angle = angle(x1, y1, x2, y2);\n const _direction = crude\n ? cardinal_direction_crude(_angle)\n : cardinal_direction(_angle);\n\n return _direction;\n};\n","/**\n * Returns the angle between two sets of coordinates.\n *\n * @param {number} cx - The x-coordinate of the first point.\n * @param {number} cy - The y-coordinate of the first point.\n * @param {number} ex - The x-coordinate of the second point.\n * @param {number} ey - The y-coordinate of the second point.\n * @param {boolean} [normalize=true] - If the angle output should be normalized to a value between 0° and 360°.\n * @throws {SyntaxError} Missing input for `angle`.\n * @throws {TypeError} Parameters for `angle` do not have the required type.\n * @returns {number} The angle between the given coordinates.\n * @example\n * // Calculate the angle between two points\n * const angleValue = angle(0, 0, 3, 4);\n */\nexport const angle = (\n cx: number,\n cy: number,\n ex: number,\n ey: number,\n normalize = true\n): number => {\n if (!cx || !cy || !ex || !ey) {\n throw new SyntaxError('Missing input for `angle`');\n }\n\n if (\n typeof cx !== 'number' ||\n typeof cy !== 'number' ||\n typeof ex !== 'number' ||\n typeof ey !== 'number'\n ) {\n throw new TypeError(\n `Parameters for \\`angle\\` do not have the required type. Requires number! Got: ${typeof cx} ${typeof cy} ${typeof ex} ${typeof ey}`\n );\n }\n\n const dy = ey - cy;\n const dx = ex - cx;\n\n let theta = Math.atan2(dy, dx); // range (-PI, PI]\n\n theta *= 180 / Math.PI; // radians to degrees, range (-180, 180]\n\n if (normalize && theta < 0) theta = 360 + theta; // range [0, 360)\n\n return theta;\n};\n","/* eslint no-console:0 */\n'use strict';\n\n/**\n * Gives you the cardinal direction based on degrees.\n * Note: The degrees start at 0, which is EAST (originally, north should be 0, but here, north is 270),\n * and we travel clockwise.\n *\n * @param {number} degrees - The angle in degrees.\n * @throws {RangeError} Parameter cannot exceed 360.\n * @throws {RangeError} Parameter cannot be lower than 0.\n * @returns {string} - The cardinal direction.\n * @example\n * // Get the cardinal direction for an angle in degrees\n * const direction = cardinal_direction(45);\n */\nexport const cardinal_direction = (degrees: number): string => {\n if (degrees > 360) throw new RangeError('Parameter cannot exceed 360');\n\n if (degrees < 0) throw new RangeError('Parameter cannot be lower than 0');\n\n if (degrees >= 0 && degrees <= 22.5) {\n return 'east';\n } else if (degrees >= 22.5 && degrees <= 67.5) {\n return 'south-east';\n } else if (degrees >= 67.5 && degrees <= 112.5) {\n return 'south';\n } else if (degrees >= 112.5 && degrees <= 157.5) {\n return 'south-west';\n } else if (degrees >= 157.5 && degrees <= 202.5) {\n return 'west';\n } else if (degrees >= 202.5 && degrees <= 247.5) {\n return 'north-west';\n } else if (degrees >= 247.5 && degrees <= 292.5) {\n return 'north';\n } else if (degrees >= 292.5 && degrees <= 337.5) {\n return 'north-east';\n } else {\n return 'east';\n }\n};\n\n/**\n * Gives you the cardinal direction based on degrees (crude version).\n * Note: The degrees start at 0, which is EAST (originally, north should be 0, but here, north is 270),\n * and we travel clockwise.\n *\n * @param {number} degrees - The angle in degrees.\n * @throws {RangeError} Parameter cannot exceed 360.\n * @throws {RangeError} Parameter cannot be lower than 0.\n * @returns {string} - The cardinal direction (NSEW).\n * @example\n * // Get the cardinal direction (crude) for an angle in degrees\n * const direction = cardinal_direction_crude(45);\n */\nexport const cardinal_direction_crude = (degrees: number): string => {\n if (degrees > 360) throw new RangeError('Parameter cannot exceed 360');\n\n if (degrees < 0) throw new RangeError('Parameter cannot be lower than 0');\n\n if (degrees >= 45 && degrees <= 135) {\n return 'south';\n } else if (degrees > 135 && degrees <= 225) {\n return 'west';\n } else if (degrees > 225 && degrees <= 315) {\n return 'north';\n } else if (degrees > 315) {\n return 'east';\n } else {\n return 'east';\n }\n};\n","'use strict';\n\nimport { uniqueID } from '../id';\nimport { getPositionsForSVGPath, getSVGPath } from '../bezier';\nimport { direction_of_element } from '../direction-of-element';\n\n/**\n * Class representing a DrawSVGLine instance.\n */\nexport class DrawSVGLine {\n #canvas: HTMLElement | SVGElement | null;\n #originalPathElement: HTMLElement | SVGPathElement | null;\n startElement: HTMLElement;\n stopElement: HTMLElement;\n line: SVGPathElement;\n\n /**\n * Creates a new DrawSVGLine instance.\n * @param startElement - The starting element for the line.\n * @param stopElement - The ending element for the line.\n */\n constructor(startElement: HTMLElement, stopElement: HTMLElement) {\n this.#init(startElement, stopElement);\n }\n\n /**\n * Initializes the DrawSVGLine instance.\n * @param startElement - The starting element for the line.\n * @param stopElement - The ending element for the line.\n * @throws Will throw an error if required elements are missing or not in the DOM.\n */\n #init(startElement: HTMLElement, stopElement: HTMLElement) {\n if (!startElement || !stopElement) {\n throw new Error('Missing inputs startElement and stopElement');\n }\n\n if (!document.body.contains(stopElement)) {\n throw new Error('stopElement is not in the DOM');\n }\n\n if (!document.body.contains(startElement)) {\n throw new Error('startElement is not in the DOM');\n }\n\n this.startElement = startElement;\n this.stopElement = stopElement;\n\n this.#canvas = document.getElementById('ph-speccer-svg');\n this.#originalPathElement = document.getElementById('ph-speccer-path');\n\n if (!this.#originalPathElement || !this.#canvas) {\n throw new Error(\n 'Missing required SVG element to draw lines. Please see the documentation'\n );\n }\n\n this.connect();\n }\n\n /**\n * Connects and draws the line.\n */\n connect() {\n this.draw(this.#originalPathElement as SVGPathElement);\n }\n\n /**\n * Draws the line based on the provided path.\n * @param path - The SVGPathElement to be used as the base path.\n * @throws Will throw an error if no path is provided.\n */\n async draw(path: SVGPathElement) {\n if (!path) {\n throw new Error('No path given to draw!');\n }\n\n const _id = uniqueID();\n const _path_el_id = `ph_draw_path-path-${_id}`;\n const _new_path = path.cloneNode(false) as SVGPathElement;\n\n _new_path.setAttribute('id', _path_el_id);\n _new_path.setAttribute(\n 'data-start-el',\n this.startElement.getAttribute('id') || 'no-id-found'\n );\n _new_path.classList.remove('original');\n _new_path.classList.add('speccer');\n\n if (path.parentNode) {\n this.line = path.parentNode.insertBefore(_new_path, path.nextSibling);\n } else {\n throw new Error('No parentNode found for path');\n }\n\n const _direction = await direction_of_element({\n start: this.startElement,\n stop: this.stopElement,\n crude: true\n });\n const { pos1, pos2 } = getPositionsForSVGPath(_direction);\n const _d = await getSVGPath(this.startElement, this.stopElement, {\n pos1,\n pos2\n });\n\n this.line.setAttribute('data-direction', _direction);\n this.line.setAttribute('data-pos1', pos1);\n this.line.setAttribute('data-pos2', pos2);\n\n this.line.setAttribute('d', _d); // SVG attributes\n }\n}\n\n// Exporting the class as a global object (if needed)\nwindow.DrawSVGLine = DrawSVGLine;\n","'use strict';\n\nimport { uniqueID } from '../id';\nimport { getCurlySVGPath, getPositionsForCurlySVGPath } from '../bezier';\nimport { direction_of_element } from '../direction-of-element';\n\n/**\n * Class representing a DrawSVGCurlyBracket instance.\n */\nexport class DrawSVGCurlyBracket {\n #canvas: HTMLElement | SVGElement | null;\n #originalPathElement: HTMLElement | SVGPathElement | null;\n startElement: HTMLElement;\n stopElement: HTMLElement;\n firstPathElement: SVGPathElement;\n secondPathElement: SVGPathElement;\n\n /**\n * Creates a new DrawSVGCurlyBracket instance.\n * @param startElement - The starting element for the bracket.\n * @param stopElement - The ending element for the bracket.\n */\n constructor(startElement: HTMLElement, stopElement: HTMLElement) {\n this.#init(startElement, stopElement);\n }\n\n /**\n * Initializes the DrawSVGCurlyBracket instance.\n * @param startElement - The starting element for the bracket.\n * @param stopElement - The ending element for the bracket.\n * @throws Will throw an error if required elements are missing or not in the DOM.\n */\n #init(startElement: HTMLElement, stopElement: HTMLElement) {\n if (!startElement || !stopElement) {\n throw new Error('Missing inputs startElement and stopElement');\n }\n\n if (!document.body.contains(stopElement)) {\n throw new Error('stopElement is not in the DOM');\n }\n\n if (!document.body.contains(startElement)) {\n throw new Error('startElement is not in the DOM');\n }\n\n this.startElement = startElement;\n this.stopElement = stopElement;\n\n this.#canvas = document.getElementById('ph-speccer-svg');\n this.#originalPathElement = document.getElementById('ph-speccer-path');\n\n if (!this.#originalPathElement || !this.#canvas) {\n throw new Error(\n 'Missing required SVG element to draw lines. Please see the documentation'\n );\n }\n\n this.connect();\n }\n\n /**\n * Connects and draws the curly bracket.\n */\n connect() {\n this.draw(this.#originalPathElement as SVGPathElement);\n }\n\n /**\n * Creates a new path element based on the provided path.\n * @param path - The SVGPathElement to be used as the base path.\n * @throws Will throw an error if no path is provided.\n * @returns A new SVGPathElement.\n */\n #getPathElement(path: SVGPathElement) {\n if (!path) {\n throw new Error('No path given to #getPathElement!');\n }\n\n const _id = uniqueID();\n const _path_el_id = `ph_draw_path-path-${_id}`;\n const _new_path = path.cloneNode(false) as SVGPathElement;\n\n _new_path.setAttribute(\n 'data-start-el',\n this.startElement.getAttribute('id') || 'no-id-found'\n );\n _new_path.setAttribute('id', _path_el_id);\n _new_path.classList.remove('original');\n _new_path.classList.add('speccer');\n\n return _new_path;\n }\n\n /**\n * Draws the curly bracket based on the provided path.\n * @param path - The SVGPathElement to be used as the base path.\n * @throws Will throw an error if no path is provided.\n */\n async draw(path: SVGPathElement) {\n if (!path) {\n throw new Error('No path given to draw!');\n }\n\n const _first_path_element = this.#getPathElement(path);\n const _second_path_element = this.#getPathElement(path);\n\n if (path.parentNode) {\n this.firstPathElement = path.parentNode.insertBefore(\n _first_path_element,\n path.nextSibling\n );\n this.secondPathElement = path.parentNode.insertBefore(\n _second_path_element,\n path.nextSibling\n );\n } else {\n throw new Error('No parentNode found for path');\n }\n\n const _direction = await direction_of_element({\n stop: this.stopElement,\n start: this.startElement,\n crude: true\n });\n const { path1pos1, path1pos2, path2pos1, path2pos2 } =\n getPositionsForCurlySVGPath(_direction);\n const _first_path_d = await getCurlySVGPath(\n this.startElement,\n this.stopElement,\n {\n pos1: path1pos1,\n pos2: path1pos2,\n firstSet: true,\n direction: _direction\n }\n );\n const _second_path_d = await getCurlySVGPath(\n this.startElement,\n this.stopElement,\n {\n pos1: path2pos1,\n pos2: path2pos2,\n direction: _direction\n }\n );\n\n this.firstPathElement.setAttribute('data-direction', _direction);\n this.firstPathElement.setAttribute('data-pos1', path1pos1);\n this.firstPathElement.setAttribute('data-pos2', path1pos2);\n this.firstPathElement.setAttribute('d', _first_path_d); // SVG attributes\n this.secondPathElement.setAttribute('data-direction', _direction);\n this.secondPathElement.setAttribute('data-pos1', path2pos1);\n this.secondPathElement.setAttribute('data-pos2', path2pos2);\n this.secondPathElement.setAttribute('d', _second_path_d); // SVG attributes\n }\n}\n\n// Exporting the class as a global object (if needed)\nwindow.DrawSVGCurlyBracket = DrawSVGCurlyBracket;\n","import * as css from '../../../utils/css';\nimport * as position from '../../../utils/position';\nimport {\n isBottomArea,\n isEncloseArea,\n isFullArea,\n isLeftArea,\n isRightArea\n} from '../../../utils/area';\nimport { DissectStylesOptionsType } from 'types/bezier';\n\nexport const styles = async (\n area: string,\n targetEl: HTMLElement,\n dissectionEl: HTMLElement,\n options?: DissectStylesOptionsType\n) => {\n const { isCurly = false } = options || {};\n const SPECCER_PIN_SPACE = css.pinSpace(dissectionEl);\n const SPECCER_MEASURE_SIZE = css.measureSize(dissectionEl);\n const _positional_styles = await position.getRec(dissectionEl, targetEl);\n\n if (isEncloseArea(area)) {\n const { left, top, height, width } = _positional_styles.absolute();\n\n return {\n left: `${left}px`,\n top: `${top}px`,\n height: `${height}px`,\n width: `${width}px`\n };\n }\n\n if (isLeftArea(area)) {\n if (isFullArea(area) && !isCurly) {\n const { left, top, height } = _positional_styles.fromLeft({\n sourceWidth: SPECCER_MEASURE_SIZE\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`,\n height: `${height}px`\n };\n } else {\n const { left, top } = _positional_styles.fromLeft({\n center: true,\n modifier: isCurly ? SPECCER_PIN_SPACE / 1.5 : SPECCER_PIN_SPACE\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`\n };\n }\n } else if (isRightArea(area)) {\n if (isFullArea(area) && !isCurly) {\n const { left, top, height } = _positional_styles.fromRight({\n center: false\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`,\n height: `${height}px`\n };\n } else {\n const { left, top } = _positional_styles.fromRight({\n center: true,\n modifier: isCurly ? SPECCER_PIN_SPACE / 1.5 : SPECCER_PIN_SPACE\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`\n };\n }\n } else if (isBottomArea(area)) {\n if (isFullArea(area) && !isCurly) {\n const { left, top, width } = _positional_styles.fromBottom({\n center: false\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`,\n width: `${width}px`\n };\n } else {\n const { left, top } = _positional_styles.fromBottom({\n center: true,\n modifier: isCurly ? SPECCER_PIN_SPACE / 1.5 : SPECCER_PIN_SPACE\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`\n };\n }\n } else {\n if (isFullArea(area) && !isCurly) {\n const { left, top, width } = _positional_styles.fromTop({\n center: false\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`,\n width: `${width}px`\n };\n } else {\n const { left, top } = _positional_styles.fromTop({\n center: true,\n modifier: isCurly ? SPECCER_PIN_SPACE / 1.5 : SPECCER_PIN_SPACE\n });\n\n return {\n left: `${left}px`,\n top: `${top}px`\n };\n }\n }\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport { DissectAreaEnum } from '../../types/enums/area';\n\nimport * as classnames from '../../utils/classnames';\nimport { SPECCER_LITERALS } from '../../utils/constants';\nimport { add } from '../../utils/styles';\nimport { isCurly, isEncloseArea, isFullArea, useSVG } from '../../utils/area';\nimport { DrawSVGLine } from '../../utils/classes/DrawSVGLine';\nimport { DrawSVGCurlyBracket } from '../../utils/classes/DrawSVGCurlyBracket';\n\nimport { styles } from './utils/styles';\n\nexport const create = (textContent = '', area: string, n = 'span') => {\n const _el = document.createElement(n);\n const _text_node = document.createTextNode(textContent);\n const _extra_class_names = {};\n\n if (area !== null && area !== '') {\n _extra_class_names[area] = true;\n }\n\n if (\n (!isFullArea(area) && !isEncloseArea(area)) ||\n (isFullArea(area) && isCurly(area))\n ) {\n _el.appendChild(_text_node);\n } else if (isFullArea(area) || isEncloseArea(area)) {\n _el.setAttribute('data-dissection-counter', textContent);\n }\n\n const _class_names = classnames.cx(\n 'ph speccer dissection',\n _extra_class_names\n );\n\n classnames.set(_el, _class_names);\n\n return _el;\n};\n\nexport const element = (sectionEl: HTMLElement) => {\n if (!sectionEl) return;\n\n const _dissection_els = sectionEl.querySelectorAll('[data-anatomy]');\n\n if (_dissection_els) {\n let _index_to_use = 0;\n\n _dissection_els.forEach(async (targetEl: HTMLElement, targetIndex) => {\n if (!targetEl) return Promise.resolve();\n\n const _areas_string: string = targetEl.getAttribute('data-anatomy') || '';\n\n if (\n !_areas_string ||\n _areas_string === '' ||\n _areas_string.indexOf(DissectAreaEnum.Outline) === -1\n )\n return;\n\n /**\n * If we're running out of literals to use,\n * make a new one with uppercase and lower case pairs\n */\n let _literal_to_use = SPECCER_LITERALS[targetIndex];\n\n if (!_literal_to_use) {\n _literal_to_use = `${SPECCER_LITERALS[_index_to_use]}${SPECCER_LITERALS[\n _index_to_use\n ].toLowerCase()}`;\n _index_to_use++;\n }\n\n const _dissection_el = create(_literal_to_use, _areas_string);\n\n document.body.appendChild(_dissection_el);\n\n const _dissection_styles = await styles(\n _areas_string,\n targetEl,\n _dissection_el,\n {\n isCurly: isCurly(_areas_string)\n }\n );\n\n await add(_dissection_el, _dissection_styles);\n\n if (useSVG(_areas_string)) {\n new DrawSVGLine(targetEl, _dissection_el);\n } else if (isCurly(_areas_string)) {\n new DrawSVGCurlyBracket(targetEl, _dissection_el);\n }\n });\n }\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport {\n isBottomArea,\n isHeightArea,\n isRightArea,\n isWidthArea\n} from 'utils/area';\nimport * as classnames from '../../utils/classnames';\nimport * as styles from '../../utils/styles';\nimport { waitForFrame } from '../../utils/wait';\nimport * as position from '../../utils/position';\nimport { SPECCER_DEFAULT_MEASURE_SIZE_NEG } from 'utils/constants';\n\nconst create = (\n text: string | number = '',\n area: string | null = '',\n tag = 'span'\n) => {\n const _el = document.createElement(tag);\n\n _el.setAttribute('title', text + 'px');\n _el.setAttribute('data-measure', parseInt(text + '', 10) + 'px');\n\n classnames.set(_el, `ph speccer measure ${area}`);\n\n return _el;\n};\n\nexport const element = async (targetEl: HTMLElement) => {\n if (!targetEl) return;\n\n const _areas_string: string | null = targetEl.getAttribute(\n 'data-speccer-measure'\n );\n\n if (_areas_string === '' || !_areas_string) {\n return;\n }\n\n const _target_styles = await styles.get(targetEl);\n\n if (\n _target_styles.display === 'none' ||\n _target_styles.opacity === '0' ||\n _target_styles.visibility === 'hidden'\n ) {\n return;\n }\n\n await waitForFrame();\n\n const _target_rect = targetEl.getBoundingClientRect();\n\n if (isWidthArea(_areas_string)) {\n if (isBottomArea(_areas_string)) {\n const _measure_el = create(_target_rect.width, _areas_string);\n\n document.body.appendChild(_measure_el);\n\n const _positional_styles = await position.getRec(_measure_el, targetEl);\n const { left, top, width } = _positional_styles.fromBottom({\n center: false\n });\n\n await styles.add(_measure_el, {\n left: `${left}px`,\n top: `${top}px`,\n width: `${width}px`\n });\n } else {\n const _measure_el = create(_target_rect.width, _areas_string);\n\n document.body.appendChild(_measure_el);\n\n const _positional_styles = await position.getRec(_measure_el, targetEl);\n const { left, top, width } = _positional_styles.fromTop({\n center: false,\n modifier: SPECCER_DEFAULT_MEASURE_SIZE_NEG\n });\n\n await styles.add(_measure_el, {\n left: `${left}px`,\n top: `${top}px`,\n width: `${width}px`\n });\n }\n } else if (isHeightArea(_areas_string)) {\n if (isRightArea(_areas_string)) {\n const _measure_el = create(_target_rect.height, _areas_string);\n\n document.body.appendChild(_measure_el);\n\n const _positional_styles = await position.getRec(_measure_el, targetEl);\n const { left, top, height } = _positional_styles.fromRight({\n center: false\n });\n\n await styles.add(_measure_el, {\n left: `${left}px`,\n top: `${top}px`,\n height: `${height}px`\n });\n } else {\n const _measure_el = create(_target_rect.height, _areas_string);\n\n document.body.appendChild(_measure_el);\n\n const _positional_styles = await position.getRec(_measure_el, targetEl);\n const { left, top, height } = _positional_styles.fromLeft({\n center: false,\n modifier: SPECCER_DEFAULT_MEASURE_SIZE_NEG\n });\n\n await styles.add(_measure_el, {\n left: `${left}px`,\n top: `${top}px`,\n height: `${height}px`\n });\n }\n }\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport * as styles from '../../utils/styles';\nimport { cx, set } from '../../utils/classnames';\nimport { getRec } from '../../utils/position';\n\nexport const create = (n = 'span') => {\n const markElement = document.createElement(n);\n const classNames = cx('ph speccer mark');\n\n set(markElement, classNames);\n\n return markElement;\n};\n\nexport const element = async (elementToMark: HTMLElement) => {\n if (!elementToMark) return Promise.resolve();\n\n const markElement = create();\n\n document.body.appendChild(markElement);\n\n const positionalStyles = await getRec(markElement, elementToMark);\n const { left, top, height, width } = positionalStyles.absolute();\n const markStyles = {\n left: `${left}px`,\n top: `${top}px`,\n height: `${height}px`,\n width: `${width}px`\n };\n\n await styles.add(markElement, markStyles);\n};\n","/* eslint no-console:0 */\n'use strict';\n\n/**\n * Converts a number to a string with a specified number of decimal places.\n *\n * @param {string | number} number - The number to convert.\n * @param {number} decimals - The number of decimal places (default is 3).\n * @returns {string} - The formatted number as a string.\n *\n * @example\n * // Convert a number to a string with 2 decimal places\n * const formattedNumber = decimal(12.3456, 2); // \"12.34\"\n */\nexport const decimal = (number: string | number, decimals = 3): string =>\n parseFloat(number + '').toFixed(decimals);\n","/* eslint no-console:0 */\n'use strict';\n\nimport * as classnames from '../../utils/classnames';\nimport * as styles from '../../utils/styles';\nimport { position } from './utils/position';\nimport { template } from './utils/template';\n\nexport const create = (html: string, area: string | null) => {\n const _el = document.createElement('div');\n const _extra_class_names = {};\n\n if (area !== null && area !== '') {\n _extra_class_names[area] = true;\n }\n\n const _class_names = classnames.cx(\n 'ph speccer typography',\n _extra_class_names\n );\n\n _el.innerHTML = html;\n\n classnames.set(_el, _class_names);\n\n return _el;\n};\n\nexport const element = async (targetEl: HTMLElement) => {\n if (!targetEl) return;\n\n const _area: string | null = targetEl.getAttribute('data-speccer-typography');\n const _target_styles = await styles.get(targetEl);\n\n if (\n _target_styles.display === 'none' ||\n _target_styles.opacity === '0' ||\n _target_styles.visibility === 'hidden'\n ) {\n return;\n }\n\n targetEl.classList.add('is-specced');\n\n const _html = await template(targetEl);\n const _speccer_el = create(_html, _area);\n\n document.body.appendChild(_speccer_el);\n\n const _position = await position(_area, targetEl, _speccer_el);\n\n styles.add(_speccer_el, _position);\n};\n","/* eslint @typescript-eslint/no-explicit-any: [\"error\", { \"fixToUnknown\": true }] */\n'use strict';\n\nimport { DebounceAnyFunctionType } from 'types/debounce';\n\n/**\n * Creates a debounced version of a function that delays its execution until after a specified waiting time has elapsed since the last time the debounced function was invoked.\n *\n * @param {DebounceAnyFunctionType} func - The function to debounce.\n * @param {number} wait - The number of milliseconds to wait before invoking the function after the last call.\n * @param {boolean} [immediate=false] - If `true`, the function is invoked immediately after the first call.\n * @returns {DebounceAnyFunctionType} - The debounced function.\n *\n * @example\n * // Create a debounced function\n * const debouncedFn = debounce((value) => {\n * console.log(value);\n * }, 500);\n *\n * // Call the debounced function\n * debouncedFn('Hello'); // This will not trigger immediate execution\n * debouncedFn('World'); // This will trigger immediate execution\n */\nconst debounce = (\n func: DebounceAnyFunctionType,\n wait: number,\n immediate = false\n): DebounceAnyFunctionType => {\n let timeout: null | ReturnType<typeof setTimeout>;\n\n return function (context: unknown, ...args: unknown[]): void {\n const later = function (): void {\n timeout = null;\n\n if (!immediate) func.apply(context, args);\n };\n const callNow = immediate && !timeout;\n\n if (timeout) {\n clearTimeout(timeout);\n }\n\n timeout = setTimeout(later, wait);\n\n if (callNow) func.apply(context, args);\n };\n};\n\nexport default debounce;\n","'use strict';\n\nimport { SpeccerFunctionType } from 'types/speccer';\n\nimport debounce from './debounce';\n\n/**\n * Attaches a debounced event listener to the window's resize event that triggers the provided function.\n *\n * @param {SpeccerFunctionType} speccer - The function to trigger when the window is resized.\n *\n * @example\n * // Define a function to be triggered on window resize\n * const mySpeccer = () => {\n * // Your logic here\n * console.log('Window resized');\n * };\n *\n * // Activate the debounced event listener\n * activate(mySpeccer);\n */\nexport const activate = (speccer: SpeccerFunctionType): void => {\n /**\n * The debounced event listener function.\n * @type {Function}\n */\n const speccerEventFunc = () =>\n debounce(() => {\n speccer();\n }, 300);\n\n // Remove any existing resize event listeners to prevent duplicates\n window.removeEventListener('resize', speccerEventFunc);\n\n // Add the debounced resize event listener\n window.addEventListener('resize', speccerEventFunc);\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport { SpeccerFunctionType } from 'types/speccer';\n\nimport * as resize from '../utils/resize';\n\nimport * as spec from '../features/spacing';\nimport * as measure from '../features/measure';\nimport * as dissect from '../features/dissect';\n\nexport const dom = (speccer: SpeccerFunctionType) => {\n if (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', () => {\n speccer();\n });\n } else {\n // `DOMContentLoaded` already fired\n speccer();\n }\n};\n\nexport const lazy = () => {\n const _spec_observer = new IntersectionObserver((els, observer) => {\n els.forEach((el: IntersectionObserverEntry) => {\n if (el.intersectionRatio > 0) {\n spec.element(el.target as HTMLElement);\n observer.unobserve(el.target);\n }\n });\n });\n\n document\n .querySelectorAll(\n '[data-speccer],[data-speccer] *:not(td):not(tr):not(th):not(tfoot):not(thead):not(tbody)'\n )\n .forEach((el) => {\n _spec_observer.observe(el);\n });\n\n const _measure_observer = new IntersectionObserver((els, observer) => {\n els.forEach((el) => {\n if (el.intersectionRatio > 0) {\n measure.element(el.target as HTMLElement);\n observer.unobserve(el.target);\n }\n });\n });\n\n document.querySelectorAll('[data-speccer-measure]').forEach((el) => {\n _measure_observer.observe(el);\n });\n\n const _dissect_observer = new IntersectionObserver((els, observer) => {\n els.forEach((el) => {\n if (el.intersectionRatio > 0) {\n dissect.element(el.target as HTMLElement);\n observer.unobserve(el.target);\n }\n });\n });\n\n document.querySelectorAll('[data-anatomy-section]').forEach((el) => {\n _dissect_observer.observe(el);\n });\n};\n\nexport const manual = (speccer: SpeccerFunctionType) => {\n window.speccer = speccer;\n};\n\nexport const activate = (speccer: SpeccerFunctionType) => {\n const _script = document.currentScript;\n\n if (_script) {\n const _speccer_script_src = _script.getAttribute('src');\n\n if (\n _speccer_script_src &&\n (_speccer_script_src.indexOf('speccer.js') !== -1 ||\n // for codepen\n _speccer_script_src.indexOf('JaXpOK.js') !== -1)\n ) {\n if (_script.hasAttribute('data-manual')) {\n manual(speccer);\n } else if (_script.hasAttribute('data-instant')) {\n speccer();\n } else if (_script.hasAttribute('data-dom')) {\n dom(speccer);\n } else if (_script.hasAttribute('data-lazy')) {\n lazy();\n } else {\n dom(speccer);\n }\n\n if (\n !_script.hasAttribute('data-manual') &&\n !_script.hasAttribute('data-lazy')\n ) {\n resize.activate(speccer);\n }\n }\n }\n};\n","/* eslint no-console:0 */\n'use strict';\n\nimport './types/interfaces/global';\nimport * as node from './utils/node';\nimport * as __spacing from './features/spacing';\nimport * as __dissect from './features/dissect';\nimport * as __measure from './features/measure';\nimport * as __mark from './features/mark';\nimport * as __typography from './features/typography';\nimport * as browser from './config/browser';\n\nexport const spacing = __spacing;\n\nexport const dissect = __dissect;\n\nexport const measure = __measure;\n\nexport const mark = __mark;\n\nexport const typography = __typography;\n\nexport const modes = browser;\n\nconst speccer = () => {\n node.removeAll('.speccer');\n\n const _els_to_be_specced = document.querySelectorAll(\n '[data-speccer],[data-speccer] *:not(td):not(tr):not(th):not(tfoot):not(thead):not(tbody)'\n );\n const _els_to_be_measured = document.querySelectorAll(\n '[data-speccer-measure]'\n );\n const _els_to_be_typography_specced = document.querySelectorAll(\n '[data-speccer-typography]'\n );\n const _els_to_be_dissected = document.querySelectorAll(\n '[data-anatomy-section]'\n );\n const _els_to_be_marked = document.querySelectorAll('[data-speccer-mark]');\n\n _els_to_be_marked.forEach(mark.element);\n _els_to_be_specced.forEach(spacing.element);\n _els_to_be_measured.forEach(measure.element);\n _els_to_be_typography_specced.forEach(typography.element);\n _els_to_be_dissected.forEach(dissect.element);\n};\n\nexport default speccer;\n\nbrowser.activate(speccer);\n","import * as css from '../../../utils/css';\nimport * as styles from '../../../utils/styles';\n\nexport const template = async (targetEl: HTMLElement): Promise<string> => {\n const _target_styles = await styles.get(targetEl);\n const _styles = css.getTypography(_target_styles);\n const _line_height =\n _styles['lineHeight'] !== 'normal'\n ? parseInt(_styles['lineHeight'], 10) / 16 + 'rem'\n : 'normal';\n\n return (\n `\n` +\n 'font-styles: {' +\n '<ul class=\"speccer-styles\">' +\n ` <li><span class=\"property\">font-family:</span> ${_styles['fontFamily']};</li>` +\n ` <li><span class=\"property\">font-size:</span> ${_styles['fontSize']} / ${\n parseInt(_styles['fontSize'], 10) / 16\n }rem;</li>` +\n ` <li><span class=\"property\">font-weight:</span> ${_styles['fontWeight']};</li>` +\n ` <li><span class=\"property\">font-variation-settings:</span> ${_styles['fontVariationSettings']};</li>` +\n ` <li><span class=\"property\">line-height:</span> ${_styles['lineHeight']} / ${_line_height};</li>` +\n ` <li><span class=\"property\">letter-spacing:</span> ${_styles['letterSpacing']};</li>` +\n ` <li><span class=\"property\">font-style:</span> ${_styles['fontStyle']};</li>` +\n '</ul>' +\n '}'\n );\n};\n","import * as css from '../../../utils/css';\nimport * as number from '../../../utils/number';\nimport {\n get_horizontal_center_of_els,\n get_vertical_center_of_els,\n offset\n} from '../../../utils/position';\n\nimport { SpeccerAreaEnum } from '../../../types/enums/area';\n\nexport const position = async (\n area: string | null,\n targetEl: HTMLElement,\n speccerEl: HTMLElement\n) => {\n const _target_rect = targetEl.getBoundingClientRect();\n const SPECCER_PIN_SPACE = css.pinSpace(speccerEl);\n const _speccer_el_rect = speccerEl.getBoundingClientRect();\n const _el_offset = await offset(targetEl);\n const _left_layout_position_left =\n _el_offset.left - _speccer_el_rect.width - SPECCER_PIN_SPACE + 'px';\n const _left_layout_position_top =\n number.decimal(\n get_vertical_center_of_els(_el_offset.top, _speccer_el_rect, _target_rect)\n ) + 'px';\n const _right_layout_position_left =\n _el_offset.left + _target_rect.width + SPECCER_PIN_SPACE + 'px';\n const _right_layout_position_top =\n number.decimal(\n get_vertical_center_of_els(_el_offset.top, _speccer_el_rect, _target_rect)\n ) + 'px';\n const _top_layout_position_left =\n number.decimal(\n get_horizontal_center_of_els(\n _el_offset.left,\n _speccer_el_rect,\n _target_rect\n )\n ) + 'px';\n const _top_layout_position_top =\n _el_offset.top - _speccer_el_rect.height - SPECCER_PIN_SPACE + 'px';\n const _bottom_layout_position_left =\n number.decimal(\n get_horizontal_center_of_els(\n _el_offset.left,\n _speccer_el_rect,\n _target_rect\n )\n ) + 'px';\n const _bottom_layout_position_top =\n _el_offset.top + _target_rect.height + SPECCER_PIN_SPACE + 'px';\n\n let _position = {\n left: _left_layout_position_left,\n top: _left_layout_position_top\n };\n\n if (area && area.indexOf(SpeccerAreaEnum.Right) !== -1) {\n _position = {\n left: _right_layout_position_left,\n top: _right_layout_position_top\n };\n } else if (area && area.indexOf(SpeccerAreaEnum.Top) !== -1) {\n _position = {\n left: _top_layout_position_left,\n top: _top_layout_position_top\n };\n } else if (area && area.indexOf(SpeccerAreaEnum.Bottom) !== -1) {\n _position = {\n left: _bottom_layout_position_left,\n top: _bottom_layout_position_top\n };\n }\n\n return _position;\n};\n"],"names":["set","el","cls","avoid","length","trim","split","filter","cl","forEach","classList","add","cx","cls_obj","Object","keys","classname","join","SPECCER_LITERALS","getNumberValue","value","parseInt","pinSpace","getComputedStyle","getPropertyValue","waitForFrame","Promise","requestAnimationFrame","async","styles","Array","isArray","constructor","style","key","get","get_horizontal_center_of_els","modifier","startRect","targetRect","width","get_vertical_center_of_els","height","offset","targetEl","_target_rect","getBoundingClientRect","_el_offset_top","top","window","pageYOffset","_el_offset_left","left","pageXOffset","getRec","sourceEl","_source_rect","_target_offset","_target_offset_center","offsetWithCenter","_target_height","_target_width","_source_height","_source_width","absolute","toTop","center","sourceHeight","fromTop","toBottom","targetHeight","fromBottom","toLeft","sourceWidth","fromLeft","toRight","targetWidth","fromRight","create","text","tag","_el","document","createElement","_text_content","createTextNode","appendChild","setAttribute","classnames.set","element","_target_styles","styles.get","display","opacity","visibility","_target_spacing_styles","marginTop","marginBottom","marginLeft","marginRight","paddingTop","paddingBottom","paddingLeft","paddingRight","css.getSpacing","_target_pruned_spacing_styles","property","_value","css.getNumberValue","_speccer_el","_class_name","indexOf","replace","css.getClassNameFromCSSProperty","body","spacingEl","styles.add","position","SpeccerAreaEnum","DissectAreaEnum","MeasureAreaEnum","getAreasFromString","areaString","isRightArea","includes","Right","isBottomArea","Bottom","isFullArea","Full","isEncloseArea","Enclose","isCurly","Curly","__classPrivateFieldGet","receiver","state","kind","f","TypeError","has","call","__classPrivateFieldSet","uniqueID","Math","random","toString","substring","coords","rect","xy","x","y","right","bottom","intrinsic_coords","pos","Error","_allowed_positions","_el_rect","getCoordsPairFromObjects","el1","el2","pos1","pos2","x1","y1","x2","y2","createBezierCurveCoordinates","options","direct","firstSet","direction","firstControl","lastControl","firstPoint","lastPoint","getCurlySVGPath","startEl","stopEl","x2modifier","y2modifier","coordinates","direction_of_element","start","stop","crude","_angle","cy","ex","ey","normalize","SyntaxError","dy","dx","theta","atan2","PI","angle","degrees","RangeError","cardinal_direction_crude","cardinal_direction","DrawSVGLine","startElement","stopElement","_DrawSVGLine_canvas","this","_DrawSVGLine_originalPathElement","connect","draw","path","_path_el_id","_new_path","cloneNode","getAttribute","remove","parentNode","line","insertBefore","nextSibling","_direction","getPositionsForSVGPath","_d","getSVGPath","WeakMap","_DrawSVGLine_instances","WeakSet","_DrawSVGLine_init","contains","getElementById","DrawSVGCurlyBracket","_DrawSVGCurlyBracket_canvas","_DrawSVGCurlyBracket_originalPathElement","_first_path_element","_DrawSVGCurlyBracket_instances","_DrawSVGCurlyBracket_getPathElement","_second_path_element","firstPathElement","secondPathElement","path1pos1","path1pos2","path2pos1","path2pos2","getPositionsForCurlySVGPath","_first_path_d","_second_path_d","_DrawSVGCurlyBracket_init","area","dissectionEl","SPECCER_PIN_SPACE","css.pinSpace","SPECCER_MEASURE_SIZE","_positional_styles","position.getRec","Left","textContent","n","_text_node","_extra_class_names","_class_names","classnames.cx","sectionEl","_dissection_els","querySelectorAll","_index_to_use","targetIndex","resolve","_areas_string","Outline","_literal_to_use","toLowerCase","_dissection_el","_dissection_styles","SVG","Width","_measure_el","SPECCER_DEFAULT_MEASURE_SIZE","Height","isHeightArea","markElement","classNames","decimal","number","decimals","parseFloat","toFixed","html","innerHTML","activate","speccer","speccerEventFunc","func","wait","immediate","timeout","context","args","callNow","clearTimeout","setTimeout","apply","debounce","removeEventListener","addEventListener","dom","readyState","lazy","_spec_observer","IntersectionObserver","els","observer","intersectionRatio","spec.element","target","unobserve","observe","_measure_observer","measure.element","_dissect_observer","dissect.element","manual","_script","currentScript","_speccer_script_src","hasAttribute","resize.activate","spacing","__spacing","dissect","measure","mark","elementToMark","positionalStyles","markStyles","typography","_area","_html","_styles","lineHeight","letterSpacing","fontFamily","fontSize","fontStyle","fontVariationSettings","fontWeight","css.getTypography","_line_height","template","_position","speccerEl","_speccer_el_rect","_el_offset","_left_layout_position_left","_left_layout_position_top","number.decimal","_right_layout_position_left","_right_layout_position_top","_top_layout_position_left","_top_layout_position_top","_bottom_layout_position_left","_bottom_layout_position_top","Top","modes","selector","e","node.removeAll","_els_to_be_specced","_els_to_be_measured","_els_to_be_typography_specced","_els_to_be_dissected"],"mappings":"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"}
|
package/speccer.min.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ph.speccer{--ph-speccer-color-padding:#db6fff66;--ph-speccer-color-padding-hover:#db6fff;--ph-speccer-color-margin:#fff76f66;--ph-speccer-color-margin-hover:#fff76f;--ph-speccer-color-text-light:#fff;--ph-speccer-color-text-dark:#333;--ph-speccer-color-contrast:#ff3aa8;--ph-speccer-spacing-color:var(--ph-speccer-color-contrast);--ph-speccer-measure-color:red;--ph-speccer-pin-color:var(--ph-speccer-color-contrast);--ph-speccer-typography-background-color:#fff;--ph-speccer-typography-color-property:#3f85f2;--ph-speccer-typography-color-text:#57575b;--ph-speccer-typography-color-value:var(--ph-speccer-color-contrast);--ph-speccer-depth-opacity-400:0.4;--ph-speccer-font-family:"Menlo for Powerline","Menlo Regular for Powerline","DejaVu Sans Mono",Consolas,Monaco,"Andale Mono","Ubuntu Mono",monospace;--ph-speccer-font-size:12px;--ph-speccer-line-height:12px;--ph-speccer-pin-size:24px;--ph-speccer-pin-space:48px;--ph-speccer-line-width:1px;--ph-speccer-line-width-negative:-1px;--ph-speccer-measure-size:8px}.ph.speccer,.ph.speccer:after,.ph.speccer:before,svg.ph{box-sizing:border-box;pointer-events:none;user-select:none}.ph.speccer:after,.ph.speccer:before,.ph.speccer:not(path){align-items:center;display:flex;font-family:var(--ph-speccer-font-family)!important;font-size:12px;justify-content:center;line-height:12px;position:absolute;z-index:99999}#ph-speccer-svg{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:3}svg.ph .ph.path{color:var(--ph-speccer-color-contrast,#ff3aa8)}.ph.speccer.dissection{align-items:center;background-color:var(--ph-speccer-pin-color);border-radius:100%;color:var(--ph-speccer-color-text-light);display:flex;font-family:sans-serif;font-size:16px;font-weight:400;height:var(--ph-speccer-pin-size);justify-content:center;line-height:150%;position:absolute;width:var(--ph-speccer-pin-size);z-index:100000}.ph.speccer.dissection.curly:after,.ph.speccer.dissection.svg:after{content:none!important}.ph.speccer.dissection.outline.left:after{right:auto}.ph.speccer.dissection.outline.right:after{left:auto}.ph.speccer.dissection:after{background-color:var(--ph-speccer-pin-color);content:"";height:var(--ph-speccer-pin-space);position:absolute;top:100%;width:var(--ph-speccer-line-width);z-index:99999}.ph.speccer.dissection.outline.left:after{height:var(--ph-speccer-line-width);left:100%;top:50%;width:var(--ph-speccer-pin-space)}.ph.speccer.dissection.outline.right:after{height:var(--ph-speccer-line-width);right:100%;top:50%;width:var(--ph-speccer-pin-space)}.ph.speccer.dissection.outline.enclose{background-color:initial;border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);border-radius:0;color:var(--ph-speccer-measure-color)}.ph.speccer.dissection.outline.enclose:after{bottom:auto;top:calc(var(--ph-speccer-line-width-negative) - var(--ph-speccer-pin-size) - var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.enclose:before{bottom:100%;top:auto}.ph.speccer.dissection.outline.enclose.right:after{left:calc(100% + var(--ph-speccer-pin-space) + var(--ph-speccer-line-width));right:auto}.ph.speccer.dissection.outline.enclose.right:before{left:100%;right:auto}.ph.speccer.dissection.outline.enclose.left:after{left:calc(var(--ph-speccer-line-width-negative) - var(--ph-speccer-pin-size) - var(--ph-speccer-pin-space));right:auto}.ph.speccer.dissection.outline.enclose.left:before{left:auto;right:100%}.ph.speccer.dissection.outline.enclose.top:after{bottom:auto;top:calc(var(--ph-speccer-line-width-negative) - var(--ph-speccer-pin-size) - var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.enclose.top:before{bottom:100%;top:auto}.ph.speccer.dissection.outline.enclose.bottom:after{bottom:auto;top:calc(100% + var(--ph-speccer-pin-space) + var(--ph-speccer-line-width))}.ph.speccer.dissection.outline.enclose.bottom:before{bottom:auto;top:100%}.ph.speccer.dissection.outline.full:not(.curly){background-color:initial;border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);border-bottom:none;border-radius:0;color:var(--ph-speccer-measure-color)}.ph.speccer.dissection.outline.full:not(.curly):after{top:calc(-8px - var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.full:not(.curly):before{bottom:100%}.ph.speccer.dissection.outline.full:not(.curly).right{border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);border-left:none}.ph.speccer.dissection.outline.full:not(.curly).right:after{left:calc(8px + var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.full:not(.curly).right:before{left:100%;right:auto}.ph.speccer.dissection.outline.full:not(.curly).left{border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);border-right:none}.ph.speccer.dissection.outline.full:not(.curly).left:after{left:calc(-8px - var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.full:not(.curly).left:before{left:auto;right:100%}.ph.speccer.dissection.outline.full:not(.curly).top{border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);border-bottom:none}.ph.speccer.dissection.outline.full:not(.curly).top:after{top:calc(-8px - var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.full:not(.curly).top:before{bottom:100%}.ph.speccer.dissection.outline.full:not(.curly).bottom{border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);border-top:none}.ph.speccer.dissection.outline.full:not(.curly).bottom:after{top:calc(8px + var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.full:not(.curly).bottom:before{top:100%}.ph.speccer.dissection.outline.bottom:after{height:var(--ph-speccer-pin-space);right:50%;top:calc(-100% - var(--ph-speccer-pin-space)/2);width:var(--ph-speccer-line-width)}.ph.speccer.dissection.outline.top:after,.ph.speccer.dissection.outline:after{height:var(--ph-speccer-pin-space);right:50%;top:100%;width:var(--ph-speccer-line-width)}[data-anatomy-section]{counter-reset:type}.ph.speccer.dissection.outline.full.left:not(.curly),.ph.speccer.dissection.outline.full.right:not(.curly){width:8px}.ph.speccer.dissection.outline.full.bottom:not(.curly),.ph.speccer.dissection.outline.full.top:not(.curly),.ph.speccer.dissection.outline.full:not(.curly){height:8px}.ph.speccer.dissection.outline.full.bottom:not(.curly):after,.ph.speccer.dissection.outline.full.left:not(.curly):after,.ph.speccer.dissection.outline.full.right:not(.curly):after,.ph.speccer.dissection.outline.full.top:not(.curly):after,.ph.speccer.dissection.outline.full:not(.curly):after{align-items:center;background-color:var(--ph-speccer-pin-color);border-radius:100%;color:var(--ph-speccer-color-text-light);content:attr(data-dissection-counter);display:flex;font-size:16px;height:var(--ph-speccer-pin-size);justify-content:center;line-height:150%;position:absolute;width:var(--ph-speccer-pin-size);z-index:100000}.ph.speccer.dissection.outline.full.left:not(.curly):after,.ph.speccer.dissection.outline.full.right:not(.curly):after{top:50%;transform:translateY(-50%)}.ph.speccer.dissection.outline.full.bottom:not(.curly):after,.ph.speccer.dissection.outline.full.top:not(.curly):after,.ph.speccer.dissection.outline.full:not(.curly):after{left:50%;transform:translateX(-50%)}.ph.speccer.dissection.outline.full.bottom:not(.curly):before,.ph.speccer.dissection.outline.full.left:not(.curly):before,.ph.speccer.dissection.outline.full.right:not(.curly):before,.ph.speccer.dissection.outline.full.top:not(.curly):before,.ph.speccer.dissection.outline.full:not(.curly):before{background-color:var(--ph-speccer-pin-color);content:"";display:block;position:absolute;z-index:100000}.ph.speccer.dissection.outline.full.left:not(.curly):before,.ph.speccer.dissection.outline.full.right:not(.curly):before{height:var(--ph-speccer-line-width);top:50%;transform:translateY(-50%);width:calc(var(--ph-speccer-pin-space) + var(--ph-speccer-line-width))}.ph.speccer.dissection.outline.full.bottom:not(.curly):before,.ph.speccer.dissection.outline.full.top:not(.curly):before,.ph.speccer.dissection.outline.full:not(.curly):before{height:calc(var(--ph-speccer-pin-space) + var(--ph-speccer-line-width));left:50%;transform:translateX(-50%);width:var(--ph-speccer-line-width)}.ph.speccer.dissection.outline.enclose.left,.ph.speccer.dissection.outline.enclose.right{width:8px}.ph.speccer.dissection.outline.enclose,.ph.speccer.dissection.outline.enclose.bottom,.ph.speccer.dissection.outline.enclose.top{height:8px}.ph.speccer.dissection.outline.enclose.bottom:after,.ph.speccer.dissection.outline.enclose.left:after,.ph.speccer.dissection.outline.enclose.right:after,.ph.speccer.dissection.outline.enclose.top:after,.ph.speccer.dissection.outline.enclose:after{align-items:center;background-color:var(--ph-speccer-pin-color);border-radius:100%;color:var(--ph-speccer-color-text-light);content:attr(data-dissection-counter);display:flex;font-size:16px;height:var(--ph-speccer-pin-size);justify-content:center;line-height:150%;position:absolute;width:var(--ph-speccer-pin-size);z-index:100000}.ph.speccer.dissection.outline.enclose.left:after,.ph.speccer.dissection.outline.enclose.right:after{top:50%;transform:translateY(-50%)}.ph.speccer.dissection.outline.enclose.bottom:after,.ph.speccer.dissection.outline.enclose.top:after,.ph.speccer.dissection.outline.enclose:after{left:50%;transform:translateX(-50%)}.ph.speccer.dissection.outline.enclose.bottom:before,.ph.speccer.dissection.outline.enclose.left:before,.ph.speccer.dissection.outline.enclose.right:before,.ph.speccer.dissection.outline.enclose.top:before,.ph.speccer.dissection.outline.enclose:before{background-color:var(--ph-speccer-pin-color);content:"";display:block;position:absolute;z-index:100000}.ph.speccer.dissection.outline.enclose.left:before,.ph.speccer.dissection.outline.enclose.right:before{height:var(--ph-speccer-line-width);top:50%;transform:translateY(-50%);width:calc(var(--ph-speccer-pin-space) + var(--ph-speccer-line-width))}.ph.speccer.dissection.outline.enclose.bottom:before,.ph.speccer.dissection.outline.enclose.top:before,.ph.speccer.dissection.outline.enclose:before{height:calc(var(--ph-speccer-pin-space) + var(--ph-speccer-line-width));left:50%;transform:translateX(-50%);width:var(--ph-speccer-line-width)}.ph.speccer.dissection.outline.subtle{background-color:var(--ph-speccer-color-text-light);border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);color:var(--ph-speccer-pin-color)}.ph.speccer.dissection.outline.subtle.bottom:after,.ph.speccer.dissection.outline.subtle.top:after{background-color:initial;border-right:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);width:0}.ph.speccer.dissection.outline.subtle.left:after,.ph.speccer.dissection.outline.subtle.right:after{background-color:initial;border-top:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);height:0}.ph.speccer.dissection.outline.full.subtle:not(.curly){background-color:initial}.ph.speccer.dissection.outline.full.subtle:not(.curly),.ph.speccer.dissection.outline.full.subtle:not(.curly).top{border:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);border-bottom:none}.ph.speccer.dissection.outline.full.subtle:not(.curly).bottom{border:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);border-top:none}.ph.speccer.dissection.outline.full.subtle:not(.curly).right{border:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);border-left:none}.ph.speccer.dissection.outline.full.subtle:not(.curly).left{border:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);border-right:none}.ph.speccer.dissection.outline.full.subtle:not(.curly):after{background-color:var(--ph-speccer-color-text-light);border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);color:var(--ph-speccer-pin-color);height:var(--ph-speccer-pin-size);width:var(--ph-speccer-pin-size)}.ph.speccer.dissection.outline.full.subtle:not(.curly).bottom:before,.ph.speccer.dissection.outline.full.subtle:not(.curly).top:before{background-color:initial;border-right:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);width:0}.ph.speccer.dissection.outline.full.subtle:not(.curly).left:before,.ph.speccer.dissection.outline.full.subtle:not(.curly).right:before{background-color:initial;border-top:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);height:0}.ph.speccer.dissection.outline.enclose.subtle{border-style:dashed}.ph.speccer.dissection.outline.enclose.subtle:after{background-color:var(--ph-speccer-color-text-light);border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);color:var(--ph-speccer-pin-color);height:var(--ph-speccer-pin-size);width:var(--ph-speccer-pin-size)}.ph.speccer.dissection.outline.enclose.subtle.bottom:before,.ph.speccer.dissection.outline.enclose.subtle.top:before{background-color:initial;border-right:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);width:0}.ph.speccer.dissection.outline.enclose.subtle.left:before,.ph.speccer.dissection.outline.enclose.subtle.right:before{background-color:initial;border-top:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);height:0}.ph.speccer.spacing{border:var(--ph-speccer-line-width) solid #0000;pointer-events:auto;transition:none}.ph.speccer.spacing:hover{border:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark)}.ph.speccer.spacing.margin{background-color:var(--ph-speccer-color-margin);color:var(--ph-speccer-color-text-dark)}.ph.speccer.spacing.padding{background-color:var(--ph-speccer-color-padding);color:var(--ph-speccer-spacing-color)}.ph.speccer.spacing.margin.bottom:after,.ph.speccer.spacing.margin.top:after{border-bottom:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark);border-top:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark);content:"";height:100%;left:40%;position:absolute;transition:none;width:9px}.ph.speccer.spacing.margin.bottom:before,.ph.speccer.spacing.margin.top:before{border-left:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark);content:"";height:100%;left:40%;margin-left:4px;position:absolute;transition:none;width:0}.ph.speccer.spacing.margin.left:after,.ph.speccer.spacing.margin.right:after{border-left:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark);border-right:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark);content:"";height:9px;position:absolute;top:10%;transition:none;width:100%}.ph.speccer.spacing.margin.left:before,.ph.speccer.spacing.margin.right:before{border-top:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark);content:"";height:0;margin-top:4px;position:absolute;top:10%;transition:none;width:100%}.ph.speccer.spacing.padding.bottom:after,.ph.speccer.spacing.padding.top:after{border-bottom:var(--ph-speccer-line-width) solid var(--ph-speccer-spacing-color);border-top:var(--ph-speccer-line-width) solid var(--ph-speccer-spacing-color);content:"";height:100%;left:40%;position:absolute;transition:none;width:9px}.ph.speccer.spacing.padding.bottom:before,.ph.speccer.spacing.padding.top:before{border-left:var(--ph-speccer-line-width) solid var(--ph-speccer-spacing-color);content:"";height:100%;left:40%;margin-left:4px;position:absolute;transition:none;width:0}.ph.speccer.spacing.padding.left:after,.ph.speccer.spacing.padding.right:after{border-left:var(--ph-speccer-line-width) solid var(--ph-speccer-spacing-color);border-right:var(--ph-speccer-line-width) solid var(--ph-speccer-spacing-color);content:"";height:9px;position:absolute;top:10%;transition:none;width:100%}.ph.speccer.spacing.padding.left:before,.ph.speccer.spacing.padding.right:before{border-top:var(--ph-speccer-line-width) solid var(--ph-speccer-spacing-color);content:"";height:0;margin-top:4px;position:absolute;top:10%;transition:none;width:100%}.ph.speccer.typography{background-color:var(--ph-speccer-typography-background-color);color:var(--ph-speccer-typography-color-text);display:block;font-size:10px;line-height:140%;max-width:none;padding:8px;text-align:left;width:auto}.ph.speccer.typography,.ph.speccer.typography:hover{border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color)}.ph.speccer.typography:after{background-color:var(--ph-speccer-pin-color);content:"";display:block;position:absolute}.ph.speccer.typography.left:after,.ph.speccer.typography:after{left:100%}.ph.speccer.typography.left:after,.ph.speccer.typography.right:after,.ph.speccer.typography:after{height:var(--ph-speccer-line-width);top:50%;transform:translateY(-50%);width:var(--ph-speccer-pin-space)}.ph.speccer.typography.right:after{left:auto;right:100%}.ph.speccer.typography.top:after{top:100%}.ph.speccer.typography.bottom:after,.ph.speccer.typography.top:after{height:var(--ph-speccer-pin-space);left:50%;right:auto;transform:translateX(-50%);width:var(--ph-speccer-line-width)}.ph.speccer.typography.bottom:after{bottom:100%;top:auto}.ph.speccer.typography .speccer-styles{font-size:10px;line-height:140%;list-style:none;margin:0;padding:0 0 0 8px;width:100%}.ph.speccer.typography .speccer-styles .property{color:var(--ph-speccer-typography-color-property);font-size:10px;font-weight:400;margin:0;padding:0;text-align:left}.ph.speccer.typography .speccer-styles>li{border:none;color:var(--ph-speccer-typography-color-value);font-size:10px;font-weight:400;list-style:none;margin:0;padding:0;text-align:left}.ph.speccer.measure{display:flex}.ph.speccer.measure.width{border:var(--ph-speccer-line-width) solid var(--ph-speccer-measure-color);border-bottom:none;color:var(--ph-speccer-measure-color);height:var(--ph-speccer-measure-size)}.ph.speccer.measure.width:after{content:attr(data-measure);position:absolute;top:calc(-100% - 10px)}.ph.speccer.measure.width.bottom{border:var(--ph-speccer-line-width) solid var(--ph-speccer-measure-color);border-top:none;color:var(--ph-speccer-measure-color)}.ph.speccer.measure.width.bottom:after{content:attr(data-measure);position:absolute;top:calc(100% + 5px)}.ph.speccer.measure.width.top{border:var(--ph-speccer-line-width) solid var(--ph-speccer-measure-color);border-bottom:none;color:var(--ph-speccer-measure-color)}.ph.speccer.measure.width.top:after{bottom:calc(100% + 5px);content:attr(data-measure);position:absolute}.ph.speccer.measure.height.left{border:var(--ph-speccer-line-width) solid var(--ph-speccer-measure-color);border-right:none;color:var(--ph-speccer-measure-color);width:var(--ph-speccer-measure-size)}.ph.speccer.measure.height.left:after{content:attr(data-measure);left:calc(-100% - 20px - var(--ph-speccer-line-width));position:absolute;top:50%;transform:translateY(-50%) rotate(-90deg)}.ph.speccer.measure.height.right{border:var(--ph-speccer-line-width) solid var(--ph-speccer-measure-color);border-left:none;color:var(--ph-speccer-measure-color);width:var(--ph-speccer-measure-size)}.ph.speccer.measure.height.right:after{content:attr(data-measure);left:calc(100% - var(--ph-speccer-measure-size));position:absolute;top:50%;transform:translateY(-50%) rotate(90deg)}.ph.speccer.measure.subtle.height.left,.ph.speccer.measure.subtle.height.right,.ph.speccer.measure.subtle.width.bottom,.ph.speccer.measure.subtle.width.top{border-style:dashed}.ph.speccer.measure.subtle.width.top{border-bottom:none}.ph.speccer.measure.subtle.width.bottom{border-top:none}.ph.speccer.measure.subtle.height.right{border-left:none}.ph.speccer.measure.subtle.height.left{border-right:none}
|
|
1
|
+
.ph.speccer{--ph-speccer-color-padding:#db6fff66;--ph-speccer-color-padding-hover:#db6fff;--ph-speccer-color-margin:#fff76f66;--ph-speccer-color-margin-hover:#fff76f;--ph-speccer-color-text-light:#fff;--ph-speccer-color-text-dark:#333;--ph-speccer-color-contrast:#ff3aa8;--ph-speccer-mark-background-color:#ff3aa833;--ph-speccer-mark-border-color:#ff3aa8;--ph-speccer-spacing-color:var(--ph-speccer-color-contrast);--ph-speccer-measure-color:red;--ph-speccer-pin-color:var(--ph-speccer-color-contrast);--ph-speccer-typography-background-color:#fff;--ph-speccer-typography-color-property:#3f85f2;--ph-speccer-typography-color-text:#57575b;--ph-speccer-typography-color-value:var(--ph-speccer-color-contrast);--ph-speccer-depth-opacity-400:0.4;--ph-speccer-font-family:"Menlo for Powerline","Menlo Regular for Powerline","DejaVu Sans Mono",Consolas,Monaco,"Andale Mono","Ubuntu Mono",monospace;--ph-speccer-font-size:12px;--ph-speccer-line-height:12px;--ph-speccer-pin-size:24px;--ph-speccer-pin-space:48px;--ph-speccer-line-width:1px;--ph-speccer-line-width-negative:-1px;--ph-speccer-measure-size:8px}.ph.speccer,.ph.speccer:after,.ph.speccer:before,svg.ph{box-sizing:border-box;pointer-events:none;user-select:none}.ph.speccer:after,.ph.speccer:before,.ph.speccer:not(path){align-items:center;display:flex;font-family:var(--ph-speccer-font-family)!important;font-size:12px;justify-content:center;line-height:12px;position:absolute;z-index:99999}#ph-speccer-svg{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:3}svg.ph .ph.path{color:var(--ph-speccer-color-contrast,#ff3aa8)}.ph.speccer.dissection{align-items:center;background-color:var(--ph-speccer-pin-color);border-radius:100%;color:var(--ph-speccer-color-text-light);display:flex;font-family:sans-serif;font-size:16px;font-weight:400;height:var(--ph-speccer-pin-size);justify-content:center;line-height:150%;position:absolute;width:var(--ph-speccer-pin-size);z-index:100000}.ph.speccer.dissection.curly:after,.ph.speccer.dissection.svg:after{content:none!important}.ph.speccer.dissection.outline.left:after{right:auto}.ph.speccer.dissection.outline.right:after{left:auto}.ph.speccer.dissection:after{background-color:var(--ph-speccer-pin-color);content:"";height:var(--ph-speccer-pin-space);position:absolute;top:100%;width:var(--ph-speccer-line-width);z-index:99999}.ph.speccer.dissection.outline.left:after{height:var(--ph-speccer-line-width);left:100%;top:50%;width:var(--ph-speccer-pin-space)}.ph.speccer.dissection.outline.right:after{height:var(--ph-speccer-line-width);right:100%;top:50%;width:var(--ph-speccer-pin-space)}.ph.speccer.dissection.outline.enclose{background-color:initial;border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);border-radius:0;color:var(--ph-speccer-measure-color)}.ph.speccer.dissection.outline.enclose:after{bottom:auto;top:calc(var(--ph-speccer-line-width-negative) - var(--ph-speccer-pin-size) - var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.enclose:before{bottom:100%;top:auto}.ph.speccer.dissection.outline.enclose.right:after{left:calc(100% + var(--ph-speccer-pin-space) + var(--ph-speccer-line-width));right:auto}.ph.speccer.dissection.outline.enclose.right:before{left:100%;right:auto}.ph.speccer.dissection.outline.enclose.left:after{left:calc(var(--ph-speccer-line-width-negative) - var(--ph-speccer-pin-size) - var(--ph-speccer-pin-space));right:auto}.ph.speccer.dissection.outline.enclose.left:before{left:auto;right:100%}.ph.speccer.dissection.outline.enclose.top:after{bottom:auto;top:calc(var(--ph-speccer-line-width-negative) - var(--ph-speccer-pin-size) - var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.enclose.top:before{bottom:100%;top:auto}.ph.speccer.dissection.outline.enclose.bottom:after{bottom:auto;top:calc(100% + var(--ph-speccer-pin-space) + var(--ph-speccer-line-width))}.ph.speccer.dissection.outline.enclose.bottom:before{bottom:auto;top:100%}.ph.speccer.dissection.outline.full:not(.curly){background-color:initial;border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);border-bottom:none;border-radius:0;color:var(--ph-speccer-measure-color)}.ph.speccer.dissection.outline.full:not(.curly):after{top:calc(-8px - var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.full:not(.curly):before{bottom:100%}.ph.speccer.dissection.outline.full:not(.curly).right{border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);border-left:none}.ph.speccer.dissection.outline.full:not(.curly).right:after{left:calc(8px + var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.full:not(.curly).right:before{left:100%;right:auto}.ph.speccer.dissection.outline.full:not(.curly).left{border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);border-right:none}.ph.speccer.dissection.outline.full:not(.curly).left:after{left:calc(-8px - var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.full:not(.curly).left:before{left:auto;right:100%}.ph.speccer.dissection.outline.full:not(.curly).top{border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);border-bottom:none}.ph.speccer.dissection.outline.full:not(.curly).top:after{top:calc(-8px - var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.full:not(.curly).top:before{bottom:100%}.ph.speccer.dissection.outline.full:not(.curly).bottom{border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);border-top:none}.ph.speccer.dissection.outline.full:not(.curly).bottom:after{top:calc(8px + var(--ph-speccer-pin-space))}.ph.speccer.dissection.outline.full:not(.curly).bottom:before{top:100%}.ph.speccer.dissection.outline.bottom:after{height:var(--ph-speccer-pin-space);right:50%;top:calc(-100% - var(--ph-speccer-pin-space)/2);width:var(--ph-speccer-line-width)}.ph.speccer.dissection.outline.top:after,.ph.speccer.dissection.outline:after{height:var(--ph-speccer-pin-space);right:50%;top:100%;width:var(--ph-speccer-line-width)}[data-anatomy-section]{counter-reset:type}.ph.speccer.dissection.outline.full.left:not(.curly),.ph.speccer.dissection.outline.full.right:not(.curly){width:8px}.ph.speccer.dissection.outline.full.bottom:not(.curly),.ph.speccer.dissection.outline.full.top:not(.curly),.ph.speccer.dissection.outline.full:not(.curly){height:8px}.ph.speccer.dissection.outline.full.bottom:not(.curly):after,.ph.speccer.dissection.outline.full.left:not(.curly):after,.ph.speccer.dissection.outline.full.right:not(.curly):after,.ph.speccer.dissection.outline.full.top:not(.curly):after,.ph.speccer.dissection.outline.full:not(.curly):after{align-items:center;background-color:var(--ph-speccer-pin-color);border-radius:100%;color:var(--ph-speccer-color-text-light);content:attr(data-dissection-counter);display:flex;font-size:16px;height:var(--ph-speccer-pin-size);justify-content:center;line-height:150%;position:absolute;width:var(--ph-speccer-pin-size);z-index:100000}.ph.speccer.dissection.outline.full.left:not(.curly):after,.ph.speccer.dissection.outline.full.right:not(.curly):after{top:50%;transform:translateY(-50%)}.ph.speccer.dissection.outline.full.bottom:not(.curly):after,.ph.speccer.dissection.outline.full.top:not(.curly):after,.ph.speccer.dissection.outline.full:not(.curly):after{left:50%;transform:translateX(-50%)}.ph.speccer.dissection.outline.full.bottom:not(.curly):before,.ph.speccer.dissection.outline.full.left:not(.curly):before,.ph.speccer.dissection.outline.full.right:not(.curly):before,.ph.speccer.dissection.outline.full.top:not(.curly):before,.ph.speccer.dissection.outline.full:not(.curly):before{background-color:var(--ph-speccer-pin-color);content:"";display:block;position:absolute;z-index:100000}.ph.speccer.dissection.outline.full.left:not(.curly):before,.ph.speccer.dissection.outline.full.right:not(.curly):before{height:var(--ph-speccer-line-width);top:50%;transform:translateY(-50%);width:calc(var(--ph-speccer-pin-space) + var(--ph-speccer-line-width))}.ph.speccer.dissection.outline.full.bottom:not(.curly):before,.ph.speccer.dissection.outline.full.top:not(.curly):before,.ph.speccer.dissection.outline.full:not(.curly):before{height:calc(var(--ph-speccer-pin-space) + var(--ph-speccer-line-width));left:50%;transform:translateX(-50%);width:var(--ph-speccer-line-width)}.ph.speccer.dissection.outline.enclose.left,.ph.speccer.dissection.outline.enclose.right{width:8px}.ph.speccer.dissection.outline.enclose,.ph.speccer.dissection.outline.enclose.bottom,.ph.speccer.dissection.outline.enclose.top{height:8px}.ph.speccer.dissection.outline.enclose.bottom:after,.ph.speccer.dissection.outline.enclose.left:after,.ph.speccer.dissection.outline.enclose.right:after,.ph.speccer.dissection.outline.enclose.top:after,.ph.speccer.dissection.outline.enclose:after{align-items:center;background-color:var(--ph-speccer-pin-color);border-radius:100%;color:var(--ph-speccer-color-text-light);content:attr(data-dissection-counter);display:flex;font-size:16px;height:var(--ph-speccer-pin-size);justify-content:center;line-height:150%;position:absolute;width:var(--ph-speccer-pin-size);z-index:100000}.ph.speccer.dissection.outline.enclose.left:after,.ph.speccer.dissection.outline.enclose.right:after{top:50%;transform:translateY(-50%)}.ph.speccer.dissection.outline.enclose.bottom:after,.ph.speccer.dissection.outline.enclose.top:after,.ph.speccer.dissection.outline.enclose:after{left:50%;transform:translateX(-50%)}.ph.speccer.dissection.outline.enclose.bottom:before,.ph.speccer.dissection.outline.enclose.left:before,.ph.speccer.dissection.outline.enclose.right:before,.ph.speccer.dissection.outline.enclose.top:before,.ph.speccer.dissection.outline.enclose:before{background-color:var(--ph-speccer-pin-color);content:"";display:block;position:absolute;z-index:100000}.ph.speccer.dissection.outline.enclose.left:before,.ph.speccer.dissection.outline.enclose.right:before{height:var(--ph-speccer-line-width);top:50%;transform:translateY(-50%);width:calc(var(--ph-speccer-pin-space) + var(--ph-speccer-line-width))}.ph.speccer.dissection.outline.enclose.bottom:before,.ph.speccer.dissection.outline.enclose.top:before,.ph.speccer.dissection.outline.enclose:before{height:calc(var(--ph-speccer-pin-space) + var(--ph-speccer-line-width));left:50%;transform:translateX(-50%);width:var(--ph-speccer-line-width)}.ph.speccer.dissection.outline.subtle{background-color:var(--ph-speccer-color-text-light);border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);color:var(--ph-speccer-pin-color)}.ph.speccer.dissection.outline.subtle.bottom:after,.ph.speccer.dissection.outline.subtle.top:after{background-color:initial;border-right:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);width:0}.ph.speccer.dissection.outline.subtle.left:after,.ph.speccer.dissection.outline.subtle.right:after{background-color:initial;border-top:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);height:0}.ph.speccer.dissection.outline.full.subtle:not(.curly){background-color:initial}.ph.speccer.dissection.outline.full.subtle:not(.curly),.ph.speccer.dissection.outline.full.subtle:not(.curly).top{border:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);border-bottom:none}.ph.speccer.dissection.outline.full.subtle:not(.curly).bottom{border:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);border-top:none}.ph.speccer.dissection.outline.full.subtle:not(.curly).right{border:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);border-left:none}.ph.speccer.dissection.outline.full.subtle:not(.curly).left{border:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);border-right:none}.ph.speccer.dissection.outline.full.subtle:not(.curly):after{background-color:var(--ph-speccer-color-text-light);border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);color:var(--ph-speccer-pin-color);height:var(--ph-speccer-pin-size);width:var(--ph-speccer-pin-size)}.ph.speccer.dissection.outline.full.subtle:not(.curly).bottom:before,.ph.speccer.dissection.outline.full.subtle:not(.curly).top:before{background-color:initial;border-right:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);width:0}.ph.speccer.dissection.outline.full.subtle:not(.curly).left:before,.ph.speccer.dissection.outline.full.subtle:not(.curly).right:before{background-color:initial;border-top:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);height:0}.ph.speccer.dissection.outline.enclose.subtle{border-style:dashed}.ph.speccer.dissection.outline.enclose.subtle:after{background-color:var(--ph-speccer-color-text-light);border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color);color:var(--ph-speccer-pin-color);height:var(--ph-speccer-pin-size);width:var(--ph-speccer-pin-size)}.ph.speccer.dissection.outline.enclose.subtle.bottom:before,.ph.speccer.dissection.outline.enclose.subtle.top:before{background-color:initial;border-right:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);width:0}.ph.speccer.dissection.outline.enclose.subtle.left:before,.ph.speccer.dissection.outline.enclose.subtle.right:before{background-color:initial;border-top:var(--ph-speccer-line-width) dashed var(--ph-speccer-pin-color);height:0}.ph.speccer.spacing{border:var(--ph-speccer-line-width) solid #0000;pointer-events:auto;transition:none}.ph.speccer.spacing:hover{border:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark)}.ph.speccer.spacing.margin{background-color:var(--ph-speccer-color-margin);color:var(--ph-speccer-color-text-dark)}.ph.speccer.spacing.padding{background-color:var(--ph-speccer-color-padding);color:var(--ph-speccer-spacing-color)}.ph.speccer.spacing.margin.bottom:after,.ph.speccer.spacing.margin.top:after{border-bottom:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark);border-top:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark);content:"";height:100%;left:40%;position:absolute;transition:none;width:9px}.ph.speccer.spacing.margin.bottom:before,.ph.speccer.spacing.margin.top:before{border-left:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark);content:"";height:100%;left:40%;margin-left:4px;position:absolute;transition:none;width:0}.ph.speccer.spacing.margin.left:after,.ph.speccer.spacing.margin.right:after{border-left:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark);border-right:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark);content:"";height:9px;position:absolute;top:10%;transition:none;width:100%}.ph.speccer.spacing.margin.left:before,.ph.speccer.spacing.margin.right:before{border-top:var(--ph-speccer-line-width) solid var(--ph-speccer-color-text-dark);content:"";height:0;margin-top:4px;position:absolute;top:10%;transition:none;width:100%}.ph.speccer.spacing.padding.bottom:after,.ph.speccer.spacing.padding.top:after{border-bottom:var(--ph-speccer-line-width) solid var(--ph-speccer-spacing-color);border-top:var(--ph-speccer-line-width) solid var(--ph-speccer-spacing-color);content:"";height:100%;left:40%;position:absolute;transition:none;width:9px}.ph.speccer.spacing.padding.bottom:before,.ph.speccer.spacing.padding.top:before{border-left:var(--ph-speccer-line-width) solid var(--ph-speccer-spacing-color);content:"";height:100%;left:40%;margin-left:4px;position:absolute;transition:none;width:0}.ph.speccer.spacing.padding.left:after,.ph.speccer.spacing.padding.right:after{border-left:var(--ph-speccer-line-width) solid var(--ph-speccer-spacing-color);border-right:var(--ph-speccer-line-width) solid var(--ph-speccer-spacing-color);content:"";height:9px;position:absolute;top:10%;transition:none;width:100%}.ph.speccer.spacing.padding.left:before,.ph.speccer.spacing.padding.right:before{border-top:var(--ph-speccer-line-width) solid var(--ph-speccer-spacing-color);content:"";height:0;margin-top:4px;position:absolute;top:10%;transition:none;width:100%}.ph.speccer.typography{background-color:var(--ph-speccer-typography-background-color);color:var(--ph-speccer-typography-color-text);display:block;font-size:10px;line-height:140%;max-width:none;padding:8px;text-align:left;width:auto}.ph.speccer.typography,.ph.speccer.typography:hover{border:var(--ph-speccer-line-width) solid var(--ph-speccer-pin-color)}.ph.speccer.typography:after{background-color:var(--ph-speccer-pin-color);content:"";display:block;position:absolute}.ph.speccer.typography.left:after,.ph.speccer.typography:after{left:100%}.ph.speccer.typography.left:after,.ph.speccer.typography.right:after,.ph.speccer.typography:after{height:var(--ph-speccer-line-width);top:50%;transform:translateY(-50%);width:var(--ph-speccer-pin-space)}.ph.speccer.typography.right:after{left:auto;right:100%}.ph.speccer.typography.top:after{top:100%}.ph.speccer.typography.bottom:after,.ph.speccer.typography.top:after{height:var(--ph-speccer-pin-space);left:50%;right:auto;transform:translateX(-50%);width:var(--ph-speccer-line-width)}.ph.speccer.typography.bottom:after{bottom:100%;top:auto}.ph.speccer.typography .speccer-styles{font-size:10px;line-height:140%;list-style:none;margin:0;padding:0 0 0 8px;width:100%}.ph.speccer.typography .speccer-styles .property{color:var(--ph-speccer-typography-color-property);font-size:10px;font-weight:400;margin:0;padding:0;text-align:left}.ph.speccer.typography .speccer-styles>li{border:none;color:var(--ph-speccer-typography-color-value);font-size:10px;font-weight:400;list-style:none;margin:0;padding:0;text-align:left}.ph.speccer.measure{display:flex}.ph.speccer.measure.width{border:var(--ph-speccer-line-width) solid var(--ph-speccer-measure-color);border-bottom:none;color:var(--ph-speccer-measure-color);height:var(--ph-speccer-measure-size)}.ph.speccer.measure.width:after{content:attr(data-measure);position:absolute;top:calc(-100% - 10px)}.ph.speccer.measure.width.bottom{border:var(--ph-speccer-line-width) solid var(--ph-speccer-measure-color);border-top:none;color:var(--ph-speccer-measure-color)}.ph.speccer.measure.width.bottom:after{content:attr(data-measure);position:absolute;top:calc(100% + 5px)}.ph.speccer.measure.width.top{border:var(--ph-speccer-line-width) solid var(--ph-speccer-measure-color);border-bottom:none;color:var(--ph-speccer-measure-color)}.ph.speccer.measure.width.top:after{bottom:calc(100% + 5px);content:attr(data-measure);position:absolute}.ph.speccer.measure.height.left{border:var(--ph-speccer-line-width) solid var(--ph-speccer-measure-color);border-right:none;color:var(--ph-speccer-measure-color);width:var(--ph-speccer-measure-size)}.ph.speccer.measure.height.left:after{content:attr(data-measure);left:calc(-100% - 20px - var(--ph-speccer-line-width));position:absolute;top:50%;transform:translateY(-50%) rotate(-90deg)}.ph.speccer.measure.height.right{border:var(--ph-speccer-line-width) solid var(--ph-speccer-measure-color);border-left:none;color:var(--ph-speccer-measure-color);width:var(--ph-speccer-measure-size)}.ph.speccer.measure.height.right:after{content:attr(data-measure);left:calc(100% - var(--ph-speccer-measure-size));position:absolute;top:50%;transform:translateY(-50%) rotate(90deg)}.ph.speccer.measure.subtle.height.left,.ph.speccer.measure.subtle.height.right,.ph.speccer.measure.subtle.width.bottom,.ph.speccer.measure.subtle.width.top{border-style:dashed}.ph.speccer.measure.subtle.width.top{border-bottom:none}.ph.speccer.measure.subtle.width.bottom{border-top:none}.ph.speccer.measure.subtle.height.right{border-left:none}.ph.speccer.measure.subtle.height.left{border-right:none}.ph.speccer.mark{background-color:var(--ph-speccer-mark-background-color);border-color:var(--ph-speccer-mark-border-color);border-style:solid;border-width:1px;position:absolute}
|