From f2655c818551895eda5543fab26d822af451535b Mon Sep 17 00:00:00 2001
From: Ouji Miyahara <agagagagagagagagaga@gmail.com>
Date: Fri, 17 Jan 2020 16:35:16 +0900
Subject: [PATCH] fix: change name of Field component (#579)

BREAKING CHANGE: change name of Field to FieldSet
---
 src/components/Field/index.ts                 |  1 -
 .../FieldSet.stories.tsx}                     | 36 +++++++++----------
 .../Field.tsx => FieldSet/FieldSet.tsx}       |  2 +-
 src/components/FieldSet/index.ts              |  1 +
 src/index.ts                                  |  2 +-
 5 files changed, 21 insertions(+), 21 deletions(-)
 delete mode 100644 src/components/Field/index.ts
 rename src/components/{Field/Field.stories.tsx => FieldSet/FieldSet.stories.tsx} (54%)
 rename src/components/{Field/Field.tsx => FieldSet/FieldSet.tsx} (98%)
 create mode 100644 src/components/FieldSet/index.ts

diff --git a/src/components/Field/index.ts b/src/components/Field/index.ts
deleted file mode 100644
index 774392f0e2..0000000000
--- a/src/components/Field/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './Field'
diff --git a/src/components/Field/Field.stories.tsx b/src/components/FieldSet/FieldSet.stories.tsx
similarity index 54%
rename from src/components/Field/Field.stories.tsx
rename to src/components/FieldSet/FieldSet.stories.tsx
index f4436e81b0..6100ef1fdc 100644
--- a/src/components/Field/Field.stories.tsx
+++ b/src/components/FieldSet/FieldSet.stories.tsx
@@ -3,64 +3,64 @@ import { storiesOf } from '@storybook/react'
 import * as React from 'react'
 import styled from 'styled-components'
 
-import { Field } from './Field'
+import { FieldSet } from './FieldSet'
 
-storiesOf('Field', module).add('all', () => (
+storiesOf('FieldSet', module).add('all', () => (
   <List>
     <li>
-      <Field label="string" defaultValue="string" />
+      <FieldSet label="string" defaultValue="string" />
     </li>
     <li>
-      <Field type="number" label="number" defaultValue={1} />
+      <FieldSet type="number" label="number" defaultValue={1} />
     </li>
     <li>
-      <Field type="password" label="password" defaultValue="password" />
+      <FieldSet type="password" label="password" defaultValue="password" />
     </li>
     <li>
-      <Field
+      <FieldSet
         name="sample"
         label="long title.........................................."
         defaultValue="string"
       />
     </li>
     <li>
-      <Field label="required" defaultValue="string" required />
+      <FieldSet label="required" defaultValue="string" required />
     </li>
     <li>
-      <Field label="disabled" disabled />
+      <FieldSet label="disabled" disabled />
     </li>
     <li>
-      <Field label="width" defaultValue="width: 100%" width="100%" />
+      <FieldSet label="width" defaultValue="width: 100%" width="100%" />
     </li>
     <li>
-      <Field label="placeholder" placeholder="placeholder" />
+      <FieldSet label="placeholder" placeholder="placeholder" />
     </li>
     <li>
-      <Field label="onChange" onChange={action('onChange!!')} />
+      <FieldSet label="onChange" onChange={action('onChange!!')} />
     </li>
     <li>
-      <Field label="onBlur" onBlur={action('onBlur!!')} />
+      <FieldSet label="onBlur" onBlur={action('onBlur!!')} />
     </li>
     <li>
-      <Field label="help message" helpMessage="This is help message." width={400} />
+      <FieldSet label="help message" helpMessage="This is help message." width={400} />
     </li>
     <li>
-      <Field label="error message" errorMessage="An error occurred" />
+      <FieldSet label="error message" errorMessage="An error occurred" />
     </li>
     <li>
-      <Field label="custom field">
+      <FieldSet label="custom field">
         <CustomTag>It is a field where tags can be freely inserted.</CustomTag>
-      </Field>
+      </FieldSet>
     </li>
     <li>
-      <Field
+      <FieldSet
         label="custom field"
         errorMessage="custom error"
         helpMessage="This is help message."
         required
       >
         <CustomTag>It is a field where tags can be freely inserted.</CustomTag>
-      </Field>
+      </FieldSet>
     </li>
   </List>
 ))
diff --git a/src/components/Field/Field.tsx b/src/components/FieldSet/FieldSet.tsx
similarity index 98%
rename from src/components/Field/Field.tsx
rename to src/components/FieldSet/FieldSet.tsx
index 84fbfc67d4..36b7e7515e 100644
--- a/src/components/Field/Field.tsx
+++ b/src/components/FieldSet/FieldSet.tsx
@@ -19,7 +19,7 @@ type Props = Omit<InputProps, 'error'> & {
   children?: ReactNode
 }
 
-export const Field: FC<Props> = ({
+export const FieldSet: FC<Props> = ({
   label,
   labelType = 'subBlockTitle',
   labelTagType = 'span',
diff --git a/src/components/FieldSet/index.ts b/src/components/FieldSet/index.ts
new file mode 100644
index 0000000000..59b4f03573
--- /dev/null
+++ b/src/components/FieldSet/index.ts
@@ -0,0 +1 @@
+export * from './FieldSet'
diff --git a/src/index.ts b/src/index.ts
index 0f58a94045..2db88f4f9b 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -3,7 +3,7 @@ export { LightBalloon, DarkBalloon } from './components/Balloon'
 export { CheckBox } from './components/CheckBox'
 export { CheckBoxLabel } from './components/CheckBoxLabel'
 export { Dropdown, DropdownTrigger, DropdownContent, DropdownCloser } from './components/Dropdown'
-export { Field } from './components/Field'
+export { FieldSet } from './components/FieldSet'
 export { FlashMessage } from './components/FlashMessage'
 export { Input } from './components/Input'
 export { Loader } from './components/Loader'