brew-js-react 0.6.7 → 0.7.1

package/mixins/AnimateMixin.d.ts

@@ -48,4 +48,10 @@ export default class AnimateMixin extends ClassNameMixin {
      * @see {@link AnimationEffect} and {@link AnimationTrigger}.
      */
     withEffects(...effects: AnimationEffect[]): this;
+
+    /**
+     * Applies custom attributes to element.
+     * @private It is used internally by mixins and is declared for type inference.
+     */
+    getCustomAttributes(): Record<'animate-in' | 'animate-out', string>;
 }

package/mixins/AnimateSequenceItemMixin.d.ts

@@ -8,4 +8,10 @@ import ClassNameMixin from "./ClassNameMixin";
  */
 export default class AnimateSequenceItemMixin extends ClassNameMixin {
     constructor(className: string);
+
+    /**
+     * Applies custom attributes to element.
+     * @private It is used internally by mixins and is declared for type inference.
+     */
+    getCustomAttributes(): Record<'is-animate-sequence', string>;
 }

package/mixins/AnimateSequenceMixin.d.ts

@@ -13,4 +13,11 @@ export default class AnimateSequenceMixin extends AnimateMixin {
      * Returns a mixin that marks element to be a target of this animate sequence.
      */
     readonly item: AnimateSequenceItemMixin;
+
+    /**
+     * Applies custom attributes to element.
+     * @private It is used internally by mixins and is declared for type inference.
+     */
+    // @ts-ignore
+    getCustomAttributes(): Record<'animate-sequence' | 'animate-sequence-type' | 'animate-out', string>;
 }

package/mixins/FlyoutMixin.d.ts

@@ -131,4 +131,10 @@ export default class FlyoutMixin<S = any, R = any> extends ClassNameMixin {
      * @returns A promise that resolves when the flyout is being closed.
      */
     toggleSelf(flag: boolean, source?: Element): Promise<HintedType<R>>;
+
+    /**
+     * Applies custom attributes to element.
+     * @private It is used internally by mixins and is declared for type inference.
+     */
+    getCustomAttributes(): Record<'is-flyout' | 'is-modal' | 'tab-through' | 'swipe-dismiss' | 'animate-on' | 'animate-in' | 'animate-out', string>;
 }

package/mixins/Mixin.d.ts

@@ -2,32 +2,35 @@ import React from "react";
 import { ClassName, ClassNameProvider } from "zeta-dom-react";
 import StaticAttributeMixin from "./StaticAttributeMixin";
 
