@sb1/ffe-buttons-react 24.0.46 → 24.1.0

package/es/BaseButton.js

@@ -28,9 +28,9 @@ import classNames from 'classnames';
  * @ignore
  */
 function BaseButtonWithForwardRef(props, ref) {
-    var _a = props.as, Comp = _a === void 0 ? 'button' : _a, buttonType = props.buttonType, isLoading = props.isLoading, isDisabled = props.isDisabled, className = props.className, onClick = props.onClick, leftIcon = props.leftIcon, rightIcon = props.rightIcon, ariaLoadingMessage = props.ariaLoadingMessage, children = props.children, rest = __rest(props, ["as", "buttonType", "isLoading", "isDisabled", "className", "onClick", "leftIcon", "rightIcon", "ariaLoadingMessage", "children"]);
+    var _a = props.as, Comp = _a === void 0 ? 'button' : _a, buttonType = props.buttonType, isLoading = props.isLoading, isDisabled = props.isDisabled, className = props.className, onClick = props.onClick, leftIcon = props.leftIcon, rightIcon = props.rightIcon, _b = props.size, size = _b === void 0 ? 'md' : _b, ariaLoadingMessage = props.ariaLoadingMessage, children = props.children, rest = __rest(props, ["as", "buttonType", "isLoading", "isDisabled", "className", "onClick", "leftIcon", "rightIcon", "size", "ariaLoadingMessage", "children"]);
     var supportsSpinner = ['action', 'primary', 'secondary'].includes(buttonType);
-    return (React.createElement(Comp, __assign({ "aria-busy": isLoading && supportsSpinner, "aria-disabled": isDisabled || (isLoading && supportsSpinner), className: classNames('ffe-button', "ffe-button--".concat(buttonType), { 'ffe-button--loading': isLoading && supportsSpinner }, className), onClick: function (event) {
+    return (React.createElement(Comp, __assign({ "aria-busy": isLoading && supportsSpinner, "aria-disabled": isDisabled || (isLoading && supportsSpinner), className: classNames('ffe-button', "ffe-button--".concat(buttonType), "ffe-button--".concat(size), { 'ffe-button--loading': isLoading && supportsSpinner }, className), onClick: function (event) {
             if (isLoading && supportsSpinner) {
                 event.preventDefault();
                 event.stopPropagation();

package/es/ExpandButton.js

@@ -25,10 +25,12 @@ import classNames from 'classnames';
 import { Icon } from '@sb1/ffe-icons-react';
 import { fixedForwardRef } from './fixedForwardRef';
 function ExpandButtonWithForwardRef(props, ref) {
-    var children = props.children, className = props.className, _a = props.closeLabel, closeLabel = _a === void 0 ? 'Lukk' : _a, _b = props.as, Comp = _b === void 0 ? 'button' : _b, isExpanded = props.isExpanded, rest = __rest(props, ["children", "className", "closeLabel", "as", "isExpanded"]);
-    var closeIcon = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Ik00ODAtNDM3Ljg0NyAyNzcuMDc2LTIzNC45MjRxLTguMzA3IDguMzA4LTIwLjg4NCA4LjUtMTIuNTc2LjE5My0yMS4yNjgtOC41LTguNjkzLTguNjkyLTguNjkzLTIxLjA3NnQ4LjY5My0yMS4wNzZMNDM3Ljg0Ny00ODAgMjM0LjkyNC02ODIuOTI0cS04LjMwOC04LjMwNy04LjUtMjAuODg0LS4xOTMtMTIuNTc2IDguNS0yMS4yNjggOC42OTItOC42OTMgMjEuMDc2LTguNjkzdDIxLjA3NiA4LjY5M0w0ODAtNTIyLjE1M2wyMDIuOTI0LTIwMi45MjNxOC4zMDctOC4zMDggMjAuODg0LTguNSAxMi41NzYtLjE5MyAyMS4yNjggOC41IDguNjkzIDguNjkyIDguNjkzIDIxLjA3NnQtOC42OTMgMjEuMDc2TDUyMi4xNTMtNDgwbDIwMi45MjMgMjAyLjkyNHE4LjMwOCA4LjMwNyA4LjUgMjAuODg0LjE5MyAxMi41NzYtOC41IDIxLjI2OC04LjY5MiA4LjY5My0yMS4wNzYgOC42OTN0LTIxLjA3Ni04LjY5M0w0ODAtNDM3Ljg0N1oiLz48L3N2Zz4=';
-    return (React.createElement(Comp, __assign({ "aria-expanded": isExpanded, "aria-label": isExpanded ? closeLabel : undefined, className: classNames('ffe-button', 'ffe-button--expand', { 'ffe-button--expanded': isExpanded }, className) }, rest, { ref: ref }),
-        isExpanded && (React.createElement(Icon, { className: "ffe-button__icon", fileUrl: closeIcon, size: "md" })),
+    var children = props.children, className = props.className, _a = props.closeLabel, closeLabel = _a === void 0 ? 'Lukk' : _a, _b = props.as, Comp = _b === void 0 ? 'button' : _b, isExpanded = props.isExpanded, _c = props.size, size = _c === void 0 ? 'md' : _c, rest = __rest(props, ["children", "className", "closeLabel", "as", "isExpanded", "size"]);
+    var closeIconMd = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Ik00ODAtNDM3Ljg0NyAyNzcuMDc2LTIzNC45MjRxLTguMzA3IDguMzA4LTIwLjg4NCA4LjUtMTIuNTc2LjE5My0yMS4yNjgtOC41LTguNjkzLTguNjkyLTguNjkzLTIxLjA3NnQ4LjY5My0yMS4wNzZMNDM3Ljg0Ny00ODAgMjM0LjkyNC02ODIuOTI0cS04LjMwOC04LjMwNy04LjUtMjAuODg0LS4xOTMtMTIuNTc2IDguNS0yMS4yNjggOC42OTItOC42OTMgMjEuMDc2LTguNjkzdDIxLjA3NiA4LjY5M0w0ODAtNTIyLjE1M2wyMDIuOTI0LTIwMi45MjNxOC4zMDctOC4zMDggMjAuODg0LTguNSAxMi41NzYtLjE5MyAyMS4yNjggOC41IDguNjkzIDguNjkyIDguNjkzIDIxLjA3NnQtOC42OTMgMjEuMDc2TDUyMi4xNTMtNDgwbDIwMi45MjMgMjAyLjkyNHE4LjMwOCA4LjMwNyA4LjUgMjAuODg0LjE5MyAxMi41NzYtOC41IDIxLjI2OC04LjY5MiA4LjY5My0yMS4wNzYgOC42OTN0LTIxLjA3Ni04LjY5M0w0ODAtNDM3Ljg0N1oiLz48L3N2Zz4=';
+    var closeIconSm = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjAiPjxwYXRoIGQ9Ik00ODAtNDQyLjg1IDMwOS4wOC0yNzEuOTJxLTguMzEgOC4zLTE3Ljg5IDgtOS41Ny0uMzEtMTguMjctOS04LjY5LTguNy04LjY5LTE4LjU4IDAtOS44OCA4LjY5LTE4LjU4TDQ0Mi44NS00ODAgMjcxLjkyLTY1MC45MnEtOC4zLTguMzEtOC0xOC4zOS4zMS0xMC4wNyA5LTE4Ljc3IDguNy04LjY5IDE4LjU4LTguNjkgOS44OCAwIDE4LjU4IDguNjlMNDgwLTUxNy4xNWwxNzAuOTItMTcwLjkzcTguMzEtOC4zIDE4LjM5LTguNSAxMC4wNy0uMTkgMTguNzcgOC41IDguNjkgOC43IDguNjkgMTguNTggMCA5Ljg4LTguNjkgMTguNThMNTE3LjE1LTQ4MGwxNzAuOTMgMTcwLjkycTguMyA4LjMxIDguNSAxNy44OS4xOSA5LjU3LTguNSAxOC4yNy04LjcgOC42OS0xOC41OCA4LjY5LTkuODggMC0xOC41OC04LjY5TDQ4MC00NDIuODVaIi8+PC9zdmc+';
+    var closeIcon = size === 'sm' ? closeIconSm : closeIconMd;
+    return (React.createElement(Comp, __assign({ "aria-expanded": isExpanded, "aria-label": isExpanded ? closeLabel : undefined, className: classNames('ffe-button', 'ffe-button--secondary', 'ffe-button--expand', "ffe-button--".concat(size), { 'ffe-button--expanded': isExpanded }, className) }, rest, { ref: ref }),
+        isExpanded && (React.createElement(Icon, { className: "ffe-button__icon", fileUrl: closeIcon, size: size === 'sm' ? 'sm' : 'md' })),
         !isExpanded && React.createElement("span", null, children)));
 }
 export var ExpandButton = fixedForwardRef(ExpandButtonWithForwardRef);

package/lib/BaseButton.js

@@ -34,9 +34,9 @@ var classnames_1 = __importDefault(require("classnames"));
  * @ignore
  */
 function BaseButtonWithForwardRef(props, ref) {
-    var _a = props.as, Comp = _a === void 0 ? 'button' : _a, buttonType = props.buttonType, isLoading = props.isLoading, isDisabled = props.isDisabled, className = props.className, onClick = props.onClick, leftIcon = props.leftIcon, rightIcon = props.rightIcon, ariaLoadingMessage = props.ariaLoadingMessage, children = props.children, rest = __rest(props, ["as", "buttonType", "isLoading", "isDisabled", "className", "onClick", "leftIcon", "rightIcon", "ariaLoadingMessage", "children"]);
+    var _a = props.as, Comp = _a === void 0 ? 'button' : _a, buttonType = props.buttonType, isLoading = props.isLoading, isDisabled = props.isDisabled, className = props.className, onClick = props.onClick, leftIcon = props.leftIcon, rightIcon = props.rightIcon, _b = props.size, size = _b === void 0 ? 'md' : _b, ariaLoadingMessage = props.ariaLoadingMessage, children = props.children, rest = __rest(props, ["as", "buttonType", "isLoading", "isDisabled", "className", "onClick", "leftIcon", "rightIcon", "size", "ariaLoadingMessage", "children"]);
     var supportsSpinner = ['action', 'primary', 'secondary'].includes(buttonType);
-    return (react_1.default.createElement(Comp, __assign({ "aria-busy": isLoading && supportsSpinner, "aria-disabled": isDisabled || (isLoading && supportsSpinner), className: (0, classnames_1.default)('ffe-button', "ffe-button--".concat(buttonType), { 'ffe-button--loading': isLoading && supportsSpinner }, className), onClick: function (event) {
+    return (react_1.default.createElement(Comp, __assign({ "aria-busy": isLoading && supportsSpinner, "aria-disabled": isDisabled || (isLoading && supportsSpinner), className: (0, classnames_1.default)('ffe-button', "ffe-button--".concat(buttonType), "ffe-button--".concat(size), { 'ffe-button--loading': isLoading && supportsSpinner }, className), onClick: function (event) {
             if (isLoading && supportsSpinner) {
                 event.preventDefault();
                 event.stopPropagation();

package/lib/ExpandButton.js

@@ -31,10 +31,12 @@ var classnames_1 = __importDefault(require("classnames"));
 var ffe_icons_react_1 = require("@sb1/ffe-icons-react");
 var fixedForwardRef_1 = require("./fixedForwardRef");
 function ExpandButtonWithForwardRef(props, ref) {
-    var children = props.children, className = props.className, _a = props.closeLabel, closeLabel = _a === void 0 ? 'Lukk' : _a, _b = props.as, Comp = _b === void 0 ? 'button' : _b, isExpanded = props.isExpanded, rest = __rest(props, ["children", "className", "closeLabel", "as", "isExpanded"]);
-    var closeIcon = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Ik00ODAtNDM3Ljg0NyAyNzcuMDc2LTIzNC45MjRxLTguMzA3IDguMzA4LTIwLjg4NCA4LjUtMTIuNTc2LjE5My0yMS4yNjgtOC41LTguNjkzLTguNjkyLTguNjkzLTIxLjA3NnQ4LjY5My0yMS4wNzZMNDM3Ljg0Ny00ODAgMjM0LjkyNC02ODIuOTI0cS04LjMwOC04LjMwNy04LjUtMjAuODg0LS4xOTMtMTIuNTc2IDguNS0yMS4yNjggOC42OTItOC42OTMgMjEuMDc2LTguNjkzdDIxLjA3NiA4LjY5M0w0ODAtNTIyLjE1M2wyMDIuOTI0LTIwMi45MjNxOC4zMDctOC4zMDggMjAuODg0LTguNSAxMi41NzYtLjE5MyAyMS4yNjggOC41IDguNjkzIDguNjkyIDguNjkzIDIxLjA3NnQtOC42OTMgMjEuMDc2TDUyMi4xNTMtNDgwbDIwMi45MjMgMjAyLjkyNHE4LjMwOCA4LjMwNyA4LjUgMjAuODg0LjE5MyAxMi41NzYtOC41IDIxLjI2OC04LjY5MiA4LjY5My0yMS4wNzYgOC42OTN0LTIxLjA3Ni04LjY5M0w0ODAtNDM3Ljg0N1oiLz48L3N2Zz4=';
-    return (react_1.default.createElement(Comp, __assign({ "aria-expanded": isExpanded, "aria-label": isExpanded ? closeLabel : undefined, className: (0, classnames_1.default)('ffe-button', 'ffe-button--expand', { 'ffe-button--expanded': isExpanded }, className) }, rest, { ref: ref }),
-        isExpanded && (react_1.default.createElement(ffe_icons_react_1.Icon, { className: "ffe-button__icon", fileUrl: closeIcon, size: "md" })),
+    var children = props.children, className = props.className, _a = props.closeLabel, closeLabel = _a === void 0 ? 'Lukk' : _a, _b = props.as, Comp = _b === void 0 ? 'button' : _b, isExpanded = props.isExpanded, _c = props.size, size = _c === void 0 ? 'md' : _c, rest = __rest(props, ["children", "className", "closeLabel", "as", "isExpanded", "size"]);
+    var closeIconMd = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Ik00ODAtNDM3Ljg0NyAyNzcuMDc2LTIzNC45MjRxLTguMzA3IDguMzA4LTIwLjg4NCA4LjUtMTIuNTc2LjE5My0yMS4yNjgtOC41LTguNjkzLTguNjkyLTguNjkzLTIxLjA3NnQ4LjY5My0yMS4wNzZMNDM3Ljg0Ny00ODAgMjM0LjkyNC02ODIuOTI0cS04LjMwOC04LjMwNy04LjUtMjAuODg0LS4xOTMtMTIuNTc2IDguNS0yMS4yNjggOC42OTItOC42OTMgMjEuMDc2LTguNjkzdDIxLjA3NiA4LjY5M0w0ODAtNTIyLjE1M2wyMDIuOTI0LTIwMi45MjNxOC4zMDctOC4zMDggMjAuODg0LTguNSAxMi41NzYtLjE5MyAyMS4yNjggOC41IDguNjkzIDguNjkyIDguNjkzIDIxLjA3NnQtOC42OTMgMjEuMDc2TDUyMi4xNTMtNDgwbDIwMi45MjMgMjAyLjkyNHE4LjMwOCA4LjMwNyA4LjUgMjAuODg0LjE5MyAxMi41NzYtOC41IDIxLjI2OC04LjY5MiA4LjY5My0yMS4wNzYgOC42OTN0LTIxLjA3Ni04LjY5M0w0ODAtNDM3Ljg0N1oiLz48L3N2Zz4=';
+    var closeIconSm = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjAiPjxwYXRoIGQ9Ik00ODAtNDQyLjg1IDMwOS4wOC0yNzEuOTJxLTguMzEgOC4zLTE3Ljg5IDgtOS41Ny0uMzEtMTguMjctOS04LjY5LTguNy04LjY5LTE4LjU4IDAtOS44OCA4LjY5LTE4LjU4TDQ0Mi44NS00ODAgMjcxLjkyLTY1MC45MnEtOC4zLTguMzEtOC0xOC4zOS4zMS0xMC4wNyA5LTE4Ljc3IDguNy04LjY5IDE4LjU4LTguNjkgOS44OCAwIDE4LjU4IDguNjlMNDgwLTUxNy4xNWwxNzAuOTItMTcwLjkzcTguMzEtOC4zIDE4LjM5LTguNSAxMC4wNy0uMTkgMTguNzcgOC41IDguNjkgOC43IDguNjkgMTguNTggMCA5Ljg4LTguNjkgMTguNThMNTE3LjE1LTQ4MGwxNzAuOTMgMTcwLjkycTguMyA4LjMxIDguNSAxNy44OS4xOSA5LjU3LTguNSAxOC4yNy04LjcgOC42OS0xOC41OCA4LjY5LTkuODggMC0xOC41OC04LjY5TDQ4MC00NDIuODVaIi8+PC9zdmc+';
+    var closeIcon = size === 'sm' ? closeIconSm : closeIconMd;
+    return (react_1.default.createElement(Comp, __assign({ "aria-expanded": isExpanded, "aria-label": isExpanded ? closeLabel : undefined, className: (0, classnames_1.default)('ffe-button', 'ffe-button--secondary', 'ffe-button--expand', "ffe-button--".concat(size), { 'ffe-button--expanded': isExpanded }, className) }, rest, { ref: ref }),
+        isExpanded && (react_1.default.createElement(ffe_icons_react_1.Icon, { className: "ffe-button__icon", fileUrl: closeIcon, size: size === 'sm' ? 'sm' : 'md' })),
         !isExpanded && react_1.default.createElement("span", null, children)));
 }
 exports.ExpandButton = (0, fixedForwardRef_1.fixedForwardRef)(ExpandButtonWithForwardRef);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@sb1/ffe-buttons-react",
-    "version": "24.0.46",
+    "version": "24.1.0",
     "description": "React implementation of ffe-buttons",
     "keywords": [
         "ffe"
@@ -29,8 +29,8 @@
         "test:watch": "ffe-buildtool jest --watch"
     },
     "dependencies": {
-        "@sb1/ffe-buttons": "^21.0.4",
-        "@sb1/ffe-icons-react": "^11.0.19",
+        "@sb1/ffe-buttons": "^21.1.0",
+        "@sb1/ffe-icons-react": "^11.0.20",
         "classnames": "^2.3.1"
     },
     "devDependencies": {
@@ -45,5 +45,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "2ff1ce6aa6e7ea7f11da6944332998a585cd8226"
+    "gitHead": "06ff61e99e6eda9597ca92a309b37bd5b7fbcb01"
 }

package/types/BaseButton.d.ts

@@ -7,6 +7,8 @@ export type BaseButtonProps<As extends ElementType = 'button'> = ComponentAsProp
     isLoading?: boolean;
     leftIcon?: ReactElement;
     rightIcon?: ReactElement;
+    /** Default md. */
+    size?: 'sm' | 'md' | 'lg';
 };
 export declare const BaseButton: <As extends ElementType>(props: {
     as?: As | undefined;
@@ -19,4 +21,6 @@ export declare const BaseButton: <As extends ElementType>(props: {
     isLoading?: boolean;
     leftIcon?: ReactElement;
     rightIcon?: ReactElement;
+    /** Default md. */
+    size?: "sm" | "md" | "lg";
 } & React.RefAttributes<any>) => React.JSX.Element;

package/types/ExpandButton.d.ts

@@ -5,6 +5,7 @@ export type ExpandButtonProps<As extends ElementType = 'button'> = ComponentAsPr
     closeLabel?: string;
     /** When true the component will render a circle with an X indicating whatever is controlled is in an expanded state. */
     isExpanded: boolean;
+    size?: 'sm' | 'md' | 'lg';
 };
 export declare const ExpandButton: <As extends ElementType>(props: {
     as?: As | undefined;
@@ -15,4 +16,5 @@ export declare const ExpandButton: <As extends ElementType>(props: {
     closeLabel?: string;
     /** When true the component will render a circle with an X indicating whatever is controlled is in an expanded state. */
     isExpanded: boolean;
+    size?: "sm" | "md" | "lg";
 } & React.RefAttributes<any>) => React.JSX.Element;