Shared:Components: fix defaultProps
This commit is contained in:
parent
51cafd9075
commit
ee7724bf6b
@ -49,25 +49,29 @@ import type { ComboButtonProps } from "../Combobox.types";
|
||||
|
||||
const ComboButton = (props: ComboButtonProps) => {
|
||||
const {
|
||||
noBorder,
|
||||
onClick,
|
||||
isDisabled,
|
||||
|
||||
innerContainer,
|
||||
innerContainerClassName = "innerContainer",
|
||||
|
||||
selectedOption,
|
||||
optionsLength = 0,
|
||||
withOptions = true,
|
||||
withAdvancedOptions = false,
|
||||
isOpen,
|
||||
scaled = false,
|
||||
size,
|
||||
|
||||
comboIcon,
|
||||
fillIcon,
|
||||
modernView = false,
|
||||
tabIndex,
|
||||
isLoading,
|
||||
|
||||
type,
|
||||
plusBadgeValue,
|
||||
noBorder = false,
|
||||
isDisabled = false,
|
||||
withOptions = true,
|
||||
withAdvancedOptions = false,
|
||||
innerContainerClassName = "innerContainer",
|
||||
isOpen = false,
|
||||
size = ComboBoxSize.content,
|
||||
scaled = false,
|
||||
modernView = false,
|
||||
tabIndex = -1,
|
||||
isLoading = false,
|
||||
} = props;
|
||||
|
||||
const defaultOption = selectedOption?.default;
|
||||
@ -174,18 +178,4 @@ const ComboButton = (props: ComboButtonProps) => {
|
||||
);
|
||||
};
|
||||
|
||||
ComboButton.defaultProps = {
|
||||
noBorder: false,
|
||||
isDisabled: false,
|
||||
withOptions: true,
|
||||
withAdvancedOptions: false,
|
||||
innerContainerClassName: "innerContainer",
|
||||
isOpen: false,
|
||||
size: ComboBoxSize.content,
|
||||
scaled: false,
|
||||
modernView: false,
|
||||
tabIndex: -1,
|
||||
isLoading: false,
|
||||
};
|
||||
|
||||
export { ComboButton };
|
||||
|
@ -46,34 +46,43 @@ import { DropDownItemProps } from "./DropDownItem.types";
|
||||
|
||||
const DropDownItem = (props: DropDownItemProps) => {
|
||||
const {
|
||||
isSeparator,
|
||||
isHeader,
|
||||
withHeaderArrow,
|
||||
headerArrowAction,
|
||||
|
||||
icon,
|
||||
children,
|
||||
disabled,
|
||||
className,
|
||||
|
||||
fillIcon = true,
|
||||
isSubMenu,
|
||||
isActive,
|
||||
withoutIcon,
|
||||
noHover,
|
||||
className,
|
||||
|
||||
isSelected,
|
||||
isActiveDescendant,
|
||||
isBeta,
|
||||
additionalElement,
|
||||
setOpen,
|
||||
|
||||
isSeparator = false,
|
||||
isHeader = false,
|
||||
|
||||
disabled = false,
|
||||
noHover = false,
|
||||
|
||||
fillIcon = true,
|
||||
isSubMenu = false,
|
||||
isActive = false,
|
||||
withoutIcon = false,
|
||||
} = props;
|
||||
|
||||
const { t } = useTranslation(["Common"]);
|
||||
const theme = useTheme();
|
||||
|
||||
const { withToggle, checked, onClick, onClickSelectedItem, label, ...rest } =
|
||||
props;
|
||||
const {
|
||||
withToggle,
|
||||
checked,
|
||||
onClick,
|
||||
onClickSelectedItem,
|
||||
label = "",
|
||||
...rest
|
||||
} = props;
|
||||
|
||||
const onClickAction = (
|
||||
e: React.MouseEvent | React.ChangeEvent<HTMLInputElement>,
|
||||
@ -183,20 +192,4 @@ const DropDownItem = (props: DropDownItemProps) => {
|
||||
);
|
||||
};
|
||||
|
||||
DropDownItem.defaultProps = {
|
||||
isSeparator: false,
|
||||
isHeader: false,
|
||||
tabIndex: -1,
|
||||
label: "",
|
||||
disabled: false,
|
||||
noHover: false,
|
||||
textOverflow: false,
|
||||
fillIcon: true,
|
||||
isSubMenu: false,
|
||||
isActive: false,
|
||||
withoutIcon: false,
|
||||
height: 32,
|
||||
heightTablet: 36,
|
||||
};
|
||||
|
||||
export { DropDownItem };
|
||||
|
@ -45,6 +45,12 @@ const DropDown = (props: DropDownProps) => {
|
||||
eventTypes,
|
||||
forceCloseClickOutside,
|
||||
withoutBackground,
|
||||
|
||||
showDisabledItems = false,
|
||||
isDefaultMode = true,
|
||||
fixedDirection = false,
|
||||
offsetLeft = 0,
|
||||
enableKeyboardEvents = true,
|
||||
} = props;
|
||||
|
||||
const toggleDropDown = () => {
|
||||
@ -72,17 +78,17 @@ const DropDown = (props: DropDownProps) => {
|
||||
withoutBackground={withoutBackground}
|
||||
/>
|
||||
) : null}
|
||||
<EnhancedComponent {...eventTypesProp} {...props} />
|
||||
<EnhancedComponent
|
||||
{...eventTypesProp}
|
||||
showDisabledItems={showDisabledItems}
|
||||
isDefaultMode={isDefaultMode}
|
||||
fixedDirection={fixedDirection}
|
||||
offsetLeft={offsetLeft}
|
||||
enableKeyboardEvents={enableKeyboardEvents}
|
||||
{...props}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
};
|
||||
DropDown.defaultProps = {
|
||||
withBackdrop: true,
|
||||
showDisabledItems: false,
|
||||
isDefaultMode: true,
|
||||
fixedDirection: false,
|
||||
offsetLeft: 0,
|
||||
enableKeyboardEvents: true,
|
||||
};
|
||||
|
||||
export { DropDown };
|
||||
|
@ -39,19 +39,33 @@ const TextInputWrapper = ({
|
||||
emailSettings,
|
||||
customValidate,
|
||||
...props
|
||||
}: EmailInputProps & TextInputProps & { isValidEmail?: boolean }) => (
|
||||
<StyledEmailInput {...props} data-testid="email-input" />
|
||||
);
|
||||
}: EmailInputProps & TextInputProps & { isValidEmail?: boolean }) => {
|
||||
return <StyledEmailInput {...props} data-testid="email-input" />;
|
||||
};
|
||||
|
||||
const EmailInput = ({
|
||||
value,
|
||||
onValidateInput,
|
||||
customValidate,
|
||||
emailSettings,
|
||||
|
||||
onBlur,
|
||||
onChange,
|
||||
hasError,
|
||||
|
||||
isAutoFocussed,
|
||||
autoComplete = "email",
|
||||
className = "",
|
||||
hasError = undefined,
|
||||
id = "",
|
||||
isDisabled = false,
|
||||
isReadOnly = false,
|
||||
maxLength = 255,
|
||||
name = "",
|
||||
placeholder = "",
|
||||
scale = false,
|
||||
size = InputSize.base,
|
||||
title = "",
|
||||
withBorder = true,
|
||||
value = "",
|
||||
emailSettings,
|
||||
...rest
|
||||
}: EmailInputProps) => {
|
||||
const [inputValue, setInputValue] = React.useState(value);
|
||||
@ -65,7 +79,7 @@ const EmailInput = ({
|
||||
return customValidate(v);
|
||||
}
|
||||
|
||||
const emailObj = parseAddress(v, emailSettings);
|
||||
const emailObj = parseAddress(v, emailSettings ?? new EmailSettings());
|
||||
const isValid = emailObj.isValid();
|
||||
const parsedErrors = emailObj.parseErrors;
|
||||
const errors = parsedErrors
|
||||
@ -124,6 +138,18 @@ const EmailInput = ({
|
||||
return (
|
||||
<TextInputWrapper
|
||||
{...rest}
|
||||
className={className}
|
||||
autoComplete={autoComplete}
|
||||
id={id}
|
||||
isDisabled={isDisabled}
|
||||
isReadOnly={isReadOnly}
|
||||
maxLength={maxLength}
|
||||
name={name}
|
||||
placeholder={placeholder}
|
||||
scale={scale}
|
||||
size={size}
|
||||
title={title}
|
||||
withBorder={withBorder}
|
||||
isAutoFocussed={isMobile && isIOS ? false : isAutoFocussed}
|
||||
hasError={isError}
|
||||
value={inputValue}
|
||||
@ -135,22 +161,4 @@ const EmailInput = ({
|
||||
);
|
||||
};
|
||||
|
||||
EmailInput.defaultProps = {
|
||||
autoComplete: "email",
|
||||
className: "",
|
||||
hasError: undefined,
|
||||
id: "",
|
||||
isDisabled: false,
|
||||
isReadOnly: false,
|
||||
maxLength: 255,
|
||||
name: "",
|
||||
placeholder: "",
|
||||
scale: false,
|
||||
size: InputSize.base,
|
||||
title: "",
|
||||
value: "",
|
||||
withBorder: true,
|
||||
emailSettings: new EmailSettings(),
|
||||
};
|
||||
|
||||
export { EmailInput };
|
||||
|
@ -72,4 +72,8 @@ export interface EmailInputProps {
|
||||
type: InputType;
|
||||
/** Used as HTML `tabindex` property */
|
||||
tabIndex?: number;
|
||||
|
||||
withBorder?: boolean;
|
||||
maxLength?: number;
|
||||
title?: string;
|
||||
}
|
||||
|
@ -38,9 +38,9 @@ import { HelpButtonProps } from "./HelpButton.types";
|
||||
const HelpButton = (props: HelpButtonProps) => {
|
||||
const {
|
||||
id,
|
||||
className,
|
||||
className = "icon-button",
|
||||
iconName,
|
||||
size,
|
||||
size = 12,
|
||||
color,
|
||||
dataTip,
|
||||
getContent,
|
||||
@ -65,7 +65,7 @@ const HelpButton = (props: HelpButtonProps) => {
|
||||
id={currentId}
|
||||
className={classNames([className], "help-icon") || "help-icon"}
|
||||
isClickable
|
||||
iconName={iconName || InfoReactSvgUrl}
|
||||
iconName={iconName ?? InfoReactSvgUrl}
|
||||
size={size}
|
||||
color={color}
|
||||
data-for={currentId}
|
||||
@ -102,11 +102,4 @@ const HelpButton = (props: HelpButtonProps) => {
|
||||
);
|
||||
};
|
||||
|
||||
HelpButton.defaultProps = {
|
||||
iconName: InfoReactSvgUrl,
|
||||
// place: "top",
|
||||
className: "icon-button",
|
||||
size: 12,
|
||||
};
|
||||
|
||||
export { HelpButton };
|
||||
|
@ -35,16 +35,34 @@ export { LinkType, LinkTarget };
|
||||
const Link = ({
|
||||
isTextOverflow,
|
||||
children,
|
||||
noHover,
|
||||
enableUserSelect,
|
||||
className = "",
|
||||
fontSize = "13px",
|
||||
href = undefined,
|
||||
isBold = false,
|
||||
isHovered = false,
|
||||
isSemitransparent = false,
|
||||
noHover = false,
|
||||
rel = "noopener noreferrer",
|
||||
tabIndex = -1,
|
||||
type = LinkType.page,
|
||||
enableUserSelect = false,
|
||||
...rest
|
||||
}: LinkProps) => {
|
||||
return (
|
||||
<StyledText
|
||||
className={className}
|
||||
fontSize={fontSize}
|
||||
href={href}
|
||||
isBold={isBold}
|
||||
isHovered={isHovered}
|
||||
isSemitransparent={isSemitransparent}
|
||||
rel={rel}
|
||||
tabIndex={tabIndex}
|
||||
type={type}
|
||||
tag="a"
|
||||
isTextOverflow={isTextOverflow}
|
||||
noHover={noHover}
|
||||
truncate={isTextOverflow || false}
|
||||
truncate={isTextOverflow ?? false}
|
||||
enableUserSelect={enableUserSelect}
|
||||
data-testid="link"
|
||||
{...rest}
|
||||
@ -54,19 +72,4 @@ const Link = ({
|
||||
);
|
||||
};
|
||||
|
||||
Link.defaultProps = {
|
||||
className: "",
|
||||
fontSize: "13px",
|
||||
href: undefined,
|
||||
isBold: false,
|
||||
isHovered: false,
|
||||
isSemitransparent: false,
|
||||
isTextOverflow: false,
|
||||
noHover: false,
|
||||
rel: "noopener noreferrer",
|
||||
tabIndex: -1,
|
||||
type: LinkType.page,
|
||||
enableUserSelect: false,
|
||||
};
|
||||
|
||||
export { Link };
|
||||
|
Loading…
Reference in New Issue
Block a user