-interface MixinProps {
-    ref: React.RefCallback<Element>;
+export type MixinProps<T extends Element, M> = MixinDefaultProps<T> & UnionToIntersection<M extends CustomAttributeProvider<infer P> ? P : never>;
+
+type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => void ? I : never;
+type MixinTypes<T extends readonly unknown[]> = Extract<Zeta.ArrayMember<T>, CustomAttributeProvider>;
+
+interface MixinDefaultProps<T extends Element> {
+    ref: React.RefCallback<T>;
     className: string;
 }
 
+interface CustomAttributeProvider<T = {}> {
+    getCustomAttributes(): T;
+}
+
 export default abstract class Mixin implements ClassNameProvider {
-    static readonly scrollableTarget: StaticAttributeMixin;
-    static readonly tabRoot: StaticAttributeMixin;
+    static readonly scrollableTarget: StaticAttributeMixin<Record<'scrollable-target', string>>;
+    static readonly tabRoot: StaticAttributeMixin<Record<'tab-root', string>>;
 
     /**
      * Applies React ref and mixins to element.
      * @param ref A ref callback or ref object.
      * @param args Mixin instances or string literals. String literals are applied to element as CSS classes.
      */
-    static use(ref: React.ForwardedRef<any>, ...args: (Mixin | string | undefined)[]): MixinProps;
+    static use<T extends Element, M extends readonly (Mixin | string | undefined)[]>(ref: React.ForwardedRef<T>, ...args: M): MixinProps<T, MixinTypes<M>>;
     /**
      * Applies mixins to element.
-     * @param mixin Mixin instance.
      * @param args Mixin instances or string literals. String literals are applied to element as CSS classes.
      */
-    static use(mixin: Mixin, ...args: (Mixin | string | undefined)[]): MixinProps;
-    /**
-     * Applies mixins to element.
-     * @param mixins Mixin instances.
-     */
-    static use(...mixins: (Mixin | undefined)[]): MixinProps;
+    static use<M extends readonly (Mixin | string | undefined)[]>(...args: M): MixinProps<Element, MixinTypes<M>>;
 
     /**
      * @private Internal use.
@@ -48,7 +51,7 @@ export default abstract class Mixin implements ClassNameProvider {
     /**
      * Override this method to apply custom attributes to element.
      */
-    getCustomAttributes(): Zeta.Dictionary<string>;
+    getCustomAttributes(): {};
     /**
      * @private Internal use.
      */

package/mixins/Mixin.js

@@ -34,36 +34,30 @@ define(Mixin, {
     },
     use: function () {
         const args = makeArray(arguments);
-        const ref = args[0];
         const props = {};
-        const mixins = args.filter(function (v) {
-            return v instanceof Mixin;
-        });
-        const refs = mixins.map(function (v) {
-            return v.getRef();
-        });
-        if (ref && !(ref instanceof Mixin)) {
-            if (typeof ref !== 'function') {
-                refs.push(function (v) {
-                    ref.current = v;
-                });
-            } else {
-                refs.push(ref);
-            }
+        const refs = [];
+        const ref = args[0];
+        if (!ref) {
+            args.shift();
+        } else if (typeof ref === 'function') {
+            refs.push(ref);
             args.shift();
-        } else if (!ref) {
+        } else if (typeof ref !== 'string' && !(ref instanceof Mixin)) {
+            refs.push(function (w) {
+                ref.current = w;
+            });
             args.shift();
         }
-        each(mixins, function (i, v) {
-            extend(props, v.getCustomAttributes());
+        each(args, function (i, v) {
+            if (v instanceof Mixin) {
+                refs.push(v.getRef());
+                extend(props, v.getCustomAttributes());
+                v.next();
+            }
         });
-        extend(props, {
+        return extend(props, {
             ref: combineFn(refs),
             className: classNames.apply(null, args)
         });
-        each(mixins, function (i, v) {
-            v.next();
-        });
-        return props;
     }
 });

package/mixins/ScrollableMixin.d.ts

@@ -53,7 +53,7 @@ export default class ScrollableMixin extends ClassNameMixin implements JQueryScr
      * Gets a mixin object that when applied to descecant element
      * the element will act as content to be scrolled.
      */
-    readonly target: StaticAttributeMixin;
+    readonly target: StaticAttributeMixin<Record<'scrollable-target', string>>;
     /**
      * Gets the element with scrollable plugin enabled.
      */
@@ -188,4 +188,10 @@ export default class ScrollableMixin extends ClassNameMixin implements JQueryScr
      * @returns A promise that resolves when scrolling is completed.
      */
     scrollToElement(target: Element | string, targetOrigin?: string, wrapperOrigin?: string, duration?: number, callback?: () => void): Promise<void> & JQueryScrollableState;
+
+    /**
+     * Applies custom attributes to element.
+     * @private It is used internally by mixins and is declared for type inference.
+     */
+    getCustomAttributes(): Record<'scrollable' | 'scroller-snap-page' | 'scroller-page' | 'persist-scroll', string>;
 }

package/mixins/StaticAttributeMixin.d.ts

@@ -1,13 +1,20 @@
 import Mixin from "./Mixin";
 
-export default class StaticAttributeMixin extends Mixin {
+export default class StaticAttributeMixin<P = {}> extends Mixin {
     /**
      * @param name Name of attribute.
      * @param value Value to be set. Default is empty string.
      */
-    constructor(name: string, value?: string);
+    constructor(name: keyof P, value?: P[keyof P]);
     /**
      * @param attributes A dictionary containing attributes and their values to be set on rendered elements.
      */
-    constructor(attributes: Record<string, string>);
+    constructor(attributes: P);
+
+    /**
+     * Applies custom attributes to element.
+     * @private It is used internally by mixins and is declared for type inference.
+     */
+    // @ts-ignore
+    getCustomAttributes(): P;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "brew-js-react",
-  "version": "0.6.7",
+  "version": "0.7.1",
   "description": "",
   "type": "module",
   "main": "index.js",
@@ -13,10 +13,10 @@
   "repository": "github:misonou/brew-js-react",
   "dependencies": {
     "@misonou/react-dom-client": "^1.1.1",
-    "brew-js": ">=0.6.12",
+    "brew-js": ">=0.7.1",
     "waterpipe": "^2.5.0",
-    "zeta-dom": ">=0.5.11",
-    "zeta-dom-react": ">=0.5.11"
+    "zeta-dom": ">=0.6.0",
+    "zeta-dom-react": ">=0.6.0"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
@@ -28,13 +28,12 @@
     "@babel/preset-react": "^7.16.7",
     "@jest/globals": "^26.6.2",
     "@misonou/build-utils": "^1.3.1",
-    "@misonou/test-utils": "^1.0.3",
+    "@misonou/test-utils": "^1.4.3",
     "@testing-library/dom": "^8.11.3",
     "@testing-library/react": "^12.1.2",
     "@testing-library/react-hooks": "^7.0.2",
     "@types/jest": "^26.0.15",
     "babel-loader": "^9.1.3",
-    "check-dts": "^0.8.2",
     "cross-env": "^7.0.2",
     "expect-type": "^0.20.0",
     "jest": "^27.0.6",

package/view.d.ts

@@ -98,7 +98,14 @@ export class ViewContext implements Zeta.ZetaEventDispatcher<ViewContextEventMap
      * @param event Name of the event.
      * @param handler A callback function to be fired when the specified event is triggered.
      */
-    on<E extends keyof ViewContextEventMap>(event: E, handler: Zeta.ZetaEventHandler<E, ViewContextEventMap, ViewContext>): Zeta.UnregisterCallback;
+    on<E extends Zeta.StringKeyOf<ViewContextEventMap>>(event: E, handler: Zeta.ZetaEventHandler<E, ViewContextEventMap, ViewContext>): Zeta.UnregisterCallback;
+
+    /**
+     * Adds an event handler to a specific event.
+     * @param event Name of the event.
+     * @param handler A callback function to be fired when the specified event is triggered.
+     */
+    on<E extends Zeta.HintedStringKeyOf<ViewContextEventMap>>(event: E, handler: Zeta.ZetaEventHandler<Zeta.WhitespaceDelimited<E>, ViewContextEventMap, ViewContext>): Zeta.UnregisterCallback;
 }
 
 export interface ViewProps<S = {}> {

package/view.js

@@ -105,11 +105,13 @@ definePrototype(ErrorBoundary, Component, {
         var context = self.props.context;
         if (!context.container) {
             setImmediate(function () {
-                extend(self, createAsyncScope(context.container));
-                dom.on(context.container, 'error', function (e) {
-                    return emitter.emit(e, context, { error: e.error }, false);
-                });
-                self.forceUpdate();
+                if (!self.errorHandler) {
+                    extend(self, createAsyncScope(context.container));
+                    dom.on(context.container, 'error', function (e) {
+                        return emitter.emit(e, context, { error: e.error }, false);
+                    });
+                    self.forceUpdate();
+                }
             });
             return null;
         }
@@ -312,7 +314,7 @@ function createViewComponent(factory) {
     }
     return function fn(props) {
         var children = promise || factory(props.viewProps);
-        if (isThenable(children)) {
+        if (promise || isThenable(children)) {
             promise = children;
             catchAsync(promise);
         } else {
@@ -320,8 +322,8 @@ function createViewComponent(factory) {
             return children;
         }
         var component = useAsync(function () {
-            return promise.then(null, function (error) {
-                promise = null;
+            promise = true;
+            return (isThenable(children) || factory()).then(null, function (error) {
                 props.onError(error);
             });
         })[0];