fis-component 0.0.64 → 0.0.65
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/cjs/index.js +14 -5
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/src/components/LinkButton/index.d.ts +4 -0
- package/dist/cjs/types/src/components/LinkButton/styles.d.ts +1 -0
- package/dist/esm/index.js +14 -5
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/src/components/LinkButton/index.d.ts +4 -0
- package/dist/esm/types/src/components/LinkButton/styles.d.ts +1 -0
- package/dist/index.d.ts +4 -0
- package/package.json +1 -1
|
@@ -18,6 +18,10 @@ export interface ButtonProps extends ComponentPropsWithoutRef<"button"> {
|
|
|
18
18
|
* Defines the type of the button.
|
|
19
19
|
*/
|
|
20
20
|
underline?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* If true, text will be truncated with ellipsis on single line
|
|
23
|
+
*/
|
|
24
|
+
singleLine?: boolean;
|
|
21
25
|
}
|
|
22
26
|
declare const FISLinkButton: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
23
27
|
export default FISLinkButton;
|
|
@@ -3,6 +3,7 @@ interface ButtonProps {
|
|
|
3
3
|
$variant?: ButtonVariant;
|
|
4
4
|
$size: ButtonSize;
|
|
5
5
|
$underline?: boolean;
|
|
6
|
+
$singleLine?: boolean;
|
|
6
7
|
}
|
|
7
8
|
export declare const LinkButtonStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, ButtonProps>> & string;
|
|
8
9
|
export declare const IconStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
|
package/dist/esm/index.js
CHANGED
|
@@ -60832,6 +60832,15 @@ const LinkButtonStyled = styled.button `
|
|
|
60832
60832
|
css `
|
|
60833
60833
|
text-decoration: underline;
|
|
60834
60834
|
`}
|
|
60835
|
+
|
|
60836
|
+
${(props) => props.$singleLine &&
|
|
60837
|
+
css `
|
|
60838
|
+
.button-content {
|
|
60839
|
+
white-space: nowrap;
|
|
60840
|
+
overflow: hidden;
|
|
60841
|
+
text-overflow: ellipsis;
|
|
60842
|
+
}
|
|
60843
|
+
`}
|
|
60835
60844
|
`;
|
|
60836
60845
|
const IconStyled$1 = styled.span `
|
|
60837
60846
|
display: inline-flex;
|
|
@@ -60839,10 +60848,10 @@ const IconStyled$1 = styled.span `
|
|
|
60839
60848
|
`;
|
|
60840
60849
|
|
|
60841
60850
|
const FISLinkButton = forwardRef((props, ref) => {
|
|
60842
|
-
const {
|
|
60851
|
+
const { children, size = "sm", variant = "default", underline, startIcon: startIconProp, endIcon: endIconProp, singleLine = false, ...rest } = props;
|
|
60843
60852
|
const startIcon = startIconProp && (jsx(IconStyled$1, { className: "button-icon", children: startIconProp }));
|
|
60844
60853
|
const endIcon = endIconProp && (jsx(IconStyled$1, { className: "button-icon", children: endIconProp }));
|
|
60845
|
-
return (jsxs(LinkButtonStyled, { ...rest, ref: ref, "$variant": variant, "$size": size, "$underline": underline, children: [startIcon, jsx("span", { className: "button-content", children: children }), endIcon] }));
|
|
60854
|
+
return (jsxs(LinkButtonStyled, { ...rest, ref: ref, "$variant": variant, "$size": size, "$underline": underline, "$singleLine": singleLine, children: [startIcon, jsx("span", { className: "button-content", children: children }), endIcon] }));
|
|
60846
60855
|
});
|
|
60847
60856
|
FISLinkButton.displayName = "FISLinkButton";
|
|
60848
60857
|
|
|
@@ -61456,7 +61465,7 @@ function FISProgressCircular({ variant, ...rest }) {
|
|
|
61456
61465
|
FISProgressCircular.displayName = "FISProgressCircular";
|
|
61457
61466
|
|
|
61458
61467
|
const FISIconButton = forwardRef((props, ref) => {
|
|
61459
|
-
const {
|
|
61468
|
+
const { children, active = false, size = "md", variant = "primary", icon: iconProp, loading = false, disabled = false, ...rest } = props;
|
|
61460
61469
|
return (jsx(ButtonStyled, { type: "button", ...rest, ref: ref, "$variant": variant, "$size": size, "$active": active, "$loading": loading, disabled: disabled || loading, children: loading ? (jsx(FISProgressCircular, { size: size, variant: "indeterminate", invert: variant === "primary-white" ||
|
|
61461
61470
|
variant === "secondary-white" ||
|
|
61462
61471
|
variant === "secondary-invisible-white" })) : (iconProp) }));
|
|
@@ -62377,10 +62386,10 @@ const ProgressCircularSC$1 = styled(FISProgressCircular) `
|
|
|
62377
62386
|
`;
|
|
62378
62387
|
|
|
62379
62388
|
const FISButton = forwardRef((props, ref) => {
|
|
62380
|
-
const { active,
|
|
62389
|
+
const { active, children, size = "md", variant = "primary", loading, disabled = false, startIcon: startIconProp, endIcon: endIconProp, ...rest } = props;
|
|
62381
62390
|
const startIcon = startIconProp && jsx(SpanIconSC$2, { children: startIconProp });
|
|
62382
62391
|
const endIcon = endIconProp && jsx(SpanIconSC$2, { children: endIconProp });
|
|
62383
|
-
return (jsxs(ButtonSC, {
|
|
62392
|
+
return (jsxs(ButtonSC, { ...rest, ref: ref, "$variant": variant, "$size": size, "$active": active, "$loading": loading, disabled: disabled || loading, children: [loading && (jsx(ProgressCircularSC$1, { size: size, variant: "indeterminate", invert: variant === "primary-white" || variant === "secondary-white" })), startIcon, jsx("span", { className: "button-content", children: children }), endIcon] }));
|
|
62384
62393
|
});
|
|
62385
62394
|
FISButton.displayName = "FISButton";
|
|
62386
62395
|
|