react-jupiter 5.9.20 → 5.9.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (16) hide show
  1. package/form-v7/checkbox/checkbox.js +17 -9
  2. package/form-v7/checkbox/index.stories.js +26 -11
  3. package/form-v7/checkbox/index.style.js +5 -1
  4. package/form-v7/dropdown/index.stories.js +4 -2
  5. package/form-v7/dropdown/index.style.js +9 -2
  6. package/form-v7/dropdown/select.js +12 -7
  7. package/form-v7/file-input/index.js +2 -1
  8. package/form-v7/file-input/index.style.js +10 -1
  9. package/form-v7/radio/index.stories.js +32 -11
  10. package/form-v7/radio/radio.js +9 -6
  11. package/form-v7/text-input/index.js +2 -1
  12. package/form-v7/text-input/index.stories.js +12 -5
  13. package/form-v7/text-input/index.style.js +6 -2
  14. package/form-v7/theme.js +6 -2
  15. package/package.json +1 -1
  16. package/themes.js +1 -1
package/form-v7/checkbox/checkbox.js CHANGED
@@ -1,4 +1,8 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_globalStyle=_interopRequireDefault(require("../../globalStyle")),_typography=require("../../typography"),_errorMsg=_interopRequireDefault(require("../errorMsg")),_index=require("./index.style");function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_globalStyle=_interopRequireDefault(require("../../globalStyle")),_typography=require("../../typography"),_errorMsg=_interopRequireDefault(require("../errorMsg")),_index=require("./index.style"),_theme=_interopRequireDefault(require("../theme")),_styledComponents=require("styled-components");function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}
2
+
3
+
4
+
5
+
2
6
 
3
7
 
4
8
 
@@ -17,31 +21,34 @@
17
21
  var Checkbox=function(a){var
18
22
 
19
23
  b=
20
- a.children,c=a.groupName,d=a.label,e=a.handleChange,f=a.isDisabled,g=a.type,h=a.errorMessage,
21
- i=_react.default.Children.toArray(b);
24
+ a.children,c=a.groupName,d=a.label,e=a.handleChange,f=a.isDisabled,g=a.type,h=a.errorMessage,i=a.required,j=a.register,
25
+ k=_react.default.Children.toArray(b);
22
26
 
23
27
  return/*#__PURE__*/(
28
+ _react.default.createElement(_styledComponents.ThemeProvider,{theme:_theme.default},/*#__PURE__*/
24
29
  _react.default.createElement(_index.Fieldset,{onChange:e},/*#__PURE__*/
25
30
  _react.default.createElement(_globalStyle.default,null),
26
31
  d&&/*#__PURE__*/
27
32
  _react.default.createElement("legend",null,/*#__PURE__*/
28
33
  _react.default.createElement(_typography.Text,{bold:!0,size:14},
29
- d)),/*#__PURE__*/
34
+ d,
35
+ !!i&&/*#__PURE__*/_react.default.createElement("span",{className:"required"},"*"))),/*#__PURE__*/
30
36
 
31
37
 
32
38
 
33
39
  _react.default.createElement(_index.CheckboxWrapper,{type:g},
34
- i.map(
40
+ k.map(
35
41
  function(a){return(
36
42
  f?/*#__PURE__*/
37
- _react.default.cloneElement(a,{groupName:c,isDisabled:f}):/*#__PURE__*/
43
+ _react.default.cloneElement(a,{groupName:c,isDisabled:f,register:j}):/*#__PURE__*/
44
+
45
+ _react.default.cloneElement(a,{groupName:c,register:j}))})),/*#__PURE__*/
38
46
 
39
- _react.default.cloneElement(a,{groupName:c}))})),/*#__PURE__*/
40
47
 
41
48
 
42
49
 
50
+ _react.default.createElement(_errorMsg.default,{errorMessage:h}))));
43
51
 
44
- _react.default.createElement(_errorMsg.default,{errorMessage:h})));
45
52
 
46
53
 
47
54
  };
@@ -52,6 +59,7 @@ label:"",
52
59
  handleChange:function handleChange(){},
53
60
  isDisabled:!1,
54
61
  type:"horizontal",
55
- errorMessage:""
62
+ errorMessage:"",
63
+ required:!1
56
64
  };var _default=
57
65
  Checkbox;exports.default=_default;
package/form-v7/checkbox/index.stories.js CHANGED
@@ -18,45 +18,60 @@ var a=
18
18
 
19
19
  (0,_reactHookForm.useForm)(),b=a.register;
