@ui-doc/html-renderer 0.2.0 → 0.3.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/dist/assets/src/utils.d.ts +2 -0
- package/dist/assets/ui-doc.cjs +25 -15
- package/dist/assets/ui-doc.cjs.map +1 -1
- package/dist/assets/ui-doc.min.js +1 -1
- package/dist/assets/ui-doc.mjs +25 -15
- package/dist/assets/ui-doc.mjs.map +1 -1
- package/package.json +2 -2
- package/scripts/app.ts +1 -1
- package/scripts/src/example.ts +19 -6
- package/scripts/src/utils.ts +20 -0
- package/dist/assets/src/base.d.ts +0 -1
- package/scripts/src/base.ts +0 -7
package/dist/assets/ui-doc.cjs
CHANGED
|
@@ -1,14 +1,5 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
function ready(callback) {
|
|
4
|
-
if (document.readyState !== 'loading') {
|
|
5
|
-
callback();
|
|
6
|
-
}
|
|
7
|
-
else {
|
|
8
|
-
document.addEventListener('DOMContentLoaded', callback);
|
|
9
|
-
}
|
|
10
|
-
}
|
|
11
|
-
|
|
12
3
|
function initExample() {
|
|
13
4
|
document.querySelectorAll('[data-example] > iframe').forEach(iframe => {
|
|
14
5
|
var _a, _b;
|
|
@@ -16,23 +7,33 @@ function initExample() {
|
|
|
16
7
|
if (!document) {
|
|
17
8
|
return;
|
|
18
9
|
}
|
|
19
|
-
const
|
|
10
|
+
const initHeightChange = () => {
|
|
11
|
+
let currentHeight = 0;
|
|
20
12
|
const changeHeight = () => {
|
|
21
|
-
|
|
13
|
+
if (document.body.scrollHeight === currentHeight) {
|
|
14
|
+
return;
|
|
15
|
+
}
|
|
16
|
+
currentHeight = document.body.scrollHeight;
|
|
17
|
+
iframe.style.height = `${currentHeight}px`;
|
|
22
18
|
};
|
|
19
|
+
// Initial height change
|
|
23
20
|
changeHeight();
|
|
24
|
-
|
|
25
|
-
|
|
21
|
+
// Use MutationObserver to detect changes in the DOM and change height if required
|
|
22
|
+
const mutationObserver = new MutationObserver(changeHeight);
|
|
23
|
+
mutationObserver.observe(document.body, {
|
|
26
24
|
attributes: true,
|
|
27
25
|
childList: true,
|
|
28
26
|
subtree: true,
|
|
29
27
|
});
|
|
28
|
+
// Use ResizeObserver to detect changes in the viewport and change height if required
|
|
29
|
+
const resizeObserver = new ResizeObserver(changeHeight);
|
|
30
|
+
resizeObserver.observe(document.body);
|
|
30
31
|
};
|
|
31
32
|
if (document.readyState === 'complete') {
|
|
32
|
-
|
|
33
|
+
initHeightChange();
|
|
33
34
|
}
|
|
34
35
|
else {
|
|
35
|
-
iframe.addEventListener('load',
|
|
36
|
+
iframe.addEventListener('load', initHeightChange);
|
|
36
37
|
}
|
|
37
38
|
});
|
|
38
39
|
}
|
|
@@ -74,6 +75,15 @@ function initSidebar() {
|
|
|
74
75
|
});
|
|
75
76
|
}
|
|
76
77
|
|
|
78
|
+
function ready(callback) {
|
|
79
|
+
if (document.readyState !== 'loading') {
|
|
80
|
+
callback();
|
|
81
|
+
}
|
|
82
|
+
else {
|
|
83
|
+
document.addEventListener('DOMContentLoaded', callback);
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
|
|
77
87
|
ready(() => {
|
|
78
88
|
initExample();
|
|
79
89
|
initSidebar();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ui-doc.cjs","sources":["../../../scripts/src/
|
|
1
|
+
{"version":3,"file":"ui-doc.cjs","sources":["../../../scripts/src/example.ts","../../../scripts/src/sidebar.ts","../../../scripts/src/utils.ts","../../../scripts/app.ts"],"sourcesContent":["export function initExample() {\n document.querySelectorAll<HTMLIFrameElement>('[data-example] > iframe').forEach(iframe => {\n const document = iframe.contentDocument ?? iframe.contentWindow?.document\n\n if (!document) {\n return\n }\n\n const initHeightChange = () => {\n let currentHeight = 0\n const changeHeight = () => {\n if (document.body.scrollHeight === currentHeight) {\n return\n }\n\n currentHeight = document.body.scrollHeight\n iframe.style.height = `${currentHeight}px`\n }\n\n // Initial height change\n changeHeight()\n\n // Use MutationObserver to detect changes in the DOM and change height if required\n const mutationObserver = new MutationObserver(changeHeight)\n\n mutationObserver.observe(document.body, {\n attributes: true,\n childList: true,\n subtree: true,\n })\n\n // Use ResizeObserver to detect changes in the viewport and change height if required\n const resizeObserver = new ResizeObserver(changeHeight)\n\n resizeObserver.observe(document.body)\n }\n\n if (document.readyState === 'complete') {\n initHeightChange()\n } else {\n iframe.addEventListener('load', initHeightChange)\n }\n })\n}\n","function createSidebar(sidebar: HTMLElement) {\n const links: Record<string, HTMLLinkElement> = {}\n const observer = new IntersectionObserver(\n entries => {\n const activeEntries = entries.filter(entry => entry.isIntersecting)\n\n if (activeEntries.length <= 0) {\n return\n }\n\n Object.keys(links).forEach(id => {\n links[id].classList.remove('active')\n })\n\n const activeLink = links[activeEntries[0].target.id]\n\n activeLink.classList.add('active')\n if (activeLink?.parentElement?.parentElement?.parentElement instanceof HTMLLIElement) {\n activeLink.parentElement.parentElement.parentElement\n .querySelector('a')\n ?.classList.add('active')\n }\n },\n {\n root: null,\n rootMargin: '0px 0px -90% 0px',\n threshold: 0.5,\n },\n )\n\n sidebar.querySelectorAll<HTMLLinkElement>('a[href^=\"#\"]').forEach(link => {\n const id = link.href.split('#')[1]\n const target = document.getElementById(id)\n\n if (target) {\n observer.observe(target)\n links[id] = link\n }\n })\n}\n\nexport function initSidebar() {\n document.querySelectorAll('[data-sidebar]').forEach(sidebar => {\n createSidebar(sidebar as HTMLElement)\n })\n}\n","export function ready(callback: () => void) {\n if (document.readyState !== 'loading') {\n callback()\n } else {\n document.addEventListener('DOMContentLoaded', callback)\n }\n}\n\nexport function throttle(callback: (...args: any[]) => void, delay: number) {\n let timerFlag: number | null = null\n\n return (...args: any[]) => {\n if (timerFlag === null) {\n callback(...args)\n timerFlag = window.setTimeout(() => {\n timerFlag = null\n }, delay)\n }\n }\n}\n","import { initExample } from './src/example'\nimport { initSidebar } from './src/sidebar'\nimport { ready } from './src/utils'\n\nready(() => {\n initExample()\n initSidebar()\n})\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(){"use strict";function e(){document.querySelectorAll("[data-sidebar]").forEach((e=>{!function(e){const t={},n=new IntersectionObserver((e=>{var n,o,r;const l=e.filter((e=>e.isIntersecting));if(l.length<=0)return;Object.keys(t).forEach((e=>{t[e].classList.remove("active")}));const a=t[l[0].target.id];a.classList.add("active"),(null===(o=null===(n=null==a?void 0:a.parentElement)||void 0===n?void 0:n.parentElement)||void 0===o?void 0:o.parentElement)instanceof HTMLLIElement&&(null===(r=a.parentElement.parentElement.parentElement.querySelector("a"))||void 0===r||r.classList.add("active"))}),{root:null,rootMargin:"0px 0px -90% 0px",threshold:.5});e.querySelectorAll('a[href^="#"]').forEach((e=>{const o=e.href.split("#")[1],r=document.getElementById(o);r&&(n.observe(r),t[o]=e)}))}(e)}))}var t;t=()=>{document.querySelectorAll("[data-example] > iframe").forEach((e=>{var t,n;const o=null!==(t=e.contentDocument)&&void 0!==t?t:null===(n=e.contentWindow)||void 0===n?void 0:n.document;if(!o)return;const r=()=>{
|
|
1
|
+
!function(){"use strict";function e(){document.querySelectorAll("[data-sidebar]").forEach((e=>{!function(e){const t={},n=new IntersectionObserver((e=>{var n,o,r;const l=e.filter((e=>e.isIntersecting));if(l.length<=0)return;Object.keys(t).forEach((e=>{t[e].classList.remove("active")}));const a=t[l[0].target.id];a.classList.add("active"),(null===(o=null===(n=null==a?void 0:a.parentElement)||void 0===n?void 0:n.parentElement)||void 0===o?void 0:o.parentElement)instanceof HTMLLIElement&&(null===(r=a.parentElement.parentElement.parentElement.querySelector("a"))||void 0===r||r.classList.add("active"))}),{root:null,rootMargin:"0px 0px -90% 0px",threshold:.5});e.querySelectorAll('a[href^="#"]').forEach((e=>{const o=e.href.split("#")[1],r=document.getElementById(o);r&&(n.observe(r),t[o]=e)}))}(e)}))}var t;t=()=>{document.querySelectorAll("[data-example] > iframe").forEach((e=>{var t,n;const o=null!==(t=e.contentDocument)&&void 0!==t?t:null===(n=e.contentWindow)||void 0===n?void 0:n.document;if(!o)return;const r=()=>{let t=0;const n=()=>{o.body.scrollHeight!==t&&(t=o.body.scrollHeight,e.style.height=`${t}px`)};n(),new MutationObserver(n).observe(o.body,{attributes:!0,childList:!0,subtree:!0}),new ResizeObserver(n).observe(o.body)};"complete"===o.readyState?r():e.addEventListener("load",r)})),e()},"loading"!==document.readyState?t():document.addEventListener("DOMContentLoaded",t)}();
|
package/dist/assets/ui-doc.mjs
CHANGED
|
@@ -1,12 +1,3 @@
|
|
|
1
|
-
function ready(callback) {
|
|
2
|
-
if (document.readyState !== 'loading') {
|
|
3
|
-
callback();
|
|
4
|
-
}
|
|
5
|
-
else {
|
|
6
|
-
document.addEventListener('DOMContentLoaded', callback);
|
|
7
|
-
}
|
|
8
|
-
}
|
|
9
|
-
|
|
10
1
|
function initExample() {
|
|
11
2
|
document.querySelectorAll('[data-example] > iframe').forEach(iframe => {
|
|
12
3
|
var _a, _b;
|
|
@@ -14,23 +5,33 @@ function initExample() {
|
|
|
14
5
|
if (!document) {
|
|
15
6
|
return;
|
|
16
7
|
}
|
|
17
|
-
const
|
|
8
|
+
const initHeightChange = () => {
|
|
9
|
+
let currentHeight = 0;
|
|
18
10
|
const changeHeight = () => {
|
|
19
|
-
|
|
11
|
+
if (document.body.scrollHeight === currentHeight) {
|
|
12
|
+
return;
|
|
13
|
+
}
|
|
14
|
+
currentHeight = document.body.scrollHeight;
|
|
15
|
+
iframe.style.height = `${currentHeight}px`;
|
|
20
16
|
};
|
|
17
|
+
// Initial height change
|
|
21
18
|
changeHeight();
|
|
22
|
-
|
|
23
|
-
|
|
19
|
+
// Use MutationObserver to detect changes in the DOM and change height if required
|
|
20
|
+
const mutationObserver = new MutationObserver(changeHeight);
|
|
21
|
+
mutationObserver.observe(document.body, {
|
|
24
22
|
attributes: true,
|
|
25
23
|
childList: true,
|
|
26
24
|
subtree: true,
|
|
27
25
|
});
|
|
26
|
+
// Use ResizeObserver to detect changes in the viewport and change height if required
|
|
27
|
+
const resizeObserver = new ResizeObserver(changeHeight);
|
|
28
|
+
resizeObserver.observe(document.body);
|
|
28
29
|
};
|
|
29
30
|
if (document.readyState === 'complete') {
|
|
30
|
-
|
|
31
|
+
initHeightChange();
|
|
31
32
|
}
|
|
32
33
|
else {
|
|
33
|
-
iframe.addEventListener('load',
|
|
34
|
+
iframe.addEventListener('load', initHeightChange);
|
|
34
35
|
}
|
|
35
36
|
});
|
|
36
37
|
}
|
|
@@ -72,6 +73,15 @@ function initSidebar() {
|
|
|
72
73
|
});
|
|
73
74
|
}
|
|
74
75
|
|
|
76
|
+
function ready(callback) {
|
|
77
|
+
if (document.readyState !== 'loading') {
|
|
78
|
+
callback();
|
|
79
|
+
}
|
|
80
|
+
else {
|
|
81
|
+
document.addEventListener('DOMContentLoaded', callback);
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
|
|
75
85
|
ready(() => {
|
|
76
86
|
initExample();
|
|
77
87
|
initSidebar();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ui-doc.mjs","sources":["../../../scripts/src/
|
|
1
|
+
{"version":3,"file":"ui-doc.mjs","sources":["../../../scripts/src/example.ts","../../../scripts/src/sidebar.ts","../../../scripts/src/utils.ts","../../../scripts/app.ts"],"sourcesContent":["export function initExample() {\n document.querySelectorAll<HTMLIFrameElement>('[data-example] > iframe').forEach(iframe => {\n const document = iframe.contentDocument ?? iframe.contentWindow?.document\n\n if (!document) {\n return\n }\n\n const initHeightChange = () => {\n let currentHeight = 0\n const changeHeight = () => {\n if (document.body.scrollHeight === currentHeight) {\n return\n }\n\n currentHeight = document.body.scrollHeight\n iframe.style.height = `${currentHeight}px`\n }\n\n // Initial height change\n changeHeight()\n\n // Use MutationObserver to detect changes in the DOM and change height if required\n const mutationObserver = new MutationObserver(changeHeight)\n\n mutationObserver.observe(document.body, {\n attributes: true,\n childList: true,\n subtree: true,\n })\n\n // Use ResizeObserver to detect changes in the viewport and change height if required\n const resizeObserver = new ResizeObserver(changeHeight)\n\n resizeObserver.observe(document.body)\n }\n\n if (document.readyState === 'complete') {\n initHeightChange()\n } else {\n iframe.addEventListener('load', initHeightChange)\n }\n })\n}\n","function createSidebar(sidebar: HTMLElement) {\n const links: Record<string, HTMLLinkElement> = {}\n const observer = new IntersectionObserver(\n entries => {\n const activeEntries = entries.filter(entry => entry.isIntersecting)\n\n if (activeEntries.length <= 0) {\n return\n }\n\n Object.keys(links).forEach(id => {\n links[id].classList.remove('active')\n })\n\n const activeLink = links[activeEntries[0].target.id]\n\n activeLink.classList.add('active')\n if (activeLink?.parentElement?.parentElement?.parentElement instanceof HTMLLIElement) {\n activeLink.parentElement.parentElement.parentElement\n .querySelector('a')\n ?.classList.add('active')\n }\n },\n {\n root: null,\n rootMargin: '0px 0px -90% 0px',\n threshold: 0.5,\n },\n )\n\n sidebar.querySelectorAll<HTMLLinkElement>('a[href^=\"#\"]').forEach(link => {\n const id = link.href.split('#')[1]\n const target = document.getElementById(id)\n\n if (target) {\n observer.observe(target)\n links[id] = link\n }\n })\n}\n\nexport function initSidebar() {\n document.querySelectorAll('[data-sidebar]').forEach(sidebar => {\n createSidebar(sidebar as HTMLElement)\n })\n}\n","export function ready(callback: () => void) {\n if (document.readyState !== 'loading') {\n callback()\n } else {\n document.addEventListener('DOMContentLoaded', callback)\n }\n}\n\nexport function throttle(callback: (...args: any[]) => void, delay: number) {\n let timerFlag: number | null = null\n\n return (...args: any[]) => {\n if (timerFlag === null) {\n callback(...args)\n timerFlag = window.setTimeout(() => {\n timerFlag = null\n }, delay)\n }\n }\n}\n","import { initExample } from './src/example'\nimport { initSidebar } from './src/sidebar'\nimport { ready } from './src/utils'\n\nready(() => {\n initExample()\n initSidebar()\n})\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ui-doc/html-renderer",
|
|
3
3
|
"description": "HTML renderer for UI-Doc.",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.3.0",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"ui-doc",
|
|
@@ -55,7 +55,7 @@
|
|
|
55
55
|
},
|
|
56
56
|
"sideEffects": false,
|
|
57
57
|
"peerDependencies": {
|
|
58
|
-
"@ui-doc/core": "^0.
|
|
58
|
+
"@ui-doc/core": "^0.3.0"
|
|
59
59
|
},
|
|
60
60
|
"optionalDependencies": {
|
|
61
61
|
"@highlightjs/cdn-assets": "^11.9.0"
|
package/scripts/app.ts
CHANGED
package/scripts/src/example.ts
CHANGED
|
@@ -6,26 +6,39 @@ export function initExample() {
|
|
|
6
6
|
return
|
|
7
7
|
}
|
|
8
8
|
|
|
9
|
-
const
|
|
9
|
+
const initHeightChange = () => {
|
|
10
|
+
let currentHeight = 0
|
|
10
11
|
const changeHeight = () => {
|
|
11
|
-
|
|
12
|
+
if (document.body.scrollHeight === currentHeight) {
|
|
13
|
+
return
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
currentHeight = document.body.scrollHeight
|
|
17
|
+
iframe.style.height = `${currentHeight}px`
|
|
12
18
|
}
|
|
13
19
|
|
|
20
|
+
// Initial height change
|
|
14
21
|
changeHeight()
|
|
15
22
|
|
|
16
|
-
|
|
23
|
+
// Use MutationObserver to detect changes in the DOM and change height if required
|
|
24
|
+
const mutationObserver = new MutationObserver(changeHeight)
|
|
17
25
|
|
|
18
|
-
|
|
26
|
+
mutationObserver.observe(document.body, {
|
|
19
27
|
attributes: true,
|
|
20
28
|
childList: true,
|
|
21
29
|
subtree: true,
|
|
22
30
|
})
|
|
31
|
+
|
|
32
|
+
// Use ResizeObserver to detect changes in the viewport and change height if required
|
|
33
|
+
const resizeObserver = new ResizeObserver(changeHeight)
|
|
34
|
+
|
|
35
|
+
resizeObserver.observe(document.body)
|
|
23
36
|
}
|
|
24
37
|
|
|
25
38
|
if (document.readyState === 'complete') {
|
|
26
|
-
|
|
39
|
+
initHeightChange()
|
|
27
40
|
} else {
|
|
28
|
-
iframe.addEventListener('load',
|
|
41
|
+
iframe.addEventListener('load', initHeightChange)
|
|
29
42
|
}
|
|
30
43
|
})
|
|
31
44
|
}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export function ready(callback: () => void) {
|
|
2
|
+
if (document.readyState !== 'loading') {
|
|
3
|
+
callback()
|
|
4
|
+
} else {
|
|
5
|
+
document.addEventListener('DOMContentLoaded', callback)
|
|
6
|
+
}
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
export function throttle(callback: (...args: any[]) => void, delay: number) {
|
|
10
|
+
let timerFlag: number | null = null
|
|
11
|
+
|
|
12
|
+
return (...args: any[]) => {
|
|
13
|
+
if (timerFlag === null) {
|
|
14
|
+
callback(...args)
|
|
15
|
+
timerFlag = window.setTimeout(() => {
|
|
16
|
+
timerFlag = null
|
|
17
|
+
}, delay)
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function ready(callback: () => void): void;
|