@wireapp/react-ui-kit 9.16.4 → 9.17.0

package/lib/Form/Button.d.ts

@@ -1,5 +1,3 @@
-import { CSSObject } from '@emotion/react';
-import { Theme } from '../Layout';
 import { TextProps } from '../Text';
 export declare enum ButtonVariant {
     PRIMARY = "primary",
@@ -15,8 +13,8 @@ export interface ButtonProps<T = HTMLButtonElement> extends TextProps<T> {
     loadingColor?: string;
     noCapital?: boolean;
     showLoading?: boolean;
+    isActive?: boolean;
 }
-export declare const buttonStyle: <T>(theme: Theme, props: ButtonProps<T>) => CSSObject;
 export declare const Button: ({ showLoading, children, loadingColor, ...props }: ButtonProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export declare const filterButtonProps: (props: ButtonProps) => Object;
 //# sourceMappingURL=Button.d.ts.map

package/lib/Form/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Form/Button.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,OAAO,EAAC,KAAK,EAAC,MAAM,WAAW,CAAC;AAEhC,OAAO,EAAC,SAAS,EAA6B,MAAM,SAAS,CAAC;AAG9D,oBAAY,aAAa;IACvB,OAAO,YAAY;IACnB,SAAS,cAAc;IACvB,QAAQ,aAAa;IACrB,UAAU,eAAe;IACzB,IAAI,SAAS;IACb,MAAM,WAAW;CAClB;AAED,MAAM,WAAW,WAAW,CAAC,CAAC,GAAG,iBAAiB,CAAE,SAAQ,SAAS,CAAC,CAAC,CAAC;IACtE,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,eAAO,MAAM,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,SAsKpE,CAAC;AAEH,eAAO,MAAM,MAAM,sDAAmE,WAAW,qDAIhG,CAAC;AAEF,eAAO,MAAM,iBAAiB,UAAW,WAAW,WAEnD,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Form/Button.tsx"],"names":[],"mappings":"AAwBA,OAAO,EAAC,SAAS,EAAkB,MAAM,SAAS,CAAC;AAGnD,oBAAY,aAAa;IACvB,OAAO,YAAY;IACnB,SAAS,cAAc;IACvB,QAAQ,aAAa;IACrB,UAAU,eAAe;IACzB,IAAI,SAAS;IACb,MAAM,WAAW;CAClB;AAED,MAAM,WAAW,WAAW,CAAC,CAAC,GAAG,iBAAiB,CAAE,SAAQ,SAAS,CAAC,CAAC,CAAC;IACtE,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,MAAM,sDAAmE,WAAW,qDAIhG,CAAC;AAEF,eAAO,MAAM,iBAAiB,UAAW,WAAW,WAEnD,CAAC"}

package/lib/Form/Button.js

@@ -11,10 +11,28 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.filterButtonProps = exports.Button = exports.buttonStyle = exports.ButtonVariant = void 0;
+exports.filterButtonProps = exports.Button = exports.ButtonVariant = void 0;
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+/*
+ * Wire
+ * Copyright (C) 2018 Wire Swiss GmbH
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see http://www.gnu.org/licenses/.
+ *
+ */
+const Button_styles_1 = require("./Button.styles");
 const Identity_1 = require("../Identity");
-const motions_1 = require("../Identity/motions");
 const Misc_1 = require("../Misc");
 const Text_1 = require("../Text");
 const util_1 = require("../util");
@@ -27,98 +45,9 @@ var ButtonVariant;
     ButtonVariant["SEND"] = "send";
     ButtonVariant["CANCEL"] = "cancel";
 })(ButtonVariant || (exports.ButtonVariant = ButtonVariant = {}));
