@spark-web/button 1.1.1 → 1.1.2

package/dist/declarations/src/ButtonLink.d.ts

@@ -5,5 +5,5 @@ export declare type ButtonLinkProps = LinkComponentProps & CommonButtonProps;
 /** The appearance of a `Button`, with the semantics of a link. */
 export declare const ButtonLink: <Comp extends import("react").ElementType<any> = "a">(props: {
     as?: Comp | undefined;
-    ref?: import("react").Ref<Comp extends "symbol" | "text" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | keyof HTMLElementTagNameMap | "set" ? (HTMLElementTagNameMap & Pick<SVGElementTagNameMap, "symbol" | "text" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | "set">)[Comp] : Comp extends new (...args: any) => any ? InstanceType<Comp> : undefined> | undefined;
+    ref?: import("react").Ref<Comp extends "symbol" | "clipPath" | "filter" | "mask" | "marker" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | keyof HTMLElementTagNameMap | "set" ? (HTMLElementTagNameMap & Pick<SVGElementTagNameMap, "symbol" | "clipPath" | "filter" | "mask" | "marker" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | "set">)[Comp] : Comp extends new (...args: any) => any ? InstanceType<Comp> : undefined> | undefined;
 } & Omit<import("react").PropsWithoutRef<import("react").ComponentProps<Comp>>, "as"> & ButtonLinkProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;

package/dist/spark-web-button.cjs.dev.js

@@ -9,9 +9,9 @@ var box = require('@spark-web/box');
 var spinner = require('@spark-web/spinner');
 var internal = require('@spark-web/utils/internal');
 var react = require('react');
-var css = require('@emotion/css');
 var text = require('@spark-web/text');
 var jsxRuntime = require('react/jsx-runtime');
+var css = require('@emotion/css');
 var theme = require('@spark-web/theme');
 var link = require('@spark-web/link');
 var ts = require('@spark-web/utils/ts');
@@ -203,10 +203,12 @@ var resolveButtonChildren = function resolveButtonChildren(_ref) {
 function HiddenWhenLoading(_ref2) {
   var children = _ref2.children,
       isLoading = _ref2.isLoading;
-  return /*#__PURE__*/jsxRuntime.jsx("span", {
-    className: isLoading ? css.css({
-      opacity: 0
-    }) : undefined,
+  return /*#__PURE__*/jsxRuntime.jsx(box.Box, {
+    as: "span",
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    opacity: isLoading ? 0 : undefined,
     children: children
   });
 }

package/dist/spark-web-button.cjs.prod.js

@@ -9,9 +9,9 @@ var box = require('@spark-web/box');
 var spinner = require('@spark-web/spinner');
 var internal = require('@spark-web/utils/internal');
 var react = require('react');
-var css = require('@emotion/css');
 var text = require('@spark-web/text');
 var jsxRuntime = require('react/jsx-runtime');
+var css = require('@emotion/css');
 var theme = require('@spark-web/theme');
 var link = require('@spark-web/link');
 var ts = require('@spark-web/utils/ts');
@@ -203,10 +203,12 @@ var resolveButtonChildren = function resolveButtonChildren(_ref) {
 function HiddenWhenLoading(_ref2) {
   var children = _ref2.children,
       isLoading = _ref2.isLoading;
-  return /*#__PURE__*/jsxRuntime.jsx("span", {
-    className: isLoading ? css.css({
-      opacity: 0
-    }) : undefined,
+  return /*#__PURE__*/jsxRuntime.jsx(box.Box, {
+    as: "span",
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    opacity: isLoading ? 0 : undefined,
     children: children
   });
 }

package/dist/spark-web-button.esm.js

@@ -5,9 +5,9 @@ import { Box } from '@spark-web/box';
 import { Spinner } from '@spark-web/spinner';
 import { buildDataAttributes } from '@spark-web/utils/internal';
 import { Children, isValidElement, cloneElement, forwardRef } from 'react';
-import { css } from '@emotion/css';
 import { Text } from '@spark-web/text';
 import { jsx, jsxs } from 'react/jsx-runtime';
+import { css } from '@emotion/css';
 import { useTheme } from '@spark-web/theme';
 import { useLinkComponent } from '@spark-web/link';
 import { forwardRefWithAs } from '@spark-web/utils/ts';
@@ -199,10 +199,12 @@ var resolveButtonChildren = function resolveButtonChildren(_ref) {
 function HiddenWhenLoading(_ref2) {
   var children = _ref2.children,
       isLoading = _ref2.isLoading;
-  return /*#__PURE__*/jsx("span", {
-    className: isLoading ? css({
-      opacity: 0
-    }) : undefined,
+  return /*#__PURE__*/jsx(Box, {
+    as: "span",
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    opacity: isLoading ? 0 : undefined,
     children: children
   });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spark-web/button",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "license": "MIT",
   "main": "dist/spark-web-button.cjs.js",
   "module": "dist/spark-web-button.esm.js",
@@ -14,7 +14,7 @@
     "@spark-web/box": "^1.0.5",
     "@spark-web/icon": "^1.1.3",
     "@spark-web/link": "^1.0.5",
-    "@spark-web/spinner": "^1.0.2",
+    "@spark-web/spinner": "^1.0.3",
     "@spark-web/text": "^1.0.5",
     "@spark-web/theme": "^3.0.1",
     "@spark-web/utils": "^1.1.3"