20
20
  return/*#__PURE__*/(
21
- _react.default.createElement(_checkbox.default,null,/*#__PURE__*/
22
- _react.default.createElement(_checkboxOption.default,{value:"first",label:"First Value",register:b,handleOnchange:function handleOnchange(a){return console.log(a)}}),/*#__PURE__*/
23
- _react.default.createElement(_checkboxOption.default,{value:"sec",label:"Sec Value",register:b,handleOnchange:function handleOnchange(a){return console.log(a)}}),/*#__PURE__*/
24
- _react.default.createElement(_checkboxOption.default,{value:"third",label:"Third Value",register:b,handleOnchange:function handleOnchange(a){return console.log(a.target.checked)}})));
21
+ _react.default.createElement(_checkbox.default,{register:b},/*#__PURE__*/
22
+ _react.default.createElement(_checkboxOption.default,{value:"first",label:"First Value",handleOnchange:function handleOnchange(a){return console.log(a)}}),/*#__PURE__*/
23
+ _react.default.createElement(_checkboxOption.default,{value:"sec",label:"Sec Value",handleOnchange:function handleOnchange(a){return console.log(a)}}),/*#__PURE__*/
24
+ _react.default.createElement(_checkboxOption.default,{value:"third",label:"Third Value",handleOnchange:function handleOnchange(a){return console.log(a.target.checked)}})));
25
25
 
26
26
 
27
27
  }).
28
- add("Full option Checkbox",function(){return/*#__PURE__*/(
28
+ add("Full option Checkbox",function(){
29
+ var a=
30
+
31
+ (0,_reactHookForm.useForm)(),b=a.register;
32
+ return/*#__PURE__*/(
29
33
  _react.default.createElement(_checkbox.default,{
30
34
  groupName:(0,_addonKnobs.text)("optional groupName(but highly recommended to set manually)","degree"),
31
35
  label:(0,_addonKnobs.text)("optional 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"),
32
36
  handleChange:(0,_addonActions.action)("trigger what you want to do in onChange function"),
33
37
  isDisabled:(0,_addonKnobs.boolean)("optional disabled all",!1),
34
38
  type:(0,_addonKnobs.select)("optional type",["horizontal","vertical"]),
35
- errorMessage:(0,_addonKnobs.text)("optional error msg","\u0627\u0631\u0648\u0631 \u0632\u06CC\u0628\u0627")},/*#__PURE__*/
39
+ errorMessage:(0,_addonKnobs.text)("optional error msg","\u0627\u0631\u0648\u0631 \u0632\u06CC\u0628\u0627"),
40
+ required:!0,
41
+ register:b},/*#__PURE__*/
36
42
 
37
43
  _react.default.createElement(_checkboxOption.default,{value:"100",label:"\u0648\u0631\u0632\u0634\u06CC"}),/*#__PURE__*/
38
44
  _react.default.createElement(_checkboxOption.default,{value:"234",label:"\u0639\u0644\u0645\u06CC"}),/*#__PURE__*/
39
45
  _react.default.createElement(_checkboxOption.default,{value:"300",label:"\u0645\u0630\u0647\u0628\u06CC"}),/*#__PURE__*/
40
46
  _react.default.createElement(_checkboxOption.default,{value:"400",label:"\u0641\u0631\u0647\u0646\u06AF\u06CC",isChecked:!0}),/*#__PURE__*/
41
- _react.default.createElement(_checkboxOption.default,{value:"500",label:"\u0647\u0646\u0631\u06CC",isChecked:!0})))}).
47
+ _react.default.createElement(_checkboxOption.default,{value:"500",label:"\u0647\u0646\u0631\u06CC",isChecked:!0})));
48
+
42
49
 