-const buttonStyle = (theme, _a) => {
-    var { variant = ButtonVariant.PRIMARY, backgroundColor, block = false, disabled = false, noCapital = false, bold = true, center = true, color = Identity_1.COLOR.WHITE, fontSize = theme.fontSizes.base, noWrap = true, textTransform = 'none', truncate = true } = _a, props = __rest(_a, ["variant", "backgroundColor", "block", "disabled", "noCapital", "bold", "center", "color", "fontSize", "noWrap", "textTransform", "truncate"]);
-    return (Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (0, Text_1.textStyle)(theme, Object.assign({ block,
-        bold,
-        center,
-        disabled,
-        fontSize,
-        noWrap,
-        textTransform,
-        truncate }, props))), { border: 0, cursor: disabled ? 'default' : 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center', marginBottom: '16px', padding: 0, outline: 'none', textDecoration: 'none', touchAction: 'manipulation', transition: motions_1.defaultTransition, width: block ? '100%' : 'auto', '&:hover, &:focus': {
-            textDecoration: 'none',
-        } }), (variant !== ButtonVariant.TERTIARY && Object.assign({ borderRadius: variant === ButtonVariant.SEND ? '100%' : '16px', height: variant === ButtonVariant.SEND ? '40px' : '48px', lineHeight: variant === ButtonVariant.SEND ? '40px' : '48px' }, (variant !== ButtonVariant.SEND && {
-        maxWidth: '100%',
-        minWidth: '125px',
-        padding: '0 16px',
-    })))), (variant === ButtonVariant.PRIMARY && Object.assign({ backgroundColor: backgroundColor || (disabled ? theme.Button.primaryDisabledBg : theme.Button.primaryBg), color: disabled ? theme.Button.primaryDisabledText : theme.general.contrastColor }, (!disabled && {
-        '&:hover, &:focus': {
-            backgroundColor: theme.Button.primaryHoverBg,
-        },
-        '&:focus': {
-            border: `1px solid ${theme.Button.primaryFocusBorder}`,
-        },
-        '&:active': {
-            backgroundColor: theme.Button.primaryActiveBg,
-            border: `1px solid ${theme.Button.primaryActiveBorder}`,
-            color: Identity_1.COLOR.WHITE,
-        },
-    })))), (variant === ButtonVariant.SECONDARY && Object.assign({ backgroundColor: backgroundColor || (disabled ? theme.IconButton.primaryDisabledBgColor : theme.IconButton.primaryBgColor), border: `1px solid ${theme.IconButton.primaryBorderColor}`, color: disabled ? theme.Input.placeholderColor : theme.general.color }, (!disabled && {
-        '&:hover, &:focus': {
-            border: `1px solid ${theme.Button.secondaryHoverBorder}`,
-        },
-        '&:focus': {
-            color: theme.IconButton.primaryActiveFillColor,
-        },
-        '&:active': {
-            backgroundColor: theme.Button.secondaryActiveBg,
-            border: `1px solid ${theme.Button.secondaryActiveBorder}`,
-            color: theme.general.primaryColor,
-        },
-    })))), (variant === ButtonVariant.TERTIARY && Object.assign({ backgroundColor: backgroundColor || (disabled ? theme.Button.tertiarydisabledBg : theme.Button.tertiaryBg), border: disabled ? `1px solid ${theme.Button.tertiaryDisabledBorder}` : `1px solid ${theme.Button.tertiaryBorder}`, borderRadius: '12px', color: disabled ? theme.Input.placeholderColor : theme.general.color, fontSize: theme.fontSizes.medium, fontWeight: 700, lineHeight: '1.5rem', padding: '4px 8px', '& > svg > path': {
-            fill: disabled ? theme.Input.placeholderColor : theme.general.color,
-        } }, (!disabled && {
-        '&:hover, &:focus': {
-            backgroundColor: theme.Button.tertiaryHoverBg,
-            border: `1px solid ${theme.Button.tertiaryHoverBorder}`,
-        },
-        '&:focus': {
-            border: `1px solid ${theme.general.focusColor}`,
-        },
-        '&:active': {
-            backgroundColor: theme.Button.tertiaryActiveBg,
-            color: theme.IconButton.primaryActiveFillColor,
-            '& > svg > path': {
-                fill: theme.IconButton.primaryActiveFillColor,
-            },
-        },
-    })))), (variant === ButtonVariant.QUATERNARY && Object.assign({ backgroundColor: backgroundColor || (disabled ? Identity_1.COLOR_V2.GRAY_50 : Identity_1.COLOR_V2.GREEN), color: disabled ? Identity_1.COLOR_V2.GRAY_80 : Identity_1.COLOR_V2.WHITE, lineHeight: '1.5rem' }, (!disabled && {
-        '&:hover, &:focus': {
-            backgroundColor: Identity_1.COLOR_V2.GREEN_LIGHT_600,
-        },
-        '&:focus': {
-            border: `1px solid ${Identity_1.COLOR_V2.GREEN_LIGHT_700}`,
-        },
-        '&:active': {
-            backgroundColor: Identity_1.COLOR_V2.GREEN_LIGHT_700,
-        },
-    })))), (variant === ButtonVariant.CANCEL && Object.assign({ backgroundColor: backgroundColor || (disabled ? Identity_1.COLOR_V2.GRAY_50 : Identity_1.COLOR_V2.RED), color: disabled ? Identity_1.COLOR_V2.GRAY_80 : Identity_1.COLOR_V2.WHITE, lineHeight: '1.5rem' }, (!disabled && {
-        '&:hover, &:focus': {
-            backgroundColor: Identity_1.COLOR_V2.RED_LIGHT_600,
-        },
-        '&:focus': {
-            border: `1px solid ${Identity_1.COLOR_V2.RED_LIGHT_700}`,
-        },
-        '&:active': {
-            backgroundColor: Identity_1.COLOR_V2.RED_LIGHT_700,
-        },
-    })))), (variant === ButtonVariant.SEND && Object.assign({ backgroundColor: backgroundColor || (disabled ? Identity_1.COLOR_V2.GRAY_70 : Identity_1.COLOR_V2.BLUE), width: '40px' }, (!disabled && {
-        '&:hover, &:focus': {
-            backgroundColor: Identity_1.COLOR_V2.BLUE_LIGHT_600,
-        },
-        '&:focus': {
-            border: `1px solid ${Identity_1.COLOR_V2.BLUE_LIGHT_800}`,
-        },
-        '&:active': {
-            backgroundColor: Identity_1.COLOR_V2.BLUE_LIGHT_700,
-        },
-    })))));
-};
-exports.buttonStyle = buttonStyle;
 const Button = (_a) => {
     var { showLoading, children, loadingColor = Identity_1.COLOR.WHITE } = _a, props = __rest(_a, ["showLoading", "children", "loadingColor"]);
-    return ((0, jsx_runtime_1.jsx)("button", Object.assign({ css: (theme) => (0, exports.buttonStyle)(theme, props) }, (0, exports.filterButtonProps)(props), { children: showLoading ? (0, jsx_runtime_1.jsx)(Misc_1.Loading, { size: 30, color: loadingColor, style: { display: 'flex', margin: 'auto' } }) : children })));
+    return ((0, jsx_runtime_1.jsx)("button", Object.assign({ css: (theme) => (0, Button_styles_1.buttonStyle)(theme, props) }, (0, exports.filterButtonProps)(props), { children: showLoading ? (0, jsx_runtime_1.jsx)(Misc_1.Loading, { size: 30, color: loadingColor, style: { display: 'flex', margin: 'auto' } }) : children })));
 };
 exports.Button = Button;
 const filterButtonProps = (props) => {

package/lib/Form/Button.styles.d.ts

@@ -0,0 +1,5 @@
+import { CSSObject } from '@emotion/react';
+import { ButtonProps } from './Button';
+import { Theme } from '../Theme/Theme';
+export declare const buttonStyle: <T>(theme: Theme, props: ButtonProps<T>) => CSSObject;
+//# sourceMappingURL=Button.styles.d.ts.map

package/lib/Form/Button.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.styles.d.ts","sourceRoot":"","sources":["../../src/Form/Button.styles.ts"],"names":[],"mappings":"AAmBA,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAEzC,OAAO,EAAC,WAAW,EAAgB,MAAM,UAAU,CAAC;AAKpD,OAAO,EAAC,KAAK,EAAC,MAAM,gBAAgB,CAAC;AAmLrC,eAAO,MAAM,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,SAgErE,CAAC"}

package/lib/Form/Button.styles.js

@@ -0,0 +1,178 @@
+"use strict";
+/*
+ * Wire
+ * Copyright (C) 2024 Wire Swiss GmbH
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see http://www.gnu.org/licenses/.
+ *
+ */
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buttonStyle = void 0;
+const Button_1 = require("./Button");
+const Identity_1 = require("../Identity");
+const motions_1 = require("../Identity/motions");
+const Text_1 = require("../Text");
+const buttonPrimaryStyles = (theme, { backgroundColor, disabled, isActive }) => {
+    const activeStyles = {
+        backgroundColor: theme.Button.primaryActiveBg,
+        border: `1px solid ${theme.Button.primaryActiveBorder}`,
+        color: Identity_1.COLOR.WHITE,
+    };
+    return Object.assign(Object.assign({}, (isActive
+        ? activeStyles
+        : {
+            color: disabled ? theme.Button.primaryDisabledText : theme.general.contrastColor,
+            backgroundColor: backgroundColor || disabled ? theme.Button.primaryDisabledBg : theme.Button.primaryBg,
+        })), (!disabled && {
+        '&:hover, &:focus': {
+            backgroundColor: theme.Button.primaryHoverBg,
+        },
+        '&:focus': {
+            border: `1px solid ${theme.Button.primaryFocusBorder}`,
+        },
+        '&:active': activeStyles,
+    }));
+};
+const buttonSecondaryStyles = (theme, { backgroundColor, disabled, isActive }) => {
+    const activeStyles = {
+        backgroundColor: theme.Button.secondaryActiveBg,
+        border: `1px solid ${theme.Button.secondaryActiveBorder}`,
+        color: theme.general.primaryColor,
+    };
+    return Object.assign(Object.assign({ border: `1px solid ${theme.IconButton.primaryBorderColor}` }, (isActive
+        ? activeStyles
+        : {
+            color: disabled ? theme.Input.placeholderColor : theme.general.color,
+            backgroundColor: backgroundColor || disabled ? theme.IconButton.primaryDisabledBgColor : theme.IconButton.primaryBgColor,
+        })), (!disabled && {
+        '&:hover, &:focus': {
+            border: `1px solid ${theme.Button.secondaryHoverBorder}`,
+        },
+        '&:focus': {
+            color: theme.IconButton.primaryActiveFillColor,
+        },
+        '&:active': activeStyles,
+    }));
+};
+const buttonTertiaryStyles = (theme, { backgroundColor, disabled, isActive }) => {
+    const activeStyles = {
+        backgroundColor: theme.Button.tertiaryActiveBg,
+        color: theme.IconButton.primaryActiveFillColor,
+        '& > svg > path': {
+            fill: theme.IconButton.primaryActiveFillColor,
+        },
+    };
+    return Object.assign(Object.assign({ border: disabled ? `1px solid ${theme.Button.tertiaryDisabledBorder}` : `1px solid ${theme.Button.tertiaryBorder}`, borderRadius: '12px', fontSize: theme.fontSizes.medium, fontWeight: 700, lineHeight: '1.5rem', padding: '4px 8px', '& > svg > path': {
+            fill: disabled ? theme.Input.placeholderColor : theme.general.color,
+        } }, (isActive
+        ? activeStyles
+        : {
+            color: disabled ? theme.Input.placeholderColor : theme.general.color,
+            backgroundColor: backgroundColor || disabled ? theme.Button.tertiarydisabledBg : theme.Button.tertiaryBg,
+        })), (!disabled && {
+        '&:hover, &:focus': {
+            backgroundColor: theme.Button.tertiaryHoverBg,
+            border: `1px solid ${theme.Button.tertiaryHoverBorder}`,
+        },
+        '&:focus': {
+            border: `1px solid ${theme.general.focusColor}`,
+        },
+        '&:active': activeStyles,
+    }));
+};
+const buttonQuaternaryStyles = ({ backgroundColor, disabled, isActive }) => {
+    const activeStyles = {
+        backgroundColor: Identity_1.COLOR_V2.GREEN_LIGHT_700,
+    };
+    return Object.assign(Object.assign({ lineHeight: '1.5rem' }, (isActive
+        ? activeStyles
+        : {
+            color: disabled ? Identity_1.COLOR_V2.GRAY_80 : Identity_1.COLOR_V2.WHITE,
+            backgroundColor: backgroundColor || disabled ? Identity_1.COLOR_V2.GRAY_50 : Identity_1.COLOR_V2.GREEN,
+        })), (!disabled && {
+        '&:hover, &:focus': {
+            backgroundColor: Identity_1.COLOR_V2.GREEN_LIGHT_600,
+        },
+        '&:focus': {
+            border: `1px solid ${Identity_1.COLOR_V2.GREEN_LIGHT_700}`,
+        },
+        '&:active': activeStyles,
+    }));
+};
+const buttonCancelStyles = ({ backgroundColor, disabled, isActive }) => {
+    const activeStyles = {
+        backgroundColor: Identity_1.COLOR_V2.RED_LIGHT_700,
+    };
+    return Object.assign(Object.assign({ lineHeight: '1.5rem' }, (isActive
+        ? activeStyles
+        : {
+            color: disabled ? Identity_1.COLOR_V2.GRAY_80 : Identity_1.COLOR_V2.WHITE,
+            backgroundColor: backgroundColor || disabled ? Identity_1.COLOR_V2.GRAY_50 : Identity_1.COLOR_V2.RED,
+        })), (!disabled && {
+        '&:hover, &:focus': {
+            backgroundColor: Identity_1.COLOR_V2.RED_LIGHT_600,
+        },
+        '&:focus': {
+            border: `1px solid ${Identity_1.COLOR_V2.RED_LIGHT_700}`,
+        },
+        '&:active': activeStyles,
+    }));
+};
+const buttonSendStyles = ({ backgroundColor, disabled, isActive }) => {
+    const activeStyles = {
+        backgroundColor: Identity_1.COLOR_V2.BLUE_LIGHT_700,
+    };
+    return Object.assign(Object.assign({ width: '40px' }, (isActive
+        ? activeStyles
+        : {
+            backgroundColor: backgroundColor || disabled ? Identity_1.COLOR_V2.GRAY_70 : Identity_1.COLOR_V2.BLUE,
+        })), (!disabled && {
+        '&:hover, &:focus': {
+            backgroundColor: Identity_1.COLOR_V2.BLUE_LIGHT_600,
+        },
+        '&:focus': {
+            border: `1px solid ${Identity_1.COLOR_V2.BLUE_LIGHT_800}`,
+        },
+        '&:active': activeStyles,
+    }));
+};
+const buttonStyle = (theme, _a) => {
+    var { variant = Button_1.ButtonVariant.PRIMARY, backgroundColor, block = false, disabled = false, noCapital = false, bold = true, center = true, color = Identity_1.COLOR.WHITE, fontSize = theme.fontSizes.base, noWrap = true, textTransform = 'none', truncate = true } = _a, props = __rest(_a, ["variant", "backgroundColor", "block", "disabled", "noCapital", "bold", "center", "color", "fontSize", "noWrap", "textTransform", "truncate"]);
+    return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (0, Text_1.textStyle)(theme, Object.assign({ block,
+        bold,
+        center,
+        disabled,
+        fontSize,
+        noWrap,
+        textTransform,
+        truncate }, props))), { border: 0, cursor: disabled ? 'default' : 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center', marginBottom: '16px', padding: 0, outline: 'none', textDecoration: 'none', touchAction: 'manipulation', transition: motions_1.defaultTransition, width: block ? '100%' : 'auto', '&:hover, &:focus': {
+            textDecoration: 'none',
+        } }), (variant !== Button_1.ButtonVariant.TERTIARY && Object.assign({ borderRadius: variant === Button_1.ButtonVariant.SEND ? '100%' : '16px', height: variant === Button_1.ButtonVariant.SEND ? '40px' : '48px', lineHeight: variant === Button_1.ButtonVariant.SEND ? '40px' : '48px' }, (variant !== Button_1.ButtonVariant.SEND && {
+        maxWidth: '100%',
+        minWidth: '125px',
+        padding: '0 16px',
+    })))), (variant === Button_1.ButtonVariant.PRIMARY && buttonPrimaryStyles(theme, props))), (variant === Button_1.ButtonVariant.SECONDARY && buttonSecondaryStyles(theme, props))), (variant === Button_1.ButtonVariant.TERTIARY && buttonTertiaryStyles(theme, props))), (variant === Button_1.ButtonVariant.QUATERNARY && buttonQuaternaryStyles(props))), (variant === Button_1.ButtonVariant.CANCEL && buttonCancelStyles(props))), (variant === Button_1.ButtonVariant.SEND && buttonSendStyles(props)));
+};
+exports.buttonStyle = buttonStyle;

