@spark-web/button 5.2.1 → 5.3.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,21 @@
1
1
  # @spark-web/button
2
2
 
3
+ ## 5.3.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#576](https://github.com/brighte-labs/spark-web/pull/576)
8
+ [`3056d86`](https://github.com/brighte-labs/spark-web/commit/3056d863266abc952b1c68775e1e349e13ef0e8f)
9
+ Thanks [@chrischua-brighte](https://github.com/chrischua-brighte)! - add new
10
+ prop for radio, new token sizes, new button tone
11
+
12
+ ### Patch Changes
13
+
14
+ - Updated dependencies
15
+ [[`3056d86`](https://github.com/brighte-labs/spark-web/commit/3056d863266abc952b1c68775e1e349e13ef0e8f)]:
16
+ - @spark-web/theme@5.9.0
17
+ - @spark-web/a11y@5.1.0
18
+
3
19
  ## 5.2.1
4
20
 
5
21
  ### 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" | "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>>;
@@ -117,7 +117,12 @@ var variants = {
117
117
  backgroundActive: 'criticalActive'
118
118
  }, highDisabledStyles),
119
119
  caution: undefined,
120
- info: undefined
120
+ info: undefined,
121
+ primaryDark: _objectSpread({
122
+ background: 'primaryDark',
123
+ backgroundHover: 'primaryHover',
124
+ backgroundActive: 'primaryActive'
125
+ }, highDisabledStyles)
121
126
  },
122
127
  low: {
123
128
  primary: _objectSpread({
@@ -168,7 +173,19 @@ var variants = {
168
173
  background: 'infoLow',
169
174
  backgroundHover: 'infoLowHover',
170
175
  backgroundActive: 'infoLowActive'
171
- }, lowDisabledStyles)
176
+ }, lowDisabledStyles),
177
+ primaryDark: _objectSpread({
178
+ background: 'surface',
179
+ border: 'primaryActive',
180
+ borderWidth: 'large',
181
+ textTone: 'primaryActive',
182
+ backgroundHover: 'none',
183
+ borderHover: 'primaryHover',
184
+ textToneHover: 'primaryHover',
185
+ backgroundActive: 'none',
186
+ borderActive: 'primaryActive',
187
+ textToneActive: 'primaryActive'
188
+ }, lowDisabledAltStyles)
172
189
  },
173
190
  none: {
174
191
  primary: _objectSpread({
@@ -212,6 +229,12 @@ var variants = {
212
229
  textTone: 'info',
213
230
  backgroundHover: 'infoLowHover',
214
231
  backgroundActive: 'infoLowActive'
232
+ }, noneDisabledStyles),
233
+ primaryDark: _objectSpread({
234
+ background: 'surface',
235
+ textTone: 'primaryActive',
236
+ backgroundHover: 'primaryLowHover',
237
+ backgroundActive: 'primaryLowActive'
215
238
  }, noneDisabledStyles)
216
239
  }
217
240
  };
@@ -117,7 +117,12 @@ var variants = {
117
117
  backgroundActive: 'criticalActive'
118
118
  }, highDisabledStyles),
119
119
  caution: undefined,
120
- info: undefined
120
+ info: undefined,
121
+ primaryDark: _objectSpread({
122
+ background: 'primaryDark',
123
+ backgroundHover: 'primaryHover',
124
+ backgroundActive: 'primaryActive'
125
+ }, highDisabledStyles)
121
126
  },
122
127
  low: {
123
128
  primary: _objectSpread({
@@ -168,7 +173,19 @@ var variants = {
168
173
  background: 'infoLow',
169
174
  backgroundHover: 'infoLowHover',
170
175
  backgroundActive: 'infoLowActive'
171
- }, lowDisabledStyles)
176
+ }, lowDisabledStyles),
177
+ primaryDark: _objectSpread({
178
+ background: 'surface',
179
+ border: 'primaryActive',
180
+ borderWidth: 'large',
181
+ textTone: 'primaryActive',
182
+ backgroundHover: 'none',
183
+ borderHover: 'primaryHover',
184
+ textToneHover: 'primaryHover',
185
+ backgroundActive: 'none',
186
+ borderActive: 'primaryActive',
187
+ textToneActive: 'primaryActive'
188
+ }, lowDisabledAltStyles)
172
189
  },
173
190
  none: {
174
191
  primary: _objectSpread({
@@ -212,6 +229,12 @@ var variants = {
212
229
  textTone: 'info',
213
230
  backgroundHover: 'infoLowHover',
214
231
  backgroundActive: 'infoLowActive'
232
+ }, noneDisabledStyles),
233
+ primaryDark: _objectSpread({
234
+ background: 'surface',
235
+ textTone: 'primaryActive',
236
+ backgroundHover: 'primaryLowHover',
237
+ backgroundActive: 'primaryLowActive'
215
238
  }, noneDisabledStyles)
216
239
  }
217
240
  };
@@ -113,7 +113,12 @@ var variants = {
113
113
  backgroundActive: 'criticalActive'
114
114
  }, highDisabledStyles),
115
115
  caution: undefined,
116
- info: undefined
116
+ info: undefined,
117
+ primaryDark: _objectSpread({
118
+ background: 'primaryDark',
119
+ backgroundHover: 'primaryHover',
120
+ backgroundActive: 'primaryActive'
121
+ }, highDisabledStyles)
117
122
  },
118
123
  low: {
119
124
  primary: _objectSpread({
@@ -164,7 +169,19 @@ var variants = {
164
169
  background: 'infoLow',
165
170
  backgroundHover: 'infoLowHover',
166
171
  backgroundActive: 'infoLowActive'
167
- }, lowDisabledStyles)
172
+ }, lowDisabledStyles),
173
+ primaryDark: _objectSpread({
174
+ background: 'surface',
175
+ border: 'primaryActive',
176
+ borderWidth: 'large',
177
+ textTone: 'primaryActive',
178
+ backgroundHover: 'none',
179
+ borderHover: 'primaryHover',
180
+ textToneHover: 'primaryHover',
181
+ backgroundActive: 'none',
182
+ borderActive: 'primaryActive',
183
+ textToneActive: 'primaryActive'
184
+ }, lowDisabledAltStyles)
168
185
  },
169
186
  none: {
170
187
  primary: _objectSpread({
@@ -208,6 +225,12 @@ var variants = {
208
225
  textTone: 'info',
209
226
  backgroundHover: 'infoLowHover',
210
227
  backgroundActive: 'infoLowActive'
228
+ }, noneDisabledStyles),
229
+ primaryDark: _objectSpread({
230
+ background: 'surface',
231
+ textTone: 'primaryActive',
232
+ backgroundHover: 'primaryLowHover',
233
+ backgroundActive: 'primaryLowActive'
211
234
  }, noneDisabledStyles)
212
235
  }
213
236
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-web/button",
3
- "version": "5.2.1",
3
+ "version": "5.3.0",
4
4
  "homepage": "https://github.com/brighte-labs/spark-web#readme",
5
5
  "repository": {
6
6
  "type": "git",
@@ -17,13 +17,13 @@
17
17
  "dependencies": {
18
18
  "@babel/runtime": "^7.25.0",
19
19
  "@emotion/react": "^11.14.0",
20
- "@spark-web/a11y": "^5.0.0",
20
+ "@spark-web/a11y": "^5.1.0",
21
21
  "@spark-web/box": "^5.0.0",
22
22
  "@spark-web/icon": "^5.0.0",
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.7.2",
26
+ "@spark-web/theme": "^5.9.0",
27
27
  "@spark-web/utils": "^5.0.0"
28
28
  },
29
29
  "devDependencies": {