50
+ }).
51
+ add("Full option CheckboxOption",function(){
52
+ var a=
43
53
 
44
- add("Full option CheckboxOption",function(){return/*#__PURE__*/(
54
+ (0,_reactHookForm.useForm)(),b=a.register;
55
+ return/*#__PURE__*/(
45
56
  _react.default.createElement(_checkbox.default,{
46
57
  groupName:"degree",
47
- 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"},/*#__PURE__*/
58
+ required:!0,
59
+ 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",
60
+ register:b},/*#__PURE__*/
48
61
 
49
62
  _react.default.createElement(_checkboxOption.default,{
50
63
  label:(0,_addonKnobs.text)("label","\u0648\u0631\u0632\u0634\u06CC"),
51
64
  value:(0,_addonKnobs.text)("value","100"),
52
65
  isDisabled:(0,_addonKnobs.boolean)("optional disabled item",!1),
53
- isChecked:(0,_addonKnobs.boolean)("optional checked item",!1)}),/*#__PURE__*/
66
+ isChecked:(0,_addonKnobs.boolean)("optional checked item",!1),
67
+ register:b}),/*#__PURE__*/
54
68
 
55
69
  _react.default.createElement(_checkboxOption.default,{value:"200",label:"\u0639\u0644\u0645\u06CC"}),/*#__PURE__*/
56
70
  _react.default.createElement(_checkboxOption.default,{value:"300",label:"\u0645\u0630\u0647\u0628\u06CC"}),/*#__PURE__*/
57
71
  _react.default.createElement(_checkboxOption.default,{value:"400",label:"\u0641\u0631\u0647\u0646\u06AF\u06CC"}),/*#__PURE__*/
58
- _react.default.createElement(_checkboxOption.default,{value:"500",label:"\u0647\u0646\u0631\u06CC"})))}).
72
+ _react.default.createElement(_checkboxOption.default,{value:"500",label:"\u0647\u0646\u0631\u06CC"})));
59
73
 
60
74
 
75
+ }).
61
76
  addDecorator(_addonInfo.withInfo).
62
77
  addDecorator(_addonKnobs.withKnobs);
package/form-v7/checkbox/index.style.js CHANGED
@@ -1,10 +1,14 @@
1
1
  "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Input=exports.Fieldset=exports.CheckboxWrapper=void 0;var _templateObject,_templateObject2,_templateObject3,_styledComponents=_interopRequireDefault(require("styled-components"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}function _taggedTemplateLiteral(a,b){return b||(b=a.slice(0)),Object.freeze(Object.defineProperties(a,{raw:{value:Object.freeze(b)}}))}
2
2
 
3
- var Fieldset=_styledComponents.default.fieldset(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n border: none;\n padding: 0;\n margin: 0;\n"])));exports.Fieldset=Fieldset;
3
+ var Fieldset=_styledComponents.default.fieldset(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n border: none;\n padding: 0;\n margin: 0;\n & span.required {\n color: ",";\n margin-right: 5px;\n }\n"])),
4
4
 
5
5
 
6
6
 
7
7
 
8
+ function(a){var b=a.theme;return b.colors.red});exports.Fieldset=Fieldset;
9
+
10
+
11
+
8
12
 
9
13
  var CheckboxWrapper=_styledComponents.default.div(_templateObject2||(_templateObject2=_taggedTemplateLiteral(["\n display: flex;\n justify-content: space-between;\n ","\n"])),
10
14
 
package/form-v7/dropdown/index.stories.js CHANGED
@@ -52,7 +52,8 @@ handleChange:(0,_addonActions.action)("trigger what you want to do in onChange f
52
52
  isDisabled:(0,_addonKnobs.boolean)("disabled(default : false)",!1),
53
53
  label:(0,_addonKnobs.text)("optional label","\u0645\u062D\u0644 \u0628\u0631\u06AF\u0632\u0627\u0631\u06CC \u0631\u0648\u06CC\u062F\u0627\u062F"),
54
54
  errorMessage:(0,_addonKnobs.text)("optional error msg","\u0627\u0631\u0648\u0631 \u0632\u06CC\u0628\u0627"),
55
- register:b},/*#__PURE__*/
55
+ register:b,
56
+ required:!0},/*#__PURE__*/
56
57
 
57
58
  _react.default.createElement(_option.default,{value:"20",label:"\u06A9\u0631\u062C"}),/*#__PURE__*/
58
59
  _react.default.createElement(_option.default,{value:"30",label:"\u062A\u0647\u0631\u0627\u0646"}),/*#__PURE__*/
@@ -70,7 +71,8 @@ htmlElementName:"\u0627\u0633\u062A\u0627\u0646",
70
71
  defaultValue:"30",
71
72
  handleChange:(0,_addonActions.action)("trigger what you want to do in onChange function"),
72
73
  isDisabled:!1,
73
- register:b},/*#__PURE__*/
74
+ register:b,
75
+ required:!0},/*#__PURE__*/
74
76
 
