react-store-input 0.2.6 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/CHANGELOG.md +136 -0
  2. package/README.md +211 -199
  3. package/dist/index.d.mts +127 -11
  4. package/dist/index.d.ts +127 -11
  5. package/dist/index.js +542 -280
  6. package/dist/index.js.map +1 -0
  7. package/dist/index.mjs +529 -272
  8. package/dist/index.mjs.map +1 -0
  9. package/dist/text-editor.d.mts +11 -0
  10. package/dist/text-editor.d.ts +11 -0
  11. package/dist/text-editor.js +203 -0
  12. package/dist/text-editor.js.map +1 -0
  13. package/dist/text-editor.mjs +178 -0
  14. package/dist/text-editor.mjs.map +1 -0
  15. package/package.json +78 -18
  16. package/dist/create_render.d.mts +0 -9
  17. package/dist/create_render.d.ts +0 -9
  18. package/dist/create_render.js +0 -51
  19. package/dist/create_render.mjs +0 -25
  20. package/dist/text_editor.d.mts +0 -13
  21. package/dist/text_editor.d.ts +0 -13
  22. package/dist/text_editor.js +0 -135
  23. package/dist/text_editor.mjs +0 -112
  24. package/dist/use_form_store.d.mts +0 -16
  25. package/dist/use_form_store.d.ts +0 -16
  26. package/dist/use_form_store.js +0 -365
  27. package/dist/use_form_store.mjs +0 -340
  28. package/dist/use_store_component.d.mts +0 -23
  29. package/dist/use_store_component.d.ts +0 -23
  30. package/dist/use_store_component.js +0 -337
  31. package/dist/use_store_component.mjs +0 -311
  32. package/dist/use_store_controller.d.mts +0 -11
  33. package/dist/use_store_controller.d.ts +0 -11
  34. package/dist/use_store_controller.js +0 -57
  35. package/dist/use_store_controller.mjs +0 -32
  36. package/dist/use_store_input.d.mts +0 -22
  37. package/dist/use_store_input.d.ts +0 -22
  38. package/dist/use_store_input.js +0 -151
  39. package/dist/use_store_input.mjs +0 -126
  40. package/dist/use_store_input_with_name.d.mts +0 -17
  41. package/dist/use_store_input_with_name.d.ts +0 -17
  42. package/dist/use_store_input_with_name.js +0 -177
  43. package/dist/use_store_input_with_name.mjs +0 -150
  44. package/tsup.config.ts +0 -9
@@ -1,150 +0,0 @@
1
- // src/use_store_input.tsx
2
- import { format } from "date-fns";
3
-
4
- // src/use_store_controller.tsx
5
- import { useEffect, useId } from "react";
6
- function useStoreController(store, props) {
7
- const dispatchKey = useId();
8
- useEffect(() => {
9
- const unsub = store.subscribe((state, key) => {
10
- if (key === dispatchKey) {
11
- return;
12
- }
13
- props.onSubscribe(state);
14
- });
15
- return () => {
16
- unsub();
17
- };
18
- }, []);
19
- const dispatch = () => {
20
- store.dispatch(
21
- (state) => {
22
- props.onDispatch(state);
23
- },
24
- {
25
- key: dispatchKey
26
- }
27
- );
28
- };
29
- return {
30
- dispatch
31
- };
32
- }
33
-
34
- // src/use_store_input.tsx
35
- function useStoreInput(ref, store, props) {
36
- const toInputValue = props.toInputValue || ((value) => {
37
- if (value === void 0 || value === null) {
38
- return "";
39
- }
40
- if (props.type === "datetime-local") {
41
- const date = new Date(value);
42
- if (!isNaN(date.getTime())) {
43
- return format(date, "yyyy-MM-dd'T'HH:mm:ss");
44
- }
45
- }
46
- return String(value);
47
- });
48
- const getDefaultValue = () => {
49
- if (props.defaultValue !== void 0) {
50
- return props.defaultValue;
51
- }
52
- if (props.type === "checkbox" || props.type === "radio") {
53
- return void 0;
54
- }
55
- return toInputValue(props.getter(store.state));
56
- };
57
- const toInputChecked = (value) => {
58
- if (props.type === "radio") {
59
- return value !== void 0 && value === props.value;
60
- }
61
- return Boolean(value);
62
- };
63
- const getDefaultChecked = () => {
64
- if (props.defaultChecked) {
65
- return props.defaultChecked;
66
- }
67
- if (props.type !== "checkbox" && props.type !== "radio") {
68
- return void 0;
69
- }
70
- return toInputChecked(props.getter(store.state));
71
- };
72
- const toStateValue = props.toStateValue || ((value) => {
73
- if (props.type === "number" || props.type === "range") {
74
- return Number(value);
75
- }
76
- if (props.type === "datetime-local") {
77
- return new Date(value);
78
- }
79
- return value;
80
- });
81
- const inputProps = useStoreController(store, {
82
- onSubscribe: (state) => {
83
- const element = ref.current;
84
- if (!element) {
85
- return;
86
- }
87
- if ("checked" in element && (props.type === "checkbox" || props.type === "radio")) {
88
- const checked = toInputChecked(props.getter(state));
89
- if (element.checked === checked) {
90
- return;
91
- }
92
- element.checked = checked;
93
- } else {
94
- const value = toInputValue(props.getter(state));
95
- if (element.value === value) {
96
- return;
97
- }
98
- element.value = value;
99
- }
100
- const event = new Event("input", { bubbles: true });
101
- element.dispatchEvent(event);
102
- },
103
- onDispatch: (state) => {
104
- const element = ref.current;
105
- if (!element) {
106
- return;
107
- }
108
- if ("checked" in element && props.type === "checkbox") {
109
- props.setter(state, element.checked);
110
- } else {
111
- props.setter(state, toStateValue(element.value));
112
- }
113
- }
114
- });
115
- return {
116
- defaultValue: getDefaultValue(),
117
- defaultChecked: getDefaultChecked(),
118
- onChange: (event) => {
119
- inputProps.dispatch();
120
- props.onChange?.(event);
121
- }
122
- };
123
- }
124
-
125
- // src/use_store_input_with_name.tsx
126
- function useStoreInputWithName(ref, store, props) {
127
- const inputProps = useStoreInput(ref, store, {
128
- ...props,
129
- getter: (state) => {
130
- if (props.getter) {
131
- return props.getter(state);
132
- }
133
- return state[props.name];
134
- },
135
- setter: (state, value) => {
136
- if (props.setter) {
137
- props.setter(state, value);
138
- return;
139
- }
140
- state[props.name] = value;
141
- }
142
- });
143
- return {
144
- ...inputProps,
145
- name: "name" in props ? String(props.name) : void 0
146
- };
147
- }
148
- export {
149
- useStoreInputWithName
150
- };
package/tsup.config.ts DELETED
@@ -1,9 +0,0 @@
1
- import { defineConfig } from "tsup";
2
-
3
- export default defineConfig({
4
- entry: ["src/**/*.ts", "src/**/*.tsx"], // Your entry file(s)
5
- format: ["cjs", "esm"], // Output both CommonJS (.cjs) and ESM (.js/.mjs)
6
- dts: true, // Generate .d.ts files for both formats
7
- splitting: false,
8
- clean: true, // Clean dist folder before build
9
- });