@multiplatform.one/components 0.7.0 → 0.7.1

package/dist/jsx/code/Code/{index.mjs → index.native.js}

@@ -4,9 +4,11 @@ const Code = styled(Paragraph, {
   name: "Code",
   borderRadius: "$4",
   cursor: "inherit",
+  // @ts-ignore
   fontFamily: Platform.OS === "web" ? "$mono" : void 0,
   lineHeight: 18,
   padding: "$1",
+  // @ts-ignore
   size: "$3",
   tag: "code",
   whiteSpace: "pre",
@@ -18,14 +20,15 @@ const Code = styled(Paragraph, {
       }
     }
   }
-});
-const CodeInline = styled(Paragraph, {
+}), CodeInline = styled(Paragraph, {
   name: "CodeInline",
   backgroundColor: "$background",
   borderRadius: "$3",
   color: "$colorHover",
   cursor: "inherit",
+  // @ts-ignore
   fontFamily: Platform.OS === "web" ? "$mono" : void 0,
+  // @ts-ignore
   fontSize: "85%",
   padding: "$1.5",
   tag: "code"
@@ -34,4 +37,4 @@ export {
   Code,
   CodeInline
 };
-//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.js.map

package/dist/jsx/code/Code/index.native.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/code/Code/index.ts"],
+  "mappings": "AACA,SAAS,WAAW,cAAc;AAClC,SAAS,gBAAgB;AAElB,MAAM,OAAO,OAAO,WAAW;AAAA,EACpC,MAAM;AAAA,EACN,cAAc;AAAA,EACd,QAAQ;AAAA;AAAA,EAER,YAAY,SAAS,OAAO,QAAQ,UAAU;AAAA,EAC9C,YAAY;AAAA,EACZ,SAAS;AAAA;AAAA,EAET,MAAM;AAAA,EACN,KAAK;AAAA,EACL,YAAY;AAAA,EACZ,UAAU;AAAA,IACR,SAAS;AAAA,MACP,MAAM;AAAA,QACJ,iBAAiB;AAAA,QACjB,OAAO;AAAA,MACT;AAAA,IACF;AAAA,EACF;AACF,CAAC,GAEY,aAAa,OAAO,WAAW;AAAA,EAC1C,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,OAAO;AAAA,EACP,QAAQ;AAAA;AAAA,EAER,YAAY,SAAS,OAAO,QAAQ,UAAU;AAAA;AAAA,EAE9C,UAAU;AAAA,EACV,SAAS;AAAA,EACT,KAAK;AACP,CAAC;",
+  "names": []
+}

package/dist/jsx/code/CodeBlock/CodeBlock.stories.js

@@ -5,15 +5,14 @@ const meta = {
   parameters: {
     status: { type: "beta" }
   }
-};
-const main = {
+}, main = {
   args: {
     backgroundColor: "$color2",
-    debug: false,
-    disableCopy: false,
-    isCollapsible: false,
-    isHighlightingLines: true,
-    showLineNumbers: false,
+    debug: !1,
+    disableCopy: !1,
+    isCollapsible: !1,
+    isHighlightingLines: !0,
+    showLineNumbers: !1,
     children: `
 const hello = 'world';
 

package/dist/jsx/code/CodeBlock/CodeBlock.stories.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../../src/code/CodeBlock/CodeBlock.stories.ts"],
-  "mappings": "AAAA,SAAS,iBAAiB;AAG1B,MAAM,OAAa;AAAA,EACjB,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY;AAAA,IACV,QAAQ,EAAE,MAAM,OAAO;AAAA,EACzB;AACF;AAEO,MAAM,OAAmC;AAAA,EAC9C,MAAM;AAAA,IACJ,iBAAiB;AAAA,IACjB,OAAO;AAAA,IACP,aAAa;AAAA,IACb,eAAe;AAAA,IACf,qBAAqB;AAAA,IACrB,iBAAiB;AAAA,IACjB,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOZ;AACF;AAEA,IAAO,4BAAQ;",
+  "mappings": "AAAA,SAAS,iBAAiB;AAG1B,MAAM,OAAa;AAAA,EACjB,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY;AAAA,IACV,QAAQ,EAAE,MAAM,OAAO;AAAA,EACzB;AACF,GAEa,OAAmC;AAAA,EAC9C,MAAM;AAAA,IACJ,iBAAiB;AAAA,IACjB,OAAO;AAAA,IACP,aAAa;AAAA,IACb,eAAe;AAAA,IACf,qBAAqB;AAAA,IACrB,iBAAiB;AAAA,IACjB,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOZ;AACF;AAEA,IAAO,4BAAQ;",
   "names": []
 }

package/dist/jsx/code/CodeBlock/{CodeBlock.stories.mjs → CodeBlock.stories.native.js}

@@ -5,15 +5,14 @@ const meta = {
   parameters: {
     status: { type: "beta" }
   }
-};
-const main = {
+}, main = {
   args: {
     backgroundColor: "$color2",
-    debug: false,
-    disableCopy: false,
-    isCollapsible: false,
-    isHighlightingLines: true,
-    showLineNumbers: false,
+    debug: !1,
+    disableCopy: !1,
+    isCollapsible: !1,
+    isHighlightingLines: !0,
+    showLineNumbers: !1,
     children: `
 const hello = 'world';
 
@@ -28,4 +27,4 @@ export {
   CodeBlock_stories_default as default,
   main
 };
-//# sourceMappingURL=CodeBlock.stories.mjs.map
+//# sourceMappingURL=CodeBlock.stories.js.map

package/dist/jsx/code/CodeBlock/{CodeBlock.stories.mjs.map → CodeBlock.stories.native.js.map}

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../../src/code/CodeBlock/CodeBlock.stories.ts"],
-  "mappings": "AAAA,SAAS,iBAAiB;AAG1B,MAAM,OAAa;AAAA,EACjB,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY;AAAA,IACV,QAAQ,EAAE,MAAM,OAAO;AAAA,EACzB;AACF;AAEO,MAAM,OAAmC;AAAA,EAC9C,MAAM;AAAA,IACJ,iBAAiB;AAAA,IACjB,OAAO;AAAA,IACP,aAAa;AAAA,IACb,eAAe;AAAA,IACf,qBAAqB;AAAA,IACrB,iBAAiB;AAAA,IACjB,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOZ;AACF;AAEA,IAAO,4BAAQ;",
+  "mappings": "AAAA,SAAS,iBAAiB;AAG1B,MAAM,OAAa;AAAA,EACjB,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY;AAAA,IACV,QAAQ,EAAE,MAAM,OAAO;AAAA,EACzB;AACF,GAEa,OAAmC;AAAA,EAC9C,MAAM;AAAA,IACJ,iBAAiB;AAAA,IACjB,OAAO;AAAA,IACP,aAAa;AAAA,IACb,eAAe;AAAA,IACf,qBAAqB;AAAA,IACrB,iBAAiB;AAAA,IACjB,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOZ;AACF;AAEA,IAAO,4BAAQ;",
   "names": []
 }

package/dist/jsx/code/CodeBlock/index.js

@@ -7,8 +7,7 @@ function CodeBlock({ children, language = "tsx", components, debug, ...props })
 ${children?.trim()}
 \`\`\``,
     [children, language]
-  );
-  const value = useMemo(() => ({ ...props, debug }), [props, debug]);
+  ), value = useMemo(() => ({ ...props, debug }), [props, debug]);
   return <MDXCodeBlockContext.Provider value={value}><MDX components={components} debug={debug}>{mdxString}</MDX></MDXCodeBlockContext.Provider>;
 }
 export {

package/dist/jsx/code/CodeBlock/index.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../../src/code/CodeBlock/index.tsx"],
-  "mappings": "AAAA,SAAgB,eAAe;AAG/B,SAAS,WAAW;AACpB,SAAS,2BAA2B;AAO7B,SAAS,UAAU,EAAE,UAAU,WAAW,OAAO,YAAY,OAAO,GAAG,MAAM,GAAmB;AACrG,QAAM,YAAY;AAAA,IAChB,MAAM,SAAS;AAAA,EACjB,UAAU,KAAK;AAAA;AAAA,IAEb,CAAC,UAAU,QAAQ;AAAA,EACrB;AACA,QAAM,QAAQ,QAAQ,OAAO,EAAE,GAAG,OAAO,MAAM,IAAI,CAAC,OAAO,KAAK,CAAC;AACjE,SACE,CAAC,oBAAoB,SAAS,OAAO,OACnC,CAAC,IAAI,YAAY,YAAY,OAAO,QACjC,UACH,EAFC,IAGH,EAJC,oBAAoB;AAMzB;",
+  "mappings": "AAAA,SAAgB,eAAe;AAG/B,SAAS,WAAW;AACpB,SAAS,2BAA2B;AAO7B,SAAS,UAAU,EAAE,UAAU,WAAW,OAAO,YAAY,OAAO,GAAG,MAAM,GAAmB;AACrG,QAAM,YAAY;AAAA,IAChB,MAAM,SAAS,QAAQ;AAAA,EACzB,UAAU,KAAK,CAAC;AAAA;AAAA,IAEd,CAAC,UAAU,QAAQ;AAAA,EACrB,GACM,QAAQ,QAAQ,OAAO,EAAE,GAAG,OAAO,MAAM,IAAI,CAAC,OAAO,KAAK,CAAC;AACjE,SACE,CAAC,oBAAoB,SAAS,OAAO,OACnC,CAAC,IAAI,YAAY,YAAY,OAAO,QACjC,UACH,EAFC,IAGH,EAJC,oBAAoB;AAMzB;",
   "names": []
 }