75
77
  _react.default.createElement(_option.default,{
76
78
  value:(0,_addonKnobs.text)("value","20"),
package/form-v7/dropdown/index.style.js CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StyledSelect=exports.SelectButton=void 0;var _templateObject,_templateObject2,_styledComponents=_interopRequireDefault(require("styled-components"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}function _taggedTemplateLiteral(a,b){return b||(b=a.slice(0)),Object.freeze(Object.defineProperties(a,{raw:{value:Object.freeze(b)}}))}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StyledSelect=exports.SelectButton=exports.Label=void 0;var _templateObject,_templateObject2,_templateObject3,_styledComponents=_interopRequireDefault(require("styled-components"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}function _taggedTemplateLiteral(a,b){return b||(b=a.slice(0)),Object.freeze(Object.defineProperties(a,{raw:{value:Object.freeze(b)}}))}
2
2
 
3
3
  var SelectButton=_styledComponents.default.div(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n position: relative;\n\n &:after {\n content: \"\";\n display: block;\n width: 7px;\n height: 7px;\n position: absolute;\n left: 15px;\n top: 11px;\n border: solid ",";\n border-width: 0 2px 2px 0;\n transform: rotate(45deg);\n -webkit-transform: rotate(45deg);\n pointer-events: none;\n }\n\n &:before {\n content: \"\";\n display: block;\n width: 37px;\n position: absolute;\n margin-top: 2px;\n top: 0;\n bottom: 1px;\n left: 1px;\n border-right: 1px solid ",";\n background: ",";\n pointer-events: none;\n }\n"])),
4
4
 
@@ -52,4 +52,11 @@ function(a){var b=a.disabled,c=a.theme;return b?"transparent":c.borderColor.hove
52
52
 
53
53
 
54
54
 
55
- function(a){var b=a.theme;return b.borderColor.focus});exports.StyledSelect=StyledSelect;
55
+ function(a){var b=a.theme;return b.borderColor.focus});exports.StyledSelect=StyledSelect;
56
+
57
+
58
+
59
+ var Label=_styledComponents.default.label(_templateObject3||(_templateObject3=_taggedTemplateLiteral(["\n position: relative;\n & span.required {\n color: ",";\n margin-right: 5px;\n }\n"])),
60
+
61
+
62
+ function(a){var b=a.theme;return b.colors.red});exports.Label=Label;
package/form-v7/dropdown/select.js CHANGED
@@ -16,6 +16,7 @@
16
16
 
17
17
 
18
18
 
19
+
19
20
  var Select=function(a){
20
21
 
21
22
 
@@ -24,9 +25,9 @@ var Select=function(a){
24
25
 
25
26
  function b(a){
26
27
  f(a.target.value);
27
- }var c=a.htmlElementName,d=a.defaultValue,f=a.handleChange,g=a.placeholder,h=a.isDisabled,i=a.children,j=a.label,k=a.register,l=a.errorMessage,
28
+ }var c=a.htmlElementName,d=a.defaultValue,f=a.handleChange,g=a.placeholder,h=a.isDisabled,i=a.children,j=a.label,k=a.register,l=a.errorMessage,m=a.required,
28
29
 
29
- m=function(){return/*#__PURE__*/(
30
+ n=function(){return/*#__PURE__*/(
30
31
  _react.default.createElement(_styledComponents.ThemeProvider,{theme:_theme.default},/*#__PURE__*/
31
32
  _react.default.createElement(_index.SelectButton,{disabled:h},/*#__PURE__*/
32
33
  _react.default.createElement(_index.StyledSelect,_extends({
@@ -50,15 +51,18 @@ _react.default.createElement(_errorMsg.default,{errorMessage:l})))};return(
50
51
 
51
52
  j?/*#__PURE__*/
52
53
 
53
- _react.default.createElement("label",{htmlFor:c},/*#__PURE__*/
54
+ _react.default.createElement(_styledComponents.ThemeProvider,{theme:_theme.default},/*#__PURE__*/
55
+ _react.default.createElement(_index.Label,{htmlFor:c},/*#__PURE__*/
54
56
  _react.default.createElement(_typography.Text,{size:14,bold:!0,isDisplayBlock:!0},
55
- j),
57
+ j,
58
+ !!m&&/*#__PURE__*/_react.default.createElement("span",{className:"required"},"*")),
59
+
60
+ n())):
56
61
 
57
- m()):
58
62
 
59
63
 
60
64
 
61
- m());
65
+ n());
62
66
  };
63
67
 
64
68
  Select.defaultProps={
@@ -69,7 +73,8 @@ label:"",
69
73
  isDisabled:!1,
70
74
  handleChange:function handleChange(){},
71
75
  errorMessage:"",
72
- register:null
76
+ register:null,
77
+ required:!1
73
78
  };var _default=
74
79
 
75
80
  Select;exports.default=_default;
package/form-v7/file-input/index.js CHANGED
@@ -58,7 +58,8 @@ type:"file"},
58
58
  i(d,{
59
59
  disabled:f,
60
60
  required:!!j&&"\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u0627\u0644\u0632\u0627\u0645\u06CC \u0627\u0633\u062A"
61
- })))),/*#__PURE__*/
61
+ }),{
62
+ "data-buttonText":"Your label here."}))),/*#__PURE__*/
62
63
 
