npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.1076 → 3.0.1078 - Mend

@cloudscape-design/components-themeable 3.0.1076 → 3.0.1078

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 (58) hide show

package/lib/internal/template/flashbar/flash.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"flash.js","sourceRoot":"","sources":["../../../src/flashbar/flash.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport {\n useComponentMetadata,\n useMergeRefs,\n useUniqueId,\n warnOnce,\n} from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\nimport { AnalyticsMetadata } from '@cloudscape-design/component-toolkit/internal/base-component/metrics/interfaces';\n\nimport { ActionsWrapper } from '../alert/actions-wrapper';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport InternalIcon from '../icon/internal';\nimport {\n DATA_ATTR_ANALYTICS_FLASHBAR,\n DATA_ATTR_ANALYTICS_SUPPRESS_FLOW_EVENTS,\n} from '../internal/analytics/selectors';\nimport { getVisualContextClassname } from '../internal/components/visual-context';\nimport { PACKAGE_VERSION } from '../internal/environment';\nimport { isDevelopment } from '../internal/is-development';\nimport { awsuiPluginsInternal } from '../internal/plugins/api';\nimport { createUseDiscoveredAction, createUseDiscoveredContent } from '../internal/plugins/helpers';\nimport { throttle } from '../internal/utils/throttle';\nimport useContainerWidth from '../internal/utils/use-container-width';\nimport InternalLiveRegion from '../live-region/internal';\nimport InternalSpinner from '../spinner/internal';\nimport { GeneratedAnalyticsMetadataFlashbarDismiss } from './analytics-metadata/interfaces';\nimport { FlashbarProps } from './interfaces';\nimport { getDismissButtonStyles, getFlashStyles } from './style';\nimport { FOCUS_THROTTLE_DELAY } from './utils';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nconst ICON_TYPES = {\n success: 'status-positive',\n warning: 'status-warning',\n info: 'status-info',\n error: 'status-negative',\n 'in-progress': 'status-in-progress',\n} as const;\n\nconst useDiscoveredAction = createUseDiscoveredAction(awsuiPluginsInternal.flashbar.onActionRegistered);\nconst useDiscoveredContent = createUseDiscoveredContent('flash', awsuiPluginsInternal.flashContent);\n\nfunction dismissButton(\n dismissLabel: FlashbarProps.MessageDefinition['dismissLabel'],\n onDismiss: FlashbarProps.MessageDefinition['onDismiss'],\n style?: FlashbarProps.Style,\n type?: string,\n ref?: React.Ref<ButtonProps.Ref>,\n id?: string,\n onDismissed?: (id?: string) => void\n) {\n return (\n <div\n className={styles['dismiss-button-wrapper']}\n {...getAnalyticsMetadataAttribute({ action: 'dismiss' } as Partial<GeneratedAnalyticsMetadataFlashbarDismiss>)}\n >\n <InternalButton\n ref={ref}\n onClick={event => {\n if (onDismiss) {\n onDismiss(event);\n }\n if (onDismissed) {\n onDismissed(id);\n }\n }}\n className={styles['dismiss-button']}\n variant=\"flashbar-icon\"\n iconName=\"close\"\n formAction=\"none\"\n ariaLabel={dismissLabel}\n style={getDismissButtonStyles(style, type)}\n />\n </div>\n );\n}\nexport const focusFlashFocusableArea = (flash: HTMLElement \| null) => {\n if (!flash) {\n return;\n }\n const dismissButton = flash.querySelector(`.${styles['dismiss-button']}`);\n const focusContainer = flash.querySelector(`.${styles['flash-focus-container']}`);\n\n if (dismissButton) {\n (dismissButton as HTMLElement).focus();\n } else if (focusContainer) {\n (focusContainer as HTMLElement).focus();\n }\n};\n\nexport const focusFlashById = throttle(\n (element: HTMLElement \| null, itemId: string) => {\n if (!element) {\n return;\n }\n\n const flashElement = element.querySelector<HTMLElement>(`[data-itemid=\"${CSS.escape(itemId)}\"]`);\n if (!flashElement) {\n return;\n }\n\n const focusContainer = flashElement.querySelector<HTMLElement>(`.${styles['flash-focus-container']}`);\n\n focusContainer?.focus();\n },\n FOCUS_THROTTLE_DELAY,\n { trailing: false }\n);\n\ninterface FlashProps extends FlashbarProps.MessageDefinition {\n className: string;\n transitionState?: string;\n i18nStrings?: FlashbarProps.I18nStrings;\n style?: FlashbarProps.Style;\n rootRef?: React.Ref<HTMLDivElement>;\n onDismissed?: (id?: string) => void;\n}\n\nexport const Flash = React.forwardRef(\n (\n {\n id,\n header,\n content,\n dismissible,\n dismissLabel,\n loading,\n action,\n buttonText,\n onButtonClick,\n onDismiss,\n className,\n transitionState,\n ariaRole,\n i18nStrings,\n type = 'info',\n analyticsMetadata,\n style,\n rootRef,\n onDismissed,\n ...props\n }: FlashProps,\n ref: React.Ref<HTMLDivElement>\n ) => {\n if (isDevelopment) {\n if (buttonText && !onButtonClick) {\n warnOnce(\n 'Flashbar',\n `You provided a \\`buttonText\\` prop without an \\`onButtonClick\\` handler. This will render a non-interactive action button.`\n );\n }\n\n if (dismissible && !onDismiss) {\n warnOnce(\n 'Flashbar',\n `You have set the \\`dismissible\\` prop without an \\`onDismiss\\` handler. This will render a non-interactive dismiss button.`\n );\n }\n }\n\n const [containerWidth, containerMeasureRef] = useContainerWidth();\n\n const elementRef = useComponentMetadata('Flash', PACKAGE_VERSION, analyticsMetadata as AnalyticsMetadata);\n\n // Merge all refs including the rootRef if provided\n const mergedRef = useMergeRefs(ref, rootRef, elementRef, containerMeasureRef);\n const flashIconId = useUniqueId('flash-icon');\n const flashMessageId = useUniqueId('flash-message');\n\n const headerRefObject = useRef<HTMLDivElement>(null);\n const contentRefObject = useRef<HTMLDivElement>(null);\n const dismissButtonRefObject = useRef<ButtonProps.Ref>(null);\n const { discoveredActions, headerRef: headerRefAction, contentRef: contentRefAction } = useDiscoveredAction(type);\n const {\n initialHidden,\n headerReplacementType,\n contentReplacementType,\n headerRef: headerRefContent,\n contentRef: contentRefContent,\n replacementHeaderRef,\n replacementContentRef,\n } = useDiscoveredContent({ type, header, children: content });\n\n const headerRef = useMergeRefs(headerRefAction, headerRefContent, headerRefObject);\n const contentRef = useMergeRefs(contentRefAction, contentRefContent, contentRefObject);\n\n const statusIconAriaLabel =\n props.statusIconAriaLabel \|\|\n i18nStrings?.[`${loading \|\| type === 'in-progress' ? 'inProgress' : type}IconAriaLabel`];\n\n const iconType = ICON_TYPES[type];\n const icon = loading ? (\n <span role=\"img\" aria-label={statusIconAriaLabel}>\n <InternalSpinner />\n </span>\n ) : (\n <InternalIcon name={iconType} ariaLabel={statusIconAriaLabel} />\n );\n\n const effectiveType = loading ? 'info' : type;\n\n const analyticsAttributes: Record<string, string> = { [DATA_ATTR_ANALYTICS_FLASHBAR]: effectiveType };\n\n if (analyticsMetadata?.suppressFlowMetricEvents) {\n analyticsAttributes[DATA_ATTR_ANALYTICS_SUPPRESS_FLOW_EVENTS] = 'true';\n }\n\n return (\n // We're not using \"polite\" or \"assertive\" here, just turning default behavior off.\n // eslint-disable-next-line @cloudscape-design/components/prefer-live-region\n <div\n ref={mergedRef}\n role={ariaRole}\n aria-live={ariaRole ? 'off' : undefined}\n data-itemid={id}\n className={clsx(\n styles.flash,\n styles[`flash-type-${effectiveType}`],\n className,\n transitionState && {\n [styles.enter]: transitionState === 'enter',\n [styles.entering]: transitionState === 'entering',\n [styles.entered]: transitionState === 'entered',\n [styles.exit]: transitionState === 'exit',\n [styles.exiting]: transitionState === 'exiting',\n [styles.exited]: transitionState === 'exited',\n },\n getVisualContextClassname(type === 'warning' && !loading ? 'flashbar-warning' : 'flashbar'),\n initialHidden && styles['initial-hidden']\n )}\n style={getFlashStyles(style, effectiveType)}\n {...analyticsAttributes}\n >\n <div className={styles['flash-body']}>\n <div\n className={styles['flash-focus-container']}\n tabIndex={-1}\n role=\"group\"\n aria-labelledby={`${flashIconId} ${flashMessageId}`}\n >\n <div className={clsx(styles['flash-icon'], styles['flash-text'])} id={flashIconId}>\n {icon}\n </div>\n <div className={clsx(styles['flash-message'], styles['flash-text'])} id={flashMessageId}>\n <div\n className={clsx(\n styles['flash-header'],\n headerReplacementType !== 'original' ? styles.hidden : analyticsSelectors['flash-header']\n )}\n ref={headerRef}\n >\n {header}\n </div>\n <div\n className={clsx(styles['header-replacement'], headerReplacementType !== 'replaced' && styles.hidden)}\n ref={replacementHeaderRef}\n ></div>\n <div\n className={clsx(\n styles['flash-content'],\n contentReplacementType !== 'original' ? styles.hidden : analyticsSelectors['flash-header']\n )}\n ref={contentRef}\n >\n {content}\n </div>\n <div\n className={clsx(styles['content-replacement'], contentReplacementType !== 'replaced' && styles.hidden)}\n ref={replacementContentRef}\n ></div>\n </div>\n </div>\n <ActionsWrapper\n className={styles['action-button-wrapper']}\n testUtilClasses={{ actionSlot: styles['action-slot'], actionButton: styles['action-button'] }}\n action={action}\n discoveredActions={discoveredActions}\n buttonText={buttonText}\n onButtonClick={onButtonClick}\n containerWidth={containerWidth}\n wrappedClass={styles['action-wrapped']}\n />\n </div>\n {dismissible &&\n dismissButton(dismissLabel, onDismiss, style, effectiveType, dismissButtonRefObject, id, onDismissed)}\n {ariaRole === 'status' && (\n <InternalLiveRegion sources={[statusIconAriaLabel, headerRefObject, contentRefObject]} />\n )}\n </div>\n );\n }\n);\n"]}
1	+ {"version":3,"file":"flash.js","sourceRoot":"","sources":["../../../src/flashbar/flash.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport {\n useComponentMetadata,\n useMergeRefs,\n useUniqueId,\n warnOnce,\n} from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\nimport { AnalyticsMetadata } from '@cloudscape-design/component-toolkit/internal/base-component/metrics/interfaces';\n\nimport { ActionsWrapper } from '../alert/actions-wrapper';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport InternalIcon from '../icon/internal';\nimport {\n DATA_ATTR_ANALYTICS_FLASHBAR,\n DATA_ATTR_ANALYTICS_SUPPRESS_FLOW_EVENTS,\n} from '../internal/analytics/selectors';\nimport { getVisualContextClassname } from '../internal/components/visual-context';\nimport { PACKAGE_VERSION } from '../internal/environment';\nimport { isDevelopment } from '../internal/is-development';\nimport { awsuiPluginsInternal } from '../internal/plugins/api';\nimport { createUseDiscoveredAction, createUseDiscoveredContent } from '../internal/plugins/helpers';\nimport useContainerWidth from '../internal/utils/use-container-width';\nimport InternalLiveRegion from '../live-region/internal';\nimport InternalSpinner from '../spinner/internal';\nimport { GeneratedAnalyticsMetadataFlashbarDismiss } from './analytics-metadata/interfaces';\nimport { FlashbarProps } from './interfaces';\nimport { getDismissButtonStyles, getFlashStyles } from './style';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nconst ICON_TYPES = {\n success: 'status-positive',\n warning: 'status-warning',\n info: 'status-info',\n error: 'status-negative',\n 'in-progress': 'status-in-progress',\n} as const;\n\nconst useDiscoveredAction = createUseDiscoveredAction(awsuiPluginsInternal.flashbar.onActionRegistered);\nconst useDiscoveredContent = createUseDiscoveredContent('flash', awsuiPluginsInternal.flashContent);\n\nfunction dismissButton(\n dismissLabel: FlashbarProps.MessageDefinition['dismissLabel'],\n onDismiss: FlashbarProps.MessageDefinition['onDismiss'],\n style?: FlashbarProps.Style,\n type?: string,\n ref?: React.Ref<ButtonProps.Ref>,\n id?: string,\n onDismissed?: (id?: string) => void\n) {\n return (\n <div\n className={styles['dismiss-button-wrapper']}\n {...getAnalyticsMetadataAttribute({ action: 'dismiss' } as Partial<GeneratedAnalyticsMetadataFlashbarDismiss>)}\n >\n <InternalButton\n ref={ref}\n onClick={event => {\n if (onDismiss) {\n onDismiss(event);\n }\n if (onDismissed) {\n onDismissed(id);\n }\n }}\n className={styles['dismiss-button']}\n variant=\"flashbar-icon\"\n iconName=\"close\"\n formAction=\"none\"\n ariaLabel={dismissLabel}\n style={getDismissButtonStyles(style, type)}\n />\n </div>\n );\n}\nexport const focusFlashFocusableArea = (flash: HTMLElement \| null) => {\n if (!flash) {\n return;\n }\n const dismissButton = flash.querySelector(`.${styles['dismiss-button']}`);\n const focusContainer = flash.querySelector(`.${styles['flash-focus-container']}`);\n\n if (dismissButton) {\n (dismissButton as HTMLElement).focus();\n } else if (focusContainer) {\n (focusContainer as HTMLElement).focus();\n }\n};\n\nexport function focusFlashById(element: HTMLElement \| null, itemId: string) {\n if (!element) {\n return;\n }\n\n const flashElement = element.querySelector<HTMLElement>(`[data-itemid=\"${CSS.escape(itemId)}\"]`);\n if (!flashElement) {\n return;\n }\n\n const focusContainer = flashElement.querySelector<HTMLElement>(`.${styles['flash-focus-container']}`);\n focusContainer?.focus();\n}\n\ninterface FlashProps extends FlashbarProps.MessageDefinition {\n className: string;\n transitionState?: string;\n i18nStrings?: FlashbarProps.I18nStrings;\n style?: FlashbarProps.Style;\n rootRef?: React.Ref<HTMLDivElement>;\n onDismissed?: (id?: string) => void;\n}\n\nexport const Flash = React.forwardRef(\n (\n {\n id,\n header,\n content,\n dismissible,\n dismissLabel,\n loading,\n action,\n buttonText,\n onButtonClick,\n onDismiss,\n className,\n transitionState,\n ariaRole,\n i18nStrings,\n type = 'info',\n analyticsMetadata,\n style,\n rootRef,\n onDismissed,\n ...props\n }: FlashProps,\n ref: React.Ref<HTMLDivElement>\n ) => {\n if (isDevelopment) {\n if (buttonText && !onButtonClick) {\n warnOnce(\n 'Flashbar',\n `You provided a \\`buttonText\\` prop without an \\`onButtonClick\\` handler. This will render a non-interactive action button.`\n );\n }\n\n if (dismissible && !onDismiss) {\n warnOnce(\n 'Flashbar',\n `You have set the \\`dismissible\\` prop without an \\`onDismiss\\` handler. This will render a non-interactive dismiss button.`\n );\n }\n }\n\n const [containerWidth, containerMeasureRef] = useContainerWidth();\n\n const elementRef = useComponentMetadata('Flash', PACKAGE_VERSION, analyticsMetadata as AnalyticsMetadata);\n\n // Merge all refs including the rootRef if provided\n const mergedRef = useMergeRefs(ref, rootRef, elementRef, containerMeasureRef);\n const flashIconId = useUniqueId('flash-icon');\n const flashMessageId = useUniqueId('flash-message');\n\n const headerRefObject = useRef<HTMLDivElement>(null);\n const contentRefObject = useRef<HTMLDivElement>(null);\n const dismissButtonRefObject = useRef<ButtonProps.Ref>(null);\n const { discoveredActions, headerRef: headerRefAction, contentRef: contentRefAction } = useDiscoveredAction(type);\n const {\n initialHidden,\n headerReplacementType,\n contentReplacementType,\n headerRef: headerRefContent,\n contentRef: contentRefContent,\n replacementHeaderRef,\n replacementContentRef,\n } = useDiscoveredContent({ type, header, children: content });\n\n const headerRef = useMergeRefs(headerRefAction, headerRefContent, headerRefObject);\n const contentRef = useMergeRefs(contentRefAction, contentRefContent, contentRefObject);\n\n const statusIconAriaLabel =\n props.statusIconAriaLabel \|\|\n i18nStrings?.[`${loading \|\| type === 'in-progress' ? 'inProgress' : type}IconAriaLabel`];\n\n const iconType = ICON_TYPES[type];\n const icon = loading ? (\n <span role=\"img\" aria-label={statusIconAriaLabel}>\n <InternalSpinner />\n </span>\n ) : (\n <InternalIcon name={iconType} ariaLabel={statusIconAriaLabel} />\n );\n\n const effectiveType = loading ? 'info' : type;\n\n const analyticsAttributes: Record<string, string> = { [DATA_ATTR_ANALYTICS_FLASHBAR]: effectiveType };\n\n if (analyticsMetadata?.suppressFlowMetricEvents) {\n analyticsAttributes[DATA_ATTR_ANALYTICS_SUPPRESS_FLOW_EVENTS] = 'true';\n }\n\n return (\n // We're not using \"polite\" or \"assertive\" here, just turning default behavior off.\n // eslint-disable-next-line @cloudscape-design/components/prefer-live-region\n <div\n ref={mergedRef}\n role={ariaRole}\n aria-live={ariaRole ? 'off' : undefined}\n data-itemid={id}\n className={clsx(\n styles.flash,\n styles[`flash-type-${effectiveType}`],\n className,\n transitionState && {\n [styles.enter]: transitionState === 'enter',\n [styles.entering]: transitionState === 'entering',\n [styles.entered]: transitionState === 'entered',\n [styles.exit]: transitionState === 'exit',\n [styles.exiting]: transitionState === 'exiting',\n [styles.exited]: transitionState === 'exited',\n },\n getVisualContextClassname(type === 'warning' && !loading ? 'flashbar-warning' : 'flashbar'),\n initialHidden && styles['initial-hidden']\n )}\n style={getFlashStyles(style, effectiveType)}\n {...analyticsAttributes}\n >\n <div className={styles['flash-body']}>\n <div\n className={styles['flash-focus-container']}\n tabIndex={-1}\n role=\"group\"\n aria-labelledby={`${flashIconId} ${flashMessageId}`}\n >\n <div className={clsx(styles['flash-icon'], styles['flash-text'])} id={flashIconId}>\n {icon}\n </div>\n <div className={clsx(styles['flash-message'], styles['flash-text'])} id={flashMessageId}>\n <div\n className={clsx(\n styles['flash-header'],\n headerReplacementType !== 'original' ? styles.hidden : analyticsSelectors['flash-header']\n )}\n ref={headerRef}\n >\n {header}\n </div>\n <div\n className={clsx(styles['header-replacement'], headerReplacementType !== 'replaced' && styles.hidden)}\n ref={replacementHeaderRef}\n ></div>\n <div\n className={clsx(\n styles['flash-content'],\n contentReplacementType !== 'original' ? styles.hidden : analyticsSelectors['flash-header']\n )}\n ref={contentRef}\n >\n {content}\n </div>\n <div\n className={clsx(styles['content-replacement'], contentReplacementType !== 'replaced' && styles.hidden)}\n ref={replacementContentRef}\n ></div>\n </div>\n </div>\n <ActionsWrapper\n className={styles['action-button-wrapper']}\n testUtilClasses={{ actionSlot: styles['action-slot'], actionButton: styles['action-button'] }}\n action={action}\n discoveredActions={discoveredActions}\n buttonText={buttonText}\n onButtonClick={onButtonClick}\n containerWidth={containerWidth}\n wrappedClass={styles['action-wrapped']}\n />\n </div>\n {dismissible &&\n dismissButton(dismissLabel, onDismiss, style, effectiveType, dismissButtonRefObject, id, onDismissed)}\n {ariaRole === 'status' && (\n <InternalLiveRegion sources={[statusIconAriaLabel, headerRefObject, contentRefObject]} />\n )}\n </div>\n );\n }\n);\n"]}

