react-jupiter 6.0.0-beta.1 → 6.0.0-beta.10

package/form-v7/form/index.stories.js

@@ -0,0 +1,276 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Default=void 0;var _react=_interopRequireDefault(require("react")),_reactHookForm=require("react-hook-form"),_addonActions=require("@storybook/addon-actions"),_dropdown=require("../dropdown"),_fileInput=_interopRequireDefault(require("../file-input")),_radioOption=_interopRequireDefault(require("../radio/radio-option")),_radio=_interopRequireDefault(require("../radio/radio")),_textInput=_interopRequireDefault(require("../text-input")),_textarea=_interopRequireDefault(require("../textarea")),_checkbox=_interopRequireDefault(require("../checkbox/checkbox")),_checkboxOption=_interopRequireDefault(require("../checkbox/checkbox-option")),_captcha=_interopRequireDefault(require("../captcha"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}var _default=exports.default=
+
+
+
+
+
+
+
+
+
+
+
+
+
+{
+title:"Form-V7/Sample Form",
+component:"form",
+
+argTypes:{
+fileInputLabel:{
+control:"text",
+defaultValue:"\u0627\u06CC\u0646 \u0644\u06CC\u0628\u0644 \u0627\u0633\u062A"
+},
+fileInputPlaceholder:{
+control:"text",
+defaultValue:"\u0645\u062A\u0646 \u067E\u06CC\u0634\u0641\u0631\u0636"
+},
+fileInputDisabled:{
+control:"boolean",
+defaultValue:!1
+},
+fileInputErrorMessage:{
+control:"text",
+defaultValue:"\u0627\u0631\u0648\u0631 \u0632\u06CC\u0628\u0627"
+},
+radioLabel:{
+control:"text",
+defaultValue:"\u0632\u06CC\u0631 \u062F\u06CC\u067E\u0644\u0645"
+},
+radioValue:{
+control:"text",
+defaultValue:"100"
+},
+radioDisabled:{
+control:"boolean",
+defaultValue:!1
+},
+textInputLabel:{
+control:"text",
+defaultValue:"\u0627\u06CC\u0646 \u0644\u06CC\u0628\u0644 \u0627\u0633\u062A"
+},
+textInputPlaceholder:{
+control:"text",
+defaultValue:"\u0645\u062A\u0646 \u067E\u06CC\u0634\u0641\u0631\u0636"
+},
+textInputDisabled:{
+control:"boolean",
+defaultValue:!1
+},
+textInputErrorMessage:{
+control:"text",
+defaultValue:"\u0627\u0631\u0648\u0631 \u0632\u06CC\u0628\u0627"
+},
+textInputType:{
+control:"select",
+options:["text","password"],
+defaultValue:"text"
+},
+textareaLabel:{
+control:"text",
+defaultValue:"\u062A\u0648\u0636\u06CC\u062C\u0627\u062A"
+},
+textareaHtmlElementName:{
+control:"text",
+defaultValue:"textarea-box"
+},
+textareaPlaceholder:{
+control:"text",
+defaultValue:"\u0627\u06CC\u0646 \u067E\u0644\u06CC\u0633 \u0647\u0648\u0644\u062F\u0631 \u0627\u0633\u062A"
+},
+textareaMinHeight:{
+control:"text",
+defaultValue:"120"
+},
+checkboxLabel:{
+control:"text",
+defaultValue:"\u0648\u0631\u0632\u0634\u06CC"
+},
+checkboxValue:{
+control:"text",
+defaultValue:"100"
+},
+checkboxDisabled:{
+control:"boolean",
+defaultValue:!1
+},
+checkboxChecked:{
+control:"boolean",
+defaultValue:!1
+}
+}
+};const
+
+Template=(a)=>{const
+{
+register:b,
+handleSubmit:c,
+control:d,
+setValue:e,
+setError:f
+}=(0,_reactHookForm.useForm)(),
+
+
+
+
+
+
+
+
+
+g=[
+"question 1",
+"question 2",
+"question 3"];
+
+
+return(/*#__PURE__*/
+_react.default.createElement("form",{onSubmit:c(()=>{f({message:"\u06A9\u067E\u0686\u0627 \u0645\u0639\u062A\u0628\u0631 \u0646\u06CC\u0633\u062A .",errors:{captcha:["\u06A9\u067E\u0686\u0627 \u0645\u0639\u062A\u0628\u0631 \u0646\u06CC\u0633\u062A ."]},status_code:422})})},/*#__PURE__*/
+_react.default.createElement(_dropdown.Select,{
+htmlElementName:"select",
+placeholder:"\u06CC\u06A9 \u06AF\u0632\u06CC\u0646\u0647 \u0631\u0627 \u0627\u0646\u062A\u062E\u0627\u0628 \u06A9\u0646\u06CC\u062F",
+register:b,
+control:d,
+defaultValue:0,
+label:"select box",
+number:1,
+required:!1},
+
+!!g&&g.map((a,b)=>/*#__PURE__*/
+_react.default.createElement(_dropdown.SelectOption,{key:b,value:a,label:a})
+)
+),/*#__PURE__*/
+
+_react.default.createElement(_fileInput.default,{
+htmlElementName:"file-input",
+register:b,
+control:d,
+label:a.fileInputLabel,
+description:"\u062D\u062C\u0645 \u0641\u0627\u06CC\u0644 \u0627\u0631\u0633\u0627\u0644\u06CC \u0628\u0627\u06CC\u062F \u06A9\u0645\u062A\u0631 \u0627\u0632 \u06F4 \u0645\u06AF\u0627\u0628\u0627\u06CC\u062A \u0628\u0627\u0634\u062F",
+number:2,
+placeholder:a.fileInputPlaceholder,
+disabled:a.fileInputDisabled,
+errorMessage:a.fileInputErrorMessage,
+required:!1}
+),/*#__PURE__*/
+
+_react.default.createElement(_radio.default,{
+groupName:"radio",
+label:"radio input",
+number:3,
+register:b,
+control:d,
+required:!1},/*#__PURE__*/
+
+_react.default.createElement(_radioOption.default,{
+label:a.radioLabel,
+value:a.radioValue,
+isDisabled:a.radioDisabled}
+),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"200",label:"\u062F\u06CC\u067E\u0644\u0645"}),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"300",label:"\u06A9\u0627\u0631\u0634\u0646\u0627\u0633\u06CC"}),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"400",label:"\u06A9\u0627\u0631\u0634\u0646\u0627\u0633\u06CC \u0627\u0631\u0634\u062F"}),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"500",label:"\u062F\u06A9\u062A\u0631\u0627"})
+),/*#__PURE__*/
+
+_react.default.createElement(_textInput.default,{
+htmlElementName:"text-input",
+required:!1,
+label:a.textInputLabel,
+number:23,
+register:b,
+control:d,
+placeholder:a.textInputPlaceholder,
+disabled:a.textInputDisabled,
+errorMessage:a.textInputErrorMessage,
+type:a.textInputType,
+rtl:!0}
+),/*#__PURE__*/
+
+_react.default.createElement(_textInput.default,{
+htmlElementName:"text-input",
+type:"password",
+required:!1,
+label:a.textInputLabel,
+number:23,
+register:b,
+control:d,
+placeholder:a.textInputPlaceholder,
+disabled:a.textInputDisabled,
+errorMessage:a.textInputErrorMessage,
+rtl:!0}
+),/*#__PURE__*/
+
+_react.default.createElement(_textarea.default,{
+register:b,
+control:d,
+label:a.textareaLabel,
+htmlElementName:a.textareaHtmlElementName,
+placeholder:a.textareaPlaceholder,
+minHeight:a.textareaMinHeight,
+isDisabled:!1,
+required:!1,
+resize:"both",
+handleChange:(0,_addonActions.action)("trigger what you want to do in onChange function"),
+defaultValue:"\u0627\u06CC\u0646 \u06CC\u06A9 \u0628\u0627\u06A9\u0633 \u0645\u062A\u0646\u06CC \u0645\u06CC\u200C\u0628\u0627\u0634\u062F"}
+),/*#__PURE__*/
+
+_react.default.createElement(_checkbox.default,{
+groupName:"checkbox",
+required:!1,
+label:"\u062F\u0631 \u06A9\u062F\u0627\u0645 \u0645\u0648\u0636\u0648\u0639 \u0647\u0627 \u062A\u0648\u0627\u0646\u0627\u06CC\u06CC \u062F\u0627\u0631\u06CC\u062F",
+register:b,
+control:d},/*#__PURE__*/
+
+_react.default.createElement(_checkboxOption.default,{
+label:a.checkboxLabel,
+value:a.checkboxValue,
+isDisabled:a.checkboxDisabled,
+isChecked:a.checkboxChecked,
+register:b}
+),/*#__PURE__*/
+_react.default.createElement(_checkboxOption.default,{value:"200",label:"\u0639\u0644\u0645\u06CC"}),/*#__PURE__*/
+_react.default.createElement(_checkboxOption.default,{value:"300",label:"\u0645\u0630\u0647\u0628\u06CC"}),/*#__PURE__*/
+_react.default.createElement(_checkboxOption.default,{value:"400",label:"\u0641\u0631\u0647\u0646\u06AF\u06CC"}),/*#__PURE__*/
+_react.default.createElement(_checkboxOption.default,{value:"500",label:"\u0647\u0646\u0631\u06CC"})
+),/*#__PURE__*/
+
+_react.default.createElement(_captcha.default,{
+register:b,
+control:d,
+label:"\u06A9\u062F \u062A\u0635\u0648\u06CC\u0631\u06CC",
+htmlElementName:"captcha",
+imageUrl:"https://static.evand.net/captcha/0bb5a9832be7b86a2a0a646ae2fd1649.jpg",
+handleChange:(0,_addonActions.action)("trigger what you want to do in onChange function"),
+fetchData:()=>console.log("fetching"),
+setValue:e}
+),/*#__PURE__*/
+
+_react.default.createElement("button",{type:"submit"},"submit")
+))
+
+},
+
+Default=exports.Default=Template.bind({});
+Default.args={
+fileInputLabel:"\u0627\u06CC\u0646 \u0644\u06CC\u0628\u0644 \u0627\u0633\u062A",
+fileInputPlaceholder:"\u0645\u062A\u0646 \u067E\u06CC\u0634\u0641\u0631\u0636",
+fileInputDisabled:!1,
+fileInputErrorMessage:"\u0627\u0631\u0648\u0631 \u0632\u06CC\u0628\u0627",
+radioLabel:"\u0632\u06CC\u0631 \u062F\u06CC\u067E\u0644\u0645",
+radioValue:"100",
+radioDisabled:!1,
+textInputLabel:"\u0627\u06CC\u0646 \u0644\u06CC\u0628\u0644 \u0627\u0633\u062A",
+textInputPlaceholder:"\u0645\u062A\u0646 \u067E\u06CC\u0634\u0641\u0631\u0636",
+textInputDisabled:!1,
+textInputErrorMessage:"\u0627\u0631\u0648\u0631 \u0632\u06CC\u0628\u0627",
+textInputType:"text",
+textareaLabel:"\u062A\u0648\u0636\u06CC\u062C\u0627\u062A",
+textareaHtmlElementName:"textarea-box",
+textareaPlaceholder:"\u0627\u06CC\u0646 \u067E\u0644\u06CC\u0633 \u0647\u0648\u0644\u062F\u0631 \u0627\u0633\u062A",
+textareaMinHeight:"120",
+checkboxLabel:"\u0648\u0631\u0632\u0634\u06CC",
+checkboxValue:"100",
+checkboxDisabled:!1,
+checkboxChecked:!1
+};

