@tamagui/input 1.97.0

package/dist/cjs/shared.native.js

@@ -0,0 +1,152 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: !0 });
+}, __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function")
+    for (let key of __getOwnPropNames(from))
+      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
+var shared_exports = {};
+__export(shared_exports, {
+  INPUT_NAME: () => INPUT_NAME,
+  defaultStyles: () => defaultStyles,
+  inputSizeVariant: () => inputSizeVariant,
+  styledBody: () => styledBody,
+  textAreaSizeVariant: () => textAreaSizeVariant
+});
+module.exports = __toCommonJS(shared_exports);
+var import_core = require("@tamagui/core"), import_core2 = require("@tamagui/core"), import_get_button_sized = require("@tamagui/get-button-sized"), import_get_font_sized = require("@tamagui/get-font-sized"), import_get_token = require("@tamagui/get-token");
+function _define_property(obj, key, value) {
+  return key in obj ? Object.defineProperty(obj, key, {
+    value,
+    enumerable: !0,
+    configurable: !0,
+    writable: !0
+  }) : obj[key] = value, obj;
+}
+function _object_spread(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i] != null ? arguments[i] : {}, ownKeys2 = Object.keys(source);
+    typeof Object.getOwnPropertySymbols == "function" && (ownKeys2 = ownKeys2.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+    }))), ownKeys2.forEach(function(key) {
+      _define_property(target, key, source[key]);
+    });
+  }
+  return target;
+}
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    enumerableOnly && (symbols = symbols.filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _object_spread_props(target, source) {
+  return source = source ?? {}, Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
+    Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+  }), target;
+}
+var defaultStyles = _object_spread_props(_object_spread({
+  size: "$true",
+  fontFamily: "$body",
+  borderWidth: 1,
+  outlineWidth: 0,
+  color: "$color"
+}, import_core2.isWeb ? {
+  tabIndex: 0
+} : {
+  focusable: !0
+}), {
+  borderColor: "$borderColor",
+  backgroundColor: "$background",
+  // this fixes a flex bug where it overflows container
+  minWidth: 0,
+  hoverStyle: {
+    borderColor: "$borderColorHover"
+  },
+  focusStyle: {
+    borderColor: "$borderColorFocus"
+  },
+  focusVisibleStyle: {
+    outlineColor: "$outlineColor",
+    outlineWidth: 2,
+    outlineStyle: "solid"
+  }
+}), inputSizeVariant = function() {
+  var val = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "$true", extras = arguments.length > 1 ? arguments[1] : void 0;
+  if (extras.props.multiline || extras.props.numberOfLines > 1)
+    return textAreaSizeVariant(val, extras);
+  var buttonStyles = (0, import_get_button_sized.getButtonSized)(val, extras), paddingHorizontal = (0, import_get_token.getSpace)(val, {
+    shift: -1,
+    bounds: [
+      2
+    ]
+  }), fontStyle = (0, import_get_font_sized.getFontSized)(val, extras);
+  return !import_core2.isWeb && fontStyle && delete fontStyle.lineHeight, _object_spread_props(_object_spread({}, fontStyle, buttonStyles), {
+    paddingHorizontal
+  });
+}, textAreaSizeVariant = function() {
+  var val = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "$true", extras = arguments.length > 1 ? arguments[1] : void 0, props = extras.props, buttonStyles = (0, import_get_button_sized.getButtonSized)(val, extras), fontStyle = (0, import_get_font_sized.getFontSized)(val, extras), _props_rows, lines = (_props_rows = props.rows) !== null && _props_rows !== void 0 ? _props_rows : props.numberOfLines, height = typeof lines == "number" ? lines * (0, import_core2.getVariableValue)(fontStyle.lineHeight) : "auto", paddingVertical = (0, import_get_token.getSpace)(val, {
+    shift: -2,
+    bounds: [
+      2
+    ]
+  }), paddingHorizontal = (0, import_get_token.getSpace)(val, {
+    shift: -1,
+    bounds: [
+      2
+    ]
+  });
+  return _object_spread_props(_object_spread({}, buttonStyles, fontStyle), {
+    paddingVertical,
+    paddingHorizontal,
+    height
+  });
+}, INPUT_NAME = "Input", styledBody = [
+  {
+    name: INPUT_NAME,
+    tag: "input",
+    variants: {
+      unstyled: {
+        false: defaultStyles
+      },
+      size: {
+        "...size": inputSizeVariant
+      },
+      disabled: {
+        true: {}
+      }
+    },
+    defaultVariants: {
+      unstyled: process.env.TAMAGUI_HEADLESS === "1"
+    }
+  },
+  {
+    isInput: !0,
+    accept: {
+      placeholderTextColor: "color",
+      selectionColor: "color"
+    },
+    validStyles: _object_spread({}, import_core.validStyles, import_core.stylePropsTextOnly)
+  }
+];
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  INPUT_NAME,
+  defaultStyles,
+  inputSizeVariant,
+  styledBody,
+  textAreaSizeVariant
+});
+//# sourceMappingURL=shared.js.map

