@cloudscape-design/components 3.0.341 → 3.0.343

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (120) hide show
  1. package/area-chart/chart-container.d.ts +3 -1
  2. package/area-chart/chart-container.d.ts.map +1 -1
  3. package/area-chart/chart-container.js +3 -2
  4. package/area-chart/chart-container.js.map +1 -1
  5. package/area-chart/internal.d.ts +1 -1
  6. package/area-chart/internal.d.ts.map +1 -1
  7. package/area-chart/internal.js +3 -2
  8. package/area-chart/internal.js.map +1 -1
  9. package/area-chart/model/index.d.ts +1 -0
  10. package/area-chart/model/index.d.ts.map +1 -1
  11. package/area-chart/model/index.js.map +1 -1
  12. package/area-chart/model/use-chart-model.d.ts +2 -1
  13. package/area-chart/model/use-chart-model.d.ts.map +1 -1
  14. package/area-chart/model/use-chart-model.js +8 -2
  15. package/area-chart/model/use-chart-model.js.map +1 -1
  16. package/autosuggest/internal.js +4 -4
  17. package/autosuggest/internal.js.map +1 -1
  18. package/button-dropdown/tooltip.js +1 -1
  19. package/button-dropdown/tooltip.js.map +1 -1
  20. package/cards/index.d.ts.map +1 -1
  21. package/cards/index.js +8 -6
  22. package/cards/index.js.map +1 -1
  23. package/code-editor/index.js +1 -1
  24. package/code-editor/index.js.map +1 -1
  25. package/flashbar/common.js +2 -2
  26. package/flashbar/common.js.map +1 -1
  27. package/internal/analytics/components/analytics-funnel.d.ts +1 -1
  28. package/internal/analytics/components/analytics-funnel.d.ts.map +1 -1
  29. package/internal/analytics/components/analytics-funnel.js +24 -5
  30. package/internal/analytics/components/analytics-funnel.js.map +1 -1
  31. package/internal/analytics/context/analytics-context.d.ts +1 -0
  32. package/internal/analytics/context/analytics-context.d.ts.map +1 -1
  33. package/internal/analytics/context/analytics-context.js +1 -0
  34. package/internal/analytics/context/analytics-context.js.map +1 -1
  35. package/internal/analytics/index.d.ts.map +1 -1
  36. package/internal/analytics/index.js +1 -0
  37. package/internal/analytics/index.js.map +1 -1
  38. package/internal/analytics/interfaces.d.ts +13 -2
  39. package/internal/analytics/interfaces.d.ts.map +1 -1
  40. package/internal/analytics/interfaces.js.map +1 -1
  41. package/internal/components/autosuggest-input/index.d.ts.map +1 -1
  42. package/internal/components/autosuggest-input/index.js +10 -9
  43. package/internal/components/autosuggest-input/index.js.map +1 -1
  44. package/internal/components/cartesian-chart/chart-container.d.ts +2 -0
  45. package/internal/components/cartesian-chart/chart-container.d.ts.map +1 -1
  46. package/internal/components/cartesian-chart/chart-container.js +16 -3
  47. package/internal/components/cartesian-chart/chart-container.js.map +1 -1
  48. package/internal/components/cartesian-chart/interfaces.d.ts +5 -0
  49. package/internal/components/cartesian-chart/interfaces.d.ts.map +1 -1
  50. package/internal/components/cartesian-chart/interfaces.js.map +1 -1
  51. package/internal/components/cartesian-chart/styles.css.js +27 -23
  52. package/internal/components/cartesian-chart/styles.scoped.css +54 -27
  53. package/internal/components/cartesian-chart/styles.selectors.js +27 -23
  54. package/internal/components/chart-plot/index.d.ts +2 -2
  55. package/internal/components/chart-plot/index.d.ts.map +1 -1
  56. package/internal/components/chart-plot/index.js +3 -1
  57. package/internal/components/chart-plot/index.js.map +1 -1
  58. package/internal/components/chart-wrapper/index.d.ts +1 -0
  59. package/internal/components/chart-wrapper/index.d.ts.map +1 -1
  60. package/internal/components/chart-wrapper/index.js +21 -6
  61. package/internal/components/chart-wrapper/index.js.map +1 -1
  62. package/internal/components/chart-wrapper/styles.css.js +9 -6
  63. package/internal/components/chart-wrapper/styles.scoped.css +20 -6
  64. package/internal/components/chart-wrapper/styles.selectors.js +9 -6
  65. package/internal/components/transition/index.js +1 -1
  66. package/internal/components/transition/index.js.map +1 -1
  67. package/internal/environment.js +1 -1
  68. package/internal/environment.json +6 -0
  69. package/internal/hooks/use-portal-mode-classes/index.d.ts.map +1 -1
  70. package/internal/hooks/use-portal-mode-classes/index.js +2 -1
  71. package/internal/hooks/use-portal-mode-classes/index.js.map +1 -1
  72. package/internal/hooks/use-visual-mode/index.d.ts +0 -4
  73. package/internal/hooks/use-visual-mode/index.d.ts.map +1 -1
  74. package/internal/hooks/use-visual-mode/index.js +0 -30
  75. package/internal/hooks/use-visual-mode/index.js.map +1 -1
  76. package/internal/manifest.json +1 -1
  77. package/mixed-line-bar-chart/chart-container.d.ts +2 -1
  78. package/mixed-line-bar-chart/chart-container.d.ts.map +1 -1
  79. package/mixed-line-bar-chart/chart-container.js +8 -2
  80. package/mixed-line-bar-chart/chart-container.js.map +1 -1
  81. package/mixed-line-bar-chart/internal.d.ts +1 -1
  82. package/mixed-line-bar-chart/internal.d.ts.map +1 -1
  83. package/mixed-line-bar-chart/internal.js +3 -3
  84. package/mixed-line-bar-chart/internal.js.map +1 -1
  85. package/package.json +1 -1
  86. package/pie-chart/index.d.ts +1 -1
  87. package/pie-chart/index.d.ts.map +1 -1
  88. package/pie-chart/index.js +10 -3
  89. package/pie-chart/index.js.map +1 -1
  90. package/pie-chart/interfaces.d.ts +5 -0
  91. package/pie-chart/interfaces.d.ts.map +1 -1
  92. package/pie-chart/interfaces.js.map +1 -1
  93. package/pie-chart/labels.d.ts +3 -2
  94. package/pie-chart/labels.d.ts.map +1 -1
  95. package/pie-chart/labels.js +4 -4
  96. package/pie-chart/labels.js.map +1 -1
  97. package/pie-chart/pie-chart.d.ts +2 -1
  98. package/pie-chart/pie-chart.d.ts.map +1 -1
  99. package/pie-chart/pie-chart.js +18 -14
  100. package/pie-chart/pie-chart.js.map +1 -1
  101. package/pie-chart/segments.d.ts +3 -2
  102. package/pie-chart/segments.d.ts.map +1 -1
  103. package/pie-chart/segments.js +2 -6
  104. package/pie-chart/segments.js.map +1 -1
  105. package/pie-chart/styles.css.js +27 -23
  106. package/pie-chart/styles.scoped.css +58 -38
  107. package/pie-chart/styles.selectors.js +27 -23
  108. package/pie-chart/utils.d.ts +12 -2
  109. package/pie-chart/utils.d.ts.map +1 -1
  110. package/pie-chart/utils.js +37 -9
  111. package/pie-chart/utils.js.map +1 -1
  112. package/popover/internal.d.ts.map +1 -1
  113. package/popover/internal.js +9 -3
  114. package/popover/internal.js.map +1 -1
  115. package/tabs/smooth-scroll.js +1 -1
  116. package/tabs/smooth-scroll.js.map +1 -1
  117. package/internal/motion.d.ts +0 -2
  118. package/internal/motion.d.ts.map +0 -1
  119. package/internal/motion.js +0 -9
  120. package/internal/motion.js.map +0 -1
