import React from "react";
import styled from "styled-components";
import { withTokens } from "../../libs";
const Wrapper = styled.div `
  ${withTokens("spacing-s", "spacing-xxs", "radius-s", "colors-surface-transparent-subdued-default", "colors-content-subdued-default-default")}

  display: flex;
  height: 40px;
  min-width: 328px;
  padding: 0px var(--spacing-s, 16px);
  align-items: center;
  gap: var(--spacing-xxs, 8px);

  border-radius: var(--radius-s, 8px);
  background: var(--colors-surface-transparent-subdued-default, rgba(0, 0, 0, 0.03));
  color: var(--colors-content-subdued-default-default);
  overflow: hidden;
`;
const StyledInput = styled.input `
  background: none;
  cursor: text;
  border: none;
  width: 100%;
`;
export const Input = React.forwardRef(({ type = "text", icon = null, ...props }, ref) => {
    return (React.createElement(Wrapper, null,
        icon,
        React.createElement(StyledInput, { ...props, type: type, ref: ref })));
});
Input.displayName = "Input";
//# sourceMappingURL=Input.js.map