@esportsplus/ui 0.0.87 → 0.0.89

package/build/index.js

@@ -1,2 +1,17 @@
-import './types';
-export * from './components';
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./components"), exports);

package/build/types.d.ts

@@ -3,3 +3,4 @@ declare module '*.json';
 declare module '*.png';
 declare module '*.svg';
 declare module '*.txt';
+export {};

package/build/types.js

@@ -1 +1,2 @@
 "use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/package.json

@@ -2,13 +2,12 @@
     "author": "ICJR",
     "dependencies": {
         "@esportsplus/action": "^0.0.38",
-        "@esportsplus/delegated-events": "^0.0.19",
-        "@esportsplus/reactivity": "^0.1.17",
-        "@esportsplus/template": "^0.1.8"
+        "@esportsplus/reactivity": "^0.1.18",
+        "@esportsplus/template": "^0.1.27"
     },
     "description": "UI",
     "devDependencies": {
-        "@esportsplus/webpack": "^0.1.20",
+        "@esportsplus/webpack": "^0.1.30",
         "modern-normalize": "^2.0.0"
     },
     "main": "build/index.js",
@@ -17,10 +16,10 @@
     "scripts": {
         "build": "npm run build:ts && npm run build:web",
         "build:ts": "tsc && tsc-alias",
-        "build:web": "webpack",
+        "build:web": "webpack build --env=production=true",
         "-": "-",
         "prepublishOnly": "npm run build"
     },
     "types": "build/index.d.ts",
-    "version": "0.0.87"
+    "version": "0.0.89"
 }

package/src/components/form/action.ts

@@ -1,5 +1,4 @@
 import { response } from '@esportsplus/action';
-import { html } from '@esportsplus/template';
 import { Action } from './types';
 import alert from '~/components/alert';
 import input from './input';
@@ -24,8 +23,8 @@ function parse(input: Record<string, any>) {
 
 
 export default function(action: Action) {
-    return html`
-        onclick='${function(this: HTMLFormElement, event: Event) {
+    return {
+        onclick: function(this: HTMLFormElement, event: Event) {
             let trigger = event.target as HTMLButtonElement;
 
             if (trigger?.type !== 'submit') {
@@ -38,8 +37,8 @@ export default function(action: Action) {
             this.dispatchEvent(
                 new SubmitEvent('submit', { cancelable: true, bubbles:true, submitter: trigger })
             );
-        }}'
-        onsubmit='${async function(this: HTMLFormElement, event: SubmitEvent) {
+        },
+        onsubmit: async function(this: HTMLFormElement, event: SubmitEvent) {
             // TODO: Figure out processing
              // - Could pass reactive value above and tie it to form layout handler
             event.preventDefault();
@@ -64,6 +63,6 @@ export default function(action: Action) {
 
             // TODO: replace with signal
             event?.submitter?.classList.remove('button--processing');
-        }}'
-    `;
+        }
+    };
 };

package/src/components/root/queue.ts

@@ -1,4 +1,4 @@
-import events from '@esportsplus/delegated-events';
+// import events from '@esportsplus/delegated-events';
 
 
 let initialized = false,
@@ -7,17 +7,17 @@ let initialized = false,
 
 const onclick = (fn: VoidFunction) => {
     if (!initialized) {
-        events.register(document.body, 'click', async () => {
-            if (!queue.length) {
-                return;
-            }
+        // events.register(document.body, 'click', async () => {
+        //     if (!queue.length) {
+        //         return;
+        //     }
 
-            let items = queue.splice(0);
+        //     let items = queue.splice(0);
 
-            for (let i = 0, n = items.length; i < n; i++) {
-                await items[i]();
-            }
-        });
+        //     for (let i = 0, n = items.length; i < n; i++) {
+        //         await items[i]();
+        //     }
+        // });
         initialized = true;
     }
 

package/src/components/scrollbar/index.ts

@@ -13,11 +13,11 @@ export default ({ fixed, style }: { fixed?: boolean, style?: string } = {}) => {
         });
 
     return {
-        attributes: html`
-            class='${() => {
+        attributes: {
+            class: () => {
                 return '--scrollbar';
-            }}'
-            onscroll='${function(this: HTMLElement) {
+            },
+            onscroll: function(this: HTMLElement) {
                 if (width === undefined) {
                     width = this.offsetWidth - this.clientWidth;
 
@@ -28,8 +28,8 @@ export default ({ fixed, style }: { fixed?: boolean, style?: string } = {}) => {
 
                 state.height = (this.clientHeight / this.scrollHeight) * 100;
                 state.translate = (this.scrollTop / this.clientHeight) * 100;
-            }}'
-        `,
+            }
+        },
         html: html`
             <div
                 class='scrollbar ${fixed ? 'scrollbar--fixed' : ''} ${() => state.height >= 100 ? 'scrollbar--hidden' : ''}'

package/src/components/site/index.ts

@@ -18,7 +18,7 @@ export default (data: Data) => {
         });
 
     return html`
