@secondstaxorg/sscomp 1.5.97 → 1.6.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.
package/dist/index.js CHANGED
@@ -16581,19 +16581,25 @@ const CountrySelector = (props) => {
16581
16581
  setOptionsRec(options);
16582
16582
  },[options]);
16583
16583
 
16584
+ React$1.useEffect(()=>{
16585
+ if (passedOption.optionShortName){
16586
+ if (options.filter((options)=>options.optionShortName.toLowerCase().includes(passedOption.optionShortName.toLowerCase())).length === 0) setPassedOption({});
16587
+ }
16588
+ },[options]);
16589
+
16584
16590
  function filterList(qry){
16585
16591
  setQryStr(qry);
16586
16592
  setOptionsRec(optionsOri.filter((option)=>option.optionName.toLowerCase().includes(qry.toLowerCase())));
16587
16593
  }
16588
16594
 
16589
16595
  return (
16590
- React$1.createElement(DropdownContainer, {__self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 54}}
16596
+ React$1.createElement(DropdownContainer, {__self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 60}}
16591
16597
  , label &&
16592
- React$1.createElement(LabelContainer$1, {__self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 56}}
16593
- , React$1.createElement('label', {__self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 57}}, label)
16598
+ React$1.createElement(LabelContainer$1, {__self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 62}}
16599
+ , React$1.createElement('label', {__self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 63}}, label)
16594
16600
  )
16595
16601
 
16596
- , React$1.createElement(DropdownField$1, { style: {borderColor:passedOption.optionShortName ? theme.colors["success-500"] : theme.colors["neutral-200"]}, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 60}}
16602
+ , React$1.createElement(DropdownField$1, { style: {borderColor:passedOption.optionShortName ? theme.colors["success-500"] : theme.colors["neutral-200"]}, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 66}}
16597
16603
  , React$1.createElement('button', { ref: buttonRef, type: "button", className: "country-selector", onBlur: ()=>{
16598
16604
  if (!searchable){
16599
16605
  setTimeout(()=>{
@@ -16608,24 +16614,24 @@ const CountrySelector = (props) => {
16608
16614
  }else {
16609
16615
  setOpened(true);
16610
16616
  }
16611
- }, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 61}}
16617
+ }, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 67}}
16612
16618
  )
16613
16619
  , searchable && opened &&
16614
16620
  React$1.createElement('input', { type: "text", value: qryStr, onChange: (e)=>{filterList(e.target.value);}, className: "country-selector search-field" , onFocus: ()=>{setOpened(true);}, onBlur: ()=>{
16615
16621
  setTimeout(()=>{
16616
16622
  setOpened(false);
16617
16623
  },200);
16618
- }, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 78}})
16624
+ }, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 84}})
16619
16625
 
16620
- , React$1.createElement('div', { style: {display:'flex',gap:'16px', alignItems:'center', overflowX:'hidden'}, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 84}}
16621
- , React$1.createElement('img', { src: !passedOption.optionFlag ? imgFile : passedOption.optionFlag, alt: "flag", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 85}})
16626
+ , React$1.createElement('div', { style: {display:'flex',gap:'16px', alignItems:'center', overflowX:'hidden'}, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 90}}
16627
+ , React$1.createElement('img', { src: !passedOption.optionFlag ? imgFile : passedOption.optionFlag, alt: "flag", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 91}})
16622
16628
  , passedOption.optionName
16623
16629
  , !passedOption.optionName &&
16624
16630
  React$1.createElement(React$1.Fragment, null
16625
16631
  , initialText
16626
16632
  , !initialText &&
16627
16633
  React$1.createElement(React$1.Fragment, null
16628
- , placeholder && React$1.createElement('span', { className: "placeholder", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 92}}, placeholder)
16634
+ , placeholder && React$1.createElement('span', { className: "placeholder", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 98}}, placeholder)
16629
16635
  )
16630
16636
 
16631
16637
  )
@@ -16636,22 +16642,22 @@ const CountrySelector = (props) => {
16636
16642
  buttonRef.current.focus();
16637
16643
  setOpened(true);
16638
16644
  }
