@cleanweb/oore 2.0.0-alpha.14 → 2.0.0-alpha.16

package/build/base/index.js

@@ -1,19 +1,3 @@
-"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("./state"), exports);
-__exportStar(require("./methods"), exports);
-__exportStar(require("./merged-state"), exports);
+export * from './state';
+export * from './methods';
+export * from './merged-state';

package/build/base/merged-state.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -10,10 +9,8 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMergedState = void 0;
-require("../globals");
-var react_1 = require("react");
+import '../globals';
+import { useMemo, useRef, useState } from 'react';
 var MergedState = /** @class */ (function () {
     function MergedState(initialState) {
         var _this = this;
@@ -52,7 +49,7 @@ var MergedState = /** @class */ (function () {
     }
     MergedState.useRefresh = function () {
         var _a;
-        _a = (0, react_1.useState)(this.initialState), this._values_ = _a[0], this.setState = _a[1];
+        _a = useState(this.initialState), this._values_ = _a[0], this.setState = _a[1];
     };
     Object.defineProperty(MergedState.prototype, "put", {
         get: function () {
@@ -74,11 +71,10 @@ var MergedState = /** @class */ (function () {
  * Similar to {@link useCleanState},
  * but uses a single `useState` call for the entire state object.
  */
-var useMergedState = function (initialState) {
-    var cleanState = (0, react_1.useRef)((0, react_1.useMemo)(function () {
+export var useMergedState = function (initialState) {
+    var cleanState = useRef(useMemo(function () {
         return new MergedState(initialState);
     }, [])).current;
     MergedState.useRefresh.call(cleanState);
     return cleanState;
 };
-exports.useMergedState = useMergedState;

package/build/base/methods.d.ts

@@ -1,7 +1,6 @@
 /**
  * @module ComponentMethods
  */
-import type { TCleanState, TStateData } from './state';
 /**
  * @summary
  * Base class for a class that holds methods for a function component.
@@ -12,9 +11,9 @@ import type { TCleanState, TStateData } from './state';
  *
  * Call the {@link useMethods} hook inside your function component to instantiate the class.
  */
-export declare class ComponentMethods<TProps extends object = {}, TState extends TStateData | null = null> {
+export declare class ComponentMethods<TProps extends object = {}, TState extends object | null = null> {
     readonly props: TProps;
-    readonly state: TState extends TStateData ? TCleanState<TState> : null;
+    readonly state: TState;
     /**
      * Persist class members during HMR. {@include ../classy/logic/hrm-preserve-keys.md}
      * @privateRemarks

package/build/base/methods.js

@@ -1,11 +1,8 @@
-"use strict";
 /**
  * @module ComponentMethods
  */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMethods = exports.ComponentMethods = void 0;
 // Values
-var react_1 = require("react");
+import { useMemo, useRef } from 'react';
 /**
  * @summary
  * Base class for a class that holds methods for a function component.
@@ -27,7 +24,7 @@ var ComponentMethods = /** @class */ (function () {
     }
     return ComponentMethods;
 }());
-exports.ComponentMethods = ComponentMethods;
+export { ComponentMethods };
 ;
 /**
  * Returns an instance of the provided class,
@@ -49,8 +46,8 @@ var useMethods = function () {
     // In production, we only use the latestInstance the first time, and it's ignored every other time.
     // This means changing the class at runtime will have no effect in production.
     // latestInstance is only extracted into a separate variable for use in dev mode during HMR.
-    var latestInstance = (0, react_1.useMemo)(function () { return new Methods(); }, [Methods]);
-    var instanceRef = (0, react_1.useRef)(latestInstance);
+    var latestInstance = useMemo(function () { return new Methods(); }, [Methods]);
+    var instanceRef = useRef(latestInstance);
     var refreshState = function () {
         // @ts-expect-error
         instanceRef.current.props = props;
@@ -81,7 +78,7 @@ var useMethods = function () {
         refreshState();
     return instanceRef.current;
 };
-exports.useMethods = useMethods;
+export { useMethods };
 /** /type_testing: {
     let a = async () => {
         const a: object = {b: ''};

package/build/base/state/class-types.js

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

package/build/base/state/class.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -10,9 +9,7 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CleanState = exports.CleanStateBase = void 0;
-var react_1 = require("react");
+import { useState } from 'react';
 /** @internal */
 var CleanStateBase = /** @class */ (function () {
     function CleanStateBase(initialState) {
@@ -121,7 +118,7 @@ var CleanStateBase = /** @class */ (function () {
     });
     CleanStateBase.update = function update() {
         var _this = this;
-        if (!(this instanceof exports.CleanState))
+        if (!(this instanceof CleanState))
             throw new Error('CleanState.update must be called with `this` value set to a CleanState instance. Did you forget to use `.call` or `.apply`? Example: CleanState.update.call(cleanState);');
         /**
          * Linters complain about the use of a React hook within a loop because:
@@ -132,7 +129,7 @@ var CleanStateBase = /** @class */ (function () {
          * and it guarantees that the same useState calls will be made on every render in the exact same order.
          * Therefore, it is safe to silence the linters, and required for this implementation to work smoothly.
          */
-        var retrieveState = react_1.useState;
+        var retrieveState = useState;
         this.valueKeys.forEach(function (key) {
             var _a;
             // @todo Make state updates accessible immediately. Use state.staged to access the scheduled updates.
@@ -146,7 +143,7 @@ var CleanStateBase = /** @class */ (function () {
     };
     return CleanStateBase;
 }());
-exports.CleanStateBase = CleanStateBase;
+export { CleanStateBase };
 ;
 /** @internal */
-exports.CleanState = (CleanStateBase);
+export var CleanState = (CleanStateBase);

package/build/base/state/hook-types.js

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

package/build/base/state/hooks.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useCleanState = void 0;
-var react_1 = require("react");
-var class_1 = require("./class");
+import { useMemo, useRef } from 'react';
+import { CleanState } from './class';
 /**
  * Creates a state object, which includes the provided values,
  * as well as helper methods for updating those values and automatically
@@ -13,22 +10,21 @@ var class_1 = require("./class");
  *
  * Discussion: [When to `useCleanState`](https://cleanjsweb.github.io/neat-react/documents/Clean_State.html).
  */
-var useCleanState = function (_initialState) {
+export var useCleanState = function (_initialState) {
     var props = [];
     for (var _i = 1; _i < arguments.length; _i++) {
         props[_i - 1] = arguments[_i];
     }
     var initialState = typeof _initialState === 'function'
-        ? (0, react_1.useMemo)(function () { return _initialState.apply(void 0, props); }, [])
+        ? useMemo(function () { return _initialState.apply(void 0, props); }, [])
         : _initialState;
     ;
-    var cleanState = (0, react_1.useRef)((0, react_1.useMemo)(function () {
-        return new class_1.CleanState(initialState);
+    var cleanState = useRef(useMemo(function () {
+        return new CleanState(initialState);
     }, [])).current;
-    class_1.CleanState.update.call(cleanState);
+    CleanState.update.call(cleanState);
     return cleanState;
 };
-exports.useCleanState = useCleanState;
 // Should be valid.
 // useCleanState((a: number) => ({b: a.toString(), q: 1}), 6);
 // useCleanState((a: boolean) => ({b: a.toString()}), true);

package/build/base/state/index.js

@@ -1,35 +1,7 @@
-"use strict";
 /**
  * @module CleanState
  */
-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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MergedState = exports.useCleanState = exports.CleanState = void 0;
-require("../../globals");
-var class_1 = require("./class");
-Object.defineProperty(exports, "CleanState", { enumerable: true, get: function () { return class_1.CleanState; } });
-var hooks_1 = require("./hooks");
-Object.defineProperty(exports, "useCleanState", { enumerable: true, get: function () { return hooks_1.useCleanState; } });
-exports.MergedState = __importStar(require("../../base/merged-state"));
+import '../../globals';
+export { CleanState } from './class';
+export { useCleanState } from './hooks';
+export * as MergedState from '../../base/merged-state';

package/build/classy/class/index.d.ts

@@ -1,3 +1,4 @@
+import type React from 'react';
 import type { TPropsBase } from '../logic';
 import type { Extractor } from './types/extractor';
 import { ComponentInstance } from '../instance';
@@ -65,6 +66,14 @@ export declare class ClassComponent<TProps extends TPropsBase = null> extends Co
      * Note that the callback argument is currently not supported.
      */
     readonly forceUpdate: VoidFunction;
+    /**
+     * A standard React function component that works like any
+     * other function component and can be rendered as JSX.
+     * \`<MyComponent.FC />\`
+     */
+    static _FC<T extends typeof ClassComponent>(this: T, props: InstanceType<T>['props']): JSX.Element | null;
+    static _BoundFC: typeof this._FC | undefined;
+    static get FC(): typeof ClassComponent._FC;
     /*************************************
      *   Function Component Extractor    *
     **************************************/
@@ -92,8 +101,12 @@ export declare class ClassComponent<TProps extends TPropsBase = null> extends Co
      * export default Button.RC;
      */
     static readonly extract: Extractor;
-    /** @see {@link ClassComponent.extract} */
-    static readonly FC: Extractor;
+    /**
+     * A standard React function component that works like any
+     * other function component and can be rendered as JSX.
+     * \`<MyComponent.RC />\`
+     */
+    static readonly RC: React.VoidFunctionComponent<object | EmptyObject>;
 }
 export { ClassComponent as Component };
 /** /

package/build/classy/class/index.js

@@ -1,4 +1,3 @@
-"use strict";
 var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -14,12 +13,10 @@ var __extends = (this && this.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Component = exports.ClassComponent = void 0;
-var react_1 = require("react");
-var instance_1 = require("../instance");
-var function_name_1 = require("./utils/function-name");
-var rerender_1 = require("../../helpers/rerender");
+import { useMemo } from 'react';
+import { ComponentInstance, useInstance } from '../instance';
+import { setFunctionName } from './utils/function-name';
+import { useRerender } from '../../helpers/rerender';
 /**
  * @summary
  * A modern class component for React that is fully compatible with
@@ -80,8 +77,40 @@ var ClassComponent = /** @class */ (function (_super) {
         _this.template = function () { return null; };
         return _this;
     }
+    /**
+     * A standard React function component that works like any
+     * other function component and can be rendered as JSX.
+     * \`<MyComponent.FC />\`
+     */
+    ClassComponent._FC = function (props) {
+        var _this = this;
+        var instance = useInstance(this, props);
+        var template = instance.template, templateContext = instance.templateContext;
+        var _forceUpdate;
+        // @ts-expect-error (Cannot assign to 'forceUpdate' because it is a read-only property.ts(2540))
+        instance.forceUpdate = (_forceUpdate = useRerender() // Moved this to separate line to allow TS errors. Use proxy local variable to regain some type checking for the assignment to `instance.forceUpdate`.
+        );
+        // Add calling component name to template function name in stack traces.
+        useMemo(function () {
+            setFunctionName(template, "".concat(_this.name, ".template"));
+        }, [template]);
+        return template(templateContext);
+    };
+    ;
+    Object.defineProperty(ClassComponent, "FC", {
+        get: function () {
+            if (this._BoundFC)
+                return this._BoundFC;
+            return this._BoundFC = this._FC.bind(this);
+        },
+        enumerable: false,
+        configurable: true
+    });
     var _a;
     _a = ClassComponent;
+    (function () {
+        setFunctionName(_a._FC, "$".concat(_a.name, "$"));
+    })();
     /*************************************
      *   Function Component Extractor    *
     **************************************/
@@ -118,30 +147,34 @@ var ClassComponent = /** @class */ (function (_super) {
         **************************************/
         /** A class-based, React function component created with `@cleanweb/oore`. {@link ClassComponent} */
         var Wrapper = function (props) {
-            var instance = (0, instance_1.useInstance)(Component, props);
+            var instance = useInstance(Component, props);
             var template = instance.template, templateContext = instance.templateContext;
             var _forceUpdate;
             // @ts-expect-error (Cannot assign to 'forceUpdate' because it is a read-only property.ts(2540))
-            instance.forceUpdate = (_forceUpdate = (0, rerender_1.useRerender)() // Moved this to separate line to allow TS errors. Use proxy local variable to regain some type checking for the assignment to `instance.forceUpdate`.
+            instance.forceUpdate = (_forceUpdate = useRerender() // Moved this to separate line to allow TS errors. Use proxy local variable to regain some type checking for the assignment to `instance.forceUpdate`.
             );
             // Add calling component name to template function name in stack traces.
-            (0, react_1.useMemo)(function () {
-                (0, function_name_1.setFunctionName)(template, "".concat(Component.name, ".template"));
+            useMemo(function () {
+                setFunctionName(template, "".concat(Component.name, ".template"));
             }, [template]);
             return template(templateContext);
         };
         /**************************************
         *   👆🏼 End Function Component         *
         **************************************/
-        (0, function_name_1.setFunctionName)(Wrapper, "$".concat(Component.name, "$"));
+        setFunctionName(Wrapper, "$".concat(Component.name, "$"));
         return Object.assign(Wrapper, properties);
     };
-    /** @see {@link ClassComponent.extract} */
-    ClassComponent.FC = _a.extract;
+    /**
+     * A standard React function component that works like any
+     * other function component and can be rendered as JSX.
+     * \`<MyComponent.RC />\`
+     */
+    ClassComponent.RC = _a.extract();
     return ClassComponent;
-}(instance_1.ComponentInstance));
-exports.ClassComponent = ClassComponent;
-exports.Component = ClassComponent;
+}(ComponentInstance));
+export { ClassComponent };
+export { ClassComponent as Component };
 /** /
 testing: {
     const a: object = {b: ''};

package/build/classy/class/types/extractor.js

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

package/build/classy/class/utils/function-name.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.setFunctionName = void 0;
 /** Provide more useful stack traces for otherwise non-specific function names. */
-var setFunctionName = function (func, newName) {
+export var setFunctionName = function (func, newName) {
     try {
         // Must use try block, as `name` is not configurable on older browsers, and may yield a TypeError.
         Object.defineProperty(func, 'name', {
@@ -14,4 +11,3 @@ var setFunctionName = function (func, newName) {
         console.warn(error);
     }
 };
-exports.setFunctionName = setFunctionName;

package/build/classy/index.js

@@ -1,19 +1,3 @@
-"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("./logic"), exports);
-__exportStar(require("./instance"), exports);
-__exportStar(require("./class"), exports);
+export * from './logic';
+export * from './instance';
+export * from './class';

package/build/classy/instance/index.d.ts

@@ -1,7 +1,7 @@
 import type { UseInstance } from './types/hook';
 import type { TPropsBase } from '../../classy/logic';
 import { ComponentLogic } from '../../classy/logic';
-type AsyncAllowedEffectCallback = () => Awaitable<IVoidFunction>;
+type AsyncAllowedEffectCallback = () => Awaitable<IVoidFunction | void>;
 /**
  * A superset of {@link ComponentLogic} that adds support for lifecycle methods.
  * This provides a declarative API for working with your React function component's lifecycle,
@@ -86,7 +86,7 @@ export declare class ComponentInstance<TProps extends TPropsBase = null> extends
      * PS: You can conditionally update state from here, but with certain caveats.
      * {@link https://react.dev/reference/react/useState#storing-information-from-previous-renders | See the React docs for details}.
      */
-    beforeRender: () => object | void;
+    beforeRender: () => any;
     /**
      * Runs **_after_** every render cycle, including the first.
      *

package/build/classy/instance/index.js

@@ -1,4 +1,3 @@
-"use strict";
 var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -14,12 +13,10 @@ var __extends = (this && this.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useInstance = exports.ComponentInstance = void 0;
-var react_1 = require("react");
-var logic_1 = require("../../classy/logic");
-var mount_callbacks_1 = require("./mount-callbacks");
-var helpers_1 = require("../../helpers");
+import { useEffect } from 'react';
+import { ComponentLogic, useLogic } from '../../classy/logic';
+import { useMountCallbacks } from './mount-callbacks';
+import { noOp } from '../../helpers';
 /**
  * A superset of {@link ComponentLogic} that adds support for lifecycle methods.
  * This provides a declarative API for working with your React function component's lifecycle,
@@ -53,7 +50,7 @@ var ComponentInstance = /** @class */ (function (_super) {
          *
          * Uses `useEffect()` under the hood.
          */
-        _this.onMount = function () { return helpers_1.noOp; };
+        _this.onMount = function () { return noOp; };
         /**
          * Runs _before_ every render cycle, including the first.
          * Useful for logic that is involved in determining what to render.
@@ -69,7 +66,7 @@ var ComponentInstance = /** @class */ (function (_super) {
          * PS: You can conditionally update state from here, but with certain caveats.
          * {@link https://react.dev/reference/react/useState#storing-information-from-previous-renders | See the React docs for details}.
          */
-        _this.beforeRender = function () { };
+        _this.beforeRender = function () { return ({}); };
         /**
          * Runs **_after_** every render cycle, including the first.
          *
@@ -80,7 +77,7 @@ var ComponentInstance = /** @class */ (function (_super) {
          *
          * @returns A cleanup function.
          */
-        _this.onRender = function () { return helpers_1.noOp; };
+        _this.onRender = function () { return noOp; };
         /**
          * Runs when the component is unmounted.
          * It is called _after_ the cleanup function returned by onMount.
@@ -128,8 +125,8 @@ var ComponentInstance = /** @class */ (function (_super) {
         configurable: true
     });
     return ComponentInstance;
-}(logic_1.ComponentLogic));
-exports.ComponentInstance = ComponentInstance;
+}(ComponentLogic));
+export { ComponentInstance };
 ;
 /**
  * Enables full separation of concerns between a React component's template
@@ -144,7 +141,7 @@ exports.ComponentInstance = ComponentInstance;
  *
  * The provided class should be a subclass of {@link ComponentInstance}.
  */
-var useInstance = function () {
+export var useInstance = function () {
     var _a;
     var args = [];
     for (var _i = 0; _i < arguments.length; _i++) {
@@ -152,9 +149,9 @@ var useInstance = function () {
     }
     var Component = args[0], _b = args[1], props = _b === void 0 ? {} : _b;
     // useHooks.
-    var instance = (0, logic_1.useLogic)(Component, props);
+    var instance = useLogic(Component, props);
     // beforeMount, onMount, cleanUp.
-    (0, mount_callbacks_1.useMountCallbacks)(instance);
+    useMountCallbacks(instance);
     // beforeRender.
     /**
      * A proxy variable to allow typechecking of the assignment
@@ -164,7 +161,7 @@ var useInstance = function () {
     // @ts-expect-error Assigning to a readonly property.
     instance._templateContext = (_templateContextProxy_ = (_a = instance.beforeRender) === null || _a === void 0 ? void 0 : _a.call(instance));
     // onRender.
-    (0, react_1.useEffect)(function () {
+    useEffect(function () {
         var _a;
         var cleanupAfterRerender = (_a = instance.onRender) === null || _a === void 0 ? void 0 : _a.call(instance);
         return function () {
@@ -174,9 +171,9 @@ var useInstance = function () {
                 cleanupAfterRerender === null || cleanupAfterRerender === void 0 ? void 0 : cleanupAfterRerender.then(function (cleanUp) { return cleanUp === null || cleanUp === void 0 ? void 0 : cleanUp(); });
         };
     });
+    // class FormValues<TValues> extends BrowserMemStore<TValues> {}
     return instance;
 };
-exports.useInstance = useInstance;
 /** /
 testing: {
     class A extends ComponentInstance<EmptyObject> {

package/build/classy/instance/mount-callbacks.js

@@ -1,15 +1,12 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMountCallbacks = void 0;
-var react_1 = require("react");
-var mount_state_1 = require("../../helpers/mount-state");
+import { useEffect } from 'react';
+import { useMountState } from '../../helpers/mount-state';
 /** @internal */
-var useMountCallbacks = function (instance) {
+export var useMountCallbacks = function (instance) {
     var _a;
-    var isMounted = (0, mount_state_1.useMountState)();
+    var isMounted = useMountState();
     if (!isMounted())
         (_a = instance.beforeMount) === null || _a === void 0 ? void 0 : _a.call(instance);
-    (0, react_1.useEffect)(function () {
+    useEffect(function () {
         var _a;
         var mountHandlerCleanUp = (_a = instance.onMount) === null || _a === void 0 ? void 0 : _a.call(instance);
         return function () {
@@ -27,4 +24,3 @@ var useMountCallbacks = function (instance) {
         };
     }, []);
 };
-exports.useMountCallbacks = useMountCallbacks;

package/build/classy/instance/types/hook.js

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

package/build/classy/logic/index.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useLogic = exports.ComponentLogic = void 0;
-var react_1 = require("react");
-var state_1 = require("../../base/state");
+import { useMemo, useRef } from 'react';
+import { useCleanState } from '../../base/state';
 /**
  * Base class for a class that holds methods to be used in a function component.
  *
@@ -42,7 +39,7 @@ var ComponentLogic = /** @class */ (function () {
     }
     return ComponentLogic;
 }());
-exports.ComponentLogic = ComponentLogic;
+export { ComponentLogic };
 ;
 /**
  * Returns an instance of the provided class, which holds methods for your component and
@@ -52,7 +49,7 @@ exports.ComponentLogic = ComponentLogic;
  *
  * @see https://cleanjsweb.github.io/neat-react/functions/API.useLogic.html
  */
-var useLogic = function () {
+export var useLogic = function () {
     var _a;
     var args = [];
     for (var _i = 0; _i < arguments.length; _i++) {
@@ -62,15 +59,15 @@ var useLogic = function () {
     // In production, we only use the latestInstance the first time, and it's ignored every other time.
     // This means changing the class at runtime will have no effect in production.
     // latestInstance is only extracted into a separate variable for use in dev mode during HMR.
-    var latestInstance = (0, react_1.useMemo)(function () { return new Logic(); }, [Logic]);
+    var latestInstance = useMemo(function () { return new Logic(); }, [Logic]);
     // const latestInstance = useMemo(() => new Logic(), []);
-    var instanceRef = (0, react_1.useRef)(latestInstance);
+    var instanceRef = useRef(latestInstance);
     var refreshState = function () {
         var _a;
         // @ts-expect-error
         instanceRef.current.props = props;
         // @ts-expect-error
-        instanceRef.current.state = (0, state_1.useCleanState)(instanceRef.current.getInitialState, props);
+        instanceRef.current.state = useCleanState(instanceRef.current.getInitialState, props);
         // @ts-expect-error
         instanceRef.current.hooks = (_a = instanceRef.current.useHooks()) !== null && _a !== void 0 ? _a : {};
     };
@@ -95,7 +92,6 @@ var useLogic = function () {
     return instanceRef.current;
     ;
 };
-exports.useLogic = useLogic;
 /** /
 testing: {
     const a: object = {b: ''};

package/build/classy/logic/types/hook.js

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

package/build/docs-src/api/base-classes.js

@@ -1,9 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ComponentInstance = exports.ComponentLogic = exports.ComponentMethods = void 0;
-var methods_1 = require("../../base/methods");
-Object.defineProperty(exports, "ComponentMethods", { enumerable: true, get: function () { return methods_1.ComponentMethods; } });
-var logic_1 = require("../../classy/logic");
-Object.defineProperty(exports, "ComponentLogic", { enumerable: true, get: function () { return logic_1.ComponentLogic; } });
-var instance_1 = require("../../classy/instance");
-Object.defineProperty(exports, "ComponentInstance", { enumerable: true, get: function () { return instance_1.ComponentInstance; } });
+export { ComponentMethods } from '../../base/methods';
+export { ComponentLogic } from '../../classy/logic';
+export { ComponentInstance } from '../../classy/instance';

package/build/docs-src/api/index.js

@@ -1,44 +1,13 @@
-"use strict";
 /**
  * API Reference
  * @module API
  */
-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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.References = exports.Helpers = exports.BaseClasses = exports.ClassComponent = exports.useInstance = exports.useLogic = exports.useMethods = exports.useCleanState = void 0;
-var state_1 = require("../../base/state");
-Object.defineProperty(exports, "useCleanState", { enumerable: true, get: function () { return state_1.useCleanState; } });
-var methods_1 = require("../../base/methods");
-Object.defineProperty(exports, "useMethods", { enumerable: true, get: function () { return methods_1.useMethods; } });
-var logic_1 = require("../../classy/logic");
-Object.defineProperty(exports, "useLogic", { enumerable: true, get: function () { return logic_1.useLogic; } });
-var instance_1 = require("../../classy/instance");
-Object.defineProperty(exports, "useInstance", { enumerable: true, get: function () { return instance_1.useInstance; } });
-var class_1 = require("../../classy/class");
-Object.defineProperty(exports, "ClassComponent", { enumerable: true, get: function () { return class_1.ClassComponent; } });
+export { useCleanState } from '../../base/state';
+export { useMethods } from '../../base/methods';
+export { useLogic } from '../../classy/logic';
+export { useInstance } from '../../classy/instance';
+export { ClassComponent } from '../../classy/class';
 /** @namespace */
-exports.BaseClasses = __importStar(require("./base-classes"));
-exports.Helpers = __importStar(require("../../helpers"));
-exports.References = __importStar(require("./references"));
+export * as BaseClasses from './base-classes';
+export * as Helpers from '../../helpers';
+export * as References from './references';

package/build/docs-src/api/references.js

@@ -1,31 +1,5 @@
-"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ClassComponent = exports.ComponentInstance = exports.ComponentLogic = exports.$ComponentMethods = exports.$CleanState = void 0;
-exports.$CleanState = __importStar(require("../../base/state"));
-exports.$ComponentMethods = __importStar(require("../../base/methods"));
-exports.ComponentLogic = __importStar(require("../../classy/logic"));
-exports.ComponentInstance = __importStar(require("../../classy/instance"));
-exports.ClassComponent = __importStar(require("../../classy/class"));
+export * as $CleanState from '../../base/state';
+export * as $ComponentMethods from '../../base/methods';
+export * as ComponentLogic from '../../classy/logic';
+export * as ComponentInstance from '../../classy/instance';
+export * as ClassComponent from '../../classy/class';

package/build/globals.js

@@ -1,4 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
 /////////////
 var UniqueSecretSymbolKey = Symbol('asdfghjkliuytrewqaxcvb,nb');
+export {};

package/build/helpers/errors.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.throwDevError = void 0;
 /**
  * Throw an error with the provided message
  * only when `NODE_ENV` is *not* 'production'.
@@ -10,7 +7,7 @@ exports.throwDevError = void 0;
  * Useful for enforcing certain conditions in development
  * while failing more gracefully in production.
  */
-var throwDevError = function (message) {
+export var throwDevError = function (message) {
     if (process.env.NODE_ENV === 'production') {
         console.warn(message);
     }
@@ -18,4 +15,3 @@ var throwDevError = function (message) {
         throw new Error(message);
     }
 };
-exports.throwDevError = throwDevError;

package/build/helpers/index.js

@@ -1,31 +1,13 @@
-"use strict";
 /**
  * <!-- @ mergeModuleWith API -->
  * @module Helpers
  */
-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 });
-exports.noOp = void 0;
-__exportStar(require("./mount-state"), exports);
-__exportStar(require("./rerender"), exports);
-__exportStar(require("./use-component"), exports);
-__exportStar(require("./type-guards"), exports);
+export * from './mount-state';
+export * from './rerender';
+export * from './use-component';
+export * from './type-guards';
 /**
  * An empty function.
  * It returns (void) without performing any operations.
  */
-var noOp = function () { };
-exports.noOp = noOp;
+export var noOp = function () { };

package/build/helpers/mount-state.js

@@ -1,20 +1,17 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMountState = void 0;
-var react_1 = require("react");
+import { useEffect, useRef } from 'react';
 /**
  * Returns a value that is false before the component has been mounted,
  * then true during all subsequent rerenders.
  */
-var useMountState = function () {
+export var useMountState = function () {
     /**
      * This must not be a state value. It should not be the cause of a rerender.
      * It merely provides information about the render count,
      * without influencing that count itself.
      * So `mounted` should never be created with `useState`.
      */
-    var mounted = (0, react_1.useRef)(false);
-    (0, react_1.useEffect)(function () {
+    var mounted = useRef(false);
+    useEffect(function () {
         mounted.current = true;
         return function () {
             mounted.current = false;
@@ -22,4 +19,3 @@ var useMountState = function () {
     }, []);
     return function () { return mounted.current; };
 };
-exports.useMountState = useMountState;

package/build/helpers/rerender.js

@@ -1,19 +1,16 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useRerender = void 0;
-var react_1 = require("react");
-var mount_state_1 = require("../helpers/mount-state");
+import { useCallback, useRef, useState } from 'react';
+import { useMountState } from '../helpers/mount-state';
 ;
 /**
  * Returns a function that can be called to manually trigger
  * a rerender of your component.
  */
-var useRerender = function () {
-    var isMounted = (0, mount_state_1.useMountState)();
-    var renderCount = (0, react_1.useRef)(0);
-    var _a = (0, react_1.useState)(renderCount.current), forceRerender = _a[1];
+export var useRerender = function () {
+    var isMounted = useMountState();
+    var renderCount = useRef(0);
+    var _a = useState(renderCount.current), forceRerender = _a[1];
     renderCount.current++;
-    var rerender = (0, react_1.useCallback)(function () {
+    var rerender = useCallback(function () {
         var resolve;
         var promise = new Promise(function (_r) { return resolve = _r; });
         var execute = function () {
@@ -39,4 +36,3 @@ var useRerender = function () {
     refresher.currentCount = renderCount.current;
     return refresher;
 };
-exports.useRerender = useRerender;

package/build/helpers/type-guards.js

@@ -1,8 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.canIndex = void 0;
-var canIndex = function (key, targetObject) {
+export var canIndex = function (key, targetObject) {
     var test = typeof key === 'number' ? "".concat(key) : key;
     return Reflect.ownKeys(targetObject).includes(test);
 };
-exports.canIndex = canIndex;

package/build/helpers/use-component/index.js

@@ -1,17 +1,13 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Use = void 0;
-var react_1 = require("react");
+import { useEffect } from 'react';
 /**
  * A component you can use to consume React hooks
  * in a {@link Component | React.Component} class.
  */
-var Use = function (params) {
+export var Use = function (params) {
     var useGenericHook = params.hook, argumentsList = params.argumentsList, onUpdate = params.onUpdate;
     var output = useGenericHook.apply(void 0, argumentsList);
-    (0, react_1.useEffect)(function () {
+    useEffect(function () {
         onUpdate(output);
     }, [output]);
     return null;
 };
-exports.Use = Use;

package/build/helpers/use-component/types.js

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

package/build/index.js

@@ -1,19 +1,3 @@
-"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("./classy"), exports);
-__exportStar(require("./base"), exports);
-__exportStar(require("./helpers"), exports);
+export * from './classy';
+export * from './base';
+export * from './helpers';

package/build/slots/hook.js

@@ -1,27 +1,3 @@
-"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
         if (ar || !(i in from)) {
@@ -31,18 +7,15 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     }
     return to.concat(ar || Array.prototype.slice.call(from));
 };
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useSlots = exports.isPortalChild = exports.getComponentSlotName = exports.isElementChild = void 0;
-var errors_1 = require("../helpers/errors");
-var react_1 = __importStar(require("react"));
-var isElementChild = function (child) {
+import { throwDevError } from '../helpers/errors';
+import React, { useMemo } from 'react';
+export var isElementChild = function (child) {
     if (child && typeof child === 'object' && 'type' in child) {
         return true;
     }
     return false;
 };
-exports.isElementChild = isElementChild;
-var getComponentSlotName = function (TargetComponent, child) {
+export var getComponentSlotName = function (TargetComponent, child) {
     if (child) {
         var keyTypes = ['string', 'number', 'symbol'];
         var slotName = child.props['data-slot-name'];
@@ -61,13 +34,11 @@ var getComponentSlotName = function (TargetComponent, child) {
     }
     return undefined;
 };
-exports.getComponentSlotName = getComponentSlotName;
-var isPortalChild = function (child) {
+export var isPortalChild = function (child) {
     return (!!child
         && typeof child === 'object'
         && 'children' in child);
 };
-exports.isPortalChild = isPortalChild;
 /**
  * Groups `children` prop into predefined slots.
  *
@@ -78,15 +49,15 @@ exports.isPortalChild = isPortalChild;
  *
  * @see {@link SlotComponent} for more on how to use the returned slot nodes.
  */
-var useSlots = function (children, Caller) {
-    var slotsAliasLookup = (0, react_1.useMemo)(function () {
+export var useSlots = function (children, Caller) {
+    var slotsAliasLookup = useMemo(function () {
         var entries = Object.entries(Caller.Slots);
         var aliasLookup = {};
         entries.forEach(function (_a) {
             var alias = _a[0], RegisteredSlotComponent = _a[1];
-            var slotName = (0, exports.getComponentSlotName)(RegisteredSlotComponent);
+            var slotName = getComponentSlotName(RegisteredSlotComponent);
             if (!slotName) {
-                (0, errors_1.throwDevError)("A registered slot component did not have a slot name. All components registered as slots must either be a string tag-name or a React component with either \"slotName\" or \"displayName\". The affected component was: ".concat(RegisteredSlotComponent));
+                throwDevError("A registered slot component did not have a slot name. All components registered as slots must either be a string tag-name or a React component with either \"slotName\" or \"displayName\". The affected component was: ".concat(RegisteredSlotComponent));
                 return;
             }
             aliasLookup[slotName] = alias;
@@ -94,33 +65,33 @@ var useSlots = function (children, Caller) {
         return aliasLookup;
     }, [Caller.Slots]);
     // @todo Expose original source order of `children` with respect to slot aliases.
-    var result = (0, react_1.useMemo)(function () {
+    var result = useMemo(function () {
         var _a;
         var slotNodes = {};
         var unmatchedChildren = [];
         var invalidChildren = [];
         var requiredSlotAliases = __spreadArray([], ((_a = Caller.requiredSlotAliases) !== null && _a !== void 0 ? _a : []), true);
-        react_1.default.Children.forEach(children, function (_child) {
+        React.Children.forEach(children, function (_child) {
             var _a;
             var child = _child;
             if (!child) {
                 invalidChildren.push(child);
                 return;
             }
-            if (!react_1.default.isValidElement(child)) {
+            if (!React.isValidElement(child)) {
                 console.warn("Invalid node found in JSX children while parsing slots. Got: \"".concat(child, "\"."));
                 invalidChildren.push(child);
                 return;
             }
             ;
             // @todo Check for fragment
-            if (!(0, exports.isElementChild)(child)) {
+            if (!isElementChild(child)) {
                 unmatchedChildren.push(child);
                 return;
             }
             var slotAlias = (function () {
                 var _a;
-                var slotName = (0, exports.getComponentSlotName)(child.type, child);
+                var slotName = getComponentSlotName(child.type, child);
                 return slotName ? (_a = slotsAliasLookup[slotName]) !== null && _a !== void 0 ? _a : null : null;
             })();
             if (slotAlias) {
@@ -141,11 +112,10 @@ var useSlots = function (children, Caller) {
         });
         requiredSlotAliases.forEach(function (slotAlias) {
             if (!slotNodes[slotAlias]) {
-                (0, errors_1.throwDevError)("Missing required slot \"".concat(String(slotAlias), "\"."));
+                throwDevError("Missing required slot \"".concat(String(slotAlias), "\"."));
             }
         });
         return [slotNodes, unmatchedChildren, invalidChildren];
     }, [children]);
     return result;
 };
-exports.useSlots = useSlots;

package/build/slots/index.js

@@ -1,17 +1 @@
-"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("./hook"), exports);
+export * from './hook';

package/build/slots/types.js

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

package/build/tsconfig.json

@@ -23,8 +23,8 @@
 		"forceConsistentCasingInFileNames": true,
 		"incremental": false,
 		"esModuleInterop": true,
-		"module": "NodeNext",
-		"moduleResolution": "NodeNext",
+		"module": "esnext",
+		"moduleResolution": "bundler",
 		"resolveJsonModule": true,
 		"isolatedModules": true,
 		"jsx": "react-jsx",

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@cleanweb/oore",
-	"version": "2.0.0-alpha.14",
+	"version": "2.0.0-alpha.16",
 	"description": "A library of helpers for writing cleaner React function components with object-oriented patterns.",
 	"engines": {
 		"node": ">=22"
@@ -10,6 +10,7 @@
 		".npmrc"
 	],
 	"main": "build/index.js",
+	"type": "module",
 	"exports": {
 		".": "./build/classy/index.js",
 		"./base": "./build/base/index.js",