63
64
 
64
65
  _react.default.createElement(_errorMsg.default,{errorMessage:h})));
package/form-v7/file-input/index.style.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
 
4
4
 
5
- var Input=_styledComponents.default.input(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n font-family: 'IranSharp';\n font-weight: bold;\n font-size: 12px;\n border-radius: ",";\n border: solid 1px ",";\n padding: 4px;\n box-sizing: border-box;\n width: 100%;\n\n &[disabled=\"\"]{\n background-color: ",";\n color: ",";\n border-color: transparent;\n\n\n &:hover {\n border-color: transparent;\n }\n }\n\n &:hover {\n border-color: ",";\n }\n\n &:focus {\n border-color: ",";\n }\n"])),
5
+ var Input=_styledComponents.default.input(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n font-family: 'IranSharp';\n font-weight: bold;\n font-size: 12px;\n border-radius: ",";\n border: solid 1px ",";\n padding: 4px;\n box-sizing: border-box;\n width: 100%;\n\n &::file-selector-button {\n color: ",";\n padding: 0.5em;\n border: ",";\n border-radius: 3px;\n width: 100px;\n height: 80;\n }\n\n &[disabled=\"\"]{\n background-color: ",";\n color: ",";\n border-color: transparent;\n\n\n &:hover {\n border-color: transparent;\n }\n }\n\n &:hover {\n border-color: ",";\n }\n\n &:focus {\n border-color: ",";\n }\n"])),
6
6
 
7
7
 
8
8
 
@@ -13,6 +13,15 @@ function(a){var b=a.theme;return b.borderColor.normal},
13
13
 
14
14
 
15
15
 
16
+ function(a){var b=a.theme;return"".concat(b.colors.blue)},
17
+
18
+ function(a){var b=a.theme;return"thin solid ".concat(b.colors.blue)},
19
+
20
+
21
+
22
+
23
+
24
+
16
25
  function(a){var b=a.theme;return b.disabled.background},
17
26
  function(a){var b=a.theme;return b.disabled.color},
18
27
 
package/form-v7/radio/index.stories.js CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";var _react=_interopRequireDefault(require("react")),_react2=require("@storybook/react"),_addonInfo=require("@storybook/addon-info"),_addonActions=require("@storybook/addon-actions"),_addonKnobs=require("@storybook/addon-knobs"),_radio=_interopRequireDefault(require("./radio")),_radioOption=_interopRequireDefault(require("./radio-option"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}
1
+ "use strict";var _react=_interopRequireDefault(require("react")),_react2=require("@storybook/react"),_addonInfo=require("@storybook/addon-info"),_addonActions=require("@storybook/addon-actions"),_addonKnobs=require("@storybook/addon-knobs"),_radio=_interopRequireDefault(require("./radio")),_radioOption=_interopRequireDefault(require("./radio-option")),_reactHookForm=require("react-hook-form");function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}
2
2
 
3
3
 
4
4
 
@@ -11,15 +11,27 @@
11
11
 
12
12
 
13
13
 