16639
- }, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 98}}
16640
- , React$1.createElement('svg', { width: "12", height: "8", viewBox: "0 0 12 8" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 104}}
16641
- , React$1.createElement('path', { d: "M10.9999 1.17C10.8126 0.983753 10.5591 0.879211 10.2949 0.879211C10.0308 0.879211 9.77731 0.983753 9.58995 1.17L5.99995 4.71L2.45995 1.17C2.27259 0.983753 2.01913 0.879211 1.75495 0.879211C1.49076 0.879211 1.23731 0.983753 1.04995 1.17C0.95622 1.26297 0.881826 1.37357 0.831057 1.49543C0.780288 1.61729 0.75415 1.74799 0.75415 1.88C0.75415 2.01202 0.780288 2.14272 0.831057 2.26458C0.881826 2.38644 0.95622 2.49704 1.04995 2.59L5.28995 6.83C5.38291 6.92373 5.49351 6.99813 5.61537 7.04889C5.73723 7.09966 5.86794 7.1258 5.99995 7.1258C6.13196 7.1258 6.26267 7.09966 6.38453 7.04889C6.50638 6.99813 6.61699 6.92373 6.70995 6.83L10.9999 2.59C11.0937 2.49704 11.1681 2.38644 11.2188 2.26458C11.2696 2.14272 11.2957 2.01202 11.2957 1.88C11.2957 1.74799 11.2696 1.61729 11.2188 1.49543C11.1681 1.37357 11.0937 1.26297 10.9999 1.17Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 105}})
16645
+ }, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 104}}
16646
+ , React$1.createElement('svg', { width: "12", height: "8", viewBox: "0 0 12 8" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 110}}
16647
+ , React$1.createElement('path', { d: "M10.9999 1.17C10.8126 0.983753 10.5591 0.879211 10.2949 0.879211C10.0308 0.879211 9.77731 0.983753 9.58995 1.17L5.99995 4.71L2.45995 1.17C2.27259 0.983753 2.01913 0.879211 1.75495 0.879211C1.49076 0.879211 1.23731 0.983753 1.04995 1.17C0.95622 1.26297 0.881826 1.37357 0.831057 1.49543C0.780288 1.61729 0.75415 1.74799 0.75415 1.88C0.75415 2.01202 0.780288 2.14272 0.831057 2.26458C0.881826 2.38644 0.95622 2.49704 1.04995 2.59L5.28995 6.83C5.38291 6.92373 5.49351 6.99813 5.61537 7.04889C5.73723 7.09966 5.86794 7.1258 5.99995 7.1258C6.13196 7.1258 6.26267 7.09966 6.38453 7.04889C6.50638 6.99813 6.61699 6.92373 6.70995 6.83L10.9999 2.59C11.0937 2.49704 11.1681 2.38644 11.2188 2.26458C11.2696 2.14272 11.2957 2.01202 11.2957 1.88C11.2957 1.74799 11.2696 1.61729 11.2188 1.49543C11.1681 1.37357 11.0937 1.26297 10.9999 1.17Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 111}})
16642
16648
  )
16643
16649
  )
16644
16650
  , opened &&
16645
16651
  React$1.createElement(React$1.Fragment, null
16646
16652
  , options && options.length > 0 &&
16647
- React$1.createElement(OptionsList$1, {__self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 111}}
16653
+ React$1.createElement(OptionsList$1, {__self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 117}}
16648
16654
  , sectionTitle &&
16649
- React$1.createElement('div', { className: "section-title", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 113}}
16655
+ React$1.createElement('div', { className: "section-title", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 119}}
16650
16656
  , sectionTitle
16651
16657
  )
16652
16658
 
16653
16659
  , optionsRec.map((country, index) => (
16654
- React$1.createElement(React$1.Fragment, { key: index, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 118}}
16660
+ React$1.createElement(React$1.Fragment, { key: index, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 124}}
16655
16661
  , !country.subName &&
16656
16662
  React$1.createElement(DropdownOption$1, { onClick: ()=>{
16657
16663
  setPassedOption(country);
@@ -16661,8 +16667,8 @@ const CountrySelector = (props) => {
16661
16667
  setPassedOption(country);
16662
16668
  selectedOption(country);
16663
16669
  },200);
16664
- }, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 120}}
16665
- , country.optionFlag ? React$1.createElement('img', { src: country.optionFlag, alt: "Flag", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 129}}) : React$1.createElement('div', { className: "empty-flag", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 129}})
16670
+ }, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 126}}
16671
+ , country.optionFlag ? React$1.createElement('img', { src: country.optionFlag, alt: "Flag", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 135}}) : React$1.createElement('div', { className: "empty-flag", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 135}})
16666
16672
  , country.optionName
