feat: remove unused label import in component, show label usage in story

trussworks · May 26, 2020 · 56bb01e · 56bb01e
1 parent a6e5fb5
commit 56bb01e
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 5 deletions.
diff --git a/src/components/forms/RangeInput/RangeInput.stories.tsx b/src/components/forms/RangeInput/RangeInput.stories.tsx
@@ -1,5 +1,6 @@
 import React from 'react'
 import { RangeInput } from './RangeInput'
+import { Label } from '../Label/Label'
 
 export default {
   title: 'Forms/RangeInput',
@@ -18,15 +19,20 @@ const labelChildren = (
       <span>Start:</span> <span>0</span>
     </div>
     <div>
-      <span>End:</span> <span>10</span>
+      <span>End:</span> <span>100</span>
     </div>
   </>
 )
 
-const labelHint = <>(Some hint)</>
+const labelHint = <>(drag to adjust or use arrow keys)</>
 
 export const defaultRange = (): React.ReactElement => (
-  <RangeInput id="range-slider" name="range" />
+  <>
+    <Label htmlFor="range-slider" hint={labelHint}>
+      {labelChildren}
+    </Label>
+    <RangeInput id="range-slider" name="range" />
+  </>
 )
 
 export const customRange = (): React.ReactElement => (

diff --git a/src/components/forms/RangeInput/RangeInput.tsx b/src/components/forms/RangeInput/RangeInput.tsx
@@ -1,8 +1,6 @@
 import React from 'react'
 import classnames from 'classnames'
 
-import { Label } from '../Label/Label'
-
 interface RangeInputProps {
   id: string
   name: string