-        <section class='site ${data?.class || ''}' ${a}>
+        <section class='site ${data?.class || ''}' ...${a}>
             ${data?.content || ''}
             ${h}
         </section>

package/src/components/tooltip/index.ts

@@ -1,5 +1,4 @@
 import { reactive } from '@esportsplus/reactivity';
-import { html } from '@esportsplus/template';
 import { root } from '~/components';
 import menu from './menu';
 
@@ -38,11 +37,11 @@ const onclick = (data: { active?: boolean, menu?: Parameters<typeof menu>[0], to
     }
 
     return {
-        attributes: html`
-            class='${() => {
+        attributes: {
+            class: () => {
                 return `tooltip ${state.active ? '--active' : ''}`;
-            }}'
-            onclick='${function(this: HTMLElement, e: Event) {
+            },
+            onclick: function(this: HTMLElement, e: Event) {
                 let active = true,
                     node = e.target as Node | null;
 
@@ -64,8 +63,8 @@ const onclick = (data: { active?: boolean, menu?: Parameters<typeof menu>[0], to
                         scheduled = false;
                     });
                 }
-            }}'
-        `,
+            }
+        },
         content,
         state
     };
@@ -78,17 +77,17 @@ const onhover = (active: boolean = false) => {
         });
 
     return {
-        attributes: html`
-            class='${() => {
+        attributes: {
+            class: () => {
                 return `tooltip ${state.active ? '--active' : ''}`;
-            }}'
-            onmouseover='${() => {
+            },
+            onmouseover: () => {
                 state.active = true;
-            }}'
-            onmouseout='${() => {
+            },
+            onmouseout: () => {
                 state.active = false;
-            }}'
-        `,
+            }
+        },
         state
     };
 };

package/src/index.ts

@@ -1,4 +1 @@
-import './types';
-
-
 export * from './components';

package/tsconfig.json

@@ -1,10 +1,11 @@
 {
     "compilerOptions": {
         "baseUrl": ".",
+        "declaration": true,
         "declarationDir": "build",
         "outDir": "build"
     },
     "exclude": ["node_modules"],
-    "extends": "@esportsplus/webpack/tsconfig.base.json",
+    "extends": "./node_modules/@esportsplus/typescript/tsconfig.base.json",
     "include": ["src"]
-}
+}

package/webpack.config.ts

@@ -1,28 +1,33 @@
 import { config, entry } from '@esportsplus/webpack';
 
 
-export default () => config.web({
-    contenthash: false,
-    entry: {
-        css: {
-            components: {
-                styles: entry.css('src/components/**/index.scss'),
-                variables: entry.css('src/components/**/variables.scss')
-            },
-            fonts: {
-                montserrat: entry.css('storage/fonts/montserrat/index.css')
-            },
-            normalizer: entry.css('modern-normalize/modern-normalize.css'),
-            utilities: {
-                styles: entry.css('src/css-utilities/**/index.scss'),
-                variables: entry.css('src/css-utilities/**/variables.scss')
+export default (env: { production?: boolean | string }) => {
+    let production = env.production !== 'false';
+
+    return config.web({
+        cache: false,
+        contenthash: false,
+        entry: {
+            css: {
+                components: {
+                    styles: entry.css('src/components/**/index.scss'),
+                    variables: entry.css('src/components/**/variables.scss')
+                },
+                fonts: {
+                    montserrat: entry.css('storage/fonts/montserrat/index.css')
+                },
+                normalizer: entry.css('modern-normalize/modern-normalize.css'),
+                utilities: {
+                    styles: entry.css('src/css-utilities/**/index.scss'),
+                    variables: entry.css('src/css-utilities/**/variables.scss')
+                }
             }
+        },
+        mode: production ? 'production': 'development',
+        // Temporary output until css root directory can be set through
+        // package.json or similar ( like 'main' key )
+        output: {
+            path: '.'
         }
-    },
-    mode: 'production',
-    // Temporary output until css root directory can be set
-    // through package.json or similar ( like 'main' key )
-    output: {
-        path: '.'
-    }
-});
+    });
+};

package/src/types.ts

@@ -1,5 +0,0 @@
-declare module '*.jpg';
-declare module '*.json';
-declare module '*.png';
-declare module '*.svg';
-declare module '*.txt';