package/form-v7/index.js

@@ -0,0 +1,25 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Captcha",{enumerable:!0,get:function(){return _captcha.default}}),Object.defineProperty(exports,"CheckboxInputGroup",{enumerable:!0,get:function(){return _checkbox.default}}),Object.defineProperty(exports,"Dropdown",{enumerable:!0,get:function(){return _dropdown.default}}),Object.defineProperty(exports,"FileInput",{enumerable:!0,get:function(){return _fileInput.default}}),Object.defineProperty(exports,"RadioInputGroup",{enumerable:!0,get:function(){return _radio.default}}),Object.defineProperty(exports,"TextInput",{enumerable:!0,get:function(){return _textInput.default}}),Object.defineProperty(exports,"Textarea",{enumerable:!0,get:function(){return _textarea.default}}),exports.default=void 0;var _textInput=_interopRequireDefault(require("./text-input")),_fileInput=_interopRequireDefault(require("./file-input")),_dropdown=_interopRequireDefault(require("./dropdown")),_radio=_interopRequireDefault(require("./radio")),_textarea=_interopRequireDefault(require("./textarea")),_checkbox=_interopRequireDefault(require("./checkbox")),_captcha=_interopRequireDefault(require("./captcha"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}var _default=exports.default=
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+{
+TextInput:_textInput.default,
+Dropdown:_dropdown.default,
+RadioInputGroup:_radio.default,
+Textarea:_textarea.default,
+CheckboxInputGroup:_checkbox.default,
+Captcha:_captcha.default,
+FileInput:_fileInput.default
+};

