sag_components 2.0.0-beta185 → 2.0.0-beta186

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
@@ -35620,7 +35620,7 @@ const Input$2 = _ref => {
35620
35620
  disabled,
35621
35621
  isDarkerBackground = false,
35622
35622
  width,
35623
- height = '50px',
35623
+ height = "50px",
35624
35624
  error,
35625
35625
  errorMessage,
35626
35626
  labelColor,
@@ -35634,7 +35634,7 @@ const Input$2 = _ref => {
35634
35634
  maxLength
35635
35635
  } = _ref;
35636
35636
  const [isFocused, setIsFocused] = React$1.useState(false);
35637
- const [inputValue, setInputValue] = React$1.useState('');
35637
+ const [inputValue, setInputValue] = React$1.useState("");
35638
35638
  const [showPassword, setShowPassword] = React$1.useState(false);
35639
35639
  const inputRef = React$1.useRef(null);
35640
35640
  const containerRef = React$1.useRef(null);
@@ -35655,7 +35655,7 @@ const Input$2 = _ref => {
35655
35655
  inputRef?.current?.focus();
35656
35656
  }
35657
35657
  onChange({
35658
- newValue: e.target.value || ''
35658
+ newValue: e.target.value || ""
35659
35659
  });
35660
35660
  };
35661
35661
  const handleFocus = () => {
@@ -35681,18 +35681,18 @@ const Input$2 = _ref => {
35681
35681
  });
35682
35682
  };
35683
35683
  const getLeftIcon = () => {
35684
- if (!leftIcon || leftIcon === 'none') return '';
35685
- return getIcon(leftIcon, '14px', '14px', error ? 'red' : labelColor, disabled, 'pointer', leftIconOnClickHandler);
35684
+ if (!leftIcon || leftIcon === "none") return "";
35685
+ return getIcon(leftIcon, "14px", "14px", error ? "red" : labelColor, disabled, "pointer", leftIconOnClickHandler);
35686
35686
  };
35687
35687
  const getRightIcon = () => {
35688
- if (!rightIcon || rightIcon === 'none') return '';
35689
- return getIcon(rightIcon, '14px', '14px', error ? 'red' : labelColor, disabled, 'pointer', rightIconOnClickHandler);
35688
+ if (!rightIcon || rightIcon === "none") return "";
35689
+ return getIcon(rightIcon, "14px", "14px", error ? "red" : labelColor, disabled, "pointer", rightIconOnClickHandler);
35690
35690
  };
35691
35691
  const toggleShowPassword = () => {
35692
35692
  setShowPassword(!showPassword);
35693
35693
  };