14
- (0,_react2.storiesOf)("Form/Radio",module).
15
- add("Minimal Form/Radio",function(){return/*#__PURE__*/(
16
- _react.default.createElement(_radio.default,null,/*#__PURE__*/
14
+
15
+ (0,_react2.storiesOf)("Form-V7/Radio",module).
16
+ add("Minimal Form/Radio",function(){
17
+ var a=
18
+
19
+ (0,_reactHookForm.useForm)(),b=a.register;
20
+
21
+ return/*#__PURE__*/(
22
+ _react.default.createElement(_radio.default,{groupName:"radio0",label:"\u0627\u0646\u062A\u062E\u0627\u0628 \u0631\u0627\u062F\u06CC\u0648",register:b},/*#__PURE__*/
17
23
  _react.default.createElement(_radioOption.default,{value:"first",label:"First Value"}),/*#__PURE__*/
18
24
  _react.default.createElement(_radioOption.default,{value:"sec",label:"Sec Value"}),/*#__PURE__*/
19
- _react.default.createElement(_radioOption.default,{value:"third",label:"Third Value"})))}).
25
+ _react.default.createElement(_radioOption.default,{value:"third",label:"Third Value"})));
20
26
 
21
27
 
22
- add("Full option Radio",function(){return/*#__PURE__*/(
28
+ }).
29
+ add("Full option Radio",function(){
30
+ var a=
31
+
32
+ (0,_reactHookForm.useForm)(),b=a.register;
33
+
34
+ return/*#__PURE__*/(
23
35
  _react.default.createElement(_radio.default,{
24
36
  groupName:(0,_addonKnobs.text)("optional groupName(but highly recommended to set manually)","degree"),
25
37
  label:(0,_addonKnobs.text)("optional 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"),
@@ -27,19 +39,27 @@ defaultCheckedValue:"300",
27
39
  handleChange:(0,_addonActions.action)("trigger what you want to do in onChange function"),
28
40
  isDisabled:(0,_addonKnobs.boolean)("optional disabled all",!1),
29
41
  type:(0,_addonKnobs.select)("optional type",["horizontal","vertical"]),
30
- errorMessage:(0,_addonKnobs.text)("optional error msg","\u0627\u0631\u0648\u0631 \u0632\u06CC\u0628\u0627")},/*#__PURE__*/
42
+ errorMessage:(0,_addonKnobs.text)("optional error msg","\u0627\u0631\u0648\u0631 \u0632\u06CC\u0628\u0627"),
43
+ register:b,
44
+ required:!0},/*#__PURE__*/
31
45
 
32
46
  _react.default.createElement(_radioOption.default,{value:"100",label:"\u0632\u06CC\u0631 \u062F\u06CC\u067E\u0644\u0645"}),/*#__PURE__*/
33
47
  _react.default.createElement(_radioOption.default,{value:"234",label:"\u062F\u06CC\u067E\u0644\u0645"}),/*#__PURE__*/
34
48
  _react.default.createElement(_radioOption.default,{value:"300",label:"\u06A9\u0627\u0631\u0634\u0646\u0627\u0633\u06CC"}),/*#__PURE__*/
35
49
  _react.default.createElement(_radioOption.default,{value:"400",label:"\u06A9\u0627\u0631\u0634\u0646\u0627\u0633\u06CC \u0627\u0631\u0634\u062F"}),/*#__PURE__*/
36
- _react.default.createElement(_radioOption.default,{value:"500",label:"\u062F\u06A9\u062A\u0631\u0627"})))}).
50
+ _react.default.createElement(_radioOption.default,{value:"500",label:"\u062F\u06A9\u062A\u0631\u0627"})));
51
+
37
52
 
53
+ }).
54
+ add("Full option RadioOption",function(){
55
+ var a=
38
56
 
39
- add("Full option RadioOption",function(){return/*#__PURE__*/(
57
+ (0,_reactHookForm.useForm)(),b=a.register;
58
+ return/*#__PURE__*/(
40
59
  _react.default.createElement(_radio.default,{
41
60
  groupName:"degree",
42
- 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"},/*#__PURE__*/
61
+ 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",
62
+ register:b},/*#__PURE__*/
43
63
 
44
64
  _react.default.createElement(_radioOption.default,{
45
65
  label:(0,_addonKnobs.text)("label","\u0632\u06CC\u0631 \u062F\u06CC\u067E\u0644\u0645"),
@@ -49,8 +69,9 @@ isDisabled:(0,_addonKnobs.boolean)("optional disabled item",!1)}),/*#__PURE__*/
49
69
  _react.default.createElement(_radioOption.default,{value:"200",label:"\u062F\u06CC\u067E\u0644\u0645"}),/*#__PURE__*/
50
70
  _react.default.createElement(_radioOption.default,{value:"300",label:"\u06A9\u0627\u0631\u0634\u0646\u0627\u0633\u06CC"}),/*#__PURE__*/
51
71
  _react.default.createElement(_radioOption.default,{value:"400",label:"\u06A9\u0627\u0631\u0634\u0646\u0627\u0633\u06CC \u0627\u0631\u0634\u062F"}),/*#__PURE__*/
52
- _react.default.createElement(_radioOption.default,{value:"500",label:"\u062F\u06A9\u062A\u0631\u0627"})))}).
72
+ _react.default.createElement(_radioOption.default,{value:"500",label:"\u062F\u06A9\u062A\u0631\u0627"})));
53
73
 
54
74
 
75
+ }).
55
76
  addDecorator(_addonInfo.withInfo).
56
77
  addDecorator(_addonKnobs.withKnobs);
package/form-v7/radio/radio.js CHANGED
@@ -15,12 +15,14 @@
15
15
 