package/form-v7/index.style.js

@@ -0,0 +1,11 @@
+"use strict";var _styledComponents=_interopRequireDefault(require("styled-components"));Object.defineProperty(exports,"__esModule",{value:!0}),exports.Fieldset=void 0;function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}
+
+const Fieldset=exports.Fieldset=_styledComponents.default.fieldset`
+  position: relative;
+  border: none;
+  padding: 0;
+  margin-bottom: 20px;
+  * {
+    box-sizing: content-box;
+  }
+`;

package/form-v7/label/index.js

@@ -0,0 +1,31 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_typography=require("../../typography"),_numbers=require("../../utils/numbers"),_index=_interopRequireDefault(require("./index.style"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}
+
+
+
+
+
+
+
+
+
+
+
+function Label(a)
+
+{let{label:b=null,number:c=null,required:d=!1,htmlFor:e=null}=a;
+return(/*#__PURE__*/
+_react.default.createElement(_react.default.Fragment,null,
+b&&/*#__PURE__*/
+_react.default.createElement(_index.default,{htmlFor:e},/*#__PURE__*/
+_react.default.createElement(_typography.Text,{bold:!0,size:14},
+!!c&&`${(0,_numbers.toPersianNumber)(c)}- `,
+b,
+!!d&&/*#__PURE__*/_react.default.createElement("span",{className:"required"},"*")
+)
+)
+
+))
+
+}var _default=exports.default=
+
+Label;

package/form-v7/label/index.style.js

@@ -0,0 +1,12 @@
+"use strict";var _styledComponents=_interopRequireDefault(require("styled-components"));Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}
+
+const Label=_styledComponents.default.label`
+    position: relative;
+    display: block;
+    margin-bottom: 5px;
+    & span.required {
+        color: ${(a)=>{let{theme:b}=a;return b.colors.red}};
+        margin-right: 5px;
+    }
+`;var _default=exports.default=
+Label;