35694
35694
  const getPasswordIcon = () => {
35695
- if (!password) return '';
35695
+ if (!password) return "";
35696
35696
  if (showPassword) {
35697
35697
  return /*#__PURE__*/React__default["default"].createElement(IconWrapper$1, {
35698
35698
  className: "passwordEyeSlash",
@@ -35700,16 +35700,16 @@ const Input$2 = _ref => {
35700
35700
  onClick: toggleShowPassword
35701
35701
  }, /*#__PURE__*/React__default["default"].createElement(FaEyeSlash, {
35702
35702
  onClick: toggleShowPassword,
35703
- color: error ? 'red' : labelColor
35703
+ color: error ? "red" : labelColor
35704
35704
  }));
35705
35705
  }
35706
- return getIcon('eye', '14px', '14px', error ? 'red' : labelColor, disabled, 'pointer', toggleShowPassword);
35706
+ return getIcon("eye", "14px", "14px", error ? "red" : labelColor, disabled, "pointer", toggleShowPassword);
35707
35707
  };
35708
35708
 
35709
35709
  // Calculate dynamic height for multiline inputs
35710
35710
  const calculateHeight = () => {
35711
35711
  if (!multiline) return height;
35712
- const baseHeight = size === 'small' ? 32 : 52;
35712
+ const baseHeight = size === "small" ? 32 : 52;
35713
35713
  const lineHeight = 20;
35714
35714
  const padding = 10;
35715
35715
  return `${baseHeight + (rows - 1) * lineHeight + padding}px`;
@@ -35722,7 +35722,8 @@ const Input$2 = _ref => {
35722
35722
  size: size,
35723
35723
  disabled: disabled,
35724
35724
  isDarkerBackground: isDarkerBackground,
35725
- multiline: multiline
35725
+ multiline: multiline,
35726
+ onClick: onClick
35726
35727
  }, /*#__PURE__*/React__default["default"].createElement(InputContainer, {
35727
35728
  className: "InputContainer",
35728
35729
  labelColor: labelColor,
@@ -35748,7 +35749,7 @@ const Input$2 = _ref => {
35748
35749
  isFocused: isFocused,
35749
35750
  labelColor: labelColor,
35750
35751
  hasValue: inputValue,
35751
- leftIcon: !multiline ? leftIcon : 'none',
35752
+ leftIcon: !multiline ? leftIcon : "none",
35752
35753
  disabled: disabled,
35753
35754
  isDarkerBackground: isDarkerBackground,
35754
35755
  error: error,
@@ -35758,13 +35759,13 @@ const Input$2 = _ref => {
35758
35759
  multiline: multiline
35759
35760
  }, inputValue ? label : labelEmptyValue || label, required && /*#__PURE__*/React__default["default"].createElement("span", {
35760
35761
  style: {
35761
- color: disabled ? '#D0D0D0' : 'red',
35762
- height: '16px'
35762
+ color: disabled ? "#D0D0D0" : "red",
35763
+ height: "16px"
35763
35764
  }
35764
35765
  }, "*")), /*#__PURE__*/React__default["default"].createElement(InputElement, {
35765
35766
  className: multiline ? "StyledTextarea" : "StyledInput",
35766
35767
  ref: inputRef,
35767
- type: password && !showPassword ? 'password' : 'text',
35768
+ type: password && !showPassword ? "password" : "text",
35768
35769
  value: inputValue,
35769
35770
  onChange: handleInputChange,
35770
35771
  onClick: handleLabelClick,
@@ -35772,7 +35773,7 @@ const Input$2 = _ref => {
35772
35773
  onBlur: handleBlur,
35773
35774
  disabled: disabled,
35774
35775
  isDarkerBackground: isDarkerBackground,
35775
- placeholder: isFocused ? placeHolder : '',
35776
+ placeholder: isFocused ? placeHolder : "",
35776
35777
  error: error,
35777
35778
  height: calculateHeight(),
35778
35779
  isFocused: isFocused,
@@ -35784,10 +35785,10 @@ const Input$2 = _ref => {
35784
35785
  width: width
35785
35786
  }, errorMessage), multiline && maxLength && /*#__PURE__*/React__default["default"].createElement("div", {
35786
35787
  style: {
35787
- fontSize: '12px',
35788
- color: inputValue.length > maxLength * 0.9 ? 'orange' : '#666',
35789
- textAlign: 'right',
35790
- marginTop: '4px'
35788
+ fontSize: "12px",
35789
+ color: inputValue.length > maxLength * 0.9 ? "orange" : "#666",
35790
+ textAlign: "right",
35791
+ marginTop: "4px"
35791
35792
  }
35792
35793
  }, inputValue.length, "/", maxLength));
35793
35794
  };
@@ -35816,19 +35817,19 @@ Input$2.propTypes = {
35816
35817
  maxLength: PropTypes.number
35817
35818
  };
35818
35819
  Input$2.defaultProps = {
35819
- placeHolder: 'Type...',
35820
- label: '',
35821
- labelEmptyValue: '',
35822
- size: 'medium',
35823
- labelColor: '#066768',
35820
+ placeHolder: "Type...",
35821
+ label: "",
35822
+ labelEmptyValue: "",
35823
+ size: "medium",
35824
+ labelColor: "#066768",
35824
35825
  required: true,
35825
- width: '300px',
35826
+ width: "300px",
35826
35827
  disabled: false,
35827
35828
  error: false,
35828
- errorMessage: '',
35829
- selectedValue: '',
35830
- leftIcon: 'none',
35831
- rightIcon: 'none',
35829
+ errorMessage: "",
35830
+ selectedValue: "",
35831
+ leftIcon: "none",
35832
+ rightIcon: "none",
35832
35833
  leftIconOnClick: () => {},
35833
35834
  rightIconOnClick: () => {},
35834
35835
  onBlur: () => {},