package/lib/internal/template/flashbar/utils.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import { IconProps } from '../icon/interfaces';
 import { FlashbarProps } from './interfaces';
-export declare const FOCUS_THROTTLE_DELAY = 2000;
+export declare const FOCUS_DEBOUNCE_DELAY = 500;
 export interface StackableItem extends FlashbarProps.MessageDefinition {
     expandedIndex: number;
     collapsedIndex?: number;

package/lib/internal/template/flashbar/utils.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/flashbar/utils.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,eAAO,MAAM,oBAAoB,~~OAAO~~,CAAC;~~AAKzC~~,MAAM,WAAW,aAAc,SAAQ,aAAa,CAAC,iBAAiB;IACpE,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAeD,wBAAgB,WAAW,CAAC,IAAI,EAAE,aAAa,CAAC,iBAAiB,sBAMhE;AAED,wBAAgB,YAAY,CAAC,IAAI,EAAE,aAAa,CAAC,iBAAiB,UAEjE;AAOD,wBAAgB,wBAAwB,CACtC,KAAK,EAAE,aAAa,CAAC,aAAa,CAAC,iBAAiB,CAAC,EACrD,aAAa,EAAE,MAAM,GACpB,aAAa,CAAC,aAAa,CAAC,CAgD9B;AAED,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,SAAS,aAAa,CAAC,iBAAiB,EAAE,GAChD,MAAM,CAAC,aAAa,CAAC,IAAI,EAAE,MAAM,CAAC,CAOpC;AAED,KAAK,SAAS,GACV,oBAAoB,GACpB,sBAAsB,GACtB,sBAAsB,GACtB,mBAAmB,GACnB,yBAAyB,CAAC;AAE9B,eAAO,MAAM,YAAY,EAAE;IACzB,IAAI,EAAE,aAAa,CAAC,IAAI,CAAC;IACzB,SAAS,EAAE,SAAS,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC,IAAI,CAAC;CAC1B,EAMA,CAAC"}
1	+ {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/flashbar/utils.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,eAAO,MAAM,oBAAoB,MAAM,CAAC;AAKxC,MAAM,WAAW,aAAc,SAAQ,aAAa,CAAC,iBAAiB;IACpE,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAeD,wBAAgB,WAAW,CAAC,IAAI,EAAE,aAAa,CAAC,iBAAiB,sBAMhE;AAED,wBAAgB,YAAY,CAAC,IAAI,EAAE,aAAa,CAAC,iBAAiB,UAEjE;AAOD,wBAAgB,wBAAwB,CACtC,KAAK,EAAE,aAAa,CAAC,aAAa,CAAC,iBAAiB,CAAC,EACrD,aAAa,EAAE,MAAM,GACpB,aAAa,CAAC,aAAa,CAAC,CAgD9B;AAED,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,SAAS,aAAa,CAAC,iBAAiB,EAAE,GAChD,MAAM,CAAC,aAAa,CAAC,IAAI,EAAE,MAAM,CAAC,CAOpC;AAED,KAAK,SAAS,GACV,oBAAoB,GACpB,sBAAsB,GACtB,sBAAsB,GACtB,mBAAmB,GACnB,yBAAyB,CAAC;AAE9B,eAAO,MAAM,YAAY,EAAE;IACzB,IAAI,EAAE,aAAa,CAAC,IAAI,CAAC;IACzB,SAAS,EAAE,SAAS,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC,IAAI,CAAC;CAC1B,EAMA,CAAC"}

package/lib/internal/template/flashbar/utils.js CHANGED Viewed

@@ -1,4 +1,4 @@
-export const FOCUS_THROTTLE_DELAY = 2000;
+export const FOCUS_DEBOUNCE_DELAY = 500;
 const typesToColors = {
     error: 'red',
     info: 'blue',

package/lib/internal/template/flashbar/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/flashbar/utils.ts"],"names":[],"mappings":"AAKA,MAAM,CAAC,MAAM,oBAAoB,GAAG,~~IAAI~~,CAAC;~~AAUzC~~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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { IconProps } from '../icon/interfaces';\nimport { FlashbarProps } from './interfaces';\n\nexport const ~~FOCUS_THROTTLE_DELAY~~ = ~~2000~~;\n\n// Since the position of a notification changes when the Flashbar is collapsed,\n// it is useful on some situations (e.g, for animating) to know the original position of the item\n// in the non-collapsed state.\nexport interface StackableItem extends FlashbarProps.MessageDefinition {\n expandedIndex: number;\n collapsedIndex?: number;\n}\n\nconst typesToColors: Record<FlashbarProps.Type, string> = {\n error: 'red',\n info: 'blue',\n 'in-progress': 'blue',\n success: 'green',\n warning: 'yellow',\n};\n\nfunction getColorFromType(type?: FlashbarProps.Type): string {\n const defaultColor = 'blue';\n return type ? typesToColors[type] \|\| defaultColor : defaultColor;\n}\n\nexport function getItemType(item: FlashbarProps.MessageDefinition) {\n if (item.loading) {\n return 'in-progress';\n } else {\n return item.type \|\| 'info';\n }\n}\n\nexport function getItemColor(item: FlashbarProps.MessageDefinition) {\n return getColorFromType(getItemType(item));\n}\n\n/\n Returns a selection of notifications, preserving the order when possible but making sure that all different colors in\n the stack are represented in the returned array.\n The order corresponds to how they are represented when using the collapsible feature (newest first, oldest last).\n /\nexport function getVisibleCollapsedItems(\n items: ReadonlyArray<FlashbarProps.MessageDefinition>,\n desiredLength: number\n): ReadonlyArray<StackableItem> {\n // First `desiredLength` items in the original array,\n // together with `isColorRepeated` to tell if they can be subject to be replaced later on if necessary\n const itemsOnTop: { item: StackableItem; isColorRepeated: boolean }[] = [];\n\n // Items that fall outside `desiredIndexLength` but need to be \"promoted\" if possible\n // because they are of a different color which otherwise wouldn't be represented\n const itemsToPromote: StackableItem[] = [];\n\n const addedColors: Set<string> = new Set();\n const allPossibleColors = Object.keys(typesToColors).length;\n const finalLength = Math.min(items.length, desiredLength);\n\n for (let i = 0; i < items.length; i++) {\n const item = items[i];\n const color = getItemColor(item);\n const isColorRepeated = addedColors.has(color);\n if (i < finalLength) {\n itemsOnTop.push({ item: { ...item, expandedIndex: i }, isColorRepeated });\n } else {\n if (addedColors.size === allPossibleColors) {\n // No need to keep looking for unrepresented colors, we can stop looping\n break;\n } else if (!isColorRepeated) {\n itemsToPromote.push({ ...item, expandedIndex: i });\n }\n }\n addedColors.add(color);\n }\n // Generate the new array with the selected items, by picking from both arrays.\n // First, from the non-repeated items within the desired length...\n // We loop `itemsOnTop` starting from the end because we prefer to preserve the first ones rather than the old ones\n const reversedInitialSelection = [];\n let slotsReservedForPromotions = 0;\n for (let j = itemsOnTop.length - 1; j >= 0; j--) {\n const item = itemsOnTop[j];\n if (item.isColorRepeated && slotsReservedForPromotions < itemsToPromote.length) {\n slotsReservedForPromotions += 1;\n } else {\n reversedInitialSelection.push(item.item);\n }\n }\n const selectedItems = reversedInitialSelection.reverse();\n // ...and then complete the selection with as many promotable items as we can fit in the rest of the array\n for (let k = 0; selectedItems.length < desiredLength; k++) {\n selectedItems.push(itemsToPromote[k]);\n }\n return selectedItems;\n}\n\nexport function getFlashTypeCount(\n items: readonly FlashbarProps.MessageDefinition[]\n): Record<FlashbarProps.Type, number> {\n const count = { error: 0, info: 0, 'in-progress': 0, success: 0, warning: 0 };\n for (const item of items) {\n const type = getItemType(item);\n count[type] += 1;\n }\n return count;\n}\n\ntype LabelName =\n \| 'errorIconAriaLabel'\n \| 'warningIconAriaLabel'\n \| 'successIconAriaLabel'\n \| 'infoIconAriaLabel'\n \| 'inProgressIconAriaLabel';\n\nexport const counterTypes: {\n type: FlashbarProps.Type;\n labelName: LabelName;\n iconName: IconProps.Name;\n}[] = [\n { type: 'error', labelName: 'errorIconAriaLabel', iconName: 'status-negative' },\n { type: 'warning', labelName: 'warningIconAriaLabel', iconName: 'status-warning' },\n { type: 'success', labelName: 'successIconAriaLabel', iconName: 'status-positive' },\n { type: 'info', labelName: 'infoIconAriaLabel', iconName: 'status-info' },\n { type: 'in-progress', labelName: 'inProgressIconAriaLabel', iconName: 'status-in-progress' },\n];\n"]}
1	+ {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/flashbar/utils.ts"],"names":[],"mappings":"AAKA,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,CAAC;AAUxC,MAAM,aAAa,GAAuC;IACxD,KAAK,EAAE,KAAK;IACZ,IAAI,EAAE,MAAM;IACZ,aAAa,EAAE,MAAM;IACrB,OAAO,EAAE,OAAO;IAChB,OAAO,EAAE,QAAQ;CAClB,CAAC;AAEF,SAAS,gBAAgB,CAAC,IAAyB;IACjD,MAAM,YAAY,GAAG,MAAM,CAAC;IAC5B,OAAO,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC;AACnE,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,IAAqC;IAC/D,IAAI,IAAI,CAAC,OAAO,EAAE;QAChB,OAAO,aAAa,CAAC;KACtB;SAAM;QACL,OAAO,IAAI,CAAC,IAAI,IAAI,MAAM,CAAC;KAC5B;AACH,CAAC;AAED,MAAM,UAAU,YAAY,CAAC,IAAqC;IAChE,OAAO,gBAAgB,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC;AAC7C,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,wBAAwB,CACtC,KAAqD,EACrD,aAAqB;IAErB,qDAAqD;IACrD,sGAAsG;IACtG,MAAM,UAAU,GAAwD,EAAE,CAAC;IAE3E,qFAAqF;IACrF,gFAAgF;IAChF,MAAM,cAAc,GAAoB,EAAE,CAAC;IAE3C,MAAM,WAAW,GAAgB,IAAI,GAAG,EAAE,CAAC;IAC3C,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,MAAM,CAAC;IAC5D,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;IAE1D,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QACrC,MAAM,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;QACtB,MAAM,KAAK,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;QACjC,MAAM,eAAe,GAAG,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;QAC/C,IAAI,CAAC,GAAG,WAAW,EAAE;YACnB,UAAU,CAAC,IAAI,CAAC,EAAE,IAAI,kCAAO,IAAI,KAAE,aAAa,EAAE,CAAC,GAAE,EAAE,eAAe,EAAE,CAAC,CAAC;SAC3E;aAAM;YACL,IAAI,WAAW,CAAC,IAAI,KAAK,iBAAiB,EAAE;gBAC1C,wEAAwE;gBACxE,MAAM;aACP;iBAAM,IAAI,CAAC,eAAe,EAAE;gBAC3B,cAAc,CAAC,IAAI,iCAAM,IAAI,KAAE,aAAa,EAAE,CAAC,IAAG,CAAC;aACpD;SACF;QACD,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;KACxB;IACD,+EAA+E;IAC/E,kEAAkE;IAClE,mHAAmH;IACnH,MAAM,wBAAwB,GAAG,EAAE,CAAC;IACpC,IAAI,0BAA0B,GAAG,CAAC,CAAC;IACnC,KAAK,IAAI,CAAC,GAAG,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,EAAE;QAC/C,MAAM,IAAI,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;QAC3B,IAAI,IAAI,CAAC,eAAe,IAAI,0BAA0B,GAAG,cAAc,CAAC,MAAM,EAAE;YAC9E,0BAA0B,IAAI,CAAC,CAAC;SACjC;aAAM;YACL,wBAAwB,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SAC1C;KACF;IACD,MAAM,aAAa,GAAG,wBAAwB,CAAC,OAAO,EAAE,CAAC;IACzD,0GAA0G;IAC1G,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,aAAa,CAAC,MAAM,GAAG,aAAa,EAAE,CAAC,EAAE,EAAE;QACzD,aAAa,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;KACvC;IACD,OAAO,aAAa,CAAC;AACvB,CAAC;AAED,MAAM,UAAU,iBAAiB,CAC/B,KAAiD;IAEjD,MAAM,KAAK,GAAG,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC;IAC9E,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;QACxB,MAAM,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,CAAC;QAC/B,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAClB;IACD,OAAO,KAAK,CAAC;AACf,CAAC;AASD,MAAM,CAAC,MAAM,YAAY,GAInB;IACJ,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAE,QAAQ,EAAE,iBAAiB,EAAE;IAC/E,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,sBAAsB,EAAE,QAAQ,EAAE,gBAAgB,EAAE;IAClF,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,sBAAsB,EAAE,QAAQ,EAAE,iBAAiB,EAAE;IACnF,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,mBAAmB,EAAE,QAAQ,EAAE,aAAa,EAAE;IACzE,EAAE,IAAI,EAAE,aAAa,EAAE,SAAS,EAAE,yBAAyB,EAAE,QAAQ,EAAE,oBAAoB,EAAE;CAC9F,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { IconProps } from '../icon/interfaces';\nimport { FlashbarProps } from './interfaces';\n\nexport const FOCUS_DEBOUNCE_DELAY = 500;\n\n// Since the position of a notification changes when the Flashbar is collapsed,\n// it is useful on some situations (e.g, for animating) to know the original position of the item\n// in the non-collapsed state.\nexport interface StackableItem extends FlashbarProps.MessageDefinition {\n expandedIndex: number;\n collapsedIndex?: number;\n}\n\nconst typesToColors: Record<FlashbarProps.Type, string> = {\n error: 'red',\n info: 'blue',\n 'in-progress': 'blue',\n success: 'green',\n warning: 'yellow',\n};\n\nfunction getColorFromType(type?: FlashbarProps.Type): string {\n const defaultColor = 'blue';\n return type ? typesToColors[type] \|\| defaultColor : defaultColor;\n}\n\nexport function getItemType(item: FlashbarProps.MessageDefinition) {\n if (item.loading) {\n return 'in-progress';\n } else {\n return item.type \|\| 'info';\n }\n}\n\nexport function getItemColor(item: FlashbarProps.MessageDefinition) {\n return getColorFromType(getItemType(item));\n}\n\n/\n Returns a selection of notifications, preserving the order when possible but making sure that all different colors in\n the stack are represented in the returned array.\n The order corresponds to how they are represented when using the collapsible feature (newest first, oldest last).\n /\nexport function getVisibleCollapsedItems(\n items: ReadonlyArray<FlashbarProps.MessageDefinition>,\n desiredLength: number\n): ReadonlyArray<StackableItem> {\n // First `desiredLength` items in the original array,\n // together with `isColorRepeated` to tell if they can be subject to be replaced later on if necessary\n const itemsOnTop: { item: StackableItem; isColorRepeated: boolean }[] = [];\n\n // Items that fall outside `desiredIndexLength` but need to be \"promoted\" if possible\n // because they are of a different color which otherwise wouldn't be represented\n const itemsToPromote: StackableItem[] = [];\n\n const addedColors: Set<string> = new Set();\n const allPossibleColors = Object.keys(typesToColors).length;\n const finalLength = Math.min(items.length, desiredLength);\n\n for (let i = 0; i < items.length; i++) {\n const item = items[i];\n const color = getItemColor(item);\n const isColorRepeated = addedColors.has(color);\n if (i < finalLength) {\n itemsOnTop.push({ item: { ...item, expandedIndex: i }, isColorRepeated });\n } else {\n if (addedColors.size === allPossibleColors) {\n // No need to keep looking for unrepresented colors, we can stop looping\n break;\n } else if (!isColorRepeated) {\n itemsToPromote.push({ ...item, expandedIndex: i });\n }\n }\n addedColors.add(color);\n }\n // Generate the new array with the selected items, by picking from both arrays.\n // First, from the non-repeated items within the desired length...\n // We loop `itemsOnTop` starting from the end because we prefer to preserve the first ones rather than the old ones\n const reversedInitialSelection = [];\n let slotsReservedForPromotions = 0;\n for (let j = itemsOnTop.length - 1; j >= 0; j--) {\n const item = itemsOnTop[j];\n if (item.isColorRepeated && slotsReservedForPromotions < itemsToPromote.length) {\n slotsReservedForPromotions += 1;\n } else {\n reversedInitialSelection.push(item.item);\n }\n }\n const selectedItems = reversedInitialSelection.reverse();\n // ...and then complete the selection with as many promotable items as we can fit in the rest of the array\n for (let k = 0; selectedItems.length < desiredLength; k++) {\n selectedItems.push(itemsToPromote[k]);\n }\n return selectedItems;\n}\n\nexport function getFlashTypeCount(\n items: readonly FlashbarProps.MessageDefinition[]\n): Record<FlashbarProps.Type, number> {\n const count = { error: 0, info: 0, 'in-progress': 0, success: 0, warning: 0 };\n for (const item of items) {\n const type = getItemType(item);\n count[type] += 1;\n }\n return count;\n}\n\ntype LabelName =\n \| 'errorIconAriaLabel'\n \| 'warningIconAriaLabel'\n \| 'successIconAriaLabel'\n \| 'infoIconAriaLabel'\n \| 'inProgressIconAriaLabel';\n\nexport const counterTypes: {\n type: FlashbarProps.Type;\n labelName: LabelName;\n iconName: IconProps.Name;\n}[] = [\n { type: 'error', labelName: 'errorIconAriaLabel', iconName: 'status-negative' },\n { type: 'warning', labelName: 'warningIconAriaLabel', iconName: 'status-warning' },\n { type: 'success', labelName: 'successIconAriaLabel', iconName: 'status-positive' },\n { type: 'info', labelName: 'infoIconAriaLabel', iconName: 'status-info' },\n { type: 'in-progress', labelName: 'inProgressIconAriaLabel', iconName: 'status-in-progress' },\n];\n"]}

package/lib/internal/template/internal/base-component/styles.scoped.css CHANGED Viewed

@@ -3892,5 +3892,5 @@
   }
 }
 :root {
-  --awsui-version-info-9dea6b56: true;
+  --awsui-version-info-41a377be: true;
 }

package/lib/internal/template/internal/environment.js CHANGED Viewed

@@ -1,6 +1,6 @@
 export var PACKAGE_SOURCE = "components";
-export var PACKAGE_VERSION = "3.0.0 (9dea6b56)";
-export var GIT_SHA = "9dea6b56";
+export var PACKAGE_VERSION = "3.0.0 (41a377be)";
+export var GIT_SHA = "41a377be";
 export var THEME = "open-source-visual-refresh";
 export var SYSTEM = "console";
 export var ALWAYS_VISUAL_REFRESH = true;

package/lib/internal/template/internal/environment.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "PACKAGE_SOURCE": "components",
-  "PACKAGE_VERSION": "3.0.0 (9dea6b56)",
-  "GIT_SHA": "9dea6b56",
+  "PACKAGE_VERSION": "3.0.0 (41a377be)",
+  "GIT_SHA": "41a377be",
   "THEME": "default",
   "SYSTEM": "core",
   "ALWAYS_VISUAL_REFRESH": false

package/lib/internal/template/split-panel/bottom.d.ts CHANGED Viewed

@@ -3,7 +3,8 @@ import { SplitPanelContentProps, SplitPanelProps } from './interfaces';
 interface SplitPanelContentBottomProps extends SplitPanelContentProps {
     appLayoutMaxWidth: React.CSSProperties | undefined;
     closeBehavior: SplitPanelProps['closeBehavior'];
+    hasCustomElements?: boolean;
 }
-export declare function SplitPanelContentBottom({ closeBehavior, baseProps, isOpen, splitPanelRef, cappedSize, header, resizeHandle, children, appLayoutMaxWidth, panelHeaderId, onToggle, }: SplitPanelContentBottomProps): JSX.Element;
+export declare function SplitPanelContentBottom({ closeBehavior, baseProps, isOpen, splitPanelRef, cappedSize, header, resizeHandle, children, appLayoutMaxWidth, panelHeaderId, ariaLabel, onToggle, hasCustomElements, }: SplitPanelContentBottomProps): JSX.Element;
 export {};
 //# sourceMappingURL=bottom.d.ts.map

package/lib/internal/template/split-panel/bottom.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"bottom.d.ts","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAUjD,OAAO,EAAE,sBAAsB,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAMvE,UAAU,4BAA6B,SAAQ,sBAAsB;IACnE,iBAAiB,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAAC;IACnD,aAAa,EAAE,eAAe,CAAC,eAAe,CAAC,CAAC;~~CACjD~~;AAED,wBAAgB,uBAAuB,CAAC,EACtC,aAAa,EACb,SAAS,EACT,MAAM,EACN,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,QAAQ,~~GACT~~,EAAE,4BAA4B,~~eA+E9B~~"}
1	+ {"version":3,"file":"bottom.d.ts","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAUjD,OAAO,EAAE,sBAAsB,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAMvE,UAAU,4BAA6B,SAAQ,sBAAsB;IACnE,iBAAiB,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAAC;IACnD,aAAa,EAAE,eAAe,CAAC,eAAe,CAAC,CAAC;IAChD,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,wBAAgB,uBAAuB,CAAC,EACtC,aAAa,EACb,SAAS,EACT,MAAM,EACN,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,SAAS,EACT,QAAQ,EACR,iBAAiB,GAClB,EAAE,4BAA4B,eAqF9B"}

package/lib/internal/template/split-panel/bottom.js CHANGED Viewed

@@ -11,7 +11,7 @@ import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
 import sharedStyles from '../app-layout/resize/styles.css.js';
 import styles from './styles.css.js';
 import testUtilStyles from './test-classes/styles.css.js';
-export function SplitPanelContentBottom({ closeBehavior, baseProps, isOpen, splitPanelRef, cappedSize, header, resizeHandle, children, appLayoutMaxWidth, panelHeaderId, onToggle, }) {
+export function SplitPanelContentBottom({ closeBehavior, baseProps, isOpen, splitPanelRef, cappedSize, header, resizeHandle, children, appLayoutMaxWidth, panelHeaderId, ariaLabel, onToggle, hasCustomElements, }) {
     const isRefresh = useVisualRefresh();
     const isToolbar = useAppLayoutToolbarDesignEnabled();
     const { bottomOffset, leftOffset, rightOffset, disableContentPaddings, contentWrapperPaddings, reportHeaderHeight, headerHeight: headerBlockSize, animationDisabled, } = useSplitPanelContext();
@@ -35,12 +35,13 @@ export function SplitPanelContentBottom({ closeBehavior, baseProps, isOpen, spli
             [sharedStyles['with-motion-vertical']]: !animationDisabled,
             [testUtilStyles['open-position-bottom']]: isOpen,
             [styles['drawer-closed']]: !isOpen,
+            [styles['drawer-clickable']]: !hasCustomElements,
             [styles['drawer-mobile']]: isMobile,
             [styles['drawer-disable-content-paddings']]: disableContentPaddings,
             [styles.refresh]: isRefresh,
             [styles['with-toolbar']]: isToolbar,
             [styles.hidden]: closeBehavior === 'hide' && !isOpen,
-        }), onClick: () => !isOpen && onToggle(), style: {
+        }), onClick: () => !isOpen && !hasCustomElements && onToggle(), style: {
             insetBlockEnd: bottomOffset,
             insetInlineStart: leftOffset,
             insetInlineEnd: rightOffset,
@@ -53,7 +54,7 @@ export function SplitPanelContentBottom({ closeBehavior, baseProps, isOpen, spli
                         : undefined,
         }, ref: splitPanelRef }), closeBehavior === 'hide' && !isOpen ? null : (React.createElement(React.Fragment, null,
         isOpen && React.createElement("div", { className: styles['slider-wrapper-bottom'] }, resizeHandle),
-        React.createElement("div", { className: styles['drawer-content-bottom'], "aria-labelledby": panelHeaderId, role: "region" },
+        React.createElement("div", { className: styles['drawer-content-bottom'], "aria-labelledby": panelHeaderId, "aria-label": ariaLabel, role: "region" },
             React.createElement("div", { className: clsx(styles['pane-header-wrapper-bottom'], centeredMaxWidthClasses), ref: headerRef }, header),
             React.createElement("div", { className: clsx(styles['content-bottom'], centeredMaxWidthClasses), "aria-hidden": !isOpen },
                 React.createElement("div", { className: clsx({ [styles['content-bottom-max-width']]: isRefresh }), style: appLayoutMaxWidth }, children)))))));

package/lib/internal/template/split-panel/bottom.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"bottom.js","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAElF,OAAO,EAAE,gCAAgC,EAAE,MAAM,mCAAmC,CAAC;AACrF,OAAO,EAAE,oBAAoB,EAAE,MAAM,yCAAyC,CAAC;AAC/E,OAAO,KAAK,MAAM,MAAM,qCAAqC,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAGrE,OAAO,YAAY,MAAM,oCAAoC,CAAC;AAC9D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,8BAA8B,CAAC;~~AAO1D~~,MAAM,UAAU,uBAAuB,CAAC,EACtC,aAAa,EACb,SAAS,EACT,MAAM,EACN,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,QAAQ,~~GACqB~~;IAC7B,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IACrC,MAAM,SAAS,GAAG,gCAAgC,EAAE,CAAC;IACrD,MAAM,EACJ,YAAY,EACZ,UAAU,EACV,WAAW,EACX,sBAAsB,EACtB,sBAAsB,EACtB,kBAAkB,EAClB,YAAY,EAAE,eAAe,EAC7B,iBAAiB,GAClB,GAAG,oBAAoB,EAAE,CAAC;IAC3B,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAE7B,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE/C,iBAAiB,CAAC,SAAS,EAAE,KAAK,CAAC,EAAE;QACnC,MAAM,iBAAiB,GAAG,aAAa,KAAK,MAAM,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,eAAe,CAAC;QAC1F,kBAAkB,CAAC,iBAAiB,CAAC,CAAC;IACxC,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,gDAAgD;QAChD,OAAO,GAAG,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC;QACnC,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,uBAAuB,GAAG,IAAI,CAAC;QACnC,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAAE,SAAS;QAC/C,CAAC,MAAM,CAAC,iCAAiC,CAAC,CAAC,EAAE,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,SAAS;QAC9E,CAAC,MAAM,CAAC,mCAAmC,CAAC,CAAC,EAAE,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,WAAW;KACnF,CAAC,CAAC;IAEH,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,iBAAiB,CAAC,EAAE,cAAc,CAAC,IAAI,EAAE;YAClG,CAAC,YAAY,CAAC,sBAAsB,CAAC,CAAC,EAAE,CAAC,iBAAiB;YAC1D,CAAC,cAAc,CAAC,sBAAsB,CAAC,CAAC,EAAE,MAAM;YAChD,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,MAAM;YAClC,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,QAAQ;YACnC,CAAC,MAAM,CAAC,iCAAiC,CAAC,CAAC,EAAE,sBAAsB;YACnE,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,SAAS;YAC3B,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,SAAS;YACnC,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,aAAa,KAAK,MAAM,IAAI,CAAC,MAAM;SACrD,CAAC,EACF,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,MAAM,IAAI,QAAQ,EAAE,~~EACpC~~,KAAK,EAAE;YACL,aAAa,EAAE,YAAY;YAC3B,gBAAgB,EAAE,UAAU;YAC5B,cAAc,EAAE,WAAW;YAC3B,SAAS,EAAE,MAAM;gBACf,CAAC,CAAC,UAAU;gBACZ,CAAC,CAAC,aAAa,KAAK,MAAM;oBACxB,CAAC,CAAC,CAAC;oBACH,CAAC,CAAC,SAAS,IAAI,eAAe,KAAK,SAAS;wBAC1C,CAAC,CAAC,QAAQ,eAAe,QAAQ,MAAM,CAAC,mBAAmB,GAAG;wBAC9D,CAAC,CAAC,SAAS;SAClB,EACD,GAAG,EAAE,aAAa,KAEjB,aAAa,KAAK,MAAM,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC5C;QACG,MAAM,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC,IAAG,YAAY,CAAO;QAChF,~~6BAAK~~,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC,~~qBAAmB~~,aAAa,~~EAAE~~,IAAI,EAAC,QAAQ;~~YAC5F~~,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,4BAA4B,CAAC,EAAE,uBAAuB,CAAC,EAAE,GAAG,EAAE,SAAS,IAChG,MAAM,CACH;YACN,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,EAAE,uBAAuB,CAAC,iBAAe,CAAC,MAAM;gBAC3F,6BAAK,SAAS,EAAE,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,iBAAiB,IAChG,QAAQ,CACL,CACF,CACF,CACL,CACJ,CACG,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useAppLayoutToolbarDesignEnabled } from '../app-layout/utils/feature-flags';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport * as tokens from '../internal/generated/styles/tokens';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { SplitPanelContentProps, SplitPanelProps } from './interfaces';\n\nimport sharedStyles from '../app-layout/resize/styles.css.js';\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\ninterface SplitPanelContentBottomProps extends SplitPanelContentProps {\n appLayoutMaxWidth: React.CSSProperties \| undefined;\n closeBehavior: SplitPanelProps['closeBehavior'];\n}\n\nexport function SplitPanelContentBottom({\n closeBehavior,\n baseProps,\n isOpen,\n splitPanelRef,\n cappedSize,\n header,\n resizeHandle,\n children,\n appLayoutMaxWidth,\n panelHeaderId,\n onToggle,\n}: SplitPanelContentBottomProps) {\n const isRefresh = useVisualRefresh();\n const isToolbar = useAppLayoutToolbarDesignEnabled();\n const {\n bottomOffset,\n leftOffset,\n rightOffset,\n disableContentPaddings,\n contentWrapperPaddings,\n reportHeaderHeight,\n headerHeight: headerBlockSize,\n animationDisabled,\n } = useSplitPanelContext();\n const isMobile = useMobile();\n\n const headerRef = useRef<HTMLDivElement>(null);\n\n useResizeObserver(headerRef, entry => {\n const visibleHeaderSize = closeBehavior === 'hide' && !isOpen ? 0 : entry.borderBoxHeight;\n reportHeaderHeight(visibleHeaderSize);\n });\n\n useEffect(() => {\n // report empty height when unmounting the panel\n return () => reportHeaderHeight(0);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const centeredMaxWidthClasses = clsx({\n [styles['pane-bottom-center-align']]: isRefresh,\n [styles['pane-bottom-content-nav-padding']]: contentWrapperPaddings?.closedNav,\n [styles['pane-bottom-content-tools-padding']]: contentWrapperPaddings?.closedTools,\n });\n\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.drawer, styles['position-bottom'], testUtilStyles.root, {\n [sharedStyles['with-motion-vertical']]: !animationDisabled,\n [testUtilStyles['open-position-bottom']]: isOpen,\n [styles['drawer-closed']]: !isOpen,\n [styles['drawer-mobile']]: isMobile,\n [styles['drawer-disable-content-paddings']]: disableContentPaddings,\n [styles.refresh]: isRefresh,\n [styles['with-toolbar']]: isToolbar,\n [styles.hidden]: closeBehavior === 'hide' && !isOpen,\n })}\n onClick={() => !isOpen && onToggle()}\n style={{\n insetBlockEnd: bottomOffset,\n insetInlineStart: leftOffset,\n insetInlineEnd: rightOffset,\n blockSize: isOpen\n ? cappedSize\n : closeBehavior === 'hide'\n ? 0\n : isToolbar && headerBlockSize !== undefined\n ? `calc(${headerBlockSize}px + ${tokens.borderPanelTopWidth})`\n : undefined,\n }}\n ref={splitPanelRef}\n >\n {closeBehavior === 'hide' && !isOpen ? null : (\n <>\n {isOpen && <div className={styles['slider-wrapper-bottom']}>{resizeHandle}</div>}\n <div className={styles['drawer-content-bottom']} aria-labelledby={panelHeaderId} role=\"region\">\n <div className={clsx(styles['pane-header-wrapper-bottom'], centeredMaxWidthClasses)} ref={headerRef}>\n {header}\n </div>\n <div className={clsx(styles['content-bottom'], centeredMaxWidthClasses)} aria-hidden={!isOpen}>\n <div className={clsx({ [styles['content-bottom-max-width']]: isRefresh })} style={appLayoutMaxWidth}>\n {children}\n </div>\n </div>\n </div>\n </>\n )}\n </div>\n );\n}\n"]}
1	+ {"version":3,"file":"bottom.js","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useAppLayoutToolbarDesignEnabled } from '../app-layout/utils/feature-flags';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport * as tokens from '../internal/generated/styles/tokens';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { SplitPanelContentProps, SplitPanelProps } from './interfaces';\n\nimport sharedStyles from '../app-layout/resize/styles.css.js';\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\ninterface SplitPanelContentBottomProps extends SplitPanelContentProps {\n appLayoutMaxWidth: React.CSSProperties \| undefined;\n closeBehavior: SplitPanelProps['closeBehavior'];\n hasCustomElements?: boolean;\n}\n\nexport function SplitPanelContentBottom({\n closeBehavior,\n baseProps,\n isOpen,\n splitPanelRef,\n cappedSize,\n header,\n resizeHandle,\n children,\n appLayoutMaxWidth,\n panelHeaderId,\n ariaLabel,\n onToggle,\n hasCustomElements,\n}: SplitPanelContentBottomProps) {\n const isRefresh = useVisualRefresh();\n const isToolbar = useAppLayoutToolbarDesignEnabled();\n const {\n bottomOffset,\n leftOffset,\n rightOffset,\n disableContentPaddings,\n contentWrapperPaddings,\n reportHeaderHeight,\n headerHeight: headerBlockSize,\n animationDisabled,\n } = useSplitPanelContext();\n const isMobile = useMobile();\n\n const headerRef = useRef<HTMLDivElement>(null);\n\n useResizeObserver(headerRef, entry => {\n const visibleHeaderSize = closeBehavior === 'hide' && !isOpen ? 0 : entry.borderBoxHeight;\n reportHeaderHeight(visibleHeaderSize);\n });\n\n useEffect(() => {\n // report empty height when unmounting the panel\n return () => reportHeaderHeight(0);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const centeredMaxWidthClasses = clsx({\n [styles['pane-bottom-center-align']]: isRefresh,\n [styles['pane-bottom-content-nav-padding']]: contentWrapperPaddings?.closedNav,\n [styles['pane-bottom-content-tools-padding']]: contentWrapperPaddings?.closedTools,\n });\n\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.drawer, styles['position-bottom'], testUtilStyles.root, {\n [sharedStyles['with-motion-vertical']]: !animationDisabled,\n [testUtilStyles['open-position-bottom']]: isOpen,\n [styles['drawer-closed']]: !isOpen,\n [styles['drawer-clickable']]: !hasCustomElements,\n [styles['drawer-mobile']]: isMobile,\n [styles['drawer-disable-content-paddings']]: disableContentPaddings,\n [styles.refresh]: isRefresh,\n [styles['with-toolbar']]: isToolbar,\n [styles.hidden]: closeBehavior === 'hide' && !isOpen,\n })}\n onClick={() => !isOpen && !hasCustomElements && onToggle()}\n style={{\n insetBlockEnd: bottomOffset,\n insetInlineStart: leftOffset,\n insetInlineEnd: rightOffset,\n blockSize: isOpen\n ? cappedSize\n : closeBehavior === 'hide'\n ? 0\n : isToolbar && headerBlockSize !== undefined\n ? `calc(${headerBlockSize}px + ${tokens.borderPanelTopWidth})`\n : undefined,\n }}\n ref={splitPanelRef}\n >\n {closeBehavior === 'hide' && !isOpen ? null : (\n <>\n {isOpen && <div className={styles['slider-wrapper-bottom']}>{resizeHandle}</div>}\n <div\n className={styles['drawer-content-bottom']}\n aria-labelledby={panelHeaderId}\n aria-label={ariaLabel}\n role=\"region\"\n >\n <div className={clsx(styles['pane-header-wrapper-bottom'], centeredMaxWidthClasses)} ref={headerRef}>\n {header}\n </div>\n <div className={clsx(styles['content-bottom'], centeredMaxWidthClasses)} aria-hidden={!isOpen}>\n <div className={clsx({ [styles['content-bottom-max-width']]: isRefresh })} style={appLayoutMaxWidth}>\n {children}\n </div>\n </div>\n </div>\n </>\n )}\n </div>\n );\n}\n"]}

