(function() {
  var GlassSurface = window.GlassSurface;
  var GlassIcons = window.GlassIcons;

  function GlassSearchBar(props) {
    var value = props.value;
    var onChange = props.onChange;
    var placeholder = props.placeholder || 'Search';
    var className = props.className || '';

    return React.createElement(GlassSurface, {
      elevation: 1,
      radius: 'pill',
      className: 'glass-search ' + className,
      tone: 'adaptive'
    },
      GlassIcons && React.createElement(GlassIcons.Search, { className: 'glass-search-icon' }),
      React.createElement('input', {
        className: 'glass-input',
        type: 'search',
        value: value,
        onChange: onChange,
        placeholder: placeholder,
        'aria-label': placeholder
      })
    );
  }

  window.GlassSearchBar = GlassSearchBar;
})();