kempo-ui 0.0.41 → 0.0.42

package/dist/components/Icon.js

@@ -1,4 +1,4 @@
-import ShadowComponent from"./ShadowComponent.js";import{html,css,unsafeHTML}from"../lit-all.min.js";const cache={},getIconByPath=async t=>(cache[t]||(cache[t]=new Promise(async(e,n)=>{const o=(new AbortController).signal;try{const n=await fetch(t,{signal:o});200===n.status?e(await n.text()):404===n.status&&e(null)}catch(t){"AbortError"!==t.name&&n(t)}}).catch(()=>null)),await cache[t]),getIconByName=t=>{const e=async e=>getIconByPath(`${e}/${t}.svg`);return new Promise(async(t,n)=>{let o;const s=window.kempo?.pathsToIcons||["/icons"];for(let t=0;t<s.length&&!o;t++)try{o=await e(s[t])}catch(t){}t(o||null)})};export default class Icon extends ShadowComponent{static properties={src:{type:String,reflect:!0},name:{type:String,reflect:!0},iconContent:{type:String}};constructor(t=""){super(),this.src="",this.name=t,this.iconContent=""}updated(t){super.updated(),(t.has("src")||t.has("name"))&&this.loadIcon()}async loadIcon(){let t;if(this.src?t=await getIconByPath(this.src):this.name&&(t=await getIconByName(this.name)),t)this.iconContent=this.fixSVG(t);else{const t=this.innerHTML.trim();this.iconContent=t?this.fixSVG(t):window.kempo?.fallbackIcon||'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960"><path fill="currentColor" d="M480-79q-16 0-30.5-6T423-102L102-423q-11-12-17-26.5T79-480q0-16 6-31t17-26l321-321q12-12 26.5-17.5T480-881q16 0 31 5.5t26 17.5l321 321q12 11 17.5 26t5.5 31q0 16-5.5 30.5T858-423L537-102q-11 11-26 17t-31 6Zm0-80 321-321-321-321-321 321 321 321Zm-40-281h80v-240h-80v240Zm40 120q17 0 28.5-11.5T520-360q0-17-11.5-28.5T480-400q-17 0-28.5 11.5T440-360q0 17 11.5 28.5T480-320Zm0-160Z"/></svg>'}}fixSVG(t){if(!t)return t;const e=(new DOMParser).parseFromString(t,"image/svg+xml").querySelector("svg");return e?(e.removeAttribute("width"),e.removeAttribute("height"),e.querySelectorAll("path, rect, circle").forEach(t=>{t.setAttribute("fill","currentColor")}),(new XMLSerializer).serializeToString(e)):t}static styles=css`
+import ShadowComponent from"./ShadowComponent.js";import{html,css,unsafeHTML}from"../lit-all.min.js";const cache={},getIconByPath=async t=>(cache[t]||(cache[t]=new Promise(async(e,n)=>{const s=(new AbortController).signal;try{const n=await fetch(t,{signal:s});200===n.status?e(await n.text()):404===n.status&&e(null)}catch(t){"AbortError"!==t.name&&n(t)}}).catch(()=>null)),await cache[t]),getIconByName=t=>{const e=async e=>{const n=e.endsWith("/")?e.slice(0,-1):e;return getIconByPath(`${n}/${t}.svg`)};return new Promise(async(t,n)=>{let s;const o=window.kempo?.pathsToIcons||["/icons","../../icons","https://cdn.jsdelivr.net/npm/kempo-ui@0.0.32/icons/"];for(let t=0;t<o.length&&!s;t++)try{s=await e(o[t])}catch(t){}t(s||null)})};export default class Icon extends ShadowComponent{static properties={src:{type:String,reflect:!0},name:{type:String,reflect:!0},iconContent:{type:String}};constructor(t=""){super(),this.src="",this.name=t,this.iconContent=""}updated(t){super.updated(),(t.has("src")||t.has("name"))&&this.loadIcon()}async loadIcon(){let t;if(this.src?t=await getIconByPath(this.src):this.name&&(t=await getIconByName(this.name)),t)this.iconContent=this.fixSVG(t);else{const t=this.innerHTML.trim();this.iconContent=t?this.fixSVG(t):window.kempo?.fallbackIcon||'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960"><path fill="currentColor" d="M480-79q-16 0-30.5-6T423-102L102-423q-11-12-17-26.5T79-480q0-16 6-31t17-26l321-321q12-12 26.5-17.5T480-881q16 0 31 5.5t26 17.5l321 321q12 11 17.5 26t5.5 31q0 16-5.5 30.5T858-423L537-102q-11 11-26 17t-31 6Zm0-80 321-321-321-321-321 321 321 321Zm-40-281h80v-240h-80v240Zm40 120q17 0 28.5-11.5T520-360q0-17-11.5-28.5T480-400q-17 0-28.5 11.5T440-360q0 17 11.5 28.5T480-320Zm0-160Z"/></svg>'}}fixSVG(t){if(!t)return t;const e=(new DOMParser).parseFromString(t,"image/svg+xml").querySelector("svg");return e?(e.removeAttribute("width"),e.removeAttribute("height"),e.querySelectorAll("path, rect, circle").forEach(t=>{t.setAttribute("fill","currentColor")}),(new XMLSerializer).serializeToString(e)):t}static styles=css`
 		:host {
 			display: inline-block;
 			vertical-align: bottom;

package/docs/components/accordion.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/card.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/content-slider.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/dialog.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/dropdown.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/focus-capture.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/hybrid-component.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/import.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/light-component.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/photo-viewer.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/resize.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/shadow-component.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/show-more.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/side-menu.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/sortable.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/spinner.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/split.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/table.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/tableControls.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
   <script>
     window.contacts = [];
     function generateContact(){

package/docs/components/tableCustomFields.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
   <script>
     window.contacts = [];
     function generateContact(){

package/docs/components/tableFetchRecords.html

@@ -12,7 +12,6 @@
   <link rel="stylesheet" href="../styles.css" />
   <script type="module" src="../src/components/Table.js"></script>
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
   <script>
     window.contacts = [];
     function generateContact(){

package/docs/components/tableFieldSortHide.html

@@ -12,7 +12,6 @@
   <link rel="stylesheet" href="../styles.css" />
   <script type="module" src="../src/components/Table.js"></script>
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
   <script>
     window.contacts = [];
     function generateContact(){

package/docs/components/tablePagination.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
   <script>
     window.contacts = [];
     function generateContact(){

package/docs/components/tableRecordEditing.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
   <script>
     window.contacts = [];
     function generateContact(){

package/docs/components/tableRecordFiltering.html

@@ -12,7 +12,6 @@
   <link rel="stylesheet" href="../styles.css" />
   <script type="module" src="../src/components/Table.js"></script>
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
   <script>
     window.contacts = [];
     function generateContact(){

package/docs/components/tableRecordHiding.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
   <script>
     window.contacts = [];
     function generateContact(){

package/docs/components/tableRecordSearching.html

@@ -12,7 +12,6 @@
   <link rel="stylesheet" href="../styles.css" />
   <script type="module" src="../src/components/Table.js"></script>
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
   <script>
     window.contacts = [];
     function generateContact(){

package/docs/components/tableRecordSelection.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
   <script>
     window.contacts = [];
     function generateContact(){

package/docs/components/tableRowControls.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
   <script>
     window.contacts = [];
     function generateContact(){

package/docs/components/tableSorting.html

@@ -12,7 +12,6 @@
   <link rel="stylesheet" href="../styles.css" />
   <script type="module" src="../src/components/Table.js"></script>
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
   <script>
     window.contacts = [];
     function generateContact(){

package/docs/components/tabs.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/tags.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/theme-switcher.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/timestamp.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/toast.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/toggle.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/components/tree.html

@@ -12,7 +12,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 
 <body>

package/docs/dev.config.json

@@ -1,6 +1,5 @@
 {
   "customRoutes": {
-    "/kempo-vars.css": "../src/kempo-vars.css",
     "/icons/**": "../icons/**",
     "/src/**": "../src/**"
   },

package/docs/index.html

@@ -10,7 +10,6 @@
   <link rel="stylesheet" href="./kempo-hljs.css">
   <link rel="stylesheet" href="./kempo-vars.css">
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="./init.js" type="module"></script>
 </head>
 <body>
   <k-import src="nav.inc.html"></k-import>

package/docs/src/components/Icon.js

@@ -1,4 +1,4 @@
-import ShadowComponent from"./ShadowComponent.js";import{html,css,unsafeHTML}from"../lit-all.min.js";const cache={},getIconByPath=async t=>(cache[t]||(cache[t]=new Promise(async(e,n)=>{const o=(new AbortController).signal;try{const n=await fetch(t,{signal:o});200===n.status?e(await n.text()):404===n.status&&e(null)}catch(t){"AbortError"!==t.name&&n(t)}}).catch(()=>null)),await cache[t]),getIconByName=t=>{const e=async e=>getIconByPath(`${e}/${t}.svg`);return new Promise(async(t,n)=>{let o;const s=window.kempo?.pathsToIcons||["/icons"];for(let t=0;t<s.length&&!o;t++)try{o=await e(s[t])}catch(t){}t(o||null)})};export default class Icon extends ShadowComponent{static properties={src:{type:String,reflect:!0},name:{type:String,reflect:!0},iconContent:{type:String}};constructor(t=""){super(),this.src="",this.name=t,this.iconContent=""}updated(t){super.updated(),(t.has("src")||t.has("name"))&&this.loadIcon()}async loadIcon(){let t;if(this.src?t=await getIconByPath(this.src):this.name&&(t=await getIconByName(this.name)),t)this.iconContent=this.fixSVG(t);else{const t=this.innerHTML.trim();this.iconContent=t?this.fixSVG(t):window.kempo?.fallbackIcon||'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960"><path fill="currentColor" d="M480-79q-16 0-30.5-6T423-102L102-423q-11-12-17-26.5T79-480q0-16 6-31t17-26l321-321q12-12 26.5-17.5T480-881q16 0 31 5.5t26 17.5l321 321q12 11 17.5 26t5.5 31q0 16-5.5 30.5T858-423L537-102q-11 11-26 17t-31 6Zm0-80 321-321-321-321-321 321 321 321Zm-40-281h80v-240h-80v240Zm40 120q17 0 28.5-11.5T520-360q0-17-11.5-28.5T480-400q-17 0-28.5 11.5T440-360q0 17 11.5 28.5T480-320Zm0-160Z"/></svg>'}}fixSVG(t){if(!t)return t;const e=(new DOMParser).parseFromString(t,"image/svg+xml").querySelector("svg");return e?(e.removeAttribute("width"),e.removeAttribute("height"),e.querySelectorAll("path, rect, circle").forEach(t=>{t.setAttribute("fill","currentColor")}),(new XMLSerializer).serializeToString(e)):t}static styles=css`
+import ShadowComponent from"./ShadowComponent.js";import{html,css,unsafeHTML}from"../lit-all.min.js";const cache={},getIconByPath=async t=>(cache[t]||(cache[t]=new Promise(async(e,n)=>{const s=(new AbortController).signal;try{const n=await fetch(t,{signal:s});200===n.status?e(await n.text()):404===n.status&&e(null)}catch(t){"AbortError"!==t.name&&n(t)}}).catch(()=>null)),await cache[t]),getIconByName=t=>{const e=async e=>{const n=e.endsWith("/")?e.slice(0,-1):e;return getIconByPath(`${n}/${t}.svg`)};return new Promise(async(t,n)=>{let s;const o=window.kempo?.pathsToIcons||["/icons","../../icons","https://cdn.jsdelivr.net/npm/kempo-ui@0.0.32/icons/"];for(let t=0;t<o.length&&!s;t++)try{s=await e(o[t])}catch(t){}t(s||null)})};export default class Icon extends ShadowComponent{static properties={src:{type:String,reflect:!0},name:{type:String,reflect:!0},iconContent:{type:String}};constructor(t=""){super(),this.src="",this.name=t,this.iconContent=""}updated(t){super.updated(),(t.has("src")||t.has("name"))&&this.loadIcon()}async loadIcon(){let t;if(this.src?t=await getIconByPath(this.src):this.name&&(t=await getIconByName(this.name)),t)this.iconContent=this.fixSVG(t);else{const t=this.innerHTML.trim();this.iconContent=t?this.fixSVG(t):window.kempo?.fallbackIcon||'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960"><path fill="currentColor" d="M480-79q-16 0-30.5-6T423-102L102-423q-11-12-17-26.5T79-480q0-16 6-31t17-26l321-321q12-12 26.5-17.5T480-881q16 0 31 5.5t26 17.5l321 321q12 11 17.5 26t5.5 31q0 16-5.5 30.5T858-423L537-102q-11 11-26 17t-31 6Zm0-80 321-321-321-321-321 321 321 321Zm-40-281h80v-240h-80v240Zm40 120q17 0 28.5-11.5T520-360q0-17-11.5-28.5T480-400q-17 0-28.5 11.5T440-360q0 17 11.5 28.5T480-320Zm0-160Z"/></svg>'}}fixSVG(t){if(!t)return t;const e=(new DOMParser).parseFromString(t,"image/svg+xml").querySelector("svg");return e?(e.removeAttribute("width"),e.removeAttribute("height"),e.querySelectorAll("path, rect, circle").forEach(t=>{t.setAttribute("fill","currentColor")}),(new XMLSerializer).serializeToString(e)):t}static styles=css`
 		:host {
 			display: inline-block;
 			vertical-align: bottom;

package/docs/utils/context.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/utils/debounce.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/utils/drag.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/utils/formatTimestamp.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/utils/object.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/utils/propConverters.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/utils/string.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/utils/theme.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/utils/toTitleCase.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/utils/type.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/docs/utils/wait.html

@@ -11,7 +11,6 @@
   <link rel="stylesheet" href="../kempo-hljs.css" />
   <link rel="stylesheet" href="../styles.css" />
   <script>window.litDisableBundleWarning = true;</script>
-  <script src="../init-1.js" type="module"></script>
 </head>
 <body>
   <k-import src="../nav-1.inc.html"></k-import>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kempo-ui",
-  "version": "0.0.41",
+  "version": "0.0.42",
   "type": "module",
   "description": "A Lit based web-component library",
   "main": "index.js",

package/src/components/Icon.js

@@ -26,11 +26,15 @@ const getIconByPath = async (path) => {
 };
 
 const getIconByName = (name) => {
-	const tryDir = async (dir) => getIconByPath(`${dir}/${name}.svg`);
+	const tryDir = async (dir) => {
+		// Ensure single slash between dir and filename
+		const normalizedDir = dir.endsWith('/') ? dir.slice(0, -1) : dir;
+		return getIconByPath(`${normalizedDir}/${name}.svg`);
+	};
 
 	return new Promise(async (resolve, reject) => {
 		let svg;
-		const pathsToCheck = window.kempo?.pathsToIcons || ['/icons'];
+		const pathsToCheck = window.kempo?.pathsToIcons || ['/icons', '../../icons', 'https://cdn.jsdelivr.net/npm/kempo-ui@0.0.32/icons/'];
 		for(let i = 0; i < pathsToCheck.length && !svg; i++){
 			try {
 				svg = await tryDir(pathsToCheck[i]);

package/docs/init-1.js

@@ -1,4 +0,0 @@
-window.kempo = {
-	pathToStylesheet: '../kempo.min.css',
-	pathsToIcons: ['../icons']
-};

package/docs/init.js

@@ -1,4 +0,0 @@
-window.kempo = {
-	pathToStylesheet: './kempo.min.css',
-	pathsToIcons: ['./icons']
-};