package/dist/cjs/shared.native.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/Users/n8/tamagui/packages/input/src/shared.tsx"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AACA,kBAAgD,0BAChDA,eAAwC,0BACxC,0BAA+B,sCAC/B,wBAA6B,oCAC7B,mBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAElB,IAAMC,gBAAgB,qBAAA,eAAA;EAC3BC,MAAM;EACNC,YAAY;EACZC,aAAa;EACbC,cAAc;EACdC,OAAO;GAEHC,qBACA;EACEC,UAAU;AACZ,IACA;EACEC,WAAW;AACb,CAAA,GAAA;EAEJC,aAAa;EACbC,iBAAiB;;EAGjBC,UAAU;EAEVC,YAAY;IACVH,aAAa;EACf;EAEAI,YAAY;IACVJ,aAAa;EACf;EAEAK,mBAAmB;IACjBC,cAAc;IACdX,cAAc;IACdY,cAAc;EAChB;IAGWC,mBAAmD,WAAA;MAC9DC,MAAAA,UAAAA,SAAAA,KAAAA,UAAAA,CAAAA,MAAAA,SAAAA,UAAAA,CAAAA,IAAM,SACNC,SAAAA,UAAAA,SAAAA,IAAAA,UAAAA,CAAAA,IAAAA;AAEA,MAAIA,OAAOC,MAAMC,aAAaF,OAAOC,MAAME,gBAAgB;AACzD,WAAOC,oBAAoBL,KAAKC,MAAAA;AAElC,MAAMK,mBAAeC,wCAAeP,KAAKC,MAAAA,GACnCO,wBAAoBC,2BAAST,KAAK;IACtCU,OAAO;IACPC,QAAQ;MAAC;;EACX,CAAA,GACMC,gBAAYC,oCAAab,KAAYC,MAAAA;AAE3C,SAAI,CAACb,sBAASwB,aACZ,OAAOA,UAAU,YAEZ,qBAAA,eAAA,CAAA,GACFA,WACAN,YAAAA,GAAAA;IACHE;;AAEJ,GAEaH,sBAAsD,WAAA;MACjEL,MAAAA,UAAAA,SAAAA,KAAAA,UAAAA,CAAAA,MAAAA,SAAAA,UAAAA,CAAAA,IAAM,SACNC,SAAAA,UAAAA,SAAAA,IAAAA,UAAAA,CAAAA,IAAAA,QAEQC,QAAUD,OAAVC,OACFI,mBAAeC,wCAAeP,KAAKC,MAAAA,GACnCW,gBAAYC,oCAAab,KAAYC,MAAAA,GAC7BC,aAARY,SAAQZ,cAAAA,MAAMa,UAAI,QAAVb,gBAAAA,SAAAA,cAAcA,MAAME,eAC5BY,SACJ,OAAOF,SAAU,WAAWA,YAAQG,+BAAiBL,UAAUM,UAAU,IAAI,QACzEC,sBAAkBV,2BAAST,KAAK;IACpCU,OAAO;IACPC,QAAQ;MAAC;;EACX,CAAA,GACMH,wBAAoBC,2BAAST,KAAK;IACtCU,OAAO;IACPC,QAAQ;MAAC;;EACX,CAAA;AACA,SAAO,qBAAA,eAAA,CAAA,GACFL,cACAM,SAAAA,GAAAA;IACHO;IACAX;IACAQ;;AAEJ,GACaI,aAAa,SAEbC,aAAa;EACxB;IACEC,MAAMF;IACNG,KAAK;IACLC,UAAU;MACRC,UAAU;QACRC,OAAO5C;MACT;MAEAC,MAAM;QACJ,WAAWgB;MACb;MAEA4B,UAAU;QACRC,MAAM,CAAC;MACT;IACF;IAEAC,iBAAiB;MACfJ,UAAUK,QAAQC,IAAIC,qBAAqB;IAC7C;EACF;EACA;IACEC,SAAS;IACTC,QAAQ;MACNC,sBAAsB;MACtBC,gBAAgB;IAClB;IACAC,aAAa,eAAA,CAAA,GACRA,yBACAC,8BAAAA;EAEP;;",
+  "names": ["import_core", "defaultStyles", "size", "fontFamily", "borderWidth", "outlineWidth", "color", "isWeb", "tabIndex", "focusable", "borderColor", "backgroundColor", "minWidth", "hoverStyle", "focusStyle", "focusVisibleStyle", "outlineColor", "outlineStyle", "inputSizeVariant", "val", "extras", "props", "multiline", "numberOfLines", "textAreaSizeVariant", "buttonStyles", "getButtonSized", "paddingHorizontal", "getSpace", "shift", "bounds", "fontStyle", "getFontSized", "lines", "rows", "height", "getVariableValue", "lineHeight", "paddingVertical", "INPUT_NAME", "styledBody", "name", "tag", "variants", "unstyled", "false", "disabled", "true", "defaultVariants", "process", "env", "TAMAGUI_HEADLESS", "isInput", "accept", "placeholderTextColor", "selectionColor", "validStyles", "stylePropsTextOnly"]
+}

