{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"search-field-native","type":"registry:item","title":"Search Field","description":"A compound query input with a search icon, controlled value and a clear button that hides automatically when the field is empty.","files":[{"path":"snippets/native/search-field.tsx","content":"import { useState } from \"react\";\nimport { SearchField } from \"heroui-native\";\n\nexport function SearchFieldExample() {\n  const [searchValue, setSearchValue] = useState(\"\");\n\n  return (\n    <SearchField value={searchValue} onChange={setSearchValue}>\n      <SearchField.Group>\n        <SearchField.SearchIcon />\n        <SearchField.Input />\n        <SearchField.ClearButton />\n      </SearchField.Group>\n    </SearchField>\n  );\n}\n","type":"registry:file","target":"~/snippets/native/search-field.tsx"}],"author":"heroui","dependencies":["heroui-native"]}