16667
16673
  )
16668
16674
 
@@ -16675,10 +16681,10 @@ const CountrySelector = (props) => {
16675
16681
  setPassedOption(country);
16676
16682
  selectedOption(country);
16677
16683
  },200);
16678
- }, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 134}}
16679
- , React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 143}}, country.optionName)
16680
- , React$1.createElement('div', {__self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 144}}
16681
- , country.subName, country.optionFlag ? React$1.createElement('img', { src: country.optionFlag, alt: "Flag", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 145}}) : React$1.createElement('div', { className: "empty-flag", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 145}})
16684
+ }, __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 140}}
16685
+ , React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 149}}, country.optionName)
16686
+ , React$1.createElement('div', {__self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 150}}
16687
+ , country.subName, country.optionFlag ? React$1.createElement('img', { src: country.optionFlag, alt: "Flag", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 151}}) : React$1.createElement('div', { className: "empty-flag", __self: undefined, __source: {fileName: _jsxFileName$M, lineNumber: 151}})
16682
16688
  )
16683
16689
  )
16684
16690
 
@@ -21483,11 +21489,16 @@ const TextField = (props) => {
21483
21489
  let {label,subtext,errMsg,disabled,required,width,value} = props;
21484
21490
 
21485
21491
  const [borderColor,setBorderColor] = React$1.useState('');
21492
+ const [inputVal,setInputVal] = React$1.useState(value);
21486
21493
  const [err,setErr] = React$1.useState(false);
21487
21494
  const textFieldRef = React$1.useRef();
21488
21495
 
21496
+ React$1.useEffect(()=>{
21497
+ setInputVal(value);
21498
+ },[value]);
21499
+
21489
21500
  function validate(){
21490
- if (value){
21501
+ if (inputVal){
21491
21502
  setBorderColor('success');
21492
21503
  setErr(false);
21493
21504
  }else {
@@ -21506,21 +21517,21 @@ const TextField = (props) => {
21506
21517
  };
21507
21518
 
21508
21519
  return (
21509
- React$1.createElement('div', { style: style, __self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 35}}
21520
+ React$1.createElement('div', { style: style, __self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 40}}
21510
21521
  , label &&
21511
- React$1.createElement(InputLabel$1, {__self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 37}}
21512
- , React$1.createElement('label', {__self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 38}}, label)
21513
- , subtext && React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 39}}, subtext)
21522
+ React$1.createElement(InputLabel$1, {__self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 42}}
21523
+ , React$1.createElement('label', {__self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 43}}, label)
21524
+ , subtext && React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 44}}, subtext)
21514
21525
  )
21515
21526
 
21516
- , React$1.createElement(InputContainer$1, { className: `${borderColor} ${disabled ? 'disabled' : ''}`, style: {width:width ? width : '100%'}, __self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 42}}
21517
- , React$1.createElement(InputField, { ref: textFieldRef, onBlur: ()=>{validate();}, ...props, __self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 43}})
21527
+ , React$1.createElement(InputContainer$1, { className: `${borderColor} ${disabled ? 'disabled' : ''}`, style: {width:width ? width : '100%'}, __self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 47}}
21528
+ , React$1.createElement(InputField, { ref: textFieldRef, onBlur: ()=>{validate();}, value: inputVal, onChange: (e)=>{setInputVal(e.target.value);}, ...props, __self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 48}})
21518
21529
  )
21519
21530
  , !value && required && err &&
21520
- React$1.createElement(ErrorMessage$1, {__self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 46}}
21531
+ React$1.createElement(ErrorMessage$1, {__self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 51}}
21521
21532
  /*exclamation-triangle*/