package/dist/cjs/types.js

@@ -0,0 +1,14 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function")
+    for (let key of __getOwnPropNames(from))
+      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);
+//# sourceMappingURL=types.js.map

package/dist/cjs/types.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/types.ts"],
+  "mappings": ";;;;;;;;;;;AAAA;AAAA;",
+  "names": []
+}

package/dist/cjs/types.native.js

@@ -0,0 +1,15 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function")
+    for (let key of __getOwnPropNames(from))
+      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);
+//# sourceMappingURL=types.js.map

package/dist/cjs/types.native.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/Users/n8/tamagui/packages/input/src/types.ts"],
+  "mappings": ";;;;;;;;;;;;AAQA;;",
+  "names": []
+}

package/dist/esm/Input.js

@@ -0,0 +1,117 @@
+import { View, styled, useComposedRefs, useEvent, useTheme } from "@tamagui/core";
+import { registerFocusable } from "@tamagui/focusable";
+import React, { useEffect } from "react";
+import { styledBody } from "./shared";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+const StyledInput = styled(View, styledBody[0], styledBody[1]), Input = StyledInput.styleable((inProps, forwardedRef) => {
+  const {
+    // some of destructed props are just to avoid passing them to ...rest because they are not in web.
+    allowFontScaling,
+    selectTextOnFocus,
+    showSoftInputOnFocus,
+    textContentType,
+    passwordRules,
+    textBreakStrategy,
+    underlineColorAndroid,
+    selection,
+    lineBreakStrategyIOS,
+    returnKeyLabel,
+    disabled,
+    onSubmitEditing,
+    caretHidden,
+    clearButtonMode,
+    clearTextOnFocus,
+    contextMenuHidden,
+    dataDetectorTypes,
+    id,
+    enablesReturnKeyAutomatically,
+    importantForAutofill,
+    inlineImageLeft,
+    inlineImagePadding,
+    inputAccessoryViewID,
+    keyboardAppearance,
+    keyboardType,
+    cursorColor,
+    disableFullscreenUI,
+    editable,
+    maxFontSizeMultiplier,
+    multiline,
+    numberOfLines,
+    onChangeText,
+    onContentSizeChange,
+    onEndEditing,
+    onScroll,
+    onSelectionChange,
+    caretColor,
+    placeholderTextColor,
+    blurOnSubmit,
+    enterKeyHint,
+    returnKeyType,
+    rejectResponderTermination,
+    scrollEnabled,
+    secureTextEntry,
+    selectionColor,
+    inputMode,
+    ...rest
+  } = inProps, ref = React.useRef(null), theme = useTheme(), composedRefs = useComposedRefs(forwardedRef, ref), _onSelectionChange = useEvent(() => {
+    const start = ref.current?.selectionStart ?? 0, end = ref.current?.selectionEnd ?? 0;
+    onSelectionChange?.({
+      nativeEvent: {
+        selection: {
+          end,
+          start
+        }
+      }
+    });
+  });
+  useEffect(() => {
+    if (onSelectionChange)
+      return ref.current?.addEventListener("selectionchange", _onSelectionChange), () => {
+        ref.current?.removeEventListener("selectionchange", _onSelectionChange);
+      };
+  }, []), useEffect(() => {
+    selection && ref.current?.setSelectionRange(selection.start || null, selection.end || null);
+  }, [selection?.start, selection?.end]);
+  const finalProps = {
+    ...rest,
+    inputMode,
+    disabled,
+    caretColor,
+    id,
+    enterKeyHint,
+    style: {
+      ...rest.style,
+      ...placeholderTextColor && {
+        "--placeholderColor": theme[placeholderTextColor]?.variable || placeholderTextColor
+      },
+      ...selectionColor && {
+        "--selectionColor": theme[selectionColor]?.variable || selectionColor
+      }
+    }
+  };
+  return useEffect(() => {
+    if (id && !disabled)
+      return registerFocusable(id, {
+        focusAndSelect: () => {
+          ref.current?.focus();
+        },
+        focus: () => {
+        }
+      });
+  }, [id, disabled]), /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("style", { children: `
+      input::selection, textarea::selection {
+        background-color: var(--selectionBackground) !important;
+      }
+      
+      input::placeholder, textarea::placeholder {
+        color: var(--placeholderColor) !important;
+      }
+      ` }),
+    /* @__PURE__ */ jsx(StyledInput, { ref: composedRefs, ...finalProps })
+  ] });
+});
+export {
+  Input
+};
+//# sourceMappingURL=Input.js.map

