@spark-web/button 5.0.3 → 5.1.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # @spark-web/button
2
2
 
3
+ ## 5.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#558](https://github.com/brighte-labs/spark-web/pull/558)
8
+ [`b89f043`](https://github.com/brighte-labs/spark-web/commit/b89f043f45bb817295496d24a3ec65f867343efa)
9
+ Thanks [@yaminibrighte](https://github.com/yaminibrighte)! - added focus for
10
+ buttons
11
+
12
+ ### Patch Changes
13
+
14
+ - Updated dependencies
15
+ [[`b89f043`](https://github.com/brighte-labs/spark-web/commit/b89f043f45bb817295496d24a3ec65f867343efa)]:
16
+ - @spark-web/theme@5.5.0
17
+
3
18
  ## 5.0.3
4
19
 
5
20
  ### Patch Changes
@@ -5,5 +5,5 @@ export declare type ButtonLinkProps = LinkComponentProps & CommonButtonProps;
5
5
  /** The appearance of a `Button`, with the semantics of a link. */
6
6
  export declare const ButtonLink: <Comp extends import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> = "a">(props: {
7
7
  as?: Comp | undefined;
8
- 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" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | keyof HTMLElementTagNameMap ? (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" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view">)[Comp] : Comp extends new (...args: any) => any ? InstanceType<Comp> : undefined> | undefined;
8
+ ref?: import("react").Ref<Comp extends "symbol" | "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" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | keyof HTMLElementTagNameMap ? (HTMLElementTagNameMap & Pick<SVGElementTagNameMap, "symbol" | "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" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view">)[Comp] : Comp extends new (...args: any) => any ? InstanceType<Comp> : undefined> | undefined;
9
9
  } & Omit<import("react").PropsWithoutRef<import("react").ComponentProps<Comp>>, "as"> & ButtonLinkProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
@@ -47,12 +47,13 @@ export declare function useButtonStyles({ iconOnly, prominence, rounded, size, t
47
47
  };
48
48
  };
49
49
  readonly ':focus': {
50
- boxShadow: string;
51
50
  outline: string;
52
51
  outlineOffset: string;
53
52
  } | {
54
- outline: string;
55
- outlineOffset: string;
53
+ border?: string | undefined;
54
+ outline?: string | undefined;
55
+ outlineOffset?: string | undefined;
56
+ boxShadow?: string | undefined;
56
57
  };
57
58
  };
58
59
  readonly '&[aria-disabled=true]': {
@@ -293,6 +293,7 @@ function HiddenWhenLoading(_ref2) {
293
293
  * passed to Emotion's `css` function.
294
294
  */
295
295
  function useButtonStyles(_ref) {
296
+ var _theme$components$but, _theme$components;
296
297
  var iconOnly = _ref.iconOnly,
297
298
  prominence = _ref.prominence,
298
299
  _ref$rounded = _ref.rounded,
@@ -351,7 +352,7 @@ function useButtonStyles(_ref) {
351
352
  stroke: variant !== null && variant !== void 0 && variant.textToneActive ? theme$1.color.foreground[variant.textToneActive] : undefined
352
353
  })
353
354
  },
354
- ':focus': focusRingStyles
355
+ ':focus': (_theme$components$but = (_theme$components = theme$1.components) === null || _theme$components === void 0 || (_theme$components = _theme$components.buttons) === null || _theme$components === void 0 ? void 0 : _theme$components.focus) !== null && _theme$components$but !== void 0 ? _theme$components$but : focusRingStyles
355
356
  },
356
357
  '&[aria-disabled=true]': {
357
358
  backgroundColor: variant !== null && variant !== void 0 && variant.backgroundDisabled ? theme$1.color.background[variant === null || variant === void 0 ? void 0 : variant.backgroundDisabled] : undefined,
@@ -293,6 +293,7 @@ function HiddenWhenLoading(_ref2) {
293
293
  * passed to Emotion's `css` function.
294
294
  */
295
295
  function useButtonStyles(_ref) {
296
+ var _theme$components$but, _theme$components;
296
297
  var iconOnly = _ref.iconOnly,
297
298
  prominence = _ref.prominence,
298
299
  _ref$rounded = _ref.rounded,
@@ -351,7 +352,7 @@ function useButtonStyles(_ref) {
351
352
  stroke: variant !== null && variant !== void 0 && variant.textToneActive ? theme$1.color.foreground[variant.textToneActive] : undefined
352
353
  })
353
354
  },
354
- ':focus': focusRingStyles
355
+ ':focus': (_theme$components$but = (_theme$components = theme$1.components) === null || _theme$components === void 0 || (_theme$components = _theme$components.buttons) === null || _theme$components === void 0 ? void 0 : _theme$components.focus) !== null && _theme$components$but !== void 0 ? _theme$components$but : focusRingStyles
355
356
  },
356
357
  '&[aria-disabled=true]': {
357
358
  backgroundColor: variant !== null && variant !== void 0 && variant.backgroundDisabled ? theme$1.color.background[variant === null || variant === void 0 ? void 0 : variant.backgroundDisabled] : undefined,
@@ -289,6 +289,7 @@ function HiddenWhenLoading(_ref2) {
289
289
  * passed to Emotion's `css` function.
290
290
  */
291
291
  function useButtonStyles(_ref) {
292
+ var _theme$components$but, _theme$components;
292
293
  var iconOnly = _ref.iconOnly,
293
294
  prominence = _ref.prominence,
294
295
  _ref$rounded = _ref.rounded,
@@ -347,7 +348,7 @@ function useButtonStyles(_ref) {
347
348
  stroke: variant !== null && variant !== void 0 && variant.textToneActive ? theme.color.foreground[variant.textToneActive] : undefined
348
349
  })
349
350
  },
350
- ':focus': focusRingStyles
351
+ ':focus': (_theme$components$but = (_theme$components = theme.components) === null || _theme$components === void 0 || (_theme$components = _theme$components.buttons) === null || _theme$components === void 0 ? void 0 : _theme$components.focus) !== null && _theme$components$but !== void 0 ? _theme$components$but : focusRingStyles
351
352
  },
352
353
  '&[aria-disabled=true]': {
353
354
  backgroundColor: variant !== null && variant !== void 0 && variant.backgroundDisabled ? theme.color.background[variant === null || variant === void 0 ? void 0 : variant.backgroundDisabled] : undefined,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-web/button",
3
- "version": "5.0.3",
3
+ "version": "5.1.0",
4
4
  "homepage": "https://github.com/brighte-labs/spark-web#readme",
5
5
  "repository": {
6
6
  "type": "git",
@@ -23,7 +23,7 @@
23
23
  "@spark-web/link": "^5.0.0",
24
24
  "@spark-web/spinner": "^5.0.0",
25
25
  "@spark-web/text": "^5.1.0",
26
- "@spark-web/theme": "^5.3.1",
26
+ "@spark-web/theme": "^5.5.0",
27
27
  "@spark-web/utils": "^5.0.0"
28
28
  },
29
29
  "devDependencies": {