diff --git a/src/components/Checkbox/index.d.ts b/src/components/Checkbox/index.d.ts index 3a5451eb4..076fa4ed3 100644 --- a/src/components/Checkbox/index.d.ts +++ b/src/components/Checkbox/index.d.ts @@ -1,20 +1,16 @@ import * as React from 'react'; -export type CheckboxValue = string | number; - export type CheckboxVariant = 'default' | 'box'; export type CheckboxChecked = boolean | 'partial'; +export type CheckboxValue = string | number; + export interface CheckboxProps { /** * name for the checkbox input */ name?: string; - /** - * checkBox input value - */ - value?: CheckboxValue; variant?: CheckboxVariant; /** * @function onChange called when checkBox onChange event is fired @@ -36,6 +32,10 @@ export interface CheckboxProps { * @deprecated */ inline?: boolean; + /** + * checkBox input value + */ + value?: CheckboxValue; /** * id for the checkbox input */ diff --git a/src/components/Checkbox/index.jsx b/src/components/Checkbox/index.jsx index 83ba0cbe5..461542812 100644 --- a/src/components/Checkbox/index.jsx +++ b/src/components/Checkbox/index.jsx @@ -103,6 +103,10 @@ const Checkbox = ({ }; export const shareCheckboxPropTypes = { + /** + * checkBox input value + */ + value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), /** * id for the checkbox input */ @@ -136,10 +140,6 @@ Checkbox.propTypes = { * name for the checkbox input */ name: PropTypes.string, - /** - * checkBox input value - */ - value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), variant: PropTypes.oneOf(['default', 'box']), /** * @function onChange called when checkBox onChange event is fired diff --git a/src/components/CheckboxGroup/index.d.ts b/src/components/CheckboxGroup/index.d.ts index 638d060c4..66156e5d4 100644 --- a/src/components/CheckboxGroup/index.d.ts +++ b/src/components/CheckboxGroup/index.d.ts @@ -1,6 +1,12 @@ import * as React from 'react'; +export type CheckboxGroupItemValue = string | number; + export interface CheckboxGroupItemProps { + /** + * checkBox input value + */ + value?: CheckboxGroupItemValue; /** * id for the checkbox input */ diff --git a/www/containers/props.json b/www/containers/props.json index 9a2ed4479..e15cb5645 100644 --- a/www/containers/props.json +++ b/www/containers/props.json @@ -1152,6 +1152,21 @@ "displayName": "Checkbox", "methods": [], "props": { + "value": { + "type": { + "name": "union", + "value": [ + { + "name": "string" + }, + { + "name": "number" + } + ] + }, + "required": false, + "description": "checkBox input value" + }, "id": { "type": { "name": "string" @@ -1212,21 +1227,6 @@ "required": false, "description": "name for the checkbox input" }, - "value": { - "type": { - "name": "union", - "value": [ - { - "name": "string" - }, - { - "name": "number" - } - ] - }, - "required": false, - "description": "checkBox input value" - }, "variant": { "type": { "name": "enum", diff --git a/www/examples/CheckboxGroup.mdx b/www/examples/CheckboxGroup.mdx index cb5bce75d..471d55bc0 100644 --- a/www/examples/CheckboxGroup.mdx +++ b/www/examples/CheckboxGroup.mdx @@ -1,5 +1,6 @@ import Props from '../containers/Props.jsx'; import DesignNotes from '../containers/DesignNotes.jsx'; +import { shareCheckboxPropTypes } from '../../src/components/Checkbox/index.jsx'; ## CheckboxGroup @@ -158,9 +159,18 @@ render(Example); ### CheckboxGroup.Item - [props[`src/components/Card/index.jsx`][0]]} /> + [ + { + ...props[`src/components/Checkbox/index.jsx`][0], + props: _.pickBy(props[`src/components/Checkbox/index.jsx`][0].props, (v, k) => + _.keys(shareCheckboxPropTypes).includes(k) + ), + }, + ]} +/>
### CheckboxGroup.All - [props[`src/components/Card/index.jsx`][1]]} /> + [props[`src/components/CheckboxGroup/index.jsx`][1]]} />