package/dist/esm/Input.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/Input.tsx"],
+  "mappings": "AAAA,SAAS,MAAM,QAAQ,iBAAiB,UAAU,gBAAgB;AAClE,SAAS,yBAAyB;AAClC,OAAO,SAAS,iBAAiB;AACjC,SAAS,kBAAkB;AAyHvB,mBAEI,KAFJ;AAvHJ,MAAM,cAAc,OAAO,MAAM,WAAW,CAAC,GAAG,WAAW,CAAC,CAAC,GAEhD,QAAQ,YAAY,UAAsB,CAAC,SAAS,iBAAiB;AAChF,QAAM;AAAA;AAAA,IAEJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI,SAEE,MAAM,MAAM,OAAyB,IAAI,GACzC,QAAQ,SAAS,GAEjB,eAAe,gBAAgB,cAAc,GAAG,GAEhD,qBAAqB,SAAS,MAAM;AACxC,UAAM,QAAQ,IAAI,SAAS,kBAAkB,GACvC,MAAM,IAAI,SAAS,gBAAgB;AACzC,wBAAoB;AAAA,MAClB,aAAa;AAAA,QACX,WAAW;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAQ;AAAA,EACV,CAAC;AAED,YAAU,MAAM;AACd,QAAI;AACF,iBAAI,SAAS,iBAAiB,mBAAmB,kBAAkB,GAC5D,MAAM;AACX,YAAI,SAAS,oBAAoB,mBAAmB,kBAAkB;AAAA,MACxE;AAAA,EAEJ,GAAG,CAAC,CAAC,GAEL,UAAU,MAAM;AACd,IAAI,aACF,IAAI,SAAS,kBAAkB,UAAU,SAAS,MAAM,UAAU,OAAO,IAAI;AAAA,EAEjF,GAAG,CAAC,WAAW,OAAO,WAAW,GAAG,CAAC;AAErC,QAAM,aAAa;AAAA,IACjB,GAAG;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,MACL,GAAI,KAAK;AAAA,MACT,GAAI,wBAAwB;AAAA,QAC1B,sBACE,MAAM,oBAAoB,GAAG,YAAY;AAAA,MAC7C;AAAA,MACA,GAAI,kBAAkB;AAAA,QACpB,oBAAoB,MAAM,cAAc,GAAG,YAAY;AAAA,MACzD;AAAA,IACF;AAAA,EACF;AAEA,mBAAU,MAAM;AACd,QAAK,MACD;AAEJ,aAAO,kBAAkB,IAAI;AAAA,QAC3B,gBAAgB,MAAM;AACpB,cAAI,SAAS,MAAM;AAAA,QACrB;AAAA,QACA,OAAO,MAAM;AAAA,QAAC;AAAA,MAChB,CAAC;AAAA,EACH,GAAG,CAAC,IAAI,QAAQ,CAAC,GAGf,iCAEI;AAAA,wBAAC,WACE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SASH;AAAA,IAEF,oBAAC,eAAY,KAAK,cAAe,GAAG,YAAY;AAAA,KAClD;AAEJ,CAAC;",
+  "names": []
+}

