@iress-oss/ids-mcp-server 5.15.0 → 5.20.1

package/generated/docs/components_components-radio-docs.md

@@ -0,0 +1,491 @@
+Radio
+=====
+
+Overview
+--------
+
+A radio is a single option presented with a radio button. It is used to select a single option from multiple options. It is typically used in an `IressRadioGroup`.
+
+[](./iframe.html?id=components-radio--default)
+
+Radio button
+
+```
+
+<IressRadio\>
+  Radio button
+</IressRadio\>
+
+```
+
+Props
+-----
+
+| Name | Description | Default | Control |
+| --- | --- | --- | --- |
+| checked | 
+Sets the checked state of the radio. If it is within a radio group, it will be overridden by the radio group's value and whether it matches this radio's value.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| children | 
+
+Label of the radio
+
+ReactNode
+
+
+
+ | \- | 
+
+"Radio button"
+
+ |
+| hiddenControl | 
+
+Sets whether the control is hidden. If it is within a radio group, it will be overridden with the radio group's hiddenControl setting.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| name | 
+
+Sets the name attribute on the radio input. If it is within a radio group, it will be overridden with the radio group's name.
+
+string
+
+
+
+ | \- | Set string |
+| onChange | 
+
+Handles the onChange event of the radio input. If you pass in a non-string value, you can access it using the second parameter of the function.
+
+( e: React.ChangeEvent<HTMLInputElement>, value?: FormControlValue, ) => void
+
+ | \- | \- |
+| required | 
+
+If `true`, the radio is a required field and will be validated as such. If it is within a radio group, it will be overridden with the radio group's required state.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| touch | 
+
+Add the button-like border and padding to radio when `touch` is true.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| value | 
+
+The value which is submitted with the form data when this radio button is checked. To set this radio as checked by default, use the `checked` property.
+
+FormControlValue
+
+
+
+ | \- | Set object |
+
+Examples
+--------
+
+### Checked
+
+You can set the radio to `checked` by default. This is useful when you want to pre-select an option.
+
+**Note:** If you are using an `IressRadioGroup`, you should use the `value` prop on the `IressRadioGroup` to set the checked state of its `<IressRadio />` children, as the `checked` prop will be ignored.
+
+[](./iframe.html?id=components-radio--checked)
+
+Checked radio button
+
+```
+
+<IressRadio checked\>
+  Checked radio button
+</IressRadio\>
+
+```
+
+#### Props
+
+| Name | Description | Default | Control |
+| --- | --- | --- | --- |
+| checked | 
+Sets the checked state of the radio. If it is within a radio group, it will be overridden by the radio group's value and whether it matches this radio's value.
+
+boolean
+
+
+
+ | \- | FalseTrue |
+| children | 
+
+Label of the radio
+
+ReactNode
+
+
+
+ | \- | 
+
+"Checked radio button"
+
+ |
+| hiddenControl | 
+
+Sets whether the control is hidden. If it is within a radio group, it will be overridden with the radio group's hiddenControl setting.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| name | 
+
+Sets the name attribute on the radio input. If it is within a radio group, it will be overridden with the radio group's name.
+
+string
+
+
+
+ | \- | Set string |
+| onChange | 
+
+Handles the onChange event of the radio input. If you pass in a non-string value, you can access it using the second parameter of the function.
+
+( e: React.ChangeEvent<HTMLInputElement>, value?: FormControlValue, ) => void
+
+ | \- | \- |
+| required | 
+
+If `true`, the radio is a required field and will be validated as such. If it is within a radio group, it will be overridden with the radio group's required state.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| touch | 
+
+Add the button-like border and padding to radio when `touch` is true.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| value | 
+
+The value which is submitted with the form data when this radio button is checked. To set this radio as checked by default, use the `checked` property.
+
+FormControlValue
+
+
+
+ | \- | Set object |
+
+### Hidden control
+
+You can hide the radio button and use a custom UI to display the content. Even though the radio button is hidden, it still acts like a radio.
+
+[](./iframe.html?id=components-radio--hidden-control)
+
+Hidden radio button
+
+```
+
+<IressRadio hiddenControl\>
+  <IressPanel\>
+    Hidden radio button  </IressPanel\>
+</IressRadio\>
+
+```
+
+#### Props
+
+| Name | Description | Default | Control |
+| --- | --- | --- | --- |
+| checked | 
+Sets the checked state of the radio. If it is within a radio group, it will be overridden by the radio group's value and whether it matches this radio's value.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| children | 
+
+Label of the radio
+
+ReactNode
+
+
+
+ | \- | \- |
+| hiddenControl | 
+
+Sets whether the control is hidden. If it is within a radio group, it will be overridden with the radio group's hiddenControl setting.
+
+boolean
+
+
+
+ | \- | FalseTrue |
+| name | 
+
+Sets the name attribute on the radio input. If it is within a radio group, it will be overridden with the radio group's name.
+
+string
+
+
+
+ | \- | Set string |
+| onChange | 
+
+Handles the onChange event of the radio input. If you pass in a non-string value, you can access it using the second parameter of the function.
+
+( e: React.ChangeEvent<HTMLInputElement>, value?: FormControlValue, ) => void
+
+ | \- | \- |
+| required | 
+
+If `true`, the radio is a required field and will be validated as such. If it is within a radio group, it will be overridden with the radio group's required state.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| touch | 
+
+Add the button-like border and padding to radio when `touch` is true.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| value | 
+
+The value which is submitted with the form data when this radio button is checked. To set this radio as checked by default, use the `checked` property.
+
+FormControlValue
+
+
+
+ | \- | Set object |
+
+### Readonly
+
+The `readOnly` prop changes how the radio is rendered. It will only render if the radio is checked (alongside a hidden input that contains the `value` if it was set), otherwise it not be rendered.
+
+It is understandable that this may not be the desired behavior for all use cases. If you need a radio that is not editable, but still visible, simply do not set the `readOnly` prop and set the `checked` prop instead.
+
+[](./iframe.html?id=components-radio--readonly)
+
+Radio button
+
+```
+
+<IressStack gutter\="sm"\>
+  <IressRadio
+    defaultChecked
+    readOnly
+  \>
+    Radio button  </IressRadio\>
+  <IressRadio readOnly\>
+    Radio button  </IressRadio\>
+</IressStack\>
+
+```
+
+#### Props
+
+| Name | Description | Default | Control |
+| --- | --- | --- | --- |
+| checked | 
+Sets the checked state of the radio. If it is within a radio group, it will be overridden by the radio group's value and whether it matches this radio's value.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| children | 
+
+Label of the radio
+
+ReactNode
+
+
+
+ | \- | 
+
+"Radio button"
+
+ |
+| hiddenControl | 
+
+Sets whether the control is hidden. If it is within a radio group, it will be overridden with the radio group's hiddenControl setting.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| name | 
+
+Sets the name attribute on the radio input. If it is within a radio group, it will be overridden with the radio group's name.
+
+string
+
+
+
+ | \- | Set string |
+| onChange | 
+
+Handles the onChange event of the radio input. If you pass in a non-string value, you can access it using the second parameter of the function.
+
+( e: React.ChangeEvent<HTMLInputElement>, value?: FormControlValue, ) => void
+
+ | \- | \- |
+| readOnly | 
+
+boolean
+
+
+
+ | \- | FalseTrue |
+| required | 
+
+If `true`, the radio is a required field and will be validated as such. If it is within a radio group, it will be overridden with the radio group's required state.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| touch | 
+
+Add the button-like border and padding to radio when `touch` is true.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| value | 
+
+The value which is submitted with the form data when this radio button is checked. To set this radio as checked by default, use the `checked` property.
+
+FormControlValue
+
+
+
+ | \- | Set object |
+
+### Touch
+
+The `touch` prop adds the button-like border and padding to radio.
+
+[](./iframe.html?id=components-radio--touch)
+
+Radio button
+
+```
+
+<IressRadio touch\>
+  Radio button
+</IressRadio\>
+
+```
+
+#### Props
+
+| Name | Description | Default | Control |
+| --- | --- | --- | --- |
+| checked | 
+Sets the checked state of the radio. If it is within a radio group, it will be overridden by the radio group's value and whether it matches this radio's value.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| children | 
+
+Label of the radio
+
+ReactNode
+
+
+
+ | \- | 
+
+"Radio button"
+
+ |
+| hiddenControl | 
+
+Sets whether the control is hidden. If it is within a radio group, it will be overridden with the radio group's hiddenControl setting.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| name | 
+
+Sets the name attribute on the radio input. If it is within a radio group, it will be overridden with the radio group's name.
+
+string
+
+
+
+ | \- | Set string |
+| onChange | 
+
+Handles the onChange event of the radio input. If you pass in a non-string value, you can access it using the second parameter of the function.
+
+( e: React.ChangeEvent<HTMLInputElement>, value?: FormControlValue, ) => void
+
+ | \- | \- |
+| required | 
+
+If `true`, the radio is a required field and will be validated as such. If it is within a radio group, it will be overridden with the radio group's required state.
+
+boolean
+
+
+
+ | \- | Set boolean |
+| touch | 
+
+Add the button-like border and padding to radio when `touch` is true.
+
+boolean
+
+
+
+ | \- | FalseTrue |
+| value | 
+
+The value which is submitted with the form data when this radio button is checked. To set this radio as checked by default, use the `checked` property.
+
+FormControlValue
+
+
+
+ | \- | Set object |