package/form-v7/radio/index.js

@@ -0,0 +1,10 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Radio",{enumerable:!0,get:function(){return _radio.default}}),Object.defineProperty(exports,"RadioOption",{enumerable:!0,get:function(){return _radioOption.default}}),exports.default=void 0;var _radio=_interopRequireDefault(require("./radio")),_radioOption=_interopRequireDefault(require("./radio-option"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}var _default=exports.default=
+
+
+
+
+
+{
+Radio:_radio.default,
+RadioOption:_radioOption.default
+};

package/form-v7/radio/index.stories.js

@@ -0,0 +1,117 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.WithError=exports.VerticalLayout=exports.Minimal=exports.FullOptions=exports.Disabled=exports.CustomOption=void 0;var _react=_interopRequireDefault(require("react")),_addonActions=require("@storybook/addon-actions"),_reactHookForm=require("react-hook-form"),_radio=_interopRequireDefault(require("./radio")),_radioOption=_interopRequireDefault(require("./radio-option"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(a){for(var b,c=1;c<arguments.length;c++)for(var d in b=arguments[c],b)({}).hasOwnProperty.call(b,d)&&(a[d]=b[d]);return a},_extends.apply(null,arguments)}var _default=exports.default=
+
+
+
+
+
+
+{
+title:"Form-V7/Radio",
+component:_radio.default,
+
+argTypes:{
+groupName:{
+control:"text",
+defaultValue:"degree"
+},
+label:{
+control:"text",
+defaultValue:"\u0622\u062E\u0631\u06CC\u0646 \u0645\u062F\u0631\u06A9 \u062A\u062D\u0635\u06CC\u0644\u06CC \u062E\u0648\u062F \u0631\u0627 \u0627\u0646\u062A\u062E\u0627\u0628 \u06A9\u0646\u06CC\u062F"
+},
+defaultCheckedValue:{
+control:"text",
+defaultValue:"300"
+},
+isDisabled:{
+control:"boolean",
+defaultValue:!1
+},
+type:{
+control:"select",
+options:["horizontal","vertical"],
+defaultValue:"horizontal"
+},
+errorMessage:{
+control:"text",
+defaultValue:"\u0627\u0631\u0648\u0631 \u0632\u06CC\u0628\u0627"
+},
+required:{
+control:"boolean",
+defaultValue:!0
+},
+number:{
+control:"number",
+defaultValue:1
+}
+}
+};const
+
+Template=(a)=>{
+const{register:b,control:c}=(0,_reactHookForm.useForm)();
+return(/*#__PURE__*/
+_react.default.createElement(_radio.default,_extends({},a,{register:b,control:c}),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"100",label:"\u0632\u06CC\u0631 \u062F\u06CC\u067E\u0644\u0645"}),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"234",label:"\u062F\u06CC\u067E\u0644\u0645"}),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"300",label:"\u06A9\u0627\u0631\u0634\u0646\u0627\u0633\u06CC"}),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"400",label:"\u06A9\u0627\u0631\u0634\u0646\u0627\u0633\u06CC \u0627\u0631\u0634\u062F"}),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"500",label:"\u062F\u06A9\u062A\u0631\u0627"})
+))
+
+},
+
+Minimal=exports.Minimal=Template.bind({});
+Minimal.args={
+groupName:"radio0",
+label:"\u0627\u0646\u062A\u062E\u0627\u0628 \u0631\u0627\u062F\u06CC\u0648",
+required:!0
+};
+
+const FullOptions=exports.FullOptions=Template.bind({});
+FullOptions.args={
+groupName:"degree",
+label:"\u0622\u062E\u0631\u06CC\u0646 \u0645\u062F\u0631\u06A9 \u062A\u062D\u0635\u06CC\u0644\u06CC \u062E\u0648\u062F \u0631\u0627 \u0627\u0646\u062A\u062E\u0627\u0628 \u06A9\u0646\u06CC\u062F",
+defaultCheckedValue:"300",
+handleChange:(0,_addonActions.action)("trigger what you want to do in onChange function"),
+isDisabled:!1,
+type:"horizontal",
+errorMessage:"\u0627\u0631\u0648\u0631 \u0632\u06CC\u0628\u0627",
+required:!0
+};
+
+const VerticalLayout=exports.VerticalLayout=Template.bind({});
+VerticalLayout.args={
+...FullOptions.args,
+type:"vertical"
+};
+
+const Disabled=exports.Disabled=Template.bind({});
+Disabled.args={
+...FullOptions.args,
+isDisabled:!0
+};
+
+const WithError=exports.WithError=Template.bind({});
+WithError.args={
+...FullOptions.args,
+errorMessage:"\u0644\u0637\u0641\u0627 \u06CC\u06A9 \u06AF\u0632\u06CC\u0646\u0647 \u0631\u0627 \u0627\u0646\u062A\u062E\u0627\u0628 \u06A9\u0646\u06CC\u062F"
+};const
+
+RadioOptionTemplate=(a)=>{
+const{register:b}=(0,_reactHookForm.useForm)();
+return(/*#__PURE__*/
+_react.default.createElement(_radio.default,{groupName:"degree",label:"\u0622\u062E\u0631\u06CC\u0646 \u0645\u062F\u0631\u06A9 \u062A\u062D\u0635\u06CC\u0644\u06CC \u062E\u0648\u062F \u0631\u0627 \u0627\u0646\u062A\u062E\u0627\u0628 \u06A9\u0646\u06CC\u062F",number:1,register:b},/*#__PURE__*/
+_react.default.createElement(_radioOption.default,a),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"200",label:"\u062F\u06CC\u067E\u0644\u0645"}),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"300",label:"\u06A9\u0627\u0631\u0634\u0646\u0627\u0633\u06CC"}),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"400",label:"\u06A9\u0627\u0631\u0634\u0646\u0627\u0633\u06CC \u0627\u0631\u0634\u062F"}),/*#__PURE__*/
+_react.default.createElement(_radioOption.default,{value:"500",label:"\u062F\u06A9\u062A\u0631\u0627"})
+))
+
+},
+
+CustomOption=exports.CustomOption=RadioOptionTemplate.bind({});
+CustomOption.args={
+label:"\u0632\u06CC\u0631 \u062F\u06CC\u067E\u0644\u0645",
+value:"100",
+isDisabled:!1
+};

