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 Input_exports = {};
__export(Input_exports, {
  Input: () => Input
});
module.exports = __toCommonJS(Input_exports);
var import_lucide_icons = require("@tamagui/lucide-icons"), import_react = require("react"), import_react_native = require("react-native-web"), import_tamagui = require("tamagui"), import_Icon = require("./Icon"), import_Spinner = require("./Spinner"), import_typography = require("./typography"), import_jsx_runtime = require("react/jsx-runtime");
const FocusContext = (0, import_react.createContext)({
  focused: !1,
  hasValue: !1,
  setHasValue: () => {
  }
}), StyledContext = (0, import_tamagui.createStyledContext)({
  focused: !1,
  error: !1,
  disabled: !1,
  loading: !1
}), Container = (0, import_tamagui.styled)(import_tamagui.View, {
  name: "Text",
  context: StyledContext,
  height: 56,
  minWidth: 200,
  maxWidth: 350,
  display: "flex",
  flexDirection: "row",
  alignItems: "center",
  pos: "relative",
  disabledStyle: {
    o: 0.4,
    pointerEvents: "none"
  },
  marginTop: 12,
  hoverStyle: {
    brc: "$onSurface",
    btc: "$onSurface",
    bbc: "$onSurface",
    blc: "$onSurface"
  },
  variants: {
    error: {
      true: {
        brc: "$error",
        btc: "$error",
        bbc: "$error",
        blc: "$error",
        hoverStyle: {
          brc: "$onErrorContainer",
          btc: "$onErrorContainer",
          bbc: "$onErrorContainer",
          blc: "$onErrorContainer"
        },
        focusStyle: {
          brc: "$error",
          btc: "$error",
          bbc: "$error",
          blc: "$error"
        }
      }
    },
    disabled: {
      true: {
        brc: "$onSurface",
        btc: "$onSurface",
        bbc: "$onSurface",
        blc: "$onSurface",
        pointerEvents: "none"
      }
    },
    focused: {
      true: {
        brc: "$primary",
        btc: "$primary",
        bbc: "$primary",
        blc: "$primary",
        borderWidth: 2
      }
    },
    variant: {
      outlined: {
        bc: "transparent",
        brc: "$outline",
        btc: "$outline",
        bbc: "$outline",
        blc: "$outline",
        borderWidth: 1,
        borderRadius: "$shape.corner_xs",
        focusStyle: {
          bw: "$0.5"
        }
      }
    }
  },
  defaultVariants: {
    variant: "outlined"
  }
}), Frame = (0, import_tamagui.styled)(import_tamagui.View, {
  name: "InputFrame",
  context: StyledContext
}), FameHOC = Frame.styleable((props, ref) => {
  const [focused, setFocused] = (0, import_react.useState)(!1), [hasValue, setHasValue] = (0, import_react.useState)(!1), value = (0, import_react.useMemo)(
    () => ({ focused, hasValue, setHasValue }),
    [focused, hasValue]
  );
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FocusContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
    Frame,
    {
      ref,
      ...props,
      hasValue,
      focused,
      onFocus: () => {
        setFocused(!0);
      },
      onBlur: () => {
        setFocused(!1);
      }
    }
  ) });
}), Label = (0, import_tamagui.styled)(import_typography.Body, {
  name: "InputLabel",
  context: StyledContext,
  size: "large",
  col: "$onSurfaceVariant",
  pointerEvents: "none",
  hoverStyle: {
    col: "$onSurface"
  },
  focusable: !0,
  left: 16,
  top: 56 / 2 - 12,
  pos: "absolute",
  animateOnly: ["top", "left", "px", "fontSize", "fow"],
  animation: "medium",
  variants: {
    error: {
      true: {
        col: "red",
        hoverStyle: {
          col: "$onErrorContainer"
        }
      }
    },
    disabled: {
      true: {
        opacity: 0.38
      }
    },
    focused: {
      true: {
        col: "$primary",
        size: "medium",
        top: -20,
        left: -1
      }
    },
    hasValue: {
      true: {
        col: "$primary",
        size: "medium",
        top: -20,
        left: -1
      }
    }
  }
}), LabelHOC = Label.styleable((props, ref) => {
  const { focused, hasValue } = (0, import_react.useContext)(FocusContext), { error } = (0, import_react.useContext)(StyledContext);
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
    Label,
    {
      ref,
      ...props,
      focused,
      hasValue,
      error
    }
  );
}), InputText = (0, import_tamagui.styled)(import_react_native.TextInput, {
  name: "InputText",
  context: StyledContext,
  paddingLeft: 16,
  fg: 1,
  variants: {
    error: {
      true: {
        col: "$error"
      }
    }
  }
}), InputTextHOC = InputText.styleable((props, ref) => {
  const { setHasValue } = (0, import_react.useContext)(FocusContext);
  return (0, import_react.useEffect)(() => {
    setHasValue(!!props.value || !!props.placeHolder);
  }, [props.value, props.placeHolder]), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(InputText, { ...props, ref });
}), SupportingText = (0, import_tamagui.styled)(import_typography.Body, {
  name: "InputSupportingText",
  context: StyledContext,
  size: "small",
  col: "$onSurfaceVariant",
  marginLeft: 16,
  marginTop: 4,
  hoverStyle: {
    col: "$onSurfaceVariant"
  },
  variants: {
    disabled: {
      true: {
        opacity: 0.38,
        col: "$onSurface"
      }
    },
    error: {
      true: {
        col: "$error",
        hoverStyle: {
          col: "$error"
        }
      }
    },
    focused: {
      true: {
        col: "$onSurfaceVariant"
      }
    }
  }
}), SupportTextHOC = SupportingText.styleable((props, ref) => {
  const { focused } = (0, import_react.useContext)(FocusContext);
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SupportingText, { ...props, ref, focused });
}), InputSpinner = (0, import_tamagui.styled)(import_Spinner.Spinner, {
  name: "InputSpinner",
  context: StyledContext,
  height: 24,
  marginLeft: 16,
  marginRight: 12,
  display: "none",
  variants: {
    loading: {
      true: {
        display: "block"
      }
    }
  }
}), InputCaret = (0, import_tamagui.styled)(import_lucide_icons.ChevronDown, {
  name: "InputCaret",
  context: StyledContext,
  // height: 24,
  // animateOnly: ["transform"],
  // animation: "medium",
  variants: {
    focused: {
      true: {
        transform: "rotate(180deg)"
      }
    }
  }
}), HOCInputCaret = InputCaret.styleable((props, ref) => {
  const { focused } = (0, import_react.useContext)(FocusContext);
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.View, { marginLeft: 16, marginRight: 12, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(InputCaret, { ...props, ref, focused }) });
}), TrailingIcon = (0, import_tamagui.styled)(import_Icon.Icon, {
  name: "InputTrailingIcon",
  context: StyledContext,
  marginLeft: 16,
  marginRight: 12,
  variants: {
    loading: {
      true: {
        display: "none"
      }
    },
    error: {
      true: {
        col: "$error"
      }
    }
  }
}), Input = (0, import_tamagui.withStaticProperties)(FameHOC, {
  Props: StyledContext.Provider,
  Text: InputTextHOC,
  TrailingIcon,
  Container,
  Label: LabelHOC,
  SupportingText: SupportTextHOC,
  Spinner: InputSpinner,
  InputCaret: HOCInputCaret
});
//# sourceMappingURL=Input.js.map