package/dist/esm/Input.mjs

@@ -0,0 +1,121 @@
+import { View, styled, useComposedRefs, useEvent, useTheme } from "@tamagui/core";
+import { registerFocusable } from "@tamagui/focusable";
+import React, { useEffect } from "react";
+import { styledBody } from "./shared.mjs";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+const StyledInput = styled(View, styledBody[0], styledBody[1]),
+  Input = StyledInput.styleable((inProps, forwardedRef) => {
+    const {
+        // some of destructed props are just to avoid passing them to ...rest because they are not in web.
+        allowFontScaling,
+        selectTextOnFocus,
+        showSoftInputOnFocus,
+        textContentType,
+        passwordRules,
+        textBreakStrategy,
+        underlineColorAndroid,
+        selection,
+        lineBreakStrategyIOS,
+        returnKeyLabel,
+        disabled,
+        onSubmitEditing,
+        caretHidden,
+        clearButtonMode,
+        clearTextOnFocus,
+        contextMenuHidden,
+        dataDetectorTypes,
+        id,
+        enablesReturnKeyAutomatically,
+        importantForAutofill,
+        inlineImageLeft,
+        inlineImagePadding,
+        inputAccessoryViewID,
+        keyboardAppearance,
+        keyboardType,
+        cursorColor,
+        disableFullscreenUI,
+        editable,
+        maxFontSizeMultiplier,
+        multiline,
+        numberOfLines,
+        onChangeText,
+        onContentSizeChange,
+        onEndEditing,
+        onScroll,
+        onSelectionChange,
+        caretColor,
+        placeholderTextColor,
+        blurOnSubmit,
+        enterKeyHint,
+        returnKeyType,
+        rejectResponderTermination,
+        scrollEnabled,
+        secureTextEntry,
+        selectionColor,
+        inputMode,
+        ...rest
+      } = inProps,
+      ref = React.useRef(null),
+      theme = useTheme(),
+      composedRefs = useComposedRefs(forwardedRef, ref),
+      _onSelectionChange = useEvent(() => {
+        const start = ref.current?.selectionStart ?? 0,
+          end = ref.current?.selectionEnd ?? 0;
+        onSelectionChange?.({
+          nativeEvent: {
+            selection: {
+              end,
+              start
+            }
+          }
+        });
+      });
+    useEffect(() => {
+      if (onSelectionChange) return ref.current?.addEventListener("selectionchange", _onSelectionChange), () => {
+        ref.current?.removeEventListener("selectionchange", _onSelectionChange);
+      };
+    }, []), useEffect(() => {
+      selection && ref.current?.setSelectionRange(selection.start || null, selection.end || null);
+    }, [selection?.start, selection?.end]);
+    const finalProps = {
+      ...rest,
+      inputMode,
+      disabled,
+      caretColor,
+      id,
+      enterKeyHint,
+      style: {
+        ...rest.style,
+        ...(placeholderTextColor && {
+          "--placeholderColor": theme[placeholderTextColor]?.variable || placeholderTextColor
+        }),
+        ...(selectionColor && {
+          "--selectionColor": theme[selectionColor]?.variable || selectionColor
+        })
+      }
+    };
+    return useEffect(() => {
+      if (id && !disabled) return registerFocusable(id, {
+        focusAndSelect: () => {
+          ref.current?.focus();
+        },
+        focus: () => {}
+      });
+    }, [id, disabled]), /* @__PURE__ */jsxs(Fragment, {
+      children: [/* @__PURE__ */jsx("style", {
+        children: `
+      input::selection, textarea::selection {
+        background-color: var(--selectionBackground) !important;
+      }
+      
+      input::placeholder, textarea::placeholder {
+        color: var(--placeholderColor) !important;
+      }
+      `
+      }), /* @__PURE__ */jsx(StyledInput, {
+        ref: composedRefs,
+        ...finalProps
+      })]
+    });
+  });
+export { Input };

