@cloudscape-design/components-themeable 3.0.690 → 3.0.691
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/tabs/tab-header-bar.scss +86 -48
- package/lib/internal/template/i18n/messages/all.all.js +1 -1
- package/lib/internal/template/i18n/messages/all.all.json +1 -1
- package/lib/internal/template/i18n/messages/all.de.js +1 -1
- package/lib/internal/template/i18n/messages/all.de.json +1 -1
- package/lib/internal/template/i18n/messages/all.en-GB.js +1 -1
- package/lib/internal/template/i18n/messages/all.en-GB.json +1 -1
- package/lib/internal/template/i18n/messages/all.en.js +1 -1
- package/lib/internal/template/i18n/messages/all.en.json +1 -1
- package/lib/internal/template/i18n/messages/all.es.js +1 -1
- package/lib/internal/template/i18n/messages/all.es.json +1 -1
- package/lib/internal/template/i18n/messages/all.fr.js +1 -1
- package/lib/internal/template/i18n/messages/all.fr.json +1 -1
- package/lib/internal/template/i18n/messages/all.id.js +1 -1
- package/lib/internal/template/i18n/messages/all.id.json +1 -1
- package/lib/internal/template/i18n/messages/all.it.js +1 -1
- package/lib/internal/template/i18n/messages/all.it.json +1 -1
- package/lib/internal/template/i18n/messages/all.ja.js +1 -1
- package/lib/internal/template/i18n/messages/all.ja.json +1 -1
- package/lib/internal/template/i18n/messages/all.ko.js +1 -1
- package/lib/internal/template/i18n/messages/all.ko.json +1 -1
- package/lib/internal/template/i18n/messages/all.pt-BR.js +1 -1
- package/lib/internal/template/i18n/messages/all.pt-BR.json +1 -1
- package/lib/internal/template/i18n/messages/all.tr.js +1 -1
- package/lib/internal/template/i18n/messages/all.tr.json +1 -1
- package/lib/internal/template/i18n/messages/all.zh-CN.js +1 -1
- package/lib/internal/template/i18n/messages/all.zh-CN.json +1 -1
- package/lib/internal/template/i18n/messages/all.zh-TW.js +1 -1
- package/lib/internal/template/i18n/messages/all.zh-TW.json +1 -1
- package/lib/internal/template/i18n/messages-types.d.ts +1 -0
- package/lib/internal/template/i18n/messages-types.d.ts.map +1 -1
- package/lib/internal/template/i18n/messages-types.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/tabs/interfaces.d.ts +36 -0
- package/lib/internal/template/tabs/interfaces.d.ts.map +1 -1
- package/lib/internal/template/tabs/interfaces.js.map +1 -1
- package/lib/internal/template/tabs/styles.css.js +25 -22
- package/lib/internal/template/tabs/styles.scoped.css +107 -77
- package/lib/internal/template/tabs/styles.selectors.js +25 -22
- package/lib/internal/template/tabs/tab-header-bar.d.ts.map +1 -1
- package/lib/internal/template/tabs/tab-header-bar.js +106 -17
- package/lib/internal/template/tabs/tab-header-bar.js.map +1 -1
- package/lib/internal/template/test-utils/dom/tabs/index.d.ts +38 -1
- package/lib/internal/template/test-utils/dom/tabs/index.js +53 -2
- package/lib/internal/template/test-utils/dom/tabs/index.js.map +1 -1
- package/lib/internal/template/test-utils/selectors/tabs/index.d.ts +38 -1
- package/lib/internal/template/test-utils/selectors/tabs/index.js +53 -2
- package/lib/internal/template/test-utils/selectors/tabs/index.js.map +1 -1
- package/lib/internal/template/test-utils/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"messages-types.js","sourceRoot":"","sources":["../../../src/i18n/messages-types.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n/* eslint-disable prettier/prettier */\n\n/** Auto-generated argument types based on \"en\" i18n strings. Do not edit manually. */\nexport interface I18nFormatArgTypes {\n \"[charts]\": {\n \"loadingText\": never;\n \"errorText\": never;\n \"recoveryText\": never;\n \"i18nStrings.filterLabel\": never;\n \"i18nStrings.filterPlaceholder\": never;\n \"i18nStrings.legendAriaLabel\": never;\n \"i18nStrings.chartAriaRoleDescription\": never;\n \"i18nStrings.xAxisAriaRoleDescription\": never;\n \"i18nStrings.yAxisAriaRoleDescription\": never;\n }\n \"alert\": {\n \"dismissAriaLabel\": never;\n }\n \"annotation-context\": {\n \"i18nStrings.nextButtonText\": never;\n \"i18nStrings.previousButtonText\": never;\n \"i18nStrings.finishButtonText\": never;\n \"i18nStrings.labelDismissAnnotation\": never;\n \"i18nStrings.stepCounterText\": {\n \"stepNumber\": string | number;\n \"totalStepCount\": string | number;\n }\n \"i18nStrings.taskTitle\": {\n \"taskNumber\": string | number;\n \"taskTitle\": string | number;\n }\n \"i18nStrings.labelHotspot\": {\n \"openState\": string;\n \"stepNumber\": string | number;\n \"totalStepCount\": string | number;\n }\n }\n \"app-layout\": {\n \"ariaLabels.drawers\": never;\n \"ariaLabels.drawersOverflow\": never;\n \"ariaLabels.drawersOverflowWithBadge\": never;\n \"ariaLabels.navigation\": never;\n \"ariaLabels.navigationClose\": never;\n \"ariaLabels.navigationToggle\": never;\n \"ariaLabels.notifications\": never;\n \"ariaLabels.tools\": never;\n \"ariaLabels.toolsClose\": never;\n \"ariaLabels.toolsToggle\": never;\n }\n \"area-chart\": {\n \"i18nStrings.detailTotalLabel\": never;\n }\n \"attribute-editor\": {\n \"removeButtonText\": never;\n }\n \"autosuggest\": {\n \"errorIconAriaLabel\": never;\n \"selectedAriaLabel\": never;\n \"enteredTextLabel\": {\n \"value\": string | number;\n }\n \"recoveryText\": never;\n }\n \"breadcrumb-group\": {\n \"expandAriaLabel\": never;\n }\n \"calendar\": {\n \"nextMonthAriaLabel\": never;\n \"previousMonthAriaLabel\": never;\n \"todayAriaLabel\": never;\n \"i18nStrings.nextYearAriaLabel\": never;\n \"i18nStrings.previousYearAriaLabel\": never;\n \"i18nStrings.currentMonthAriaLabel\": never;\n }\n \"cards\": {\n \"ariaLabels.selectionGroupLabel\": never;\n }\n \"code-editor\": {\n \"i18nStrings.loadingState\": never;\n \"i18nStrings.errorState\": never;\n \"i18nStrings.errorStateRecovery\": never;\n \"i18nStrings.editorGroupAriaLabel\": never;\n \"i18nStrings.statusBarGroupAriaLabel\": never;\n \"i18nStrings.cursorPosition\": {\n \"row\": string | number;\n \"column\": string | number;\n }\n \"i18nStrings.errorsTab\": never;\n \"i18nStrings.warningsTab\": never;\n \"i18nStrings.preferencesButtonAriaLabel\": never;\n \"i18nStrings.paneCloseButtonAriaLabel\": never;\n \"i18nStrings.preferencesModalHeader\": never;\n \"i18nStrings.preferencesModalCancel\": never;\n \"i18nStrings.preferencesModalConfirm\": never;\n \"i18nStrings.preferencesModalWrapLines\": never;\n \"i18nStrings.preferencesModalTheme\": never;\n \"i18nStrings.preferencesModalLightThemes\": never;\n \"i18nStrings.preferencesModalDarkThemes\": never;\n }\n \"collection-preferences\": {\n \"title\": never;\n \"confirmLabel\": never;\n \"cancelLabel\": never;\n \"pageSizePreference.title\": never;\n \"wrapLinesPreference.label\": never;\n \"wrapLinesPreference.description\": never;\n \"stripedRowsPreference.label\": never;\n \"stripedRowsPreference.description\": never;\n \"contentDensityPreference.label\": never;\n \"contentDensityPreference.description\": never;\n \"contentDisplayPreference.title\": never;\n \"contentDisplayPreference.description\": never;\n \"contentDisplayPreference.dragHandleAriaLabel\": never;\n \"contentDisplayPreference.dragHandleAriaDescription\": never;\n \"contentDisplayPreference.liveAnnouncementDndStarted\": {\n \"position\": string | number;\n \"total\": string | number;\n }\n \"contentDisplayPreference.liveAnnouncementDndDiscarded\": never;\n \"contentDisplayPreference.liveAnnouncementDndItemReordered\": {\n \"isInitialPosition\": string;\n \"currentPosition\": string | number;\n \"total\": string | number;\n }\n \"contentDisplayPreference.liveAnnouncementDndItemCommitted\": {\n \"isInitialPosition\": string;\n \"initialPosition\": string | number;\n \"total\": string | number;\n \"finalPosition\": string | number;\n }\n }\n \"copy-to-clipboard\": {\n \"i18nStrings.copyButtonText\": never;\n }\n \"date-range-picker\": {\n \"i18nStrings.relativeModeTitle\": never;\n \"i18nStrings.absoluteModeTitle\": never;\n \"i18nStrings.relativeRangeSelectionHeading\": never;\n \"i18nStrings.cancelButtonLabel\": never;\n \"i18nStrings.clearButtonLabel\": never;\n \"i18nStrings.applyButtonLabel\": never;\n \"i18nStrings.customRelativeRangeOptionLabel\": never;\n \"i18nStrings.customRelativeRangeOptionDescription\": never;\n \"i18nStrings.customRelativeRangeUnitLabel\": never;\n \"i18nStrings.customRelativeRangeDurationLabel\": never;\n \"i18nStrings.customRelativeRangeDurationPlaceholder\": never;\n \"i18nStrings.startDateLabel\": never;\n \"i18nStrings.startTimeLabel\": never;\n \"i18nStrings.endDateLabel\": never;\n \"i18nStrings.endTimeLabel\": never;\n \"i18nStrings.dateTimeConstraintText\": never;\n \"i18nStrings.errorIconAriaLabel\": never;\n \"i18nStrings.renderSelectedAbsoluteRangeAriaLive\": {\n \"startDate\": string | number;\n \"endDate\": string | number;\n }\n \"i18nStrings.formatRelativeRange\": {\n \"unit\": string;\n \"amount\": number;\n }\n \"i18nStrings.formatUnit\": {\n \"unit\": string;\n \"amount\": number;\n }\n }\n \"drawer\": {\n \"i18nStrings.loadingText\": never;\n }\n \"flashbar\": {\n \"i18nStrings.ariaLabel\": never;\n \"i18nStrings.errorIconAriaLabel\": never;\n \"i18nStrings.inProgressIconAriaLabel\": never;\n \"i18nStrings.infoIconAriaLabel\": never;\n \"i18nStrings.notificationBarAriaLabel\": never;\n \"i18nStrings.notificationBarText\": never;\n \"i18nStrings.successIconAriaLabel\": never;\n \"i18nStrings.warningIconAriaLabel\": never;\n }\n \"form-field\": {\n \"i18nStrings.errorIconAriaLabel\": never;\n \"i18nStrings.warningIconAriaLabel\": never;\n }\n \"form\": {\n \"errorIconAriaLabel\": never;\n }\n \"help-panel\": {\n \"loadingText\": never;\n }\n \"input\": {\n \"clearAriaLabel\": never;\n }\n \"link\": {\n \"externalIconAriaLabel\": never;\n }\n \"modal\": {\n \"closeAriaLabel\": never;\n }\n \"multiselect\": {\n \"deselectAriaLabel\": {\n \"option__label\": string | number;\n }\n }\n \"pagination\": {\n \"ariaLabels.nextPageLabel\": never;\n \"ariaLabels.pageLabel\": {\n \"pageNumber\": string | number;\n }\n \"ariaLabels.previousPageLabel\": never;\n }\n \"pie-chart\": {\n \"i18nStrings.detailsValue\": never;\n \"i18nStrings.detailsPercentage\": never;\n \"i18nStrings.chartAriaRoleDescription\": never;\n \"i18nStrings.segmentAriaRoleDescription\": never;\n }\n \"popover\": {\n \"dismissAriaLabel\": never;\n }\n \"property-filter\": {\n \"i18nStrings.allPropertiesLabel\": never;\n \"i18nStrings.applyActionText\": never;\n \"i18nStrings.cancelActionText\": never;\n \"i18nStrings.clearFiltersText\": never;\n \"i18nStrings.editTokenHeader\": never;\n \"i18nStrings.groupPropertiesText\": never;\n \"i18nStrings.groupValuesText\": never;\n \"i18nStrings.operationAndText\": never;\n \"i18nStrings.operationOrText\": never;\n \"i18nStrings.operatorContainsText\": never;\n \"i18nStrings.operatorDoesNotContainText\": never;\n \"i18nStrings.operatorDoesNotEqualText\": never;\n \"i18nStrings.operatorEqualsText\": never;\n \"i18nStrings.operatorGreaterOrEqualText\": never;\n \"i18nStrings.operatorGreaterText\": never;\n \"i18nStrings.operatorLessOrEqualText\": never;\n \"i18nStrings.operatorLessText\": never;\n \"i18nStrings.operatorStartsWithText\": never;\n \"i18nStrings.operatorDoesNotStartWithText\": never;\n \"i18nStrings.operatorText\": never;\n \"i18nStrings.operatorsText\": never;\n \"i18nStrings.propertyText\": never;\n \"i18nStrings.tokenLimitShowFewer\": never;\n \"i18nStrings.tokenLimitShowMore\": never;\n \"i18nStrings.valueText\": never;\n \"i18nStrings.removeTokenButtonAriaLabel\": {\n \"token__operator\": string;\n \"token__propertyKey\": string | number;\n \"token__value\": string | number;\n }\n }\n \"s3-resource-selector\": {\n \"i18nStrings.inContextSelectPlaceholder\": never;\n \"i18nStrings.inContextBrowseButton\": never;\n \"i18nStrings.inContextViewButton\": never;\n \"i18nStrings.inContextViewButtonAriaLabel\": never;\n \"i18nStrings.inContextLoadingText\": never;\n \"i18nStrings.inContextUriLabel\": never;\n \"i18nStrings.inContextVersionSelectLabel\": never;\n \"i18nStrings.modalTitle\": never;\n \"i18nStrings.modalCancelButton\": never;\n \"i18nStrings.modalSubmitButton\": never;\n \"i18nStrings.modalBreadcrumbRootItem\": never;\n \"i18nStrings.selectionBuckets\": never;\n \"i18nStrings.selectionObjects\": never;\n \"i18nStrings.selectionVersions\": never;\n \"i18nStrings.selectionBucketsSearchPlaceholder\": never;\n \"i18nStrings.selectionObjectsSearchPlaceholder\": never;\n \"i18nStrings.selectionVersionsSearchPlaceholder\": never;\n \"i18nStrings.selectionBucketsLoading\": never;\n \"i18nStrings.selectionBucketsNoItems\": never;\n \"i18nStrings.selectionObjectsLoading\": never;\n \"i18nStrings.selectionObjectsNoItems\": never;\n \"i18nStrings.selectionVersionsLoading\": never;\n \"i18nStrings.selectionVersionsNoItems\": never;\n \"i18nStrings.filteringNoMatches\": never;\n \"i18nStrings.filteringCantFindMatch\": never;\n \"i18nStrings.clearFilterButtonText\": never;\n \"i18nStrings.columnBucketID\": never;\n \"i18nStrings.columnBucketName\": never;\n \"i18nStrings.columnBucketCreationDate\": never;\n \"i18nStrings.columnBucketRegion\": never;\n \"i18nStrings.columnObjectKey\": never;\n \"i18nStrings.columnObjectLastModified\": never;\n \"i18nStrings.columnObjectSize\": never;\n \"i18nStrings.columnVersionID\": never;\n \"i18nStrings.columnVersionLastModified\": never;\n \"i18nStrings.columnVersionSize\": never;\n \"i18nStrings.validationPathMustBegin\": never;\n \"i18nStrings.validationBucketLowerCase\": never;\n \"i18nStrings.validationBucketMustNotContain\": never;\n \"i18nStrings.validationBucketLength\": never;\n \"i18nStrings.validationBucketMustComplyDns\": never;\n \"i18nStrings.labelSortedDescending\": {\n \"columnName\": string | number;\n }\n \"i18nStrings.labelSortedAscending\": {\n \"columnName\": string | number;\n }\n \"i18nStrings.labelNotSorted\": {\n \"columnName\": string | number;\n }\n \"i18nStrings.labelsBucketsSelection.selectionGroupLabel\": never;\n \"i18nStrings.labelsBucketsSelection.itemSelectionLabel\": {\n \"item__Name\": string | number;\n }\n \"i18nStrings.labelsObjectsSelection.selectionGroupLabel\": never;\n \"i18nStrings.labelsObjectsSelection.itemSelectionLabel\": {\n \"item__Key\": string | number;\n }\n \"i18nStrings.labelsVersionsSelection.selectionGroupLabel\": never;\n \"i18nStrings.labelsVersionsSelection.itemSelectionLabel\": {\n \"item__VersionId\": string | number;\n }\n \"i18nStrings.labelFiltering\": {\n \"itemsType\": string | number;\n }\n \"i18nStrings.labelRefresh\": never;\n \"i18nStrings.labelBreadcrumbs\": never;\n \"i18nStrings.filteringCounterText\": {\n \"count\": number;\n }\n }\n \"select\": {\n \"errorIconAriaLabel\": never;\n \"selectedAriaLabel\": never;\n \"recoveryText\": never;\n }\n \"slider\": {\n \"i18nStrings.valueTextRange\": {\n \"value\": string | number;\n \"previousValue\": string | number;\n \"nextValue\": string | number;\n }\n }\n \"split-panel\": {\n \"i18nStrings.closeButtonAriaLabel\": never;\n \"i18nStrings.openButtonAriaLabel\": never;\n \"i18nStrings.preferencesTitle\": never;\n \"i18nStrings.preferencesPositionLabel\": never;\n \"i18nStrings.preferencesPositionDescription\": never;\n \"i18nStrings.preferencesPositionSide\": never;\n \"i18nStrings.preferencesPositionBottom\": never;\n \"i18nStrings.preferencesConfirm\": never;\n \"i18nStrings.preferencesCancel\": never;\n \"i18nStrings.resizeHandleAriaLabel\": never;\n }\n \"table\": {\n \"ariaLabels.resizerRoleDescription\": never;\n \"ariaLabels.submittingEditText\": never;\n \"ariaLabels.successfulEditLabel\": never;\n \"ariaLabels.expandButtonLabel\": never;\n \"ariaLabels.collapseButtonLabel\": never;\n \"columnDefinitions.editConfig.errorIconAriaLabel\": never;\n \"columnDefinitions.editConfig.editIconAriaLabel\": never;\n }\n \"tabs\": {\n \"i18nStrings.scrollLeftAriaLabel\": never;\n \"i18nStrings.scrollRightAriaLabel\": never;\n }\n \"tag-editor\": {\n \"i18nStrings.keyPlaceholder\": never;\n \"i18nStrings.valuePlaceholder\": never;\n \"i18nStrings.addButton\": never;\n \"i18nStrings.removeButton\": never;\n \"i18nStrings.removeButtonAriaLabel\": {\n \"tag__key\": string | number;\n }\n \"i18nStrings.undoButton\": never;\n \"i18nStrings.undoPrompt\": never;\n \"i18nStrings.loading\": never;\n \"i18nStrings.keyHeader\": never;\n \"i18nStrings.valueHeader\": never;\n \"i18nStrings.optional\": never;\n \"i18nStrings.keySuggestion\": never;\n \"i18nStrings.valueSuggestion\": never;\n \"i18nStrings.emptyTags\": never;\n \"i18nStrings.tooManyKeysSuggestion\": never;\n \"i18nStrings.tooManyValuesSuggestion\": never;\n \"i18nStrings.keysSuggestionLoading\": never;\n \"i18nStrings.keysSuggestionError\": never;\n \"i18nStrings.valuesSuggestionLoading\": never;\n \"i18nStrings.valuesSuggestionError\": never;\n \"i18nStrings.emptyKeyError\": never;\n \"i18nStrings.maxKeyCharLengthError\": never;\n \"i18nStrings.maxValueCharLengthError\": never;\n \"i18nStrings.duplicateKeyError\": never;\n \"i18nStrings.invalidKeyError\": never;\n \"i18nStrings.invalidValueError\": never;\n \"i18nStrings.awsPrefixError\": never;\n \"i18nStrings.tagLimitReached\": {\n \"tagLimit\": number;\n }\n \"i18nStrings.tagLimitExceeded\": {\n \"tagLimit\": number;\n }\n \"i18nStrings.tagLimit\": {\n \"tagLimitAvailable\": string;\n \"availableTags\": number;\n \"tagLimit\": string | number;\n }\n }\n \"token-group\": {\n \"i18nStrings.limitShowFewer\": never;\n \"i18nStrings.limitShowMore\": never;\n }\n \"top-navigation\": {\n \"i18nStrings.searchIconAriaLabel\": never;\n \"i18nStrings.searchDismissIconAriaLabel\": never;\n \"i18nStrings.overflowMenuTriggerText\": never;\n \"i18nStrings.overflowMenuDismissIconAriaLabel\": never;\n \"i18nStrings.overflowMenuBackIconAriaLabel\": never;\n \"i18nStrings.overflowMenuTitleText\": never;\n }\n \"tutorial-panel\": {\n \"i18nStrings.loadingText\": never;\n \"i18nStrings.tutorialListTitle\": never;\n \"i18nStrings.tutorialListDownloadLinkText\": never;\n \"i18nStrings.labelTutorialListDownloadLink\": never;\n \"i18nStrings.tutorialCompletedText\": never;\n \"i18nStrings.learnMoreLinkText\": never;\n \"i18nStrings.startTutorialButtonText\": never;\n \"i18nStrings.restartTutorialButtonText\": never;\n \"i18nStrings.completionScreenTitle\": never;\n \"i18nStrings.feedbackLinkText\": never;\n \"i18nStrings.dismissTutorialButtonText\": never;\n \"i18nStrings.taskTitle\": {\n \"taskNumber\": string | number;\n \"taskTitle\": string | number;\n }\n \"i18nStrings.stepTitle\": {\n \"stepNumber\": string | number;\n \"stepTitle\": string | number;\n }\n \"i18nStrings.labelExitTutorial\": never;\n \"i18nStrings.labelTotalSteps\": {\n \"totalStepCount\": string | number;\n }\n \"i18nStrings.labelsTaskStatus.pending\": never;\n \"i18nStrings.labelsTaskStatus.in-progress\": never;\n \"i18nStrings.labelsTaskStatus.success\": never;\n }\n \"wizard\": {\n \"i18nStrings.stepNumberLabel\": {\n \"stepNumber\": string | number;\n }\n \"i18nStrings.collapsedStepsLabel\": {\n \"stepNumber\": string | number;\n \"stepsCount\": string | number;\n }\n \"i18nStrings.skipToButtonLabel\": {\n \"task__title\": string | number;\n }\n \"i18nStrings.navigationAriaLabel\": never;\n \"i18nStrings.cancelButton\": never;\n \"i18nStrings.previousButton\": never;\n \"i18nStrings.nextButton\": never;\n \"i18nStrings.optional\": never;\n \"i18nStrings.nextButtonLoadingAnnouncement\": never;\n \"i18nStrings.submitButtonLoadingAnnouncement\": never;\n }\n}"]}
|
|
1
|
+
{"version":3,"file":"messages-types.js","sourceRoot":"","sources":["../../../src/i18n/messages-types.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n/* eslint-disable prettier/prettier */\n\n/** Auto-generated argument types based on \"en\" i18n strings. Do not edit manually. */\nexport interface I18nFormatArgTypes {\n \"[charts]\": {\n \"loadingText\": never;\n \"errorText\": never;\n \"recoveryText\": never;\n \"i18nStrings.filterLabel\": never;\n \"i18nStrings.filterPlaceholder\": never;\n \"i18nStrings.legendAriaLabel\": never;\n \"i18nStrings.chartAriaRoleDescription\": never;\n \"i18nStrings.xAxisAriaRoleDescription\": never;\n \"i18nStrings.yAxisAriaRoleDescription\": never;\n }\n \"alert\": {\n \"dismissAriaLabel\": never;\n }\n \"annotation-context\": {\n \"i18nStrings.nextButtonText\": never;\n \"i18nStrings.previousButtonText\": never;\n \"i18nStrings.finishButtonText\": never;\n \"i18nStrings.labelDismissAnnotation\": never;\n \"i18nStrings.stepCounterText\": {\n \"stepNumber\": string | number;\n \"totalStepCount\": string | number;\n }\n \"i18nStrings.taskTitle\": {\n \"taskNumber\": string | number;\n \"taskTitle\": string | number;\n }\n \"i18nStrings.labelHotspot\": {\n \"openState\": string;\n \"stepNumber\": string | number;\n \"totalStepCount\": string | number;\n }\n }\n \"app-layout\": {\n \"ariaLabels.drawers\": never;\n \"ariaLabels.drawersOverflow\": never;\n \"ariaLabels.drawersOverflowWithBadge\": never;\n \"ariaLabels.navigation\": never;\n \"ariaLabels.navigationClose\": never;\n \"ariaLabels.navigationToggle\": never;\n \"ariaLabels.notifications\": never;\n \"ariaLabels.tools\": never;\n \"ariaLabels.toolsClose\": never;\n \"ariaLabels.toolsToggle\": never;\n }\n \"area-chart\": {\n \"i18nStrings.detailTotalLabel\": never;\n }\n \"attribute-editor\": {\n \"removeButtonText\": never;\n }\n \"autosuggest\": {\n \"errorIconAriaLabel\": never;\n \"selectedAriaLabel\": never;\n \"enteredTextLabel\": {\n \"value\": string | number;\n }\n \"recoveryText\": never;\n }\n \"breadcrumb-group\": {\n \"expandAriaLabel\": never;\n }\n \"calendar\": {\n \"nextMonthAriaLabel\": never;\n \"previousMonthAriaLabel\": never;\n \"todayAriaLabel\": never;\n \"i18nStrings.nextYearAriaLabel\": never;\n \"i18nStrings.previousYearAriaLabel\": never;\n \"i18nStrings.currentMonthAriaLabel\": never;\n }\n \"cards\": {\n \"ariaLabels.selectionGroupLabel\": never;\n }\n \"code-editor\": {\n \"i18nStrings.loadingState\": never;\n \"i18nStrings.errorState\": never;\n \"i18nStrings.errorStateRecovery\": never;\n \"i18nStrings.editorGroupAriaLabel\": never;\n \"i18nStrings.statusBarGroupAriaLabel\": never;\n \"i18nStrings.cursorPosition\": {\n \"row\": string | number;\n \"column\": string | number;\n }\n \"i18nStrings.errorsTab\": never;\n \"i18nStrings.warningsTab\": never;\n \"i18nStrings.preferencesButtonAriaLabel\": never;\n \"i18nStrings.paneCloseButtonAriaLabel\": never;\n \"i18nStrings.preferencesModalHeader\": never;\n \"i18nStrings.preferencesModalCancel\": never;\n \"i18nStrings.preferencesModalConfirm\": never;\n \"i18nStrings.preferencesModalWrapLines\": never;\n \"i18nStrings.preferencesModalTheme\": never;\n \"i18nStrings.preferencesModalLightThemes\": never;\n \"i18nStrings.preferencesModalDarkThemes\": never;\n }\n \"collection-preferences\": {\n \"title\": never;\n \"confirmLabel\": never;\n \"cancelLabel\": never;\n \"pageSizePreference.title\": never;\n \"wrapLinesPreference.label\": never;\n \"wrapLinesPreference.description\": never;\n \"stripedRowsPreference.label\": never;\n \"stripedRowsPreference.description\": never;\n \"contentDensityPreference.label\": never;\n \"contentDensityPreference.description\": never;\n \"contentDisplayPreference.title\": never;\n \"contentDisplayPreference.description\": never;\n \"contentDisplayPreference.dragHandleAriaLabel\": never;\n \"contentDisplayPreference.dragHandleAriaDescription\": never;\n \"contentDisplayPreference.liveAnnouncementDndStarted\": {\n \"position\": string | number;\n \"total\": string | number;\n }\n \"contentDisplayPreference.liveAnnouncementDndDiscarded\": never;\n \"contentDisplayPreference.liveAnnouncementDndItemReordered\": {\n \"isInitialPosition\": string;\n \"currentPosition\": string | number;\n \"total\": string | number;\n }\n \"contentDisplayPreference.liveAnnouncementDndItemCommitted\": {\n \"isInitialPosition\": string;\n \"initialPosition\": string | number;\n \"total\": string | number;\n \"finalPosition\": string | number;\n }\n }\n \"copy-to-clipboard\": {\n \"i18nStrings.copyButtonText\": never;\n }\n \"date-range-picker\": {\n \"i18nStrings.relativeModeTitle\": never;\n \"i18nStrings.absoluteModeTitle\": never;\n \"i18nStrings.relativeRangeSelectionHeading\": never;\n \"i18nStrings.cancelButtonLabel\": never;\n \"i18nStrings.clearButtonLabel\": never;\n \"i18nStrings.applyButtonLabel\": never;\n \"i18nStrings.customRelativeRangeOptionLabel\": never;\n \"i18nStrings.customRelativeRangeOptionDescription\": never;\n \"i18nStrings.customRelativeRangeUnitLabel\": never;\n \"i18nStrings.customRelativeRangeDurationLabel\": never;\n \"i18nStrings.customRelativeRangeDurationPlaceholder\": never;\n \"i18nStrings.startDateLabel\": never;\n \"i18nStrings.startTimeLabel\": never;\n \"i18nStrings.endDateLabel\": never;\n \"i18nStrings.endTimeLabel\": never;\n \"i18nStrings.dateTimeConstraintText\": never;\n \"i18nStrings.errorIconAriaLabel\": never;\n \"i18nStrings.renderSelectedAbsoluteRangeAriaLive\": {\n \"startDate\": string | number;\n \"endDate\": string | number;\n }\n \"i18nStrings.formatRelativeRange\": {\n \"unit\": string;\n \"amount\": number;\n }\n \"i18nStrings.formatUnit\": {\n \"unit\": string;\n \"amount\": number;\n }\n }\n \"drawer\": {\n \"i18nStrings.loadingText\": never;\n }\n \"flashbar\": {\n \"i18nStrings.ariaLabel\": never;\n \"i18nStrings.errorIconAriaLabel\": never;\n \"i18nStrings.inProgressIconAriaLabel\": never;\n \"i18nStrings.infoIconAriaLabel\": never;\n \"i18nStrings.notificationBarAriaLabel\": never;\n \"i18nStrings.notificationBarText\": never;\n \"i18nStrings.successIconAriaLabel\": never;\n \"i18nStrings.warningIconAriaLabel\": never;\n }\n \"form-field\": {\n \"i18nStrings.errorIconAriaLabel\": never;\n \"i18nStrings.warningIconAriaLabel\": never;\n }\n \"form\": {\n \"errorIconAriaLabel\": never;\n }\n \"help-panel\": {\n \"loadingText\": never;\n }\n \"input\": {\n \"clearAriaLabel\": never;\n }\n \"link\": {\n \"externalIconAriaLabel\": never;\n }\n \"modal\": {\n \"closeAriaLabel\": never;\n }\n \"multiselect\": {\n \"deselectAriaLabel\": {\n \"option__label\": string | number;\n }\n }\n \"pagination\": {\n \"ariaLabels.nextPageLabel\": never;\n \"ariaLabels.pageLabel\": {\n \"pageNumber\": string | number;\n }\n \"ariaLabels.previousPageLabel\": never;\n }\n \"pie-chart\": {\n \"i18nStrings.detailsValue\": never;\n \"i18nStrings.detailsPercentage\": never;\n \"i18nStrings.chartAriaRoleDescription\": never;\n \"i18nStrings.segmentAriaRoleDescription\": never;\n }\n \"popover\": {\n \"dismissAriaLabel\": never;\n }\n \"property-filter\": {\n \"i18nStrings.allPropertiesLabel\": never;\n \"i18nStrings.applyActionText\": never;\n \"i18nStrings.cancelActionText\": never;\n \"i18nStrings.clearFiltersText\": never;\n \"i18nStrings.editTokenHeader\": never;\n \"i18nStrings.groupPropertiesText\": never;\n \"i18nStrings.groupValuesText\": never;\n \"i18nStrings.operationAndText\": never;\n \"i18nStrings.operationOrText\": never;\n \"i18nStrings.operatorContainsText\": never;\n \"i18nStrings.operatorDoesNotContainText\": never;\n \"i18nStrings.operatorDoesNotEqualText\": never;\n \"i18nStrings.operatorEqualsText\": never;\n \"i18nStrings.operatorGreaterOrEqualText\": never;\n \"i18nStrings.operatorGreaterText\": never;\n \"i18nStrings.operatorLessOrEqualText\": never;\n \"i18nStrings.operatorLessText\": never;\n \"i18nStrings.operatorStartsWithText\": never;\n \"i18nStrings.operatorDoesNotStartWithText\": never;\n \"i18nStrings.operatorText\": never;\n \"i18nStrings.operatorsText\": never;\n \"i18nStrings.propertyText\": never;\n \"i18nStrings.tokenLimitShowFewer\": never;\n \"i18nStrings.tokenLimitShowMore\": never;\n \"i18nStrings.valueText\": never;\n \"i18nStrings.removeTokenButtonAriaLabel\": {\n \"token__operator\": string;\n \"token__propertyKey\": string | number;\n \"token__value\": string | number;\n }\n }\n \"s3-resource-selector\": {\n \"i18nStrings.inContextSelectPlaceholder\": never;\n \"i18nStrings.inContextBrowseButton\": never;\n \"i18nStrings.inContextViewButton\": never;\n \"i18nStrings.inContextViewButtonAriaLabel\": never;\n \"i18nStrings.inContextLoadingText\": never;\n \"i18nStrings.inContextUriLabel\": never;\n \"i18nStrings.inContextVersionSelectLabel\": never;\n \"i18nStrings.modalTitle\": never;\n \"i18nStrings.modalCancelButton\": never;\n \"i18nStrings.modalSubmitButton\": never;\n \"i18nStrings.modalBreadcrumbRootItem\": never;\n \"i18nStrings.selectionBuckets\": never;\n \"i18nStrings.selectionObjects\": never;\n \"i18nStrings.selectionVersions\": never;\n \"i18nStrings.selectionBucketsSearchPlaceholder\": never;\n \"i18nStrings.selectionObjectsSearchPlaceholder\": never;\n \"i18nStrings.selectionVersionsSearchPlaceholder\": never;\n \"i18nStrings.selectionBucketsLoading\": never;\n \"i18nStrings.selectionBucketsNoItems\": never;\n \"i18nStrings.selectionObjectsLoading\": never;\n \"i18nStrings.selectionObjectsNoItems\": never;\n \"i18nStrings.selectionVersionsLoading\": never;\n \"i18nStrings.selectionVersionsNoItems\": never;\n \"i18nStrings.filteringNoMatches\": never;\n \"i18nStrings.filteringCantFindMatch\": never;\n \"i18nStrings.clearFilterButtonText\": never;\n \"i18nStrings.columnBucketID\": never;\n \"i18nStrings.columnBucketName\": never;\n \"i18nStrings.columnBucketCreationDate\": never;\n \"i18nStrings.columnBucketRegion\": never;\n \"i18nStrings.columnObjectKey\": never;\n \"i18nStrings.columnObjectLastModified\": never;\n \"i18nStrings.columnObjectSize\": never;\n \"i18nStrings.columnVersionID\": never;\n \"i18nStrings.columnVersionLastModified\": never;\n \"i18nStrings.columnVersionSize\": never;\n \"i18nStrings.validationPathMustBegin\": never;\n \"i18nStrings.validationBucketLowerCase\": never;\n \"i18nStrings.validationBucketMustNotContain\": never;\n \"i18nStrings.validationBucketLength\": never;\n \"i18nStrings.validationBucketMustComplyDns\": never;\n \"i18nStrings.labelSortedDescending\": {\n \"columnName\": string | number;\n }\n \"i18nStrings.labelSortedAscending\": {\n \"columnName\": string | number;\n }\n \"i18nStrings.labelNotSorted\": {\n \"columnName\": string | number;\n }\n \"i18nStrings.labelsBucketsSelection.selectionGroupLabel\": never;\n \"i18nStrings.labelsBucketsSelection.itemSelectionLabel\": {\n \"item__Name\": string | number;\n }\n \"i18nStrings.labelsObjectsSelection.selectionGroupLabel\": never;\n \"i18nStrings.labelsObjectsSelection.itemSelectionLabel\": {\n \"item__Key\": string | number;\n }\n \"i18nStrings.labelsVersionsSelection.selectionGroupLabel\": never;\n \"i18nStrings.labelsVersionsSelection.itemSelectionLabel\": {\n \"item__VersionId\": string | number;\n }\n \"i18nStrings.labelFiltering\": {\n \"itemsType\": string | number;\n }\n \"i18nStrings.labelRefresh\": never;\n \"i18nStrings.labelBreadcrumbs\": never;\n \"i18nStrings.filteringCounterText\": {\n \"count\": number;\n }\n }\n \"select\": {\n \"errorIconAriaLabel\": never;\n \"selectedAriaLabel\": never;\n \"recoveryText\": never;\n }\n \"slider\": {\n \"i18nStrings.valueTextRange\": {\n \"value\": string | number;\n \"previousValue\": string | number;\n \"nextValue\": string | number;\n }\n }\n \"split-panel\": {\n \"i18nStrings.closeButtonAriaLabel\": never;\n \"i18nStrings.openButtonAriaLabel\": never;\n \"i18nStrings.preferencesTitle\": never;\n \"i18nStrings.preferencesPositionLabel\": never;\n \"i18nStrings.preferencesPositionDescription\": never;\n \"i18nStrings.preferencesPositionSide\": never;\n \"i18nStrings.preferencesPositionBottom\": never;\n \"i18nStrings.preferencesConfirm\": never;\n \"i18nStrings.preferencesCancel\": never;\n \"i18nStrings.resizeHandleAriaLabel\": never;\n }\n \"table\": {\n \"ariaLabels.resizerRoleDescription\": never;\n \"ariaLabels.submittingEditText\": never;\n \"ariaLabels.successfulEditLabel\": never;\n \"ariaLabels.expandButtonLabel\": never;\n \"ariaLabels.collapseButtonLabel\": never;\n \"columnDefinitions.editConfig.errorIconAriaLabel\": never;\n \"columnDefinitions.editConfig.editIconAriaLabel\": never;\n }\n \"tabs\": {\n \"i18nStrings.scrollLeftAriaLabel\": never;\n \"i18nStrings.scrollRightAriaLabel\": never;\n \"i18nStrings.tabsWithActionsAriaRoleDescription\": never;\n }\n \"tag-editor\": {\n \"i18nStrings.keyPlaceholder\": never;\n \"i18nStrings.valuePlaceholder\": never;\n \"i18nStrings.addButton\": never;\n \"i18nStrings.removeButton\": never;\n \"i18nStrings.removeButtonAriaLabel\": {\n \"tag__key\": string | number;\n }\n \"i18nStrings.undoButton\": never;\n \"i18nStrings.undoPrompt\": never;\n \"i18nStrings.loading\": never;\n \"i18nStrings.keyHeader\": never;\n \"i18nStrings.valueHeader\": never;\n \"i18nStrings.optional\": never;\n \"i18nStrings.keySuggestion\": never;\n \"i18nStrings.valueSuggestion\": never;\n \"i18nStrings.emptyTags\": never;\n \"i18nStrings.tooManyKeysSuggestion\": never;\n \"i18nStrings.tooManyValuesSuggestion\": never;\n \"i18nStrings.keysSuggestionLoading\": never;\n \"i18nStrings.keysSuggestionError\": never;\n \"i18nStrings.valuesSuggestionLoading\": never;\n \"i18nStrings.valuesSuggestionError\": never;\n \"i18nStrings.emptyKeyError\": never;\n \"i18nStrings.maxKeyCharLengthError\": never;\n \"i18nStrings.maxValueCharLengthError\": never;\n \"i18nStrings.duplicateKeyError\": never;\n \"i18nStrings.invalidKeyError\": never;\n \"i18nStrings.invalidValueError\": never;\n \"i18nStrings.awsPrefixError\": never;\n \"i18nStrings.tagLimitReached\": {\n \"tagLimit\": number;\n }\n \"i18nStrings.tagLimitExceeded\": {\n \"tagLimit\": number;\n }\n \"i18nStrings.tagLimit\": {\n \"tagLimitAvailable\": string;\n \"availableTags\": number;\n \"tagLimit\": string | number;\n }\n }\n \"token-group\": {\n \"i18nStrings.limitShowFewer\": never;\n \"i18nStrings.limitShowMore\": never;\n }\n \"top-navigation\": {\n \"i18nStrings.searchIconAriaLabel\": never;\n \"i18nStrings.searchDismissIconAriaLabel\": never;\n \"i18nStrings.overflowMenuTriggerText\": never;\n \"i18nStrings.overflowMenuDismissIconAriaLabel\": never;\n \"i18nStrings.overflowMenuBackIconAriaLabel\": never;\n \"i18nStrings.overflowMenuTitleText\": never;\n }\n \"tutorial-panel\": {\n \"i18nStrings.loadingText\": never;\n \"i18nStrings.tutorialListTitle\": never;\n \"i18nStrings.tutorialListDownloadLinkText\": never;\n \"i18nStrings.labelTutorialListDownloadLink\": never;\n \"i18nStrings.tutorialCompletedText\": never;\n \"i18nStrings.learnMoreLinkText\": never;\n \"i18nStrings.startTutorialButtonText\": never;\n \"i18nStrings.restartTutorialButtonText\": never;\n \"i18nStrings.completionScreenTitle\": never;\n \"i18nStrings.feedbackLinkText\": never;\n \"i18nStrings.dismissTutorialButtonText\": never;\n \"i18nStrings.taskTitle\": {\n \"taskNumber\": string | number;\n \"taskTitle\": string | number;\n }\n \"i18nStrings.stepTitle\": {\n \"stepNumber\": string | number;\n \"stepTitle\": string | number;\n }\n \"i18nStrings.labelExitTutorial\": never;\n \"i18nStrings.labelTotalSteps\": {\n \"totalStepCount\": string | number;\n }\n \"i18nStrings.labelsTaskStatus.pending\": never;\n \"i18nStrings.labelsTaskStatus.in-progress\": never;\n \"i18nStrings.labelsTaskStatus.success\": never;\n }\n \"wizard\": {\n \"i18nStrings.stepNumberLabel\": {\n \"stepNumber\": string | number;\n }\n \"i18nStrings.collapsedStepsLabel\": {\n \"stepNumber\": string | number;\n \"stepsCount\": string | number;\n }\n \"i18nStrings.skipToButtonLabel\": {\n \"task__title\": string | number;\n }\n \"i18nStrings.navigationAriaLabel\": never;\n \"i18nStrings.cancelButton\": never;\n \"i18nStrings.previousButton\": never;\n \"i18nStrings.nextButton\": never;\n \"i18nStrings.optional\": never;\n \"i18nStrings.nextButtonLoadingAnnouncement\": never;\n \"i18nStrings.submitButtonLoadingAnnouncement\": never;\n }\n}\n"]}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { BaseComponentProps } from '../internal/base-component';
|
|
3
3
|
import { NonCancelableEventHandler } from '../internal/events';
|
|
4
|
+
import { ButtonProps } from '../button/interfaces';
|
|
4
5
|
export interface TabsProps extends BaseComponentProps {
|
|
5
6
|
/**
|
|
6
7
|
* Specifies the tabs to display. Each tab object has the following properties:
|
|
@@ -9,6 +10,13 @@ export interface TabsProps extends BaseComponentProps {
|
|
|
9
10
|
* - `label` (ReactNode) - Tab label shown in the UI.
|
|
10
11
|
* - `content` (ReactNode) - (Optional) Tab content to render in the container.
|
|
11
12
|
* - `disabled` (boolean) - (Optional) Specifies if this tab is disabled.
|
|
13
|
+
* - `dismissible` (boolean) - (Optional) Determines whether the tab includes a dismiss icon button. By default, the dismiss button is not included.
|
|
14
|
+
* - `dismissLabel` (boolean) - (Optional) Specifies an aria-label for the dismiss icon button.
|
|
15
|
+
* - `dismissDisabled` (boolean) - (Optional) Determines whether the dismiss button is disabled.
|
|
16
|
+
* - `action` (ReactNode) - (Optional) Action for the tab, rendered next to its corresponding label.
|
|
17
|
+
* Although it is technically possible to insert any content, our UX guidelines only allow you to add
|
|
18
|
+
* an icon button or icon button dropdown.
|
|
19
|
+
* - `onDismiss` (ButtonProps['onClick']) - (Optional) Called when a user clicks on the dismiss button.
|
|
12
20
|
* - `href` (string) - (Optional) You can use this parameter to change the default `href` of the internal tab anchor. The
|
|
13
21
|
* `click` event default behavior is prevented, unless the user clicks the tab with a key modifier (that is, CTRL,
|
|
14
22
|
* ALT, SHIFT, META). This enables the user to open new browser tabs with an initially selected component tab,
|
|
@@ -80,6 +88,29 @@ export declare namespace TabsProps {
|
|
|
80
88
|
* Whether this tab is disabled.
|
|
81
89
|
*/
|
|
82
90
|
disabled?: boolean;
|
|
91
|
+
/**
|
|
92
|
+
* (Optional) Determines whether the tab includes a dismiss icon button. By default, the dismiss button is not included.
|
|
93
|
+
* When a user clicks on this button the onDismiss handler is called.
|
|
94
|
+
*/
|
|
95
|
+
dismissible?: boolean;
|
|
96
|
+
/**
|
|
97
|
+
* (Optional) Specifies an aria-label for the dismiss icon button.
|
|
98
|
+
*/
|
|
99
|
+
dismissLabel?: string;
|
|
100
|
+
/**
|
|
101
|
+
* (Optional) Determines whether the dismiss button is disabled.
|
|
102
|
+
*/
|
|
103
|
+
dismissDisabled?: boolean;
|
|
104
|
+
/**
|
|
105
|
+
* (Optional) Action for the tab, rendered next to its corresponding label.
|
|
106
|
+
* Although it is technically possible to insert any content, our UX guidelines only allow you to add
|
|
107
|
+
* an icon button or icon button dropdown.
|
|
108
|
+
*/
|
|
109
|
+
action?: React.ReactNode;
|
|
110
|
+
/**
|
|
111
|
+
* (event => void) Called when a user clicks on the dismiss button.
|
|
112
|
+
*/
|
|
113
|
+
onDismiss?: ButtonProps['onClick'];
|
|
83
114
|
/**
|
|
84
115
|
* You can use this parameter to change the default `href` of the internal tab anchor. The
|
|
85
116
|
* `click` event default behavior is prevented, unless the user clicks the tab with a key modifier (CTRL,
|
|
@@ -108,6 +139,11 @@ export declare namespace TabsProps {
|
|
|
108
139
|
* ARIA label for the scroll right button that appears when the tab header is wider than the container.
|
|
109
140
|
*/
|
|
110
141
|
scrollRightAriaLabel?: string;
|
|
142
|
+
/**
|
|
143
|
+
* ARIA role description for the Tabs component when an action or dismissible prop is in use. This is used
|
|
144
|
+
* with role="application" to provide further information on the purpose of this component
|
|
145
|
+
*/
|
|
146
|
+
tabsWithActionsAriaRoleDescription?: string;
|
|
111
147
|
}
|
|
112
148
|
}
|
|
113
149
|
//# sourceMappingURL=interfaces.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/tabs/interfaces.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/tabs/interfaces.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD,MAAM,WAAW,SAAU,SAAQ,kBAAkB;IACnD;;;;;;;;;;;;;;;;;;;OAmBG;IACH,IAAI,EAAE,aAAa,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;IAEnC;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC;IAE5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;IAE7D;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IAEjC;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AACD,yBAAiB,SAAS,CAAC;IACzB,KAAY,OAAO,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC;IAE1D,UAAiB,GAAG;QAClB;;WAEG;QACH,EAAE,EAAE,MAAM,CAAC;QACX;;WAEG;QACH,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB;;WAEG;QACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC1B;;WAEG;QACH,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB;;;WAGG;QACH,WAAW,CAAC,EAAE,OAAO,CAAC;QACtB;;WAEG;QACH,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB;;WAEG;QACH,eAAe,CAAC,EAAE,OAAO,CAAC;QAC1B;;;;WAIG;QACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QACzB;;WAEG;QACH,SAAS,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;QACnC;;;;;;WAMG;QACH,IAAI,CAAC,EAAE,MAAM,CAAC;KACf;IAED,UAAiB,YAAY;QAC3B;;WAEG;QACH,WAAW,EAAE,MAAM,CAAC;QACpB;;WAEG;QACH,aAAa,CAAC,EAAE,MAAM,CAAC;KACxB;IAED,UAAiB,WAAW;QAC1B;;WAEG;QACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B;;WAEG;QACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B;;;WAGG;QACH,kCAAkC,CAAC,EAAE,MAAM,CAAC;KAC7C;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/tabs/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\n\nexport interface TabsProps extends BaseComponentProps {\n /**\n * Specifies the tabs to display. Each tab object has the following properties:\n *\n * - `id` (string) - The tab identifier. This value needs to be passed to the Tabs component as `activeTabId` to select this tab.\n * - `label` (ReactNode) - Tab label shown in the UI.\n * - `content` (ReactNode) - (Optional) Tab content to render in the container.\n * - `disabled` (boolean) - (Optional) Specifies if this tab is disabled.\n * - `href` (string) - (Optional) You can use this parameter to change the default `href` of the internal tab anchor. The\n * `click` event default behavior is prevented, unless the user clicks the tab with a key modifier (that is, CTRL,\n * ALT, SHIFT, META). This enables the user to open new browser tabs with an initially selected component tab,\n * if your application routing can handle such deep links. You can manually update routing on the current page\n * using the `activeTabHref` property of the `change` event's detail.\n */\n tabs: ReadonlyArray<TabsProps.Tab>;\n\n /**\n * The possible visual variants of tabs are the following:\n * * `default` - Use in any context.\n * * `container` - Use this variant to have the tabs displayed within a container header.\n * * `stacked` - Use this variant directly adjacent to other stacked containers (such as a container, table).\n * @visualrefresh `stacked` variant\n */\n variant?: TabsProps.Variant;\n\n /**\n * Called whenever the user selects a different tab.\n * The event's `detail` contains the new `activeTabId`.\n */\n onChange?: NonCancelableEventHandler<TabsProps.ChangeDetail>;\n\n /**\n * The `id` of the currently active tab.\n * * If you don't set this property, the component activates the first tab and switches tabs automatically when a tab header is clicked (that is, uncontrolled behavior).\n * * If you explicitly set this property, you must set define an `onChange` handler to update the property when a tab header is clicked (that is, controlled behavior).\n */\n activeTabId?: string;\n\n /**\n * Provides an `aria-label` to the tab container.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabel?: string;\n\n /**\n * Sets the `aria-labelledby` property on the tab container.\n * If there's a visible label element that you can reference, use this instead of `ariaLabel`.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabelledby?: string;\n\n /**\n * Determines whether the tab content has padding. If `true`, removes the default padding from the tab content area.\n */\n disableContentPaddings?: boolean;\n\n /**\n * An object containing all the necessary localized strings required by the component.\n * @i18n\n */\n i18nStrings?: TabsProps.I18nStrings;\n /**\n * Enabling this property makes the tab content fit to the available height.\n * If the tab content is too short, it will stretch. If the tab content is too long, a vertical scrollbar will be shown.\n */\n fitHeight?: boolean;\n}\nexport namespace TabsProps {\n export type Variant = 'default' | 'container' | 'stacked';\n\n export interface Tab {\n /**\n * The tab id. This value will be need to be passed to the Tabs component as `activeTabId` to select this tab.\n */\n id: string;\n /**\n * Tab label shown in the UI.\n */\n label: React.ReactNode;\n /**\n * Tab content to render in the container.\n */\n content?: React.ReactNode;\n /**\n * Whether this tab is disabled.\n */\n disabled?: boolean;\n /**\n * You can use this parameter to change the default `href` of the internal tab anchor. The\n * `click` event default behavior is prevented, unless the user clicks the tab with a key modifier (CTRL,\n * ALT, SHIFT, META). This allows to open new browser tabs with an initially selected component tab,\n * when the routing can handle such deep links. You can manually update routing on the current page\n * using the `activeTabHref` property of the `change` event's detail.\n */\n href?: string;\n }\n\n export interface ChangeDetail {\n /**\n * The ID of the clicked tab.\n */\n activeTabId: string;\n /**\n * The `href` attribute of the clicked tab, if defined.\n */\n activeTabHref?: string;\n }\n\n export interface I18nStrings {\n /**\n * ARIA label for the scroll left button that appears when the tab header is wider than the container.\n */\n scrollLeftAriaLabel?: string;\n /**\n * ARIA label for the scroll right button that appears when the tab header is wider than the container.\n */\n scrollRightAriaLabel?: string;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/tabs/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { ButtonProps } from '../button/interfaces';\n\nexport interface TabsProps extends BaseComponentProps {\n /**\n * Specifies the tabs to display. Each tab object has the following properties:\n *\n * - `id` (string) - The tab identifier. This value needs to be passed to the Tabs component as `activeTabId` to select this tab.\n * - `label` (ReactNode) - Tab label shown in the UI.\n * - `content` (ReactNode) - (Optional) Tab content to render in the container.\n * - `disabled` (boolean) - (Optional) Specifies if this tab is disabled.\n * - `dismissible` (boolean) - (Optional) Determines whether the tab includes a dismiss icon button. By default, the dismiss button is not included.\n * - `dismissLabel` (boolean) - (Optional) Specifies an aria-label for the dismiss icon button.\n * - `dismissDisabled` (boolean) - (Optional) Determines whether the dismiss button is disabled.\n * - `action` (ReactNode) - (Optional) Action for the tab, rendered next to its corresponding label.\n * Although it is technically possible to insert any content, our UX guidelines only allow you to add\n * an icon button or icon button dropdown.\n * - `onDismiss` (ButtonProps['onClick']) - (Optional) Called when a user clicks on the dismiss button.\n * - `href` (string) - (Optional) You can use this parameter to change the default `href` of the internal tab anchor. The\n * `click` event default behavior is prevented, unless the user clicks the tab with a key modifier (that is, CTRL,\n * ALT, SHIFT, META). This enables the user to open new browser tabs with an initially selected component tab,\n * if your application routing can handle such deep links. You can manually update routing on the current page\n * using the `activeTabHref` property of the `change` event's detail.\n */\n tabs: ReadonlyArray<TabsProps.Tab>;\n\n /**\n * The possible visual variants of tabs are the following:\n * * `default` - Use in any context.\n * * `container` - Use this variant to have the tabs displayed within a container header.\n * * `stacked` - Use this variant directly adjacent to other stacked containers (such as a container, table).\n * @visualrefresh `stacked` variant\n */\n variant?: TabsProps.Variant;\n\n /**\n * Called whenever the user selects a different tab.\n * The event's `detail` contains the new `activeTabId`.\n */\n onChange?: NonCancelableEventHandler<TabsProps.ChangeDetail>;\n\n /**\n * The `id` of the currently active tab.\n * * If you don't set this property, the component activates the first tab and switches tabs automatically when a tab header is clicked (that is, uncontrolled behavior).\n * * If you explicitly set this property, you must set define an `onChange` handler to update the property when a tab header is clicked (that is, controlled behavior).\n */\n activeTabId?: string;\n\n /**\n * Provides an `aria-label` to the tab container.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabel?: string;\n\n /**\n * Sets the `aria-labelledby` property on the tab container.\n * If there's a visible label element that you can reference, use this instead of `ariaLabel`.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabelledby?: string;\n\n /**\n * Determines whether the tab content has padding. If `true`, removes the default padding from the tab content area.\n */\n disableContentPaddings?: boolean;\n\n /**\n * An object containing all the necessary localized strings required by the component.\n * @i18n\n */\n i18nStrings?: TabsProps.I18nStrings;\n /**\n * Enabling this property makes the tab content fit to the available height.\n * If the tab content is too short, it will stretch. If the tab content is too long, a vertical scrollbar will be shown.\n */\n fitHeight?: boolean;\n}\nexport namespace TabsProps {\n export type Variant = 'default' | 'container' | 'stacked';\n\n export interface Tab {\n /**\n * The tab id. This value will be need to be passed to the Tabs component as `activeTabId` to select this tab.\n */\n id: string;\n /**\n * Tab label shown in the UI.\n */\n label: React.ReactNode;\n /**\n * Tab content to render in the container.\n */\n content?: React.ReactNode;\n /**\n * Whether this tab is disabled.\n */\n disabled?: boolean;\n /**\n * (Optional) Determines whether the tab includes a dismiss icon button. By default, the dismiss button is not included.\n * When a user clicks on this button the onDismiss handler is called.\n */\n dismissible?: boolean;\n /**\n * (Optional) Specifies an aria-label for the dismiss icon button.\n */\n dismissLabel?: string;\n /**\n * (Optional) Determines whether the dismiss button is disabled.\n */\n dismissDisabled?: boolean;\n /**\n * (Optional) Action for the tab, rendered next to its corresponding label.\n * Although it is technically possible to insert any content, our UX guidelines only allow you to add\n * an icon button or icon button dropdown.\n */\n action?: React.ReactNode;\n /**\n * (event => void) Called when a user clicks on the dismiss button.\n */\n onDismiss?: ButtonProps['onClick'];\n /**\n * You can use this parameter to change the default `href` of the internal tab anchor. The\n * `click` event default behavior is prevented, unless the user clicks the tab with a key modifier (CTRL,\n * ALT, SHIFT, META). This allows to open new browser tabs with an initially selected component tab,\n * when the routing can handle such deep links. You can manually update routing on the current page\n * using the `activeTabHref` property of the `change` event's detail.\n */\n href?: string;\n }\n\n export interface ChangeDetail {\n /**\n * The ID of the clicked tab.\n */\n activeTabId: string;\n /**\n * The `href` attribute of the clicked tab, if defined.\n */\n activeTabHref?: string;\n }\n\n export interface I18nStrings {\n /**\n * ARIA label for the scroll left button that appears when the tab header is wider than the container.\n */\n scrollLeftAriaLabel?: string;\n /**\n * ARIA label for the scroll right button that appears when the tab header is wider than the container.\n */\n scrollRightAriaLabel?: string;\n /**\n * ARIA role description for the Tabs component when an action or dismissible prop is in use. This is used\n * with role=\"application\" to provide further information on the purpose of this component\n */\n tabsWithActionsAriaRoleDescription?: string;\n }\n}\n"]}
|
|
@@ -1,27 +1,30 @@
|
|
|
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-
|
|
14
|
-
"
|
|
15
|
-
"tabs-tab-
|
|
16
|
-
"
|
|
17
|
-
"tabs-
|
|
18
|
-
"
|
|
19
|
-
"tabs": "
|
|
20
|
-
"tabs-
|
|
21
|
-
"
|
|
22
|
-
"tabs
|
|
23
|
-
"tabs-content
|
|
24
|
-
"
|
|
25
|
-
"tabs-
|
|
4
|
+
"tabs-header": "awsui_tabs-header_14rmt_104vw_194",
|
|
5
|
+
"tabs-header-list": "awsui_tabs-header-list_14rmt_104vw_202",
|
|
6
|
+
"pagination-button": "awsui_pagination-button_14rmt_104vw_219",
|
|
7
|
+
"pagination-button-left": "awsui_pagination-button-left_14rmt_104vw_226",
|
|
8
|
+
"pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_104vw_229",
|
|
9
|
+
"pagination-button-right": "awsui_pagination-button-right_14rmt_104vw_233",
|
|
10
|
+
"pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_104vw_236",
|
|
11
|
+
"tabs-tab": "awsui_tabs-tab_14rmt_104vw_241",
|
|
12
|
+
"tabs-tab-label": "awsui_tabs-tab-label_14rmt_104vw_250",
|
|
13
|
+
"tabs-tab-dismiss": "awsui_tabs-tab-dismiss_14rmt_104vw_261",
|
|
14
|
+
"tabs-tab-action": "awsui_tabs-tab-action_14rmt_104vw_262",
|
|
15
|
+
"tabs-tab-header-container": "awsui_tabs-tab-header-container_14rmt_104vw_266",
|
|
16
|
+
"refresh": "awsui_refresh_14rmt_104vw_281",
|
|
17
|
+
"tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_104vw_285",
|
|
18
|
+
"tabs-tab-link": "awsui_tabs-tab-link_14rmt_104vw_327",
|
|
19
|
+
"tabs-tab-active": "awsui_tabs-tab-active_14rmt_104vw_404",
|
|
20
|
+
"tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_104vw_411",
|
|
21
|
+
"root": "awsui_root_14rmt_104vw_415",
|
|
22
|
+
"tabs": "awsui_tabs_14rmt_104vw_194",
|
|
23
|
+
"tabs-content": "awsui_tabs-content_14rmt_104vw_456",
|
|
24
|
+
"fit-height": "awsui_fit-height_14rmt_104vw_460",
|
|
25
|
+
"tabs-content-active": "awsui_tabs-content-active_14rmt_104vw_466",
|
|
26
|
+
"tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_104vw_480",
|
|
27
|
+
"with-paddings": "awsui_with-paddings_14rmt_104vw_480",
|
|
28
|
+
"tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_104vw_491"
|
|
26
29
|
};
|
|
27
30
|
|
|
@@ -191,7 +191,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
191
191
|
SPDX-License-Identifier: Apache-2.0
|
|
192
192
|
*/
|
|
193
193
|
/* stylelint-disable selector-max-type */
|
|
194
|
-
.awsui_tabs-
|
|
194
|
+
.awsui_tabs-header_14rmt_104vw_194:not(#\9) {
|
|
195
195
|
margin-block: 0;
|
|
196
196
|
margin-inline: 0;
|
|
197
197
|
padding-block: 0;
|
|
@@ -199,7 +199,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
199
199
|
display: flex;
|
|
200
200
|
}
|
|
201
201
|
|
|
202
|
-
.awsui_tabs-header-
|
|
202
|
+
.awsui_tabs-header-list_14rmt_104vw_202:not(#\9) {
|
|
203
203
|
margin-block: 0;
|
|
204
204
|
margin-inline: 0;
|
|
205
205
|
padding-block: 0;
|
|
@@ -212,33 +212,33 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
212
212
|
-ms-overflow-style: none; /* Internet Explorer 10+ */
|
|
213
213
|
scrollbar-width: none; /* Firefox */
|
|
214
214
|
}
|
|
215
|
-
.awsui_tabs-header-
|
|
215
|
+
.awsui_tabs-header-list_14rmt_104vw_202:not(#\9)::-webkit-scrollbar {
|
|
216
216
|
display: none; /* Safari and Chrome */
|
|
217
217
|
}
|
|
218
218
|
|
|
219
|
-
.awsui_pagination-
|
|
219
|
+
.awsui_pagination-button_14rmt_104vw_219:not(#\9) {
|
|
220
220
|
margin-block: var(--space-scaled-s-9q8n2q, 12px);
|
|
221
221
|
margin-inline: 0;
|
|
222
222
|
padding-block: 0;
|
|
223
223
|
padding-inline: var(--space-xxs-9rrxti, 4px);
|
|
224
224
|
display: flex;
|
|
225
225
|
}
|
|
226
|
-
.awsui_pagination-button-
|
|
226
|
+
.awsui_pagination-button-left_14rmt_104vw_226:not(#\9) {
|
|
227
227
|
border-inline-end: var(--border-divider-section-width-wl9k66, 1px) solid var(--color-border-control-disabled-4hz3mo, #d5dbdb);
|
|
228
228
|
}
|
|
229
|
-
.awsui_pagination-button-left-
|
|
229
|
+
.awsui_pagination-button-left-scrollable_14rmt_104vw_229:not(#\9) {
|
|
230
230
|
z-index: 1;
|
|
231
231
|
box-shadow: 5px 0px 4px -3px var(--color-border-tabs-shadow-vlaodw, #eaeded), 1px 0px 0px 0px var(--color-border-tabs-shadow-vlaodw, #eaeded);
|
|
232
232
|
}
|
|
233
|
-
.awsui_pagination-button-
|
|
233
|
+
.awsui_pagination-button-right_14rmt_104vw_233:not(#\9) {
|
|
234
234
|
border-inline-start: var(--border-divider-section-width-wl9k66, 1px) solid var(--color-border-control-disabled-4hz3mo, #d5dbdb);
|
|
235
235
|
}
|
|
236
|
-
.awsui_pagination-button-right-
|
|
236
|
+
.awsui_pagination-button-right-scrollable_14rmt_104vw_236:not(#\9) {
|
|
237
237
|
z-index: 1;
|
|
238
238
|
box-shadow: -5px 0px 4px -3px var(--color-border-tabs-shadow-vlaodw, #eaeded), -1px 0px 0px 0 var(--color-border-tabs-shadow-vlaodw, #eaeded);
|
|
239
239
|
}
|
|
240
240
|
|
|
241
|
-
.awsui_tabs-
|
|
241
|
+
.awsui_tabs-tab_14rmt_104vw_241:not(#\9) {
|
|
242
242
|
list-style: none;
|
|
243
243
|
padding-block: 0;
|
|
244
244
|
padding-inline: 0;
|
|
@@ -246,34 +246,92 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
246
246
|
display: flex;
|
|
247
247
|
max-inline-size: calc(90% - var(--space-l-xu1x80, 20px));
|
|
248
248
|
}
|
|
249
|
-
.awsui_tabs-tab_14rmt_1wh1q_241 > button:not(#\9) {
|
|
250
|
-
background-color: transparent;
|
|
251
|
-
}
|
|
252
249
|
|
|
253
|
-
.awsui_tabs-tab-
|
|
250
|
+
.awsui_tabs-tab-label_14rmt_104vw_250:not(#\9) {
|
|
254
251
|
display: flex;
|
|
255
252
|
align-items: center;
|
|
253
|
+
padding-inline: var(--space-xs-xf5ch3, 8px);
|
|
256
254
|
padding-block: var(--space-scaled-2x-xxs-r5f1ts, 4px);
|
|
257
|
-
padding-inline: var(--space-l-xu1x80, 20px);
|
|
258
255
|
text-align: start;
|
|
259
256
|
position: relative;
|
|
260
257
|
min-inline-size: 0;
|
|
261
258
|
word-break: break-word;
|
|
262
259
|
}
|
|
263
260
|
|
|
264
|
-
.awsui_tabs-
|
|
261
|
+
.awsui_tabs-tab-dismiss_14rmt_104vw_261:not(#\9),
|
|
262
|
+
.awsui_tabs-tab-action_14rmt_104vw_262:not(#\9) {
|
|
263
|
+
/* Used as a selector for tests */
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
.awsui_tabs-tab-header-container_14rmt_104vw_266:not(#\9) {
|
|
267
|
+
position: relative;
|
|
268
|
+
border-block: var(--border-divider-section-width-wl9k66, 1px) solid transparent;
|
|
269
|
+
border-inline: var(--border-divider-section-width-wl9k66, 1px) solid transparent;
|
|
270
|
+
padding-inline: var(--space-xs-xf5ch3, 8px);
|
|
271
|
+
display: flex;
|
|
272
|
+
align-items: stretch;
|
|
273
|
+
}
|
|
274
|
+
.awsui_tabs-tab-header-container_14rmt_104vw_266:not(#\9), .awsui_tabs-tab-header-container_14rmt_104vw_266 > button:not(#\9) {
|
|
275
|
+
background-color: transparent;
|
|
276
|
+
}
|
|
277
|
+
.awsui_tabs-tab-header-container_14rmt_104vw_266 > .awsui_tabs-tab-dismiss_14rmt_104vw_261:not(#\9), .awsui_tabs-tab-header-container_14rmt_104vw_266 > .awsui_tabs-tab-action_14rmt_104vw_262:not(#\9) {
|
|
278
|
+
display: flex;
|
|
279
|
+
align-items: center;
|
|
280
|
+
}
|
|
281
|
+
.awsui_tabs-tab-header-container_14rmt_104vw_266.awsui_refresh_14rmt_104vw_281 > span:not(#\9):first-of-type {
|
|
282
|
+
margin-inline-start: calc(-1 * var(--space-scaled-xs-x91h81, 8px));
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
.awsui_tabs-tab-header-container_14rmt_104vw_266:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_104vw_285):after {
|
|
286
|
+
content: "";
|
|
287
|
+
position: absolute;
|
|
288
|
+
inset-inline-start: 0;
|
|
289
|
+
inline-size: calc(100% - 1px);
|
|
290
|
+
inset-block-end: calc(-1 * var(--border-divider-section-width-wl9k66, 1px));
|
|
291
|
+
block-size: var(--border-active-width-lk35x8, 2px);
|
|
292
|
+
border-start-start-radius: var(--border-radius-tabs-focus-ring-7k0vsi, 0px);
|
|
293
|
+
border-start-end-radius: var(--border-radius-tabs-focus-ring-7k0vsi, 0px);
|
|
294
|
+
border-end-start-radius: var(--border-radius-tabs-focus-ring-7k0vsi, 0px);
|
|
295
|
+
border-end-end-radius: var(--border-radius-tabs-focus-ring-7k0vsi, 0px);
|
|
296
|
+
background: var(--color-border-tabs-underline-vxhq31, #16191f);
|
|
297
|
+
opacity: 0;
|
|
298
|
+
}
|
|
299
|
+
.awsui_tabs-tab-header-container_14rmt_104vw_266:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_104vw_285).awsui_refresh_14rmt_104vw_281:after {
|
|
300
|
+
transition: opacity var(--motion-duration-refresh-only-medium-0rwzu1, 165ms) var(--motion-easing-refresh-only-c-2mltoq, cubic-bezier(0.84, 0, 0.16, 1));
|
|
301
|
+
}
|
|
302
|
+
@media (prefers-reduced-motion: reduce) {
|
|
303
|
+
.awsui_tabs-tab-header-container_14rmt_104vw_266:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_104vw_285).awsui_refresh_14rmt_104vw_281:after {
|
|
304
|
+
animation: none;
|
|
305
|
+
transition: none;
|
|
306
|
+
}
|
|
307
|
+
}
|
|
308
|
+
.awsui-motion-disabled .awsui_tabs-tab-header-container_14rmt_104vw_266:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_104vw_285).awsui_refresh_14rmt_104vw_281:after, .awsui-mode-entering .awsui_tabs-tab-header-container_14rmt_104vw_266:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_104vw_285).awsui_refresh_14rmt_104vw_281:after {
|
|
309
|
+
animation: none;
|
|
310
|
+
transition: none;
|
|
311
|
+
}
|
|
312
|
+
|
|
313
|
+
.awsui_tabs-tab_14rmt_104vw_241:not(#\9):not(:last-child) > .awsui_tabs-tab-header-container_14rmt_104vw_266 {
|
|
265
314
|
margin-inline-end: calc(-1 * var(--border-divider-section-width-wl9k66, 1px));
|
|
315
|
+
}
|
|
316
|
+
.awsui_tabs-tab_14rmt_104vw_241:not(#\9):not(:last-child) > .awsui_tabs-tab-header-container_14rmt_104vw_266:before {
|
|
317
|
+
content: "";
|
|
318
|
+
position: absolute;
|
|
266
319
|
border-inline-end: var(--border-divider-section-width-wl9k66, 1px) solid var(--color-border-tabs-divider-xzqbyc, #aab7b8);
|
|
320
|
+
inset: calc(var(--space-scaled-s-9q8n2q, 12px)) 0;
|
|
321
|
+
opacity: 1;
|
|
322
|
+
}
|
|
323
|
+
.awsui_tabs-tab_14rmt_104vw_241:not(#\9):not(:last-child) > .awsui_tabs-tab-header-container_14rmt_104vw_266.awsui_refresh_14rmt_104vw_281:before {
|
|
324
|
+
inset: calc(var(--space-scaled-s-9q8n2q, 12px) - var(--border-active-width-lk35x8, 2px)) 0;
|
|
267
325
|
}
|
|
268
326
|
|
|
269
|
-
.awsui_tabs-tab-
|
|
327
|
+
.awsui_tabs-tab-link_14rmt_104vw_327:not(#\9) {
|
|
270
328
|
position: relative;
|
|
271
329
|
display: flex;
|
|
272
330
|
align-items: stretch;
|
|
273
331
|
text-decoration: none;
|
|
274
332
|
cursor: pointer;
|
|
275
|
-
padding-block-start: calc(var(--space-scaled-s-9q8n2q, 12px) -
|
|
276
|
-
padding-block-end: var(--space-scaled-s-9q8n2q, 12px);
|
|
333
|
+
padding-block-start: calc(var(--space-scaled-s-9q8n2q, 12px) - 2px);
|
|
334
|
+
padding-block-end: calc(var(--space-scaled-s-9q8n2q, 12px) - 1px);
|
|
277
335
|
padding-inline: 0;
|
|
278
336
|
margin-block-start: 1px;
|
|
279
337
|
border-block: var(--border-divider-section-width-wl9k66, 1px) solid transparent;
|
|
@@ -282,29 +340,32 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
282
340
|
line-height: var(--font-tabs-line-height-om7l0p, 22px);
|
|
283
341
|
font-weight: var(--font-wayfinding-link-active-weight-wec2dg, 700);
|
|
284
342
|
color: var(--color-text-interactive-default-dt26aj, #545b64);
|
|
343
|
+
padding-inline-start: calc(var(--space-xxs-9rrxti, 4px) - 1px);
|
|
344
|
+
padding-inline-end: var(--space-xxs-9rrxti, 4px);
|
|
285
345
|
-webkit-font-smoothing: var(--font-smoothing-webkit-8fiijr, auto);
|
|
286
346
|
-moz-osx-font-smoothing: var(--font-smoothing-moz-osx-fw8n0n, auto);
|
|
287
347
|
}
|
|
288
|
-
.awsui_tabs-tab-
|
|
348
|
+
.awsui_tabs-tab-link_14rmt_104vw_327.awsui_refresh_14rmt_104vw_281:not(#\9) {
|
|
289
349
|
padding-block-start: calc(var(--space-static-xs-fdj8ix, 8px) - 1px);
|
|
290
|
-
padding-block-end: var(--space-static-xs-fdj8ix, 8px);
|
|
291
|
-
|
|
350
|
+
padding-block-end: calc(var(--space-static-xs-fdj8ix, 8px) - 1px);
|
|
351
|
+
margin-block-start: 0;
|
|
292
352
|
}
|
|
293
|
-
.awsui_tabs-tab-
|
|
353
|
+
.awsui_tabs-tab-link_14rmt_104vw_327:not(#\9):hover {
|
|
294
354
|
color: var(--color-text-accent-yy9054, #0073bb);
|
|
295
355
|
}
|
|
296
|
-
.awsui_tabs-tab-
|
|
356
|
+
.awsui_tabs-tab-link_14rmt_104vw_327:not(#\9):focus {
|
|
297
357
|
outline: none;
|
|
298
358
|
}
|
|
299
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-tab-
|
|
359
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_104vw_327:not(#\9):focus {
|
|
300
360
|
z-index: 1;
|
|
301
361
|
position: relative;
|
|
362
|
+
border-inline-end-color: transparent;
|
|
302
363
|
}
|
|
303
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-tab-
|
|
364
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_104vw_327:not(#\9):focus {
|
|
304
365
|
outline: 2px dotted transparent;
|
|
305
366
|
outline-offset: calc(var(--space-tabs-focus-outline-gutter-2tu8wb, 0px) - 1px);
|
|
306
367
|
}
|
|
307
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-tab-
|
|
368
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_104vw_327:not(#\9):focus::before {
|
|
308
369
|
content: " ";
|
|
309
370
|
display: block;
|
|
310
371
|
position: absolute;
|
|
@@ -318,75 +379,44 @@ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_1wh1q_269:not(#\9
|
|
|
318
379
|
border-end-end-radius: var(--border-radius-control-default-focus-ring-a78bgq, 2px);
|
|
319
380
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-v8nq2m, #0073bb);
|
|
320
381
|
}
|
|
321
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_1wh1q_269:not(#\9):focus > a > .awsui_tabs-tab-label_14rmt_1wh1q_253, body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_1wh1q_269:not(#\9):focus > button > .awsui_tabs-tab-label_14rmt_1wh1q_253 {
|
|
322
|
-
border-inline-end-color: transparent;
|
|
323
|
-
}
|
|
324
382
|
|
|
325
|
-
.awsui_tabs-
|
|
383
|
+
.awsui_tabs-tab_14rmt_104vw_241:not(#\9):first-child {
|
|
326
384
|
margin-inline-start: 1px;
|
|
327
385
|
}
|
|
328
|
-
.awsui_tabs-
|
|
329
|
-
padding-inline-start: calc(var(--space-
|
|
386
|
+
.awsui_tabs-tab_14rmt_104vw_241:not(#\9):first-child > .awsui_tabs-tab-header-container_14rmt_104vw_266 {
|
|
387
|
+
padding-inline-start: calc(var(--space-xs-xf5ch3, 8px) - 1px);
|
|
330
388
|
}
|
|
331
389
|
|
|
332
|
-
.awsui_tabs-
|
|
390
|
+
.awsui_tabs-tab_14rmt_104vw_241:not(#\9):last-child {
|
|
333
391
|
margin-inline-end: 1px;
|
|
334
392
|
}
|
|
335
|
-
.awsui_tabs-
|
|
336
|
-
padding-inline-end: calc(var(--space-
|
|
393
|
+
.awsui_tabs-tab_14rmt_104vw_241:not(#\9):last-child > .awsui_tabs-tab-header-container_14rmt_104vw_266 {
|
|
394
|
+
padding-inline-end: calc(var(--space-xs-xf5ch3, 8px) - 1px);
|
|
337
395
|
}
|
|
338
396
|
|
|
339
|
-
.awsui_tabs-tab-
|
|
397
|
+
.awsui_tabs-tab-disabled_14rmt_104vw_285:not(#\9), .awsui_tabs-tab-disabled_14rmt_104vw_285:not(#\9):hover {
|
|
340
398
|
pointer-events: none;
|
|
341
399
|
cursor: default;
|
|
342
400
|
color: var(--color-text-interactive-disabled-e23z4j, #aab7b8);
|
|
343
401
|
font-weight: var(--font-tabs-disabled-weight-uew17o, 400);
|
|
344
402
|
}
|
|
345
403
|
|
|
346
|
-
.awsui_tabs-tab-
|
|
347
|
-
content: "";
|
|
348
|
-
position: absolute;
|
|
349
|
-
inset-inline-start: 0;
|
|
350
|
-
inline-size: 100%;
|
|
351
|
-
inset-block-end: calc(-1 * var(--border-divider-section-width-wl9k66, 1px));
|
|
352
|
-
block-size: var(--border-active-width-lk35x8, 2px);
|
|
353
|
-
border-start-start-radius: var(--border-radius-tabs-focus-ring-7k0vsi, 0px);
|
|
354
|
-
border-start-end-radius: var(--border-radius-tabs-focus-ring-7k0vsi, 0px);
|
|
355
|
-
border-end-start-radius: var(--border-radius-tabs-focus-ring-7k0vsi, 0px);
|
|
356
|
-
border-end-end-radius: var(--border-radius-tabs-focus-ring-7k0vsi, 0px);
|
|
357
|
-
background: var(--color-border-tabs-underline-vxhq31, #16191f);
|
|
358
|
-
opacity: 0;
|
|
359
|
-
}
|
|
360
|
-
.awsui_tabs-tab-link_14rmt_1wh1q_269:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_1wh1q_339).awsui_refresh_14rmt_1wh1q_288:after {
|
|
361
|
-
transition: opacity var(--motion-duration-refresh-only-medium-0rwzu1, 165ms) var(--motion-easing-refresh-only-c-2mltoq, cubic-bezier(0.84, 0, 0.16, 1));
|
|
362
|
-
}
|
|
363
|
-
@media (prefers-reduced-motion: reduce) {
|
|
364
|
-
.awsui_tabs-tab-link_14rmt_1wh1q_269:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_1wh1q_339).awsui_refresh_14rmt_1wh1q_288:after {
|
|
365
|
-
animation: none;
|
|
366
|
-
transition: none;
|
|
367
|
-
}
|
|
368
|
-
}
|
|
369
|
-
.awsui-motion-disabled .awsui_tabs-tab-link_14rmt_1wh1q_269:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_1wh1q_339).awsui_refresh_14rmt_1wh1q_288:after, .awsui-mode-entering .awsui_tabs-tab-link_14rmt_1wh1q_269:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_1wh1q_339).awsui_refresh_14rmt_1wh1q_288:after {
|
|
370
|
-
animation: none;
|
|
371
|
-
transition: none;
|
|
372
|
-
}
|
|
373
|
-
|
|
374
|
-
.awsui_tabs-tab-active_14rmt_1wh1q_374:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_1wh1q_339) {
|
|
404
|
+
.awsui_tabs-tab-active_14rmt_104vw_404:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_104vw_285) {
|
|
375
405
|
color: var(--color-text-accent-yy9054, #0073bb);
|
|
376
406
|
}
|
|
377
|
-
.awsui_tabs-tab-
|
|
407
|
+
.awsui_tabs-tab-active_14rmt_104vw_404:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_104vw_285):after {
|
|
378
408
|
opacity: 1;
|
|
379
409
|
}
|
|
380
410
|
|
|
381
|
-
.awsui_tabs-header-with-
|
|
411
|
+
.awsui_tabs-header-with-divider_14rmt_104vw_411:not(#\9) {
|
|
382
412
|
border-block-end: var(--border-divider-section-width-wl9k66, 1px) solid var(--color-border-tabs-divider-xzqbyc, #aab7b8);
|
|
383
413
|
}
|
|
384
414
|
|
|
385
|
-
.
|
|
415
|
+
.awsui_root_14rmt_104vw_415:not(#\9) {
|
|
386
416
|
/* used in test-utils or tests */
|
|
387
417
|
}
|
|
388
418
|
|
|
389
|
-
.
|
|
419
|
+
.awsui_tabs_14rmt_104vw_194:not(#\9) {
|
|
390
420
|
border-collapse: separate;
|
|
391
421
|
border-spacing: 0;
|
|
392
422
|
box-sizing: border-box;
|
|
@@ -424,21 +454,21 @@ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_1wh1q_269:not(#\9
|
|
|
424
454
|
inline-size: 100%;
|
|
425
455
|
}
|
|
426
456
|
|
|
427
|
-
.awsui_tabs-
|
|
457
|
+
.awsui_tabs-content_14rmt_104vw_456:not(#\9) {
|
|
428
458
|
display: none;
|
|
429
459
|
}
|
|
430
460
|
|
|
431
|
-
.awsui_fit-
|
|
461
|
+
.awsui_fit-height_14rmt_104vw_460:not(#\9) {
|
|
432
462
|
display: flex;
|
|
433
463
|
flex-direction: column;
|
|
434
464
|
block-size: 100%;
|
|
435
465
|
}
|
|
436
466
|
|
|
437
|
-
.awsui_tabs-content-
|
|
467
|
+
.awsui_tabs-content-active_14rmt_104vw_466:not(#\9) {
|
|
438
468
|
display: block;
|
|
439
469
|
flex: 1;
|
|
440
470
|
}
|
|
441
|
-
body[data-awsui-focus-visible=true] .awsui_tabs-content-
|
|
471
|
+
body[data-awsui-focus-visible=true] .awsui_tabs-content-active_14rmt_104vw_466:not(#\9):focus {
|
|
442
472
|
outline: 2px dotted transparent;
|
|
443
473
|
outline-offset: 2px;
|
|
444
474
|
border-start-start-radius: var(--border-radius-container-jm6teg, 0px);
|
|
@@ -448,23 +478,23 @@ body[data-awsui-focus-visible=true] .awsui_tabs-content-active_14rmt_1wh1q_436:n
|
|
|
448
478
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-v8nq2m, #0073bb);
|
|
449
479
|
}
|
|
450
480
|
|
|
451
|
-
.awsui_tabs-content-
|
|
481
|
+
.awsui_tabs-content-wrapper_14rmt_104vw_480.awsui_with-paddings_14rmt_104vw_480 > .awsui_tabs-content_14rmt_104vw_456:not(#\9) {
|
|
452
482
|
padding-block: var(--space-scaled-m-er48cl, 16px);
|
|
453
483
|
padding-inline: 0;
|
|
454
484
|
}
|
|
455
|
-
.awsui_fit-
|
|
485
|
+
.awsui_fit-height_14rmt_104vw_460 > .awsui_tabs-content-wrapper_14rmt_104vw_480:not(#\9) {
|
|
456
486
|
flex: 1;
|
|
457
487
|
display: flex;
|
|
458
488
|
flex-direction: column;
|
|
459
489
|
overflow: auto;
|
|
460
490
|
}
|
|
461
491
|
|
|
462
|
-
.awsui_fit-
|
|
492
|
+
.awsui_fit-height_14rmt_104vw_460 > .awsui_tabs-content-wrapper_14rmt_104vw_480 > .awsui_tabs-container-content-wrapper_14rmt_104vw_491:not(#\9) {
|
|
463
493
|
block-size: 100%;
|
|
464
494
|
display: flex;
|
|
465
495
|
flex-direction: column;
|
|
466
496
|
}
|
|
467
|
-
.awsui_tabs-container-content-
|
|
497
|
+
.awsui_tabs-container-content-wrapper_14rmt_104vw_491.awsui_with-paddings_14rmt_104vw_480 > .awsui_tabs-content_14rmt_104vw_456:not(#\9) {
|
|
468
498
|
padding-block-start: var(--space-tabs-content-top-53djlo, 16px);
|
|
469
499
|
padding-block-end: var(--space-scaled-l-08jb88, 20px);
|
|
470
500
|
padding-inline: var(--space-container-horizontal-oebwqe, 20px);
|