@cleanweb/oore 2.0.0-alpha.21 → 2.0.0-alpha.23

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.
  */
-const throwDevError = (message) => {
+export const throwDevError = (message) => {
     if (process.env.NODE_ENV === 'production') {
         console.warn(message);
     }
@@ -18,4 +15,3 @@ const throwDevError = (message) => {
         throw new Error(message);
     }
 };
-exports.throwDevError = throwDevError;

package/build/helpers/index.d.ts

@@ -2,10 +2,10 @@
  * <!-- @ mergeModuleWith API -->
  * @module Helpers
  */
-export * from './mount-state';
-export * from './rerender';
-export * from './use-component';
-export * from './type-guards';
+export * from './mount-state.js';
+export * from './rerender.js';
+export * from './use-component/index.js';
+export * from './type-guards.js';
 /**
  * An empty function.
  * It returns (void) without performing any operations.

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.js';
+export * from './rerender.js';
+export * from './use-component/index.js';
+export * from './type-guards.js';
 /**
  * An empty function.
  * It returns (void) without performing any operations.
  */
-const noOp = () => { };
-exports.noOp = noOp;
+export const noOp = () => { };

package/build/helpers/mount-state.js

@@ -1,20 +1,17 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMountState = void 0;
-const 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.
  */
-const useMountState = () => {
+export const useMountState = () => {
     /**
      * 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`.
      */
-    const mounted = (0, react_1.useRef)(false);
-    (0, react_1.useEffect)(() => {
+    const mounted = useRef(false);
+    useEffect(() => {
         mounted.current = true;
         return () => {
             mounted.current = false;
@@ -22,4 +19,3 @@ const useMountState = () => {
     }, []);
     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;
-const react_1 = require("react");
-const mount_state_1 = require("../helpers/mount-state");
+import { useCallback, useRef, useState } from 'react';
+import { useMountState } from '../helpers/mount-state.js';
 ;
 /**
  * Returns a function that can be called to manually trigger
  * a rerender of your component.
  */
-const useRerender = () => {
-    const isMounted = (0, mount_state_1.useMountState)();
-    const renderCount = (0, react_1.useRef)(0);
-    const [, forceRerender] = (0, react_1.useState)(renderCount.current);
+export const useRerender = () => {
+    const isMounted = useMountState();
+    const renderCount = useRef(0);
+    const [, forceRerender] = useState(renderCount.current);
     renderCount.current++;
-    const rerender = (0, react_1.useCallback)(() => {
+    const rerender = useCallback(() => {
         let resolve;
         const promise = new Promise((_r) => resolve = _r);
         const execute = () => {
@@ -39,4 +36,3 @@ const useRerender = () => {
     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;
-const canIndex = (key, targetObject) => {
+export const canIndex = (key, targetObject) => {
     const test = typeof key === 'number' ? `${key}` : key;
     return Reflect.ownKeys(targetObject).includes(test);
 };
-exports.canIndex = canIndex;

package/build/helpers/use-component/index.d.ts

@@ -1,4 +1,4 @@
-import type { ClassComponentHookWrapper } from './types';
+import type { ClassComponentHookWrapper } from './types.js';
 /**
  * A component you can use to consume React hooks
  * in a {@link Component | React.Component} class.

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

@@ -1,17 +1,13 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Use = void 0;
-const react_1 = require("react");
+import { useEffect } from 'react';
 /**
  * A component you can use to consume React hooks
  * in a {@link Component | React.Component} class.
  */
-const Use = (params) => {
+export const Use = (params) => {
     const { hook: useGenericHook, argumentsList, onUpdate } = params;
     const output = useGenericHook(...argumentsList);
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         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.d.ts

@@ -1,3 +1,3 @@
-export * from './classy';
-export * from './base';
-export * from './helpers';
+export * from './classy/index.js';
+export * from './base/index.js';
+export * from './helpers/index.js';

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/index.js';
+export * from './base/index.js';
+export * from './helpers/index.js';

package/build/slots/hook.d.ts

@@ -1,5 +1,5 @@
 import type { ReactElement, ReactNode, ReactPortal } from 'react';
-import type { IUseSlots, PotentialSlotComponent } from './types';
+import type { IUseSlots, PotentialSlotComponent } from './types.js';
 export declare const isElementChild: (child: ReactNode) => child is ReactElement<any, any>;
 interface IGetSlotName {
     (TargetComponent: PotentialSlotComponent, child?: ReactElement): string | undefined;
@@ -17,4 +17,4 @@ export declare const isPortalChild: (child: ReactNode) => child is ReactPortal;
  * @see {@link SlotComponent} for more on how to use the returned slot nodes.
  */
 export declare const useSlots: IUseSlots;
-export type { SlottedComponent, TSlotsRecord, SlotComponent, PotentialSlotComponent, } from './types';
+export type { SlottedComponent, TSlotsRecord, SlotComponent, PotentialSlotComponent, } from './types.js';

package/build/slots/hook.js

@@ -1,39 +1,12 @@
-"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.useSlots = exports.isPortalChild = exports.getComponentSlotName = exports.isElementChild = void 0;
-const errors_1 = require("../helpers/errors");
-const react_1 = __importStar(require("react"));
-const isElementChild = (child) => {
+import { throwDevError } from '../helpers/errors.js';
+import React, { useMemo } from 'react';
+export const isElementChild = (child) => {
     if (child && typeof child === 'object' && 'type' in child) {
         return true;
     }
     return false;
 };
-exports.isElementChild = isElementChild;
-const getComponentSlotName = (TargetComponent, child) => {
+export const getComponentSlotName = (TargetComponent, child) => {
     if (child) {
         const keyTypes = ['string', 'number', 'symbol'];
         const slotName = child.props['data-slot-name'];
@@ -52,13 +25,11 @@ const getComponentSlotName = (TargetComponent, child) => {
     }
     return undefined;
 };
-exports.getComponentSlotName = getComponentSlotName;
-const isPortalChild = (child) => {
+export const isPortalChild = (child) => {
     return (!!child
         && typeof child === 'object'
         && 'children' in child);
 };
-exports.isPortalChild = isPortalChild;
 /**
  * Groups `children` prop into predefined slots.
  *
@@ -69,14 +40,14 @@ exports.isPortalChild = isPortalChild;
  *
  * @see {@link SlotComponent} for more on how to use the returned slot nodes.
  */
-const useSlots = (children, Caller) => {
-    const slotsAliasLookup = (0, react_1.useMemo)(() => {
+export const useSlots = (children, Caller) => {
+    const slotsAliasLookup = useMemo(() => {
         const entries = Object.entries(Caller.Slots);
         const aliasLookup = {};
         entries.forEach(([alias, RegisteredSlotComponent]) => {
-            const slotName = (0, exports.getComponentSlotName)(RegisteredSlotComponent);
+            const 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: ${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: ${RegisteredSlotComponent}`);
                 return;
             }
             aliasLookup[slotName] = alias;
@@ -84,7 +55,7 @@ const useSlots = (children, Caller) => {
         return aliasLookup;
     }, [Caller.Slots]);
     // @todo Expose original source order of `children` with respect to slot aliases.
-    const result = (0, react_1.useMemo)(() => {
+    const result = useMemo(() => {
         var _a;
         const slotNodes = {};
         const unmatchedChildren = [];
@@ -92,27 +63,27 @@ const useSlots = (children, Caller) => {
         const requiredSlotAliases = [
             ...((_a = Caller.requiredSlotAliases) !== null && _a !== void 0 ? _a : [])
         ];
-        react_1.default.Children.forEach(children, (_child) => {
+        React.Children.forEach(children, (_child) => {
             var _a;
             const 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: "${child}".`);
                 invalidChildren.push(child);
                 return;
             }
             ;
             // @todo Check for fragment
-            if (!(0, exports.isElementChild)(child)) {
+            if (!isElementChild(child)) {
                 unmatchedChildren.push(child);
                 return;
             }
             const slotAlias = (() => {
                 var _a;
-                const slotName = (0, exports.getComponentSlotName)(child.type, child);
+                const slotName = getComponentSlotName(child.type, child);
                 return slotName ? (_a = slotsAliasLookup[slotName]) !== null && _a !== void 0 ? _a : null : null;
             })();
             if (slotAlias) {
@@ -133,11 +104,10 @@ const useSlots = (children, Caller) => {
         });
         requiredSlotAliases.forEach((slotAlias) => {
             if (!slotNodes[slotAlias]) {
-                (0, errors_1.throwDevError)(`Missing required slot "${String(slotAlias)}".`);
+                throwDevError(`Missing required slot "${String(slotAlias)}".`);
             }
         });
         return [slotNodes, unmatchedChildren, invalidChildren];
     }, [children]);
     return result;
 };
-exports.useSlots = useSlots;

package/build/slots/index.d.ts

@@ -1 +1 @@
-export * from './hook';
+export * from './hook.js';

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.js';

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",
@@ -35,6 +35,10 @@
 		"strictBindCallApply": true,
 		"exactOptionalPropertyTypes": true,
 	},
+	"tsc-alias": {
+		"resolveFullPaths": true,
+		"resolveFullExtension": ".js" 
+	},
 	"include": [
 		"./globals.d.ts",
 		"**/*.ts",

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@cleanweb/oore",
-	"version": "2.0.0-alpha.21",
+	"version": "2.0.0-alpha.23",
 	"description": "A library of helpers for writing cleaner React function components with object-oriented patterns.",
 	"engines": {
 		"node": ">=22"