package/form-v7/radio/index.style.js

@@ -0,0 +1,61 @@
+"use strict";var _styledComponents=_interopRequireDefault(require("styled-components"));Object.defineProperty(exports,"__esModule",{value:!0}),exports.RadioWrapper=exports.Input=exports.Fieldset=void 0;function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}const
+
+Fieldset=exports.Fieldset=_styledComponents.default.fieldset`
+  border: none;
+  padding: 0;
+  margin-bottom: 15px;
+  * {
+    box-sizing: content-box;
+  }
+`,
+
+RadioWrapper=exports.RadioWrapper=_styledComponents.default.div`
+  display: flex;
+  justify-content: space-between;
+  ${(a)=>{let{type:b}=a;return"vertical"===b?"flex-direction: column;":""}}
+`,
+
+Input=exports.Input=_styledComponents.default.input`
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+
+  border-radius: 50%;
+  width: 16px;
+  height: 16px;
+  margin-right: 5px;
+  position: relative;
+  top: 4px;
+  
+  border: 1px solid ${(a)=>{let{disabled:b,theme:c}=a;return b?c.disabled.color:c.borderColor.normal}};
+  cursor: ${(a)=>{let{disabled:b}=a;return b?"not-allowed":"pointer"}};
+  transition: background 0.2s linear;
+
+  &:hover {
+    border: 1px solid ${(a)=>{let{disabled:b,theme:c}=a;return b?c.disabled.color:c.borderColor.hover}};
+  }
+
+  &:checked {
+    border: 1px solid ${(a)=>{let{theme:b}=a;return b.borderColor.normal}};
+    width: 16px;
+    height: 16px;
+    background: ${(a)=>{let{disabled:b,theme:c}=a;return b?c.disabled.color:c.borderColor.focus}};
+
+    &:after {
+      background: ${(a)=>{let{disabled:b,theme:c}=a;return b?c.disabled.color:c.borderColor.focus}};
+    }
+  }
+
+  &:after {
+    content: '';
+    display: block;
+    background: ${(a)=>{let{disabled:b}=a;return b?"white":"transparent"}};
+    position: absolute;
+    width: 20px;
+    height: 20px;
+    border-radius: 100%;
+    z-index: -1;
+    top: -6px;
+    right: -6px;
+  }
+`;

