@@ -22,6 +22,7 @@ import {
22
22
import Tooltip from '../internal/components/tooltip/index.js' ;
23
23
import { useButtonContext } from '../internal/context/button-context' ;
24
24
import { useSingleTabStopNavigation } from '../internal/context/single-tab-stop-navigation-context' ;
25
+ import { SYSTEM } from '../internal/environment' ;
25
26
import { fireCancelableEvent , isPlainLeftClick } from '../internal/events' ;
26
27
import customCssProps from '../internal/generated/custom-css-properties' ;
27
28
import useForwardFocus from '../internal/hooks/forward-focus' ;
@@ -292,38 +293,41 @@ export const InternalButton = React.forwardRef(
292
293
</ >
293
294
) ;
294
295
295
- const stylePropertiesAndVariables = {
296
- borderRadius : style ?. root ?. borderRadius ,
297
- borderWidth : style ?. root ?. borderWidth ,
298
- paddingBlock : style ?. root ?. paddingBlock ,
299
- paddingInline : style ?. root ?. paddingInline ,
300
- ...( style ?. root ?. background && {
301
- [ customCssProps . styleBackgroundActive ] : style . root . background ?. active ,
302
- [ customCssProps . styleBackgroundDefault ] : style . root . background ?. default ,
303
- [ customCssProps . styleBackgroundDisabled ] : style . root . background ?. disabled ,
304
- [ customCssProps . styleBackgroundHover ] : style . root . background ?. hover ,
305
- } ) ,
306
- ...( style ?. root ?. borderColor && {
307
- [ customCssProps . styleBorderColorActive ] : style . root . borderColor ?. active ,
308
- [ customCssProps . styleBorderColorDefault ] : style . root . borderColor ?. default ,
309
- [ customCssProps . styleBorderColorDisabled ] : style . root . borderColor ?. disabled ,
310
- [ customCssProps . styleBorderColorHover ] : style . root . borderColor ?. hover ,
311
- } ) ,
312
- ...( style ?. root ?. color && {
313
- [ customCssProps . styleColorActive ] : style . root . color ?. active ,
314
- [ customCssProps . styleColorDefault ] : style . root . color ?. default ,
315
- [ customCssProps . styleColorDisabled ] : style . root . color ?. disabled ,
316
- [ customCssProps . styleColorHover ] : style . root . color ?. hover ,
317
- } ) ,
318
- ...( style ?. root ?. focusRing && {
319
- [ customCssProps . styleFocusRingBorderColor ] : style . root . focusRing ?. borderColor ,
320
- [ customCssProps . styleFocusRingBorderRadius ] : style . root . focusRing ?. borderRadius ,
321
- [ customCssProps . styleFocusRingBorderWidth ] : style . root . focusRing ?. borderWidth ,
322
- } ) ,
323
- ...( style ?. root ?. focusRing ?. borderRadius && {
324
- [ customCssProps . styleFocusRingBorderRadius ] : style . root . focusRing . borderRadius ,
325
- } ) ,
326
- } ;
296
+ const stylePropertiesAndVariables =
297
+ SYSTEM === 'core'
298
+ ? {
299
+ borderRadius : style ?. root ?. borderRadius ,
300
+ borderWidth : style ?. root ?. borderWidth ,
301
+ paddingBlock : style ?. root ?. paddingBlock ,
302
+ paddingInline : style ?. root ?. paddingInline ,
303
+ ...( style ?. root ?. background && {
304
+ [ customCssProps . styleBackgroundActive ] : style . root . background ?. active ,
305
+ [ customCssProps . styleBackgroundDefault ] : style . root . background ?. default ,
306
+ [ customCssProps . styleBackgroundDisabled ] : style . root . background ?. disabled ,
307
+ [ customCssProps . styleBackgroundHover ] : style . root . background ?. hover ,
308
+ } ) ,
309
+ ...( style ?. root ?. borderColor && {
310
+ [ customCssProps . styleBorderColorActive ] : style . root . borderColor ?. active ,
311
+ [ customCssProps . styleBorderColorDefault ] : style . root . borderColor ?. default ,
312
+ [ customCssProps . styleBorderColorDisabled ] : style . root . borderColor ?. disabled ,
313
+ [ customCssProps . styleBorderColorHover ] : style . root . borderColor ?. hover ,
314
+ } ) ,
315
+ ...( style ?. root ?. color && {
316
+ [ customCssProps . styleColorActive ] : style . root . color ?. active ,
317
+ [ customCssProps . styleColorDefault ] : style . root . color ?. default ,
318
+ [ customCssProps . styleColorDisabled ] : style . root . color ?. disabled ,
319
+ [ customCssProps . styleColorHover ] : style . root . color ?. hover ,
320
+ } ) ,
321
+ ...( style ?. root ?. focusRing && {
322
+ [ customCssProps . styleFocusRingBorderColor ] : style . root . focusRing ?. borderColor ,
323
+ [ customCssProps . styleFocusRingBorderRadius ] : style . root . focusRing ?. borderRadius ,
324
+ [ customCssProps . styleFocusRingBorderWidth ] : style . root . focusRing ?. borderWidth ,
325
+ } ) ,
326
+ ...( style ?. root ?. focusRing ?. borderRadius && {
327
+ [ customCssProps . styleFocusRingBorderRadius ] : style . root . focusRing . borderRadius ,
328
+ } ) ,
329
+ }
330
+ : undefined ;
327
331
328
332
if ( isAnchor ) {
329
333
return (
0 commit comments