package/dist/jsx/code/CodeBlock/{index.mjs → index.native.js}

@@ -4,14 +4,13 @@ import { MDXCodeBlockContext } from "../../mdx/MDXCodeBlock/MDXCodeBlockContext"
 function CodeBlock({ children, language = "tsx", components, debug, ...props }) {
   const mdxString = useMemo(
     () => `\`\`\`${language}
-${children?.trim()}
+${children == null ? void 0 : children.trim()}
 \`\`\``,
     [children, language]
-  );
-  const value = useMemo(() => ({ ...props, debug }), [props, debug]);
+  ), value = useMemo(() => ({ ...props, debug }), [props, debug]);
   return <MDXCodeBlockContext.Provider value={value}><MDX components={components} debug={debug}>{mdxString}</MDX></MDXCodeBlockContext.Provider>;
 }
 export {
   CodeBlock
 };
-//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.js.map

package/dist/jsx/code/CodeBlock/index.native.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/code/CodeBlock/index.tsx"],
+  "mappings": "AAAA,SAAgB,eAAe;AAG/B,SAAS,WAAW;AACpB,SAAS,2BAA2B;AAO7B,SAAS,UAAU,EAAE,UAAU,WAAW,OAAO,YAAY,OAAO,GAAG,MAAM,GAAmB;AACrG,QAAM,YAAY;AAAA,IAChB,MAAM,SAAS,QAAQ;AAAA,EACzB,qCAAU,MAAM;AAAA;AAAA,IAEd,CAAC,UAAU,QAAQ;AAAA,EACrB,GACM,QAAQ,QAAQ,OAAO,EAAE,GAAG,OAAO,MAAM,IAAI,CAAC,OAAO,KAAK,CAAC;AACjE,SACE,CAAC,oBAAoB,SAAS,OAAO,OACnC,CAAC,IAAI,YAAY,YAAY,OAAO,QACjC,UACH,EAFC,IAGH,EAJC,oBAAoB;AAMzB;",
+  "names": []
+}