16
16
 
17
17
 
18
+
19
+
18
20
  var Radio=function(a){var
19
21
 
20
22
  b=
21
23
 
22
- a.children,c=a.groupName,d=a.label,e=a.handleChange,f=a.defaultCheckedValue,g=a.isDisabled,h=a.type,i=a.errorMessage,
23
- j=_react.default.Children.toArray(b);
24
+ a.children,c=a.groupName,d=a.label,e=a.handleChange,f=a.defaultCheckedValue,g=a.isDisabled,h=a.type,i=a.errorMessage,j=a.register,
25
+ k=_react.default.Children.toArray(b);
24
26
 
25
27
  return/*#__PURE__*/(
26
28
  _react.default.createElement(_index.Fieldset,{onChange:e},/*#__PURE__*/
@@ -33,12 +35,12 @@ d)),/*#__PURE__*/
33
35
 
34
36
 
35
37
  _react.default.createElement(_index.RadioWrapper,{type:h},
36
- j.map(
38
+ k.map(
37
39
  function(a){return(
38
40
  g?/*#__PURE__*/
39
- _react.default.cloneElement(a,{groupName:c,defaultCheckedValue:f,isDisabled:g}):/*#__PURE__*/
41
+ _react.default.cloneElement(a,{groupName:c,defaultCheckedValue:f,isDisabled:g,register:j}):/*#__PURE__*/
40
42
 
41
- _react.default.cloneElement(a,{groupName:c,defaultCheckedValue:f}))})),/*#__PURE__*/
43
+ _react.default.cloneElement(a,{groupName:c,defaultCheckedValue:f,register:j}))})),/*#__PURE__*/
42
44
 
43
45
 
44
46
 
@@ -55,6 +57,7 @@ handleChange:function handleChange(){},
55
57
  defaultCheckedValue:"",
56
58
  isDisabled:!1,
57
59
  type:"horizontal",
58
- errorMessage:""
60
+ errorMessage:"",
61
+ required:!1
59
62
  };var _default=
60
63
  Radio;exports.default=_default;
package/form-v7/text-input/index.js CHANGED
@@ -60,7 +60,8 @@ _react.default.createElement(_globalStyle.default,null),/*#__PURE__*/
60
60
  _react.default.createElement(_index.Label,{htmlFor:e||"".concat(b,"-").concat(d.split(" ").join("")),"data-test":"text-input"},
61
61
  c&&/*#__PURE__*/
62
62
  _react.default.createElement(_index.LabelContainer,{bold:!0,size:14},
63
- c),
63
+ c,
64
+ !!k&&/*#__PURE__*/_react.default.createElement("span",{className:"required"},"*")),
64
65
 
65
66
 
66
67
  h&&/*#__PURE__*/
package/form-v7/text-input/index.stories.js CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";var _react=_interopRequireDefault(require("react")),_react2=require("@storybook/react"),_addonInfo=require("@storybook/addon-info"),_addonKnobs=require("@storybook/addon-knobs"),_index=_interopRequireDefault(require("./index"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}
1
+ "use strict";var _react=_interopRequireDefault(require("react")),_reactHookForm=require("react-hook-form"),_react2=require("@storybook/react"),_addonInfo=require("@storybook/addon-info"),_addonKnobs=require("@storybook/addon-knobs"),_index=_interopRequireDefault(require("./index"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}
2
2
 
3
3
 
4
4
 
@@ -9,18 +9,25 @@
9
9
 
10
10
 
11
11
 
12
- (0,_react2.storiesOf)("Form/Inputs",module).
13
- add("Minimal Text Input",function(){return/*#__PURE__*/_react.default.createElement(_index.default,{htmlElementName:"text-name-01",label:"\u0627\u06CC\u0646 \u0644\u06CC\u0628\u0644 \u0627\u0633\u062A"})}).
14
- add("Full option Text Input",function(){return/*#__PURE__*/(
12
+
13
+ (0,_react2.storiesOf)("Form-V7/Inputs",module).
14
+ add("Full option Text Input",function(){
15
+ var a=
16
+
17
+ (0,_reactHookForm.useForm)(),b=a.register;
18
+ return/*#__PURE__*/(
15
19
  _react.default.createElement(_index.default,{
16
20
  htmlElementName:"text-name-02",
21
+ required:!0,
17
22
  label:(0,_addonKnobs.text)("optional label","\u0627\u06CC\u0646 \u0644\u06CC\u0628\u0644 \u0627\u0633\u062A"),
23
+ register:b,
18
24
  placeholder:(0,_addonKnobs.text)("optional placeholder","\u0645\u062A\u0646 \u067E\u06CC\u0634\u0641\u0631\u0636"),
19
25
  disabled:(0,_addonKnobs.boolean)("disabled(default : false)",!1),
20
26
  description:(0,_addonKnobs.text)("optional description","\u062A\u0648\u0636\u06CC\u062D\u0627\u062A \u0627\u0636\u0627\u0641\u0647"),
21
27
  errorMessage:(0,_addonKnobs.text)("optional error msg","\u0627\u0631\u0648\u0631 \u0632\u06CC\u0628\u0627"),
22
- type:(0,_addonKnobs.select)("select type(default : text)",["text","password"])}))}).
28
+ type:(0,_addonKnobs.select)("select type(default : text)",["text","password"])}));
23
29
 
24
30
 
31
+ }).
25
32
  addDecorator(_addonInfo.withInfo).
