@esportsplus/ui 0.0.64 → 0.0.66

package/build/components/form/types.d.ts

@@ -1,6 +1,12 @@
-import { Response } from '@esportsplus/action';
-type Action = <T>(data: T) => Promise<Errors> | Errors;
+import { response, Response } from '@esportsplus/action';
+import alert from '../../components/alert';
+type Action = (data: Payload) => Promise<Errors> | Errors;
 type Errors = {
     errors: Response<unknown>['errors'];
 };
-export { Action, Errors };
+type Payload = {
+    alert: typeof alert;
+    input: Record<string, any>;
+    response: typeof response;
+};
+export { Action, Errors, Payload };

package/build/components/tooltip/index.d.ts

@@ -1,5 +1,5 @@
 declare const _default: {
-    onclick: ({ active, toggle }: {
+    onclick: ({ active, toggle }?: {
         active?: boolean | undefined;
         toggle?: boolean | undefined;
     }) => {
@@ -27,9 +27,9 @@ declare const _default: {
             text: string;
             url?: string | undefined;
         }[] | undefined;
-        state: {
-            active: boolean;
-        };
+        state?: {
+            active?: boolean | undefined;
+        } | undefined;
         style?: string | undefined;
     }) => () => "" | {
         content: string;

package/build/components/tooltip/index.js

@@ -2,7 +2,7 @@ import { reactive } from '@esportsplus/reactivity';
 import { html } from '@esportsplus/template';
 import { root } from '../../components';
 import menu from './menu';
-const onclick = ({ active, toggle }) => {
+const onclick = ({ active, toggle } = {}) => {
     let state = reactive({
         active: active || false
     });

package/build/components/tooltip/menu.d.ts

@@ -13,8 +13,8 @@ type Data = {
         text: string;
         url?: string;
     }[];
-    state: {
-        active: boolean;
+    state?: {
+        active?: boolean;
     };
     style?: string;
 };

package/build/components/tooltip/menu.js

@@ -38,7 +38,7 @@ export default (data) => {
         render: false
     });
     effect(() => {
-        if (!data.state.active || state.render) {
+        if (!data?.state?.active || state.render) {
             return;
         }
         state.render = true;

package/package.json

@@ -22,5 +22,5 @@
         "prepublishOnly": "npm run build"
     },
     "types": "build/index.d.ts",
-    "version": "0.0.64"
+    "version": "0.0.66"
 }

package/src/components/form/action.ts

@@ -39,6 +39,8 @@ export default function(action: Action) {
                 new SubmitEvent('submit', { cancelable: true, bubbles:true, submitter: trigger })
             );
         },
+        // TODO: Figure out processing
+        // - Could pass reactive value above and tie it to form layout handler
         onsubmit: async function(this: HTMLFormElement, event: SubmitEvent) {
             event.preventDefault();
             event?.submitter?.classList.add('button--processing');

package/src/components/form/types.ts

@@ -1,9 +1,16 @@
-import { Response } from '@esportsplus/action';
+import { response, Response } from '@esportsplus/action';
+import alert from '~/components/alert';
 
 
-type Action = <T>(data: T) => Promise<Errors> | Errors;
+type Action = (data: Payload) => Promise<Errors> | Errors;
 
 type Errors = { errors: Response<unknown>['errors'] };
 
+type Payload = {
+    alert: typeof alert;
+    input: Record<string, any>;
+    response: typeof response;
+};
 
-export { Action, Errors };
+
+export { Action, Errors, Payload };

package/src/components/tooltip/index.ts

@@ -4,7 +4,7 @@ import { root } from '~/components';
 import menu from './menu';
 
 
-const onclick = ({ active, toggle }: { active?: boolean, toggle?: boolean }) => {
+const onclick = ({ active, toggle }: { active?: boolean, toggle?: boolean } = {}) => {
     let state = reactive({
             active: active || false
         });

package/src/components/tooltip/menu.ts

@@ -17,7 +17,7 @@ type Data = {
         text: string;
         url?: string;
     }[];
-    state: { active: boolean };
+    state?: { active?: boolean };
     style?: string;
 };
 
@@ -63,7 +63,7 @@ export default (data: Data) => {
         });
 
     effect(() => {
-        if (!data.state.active || state.render) {
+        if (!data?.state?.active || state.render) {
             return;
         }