@legendapp/state 3.0.0-alpha.1 → 3.0.0-alpha.3

package/as/stringAsRecord.js

@@ -0,0 +1,15 @@
+'use strict';
+
+var state = require('@legendapp/state');
+
+// src/as/stringAsRecord.ts
+function stringAsRecord(str$) {
+  return state.linked({
+    get: () => {
+      return JSON.parse((str$ == null ? void 0 : str$.get()) || "{}");
+    },
+    set: ({ value }) => str$ == null ? void 0 : str$.set(JSON.stringify(value))
+  });
+}
+
+exports.stringAsRecord = stringAsRecord;

package/as/stringAsRecord.mjs

@@ -0,0 +1,13 @@
+import { linked } from '@legendapp/state';
+
+// src/as/stringAsRecord.ts
+function stringAsRecord(str$) {
+  return linked({
+    get: () => {
+      return JSON.parse((str$ == null ? void 0 : str$.get()) || "{}");
+    },
+    set: ({ value }) => str$ == null ? void 0 : str$.set(JSON.stringify(value))
+  });
+}
+
+export { stringAsRecord };

package/as/stringAsSet.d.mts

@@ -0,0 +1,5 @@
+import { ObservableParam, Linked } from '@legendapp/state';
+
+declare function stringAsSet<T>(str$: ObservableParam<string>): Linked<Set<T>>;
+
+export { stringAsSet };

package/as/stringAsSet.d.ts

@@ -0,0 +1,5 @@
+import { ObservableParam, Linked } from '@legendapp/state';
+
+declare function stringAsSet<T>(str$: ObservableParam<string>): Linked<Set<T>>;
+
+export { stringAsSet };

package/as/stringAsSet.js

@@ -0,0 +1,13 @@
+'use strict';
+
+var state = require('@legendapp/state');
+
+// src/as/stringAsSet.ts
+function stringAsSet(str$) {
+  return state.linked({
+    get: () => new Set(JSON.parse((str$ == null ? void 0 : str$.get()) || "[]")),
+    set: ({ value }) => str$ == null ? void 0 : str$.set(JSON.stringify(Array.from(value)))
+  });
+}
+
+exports.stringAsSet = stringAsSet;

package/as/stringAsSet.mjs

@@ -0,0 +1,11 @@
+import { linked } from '@legendapp/state';
+
+// src/as/stringAsSet.ts
+function stringAsSet(str$) {
+  return linked({
+    get: () => new Set(JSON.parse((str$ == null ? void 0 : str$.get()) || "[]")),
+    set: ({ value }) => str$ == null ? void 0 : str$.set(JSON.stringify(Array.from(value)))
+  });
+}
+
+export { stringAsSet };

package/babel.d.mts

@@ -0,0 +1,21 @@
+declare function export_default(): {
+    visitor: {
+        ImportDeclaration: {
+            enter(path: {
+                node: any;
+                replaceWith: (param: any) => any;
+                skip: () => void;
+            }): void;
+        };
+        JSXElement: {
+            enter(path: {
+                node: any;
+                replaceWith: (param: any) => any;
+                skip: () => void;
+                traverse: (path: any) => any;
+            }): void;
+        };
+    };
+};
+
+export { export_default as default };

package/babel.d.ts

@@ -1,2 +1,21 @@
-import babel from './src/babel';
-export default babel;
+declare function export_default(): {
+    visitor: {
+        ImportDeclaration: {
+            enter(path: {
+                node: any;
+                replaceWith: (param: any) => any;
+                skip: () => void;
+            }): void;
+        };
+        JSXElement: {
+            enter(path: {
+                node: any;
+                replaceWith: (param: any) => any;
+                skip: () => void;
+                traverse: (path: any) => any;
+            }): void;
+        };
+    };
+};
+
+export { export_default as default };

package/babel.js

@@ -2,62 +2,66 @@
 
 var types = require('@babel/types');
 
