fix(DataTable): remove hard-coded ID for <Search> (carbon-design-syst…

…em#559) Also made a change to `<Search>` to make `id` prop fully optional. Fixes carbon-design-system#552.
joshblack · Jan 31, 2018 · 9028a15 · 9028a15
1 parent 4aad18b
commit 9028a15
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/src/components/DataTable/DataTable-story.js b/src/components/DataTable/DataTable-story.js
@@ -230,6 +230,7 @@ class BasicDataTable extends Component {
               </DataTableActionList>
             </DataTableBatchActions>
             <DataTableSearch
+              id="id-search"
               onInput={this.searchTable}
               onChange={this.searchTable}
             />

diff --git a/src/components/DataTable/DataTable.js b/src/components/DataTable/DataTable.js
@@ -346,7 +346,6 @@ export const DataTableSearch = props => {
         className={className}
         {...other}
         small
-        id="search-2"
         labelText="Filter table"
         placeHolderText="Search"
         onChange={onChange}

diff --git a/src/components/Search/Search.js b/src/components/Search/Search.js
@@ -117,7 +117,11 @@ export default class Search extends Component {
     const {
       className,
       type,
-      id,
+      id = (this._inputId =
+        this._inputId ||
+        `search__input__id_${Math.random()
+          .toString(36)
+          .substr(2)}`),
       placeHolderText,
       labelText,
       small,