21522
- , React$1.createElement('svg', { width: "16", height: "14", viewBox: "0 0 16 14" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 48}}
21523
- , React$1.createElement('path', { d: "M8.00006 9.66669C7.86821 9.66669 7.73931 9.70578 7.62968 9.77904C7.52005 9.85229 7.4346 9.95641 7.38414 10.0782C7.33368 10.2 7.32048 10.3341 7.3462 10.4634C7.37193 10.5927 7.43542 10.7115 7.52866 10.8048C7.62189 10.898 7.74068 10.9615 7.87 10.9872C7.99932 11.0129 8.13336 10.9997 8.25518 10.9493C8.377 10.8988 8.48112 10.8134 8.55437 10.7037C8.62763 10.5941 8.66673 10.4652 8.66673 10.3334C8.66673 10.1565 8.59649 9.98697 8.47146 9.86195C8.34644 9.73692 8.17687 9.66669 8.00006 9.66669ZM15.1134 10.6467L9.74673 1.31335C9.57326 1.00236 9.31992 0.743323 9.01285 0.562997C8.70579 0.382672 8.35615 0.287598 8.00006 0.287598C7.64396 0.287598 7.29433 0.382672 6.98726 0.562997C6.6802 0.743323 6.42686 1.00236 6.25339 1.31335L0.92006 10.6467C0.74059 10.9494 0.644155 11.294 0.640489 11.6459C0.636824 11.9978 0.726058 12.3444 0.899184 12.6507C1.07231 12.9571 1.3232 13.2123 1.62652 13.3907C1.92984 13.5691 2.27485 13.6643 2.62673 13.6667H13.3734C13.7281 13.6702 14.0773 13.5793 14.3853 13.4033C14.6933 13.2273 14.949 12.9726 15.126 12.6652C15.3031 12.3579 15.3953 12.009 15.3931 11.6542C15.3908 11.2995 15.2943 10.9518 15.1134 10.6467ZM13.9601 11.98C13.9016 12.084 13.8164 12.1704 13.7132 12.2302C13.61 12.29 13.4927 12.321 13.3734 12.32H2.62673C2.50747 12.321 2.39013 12.29 2.28694 12.2302C2.18375 12.1704 2.0985 12.084 2.04006 11.98C1.98155 11.8787 1.95074 11.7637 1.95074 11.6467C1.95074 11.5297 1.98155 11.4147 2.04006 11.3134L7.37339 1.98002C7.42934 1.87082 7.51433 1.77917 7.61902 1.71518C7.72371 1.65119 7.84403 1.61733 7.96673 1.61733C8.08942 1.61733 8.20974 1.65119 8.31443 1.71518C8.41912 1.77917 8.50411 1.87082 8.56006 1.98002L13.9267 11.3134C13.9929 11.4132 14.0309 11.5291 14.0367 11.6488C14.0426 11.7684 14.0161 11.8875 13.9601 11.9934V11.98ZM8.00006 4.33335C7.82325 4.33335 7.65368 4.40359 7.52866 4.52861C7.40363 4.65364 7.33339 4.82321 7.33339 5.00002V7.66669C7.33339 7.8435 7.40363 8.01307 7.52866 8.13809C7.65368 8.26311 7.82325 8.33335 8.00006 8.33335C8.17687 8.33335 8.34644 8.26311 8.47146 8.13809C8.59649 8.01307 8.66673 7.8435 8.66673 7.66669V5.00002C8.66673 4.82321 8.59649 4.65364 8.47146 4.52861C8.34644 4.40359 8.17687 4.33335 8.00006 4.33335Z" , fill: "#F80000", __self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 49}})
21533
+ , React$1.createElement('svg', { width: "16", height: "14", viewBox: "0 0 16 14" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 53}}
21534
+ , React$1.createElement('path', { d: "M8.00006 9.66669C7.86821 9.66669 7.73931 9.70578 7.62968 9.77904C7.52005 9.85229 7.4346 9.95641 7.38414 10.0782C7.33368 10.2 7.32048 10.3341 7.3462 10.4634C7.37193 10.5927 7.43542 10.7115 7.52866 10.8048C7.62189 10.898 7.74068 10.9615 7.87 10.9872C7.99932 11.0129 8.13336 10.9997 8.25518 10.9493C8.377 10.8988 8.48112 10.8134 8.55437 10.7037C8.62763 10.5941 8.66673 10.4652 8.66673 10.3334C8.66673 10.1565 8.59649 9.98697 8.47146 9.86195C8.34644 9.73692 8.17687 9.66669 8.00006 9.66669ZM15.1134 10.6467L9.74673 1.31335C9.57326 1.00236 9.31992 0.743323 9.01285 0.562997C8.70579 0.382672 8.35615 0.287598 8.00006 0.287598C7.64396 0.287598 7.29433 0.382672 6.98726 0.562997C6.6802 0.743323 6.42686 1.00236 6.25339 1.31335L0.92006 10.6467C0.74059 10.9494 0.644155 11.294 0.640489 11.6459C0.636824 11.9978 0.726058 12.3444 0.899184 12.6507C1.07231 12.9571 1.3232 13.2123 1.62652 13.3907C1.92984 13.5691 2.27485 13.6643 2.62673 13.6667H13.3734C13.7281 13.6702 14.0773 13.5793 14.3853 13.4033C14.6933 13.2273 14.949 12.9726 15.126 12.6652C15.3031 12.3579 15.3953 12.009 15.3931 11.6542C15.3908 11.2995 15.2943 10.9518 15.1134 10.6467ZM13.9601 11.98C13.9016 12.084 13.8164 12.1704 13.7132 12.2302C13.61 12.29 13.4927 12.321 13.3734 12.32H2.62673C2.50747 12.321 2.39013 12.29 2.28694 12.2302C2.18375 12.1704 2.0985 12.084 2.04006 11.98C1.98155 11.8787 1.95074 11.7637 1.95074 11.6467C1.95074 11.5297 1.98155 11.4147 2.04006 11.3134L7.37339 1.98002C7.42934 1.87082 7.51433 1.77917 7.61902 1.71518C7.72371 1.65119 7.84403 1.61733 7.96673 1.61733C8.08942 1.61733 8.20974 1.65119 8.31443 1.71518C8.41912 1.77917 8.50411 1.87082 8.56006 1.98002L13.9267 11.3134C13.9929 11.4132 14.0309 11.5291 14.0367 11.6488C14.0426 11.7684 14.0161 11.8875 13.9601 11.9934V11.98ZM8.00006 4.33335C7.82325 4.33335 7.65368 4.40359 7.52866 4.52861C7.40363 4.65364 7.33339 4.82321 7.33339 5.00002V7.66669C7.33339 7.8435 7.40363 8.01307 7.52866 8.13809C7.65368 8.26311 7.82325 8.33335 8.00006 8.33335C8.17687 8.33335 8.34644 8.26311 8.47146 8.13809C8.59649 8.01307 8.66673 7.8435 8.66673 7.66669V5.00002C8.66673 4.82321 8.59649 4.65364 8.47146 4.52861C8.34644 4.40359 8.17687 4.33335 8.00006 4.33335Z" , fill: "#F80000", __self: undefined, __source: {fileName: _jsxFileName$l, lineNumber: 54}})
21524
21535
  )