26
33
  addDecorator(_addonKnobs.withKnobs);
package/form-v7/text-input/index.style.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
 
4
4
 
5
- var Input=_styledComponents.default.input(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n font-family: 'IranSharp';\n font-weight: bold;\n font-size: 12px;\n border-radius: ",";\n border: solid 1px ",";\n padding: 4px;\n box-sizing: border-box;\n width: 100%;\n\n &[disabled=\"\"]{\n background-color: ",";\n color: ",";\n border-color: transparent;\n\n\n &:hover {\n border-color: transparent;\n }\n }\n\n &:hover {\n border-color: ",";\n }\n\n &:focus {\n border-color: ",";\n }\n"])),
5
+ var Input=_styledComponents.default.input(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n font-family: 'IranSharp';\n font-weight: bold;\n font-size: 12px;\n border-radius: ",";\n border: solid 1px ",";\n padding: 6px;\n box-sizing: border-box;\n width: 100%;\n\n &[disabled=\"\"]{\n background-color: ",";\n color: ",";\n border-color: transparent;\n\n\n &:hover {\n border-color: transparent;\n }\n }\n\n &:hover {\n border-color: ",";\n }\n\n &:focus {\n border-color: ",";\n }\n"])),
6
6
 
7
7
 
8
8
 
@@ -32,7 +32,11 @@ function(a){var b=a.theme;return b.borderColor.focus});exports.Input=Input;
32
32
 
33
33
 
34
34
 
35
- var LabelContainer=(0,_styledComponents.default)(_typography.Text)(_templateObject2||(_templateObject2=_taggedTemplateLiteral(["\n display: block;\n margin-bottom: 8px;\n"])));exports.LabelContainer=LabelContainer;
35
+ var LabelContainer=(0,_styledComponents.default)(_typography.Text)(_templateObject2||(_templateObject2=_taggedTemplateLiteral(["\n display: block;\n margin-bottom: 8px;\n & > span.required {\n color: ",";\n margin-right: 5px;\n }\n"])),
36
+
37
+
38
+
39
+ function(a){var b=a.theme;return b.colors.red});exports.LabelContainer=LabelContainer;
36
40
 
37
41
 
38
42
 
package/form-v7/theme.js CHANGED
@@ -1,15 +1,19 @@
1
1
  "use strict";var _themes=_interopRequireDefault(require("../themes"));Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}var
2
2
 
3
3
  theme={
4
- borderRadius:_themes.default.borderRadius.low,
4
+ borderRadius:_themes.default.borderRadius.high,
5
5
  borderColor:{
6
- normal:_themes.default.colors.gray800,
6
+ normal:_themes.default.colors.gray600,
7
7
  hover:_themes.default.colors.blue400,
8
8
  focus:_themes.default.colors.blue600
9
9
  },
10
10
  disabled:{
11
11
  background:_themes.default.colors.gray200,
12
12
  color:_themes.default.colors.gray400
13
+ },
14
+ colors:{
15
+ red:_themes.default.colors.red600,
16
+ blue:_themes.default.colors.blue600
13
17
  }
14
18
  },_default=
15
19
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-jupiter",
3
- "version": "5.9.20",
3
+ "version": "5.9.21",
4
4
  "main": "./index.js",
5
5
  "license": "MIT",
6
6
  "keywords": [
package/themes.js CHANGED
@@ -36,7 +36,7 @@ small:"sm"
36
36
  },
37
37
  borderRadius:{
38
38
  low:2,
39
- high:3
39
+ high:5
40
40
  },
41
41
  border:{
42
42
  lightBlue:"1px solid #E6F4FB"