package/lib/Form/ButtonLink.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonLink.d.ts","sourceRoot":"","sources":["../../src/Form/ButtonLink.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAEzC,OAAO,EAAC,WAAW,EAAc,MAAM,UAAU,CAAC;AAGlD,OAAO,EAAC,KAAK,EAAC,MAAM,WAAW,CAAC;AAKhC,eAAO,MAAM,eAAe,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,WAAW,CAAC,iBAAiB,CAAC,KAAK,SAGrF,CAAC;AAUH,eAAO,MAAM,UAAU,sDAKpB,YAAY,iBAAiB,CAAC,qDAIhC,CAAC"}
+{"version":3,"file":"ButtonLink.d.ts","sourceRoot":"","sources":["../../src/Form/ButtonLink.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAEzC,OAAO,EAAC,WAAW,EAAC,MAAM,UAAU,CAAC;AAIrC,OAAO,EAAC,KAAK,EAAC,MAAM,WAAW,CAAC;AAKhC,eAAO,MAAM,eAAe,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,WAAW,CAAC,iBAAiB,CAAC,KAAK,SAGrF,CAAC;AAUH,eAAO,MAAM,UAAU,sDAKpB,YAAY,iBAAiB,CAAC,qDAIhC,CAAC"}

package/lib/Form/ButtonLink.js

@@ -13,12 +13,12 @@ var __rest = (this && this.__rest) || function (s, e) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ButtonLink = exports.buttonLinkStyle = void 0;
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-const Button_1 = require("./Button");
+const Button_styles_1 = require("./Button.styles");
 const Identity_1 = require("../Identity");
 const Misc_1 = require("../Misc");
 const Text_1 = require("../Text");
 const util_1 = require("../util");
-const buttonLinkStyle = (theme, props) => (Object.assign(Object.assign({}, (0, Button_1.buttonStyle)(theme, props)), { display: 'inline-flex !important' }));
+const buttonLinkStyle = (theme, props) => (Object.assign(Object.assign({}, (0, Button_styles_1.buttonStyle)(theme, props)), { display: 'inline-flex !important' }));
 exports.buttonLinkStyle = buttonLinkStyle;
 const filterButtonLinkProps = (props) => {
     return (0, util_1.filterProps)((0, Text_1.filterTextProps)(props), [

package/lib/Form/RoundIconButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RoundIconButton.d.ts","sourceRoot":"","sources":["../../src/Form/RoundIconButton.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAEzC,OAAO,EAAC,WAAW,EAAiC,MAAM,UAAU,CAAC;AAIrE,OAAO,EAAC,KAAK,EAAC,MAAM,WAAW,CAAC;AAGhC,MAAM,WAAW,oBAAoB,CAAC,CAAC,GAAG,iBAAiB,CAAE,SAAQ,WAAW,CAAC,CAAC,CAAC;CAAG;AAEtF,eAAO,MAAM,oBAAoB,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,oBAAoB,CAAC,CAAC,CAAC,KAAK,SAYtF,CAAC;AAEH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAI1D,CAAC"}
+{"version":3,"file":"RoundIconButton.d.ts","sourceRoot":"","sources":["../../src/Form/RoundIconButton.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAEzC,OAAO,EAAC,WAAW,EAAoB,MAAM,UAAU,CAAC;AAKxD,OAAO,EAAC,KAAK,EAAC,MAAM,WAAW,CAAC;AAGhC,MAAM,WAAW,oBAAoB,CAAC,CAAC,GAAG,iBAAiB,CAAE,SAAQ,WAAW,CAAC,CAAC,CAAC;CAAG;AAEtF,eAAO,MAAM,oBAAoB,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,oBAAoB,CAAC,CAAC,CAAC,KAAK,SAYtF,CAAC;AAEH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAI1D,CAAC"}

package/lib/Form/RoundIconButton.js

@@ -14,9 +14,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.RoundIconButton = exports.roundIconButtonStyle = void 0;
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const Button_1 = require("./Button");
+const Button_styles_1 = require("./Button.styles");
 const Identity_1 = require("../Identity");
 const Misc_1 = require("../Misc/");
-const roundIconButtonStyle = (theme, props) => (Object.assign(Object.assign({}, (0, Button_1.buttonStyle)(theme, props)), { alignItems: 'center', borderRadius: '50%', display: 'flex', height: `${props.size}px`, justifyContent: 'center', lineHeight: 'initial', margin: '0 auto', minWidth: `${props.size}px`, padding: 0, width: `${props.size}px` }));
+const roundIconButtonStyle = (theme, props) => (Object.assign(Object.assign({}, (0, Button_styles_1.buttonStyle)(theme, props)), { alignItems: 'center', borderRadius: '50%', display: 'flex', height: `${props.size}px`, justifyContent: 'center', lineHeight: 'initial', margin: '0 auto', minWidth: `${props.size}px`, padding: 0, width: `${props.size}px` }));
 exports.roundIconButtonStyle = roundIconButtonStyle;
 const RoundIconButton = (_a) => {
     var { children } = _a, props = __rest(_a, ["children"]);

package/package.json

@@ -15,11 +15,11 @@
     "react-transition-group": "4.4.5"
   },
   "devDependencies": {
-    "@babel/cli": "7.23.9",
-    "@babel/core": "7.24.0",
-    "@babel/preset-env": "7.24.0",
-    "@babel/preset-react": "7.23.3",
-    "@babel/preset-typescript": "7.23.3",
+    "@babel/cli": "7.24.1",
+    "@babel/core": "7.24.3",
+    "@babel/preset-env": "7.24.3",
+    "@babel/preset-react": "7.24.1",
+    "@babel/preset-typescript": "7.24.1",
     "@emotion/babel-preset-css-prop": "^11.10.0",
     "@emotion/jest": "11.11.0",
     "@emotion/react": "^11.10.4",
@@ -27,7 +27,7 @@
     "@swc/core": "^1.3.10",
     "@swc/jest": "^0.2.23",
     "@testing-library/jest-dom": "6.4.2",
-    "@testing-library/react": "14.2.1",
+    "@testing-library/react": "14.2.2",
     "@testing-library/user-event": "14.5.2",
     "@types/jest": "^29.2.0",
     "@types/node": "^20.1.0",
@@ -70,6 +70,6 @@
     "test:watch": "jest --watch",
     "test:update": "jest --updateSnapshot"
   },
-  "version": "9.16.4",
-  "gitHead": "8b320281182cc476c79b8682d46ccd37f32ae3ad"
+  "version": "9.17.0",
+  "gitHead": "f8042b528feb53335f428367c9c540274024c51c"
 }