package/dist/jsx/code/Pre/{index.mjs → index.native.js}

@@ -9,4 +9,4 @@ const Pre = styled(YStack, {
 export {
   Pre
 };
-//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.js.map

package/dist/jsx/code/{index.mjs → index.native.js}

@@ -1,4 +1,4 @@
 export * from "./Code";
 export * from "./CodeBlock";
 export * from "./Pre";
-//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.js.map

package/dist/jsx/component/SimpleInput/SimpleInput.stories.js

@@ -0,0 +1,18 @@
+import { SimpleInput } from ".";
+import { YStack } from "tamagui";
+import { Key, Eye } from "@tamagui/lucide-icons";
+var SimpleInput_stories_default = {
+  title: "components/SimpleInput",
+  component: SimpleInput,
+  parameters: { status: { type: "beta" } }
+};
+const password = () => <YStack justifyContent="center" alignItems="center"><SimpleInput password size="$3" iconAfter={Key} passwordWithoutIcon /></YStack>, iconBefore = () => <SimpleInput password width={800} height={50} iconBefore={Key} />, iconAfter = () => <SimpleInput width={250} height={50} iconAfter={Eye} placeholder="icon after input box" />, circular = () => <SimpleInput placeholder="icon after input box" circular password />, passwordWithoutIcon = () => <SimpleInput password passwordWithoutIcon />;
+export {
+  circular,
+  SimpleInput_stories_default as default,
+  iconAfter,
+  iconBefore,
+  password,
+  passwordWithoutIcon
+};
+//# sourceMappingURL=SimpleInput.stories.js.map

package/dist/jsx/component/SimpleInput/SimpleInput.stories.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/component/SimpleInput/SimpleInput.stories.tsx"],
+  "mappings": "AACA,SAAS,mBAAmB;AAC5B,SAAS,cAAc;AACvB,SAAS,KAAK,WAAW;AAEzB,IAAO,8BAAQ;AAAA,EACb,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY,EAAE,QAAQ,EAAE,MAAM,OAAO,EAAE;AACzC;AAEO,MAAM,WAAW,MACtB,CAAC,OAAO,eAAe,SAAS,WAAW,SACzC,CAAC,YAAY,SAAS,KAAK,KAAK,WAAW,KAAK,oBAAoB,EACtE,EAFC,SAKU,aAAa,MAAM,CAAC,YAAY,SAAS,OAAO,KAAK,QAAQ,IAAI,YAAY,KAAK,IAElF,YAAY,MACvB,CAAC,YAAY,OAAO,KAAK,QAAQ,IAAI,WAAW,KAAK,YAAY,uBAAuB,IAG7E,WAAW,MAAM,CAAC,YAAY,YAAY,uBAAuB,SAAS,SAAS,IAEnF,sBAAsB,MAAM,CAAC,YAAY,SAAS,oBAAoB;",
+  "names": []
+}

package/dist/jsx/component/SimpleInput/SimpleInput.stories.native.js

@@ -0,0 +1,18 @@
+import { SimpleInput } from ".";
+import { YStack } from "tamagui";
+import { Key, Eye } from "@tamagui/lucide-icons";
+var SimpleInput_stories_default = {
+  title: "components/SimpleInput",
+  component: SimpleInput,
+  parameters: { status: { type: "beta" } }
+};
+const password = () => <YStack justifyContent="center" alignItems="center"><SimpleInput password size="$3" iconAfter={Key} passwordWithoutIcon /></YStack>, iconBefore = () => <SimpleInput password width={800} height={50} iconBefore={Key} />, iconAfter = () => <SimpleInput width={250} height={50} iconAfter={Eye} placeholder="icon after input box" />, circular = () => <SimpleInput placeholder="icon after input box" circular password />, passwordWithoutIcon = () => <SimpleInput password passwordWithoutIcon />;
+export {
+  circular,
+  SimpleInput_stories_default as default,
+  iconAfter,
+  iconBefore,
+  password,
+  passwordWithoutIcon
+};
+//# sourceMappingURL=SimpleInput.stories.js.map

package/dist/jsx/component/SimpleInput/SimpleInput.stories.native.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/component/SimpleInput/SimpleInput.stories.tsx"],
+  "mappings": "AACA,SAAS,mBAAmB;AAC5B,SAAS,cAAc;AACvB,SAAS,KAAK,WAAW;AAEzB,IAAO,8BAAQ;AAAA,EACb,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY,EAAE,QAAQ,EAAE,MAAM,OAAO,EAAE;AACzC;AAEO,MAAM,WAAW,MACtB,CAAC,OAAO,eAAe,SAAS,WAAW,SACzC,CAAC,YAAY,SAAS,KAAK,KAAK,WAAW,KAAK,oBAAoB,EACtE,EAFC,SAKU,aAAa,MAAM,CAAC,YAAY,SAAS,OAAO,KAAK,QAAQ,IAAI,YAAY,KAAK,IAElF,YAAY,MACvB,CAAC,YAAY,OAAO,KAAK,QAAQ,IAAI,WAAW,KAAK,YAAY,uBAAuB,IAG7E,WAAW,MAAM,CAAC,YAAY,YAAY,uBAAuB,SAAS,SAAS,IAEnF,sBAAsB,MAAM,CAAC,YAAY,SAAS,oBAAoB;",
+  "names": []
+}