package/dist/esm/Input.native.js

@@ -0,0 +1,145 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { styled, useComposedRefs } from "@tamagui/core";
+import { registerFocusable } from "@tamagui/focusable";
+import React, { useEffect } from "react";
+import { TextInput } from "react-native";
+import { styledBody } from "./shared";
+function _define_property(obj, key, value) {
+  return key in obj ? Object.defineProperty(obj, key, {
+    value,
+    enumerable: !0,
+    configurable: !0,
+    writable: !0
+  }) : obj[key] = value, obj;
+}
+function _object_spread(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i] != null ? arguments[i] : {}, ownKeys2 = Object.keys(source);
+    typeof Object.getOwnPropertySymbols == "function" && (ownKeys2 = ownKeys2.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+    }))), ownKeys2.forEach(function(key) {
+      _define_property(target, key, source[key]);
+    });
+  }
+  return target;
+}
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    enumerableOnly && (symbols = symbols.filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _object_spread_props(target, source) {
+  return source = source ?? {}, Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
+    Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+  }), target;
+}
+function _object_without_properties(source, excluded) {
+  if (source == null)
+    return {};
+  var target = _object_without_properties_loose(source, excluded), key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++)
+      key = sourceSymbolKeys[i], !(excluded.indexOf(key) >= 0) && Object.prototype.propertyIsEnumerable.call(source, key) && (target[key] = source[key]);
+  }
+  return target;
+}
+function _object_without_properties_loose(source, excluded) {
+  if (source == null)
+    return {};
+  var target = {}, sourceKeys = Object.keys(source), key, i;
+  for (i = 0; i < sourceKeys.length; i++)
+    key = sourceKeys[i], !(excluded.indexOf(key) >= 0) && (target[key] = source[key]);
+  return target;
+}
+var StyledInput = styled(TextInput, styledBody[0], styledBody[1]), Input = StyledInput.styleable(function(inProps, forwardedRef) {
+  var type = inProps.type, dirname = inProps.dirname, max = inProps.max, min = inProps.min, minLength = inProps.minLength, multiple = inProps.multiple, name = inProps.name, required = inProps.required, step = inProps.step, disabled = inProps.disabled, id = inProps.id, caretColor = inProps.caretColor, onChange = inProps.onChange, onInput = inProps.onInput, rows = inProps.rows, enterKeyHint = inProps.enterKeyHint, returnKeyType = inProps.returnKeyType, onKeyDown = inProps.onKeyDown, inputMode = inProps.inputMode, tag = inProps.tag, rest = _object_without_properties(inProps, [
+    "type",
+    "dirname",
+    "max",
+    "min",
+    "minLength",
+    "multiple",
+    "name",
+    "required",
+    "step",
+    "disabled",
+    "id",
+    "caretColor",
+    "onChange",
+    "onInput",
+    "rows",
+    "enterKeyHint",
+    "returnKeyType",
+    "onKeyDown",
+    "inputMode",
+    "tag"
+  ]), ref = React.useRef(null), composedRefs = useComposedRefs(forwardedRef, ref), secureTextEntry = !1, cursorColor = caretColor, _returnKeyType = returnKeyType, _enterKeyHint = enterKeyHint;
+  enterKeyHint === "go" && (_returnKeyType = "go", _enterKeyHint = void 0);
+  var _inputMode = inputMode;
+  type === "email" ? _inputMode = "email" : type === "tel" ? _inputMode = "tel" : type === "search" ? _inputMode = "search" : type === "url" ? _inputMode = "url" : type === "password" ? (secureTextEntry = !0, _inputMode = "text") : type === "number" ? _inputMode = "numeric" : _inputMode = "text";
+  var showSoftInputOnFocus = !0;
+  inputMode === "none" && (showSoftInputOnFocus = !1);
+  var finalProps = _object_spread_props(_object_spread({}, rest), {
+    inputMode: _inputMode,
+    showSoftInputOnFocus,
+    disabled,
+    id,
+    cursorColor,
+    enterKeyHint: _enterKeyHint,
+    returnKeyType: _returnKeyType,
+    secureTextEntry,
+    numberOfLines: rows || rest.numberOfLines
+  });
+  return tag === "textarea" && (finalProps.multiline = !0), onKeyDown && (finalProps.onKeyPress = function(e) {
+    var key = e.nativeEvent.key;
+    (key === "Backspace" || tag === "textarea" && key === "Enter" || key.length === 1) && onKeyDown({
+      key,
+      type: "keydown"
+    });
+  }, finalProps.onSubmitEditing = function(e) {
+    onKeyDown({
+      key: "Enter",
+      type: "keydown"
+    });
+  }), (onChange || onInput) && (finalProps.onChange = function(e) {
+    var text = e.nativeEvent.text;
+    onChange && onChange({
+      target: {
+        value: text
+      },
+      type: "change"
+    }), onInput != null && onInput({
+      target: {
+        value: text
+      },
+      type: "input"
+    });
+  }), useEffect(function() {
+    if (id && !disabled)
+      return registerFocusable(id, {
+        focusAndSelect: function() {
+          var _ref_current;
+          (_ref_current = ref.current) === null || _ref_current === void 0 || _ref_current.focus();
+        },
+        focus: function() {
+        }
+      });
+  }, [
+    id,
+    disabled
+  ]), /* @__PURE__ */ _jsx(StyledInput, _object_spread({
+    onChange: function(e) {
+    },
+    ref: composedRefs
+  }, finalProps));
+});
+export {
+  Input
+};
+//# sourceMappingURL=Input.native.js.map

