@team-monolith/cds 1.59.1 → 1.60.0
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.
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React, { ButtonHTMLAttributes } from "react";
|
|
2
2
|
import { PolymorphicProps } from "@mui/base";
|
|
3
|
+
import { ButtonProps } from "./Button";
|
|
3
4
|
export type SquareButtonColor = "danger" | "primary" | "grey" | "icon" | "black" | "white";
|
|
4
5
|
export type SquareButtonSize = "large" | "medium" | "small" | "xsmall";
|
|
5
6
|
export interface SquareButtonOwnProps<RootComponentType extends React.ElementType> {
|
|
@@ -23,6 +24,8 @@ export interface SquareButtonOwnProps<RootComponentType extends React.ElementTyp
|
|
|
23
24
|
loading?: boolean;
|
|
24
25
|
/** 버튼 클릭 시 호출될 콜백 함수 */
|
|
25
26
|
onClick?: React.MouseEventHandler<HTMLButtonElement>;
|
|
27
|
+
/** 버튼에 전달될 Props */
|
|
28
|
+
buttonProps?: Omit<ButtonProps, "disabled" | "color" | "type" | "size" | "icon" | "label" | "loading" | "fullWidth" | "onClick">;
|
|
26
29
|
}
|
|
27
30
|
export type SquareButtonProps<RootComponentType extends React.ElementType = SquareButtonTypeMap["defaultComponent"]> = PolymorphicProps<SquareButtonTypeMap<RootComponentType>, RootComponentType>;
|
|
28
31
|
export interface SquareButtonTypeMap<RootComponentType extends React.ElementType = "span"> {
|
|
@@ -168,7 +168,7 @@ const SIZE_TO_LABEL_STYLE = {
|
|
|
168
168
|
* [피그마](https://www.figma.com/file/yhrRFizzmhPoHdw9FbYow2/Codle-PD-Kit---Components?type=design&node-id=22-374&t=kTLv3t86qtGalHSS-0)
|
|
169
169
|
*/
|
|
170
170
|
const SquareButton = React.forwardRef(function SquareButton(props, ref) {
|
|
171
|
-
const { className, component: Component = "span", disabled, type = "button", color, size, icon, label, fullWidth, onClick, loading = false } = props, other = __rest(props, ["className", "component", "disabled", "type", "color", "size", "icon", "label", "fullWidth", "onClick", "loading"]);
|
|
171
|
+
const { className, component: Component = "span", disabled, type = "button", color, size, icon, label, fullWidth, onClick, loading = false, buttonProps } = props, other = __rest(props, ["className", "component", "disabled", "type", "color", "size", "icon", "label", "fullWidth", "onClick", "loading", "buttonProps"]);
|
|
172
172
|
return (_jsxs(Component, Object.assign({}, other, { ref: ref, className: className, css: css `
|
|
173
173
|
display: flex;
|
|
174
174
|
flex-direction: column;
|
|
@@ -176,7 +176,7 @@ const SquareButton = React.forwardRef(function SquareButton(props, ref) {
|
|
|
176
176
|
gap: 8px;
|
|
177
177
|
|
|
178
178
|
width: ${fullWidth ? "100%" : "fit-content"};
|
|
179
|
-
` }, { children: [_jsx(Button, Object.assign({ type: type, color: color, size: size, disabled: disabled || loading, fullWidth: fullWidth, onClick: onClick }, { children: loading ? _jsx(Spinner, {}) : icon })), label && (_jsx(Label, Object.assign({ disabled: disabled || loading, size: size }, { children: label })))] })));
|
|
179
|
+
` }, { children: [_jsx(Button, Object.assign({}, buttonProps, { type: type, color: color, size: size, disabled: disabled || loading, fullWidth: fullWidth, onClick: onClick }, { children: loading ? _jsx(Spinner, {}) : icon })), label && (_jsx(Label, Object.assign({ disabled: disabled || loading, size: size }, { children: label })))] })));
|
|
180
180
|
});
|
|
181
181
|
const Button = styled.button `
|
|
182
182
|
cursor: pointer;
|