@@ -2,28 +2,32 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "axis": "awsui_axis_f0fot_pe91i_9",
6
- "vertical-marker": "awsui_vertical-marker_f0fot_pe91i_10",
7
- "axis--emphasized": "awsui_axis--emphasized_f0fot_pe91i_15",
8
- "axis-label": "awsui_axis-label_f0fot_pe91i_19",
9
- "axis-label--x": "awsui_axis-label--x_f0fot_pe91i_24",
10
- "axis-label--y": "awsui_axis-label--y_f0fot_pe91i_25",
11
- "grid": "awsui_grid_f0fot_pe91i_29",
12
- "ticks__line": "awsui_ticks__line_f0fot_pe91i_34",
13
- "ticks__text": "awsui_ticks__text_f0fot_pe91i_39",
14
- "ticks--y": "awsui_ticks--y_f0fot_pe91i_44",
15
- "ticks--x": "awsui_ticks--x_f0fot_pe91i_45",
16
- "ticks--bottom": "awsui_ticks--bottom_f0fot_pe91i_49",
17
- "labels-left": "awsui_labels-left_f0fot_pe91i_54",
18
- "ticks": "awsui_ticks_f0fot_pe91i_34",
19
- "labels-left__label": "awsui_labels-left__label_f0fot_pe91i_69",
20
- "labels-left--hidden": "awsui_labels-left--hidden_f0fot_pe91i_73",
21
- "labels-bottom": "awsui_labels-bottom_f0fot_pe91i_81",
22
- "vertical-marker-circle": "awsui_vertical-marker-circle_f0fot_pe91i_92",
23
- "vertical-marker-circle-active": "awsui_vertical-marker-circle-active_f0fot_pe91i_98",
24
- "focus-outline": "awsui_focus-outline_f0fot_pe91i_103",
25
- "chart-container": "awsui_chart-container_f0fot_pe91i_111",
26
- "chart-container__vertical": "awsui_chart-container__vertical_f0fot_pe91i_117",
27
- "chart-container__horizontal": "awsui_chart-container__horizontal_f0fot_pe91i_123"
5
+ "axis": "awsui_axis_f0fot_1xwwo_9",
6
+ "vertical-marker": "awsui_vertical-marker_f0fot_1xwwo_10",
7
+ "axis--emphasized": "awsui_axis--emphasized_f0fot_1xwwo_15",
8
+ "axis-label": "awsui_axis-label_f0fot_1xwwo_19",
9
+ "axis-label--x": "awsui_axis-label--x_f0fot_1xwwo_24",
10
+ "axis-label--y": "awsui_axis-label--y_f0fot_1xwwo_25",
11
+ "grid": "awsui_grid_f0fot_1xwwo_29",
12
+ "ticks__line": "awsui_ticks__line_f0fot_1xwwo_34",
13
+ "ticks__text": "awsui_ticks__text_f0fot_1xwwo_39",
14
+ "ticks--y": "awsui_ticks--y_f0fot_1xwwo_44",
15
+ "ticks--x": "awsui_ticks--x_f0fot_1xwwo_45",
16
+ "ticks--bottom": "awsui_ticks--bottom_f0fot_1xwwo_49",
17
+ "labels-left": "awsui_labels-left_f0fot_1xwwo_54",
18
+ "ticks": "awsui_ticks_f0fot_1xwwo_34",
19
+ "labels-left__label": "awsui_labels-left__label_f0fot_1xwwo_69",
20
+ "labels-left--hidden": "awsui_labels-left--hidden_f0fot_1xwwo_73",
21
+ "labels-bottom": "awsui_labels-bottom_f0fot_1xwwo_81",
22
+ "vertical-marker-circle": "awsui_vertical-marker-circle_f0fot_1xwwo_92",
23
+ "vertical-marker-circle-active": "awsui_vertical-marker-circle-active_f0fot_1xwwo_98",
24
+ "focus-outline": "awsui_focus-outline_f0fot_1xwwo_103",
25
+ "chart-container": "awsui_chart-container_f0fot_1xwwo_111",
26
+ "fit-height": "awsui_fit-height_f0fot_1xwwo_116",
27
+ "chart-container-outer": "awsui_chart-container-outer_f0fot_1xwwo_121",
28
+ "chart-container-inner": "awsui_chart-container-inner_f0fot_1xwwo_128",
29
+ "chart-container-plot-wrapper": "awsui_chart-container-plot-wrapper_f0fot_1xwwo_135",
30
+ "chart-container-plot": "awsui_chart-container-plot_f0fot_1xwwo_135",
31
+ "chart-container-bottom-labels": "awsui_chart-container-bottom-labels_f0fot_1xwwo_150"
28
32
  };
29
33
 
@@ -6,8 +6,8 @@ export interface ChartPlotRef {
6
6
  focusApplication(): void;
7
7
  }