package/dist/jsx/component/SimpleInput/index.js

@@ -0,0 +1,114 @@
+import { Button, Input, XGroup, XStack } from "tamagui";
+import { Eye, EyeOff } from "@tamagui/lucide-icons";
+import React, { useEffect } from "react";
+function SimpleInput({
+  value,
+  size,
+  password,
+  iconBefore,
+  iconAfter,
+  height,
+  width,
+  iconStyle,
+  circular,
+  placeholder,
+  iconAfterScale,
+  iconBeforeScale,
+  iconPasswordScale,
+  iconAfterAsButton,
+  iconBeforeAsButton,
+  iconsAsButton,
+  passwordWithoutIcon,
+  paddingHorizontal,
+  onChangeText,
+  ...props
+}) {
+  const [show, setShow] = React.useState(!1), [inputValue, setInputValue] = React.useState(value ?? ""), [borderWidth, setBorderWidth] = React.useState(1), [secureTextEntry, setSecureTextEntry] = React.useState(password), totalIcons = (iconBefore ? 1 : 0) + (iconAfter || password && !passwordWithoutIcon ? 1 : 0), inputValuePadding = iconBefore ? 0 : 24, iconPercentage = totalIcons === 1 ? "20%" : totalIcons === 2 ? "10%" : void 0, inputPercentage = iconPercentage ? "80%" : "100%";
+  useEffect(() => {
+    inputValue && onChangeText && onChangeText(inputValue);
+  }, [inputValue]), useEffect(() => {
+    if (password) {
+      if (show) {
+        setSecureTextEntry(!1);
+        return;
+      }
+      if (!show && password) {
+        setSecureTextEntry(!0);
+        return;
+      }
+    }
+  }, [password, show]);
+  function handleValueChange(text) {
+    setInputValue(text), onChangeText && onChangeText(text);
+  }
+  return <XStack><XGroup
+    {...props}
+    height={size}
+    borderRadius={circular ? 9999999 : props.borderRadius || size}
+    borderWidth={borderWidth}
+    borderColor="$backgroundFocus"
+    minHeight={height || "$5"}
+    width={width || "$20"}
+  >
+    {iconBefore && <Button
+      icon={iconBefore}
+      unstyled={!(iconsAsButton || iconBeforeAsButton)}
+      {...iconStyle}
+      jc="center"
+      ai="center"
+      scaleIcon={iconBeforeScale}
+      width={iconPercentage}
+      height="100%"
+      padding={0}
+    />}
+    <Input
+      onChangeText={handleValueChange}
+      value={inputValue}
+      {...props}
+      size={size}
+      onFocus={(e) => {
+        setBorderWidth(2), props.onFocus?.(e);
+      }}
+      onBlur={(e) => {
+        setBorderWidth(1), props.onBlur?.(e);
+      }}
+      height="100%"
+      placeholder={placeholder}
+      width={inputPercentage}
+      paddingLeft={inputValuePadding}
+      paddingRight={inputValuePadding}
+      unstyled
+      borderWidth={0}
+      paddingHorizontal={paddingHorizontal}
+      secureTextEntry={secureTextEntry}
+    />
+    {!!password && !passwordWithoutIcon && <Button
+      icon={show ? Eye : EyeOff}
+      scaleIcon={iconPasswordScale}
+      height="100%"
+      {...iconStyle}
+      width={iconPercentage}
+      onPress={(e) => {
+        setShow((prev) => !prev), setBorderWidth(2), props.onPress?.(e);
+      }}
+      jc="center"
+      ai="center"
+      padding={0}
+    />}
+    {!!iconAfter && (!password || passwordWithoutIcon) && <Button
+      icon={iconAfter}
+      {...iconStyle}
+      jc="center"
+      ai="center"
+      scaleIcon={iconBeforeScale}
+      width={iconPercentage}
+      unstyled={!(iconsAsButton || iconAfterAsButton)}
+      height="100%"
+      padding={0}
+    />}
+  </XGroup></XStack>;
+}
+export {
+  SimpleInput
+};
+//# sourceMappingURL=index.js.map