package/dist/esm/Input.native.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/Users/n8/tamagui/packages/input/src/Input.native.tsx"],
+  "mappings": "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",
+  "names": ["styled", "useComposedRefs", "registerFocusable", "React", "useEffect", "TextInput", "styledBody", "StyledInput", "Input", "styleable", "inProps", "forwardedRef", "type", "dirname", "max", "min", "minLength", "multiple", "name", "required", "step", "disabled", "id", "caretColor", "onChange", "onInput", "rows", "enterKeyHint", "returnKeyType", "onKeyDown", "inputMode", "tag", "rest", "ref", "useRef", "composedRefs", "secureTextEntry", "cursorColor", "_returnKeyType", "_enterKeyHint", "undefined", "_inputMode", "showSoftInputOnFocus", "finalProps", "numberOfLines", "multiline", "onKeyPress", "e", "key", "nativeEvent", "length", "onSubmitEditing", "text", "target", "value", "focusAndSelect", "current", "focus"]
+}

package/dist/esm/TextArea.js

@@ -0,0 +1,28 @@
+import { styled } from "@tamagui/web";
+import { Input } from "./Input";
+import { defaultStyles, textAreaSizeVariant } from "./shared";
+const TextArea = styled(Input, {
+  name: "TextArea",
+  tag: "textarea",
+  // this attribute fixes firefox newline issue
+  whiteSpace: "pre-wrap",
+  variants: {
+    unstyled: {
+      false: {
+        height: "auto",
+        ...defaultStyles,
+        numberOfLines: 3
+      }
+    },
+    size: {
+      "...size": textAreaSizeVariant
+    }
+  },
+  defaultVariants: {
+    unstyled: process.env.TAMAGUI_HEADLESS === "1"
+  }
+});
+export {
+  TextArea
+};
+//# sourceMappingURL=TextArea.js.map

package/dist/esm/TextArea.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/TextArea.tsx"],
+  "mappings": "AAAA,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,eAAe,2BAA2B;AAC5C,MAAM,WAAW,OAAO,OAAO;AAAA,EACpC,MAAM;AAAA,EACN,KAAK;AAAA;AAAA,EAEL,YAAY;AAAA,EAEZ,UAAU;AAAA,IACR,UAAU;AAAA,MACR,OAAO;AAAA,QACL,QAAQ;AAAA,QACR,GAAG;AAAA,QACH,eAAe;AAAA,MACjB;AAAA,IACF;AAAA,IAEA,MAAM;AAAA,MACJ,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EAEA,iBAAiB;AAAA,IACf,UAAU,QAAQ,IAAI,qBAAqB;AAAA,EAC7C;AACF,CAAC;",
+  "names": []
+}