@spark-web/button 5.0.0-rc.29 → 5.0.0

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.
Files changed (7) hide show
  1. package/CHANGELOG.md +81 -0
  2. package/dist/declarations/src/button-link.d.ts +1 -1
  3. package/dist/declarations/src/use-button-styles.d.ts +14 -959
  4. package/dist/spark-web-button.cjs.dev.js +7 -9
  5. package/dist/spark-web-button.cjs.prod.js +7 -9
  6. package/dist/spark-web-button.esm.js +7 -9
  7. package/package.json +9 -9
package/dist/spark-web-button.cjs.dev.js CHANGED
@@ -293,10 +293,10 @@ function HiddenWhenLoading(_ref2) {
293
293
  * passed to Emotion's `css` function.
294
294
  */
295
295
  function useButtonStyles(_ref) {
296
- var css = _ref.css,
297
- iconOnly = _ref.iconOnly,
296
+ var iconOnly = _ref.iconOnly,
298
297
  prominence = _ref.prominence,
299
- rounded = _ref.rounded,
298
+ _ref$rounded = _ref.rounded,
299
+ rounded = _ref$rounded === void 0 ? false : _ref$rounded,
300
300
  size = _ref.size,
301
301
  tone = _ref.tone;
302
302
  var theme$1 = theme.useTheme();
@@ -313,7 +313,7 @@ function useButtonStyles(_ref) {
313
313
  transitionTimingFunction: theme$1.animation.standard.easing,
314
314
  transitionDuration: "".concat(theme$1.animation.standard.duration, "ms")
315
315
  };
316
- return [_objectSpread({
316
+ return [{
317
317
  alignItems: 'center',
318
318
  background: variant === null || variant === void 0 ? void 0 : variant.background,
319
319
  border: variant === null || variant === void 0 ? void 0 : variant.border,
@@ -327,7 +327,7 @@ function useButtonStyles(_ref) {
327
327
  paddingX: iconOnly ? undefined : mapTokens.spacing[size],
328
328
  position: 'relative',
329
329
  width: iconOnly ? mapTokens.size[size] : undefined
330
- }, css), _objectSpread(_objectSpread({}, transitionColors), {}, {
330
+ }, _objectSpread(_objectSpread({}, transitionColors), {}, {
331
331
  // Styles for buttons that aren't disabled.
332
332
  // Using the :not() pseudo-class so we don't have to undo the styles when
333
333
  // the button is disabled.
@@ -394,7 +394,6 @@ var Button = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
394
394
  props = _objectWithoutProperties(_ref, _excluded$1);
395
395
  var iconOnly = Boolean(props.label);
396
396
  var _useButtonStyles = useButtonStyles({
397
- css: customCss,
398
397
  iconOnly: iconOnly,
399
398
  rounded: rounded,
400
399
  size: size,
@@ -410,7 +409,7 @@ var Button = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
410
409
  "aria-describedby": ariaDescribedBy,
411
410
  "aria-expanded": ariaExpanded,
412
411
  "aria-label": props.label,
413
- css: react$1.css(buttonStyles),
412
+ css: react$1.css(buttonStyles, react$1.css(customCss)),
414
413
  data: data,
415
414
  disabled: loading || disabled,
416
415
  id: id,
@@ -469,7 +468,6 @@ var ButtonLink = ts.forwardRefWithAs(function (_ref, forwardedRef) {
469
468
  var LinkComponent = link.useLinkComponent(forwardedRef);
470
469
  var iconOnly = Boolean(consumerProps.label);
471
470
  var _useButtonStyles = useButtonStyles({
472
- css: customCss,
473
471
  iconOnly: iconOnly,
474
472
  prominence: prominence,
475
473
  rounded: rounded,
@@ -483,7 +481,7 @@ var ButtonLink = ts.forwardRefWithAs(function (_ref, forwardedRef) {
483
481
  "aria-label": consumerProps.label,
484
482
  as: LinkComponent,
485
483
  asElement: "a",
486
- css: react$1.css(buttonStyles),
484
+ css: react$1.css(buttonStyles, customCss),
487
485
  data: data,
488
486
  href: href,
489
487
  id: id,
package/dist/spark-web-button.cjs.prod.js CHANGED
@@ -293,10 +293,10 @@ function HiddenWhenLoading(_ref2) {
293
293
  * passed to Emotion's `css` function.
294
294
  */
295
295
  function useButtonStyles(_ref) {
296
- var css = _ref.css,
297
- iconOnly = _ref.iconOnly,
296
+ var iconOnly = _ref.iconOnly,
298
297
  prominence = _ref.prominence,
299
- rounded = _ref.rounded,
298
+ _ref$rounded = _ref.rounded,
299
+ rounded = _ref$rounded === void 0 ? false : _ref$rounded,
300
300
  size = _ref.size,
301
301
  tone = _ref.tone;
302
302
  var theme$1 = theme.useTheme();
@@ -313,7 +313,7 @@ function useButtonStyles(_ref) {
313
313
  transitionTimingFunction: theme$1.animation.standard.easing,
314
314
  transitionDuration: "".concat(theme$1.animation.standard.duration, "ms")
315
315
  };
316
- return [_objectSpread({
316
+ return [{
317
317
  alignItems: 'center',
318
318
  background: variant === null || variant === void 0 ? void 0 : variant.background,
319
319
  border: variant === null || variant === void 0 ? void 0 : variant.border,
@@ -327,7 +327,7 @@ function useButtonStyles(_ref) {
327
327
  paddingX: iconOnly ? undefined : mapTokens.spacing[size],
328
328
  position: 'relative',
329
329
  width: iconOnly ? mapTokens.size[size] : undefined
330
- }, css), _objectSpread(_objectSpread({}, transitionColors), {}, {
330
+ }, _objectSpread(_objectSpread({}, transitionColors), {}, {
331
331
  // Styles for buttons that aren't disabled.
332
332
  // Using the :not() pseudo-class so we don't have to undo the styles when
333
333
  // the button is disabled.
@@ -394,7 +394,6 @@ var Button = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
394
394
  props = _objectWithoutProperties(_ref, _excluded$1);
395
395
  var iconOnly = Boolean(props.label);
396
396
  var _useButtonStyles = useButtonStyles({
397
- css: customCss,
398
397
  iconOnly: iconOnly,
399
398
  rounded: rounded,
400
399
  size: size,
@@ -410,7 +409,7 @@ var Button = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
410
409
  "aria-describedby": ariaDescribedBy,
411
410
  "aria-expanded": ariaExpanded,
412
411
  "aria-label": props.label,
413
- css: react$1.css(buttonStyles),
412
+ css: react$1.css(buttonStyles, react$1.css(customCss)),
414
413
  data: data,
415
414
  disabled: loading || disabled,
416
415
  id: id,
@@ -469,7 +468,6 @@ var ButtonLink = ts.forwardRefWithAs(function (_ref, forwardedRef) {
469
468
  var LinkComponent = link.useLinkComponent(forwardedRef);
470
469
  var iconOnly = Boolean(consumerProps.label);
471
470
  var _useButtonStyles = useButtonStyles({
472
- css: customCss,
473
471
  iconOnly: iconOnly,
474
472
  prominence: prominence,
475
473
  rounded: rounded,
@@ -483,7 +481,7 @@ var ButtonLink = ts.forwardRefWithAs(function (_ref, forwardedRef) {
483
481
  "aria-label": consumerProps.label,
484
482
  as: LinkComponent,
485
483
  asElement: "a",
486
- css: react$1.css(buttonStyles),
484
+ css: react$1.css(buttonStyles, customCss),
487
485
  data: data,
488
486
  href: href,
489
487
  id: id,
package/dist/spark-web-button.esm.js CHANGED
@@ -289,10 +289,10 @@ function HiddenWhenLoading(_ref2) {
289
289
  * passed to Emotion's `css` function.
290
290
  */
291
291
  function useButtonStyles(_ref) {
292
- var css = _ref.css,
293
- iconOnly = _ref.iconOnly,
292
+ var iconOnly = _ref.iconOnly,
294
293
  prominence = _ref.prominence,
295
- rounded = _ref.rounded,
294
+ _ref$rounded = _ref.rounded,
295
+ rounded = _ref$rounded === void 0 ? false : _ref$rounded,
296
296
  size = _ref.size,
297
297
  tone = _ref.tone;
298
298
  var theme = useTheme();
@@ -309,7 +309,7 @@ function useButtonStyles(_ref) {
309
309
  transitionTimingFunction: theme.animation.standard.easing,
310
310
  transitionDuration: "".concat(theme.animation.standard.duration, "ms")
311
311
  };
312
- return [_objectSpread({
312
+ return [{
313
313
  alignItems: 'center',
314
314
  background: variant === null || variant === void 0 ? void 0 : variant.background,
315
315
  border: variant === null || variant === void 0 ? void 0 : variant.border,
@@ -323,7 +323,7 @@ function useButtonStyles(_ref) {
323
323
  paddingX: iconOnly ? undefined : mapTokens.spacing[size],
324
324
  position: 'relative',
325
325
  width: iconOnly ? mapTokens.size[size] : undefined
326
- }, css), _objectSpread(_objectSpread({}, transitionColors), {}, {
326
+ }, _objectSpread(_objectSpread({}, transitionColors), {}, {
327
327
  // Styles for buttons that aren't disabled.
328
328
  // Using the :not() pseudo-class so we don't have to undo the styles when
329
329
  // the button is disabled.
@@ -390,7 +390,6 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
390
390
  props = _objectWithoutProperties(_ref, _excluded$1);
391
391
  var iconOnly = Boolean(props.label);
392
392
  var _useButtonStyles = useButtonStyles({
393
- css: customCss,
394
393
  iconOnly: iconOnly,
395
394
  rounded: rounded,
396
395
  size: size,
@@ -406,7 +405,7 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
406
405
  "aria-describedby": ariaDescribedBy,
407
406
  "aria-expanded": ariaExpanded,
408
407
  "aria-label": props.label,
409
- css: css(buttonStyles),
408
+ css: css(buttonStyles, css(customCss)),
410
409
  data: data,
411
410
  disabled: loading || disabled,
412
411
  id: id,
@@ -465,7 +464,6 @@ var ButtonLink = forwardRefWithAs(function (_ref, forwardedRef) {
465
464
  var LinkComponent = useLinkComponent(forwardedRef);
466
465
  var iconOnly = Boolean(consumerProps.label);
467
466
  var _useButtonStyles = useButtonStyles({
468
- css: customCss,
469
467
  iconOnly: iconOnly,
470
468
  prominence: prominence,
471
469
  rounded: rounded,
@@ -479,7 +477,7 @@ var ButtonLink = forwardRefWithAs(function (_ref, forwardedRef) {
479
477
  "aria-label": consumerProps.label,
480
478
  as: LinkComponent,
481
479
  asElement: "a",
482
- css: css(buttonStyles),
480
+ css: css(buttonStyles, customCss),
483
481
  data: data,
484
482
  href: href,
485
483
  id: id,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-web/button",
3
- "version": "5.0.0-rc.29",
3
+ "version": "5.0.0",
4
4
  "homepage": "https://github.com/brighte-labs/spark-web#readme",
5
5
  "repository": {
6
6
  "type": "git",
@@ -17,14 +17,14 @@
17
17
  "dependencies": {
18
18
  "@babel/runtime": "^7.25.0",
19
19
  "@emotion/react": "^11.14.0",
20
- "@spark-web/a11y": "^5.0.0-rc.29",
21
- "@spark-web/box": "^5.0.0-rc.29",
22
- "@spark-web/icon": "^5.0.0-rc.29",
23
- "@spark-web/link": "^5.0.0-rc.29",
24
- "@spark-web/spinner": "^5.0.0-rc.29",
25
- "@spark-web/text": "^5.0.0-rc.29",
26
- "@spark-web/theme": "^5.0.0-rc.29",
27
- "@spark-web/utils": "^5.0.0-rc.29"
20
+ "@spark-web/a11y": "^5.0.0",
21
+ "@spark-web/box": "^5.0.0",
22
+ "@spark-web/icon": "^5.0.0",
23
+ "@spark-web/link": "^5.0.0",
24
+ "@spark-web/spinner": "^5.0.0",
25
+ "@spark-web/text": "^5.0.0",
26
+ "@spark-web/theme": "^5.0.0",
27
+ "@spark-web/utils": "^5.0.0"
28
28
  },
29
29
  "devDependencies": {
30
30
  "@types/react": "^18.2.0",