package/dist/jsx/component/SimpleInput/index.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/component/SimpleInput/index.tsx"],
+  "mappings": "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",
+  "names": []
+}

package/dist/jsx/component/SimpleInput/index.native.js

@@ -0,0 +1,117 @@
+import { Button, Input, XGroup, XStack } from "tamagui";
+import { Eye, EyeOff } from "@tamagui/lucide-icons";
+import React, { useEffect } from "react";
+function SimpleInput({
+  value,
+  size,
+  password,
+  iconBefore,
+  iconAfter,
+  height,
+  width,
+  iconStyle,
+  circular,
+  placeholder,
+  iconAfterScale,
+  iconBeforeScale,
+  iconPasswordScale,
+  iconAfterAsButton,
+  iconBeforeAsButton,
+  iconsAsButton,
+  passwordWithoutIcon,
+  paddingHorizontal,
+  onChangeText,
+  ...props
+}) {
+  const [show, setShow] = React.useState(!1), [inputValue, setInputValue] = React.useState(value ?? ""), [borderWidth, setBorderWidth] = React.useState(1), [secureTextEntry, setSecureTextEntry] = React.useState(password), totalIcons = (iconBefore ? 1 : 0) + (iconAfter || password && !passwordWithoutIcon ? 1 : 0), inputValuePadding = iconBefore ? 0 : 24, iconPercentage = totalIcons === 1 ? "20%" : totalIcons === 2 ? "10%" : void 0, inputPercentage = iconPercentage ? "80%" : "100%";
+  useEffect(() => {
+    inputValue && onChangeText && onChangeText(inputValue);
+  }, [inputValue]), useEffect(() => {
+    if (password) {
+      if (show) {
+        setSecureTextEntry(!1);
+        return;
+      }
+      if (!show && password) {
+        setSecureTextEntry(!0);
+        return;
+      }
+    }
+  }, [password, show]);
+  function handleValueChange(text) {
+    setInputValue(text), onChangeText && onChangeText(text);
+  }
+  return <XStack><XGroup
+    {...props}
+    height={size}
+    borderRadius={circular ? 9999999 : props.borderRadius || size}
+    borderWidth={borderWidth}
+    borderColor="$backgroundFocus"
+    minHeight={height || "$5"}
+    width={width || "$20"}
+  >
+    {iconBefore && <Button
+      icon={iconBefore}
+      unstyled={!(iconsAsButton || iconBeforeAsButton)}
+      {...iconStyle}
+      jc="center"
+      ai="center"
+      scaleIcon={iconBeforeScale}
+      width={iconPercentage}
+      height="100%"
+      padding={0}
+    />}
+    <Input
+      onChangeText={handleValueChange}
+      value={inputValue}
+      {...props}
+      size={size}
+      onFocus={(e) => {
+        var _a;
+        setBorderWidth(2), (_a = props.onFocus) == null || _a.call(props, e);
+      }}
+      onBlur={(e) => {
+        var _a;
+        setBorderWidth(1), (_a = props.onBlur) == null || _a.call(props, e);
+      }}
+      height="100%"
+      placeholder={placeholder}
+      width={inputPercentage}
+      paddingLeft={inputValuePadding}
+      paddingRight={inputValuePadding}
+      unstyled
+      borderWidth={0}
+      paddingHorizontal={paddingHorizontal}
+      secureTextEntry={secureTextEntry}
+    />
+    {!!password && !passwordWithoutIcon && <Button
+      icon={show ? Eye : EyeOff}
+      scaleIcon={iconPasswordScale}
+      height="100%"
+      {...iconStyle}
+      width={iconPercentage}
+      onPress={(e) => {
+        var _a;
+        setShow((prev) => !prev), setBorderWidth(2), (_a = props.onPress) == null || _a.call(props, e);
+      }}
+      jc="center"
+      ai="center"
+      padding={0}
+    />}
+    {!!iconAfter && (!password || passwordWithoutIcon) && <Button
+      icon={iconAfter}
+      {...iconStyle}
+      jc="center"
+      ai="center"
+      scaleIcon={iconBeforeScale}
+      width={iconPercentage}
+      unstyled={!(iconsAsButton || iconAfterAsButton)}
+      height="100%"
+      padding={0}
+    />}
+  </XGroup></XStack>;
+}
+export {
+  SimpleInput
+};
+//# sourceMappingURL=index.js.map

