import { filterUndefined } from "../utils/object.js";
import { cs } from "../utils/styles.js";
import { useStyleConfig } from "../core/theme.js";
import styled from "../core/styled.js";
import vui from "../core/vui.js";
import { useInputContext } from "./context.js";
import { jsx } from "react/jsx-runtime";

//#region src/input/inputInput.tsx
const InputInputBase = styled.input`
  align-self: stretch;
  color: sandstone.10;
  background-color: transparent;
  border: none;
  border-radius: none;
  flex: 1;
  font-size: inherit;
  min-width: 0;
  outline: none;
  padding: 0 1;

  &[aria-disabled='true'],
  &[aria-disabled='true']::placeholder {
    cursor: not-allowed;
  }
`;
/** Displays an input element within the Input component. */
const InputInput = vui((props, ref) => {
	const { className, autoComplete, ...rest } = props;
	const mergedProps = {
		...useInputContext(),
		...props
	};
	const styles = useStyleConfig("Input", mergedProps);
	const aliasedProps = filterUndefined({
		"aria-disabled": mergedProps.disabled,
		"aria-label": mergedProps.ariaLabel
	});
	return /* @__PURE__ */ jsx(InputInputBase, {
		autoComplete,
		className: cs("vui-inputInput", className),
		ref,
		...styles.input,
		...aliasedProps,
		...rest
	});
});
InputInput.displayName = "InputInput";

//#endregion
export { InputInputBase, InputInput as default };
globalThis.__vuiVersion__ = "4.0.0-beta.1"
//# sourceMappingURL=inputInput.js.map