-function babel () {
-    let hasLegendImport = false;
-    return {
-        visitor: {
-            ImportDeclaration: {
-                enter(path) {
-                    if (path.node.source.value === '@legendapp/state/react') {
-                        const specifiers = path.node.specifiers;
-                        for (let i = 0; i < specifiers.length; i++) {
-                            const s = specifiers[i].imported.name;
-                            if (!hasLegendImport && (s === 'Computed' || s === 'Memo' || s === 'Show')) {
-                                hasLegendImport = true;
-                                path.skip();
-                                break;
-                            }
-                        }
-                    }
-                },
-            },
-            JSXElement: {
-                enter(path) {
-                    if (!hasLegendImport) {
-                        path.skip();
-                        return;
-                    }
-                    const openingElement = path.node.openingElement;
-                    const name = openingElement.name.name;
-                    if (name === 'Computed' || name === 'Memo' || name === 'Show') {
-                        const children = removeEmptyText(path.node.children);
-                        if (children.length === 0)
-                            return;
-                        if (children[0].type === 'JSXElement' ||
-                            (children[0].type === 'JSXExpressionContainer' &&
-                                children[0].expression.type !== 'ArrowFunctionExpression' &&
-                                children[0].expression.type !== 'FunctionExpression' &&
-                                children[0].expression.type !== 'MemberExpression' &&
-                                children[0].expression.type !== 'Identifier')) {
-                            const attrs = openingElement.attributes;
-                            path.replaceWith(types.jsxElement(types.jsxOpeningElement(types.jsxIdentifier(name), attrs), types.jsxClosingElement(types.jsxIdentifier(name)), [types.jsxExpressionContainer(types.arrowFunctionExpression([], maybeWrapFragment(children)))]));
-                        }
-                    }
-                },
-            },
-        },
-    };
+// src/babel/index.ts
+function babel_default() {
+  let hasLegendImport = false;
+  return {
+    visitor: {
+      ImportDeclaration: {
+        enter(path) {
+          if (path.node.source.value === "@legendapp/state/react") {
+            const specifiers = path.node.specifiers;
+            for (let i = 0; i < specifiers.length; i++) {
+              const s = specifiers[i].imported.name;
+              if (!hasLegendImport && (s === "Computed" || s === "Memo" || s === "Show")) {
+                hasLegendImport = true;
+                path.skip();
+                break;
+              }
+            }
+          }
+        }
+      },
+      JSXElement: {
+        enter(path) {
+          if (!hasLegendImport) {
+            path.skip();
+            return;
+          }
+          const openingElement = path.node.openingElement;
+          const name = openingElement.name.name;
+          if (name === "Computed" || name === "Memo" || name === "Show") {
+            const children = removeEmptyText(path.node.children);
+            if (children.length === 0)
+              return;
+            if (children[0].type === "JSXElement" || children[0].type === "JSXExpressionContainer" && children[0].expression.type !== "ArrowFunctionExpression" && children[0].expression.type !== "FunctionExpression" && children[0].expression.type !== "MemberExpression" && children[0].expression.type !== "Identifier") {
+              const attrs = openingElement.attributes;
+              path.replaceWith(
+                types.jsxElement(
+                  types.jsxOpeningElement(types.jsxIdentifier(name), attrs),
+                  types.jsxClosingElement(types.jsxIdentifier(name)),
+                  [types.jsxExpressionContainer(types.arrowFunctionExpression([], maybeWrapFragment(children)))]
+                )
+              );
+            }
+          }
+        }
+      }
+    }
+  };
 }
 function maybeWrapFragment(children) {
-    if (children.length === 1 && children[0].type == 'JSXElement')
-        return children[0];
-    if (children.length === 1 && children[0].type == 'JSXExpressionContainer')
-        return children[0].expression;
-    return types.jsxFragment(types.jsxOpeningFragment(), types.jsxClosingFragment(), children);
+  if (children.length === 1 && children[0].type == "JSXElement")
+    return children[0];
+  if (children.length === 1 && children[0].type == "JSXExpressionContainer")
+    return children[0].expression;
+  return types.jsxFragment(types.jsxOpeningFragment(), types.jsxClosingFragment(), children);
 }
 function removeEmptyText(nodes) {
-    return nodes.filter((node) => !(node.type === 'JSXText' && node.value.trim().length === 0));
+  return nodes.filter((node) => !(node.type === "JSXText" && node.value.trim().length === 0));
 }
 
-module.exports = babel;
-//# sourceMappingURL=babel.js.map
+// babel.ts
+var babel_default2 = babel_default;
+
+module.exports = babel_default2;

package/babel.mjs

@@ -0,0 +1,65 @@
+import { jsxElement, jsxOpeningElement, jsxIdentifier, jsxClosingElement, jsxExpressionContainer, arrowFunctionExpression, jsxFragment, jsxOpeningFragment, jsxClosingFragment } from '@babel/types';
+
+// src/babel/index.ts
+function babel_default() {
+  let hasLegendImport = false;
+  return {
+    visitor: {
+      ImportDeclaration: {
+        enter(path) {
+          if (path.node.source.value === "@legendapp/state/react") {
+            const specifiers = path.node.specifiers;
+            for (let i = 0; i < specifiers.length; i++) {
+              const s = specifiers[i].imported.name;
+              if (!hasLegendImport && (s === "Computed" || s === "Memo" || s === "Show")) {
+                hasLegendImport = true;
+                path.skip();
+                break;
+              }
+            }
+          }
+        }
+      },
+      JSXElement: {
+        enter(path) {
+          if (!hasLegendImport) {
+            path.skip();
+            return;
+          }
+          const openingElement = path.node.openingElement;
+          const name = openingElement.name.name;
+          if (name === "Computed" || name === "Memo" || name === "Show") {
+            const children = removeEmptyText(path.node.children);
+            if (children.length === 0)
+              return;
+            if (children[0].type === "JSXElement" || children[0].type === "JSXExpressionContainer" && children[0].expression.type !== "ArrowFunctionExpression" && children[0].expression.type !== "FunctionExpression" && children[0].expression.type !== "MemberExpression" && children[0].expression.type !== "Identifier") {
+              const attrs = openingElement.attributes;
+              path.replaceWith(
+                jsxElement(
+                  jsxOpeningElement(jsxIdentifier(name), attrs),
+                  jsxClosingElement(jsxIdentifier(name)),
+                  [jsxExpressionContainer(arrowFunctionExpression([], maybeWrapFragment(children)))]
+                )
+              );
+            }
+          }
+        }
+      }
+    }
+  };
+}
+function maybeWrapFragment(children) {
+  if (children.length === 1 && children[0].type == "JSXElement")
+    return children[0];
+  if (children.length === 1 && children[0].type == "JSXExpressionContainer")
+    return children[0].expression;
+  return jsxFragment(jsxOpeningFragment(), jsxClosingFragment(), children);
+}
+function removeEmptyText(nodes) {
+  return nodes.filter((node) => !(node.type === "JSXText" && node.value.trim().length === 0));
+}
+
+// babel.ts
+var babel_default2 = babel_default;
+
+export { babel_default2 as default };

package/config/enable$GetSet.js

@@ -2,23 +2,22 @@
 
 var state = require('@legendapp/state');
 
+// src/config/enable$GetSet.ts
 function enable$GetSet() {
-    state.configureLegendState({
-        observableProperties: {
-            $: {
-                get(node) {
-                    return state.internal.get(node);
-                },
-                set(node, value) {
-                    state.internal.set(node, value);
-                },
-            },
+  state.configureLegendState({
+    observableProperties: {
+      $: {
+        get(node) {
+          return state.internal.get(node);
         },
-    });
+        set(node, value) {
+          state.internal.set(node, value);
+        }
+      }
+    }
+  });
 }
-// TODOv4 deprecate
-const enableDirectAccess = enable$GetSet;
+var enableDirectAccess = enable$GetSet;
 
 exports.enable$GetSet = enable$GetSet;
 exports.enableDirectAccess = enableDirectAccess;
-//# sourceMappingURL=enable$GetSet.js.map

package/config/enable$GetSet.mjs

@@ -1,21 +1,20 @@
 import { configureLegendState, internal } from '@legendapp/state';
 
+// src/config/enable$GetSet.ts
 function enable$GetSet() {
-    configureLegendState({
-        observableProperties: {
-            $: {
-                get(node) {
-                    return internal.get(node);
-                },
-                set(node, value) {
-                    internal.set(node, value);
-                },
-            },
+  configureLegendState({
+    observableProperties: {
+      $: {
+        get(node) {
+          return internal.get(node);
         },
-    });
+        set(node, value) {
+          internal.set(node, value);
+        }
+      }
+    }
+  });
 }
-// TODOv4 deprecate
-const enableDirectAccess = enable$GetSet;
+var enableDirectAccess = enable$GetSet;
 
 export { enable$GetSet, enableDirectAccess };
-//# sourceMappingURL=enable$GetSet.mjs.map

package/config/enableReactComponents.d.mts

@@ -0,0 +1,9 @@
+import { FCReactiveObject } from '@legendapp/state/react';
+
+declare function enableReactComponents(): void;
+declare module '@legendapp/state/react' {
+    interface IReactive extends FCReactiveObject<JSX.IntrinsicElements> {
+    }
+}
+
+export { enableReactComponents };

package/config/enableReactComponents.d.ts

@@ -1,7 +1,9 @@
-/// <reference types="react" />
 import { FCReactiveObject } from '@legendapp/state/react';
-export declare function enableReactComponents(): void;
+
+declare function enableReactComponents(): void;
 declare module '@legendapp/state/react' {
     interface IReactive extends FCReactiveObject<JSX.IntrinsicElements> {
     }
 }
+
+export { enableReactComponents };

package/config/enableReactComponents.js

@@ -2,17 +2,20 @@
 
 var react = require('@legendapp/state/react');
 
+// src/config/enableReactComponents.ts
 function enableReactComponents() {
-    const bindInfo = { value: { handler: 'onChange', getValue: (e) => e.target.value, defaultValue: '' } };
-    const bindInfoInput = Object.assign({ checked: { handler: 'onChange', getValue: (e) => e.target.checked } }, bindInfo);
-    react.configureReactive({
-        binders: {
-            input: bindInfoInput,
-            textarea: bindInfo,
-            select: bindInfo,
-        },
-    });
+  const bindInfo = { value: { handler: "onChange", getValue: (e) => e.target.value, defaultValue: "" } };
+  const bindInfoInput = Object.assign(
+    { checked: { handler: "onChange", getValue: (e) => e.target.checked } },
+    bindInfo
+  );
+  react.configureReactive({
+    binders: {
+      input: bindInfoInput,
+      textarea: bindInfo,
+      select: bindInfo
+    }
+  });
 }
 
 exports.enableReactComponents = enableReactComponents;
-//# sourceMappingURL=enableReactComponents.js.map

package/config/enableReactComponents.mjs

@@ -1,16 +1,19 @@
 import { configureReactive } from '@legendapp/state/react';
 
+// src/config/enableReactComponents.ts
 function enableReactComponents() {
-    const bindInfo = { value: { handler: 'onChange', getValue: (e) => e.target.value, defaultValue: '' } };
-    const bindInfoInput = Object.assign({ checked: { handler: 'onChange', getValue: (e) => e.target.checked } }, bindInfo);
-    configureReactive({
-        binders: {
-            input: bindInfoInput,
-            textarea: bindInfo,
-            select: bindInfo,
-        },
-    });
+  const bindInfo = { value: { handler: "onChange", getValue: (e) => e.target.value, defaultValue: "" } };
+  const bindInfoInput = Object.assign(
+    { checked: { handler: "onChange", getValue: (e) => e.target.checked } },
+    bindInfo
+  );
+  configureReactive({
+    binders: {
+      input: bindInfoInput,
+      textarea: bindInfo,
+      select: bindInfo
+    }
+  });
 }
 
 export { enableReactComponents };
-//# sourceMappingURL=enableReactComponents.mjs.map

package/config/enableReactNativeComponents.d.mts

@@ -0,0 +1,22 @@
+import { FCReactiveObject, FCReactive } from '@legendapp/state/react';
+import { ActivityIndicator, ActivityIndicatorProps, Button, ButtonProps, FlatList, FlatListProps, Image, ImageProps, Pressable, PressableProps, ScrollView, ScrollViewProps, SectionList, SectionListProps, Switch, SwitchProps, Text, TextProps, TextInput, TextInputProps, TouchableWithoutFeedback, TouchableWithoutFeedbackProps, View, ViewProps } from 'react-native';
+
+declare function enableReactNativeComponents(): void;
+declare module '@legendapp/state/react' {
+    interface IReactive extends FCReactiveObject<JSX.IntrinsicElements> {
+        ActivityIndicator: FCReactive<ActivityIndicator, ActivityIndicatorProps>;
+        Button: FCReactive<Button, ButtonProps>;
+        FlatList: FCReactive<FlatList, FlatListProps<any>>;
+        Image: FCReactive<Image, ImageProps>;
+        Pressable: FCReactive<typeof Pressable, PressableProps>;
+        ScrollView: FCReactive<ScrollView, ScrollViewProps>;
+        SectionList: FCReactive<SectionList, SectionListProps<any>>;
+        Switch: FCReactive<Switch, SwitchProps>;
+        Text: FCReactive<Text, TextProps>;
+        TextInput: FCReactive<TextInput, TextInputProps>;
+        TouchableWithoutFeedback: FCReactive<TouchableWithoutFeedback, TouchableWithoutFeedbackProps>;
+        View: FCReactive<View, ViewProps>;
+    }
+}
+
+export { enableReactNativeComponents };

package/config/enableReactNativeComponents.d.ts

@@ -1,7 +1,7 @@
-/// <reference types="react" />
-import { FCReactive, FCReactiveObject } from '@legendapp/state/react';
-import { ActivityIndicator, ActivityIndicatorProps, Button, ButtonProps, FlatList, FlatListProps, Image, ImageProps, Pressable, PressableProps, ScrollView, ScrollViewProps, SectionList, SectionListProps, Switch, SwitchProps, Text, TextInput, TextInputProps, TextProps, TouchableWithoutFeedback, TouchableWithoutFeedbackProps, View, ViewProps } from 'react-native';
-export declare function enableReactNativeComponents(): void;
+import { FCReactiveObject, FCReactive } from '@legendapp/state/react';
+import { ActivityIndicator, ActivityIndicatorProps, Button, ButtonProps, FlatList, FlatListProps, Image, ImageProps, Pressable, PressableProps, ScrollView, ScrollViewProps, SectionList, SectionListProps, Switch, SwitchProps, Text, TextProps, TextInput, TextInputProps, TouchableWithoutFeedback, TouchableWithoutFeedbackProps, View, ViewProps } from 'react-native';
+
+declare function enableReactNativeComponents(): void;
 declare module '@legendapp/state/react' {
     interface IReactive extends FCReactiveObject<JSX.IntrinsicElements> {
         ActivityIndicator: FCReactive<ActivityIndicator, ActivityIndicatorProps>;
@@ -18,3 +18,5 @@ declare module '@legendapp/state/react' {
         View: FCReactive<View, ViewProps>;
     }
 }
+
+export { enableReactNativeComponents };

package/config/enableReactNativeComponents.js

@@ -4,54 +4,50 @@ var react$1 = require('react');
 var react = require('@legendapp/state/react');
 var reactNative = require('react-native');
 
+// src/config/enableReactNativeComponents.ts
 function enableReactNativeComponents() {
-    react.configureReactive({
-        components: {
-            ActivityIndicator: reactNative.ActivityIndicator,
-            Button: reactNative.Button,
-            FlatList: reactNative.FlatList,
-            Image: reactNative.Image,
-            Pressable: reactNative.Pressable,
-            ScrollView: reactNative.ScrollView,
-            SectionList: reactNative.SectionList,
-            Switch: reactNative.Switch,
-            Text: reactNative.Text,
-            TextInput: reactNative.TextInput,
-            TouchableWithoutFeedback: reactNative.TouchableWithoutFeedback,
-            View: reactNative.View,
-        },
-        binders: {
-            TextInput: {
-                value: {
-                    handler: 'onChange',
-                    getValue: (e) => e.nativeEvent.text,
-                    defaultValue: '',
-                },
-            },
-            Switch: {
-                value: {
-                    handler: 'onValueChange',
-                    getValue: (e) => e,
-                    defaultValue: false,
-                },
-            },
-            FlatList: {
-                data: {
-                    selector: (propsOut, p) => {
-                        const state = react$1.useRef(0);
-                        // Increment renderNum whenever the array changes shallowly
-                        const [renderNum, value] = react.useSelector(() => [state.current++, p.get(true)]);
-                        // Set extraData to renderNum so that it will re-render when renderNum changes.
-                        // This is necessary because the observable array is mutable so changes to it
-                        // won't trigger re-renders by default.
-                        propsOut.extraData = renderNum;
-                        return value;
-                    },
-                },
-            },
-        },
-    });
+  react.configureReactive({
+    components: {
+      ActivityIndicator: reactNative.ActivityIndicator,
+      Button: reactNative.Button,
+      FlatList: reactNative.FlatList,
+      Image: reactNative.Image,
+      Pressable: reactNative.Pressable,
+      ScrollView: reactNative.ScrollView,
+      SectionList: reactNative.SectionList,
+      Switch: reactNative.Switch,
+      Text: reactNative.Text,
+      TextInput: reactNative.TextInput,
+      TouchableWithoutFeedback: reactNative.TouchableWithoutFeedback,
+      View: reactNative.View
+    },
+    binders: {
+      TextInput: {
+        value: {
+          handler: "onChange",
+          getValue: (e) => e.nativeEvent.text,
+          defaultValue: ""
+        }
+      },
+      Switch: {
+        value: {
+          handler: "onValueChange",
+          getValue: (e) => e,
+          defaultValue: false
+        }
+      },
+      FlatList: {
+        data: {
+          selector: (propsOut, p) => {
+            const state = react$1.useRef(0);
+            const [renderNum, value] = react.useSelector(() => [state.current++, p.get(true)]);
+            propsOut.extraData = renderNum;
+            return value;
+          }
+        }
+      }
+    }
+  });
 }
 
 exports.enableReactNativeComponents = enableReactNativeComponents;
-//# sourceMappingURL=enableReactNativeComponents.js.map