@scripso-homepad/ui 0.4.19 → 0.4.20

package/dist/web/index.cjs

@@ -28650,12 +28650,14 @@ var buttonTypography = {
 };
 
 // src/theme/input.ts
-var INPUT_HEIGHT = 52;
+var INPUT_HEIGHT = 56;
 var INPUT_ICON_SIZE = 20;
 var INPUT_ICON_GAP = 10;
 var INPUT_OUTLINE_WIDTH = 2;
-var INPUT_TEXT_LINE_HEIGHT = 19;
+var INPUT_TEXT_LINE_HEIGHT = 20;
 var INPUT_WEB_VERTICAL_PADDING = 14;
+var INPUT_VERTICAL_PADDING = 14;
+var INPUT_HORIZONTAL_PADDING = 16;
 function resolveInputVisualState({
   focused = false,
   error = false,
@@ -28674,8 +28676,7 @@ function createOutlineStyle(ringColor) {
     padding: 0,
     backgroundColor: colors.transparent,
     width: "100%",
-    alignSelf: "stretch",
-    ...reactNative.Platform.OS !== "web" ? { overflow: "hidden" } : null
+    alignSelf: "stretch"
   };
 }
 var defaultOutline = {
@@ -28685,13 +28686,11 @@ var defaultOutline = {
   padding: 0,
   backgroundColor: colors.transparent,
   width: "100%",
-  alignSelf: "stretch",
-  ...reactNative.Platform.OS !== "web" ? { overflow: "hidden" } : null
+  alignSelf: "stretch"
 };
 function getInputFieldStyles(state) {
   const containerBase = {
-    borderRadius: radii.lg,
-    ...reactNative.Platform.OS !== "web" ? { overflow: "hidden" } : null
+    borderRadius: radii.lg
   };
   switch (state) {
     case "disabled":
@@ -28754,12 +28753,15 @@ var inputFieldMetrics = reactNative.StyleSheet.create({
     alignItems: "center",
     height: INPUT_HEIGHT,
     borderRadius: radii.lg,
-    padding: 16,
+    paddingHorizontal: INPUT_HORIZONTAL_PADDING,
+    paddingVertical: INPUT_VERTICAL_PADDING,
     gap: INPUT_ICON_GAP,
+    // Do not clip glyph ascenders (Armenian / tall fonts).
+    overflow: "visible",
     ...reactNative.Platform.OS === "web" ? {
       boxSizing: "border-box",
       paddingVertical: INPUT_WEB_VERTICAL_PADDING,
-      paddingHorizontal: 16
+      paddingHorizontal: INPUT_HORIZONTAL_PADDING
     } : null
   },
   input: {
@@ -28774,8 +28776,7 @@ var inputFieldMetrics = reactNative.StyleSheet.create({
     margin: 0,
     borderWidth: 0,
     backgroundColor: colors.transparent,
-    ...reactNative.Platform.OS === "android" ? { includeFontPadding: false } : null,
-    ...reactNative.Platform.OS === "ios" ? { lineHeight: INPUT_TEXT_LINE_HEIGHT, paddingVertical: 2 } : null,
+    // Leave lineHeight unset so platform font metrics keep placeholder tops visible.
     ...reactNative.Platform.OS === "web" ? {
       alignSelf: "center",
       outlineStyle: "none",
@@ -28787,6 +28788,18 @@ var inputFieldMetrics = reactNative.StyleSheet.create({
   /** Single-line: avoid Android lineHeight jump between placeholder and typed text. */
   inputSingleLine: {
     ...reactNative.Platform.OS === "android" ? { textAlignVertical: "center" } : null
+  },
+  /**
+   * Multiline fields should not flex-fill the container — on iOS a tall TextInput
+   * vertically centers the placeholder.
+   */
+  inputMultiline: {
+    flexGrow: 0,
+    flexShrink: 1,
+    flexBasis: "auto",
+    width: "100%",
+    alignSelf: "stretch",
+    textAlignVertical: "top"
   }
 });
 function hasClassList(node) {
@@ -28919,6 +28932,7 @@ function Input({
   onChangeText,
   keyboardType,
   multiline,
+  textAlign = "left",
   textAlignVertical,
   ...props
 }) {
@@ -28999,7 +29013,7 @@ function Input({
               ref: inputRef,
               style: [
                 inputFieldMetrics.input,
-                !multiline ? inputFieldMetrics.inputSingleLine : null,
+                multiline ? inputFieldMetrics.inputMultiline : inputFieldMetrics.inputSingleLine,
                 fieldStyles.text,
                 style
               ],
@@ -29008,7 +29022,7 @@ function Input({
               keyboardType,
               multiline,
               secureTextEntry: effectiveSecureTextEntry,
-              textAlign: "left",
+              textAlign,
               textAlignVertical: resolvedTextAlignVertical,
               onFocus: handleFocus,
               onBlur: handleBlur,