21525
21536
  , errMsg ? errMsg : 'This field is required'
21526
21537
  )
@@ -23014,12 +23025,17 @@ const _jsxFileName$b = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\compon
23014
23025
  const TextArea = (props) => {
23015
23026
  let {label,subtext,errMsg,disabled,required,width,value} = props;
23016
23027
 
23017
- const [borderColor,setBorderColor] = React$1.useState('');
23028
+ const [borderColor,setBorderColor] = React$1.useState(value);
23018
23029
  const [err,setErr] = React$1.useState(false);
23030
+ const [inputVal,setInputVal] = React$1.useState('');
23019
23031
  const textFieldRef = React$1.useRef();
23020
23032
 
23033
+ React$1.useEffect(()=>{
23034
+ setInputVal(value );
23035
+ },[value]);
23036
+
23021
23037
  function validate(){
23022
- if (value){
23038
+ if (inputVal){
23023
23039
  setBorderColor('success');
23024
23040
  setErr(false);
23025
23041
  }else {
@@ -23038,21 +23054,21 @@ const TextArea = (props) => {
23038
23054
  };
23039
23055
 
23040
23056
  return (
23041
- React$1.createElement('div', { style: style, __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 35}}
23057
+ React$1.createElement('div', { style: style, __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 40}}
23042
23058
  , label &&
23043
- React$1.createElement(InputLabel, {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 37}}
23044
- , React$1.createElement('label', {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 38}}, label)
23045
- , subtext && React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 39}}, subtext)
23059
+ React$1.createElement(InputLabel, {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 42}}
23060
+ , React$1.createElement('label', {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 43}}, label)
23061
+ , subtext && React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 44}}, subtext)
23046
23062
  )
