@designbasekorea/ui 0.2.34 → 0.2.35
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.css +1 -1
- package/dist/index.css.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.esm.css +1 -1
- package/dist/index.esm.css.map +1 -1
- package/dist/index.esm.js +3 -3
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +3 -3
- package/dist/index.js.map +1 -1
- package/dist/index.umd.css +1 -1
- package/dist/index.umd.css.map +1 -1
- package/dist/index.umd.js +3 -3
- package/dist/index.umd.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -4013,7 +4013,7 @@ ModalHeader.displayName = 'ModalHeader';
|
|
|
4013
4013
|
ModalBody.displayName = 'ModalBody';
|
|
4014
4014
|
ModalFooter.displayName = 'ModalFooter';
|
|
4015
4015
|
|
|
4016
|
-
const Label = ({ children, htmlFor, required = false, size = '
|
|
4016
|
+
const Label = ({ children, htmlFor, required = false, size = 's', disabled = false, error = false, className, onClick, }) => {
|
|
4017
4017
|
const classes = [
|
|
4018
4018
|
'designbase-label',
|
|
4019
4019
|
`designbase-label--${size}`,
|
|
@@ -4060,7 +4060,7 @@ const Input = React.forwardRef(({ type = 'text', label, placeholder, defaultValu
|
|
|
4060
4060
|
lg: 18,
|
|
4061
4061
|
};
|
|
4062
4062
|
const iconSize = iconSizeMap[size];
|
|
4063
|
-
return (jsxRuntime.jsxs("div", { className: classes, children: [label && (jsxRuntime.jsx(Label, { htmlFor: inputId, required: required, error: error, disabled: disabled, size: size === 's' ? '
|
|
4063
|
+
return (jsxRuntime.jsxs("div", { className: classes, children: [label && (jsxRuntime.jsx(Label, { htmlFor: inputId, required: required, error: error, disabled: disabled, size: size === 's' ? 's' : size === 'm' ? 'm' : 'l', children: label })), jsxRuntime.jsxs("div", { className: "designbase-input__wrapper", children: [actualStartIcon && (jsxRuntime.jsx("div", { className: "designbase-input__start-icon", children: React.createElement(actualStartIcon, { size: iconSize }) })), jsxRuntime.jsx("input", { ...props, ref: forwardedRef, id: inputId, type: actualType, value: value, defaultValue: defaultValue, placeholder: placeholder, disabled: disabled, readOnly: readOnly, required: required, className: inputClasses, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, "aria-describedby": clsx(helperText && helperTextId, error && errorMessage && errorMessageId), "aria-invalid": error }), isPassword && (jsxRuntime.jsx("button", { type: "button", className: "designbase-input__password-toggle", onClick: handlePasswordToggle, disabled: disabled, "aria-label": showPassword ? '비밀번호 숨기기' : '비밀번호 보기', children: React.createElement(PasswordIcon, { size: iconSize }) })), EndIcon && !isPassword && (jsxRuntime.jsx("div", { className: "designbase-input__end-icon", children: React.createElement(EndIcon, { size: iconSize }) }))] }), helperText && !error && (jsxRuntime.jsx("p", { id: helperTextId, className: "designbase-input__helper-text", children: helperText })), error && errorMessage && (jsxRuntime.jsx("p", { id: errorMessageId, className: "designbase-input__error-message", children: errorMessage }))] }));
|
|
4064
4064
|
});
|
|
4065
4065
|
Input.displayName = 'Input';
|
|
4066
4066
|
|
|
@@ -7003,7 +7003,7 @@ const Textarea = React.forwardRef(({ label, placeholder, defaultValue, value, si
|
|
|
7003
7003
|
}, className);
|
|
7004
7004
|
const textareaClasses = clsx('designbase-textarea__field', textareaClassName);
|
|
7005
7005
|
const isOverLimit = maxLength && currentLength > maxLength;
|
|
7006
|
-
return (jsxRuntime.jsxs("div", { className: classes, children: [label && (jsxRuntime.jsx(Label, { htmlFor: textareaId, required: required, error: error, disabled: disabled, size: size === 's' ? '
|
|
7006
|
+
return (jsxRuntime.jsxs("div", { className: classes, children: [label && (jsxRuntime.jsx(Label, { htmlFor: textareaId, required: required, error: error, disabled: disabled, size: size === 's' ? 's' : size === 'm' ? 'm' : 'l', children: label })), showCharacterCount && characterCountPosition === 'top' && (jsxRuntime.jsx("div", { className: "designbase-textarea__character-count designbase-textarea__character-count--top", children: jsxRuntime.jsxs("span", { className: clsx('designbase-textarea__character-count-text', {
|
|
7007
7007
|
'designbase-textarea__character-count-text--error': isOverLimit
|
|
7008
7008
|
}), children: [currentLength, maxLength && ` / ${maxLength}`] }) })), jsxRuntime.jsx("div", { className: "designbase-textarea__wrapper", children: jsxRuntime.jsx("textarea", { ref: forwardedRef, id: textareaId, className: textareaClasses, placeholder: placeholder, defaultValue: defaultValue, value: value, rows: rows, maxLength: maxLength, disabled: disabled, readOnly: readOnly, required: required, "aria-describedby": clsx({
|
|
7009
7009
|
[helperTextId]: helperText,
|