8
8
  export interface ChartPlotProps {
9
- width: number;
10
- height: number;
9
+ width: number | string;
10
+ height: number | string;
11
11
  transform?: string;
12
12
  offsetTop?: number;
13
13
  offsetBottom?: number;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/chart-plot/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAUjF,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAMvC,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,aAAa,CAAC;IACnB,SAAS,IAAI,IAAI,CAAC;IAClB,gBAAgB,IAAI,IAAI,CAAC;CAC1B;AAED,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,gBAAgB,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;IACpD,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAChD,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IAC/D,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IAC/D,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IAC9D,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,OAAO,EAAE,OAAO,GAAG,UAAU,KAAK,IAAI,CAAC;IACxF,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACxD,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC9D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;;EASE;;AACF,wBAAqC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/chart-plot/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAUjF,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAMvC,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,aAAa,CAAC;IACnB,SAAS,IAAI,IAAI,CAAC;IAClB,gBAAgB,IAAI,IAAI,CAAC;CAC1B;AAED,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,gBAAgB,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;IACpD,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAChD,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IAC/D,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IAC/D,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IAC9D,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,OAAO,EAAE,OAAO,GAAG,UAAU,KAAK,IAAI,CAAC;IACxF,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACxD,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC9D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;;EASE;;AACF,wBAAqC"}
@@ -89,7 +89,9 @@ function ChartPlot(_a, ref) {
89
89
  }
90
90
  : {};
91
91
  return (React.createElement(React.Fragment, null,
92
- React.createElement("svg", Object.assign({}, restProps, { focusable: plotFocusable, tabIndex: plotTabIndex, role: "application", "aria-hidden": "false" }, plotAria, { ref: svgRef, width: width, height: height, style: {
92
+ React.createElement("svg", Object.assign({}, restProps, { focusable: plotFocusable, tabIndex: plotTabIndex, role: "application", "aria-hidden": "false" }, plotAria, { ref: svgRef, style: {
93
+ width,
94
+ height,
93
95
  marginTop: offsetTop,
94
96
  marginBottom: offsetBottom,
95
97
  marginLeft: offsetLeft,
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/chart-plot/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { forwardRef, useImperativeHandle, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport styles from './styles.css.js';\nimport { useUniqueId } from '../../hooks/use-unique-id';\n\nimport { KeyCode } from '../../keycode';\nimport LiveRegion from '../live-region/index';\nimport ApplicationController, { ApplicationRef } from './application-controller';\nimport FocusOutline from './focus-outline';\nimport { Offset } from '../interfaces';\nimport { useInternalI18n } from '../../i18n/context.js';\n\nconst DEFAULT_PLOT_FOCUS_OFFSET = 3;\nconst DEFAULT_ELEMENT_FOCUS_OFFSET = 3;\n\nexport interface ChartPlotRef {\n svg: SVGSVGElement;\n focusPlot(): void;\n focusApplication(): void;\n}\n\nexport interface ChartPlotProps {\n width: number;\n height: number;\n transform?: string;\n offsetTop?: number;\n offsetBottom?: number;\n offsetLeft?: number;\n offsetRight?: number;\n focusOffset?: number;\n ariaLabel?: string;\n ariaLabelledby?: string;\n ariaDescription?: string;\n ariaDescribedby?: string;\n ariaRoleDescription?: string;\n activeElementKey?: null | string | number | boolean;\n activeElementRef?: React.RefObject<SVGGElement>;\n activeElementFocusOffset?: Offset;\n ariaLiveRegion?: React.ReactNode;\n isClickable?: boolean;\n isPrecise?: boolean;\n onMouseDown?: (event: React.MouseEvent<SVGSVGElement>) => void;\n onMouseMove?: (event: React.MouseEvent<SVGSVGElement>) => void;\n onMouseOut?: (event: React.MouseEvent<SVGSVGElement>) => void;\n onFocus?: (event: React.FocusEvent<SVGGElement>, trigger: 'mouse' | 'keyboard') => void;\n onBlur?: (event: React.FocusEvent<SVGGElement>) => void;\n onKeyDown?: (event: React.KeyboardEvent<SVGGElement>) => void;\n children: React.ReactNode;\n}\n\n/**\n An extension for the SVG to be used for charts. It includes a controller element to\n handle the focus and keyboard interactions in a way that is supported by screen readers.\n\n The application mimics the aria-activedescendant behavior which is unsupported by Safari. The\n activeElementRef is the pointer to the secondary-focus element and activeElementKey denotes when\n the focus transition was made.\n\n Alternatively, ariaLiveRegion can be used to make announcements.\n*/\nexport default forwardRef(ChartPlot);\n\nfunction ChartPlot(\n {\n width,\n height,\n transform,\n offsetTop,\n offsetBottom,\n offsetLeft,\n offsetRight,\n ariaLabel,\n ariaLabelledby,\n ariaRoleDescription,\n ariaDescription,\n ariaDescribedby,\n activeElementKey,\n activeElementRef,\n ariaLiveRegion,\n isClickable,\n isPrecise,\n children,\n onMouseDown,\n onKeyDown,\n onFocus,\n onBlur,\n focusOffset = DEFAULT_PLOT_FOCUS_OFFSET,\n activeElementFocusOffset = DEFAULT_ELEMENT_FOCUS_OFFSET,\n ...restProps\n }: ChartPlotProps,\n ref: React.Ref<ChartPlotRef>\n) {\n const i18n = useInternalI18n('[charts]');\n const svgRef = useRef<SVGSVGElement>(null);\n const applicationRef = useRef<ApplicationRef>(null);\n const plotClickedRef = useRef(false);\n const [isPlotFocused, setPlotFocused] = useState(false);\n const [isApplicationFocused, setApplicationFocused] = useState(false);\n\n const internalDescriptionId = useUniqueId('awsui-chart-plot__description');\n const ariaDescriptionId = [ariaDescription && internalDescriptionId, ariaDescribedby].filter(Boolean).join(' ');\n\n useImperativeHandle(ref, () => ({\n svg: svgRef.current!,\n focusPlot: () => svgRef.current!.focus(),\n focusApplication: () => applicationRef.current!.focus(),\n }));\n\n const onPlotMouseDown = (event: React.MouseEvent<SVGSVGElement, MouseEvent>) => {\n onMouseDown && onMouseDown(event);\n // Record the click was made for the application focus handler.\n plotClickedRef.current = true;\n };\n const onPlotFocus = (event: React.FocusEvent<SVGSVGElement>) => {\n if (event.target === svgRef.current && !plotClickedRef.current) {\n setPlotFocused(true);\n }\n // The click should focus the underling application bypassing the svg.\n else if (plotClickedRef.current) {\n applicationRef.current!.focus();\n }\n };\n const onPlotBlur = (event: React.FocusEvent<SVGSVGElement>) => {\n if (event.target === svgRef.current) {\n setPlotFocused(false);\n }\n };\n // Once one of the expected keys is pressed the focus is delegated to the application controller.\n const onPlotKeyDown = (event: React.KeyboardEvent) => {\n if (isPlotFocused) {\n // Delegate the focus to the application if one of the expected keys was pressed.\n const codes = [KeyCode.space, KeyCode.enter, KeyCode.up, KeyCode.left, KeyCode.right, KeyCode.down];\n if (codes.indexOf(event.keyCode) !== -1) {\n applicationRef.current!.focus();\n }\n }\n };\n\n const onApplicationFocus = (event: React.FocusEvent<SVGGElement>) => {\n onFocus && onFocus(event, plotClickedRef.current ? 'mouse' : 'keyboard');\n // \"Release\" the click reference to not affect the next call of this handler.\n plotClickedRef.current = false;\n setApplicationFocused(true);\n };\n const onApplicationBlur = (event: React.FocusEvent<SVGGElement>) => {\n onBlur && onBlur(event);\n setApplicationFocused(false);\n };\n const onApplicationKeyDown = onKeyDown;\n\n const plotFocusable = !isApplicationFocused;\n const plotTabIndex = plotFocusable ? 0 : -1;\n const plotAria = !isApplicationFocused\n ? {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n 'aria-describedby': ariaDescriptionId,\n 'aria-roledescription': i18n('i18nStrings.chartAriaRoleDescription', ariaRoleDescription),\n }\n : {};\n\n return (\n <>\n <svg\n {...restProps}\n focusable={plotFocusable}\n tabIndex={plotTabIndex}\n role=\"application\"\n aria-hidden=\"false\"\n {...plotAria}\n ref={svgRef}\n width={width}\n height={height}\n style={{\n marginTop: offsetTop,\n marginBottom: offsetBottom,\n marginLeft: offsetLeft,\n marginRight: offsetRight,\n }}\n className={clsx(styles.root, {\n [styles.clickable]: isClickable,\n [styles.precise]: isPrecise,\n })}\n onMouseDown={onPlotMouseDown}\n onFocus={onPlotFocus}\n onBlur={onPlotBlur}\n onKeyDown={onPlotKeyDown}\n >\n <FocusOutline elementRef={svgRef} elementKey={isPlotFocused} offset={focusOffset} />\n\n <g transform={transform}>\n <ApplicationController\n activeElementKey={activeElementKey || null}\n activeElementRef={activeElementRef}\n ref={applicationRef}\n onFocus={onApplicationFocus}\n onBlur={onApplicationBlur}\n onKeyDown={onApplicationKeyDown}\n />\n\n {/* Only show description when plot is focusable to avoid repetition in Safari and Firefox */}\n {ariaDescription && plotFocusable && (\n <desc aria-hidden=\"true\" id={internalDescriptionId}>\n {ariaDescription}\n </desc>\n )}\n\n {children}\n\n <FocusOutline\n elementRef={activeElementRef}\n elementKey={isApplicationFocused && activeElementKey}\n offset={activeElementFocusOffset}\n />\n </g>\n </svg>\n\n <LiveRegion>{ariaLiveRegion}</LiveRegion>\n </>\n );\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/chart-plot/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { forwardRef, useImperativeHandle, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport styles from './styles.css.js';\nimport { useUniqueId } from '../../hooks/use-unique-id';\n\nimport { KeyCode } from '../../keycode';\nimport LiveRegion from '../live-region/index';\nimport ApplicationController, { ApplicationRef } from './application-controller';\nimport FocusOutline from './focus-outline';\nimport { Offset } from '../interfaces';\nimport { useInternalI18n } from '../../i18n/context.js';\n\nconst DEFAULT_PLOT_FOCUS_OFFSET = 3;\nconst DEFAULT_ELEMENT_FOCUS_OFFSET = 3;\n\nexport interface ChartPlotRef {\n svg: SVGSVGElement;\n focusPlot(): void;\n focusApplication(): void;\n}\n\nexport interface ChartPlotProps {\n width: number | string;\n height: number | string;\n transform?: string;\n offsetTop?: number;\n offsetBottom?: number;\n offsetLeft?: number;\n offsetRight?: number;\n focusOffset?: number;\n ariaLabel?: string;\n ariaLabelledby?: string;\n ariaDescription?: string;\n ariaDescribedby?: string;\n ariaRoleDescription?: string;\n activeElementKey?: null | string | number | boolean;\n activeElementRef?: React.RefObject<SVGGElement>;\n activeElementFocusOffset?: Offset;\n ariaLiveRegion?: React.ReactNode;\n isClickable?: boolean;\n isPrecise?: boolean;\n onMouseDown?: (event: React.MouseEvent<SVGSVGElement>) => void;\n onMouseMove?: (event: React.MouseEvent<SVGSVGElement>) => void;\n onMouseOut?: (event: React.MouseEvent<SVGSVGElement>) => void;\n onFocus?: (event: React.FocusEvent<SVGGElement>, trigger: 'mouse' | 'keyboard') => void;\n onBlur?: (event: React.FocusEvent<SVGGElement>) => void;\n onKeyDown?: (event: React.KeyboardEvent<SVGGElement>) => void;\n children: React.ReactNode;\n}\n\n/**\n An extension for the SVG to be used for charts. It includes a controller element to\n handle the focus and keyboard interactions in a way that is supported by screen readers.\n\n The application mimics the aria-activedescendant behavior which is unsupported by Safari. The\n activeElementRef is the pointer to the secondary-focus element and activeElementKey denotes when\n the focus transition was made.\n\n Alternatively, ariaLiveRegion can be used to make announcements.\n*/\nexport default forwardRef(ChartPlot);\n\nfunction ChartPlot(\n {\n width,\n height,\n transform,\n offsetTop,\n offsetBottom,\n offsetLeft,\n offsetRight,\n ariaLabel,\n ariaLabelledby,\n ariaRoleDescription,\n ariaDescription,\n ariaDescribedby,\n activeElementKey,\n activeElementRef,\n ariaLiveRegion,\n isClickable,\n isPrecise,\n children,\n onMouseDown,\n onKeyDown,\n onFocus,\n onBlur,\n focusOffset = DEFAULT_PLOT_FOCUS_OFFSET,\n activeElementFocusOffset = DEFAULT_ELEMENT_FOCUS_OFFSET,\n ...restProps\n }: ChartPlotProps,\n ref: React.Ref<ChartPlotRef>\n) {\n const i18n = useInternalI18n('[charts]');\n const svgRef = useRef<SVGSVGElement>(null);\n const applicationRef = useRef<ApplicationRef>(null);\n const plotClickedRef = useRef(false);\n const [isPlotFocused, setPlotFocused] = useState(false);\n const [isApplicationFocused, setApplicationFocused] = useState(false);\n\n const internalDescriptionId = useUniqueId('awsui-chart-plot__description');\n const ariaDescriptionId = [ariaDescription && internalDescriptionId, ariaDescribedby].filter(Boolean).join(' ');\n\n useImperativeHandle(ref, () => ({\n svg: svgRef.current!,\n focusPlot: () => svgRef.current!.focus(),\n focusApplication: () => applicationRef.current!.focus(),\n }));\n\n const onPlotMouseDown = (event: React.MouseEvent<SVGSVGElement, MouseEvent>) => {\n onMouseDown && onMouseDown(event);\n // Record the click was made for the application focus handler.\n plotClickedRef.current = true;\n };\n const onPlotFocus = (event: React.FocusEvent<SVGSVGElement>) => {\n if (event.target === svgRef.current && !plotClickedRef.current) {\n setPlotFocused(true);\n }\n // The click should focus the underling application bypassing the svg.\n else if (plotClickedRef.current) {\n applicationRef.current!.focus();\n }\n };\n const onPlotBlur = (event: React.FocusEvent<SVGSVGElement>) => {\n if (event.target === svgRef.current) {\n setPlotFocused(false);\n }\n };\n // Once one of the expected keys is pressed the focus is delegated to the application controller.\n const onPlotKeyDown = (event: React.KeyboardEvent) => {\n if (isPlotFocused) {\n // Delegate the focus to the application if one of the expected keys was pressed.\n const codes = [KeyCode.space, KeyCode.enter, KeyCode.up, KeyCode.left, KeyCode.right, KeyCode.down];\n if (codes.indexOf(event.keyCode) !== -1) {\n applicationRef.current!.focus();\n }\n }\n };\n\n const onApplicationFocus = (event: React.FocusEvent<SVGGElement>) => {\n onFocus && onFocus(event, plotClickedRef.current ? 'mouse' : 'keyboard');\n // \"Release\" the click reference to not affect the next call of this handler.\n plotClickedRef.current = false;\n setApplicationFocused(true);\n };\n const onApplicationBlur = (event: React.FocusEvent<SVGGElement>) => {\n onBlur && onBlur(event);\n setApplicationFocused(false);\n };\n const onApplicationKeyDown = onKeyDown;\n\n const plotFocusable = !isApplicationFocused;\n const plotTabIndex = plotFocusable ? 0 : -1;\n const plotAria = !isApplicationFocused\n ? {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n 'aria-describedby': ariaDescriptionId,\n 'aria-roledescription': i18n('i18nStrings.chartAriaRoleDescription', ariaRoleDescription),\n }\n : {};\n\n return (\n <>\n <svg\n {...restProps}\n focusable={plotFocusable}\n tabIndex={plotTabIndex}\n role=\"application\"\n aria-hidden=\"false\"\n {...plotAria}\n ref={svgRef}\n style={{\n width,\n height,\n marginTop: offsetTop,\n marginBottom: offsetBottom,\n marginLeft: offsetLeft,\n marginRight: offsetRight,\n }}\n className={clsx(styles.root, {\n [styles.clickable]: isClickable,\n [styles.precise]: isPrecise,\n })}\n onMouseDown={onPlotMouseDown}\n onFocus={onPlotFocus}\n onBlur={onPlotBlur}\n onKeyDown={onPlotKeyDown}\n >\n <FocusOutline elementRef={svgRef} elementKey={isPlotFocused} offset={focusOffset} />\n\n <g transform={transform}>\n <ApplicationController\n activeElementKey={activeElementKey || null}\n activeElementRef={activeElementRef}\n ref={applicationRef}\n onFocus={onApplicationFocus}\n onBlur={onApplicationBlur}\n onKeyDown={onApplicationKeyDown}\n />\n\n {/* Only show description when plot is focusable to avoid repetition in Safari and Firefox */}\n {ariaDescription && plotFocusable && (\n <desc aria-hidden=\"true\" id={internalDescriptionId}>\n {ariaDescription}\n </desc>\n )}\n\n {children}\n\n <FocusOutline\n elementRef={activeElementRef}\n elementKey={isApplicationFocused && activeElementKey}\n offset={activeElementFocusOffset}\n />\n </g>\n </svg>\n\n <LiveRegion>{ariaLiveRegion}</LiveRegion>\n </>\n );\n}\n"]}
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  import { BaseComponentProps } from '../../base-component/index.js';
3
3
  interface ChartWrapperProps extends BaseComponentProps {
4
+ fitHeight: boolean;
4
5
  defaultFilter: React.ReactNode;
5
6
  additionalFilters: React.ReactNode;
6
7
  reserveFilterSpace: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/chart-wrapper/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAI1C,OAAO,EAAE,kBAAkB,EAAgB,MAAM,+BAA+B,CAAC;AAIjF,UAAU,iBAAkB,SAAQ,kBAAkB;IACpD,aAAa,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC,kBAAkB,EAAE,OAAO,CAAC;IAC5B,kBAAkB,EAAE,OAAO,CAAC;IAC5B,WAAW,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,MAAM,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC;IACvC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,eAAO,MAAM,YAAY,0FAgDxB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/chart-wrapper/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAI1C,OAAO,EAAE,kBAAkB,EAAgB,MAAM,+BAA+B,CAAC;AAIjF,UAAU,iBAAkB,SAAQ,kBAAkB;IACpD,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC,kBAAkB,EAAE,OAAO,CAAC;IAC5B,kBAAkB,EAAE,OAAO,CAAC;IAC5B,WAAW,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,MAAM,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC;IACvC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,eAAO,MAAM,YAAY,0FAkFxB,CAAC"}
@@ -8,19 +8,34 @@ import { getBaseProps } from '../../base-component/index.js';
8
8
  import InternalBox from '../../../box/internal.js';
9
9
  import InternalSpaceBetween from '../../../space-between/internal.js';
10
10
  export const ChartWrapper = forwardRef((_a, ref) => {
11
- var { defaultFilter, additionalFilters, reserveFilterSpace, reserveLegendSpace, chartStatus, chart, legend, onBlur, contentClassName, contentMinHeight } = _a, props = __rest(_a, ["defaultFilter", "additionalFilters", "reserveFilterSpace", "reserveLegendSpace", "chartStatus", "chart", "legend", "onBlur", "contentClassName", "contentMinHeight"]);
11
+ var { defaultFilter, additionalFilters, reserveFilterSpace, reserveLegendSpace, chartStatus, chart, legend, onBlur, contentClassName, contentMinHeight, fitHeight } = _a, props = __rest(_a, ["defaultFilter", "additionalFilters", "reserveFilterSpace", "reserveLegendSpace", "chartStatus", "chart", "legend", "onBlur", "contentClassName", "contentMinHeight", "fitHeight"]);
12
12
  const baseProps = getBaseProps(props);
13
+ const filtersNode = (defaultFilter || additionalFilters) && (React.createElement(InternalBox, { className: styles['filter-container'], margin: { bottom: 'l' } },
14
+ React.createElement(InternalSpaceBetween, { size: "l", direction: "horizontal", className: clsx({ [styles['has-default-filter']]: !!defaultFilter }) },
15
+ defaultFilter,
16
+ additionalFilters)));
17
+ const legendNode = legend && React.createElement(InternalBox, { margin: { top: 'm' } }, legend);
18
+ if (fitHeight) {
19
+ return (React.createElement("div", Object.assign({ ref: ref }, baseProps, { className: clsx(baseProps.className, styles.wrapper, styles['wrapper--fit-height']), onBlur: onBlur }),
20
+ React.createElement("div", { className: clsx(styles['inner-wrapper'], styles['inner-wrapper--fit-height']) },
21
+ filtersNode,
22
+ React.createElement("div", { className: clsx(styles.content, contentClassName, {
23
+ [styles['content--reserve-filter']]: reserveFilterSpace,
24
+ [styles['content--reserve-legend']]: reserveLegendSpace,
25
+ [styles['content--fit-height']]: true,
26
+ }) },
27
+ chartStatus,
28
+ chart),
29
+ legendNode)));
30
+ }
13
31
  return (React.createElement("div", Object.assign({ ref: ref }, baseProps, { className: clsx(baseProps.className, styles.wrapper), onBlur: onBlur }),
14
- (defaultFilter || additionalFilters) && (React.createElement(InternalBox, { className: styles['filter-container'], margin: { bottom: 'l' } },
15
- React.createElement(InternalSpaceBetween, { size: "l", direction: "horizontal", className: clsx({ [styles['has-default-filter']]: !!defaultFilter }) },
16
- defaultFilter,
17
- additionalFilters))),
32
+ filtersNode,
18
33
  React.createElement("div", { className: clsx(styles.content, contentClassName, {
19
34
  [styles['content--reserve-filter']]: reserveFilterSpace,
20
35
  [styles['content--reserve-legend']]: reserveLegendSpace,
21
36
  }), style: { minHeight: contentMinHeight } },
22
37
  chartStatus,
23
38
  chart),
24
- legend && React.createElement(InternalBox, { margin: { top: 'm' } }, legend)));
39
+ legendNode));
25
40
  });
26
41
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/chart-wrapper/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;;AAEtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAsB,YAAY,EAAE,MAAM,+BAA+B,CAAC;AACjF,OAAO,WAAW,MAAM,0BAA0B,CAAC;AACnD,OAAO,oBAAoB,MAAM,oCAAoC,CAAC;AAetE,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CACpC,CACE,EAYoB,EACpB,GAA8B,EAC9B,EAAE;QAdF,EACE,aAAa,EACb,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,WAAW,EACX,KAAK,EACL,MAAM,EACN,MAAM,EACN,gBAAgB,EAChB,gBAAgB,OAEE,EADf,KAAK,cAXV,sKAYC,CADS;IAIV,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,OAAO,CACL,2CAAK,GAAG,EAAE,GAAG,IAAM,SAAS,IAAE,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,MAAM,EAAE,MAAM;QAC/F,CAAC,aAAa,IAAI,iBAAiB,CAAC,IAAI,CACvC,oBAAC,WAAW,IAAC,SAAS,EAAE,MAAM,CAAC,kBAAkB,CAAC,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE;YACzE,oBAAC,oBAAoB,IACnB,IAAI,EAAC,GAAG,EACR,SAAS,EAAC,YAAY,EACtB,SAAS,EAAE,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,CAAC,CAAC,aAAa,EAAE,CAAC;gBAEnE,aAAa;gBACb,iBAAiB,CACG,CACX,CACf;QAED,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,gBAAgB,EAAE;gBAChD,CAAC,MAAM,CAAC,yBAAyB,CAAC,CAAC,EAAE,kBAAkB;gBACvD,CAAC,MAAM,CAAC,yBAAyB,CAAC,CAAC,EAAE,kBAAkB;aACxD,CAAC,EACF,KAAK,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE;YAErC,WAAW;YACX,KAAK,CACF;QAEL,MAAM,IAAI,oBAAC,WAAW,IAAC,MAAM,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,IAAG,MAAM,CAAe,CAChE,CACP,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { forwardRef } from 'react';\nimport clsx from 'clsx';\n\nimport styles from './styles.css.js';\nimport { BaseComponentProps, getBaseProps } from '../../base-component/index.js';\nimport InternalBox from '../../../box/internal.js';\nimport InternalSpaceBetween from '../../../space-between/internal.js';\n\ninterface ChartWrapperProps extends BaseComponentProps {\n defaultFilter: React.ReactNode;\n additionalFilters: React.ReactNode;\n reserveFilterSpace: boolean;\n reserveLegendSpace: boolean;\n chartStatus: React.ReactNode;\n chart: React.ReactNode;\n legend: React.ReactNode;\n onBlur?(event: React.FocusEvent): void;\n contentClassName?: string;\n contentMinHeight?: number;\n}\n\nexport const ChartWrapper = forwardRef(\n (\n {\n defaultFilter,\n additionalFilters,\n reserveFilterSpace,\n reserveLegendSpace,\n chartStatus,\n chart,\n legend,\n onBlur,\n contentClassName,\n contentMinHeight,\n ...props\n }: ChartWrapperProps,\n ref: React.Ref<HTMLDivElement>\n ) => {\n const baseProps = getBaseProps(props);\n return (\n <div ref={ref} {...baseProps} className={clsx(baseProps.className, styles.wrapper)} onBlur={onBlur}>\n {(defaultFilter || additionalFilters) && (\n <InternalBox className={styles['filter-container']} margin={{ bottom: 'l' }}>\n <InternalSpaceBetween\n size=\"l\"\n direction=\"horizontal\"\n className={clsx({ [styles['has-default-filter']]: !!defaultFilter })}\n >\n {defaultFilter}\n {additionalFilters}\n </InternalSpaceBetween>\n </InternalBox>\n )}\n\n <div\n className={clsx(styles.content, contentClassName, {\n [styles['content--reserve-filter']]: reserveFilterSpace,\n [styles['content--reserve-legend']]: reserveLegendSpace,\n })}\n style={{ minHeight: contentMinHeight }}\n >\n {chartStatus}\n {chart}\n </div>\n\n {legend && <InternalBox margin={{ top: 'm' }}>{legend}</InternalBox>}\n </div>\n );\n }\n);\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/chart-wrapper/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;;AAEtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAsB,YAAY,EAAE,MAAM,+BAA+B,CAAC;AACjF,OAAO,WAAW,MAAM,0BAA0B,CAAC;AACnD,OAAO,oBAAoB,MAAM,oCAAoC,CAAC;AAgBtE,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CACpC,CACE,EAaoB,EACpB,GAA8B,EAC9B,EAAE;QAfF,EACE,aAAa,EACb,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,WAAW,EACX,KAAK,EACL,MAAM,EACN,MAAM,EACN,gBAAgB,EAChB,gBAAgB,EAChB,SAAS,OAES,EADf,KAAK,cAZV,mLAaC,CADS;IAIV,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IAEtC,MAAM,WAAW,GAAG,CAAC,aAAa,IAAI,iBAAiB,CAAC,IAAI,CAC1D,oBAAC,WAAW,IAAC,SAAS,EAAE,MAAM,CAAC,kBAAkB,CAAC,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE;QACzE,oBAAC,oBAAoB,IACnB,IAAI,EAAC,GAAG,EACR,SAAS,EAAC,YAAY,EACtB,SAAS,EAAE,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,CAAC,CAAC,aAAa,EAAE,CAAC;YAEnE,aAAa;YACb,iBAAiB,CACG,CACX,CACf,CAAC;IAEF,MAAM,UAAU,GAAG,MAAM,IAAI,oBAAC,WAAW,IAAC,MAAM,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,IAAG,MAAM,CAAe,CAAC;IAEvF,IAAI,SAAS,EAAE;QACb,OAAO,CACL,2CACE,GAAG,EAAE,GAAG,IACJ,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,EAAE,MAAM,CAAC,qBAAqB,CAAC,CAAC,EACnF,MAAM,EAAE,MAAM;YAEd,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,EAAE,MAAM,CAAC,2BAA2B,CAAC,CAAC;gBAC/E,WAAW;gBAEZ,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,gBAAgB,EAAE;wBAChD,CAAC,MAAM,CAAC,yBAAyB,CAAC,CAAC,EAAE,kBAAkB;wBACvD,CAAC,MAAM,CAAC,yBAAyB,CAAC,CAAC,EAAE,kBAAkB;wBACvD,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,IAAI;qBACtC,CAAC;oBAED,WAAW;oBACX,KAAK,CACF;gBAEL,UAAU,CACP,CACF,CACP,CAAC;KACH;IAED,OAAO,CACL,2CAAK,GAAG,EAAE,GAAG,IAAM,SAAS,IAAE,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,MAAM,EAAE,MAAM;QAC/F,WAAW;QAEZ,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,gBAAgB,EAAE;gBAChD,CAAC,MAAM,CAAC,yBAAyB,CAAC,CAAC,EAAE,kBAAkB;gBACvD,CAAC,MAAM,CAAC,yBAAyB,CAAC,CAAC,EAAE,kBAAkB;aACxD,CAAC,EACF,KAAK,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE;YAErC,WAAW;YACX,KAAK,CACF;QAEL,UAAU,CACP,CACP,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { forwardRef } from 'react';\nimport clsx from 'clsx';\n\nimport styles from './styles.css.js';\nimport { BaseComponentProps, getBaseProps } from '../../base-component/index.js';\nimport InternalBox from '../../../box/internal.js';\nimport InternalSpaceBetween from '../../../space-between/internal.js';\n\ninterface ChartWrapperProps extends BaseComponentProps {\n fitHeight: boolean;\n defaultFilter: React.ReactNode;\n additionalFilters: React.ReactNode;\n reserveFilterSpace: boolean;\n reserveLegendSpace: boolean;\n chartStatus: React.ReactNode;\n chart: React.ReactNode;\n legend: React.ReactNode;\n onBlur?(event: React.FocusEvent): void;\n contentClassName?: string;\n contentMinHeight?: number;\n}\n\nexport const ChartWrapper = forwardRef(\n (\n {\n defaultFilter,\n additionalFilters,\n reserveFilterSpace,\n reserveLegendSpace,\n chartStatus,\n chart,\n legend,\n onBlur,\n contentClassName,\n contentMinHeight,\n fitHeight,\n ...props\n }: ChartWrapperProps,\n ref: React.Ref<HTMLDivElement>\n ) => {\n const baseProps = getBaseProps(props);\n\n const filtersNode = (defaultFilter || additionalFilters) && (\n <InternalBox className={styles['filter-container']} margin={{ bottom: 'l' }}>\n <InternalSpaceBetween\n size=\"l\"\n direction=\"horizontal\"\n className={clsx({ [styles['has-default-filter']]: !!defaultFilter })}\n >\n {defaultFilter}\n {additionalFilters}\n </InternalSpaceBetween>\n </InternalBox>\n );\n\n const legendNode = legend && <InternalBox margin={{ top: 'm' }}>{legend}</InternalBox>;\n\n if (fitHeight) {\n return (\n <div\n ref={ref}\n {...baseProps}\n className={clsx(baseProps.className, styles.wrapper, styles['wrapper--fit-height'])}\n onBlur={onBlur}\n >\n <div className={clsx(styles['inner-wrapper'], styles['inner-wrapper--fit-height'])}>\n {filtersNode}\n\n <div\n className={clsx(styles.content, contentClassName, {\n [styles['content--reserve-filter']]: reserveFilterSpace,\n [styles['content--reserve-legend']]: reserveLegendSpace,\n [styles['content--fit-height']]: true,\n })}\n >\n {chartStatus}\n {chart}\n </div>\n\n {legendNode}\n </div>\n </div>\n );\n }\n\n return (\n <div ref={ref} {...baseProps} className={clsx(baseProps.className, styles.wrapper)} onBlur={onBlur}>\n {filtersNode}\n\n <div\n className={clsx(styles.content, contentClassName, {\n [styles['content--reserve-filter']]: reserveFilterSpace,\n [styles['content--reserve-legend']]: reserveLegendSpace,\n })}\n style={{ minHeight: contentMinHeight }}\n >\n {chartStatus}\n {chart}\n </div>\n\n {legendNode}\n </div>\n );\n }\n);\n"]}
@@ -1,11 +1,14 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "wrapper": "awsui_wrapper_z5mul_innyn_93",
5
- "has-default-filter": "awsui_has-default-filter_z5mul_innyn_108",
6
- "content": "awsui_content_z5mul_innyn_112",
7
- "content--reserve-filter": "awsui_content--reserve-filter_z5mul_innyn_119",
8
- "content--reserve-legend": "awsui_content--reserve-legend_z5mul_innyn_123",
9
- "filter-container": "awsui_filter-container_z5mul_innyn_127"
4
+ "wrapper": "awsui_wrapper_z5mul_12tkj_93",
5
+ "wrapper--fit-height": "awsui_wrapper--fit-height_z5mul_12tkj_107",
6
+ "inner-wrapper--fit-height": "awsui_inner-wrapper--fit-height_z5mul_12tkj_112",
7
+ "has-default-filter": "awsui_has-default-filter_z5mul_12tkj_118",
8
+ "content": "awsui_content_z5mul_12tkj_122",
9
+ "content--reserve-filter": "awsui_content--reserve-filter_z5mul_12tkj_129",
10
+ "content--reserve-legend": "awsui_content--reserve-legend_z5mul_12tkj_133",
11
+ "content--fit-height": "awsui_content--fit-height_z5mul_12tkj_137",
12
+ "filter-container": "awsui_filter-container_z5mul_12tkj_141"
10
13
  };
11
14
 
@@ -90,7 +90,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
90
90
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
91
91
  SPDX-License-Identifier: Apache-2.0
92
92
  */
93
- .awsui_wrapper_z5mul_innyn_93:not(#\9) {
93
+ .awsui_wrapper_z5mul_12tkj_93:not(#\9) {
94
94
  /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
95
95
  border-collapse: separate;
96
96
  border-spacing: 0;
@@ -130,26 +130,40 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
130
130
  position: relative;
131
131
  display: block;
132
132
  }
133
+ .awsui_wrapper--fit-height_z5mul_12tkj_107:not(#\9) {
134
+ height: 100%;
135
+ overflow-y: auto;
136
+ }
137
+
138
+ .awsui_inner-wrapper--fit-height_z5mul_12tkj_112:not(#\9) {
139
+ display: flex;
140
+ flex-direction: column;
141
+ height: 100%;
142
+ }
133
143
 
134
- .awsui_has-default-filter_z5mul_innyn_108 > :not(#\9):first-child {
144
+ .awsui_has-default-filter_z5mul_12tkj_118 > :not(#\9):first-child {
135
145
  flex: 280px 0 1;
136
146
  }
137
147
 
138
- .awsui_content_z5mul_innyn_112:not(#\9) {
148
+ .awsui_content_z5mul_12tkj_122:not(#\9) {
139
149
  display: flex;
140
150
  position: relative;
141
151
  justify-content: center;
142
152
  align-items: center;
143
153
  }
144
154
 
145
- .awsui_content--reserve-filter_z5mul_innyn_119:not(#\9) {
155
+ .awsui_content--reserve-filter_z5mul_12tkj_129:not(#\9) {
146
156
  margin-top: calc(2 * var(--font-body-m-line-height-ghizru, 20px));
147
157
  }
148
158
 
149
- .awsui_content--reserve-legend_z5mul_innyn_123:not(#\9) {
159
+ .awsui_content--reserve-legend_z5mul_12tkj_133:not(#\9) {
150
160
  margin-bottom: calc(2 * var(--font-body-m-line-height-ghizru, 20px));
151
161
  }
152
162
 
153
- .awsui_filter-container_z5mul_innyn_127:not(#\9) {
163
+ .awsui_content--fit-height_z5mul_12tkj_137:not(#\9) {
164
+ flex: 1;
165
+ }
166
+
167
+ .awsui_filter-container_z5mul_12tkj_141:not(#\9) {
154
168
  /* used in test-utils */
155
169
  }
@@ -2,11 +2,14 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "wrapper": "awsui_wrapper_z5mul_innyn_93",
6
- "has-default-filter": "awsui_has-default-filter_z5mul_innyn_108",
7
- "content": "awsui_content_z5mul_innyn_112",
8
- "content--reserve-filter": "awsui_content--reserve-filter_z5mul_innyn_119",
9
- "content--reserve-legend": "awsui_content--reserve-legend_z5mul_innyn_123",
10
- "filter-container": "awsui_filter-container_z5mul_innyn_127"
5
+ "wrapper": "awsui_wrapper_z5mul_12tkj_93",
6
+ "wrapper--fit-height": "awsui_wrapper--fit-height_z5mul_12tkj_107",
7
+ "inner-wrapper--fit-height": "awsui_inner-wrapper--fit-height_z5mul_12tkj_112",
8
+ "has-default-filter": "awsui_has-default-filter_z5mul_12tkj_118",
9
+ "content": "awsui_content_z5mul_12tkj_122",
10
+ "content--reserve-filter": "awsui_content--reserve-filter_z5mul_12tkj_129",
11
+ "content--reserve-legend": "awsui_content--reserve-legend_z5mul_12tkj_133",
12
+ "content--fit-height": "awsui_content--fit-height_z5mul_12tkj_137",
13
+ "filter-container": "awsui_filter-container_z5mul_12tkj_141"
11
14
  };
12
15
 
@@ -4,7 +4,7 @@ import { __rest } from "tslib";
4
4
  import React, { useState } from 'react';
5
5
  import { useCallback, useRef } from 'react';
6
6
  import { Transition as ReactTransitionGroupTransition, } from 'react-transition-group';
7
- import { useReducedMotion } from '../../hooks/use-visual-mode';
7
+ import { useReducedMotion } from '@cloudscape-design/component-toolkit/internal';
8
8
  /**
9
9
  * This component is a wrapper around the CSSTransition component.
10
10
  *
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/transition/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAoB,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,EACL,UAAU,IAAI,8BAA8B,GAE7C,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAe/D;;;;;GAKG;AACH,MAAM,UAAU,UAAU,CAAC,EAQT;QARS,EACzB,EAAE,EAAE,IAAI,EACR,QAAQ,EACR,IAAI,GAAG,IAAI,EACX,cAAc,GAAG,GAAG,EAAE,CAAC,KAAK,CAAC,EAC7B,QAAQ,GAAG,KAAK,EAChB,qBAAqB,OAEL,EADb,IAAI,cAPkB,iFAQ1B,CADQ;IAEP,MAAM,qBAAqB,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IACxD,uFAAuF;IACvF,yFAAyF;IACzF,yHAAyH;IACzH,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAmB,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IACtG,MAAM,cAAc,GAAG,gBAAgB,CAAC,qBAAqB,CAAC,IAAI,QAAQ,CAAC;IAE3E,MAAM,wBAAwB,GAAG,WAAW,CAAC,CAAC,IAAgB,EAAE,EAAE;QAChE,MAAM,IAAI,GAAG,qBAAqB,CAAC,OAAO,CAAC;QAE3C,IAAI,IAAI,KAAK,IAAI,EAAE;YACjB,OAAO;SACR;QACD,MAAM,QAAQ,GAAG,CAAC,CAAmC,EAAE,EAAE;YACvD,IAAI,CAAC,CAAC,MAAM,KAAK,IAAI,EAAE;gBACrB,IAAI,CAAC,mBAAmB,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAC;gBACpD,IAAI,CAAC,mBAAmB,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAC;gBACnD,IAAI,EAAE,CAAC;aACR;QACH,CAAC,CAAC;QACF,IAAI,CAAC,gBAAgB,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAC;QACjD,IAAI,CAAC,gBAAgB,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAC;IAClD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,oBAAC,8BAA8B,kBAC7B,cAAc,EAAE,wBAAwB,EACxC,OAAO,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,EACvC,EAAE,EAAE,IAAI,EACR,OAAO,EAAE,qBAAqB,EAC9B,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,WAAW,CAAC,EAAE;YACrB,IAAI,CAAC,WAAW,EAAE;gBAChB,kBAAkB,CAAC,OAAO,CAAC,CAAC;gBAC5B,cAAc,CAAC,OAAO,CAAC,CAAC;aACzB;QACH,CAAC,EACD,UAAU,EAAE,WAAW,CAAC,EAAE;;YACxB,IAAI,CAAC,WAAW,EAAE;gBAChB,iHAAiH;gBACjH,6CAA6C;gBAC7C,KAAK,CAAA,MAAA,qBAAqB,CAAC,OAAO,0CAAE,YAAY,CAAA,CAAC;gBAEjD,IAAI,qBAAqB,aAArB,qBAAqB,uBAArB,qBAAqB,CAAE,QAAQ,EAAE;oBACnC,UAAU,CAAC,GAAG,EAAE;wBACd,kBAAkB,CAAC,UAAU,CAAC,CAAC;wBAC/B,cAAc,CAAC,UAAU,CAAC,CAAC;oBAC7B,CAAC,EAAE,qBAAqB,aAArB,qBAAqB,uBAArB,qBAAqB,CAAE,QAAQ,CAAC,CAAC;iBACrC;qBAAM;oBACL,kBAAkB,CAAC,UAAU,CAAC,CAAC;oBAC/B,cAAc,CAAC,UAAU,CAAC,CAAC;iBAC5B;aACF;QACH,CAAC,EACD,SAAS,EAAE,WAAW,CAAC,EAAE;YACvB,IAAI,CAAC,WAAW,EAAE;gBAChB,kBAAkB,CAAC,SAAS,CAAC,CAAC;gBAC9B,cAAc,CAAC,SAAS,CAAC,CAAC;aAC3B;QACH,CAAC,EACD,MAAM,EAAE,GAAG,EAAE;YACX,kBAAkB,CAAC,MAAM,CAAC,CAAC;YAC3B,cAAc,CAAC,MAAM,CAAC,CAAC;QACzB,CAAC,EACD,SAAS,EAAE,GAAG,EAAE;YACd,kBAAkB,CAAC,SAAS,CAAC,CAAC;YAC9B,cAAc,CAAC,SAAS,CAAC,CAAC;QAC5B,CAAC,EACD,QAAQ,EAAE,GAAG,EAAE;YACb,kBAAkB,CAAC,QAAQ,CAAC,CAAC;YAC7B,cAAc,CAAC,QAAQ,CAAC,CAAC;QAC3B,CAAC,IACG,IAAI,GAEP,GAAG,EAAE,CAAC,QAAQ,CAAC,eAAe,EAAE,qBAAqB,CAAC,CACxB,CAClC,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState } from 'react';\nimport { MutableRefObject, useCallback, useRef } from 'react';\nimport {\n Transition as ReactTransitionGroupTransition,\n TransitionStatus as ReactTransitionGroupTransitionStatus,\n} from 'react-transition-group';\nimport { useReducedMotion } from '../../hooks/use-visual-mode';\n\nexport type TransitionStatus = ReactTransitionGroupTransitionStatus | 'enter' | 'exit';\n\nexport interface TransitionProps {\n in: boolean;\n exit?: boolean;\n\n disabled?: boolean;\n\n children: (state: TransitionStatus, transitioningElementRef: MutableRefObject<any>) => React.ReactNode;\n onStatusChange?: (status: TransitionStatus) => void;\n transitionChangeDelay?: { entering?: number };\n}\n\n/**\n * This component is a wrapper around the CSSTransition component.\n *\n * It provides a second parameter in its rendering function that must be\n * attached to the node that is transitioning.\n */\nexport function Transition({\n in: isIn,\n children,\n exit = true,\n onStatusChange = () => void 0,\n disabled = false,\n transitionChangeDelay,\n ...rest\n}: TransitionProps) {\n const transitionRootElement = useRef<HTMLElement>(null);\n // the initial state of the transition should be either 'exited' or 'entered' depending\n // on the `in` property, this mimicks how internally the Transition component works here:\n // https://github.com/reactjs/react-transition-group/blob/6cbd6aaedaf8e9472007640b429ddb48c6c24158/src/Transition.js#L121\n const [transitionState, setTransitionState] = useState<TransitionStatus>(isIn ? 'entered' : 'exited');\n const motionDisabled = useReducedMotion(transitionRootElement) || disabled;\n\n const addTransitionEndListener = useCallback((done: () => void) => {\n const node = transitionRootElement.current;\n\n if (node === null) {\n return;\n }\n const listener = (e: TransitionEvent | AnimationEvent) => {\n if (e.target === node) {\n node.removeEventListener('transitionend', listener);\n node.removeEventListener('animationend', listener);\n done();\n }\n };\n node.addEventListener('transitionend', listener);\n node.addEventListener('animationend', listener);\n }, []);\n\n return (\n <ReactTransitionGroupTransition\n addEndListener={addTransitionEndListener}\n timeout={motionDisabled ? 0 : undefined}\n in={isIn}\n nodeRef={transitionRootElement}\n exit={exit}\n onEnter={isAppearing => {\n if (!isAppearing) {\n setTransitionState('enter');\n onStatusChange('enter');\n }\n }}\n onEntering={isAppearing => {\n if (!isAppearing) {\n // This line forces the browser to recalculate the layout because we want the starting state in the 'enter' style\n // to be applied before the animation starts.\n void transitionRootElement.current?.offsetHeight;\n\n if (transitionChangeDelay?.entering) {\n setTimeout(() => {\n setTransitionState('entering');\n onStatusChange('entering');\n }, transitionChangeDelay?.entering);\n } else {\n setTransitionState('entering');\n onStatusChange('entering');\n }\n }\n }}\n onEntered={isAppearing => {\n if (!isAppearing) {\n setTransitionState('entered');\n onStatusChange('entered');\n }\n }}\n onExit={() => {\n setTransitionState('exit');\n onStatusChange('exit');\n }}\n onExiting={() => {\n setTransitionState('exiting');\n onStatusChange('exiting');\n }}\n onExited={() => {\n setTransitionState('exited');\n onStatusChange('exited');\n }}\n {...rest}\n >\n {() => children(transitionState, transitionRootElement)}\n </ReactTransitionGroupTransition>\n );\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/transition/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState } from 'react';\nimport { MutableRefObject, useCallback, useRef } from 'react';\nimport {\n Transition as ReactTransitionGroupTransition,\n TransitionStatus as ReactTransitionGroupTransitionStatus,\n} from 'react-transition-group';\nimport { useReducedMotion } from '@cloudscape-design/component-toolkit/internal';\n\nexport type TransitionStatus = ReactTransitionGroupTransitionStatus | 'enter' | 'exit';\n\nexport interface TransitionProps {\n in: boolean;\n exit?: boolean;\n\n disabled?: boolean;\n\n children: (state: TransitionStatus, transitioningElementRef: MutableRefObject<any>) => React.ReactNode;\n onStatusChange?: (status: TransitionStatus) => void;\n transitionChangeDelay?: { entering?: number };\n}\n\n/**\n * This component is a wrapper around the CSSTransition component.\n *\n * It provides a second parameter in its rendering function that must be\n * attached to the node that is transitioning.\n */\nexport function Transition({\n in: isIn,\n children,\n exit = true,\n onStatusChange = () => void 0,\n disabled = false,\n transitionChangeDelay,\n ...rest\n}: TransitionProps) {\n const transitionRootElement = useRef<HTMLElement>(null);\n // the initial state of the transition should be either 'exited' or 'entered' depending\n // on the `in` property, this mimicks how internally the Transition component works here:\n // https://github.com/reactjs/react-transition-group/blob/6cbd6aaedaf8e9472007640b429ddb48c6c24158/src/Transition.js#L121\n const [transitionState, setTransitionState] = useState<TransitionStatus>(isIn ? 'entered' : 'exited');\n const motionDisabled = useReducedMotion(transitionRootElement) || disabled;\n\n const addTransitionEndListener = useCallback((done: () => void) => {\n const node = transitionRootElement.current;\n\n if (node === null) {\n return;\n }\n const listener = (e: TransitionEvent | AnimationEvent) => {\n if (e.target === node) {\n node.removeEventListener('transitionend', listener);\n node.removeEventListener('animationend', listener);\n done();\n }\n };\n node.addEventListener('transitionend', listener);\n node.addEventListener('animationend', listener);\n }, []);\n\n return (\n <ReactTransitionGroupTransition\n addEndListener={addTransitionEndListener}\n timeout={motionDisabled ? 0 : undefined}\n in={isIn}\n nodeRef={transitionRootElement}\n exit={exit}\n onEnter={isAppearing => {\n if (!isAppearing) {\n setTransitionState('enter');\n onStatusChange('enter');\n }\n }}\n onEntering={isAppearing => {\n if (!isAppearing) {\n // This line forces the browser to recalculate the layout because we want the starting state in the 'enter' style\n // to be applied before the animation starts.\n void transitionRootElement.current?.offsetHeight;\n\n if (transitionChangeDelay?.entering) {\n setTimeout(() => {\n setTransitionState('entering');\n onStatusChange('entering');\n }, transitionChangeDelay?.entering);\n } else {\n setTransitionState('entering');\n onStatusChange('entering');\n }\n }\n }}\n onEntered={isAppearing => {\n if (!isAppearing) {\n setTransitionState('entered');\n onStatusChange('entered');\n }\n }}\n onExit={() => {\n setTransitionState('exit');\n onStatusChange('exit');\n }}\n onExiting={() => {\n setTransitionState('exiting');\n onStatusChange('exiting');\n }}\n onExited={() => {\n setTransitionState('exited');\n onStatusChange('exited');\n }}\n {...rest}\n >\n {() => children(transitionState, transitionRootElement)}\n </ReactTransitionGroupTransition>\n );\n}\n"]}
@@ -1,6 +1,6 @@
1
1
 
2
2
  export var PACKAGE_SOURCE = 'components';
3
- export var PACKAGE_VERSION = '3.0.0 (385429b)';
3
+ export var PACKAGE_VERSION = '3.0.0 (f94e679)';
4
4
  export var THEME = 'open-source-visual-refresh';
5
5
  export var ALWAYS_VISUAL_REFRESH = true;
6
6
 
@@ -0,0 +1,6 @@
1
+ {
2
+ "PACKAGE_SOURCE": "components",
3
+ "PACKAGE_VERSION": "3.0.0 (f94e6795)",
4
+ "THEME": "default",
5
+ "ALWAYS_VISUAL_REFRESH": false
6
+ }
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/use-portal-mode-classes/index.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,wBAAgB,oBAAoB,CAAC,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,UAWrE"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/use-portal-mode-classes/index.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,wBAAgB,oBAAoB,CAAC,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,UAWrE"}
@@ -2,7 +2,8 @@
2
2
  // SPDX-License-Identifier: Apache-2.0
3
3
  import clsx from 'clsx';
4
4
  import { useVisualContext } from '../../components/visual-context';
5
- import { useCurrentMode, useDensityMode, useVisualRefresh } from '../use-visual-mode';
5
+ import { useCurrentMode, useDensityMode } from '@cloudscape-design/component-toolkit/internal';
6
+ import { useVisualRefresh } from '../use-visual-mode';
6
7
  export function usePortalModeClasses(ref) {
7
8
  const colorMode = useCurrentMode(ref);
8
9
  const densityMode = useDensityMode(ref);
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/hooks/use-portal-mode-classes/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtF,MAAM,UAAU,oBAAoB,CAAC,GAAiC;IACpE,MAAM,SAAS,GAAG,cAAc,CAAC,GAAG,CAAC,CAAC;IACtC,MAAM,WAAW,GAAG,cAAc,CAAC,GAAG,CAAC,CAAC;IACxC,MAAM,OAAO,GAAG,gBAAgB,CAAC,GAAG,CAAC,CAAC;IACtC,MAAM,aAAa,GAAG,gBAAgB,EAAE,CAAC;IACzC,OAAO,IAAI,CAAC;QACV,yCAAyC,EAAE,SAAS,KAAK,MAAM;QAC/D,+CAA+C,EAAE,WAAW,KAAK,SAAS;QAC1E,sBAAsB,EAAE,aAAa;QACrC,CAAC,iBAAiB,OAAO,EAAE,CAAC,EAAE,OAAO;KACtC,CAAC,CAAC;AACL,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { useVisualContext } from '../../components/visual-context';\nimport { useCurrentMode, useDensityMode, useVisualRefresh } from '../use-visual-mode';\n\nexport function usePortalModeClasses(ref: React.RefObject<HTMLElement>) {\n const colorMode = useCurrentMode(ref);\n const densityMode = useDensityMode(ref);\n const context = useVisualContext(ref);\n const visualRefresh = useVisualRefresh();\n return clsx({\n 'awsui-polaris-dark-mode awsui-dark-mode': colorMode === 'dark',\n 'awsui-polaris-compact-mode awsui-compact-mode': densityMode === 'compact',\n 'awsui-visual-refresh': visualRefresh,\n [`awsui-context-${context}`]: context,\n });\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/hooks/use-portal-mode-classes/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,+CAA+C,CAAC;AAC/F,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD,MAAM,UAAU,oBAAoB,CAAC,GAAiC;IACpE,MAAM,SAAS,GAAG,cAAc,CAAC,GAAG,CAAC,CAAC;IACtC,MAAM,WAAW,GAAG,cAAc,CAAC,GAAG,CAAC,CAAC;IACxC,MAAM,OAAO,GAAG,gBAAgB,CAAC,GAAG,CAAC,CAAC;IACtC,MAAM,aAAa,GAAG,gBAAgB,EAAE,CAAC;IACzC,OAAO,IAAI,CAAC;QACV,yCAAyC,EAAE,SAAS,KAAK,MAAM;QAC/D,+CAA+C,EAAE,WAAW,KAAK,SAAS;QAC1E,sBAAsB,EAAE,aAAa;QACrC,CAAC,iBAAiB,OAAO,EAAE,CAAC,EAAE,OAAO;KACtC,CAAC,CAAC;AACL,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { useVisualContext } from '../../components/visual-context';\nimport { useCurrentMode, useDensityMode } from '@cloudscape-design/component-toolkit/internal';\nimport { useVisualRefresh } from '../use-visual-mode';\n\nexport function usePortalModeClasses(ref: React.RefObject<HTMLElement>) {\n const colorMode = useCurrentMode(ref);\n const densityMode = useDensityMode(ref);\n const context = useVisualContext(ref);\n const visualRefresh = useVisualRefresh();\n return clsx({\n 'awsui-polaris-dark-mode awsui-dark-mode': colorMode === 'dark',\n 'awsui-polaris-compact-mode awsui-compact-mode': densityMode === 'compact',\n 'awsui-visual-refresh': visualRefresh,\n [`awsui-context-${context}`]: context,\n });\n}\n"]}
@@ -1,8 +1,4 @@
1
- import React from 'react';
2
- export declare function useCurrentMode(elementRef: React.RefObject<HTMLElement>): "dark" | "light";
3
- export declare function useDensityMode(elementRef: React.RefObject<HTMLElement>): "compact" | "comfortable";
4
1
  export declare const useVisualRefresh: () => boolean;
5
2
  export declare function clearVisualRefreshState(): void;
6
3
  export declare function useVisualRefreshDynamic(): boolean;
7
- export declare function useReducedMotion(elementRef: React.RefObject<HTMLElement>): boolean;
8
4
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/use-visual-mode/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAWxC,wBAAgB,cAAc,CAAC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,oBAUtE;AAED,wBAAgB,cAAc,CAAC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,6BAUtE;AAED,eAAO,MAAM,gBAAgB,eAA+D,CAAC;AAM7F,wBAAgB,uBAAuB,SAEtC;AAMD,wBAAgB,uBAAuB,YAetC;AAED,wBAAgB,gBAAgB,CAAC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,WAMxE"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/use-visual-mode/index.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,gBAAgB,eAA+D,CAAC;AAM7F,wBAAgB,uBAAuB,SAEtC;AAMD,wBAAgB,uBAAuB,YAetC"}
@@ -1,31 +1,8 @@
1
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
2
  // SPDX-License-Identifier: Apache-2.0
3
- import { useState } from 'react';
4
3
  import { ALWAYS_VISUAL_REFRESH } from '../../environment';
5
- import { isMotionDisabled } from '../../motion';
6
- import { findUpUntil } from '../../utils/dom';
7
- import { useMutationObserver } from '../use-mutation-observer';
8
4
  import { isDevelopment } from '../../is-development';
9
5
  import { warnOnce } from '@cloudscape-design/component-toolkit/internal';
10
- // Note that this hook doesn't take into consideration @media print (unlike the dark mode CSS),
11
- // due to challenges with cross-browser implementations of media/print state change listeners.
12
- // This means that components using this hook will render in dark mode even when printing.
13
- export function useCurrentMode(elementRef) {
14
- const [value, setValue] = useState('light');
15
- useMutationObserver(elementRef, node => {
16
- const darkModeParent = findUpUntil(node, node => node.classList.contains('awsui-polaris-dark-mode') || node.classList.contains('awsui-dark-mode'));
17
- setValue(darkModeParent ? 'dark' : 'light');
18
- });
19
- return value;
20
- }
21
- export function useDensityMode(elementRef) {
22
- const [value, setValue] = useState('comfortable');
23
- useMutationObserver(elementRef, node => {
24
- const compactModeParent = findUpUntil(node, node => node.classList.contains('awsui-polaris-compact-mode') || node.classList.contains('awsui-compact-mode'));
25
- setValue(compactModeParent ? 'compact' : 'comfortable');
26
- });
27
- return value;
28
- }
29
6
  export const useVisualRefresh = ALWAYS_VISUAL_REFRESH ? () => true : useVisualRefreshDynamic;
30
7
  // We expect VR is to be set only once and before the application is rendered.
31
8
  let visualRefreshState = undefined;
@@ -49,11 +26,4 @@ export function useVisualRefreshDynamic() {
49
26
  }
50
27
  return visualRefreshState;
51
28
  }
52
- export function useReducedMotion(elementRef) {
53
- const [value, setValue] = useState(false);
54
- useMutationObserver(elementRef, node => {
55
- setValue(isMotionDisabled(node));
56
- });
57
- return value;
58
- }
59
29
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/hooks/use-visual-mode/index.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 React, { useState } from 'react';\nimport { ALWAYS_VISUAL_REFRESH } from '../../environment';\nimport { isMotionDisabled } from '../../motion';\nimport { findUpUntil } from '../../utils/dom';\nimport { useMutationObserver } from '../use-mutation-observer';\nimport { isDevelopment } from '../../is-development';\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\n// Note that this hook doesn't take into consideration @media print (unlike the dark mode CSS),\n// due to challenges with cross-browser implementations of media/print state change listeners.\n// This means that components using this hook will render in dark mode even when printing.\nexport function useCurrentMode(elementRef: React.RefObject<HTMLElement>) {\n const [value, setValue] = useState<'light' | 'dark'>('light');\n useMutationObserver(elementRef, node => {\n const darkModeParent = findUpUntil(\n node,\n node => node.classList.contains('awsui-polaris-dark-mode') || node.classList.contains('awsui-dark-mode')\n );\n setValue(darkModeParent ? 'dark' : 'light');\n });\n return value;\n}\n\nexport function useDensityMode(elementRef: React.RefObject<HTMLElement>) {\n const [value, setValue] = useState<'comfortable' | 'compact'>('comfortable');\n useMutationObserver(elementRef, node => {\n const compactModeParent = findUpUntil(\n node,\n node => node.classList.contains('awsui-polaris-compact-mode') || node.classList.contains('awsui-compact-mode')\n );\n setValue(compactModeParent ? 'compact' : 'comfortable');\n });\n return value;\n}\n\nexport const useVisualRefresh = ALWAYS_VISUAL_REFRESH ? () => true : useVisualRefreshDynamic;\n\n// We expect VR is to be set only once and before the application is rendered.\nlet visualRefreshState: undefined | boolean = undefined;\n\n// for testing\nexport function clearVisualRefreshState() {\n visualRefreshState = undefined;\n}\n\nfunction detectVisualRefresh() {\n return typeof document !== 'undefined' && !!document.querySelector('.awsui-visual-refresh');\n}\n\nexport function useVisualRefreshDynamic() {\n if (visualRefreshState === undefined) {\n visualRefreshState = detectVisualRefresh();\n }\n if (isDevelopment) {\n const newVisualRefreshState = detectVisualRefresh();\n if (newVisualRefreshState !== visualRefreshState) {\n warnOnce(\n 'Visual Refresh',\n 'Dynamic visual refresh change detected. This is not supported. ' +\n 'Make sure `awsui-visual-refresh` is attached to the `<body>` element before initial React render'\n );\n }\n }\n return visualRefreshState;\n}\n\nexport function useReducedMotion(elementRef: React.RefObject<HTMLElement>) {\n const [value, setValue] = useState(false);\n useMutationObserver(elementRef, node => {\n setValue(isMotionDisabled(node));\n });\n return value;\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/hooks/use-visual-mode/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,+CAA+C,CAAC;AAEzE,MAAM,CAAC,MAAM,gBAAgB,GAAG,qBAAqB,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,uBAAuB,CAAC;AAE7F,8EAA8E;AAC9E,IAAI,kBAAkB,GAAwB,SAAS,CAAC;AAExD,cAAc;AACd,MAAM,UAAU,uBAAuB;IACrC,kBAAkB,GAAG,SAAS,CAAC;AACjC,CAAC;AAED,SAAS,mBAAmB;IAC1B,OAAO,OAAO,QAAQ,KAAK,WAAW,IAAI,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;AAC9F,CAAC;AAED,MAAM,UAAU,uBAAuB;IACrC,IAAI,kBAAkB,KAAK,SAAS,EAAE;QACpC,kBAAkB,GAAG,mBAAmB,EAAE,CAAC;KAC5C;IACD,IAAI,aAAa,EAAE;QACjB,MAAM,qBAAqB,GAAG,mBAAmB,EAAE,CAAC;QACpD,IAAI,qBAAqB,KAAK,kBAAkB,EAAE;YAChD,QAAQ,CACN,gBAAgB,EAChB,iEAAiE;gBAC/D,kGAAkG,CACrG,CAAC;SACH;KACF;IACD,OAAO,kBAAkB,CAAC;AAC5B,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { ALWAYS_VISUAL_REFRESH } from '../../environment';\nimport { isDevelopment } from '../../is-development';\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nexport const useVisualRefresh = ALWAYS_VISUAL_REFRESH ? () => true : useVisualRefreshDynamic;\n\n// We expect VR is to be set only once and before the application is rendered.\nlet visualRefreshState: undefined | boolean = undefined;\n\n// for testing\nexport function clearVisualRefreshState() {\n visualRefreshState = undefined;\n}\n\nfunction detectVisualRefresh() {\n return typeof document !== 'undefined' && !!document.querySelector('.awsui-visual-refresh');\n}\n\nexport function useVisualRefreshDynamic() {\n if (visualRefreshState === undefined) {\n visualRefreshState = detectVisualRefresh();\n }\n if (isDevelopment) {\n const newVisualRefreshState = detectVisualRefresh();\n if (newVisualRefreshState !== visualRefreshState) {\n warnOnce(\n 'Visual Refresh',\n 'Dynamic visual refresh change detected. This is not supported. ' +\n 'Make sure `awsui-visual-refresh` is attached to the `<body>` element before initial React render'\n );\n }\n }\n return visualRefreshState;\n}\n"]}
@@ -1,3 +1,3 @@
1
1
  {
2
- "commit": "385429bb1e160123d902fe98dc3fc0cddef3f3d8"
2
+ "commit": "f94e6795eb6e591a541ec031054134b6c1b4693e"
3
3
  }
@@ -5,6 +5,7 @@ import { CartesianChartProps } from '../internal/components/cartesian-chart/inte
5
5
  export interface ChartContainerProps<T extends ChartDataTypes> {
6
6
  series: ReadonlyArray<InternalChartSeries<T>>;
7
7
  visibleSeries: ReadonlyArray<InternalChartSeries<T>>;
8
+ fitHeight?: boolean;
8
9
  height: number;
9
10
  detailPopoverSize: MixedLineBarChartProps<T>['detailPopoverSize'];
10
11
  detailPopoverFooter: MixedLineBarChartProps<T>['detailPopoverFooter'];
@@ -31,5 +32,5 @@ export interface ChartContainerProps<T extends ChartDataTypes> {
31
32
  i18nStrings: MixedLineBarChartProps<T>['i18nStrings'];
32
33
  plotContainerRef: React.RefObject<HTMLDivElement>;
33
34
  }
34
- export default function ChartContainer<T extends ChartDataTypes>({ height: plotHeight, series, visibleSeries, highlightedSeries, onHighlightChange, highlightedPoint, setHighlightedPoint, highlightedGroupIndex, setHighlightedGroupIndex, detailPopoverFooter, detailPopoverSize, stackedBars, horizontalBars, xScaleType, yScaleType, xTickFormatter, yTickFormatter, emphasizeBaselineAxis, xTitle, yTitle, ariaLabel, ariaLabelledby, ariaDescription, i18nStrings, plotContainerRef, ...props }: ChartContainerProps<T>): JSX.Element;
35
+ export default function ChartContainer<T extends ChartDataTypes>({ fitHeight, height: explicitPlotHeight, series, visibleSeries, highlightedSeries, onHighlightChange, highlightedPoint, setHighlightedPoint, highlightedGroupIndex, setHighlightedGroupIndex, detailPopoverFooter, detailPopoverSize, stackedBars, horizontalBars, xScaleType, yScaleType, xTickFormatter, yTickFormatter, emphasizeBaselineAxis, xTitle, yTitle, ariaLabel, ariaLabelledby, ariaDescription, i18nStrings, plotContainerRef, ...props }: ChartContainerProps<T>): JSX.Element;
35
36
  //# sourceMappingURL=chart-container.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"chart-container.d.ts","sourceRoot":"lib/default/","sources":["mixed-line-bar-chart/chart-container.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"chart-container.d.ts","sourceRoot":"lib/default/","sources":["mixed-line-bar-chart/chart-container.tsx"],"names":[],"mappings":"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"}