23047
23063
 
23048
- , React$1.createElement(InputContainer, { className: `${borderColor} ${disabled ? 'disabled' : ''}`, style: {width:width ? width : '100%'}, __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 42}}
23049
- , React$1.createElement(TextAreaField, { ref: textFieldRef, onBlur: ()=>{validate();}, ...props, __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 43}})
23064
+ , React$1.createElement(InputContainer, { className: `${borderColor} ${disabled ? 'disabled' : ''}`, style: {width:width ? width : '100%'}, __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 47}}
23065
+ , React$1.createElement(TextAreaField, { ref: textFieldRef, onBlur: ()=>{validate();}, value: inputVal, onChange: (e)=>{setInputVal(e.target.value);}, ...props, __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 48}})
23050
23066
  )
23051
23067
  , !value && required && err &&
23052
- React$1.createElement(ErrorMessage, {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 46}}
23068
+ React$1.createElement(ErrorMessage, {__self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 51}}
23053
23069
  /*exclamation-triangle*/
23054
- , React$1.createElement('svg', { width: "16", height: "14", viewBox: "0 0 16 14" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 48}}
23055
- , React$1.createElement('path', { d: "M8.00006 9.66669C7.86821 9.66669 7.73931 9.70578 7.62968 9.77904C7.52005 9.85229 7.4346 9.95641 7.38414 10.0782C7.33368 10.2 7.32048 10.3341 7.3462 10.4634C7.37193 10.5927 7.43542 10.7115 7.52866 10.8048C7.62189 10.898 7.74068 10.9615 7.87 10.9872C7.99932 11.0129 8.13336 10.9997 8.25518 10.9493C8.377 10.8988 8.48112 10.8134 8.55437 10.7037C8.62763 10.5941 8.66673 10.4652 8.66673 10.3334C8.66673 10.1565 8.59649 9.98697 8.47146 9.86195C8.34644 9.73692 8.17687 9.66669 8.00006 9.66669ZM15.1134 10.6467L9.74673 1.31335C9.57326 1.00236 9.31992 0.743323 9.01285 0.562997C8.70579 0.382672 8.35615 0.287598 8.00006 0.287598C7.64396 0.287598 7.29433 0.382672 6.98726 0.562997C6.6802 0.743323 6.42686 1.00236 6.25339 1.31335L0.92006 10.6467C0.74059 10.9494 0.644155 11.294 0.640489 11.6459C0.636824 11.9978 0.726058 12.3444 0.899184 12.6507C1.07231 12.9571 1.3232 13.2123 1.62652 13.3907C1.92984 13.5691 2.27485 13.6643 2.62673 13.6667H13.3734C13.7281 13.6702 14.0773 13.5793 14.3853 13.4033C14.6933 13.2273 14.949 12.9726 15.126 12.6652C15.3031 12.3579 15.3953 12.009 15.3931 11.6542C15.3908 11.2995 15.2943 10.9518 15.1134 10.6467ZM13.9601 11.98C13.9016 12.084 13.8164 12.1704 13.7132 12.2302C13.61 12.29 13.4927 12.321 13.3734 12.32H2.62673C2.50747 12.321 2.39013 12.29 2.28694 12.2302C2.18375 12.1704 2.0985 12.084 2.04006 11.98C1.98155 11.8787 1.95074 11.7637 1.95074 11.6467C1.95074 11.5297 1.98155 11.4147 2.04006 11.3134L7.37339 1.98002C7.42934 1.87082 7.51433 1.77917 7.61902 1.71518C7.72371 1.65119 7.84403 1.61733 7.96673 1.61733C8.08942 1.61733 8.20974 1.65119 8.31443 1.71518C8.41912 1.77917 8.50411 1.87082 8.56006 1.98002L13.9267 11.3134C13.9929 11.4132 14.0309 11.5291 14.0367 11.6488C14.0426 11.7684 14.0161 11.8875 13.9601 11.9934V11.98ZM8.00006 4.33335C7.82325 4.33335 7.65368 4.40359 7.52866 4.52861C7.40363 4.65364 7.33339 4.82321 7.33339 5.00002V7.66669C7.33339 7.8435 7.40363 8.01307 7.52866 8.13809C7.65368 8.26311 7.82325 8.33335 8.00006 8.33335C8.17687 8.33335 8.34644 8.26311 8.47146 8.13809C8.59649 8.01307 8.66673 7.8435 8.66673 7.66669V5.00002C8.66673 4.82321 8.59649 4.65364 8.47146 4.52861C8.34644 4.40359 8.17687 4.33335 8.00006 4.33335Z" , fill: "#F80000", __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 49}})
23070
+ , React$1.createElement('svg', { width: "16", height: "14", viewBox: "0 0 16 14" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 53}}
23071
+ , React$1.createElement('path', { d: "M8.00006 9.66669C7.86821 9.66669 7.73931 9.70578 7.62968 9.77904C7.52005 9.85229 7.4346 9.95641 7.38414 10.0782C7.33368 10.2 7.32048 10.3341 7.3462 10.4634C7.37193 10.5927 7.43542 10.7115 7.52866 10.8048C7.62189 10.898 7.74068 10.9615 7.87 10.9872C7.99932 11.0129 8.13336 10.9997 8.25518 10.9493C8.377 10.8988 8.48112 10.8134 8.55437 10.7037C8.62763 10.5941 8.66673 10.4652 8.66673 10.3334C8.66673 10.1565 8.59649 9.98697 8.47146 9.86195C8.34644 9.73692 8.17687 9.66669 8.00006 9.66669ZM15.1134 10.6467L9.74673 1.31335C9.57326 1.00236 9.31992 0.743323 9.01285 0.562997C8.70579 0.382672 8.35615 0.287598 8.00006 0.287598C7.64396 0.287598 7.29433 0.382672 6.98726 0.562997C6.6802 0.743323 6.42686 1.00236 6.25339 1.31335L0.92006 10.6467C0.74059 10.9494 0.644155 11.294 0.640489 11.6459C0.636824 11.9978 0.726058 12.3444 0.899184 12.6507C1.07231 12.9571 1.3232 13.2123 1.62652 13.3907C1.92984 13.5691 2.27485 13.6643 2.62673 13.6667H13.3734C13.7281 13.6702 14.0773 13.5793 14.3853 13.4033C14.6933 13.2273 14.949 12.9726 15.126 12.6652C15.3031 12.3579 15.3953 12.009 15.3931 11.6542C15.3908 11.2995 15.2943 10.9518 15.1134 10.6467ZM13.9601 11.98C13.9016 12.084 13.8164 12.1704 13.7132 12.2302C13.61 12.29 13.4927 12.321 13.3734 12.32H2.62673C2.50747 12.321 2.39013 12.29 2.28694 12.2302C2.18375 12.1704 2.0985 12.084 2.04006 11.98C1.98155 11.8787 1.95074 11.7637 1.95074 11.6467C1.95074 11.5297 1.98155 11.4147 2.04006 11.3134L7.37339 1.98002C7.42934 1.87082 7.51433 1.77917 7.61902 1.71518C7.72371 1.65119 7.84403 1.61733 7.96673 1.61733C8.08942 1.61733 8.20974 1.65119 8.31443 1.71518C8.41912 1.77917 8.50411 1.87082 8.56006 1.98002L13.9267 11.3134C13.9929 11.4132 14.0309 11.5291 14.0367 11.6488C14.0426 11.7684 14.0161 11.8875 13.9601 11.9934V11.98ZM8.00006 4.33335C7.82325 4.33335 7.65368 4.40359 7.52866 4.52861C7.40363 4.65364 7.33339 4.82321 7.33339 5.00002V7.66669C7.33339 7.8435 7.40363 8.01307 7.52866 8.13809C7.65368 8.26311 7.82325 8.33335 8.00006 8.33335C8.17687 8.33335 8.34644 8.26311 8.47146 8.13809C8.59649 8.01307 8.66673 7.8435 8.66673 7.66669V5.00002C8.66673 4.82321 8.59649 4.65364 8.47146 4.52861C8.34644 4.40359 8.17687 4.33335 8.00006 4.33335Z" , fill: "#F80000", __self: undefined, __source: {fileName: _jsxFileName$b, lineNumber: 54}})
23056
23072
  )
23057
23073
  , errMsg ? errMsg : 'This field is required'
23058
23074
  )