package/lib/internal/template/split-panel/implementation.d.ts CHANGED Viewed

@@ -3,6 +3,6 @@ import { InternalBaseComponentProps } from '../internal/hooks/use-base-component
 import { SomeRequired } from '../internal/types';
 import { SplitPanelProps } from './interfaces';
 export type SplitPanelImplementationProps = SomeRequired<SplitPanelProps, 'hidePreferencesButton' | 'closeBehavior'> & InternalBaseComponentProps;
-export declare function SplitPanelImplementation({ __internalRootRef, header, children, hidePreferencesButton, closeBehavior, i18nStrings, ...restProps }: SplitPanelImplementationProps): JSX.Element;
+export declare function SplitPanelImplementation({ __internalRootRef, header, children, hidePreferencesButton, closeBehavior, i18nStrings, ariaLabel, headerActions, headerBefore, headerDescription, headerInfo, ...restProps }: SplitPanelImplementationProps): JSX.Element;
 export declare const createWidgetizedSplitPanel: (Loader?: typeof SplitPanelImplementation | undefined) => typeof SplitPanelImplementation;
 //# sourceMappingURL=implementation.d.ts.map

package/lib/internal/template/split-panel/implementation.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/split-panel/implementation.tsx"],"names":[],"mappings":";AAeA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAGjD,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAO/C,MAAM,MAAM,6BAA6B,GAAG,YAAY,CAAC,eAAe,EAAE,uBAAuB,GAAG,eAAe,CAAC,GAClH,0BAA0B,CAAC;AAE7B,wBAAgB,wBAAwB,CAAC,EACvC,iBAAiB,EACjB,MAAM,EACN,QAAQ,EACR,qBAAqB,EACrB,aAAa,EACb,WAAgB,EAChB,GAAG,SAAS,EACb,EAAE,6BAA6B,~~eAgO~~/B;AAED,eAAO,MAAM,0BAA0B,2FAAsD,CAAC"}
1	+ {"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/split-panel/implementation.tsx"],"names":[],"mappings":";AAeA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAGjD,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAO/C,MAAM,MAAM,6BAA6B,GAAG,YAAY,CAAC,eAAe,EAAE,uBAAuB,GAAG,eAAe,CAAC,GAClH,0BAA0B,CAAC;AAE7B,wBAAgB,wBAAwB,CAAC,EACvC,iBAAiB,EACjB,MAAM,EACN,QAAQ,EACR,qBAAqB,EACrB,aAAa,EACb,WAAgB,EAChB,SAAS,EACT,aAAa,EACb,YAAY,EACZ,iBAAiB,EACjB,UAAU,EACV,GAAG,SAAS,EACb,EAAE,6BAA6B,eA4Q/B;AAED,eAAO,MAAM,0BAA0B,2FAAsD,CAAC"}

