@workday/canvas-kit-preview-react
Version:
Canvas Kit Preview is made up of components that have the full design and a11y review, are part of the DS ecosystem and are approved for use in product. The API's could be subject to change, but not without strong communication and migration strategies.
106 lines • 4.58 kB
TypeScript
import React from 'react';
export declare const useRadioModel: (<TT_Special_Generic>(config?: (Partial<{
/**
* Use this attribute when you have a `FormField` that is in an `Alert` | `Error` or `Required` state. This will add attach an `aria-describedby` to each radio input so that screen readers can read out the message attached to the form field.
* The value of this attribute needs to match the value passed to `hintId` on the `FormField`.
*
* ```tsx
* <FormField
* error={FormField.ErrorType.Alert}
* hintId="hint-alert"
* hintText="Deep dish is an extra $2.99"
* label="Choose Your Pizza Crust"
* useFieldset={true}
* >
* <RadioGroup
* name="crust"
* onChange={handleChange}
* initialValue={value}
* aria-describedby="hint-alert"
* >
* <RadioGroup.RadioButton value="deep-dish">Deep dish</RadioGroup.RadioButton>
* <RadioGroup.RadioButton value="thin">Thin</RadioGroup.RadioButton>
* <RadioGroup.RadioButton value="gluten-free">Gluten free</RadioGroup.RadioButton>
* <RadioGroup.RadioButton value="cauliflower">Cauliflower</RadioGroup.RadioButton>
* </RadioGroup>
* </FormField>
* ```
*/
'aria-describedby': string | undefined;
/**
* The common `name` passed to all Radio button children of the RadioGroup. This enables you to avoid specifying the `name` for each child.
*/
name: string;
/**
* The selected value of the RadioGroup. Providing this prop will cause the model be in a controlled state
*/
value: string | number | undefined;
/**
* `onChange` handler. Any `onChange` passed to children will be overwritten by this event so that there is only one per group.
*/
onChange(event: React.ChangeEvent<HTMLInputElement>): void;
}> & {} & {}) | undefined) => {
onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
state: {
value: string | number | undefined;
name: string;
'aria-describedby': string | undefined;
inputRef: React.MutableRefObject<HTMLInputElement | undefined>;
};
events: {};
}) & import("@workday/canvas-kit-react/common").ModelExtras<{
/**
* Use this attribute when you have a `FormField` that is in an `Alert` | `Error` or `Required` state. This will add attach an `aria-describedby` to each radio input so that screen readers can read out the message attached to the form field.
* The value of this attribute needs to match the value passed to `hintId` on the `FormField`.
*
* ```tsx
* <FormField
* error={FormField.ErrorType.Alert}
* hintId="hint-alert"
* hintText="Deep dish is an extra $2.99"
* label="Choose Your Pizza Crust"
* useFieldset={true}
* >
* <RadioGroup
* name="crust"
* onChange={handleChange}
* initialValue={value}
* aria-describedby="hint-alert"
* >
* <RadioGroup.RadioButton value="deep-dish">Deep dish</RadioGroup.RadioButton>
* <RadioGroup.RadioButton value="thin">Thin</RadioGroup.RadioButton>
* <RadioGroup.RadioButton value="gluten-free">Gluten free</RadioGroup.RadioButton>
* <RadioGroup.RadioButton value="cauliflower">Cauliflower</RadioGroup.RadioButton>
* </RadioGroup>
* </FormField>
* ```
*/
'aria-describedby': string | undefined;
/**
* The common `name` passed to all Radio button children of the RadioGroup. This enables you to avoid specifying the `name` for each child.
*/
name: string;
/**
* The selected value of the RadioGroup. Providing this prop will cause the model be in a controlled state
*/
value: string | number | undefined;
/**
* `onChange` handler. Any `onChange` passed to children will be overwritten by this event so that there is only one per group.
*/
onChange(event: React.ChangeEvent<HTMLInputElement>): void;
}, {}, {
value: string | number | undefined;
name: string;
'aria-describedby': string | undefined;
inputRef: React.MutableRefObject<HTMLInputElement | undefined>;
}, {}, {
onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
state: {
value: string | number | undefined;
name: string;
'aria-describedby': string | undefined;
inputRef: React.MutableRefObject<HTMLInputElement | undefined>;
};
events: {};
}>;
//# sourceMappingURL=useRadioModel.d.ts.map