@cloudscape-design/components-themeable 3.0.1010 → 3.0.1012
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/app-layout/visual-refresh-toolbar/drawer/styles.scss +0 -1
- package/lib/internal/scss/internal/base-component/styles.scss +5 -0
- package/lib/internal/scss/internal/generated/custom-css-properties/index.scss +3 -0
- package/lib/internal/template/alert/styles.scoped.css +2 -4
- package/lib/internal/template/anchor-navigation/styles.scoped.css +1 -2
- package/lib/internal/template/annotation-context/annotation/styles.scoped.css +1 -2
- package/lib/internal/template/app-layout/visual-refresh/styles.scoped.css +2 -4
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.css.js +17 -17
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.scoped.css +35 -36
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.selectors.js +17 -17
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.scoped.css +1 -2
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.js +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/styles.scoped.css +1 -2
- package/lib/internal/template/attribute-editor/styles.scoped.css +1 -2
- package/lib/internal/template/badge/styles.scoped.css +1 -2
- package/lib/internal/template/breadcrumb-group/styles.scoped.css +2 -4
- package/lib/internal/template/button/styles.scoped.css +1 -2
- package/lib/internal/template/button-dropdown/mobile-expandable-group/styles.scoped.css +1 -2
- package/lib/internal/template/button-group/styles.scoped.css +1 -2
- package/lib/internal/template/calendar/styles.scoped.css +1 -2
- package/lib/internal/template/cards/styles.scoped.css +1 -2
- package/lib/internal/template/checkbox/styles.scoped.css +1 -2
- package/lib/internal/template/code-editor/styles.scoped.css +1 -2
- package/lib/internal/template/collection-preferences/content-display/styles.scoped.css +1 -2
- package/lib/internal/template/collection-preferences/styles.scoped.css +1 -2
- package/lib/internal/template/column-layout/styles.scoped.css +1 -2
- package/lib/internal/template/container/interfaces.d.ts +5 -0
- package/lib/internal/template/container/interfaces.d.ts.map +1 -1
- package/lib/internal/template/container/interfaces.js.map +1 -1
- package/lib/internal/template/container/internal.d.ts +2 -2
- package/lib/internal/template/container/internal.d.ts.map +1 -1
- package/lib/internal/template/container/internal.js +2 -2
- package/lib/internal/template/container/internal.js.map +1 -1
- package/lib/internal/template/container/styles.scoped.css +1 -2
- package/lib/internal/template/date-picker/styles.scoped.css +1 -2
- package/lib/internal/template/date-range-picker/styles.scoped.css +1 -2
- package/lib/internal/template/drawer/styles.scoped.css +1 -2
- package/lib/internal/template/expandable-section/styles.scoped.css +1 -2
- package/lib/internal/template/file-token-group/styles.scoped.css +1 -2
- package/lib/internal/template/flashbar/styles.scoped.css +1 -2
- package/lib/internal/template/form/styles.scoped.css +1 -2
- package/lib/internal/template/form-field/styles.scoped.css +1 -2
- package/lib/internal/template/grid/styles.scoped.css +1 -2
- package/lib/internal/template/header/styles.scoped.css +1 -2
- package/lib/internal/template/help-panel/styles.scoped.css +1 -2
- package/lib/internal/template/input/styles.scoped.css +1 -2
- package/lib/internal/template/internal/base-component/styles.scoped.css +3 -0
- package/lib/internal/template/internal/components/button-trigger/styles.scoped.css +1 -2
- package/lib/internal/template/internal/components/chart-filter/styles.scoped.css +1 -2
- package/lib/internal/template/internal/components/chart-legend/styles.scoped.css +1 -2
- package/lib/internal/template/internal/components/chart-popover/styles.scoped.css +1 -2
- package/lib/internal/template/internal/components/chart-series-details/styles.scoped.css +3 -6
- package/lib/internal/template/internal/components/chart-series-marker/styles.scoped.css +1 -2
- package/lib/internal/template/internal/components/chart-wrapper/styles.scoped.css +1 -2
- package/lib/internal/template/internal/components/dropdown/styles.scoped.css +1 -2
- package/lib/internal/template/internal/components/dropdown-footer/styles.scoped.css +1 -2
- package/lib/internal/template/internal/components/dropdown-status/styles.scoped.css +1 -2
- package/lib/internal/template/internal/components/menu-dropdown/styles.scoped.css +1 -2
- package/lib/internal/template/internal/components/option/styles.scoped.css +1 -2
- package/lib/internal/template/internal/components/options-list/styles.scoped.css +1 -2
- package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.d.ts +1 -0
- package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.d.ts.map +1 -1
- package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.js +1 -0
- package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.js.map +1 -1
- package/lib/internal/template/internal/components/token-list/styles.scoped.css +1 -2
- package/lib/internal/template/internal/environment.d.ts +1 -0
- package/lib/internal/template/internal/environment.js +2 -1
- package/lib/internal/template/internal/environment.json +2 -1
- package/lib/internal/template/internal/hooks/use-base-component/index.d.ts.map +1 -1
- package/lib/internal/template/internal/hooks/use-base-component/index.js +2 -0
- package/lib/internal/template/internal/hooks/use-base-component/index.js.map +1 -1
- package/lib/internal/template/internal/hooks/use-base-component/styles-check.d.ts +4 -0
- package/lib/internal/template/internal/hooks/use-base-component/styles-check.d.ts.map +1 -0
- package/lib/internal/template/internal/hooks/use-base-component/styles-check.js +46 -0
- package/lib/internal/template/internal/hooks/use-base-component/styles-check.js.map +1 -0
- package/lib/internal/template/internal/metrics.d.ts.map +1 -1
- package/lib/internal/template/internal/metrics.js +2 -2
- package/lib/internal/template/internal/metrics.js.map +1 -1
- package/lib/internal/template/key-value-pairs/styles.scoped.css +2 -4
- package/lib/internal/template/link/styles.scoped.css +1 -2
- package/lib/internal/template/modal/styles.scoped.css +2 -4
- package/lib/internal/template/multiselect/styles.scoped.css +2 -4
- package/lib/internal/template/pagination/styles.scoped.css +1 -2
- package/lib/internal/template/popover/styles.scoped.css +3 -6
- package/lib/internal/template/progress-bar/styles.scoped.css +1 -2
- package/lib/internal/template/prompt-input/internal.d.ts.map +1 -1
- package/lib/internal/template/prompt-input/internal.js +3 -3
- package/lib/internal/template/prompt-input/internal.js.map +1 -1
- package/lib/internal/template/prompt-input/styles.scoped.css +4 -8
- package/lib/internal/template/property-filter/filtering-token/styles.scoped.css +1 -2
- package/lib/internal/template/property-filter/styles.scoped.css +2 -4
- package/lib/internal/template/radio-group/styles.scoped.css +1 -2
- package/lib/internal/template/segmented-control/interfaces.d.ts +2 -1
- package/lib/internal/template/segmented-control/interfaces.d.ts.map +1 -1
- package/lib/internal/template/segmented-control/interfaces.js.map +1 -1
- package/lib/internal/template/segmented-control/styles.scoped.css +1 -2
- package/lib/internal/template/select/styles.scoped.css +1 -2
- package/lib/internal/template/select/utils/use-select.d.ts.map +1 -1
- package/lib/internal/template/select/utils/use-select.js +17 -4
- package/lib/internal/template/select/utils/use-select.js.map +1 -1
- package/lib/internal/template/side-navigation/styles.scoped.css +1 -2
- package/lib/internal/template/slider/styles.scoped.css +1 -2
- package/lib/internal/template/split-panel/styles.scoped.css +1 -2
- package/lib/internal/template/steps/styles.scoped.css +1 -2
- package/lib/internal/template/table/expandable-rows/styles.scoped.css +1 -2
- package/lib/internal/template/table/internal.js +1 -1
- package/lib/internal/template/table/internal.js.map +1 -1
- package/lib/internal/template/table/resizer/styles.scoped.css +1 -2
- package/lib/internal/template/tabs/styles.scoped.css +1 -2
- package/lib/internal/template/text-content/styles.scoped.css +1 -2
- package/lib/internal/template/text-filter/styles.scoped.css +1 -2
- package/lib/internal/template/textarea/styles.scoped.css +1 -2
- package/lib/internal/template/tiles/styles.scoped.css +2 -4
- package/lib/internal/template/toggle/styles.scoped.css +1 -2
- package/lib/internal/template/token-group/styles.scoped.css +1 -2
- package/lib/internal/template/top-navigation/1.0-beta/styles.scoped.css +1 -2
- package/lib/internal/template/top-navigation/styles.scoped.css +3 -6
- package/lib/internal/template/tutorial-panel/components/tutorial-detail-view/styles.scoped.css +1 -2
- package/lib/internal/template/tutorial-panel/components/tutorial-list/styles.scoped.css +3 -6
- package/lib/internal/template/tutorial-panel/styles.scoped.css +1 -2
- package/lib/internal/template/wizard/styles.scoped.css +1 -2
- package/package.json +1 -1
|
@@ -792,8 +792,7 @@ body[data-awsui-focus-visible=true] .awsui_code-editor_1gl9c_gorbv_158 .ace_edit
|
|
|
792
792
|
font-style: normal;
|
|
793
793
|
font-variant: normal;
|
|
794
794
|
font-stretch: normal;
|
|
795
|
-
|
|
796
|
-
hyphens: none;
|
|
795
|
+
hyphens: none;
|
|
797
796
|
letter-spacing: normal;
|
|
798
797
|
list-style: disc outside none;
|
|
799
798
|
tab-size: 8;
|
|
@@ -302,8 +302,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
302
302
|
font-style: normal;
|
|
303
303
|
font-variant: normal;
|
|
304
304
|
font-stretch: normal;
|
|
305
|
-
|
|
306
|
-
hyphens: none;
|
|
305
|
+
hyphens: none;
|
|
307
306
|
letter-spacing: normal;
|
|
308
307
|
list-style: disc outside none;
|
|
309
308
|
tab-size: 8;
|
|
@@ -633,8 +633,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
633
633
|
font-style: normal;
|
|
634
634
|
font-variant: normal;
|
|
635
635
|
font-stretch: normal;
|
|
636
|
-
|
|
637
|
-
hyphens: none;
|
|
636
|
+
hyphens: none;
|
|
638
637
|
letter-spacing: normal;
|
|
639
638
|
list-style: disc outside none;
|
|
640
639
|
tab-size: 8;
|
|
@@ -190,8 +190,7 @@ div.awsui_column-layout_vvxn7_121bq_181:not(#\9) {
|
|
|
190
190
|
font-style: normal;
|
|
191
191
|
font-variant: normal;
|
|
192
192
|
font-stretch: normal;
|
|
193
|
-
|
|
194
|
-
hyphens: none;
|
|
193
|
+
hyphens: none;
|
|
195
194
|
letter-spacing: normal;
|
|
196
195
|
list-style: disc outside none;
|
|
197
196
|
tab-size: 8;
|
|
@@ -55,6 +55,11 @@ export interface ContainerProps extends BaseComponentProps {
|
|
|
55
55
|
* Footer of the container.
|
|
56
56
|
*/
|
|
57
57
|
footer?: React.ReactNode;
|
|
58
|
+
/**
|
|
59
|
+
* Determines whether the container footer has padding. If `true`, removes the default padding from the footer.
|
|
60
|
+
* @awsuiSystem core
|
|
61
|
+
*/
|
|
62
|
+
disableFooterPaddings?: boolean;
|
|
58
63
|
/**
|
|
59
64
|
* Specify a container variant with one of the following:
|
|
60
65
|
* * `default` - Use this variant in standalone context.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/container/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,MAAM,WAAW,cAAe,SAAQ,kBAAkB;IACxD;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,cAAc,CAAC,iBAAiB,CAAC;IAErD;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;;;;;;;;;;;;;;;;;OAkBG;IACH,KAAK,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC;IAE7B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IAEjC;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC;AAED,yBAAiB,cAAc,CAAC;IAC9B,UAAiB,iBAAiB;QAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;KAC7B;IACD,UAAiB,KAAK;QACpB;;WAEG;QACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;QAEzB;;WAEG;QACH,QAAQ,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;QAE1B;;;;;;WAMG;QACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;QAExB;;;;;;WAMG;QACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;KAC1B;CACF"}
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/container/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,MAAM,WAAW,cAAe,SAAQ,kBAAkB;IACxD;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,cAAc,CAAC,iBAAiB,CAAC;IAErD;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;;;;;;;;;;;;;;;;;OAkBG;IACH,KAAK,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC;IAE7B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IAEjC;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;;OAGG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC;AAED,yBAAiB,cAAc,CAAC;IAC9B,UAAiB,iBAAiB;QAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;KAC7B;IACD,UAAiB,KAAK;QACpB;;WAEG;QACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;QAEzB;;WAEG;QACH,QAAQ,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;QAE1B;;;;;;WAMG;QACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;QAExB;;;;;;WAMG;QACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;KAC1B;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/container/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { BaseComponentProps } from '../internal/base-component';\n\nexport interface ContainerProps extends BaseComponentProps {\n /**\n * Specifies additional analytics-related metadata.\n * * `instanceIdentifier` - A unique string that identifies this component instance in your application.\n * @analytics\n */\n analyticsMetadata?: ContainerProps.AnalyticsMetadata;\n\n /**\n * Heading element of the container. Use the [header component](/components/header/).\n */\n header?: React.ReactNode;\n\n /**\n * Determines whether the container header has padding. If `true`, removes the default padding from the header.\n */\n disableHeaderPaddings?: boolean;\n\n /**\n *\n * Use this slot to render a media element. Supported element types are 'img', 'video', and 'picture'.\n * You can define different positions and sizes for the media element within the container.\n *\n * * `content` - Use this slot to render your media element. We support `img`, `video`, `picture`, and `iframe` elements.\n *\n * * `position` - Defines the media slot's position within the container. Defaults to `top`.\n *\n * * `width` - Defines the width of the media slot when positioned on the side. Corresponds to the `width` CSS-property.\n * When this value is set, media elements larger than the defined width may be cropped, with 'object-fit: cover' centering it.\n * Note: This value is considered only when `position` is set to `side`.\n * If no width is provided, the media slot will take a maximum of 66% of the container's width.\n *\n * * `height` - Defines the height of the media slot when position on the top. Corresponds to the `height` CSS-property.\n * When this value is set, media elements larger than the defined width may be cropped, with 'object-fit: cover' centering it. * Note: This value is only considered if `position` is set to `top`.\n * If no height is provided, the media slot will be displayed at its full height.\n *\n */\n media?: ContainerProps.Media;\n\n /**\n * Main content of the container.\n */\n children?: React.ReactNode;\n\n /**\n * Determines whether the container content has padding. If `true`, removes the default padding from the content area.\n */\n disableContentPaddings?: boolean;\n\n /**\n * Enabling this property will make the container to fit into available height. If content is too short, the container\n * will stretch, if too long, the container will shrink and show vertical scrollbar.\n *\n * Use this property to align heights of multiple containers displayed in a single row. It is recommended to stretch\n * all containers to the height of the longest one, to avoid extra vertical scroll areas.\n */\n fitHeight?: boolean;\n\n /**\n * Footer of the container.\n */\n footer?: React.ReactNode;\n\n /**\n * Specify a container variant with one of the following:\n * * `default` - Use this variant in standalone context.\n * * `stacked` - Use this variant adjacent to other stacked containers (such as a container,\n * table).\n * @visualrefresh `stacked` variant\n */\n variant?: 'default' | 'stacked';\n}\n\nexport namespace ContainerProps {\n export interface AnalyticsMetadata {\n instanceIdentifier?: string;\n }\n export interface Media {\n /**\n * Use this slot to render your media element. We support `img`, `video`, `picture`, and `iframe` elements.\n */\n content: React.ReactNode;\n\n /**\n * Defines the media slot's position within the container. Defaults to `top`.\n */\n position?: 'top' | 'side';\n\n /**\n * Defines the width of the media slot when positioned on the side. Corresponds to the `width` CSS-property.\n * When this value is set, the media element may be cropped, with `object-fit: cover` centering it.\n *\n * Note: This value is considered only when `position` is set to `side`.\n * If no width is provided, the media slot will take a maximum of 66% of the container's width.\n */\n width?: string | number;\n\n /**\n * Defines the height of the media slot when position on the top. Corresponds to the `height` CSS-property.\n * When this value is set, the media element may be cropped, with `object-fit: cover` centering it.\n *\n * Note: This value is only considered if `position` is set to `top`.\n * If no height is provided, the media slot will be displayed at its full height.\n */\n height?: string | number;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/container/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { BaseComponentProps } from '../internal/base-component';\n\nexport interface ContainerProps extends BaseComponentProps {\n /**\n * Specifies additional analytics-related metadata.\n * * `instanceIdentifier` - A unique string that identifies this component instance in your application.\n * @analytics\n */\n analyticsMetadata?: ContainerProps.AnalyticsMetadata;\n\n /**\n * Heading element of the container. Use the [header component](/components/header/).\n */\n header?: React.ReactNode;\n\n /**\n * Determines whether the container header has padding. If `true`, removes the default padding from the header.\n */\n disableHeaderPaddings?: boolean;\n\n /**\n *\n * Use this slot to render a media element. Supported element types are 'img', 'video', and 'picture'.\n * You can define different positions and sizes for the media element within the container.\n *\n * * `content` - Use this slot to render your media element. We support `img`, `video`, `picture`, and `iframe` elements.\n *\n * * `position` - Defines the media slot's position within the container. Defaults to `top`.\n *\n * * `width` - Defines the width of the media slot when positioned on the side. Corresponds to the `width` CSS-property.\n * When this value is set, media elements larger than the defined width may be cropped, with 'object-fit: cover' centering it.\n * Note: This value is considered only when `position` is set to `side`.\n * If no width is provided, the media slot will take a maximum of 66% of the container's width.\n *\n * * `height` - Defines the height of the media slot when position on the top. Corresponds to the `height` CSS-property.\n * When this value is set, media elements larger than the defined width may be cropped, with 'object-fit: cover' centering it. * Note: This value is only considered if `position` is set to `top`.\n * If no height is provided, the media slot will be displayed at its full height.\n *\n */\n media?: ContainerProps.Media;\n\n /**\n * Main content of the container.\n */\n children?: React.ReactNode;\n\n /**\n * Determines whether the container content has padding. If `true`, removes the default padding from the content area.\n */\n disableContentPaddings?: boolean;\n\n /**\n * Enabling this property will make the container to fit into available height. If content is too short, the container\n * will stretch, if too long, the container will shrink and show vertical scrollbar.\n *\n * Use this property to align heights of multiple containers displayed in a single row. It is recommended to stretch\n * all containers to the height of the longest one, to avoid extra vertical scroll areas.\n */\n fitHeight?: boolean;\n\n /**\n * Footer of the container.\n */\n footer?: React.ReactNode;\n\n /**\n * Determines whether the container footer has padding. If `true`, removes the default padding from the footer.\n * @awsuiSystem core\n */\n disableFooterPaddings?: boolean;\n\n /**\n * Specify a container variant with one of the following:\n * * `default` - Use this variant in standalone context.\n * * `stacked` - Use this variant adjacent to other stacked containers (such as a container,\n * table).\n * @visualrefresh `stacked` variant\n */\n variant?: 'default' | 'stacked';\n}\n\nexport namespace ContainerProps {\n export interface AnalyticsMetadata {\n instanceIdentifier?: string;\n }\n export interface Media {\n /**\n * Use this slot to render your media element. We support `img`, `video`, `picture`, and `iframe` elements.\n */\n content: React.ReactNode;\n\n /**\n * Defines the media slot's position within the container. Defaults to `top`.\n */\n position?: 'top' | 'side';\n\n /**\n * Defines the width of the media slot when positioned on the side. Corresponds to the `width` CSS-property.\n * When this value is set, the media element may be cropped, with `object-fit: cover` centering it.\n *\n * Note: This value is considered only when `position` is set to `side`.\n * If no width is provided, the media slot will take a maximum of 66% of the container's width.\n */\n width?: string | number;\n\n /**\n * Defines the height of the media slot when position on the top. Corresponds to the `height` CSS-property.\n * When this value is set, the media element may be cropped, with `object-fit: cover` centering it.\n *\n * Note: This value is only considered if `position` is set to `top`.\n * If no height is provided, the media slot will be displayed at its full height.\n */\n height?: string | number;\n }\n}\n"]}
|
|
@@ -3,11 +3,11 @@ import { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';
|
|
|
3
3
|
import { InternalBaseComponentProps } from '../internal/hooks/use-base-component';
|
|
4
4
|
import { ContainerProps } from './interfaces';
|
|
5
5
|
export interface InternalContainerProps extends Omit<ContainerProps, 'variant'>, InternalBaseComponentProps {
|
|
6
|
+
disableFooterPaddings?: boolean;
|
|
6
7
|
__stickyHeader?: boolean;
|
|
7
8
|
__stickyOffset?: number;
|
|
8
9
|
__mobileStickyOffset?: number;
|
|
9
10
|
__disableFooterDivider?: boolean;
|
|
10
|
-
__disableFooterPaddings?: boolean;
|
|
11
11
|
__hiddenContent?: boolean;
|
|
12
12
|
__headerRef?: React.RefObject<HTMLDivElement>;
|
|
13
13
|
__fullPage?: boolean;
|
|
@@ -23,5 +23,5 @@ export interface InternalContainerProps extends Omit<ContainerProps, 'variant'>,
|
|
|
23
23
|
__subStepRef?: ReturnType<typeof useFunnelSubStep>['subStepRef'];
|
|
24
24
|
}
|
|
25
25
|
export declare function InternalContainerAsSubstep(props: InternalContainerProps): JSX.Element;
|
|
26
|
-
export default function InternalContainer({ header, footer, children, variant, disableHeaderPaddings, disableContentPaddings, fitHeight, media, __stickyOffset, __mobileStickyOffset, __stickyHeader, __internalRootRef, __disableFooterDivider,
|
|
26
|
+
export default function InternalContainer({ header, footer, children, variant, disableHeaderPaddings, disableContentPaddings, disableFooterPaddings, fitHeight, media, __stickyOffset, __mobileStickyOffset, __stickyHeader, __internalRootRef, __disableFooterDivider, __hiddenContent, __headerRef, __fullPage, __disableStickyMobile, __funnelSubStepProps, __subStepRef, ...restProps }: InternalContainerProps): JSX.Element;
|
|
27
27
|
//# sourceMappingURL=internal.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAMtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAI1E,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAO9C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACzG,
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAMtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAI1E,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAO9C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACzG,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC;IAEzE,oBAAoB,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,oBAAoB,CAAC,CAAC;IACjF,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,YAAY,CAAC,CAAC;CAClE;AAED,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,sBAAsB,eAWvE;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,qBAA6B,EAC7B,SAAS,EACT,KAAK,EACL,cAAc,EACd,oBAAoB,EACpB,cAAsB,EACtB,iBAAwB,EACxB,sBAA8B,EAC9B,eAAuB,EACvB,WAAW,EACX,UAAkB,EAClB,qBAA4B,EAC5B,oBAAoB,EACpB,YAAY,EACZ,GAAG,SAAS,EACb,EAAE,sBAAsB,eAgHxB"}
|
|
@@ -22,7 +22,7 @@ export function InternalContainerAsSubstep(props) {
|
|
|
22
22
|
}
|
|
23
23
|
export default function InternalContainer(_a) {
|
|
24
24
|
var _b;
|
|
25
|
-
var { header, footer, children, variant = 'default', disableHeaderPaddings = false, disableContentPaddings = false, fitHeight, media, __stickyOffset, __mobileStickyOffset, __stickyHeader = false, __internalRootRef = null, __disableFooterDivider = false,
|
|
25
|
+
var { header, footer, children, variant = 'default', disableHeaderPaddings = false, disableContentPaddings = false, disableFooterPaddings = false, fitHeight, media, __stickyOffset, __mobileStickyOffset, __stickyHeader = false, __internalRootRef = null, __disableFooterDivider = false, __hiddenContent = false, __headerRef, __fullPage = false, __disableStickyMobile = true, __funnelSubStepProps, __subStepRef } = _a, restProps = __rest(_a, ["header", "footer", "children", "variant", "disableHeaderPaddings", "disableContentPaddings", "disableFooterPaddings", "fitHeight", "media", "__stickyOffset", "__mobileStickyOffset", "__stickyHeader", "__internalRootRef", "__disableFooterDivider", "__hiddenContent", "__headerRef", "__fullPage", "__disableStickyMobile", "__funnelSubStepProps", "__subStepRef"]);
|
|
26
26
|
const isMobile = useMobile();
|
|
27
27
|
const isRefresh = useVisualRefresh();
|
|
28
28
|
const baseProps = getBaseProps(restProps);
|
|
@@ -62,7 +62,7 @@ export default function InternalContainer(_a) {
|
|
|
62
62
|
}) }, children)),
|
|
63
63
|
footer && (React.createElement("div", { className: clsx(styles.footer, {
|
|
64
64
|
[styles['with-divider']]: !__disableFooterDivider,
|
|
65
|
-
[styles['with-paddings']]: !
|
|
65
|
+
[styles['with-paddings']]: !disableFooterPaddings,
|
|
66
66
|
}) }, footer)))));
|
|
67
67
|
}
|
|
68
68
|
//# sourceMappingURL=internal.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsLabelAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { getBaseProps } from '../internal/base-component';\nimport { ContainerHeaderContextProvider } from '../internal/context/container-header';\nimport { useModalContext } from '../internal/context/modal-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { ContainerProps } from './interfaces';\nimport { StickyHeaderContext, useStickyHeader } from './use-sticky-header';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\nimport testStyles from './test-classes/styles.css.js';\n\nexport interface InternalContainerProps extends Omit<ContainerProps, 'variant'>, InternalBaseComponentProps {\n __stickyHeader?: boolean;\n __stickyOffset?: number;\n __mobileStickyOffset?: number;\n __disableFooterDivider?: boolean;\n __disableFooterPaddings?: boolean;\n __hiddenContent?: boolean;\n __headerRef?: React.RefObject<HTMLDivElement>;\n __fullPage?: boolean;\n __disableStickyMobile?: boolean;\n /**\n * Additional internal variant:\n * * `embedded` - Use this variant within a parent container (such as a modal,\n * expandable section, container or split panel).\n * * `full-page` – Only for internal use in table, cards and other components\n */\n variant?: ContainerProps['variant'] | 'embedded' | 'full-page' | 'cards';\n\n __funnelSubStepProps?: ReturnType<typeof useFunnelSubStep>['funnelSubStepProps'];\n __subStepRef?: ReturnType<typeof useFunnelSubStep>['subStepRef'];\n}\n\nexport function InternalContainerAsSubstep(props: InternalContainerProps) {\n const { subStepRef, funnelSubStepProps } = useFunnelSubStep();\n const modalContext = useModalContext();\n\n return (\n <InternalContainer\n {...props}\n __subStepRef={modalContext?.isInModal ? { current: null } : subStepRef}\n __funnelSubStepProps={modalContext?.isInModal ? {} : funnelSubStepProps}\n />\n );\n}\n\nexport default function InternalContainer({\n header,\n footer,\n children,\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n fitHeight,\n media,\n __stickyOffset,\n __mobileStickyOffset,\n __stickyHeader = false,\n __internalRootRef = null,\n __disableFooterDivider = false,\n __disableFooterPaddings = false,\n __hiddenContent = false,\n __headerRef,\n __fullPage = false,\n __disableStickyMobile = true,\n __funnelSubStepProps,\n __subStepRef,\n ...restProps\n}: InternalContainerProps) {\n const isMobile = useMobile();\n const isRefresh = useVisualRefresh();\n const baseProps = getBaseProps(restProps);\n const rootRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLDivElement>(null);\n const { isSticky, isStuck, isStuckAtBottom, stickyStyles } = useStickyHeader(\n rootRef,\n headerRef,\n __stickyHeader,\n __stickyOffset,\n __mobileStickyOffset,\n __disableStickyMobile,\n __fullPage && isRefresh && !isMobile\n );\n const contentId = useUniqueId();\n\n const hasDynamicHeight = isRefresh && variant === 'full-page';\n\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n const headerMergedRef = useMergeRefs(headerRef, __headerRef);\n\n // The container is only sticky on mobile if it is the header for the table.\n // In this case we don't want the container to have sticky styles, as only the table header row will show as stuck on scroll.\n const shouldHaveStickyStyles = isSticky && !isMobile;\n\n const hasMedia = !!media?.content;\n const mediaPosition = media?.position ?? 'top';\n return (\n <div\n {...baseProps}\n {...__funnelSubStepProps}\n className={clsx(\n baseProps.className,\n styles.root,\n styles[`variant-${variant}`],\n fitHeight && styles['fit-height'],\n hasMedia && (mediaPosition === 'side' ? styles['with-side-media'] : styles['with-top-media']),\n shouldHaveStickyStyles && [styles['sticky-enabled']],\n shouldHaveStickyStyles && isStuck && isStuckAtBottom && [styles['with-stuck-sticky-header-at-bottom']],\n isRefresh && styles.refresh\n )}\n ref={mergedRef}\n {...getAnalyticsLabelAttribute(\n `.${analyticsSelectors.header} h1, .${analyticsSelectors.header} h2, .${analyticsSelectors.header} h3`\n )}\n >\n {hasMedia && (\n <div\n className={clsx(styles[`media-${mediaPosition === 'side' ? 'side' : 'top'}`], styles.media)}\n style={mediaPosition === 'top' ? { height: media?.height || '' } : { width: media?.width || '' }}\n >\n {media.content}\n </div>\n )}\n <div\n id={contentId}\n ref={__subStepRef}\n className={clsx(styles['content-wrapper'], fitHeight && styles['content-wrapper-fit-height'])}\n >\n {header && (\n <ContainerHeaderContextProvider>\n <StickyHeaderContext.Provider value={{ isStuck, isStuckAtBottom }}>\n <div\n className={clsx(\n isRefresh && styles.refresh,\n styles.header,\n analyticsSelectors.header,\n styles[`header-variant-${variant}`],\n {\n [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,\n [styles['header-sticky-enabled']]: isSticky,\n [styles['header-dynamic-height']]: hasDynamicHeight,\n [styles['header-stuck']]: isStuck,\n [styles['with-paddings']]: !disableHeaderPaddings,\n [styles['with-hidden-content']]: !children || __hiddenContent,\n [styles['header-with-media']]: hasMedia,\n [styles['header-full-page']]: __fullPage && isRefresh,\n }\n )}\n {...stickyStyles}\n ref={headerMergedRef}\n >\n {isStuck && !isMobile && isRefresh && __fullPage && <div className={styles['header-cover']}></div>}\n {header}\n </div>\n </StickyHeaderContext.Provider>\n </ContainerHeaderContextProvider>\n )}\n <div className={clsx(styles.content, fitHeight && styles['content-fit-height'])}>\n <div\n className={clsx(styles['content-inner'], testStyles['content-inner'], {\n [styles['with-paddings']]: !disableContentPaddings,\n [styles['with-header']]: !!header,\n })}\n >\n {children}\n </div>\n </div>\n {footer && (\n <div\n className={clsx(styles.footer, {\n [styles['with-divider']]: !__disableFooterDivider,\n [styles['with-paddings']]: !__disableFooterPaddings,\n })}\n >\n {footer}\n </div>\n )}\n </div>\n </div>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsLabelAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { getBaseProps } from '../internal/base-component';\nimport { ContainerHeaderContextProvider } from '../internal/context/container-header';\nimport { useModalContext } from '../internal/context/modal-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { ContainerProps } from './interfaces';\nimport { StickyHeaderContext, useStickyHeader } from './use-sticky-header';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\nimport testStyles from './test-classes/styles.css.js';\n\nexport interface InternalContainerProps extends Omit<ContainerProps, 'variant'>, InternalBaseComponentProps {\n disableFooterPaddings?: boolean;\n __stickyHeader?: boolean;\n __stickyOffset?: number;\n __mobileStickyOffset?: number;\n __disableFooterDivider?: boolean;\n __hiddenContent?: boolean;\n __headerRef?: React.RefObject<HTMLDivElement>;\n __fullPage?: boolean;\n __disableStickyMobile?: boolean;\n /**\n * Additional internal variant:\n * * `embedded` - Use this variant within a parent container (such as a modal,\n * expandable section, container or split panel).\n * * `full-page` – Only for internal use in table, cards and other components\n */\n variant?: ContainerProps['variant'] | 'embedded' | 'full-page' | 'cards';\n\n __funnelSubStepProps?: ReturnType<typeof useFunnelSubStep>['funnelSubStepProps'];\n __subStepRef?: ReturnType<typeof useFunnelSubStep>['subStepRef'];\n}\n\nexport function InternalContainerAsSubstep(props: InternalContainerProps) {\n const { subStepRef, funnelSubStepProps } = useFunnelSubStep();\n const modalContext = useModalContext();\n\n return (\n <InternalContainer\n {...props}\n __subStepRef={modalContext?.isInModal ? { current: null } : subStepRef}\n __funnelSubStepProps={modalContext?.isInModal ? {} : funnelSubStepProps}\n />\n );\n}\n\nexport default function InternalContainer({\n header,\n footer,\n children,\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n disableFooterPaddings = false,\n fitHeight,\n media,\n __stickyOffset,\n __mobileStickyOffset,\n __stickyHeader = false,\n __internalRootRef = null,\n __disableFooterDivider = false,\n __hiddenContent = false,\n __headerRef,\n __fullPage = false,\n __disableStickyMobile = true,\n __funnelSubStepProps,\n __subStepRef,\n ...restProps\n}: InternalContainerProps) {\n const isMobile = useMobile();\n const isRefresh = useVisualRefresh();\n const baseProps = getBaseProps(restProps);\n const rootRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLDivElement>(null);\n const { isSticky, isStuck, isStuckAtBottom, stickyStyles } = useStickyHeader(\n rootRef,\n headerRef,\n __stickyHeader,\n __stickyOffset,\n __mobileStickyOffset,\n __disableStickyMobile,\n __fullPage && isRefresh && !isMobile\n );\n const contentId = useUniqueId();\n\n const hasDynamicHeight = isRefresh && variant === 'full-page';\n\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n const headerMergedRef = useMergeRefs(headerRef, __headerRef);\n\n // The container is only sticky on mobile if it is the header for the table.\n // In this case we don't want the container to have sticky styles, as only the table header row will show as stuck on scroll.\n const shouldHaveStickyStyles = isSticky && !isMobile;\n\n const hasMedia = !!media?.content;\n const mediaPosition = media?.position ?? 'top';\n return (\n <div\n {...baseProps}\n {...__funnelSubStepProps}\n className={clsx(\n baseProps.className,\n styles.root,\n styles[`variant-${variant}`],\n fitHeight && styles['fit-height'],\n hasMedia && (mediaPosition === 'side' ? styles['with-side-media'] : styles['with-top-media']),\n shouldHaveStickyStyles && [styles['sticky-enabled']],\n shouldHaveStickyStyles && isStuck && isStuckAtBottom && [styles['with-stuck-sticky-header-at-bottom']],\n isRefresh && styles.refresh\n )}\n ref={mergedRef}\n {...getAnalyticsLabelAttribute(\n `.${analyticsSelectors.header} h1, .${analyticsSelectors.header} h2, .${analyticsSelectors.header} h3`\n )}\n >\n {hasMedia && (\n <div\n className={clsx(styles[`media-${mediaPosition === 'side' ? 'side' : 'top'}`], styles.media)}\n style={mediaPosition === 'top' ? { height: media?.height || '' } : { width: media?.width || '' }}\n >\n {media.content}\n </div>\n )}\n <div\n id={contentId}\n ref={__subStepRef}\n className={clsx(styles['content-wrapper'], fitHeight && styles['content-wrapper-fit-height'])}\n >\n {header && (\n <ContainerHeaderContextProvider>\n <StickyHeaderContext.Provider value={{ isStuck, isStuckAtBottom }}>\n <div\n className={clsx(\n isRefresh && styles.refresh,\n styles.header,\n analyticsSelectors.header,\n styles[`header-variant-${variant}`],\n {\n [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,\n [styles['header-sticky-enabled']]: isSticky,\n [styles['header-dynamic-height']]: hasDynamicHeight,\n [styles['header-stuck']]: isStuck,\n [styles['with-paddings']]: !disableHeaderPaddings,\n [styles['with-hidden-content']]: !children || __hiddenContent,\n [styles['header-with-media']]: hasMedia,\n [styles['header-full-page']]: __fullPage && isRefresh,\n }\n )}\n {...stickyStyles}\n ref={headerMergedRef}\n >\n {isStuck && !isMobile && isRefresh && __fullPage && <div className={styles['header-cover']}></div>}\n {header}\n </div>\n </StickyHeaderContext.Provider>\n </ContainerHeaderContextProvider>\n )}\n <div className={clsx(styles.content, fitHeight && styles['content-fit-height'])}>\n <div\n className={clsx(styles['content-inner'], testStyles['content-inner'], {\n [styles['with-paddings']]: !disableContentPaddings,\n [styles['with-header']]: !!header,\n })}\n >\n {children}\n </div>\n </div>\n {footer && (\n <div\n className={clsx(styles.footer, {\n [styles['with-divider']]: !__disableFooterDivider,\n [styles['with-paddings']]: !disableFooterPaddings,\n })}\n >\n {footer}\n </div>\n )}\n </div>\n </div>\n );\n}\n"]}
|
|
@@ -198,8 +198,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
198
198
|
font-style: normal;
|
|
199
199
|
font-variant: normal;
|
|
200
200
|
font-stretch: normal;
|
|
201
|
-
|
|
202
|
-
hyphens: none;
|
|
201
|
+
hyphens: none;
|
|
203
202
|
letter-spacing: normal;
|
|
204
203
|
list-style: disc outside none;
|
|
205
204
|
tab-size: 8;
|
|
@@ -154,8 +154,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
154
154
|
font-style: normal;
|
|
155
155
|
font-variant: normal;
|
|
156
156
|
font-stretch: normal;
|
|
157
|
-
|
|
158
|
-
hyphens: none;
|
|
157
|
+
hyphens: none;
|
|
159
158
|
letter-spacing: normal;
|
|
160
159
|
list-style: disc outside none;
|
|
161
160
|
tab-size: 8;
|
|
@@ -185,8 +185,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
185
185
|
font-style: normal;
|
|
186
186
|
font-variant: normal;
|
|
187
187
|
font-stretch: normal;
|
|
188
|
-
|
|
189
|
-
hyphens: none;
|
|
188
|
+
hyphens: none;
|
|
190
189
|
letter-spacing: normal;
|
|
191
190
|
list-style: disc outside none;
|
|
192
191
|
tab-size: 8;
|
|
@@ -198,8 +198,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
198
198
|
font-style: normal;
|
|
199
199
|
font-variant: normal;
|
|
200
200
|
font-stretch: normal;
|
|
201
|
-
|
|
202
|
-
hyphens: none;
|
|
201
|
+
hyphens: none;
|
|
203
202
|
letter-spacing: normal;
|
|
204
203
|
list-style: disc outside none;
|
|
205
204
|
tab-size: 8;
|
|
@@ -220,8 +220,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
220
220
|
font-style: normal;
|
|
221
221
|
font-variant: normal;
|
|
222
222
|
font-stretch: normal;
|
|
223
|
-
|
|
224
|
-
hyphens: none;
|
|
223
|
+
hyphens: none;
|
|
225
224
|
letter-spacing: normal;
|
|
226
225
|
list-style: disc outside none;
|
|
227
226
|
tab-size: 8;
|
|
@@ -218,8 +218,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
218
218
|
font-style: normal;
|
|
219
219
|
font-variant: normal;
|
|
220
220
|
font-stretch: normal;
|
|
221
|
-
|
|
222
|
-
hyphens: none;
|
|
221
|
+
hyphens: none;
|
|
223
222
|
letter-spacing: normal;
|
|
224
223
|
list-style: disc outside none;
|
|
225
224
|
tab-size: 8;
|
|
@@ -710,8 +710,7 @@ body[data-awsui-focus-visible=true] .awsui_stack_1q84n_1smjk_370 > .awsui_notifi
|
|
|
710
710
|
font-style: normal;
|
|
711
711
|
font-variant: normal;
|
|
712
712
|
font-stretch: normal;
|
|
713
|
-
|
|
714
|
-
hyphens: none;
|
|
713
|
+
hyphens: none;
|
|
715
714
|
letter-spacing: normal;
|
|
716
715
|
list-style: disc outside none;
|
|
717
716
|
tab-size: 8;
|
|
@@ -154,8 +154,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
154
154
|
font-style: normal;
|
|
155
155
|
font-variant: normal;
|
|
156
156
|
font-stretch: normal;
|
|
157
|
-
|
|
158
|
-
hyphens: none;
|
|
157
|
+
hyphens: none;
|
|
159
158
|
letter-spacing: normal;
|
|
160
159
|
list-style: disc outside none;
|
|
161
160
|
tab-size: 8;
|
|
@@ -239,8 +239,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
239
239
|
font-style: normal;
|
|
240
240
|
font-variant: normal;
|
|
241
241
|
font-stretch: normal;
|
|
242
|
-
|
|
243
|
-
hyphens: none;
|
|
242
|
+
hyphens: none;
|
|
244
243
|
letter-spacing: normal;
|
|
245
244
|
list-style: disc outside none;
|
|
246
245
|
tab-size: 8;
|
|
@@ -154,8 +154,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
154
154
|
font-style: normal;
|
|
155
155
|
font-variant: normal;
|
|
156
156
|
font-stretch: normal;
|
|
157
|
-
|
|
158
|
-
hyphens: none;
|
|
157
|
+
hyphens: none;
|
|
159
158
|
letter-spacing: normal;
|
|
160
159
|
list-style: disc outside none;
|
|
161
160
|
tab-size: 8;
|
|
@@ -190,8 +190,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
190
190
|
font-style: normal;
|
|
191
191
|
font-variant: normal;
|
|
192
192
|
font-stretch: normal;
|
|
193
|
-
|
|
194
|
-
hyphens: none;
|
|
193
|
+
hyphens: none;
|
|
195
194
|
letter-spacing: normal;
|
|
196
195
|
list-style: disc outside none;
|
|
197
196
|
tab-size: 8;
|
|
@@ -190,8 +190,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
190
190
|
font-style: normal;
|
|
191
191
|
font-variant: normal;
|
|
192
192
|
font-stretch: normal;
|
|
193
|
-
|
|
194
|
-
hyphens: none;
|
|
193
|
+
hyphens: none;
|
|
195
194
|
letter-spacing: normal;
|
|
196
195
|
list-style: disc outside none;
|
|
197
196
|
tab-size: 8;
|
|
@@ -158,8 +158,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
158
158
|
font-style: normal;
|
|
159
159
|
font-variant: normal;
|
|
160
160
|
font-stretch: normal;
|
|
161
|
-
|
|
162
|
-
hyphens: none;
|
|
161
|
+
hyphens: none;
|
|
163
162
|
letter-spacing: normal;
|
|
164
163
|
list-style: disc outside none;
|
|
165
164
|
tab-size: 8;
|
|
@@ -184,8 +184,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
184
184
|
font-style: normal;
|
|
185
185
|
font-variant: normal;
|
|
186
186
|
font-stretch: normal;
|
|
187
|
-
|
|
188
|
-
hyphens: none;
|
|
187
|
+
hyphens: none;
|
|
189
188
|
letter-spacing: normal;
|
|
190
189
|
list-style: disc outside none;
|
|
191
190
|
tab-size: 8;
|
|
@@ -154,8 +154,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
154
154
|
font-style: normal;
|
|
155
155
|
font-variant: normal;
|
|
156
156
|
font-stretch: normal;
|
|
157
|
-
|
|
158
|
-
hyphens: none;
|
|
157
|
+
hyphens: none;
|
|
159
158
|
letter-spacing: normal;
|
|
160
159
|
list-style: disc outside none;
|
|
161
160
|
tab-size: 8;
|
|
@@ -176,8 +176,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
176
176
|
font-style: normal;
|
|
177
177
|
font-variant: normal;
|
|
178
178
|
font-stretch: normal;
|
|
179
|
-
|
|
180
|
-
hyphens: none;
|
|
179
|
+
hyphens: none;
|
|
181
180
|
letter-spacing: normal;
|
|
182
181
|
list-style: disc outside none;
|
|
183
182
|
tab-size: 8;
|
|
@@ -154,8 +154,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
154
154
|
font-style: normal;
|
|
155
155
|
font-variant: normal;
|
|
156
156
|
font-stretch: normal;
|
|
157
|
-
|
|
158
|
-
hyphens: none;
|
|
157
|
+
hyphens: none;
|
|
159
158
|
letter-spacing: normal;
|
|
160
159
|
list-style: disc outside none;
|
|
161
160
|
tab-size: 8;
|
|
@@ -162,8 +162,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
162
162
|
font-style: normal;
|
|
163
163
|
font-variant: normal;
|
|
164
164
|
font-stretch: normal;
|
|
165
|
-
|
|
166
|
-
hyphens: none;
|
|
165
|
+
hyphens: none;
|
|
167
166
|
letter-spacing: normal;
|
|
168
167
|
list-style: disc outside none;
|
|
169
168
|
tab-size: 8;
|
|
@@ -215,8 +214,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
215
214
|
font-style: normal;
|
|
216
215
|
font-variant: normal;
|
|
217
216
|
font-stretch: normal;
|
|
218
|
-
|
|
219
|
-
hyphens: none;
|
|
217
|
+
hyphens: none;
|
|
220
218
|
letter-spacing: normal;
|
|
221
219
|
list-style: disc outside none;
|
|
222
220
|
tab-size: 8;
|
|
@@ -302,8 +300,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
302
300
|
font-style: normal;
|
|
303
301
|
font-variant: normal;
|
|
304
302
|
font-stretch: normal;
|
|
305
|
-
|
|
306
|
-
hyphens: none;
|
|
303
|
+
hyphens: none;
|
|
307
304
|
letter-spacing: normal;
|
|
308
305
|
list-style: disc outside none;
|
|
309
306
|
tab-size: 8;
|
|
@@ -154,8 +154,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
154
154
|
font-style: normal;
|
|
155
155
|
font-variant: normal;
|
|
156
156
|
font-stretch: normal;
|
|
157
|
-
|
|
158
|
-
hyphens: none;
|
|
157
|
+
hyphens: none;
|
|
159
158
|
letter-spacing: normal;
|
|
160
159
|
list-style: disc outside none;
|
|
161
160
|
tab-size: 8;
|
|
@@ -190,8 +190,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
190
190
|
font-style: normal;
|
|
191
191
|
font-variant: normal;
|
|
192
192
|
font-stretch: normal;
|
|
193
|
-
|
|
194
|
-
hyphens: none;
|
|
193
|
+
hyphens: none;
|
|
195
194
|
letter-spacing: normal;
|
|
196
195
|
list-style: disc outside none;
|
|
197
196
|
tab-size: 8;
|
|
@@ -208,8 +208,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
208
208
|
font-style: normal;
|
|
209
209
|
font-variant: normal;
|
|
210
210
|
font-stretch: normal;
|
|
211
|
-
|
|
212
|
-
hyphens: none;
|
|
211
|
+
hyphens: none;
|
|
213
212
|
letter-spacing: normal;
|
|
214
213
|
list-style: disc outside none;
|
|
215
214
|
tab-size: 8;
|
|
@@ -154,8 +154,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
154
154
|
font-style: normal;
|
|
155
155
|
font-variant: normal;
|
|
156
156
|
font-stretch: normal;
|
|
157
|
-
|
|
158
|
-
hyphens: none;
|
|
157
|
+
hyphens: none;
|
|
159
158
|
letter-spacing: normal;
|
|
160
159
|
list-style: disc outside none;
|
|
161
160
|
tab-size: 8;
|
|
@@ -154,8 +154,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
154
154
|
font-style: normal;
|
|
155
155
|
font-variant: normal;
|
|
156
156
|
font-stretch: normal;
|
|
157
|
-
|
|
158
|
-
hyphens: none;
|
|
157
|
+
hyphens: none;
|
|
159
158
|
letter-spacing: normal;
|
|
160
159
|
list-style: disc outside none;
|
|
161
160
|
tab-size: 8;
|
|
@@ -154,8 +154,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
154
154
|
font-style: normal;
|
|
155
155
|
font-variant: normal;
|
|
156
156
|
font-stretch: normal;
|
|
157
|
-
|
|
158
|
-
hyphens: none;
|
|
157
|
+
hyphens: none;
|
|
159
158
|
letter-spacing: normal;
|
|
160
159
|
list-style: disc outside none;
|
|
161
160
|
tab-size: 8;
|
|
@@ -162,8 +162,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
162
162
|
font-style: normal;
|
|
163
163
|
font-variant: normal;
|
|
164
164
|
font-stretch: normal;
|
|
165
|
-
|
|
166
|
-
hyphens: none;
|
|
165
|
+
hyphens: none;
|
|
167
166
|
letter-spacing: normal;
|
|
168
167
|
list-style: disc outside none;
|
|
169
168
|
tab-size: 8;
|
|
@@ -161,8 +161,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
161
161
|
font-style: normal;
|
|
162
162
|
font-variant: normal;
|
|
163
163
|
font-stretch: normal;
|
|
164
|
-
|
|
165
|
-
hyphens: none;
|
|
164
|
+
hyphens: none;
|
|
166
165
|
letter-spacing: normal;
|
|
167
166
|
list-style: disc outside none;
|
|
168
167
|
tab-size: 8;
|
package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.d.ts
CHANGED
|
@@ -14,6 +14,7 @@ export interface HighlightedOptionState<OptionType> {
|
|
|
14
14
|
}
|
|
15
15
|
export interface HighlightedOptionHandlers<OptionType> {
|
|
16
16
|
setHighlightedIndexWithMouse(index: number, moveFocus?: boolean): void;
|
|
17
|
+
highlightFirstOptionWithMouse(): void;
|
|
17
18
|
moveHighlightWithKeyboard(direction: -1 | 1): void;
|
|
18
19
|
highlightOptionWithKeyboard(option: OptionType): void;
|
|
19
20
|
resetHighlightWithKeyboard(): void;
|
package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-highlight-option.d.ts","sourceRoot":"","sources":["../../../../../../src/internal/components/options-list/utils/use-highlight-option.ts"],"names":[],"mappings":"AAIA,qBAAa,aAAa;IAEf,IAAI,EAAE,UAAU,GAAG,OAAO;IAC1B,SAAS,EAAE,OAAO;gBADlB,IAAI,EAAE,UAAU,GAAG,OAAO,EAC1B,SAAS,GAAE,OAA6B;CAElD;AAED,UAAU,sBAAsB,CAAC,UAAU;IACzC,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;IAC/B,eAAe,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,OAAO,CAAC;CAClD;AAED,MAAM,WAAW,sBAAsB,CAAC,UAAU;IAChD,aAAa,EAAE,aAAa,CAAC;IAC7B,gBAAgB,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,UAAU,CAAC;CAChC;AAED,MAAM,WAAW,yBAAyB,CAAC,UAAU;IAEnD,4BAA4B,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"use-highlight-option.d.ts","sourceRoot":"","sources":["../../../../../../src/internal/components/options-list/utils/use-highlight-option.ts"],"names":[],"mappings":"AAIA,qBAAa,aAAa;IAEf,IAAI,EAAE,UAAU,GAAG,OAAO;IAC1B,SAAS,EAAE,OAAO;gBADlB,IAAI,EAAE,UAAU,GAAG,OAAO,EAC1B,SAAS,GAAE,OAA6B;CAElD;AAED,UAAU,sBAAsB,CAAC,UAAU;IACzC,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;IAC/B,eAAe,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,OAAO,CAAC;CAClD;AAED,MAAM,WAAW,sBAAsB,CAAC,UAAU;IAChD,aAAa,EAAE,aAAa,CAAC;IAC7B,gBAAgB,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,UAAU,CAAC;CAChC;AAED,MAAM,WAAW,yBAAyB,CAAC,UAAU;IAEnD,4BAA4B,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IACvE,6BAA6B,IAAI,IAAI,CAAC;IAEtC,yBAAyB,CAAC,SAAS,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACnD,2BAA2B,CAAC,MAAM,EAAE,UAAU,GAAG,IAAI,CAAC;IACtD,0BAA0B,IAAI,IAAI,CAAC;IACnC,kBAAkB,IAAI,IAAI,CAAC;IAC3B,iBAAiB,IAAI,IAAI,CAAC;CAC3B;AAED,wBAAgB,oBAAoB,CAAC,UAAU,EAAE,EAC/C,OAAO,EACP,eAAe,GAChB,EAAE,sBAAsB,CAAC,UAAU,CAAC,GAAG,CAAC,sBAAsB,CAAC,UAAU,CAAC,EAAE,yBAAyB,CAAC,UAAU,CAAC,CAAC,CA+ClH"}
|
package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.js
CHANGED
|
@@ -34,6 +34,7 @@ export function useHighlightedOption({ options, isHighlightable, }) {
|
|
|
34
34
|
{ highlightType, highlightedIndex, highlightedOption },
|
|
35
35
|
{
|
|
36
36
|
setHighlightedIndexWithMouse: (index, moveFocus = false) => setHighlightedIndex(index, new HighlightType('mouse', moveFocus)),
|
|
37
|
+
highlightFirstOptionWithMouse: () => moveHighlightFrom(1, -1, new HighlightType('mouse', true)),
|
|
37
38
|
moveHighlightWithKeyboard: (direction) => moveHighlight(direction, new HighlightType('keyboard')),
|
|
38
39
|
highlightOptionWithKeyboard: (option) => highlightOption(option, new HighlightType('keyboard')),
|
|
39
40
|
resetHighlightWithKeyboard: () => setHighlightedIndex(-1, new HighlightType('keyboard')),
|
package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-highlight-option.js","sourceRoot":"","sources":["../../../../../../src/internal/components/options-list/utils/use-highlight-option.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE9C,MAAM,OAAO,aAAa;IACxB,YACS,IAA0B,EAC1B,YAAqB,IAAI,KAAK,UAAU;QADxC,SAAI,GAAJ,IAAI,CAAsB;QAC1B,cAAS,GAAT,SAAS,CAA+B;IAC9C,CAAC;CACL;
|
|
1
|
+
{"version":3,"file":"use-highlight-option.js","sourceRoot":"","sources":["../../../../../../src/internal/components/options-list/utils/use-highlight-option.ts"],"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 { useCallback, useState } from 'react';\n\nexport class HighlightType {\n constructor(\n public type: 'keyboard' | 'mouse',\n public moveFocus: boolean = type === 'keyboard'\n ) {}\n}\n\ninterface HighlightedOptionProps<OptionType> {\n options: readonly OptionType[];\n isHighlightable: (option: OptionType) => boolean;\n}\n\nexport interface HighlightedOptionState<OptionType> {\n highlightType: HighlightType;\n highlightedIndex: number;\n highlightedOption?: OptionType;\n}\n\nexport interface HighlightedOptionHandlers<OptionType> {\n // Mouse handlers\n setHighlightedIndexWithMouse(index: number, moveFocus?: boolean): void;\n highlightFirstOptionWithMouse(): void;\n // Keyboard handlers\n moveHighlightWithKeyboard(direction: -1 | 1): void;\n highlightOptionWithKeyboard(option: OptionType): void;\n resetHighlightWithKeyboard(): void;\n goHomeWithKeyboard(): void;\n goEndWithKeyboard(): void;\n}\n\nexport function useHighlightedOption<OptionType>({\n options,\n isHighlightable,\n}: HighlightedOptionProps<OptionType>): [HighlightedOptionState<OptionType>, HighlightedOptionHandlers<OptionType>] {\n const [highlightedIndex, setHighlightedIndexState] = useState(-1);\n const [highlightType, setHighlightType] = useState<HighlightType>(new HighlightType('keyboard'));\n const setHighlightedIndex = useCallback((index: number, newHighlightType: HighlightType) => {\n setHighlightedIndexState(index);\n setHighlightType(oldHighlight => (oldHighlight.type !== newHighlightType.type ? newHighlightType : oldHighlight));\n }, []);\n\n const highlightedOption =\n options[highlightedIndex] && isHighlightable(options[highlightedIndex]) ? options[highlightedIndex] : undefined;\n\n const moveHighlightFrom = (direction: -1 | 1, startIndex = highlightedIndex, highlightType: HighlightType) => {\n const fromBottomEnd = startIndex === -1 && direction === -1;\n let newIndex = fromBottomEnd ? options.length : startIndex;\n do {\n newIndex += direction;\n } while (options[newIndex] && !isHighlightable(options[newIndex]));\n\n if (options[newIndex]) {\n setHighlightedIndex(newIndex, highlightType);\n }\n };\n\n const moveHighlight = (direction: -1 | 1, highlightType: HighlightType) =>\n moveHighlightFrom(direction, highlightedIndex, highlightType);\n\n const highlightOption = useCallback(\n (option: OptionType, highlightType: HighlightType) => {\n const index = options.indexOf(option);\n setHighlightedIndex(index, highlightType);\n },\n [options, setHighlightedIndex]\n );\n\n return [\n { highlightType, highlightedIndex, highlightedOption },\n {\n setHighlightedIndexWithMouse: (index: number, moveFocus = false) =>\n setHighlightedIndex(index, new HighlightType('mouse', moveFocus)),\n highlightFirstOptionWithMouse: () => moveHighlightFrom(1, -1, new HighlightType('mouse', true)),\n moveHighlightWithKeyboard: (direction: -1 | 1) => moveHighlight(direction, new HighlightType('keyboard')),\n highlightOptionWithKeyboard: (option: OptionType) => highlightOption(option, new HighlightType('keyboard')),\n resetHighlightWithKeyboard: () => setHighlightedIndex(-1, new HighlightType('keyboard')),\n goHomeWithKeyboard: () => moveHighlightFrom(1, -1, new HighlightType('keyboard')),\n goEndWithKeyboard: () => moveHighlightFrom(-1, options.length, new HighlightType('keyboard')),\n },\n ];\n}\n"]}
|
|
@@ -260,8 +260,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
260
260
|
font-style: normal;
|
|
261
261
|
font-variant: normal;
|
|
262
262
|
font-stretch: normal;
|
|
263
|
-
|
|
264
|
-
hyphens: none;
|
|
263
|
+
hyphens: none;
|
|
265
264
|
letter-spacing: normal;
|
|
266
265
|
list-style: disc outside none;
|
|
267
266
|
tab-size: 8;
|