package/lib/internal/template/split-panel/implementation.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { __rest } from "tslib";
 // SPDX-License-Identifier: Apache-2.0
 import React, { useEffect, useLayoutEffect, useRef, useState } from 'react';
 import clsx from 'clsx';
-import { useMergeRefs, useUniqueId } from '@cloudscape-design/component-toolkit/internal';
+import { useMergeRefs, useUniqueId, warnOnce } from '@cloudscape-design/component-toolkit/internal';
 import { useAppLayoutToolbarDesignEnabled } from '../app-layout/utils/feature-flags';
 import { useKeyboardEvents } from '../app-layout/utils/use-keyboard-events';
 import { usePointerEvents } from '../app-layout/utils/use-pointer-events';
@@ -20,9 +20,12 @@ import { SplitPanelContentSide } from './side';
 import styles from './styles.css.js';
 import testUtilStyles from './test-classes/styles.css.js';
 export function SplitPanelImplementation(_a) {
-    var { __internalRootRef, header, children, hidePreferencesButton, closeBehavior, i18nStrings = {} } = _a, restProps = __rest(_a, ["__internalRootRef", "header", "children", "hidePreferencesButton", "closeBehavior", "i18nStrings"]);
+    var { __internalRootRef, header, children, hidePreferencesButton, closeBehavior, i18nStrings = {}, ariaLabel, headerActions, headerBefore, headerDescription, headerInfo } = _a, restProps = __rest(_a, ["__internalRootRef", "header", "children", "hidePreferencesButton", "closeBehavior", "i18nStrings", "ariaLabel", "headerActions", "headerBefore", "headerDescription", "headerInfo"]);
     const isRefresh = useVisualRefresh();
     const isToolbar = useAppLayoutToolbarDesignEnabled();
+    if (!header && !headerBefore) {
+        warnOnce('SplitPanel', 'You must provide either `header` or `headerBefore`.');
+    }
     const { position, topOffset, bottomOffset, rightOffset, contentWidthStyles, isOpen, isForcedPosition, onPreferencesChange, onResize, onToggle, size, relativeSize, setSplitPanelToggle, refs, animationDisabled, } = useSplitPanelContext();
     const baseProps = getBaseProps(restProps);
     const [isPreferencesOpen, setPreferencesOpen] = useState(false);
@@ -47,14 +50,30 @@ export function SplitPanelImplementation(_a) {
         [globalVars.stickyVerticalTopOffset]: topOffset,
         [globalVars.stickyVerticalBottomOffset]: bottomOffset,
     };
-    const panelHeaderId = useUniqueId('split-panel-header');
+    const panelHeaderUniqueId = useUniqueId('split-panel-header');
+    const panelHeaderId = ariaLabel ? undefined : panelHeaderUniqueId;
+    const showActions = headerActions && isOpen;
+    const showDescription = headerDescription && isOpen;
+    const hasCustomElements = !!headerActions || !!headerBefore || !!headerInfo;
     const wrappedHeader = (React.createElement("div", { className: clsx(styles.header, isToolbar && styles['with-toolbar']), style: appLayoutMaxWidth },
-        React.createElement("h2", { className: clsx(styles['header-text'], testUtilStyles['header-text']), id: panelHeaderId }, header),
-        React.createElement("div", { className: styles['header-actions'] },
-            !hidePreferencesButton && isOpen && (React.createElement(React.Fragment, null,
-                React.createElement(InternalButton, { className: testUtilStyles['preferences-button'], iconName: "settings", variant: "icon", onClick: () => setPreferencesOpen(true), formAction: "none", ariaLabel: i18nStrings.preferencesTitle, ref: refs.preferences }),
-                React.createElement("span", { className: styles.divider }))),
-            isOpen ? (React.createElement(InternalButton, { className: testUtilStyles['close-button'], iconName: isRefresh && closeBehavior === 'collapse' ? (position === 'side' ? 'angle-right' : 'angle-down') : 'close', variant: "icon", onClick: onToggle, formAction: "none", ariaLabel: i18nStrings.closeButtonAriaLabel, ariaExpanded: isOpen })) : position === 'side' || closeBehavior === 'hide' ? null : (React.createElement(InternalButton, { className: testUtilStyles['open-button'], iconName: "angle-up", variant: "icon", formAction: "none", ariaLabel: i18nStrings.openButtonAriaLabel, ref: refs.toggle, ariaExpanded: isOpen })))));
+        React.createElement("div", { className: styles['header-main-row'] },
+            React.createElement("div", { className: styles['header-main-content'] },
+                React.createElement("div", { className: clsx(styles['header-tag-and-info'], showDescription && styles['with-description']) },
+                    React.createElement("h2", { className: clsx(styles['header-tag'], !!headerInfo && styles['with-info']), id: panelHeaderId },
+                        headerBefore && (React.createElement("div", { className: clsx(styles['header-before-slot'], testUtilStyles['header-before'], !!header && styles['with-header-text']) }, headerBefore)),
+                        !!header && React.createElement("div", { className: clsx(styles['header-text'], testUtilStyles['header-text']) }, header)),
+                    headerInfo && (React.createElement("span", { className: clsx(styles['header-info-slot'], testUtilStyles['header-info']) }, headerInfo))),
+                showActions && (React.createElement("div", { className: clsx(styles['header-actions-slot'], testUtilStyles['header-actions']) }, headerActions))),
+            React.createElement("div", { className: styles['header-buttons'] },
+                !hidePreferencesButton && isOpen && (React.createElement(React.Fragment, null,
+                    React.createElement(InternalButton, { className: testUtilStyles['preferences-button'], iconName: "settings", variant: "icon", onClick: () => setPreferencesOpen(true), formAction: "none", ariaLabel: i18nStrings.preferencesTitle, ref: refs.preferences }),
+                    React.createElement("span", { className: styles.divider }))),
+                isOpen ? (React.createElement(InternalButton, { className: testUtilStyles['close-button'], iconName: isRefresh && closeBehavior === 'collapse'
+                        ? position === 'side'
+                            ? 'angle-right'
+                            : 'angle-down'
+                        : 'close', variant: "icon", onClick: onToggle, formAction: "none", ariaLabel: i18nStrings.closeButtonAriaLabel, ariaExpanded: isOpen })) : position === 'side' || closeBehavior === 'hide' ? null : (React.createElement(InternalButton, { className: testUtilStyles['open-button'], iconName: "angle-up", variant: "icon", formAction: "none", ariaLabel: i18nStrings.openButtonAriaLabel, ref: refs.toggle, ariaExpanded: isOpen, onClick: hasCustomElements ? onToggle : undefined })))),
+        showDescription && (React.createElement("p", { className: clsx(styles['header-description'], testUtilStyles['header-description']) }, headerDescription))));
     const resizeHandle = (React.createElement(PanelResizeHandle, { ref: refs.slider, className: testUtilStyles.slider, tooltipText: i18nStrings.resizeHandleTooltipText, ariaLabel: i18nStrings.resizeHandleAriaLabel,
         // Allows us to use the logical left/right keys to move the slider left/right,
         // but match aria keyboard behavior of using left/right to decrease/increase
@@ -94,8 +113,8 @@ export function SplitPanelImplementation(_a) {
         return React.createElement(React.Fragment, null);
     }
     return (React.createElement(React.Fragment, null,
-        position === 'side' && (React.createElement(SplitPanelContentSide, { style: contentStyle, resizeHandle: resizeHandle, baseProps: baseProps, isOpen: isOpen, splitPanelRef: mergedRef, cappedSize: size, onToggle: onToggle, openButtonAriaLabel: openButtonAriaLabel, toggleRef: refs.toggle, header: wrappedHeader, panelHeaderId: panelHeaderId, closeBehavior: closeBehavior }, children)),
-        position === 'bottom' && (React.createElement(SplitPanelContentBottom, { style: contentStyle, resizeHandle: resizeHandle, baseProps: baseProps, isOpen: isOpen, splitPanelRef: mergedRef, cappedSize: size, onToggle: onToggle, header: wrappedHeader, panelHeaderId: panelHeaderId, appLayoutMaxWidth: appLayoutMaxWidth, closeBehavior: closeBehavior }, children)),
+        position === 'side' && (React.createElement(SplitPanelContentSide, { style: contentStyle, resizeHandle: resizeHandle, baseProps: baseProps, isOpen: isOpen, splitPanelRef: mergedRef, cappedSize: size, onToggle: onToggle, openButtonAriaLabel: openButtonAriaLabel, toggleRef: refs.toggle, header: wrappedHeader, panelHeaderId: panelHeaderId, ariaLabel: ariaLabel, closeBehavior: closeBehavior }, children)),
+        position === 'bottom' && (React.createElement(SplitPanelContentBottom, { style: contentStyle, resizeHandle: resizeHandle, baseProps: baseProps, isOpen: isOpen, splitPanelRef: mergedRef, cappedSize: size, onToggle: onToggle, header: wrappedHeader, panelHeaderId: panelHeaderId, appLayoutMaxWidth: appLayoutMaxWidth, ariaLabel: ariaLabel, closeBehavior: closeBehavior, hasCustomElements: hasCustomElements }, children)),
         isPreferencesOpen && (React.createElement(PreferencesModal, { visible: true, preferences: { position }, disabledSidePosition: position === 'bottom' && isForcedPosition, isRefresh: isRefresh, i18nStrings: {
                 header: i18nStrings.preferencesTitle,
                 confirm: i18nStrings.preferencesConfirm,

package/lib/internal/template/split-panel/implementation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/split-panel/implementation.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useAppLayoutToolbarDesignEnabled } from '../app-layout/utils/feature-flags';\nimport { SizeControlProps } from '../app-layout/utils/interfaces';\nimport { useKeyboardEvents } from '../app-layout/utils/use-keyboard-events';\nimport { usePointerEvents } from '../app-layout/utils/use-pointer-events';\nimport { InternalButton } from '../button/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport PanelResizeHandle from '../internal/components/panel-resize-handle';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport globalVars from '../internal/styles/global-vars';\nimport { SomeRequired } from '../internal/types';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport { SplitPanelContentBottom } from './bottom';\nimport { SplitPanelProps } from './interfaces';\nimport PreferencesModal from './preferences-modal';\nimport { SplitPanelContentSide } from './side';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nexport type SplitPanelImplementationProps = SomeRequired<SplitPanelProps, 'hidePreferencesButton' \| 'closeBehavior'> &\n InternalBaseComponentProps;\n\nexport function SplitPanelImplementation({\n __internalRootRef,\n header,\n children,\n hidePreferencesButton,\n closeBehavior,\n i18nStrings = {},\n ...restProps\n}: SplitPanelImplementationProps) {\n const isRefresh = useVisualRefresh();\n const isToolbar = useAppLayoutToolbarDesignEnabled();\n\n const {\n position,\n topOffset,\n bottomOffset,\n rightOffset,\n contentWidthStyles,\n isOpen,\n isForcedPosition,\n onPreferencesChange,\n onResize,\n onToggle,\n size,\n relativeSize,\n setSplitPanelToggle,\n refs,\n animationDisabled,\n } = useSplitPanelContext();\n const baseProps = getBaseProps(restProps);\n const [isPreferencesOpen, setPreferencesOpen] = useState<boolean>(false);\n\n const appLayoutMaxWidth = isRefresh && position === 'bottom' ? contentWidthStyles : undefined;\n\n const openButtonAriaLabel = i18nStrings.openButtonAriaLabel;\n useEffect(() => {\n setSplitPanelToggle({ displayed: closeBehavior === 'collapse', ariaLabel: openButtonAriaLabel });\n\n return () => {\n setSplitPanelToggle({ displayed: false, ariaLabel: undefined });\n };\n }, [setSplitPanelToggle, openButtonAriaLabel, closeBehavior]);\n\n const splitPanelRefObject = useRef<HTMLDivElement>(null);\n\n const sizeControlProps: SizeControlProps = {\n position,\n panelRef: splitPanelRefObject,\n handleRef: refs.slider,\n onResize,\n };\n const onSliderPointerDown = usePointerEvents(sizeControlProps);\n const { onKeyDown, onDirectionClick } = useKeyboardEvents(sizeControlProps);\n\n const contentStyle = {\n [globalVars.stickyVerticalTopOffset]: topOffset,\n [globalVars.stickyVerticalBottomOffset]: bottomOffset,\n };\n\n const panelHeaderId = useUniqueId('split-panel-header');\n\n const wrappedHeader = (\n <div className={clsx(styles.header, isToolbar && styles['with-toolbar'])} style={appLayoutMaxWidth}>\n <h2 className={clsx(styles['header-text'], testUtilStyles['header-text'])} id={panelHeaderId}>\n {header}\n </h2>\n <div className={styles['header-actions']}>\n {!hidePreferencesButton && isOpen && (\n <>\n <InternalButton\n className={testUtilStyles['preferences-button']}\n iconName=\"settings\"\n variant=\"icon\"\n onClick={() => setPreferencesOpen(true)}\n formAction=\"none\"\n ariaLabel={i18nStrings.preferencesTitle}\n ref={refs.preferences}\n />\n <span className={styles.divider} />\n </>\n )}\n\n {isOpen ? (\n <InternalButton\n className={testUtilStyles['close-button']}\n iconName={\n isRefresh && closeBehavior === 'collapse' ? (position === 'side' ? 'angle-right' : 'angle-down') : 'close'\n }\n variant=\"icon\"\n onClick={onToggle}\n formAction=\"none\"\n ariaLabel={i18nStrings.closeButtonAriaLabel}\n ariaExpanded={isOpen}\n />\n ) : position === 'side' \|\| closeBehavior === 'hide' ? null : (\n <InternalButton\n className={testUtilStyles['open-button']}\n iconName=\"angle-up\"\n variant=\"icon\"\n formAction=\"none\"\n ariaLabel={i18nStrings.openButtonAriaLabel}\n ref={refs.toggle}\n ariaExpanded={isOpen}\n />\n )}\n </div>\n </div>\n );\n\n const resizeHandle = (\n <PanelResizeHandle\n ref={refs.slider}\n className={testUtilStyles.slider}\n tooltipText={i18nStrings.resizeHandleTooltipText}\n ariaLabel={i18nStrings.resizeHandleAriaLabel}\n // Allows us to use the logical left/right keys to move the slider left/right,\n // but match aria keyboard behavior of using left/right to decrease/increase\n // the slider value.\n ariaValuenow={position === 'bottom' ? relativeSize : 100 - relativeSize}\n position={position}\n onKeyDown={onKeyDown}\n onPointerDown={onSliderPointerDown}\n onDirectionClick={onDirectionClick}\n />\n );\n\n /\n This effect forces the browser to recalculate the layout\n whenever the split panel might have moved.\n\n This is needed as a workaround for a bug in Safari, which does\n not automatically calculate the new position of the split panel\n _content_ when the split panel moves.\n /\n useLayoutEffect(() => {\n const root = splitPanelRefObject.current;\n\n if (root) {\n const property = 'transform';\n const temporaryValue = 'translateZ(0)';\n\n const valueBefore = root.style[property];\n root.style[property] = temporaryValue;\n\n // This line forces the browser to recalculate the layout\n void root.offsetHeight;\n\n root.style[property] = valueBefore;\n }\n }, [rightOffset, __internalRootRef]);\n\n const mergedRef = useMergeRefs(splitPanelRefObject, __internalRootRef);\n\n if (closeBehavior === 'hide' && !isOpen && (animationDisabled \|\| !isRefresh)) {\n return <></>;\n }\n\n /*\n The AppLayout factor moved the circular buttons out of the\n * SplitPanel and into the Tools component. This conditional\n * is still needed for the early return to prevent execution\n * of the following code.\n */\n if (isRefresh && !isToolbar && !isOpen && position === 'side') {\n return <></>;\n }\n\n return (\n <>\n {position === 'side' && (\n <SplitPanelContentSide\n style={contentStyle}\n resizeHandle={resizeHandle}\n baseProps={baseProps}\n isOpen={isOpen}\n splitPanelRef={mergedRef}\n cappedSize={size}\n onToggle={onToggle}\n openButtonAriaLabel={openButtonAriaLabel}\n toggleRef={refs.toggle}\n header={wrappedHeader}\n panelHeaderId={panelHeaderId}\n closeBehavior={closeBehavior}\n >\n {children}\n </SplitPanelContentSide>\n )}\n\n {position === 'bottom' && (\n <SplitPanelContentBottom\n style={contentStyle}\n resizeHandle={resizeHandle}\n baseProps={baseProps}\n isOpen={isOpen}\n splitPanelRef={mergedRef}\n cappedSize={size}\n onToggle={onToggle}\n header={wrappedHeader}\n panelHeaderId={panelHeaderId}\n appLayoutMaxWidth={appLayoutMaxWidth}\n closeBehavior={closeBehavior}\n >\n {children}\n </SplitPanelContentBottom>\n )}\n {isPreferencesOpen && (\n <PreferencesModal\n visible={true}\n preferences={{ position }}\n disabledSidePosition={position === 'bottom' && isForcedPosition}\n isRefresh={isRefresh}\n i18nStrings={{\n header: i18nStrings.preferencesTitle,\n confirm: i18nStrings.preferencesConfirm,\n cancel: i18nStrings.preferencesCancel,\n close: i18nStrings.preferencesCloseAriaLabel,\n positionLabel: i18nStrings.preferencesPositionLabel,\n positionDescription: i18nStrings.preferencesPositionDescription,\n positionBottom: i18nStrings.preferencesPositionBottom,\n positionSide: i18nStrings.preferencesPositionSide,\n }}\n onConfirm={preferences => {\n onPreferencesChange({ ...preferences });\n setPreferencesOpen(false);\n }}\n onDismiss={() => {\n setPreferencesOpen(false);\n }}\n />\n )}\n </>\n );\n}\n\nexport const createWidgetizedSplitPanel = createWidgetizedComponent(SplitPanelImplementation);\n"]}
1	+ {"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/split-panel/implementation.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs, useUniqueId, warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useAppLayoutToolbarDesignEnabled } from '../app-layout/utils/feature-flags';\nimport { SizeControlProps } from '../app-layout/utils/interfaces';\nimport { useKeyboardEvents } from '../app-layout/utils/use-keyboard-events';\nimport { usePointerEvents } from '../app-layout/utils/use-pointer-events';\nimport { InternalButton } from '../button/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport PanelResizeHandle from '../internal/components/panel-resize-handle';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport globalVars from '../internal/styles/global-vars';\nimport { SomeRequired } from '../internal/types';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport { SplitPanelContentBottom } from './bottom';\nimport { SplitPanelProps } from './interfaces';\nimport PreferencesModal from './preferences-modal';\nimport { SplitPanelContentSide } from './side';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nexport type SplitPanelImplementationProps = SomeRequired<SplitPanelProps, 'hidePreferencesButton' \| 'closeBehavior'> &\n InternalBaseComponentProps;\n\nexport function SplitPanelImplementation({\n __internalRootRef,\n header,\n children,\n hidePreferencesButton,\n closeBehavior,\n i18nStrings = {},\n ariaLabel,\n headerActions,\n headerBefore,\n headerDescription,\n headerInfo,\n ...restProps\n}: SplitPanelImplementationProps) {\n const isRefresh = useVisualRefresh();\n const isToolbar = useAppLayoutToolbarDesignEnabled();\n\n if (!header && !headerBefore) {\n warnOnce('SplitPanel', 'You must provide either `header` or `headerBefore`.');\n }\n\n const {\n position,\n topOffset,\n bottomOffset,\n rightOffset,\n contentWidthStyles,\n isOpen,\n isForcedPosition,\n onPreferencesChange,\n onResize,\n onToggle,\n size,\n relativeSize,\n setSplitPanelToggle,\n refs,\n animationDisabled,\n } = useSplitPanelContext();\n const baseProps = getBaseProps(restProps);\n const [isPreferencesOpen, setPreferencesOpen] = useState<boolean>(false);\n\n const appLayoutMaxWidth = isRefresh && position === 'bottom' ? contentWidthStyles : undefined;\n\n const openButtonAriaLabel = i18nStrings.openButtonAriaLabel;\n useEffect(() => {\n setSplitPanelToggle({ displayed: closeBehavior === 'collapse', ariaLabel: openButtonAriaLabel });\n\n return () => {\n setSplitPanelToggle({ displayed: false, ariaLabel: undefined });\n };\n }, [setSplitPanelToggle, openButtonAriaLabel, closeBehavior]);\n\n const splitPanelRefObject = useRef<HTMLDivElement>(null);\n\n const sizeControlProps: SizeControlProps = {\n position,\n panelRef: splitPanelRefObject,\n handleRef: refs.slider,\n onResize,\n };\n const onSliderPointerDown = usePointerEvents(sizeControlProps);\n const { onKeyDown, onDirectionClick } = useKeyboardEvents(sizeControlProps);\n\n const contentStyle = {\n [globalVars.stickyVerticalTopOffset]: topOffset,\n [globalVars.stickyVerticalBottomOffset]: bottomOffset,\n };\n\n const panelHeaderUniqueId = useUniqueId('split-panel-header');\n const panelHeaderId = ariaLabel ? undefined : panelHeaderUniqueId;\n\n const showActions = headerActions && isOpen;\n const showDescription = headerDescription && isOpen;\n const hasCustomElements = !!headerActions \|\| !!headerBefore \|\| !!headerInfo;\n\n const wrappedHeader = (\n <div className={clsx(styles.header, isToolbar && styles['with-toolbar'])} style={appLayoutMaxWidth}>\n <div className={styles['header-main-row']}>\n <div className={styles['header-main-content']}>\n <div className={clsx(styles['header-tag-and-info'], showDescription && styles['with-description'])}>\n <h2 className={clsx(styles['header-tag'], !!headerInfo && styles['with-info'])} id={panelHeaderId}>\n {headerBefore && (\n <div\n className={clsx(\n styles['header-before-slot'],\n testUtilStyles['header-before'],\n !!header && styles['with-header-text']\n )}\n >\n {headerBefore}\n </div>\n )}\n {!!header && <div className={clsx(styles['header-text'], testUtilStyles['header-text'])}>{header}</div>}\n </h2>\n {headerInfo && (\n <span className={clsx(styles['header-info-slot'], testUtilStyles['header-info'])}>{headerInfo}</span>\n )}\n </div>\n {showActions && (\n <div className={clsx(styles['header-actions-slot'], testUtilStyles['header-actions'])}>{headerActions}</div>\n )}\n </div>\n <div className={styles['header-buttons']}>\n {!hidePreferencesButton && isOpen && (\n <>\n <InternalButton\n className={testUtilStyles['preferences-button']}\n iconName=\"settings\"\n variant=\"icon\"\n onClick={() => setPreferencesOpen(true)}\n formAction=\"none\"\n ariaLabel={i18nStrings.preferencesTitle}\n ref={refs.preferences}\n />\n <span className={styles.divider} />\n </>\n )}\n\n {isOpen ? (\n <InternalButton\n className={testUtilStyles['close-button']}\n iconName={\n isRefresh && closeBehavior === 'collapse'\n ? position === 'side'\n ? 'angle-right'\n : 'angle-down'\n : 'close'\n }\n variant=\"icon\"\n onClick={onToggle}\n formAction=\"none\"\n ariaLabel={i18nStrings.closeButtonAriaLabel}\n ariaExpanded={isOpen}\n />\n ) : position === 'side' \|\| closeBehavior === 'hide' ? null : (\n <InternalButton\n className={testUtilStyles['open-button']}\n iconName=\"angle-up\"\n variant=\"icon\"\n formAction=\"none\"\n ariaLabel={i18nStrings.openButtonAriaLabel}\n ref={refs.toggle}\n ariaExpanded={isOpen}\n onClick={hasCustomElements ? onToggle : undefined}\n />\n )}\n </div>\n </div>\n\n {showDescription && (\n <p className={clsx(styles['header-description'], testUtilStyles['header-description'])}>{headerDescription}</p>\n )}\n </div>\n );\n\n const resizeHandle = (\n <PanelResizeHandle\n ref={refs.slider}\n className={testUtilStyles.slider}\n tooltipText={i18nStrings.resizeHandleTooltipText}\n ariaLabel={i18nStrings.resizeHandleAriaLabel}\n // Allows us to use the logical left/right keys to move the slider left/right,\n // but match aria keyboard behavior of using left/right to decrease/increase\n // the slider value.\n ariaValuenow={position === 'bottom' ? relativeSize : 100 - relativeSize}\n position={position}\n onKeyDown={onKeyDown}\n onPointerDown={onSliderPointerDown}\n onDirectionClick={onDirectionClick}\n />\n );\n\n /\n This effect forces the browser to recalculate the layout\n whenever the split panel might have moved.\n\n This is needed as a workaround for a bug in Safari, which does\n not automatically calculate the new position of the split panel\n _content_ when the split panel moves.\n /\n useLayoutEffect(() => {\n const root = splitPanelRefObject.current;\n\n if (root) {\n const property = 'transform';\n const temporaryValue = 'translateZ(0)';\n\n const valueBefore = root.style[property];\n root.style[property] = temporaryValue;\n\n // This line forces the browser to recalculate the layout\n void root.offsetHeight;\n\n root.style[property] = valueBefore;\n }\n }, [rightOffset, __internalRootRef]);\n\n const mergedRef = useMergeRefs(splitPanelRefObject, __internalRootRef);\n\n if (closeBehavior === 'hide' && !isOpen && (animationDisabled \|\| !isRefresh)) {\n return <></>;\n }\n\n /*\n The AppLayout factor moved the circular buttons out of the\n * SplitPanel and into the Tools component. This conditional\n * is still needed for the early return to prevent execution\n * of the following code.\n */\n if (isRefresh && !isToolbar && !isOpen && position === 'side') {\n return <></>;\n }\n\n return (\n <>\n {position === 'side' && (\n <SplitPanelContentSide\n style={contentStyle}\n resizeHandle={resizeHandle}\n baseProps={baseProps}\n isOpen={isOpen}\n splitPanelRef={mergedRef}\n cappedSize={size}\n onToggle={onToggle}\n openButtonAriaLabel={openButtonAriaLabel}\n toggleRef={refs.toggle}\n header={wrappedHeader}\n panelHeaderId={panelHeaderId}\n ariaLabel={ariaLabel}\n closeBehavior={closeBehavior}\n >\n {children}\n </SplitPanelContentSide>\n )}\n\n {position === 'bottom' && (\n <SplitPanelContentBottom\n style={contentStyle}\n resizeHandle={resizeHandle}\n baseProps={baseProps}\n isOpen={isOpen}\n splitPanelRef={mergedRef}\n cappedSize={size}\n onToggle={onToggle}\n header={wrappedHeader}\n panelHeaderId={panelHeaderId}\n appLayoutMaxWidth={appLayoutMaxWidth}\n ariaLabel={ariaLabel}\n closeBehavior={closeBehavior}\n hasCustomElements={hasCustomElements}\n >\n {children}\n </SplitPanelContentBottom>\n )}\n {isPreferencesOpen && (\n <PreferencesModal\n visible={true}\n preferences={{ position }}\n disabledSidePosition={position === 'bottom' && isForcedPosition}\n isRefresh={isRefresh}\n i18nStrings={{\n header: i18nStrings.preferencesTitle,\n confirm: i18nStrings.preferencesConfirm,\n cancel: i18nStrings.preferencesCancel,\n close: i18nStrings.preferencesCloseAriaLabel,\n positionLabel: i18nStrings.preferencesPositionLabel,\n positionDescription: i18nStrings.preferencesPositionDescription,\n positionBottom: i18nStrings.preferencesPositionBottom,\n positionSide: i18nStrings.preferencesPositionSide,\n }}\n onConfirm={preferences => {\n onPreferencesChange({ ...preferences });\n setPreferencesOpen(false);\n }}\n onDismiss={() => {\n setPreferencesOpen(false);\n }}\n />\n )}\n </>\n );\n}\n\nexport const createWidgetizedSplitPanel = createWidgetizedComponent(SplitPanelImplementation);\n"]}

package/lib/internal/template/split-panel/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/split-panel/index.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAG/C,OAAO,EAAE,eAAe,EAAE,CAAC;AAE3B,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,qBAA6B,EAC7B,aAA0B,EAC1B,WAAgB,EAChB,GAAG,SAAS,EACb,EAAE,eAAe,~~eAqCjB~~"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/split-panel/index.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAG/C,OAAO,EAAE,eAAe,EAAE,CAAC;AAE3B,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,qBAA6B,EAC7B,aAA0B,EAC1B,WAAgB,EAChB,GAAG,SAAS,EACb,EAAE,eAAe,eA2CjB"}

package/lib/internal/template/split-panel/index.js CHANGED Viewed

@@ -11,6 +11,12 @@ export default function SplitPanel(_a) {
     var { hidePreferencesButton = false, closeBehavior = 'collapse', i18nStrings = {} } = _a, restProps = __rest(_a, ["hidePreferencesButton", "closeBehavior", "i18nStrings"]);
     const { __internalRootRef } = useBaseComponent('SplitPanel', {
         props: { closeBehavior, hidePreferencesButton },
+        metadata: {
+            hasHeaderActions: Boolean(restProps.headerActions),
+            hasHeaderDescription: Boolean(restProps.headerDescription),
+            hasHeaderInfo: Boolean(restProps.headerInfo),
+            hasHeaderBefore: Boolean(restProps.headerBefore),
+        },
     });
     const i18n = useInternalI18n('split-panel');
     const i18nModal = useInternalI18n('modal');

package/lib/internal/template/split-panel/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/split-panel/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,YAAY,CAAC;;AACb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAIhD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAKjB;QALiB,EACjC,qBAAqB,GAAG,KAAK,EAC7B,aAAa,GAAG,UAAU,EAC1B,WAAW,GAAG,EAAE,OAEA,EADb,SAAS,cAJqB,yDAKlC,CADa;IAEZ,MAAM,EAAE,iBAAiB,EAAE,GAAG,gBAAgB,CAAC,YAAY,EAAE;QAC3D,KAAK,EAAE,EAAE,aAAa,EAAE,qBAAqB,EAAE;~~KAChD~~,CAAC,CAAC;IACH,MAAM,IAAI,GAAG,eAAe,CAAC,aAAa,CAAC,CAAC;IAC5C,MAAM,SAAS,GAAG,eAAe,CAAC,OAAO,CAAC,CAAC;IAE3C,OAAO,CACL,oBAAC,kBAAkB,oBACb,SAAS,IACb,iBAAiB,EAAE,iBAAiB,EACpC,qBAAqB,EAAE,qBAAqB,EAC5C,aAAa,EAAE,aAAa,EAC5B,WAAW,kCACN,WAAW,KACd,oBAAoB,EAAE,IAAI,CAAC,kCAAkC,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,oBAAoB,CAAC,EACjG,mBAAmB,EAAE,IAAI,CAAC,iCAAiC,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,mBAAmB,CAAC,EAC9F,qBAAqB,EAAE,IAAI,CAAC,mCAAmC,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,qBAAqB,CAAC,EACpG,uBAAuB,EAAE,IAAI,CAAC,qCAAqC,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,uBAAuB,CAAC,EAC1G,gBAAgB,EAAE,IAAI,CAAC,8BAA8B,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,gBAAgB,CAAC,EACrF,kBAAkB,EAAE,IAAI,CAAC,gCAAgC,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,kBAAkB,CAAC,EAC3F,iBAAiB,EAAE,IAAI,CAAC,+BAA+B,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,iBAAiB,CAAC,EACxF,yBAAyB,EACvB,SAAS,CAAC,gBAAgB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,yBAAyB,CAAC,KAAI,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,iBAAiB,CAAA,EACvG,wBAAwB,EAAE,IAAI,CAAC,sCAAsC,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,wBAAwB,CAAC,EAC7G,8BAA8B,EAAE,IAAI,CAClC,4CAA4C,EAC5C,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,8BAA8B,CAC5C,EACD,yBAAyB,EAAE,IAAI,CAC7B,uCAAuC,EACvC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,yBAAyB,CACvC,EACD,uBAAuB,EAAE,IAAI,CAAC,qCAAqC,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,uBAAuB,CAAC,OAE5G,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,UAAU,EAAE,YAAY,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React from 'react';\n\nimport { useInternalI18n } from '../i18n/context';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { SplitPanelProps } from './interfaces';\nimport { SplitPanelInternal } from './internal';\n\nexport { SplitPanelProps };\n\nexport default function SplitPanel({\n hidePreferencesButton = false,\n closeBehavior = 'collapse',\n i18nStrings = {},\n ...restProps\n}: SplitPanelProps) {\n const { __internalRootRef } = useBaseComponent('SplitPanel', {\n props: { closeBehavior, hidePreferencesButton },\n });\n const i18n = useInternalI18n('split-panel');\n const i18nModal = useInternalI18n('modal');\n\n return (\n <SplitPanelInternal\n {...restProps}\n __internalRootRef={__internalRootRef}\n hidePreferencesButton={hidePreferencesButton}\n closeBehavior={closeBehavior}\n i18nStrings={{\n ...i18nStrings,\n closeButtonAriaLabel: i18n('i18nStrings.closeButtonAriaLabel', i18nStrings?.closeButtonAriaLabel),\n openButtonAriaLabel: i18n('i18nStrings.openButtonAriaLabel', i18nStrings?.openButtonAriaLabel),\n resizeHandleAriaLabel: i18n('i18nStrings.resizeHandleAriaLabel', i18nStrings?.resizeHandleAriaLabel),\n resizeHandleTooltipText: i18n('i18nStrings.resizeHandleTooltipText', i18nStrings?.resizeHandleTooltipText),\n preferencesTitle: i18n('i18nStrings.preferencesTitle', i18nStrings?.preferencesTitle),\n preferencesConfirm: i18n('i18nStrings.preferencesConfirm', i18nStrings?.preferencesConfirm),\n preferencesCancel: i18n('i18nStrings.preferencesCancel', i18nStrings?.preferencesCancel),\n preferencesCloseAriaLabel:\n i18nModal('closeAriaLabel', i18nStrings?.preferencesCloseAriaLabel) \|\| i18nStrings?.preferencesCancel,\n preferencesPositionLabel: i18n('i18nStrings.preferencesPositionLabel', i18nStrings?.preferencesPositionLabel),\n preferencesPositionDescription: i18n(\n 'i18nStrings.preferencesPositionDescription',\n i18nStrings?.preferencesPositionDescription\n ),\n preferencesPositionBottom: i18n(\n 'i18nStrings.preferencesPositionBottom',\n i18nStrings?.preferencesPositionBottom\n ),\n preferencesPositionSide: i18n('i18nStrings.preferencesPositionSide', i18nStrings?.preferencesPositionSide),\n }}\n />\n );\n}\n\napplyDisplayName(SplitPanel, 'SplitPanel');\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/split-panel/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React from 'react';\n\nimport { useInternalI18n } from '../i18n/context';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { SplitPanelProps } from './interfaces';\nimport { SplitPanelInternal } from './internal';\n\nexport { SplitPanelProps };\n\nexport default function SplitPanel({\n hidePreferencesButton = false,\n closeBehavior = 'collapse',\n i18nStrings = {},\n ...restProps\n}: SplitPanelProps) {\n const { __internalRootRef } = useBaseComponent('SplitPanel', {\n props: { closeBehavior, hidePreferencesButton },\n metadata: {\n hasHeaderActions: Boolean(restProps.headerActions),\n hasHeaderDescription: Boolean(restProps.headerDescription),\n hasHeaderInfo: Boolean(restProps.headerInfo),\n hasHeaderBefore: Boolean(restProps.headerBefore),\n },\n });\n const i18n = useInternalI18n('split-panel');\n const i18nModal = useInternalI18n('modal');\n\n return (\n <SplitPanelInternal\n {...restProps}\n __internalRootRef={__internalRootRef}\n hidePreferencesButton={hidePreferencesButton}\n closeBehavior={closeBehavior}\n i18nStrings={{\n ...i18nStrings,\n closeButtonAriaLabel: i18n('i18nStrings.closeButtonAriaLabel', i18nStrings?.closeButtonAriaLabel),\n openButtonAriaLabel: i18n('i18nStrings.openButtonAriaLabel', i18nStrings?.openButtonAriaLabel),\n resizeHandleAriaLabel: i18n('i18nStrings.resizeHandleAriaLabel', i18nStrings?.resizeHandleAriaLabel),\n resizeHandleTooltipText: i18n('i18nStrings.resizeHandleTooltipText', i18nStrings?.resizeHandleTooltipText),\n preferencesTitle: i18n('i18nStrings.preferencesTitle', i18nStrings?.preferencesTitle),\n preferencesConfirm: i18n('i18nStrings.preferencesConfirm', i18nStrings?.preferencesConfirm),\n preferencesCancel: i18n('i18nStrings.preferencesCancel', i18nStrings?.preferencesCancel),\n preferencesCloseAriaLabel:\n i18nModal('closeAriaLabel', i18nStrings?.preferencesCloseAriaLabel) \|\| i18nStrings?.preferencesCancel,\n preferencesPositionLabel: i18n('i18nStrings.preferencesPositionLabel', i18nStrings?.preferencesPositionLabel),\n preferencesPositionDescription: i18n(\n 'i18nStrings.preferencesPositionDescription',\n i18nStrings?.preferencesPositionDescription\n ),\n preferencesPositionBottom: i18n(\n 'i18nStrings.preferencesPositionBottom',\n i18nStrings?.preferencesPositionBottom\n ),\n preferencesPositionSide: i18n('i18nStrings.preferencesPositionSide', i18nStrings?.preferencesPositionSide),\n }}\n />\n );\n}\n\napplyDisplayName(SplitPanel, 'SplitPanel');\n"]}

package/lib/internal/template/split-panel/interfaces.d.ts CHANGED Viewed

@@ -2,9 +2,9 @@ import React from 'react';
 import { BaseComponentProps } from '../internal/base-component';
 export interface SplitPanelProps extends BaseComponentProps {
     /**
-     * Header of the split panel.
+     * Header text of the split panel.
      */
-    header: string;
+    header?: string;
     children: React.ReactNode;
     /**
      * Determines whether the split panel collapses or hides completely when closed.
@@ -29,6 +29,26 @@ export interface SplitPanelProps extends BaseComponentProps {
      * @i18n
      */
     i18nStrings?: SplitPanelProps.I18nStrings;
+    /**
+     * ARIA label for the panel. Use this if the value passed in the `header` property is not descriptive as a label for the panel.
+     */
+    ariaLabel?: string;
+    /**
+     * Actions for the header.
+     */
+    headerActions?: React.ReactNode;
+    /**
+     * Supplementary text below the heading.
+     */
+    headerDescription?: React.ReactNode;
+    /**
+     * The area next to the heading, used to display an Info link.
+     */
+    headerInfo?: React.ReactNode;
+    /**
+     * Content displayed before the header text.
+     */
+    headerBefore?: React.ReactNode;
 }
 export declare namespace SplitPanelProps {
     interface I18nStrings {
@@ -52,7 +72,8 @@ export interface SplitPanelContentProps {
     isOpen?: boolean;
     splitPanelRef?: React.Ref<any>;
     cappedSize: number;
-    panelHeaderId: string;
+    panelHeaderId?: string;
+    ariaLabel?: string;
     resizeHandle: React.ReactNode;
     header: React.ReactNode;
     children: React.ReactNode;

package/lib/internal/template/split-panel/interfaces.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/split-panel/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,MAAM,WAAW,eAAgB,SAAQ,kBAAkB;IACzD;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;~~IACf~~,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,aAAa,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;IACpC;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;;;;;;;;;OAaG;IACH,WAAW,CAAC,EAAE,eAAe,CAAC,WAAW,CAAC;~~CAC3C~~;AAED,yBAAiB,eAAe,CAAC;IAC/B,UAAiB,WAAW;QAC1B,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC;QAC1B,wBAAwB,CAAC,EAAE,MAAM,CAAC;QAClC,8BAA8B,CAAC,EAAE,MAAM,CAAC;QACxC,uBAAuB,CAAC,EAAE,MAAM,CAAC;QACjC,yBAAyB,CAAC,EAAE,MAAM,CAAC;QACnC,kBAAkB,CAAC,EAAE,MAAM,CAAC;QAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;QAC3B,yBAAyB,CAAC,EAAE,MAAM,CAAC;QACnC,qBAAqB,CAAC,EAAE,MAAM,CAAC;QAC/B,uBAAuB,CAAC,EAAE,MAAM,CAAC;KAClC;CACF;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC;IAC3B,SAAS,EAAE,kBAAkB,CAAC;IAC9B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;~~IACtB~~,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB"}
1	+ {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/split-panel/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,MAAM,WAAW,eAAgB,SAAQ,kBAAkB;IACzD;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,aAAa,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;IACpC;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;;;;;;;;;OAaG;IACH,WAAW,CAAC,EAAE,eAAe,CAAC,WAAW,CAAC;IAE1C;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEhC;;OAEG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEpC;;OAEG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE7B;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAChC;AAED,yBAAiB,eAAe,CAAC;IAC/B,UAAiB,WAAW;QAC1B,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC;QAC1B,wBAAwB,CAAC,EAAE,MAAM,CAAC;QAClC,8BAA8B,CAAC,EAAE,MAAM,CAAC;QACxC,uBAAuB,CAAC,EAAE,MAAM,CAAC;QACjC,yBAAyB,CAAC,EAAE,MAAM,CAAC;QACnC,kBAAkB,CAAC,EAAE,MAAM,CAAC;QAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;QAC3B,yBAAyB,CAAC,EAAE,MAAM,CAAC;QACnC,qBAAqB,CAAC,EAAE,MAAM,CAAC;QAC/B,uBAAuB,CAAC,EAAE,MAAM,CAAC;KAClC;CACF;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC;IAC3B,SAAS,EAAE,kBAAkB,CAAC;IAC9B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB"}