package/form-v7/radio/radio-option.js

@@ -0,0 +1,45 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_propTypes=_interopRequireDefault(require("prop-types")),_reactHookForm=require("react-hook-form"),_styledComponents=require("styled-components"),_typography=require("../../typography"),_index=require("./index.style"),_theme=_interopRequireDefault(require("../theme"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(a){for(var b,c=1;c<arguments.length;c++)for(var d in b=arguments[c],b)({}).hasOwnProperty.call(b,d)&&(a[d]=b[d]);return a},_extends.apply(null,arguments)}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+const RadioOption=(a)=>{const
+{
+label:b,value:c,isDisabled:f=!1,defaultCheckedValue:g="",groupName:d,register:e
+}=a,
+h=`${d}-${c}-${b.split(" ").join("")}`;
+
+return(/*#__PURE__*/
+_react.default.createElement(_styledComponents.ThemeProvider,{theme:_theme.default},/*#__PURE__*/
+_react.default.createElement("label",{htmlFor:h},/*#__PURE__*/
+_react.default.createElement(_index.Input,_extends({
+type:"radio",
+id:h,
+name:d,
+defaultValue:c,
+defaultChecked:g===c},
+e(d,{
+disabled:f
+}))
+),/*#__PURE__*/
+_react.default.createElement(_typography.Text,{size:14},
+b
+)
+)
+))
+
+};var _default=exports.default=
+
+RadioOption;

package/form-v7/radio/radio.js

@@ -0,0 +1,75 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_propTypes=_interopRequireDefault(require("prop-types")),_styledComponents=require("styled-components"),_reactHookForm=require("react-hook-form"),_globalStyle=_interopRequireDefault(require("../../globalStyle")),_errorMsg=_interopRequireDefault(require("../errorMsg")),_index=require("./index.style"),_index2=require("../index.style"),_label=_interopRequireDefault(require("../label")),_theme=_interopRequireDefault(require("../theme")),_typography=require("../../typography");function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+const Radio=(a)=>
+
+
+
+
+
+
+
+
+
+
+
+{let{groupName:e="radio-element",label:f="",handleChange:g=()=>{},defaultCheckedValue:h="",isDisabled:i=!1,type:j="horizontal",required:k=!1,number:l=null,control:b,register:c,children:d}=a;
+const m=_react.default.Children.toArray(d);
+
+return(/*#__PURE__*/
+_react.default.createElement(_styledComponents.ThemeProvider,{theme:_theme.default},/*#__PURE__*/
+_react.default.createElement(_index2.Fieldset,{onChange:g},/*#__PURE__*/
+_react.default.createElement(_globalStyle.default,null),/*#__PURE__*/
+_react.default.createElement(_label.default,{label:f,number:l,required:k}),/*#__PURE__*/
+_react.default.createElement(_reactHookForm.Controller,{
+name:e,
+control:b,
+rules:{required:!!k&&"\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u0627\u062C\u0628\u0627\u0631\u06CC \u0627\u0633\u062A"},
+render:(a)=>{let{fieldState:b}=a;return(/*#__PURE__*/
+_react.default.createElement(_react.default.Fragment,null,/*#__PURE__*/
+_react.default.createElement(_index.RadioWrapper,{type:j},
+m.map(
+(a)=>
+i?(/*#__PURE__*/
+_react.default.cloneElement(a,{
+groupName:e,defaultCheckedValue:h,isDisabled:i,register:c
+})):(/*#__PURE__*/
+
+_react.default.cloneElement(a,{groupName:e,defaultCheckedValue:h,register:c}))
+
+
+)
+),/*#__PURE__*/
+_react.default.createElement(_errorMsg.default,{errorMessage:b&&b.error?.message})
+))}}
+
+)
+)
+))
+
+};var _default=exports.default=
+
+Radio;