added aria label prop and attribute to checkbox

documentation-site/components/yard/config/checkbox.ts

@@ -131,6 +131,12 @@ const CheckboxConfig: TConfig = {
       description: 'Title attribute.',
       hidden: true,
     },
+    ariaLabel: {
+      value: undefined,
+      type: PropTypes.String,
+      description: 'Aria-label attribute',
+      hidden: true,
+    },
     ...pick(changeHandlers, [
       'onBlur',
       'onFocus',

src/checkbox/checkbox.js

@@ -133,6 +133,7 @@ class StatelessCheckbox extends React.Component<PropsT, StatelessStateT> {
       children,
       required,
       title,
+      ariaLabel
     } = this.props;
 
     const {
@@ -228,6 +229,7 @@ class StatelessCheckbox extends React.Component<PropsT, StatelessStateT> {
           name={name}
           checked={checked}
           required={required}
+          aria-label={ariaLabel}
           aria-checked={isIndeterminate ? 'mixed' : checked}
           aria-describedby={this.props['aria-describedby']}
           aria-errormessage={this.props['aria-errormessage']}

src/checkbox/index.d.ts

@@ -103,6 +103,7 @@ export interface CheckboxProps {
   labelPlacement?: 'top' | 'right' | 'bottom' | 'left';
   checkmarkType?: STYLE_TYPE[keyof STYLE_TYPE];
   title?: string;
+  ariaLabel?: string;
   onChange?: React.FormEventHandler<HTMLInputElement>;
   onMouseEnter?: React.MouseEventHandler<HTMLInputElement>;
   onMouseLeave?: React.MouseEventHandler<HTMLInputElement>;

src/checkbox/types.js

@@ -46,6 +46,8 @@ export type PropsT = {
   'aria-describedby'?: string,
   /** Id of element which contains a related error message */
   'aria-errormessage'?: string,
+  /** Passed to the input element aria-label attribute. */
+  ariaLabel?: string,
   /** Component or String value for label of checkbox. */
   children?: React$Node,
   overrides?: OverridesT,