@via-profit/ui-kit 0.1.0-rc.18 → 0.1.0-rc.19

package/Button/ButtonBase.js

@@ -23,9 +23,14 @@ const ButtonBase = (props, ref) => {
     const overridesMap = react_1.default.useMemo(() => (Object.assign({ TextWrapper: ButtonTextWrapper_1.default,
         IconWrapper: ButtonIconWrapper_1.default,
         Container: ButtonContainer_1.default }, overrides)), [overrides]);
+    if (iconOnly &&
+        ((typeof startIcon !== 'undefined' && startIcon !== null) ||
+            (typeof endIcon !== 'undefined' && endIcon !== null))) {
+        console.warn('The «iconOnly» property should not be used simultaneously with «startIcon» and/or «endIcon»');
+    }
     return (react_1.default.createElement(overridesMap.Container, Object.assign({}, nativeProps, { color: color, iconOnly: iconOnly, ref: ref }),
         typeof startIcon !== 'undefined' && startIcon !== null && (react_1.default.createElement(overridesMap.IconWrapper, { position: "start" }, startIcon)),
-        react_1.default.createElement(overridesMap.TextWrapper, null, children),
+        react_1.default.createElement(overridesMap.TextWrapper, { iconOnly: iconOnly }, children),
         typeof endIcon !== 'undefined' && endIcon !== null && (react_1.default.createElement(overridesMap.IconWrapper, { position: "end" }, endIcon))));
 };
 exports.default = react_1.default.forwardRef(ButtonBase);

package/Button/ButtonTextWrapper.d.ts

@@ -1,4 +1,29 @@
 import React from 'react';
-export type ButtonTextWrapperProps = React.HTMLAttributes<HTMLSpanElement>;
-declare const _default: React.ForwardRefExoticComponent<ButtonTextWrapperProps & React.RefAttributes<HTMLSpanElement>>;
+import type { ButtonContainerProps } from './ButtonContainer';
+export type ButtonTextWrapperProps = React.HTMLAttributes<HTMLSpanElement> & {
+    /**
+     * If true, then expect SVG icon as children. The button will be rendered as icon button
+     * Example:
+     * ```tsx
+     * <Button iconOnly>
+     *   <MyIconSVG />
+     * </Button>
+     * ```
+     `
+     */
+    readonly iconOnly?: ButtonContainerProps['iconOnly'];
+};
+declare const _default: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & {
+    /**
+     * If true, then expect SVG icon as children. The button will be rendered as icon button
+     * Example:
+     * ```tsx
+     * <Button iconOnly>
+     *   <MyIconSVG />
+     * </Button>
+     * ```
+     `
+     */
+    readonly iconOnly?: boolean | undefined;
+} & React.RefAttributes<HTMLSpanElement>>;
 export default _default;

package/Button/ButtonTextWrapper.js

@@ -16,11 +16,17 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
+const react_2 = require("@emotion/react");
 const TextWrapper = styled_1.default.span `
   font-size: 0.86em;
   display: flex;
   align-items: center;
   user-select: none;
+  ${({ iconOnly }) => iconOnly &&
+    (0, react_2.css) `
+      font-size: 1em;
+      justify-content: center;
+    `}
 `;
 const ButtonTextWrapper = (props, ref) => {
     const { children } = props, nativeProps = __rest(props, ["children"]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@via-profit/ui-kit",
-  "version": "0.1.0-rc.18",
+  "version": "0.1.0-rc.19",
   "description": "UI Kit",
   "repository": {
     "type": "git",