package/dist/jsx/component/SimpleInput/index.native.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/component/SimpleInput/index.tsx"],
+  "mappings": "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",
+  "names": []
+}

package/dist/jsx/forms/FormCheckBox/{FormCheckBox.stories.mjs → FormCheckBox.stories.native.js}

@@ -32,4 +32,4 @@ export {
   FormCheckBox_stories_default as default,
   main
 };
-//# sourceMappingURL=FormCheckBox.stories.mjs.map
+//# sourceMappingURL=FormCheckBox.stories.js.map

package/dist/jsx/forms/FormCheckBox/index.js

@@ -21,27 +21,8 @@ function FormCheckBox({
   LabelStyle,
   ...checkProps
 }) {
-  const formContext = useFormContext();
-  const id = useId();
-  if (!formContext) {
-    return <YStack space><XStack
-      style={{ alignItems: "center" }}
-      space={CheckBoxElementSizing?.space || "$3"}
-      height={CheckBoxElementSizing?.height}
-      width={CheckBoxElementSizing?.width || "300"}
-      ai="center"
-    >
-      <Checkbox
-        id={id}
-        size={checkBoxElement.size}
-        defaultChecked={checkBoxElement.defaultChecked}
-        value={checkBoxElement.value}
-        {...checkProps}
-      ><Checkbox.Indicator><CheckIcon /></Checkbox.Indicator></Checkbox>
-      <Label size={checkBoxElement.size} htmlFor={id}>{checkBoxElement.label || checkBoxElement.value}</Label>
-    </XStack></YStack>;
-  }
-  return <Controller
+  const formContext = useFormContext(), id = useId();
+  return formContext ? <Controller
     name={name}
     control={control}
     rules={rules}
@@ -67,14 +48,27 @@ function FormCheckBox({
         checked={value}
         {...checkProps}
         onCheckedChange={(e) => {
-          onChange(e);
-          if (checkProps.onCheckedChange)
-            checkProps.onCheckedChange(e);
+          onChange(e), checkProps.onCheckedChange && checkProps.onCheckedChange(e);
         }}
       ><Checkbox.Indicator {...IndicatorStyle}><CheckIcon /></Checkbox.Indicator></Checkbox>
       <Label size={checkBoxElement.size} htmlFor={id} {...LabelStyle}>{checkBoxElement.label || checkBoxElement.value}</Label>
     </XStack></YStack></FormField>}
-  />;
+  /> : <YStack space><XStack
+    style={{ alignItems: "center" }}
+    space={CheckBoxElementSizing?.space || "$3"}
+    height={CheckBoxElementSizing?.height}
+    width={CheckBoxElementSizing?.width || "300"}
+    ai="center"
+  >
+    <Checkbox
+      id={id}
+      size={checkBoxElement.size}
+      defaultChecked={checkBoxElement.defaultChecked}
+      value={checkBoxElement.value}
+      {...checkProps}
+    ><Checkbox.Indicator><CheckIcon /></Checkbox.Indicator></Checkbox>
+    <Label size={checkBoxElement.size} htmlFor={id}>{checkBoxElement.label || checkBoxElement.value}</Label>
+  </XStack></YStack>;
 }
 export {
   FormCheckBox

package/dist/jsx/forms/FormCheckBox/index.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../../src/forms/FormCheckBox/index.tsx"],
-  "mappings": "AACA,SAAS,OAAO,UAAU,QAAQ,cAAc;AAChD,SAAS,YAAY,sBAAsB;AAG3C,SAAS,iBAAiB;AAC1B,SAAgB,aAAa;AAE7B,SAAS,SAAS,iBAAiB;AAyB5B,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiH;AAC/G,QAAM,cAAc,eAAe;AACnC,QAAM,KAAK,MAAM;AACjB,MAAI,CAAC,aAAa;AAChB,WACE,CAAC,OAAO,MACN,CAAC;AAAA,MACC,OAAO,EAAE,YAAY,SAAS;AAAA,MAC9B,OAAO,uBAAuB,SAAS;AAAA,MACvC,QAAQ,uBAAuB;AAAA,MAC/B,OAAO,uBAAuB,SAAS;AAAA,MACvC,GAAG;AAAA;AAAA,MAEH,CAAC;AAAA,QACC,IAAI;AAAA,QACJ,MAAM,gBAAgB;AAAA,QACtB,gBAAgB,gBAAgB;AAAA,QAChC,OAAO,gBAAgB;AAAA,YACnB;AAAA,OAEJ,CAAC,SAAS,UACR,CAAC,UAAU,EACb,EAFC,SAAS,UAGZ,EAVC;AAAA,MAYD,CAAC,MAAM,MAAM,gBAAgB,MAAM,SAAS,KACzC,gBAAgB,SAAS,gBAAgB,MAC5C,EAFC;AAAA,IAGH,EAtBC,OAuBH,EAxBC;AAAA,EA0BL;AACA,SACE,CAAC;AAAA,IACC,MAAM;AAAA,IACN,SAAS;AAAA,IACT,OAAO;AAAA,IACP,cAAc;AAAA,IACd,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAU,MAAM,GAAG,YAAY,EAAE,OAAAA,OAAM,EAAE,MAC3D,CAAC;AAAA,MACC,IAAI;AAAA,MACJ,OAAO,CAAC,CAACA;AAAA,MACT,YAAYA,SAAQA,OAAM,UAAU;AAAA,MACpC,OAAO;AAAA,MACP,UAAU;AAAA,UACN;AAAA,KAEJ,CAAC,OACC,CAAC;AAAA,MACC,YAAY,uBAAuB,MAAM;AAAA,MACzC,OAAO,uBAAuB,SAAS;AAAA,MACvC,QAAQ,uBAAuB;AAAA,MAC/B,OAAO,uBAAuB,SAAS;AAAA;AAAA,MAEvC,CAAC;AAAA,QACC,IAAI;AAAA,QACJ,MAAM,gBAAgB;AAAA,QACtB,gBAAgB,gBAAgB;AAAA,QAChC,OAAO,gBAAgB;AAAA,QACvB,SAAS;AAAA,YACL;AAAA,QACJ,iBAAiB,CAAC,MAAM;AACtB,mBAAS,CAAC;AACV,cAAI,WAAW;AAAiB,uBAAW,gBAAgB,CAAC;AAAA,QAC9D;AAAA,OAEA,CAAC,SAAS,cAAc,gBACtB,CAAC,UAAU,EACb,EAFC,SAAS,UAGZ,EAfC;AAAA,MAgBD,CAAC,MAAM,MAAM,gBAAgB,MAAM,SAAS,QAAQ,aACjD,gBAAgB,SAAS,gBAAgB,MAC5C,EAFC;AAAA,IAGH,EAzBC,OA0BH,EA3BC,OA4BH,EApCC;AAAA,EAsCL;AAEJ;",
+  "mappings": "AACA,SAAS,OAAO,UAAU,QAAQ,cAAc;AAChD,SAAS,YAAY,sBAAsB;AAG3C,SAAS,iBAAiB;AAC1B,SAAgB,aAAa;AAE7B,SAAS,SAAS,iBAAiB;AAyB5B,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiH;AAC/G,QAAM,cAAc,eAAe,GAC7B,KAAK,MAAM;AACjB,SAAK,cA8BH,CAAC;AAAA,IACC,MAAM;AAAA,IACN,SAAS;AAAA,IACT,OAAO;AAAA,IACP,cAAc;AAAA,IACd,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAU,MAAM,GAAG,YAAY,EAAE,OAAAA,OAAM,EAAE,MAC3D,CAAC;AAAA,MACC,IAAI;AAAA,MACJ,OAAO,CAAC,CAACA;AAAA,MACT,YAAYA,SAAQA,OAAM,UAAU;AAAA,MACpC,OAAO;AAAA,MACP,UAAU;AAAA,UACN;AAAA,KAEJ,CAAC,OACC,CAAC;AAAA,MACC,YAAY,uBAAuB,MAAM;AAAA,MACzC,OAAO,uBAAuB,SAAS;AAAA,MACvC,QAAQ,uBAAuB;AAAA,MAC/B,OAAO,uBAAuB,SAAS;AAAA;AAAA,MAEvC,CAAC;AAAA,QACC,IAAI;AAAA,QACJ,MAAM,gBAAgB;AAAA,QACtB,gBAAgB,gBAAgB;AAAA,QAChC,OAAO,gBAAgB;AAAA,QACvB,SAAS;AAAA,YACL;AAAA,QACJ,iBAAiB,CAAC,MAAM;AACtB,mBAAS,CAAC,GACN,WAAW,mBAAiB,WAAW,gBAAgB,CAAC;AAAA,QAC9D;AAAA,OAEA,CAAC,SAAS,cAAc,gBACtB,CAAC,UAAU,EACb,EAFC,SAAS,UAGZ,EAfC;AAAA,MAgBD,CAAC,MAAM,MAAM,gBAAgB,MAAM,SAAS,QAAQ,aACjD,gBAAgB,SAAS,gBAAgB,MAC5C,EAFC;AAAA,IAGH,EAzBC,OA0BH,EA3BC,OA4BH,EApCC;AAAA,EAsCL,KAxEE,CAAC,OAAO,MACN,CAAC;AAAA,IACC,OAAO,EAAE,YAAY,SAAS;AAAA,IAC9B,OAAO,uBAAuB,SAAS;AAAA,IACvC,QAAQ,uBAAuB;AAAA,IAC/B,OAAO,uBAAuB,SAAS;AAAA,IACvC,GAAG;AAAA;AAAA,IAEH,CAAC;AAAA,MACC,IAAI;AAAA,MACJ,MAAM,gBAAgB;AAAA,MACtB,gBAAgB,gBAAgB;AAAA,MAChC,OAAO,gBAAgB;AAAA,UACnB;AAAA,KAEJ,CAAC,SAAS,UACR,CAAC,UAAU,EACb,EAFC,SAAS,UAGZ,EAVC;AAAA,IAYD,CAAC,MAAM,MAAM,gBAAgB,MAAM,SAAS,KACzC,gBAAgB,SAAS,gBAAgB,MAC5C,EAFC;AAAA,EAGH,EAtBC,OAuBH,EAxBC;AA0EP;",
   "names": ["error"]
 }

package/dist/jsx/forms/FormCheckBox/{index.mjs → index.native.js}

@@ -21,27 +21,8 @@ function FormCheckBox({
   LabelStyle,
   ...checkProps
 }) {
-  const formContext = useFormContext();
-  const id = useId();
-  if (!formContext) {
-    return <YStack space><XStack
-      style={{ alignItems: "center" }}
-      space={CheckBoxElementSizing?.space || "$3"}
-      height={CheckBoxElementSizing?.height}
-      width={CheckBoxElementSizing?.width || "300"}
-      ai="center"
-    >
-      <Checkbox
-        id={id}
-        size={checkBoxElement.size}
-        defaultChecked={checkBoxElement.defaultChecked}
-        value={checkBoxElement.value}
-        {...checkProps}
-      ><Checkbox.Indicator><CheckIcon /></Checkbox.Indicator></Checkbox>
-      <Label size={checkBoxElement.size} htmlFor={id}>{checkBoxElement.label || checkBoxElement.value}</Label>
-    </XStack></YStack>;
-  }
-  return <Controller
+  const formContext = useFormContext(), id = useId();
+  return formContext ? <Controller
     name={name}
     control={control}
     rules={rules}
@@ -54,10 +35,10 @@ function FormCheckBox({
       required={required}
       {...fieldProps}
     ><YStack><XStack
-      alignItems={CheckBoxElementSizing?.ai || "center"}
-      space={CheckBoxElementSizing?.space || "$3"}
-      height={CheckBoxElementSizing?.height}
-      width={CheckBoxElementSizing?.width || "300"}
+      alignItems={(CheckBoxElementSizing == null ? void 0 : CheckBoxElementSizing.ai) || "center"}
+      space={(CheckBoxElementSizing == null ? void 0 : CheckBoxElementSizing.space) || "$3"}
+      height={CheckBoxElementSizing == null ? void 0 : CheckBoxElementSizing.height}
+      width={(CheckBoxElementSizing == null ? void 0 : CheckBoxElementSizing.width) || "300"}
     >
       <Checkbox
         id={id}
@@ -67,16 +48,29 @@ function FormCheckBox({
         checked={value}
         {...checkProps}
         onCheckedChange={(e) => {
-          onChange(e);
-          if (checkProps.onCheckedChange)
-            checkProps.onCheckedChange(e);
+          onChange(e), checkProps.onCheckedChange && checkProps.onCheckedChange(e);
         }}
       ><Checkbox.Indicator {...IndicatorStyle}><CheckIcon /></Checkbox.Indicator></Checkbox>
       <Label size={checkBoxElement.size} htmlFor={id} {...LabelStyle}>{checkBoxElement.label || checkBoxElement.value}</Label>
     </XStack></YStack></FormField>}
-  />;
+  /> : <YStack space><XStack
+    style={{ alignItems: "center" }}
+    space={(CheckBoxElementSizing == null ? void 0 : CheckBoxElementSizing.space) || "$3"}
+    height={CheckBoxElementSizing == null ? void 0 : CheckBoxElementSizing.height}
+    width={(CheckBoxElementSizing == null ? void 0 : CheckBoxElementSizing.width) || "300"}
+    ai="center"
+  >
+    <Checkbox
+      id={id}
+      size={checkBoxElement.size}
+      defaultChecked={checkBoxElement.defaultChecked}
+      value={checkBoxElement.value}
+      {...checkProps}
+    ><Checkbox.Indicator><CheckIcon /></Checkbox.Indicator></Checkbox>
+    <Label size={checkBoxElement.size} htmlFor={id}>{checkBoxElement.label || checkBoxElement.value}</Label>
+  </XStack></YStack>;
 }
 export {
   FormCheckBox
 };
-//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.js.map