kempo 2.15.2 → 3.0.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/components/Import.js +1 -1
- package/docs/components/_template.html +3 -1
- package/docs/components/accordion.html +3 -1
- package/docs/components/card.html +3 -1
- package/docs/components/component.html +3 -1
- package/docs/components/content-slider.html +3 -1
- package/docs/components/dialog.html +3 -1
- package/docs/components/directory-viewer.html +3 -1
- package/docs/components/focus-capture.html +3 -1
- package/docs/components/import.html +3 -1
- package/docs/components/lazy-component.html +3 -1
- package/docs/components/reactive-component.html +3 -1
- package/docs/components/reactive-lazy-component.html +3 -1
- package/docs/components/resize.html +3 -1
- package/docs/components/search.html +3 -1
- package/docs/components/show-more.html +3 -1
- package/docs/components/side-menu.html +3 -1
- package/docs/components/sortable.html +3 -1
- package/docs/components/split.html +3 -1
- package/docs/components/table.html +3 -1
- package/docs/components/tableControls.html +3 -1
- package/docs/components/tableCustomFields.html +3 -1
- package/docs/components/tableFetchRecords.html +3 -1
- package/docs/components/tableFieldSortHide.html +3 -1
- package/docs/components/tablePagination.html +3 -1
- package/docs/components/tableRecordEditing.html +3 -1
- package/docs/components/tableRecordFiltering.html +3 -1
- package/docs/components/tableRecordHiding.html +3 -1
- package/docs/components/tableRecordSearching.html +3 -1
- package/docs/components/tableRecordSelection.html +3 -1
- package/docs/components/tableRowControls.html +3 -1
- package/docs/components/tableSorting.html +3 -1
- package/docs/components/tabs.html +3 -1
- package/docs/components/tags.html +3 -1
- package/docs/components/theme-switcher.html +3 -1
- package/docs/components/timestamp.html +3 -1
- package/docs/components/toggle.html +3 -1
- package/docs/js/nav.inc.js +4 -0
- package/docs/kempo/components/Import.js +1 -1
- package/docs/nav.inc.html +1 -6
- package/docs/styles/_template.html +3 -1
- package/docs/styles/borders-spacing.html +3 -1
- package/docs/styles/buttons.html +3 -1
- package/docs/styles/colors.html +3 -1
- package/docs/styles/displays-layouts.html +3 -1
- package/docs/styles/embed-1.html +2 -0
- package/docs/styles/inputs.html +3 -1
- package/docs/styles/tables.html +3 -1
- package/docs/styles/typography.html +3 -1
- package/docs/utils/_template.html +3 -1
- package/docs/utils/cli.html +3 -1
- package/docs/utils/cookie.html +3 -1
- package/docs/utils/debounce.html +3 -1
- package/docs/utils/drag.html +3 -1
- package/docs/utils/element.html +3 -1
- package/docs/utils/format-timestamp.html +3 -1
- package/docs/utils/fuzzy-match.html +1 -1
- package/package.json +1 -1
- package/src/components/Import.js +27 -8
- package/docs/nav-1.inc.html +0 -84
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">Tabs</h1>
|
|
19
21
|
<main>
|
|
20
22
|
<details class="b r mb">
|
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">Tags</h1>
|
|
19
21
|
<main>
|
|
20
22
|
<details class="b r mb">
|
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">ThemeSwitcher</h1>
|
|
19
21
|
<main>
|
|
20
22
|
<details class="b r mb">
|
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">Timestamp</h1>
|
|
19
21
|
<main>
|
|
20
22
|
<details class="b r mb">
|
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">Toggle</h1>
|
|
19
21
|
<main>
|
|
20
22
|
<details class="b r mb">
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import Component from"./Component.js";export default class Import extends Component{constructor(
|
|
1
|
+
import Component from"./Component.js";export default class Import extends Component{constructor(e=""){super(),this.registerAttribute("src",e)}attributeChangedCallback(e,t,r){"src"===e&&t!==r&&this.render(!0)}async render(e){const t=this.src;if(t&&await super.render(e)){let e=await(await fetch(t)).text();for(const[t,r]of Object.entries(Import.replacements))e=e.replace(new RegExp(`%%${t}%%`,"g"),r);const r=document.createElement("template");r.innerHTML=e;const n=Array.from(r.content.querySelectorAll("script[src]"));n.forEach((e=>e.remove())),this.innerHTML=r.innerHTML;for(const e of n){const t=document.createElement("script");Array.from(e.attributes).forEach((e=>{t.setAttribute(e.name,e.value)})),console.log("Adding script with src:",t.src),await new Promise(((e,r)=>{t.onload=e,t.onerror=r,this.appendChild(t)}))}return!0}return!1}get shadowStyles(){return"\n :host {\n display: contents;\n }\n "}static replacements={root:"./"};static addReplacement(e,t){this.replacements={...this.replacements,[e]:t}}static observedAttributes=[...super.observedAttributes,"src"]}window.customElements.define("k-import",Import);
|
package/docs/nav.inc.html
CHANGED
|
@@ -66,12 +66,7 @@
|
|
|
66
66
|
</div>
|
|
67
67
|
</menu>
|
|
68
68
|
</k-side-menu>
|
|
69
|
-
<script>
|
|
70
|
-
document.getElementById('open-side-menu').addEventListener('click', async () => {
|
|
71
|
-
await window.customElements.whenDefined('k-side-menu');
|
|
72
|
-
document.getElementById('side-menu').open();
|
|
73
|
-
});
|
|
74
|
-
</script>
|
|
69
|
+
<script src="%%root%%js/nav.inc.js" type="module"></script>
|
|
75
70
|
<script src="%%root%%kempo/components/SideMenu.js" type="module"></script>
|
|
76
71
|
<script src="%%root%%kempo/components/Icon.js" type="module"></script>
|
|
77
72
|
<script src="%%root%%kempo/components/ThemeSwitcher.js" type="module"></script>
|
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">Template</h1>
|
|
19
21
|
<main>
|
|
20
22
|
|
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">Borders and Spacing</h1>
|
|
19
21
|
<main style="margin-bottom: 33vh">
|
|
20
22
|
<h3>Borders</h3>
|
package/docs/styles/buttons.html
CHANGED
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">Buttons</h1>
|
|
19
21
|
<main>
|
|
20
22
|
<h3>What is a button?</h3>
|
package/docs/styles/colors.html
CHANGED
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">Colors</h1>
|
|
19
21
|
<main>
|
|
20
22
|
<h3>Background</h3>
|
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">Displays and Layouts</h1>
|
|
19
21
|
<main style="margin-bottom: 33vh">
|
|
20
22
|
<h3>Display</h3>
|
package/docs/styles/embed-1.html
CHANGED
|
@@ -6,8 +6,10 @@
|
|
|
6
6
|
<title>Template - Components - Kempo Docs - A Web Components Solution</title>
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<script type="module">
|
|
9
|
+
import Import from '../kempo/components/Import.js';
|
|
9
10
|
import Icon from '../kempo/components/Icon.js';
|
|
10
11
|
import Search from '../kempo/components/Search.js';
|
|
12
|
+
Import.addReplacement('root', '../');
|
|
11
13
|
Icon.pathToIcons = ['../icons'];
|
|
12
14
|
Search.searchDataUrl = '../search.json';
|
|
13
15
|
</script>
|
package/docs/styles/inputs.html
CHANGED
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">Inputs</h1>
|
|
19
21
|
<main>
|
|
20
22
|
<h3>Inputs</h3>
|
package/docs/styles/tables.html
CHANGED
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">Table</h1>
|
|
19
21
|
<main>
|
|
20
22
|
<div class="row -mx mb">
|
|
@@ -6,14 +6,16 @@
|
|
|
6
6
|
<title>Typography - Kempo - A Web Components Solution</title>
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<script type="module">
|
|
9
|
+
import Import from '../kempo/components/Import.js';
|
|
9
10
|
import Icon from '../kempo/components/Icon.js';
|
|
10
11
|
import Search from '../kempo/components/Search.js';
|
|
12
|
+
Import.addReplacement('root', '../');
|
|
11
13
|
Icon.pathToIcons = ['../icons'];
|
|
12
14
|
Search.searchDataUrl = '../search.json';
|
|
13
15
|
</script>
|
|
14
16
|
</head>
|
|
15
17
|
<body>
|
|
16
|
-
<k-import src="../nav
|
|
18
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
17
19
|
<h1 class="ta-center">Typography</h1>
|
|
18
20
|
<main style="margin-bottom: 33vh">
|
|
19
21
|
<h3>Paragraphs</h3>
|
|
@@ -7,14 +7,16 @@
|
|
|
7
7
|
<link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
9
9
|
<script type="module">
|
|
10
|
+
import Import from '../kempo/components/Import.js';
|
|
10
11
|
import Icon from '../kempo/components/Icon.js';
|
|
11
12
|
import Search from '../kempo/components/Search.js';
|
|
13
|
+
Import.addReplacement('root', '../');
|
|
12
14
|
Icon.pathToIcons = ['../icons'];
|
|
13
15
|
Search.searchDataUrl = '../search.json';
|
|
14
16
|
</script>
|
|
15
17
|
</head>
|
|
16
18
|
<body>
|
|
17
|
-
<k-import src="../nav
|
|
19
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
18
20
|
<h1 class="ta-center">Template</h1>
|
|
19
21
|
<main>
|
|
20
22
|
<details
|
package/docs/utils/cli.html
CHANGED
|
@@ -8,14 +8,16 @@
|
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
9
9
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
10
10
|
<script type="module">
|
|
11
|
+
import Import from '../kempo/components/Import.js';
|
|
11
12
|
import Icon from '../kempo/components/Icon.js';
|
|
12
13
|
import Search from '../kempo/components/Search.js';
|
|
14
|
+
Import.addReplacement('root', '../');
|
|
13
15
|
Icon.pathToIcons = ['../icons'];
|
|
14
16
|
Search.searchDataUrl = '../search.json';
|
|
15
17
|
</script>
|
|
16
18
|
</head>
|
|
17
19
|
<body>
|
|
18
|
-
<k-import src="../nav
|
|
20
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
19
21
|
<h1 class="ta-center">CLI</h1>
|
|
20
22
|
<main>
|
|
21
23
|
<details class="b r mb">
|
package/docs/utils/cookie.html
CHANGED
|
@@ -8,14 +8,16 @@
|
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
9
9
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
10
10
|
<script type="module">
|
|
11
|
+
import Import from '../kempo/components/Import.js';
|
|
11
12
|
import Icon from '../kempo/components/Icon.js';
|
|
12
13
|
import Search from '../kempo/components/Search.js';
|
|
14
|
+
Import.addReplacement('root', '../');
|
|
13
15
|
Icon.pathToIcons = ['../icons'];
|
|
14
16
|
Search.searchDataUrl = '../search.json';
|
|
15
17
|
</script>
|
|
16
18
|
</head>
|
|
17
19
|
<body>
|
|
18
|
-
<k-import src="../nav
|
|
20
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
19
21
|
<h1 class="ta-center">Cookie</h1>
|
|
20
22
|
<main>
|
|
21
23
|
<details class="b r mb">
|
package/docs/utils/debounce.html
CHANGED
|
@@ -8,14 +8,16 @@
|
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
9
9
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
10
10
|
<script type="module">
|
|
11
|
+
import Import from '../kempo/components/Import.js';
|
|
11
12
|
import Icon from '../kempo/components/Icon.js';
|
|
12
13
|
import Search from '../kempo/components/Search.js';
|
|
14
|
+
Import.addReplacement('root', '../');
|
|
13
15
|
Icon.pathToIcons = ['../icons'];
|
|
14
16
|
Search.searchDataUrl = '../search.json';
|
|
15
17
|
</script>
|
|
16
18
|
</head>
|
|
17
19
|
<body>
|
|
18
|
-
<k-import src="../nav
|
|
20
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
19
21
|
<h1 class="ta-center">Debounce</h1>
|
|
20
22
|
<main>
|
|
21
23
|
<details class="b r mb">
|
package/docs/utils/drag.html
CHANGED
|
@@ -8,14 +8,16 @@
|
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
9
9
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
10
10
|
<script type="module">
|
|
11
|
+
import Import from '../kempo/components/Import.js';
|
|
11
12
|
import Icon from '../kempo/components/Icon.js';
|
|
12
13
|
import Search from '../kempo/components/Search.js';
|
|
14
|
+
Import.addReplacement('root', '../');
|
|
13
15
|
Icon.pathToIcons = ['../icons'];
|
|
14
16
|
Search.searchDataUrl = '../search.json';
|
|
15
17
|
</script>
|
|
16
18
|
</head>
|
|
17
19
|
<body>
|
|
18
|
-
<k-import src="../nav
|
|
20
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
19
21
|
<h1 class="ta-center">Drag</h1>
|
|
20
22
|
<main>
|
|
21
23
|
<details class="b r mb">
|
package/docs/utils/element.html
CHANGED
|
@@ -8,14 +8,16 @@
|
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
9
9
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
10
10
|
<script type="module">
|
|
11
|
+
import Import from '../kempo/components/Import.js';
|
|
11
12
|
import Icon from '../kempo/components/Icon.js';
|
|
12
13
|
import Search from '../kempo/components/Search.js';
|
|
14
|
+
Import.addReplacement('root', '../');
|
|
13
15
|
Icon.pathToIcons = ['../icons'];
|
|
14
16
|
Search.searchDataUrl = '../search.json';
|
|
15
17
|
</script>
|
|
16
18
|
</head>
|
|
17
19
|
<body>
|
|
18
|
-
<k-import src="../nav
|
|
20
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
19
21
|
<h1 class="ta-center">Element</h1>
|
|
20
22
|
<main>
|
|
21
23
|
<details class="b r mb">
|
|
@@ -8,14 +8,16 @@
|
|
|
8
8
|
<link rel="stylesheet" href="../kempo/kempo-styles.css" />
|
|
9
9
|
<link rel="stylesheet" href="../kempo/kempo-hljs.css" />
|
|
10
10
|
<script type="module">
|
|
11
|
+
import Import from '../kempo/components/Import.js';
|
|
11
12
|
import Icon from '../kempo/components/Icon.js';
|
|
12
13
|
import Search from '../kempo/components/Search.js';
|
|
14
|
+
Import.addReplacement('root', '../');
|
|
13
15
|
Icon.pathToIcons = ['../icons'];
|
|
14
16
|
Search.searchDataUrl = '../search.json';
|
|
15
17
|
</script>
|
|
16
18
|
</head>
|
|
17
19
|
<body>
|
|
18
|
-
<k-import src="../nav
|
|
20
|
+
<k-import src="../nav.inc.html"></k-import>
|
|
19
21
|
<h1 class="ta-center">formatTimestamp</h1>
|
|
20
22
|
<main>
|
|
21
23
|
<details class="b r mb">
|
package/package.json
CHANGED
package/src/components/Import.js
CHANGED
|
@@ -13,18 +13,37 @@ export default class Import extends Component {
|
|
|
13
13
|
async render(force){
|
|
14
14
|
const src = this.src;
|
|
15
15
|
if(src && await super.render(force)){
|
|
16
|
+
// Get raw text and process replacements first
|
|
16
17
|
let contents = await (await fetch(src)).text();
|
|
17
18
|
for (const [name, value] of Object.entries(Import.replacements)) {
|
|
18
19
|
contents = contents.replace(new RegExp(`%%${name}%%`, 'g'), value);
|
|
19
20
|
}
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
21
|
+
|
|
22
|
+
// Now parse into template
|
|
23
|
+
const temp = document.createElement('template');
|
|
24
|
+
temp.innerHTML = contents;
|
|
25
|
+
|
|
26
|
+
// Extract and handle scripts
|
|
27
|
+
const scripts = Array.from(temp.content.querySelectorAll('script[src]'));
|
|
28
|
+
scripts.forEach(script => script.remove());
|
|
29
|
+
|
|
30
|
+
// Set content
|
|
31
|
+
this.innerHTML = temp.innerHTML;
|
|
32
|
+
|
|
33
|
+
// Add scripts back
|
|
34
|
+
for (const script of scripts) {
|
|
35
|
+
const newScript = document.createElement('script');
|
|
36
|
+
Array.from(script.attributes).forEach(attr => {
|
|
37
|
+
newScript.setAttribute(attr.name, attr.value);
|
|
38
|
+
});
|
|
39
|
+
console.log('Adding script with src:', newScript.src); // Debug
|
|
40
|
+
await new Promise((resolve, reject) => {
|
|
41
|
+
newScript.onload = resolve;
|
|
42
|
+
newScript.onerror = reject;
|
|
43
|
+
this.appendChild(newScript);
|
|
44
|
+
});
|
|
45
|
+
}
|
|
46
|
+
|
|
28
47
|
return true;
|
|
29
48
|
}
|
|
30
49
|
return false;
|
package/docs/nav-1.inc.html
DELETED
|
@@ -1,84 +0,0 @@
|
|
|
1
|
-
<nav
|
|
2
|
-
class="d-f bg-primary fixed"
|
|
3
|
-
>
|
|
4
|
-
<button
|
|
5
|
-
id="open-side-menu"
|
|
6
|
-
class="link"
|
|
7
|
-
>
|
|
8
|
-
<k-icon name="menu"></k-icon>
|
|
9
|
-
</button>
|
|
10
|
-
<a href="../">Home</a>
|
|
11
|
-
<k-search
|
|
12
|
-
class="flex mr"
|
|
13
|
-
style="min-width:10rem;max-width:24rem"
|
|
14
|
-
></k-search>
|
|
15
|
-
<div class="flex"></div>
|
|
16
|
-
<k-theme-switcher></k-theme-switcher>
|
|
17
|
-
</nav>
|
|
18
|
-
<div style="width: 100%; height: 4rem;"></div>
|
|
19
|
-
<k-side-menu
|
|
20
|
-
id="side-menu"
|
|
21
|
-
>
|
|
22
|
-
<h1>Kempo Docs</h1>
|
|
23
|
-
<menu>
|
|
24
|
-
<a href="../" class="h5 pl0 mb">Home</a>
|
|
25
|
-
<h5 class="mb0">Styles</h5>
|
|
26
|
-
<div class="pl mb">
|
|
27
|
-
<a href="../styles/typography.html">Typography</a>
|
|
28
|
-
<a href="../styles/displays-layouts.html">Displays and Layouts</a>
|
|
29
|
-
<a href="../styles/borders-spacing.html">Borders and Spacing</a>
|
|
30
|
-
<a href="../styles/inputs.html">Inputs</a>
|
|
31
|
-
<a href="../styles/buttons.html">Buttons</a>
|
|
32
|
-
<a href="../styles/tables.html">Tables</a>
|
|
33
|
-
<a href="../styles/colors.html">Colors</a>
|
|
34
|
-
</div>
|
|
35
|
-
<h5 class="mb0">Components</h5>
|
|
36
|
-
<div class="pl mb">
|
|
37
|
-
<a href="../components/component.html">Component</a>
|
|
38
|
-
<a href="../components/lazy-component.html">LazyComponent</a>
|
|
39
|
-
<a href="../components/reactivecomponent.html">ReactiveComponent</a>
|
|
40
|
-
<a href="../components/reactivelazy-component.html">ReactiveLazyComponent</a>
|
|
41
|
-
<a href="../components/focuscapture.html">FocusCapture</a>
|
|
42
|
-
<hr />
|
|
43
|
-
<a href="../components/accordion.html">Accordion</a>
|
|
44
|
-
<a href="../components/card.html">Card</a>
|
|
45
|
-
<a href="../components/content-slider.html">Content Slider</a>
|
|
46
|
-
<a href="../components/dialog.html">Dialog</a>
|
|
47
|
-
<a href="../components/directory-viewer.html">Directory Viewer</a>
|
|
48
|
-
<a href="../components/icon.html">Icon</a>
|
|
49
|
-
<a href="../components/import.html">Import</a>
|
|
50
|
-
<a href="../components/resize.html">Resize</a>
|
|
51
|
-
<a href="../components/search.html">Search</a>
|
|
52
|
-
<a href="../components/show-more.html">Show More</a>
|
|
53
|
-
<a href="../components/side-menu.html">Side Menu</a>
|
|
54
|
-
<a href="../components/split.html">Split</a>
|
|
55
|
-
<a href="../components/table.html">Table</a>
|
|
56
|
-
<a href="../components/tabs.html">Tabs</a>
|
|
57
|
-
<a href="../components/tags.html">Tags</a>
|
|
58
|
-
<a href="../components/theme-switcher.html">Theme Switcher</a>
|
|
59
|
-
<a href="../components/timestamp.html">Timestamp</a>
|
|
60
|
-
<a href="../components/toggle.html">Toggle</a>
|
|
61
|
-
</div>
|
|
62
|
-
|
|
63
|
-
<h5 class="mb0">Utils</h5>
|
|
64
|
-
<div class="pl mb">
|
|
65
|
-
<a href="../utils/cli.html">CLI</a>
|
|
66
|
-
<a href="../utils/cookie.html">Cookie</a>
|
|
67
|
-
<a href="../utils/debounce.html">Debounce</a>
|
|
68
|
-
<a href="../utils/drag.html">Drag</a>
|
|
69
|
-
<a href="../utils/element.html">Element</a>
|
|
70
|
-
<a href="../utils/format-timestamp.html">Format Timestamp</a>
|
|
71
|
-
<a href="../utils/fuzzy-match.html">Fuzzy Match</a>
|
|
72
|
-
</div>
|
|
73
|
-
</menu>
|
|
74
|
-
</k-side-menu>
|
|
75
|
-
<script>
|
|
76
|
-
document.getElementById('open-side-menu').addEventListener('click', async () => {
|
|
77
|
-
await window.customElements.whenDefined('k-side-menu');
|
|
78
|
-
document.getElementById('side-menu').open();
|
|
79
|
-
});
|
|
80
|
-
</script>
|
|
81
|
-
<script src="../kempo/components/SideMenu.js" type="module"></script>
|
|
82
|
-
<script src="../kempo/components/Icon.js" type="module"></script>
|
|
83
|
-
<script src="../kempo/components/ThemeSwitcher.js" type="module"></script>
|
|
84
|
-
<script src="../kempo/components/Search.js" type="module"></script>
|