react-store-input 0.1.9 → 0.2.1

package/dist/create_render.d.mts

@@ -1,8 +1,9 @@
-import React__default, { ReactNode } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
 import { Store } from './use_store.mjs';
 
 type CreateRender<TState> = (selector: (state: TState) => ReactNode, compare?: (a: TState, b: TState) => boolean) => ReactNode;
-declare function createRender<TState>(store: Store<TState>, selector: (state: TState) => ReactNode, compare?: (a: TState, b: TState) => boolean): React__default.JSX.Element;
+declare function createRender<TState>(store: Store<TState>, selector: (state: TState) => ReactNode, compare?: (a: TState, b: TState) => boolean): react_jsx_runtime.JSX.Element;
 declare function createRenderWithStore<TState>(store: Store<TState>): CreateRender<TState>;
 
 export { type CreateRender, createRender, createRenderWithStore };

package/dist/create_render.d.ts

@@ -1,8 +1,9 @@
-import React__default, { ReactNode } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
 import { Store } from './use_store.js';
 
 type CreateRender<TState> = (selector: (state: TState) => ReactNode, compare?: (a: TState, b: TState) => boolean) => ReactNode;
-declare function createRender<TState>(store: Store<TState>, selector: (state: TState) => ReactNode, compare?: (a: TState, b: TState) => boolean): React__default.JSX.Element;
+declare function createRender<TState>(store: Store<TState>, selector: (state: TState) => ReactNode, compare?: (a: TState, b: TState) => boolean): react_jsx_runtime.JSX.Element;
 declare function createRenderWithStore<TState>(store: Store<TState>): CreateRender<TState>;
 
 export { type CreateRender, createRender, createRenderWithStore };

package/dist/create_render.js

@@ -1,9 +1,7 @@
 "use strict";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -17,14 +15,6 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/create_render.tsx
@@ -63,23 +53,23 @@ function useSelector(store, selector, compare = (a, b) => a === b) {
 }
 
 // src/create_render.tsx
-var import_react3 = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 function createRender(store, selector, compare) {
   function Component() {
     const result = useSelector(store, (state) => state, compare);
     const content = selector(result);
-    return /* @__PURE__ */ import_react3.default.createElement(import_react3.default.Fragment, null, content);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: content });
   }
-  return /* @__PURE__ */ import_react3.default.createElement(Component, null);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, {});
 }
 function createRenderWithStore(store) {
   return function createRender2(selector, compare) {
     function Component() {
       const result = useSelector(store, (state) => state, compare);
       const content = selector(result);
-      return /* @__PURE__ */ import_react3.default.createElement(import_react3.default.Fragment, null, content);
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: content });
     }
-    return /* @__PURE__ */ import_react3.default.createElement(Component, null);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, {});
   };
 }
 // Annotate the CommonJS export names for ESM import in node:

package/dist/create_render.mjs

@@ -26,23 +26,23 @@ function useSelector(store, selector, compare = (a, b) => a === b) {
 }
 
 // src/create_render.tsx
-import React from "react";
+import { Fragment, jsx } from "react/jsx-runtime";
 function createRender(store, selector, compare) {
   function Component() {
     const result = useSelector(store, (state) => state, compare);
     const content = selector(result);
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, content);
+    return /* @__PURE__ */ jsx(Fragment, { children: content });
   }
