Skip to content

Commit 39140f6

Browse files
authored
Merge branch 'main' into feat/widgetize-app-layout-skeleton-event-base
2 parents e1dd299 + 20728be commit 39140f6

File tree

6 files changed

+60
-45
lines changed

6 files changed

+60
-45
lines changed

build-tools/tasks/generate-environment.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ function writeEnvironmentFile(theme) {
1212
PACKAGE_VERSION: workspace.packageVersion,
1313
GIT_SHA: workspace.gitCommitVersion,
1414
THEME: theme.name,
15+
SYSTEM: 'core',
1516
ALWAYS_VISUAL_REFRESH: !!theme.alwaysVisualRefresh,
1617
};
1718
const basePath = path.join(theme.outputPath, filepath);

src/button/internal.tsx

Lines changed: 36 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import {
2222
import Tooltip from '../internal/components/tooltip/index.js';
2323
import { useButtonContext } from '../internal/context/button-context';
2424
import { useSingleTabStopNavigation } from '../internal/context/single-tab-stop-navigation-context';
25+
import { SYSTEM } from '../internal/environment';
2526
import { fireCancelableEvent, isPlainLeftClick } from '../internal/events';
2627
import customCssProps from '../internal/generated/custom-css-properties';
2728
import useForwardFocus from '../internal/hooks/forward-focus';
@@ -292,38 +293,41 @@ export const InternalButton = React.forwardRef(
292293
</>
293294
);
294295

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;
327331

328332
if (isAnchor) {
329333
return (

src/flashbar/collapsible-flashbar.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -267,7 +267,7 @@ export default function CollapsibleFlashbar({ items, style, ...restProps }: Flas
267267
}
268268
}}
269269
style={{
270-
...(index > 0 && !isFlashbarStackExpanded && style && getCollapsibleFlashStyles(style, item.type)),
270+
...(index > 0 && !isFlashbarStackExpanded && getCollapsibleFlashStyles(style, item.type)),
271271
...((!isFlashbarStackExpanded || transitioning) && {
272272
[customCssProps.flashbarStackIndex]:
273273
(item as StackableItem).collapsedIndex ?? (item as StackableItem).expandedIndex ?? index,
@@ -326,7 +326,7 @@ export default function CollapsibleFlashbar({ items, style, ...restProps }: Flas
326326
)}
327327
onClick={toggleCollapseExpand}
328328
ref={notificationBarRef}
329-
style={{ ...(style && getNotificationBarStyles(style)) }}
329+
style={getNotificationBarStyles(style)}
330330
{...getAnalyticsMetadataAttribute({
331331
action: !isFlashbarStackExpanded ? 'expand' : 'collapse',
332332
detail: {

src/flashbar/flash.tsx

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -67,9 +67,7 @@ function dismissButton(
6767
iconName="close"
6868
formAction="none"
6969
ariaLabel={dismissLabel}
70-
style={{
71-
...(style && getDismissButtonStyles(style, type)),
72-
}}
70+
style={getDismissButtonStyles(style, type)}
7371
/>
7472
</div>
7573
);
@@ -201,9 +199,7 @@ export const Flash = React.forwardRef(
201199
getVisualContextClassname(type === 'warning' && !loading ? 'flashbar-warning' : 'flashbar'),
202200
initialHidden && styles['initial-hidden']
203201
)}
204-
style={{
205-
...(style && getFlashStyles(style, effectiveType)),
206-
}}
202+
style={getFlashStyles(style, effectiveType)}
207203
{...analyticsAttributes}
208204
>
209205
<div className={styles['flash-body']}>

src/flashbar/style.tsx

Lines changed: 18 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
11
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
22
// SPDX-License-Identifier: Apache-2.0
3+
import { SYSTEM } from '../internal/environment';
34
import customCssProps from '../internal/generated/custom-css-properties';
45
import { FlashbarProps } from './interfaces';
56

6-
export function getCollapsibleFlashStyles(style: FlashbarProps.Style, type: string = 'info') {
7+
export function getCollapsibleFlashStyles(style: FlashbarProps['style'], type: string = 'info') {
8+
if (SYSTEM !== 'core' || !style) {
9+
return undefined;
10+
}
711
const background =
812
style?.item?.root?.background &&
913
(type === 'in-progress'
@@ -38,15 +42,18 @@ export function getCollapsibleFlashStyles(style: FlashbarProps.Style, type: stri
3842
};
3943
}
4044

41-
export function getFlashStyles(style: FlashbarProps.Style, type: string = 'info') {
45+
export function getFlashStyles(style: FlashbarProps['style'] | undefined, type: string = 'info') {
46+
if (SYSTEM !== 'core' || !style) {
47+
return undefined;
48+
}
4249
const focusRingBorderColor =
4350
style?.item?.root?.focusRing?.borderColor &&
4451
(type === 'in-progress'
4552
? style.item.root.focusRing.borderColor.inProgress
4653
: style.item.root.focusRing.borderColor[type as keyof typeof style.item.root.focusRing.borderColor]);
4754

4855
return {
49-
...(style && getCollapsibleFlashStyles(style, type)),
56+
...getCollapsibleFlashStyles(style, type),
5057
...(style?.item?.root?.focusRing && {
5158
[customCssProps.styleFocusRingBorderColor]: focusRingBorderColor,
5259
[customCssProps.styleFocusRingBorderRadius]: style.item.root.focusRing?.borderRadius,
@@ -58,7 +65,10 @@ export function getFlashStyles(style: FlashbarProps.Style, type: string = 'info'
5865
};
5966
}
6067

61-
export function getDismissButtonStyles(style: FlashbarProps.Style, type: string = 'info') {
68+
export function getDismissButtonStyles(style: FlashbarProps['style'], type: string = 'info') {
69+
if (SYSTEM !== 'core' || !style) {
70+
return undefined;
71+
}
6272
const activeColor =
6373
style?.item?.dismissButton?.color?.active &&
6474
(type === 'in-progress'
@@ -101,7 +111,10 @@ export function getDismissButtonStyles(style: FlashbarProps.Style, type: string
101111
};
102112
}
103113

104-
export function getNotificationBarStyles(style: FlashbarProps.Style) {
114+
export function getNotificationBarStyles(style: FlashbarProps['style']) {
115+
if (SYSTEM !== 'core' || !style) {
116+
return undefined;
117+
}
105118
return {
106119
borderRadius: style?.notificationBar?.root?.borderRadius,
107120
borderWidth: style?.notificationBar?.root?.borderWidth,

src/internal/environment.d.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33

44
// this a placeholder for typescript. The real files are generated in `generate-environment` task
55
export const THEME: string;
6+
export const SYSTEM: string;
67
export const PACKAGE_SOURCE: string;
78
export const PACKAGE_VERSION: string;
89
export const GIT_SHA: string;

0 commit comments

Comments
 (0)