@cloudscape-design/components-themeable 3.0.878 → 3.0.879
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/internal/manifest.json +1 -1
- package/lib/internal/scss/collection-preferences/content-display/content-display-option.scss +4 -0
- package/lib/internal/scss/internal/components/drag-handle/styles.scss +51 -18
- package/lib/internal/scss/internal/components/panel-resize-handle/styles.scss +3 -42
- package/lib/internal/scss/tabs/tab-header-bar.scss +1 -0
- package/lib/internal/template/app-layout/drawer/resizable-drawer.d.ts.map +1 -1
- package/lib/internal/template/app-layout/drawer/resizable-drawer.js +3 -2
- package/lib/internal/template/app-layout/drawer/resizable-drawer.js.map +1 -1
- package/lib/internal/template/app-layout/utils/use-focus-control.d.ts +2 -1
- package/lib/internal/template/app-layout/utils/use-focus-control.d.ts.map +1 -1
- package/lib/internal/template/app-layout/utils/use-focus-control.js +2 -0
- package/lib/internal/template/app-layout/utils/use-focus-control.js.map +1 -1
- package/lib/internal/template/app-layout/utils/use-resize.d.ts.map +1 -1
- package/lib/internal/template/app-layout/utils/use-resize.js +3 -2
- package/lib/internal/template/app-layout/utils/use-resize.js.map +1 -1
- package/lib/internal/template/app-layout/utils/use-split-panel-focus-control.d.ts +2 -1
- package/lib/internal/template/app-layout/utils/use-split-panel-focus-control.d.ts.map +1 -1
- package/lib/internal/template/app-layout/utils/use-split-panel-focus-control.js +1 -0
- package/lib/internal/template/app-layout/utils/use-split-panel-focus-control.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-drawer.d.ts.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-drawer.js +3 -2
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-drawer.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/local-drawer.d.ts.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/local-drawer.js +3 -2
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/local-drawer.js.map +1 -1
- package/lib/internal/template/attribute-editor/interfaces.d.ts +7 -0
- package/lib/internal/template/attribute-editor/interfaces.d.ts.map +1 -1
- package/lib/internal/template/attribute-editor/interfaces.js.map +1 -1
- package/lib/internal/template/attribute-editor/internal.d.ts.map +1 -1
- package/lib/internal/template/attribute-editor/internal.js +2 -2
- package/lib/internal/template/attribute-editor/internal.js.map +1 -1
- package/lib/internal/template/collection-preferences/content-display/content-display-option.d.ts.map +1 -1
- package/lib/internal/template/collection-preferences/content-display/content-display-option.js +2 -1
- package/lib/internal/template/collection-preferences/content-display/content-display-option.js.map +1 -1
- package/lib/internal/template/collection-preferences/content-display/styles.css.js +11 -10
- package/lib/internal/template/collection-preferences/content-display/styles.scoped.css +14 -10
- package/lib/internal/template/collection-preferences/content-display/styles.selectors.js +11 -10
- package/lib/internal/template/collection-preferences/index.d.ts.map +1 -1
- package/lib/internal/template/collection-preferences/index.js +1 -1
- package/lib/internal/template/collection-preferences/index.js.map +1 -1
- package/lib/internal/template/collection-preferences/styles.css.js +38 -37
- package/lib/internal/template/collection-preferences/styles.scoped.css +42 -38
- package/lib/internal/template/collection-preferences/styles.selectors.js +38 -37
- package/lib/internal/template/internal/components/drag-handle/index.d.ts +4 -8
- package/lib/internal/template/internal/components/drag-handle/index.d.ts.map +1 -1
- package/lib/internal/template/internal/components/drag-handle/index.js +23 -5
- package/lib/internal/template/internal/components/drag-handle/index.js.map +1 -1
- package/lib/internal/template/internal/components/drag-handle/interfaces.d.ts +25 -0
- package/lib/internal/template/internal/components/drag-handle/interfaces.d.ts.map +1 -0
- package/lib/internal/template/internal/components/drag-handle/interfaces.js +4 -0
- package/lib/internal/template/internal/components/drag-handle/interfaces.js.map +1 -0
- package/lib/internal/template/internal/components/drag-handle/resize-icon.d.ts +7 -0
- package/lib/internal/template/internal/components/drag-handle/resize-icon.d.ts.map +1 -0
- package/lib/internal/template/internal/components/{panel-resize-handle/icon.js → drag-handle/resize-icon.js} +5 -3
- package/lib/internal/template/internal/components/drag-handle/resize-icon.js.map +1 -0
- package/lib/internal/template/internal/components/drag-handle/styles.css.js +12 -3
- package/lib/internal/template/internal/components/drag-handle/styles.scoped.css +50 -20
- package/lib/internal/template/internal/components/drag-handle/styles.selectors.js +12 -3
- package/lib/internal/template/internal/components/options-list/index.js +1 -1
- package/lib/internal/template/internal/components/options-list/index.js.map +1 -1
- package/lib/internal/template/internal/components/panel-resize-handle/index.d.ts +4 -2
- package/lib/internal/template/internal/components/panel-resize-handle/index.d.ts.map +1 -1
- package/lib/internal/template/internal/components/panel-resize-handle/index.js +8 -5
- package/lib/internal/template/internal/components/panel-resize-handle/index.js.map +1 -1
- package/lib/internal/template/internal/components/panel-resize-handle/styles.css.js +2 -5
- package/lib/internal/template/internal/components/panel-resize-handle/styles.scoped.css +3 -191
- package/lib/internal/template/internal/components/panel-resize-handle/styles.selectors.js +2 -5
- package/lib/internal/template/internal/components/portal/index.d.ts.map +1 -1
- package/lib/internal/template/internal/components/portal/index.js.map +1 -1
- package/lib/internal/template/internal/environment.js +1 -1
- package/lib/internal/template/internal/environment.json +1 -1
- package/lib/internal/template/internal/events/index.d.ts +1 -1
- package/lib/internal/template/internal/events/index.d.ts.map +1 -1
- package/lib/internal/template/internal/events/index.js.map +1 -1
- package/lib/internal/template/popover/internal.js +5 -4
- package/lib/internal/template/popover/internal.js.map +1 -1
- package/lib/internal/template/prompt-input/internal.d.ts.map +1 -1
- package/lib/internal/template/prompt-input/internal.js +1 -3
- package/lib/internal/template/prompt-input/internal.js.map +1 -1
- package/lib/internal/template/split-panel/implementation.d.ts.map +1 -1
- package/lib/internal/template/split-panel/implementation.js +7 -6
- package/lib/internal/template/split-panel/implementation.js.map +1 -1
- package/lib/internal/template/tabs/styles.css.js +28 -28
- package/lib/internal/template/tabs/styles.scoped.css +50 -49
- package/lib/internal/template/tabs/styles.selectors.js +28 -28
- package/package.json +1 -1
- package/lib/internal/template/internal/components/panel-resize-handle/icon.d.ts +0 -5
- package/lib/internal/template/internal/components/panel-resize-handle/icon.d.ts.map +0 -1
- package/lib/internal/template/internal/components/panel-resize-handle/icon.js.map +0 -1
|
@@ -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 { useAppLayoutToolbarEnabled } 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 { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\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 = useAppLayoutToolbarEnabled();\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 } = 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 = 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' ? 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 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 />\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) {\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 >\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 >\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 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 { useAppLayoutToolbarEnabled } 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 { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\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 = useAppLayoutToolbarEnabled();\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 } = 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.handle,\n onResize,\n };\n const onSliderPointerDown = usePointerEvents(sizeControlProps);\n const onKeyDown = 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' ? 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 <div ref={refs.handle}>\n <PanelResizeHandle\n ref={refs.slider}\n className={testUtilStyles.slider}\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 />\n </div>\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) {\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 >\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 >\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 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,33 +1,33 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"tabs-header": "awsui_tabs-
|
|
5
|
-
"tabs-header-list": "awsui_tabs-header-
|
|
6
|
-
"pagination-button": "awsui_pagination-
|
|
7
|
-
"pagination-button-left": "awsui_pagination-button-
|
|
8
|
-
"pagination-button-left-scrollable": "awsui_pagination-button-left-
|
|
9
|
-
"pagination-button-right": "awsui_pagination-button-
|
|
10
|
-
"pagination-button-right-scrollable": "awsui_pagination-button-right-
|
|
11
|
-
"tabs-tab": "awsui_tabs-
|
|
12
|
-
"tabs-tab-label": "awsui_tabs-tab-
|
|
13
|
-
"tabs-tab-header-container": "awsui_tabs-tab-header-
|
|
14
|
-
"tabs-tab-dismiss": "awsui_tabs-tab-
|
|
15
|
-
"tabs-tab-action": "awsui_tabs-tab-
|
|
16
|
-
"refresh": "
|
|
17
|
-
"tabs-tab-disabled": "awsui_tabs-tab-
|
|
18
|
-
"tabs-tab-link": "awsui_tabs-tab-
|
|
19
|
-
"tabs-tab-active": "awsui_tabs-tab-
|
|
20
|
-
"tabs-header-with-divider": "awsui_tabs-header-with-
|
|
21
|
-
"tabs-tab-focusable": "awsui_tabs-tab-
|
|
22
|
-
"root": "
|
|
23
|
-
"tabs": "
|
|
24
|
-
"tabs-content": "awsui_tabs-
|
|
25
|
-
"fit-height": "awsui_fit-
|
|
26
|
-
"tabs-content-active": "awsui_tabs-content-
|
|
27
|
-
"tabs-content-wrapper": "awsui_tabs-content-
|
|
28
|
-
"with-paddings": "awsui_with-
|
|
29
|
-
"tabs-container-content-wrapper": "awsui_tabs-container-content-
|
|
30
|
-
"disabled-reason-tooltip": "awsui_disabled-reason-
|
|
31
|
-
"tabs-tab-focused": "awsui_tabs-tab-
|
|
4
|
+
"tabs-header": "awsui_tabs-header_14rmt_11r1x_290",
|
|
5
|
+
"tabs-header-list": "awsui_tabs-header-list_14rmt_11r1x_298",
|
|
6
|
+
"pagination-button": "awsui_pagination-button_14rmt_11r1x_316",
|
|
7
|
+
"pagination-button-left": "awsui_pagination-button-left_14rmt_11r1x_323",
|
|
8
|
+
"pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_11r1x_326",
|
|
9
|
+
"pagination-button-right": "awsui_pagination-button-right_14rmt_11r1x_330",
|
|
10
|
+
"pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_11r1x_333",
|
|
11
|
+
"tabs-tab": "awsui_tabs-tab_14rmt_11r1x_338",
|
|
12
|
+
"tabs-tab-label": "awsui_tabs-tab-label_14rmt_11r1x_348",
|
|
13
|
+
"tabs-tab-header-container": "awsui_tabs-tab-header-container_14rmt_11r1x_359",
|
|
14
|
+
"tabs-tab-dismiss": "awsui_tabs-tab-dismiss_14rmt_11r1x_370",
|
|
15
|
+
"tabs-tab-action": "awsui_tabs-tab-action_14rmt_11r1x_370",
|
|
16
|
+
"refresh": "awsui_refresh_14rmt_11r1x_375",
|
|
17
|
+
"tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_11r1x_379",
|
|
18
|
+
"tabs-tab-link": "awsui_tabs-tab-link_14rmt_11r1x_421",
|
|
19
|
+
"tabs-tab-active": "awsui_tabs-tab-active_14rmt_11r1x_499",
|
|
20
|
+
"tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_11r1x_506",
|
|
21
|
+
"tabs-tab-focusable": "awsui_tabs-tab-focusable_14rmt_11r1x_510",
|
|
22
|
+
"root": "awsui_root_14rmt_11r1x_514",
|
|
23
|
+
"tabs": "awsui_tabs_14rmt_11r1x_290",
|
|
24
|
+
"tabs-content": "awsui_tabs-content_14rmt_11r1x_552",
|
|
25
|
+
"fit-height": "awsui_fit-height_14rmt_11r1x_556",
|
|
26
|
+
"tabs-content-active": "awsui_tabs-content-active_14rmt_11r1x_562",
|
|
27
|
+
"tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_11r1x_576",
|
|
28
|
+
"with-paddings": "awsui_with-paddings_14rmt_11r1x_576",
|
|
29
|
+
"tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_11r1x_587",
|
|
30
|
+
"disabled-reason-tooltip": "awsui_disabled-reason-tooltip_14rmt_11r1x_598",
|
|
31
|
+
"tabs-tab-focused": "awsui_tabs-tab-focused_14rmt_11r1x_602"
|
|
32
32
|
};
|
|
33
33
|
|
|
@@ -287,7 +287,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
287
287
|
SPDX-License-Identifier: Apache-2.0
|
|
288
288
|
*/
|
|
289
289
|
/* stylelint-disable selector-max-type */
|
|
290
|
-
.awsui_tabs-
|
|
290
|
+
.awsui_tabs-header_14rmt_11r1x_290:not(#\9) {
|
|
291
291
|
margin-block: 0;
|
|
292
292
|
margin-inline: 0;
|
|
293
293
|
padding-block: 0;
|
|
@@ -295,7 +295,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
295
295
|
display: flex;
|
|
296
296
|
}
|
|
297
297
|
|
|
298
|
-
.awsui_tabs-header-
|
|
298
|
+
.awsui_tabs-header-list_14rmt_11r1x_298:not(#\9) {
|
|
299
299
|
margin-block: 0;
|
|
300
300
|
margin-inline: 0;
|
|
301
301
|
padding-block: 0;
|
|
@@ -309,33 +309,33 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
309
309
|
-ms-overflow-style: none; /* Internet Explorer 10+ */
|
|
310
310
|
scrollbar-width: none; /* Firefox */
|
|
311
311
|
}
|
|
312
|
-
.awsui_tabs-header-
|
|
312
|
+
.awsui_tabs-header-list_14rmt_11r1x_298:not(#\9)::-webkit-scrollbar {
|
|
313
313
|
display: none; /* Safari and Chrome */
|
|
314
314
|
}
|
|
315
315
|
|
|
316
|
-
.awsui_pagination-
|
|
316
|
+
.awsui_pagination-button_14rmt_11r1x_316:not(#\9) {
|
|
317
317
|
margin-block: var(--space-scaled-s-8j7izy, 12px);
|
|
318
318
|
margin-inline: 0;
|
|
319
319
|
padding-block: 0;
|
|
320
320
|
padding-inline: var(--space-xxs-y2432o, 4px);
|
|
321
321
|
display: flex;
|
|
322
322
|
}
|
|
323
|
-
.awsui_pagination-button-
|
|
323
|
+
.awsui_pagination-button-left_14rmt_11r1x_323:not(#\9) {
|
|
324
324
|
border-inline-end: var(--border-divider-section-width-iueskx, 1px) solid var(--color-border-control-disabled-7jgofv, #d5dbdb);
|
|
325
325
|
}
|
|
326
|
-
.awsui_pagination-button-left-
|
|
326
|
+
.awsui_pagination-button-left-scrollable_14rmt_11r1x_326:not(#\9) {
|
|
327
327
|
z-index: 1;
|
|
328
328
|
box-shadow: 5px 0px 4px -3px var(--color-border-tabs-shadow-eb3y7s, #eaeded), 1px 0px 0px 0px var(--color-border-tabs-shadow-eb3y7s, #eaeded);
|
|
329
329
|
}
|
|
330
|
-
.awsui_pagination-button-
|
|
330
|
+
.awsui_pagination-button-right_14rmt_11r1x_330:not(#\9) {
|
|
331
331
|
border-inline-start: var(--border-divider-section-width-iueskx, 1px) solid var(--color-border-control-disabled-7jgofv, #d5dbdb);
|
|
332
332
|
}
|
|
333
|
-
.awsui_pagination-button-right-
|
|
333
|
+
.awsui_pagination-button-right-scrollable_14rmt_11r1x_333:not(#\9) {
|
|
334
334
|
z-index: 1;
|
|
335
335
|
box-shadow: -5px 0px 4px -3px var(--color-border-tabs-shadow-eb3y7s, #eaeded), -1px 0px 0px 0 var(--color-border-tabs-shadow-eb3y7s, #eaeded);
|
|
336
336
|
}
|
|
337
337
|
|
|
338
|
-
.awsui_tabs-
|
|
338
|
+
.awsui_tabs-tab_14rmt_11r1x_338:not(#\9) {
|
|
339
339
|
list-style: none;
|
|
340
340
|
padding-block: 0;
|
|
341
341
|
padding-inline: 0;
|
|
@@ -345,7 +345,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
345
345
|
scroll-snap-align: start;
|
|
346
346
|
}
|
|
347
347
|
|
|
348
|
-
.awsui_tabs-tab-
|
|
348
|
+
.awsui_tabs-tab-label_14rmt_11r1x_348:not(#\9) {
|
|
349
349
|
display: flex;
|
|
350
350
|
align-items: center;
|
|
351
351
|
padding-inline: var(--space-xs-6dgkww, 8px);
|
|
@@ -356,7 +356,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
356
356
|
word-break: break-word;
|
|
357
357
|
}
|
|
358
358
|
|
|
359
|
-
.awsui_tabs-tab-header-
|
|
359
|
+
.awsui_tabs-tab-header-container_14rmt_11r1x_359:not(#\9) {
|
|
360
360
|
position: relative;
|
|
361
361
|
border-block: var(--border-divider-section-width-iueskx, 1px) solid transparent;
|
|
362
362
|
border-inline: var(--border-divider-section-width-iueskx, 1px) solid transparent;
|
|
@@ -364,18 +364,19 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
364
364
|
display: flex;
|
|
365
365
|
align-items: stretch;
|
|
366
366
|
}
|
|
367
|
-
.awsui_tabs-tab-header-
|
|
367
|
+
.awsui_tabs-tab-header-container_14rmt_11r1x_359:not(#\9), .awsui_tabs-tab-header-container_14rmt_11r1x_359 > button:not(#\9) {
|
|
368
368
|
background-color: transparent;
|
|
369
369
|
}
|
|
370
|
-
.awsui_tabs-tab-header-
|
|
370
|
+
.awsui_tabs-tab-header-container_14rmt_11r1x_359 > .awsui_tabs-tab-dismiss_14rmt_11r1x_370:not(#\9), .awsui_tabs-tab-header-container_14rmt_11r1x_359 > .awsui_tabs-tab-action_14rmt_11r1x_370:not(#\9) {
|
|
371
|
+
position: relative;
|
|
371
372
|
display: flex;
|
|
372
373
|
align-items: center;
|
|
373
374
|
}
|
|
374
|
-
.awsui_tabs-tab-header-
|
|
375
|
+
.awsui_tabs-tab-header-container_14rmt_11r1x_359.awsui_refresh_14rmt_11r1x_375 > span:not(#\9):first-of-type {
|
|
375
376
|
margin-inline-start: calc(-1 * var(--space-scaled-xs-t3am3w, 8px));
|
|
376
377
|
}
|
|
377
378
|
|
|
378
|
-
.awsui_tabs-tab-header-
|
|
379
|
+
.awsui_tabs-tab-header-container_14rmt_11r1x_359:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_11r1x_379):after {
|
|
379
380
|
content: "";
|
|
380
381
|
position: absolute;
|
|
381
382
|
inset-inline-start: 0;
|
|
@@ -389,35 +390,35 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
389
390
|
background: var(--color-border-tabs-underline-3q3di9, #16191f);
|
|
390
391
|
opacity: 0;
|
|
391
392
|
}
|
|
392
|
-
.awsui_tabs-tab-header-
|
|
393
|
+
.awsui_tabs-tab-header-container_14rmt_11r1x_359:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_11r1x_379).awsui_refresh_14rmt_11r1x_375:after {
|
|
393
394
|
transition: opacity var(--motion-duration-refresh-only-medium-kd6k1u, 0ms) var(--motion-easing-refresh-only-c-8zqwmw, cubic-bezier(0.84, 0, 0.16, 1));
|
|
394
395
|
}
|
|
395
396
|
@media (prefers-reduced-motion: reduce) {
|
|
396
|
-
.awsui_tabs-tab-header-
|
|
397
|
+
.awsui_tabs-tab-header-container_14rmt_11r1x_359:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_11r1x_379).awsui_refresh_14rmt_11r1x_375:after {
|
|
397
398
|
animation: none;
|
|
398
399
|
transition: none;
|
|
399
400
|
}
|
|
400
401
|
}
|
|
401
|
-
.awsui-motion-disabled .awsui_tabs-tab-header-
|
|
402
|
+
.awsui-motion-disabled .awsui_tabs-tab-header-container_14rmt_11r1x_359:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_11r1x_379).awsui_refresh_14rmt_11r1x_375:after, .awsui-mode-entering .awsui_tabs-tab-header-container_14rmt_11r1x_359:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_11r1x_379).awsui_refresh_14rmt_11r1x_375:after {
|
|
402
403
|
animation: none;
|
|
403
404
|
transition: none;
|
|
404
405
|
}
|
|
405
406
|
|
|
406
|
-
.awsui_tabs-
|
|
407
|
+
.awsui_tabs-tab_14rmt_11r1x_338:not(#\9):not(:last-child) > .awsui_tabs-tab-header-container_14rmt_11r1x_359 {
|
|
407
408
|
margin-inline-end: calc(-1 * var(--border-divider-section-width-iueskx, 1px));
|
|
408
409
|
}
|
|
409
|
-
.awsui_tabs-
|
|
410
|
+
.awsui_tabs-tab_14rmt_11r1x_338:not(#\9):not(:last-child) > .awsui_tabs-tab-header-container_14rmt_11r1x_359:before {
|
|
410
411
|
content: "";
|
|
411
412
|
position: absolute;
|
|
412
413
|
border-inline-end: var(--border-divider-section-width-iueskx, 1px) solid var(--color-border-tabs-divider-x9swcr, #aab7b8);
|
|
413
414
|
inset: var(--space-scaled-s-8j7izy, 12px) 0;
|
|
414
415
|
opacity: 1;
|
|
415
416
|
}
|
|
416
|
-
.awsui_tabs-
|
|
417
|
+
.awsui_tabs-tab_14rmt_11r1x_338:not(#\9):not(:last-child) > .awsui_tabs-tab-header-container_14rmt_11r1x_359.awsui_refresh_14rmt_11r1x_375:before {
|
|
417
418
|
inset: calc(var(--space-static-s-pwj45y, 12px) - var(--border-active-width-28kchn, 2px)) 0;
|
|
418
419
|
}
|
|
419
420
|
|
|
420
|
-
.awsui_tabs-tab-
|
|
421
|
+
.awsui_tabs-tab-link_14rmt_11r1x_421:not(#\9) {
|
|
421
422
|
position: relative;
|
|
422
423
|
display: flex;
|
|
423
424
|
align-items: stretch;
|
|
@@ -438,27 +439,27 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
438
439
|
-webkit-font-smoothing: var(--font-smoothing-webkit-trr1e8, auto);
|
|
439
440
|
-moz-osx-font-smoothing: var(--font-smoothing-moz-osx-hyxkxc, auto);
|
|
440
441
|
}
|
|
441
|
-
.awsui_tabs-tab-
|
|
442
|
+
.awsui_tabs-tab-link_14rmt_11r1x_421.awsui_refresh_14rmt_11r1x_375:not(#\9) {
|
|
442
443
|
padding-block-start: calc(var(--space-static-xs-fwcjew, 8px) - 1px);
|
|
443
444
|
padding-block-end: calc(var(--space-static-xs-fwcjew, 8px) - 1px);
|
|
444
445
|
margin-block-start: 0;
|
|
445
446
|
}
|
|
446
|
-
.awsui_tabs-tab-
|
|
447
|
+
.awsui_tabs-tab-link_14rmt_11r1x_421:not(#\9):hover {
|
|
447
448
|
color: var(--color-text-accent-b3retj, #0073bb);
|
|
448
449
|
}
|
|
449
|
-
.awsui_tabs-tab-
|
|
450
|
+
.awsui_tabs-tab-link_14rmt_11r1x_421:not(#\9):focus {
|
|
450
451
|
outline: none;
|
|
451
452
|
}
|
|
452
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-tab-
|
|
453
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_11r1x_421:not(#\9):focus {
|
|
453
454
|
z-index: 1;
|
|
454
455
|
border-inline-end-color: transparent;
|
|
455
456
|
position: relative;
|
|
456
457
|
}
|
|
457
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-tab-
|
|
458
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_11r1x_421:not(#\9):focus {
|
|
458
459
|
outline: 2px dotted transparent;
|
|
459
460
|
outline-offset: calc(var(--space-tabs-focus-outline-gutter-ix5qjm, 0px) - 1px);
|
|
460
461
|
}
|
|
461
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-tab-
|
|
462
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_11r1x_421:not(#\9):focus::before {
|
|
462
463
|
content: " ";
|
|
463
464
|
display: block;
|
|
464
465
|
position: absolute;
|
|
@@ -473,48 +474,48 @@ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_1nk1b_420:not(#\9
|
|
|
473
474
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-q68bgg, #0073bb);
|
|
474
475
|
}
|
|
475
476
|
|
|
476
|
-
.awsui_tabs-
|
|
477
|
+
.awsui_tabs-tab_14rmt_11r1x_338:not(#\9):first-child {
|
|
477
478
|
margin-inline-start: 1px;
|
|
478
479
|
scroll-margin-inline-start: 1px;
|
|
479
480
|
}
|
|
480
|
-
.awsui_tabs-
|
|
481
|
+
.awsui_tabs-tab_14rmt_11r1x_338:not(#\9):first-child > .awsui_tabs-tab-header-container_14rmt_11r1x_359 {
|
|
481
482
|
padding-inline-start: calc(var(--space-xs-6dgkww, 8px) - 1px);
|
|
482
483
|
}
|
|
483
484
|
|
|
484
|
-
.awsui_tabs-
|
|
485
|
+
.awsui_tabs-tab_14rmt_11r1x_338:not(#\9):last-child {
|
|
485
486
|
margin-inline-end: 1px;
|
|
486
487
|
scroll-margin-inline-end: 1px;
|
|
487
488
|
}
|
|
488
|
-
.awsui_tabs-
|
|
489
|
+
.awsui_tabs-tab_14rmt_11r1x_338:not(#\9):last-child > .awsui_tabs-tab-header-container_14rmt_11r1x_359 {
|
|
489
490
|
padding-inline-end: calc(var(--space-xs-6dgkww, 8px) - 1px);
|
|
490
491
|
}
|
|
491
492
|
|
|
492
|
-
.awsui_tabs-tab-
|
|
493
|
+
.awsui_tabs-tab-disabled_14rmt_11r1x_379:not(#\9), .awsui_tabs-tab-disabled_14rmt_11r1x_379:not(#\9):hover {
|
|
493
494
|
cursor: default;
|
|
494
495
|
color: var(--color-text-interactive-disabled-xqzdg5, #aab7b8);
|
|
495
496
|
font-weight: var(--font-tabs-disabled-weight-u0cr6g, 400);
|
|
496
497
|
}
|
|
497
498
|
|
|
498
|
-
.awsui_tabs-tab-
|
|
499
|
+
.awsui_tabs-tab-active_14rmt_11r1x_499:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_11r1x_379) {
|
|
499
500
|
color: var(--color-text-accent-b3retj, #0073bb);
|
|
500
501
|
}
|
|
501
|
-
.awsui_tabs-tab-
|
|
502
|
+
.awsui_tabs-tab-active_14rmt_11r1x_499:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_11r1x_379):after {
|
|
502
503
|
opacity: 1;
|
|
503
504
|
}
|
|
504
505
|
|
|
505
|
-
.awsui_tabs-header-with-
|
|
506
|
+
.awsui_tabs-header-with-divider_14rmt_11r1x_506:not(#\9) {
|
|
506
507
|
border-block-end: var(--border-divider-section-width-iueskx, 1px) solid var(--color-border-tabs-divider-x9swcr, #aab7b8);
|
|
507
508
|
}
|
|
508
509
|
|
|
509
|
-
.awsui_tabs-tab-
|
|
510
|
+
.awsui_tabs-tab-focusable_14rmt_11r1x_510:not(#\9) {
|
|
510
511
|
/* used to manage focusable logic */
|
|
511
512
|
}
|
|
512
513
|
|
|
513
|
-
.
|
|
514
|
+
.awsui_root_14rmt_11r1x_514:not(#\9) {
|
|
514
515
|
/* used in test-utils or tests */
|
|
515
516
|
}
|
|
516
517
|
|
|
517
|
-
.
|
|
518
|
+
.awsui_tabs_14rmt_11r1x_290:not(#\9) {
|
|
518
519
|
border-collapse: separate;
|
|
519
520
|
border-spacing: 0;
|
|
520
521
|
box-sizing: border-box;
|
|
@@ -549,21 +550,21 @@ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_1nk1b_420:not(#\9
|
|
|
549
550
|
inline-size: 100%;
|
|
550
551
|
}
|
|
551
552
|
|
|
552
|
-
.awsui_tabs-
|
|
553
|
+
.awsui_tabs-content_14rmt_11r1x_552:not(#\9) {
|
|
553
554
|
display: none;
|
|
554
555
|
}
|
|
555
556
|
|
|
556
|
-
.awsui_fit-
|
|
557
|
+
.awsui_fit-height_14rmt_11r1x_556:not(#\9) {
|
|
557
558
|
display: flex;
|
|
558
559
|
flex-direction: column;
|
|
559
560
|
block-size: 100%;
|
|
560
561
|
}
|
|
561
562
|
|
|
562
|
-
.awsui_tabs-content-
|
|
563
|
+
.awsui_tabs-content-active_14rmt_11r1x_562:not(#\9) {
|
|
563
564
|
display: block;
|
|
564
565
|
flex: 1;
|
|
565
566
|
}
|
|
566
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-content-
|
|
567
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-content-active_14rmt_11r1x_562:not(#\9):focus {
|
|
567
568
|
outline: 2px dotted transparent;
|
|
568
569
|
outline-offset: 2px;
|
|
569
570
|
border-start-start-radius: var(--border-radius-container-3o3ats, 0px);
|
|
@@ -573,32 +574,32 @@ body[data-awsui-focus-visible=true] .awsui_tabs-content-active_14rmt_1nk1b_561:n
|
|
|
573
574
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-q68bgg, #0073bb);
|
|
574
575
|
}
|
|
575
576
|
|
|
576
|
-
.awsui_tabs-content-
|
|
577
|
+
.awsui_tabs-content-wrapper_14rmt_11r1x_576.awsui_with-paddings_14rmt_11r1x_576 > .awsui_tabs-content_14rmt_11r1x_552:not(#\9) {
|
|
577
578
|
padding-block: var(--space-scaled-m-3uxq9h, 16px);
|
|
578
579
|
padding-inline: 0;
|
|
579
580
|
}
|
|
580
|
-
.awsui_fit-
|
|
581
|
+
.awsui_fit-height_14rmt_11r1x_556 > .awsui_tabs-content-wrapper_14rmt_11r1x_576:not(#\9) {
|
|
581
582
|
flex: 1;
|
|
582
583
|
display: flex;
|
|
583
584
|
flex-direction: column;
|
|
584
585
|
overflow: auto;
|
|
585
586
|
}
|
|
586
587
|
|
|
587
|
-
.awsui_fit-
|
|
588
|
+
.awsui_fit-height_14rmt_11r1x_556 > .awsui_tabs-content-wrapper_14rmt_11r1x_576 > .awsui_tabs-container-content-wrapper_14rmt_11r1x_587:not(#\9) {
|
|
588
589
|
block-size: 100%;
|
|
589
590
|
display: flex;
|
|
590
591
|
flex-direction: column;
|
|
591
592
|
}
|
|
592
|
-
.awsui_tabs-container-content-
|
|
593
|
+
.awsui_tabs-container-content-wrapper_14rmt_11r1x_587.awsui_with-paddings_14rmt_11r1x_576 > .awsui_tabs-content_14rmt_11r1x_552:not(#\9) {
|
|
593
594
|
padding-block-start: var(--space-tabs-content-top-asxj61, 16px);
|
|
594
595
|
padding-block-end: var(--space-scaled-l-7e51pg, 20px);
|
|
595
596
|
padding-inline: var(--space-container-horizontal-v3575u, 20px);
|
|
596
597
|
}
|
|
597
598
|
|
|
598
|
-
.awsui_disabled-reason-
|
|
599
|
+
.awsui_disabled-reason-tooltip_14rmt_11r1x_598:not(#\9) {
|
|
599
600
|
/* used in test-utils or tests */
|
|
600
601
|
}
|
|
601
602
|
|
|
602
|
-
.awsui_tabs-tab-
|
|
603
|
+
.awsui_tabs-tab-focused_14rmt_11r1x_602:not(#\9) {
|
|
603
604
|
/* used to manage focusable state for disabled with reason tabs */
|
|
604
605
|
}
|
|
@@ -2,33 +2,33 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"tabs-header": "awsui_tabs-
|
|
6
|
-
"tabs-header-list": "awsui_tabs-header-
|
|
7
|
-
"pagination-button": "awsui_pagination-
|
|
8
|
-
"pagination-button-left": "awsui_pagination-button-
|
|
9
|
-
"pagination-button-left-scrollable": "awsui_pagination-button-left-
|
|
10
|
-
"pagination-button-right": "awsui_pagination-button-
|
|
11
|
-
"pagination-button-right-scrollable": "awsui_pagination-button-right-
|
|
12
|
-
"tabs-tab": "awsui_tabs-
|
|
13
|
-
"tabs-tab-label": "awsui_tabs-tab-
|
|
14
|
-
"tabs-tab-header-container": "awsui_tabs-tab-header-
|
|
15
|
-
"tabs-tab-dismiss": "awsui_tabs-tab-
|
|
16
|
-
"tabs-tab-action": "awsui_tabs-tab-
|
|
17
|
-
"refresh": "
|
|
18
|
-
"tabs-tab-disabled": "awsui_tabs-tab-
|
|
19
|
-
"tabs-tab-link": "awsui_tabs-tab-
|
|
20
|
-
"tabs-tab-active": "awsui_tabs-tab-
|
|
21
|
-
"tabs-header-with-divider": "awsui_tabs-header-with-
|
|
22
|
-
"tabs-tab-focusable": "awsui_tabs-tab-
|
|
23
|
-
"root": "
|
|
24
|
-
"tabs": "
|
|
25
|
-
"tabs-content": "awsui_tabs-
|
|
26
|
-
"fit-height": "awsui_fit-
|
|
27
|
-
"tabs-content-active": "awsui_tabs-content-
|
|
28
|
-
"tabs-content-wrapper": "awsui_tabs-content-
|
|
29
|
-
"with-paddings": "awsui_with-
|
|
30
|
-
"tabs-container-content-wrapper": "awsui_tabs-container-content-
|
|
31
|
-
"disabled-reason-tooltip": "awsui_disabled-reason-
|
|
32
|
-
"tabs-tab-focused": "awsui_tabs-tab-
|
|
5
|
+
"tabs-header": "awsui_tabs-header_14rmt_11r1x_290",
|
|
6
|
+
"tabs-header-list": "awsui_tabs-header-list_14rmt_11r1x_298",
|
|
7
|
+
"pagination-button": "awsui_pagination-button_14rmt_11r1x_316",
|
|
8
|
+
"pagination-button-left": "awsui_pagination-button-left_14rmt_11r1x_323",
|
|
9
|
+
"pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_11r1x_326",
|
|
10
|
+
"pagination-button-right": "awsui_pagination-button-right_14rmt_11r1x_330",
|
|
11
|
+
"pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_11r1x_333",
|
|
12
|
+
"tabs-tab": "awsui_tabs-tab_14rmt_11r1x_338",
|
|
13
|
+
"tabs-tab-label": "awsui_tabs-tab-label_14rmt_11r1x_348",
|
|
14
|
+
"tabs-tab-header-container": "awsui_tabs-tab-header-container_14rmt_11r1x_359",
|
|
15
|
+
"tabs-tab-dismiss": "awsui_tabs-tab-dismiss_14rmt_11r1x_370",
|
|
16
|
+
"tabs-tab-action": "awsui_tabs-tab-action_14rmt_11r1x_370",
|
|
17
|
+
"refresh": "awsui_refresh_14rmt_11r1x_375",
|
|
18
|
+
"tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_11r1x_379",
|
|
19
|
+
"tabs-tab-link": "awsui_tabs-tab-link_14rmt_11r1x_421",
|
|
20
|
+
"tabs-tab-active": "awsui_tabs-tab-active_14rmt_11r1x_499",
|
|
21
|
+
"tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_11r1x_506",
|
|
22
|
+
"tabs-tab-focusable": "awsui_tabs-tab-focusable_14rmt_11r1x_510",
|
|
23
|
+
"root": "awsui_root_14rmt_11r1x_514",
|
|
24
|
+
"tabs": "awsui_tabs_14rmt_11r1x_290",
|
|
25
|
+
"tabs-content": "awsui_tabs-content_14rmt_11r1x_552",
|
|
26
|
+
"fit-height": "awsui_fit-height_14rmt_11r1x_556",
|
|
27
|
+
"tabs-content-active": "awsui_tabs-content-active_14rmt_11r1x_562",
|
|
28
|
+
"tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_11r1x_576",
|
|
29
|
+
"with-paddings": "awsui_with-paddings_14rmt_11r1x_576",
|
|
30
|
+
"tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_11r1x_587",
|
|
31
|
+
"disabled-reason-tooltip": "awsui_disabled-reason-tooltip_14rmt_11r1x_598",
|
|
32
|
+
"tabs-tab-focused": "awsui_tabs-tab-focused_14rmt_11r1x_602"
|
|
33
33
|
};
|
|
34
34
|
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/panel-resize-handle/icon.tsx"],"names":[],"mappings":";AAIA,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,eAe7E"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"icon.js","sourceRoot":"","sources":["../../../../../src/internal/components/panel-resize-handle/icon.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EAAE,SAAS,EAA0B;IAC5E,OAAO,CACL,6BACE,SAAS,EAAE,KAAK,EAChB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,iBACN,IAAI;QAEjB,8BAAM,WAAW,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,GAAG;QACrD,8BAAM,WAAW,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,GAAG,CACnD,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nexport default function ResizeHandleIcon({ className }: { className?: string }) {\n return (\n <svg\n focusable={false}\n className={className}\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden={true}\n >\n <line strokeWidth=\"2\" x1=\"2\" y1=\"5\" x2=\"14\" y2=\"5\" />\n <line strokeWidth=\"2\" x1=\"14\" y1=\"10\" x2=\"2\" y2=\"10\" />\n </svg>\n );\n}\n"]}
|