@spark-web/button 5.0.0-rc.31 → 5.0.1

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 +56 -0
  2. package/dist/declarations/src/button-link.d.ts +1 -1
  3. package/dist/declarations/src/button.d.ts +2 -0
  4. package/dist/spark-web-button.cjs.dev.js +3 -2
  5. package/dist/spark-web-button.cjs.prod.js +3 -2
  6. package/dist/spark-web-button.esm.js +3 -2
  7. package/package.json +9 -9
package/CHANGELOG.md CHANGED
@@ -1,5 +1,61 @@
1
1
  # @spark-web/button
2
2
 
3
+ ## 5.0.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#535](https://github.com/brighte-labs/spark-web/pull/535)
8
+ [`c1dbf2a`](https://github.com/brighte-labs/spark-web/commit/c1dbf2af1b4fb21a72034243e904580caf0152b4)
9
+ Thanks [@mkt-brighte](https://github.com/mkt-brighte)! - Add aria-label on
10
+ button
11
+
12
+ ## 5.0.0
13
+
14
+ ### Major Changes
15
+
16
+ - This release of spark-web standardises the version across all packages to be
17
+ **`v5`**, primarily signifying the switch from `@emotion/css` to
18
+ `@emotion/react` as one of the key dependencies of the entire library, in
19
+ order to support server-side rendering / SSR.
20
+
21
+ This release also introduces support for theming, to allow for more co-branded
22
+ experiences across our web applications. It also supports component-level
23
+ theming for `<Button />`, `<ButtonLink />`, and `<Checkbox />`, which provides
24
+ the capability to override the global theme available inside an application.
25
+
26
+ To use this in an application, you can wrap the affected areas with a
27
+ `ThemeProvider`:
28
+
29
+ ```
30
+ <ThemeProvider theme="pantheon">
31
+ <Input type="text" />
32
+ <Button type="submit" />
33
+ </ThemeProvider>
34
+ ```
35
+
36
+ Part of the theming capabilities includes a new theme for `spark-web` called
37
+ "pantheon", which should map with our co-branding efforts in the Pantheon
38
+ project. It currently includes a small set of colors and its corresponding
39
+ font family.
40
+
41
+ ### Patch Changes
42
+
43
+ - [#532](https://github.com/brighte-labs/spark-web/pull/532)
44
+ [`631573c`](https://github.com/brighte-labs/spark-web/commit/631573cb72981d99b9afa4ad559123f44e47b2a9)
45
+ Thanks [@ralcoriza-brighte](https://github.com/ralcoriza-brighte)! - Fix
46
+ type-related issues
47
+
48
+ - Updated dependencies
49
+ [[`631573c`](https://github.com/brighte-labs/spark-web/commit/631573cb72981d99b9afa4ad559123f44e47b2a9)]:
50
+ - @spark-web/spinner@5.0.0
51
+ - @spark-web/theme@5.0.0
52
+ - @spark-web/utils@5.0.0
53
+ - @spark-web/a11y@5.0.0
54
+ - @spark-web/icon@5.0.0
55
+ - @spark-web/link@5.0.0
56
+ - @spark-web/text@5.0.0
57
+ - @spark-web/box@5.0.0
58
+
3
59
  ## 5.0.0-rc.31
4
60
 
5
61
  ### Patch Changes
package/dist/declarations/src/button-link.d.ts CHANGED
@@ -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" | "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;
8
+ ref?: import("react").Ref<Comp extends "symbol" | "text" | "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" | "textPath" | "tspan" | "use" | "view" | keyof HTMLElementTagNameMap ? (HTMLElementTagNameMap & Pick<SVGElementTagNameMap, "symbol" | "text" | "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" | "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>>;
package/dist/declarations/src/button.d.ts CHANGED
@@ -10,6 +10,8 @@ export declare type ButtonProps = CommonButtonProps & {
10
10
  'aria-describedby'?: NativeButtonProps['aria-describedby'];
11
11
  /** Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. */
12
12
  'aria-expanded'?: NativeButtonProps['aria-expanded'];
13
+ /** Defines a string value that labels the current element. */
14
+ 'aria-label'?: NativeButtonProps['aria-label'];
13
15
  /** When true, prevents onClick from firing. */
14
16
  disabled?: boolean;
15
17
  /** When true, the button will display a loading spinner. */
package/dist/spark-web-button.cjs.dev.js CHANGED
@@ -366,7 +366,7 @@ function useButtonStyles(_ref) {
366
366
  })];
367
367
  }
368
368
 
369
- var _excluded$1 = ["aria-controls", "aria-describedby", "aria-expanded", "data", "disabled", "id", "loading", "onClick", "css", "rounded", "prominence", "size", "tone", "type"];
369
+ var _excluded$1 = ["aria-controls", "aria-describedby", "aria-expanded", "aria-label", "data", "disabled", "id", "loading", "onClick", "css", "rounded", "prominence", "size", "tone", "type"];
370
370
  /**
371
371
  * Buttons are used to initialize an action, their label should express what
372
372
  * action will occur when the user interacts with it.
@@ -375,6 +375,7 @@ var Button = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
375
375
  var ariaControls = _ref['aria-controls'],
376
376
  ariaDescribedBy = _ref['aria-describedby'],
377
377
  ariaExpanded = _ref['aria-expanded'],
378
+ ariaLabel = _ref['aria-label'],
378
379
  data = _ref.data,
379
380
  disabled = _ref.disabled,
380
381
  id = _ref.id,
@@ -408,7 +409,7 @@ var Button = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
408
409
  "aria-controls": ariaControls,
409
410
  "aria-describedby": ariaDescribedBy,
410
411
  "aria-expanded": ariaExpanded,
411
- "aria-label": props.label,
412
+ "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : props.label,
412
413
  css: react$1.css(buttonStyles, react$1.css(customCss)),
413
414
  data: data,
414
415
  disabled: loading || disabled,
package/dist/spark-web-button.cjs.prod.js CHANGED
@@ -366,7 +366,7 @@ function useButtonStyles(_ref) {
366
366
  })];
367
367
  }
368
368
 
369
- var _excluded$1 = ["aria-controls", "aria-describedby", "aria-expanded", "data", "disabled", "id", "loading", "onClick", "css", "rounded", "prominence", "size", "tone", "type"];
369
+ var _excluded$1 = ["aria-controls", "aria-describedby", "aria-expanded", "aria-label", "data", "disabled", "id", "loading", "onClick", "css", "rounded", "prominence", "size", "tone", "type"];
370
370
  /**
371
371
  * Buttons are used to initialize an action, their label should express what
372
372
  * action will occur when the user interacts with it.
@@ -375,6 +375,7 @@ var Button = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
375
375
  var ariaControls = _ref['aria-controls'],
376
376
  ariaDescribedBy = _ref['aria-describedby'],
377
377
  ariaExpanded = _ref['aria-expanded'],
378
+ ariaLabel = _ref['aria-label'],
378
379
  data = _ref.data,
379
380
  disabled = _ref.disabled,
380
381
  id = _ref.id,
@@ -408,7 +409,7 @@ var Button = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
408
409
  "aria-controls": ariaControls,
409
410
  "aria-describedby": ariaDescribedBy,
410
411
  "aria-expanded": ariaExpanded,
411
- "aria-label": props.label,
412
+ "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : props.label,
412
413
  css: react$1.css(buttonStyles, react$1.css(customCss)),
413
414
  data: data,
414
415
  disabled: loading || disabled,
package/dist/spark-web-button.esm.js CHANGED
@@ -362,7 +362,7 @@ function useButtonStyles(_ref) {
362
362
  })];
363
363
  }
364
364
 
365
- var _excluded$1 = ["aria-controls", "aria-describedby", "aria-expanded", "data", "disabled", "id", "loading", "onClick", "css", "rounded", "prominence", "size", "tone", "type"];
365
+ var _excluded$1 = ["aria-controls", "aria-describedby", "aria-expanded", "aria-label", "data", "disabled", "id", "loading", "onClick", "css", "rounded", "prominence", "size", "tone", "type"];
366
366
  /**
367
367
  * Buttons are used to initialize an action, their label should express what
368
368
  * action will occur when the user interacts with it.
@@ -371,6 +371,7 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
371
371
  var ariaControls = _ref['aria-controls'],
372
372
  ariaDescribedBy = _ref['aria-describedby'],
373
373
  ariaExpanded = _ref['aria-expanded'],
374
+ ariaLabel = _ref['aria-label'],
374
375
  data = _ref.data,
375
376
  disabled = _ref.disabled,
376
377
  id = _ref.id,
@@ -404,7 +405,7 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
404
405
  "aria-controls": ariaControls,
405
406
  "aria-describedby": ariaDescribedBy,
406
407
  "aria-expanded": ariaExpanded,
407
- "aria-label": props.label,
408
+ "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : props.label,
408
409
  css: css(buttonStyles, css(customCss)),
409
410
  data: data,
410
411
  disabled: loading || disabled,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-web/button",
3
- "version": "5.0.0-rc.31",
3
+ "version": "5.0.1",
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.31",
21
- "@spark-web/box": "^5.0.0-rc.31",
22
- "@spark-web/icon": "^5.0.0-rc.31",
23
- "@spark-web/link": "^5.0.0-rc.31",
24
- "@spark-web/spinner": "^5.0.0-rc.31",
25
- "@spark-web/text": "^5.0.0-rc.31",
26
- "@spark-web/theme": "^5.0.0-rc.31",
27
- "@spark-web/utils": "^5.0.0-rc.31"
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",