-  return /* @__PURE__ */ React.createElement(Component, null);
+  return /* @__PURE__ */ jsx(Component, {});
 }
 function createRenderWithStore(store) {
   return function createRender2(selector, compare) {
     function Component() {
       const result = useSelector(store, (state) => state, compare);
       const content = selector(result);
-      return /* @__PURE__ */ React.createElement(React.Fragment, null, content);
+      return /* @__PURE__ */ jsx(Fragment, { children: content });
     }
-    return /* @__PURE__ */ React.createElement(Component, null);
+    return /* @__PURE__ */ jsx(Component, {});
   };
 }
 export {

package/dist/index.d.mts

@@ -7,4 +7,5 @@ export { StoreInputProps, useStoreInput } from './use_store_input.mjs';
 export { Input, Select, StoreComponentPropsWithStore, StoreInputWithNameComponentProps, Textarea, useStoreComponent } from './use_store_component.mjs';
 export { FormStore, useFormStore } from './use_form_store.mjs';
 import 'react';
+import 'react/jsx-runtime';
 import './create_render.mjs';

package/dist/index.d.ts

@@ -7,4 +7,5 @@ export { StoreInputProps, useStoreInput } from './use_store_input.js';
 export { Input, Select, StoreComponentPropsWithStore, StoreInputWithNameComponentProps, Textarea, useStoreComponent } from './use_store_component.js';
 export { FormStore, useFormStore } from './use_form_store.js';
 import 'react';
+import 'react/jsx-runtime';
 import './create_render.js';

package/dist/index.js

@@ -1,9 +1,7 @@
 "use strict";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -17,14 +15,6 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/index.tsx
@@ -141,7 +131,6 @@ function useStoreController(store, props) {
 }
 
 // src/use_store_input.tsx
-var import_react5 = require("react");
 var import_date_fns = require("date-fns");
 function useStoreInput(ref, store, props) {
   const toInputValue = props.toInputValue || ((value) => {
@@ -258,27 +247,18 @@ function useStoreInputWithName(ref, store, props) {
 }
 
 // src/use_store_component.tsx
-var import_react6 = require("react");
-var import_react7 = __toESM(require("react"));
+var import_react5 = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
 function useStoreComponent(store) {
-  const input = (0, import_react6.useCallback)(
-    function Component(props) {
-      return /* @__PURE__ */ import_react7.default.createElement(Input, { store, ...props });
-    },
-    []
-  );
-  const select = (0, import_react6.useCallback)(
-    function Component(props) {
-      return /* @__PURE__ */ import_react7.default.createElement(Select, { store, ...props });
-    },
-    []
-  );
-  const textarea = (0, import_react6.useCallback)(
-    function Component(props) {
-      return /* @__PURE__ */ import_react7.default.createElement(Textarea, { store, ...props });
-    },
-    []
-  );
+  const input = (0, import_react5.useCallback)(function Component(props) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Input, { store, ...props });
+  }, []);
+  const select = (0, import_react5.useCallback)(function Component(props) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Select, { store, ...props });
+  }, []);
+  const textarea = (0, import_react5.useCallback)(function Component(props) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Textarea, { store, ...props });
+  }, []);
   return {
     input,
     select,
@@ -293,7 +273,7 @@ function Input({
   toStateValue,
   ...props
 }) {
-  const ref = (0, import_react6.useRef)(null);
+  const ref = (0, import_react5.useRef)(null);
   const storeProps = useStoreInputWithName(ref, store, {
     ...props,
     getter,
@@ -301,7 +281,7 @@ function Input({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ import_react7.default.createElement("input", { ...props, ...storeProps });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { ref, ...props, ...storeProps });
 }
 function Select({
   store,
@@ -311,7 +291,7 @@ function Select({
   toStateValue,
   ...props
 }) {
-  const ref = (0, import_react6.useRef)(null);
+  const ref = (0, import_react5.useRef)(null);
   const storeProps = useStoreInputWithName(ref, store, {
     ...props,
     getter,
@@ -319,7 +299,7 @@ function Select({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ import_react7.default.createElement("select", { ...props, ...storeProps });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("select", { ref, ...props, ...storeProps });
 }
 function Textarea({
   store,
@@ -329,7 +309,7 @@ function Textarea({
   toStateValue,
   ...props
 }) {
-  const ref = (0, import_react6.useRef)(null);
+  const ref = (0, import_react5.useRef)(null);
   const storeProps = useStoreInputWithName(ref, store, {
     ...props,
     getter,
@@ -337,19 +317,19 @@ function Textarea({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ import_react7.default.createElement("textarea", { ...props, ...storeProps });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("textarea", { ref, ...props, ...storeProps });
 }
 
 // src/create_render.tsx
-var import_react8 = __toESM(require("react"));
+var import_jsx_runtime2 = require("react/jsx-runtime");
 function createRenderWithStore(store) {
   return function createRender(selector, compare) {
     function Component() {
       const result = useSelector(store, (state) => state, compare);
       const content = selector(result);
-      return /* @__PURE__ */ import_react8.default.createElement(import_react8.default.Fragment, null, content);
+      return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: content });
     }
-    return /* @__PURE__ */ import_react8.default.createElement(Component, null);
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Component, {});
   };
 }
 

package/dist/index.mjs

@@ -95,7 +95,6 @@ function useStoreController(store, props) {
 }
 
 // src/use_store_input.tsx
-import "react";
 import { format } from "date-fns";
 function useStoreInput(ref, store, props) {
   const toInputValue = props.toInputValue || ((value) => {
@@ -213,26 +212,17 @@ function useStoreInputWithName(ref, store, props) {
 
 // src/use_store_component.tsx
 import { useCallback, useRef as useRef2 } from "react";
-import React from "react";
+import { jsx } from "react/jsx-runtime";
 function useStoreComponent(store) {
-  const input = useCallback(
-    function Component(props) {
-      return /* @__PURE__ */ React.createElement(Input, { store, ...props });
-    },
-    []
-  );
-  const select = useCallback(
-    function Component(props) {
-      return /* @__PURE__ */ React.createElement(Select, { store, ...props });
-    },
-    []
-  );
-  const textarea = useCallback(
-    function Component(props) {
-      return /* @__PURE__ */ React.createElement(Textarea, { store, ...props });
-    },
-    []
-  );
+  const input = useCallback(function Component(props) {
+    return /* @__PURE__ */ jsx(Input, { store, ...props });
+  }, []);
+  const select = useCallback(function Component(props) {
+    return /* @__PURE__ */ jsx(Select, { store, ...props });
+  }, []);
+  const textarea = useCallback(function Component(props) {
+    return /* @__PURE__ */ jsx(Textarea, { store, ...props });
+  }, []);
   return {
     input,
     select,
@@ -255,7 +245,7 @@ function Input({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ React.createElement("input", { ...props, ...storeProps });
+  return /* @__PURE__ */ jsx("input", { ref, ...props, ...storeProps });
 }
 function Select({
   store,
@@ -273,7 +263,7 @@ function Select({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ React.createElement("select", { ...props, ...storeProps });
+  return /* @__PURE__ */ jsx("select", { ref, ...props, ...storeProps });
 }
 function Textarea({
   store,
@@ -291,19 +281,19 @@ function Textarea({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ React.createElement("textarea", { ...props, ...storeProps });
+  return /* @__PURE__ */ jsx("textarea", { ref, ...props, ...storeProps });
 }
 
 // src/create_render.tsx
-import React2 from "react";
+import { Fragment, jsx as jsx2 } from "react/jsx-runtime";
 function createRenderWithStore(store) {
   return function createRender(selector, compare) {
     function Component() {
       const result = useSelector(store, (state) => state, compare);
       const content = selector(result);
-      return /* @__PURE__ */ React2.createElement(React2.Fragment, null, content);
+      return /* @__PURE__ */ jsx2(Fragment, { children: content });
     }
-    return /* @__PURE__ */ React2.createElement(Component, null);
+    return /* @__PURE__ */ jsx2(Component, {});
   };
 }
 

package/dist/use_form_store.d.mts

@@ -1,6 +1,7 @@
 import { CreateRender } from './create_render.mjs';
 import { Store } from './use_store.mjs';
 import { useStoreComponent } from './use_store_component.mjs';
+import 'react/jsx-runtime';
 import 'react';
 import './use_store_input_with_name.mjs';
 import './use_store_input.mjs';

package/dist/use_form_store.d.ts

@@ -1,6 +1,7 @@
 import { CreateRender } from './create_render.js';
 import { Store } from './use_store.js';
 import { useStoreComponent } from './use_store_component.js';
+import 'react/jsx-runtime';
 import 'react';
 import './use_store_input_with_name.js';
 import './use_store_input.js';

package/dist/use_form_store.js

@@ -1,9 +1,7 @@
 "use strict";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -17,14 +15,6 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/use_form_store.tsx
@@ -62,24 +52,24 @@ function useSelector(store, selector, compare = (a, b) => a === b) {
 }
 
 // src/create_render.tsx
-var import_react3 = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 function createRenderWithStore(store) {
   return function createRender(selector, compare) {
     function Component() {
       const result = useSelector(store, (state) => state, compare);
       const content = selector(result);
-      return /* @__PURE__ */ import_react3.default.createElement(import_react3.default.Fragment, null, content);
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: content });
     }
-    return /* @__PURE__ */ import_react3.default.createElement(Component, null);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, {});
   };
 }
 
 // src/use_store.tsx
-var import_react4 = require("react");
+var import_react3 = require("react");
 var import_immer = require("immer");
 function useStore(initialState) {
-  const stateRef = (0, import_react4.useRef)(initialState);
-  const subscribers = (0, import_react4.useRef)([]);
+  const stateRef = (0, import_react3.useRef)(initialState);
+  const subscribers = (0, import_react3.useRef)([]);
   const dispatch = (recipe, options = {}) => {
     if (typeof recipe === "function") {
       stateRef.current = (0, import_immer.produce)(stateRef.current, recipe);
@@ -119,17 +109,15 @@ function useStore(initialState) {
 }
 
 // src/use_store_component.tsx
-var import_react7 = require("react");
-var import_react8 = __toESM(require("react"));
+var import_react5 = require("react");
 
 // src/use_store_input.tsx
-var import_react6 = require("react");
 var import_date_fns = require("date-fns");
 
 // src/use_store_controller.tsx
-var import_react5 = require("react");
+var import_react4 = require("react");
 function useStoreController(store, props) {
-  const dispatchKey = (0, import_react5.useId)();
+  const dispatchKey = (0, import_react4.useId)();
   useSubscribe(store, (state, key) => {
     if (key === dispatchKey) {
       return;
@@ -267,25 +255,17 @@ function useStoreInputWithName(ref, store, props) {
 }
 
 // src/use_store_component.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
 function useStoreComponent(store) {
-  const input = (0, import_react7.useCallback)(
-    function Component(props) {
-      return /* @__PURE__ */ import_react8.default.createElement(Input, { store, ...props });
-    },
-    []
-  );
-  const select = (0, import_react7.useCallback)(
-    function Component(props) {
-      return /* @__PURE__ */ import_react8.default.createElement(Select, { store, ...props });
-    },
-    []
-  );
-  const textarea = (0, import_react7.useCallback)(
-    function Component(props) {
-      return /* @__PURE__ */ import_react8.default.createElement(Textarea, { store, ...props });
-    },
-    []
-  );
+  const input = (0, import_react5.useCallback)(function Component(props) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Input, { store, ...props });
+  }, []);
+  const select = (0, import_react5.useCallback)(function Component(props) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Select, { store, ...props });
+  }, []);
+  const textarea = (0, import_react5.useCallback)(function Component(props) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Textarea, { store, ...props });
+  }, []);
   return {
     input,
     select,
@@ -300,7 +280,7 @@ function Input({
   toStateValue,
   ...props
 }) {
-  const ref = (0, import_react7.useRef)(null);
+  const ref = (0, import_react5.useRef)(null);
   const storeProps = useStoreInputWithName(ref, store, {
     ...props,
     getter,
@@ -308,7 +288,7 @@ function Input({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ import_react8.default.createElement("input", { ...props, ...storeProps });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("input", { ref, ...props, ...storeProps });
 }
 function Select({
   store,
@@ -318,7 +298,7 @@ function Select({
   toStateValue,
   ...props
 }) {
-  const ref = (0, import_react7.useRef)(null);
+  const ref = (0, import_react5.useRef)(null);
   const storeProps = useStoreInputWithName(ref, store, {
     ...props,
     getter,
@@ -326,7 +306,7 @@ function Select({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ import_react8.default.createElement("select", { ...props, ...storeProps });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("select", { ref, ...props, ...storeProps });
 }
 function Textarea({
   store,
@@ -336,7 +316,7 @@ function Textarea({
   toStateValue,
   ...props
 }) {
-  const ref = (0, import_react7.useRef)(null);
+  const ref = (0, import_react5.useRef)(null);
   const storeProps = useStoreInputWithName(ref, store, {
     ...props,
     getter,
@@ -344,7 +324,7 @@ function Textarea({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ import_react8.default.createElement("textarea", { ...props, ...storeProps });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("textarea", { ref, ...props, ...storeProps });
 }
 
 // src/use_form_store.tsx

package/dist/use_form_store.mjs

@@ -26,15 +26,15 @@ function useSelector(store, selector, compare = (a, b) => a === b) {
 }
 
 // src/create_render.tsx
-import React from "react";
+import { Fragment, jsx } from "react/jsx-runtime";
 function createRenderWithStore(store) {
   return function createRender(selector, compare) {
     function Component() {
       const result = useSelector(store, (state) => state, compare);
       const content = selector(result);
-      return /* @__PURE__ */ React.createElement(React.Fragment, null, content);
+      return /* @__PURE__ */ jsx(Fragment, { children: content });
     }
-    return /* @__PURE__ */ React.createElement(Component, null);
+    return /* @__PURE__ */ jsx(Component, {});
   };
 }
 
@@ -84,10 +84,8 @@ function useStore(initialState) {
 
 // src/use_store_component.tsx
 import { useCallback, useRef as useRef2 } from "react";
-import React2 from "react";
 
 // src/use_store_input.tsx
-import "react";
 import { format } from "date-fns";
 
 // src/use_store_controller.tsx
@@ -231,25 +229,17 @@ function useStoreInputWithName(ref, store, props) {
 }
 
 // src/use_store_component.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
 function useStoreComponent(store) {
-  const input = useCallback(
-    function Component(props) {
-      return /* @__PURE__ */ React2.createElement(Input, { store, ...props });
-    },
-    []
-  );
-  const select = useCallback(
-    function Component(props) {
-      return /* @__PURE__ */ React2.createElement(Select, { store, ...props });
-    },
-    []
-  );
-  const textarea = useCallback(
-    function Component(props) {
-      return /* @__PURE__ */ React2.createElement(Textarea, { store, ...props });
-    },
-    []
-  );
+  const input = useCallback(function Component(props) {
+    return /* @__PURE__ */ jsx2(Input, { store, ...props });
+  }, []);
+  const select = useCallback(function Component(props) {
+    return /* @__PURE__ */ jsx2(Select, { store, ...props });
+  }, []);
+  const textarea = useCallback(function Component(props) {
+    return /* @__PURE__ */ jsx2(Textarea, { store, ...props });
+  }, []);
   return {
     input,
     select,
@@ -272,7 +262,7 @@ function Input({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ React2.createElement("input", { ...props, ...storeProps });
+  return /* @__PURE__ */ jsx2("input", { ref, ...props, ...storeProps });
 }
 function Select({
   store,
@@ -290,7 +280,7 @@ function Select({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ React2.createElement("select", { ...props, ...storeProps });
+  return /* @__PURE__ */ jsx2("select", { ref, ...props, ...storeProps });
 }
 function Textarea({
   store,
@@ -308,7 +298,7 @@ function Textarea({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ React2.createElement("textarea", { ...props, ...storeProps });
+  return /* @__PURE__ */ jsx2("textarea", { ref, ...props, ...storeProps });
 }
 
 // src/use_form_store.tsx

package/dist/use_store_component.d.mts

@@ -1,19 +1,20 @@
-import React__default, { DetailedHTMLProps } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { DetailedHTMLProps } from 'react';
 import { Store } from './use_store.mjs';
 import { StoreInputWithNameProps } from './use_store_input_with_name.mjs';
 import './use_store_input.mjs';
 
-type StoreInputWithNameComponentProps<TElement, TState, TName extends keyof TState | undefined, TValue> = StoreInputWithNameProps<TElement, TState, TName, TValue> & Omit<DetailedHTMLProps<React__default.InputHTMLAttributes<TElement>, TElement>, keyof StoreInputWithNameProps<TElement, TState, TName, TValue>>;
+type StoreInputWithNameComponentProps<TElement, TState, TName extends keyof TState | undefined, TValue> = StoreInputWithNameProps<TElement, TState, TName, TValue> & Omit<DetailedHTMLProps<React.InputHTMLAttributes<TElement>, TElement>, keyof StoreInputWithNameProps<TElement, TState, TName, TValue>>;
 declare function useStoreComponent<TState>(store: Store<TState>): {
-    input: <TName extends keyof TState | undefined, TValue>(props: StoreInputWithNameComponentProps<HTMLInputElement, TState, TName, TValue>) => React__default.JSX.Element;
-    select: <TName extends keyof TState | undefined, TValue>(props: StoreInputWithNameComponentProps<HTMLSelectElement, TState, TName, TValue>) => React__default.JSX.Element;
-    textarea: <TName extends keyof TState | undefined, TValue>(props: StoreInputWithNameComponentProps<HTMLTextAreaElement, TState, TName, TValue>) => React__default.JSX.Element;
+    input: <TName extends keyof TState | undefined, TValue>(props: StoreInputWithNameComponentProps<HTMLInputElement, TState, TName, TValue>) => react_jsx_runtime.JSX.Element;
+    select: <TName extends keyof TState | undefined, TValue>(props: StoreInputWithNameComponentProps<HTMLSelectElement, TState, TName, TValue>) => react_jsx_runtime.JSX.Element;
+    textarea: <TName extends keyof TState | undefined, TValue>(props: StoreInputWithNameComponentProps<HTMLTextAreaElement, TState, TName, TValue>) => react_jsx_runtime.JSX.Element;
 };
 type StoreComponentPropsWithStore<TElement extends HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement, TState, TName extends keyof TState | undefined, TValue> = StoreInputWithNameComponentProps<TElement, TState, TName, TValue> & {
     store: Store<TState>;
 };
-declare function Input<TState, TName extends keyof TState | undefined, TValue>({ store, getter, setter, toInputValue, toStateValue, ...props }: StoreComponentPropsWithStore<HTMLInputElement, TState, TName, TValue>): React__default.JSX.Element;
-declare function Select<TState, TName extends keyof TState | undefined, TValue>({ store, getter, setter, toInputValue, toStateValue, ...props }: StoreComponentPropsWithStore<HTMLSelectElement, TState, TName, TValue>): React__default.JSX.Element;
-declare function Textarea<TState, TName extends keyof TState | undefined, TValue>({ store, getter, setter, toInputValue, toStateValue, ...props }: StoreComponentPropsWithStore<HTMLTextAreaElement, TState, TName, TValue>): React__default.JSX.Element;
+declare function Input<TState, TName extends keyof TState | undefined, TValue>({ store, getter, setter, toInputValue, toStateValue, ...props }: StoreComponentPropsWithStore<HTMLInputElement, TState, TName, TValue>): react_jsx_runtime.JSX.Element;
+declare function Select<TState, TName extends keyof TState | undefined, TValue>({ store, getter, setter, toInputValue, toStateValue, ...props }: StoreComponentPropsWithStore<HTMLSelectElement, TState, TName, TValue>): react_jsx_runtime.JSX.Element;
+declare function Textarea<TState, TName extends keyof TState | undefined, TValue>({ store, getter, setter, toInputValue, toStateValue, ...props }: StoreComponentPropsWithStore<HTMLTextAreaElement, TState, TName, TValue>): react_jsx_runtime.JSX.Element;
 
 export { Input, Select, type StoreComponentPropsWithStore, type StoreInputWithNameComponentProps, Textarea, useStoreComponent };

package/dist/use_store_component.d.ts

@@ -1,19 +1,20 @@
-import React__default, { DetailedHTMLProps } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { DetailedHTMLProps } from 'react';
 import { Store } from './use_store.js';
 import { StoreInputWithNameProps } from './use_store_input_with_name.js';
 import './use_store_input.js';
 
-type StoreInputWithNameComponentProps<TElement, TState, TName extends keyof TState | undefined, TValue> = StoreInputWithNameProps<TElement, TState, TName, TValue> & Omit<DetailedHTMLProps<React__default.InputHTMLAttributes<TElement>, TElement>, keyof StoreInputWithNameProps<TElement, TState, TName, TValue>>;
+type StoreInputWithNameComponentProps<TElement, TState, TName extends keyof TState | undefined, TValue> = StoreInputWithNameProps<TElement, TState, TName, TValue> & Omit<DetailedHTMLProps<React.InputHTMLAttributes<TElement>, TElement>, keyof StoreInputWithNameProps<TElement, TState, TName, TValue>>;
 declare function useStoreComponent<TState>(store: Store<TState>): {
-    input: <TName extends keyof TState | undefined, TValue>(props: StoreInputWithNameComponentProps<HTMLInputElement, TState, TName, TValue>) => React__default.JSX.Element;
-    select: <TName extends keyof TState | undefined, TValue>(props: StoreInputWithNameComponentProps<HTMLSelectElement, TState, TName, TValue>) => React__default.JSX.Element;
-    textarea: <TName extends keyof TState | undefined, TValue>(props: StoreInputWithNameComponentProps<HTMLTextAreaElement, TState, TName, TValue>) => React__default.JSX.Element;
+    input: <TName extends keyof TState | undefined, TValue>(props: StoreInputWithNameComponentProps<HTMLInputElement, TState, TName, TValue>) => react_jsx_runtime.JSX.Element;
+    select: <TName extends keyof TState | undefined, TValue>(props: StoreInputWithNameComponentProps<HTMLSelectElement, TState, TName, TValue>) => react_jsx_runtime.JSX.Element;
+    textarea: <TName extends keyof TState | undefined, TValue>(props: StoreInputWithNameComponentProps<HTMLTextAreaElement, TState, TName, TValue>) => react_jsx_runtime.JSX.Element;
 };
 type StoreComponentPropsWithStore<TElement extends HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement, TState, TName extends keyof TState | undefined, TValue> = StoreInputWithNameComponentProps<TElement, TState, TName, TValue> & {
     store: Store<TState>;
 };
-declare function Input<TState, TName extends keyof TState | undefined, TValue>({ store, getter, setter, toInputValue, toStateValue, ...props }: StoreComponentPropsWithStore<HTMLInputElement, TState, TName, TValue>): React__default.JSX.Element;
-declare function Select<TState, TName extends keyof TState | undefined, TValue>({ store, getter, setter, toInputValue, toStateValue, ...props }: StoreComponentPropsWithStore<HTMLSelectElement, TState, TName, TValue>): React__default.JSX.Element;
-declare function Textarea<TState, TName extends keyof TState | undefined, TValue>({ store, getter, setter, toInputValue, toStateValue, ...props }: StoreComponentPropsWithStore<HTMLTextAreaElement, TState, TName, TValue>): React__default.JSX.Element;
+declare function Input<TState, TName extends keyof TState | undefined, TValue>({ store, getter, setter, toInputValue, toStateValue, ...props }: StoreComponentPropsWithStore<HTMLInputElement, TState, TName, TValue>): react_jsx_runtime.JSX.Element;
+declare function Select<TState, TName extends keyof TState | undefined, TValue>({ store, getter, setter, toInputValue, toStateValue, ...props }: StoreComponentPropsWithStore<HTMLSelectElement, TState, TName, TValue>): react_jsx_runtime.JSX.Element;
+declare function Textarea<TState, TName extends keyof TState | undefined, TValue>({ store, getter, setter, toInputValue, toStateValue, ...props }: StoreComponentPropsWithStore<HTMLTextAreaElement, TState, TName, TValue>): react_jsx_runtime.JSX.Element;
 
 export { Input, Select, type StoreComponentPropsWithStore, type StoreInputWithNameComponentProps, Textarea, useStoreComponent };

package/dist/use_store_component.js

@@ -1,9 +1,7 @@
 "use strict";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -17,14 +15,6 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/use_store_component.tsx
@@ -36,11 +26,9 @@ __export(use_store_component_exports, {
   useStoreComponent: () => useStoreComponent
 });
 module.exports = __toCommonJS(use_store_component_exports);
-var import_react4 = require("react");
-var import_react5 = __toESM(require("react"));
+var import_react3 = require("react");
 
 // src/use_store_input.tsx
-var import_react3 = require("react");
 var import_date_fns = require("date-fns");
 
 // src/use_store_controller.tsx
@@ -197,25 +185,17 @@ function useStoreInputWithName(ref, store, props) {
 }
 
 // src/use_store_component.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
 function useStoreComponent(store) {
-  const input = (0, import_react4.useCallback)(
-    function Component(props) {
-      return /* @__PURE__ */ import_react5.default.createElement(Input, { store, ...props });
-    },
-    []
-  );
-  const select = (0, import_react4.useCallback)(
-    function Component(props) {
-      return /* @__PURE__ */ import_react5.default.createElement(Select, { store, ...props });
-    },
-    []
-  );
-  const textarea = (0, import_react4.useCallback)(
-    function Component(props) {
-      return /* @__PURE__ */ import_react5.default.createElement(Textarea, { store, ...props });
-    },
-    []
-  );
+  const input = (0, import_react3.useCallback)(function Component(props) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Input, { store, ...props });
+  }, []);
+  const select = (0, import_react3.useCallback)(function Component(props) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Select, { store, ...props });
+  }, []);
+  const textarea = (0, import_react3.useCallback)(function Component(props) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Textarea, { store, ...props });
+  }, []);
   return {
     input,
     select,
@@ -230,7 +210,7 @@ function Input({
   toStateValue,
   ...props
 }) {
-  const ref = (0, import_react4.useRef)(null);
+  const ref = (0, import_react3.useRef)(null);
   const storeProps = useStoreInputWithName(ref, store, {
     ...props,
     getter,
@@ -238,7 +218,7 @@ function Input({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ import_react5.default.createElement("input", { ...props, ...storeProps });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { ref, ...props, ...storeProps });
 }
 function Select({
   store,
@@ -248,7 +228,7 @@ function Select({
   toStateValue,
   ...props
 }) {
-  const ref = (0, import_react4.useRef)(null);
+  const ref = (0, import_react3.useRef)(null);
   const storeProps = useStoreInputWithName(ref, store, {
     ...props,
     getter,
@@ -256,7 +236,7 @@ function Select({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ import_react5.default.createElement("select", { ...props, ...storeProps });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("select", { ref, ...props, ...storeProps });
 }
 function Textarea({
   store,
@@ -266,7 +246,7 @@ function Textarea({
   toStateValue,
   ...props
 }) {
-  const ref = (0, import_react4.useRef)(null);
+  const ref = (0, import_react3.useRef)(null);
   const storeProps = useStoreInputWithName(ref, store, {
     ...props,
     getter,
@@ -274,7 +254,7 @@ function Textarea({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ import_react5.default.createElement("textarea", { ...props, ...storeProps });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("textarea", { ref, ...props, ...storeProps });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/use_store_component.mjs

@@ -1,9 +1,7 @@
 // src/use_store_component.tsx
 import { useCallback, useRef } from "react";
-import React from "react";
 
 // src/use_store_input.tsx
-import "react";
 import { format } from "date-fns";
 
 // src/use_store_controller.tsx
@@ -160,25 +158,17 @@ function useStoreInputWithName(ref, store, props) {
 }
 
 // src/use_store_component.tsx
+import { jsx } from "react/jsx-runtime";
 function useStoreComponent(store) {
-  const input = useCallback(
-    function Component(props) {
-      return /* @__PURE__ */ React.createElement(Input, { store, ...props });
-    },
-    []
-  );
-  const select = useCallback(
-    function Component(props) {
-      return /* @__PURE__ */ React.createElement(Select, { store, ...props });
-    },
-    []
-  );
-  const textarea = useCallback(
-    function Component(props) {
-      return /* @__PURE__ */ React.createElement(Textarea, { store, ...props });
-    },
-    []
-  );
+  const input = useCallback(function Component(props) {
+    return /* @__PURE__ */ jsx(Input, { store, ...props });
+  }, []);
+  const select = useCallback(function Component(props) {
+    return /* @__PURE__ */ jsx(Select, { store, ...props });
+  }, []);
+  const textarea = useCallback(function Component(props) {
+    return /* @__PURE__ */ jsx(Textarea, { store, ...props });
+  }, []);
   return {
     input,
     select,
@@ -201,7 +191,7 @@ function Input({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ React.createElement("input", { ...props, ...storeProps });
+  return /* @__PURE__ */ jsx("input", { ref, ...props, ...storeProps });
 }
 function Select({
   store,
@@ -219,7 +209,7 @@ function Select({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ React.createElement("select", { ...props, ...storeProps });
+  return /* @__PURE__ */ jsx("select", { ref, ...props, ...storeProps });
 }
 function Textarea({
   store,
@@ -237,7 +227,7 @@ function Textarea({
     toInputValue,
     toStateValue
   });
-  return /* @__PURE__ */ React.createElement("textarea", { ...props, ...storeProps });
+  return /* @__PURE__ */ jsx("textarea", { ref, ...props, ...storeProps });
 }
 export {
   Input,

package/dist/use_store_input.js

@@ -23,7 +23,6 @@ __export(use_store_input_exports, {
   useStoreInput: () => useStoreInput
 });
 module.exports = __toCommonJS(use_store_input_exports);
-var import_react3 = require("react");
 var import_date_fns = require("date-fns");
 
 // src/use_store_controller.tsx

package/dist/use_store_input.mjs

@@ -1,5 +1,4 @@
 // src/use_store_input.tsx
-import "react";
 import { format } from "date-fns";
 
 // src/use_store_controller.tsx

package/dist/use_store_input_with_name.d.mts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import * as react from 'react';
 import { RefObject } from 'react';
 import { Store } from './use_store.mjs';
 import { StoreInputProps } from './use_store_input.mjs';
@@ -11,7 +11,7 @@ declare function useStoreInputWithName<TInputElement extends HTMLInputElement |
     name: string | undefined;
     defaultValue: string | number | readonly string[] | undefined;
     defaultChecked: boolean | undefined;
-    onChange: (event: React.ChangeEvent<TInputElement>) => void;
+    onChange: (event: react.ChangeEvent<TInputElement>) => void;
 };
 
 export { type InferNameFromProps, type StoreInputWithNameProps, useStoreInputWithName };

package/dist/use_store_input_with_name.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import * as react from 'react';
 import { RefObject } from 'react';
 import { Store } from './use_store.js';
 import { StoreInputProps } from './use_store_input.js';
@@ -11,7 +11,7 @@ declare function useStoreInputWithName<TInputElement extends HTMLInputElement |
     name: string | undefined;
     defaultValue: string | number | readonly string[] | undefined;
     defaultChecked: boolean | undefined;
-    onChange: (event: React.ChangeEvent<TInputElement>) => void;
+    onChange: (event: react.ChangeEvent<TInputElement>) => void;
 };
 
 export { type InferNameFromProps, type StoreInputWithNameProps, useStoreInputWithName };

package/dist/use_store_input_with_name.js

@@ -25,7 +25,6 @@ __export(use_store_input_with_name_exports, {
 module.exports = __toCommonJS(use_store_input_with_name_exports);
 
 // src/use_store_input.tsx
-var import_react3 = require("react");
 var import_date_fns = require("date-fns");
 
 // src/use_store_controller.tsx

package/dist/use_store_input_with_name.mjs

@@ -1,5 +1,4 @@
 // src/use_store_input.tsx
-import "react";
 import { format } from "date-fns";
 
 // src/use_store_controller.tsx

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-store-input",
-  "version": "0.1.9",
+  "version": "0.2.1",
   "types": "./dist/index.d.ts",
   "main": "./dist/index.mjs",
   "module": "./dist/index.js",