@cloudscape-design/components 3.0.775 → 3.0.777
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/app-layout/test-classes/styles.css.js +22 -20
- package/app-layout/test-classes/styles.scoped.css +28 -20
- package/app-layout/test-classes/styles.selectors.js +22 -20
- package/app-layout/visual-refresh/drawers.d.ts.map +1 -1
- package/app-layout/visual-refresh/drawers.js +5 -5
- package/app-layout/visual-refresh/drawers.js.map +1 -1
- package/app-layout/visual-refresh-toolbar/index.d.ts.map +1 -1
- package/app-layout/visual-refresh-toolbar/index.js +1 -0
- package/app-layout/visual-refresh-toolbar/index.js.map +1 -1
- package/app-layout/visual-refresh-toolbar/split-panel/styles.css.js +1 -1
- package/app-layout/visual-refresh-toolbar/split-panel/styles.scoped.css +2 -1
- package/app-layout/visual-refresh-toolbar/split-panel/styles.selectors.js +1 -1
- package/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.d.ts.map +1 -1
- package/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.js +1 -1
- package/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.js.map +1 -1
- package/app-layout/visual-refresh-toolbar/toolbar/trigger-button/index.d.ts.map +1 -1
- package/app-layout/visual-refresh-toolbar/toolbar/trigger-button/index.js +7 -7
- package/app-layout/visual-refresh-toolbar/toolbar/trigger-button/index.js.map +1 -1
- package/app-layout/visual-refresh-toolbar/toolbar/trigger-button/styles.css.js +7 -9
- package/app-layout/visual-refresh-toolbar/toolbar/trigger-button/styles.scoped.css +19 -27
- package/app-layout/visual-refresh-toolbar/toolbar/trigger-button/styles.selectors.js +7 -9
- package/area-chart/internal.d.ts.map +1 -1
- package/area-chart/internal.js +1 -0
- package/area-chart/internal.js.map +1 -1
- package/area-chart/model/use-chart-model.d.ts +2 -1
- package/area-chart/model/use-chart-model.d.ts.map +1 -1
- package/area-chart/model/use-chart-model.js +2 -2
- package/area-chart/model/use-chart-model.js.map +1 -1
- package/internal/components/tooltip/index.d.ts +2 -1
- package/internal/components/tooltip/index.d.ts.map +1 -1
- package/internal/components/tooltip/index.js +2 -2
- package/internal/components/tooltip/index.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/environment.json +1 -1
- package/internal/manifest.json +1 -1
- package/package.json +1 -1
- package/popover/container.d.ts +2 -1
- package/popover/container.d.ts.map +1 -1
- package/popover/container.js +5 -4
- package/popover/container.js.map +1 -1
- package/popover/interfaces.d.ts +4 -0
- package/popover/interfaces.d.ts.map +1 -1
- package/popover/interfaces.js.map +1 -1
- package/popover/use-popover-position.d.ts +3 -1
- package/popover/use-popover-position.d.ts.map +1 -1
- package/popover/use-popover-position.js +21 -5
- package/popover/use-popover-position.js.map +1 -1
- package/popover/utils/positions.d.ts +2 -1
- package/popover/utils/positions.d.ts.map +1 -1
- package/popover/utils/positions.js +6 -0
- package/popover/utils/positions.js.map +1 -1
- package/prompt-input/interfaces.d.ts +16 -0
- package/prompt-input/interfaces.d.ts.map +1 -1
- package/prompt-input/interfaces.js.map +1 -1
- package/prompt-input/internal.d.ts.map +1 -1
- package/prompt-input/internal.js +28 -11
- package/prompt-input/internal.js.map +1 -1
- package/prompt-input/styles.css.js +14 -8
- package/prompt-input/styles.scoped.css +264 -68
- package/prompt-input/styles.selectors.js +14 -8
- package/prompt-input/test-classes/styles.css.js +5 -3
- package/prompt-input/test-classes/styles.scoped.css +11 -3
- package/prompt-input/test-classes/styles.selectors.js +5 -3
- package/select/parts/item.d.ts.map +1 -1
- package/select/parts/item.js +1 -1
- package/select/parts/item.js.map +1 -1
- package/select/parts/multiselect-item.d.ts.map +1 -1
- package/select/parts/multiselect-item.js +1 -1
- package/select/parts/multiselect-item.js.map +1 -1
- package/split-panel/implementation.js +1 -1
- package/split-panel/implementation.js.map +1 -1
- package/split-panel/side.d.ts.map +1 -1
- package/split-panel/side.js +3 -1
- package/split-panel/side.js.map +1 -1
- package/split-panel/styles.css.js +26 -26
- package/split-panel/styles.scoped.css +46 -43
- package/split-panel/styles.selectors.js +26 -26
- package/test-utils/dom/app-layout/index.d.ts +2 -0
- package/test-utils/dom/app-layout/index.js +6 -0
- package/test-utils/dom/app-layout/index.js.map +1 -1
- package/test-utils/dom/prompt-input/index.d.ts +2 -0
- package/test-utils/dom/prompt-input/index.js +6 -0
- package/test-utils/dom/prompt-input/index.js.map +1 -1
- package/test-utils/selectors/app-layout/index.d.ts +2 -0
- package/test-utils/selectors/app-layout/index.js +6 -0
- package/test-utils/selectors/app-layout/index.js.map +1 -1
- package/test-utils/selectors/prompt-input/index.d.ts +2 -0
- package/test-utils/selectors/prompt-input/index.js +6 -0
- package/test-utils/selectors/prompt-input/index.js.map +1 -1
- package/test-utils/tsconfig.tsbuildinfo +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer-triggers.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AAEzE,OAAO,EAAE,SAAS,EAAE,MAAM,oCAAoC,CAAC;AAC/D,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,YAAY,MAAM,4BAA4B,CAAC;AAEtD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,aAAa,MAAM,kBAAkB,CAAC;AAE7C,OAAO,wBAAwB,MAAM,iDAAiD,CAAC;AACvF,OAAO,cAAc,MAAM,kCAAkC,CAAC;AAC9D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AA+BrC,MAAM,UAAU,cAAc,CAAC,EAC7B,UAAU,EACV,cAAc,EACd,OAAO,EACP,eAAe,EACf,oBAAoB,EACpB,cAAc,EACd,kBAAkB,GAAG,QAAQ,EAC7B,kBAAkB,EAClB,qBAAqB,EACrB,kBAAkB,EAClB,QAAQ,EACR,sBAAsB,EACtB,aAAa,EACb,yBAAyB,EACzB,2BAA2B,GACP;IACpB,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,MAAM,mBAAmB,GAAG,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/C,MAAM,2BAA2B,GAAG,MAAM,CAAC,cAAc,CAAC,CAAC;IAC3D,MAAM,8BAA8B,GAAG,MAAM,CAAC,sBAAsB,CAAC,CAAC;IACtE,MAAM,CAAC,cAAc,EAAE,oBAAoB,CAAC,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IAC/F,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,aAAa,CAAC,MAAM,IAAI,CAAC,qBAAqB,EAAE;QACtE,OAAO,IAAI,CAAC;KACb;IAED,IAAI,cAAc,EAAE;QAClB,2BAA2B,CAAC,OAAO,GAAG,cAAc,CAAC;KACtD;IAED,IAAI,sBAAsB,CAAC,MAAM,EAAE;QACjC,8BAA8B,CAAC,OAAO,GAAG,sBAAsB,CAAC;KACjE;IAED,MAAM,sBAAsB,GAAG,GAAG,EAAE;QAClC,IAAI,QAAQ,EAAE;YACZ,OAAO,CAAC,CAAC;SACV;QACD,IAAI,cAAc,EAAE;YAClB,MAAM,UAAU,GAAG,EAAE,CAAC,CAAC,2DAA2D;YAClF,MAAM,YAAY,GAAG,cAAc,CAAC;YAEpC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,UAAU,CAAC,CAAC;YAEpD,IAAI,cAAc,GAAG,CAAC,CAAC;YACvB,IAAI,qBAAqB,EAAE;gBACzB,cAAc,GAAG,CAAC,CAAC;aACpB;YACD,OAAO,KAAK,GAAG,cAAc,CAAC;SAC/B;QACD,OAAO,CAAC,CAAC;IACX,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,sBAAsB,EAAE,CAAC;IAErD,MAAM,EAAE,YAAY,EAAE,aAAa,EAAE,GAAG,UAAU,CAChD,CAAC,GAAG,OAAO,EAAE,GAAG,aAAa,CAAC,EAC9B,mBAAmB,EACnB,cAAc,aAAd,cAAc,cAAd,cAAc,GAAI,IAAI,CACvB,CAAC;IACF,MAAM,oBAAoB,GAAG,CAAC,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACtE,MAAM,aAAa,GAAG,OAAO,CAAC,MAAM,KAAK,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,eAAe,CAAC;IAChF,MAAM,uBAAuB,GAAG,OAAO,CAAC,MAAM,CAAC;IAC/C,MAAM,aAAa,GAAG,CAAC,CAAC,cAAc,IAAI,CAAC,kBAAkB,KAAK,MAAM,IAAI,cAAc,CAAC,CAAC;IAE5F,OAAO,CACL,+BACE,SAAS,EAAE,MAAM,CAAC,WAAW,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,qBAAqB,CAAC,gBACtE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,OAAO,EAC/B,GAAG,EAAE,oBAAoB,EACzB,IAAI,EAAC,QAAQ;QAEb,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,yBAAyB,CAAC,EAAE;gBACjD,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC,EAAE,mBAAmB;gBACtD,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,EAAE,cAAc;aAC5C,CAAC,EACF,IAAI,EAAC,SAAS,sBACG,YAAY;YAE5B,qBAAqB,IAAI,CACxB;gBACE,oBAAC,aAAa,IACZ,SAAS,EAAE,qBAAqB,CAAC,SAAS,EAC1C,YAAY,EAAE,qBAAqB,CAAC,SAAS,EAC7C,YAAY,EAAE,qBAAqB,CAAC,MAAM,EAC1C,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,EAAE,wBAAwB,CAAC,aAAa,CAAC,CAAC,EACnF,QAAQ,EAAE,qBAAqB,CAAC,QAAQ,KAAK,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,iBAAiB,EACzF,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,EAAI,EACrC,QAAQ,EAAE,qBAAqB,CAAC,MAAM,EACtC,GAAG,EAAE,kBAAkB,EACvB,UAAU,EAAE,IAAI,EAChB,MAAM,EAAE,sCAAsC,EAC9C,QAAQ,EAAE,QAAQ,EAClB,yBAAyB,EAAE,qBAAqB,CAAC,MAAM,EACvD,eAAe,EAAE,IAAI,EACrB,QAAQ,EAAE,QAAQ,GAClB;gBACD,mBAAmB,CAAC,CAAC,CAAC,6BAAK,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC,GAAQ,CAAC,CAAC,CAAC,IAAI,CAC5E,CACJ;YACA,YAAY,CAAC,KAAK,CAAC,CAAC,EAAE,uBAAuB,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;;gBACzD,MAAM,yBAAyB,GAAG,CAAA,2BAA2B,aAA3B,2BAA2B,uBAA3B,2BAA2B,CAAE,OAAO,MAAK,IAAI,CAAC,EAAE,CAAC;gBACnF,OAAO,CACL,oBAAC,aAAa,IACZ,SAAS,EAAE,MAAA,IAAI,CAAC,UAAU,0CAAE,aAAa,EACzC,YAAY,EAAE,IAAI,CAAC,EAAE,KAAK,cAAc,EACxC,YAAY,EAAE,cAAc,KAAK,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAC9D,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,iBAAiB,CAAC,EACzB,CAAC,aAAa,IAAI,cAAc,CAAC,iBAAiB,CAAC,EACnD,IAAI,CAAC,EAAE,KAAK,eAAe,IAAI,cAAc,CAAC,cAAc,CAAC,CAC9D,EACD,QAAQ,EAAE,IAAI,CAAC,OAAQ,CAAC,QAAQ,EAChC,OAAO,EAAE,IAAI,CAAC,OAAQ,CAAC,OAAO,EAC9B,GAAG,EAAE,IAAI,CAAC,EAAE,EACZ,OAAO,EAAE,GAAG,EAAE,CAAC,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAG,cAAc,KAAK,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,EAClF,GAAG,EAAE,IAAI,CAAC,EAAE,KAAK,2BAA2B,CAAC,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,SAAS,EAClF,QAAQ,EAAE,IAAI,CAAC,EAAE,KAAK,cAAc,EACpC,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,4BAA4B,IAAI,CAAC,EAAE,EAAE,EAC7C,UAAU,EAAE,IAAI,EAChB,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,MAAA,IAAI,CAAC,UAAU,0CAAE,UAAU,EACxC,yBAAyB,EAAE,yBAAyB,EACpD,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAC;YACJ,CAAC,CAAC;YACD,YAAY,CAAC,MAAM,GAAG,uBAAuB,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC,GAAQ;YAChG,YAAY,CAAC,KAAK,CAAC,uBAAuB,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;;gBACtD,MAAM,yBAAyB,GAAG,8BAA8B,aAA9B,8BAA8B,uBAA9B,8BAA8B,CAAE,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;gBAC5F,OAAO,CACL,oBAAC,aAAa,IACZ,SAAS,EAAE,MAAA,IAAI,CAAC,UAAU,0CAAE,aAAa,EACzC,YAAY,EAAE,sBAAsB,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,EACtD,YAAY,EAAE,sBAAsB,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAC5E,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,iBAAiB,CAAC,EACzB,cAAc,CAAC,iBAAiB,CAAC,EACjC,cAAc,CAAC,wBAAwB,CAAC,CACzC,EACD,QAAQ,EAAE,IAAI,CAAC,OAAQ,CAAC,QAAQ,EAChC,OAAO,EAAE,IAAI,CAAC,OAAQ,CAAC,OAAO,EAC9B,GAAG,EAAE,IAAI,CAAC,EAAE,EACZ,OAAO,EAAE,GAAG,EAAE;wBACZ,2BAA2B,IAAI,2BAA2B,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;oBACtE,CAAC,EACD,GAAG,EAAE,MAAA,yBAAyB,aAAzB,yBAAyB,uBAAzB,yBAAyB,CAAE,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,0CAAE,MAAM,EACrD,QAAQ,EAAE,sBAAsB,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,EAClD,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,4BAA4B,IAAI,CAAC,EAAE,EAAE,EAC7C,UAAU,EAAE,IAAI,EAChB,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,MAAA,IAAI,CAAC,UAAU,0CAAE,UAAU,EACxC,yBAAyB,EAAE,yBAAyB,EACpD,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAC;YACJ,CAAC,CAAC;YACD,aAAa,CAAC,MAAM,GAAG,CAAC,IAAI,CAC3B,oBAAC,YAAY,IACX,KAAK,EAAE,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,iCAC5B,IAAI,KACP,MAAM,EAAE,sBAAsB,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,IAChD,CAAC,EACH,SAAS,EAAE,oBAAoB,CAAC,CAAC,CAAC,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,wBAAwB,CAAC,CAAC,CAAC,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,eAAe,EACpG,oBAAoB,EAAE,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,EAAE,EAAE;oBACzF,OAAO,CACL,oBAAC,aAAa,IACZ,GAAG,EAAE,UAAU,EACf,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,oBAAoB,EAC3B,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,iBAAiB,CAAC,EACzB,cAAc,CAAC,iBAAiB,CAAC,EACjC,cAAc,CAAC,wBAAwB,CAAC,EACxC,cAAc,CACf,EACD,QAAQ,EAAC,UAAU,EACnB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAC;gBACJ,CAAC,EACD,WAAW,EAAE,KAAK,CAAC,EAAE;oBACnB,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;oBAC3B,IAAI,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE;wBAClD,2BAA2B,aAA3B,2BAA2B,uBAA3B,2BAA2B,CAAG,EAAE,CAAC,CAAC;qBACnC;yBAAM;wBACL,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAG,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;qBACzC;gBACH,CAAC,EACD,uBAAuB,EAAE,uBAAuB,GAAG,mBAAmB,GACtE,CACH,CACG,CACA,CACT,CAAC;AACJ,CAAC","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 { useContainerQuery } from '@cloudscape-design/component-toolkit';\n\nimport { useMobile } from '../../../internal/hooks/use-mobile';\nimport { splitItems } from '../../drawer/drawers-helpers';\nimport OverflowMenu from '../../drawer/overflow-menu';\nimport { AppLayoutProps, AppLayoutPropsWithDefaults } from '../../interfaces';\nimport { TOOLS_DRAWER_ID } from '../../utils/use-drawers';\nimport { Focusable, FocusControlMultipleStates } from '../../utils/use-focus-control';\nimport TriggerButton from './trigger-button';\n\nimport splitPanelTestUtilStyles from '../../../split-panel/test-classes/styles.css.js';\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\nexport interface SplitPanelToggleProps {\n displayed: boolean;\n ariaLabel: string | undefined;\n controlId: string | undefined;\n active: boolean;\n position: AppLayoutProps.SplitPanelPosition;\n}\n\ninterface DrawerTriggersProps {\n ariaLabels: AppLayoutPropsWithDefaults['ariaLabels'];\n\n activeDrawerId: string | null;\n drawersFocusRef: React.Ref<Focusable> | undefined;\n drawers: ReadonlyArray<AppLayoutProps.Drawer>;\n onActiveDrawerChange: ((drawerId: string | null) => void) | undefined;\n\n activeGlobalDrawersIds: ReadonlyArray<string>;\n globalDrawersFocusControl?: FocusControlMultipleStates;\n globalDrawers: ReadonlyArray<AppLayoutProps.Drawer>;\n onActiveGlobalDrawersChange?: (newDrawerId: string) => void;\n\n splitPanelOpen?: boolean;\n splitPanelPosition?: AppLayoutProps.SplitPanelPreferences['position'];\n splitPanelToggleProps: SplitPanelToggleProps | undefined;\n splitPanelFocusRef: React.Ref<Focusable> | undefined;\n onSplitPanelToggle: (() => void) | undefined;\n disabled: boolean;\n}\n\nexport function DrawerTriggers({\n ariaLabels,\n activeDrawerId,\n drawers,\n drawersFocusRef,\n onActiveDrawerChange,\n splitPanelOpen,\n splitPanelPosition = 'bottom',\n splitPanelFocusRef,\n splitPanelToggleProps,\n onSplitPanelToggle,\n disabled,\n activeGlobalDrawersIds,\n globalDrawers,\n globalDrawersFocusControl,\n onActiveGlobalDrawersChange,\n}: DrawerTriggersProps) {\n const isMobile = useMobile();\n const hasMultipleTriggers = drawers.length > 1;\n const previousActiveLocalDrawerId = useRef(activeDrawerId);\n const previousActiveGlobalDrawersIds = useRef(activeGlobalDrawersIds);\n const [containerWidth, triggersContainerRef] = useContainerQuery(rect => rect.contentBoxWidth);\n if (!drawers.length && !globalDrawers.length && !splitPanelToggleProps) {\n return null;\n }\n\n if (activeDrawerId) {\n previousActiveLocalDrawerId.current = activeDrawerId;\n }\n\n if (activeGlobalDrawersIds.length) {\n previousActiveGlobalDrawersIds.current = activeGlobalDrawersIds;\n }\n\n const getIndexOfOverflowItem = () => {\n if (isMobile) {\n return 2;\n }\n if (containerWidth) {\n const ITEM_WIDTH = 50; // Roughly 34px + padding = 42px but added extra for safety\n const overflowSpot = containerWidth;\n\n const index = Math.floor(overflowSpot / ITEM_WIDTH);\n\n let splitPanelItem = 0;\n if (splitPanelToggleProps) {\n splitPanelItem = 1;\n }\n return index - splitPanelItem;\n }\n return 0;\n };\n\n const indexOfOverflowItem = getIndexOfOverflowItem();\n\n const { visibleItems, overflowItems } = splitItems(\n [...drawers, ...globalDrawers],\n indexOfOverflowItem,\n activeDrawerId ?? null\n );\n const overflowMenuHasBadge = !!overflowItems.find(item => item.badge);\n const toolsOnlyMode = drawers.length === 1 && drawers[0].id === TOOLS_DRAWER_ID;\n const globalDrawersStartIndex = drawers.length;\n const hasOpenDrawer = !!activeDrawerId || (splitPanelPosition === 'side' && splitPanelOpen);\n\n return (\n <aside\n className={styles[`drawers-${isMobile ? 'mobile' : 'desktop'}-triggers-container`]}\n aria-label={ariaLabels?.drawers}\n ref={triggersContainerRef}\n role=\"region\"\n >\n <div\n className={clsx(styles['drawers-trigger-content'], {\n [styles['has-multiple-triggers']]: hasMultipleTriggers,\n [styles['has-open-drawer']]: activeDrawerId,\n })}\n role=\"toolbar\"\n aria-orientation=\"horizontal\"\n >\n {splitPanelToggleProps && (\n <>\n <TriggerButton\n ariaLabel={splitPanelToggleProps.ariaLabel}\n ariaControls={splitPanelToggleProps.controlId}\n ariaExpanded={splitPanelToggleProps.active}\n className={clsx(styles['drawers-trigger'], splitPanelTestUtilStyles['open-button'])}\n iconName={splitPanelToggleProps.position === 'side' ? 'view-vertical' : 'view-horizontal'}\n onClick={() => onSplitPanelToggle?.()}\n selected={splitPanelToggleProps.active}\n ref={splitPanelFocusRef}\n hasTooltip={true}\n testId={`awsui-app-layout-trigger-slide-panel`}\n isMobile={isMobile}\n isForPreviousActiveDrawer={splitPanelToggleProps.active}\n isForSplitPanel={true}\n disabled={disabled}\n />\n {hasMultipleTriggers ? <div className={styles['group-divider']}></div> : null}\n </>\n )}\n {visibleItems.slice(0, globalDrawersStartIndex).map(item => {\n const isForPreviousActiveDrawer = previousActiveLocalDrawerId?.current === item.id;\n return (\n <TriggerButton\n ariaLabel={item.ariaLabels?.triggerButton}\n ariaExpanded={item.id === activeDrawerId}\n ariaControls={activeDrawerId === item.id ? item.id : undefined}\n className={clsx(\n styles['drawers-trigger'],\n !toolsOnlyMode && testutilStyles['drawers-trigger'],\n item.id === TOOLS_DRAWER_ID && testutilStyles['tools-toggle']\n )}\n iconName={item.trigger!.iconName}\n iconSvg={item.trigger!.iconSvg}\n key={item.id}\n onClick={() => onActiveDrawerChange?.(activeDrawerId !== item.id ? item.id : null)}\n ref={item.id === previousActiveLocalDrawerId.current ? drawersFocusRef : undefined}\n selected={item.id === activeDrawerId}\n badge={item.badge}\n testId={`awsui-app-layout-trigger-${item.id}`}\n hasTooltip={true}\n hasOpenDrawer={hasOpenDrawer}\n tooltipText={item.ariaLabels?.drawerName}\n isForPreviousActiveDrawer={isForPreviousActiveDrawer}\n isMobile={isMobile}\n disabled={disabled}\n />\n );\n })}\n {visibleItems.length > globalDrawersStartIndex && <div className={styles['group-divider']}></div>}\n {visibleItems.slice(globalDrawersStartIndex).map(item => {\n const isForPreviousActiveDrawer = previousActiveGlobalDrawersIds?.current.includes(item.id);\n return (\n <TriggerButton\n ariaLabel={item.ariaLabels?.triggerButton}\n ariaExpanded={activeGlobalDrawersIds.includes(item.id)}\n ariaControls={activeGlobalDrawersIds.includes(item.id) ? item.id : undefined}\n className={clsx(\n styles['drawers-trigger'],\n testutilStyles['drawers-trigger'],\n testutilStyles['drawers-trigger-global']\n )}\n iconName={item.trigger!.iconName}\n iconSvg={item.trigger!.iconSvg}\n key={item.id}\n onClick={() => {\n onActiveGlobalDrawersChange && onActiveGlobalDrawersChange(item.id);\n }}\n ref={globalDrawersFocusControl?.refs[item.id]?.toggle}\n selected={activeGlobalDrawersIds.includes(item.id)}\n badge={item.badge}\n testId={`awsui-app-layout-trigger-${item.id}`}\n hasTooltip={true}\n hasOpenDrawer={hasOpenDrawer}\n tooltipText={item.ariaLabels?.drawerName}\n isForPreviousActiveDrawer={isForPreviousActiveDrawer}\n isMobile={isMobile}\n disabled={disabled}\n />\n );\n })}\n {overflowItems.length > 0 && (\n <OverflowMenu\n items={overflowItems.map(item => ({\n ...item,\n active: activeGlobalDrawersIds.includes(item.id),\n }))}\n ariaLabel={overflowMenuHasBadge ? ariaLabels?.drawersOverflowWithBadge : ariaLabels?.drawersOverflow}\n customTriggerBuilder={({ onClick, triggerRef, ariaLabel, ariaExpanded, testUtilsClass }) => {\n return (\n <TriggerButton\n ref={triggerRef}\n ariaLabel={ariaLabel}\n ariaExpanded={ariaExpanded}\n badge={overflowMenuHasBadge}\n className={clsx(\n styles['drawers-trigger'],\n testutilStyles['drawers-trigger'],\n testutilStyles['drawers-trigger-global'],\n testUtilsClass\n )}\n iconName=\"ellipsis\"\n onClick={onClick}\n disabled={disabled}\n />\n );\n }}\n onItemClick={event => {\n const id = event.detail.id;\n if (globalDrawers.find(drawer => drawer.id === id)) {\n onActiveGlobalDrawersChange?.(id);\n } else {\n onActiveDrawerChange?.(event.detail.id);\n }\n }}\n globalDrawersStartIndex={globalDrawersStartIndex - indexOfOverflowItem}\n />\n )}\n </div>\n </aside>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"drawer-triggers.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.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 { useContainerQuery } from '@cloudscape-design/component-toolkit';\n\nimport { useMobile } from '../../../internal/hooks/use-mobile';\nimport { splitItems } from '../../drawer/drawers-helpers';\nimport OverflowMenu from '../../drawer/overflow-menu';\nimport { AppLayoutProps, AppLayoutPropsWithDefaults } from '../../interfaces';\nimport { TOOLS_DRAWER_ID } from '../../utils/use-drawers';\nimport { Focusable, FocusControlMultipleStates } from '../../utils/use-focus-control';\nimport TriggerButton from './trigger-button';\n\nimport splitPanelTestUtilStyles from '../../../split-panel/test-classes/styles.css.js';\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\nexport interface SplitPanelToggleProps {\n displayed: boolean;\n ariaLabel: string | undefined;\n controlId: string | undefined;\n active: boolean;\n position: AppLayoutProps.SplitPanelPosition;\n}\n\ninterface DrawerTriggersProps {\n ariaLabels: AppLayoutPropsWithDefaults['ariaLabels'];\n\n activeDrawerId: string | null;\n drawersFocusRef: React.Ref<Focusable> | undefined;\n drawers: ReadonlyArray<AppLayoutProps.Drawer>;\n onActiveDrawerChange: ((drawerId: string | null) => void) | undefined;\n\n activeGlobalDrawersIds: ReadonlyArray<string>;\n globalDrawersFocusControl?: FocusControlMultipleStates;\n globalDrawers: ReadonlyArray<AppLayoutProps.Drawer>;\n onActiveGlobalDrawersChange?: (newDrawerId: string) => void;\n\n splitPanelOpen?: boolean;\n splitPanelPosition?: AppLayoutProps.SplitPanelPreferences['position'];\n splitPanelToggleProps: SplitPanelToggleProps | undefined;\n splitPanelFocusRef: React.Ref<Focusable> | undefined;\n onSplitPanelToggle: (() => void) | undefined;\n disabled: boolean;\n}\n\nexport function DrawerTriggers({\n ariaLabels,\n activeDrawerId,\n drawers,\n drawersFocusRef,\n onActiveDrawerChange,\n splitPanelOpen,\n splitPanelPosition = 'bottom',\n splitPanelFocusRef,\n splitPanelToggleProps,\n onSplitPanelToggle,\n disabled,\n activeGlobalDrawersIds,\n globalDrawers,\n globalDrawersFocusControl,\n onActiveGlobalDrawersChange,\n}: DrawerTriggersProps) {\n const isMobile = useMobile();\n const hasMultipleTriggers = drawers.length > 1;\n const previousActiveLocalDrawerId = useRef(activeDrawerId);\n const previousActiveGlobalDrawersIds = useRef(activeGlobalDrawersIds);\n const [containerWidth, triggersContainerRef] = useContainerQuery(rect => rect.contentBoxWidth);\n if (!drawers.length && !globalDrawers.length && !splitPanelToggleProps) {\n return null;\n }\n\n if (activeDrawerId) {\n previousActiveLocalDrawerId.current = activeDrawerId;\n }\n\n if (activeGlobalDrawersIds.length) {\n previousActiveGlobalDrawersIds.current = activeGlobalDrawersIds;\n }\n\n const getIndexOfOverflowItem = () => {\n if (isMobile) {\n return 2;\n }\n if (containerWidth) {\n const ITEM_WIDTH = 50; // Roughly 34px + padding = 42px but added extra for safety\n const overflowSpot = containerWidth;\n\n const index = Math.floor(overflowSpot / ITEM_WIDTH);\n\n let splitPanelItem = 0;\n if (splitPanelToggleProps) {\n splitPanelItem = 1;\n }\n return index - splitPanelItem;\n }\n return 0;\n };\n\n const indexOfOverflowItem = getIndexOfOverflowItem();\n\n const { visibleItems, overflowItems } = splitItems(\n [...drawers, ...globalDrawers],\n indexOfOverflowItem,\n activeDrawerId ?? null\n );\n const overflowMenuHasBadge = !!overflowItems.find(item => item.badge);\n const toolsOnlyMode = drawers.length === 1 && drawers[0].id === TOOLS_DRAWER_ID;\n const globalDrawersStartIndex = drawers.length;\n const hasOpenDrawer = !!activeDrawerId || (splitPanelPosition === 'side' && splitPanelOpen);\n\n return (\n <aside\n className={styles[`drawers-${isMobile ? 'mobile' : 'desktop'}-triggers-container`]}\n aria-label={ariaLabels?.drawers}\n ref={triggersContainerRef}\n role=\"region\"\n >\n <div\n className={clsx(styles['drawers-trigger-content'], {\n [styles['has-multiple-triggers']]: hasMultipleTriggers,\n [styles['has-open-drawer']]: activeDrawerId,\n })}\n role=\"toolbar\"\n aria-orientation=\"horizontal\"\n >\n {splitPanelToggleProps && (\n <>\n <TriggerButton\n ariaLabel={splitPanelToggleProps.ariaLabel}\n ariaControls={splitPanelToggleProps.controlId}\n ariaExpanded={splitPanelToggleProps.active}\n className={clsx(\n styles['drawers-trigger'],\n testutilStyles['drawers-trigger'],\n splitPanelTestUtilStyles['open-button']\n )}\n iconName={splitPanelToggleProps.position === 'side' ? 'view-vertical' : 'view-horizontal'}\n onClick={() => onSplitPanelToggle?.()}\n selected={splitPanelToggleProps.active}\n ref={splitPanelFocusRef}\n hasTooltip={true}\n testId={`awsui-app-layout-trigger-slide-panel`}\n isMobile={isMobile}\n isForSplitPanel={true}\n disabled={disabled}\n />\n {hasMultipleTriggers ? <div className={styles['group-divider']}></div> : null}\n </>\n )}\n {visibleItems.slice(0, globalDrawersStartIndex).map(item => {\n const isForPreviousActiveDrawer = previousActiveLocalDrawerId?.current === item.id;\n return (\n <TriggerButton\n ariaLabel={item.ariaLabels?.triggerButton}\n ariaExpanded={item.id === activeDrawerId}\n ariaControls={activeDrawerId === item.id ? item.id : undefined}\n className={clsx(\n styles['drawers-trigger'],\n !toolsOnlyMode && testutilStyles['drawers-trigger'],\n item.id === TOOLS_DRAWER_ID && testutilStyles['tools-toggle']\n )}\n iconName={item.trigger!.iconName}\n iconSvg={item.trigger!.iconSvg}\n key={item.id}\n onClick={() => onActiveDrawerChange?.(activeDrawerId !== item.id ? item.id : null)}\n ref={item.id === previousActiveLocalDrawerId.current ? drawersFocusRef : undefined}\n selected={item.id === activeDrawerId}\n badge={item.badge}\n testId={`awsui-app-layout-trigger-${item.id}`}\n hasTooltip={true}\n hasOpenDrawer={hasOpenDrawer}\n tooltipText={item.ariaLabels?.drawerName}\n isForPreviousActiveDrawer={isForPreviousActiveDrawer}\n isMobile={isMobile}\n disabled={disabled}\n />\n );\n })}\n {visibleItems.length > globalDrawersStartIndex && <div className={styles['group-divider']}></div>}\n {visibleItems.slice(globalDrawersStartIndex).map(item => {\n const isForPreviousActiveDrawer = previousActiveGlobalDrawersIds?.current.includes(item.id);\n return (\n <TriggerButton\n ariaLabel={item.ariaLabels?.triggerButton}\n ariaExpanded={activeGlobalDrawersIds.includes(item.id)}\n ariaControls={activeGlobalDrawersIds.includes(item.id) ? item.id : undefined}\n className={clsx(\n styles['drawers-trigger'],\n testutilStyles['drawers-trigger'],\n testutilStyles['drawers-trigger-global']\n )}\n iconName={item.trigger!.iconName}\n iconSvg={item.trigger!.iconSvg}\n key={item.id}\n onClick={() => {\n onActiveGlobalDrawersChange && onActiveGlobalDrawersChange(item.id);\n }}\n ref={globalDrawersFocusControl?.refs[item.id]?.toggle}\n selected={activeGlobalDrawersIds.includes(item.id)}\n badge={item.badge}\n testId={`awsui-app-layout-trigger-${item.id}`}\n hasTooltip={true}\n hasOpenDrawer={hasOpenDrawer}\n tooltipText={item.ariaLabels?.drawerName}\n isForPreviousActiveDrawer={isForPreviousActiveDrawer}\n isMobile={isMobile}\n disabled={disabled}\n />\n );\n })}\n {overflowItems.length > 0 && (\n <OverflowMenu\n items={overflowItems.map(item => ({\n ...item,\n active: activeGlobalDrawersIds.includes(item.id),\n }))}\n ariaLabel={overflowMenuHasBadge ? ariaLabels?.drawersOverflowWithBadge : ariaLabels?.drawersOverflow}\n customTriggerBuilder={({ onClick, triggerRef, ariaLabel, ariaExpanded, testUtilsClass }) => {\n return (\n <TriggerButton\n ref={triggerRef}\n ariaLabel={ariaLabel}\n ariaExpanded={ariaExpanded}\n badge={overflowMenuHasBadge}\n className={clsx(\n styles['drawers-trigger'],\n testutilStyles['drawers-trigger'],\n testutilStyles['drawers-trigger-global'],\n testUtilsClass\n )}\n iconName=\"ellipsis\"\n onClick={onClick}\n disabled={disabled}\n />\n );\n }}\n onItemClick={event => {\n const id = event.detail.id;\n if (globalDrawers.find(drawer => drawer.id === id)) {\n onActiveGlobalDrawersChange?.(id);\n } else {\n onActiveDrawerChange?.(event.detail.id);\n }\n }}\n globalDrawersStartIndex={globalDrawersStartIndex - indexOfOverflowItem}\n />\n )}\n </div>\n </aside>\n );\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/app-layout/visual-refresh-toolbar/toolbar/trigger-button/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiE,MAAM,OAAO,CAAC;AAGtF,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/app-layout/visual-refresh-toolbar/toolbar/trigger-button/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiE,MAAM,OAAO,CAAC;AAGtF,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAC;AAQxD,MAAM,WAAW,kBAAkB;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,YAAY,EAAE,OAAO,GAAG,SAAS,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAEpD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC/B;;AAoLD,wBAA+C"}
|
|
@@ -5,6 +5,7 @@ import clsx from 'clsx';
|
|
|
5
5
|
import Icon from '../../../../icon/internal';
|
|
6
6
|
import Tooltip from '../../../../internal/components/tooltip';
|
|
7
7
|
import { registerTooltip } from '../../../../internal/components/tooltip/registry';
|
|
8
|
+
import testutilStyles from '../../../test-classes/styles.css.js';
|
|
8
9
|
import styles from './styles.css.js';
|
|
9
10
|
function TriggerButton({ ariaLabel, className, iconName, iconSvg, ariaExpanded, ariaControls, onClick, testId, disabled = false, badge, selected = false, highContrastHeader, hasTooltip = false, tooltipText, hasOpenDrawer = false, isMobile = false, isForPreviousActiveDrawer = false, isForSplitPanel = false, }, ref) {
|
|
10
11
|
const containerRef = useRef(null);
|
|
@@ -36,9 +37,10 @@ function TriggerButton({ ariaLabel, className, iconName, iconSvg, ariaExpanded,
|
|
|
36
37
|
const eventWithRelatedTarget = event;
|
|
37
38
|
const relatedTarget = eventWithRelatedTarget === null || eventWithRelatedTarget === void 0 ? void 0 : eventWithRelatedTarget.relatedTarget;
|
|
38
39
|
const isFromAnotherTrigger = ((_a = relatedTarget === null || relatedTarget === void 0 ? void 0 : relatedTarget.dataset) === null || _a === void 0 ? void 0 : _a.shiftFocus) === 'awsui-layout-drawer-trigger';
|
|
39
|
-
if (isForSplitPanel || //
|
|
40
|
-
|
|
41
|
-
|
|
40
|
+
if ((isForSplitPanel && !!relatedTarget) || // relatedTarget is null when split panel is closed
|
|
41
|
+
(!isForSplitPanel &&
|
|
42
|
+
(isFromAnotherTrigger || // for key navigation from another trigger button
|
|
43
|
+
!isForPreviousActiveDrawer)) // for when the drawer was not opened recently
|
|
42
44
|
) {
|
|
43
45
|
shouldShowTooltip = true;
|
|
44
46
|
}
|
|
@@ -104,16 +106,14 @@ function TriggerButton({ ariaLabel, className, iconName, iconSvg, ariaExpanded,
|
|
|
104
106
|
onPointerLeave: () => handleBlur(true),
|
|
105
107
|
onFocus: e => handleOnFocus(e),
|
|
106
108
|
onBlur: () => handleBlur(true),
|
|
107
|
-
}), { className: clsx(styles['trigger-wrapper'], !highContrastHeader ? styles['remove-high-contrast-header'] : '',
|
|
108
|
-
[styles['trigger-wrapper-tooltip-visible']]: tooltipVisible,
|
|
109
|
-
}) }),
|
|
109
|
+
}), { className: clsx(styles['trigger-wrapper'], !highContrastHeader ? styles['remove-high-contrast-header'] : '') }),
|
|
110
110
|
React.createElement("button", { "aria-expanded": ariaExpanded, "aria-controls": ariaControls, "aria-haspopup": true, "aria-label": ariaLabel, "aria-disabled": disabled, disabled: disabled, className: clsx(styles.trigger, styles['trigger-button-styles'], {
|
|
111
111
|
[styles.selected]: selected,
|
|
112
112
|
[styles.badge]: badge,
|
|
113
113
|
}, className), onClick: handleTriggerClick, ref: ref, type: "button", "data-testid": testId, "data-shift-focus": "awsui-layout-drawer-trigger" },
|
|
114
114
|
React.createElement("span", { className: clsx(badge && clsx(styles['trigger-badge-wrapper'], styles['trigger-button-styles'])) }, (iconName || iconSvg) && React.createElement(Icon, { name: iconName, svg: iconSvg }))),
|
|
115
115
|
badge && React.createElement("div", { className: styles.dot }),
|
|
116
|
-
tooltipVisible && React.createElement(Tooltip, { trackRef: containerRef, value: tooltipValue, className:
|
|
116
|
+
tooltipVisible && (React.createElement(Tooltip, { trackRef: containerRef, value: tooltipValue, className: testutilStyles['trigger-tooltip'] }))));
|
|
117
117
|
}
|
|
118
118
|
export default React.forwardRef(TriggerButton);
|
|
119
119
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/app-layout/visual-refresh-toolbar/toolbar/trigger-button/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAO,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACtF,OAAO,IAAI,MAAM,MAAM,CAAC;AAIxB,OAAO,IAAI,MAAM,2BAA2B,CAAC;AAC7C,OAAO,OAAO,MAAM,yCAAyC,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,kDAAkD,CAAC;AAEnF,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAoDrC,SAAS,aAAa,CACpB,EACE,SAAS,EACT,SAAS,EACT,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,YAAY,EACZ,OAAO,EACP,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,QAAQ,GAAG,KAAK,EAChB,kBAAkB,EAClB,UAAU,GAAG,KAAK,EAClB,WAAW,EACX,aAAa,GAAG,KAAK,EACrB,QAAQ,GAAG,KAAK,EAChB,yBAAyB,GAAG,KAAK,EACjC,eAAe,GAAG,KAAK,GACJ,EACrB,GAA+B;IAE/B,MAAM,YAAY,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IACzD,MAAM,YAAY,GAAG,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5E,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAC/D,MAAM,CAAC,eAAe,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAEtE,MAAM,kBAAkB,GAAG,CAAC,KAA0C,EAAE,EAAE;QACxE,KAAK,CAAC,eAAe,EAAE,CAAC,CAAC,oDAAoD;QAC7E,cAAc,CAAC,KAAK,CAAC,CAAC;QACtB,iBAAiB,CAAC,IAAI,CAAC,CAAC;QACxB,OAAO,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,CAAC,aAAa,GAAG,KAAK,EAAE,EAAE;QAC3C,iBAAiB,CAAC,aAAa,CAAC,CAAC;QACjC,cAAc,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC9B,iBAAiB,CAAC,KAAK,CAAC,CAAC;QACzB,cAAc,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC,CAAC;IAEF;;;;OAIG;IACH,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,KAAiB,EAAE,EAAE;;QACpB,IAAI,iBAAiB,GAAG,KAAK,CAAC;QAC9B,MAAM,sBAAsB,GAAG,KAAY,CAAC;QAC5C,MAAM,aAAa,GAAG,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,aAAa,CAAC;QAC5D,MAAM,oBAAoB,GAAG,CAAA,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,OAAO,0CAAE,UAAU,MAAK,6BAA6B,CAAC;QAClG,IACE,eAAe,IAAI,8CAA8C;YACjE,oBAAoB,IAAI,gDAAgD;YACxE,CAAC,yBAAyB,CAAC,6CAA6C;UACxE;YACA,iBAAiB,GAAG,IAAI,CAAC;SAC1B;QACD,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CAAC;QACtC,cAAc,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC,EACD;QACE,qCAAqC;QACrC,yBAAyB;QACzB,eAAe;KAChB,CACF,CAAC;IAEF,MAAM,cAAc,GAAG,OAAO,CAAC,GAAG,EAAE;QAClC,OAAO,CACL,UAAU;YACV,WAAW;YACX,CAAC,eAAe;YAChB,CAAC,CAAC,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,CAAA;YACvB,YAAY;YACZ,CAAC,CAAC,QAAQ,IAAI,aAAa,CAAC,CAC7B,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,EAAE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,QAAQ,EAAE,aAAa,EAAE,eAAe,CAAC,CAAC,CAAC;IAEpG,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,UAAU,IAAI,YAAY,EAAE;YAC9B,MAAM,KAAK,GAAG,GAAG,EAAE;gBACjB,cAAc,CAAC,KAAK,CAAC,CAAC;gBACtB,iBAAiB,CAAC,KAAK,CAAC,CAAC;YAC3B,CAAC,CAAC;YAEF,MAAM,kBAAkB,GAAG,CAAC,KAAmB,EAAE,EAAE;;gBACjD,IAAI,KAAK,CAAC,MAAM,IAAI,YAAY,KAAI,MAAC,YAAY,CAAC,OAAe,0CAAE,QAAQ,CAAC,KAAK,CAAC,MAAqB,CAAC,CAAA,EAAE;oBACxG,OAAO,KAAK,CAAC;iBACd;gBACD,OAAO,IAAI,CAAC;YACd,CAAC,CAAC;YAEF,MAAM,sBAAsB,GAAG,CAAC,KAAmB,EAAE,EAAE;gBACrD,IAAI,kBAAkB,CAAC,KAAK,CAAC,EAAE;oBAC7B,KAAK,EAAE,CAAC;iBACT;YACH,CAAC,CAAC;YAEF,MAAM,kBAAkB,GAAG,CAAC,KAAoB,EAAE,EAAE;gBAClD,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;oBAC1B,KAAK,EAAE,CAAC;iBACT;YACH,CAAC,CAAC;YAEF,MAAM,UAAU,GAAG,YAAY,CAAC,OAAO,CAAC;YACxC,IAAI,UAAU,EAAE;gBACd,UAAU,CAAC,gBAAgB,CAAC,aAAa,EAAE,sBAAsB,CAAC,CAAC;gBACnE,UAAU,CAAC,gBAAgB,CAAC,SAAS,EAAE,kBAAkB,CAAC,CAAC;gBAE3D,OAAO,GAAG,EAAE;oBACV,UAAU,CAAC,mBAAmB,CAAC,aAAa,EAAE,sBAAsB,CAAC,CAAC;oBACtE,UAAU,CAAC,mBAAmB,CAAC,SAAS,EAAE,kBAAkB,CAAC,CAAC;gBAChE,CAAC,CAAC;aACH;SACF;IACH,CAAC,EAAE,CAAC,YAAY,EAAE,UAAU,EAAE,YAAY,CAAC,CAAC,CAAC;IAE7C,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,cAAc,EAAE;YAClB,OAAO,eAAe,CAAC,GAAG,EAAE;gBAC1B,cAAc,CAAC,KAAK,CAAC,CAAC;gBACtB,iBAAiB,CAAC,KAAK,CAAC,CAAC;YAC3B,CAAC,CAAC,CAAC;SACJ;IACH,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAErB,OAAO,CACL,2CACE,GAAG,EAAE,YAAY,IACb,CAAC,UAAU,IAAI;QACjB,cAAc,EAAE,GAAG,EAAE,CAAC,kBAAkB,EAAE;QAC1C,cAAc,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC;QACtC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,aAAa,CAAC,CAAQ,CAAC;QACrC,MAAM,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC;KAC/B,CAAC,IACF,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,CAAC,6BAA6B,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE;YAC3G,CAAC,MAAM,CAAC,iCAAiC,CAAC,CAAC,EAAE,cAAc;SAC5D,CAAC;QAEF,iDACiB,YAAY,mBACZ,YAAY,mBACZ,IAAI,gBACP,SAAS,mBACN,QAAQ,EACvB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,OAAO,EACd,MAAM,CAAC,uBAAuB,CAAC,EAC/B;gBACE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ;gBAC3B,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,KAAK;aACtB,EACD,SAAS,CACV,EACD,OAAO,EAAE,kBAAkB,EAC3B,GAAG,EAAE,GAA6B,EAClC,IAAI,EAAC,QAAQ,iBACA,MAAM,sBACF,6BAA6B;YAE9C,8BAAM,SAAS,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,MAAM,CAAC,uBAAuB,CAAC,EAAE,MAAM,CAAC,uBAAuB,CAAC,CAAC,CAAC,IACnG,CAAC,QAAQ,IAAI,OAAO,CAAC,IAAI,oBAAC,IAAI,IAAC,IAAI,EAAE,QAAQ,EAAE,GAAG,EAAE,OAAO,GAAI,CAC3D,CACA;QACR,KAAK,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,GAAG,GAAI;QACvC,cAAc,IAAI,oBAAC,OAAO,IAAC,QAAQ,EAAE,YAAY,EAAE,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC,GAAI,CAC7G,CACP,CAAC;AACJ,CAAC;AAED,eAAe,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { Ref, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { ButtonProps } from '../../../../button/interfaces';\nimport { IconProps } from '../../../../icon/interfaces';\nimport Icon from '../../../../icon/internal';\nimport Tooltip from '../../../../internal/components/tooltip';\nimport { registerTooltip } from '../../../../internal/components/tooltip/registry';\n\nimport styles from './styles.css.js';\n\nexport interface TriggerButtonProps {\n ariaLabel?: string;\n className?: string;\n iconName?: IconProps.Name;\n iconSvg?: React.ReactNode;\n ariaExpanded: boolean | undefined;\n ariaControls?: string;\n disabled?: boolean;\n /**\n * Ovewrwrites any internal testIds when provided\n */\n testId?: string;\n /**\n * If button is selected. Used only for desktop and applies a selected class\n */\n selected?: boolean;\n onClick: React.MouseEventHandler<HTMLButtonElement>;\n badge?: boolean;\n highContrastHeader?: boolean;\n /**\n * If the button is expected to have a tooltip. When false it will not set the event listeners\n *\n * defaults to false\n */\n hasTooltip?: boolean;\n /**\n * This text allows for a customized tooltip.\n *\n * When falsy, the tooltip will parse the tooltip form the aria-lable\n */\n tooltipText?: string;\n hasOpenDrawer?: boolean;\n /**\n * If the AppLayout is in mobile mode\n * Used to determine if and where to render tooltips\n */\n isMobile?: boolean;\n /**\n * set to true if the trigger button was used to open the last active drawer\n * this is also used to hide the tooltip should the focus be set programmatically\n * on focus from a drawer close using this\n */\n isForPreviousActiveDrawer?: boolean;\n /**\n * if the trigger button is for the split panel\n */\n isForSplitPanel?: boolean;\n tabIndex?: number | undefined;\n}\n\nfunction TriggerButton(\n {\n ariaLabel,\n className,\n iconName,\n iconSvg,\n ariaExpanded,\n ariaControls,\n onClick,\n testId,\n disabled = false,\n badge,\n selected = false,\n highContrastHeader,\n hasTooltip = false,\n tooltipText,\n hasOpenDrawer = false,\n isMobile = false,\n isForPreviousActiveDrawer = false,\n isForSplitPanel = false,\n }: TriggerButtonProps,\n ref: React.Ref<ButtonProps.Ref>\n) {\n const containerRef = useRef<HTMLDivElement | null>(null);\n const tooltipValue = tooltipText ? tooltipText : ariaLabel ? ariaLabel : '';\n const [showTooltip, setShowTooltip] = useState<boolean>(false);\n const [suppressTooltip, setSupressTooltip] = useState<boolean>(false);\n\n const handleTriggerClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n event.stopPropagation(); // Stop the event from propagating to the badge icon\n setShowTooltip(false);\n setSupressTooltip(true);\n onClick(event);\n };\n\n const handleBlur = (keepSupressed = false) => {\n setSupressTooltip(keepSupressed);\n setShowTooltip(false);\n };\n\n const handlePointerEnter = () => {\n setSupressTooltip(false);\n setShowTooltip(true);\n };\n\n /**\n * Takes the drawer being closed and the data-shift-focus value from a close button on that drawer that persists\n * on the event relatedTarget to determine not to show the tooltip\n * @param event\n */\n const handleOnFocus = useCallback(\n (event: FocusEvent) => {\n let shouldShowTooltip = false;\n const eventWithRelatedTarget = event as any;\n const relatedTarget = eventWithRelatedTarget?.relatedTarget;\n const isFromAnotherTrigger = relatedTarget?.dataset?.shiftFocus === 'awsui-layout-drawer-trigger';\n if (\n isForSplitPanel || //for key navigation to button from breadcrumb\n isFromAnotherTrigger || //for key navigation from another trigger button\n !isForPreviousActiveDrawer //for when the drawer was not opened recently\n ) {\n shouldShowTooltip = true;\n }\n setSupressTooltip(!shouldShowTooltip);\n setShowTooltip(true);\n },\n [\n // To assert reference equality check\n isForPreviousActiveDrawer,\n isForSplitPanel,\n ]\n );\n\n const tooltipVisible = useMemo(() => {\n return (\n hasTooltip &&\n showTooltip &&\n !suppressTooltip &&\n !!containerRef?.current &&\n tooltipValue &&\n !(isMobile && hasOpenDrawer)\n );\n }, [hasTooltip, showTooltip, containerRef, tooltipValue, isMobile, hasOpenDrawer, suppressTooltip]);\n\n useEffect(() => {\n if (hasTooltip && tooltipValue) {\n const close = () => {\n setShowTooltip(false);\n setSupressTooltip(false);\n };\n\n const shouldCloseTooltip = (event: PointerEvent) => {\n if (event.target && containerRef && (containerRef.current as any)?.contains(event.target as HTMLElement)) {\n return false;\n }\n return true;\n };\n\n const handlePointerDownEvent = (event: PointerEvent) => {\n if (shouldCloseTooltip(event)) {\n close();\n }\n };\n\n const handleKeyDownEvent = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n close();\n }\n };\n\n const wrapperDiv = containerRef.current;\n if (wrapperDiv) {\n wrapperDiv.addEventListener('pointerdown', handlePointerDownEvent);\n wrapperDiv.addEventListener('keydown', handleKeyDownEvent);\n\n return () => {\n wrapperDiv.removeEventListener('pointerdown', handlePointerDownEvent);\n wrapperDiv.removeEventListener('keydown', handleKeyDownEvent);\n };\n }\n }\n }, [containerRef, hasTooltip, tooltipValue]);\n\n useEffect(() => {\n if (tooltipVisible) {\n return registerTooltip(() => {\n setShowTooltip(false);\n setSupressTooltip(false);\n });\n }\n }, [tooltipVisible]);\n\n return (\n <div\n ref={containerRef}\n {...(hasTooltip && {\n onPointerEnter: () => handlePointerEnter(),\n onPointerLeave: () => handleBlur(true),\n onFocus: e => handleOnFocus(e as any),\n onBlur: () => handleBlur(true),\n })}\n className={clsx(styles['trigger-wrapper'], !highContrastHeader ? styles['remove-high-contrast-header'] : '', {\n [styles['trigger-wrapper-tooltip-visible']]: tooltipVisible,\n })}\n >\n <button\n aria-expanded={ariaExpanded}\n aria-controls={ariaControls}\n aria-haspopup={true}\n aria-label={ariaLabel}\n aria-disabled={disabled}\n disabled={disabled}\n className={clsx(\n styles.trigger,\n styles['trigger-button-styles'],\n {\n [styles.selected]: selected,\n [styles.badge]: badge,\n },\n className\n )}\n onClick={handleTriggerClick}\n ref={ref as Ref<HTMLButtonElement>}\n type=\"button\"\n data-testid={testId}\n data-shift-focus=\"awsui-layout-drawer-trigger\"\n >\n <span className={clsx(badge && clsx(styles['trigger-badge-wrapper'], styles['trigger-button-styles']))}>\n {(iconName || iconSvg) && <Icon name={iconName} svg={iconSvg} />}\n </span>\n </button>\n {badge && <div className={styles.dot} />}\n {tooltipVisible && <Tooltip trackRef={containerRef} value={tooltipValue} className={styles['trigger-tooltip']} />}\n </div>\n );\n}\n\nexport default React.forwardRef(TriggerButton);\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/app-layout/visual-refresh-toolbar/toolbar/trigger-button/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, { Ref, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { ButtonProps } from '../../../../button/interfaces';\nimport { IconProps } from '../../../../icon/interfaces';\nimport Icon from '../../../../icon/internal';\nimport Tooltip from '../../../../internal/components/tooltip';\nimport { registerTooltip } from '../../../../internal/components/tooltip/registry';\n\nimport testutilStyles from '../../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\nexport interface TriggerButtonProps {\n ariaLabel?: string;\n className?: string;\n iconName?: IconProps.Name;\n iconSvg?: React.ReactNode;\n ariaExpanded: boolean | undefined;\n ariaControls?: string;\n disabled?: boolean;\n /**\n * Ovewrwrites any internal testIds when provided\n */\n testId?: string;\n /**\n * If button is selected. Used only for desktop and applies a selected class\n */\n selected?: boolean;\n onClick: React.MouseEventHandler<HTMLButtonElement>;\n\n badge?: boolean;\n highContrastHeader?: boolean;\n /**\n * If the button is expected to have a tooltip. When false it will not set the event listeners\n *\n * defaults to false\n */\n hasTooltip?: boolean;\n /**\n * This text allows for a customized tooltip.\n *\n * When falsy, the tooltip will parse the tooltip form the aria-lable\n */\n tooltipText?: string;\n hasOpenDrawer?: boolean;\n /**\n * If the AppLayout is in mobile mode\n * Used to determine if and where to render tooltips\n */\n isMobile?: boolean;\n /**\n * set to true if the trigger button was used to open the last active drawer\n * this is also used to hide the tooltip should the focus be set programmatically\n * on focus from a drawer close using this\n */\n isForPreviousActiveDrawer?: boolean;\n /**\n * if the trigger button is for the split panel\n */\n isForSplitPanel?: boolean;\n tabIndex?: number | undefined;\n}\n\nfunction TriggerButton(\n {\n ariaLabel,\n className,\n iconName,\n iconSvg,\n ariaExpanded,\n ariaControls,\n onClick,\n testId,\n disabled = false,\n badge,\n selected = false,\n highContrastHeader,\n hasTooltip = false,\n tooltipText,\n hasOpenDrawer = false,\n isMobile = false,\n isForPreviousActiveDrawer = false,\n isForSplitPanel = false,\n }: TriggerButtonProps,\n ref: React.Ref<ButtonProps.Ref>\n) {\n const containerRef = useRef<HTMLDivElement | null>(null);\n const tooltipValue = tooltipText ? tooltipText : ariaLabel ? ariaLabel : '';\n const [showTooltip, setShowTooltip] = useState<boolean>(false);\n const [suppressTooltip, setSupressTooltip] = useState<boolean>(false);\n\n const handleTriggerClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n event.stopPropagation(); // Stop the event from propagating to the badge icon\n setShowTooltip(false);\n setSupressTooltip(true);\n onClick(event);\n };\n\n const handleBlur = (keepSupressed = false) => {\n setSupressTooltip(keepSupressed);\n setShowTooltip(false);\n };\n\n const handlePointerEnter = () => {\n setSupressTooltip(false);\n setShowTooltip(true);\n };\n\n /**\n * Takes the drawer being closed and the data-shift-focus value from a close button on that drawer that persists\n * on the event relatedTarget to determine not to show the tooltip\n * @param event\n */\n const handleOnFocus = useCallback(\n (event: FocusEvent) => {\n let shouldShowTooltip = false;\n const eventWithRelatedTarget = event as any;\n const relatedTarget = eventWithRelatedTarget?.relatedTarget;\n const isFromAnotherTrigger = relatedTarget?.dataset?.shiftFocus === 'awsui-layout-drawer-trigger';\n if (\n (isForSplitPanel && !!relatedTarget) || // relatedTarget is null when split panel is closed\n (!isForSplitPanel &&\n (isFromAnotherTrigger || // for key navigation from another trigger button\n !isForPreviousActiveDrawer)) // for when the drawer was not opened recently\n ) {\n shouldShowTooltip = true;\n }\n setSupressTooltip(!shouldShowTooltip);\n setShowTooltip(true);\n },\n [\n // To assert reference equality check\n isForPreviousActiveDrawer,\n isForSplitPanel,\n ]\n );\n\n const tooltipVisible = useMemo(() => {\n return (\n hasTooltip &&\n showTooltip &&\n !suppressTooltip &&\n !!containerRef?.current &&\n tooltipValue &&\n !(isMobile && hasOpenDrawer)\n );\n }, [hasTooltip, showTooltip, containerRef, tooltipValue, isMobile, hasOpenDrawer, suppressTooltip]);\n\n useEffect(() => {\n if (hasTooltip && tooltipValue) {\n const close = () => {\n setShowTooltip(false);\n setSupressTooltip(false);\n };\n\n const shouldCloseTooltip = (event: PointerEvent) => {\n if (event.target && containerRef && (containerRef.current as any)?.contains(event.target as HTMLElement)) {\n return false;\n }\n return true;\n };\n\n const handlePointerDownEvent = (event: PointerEvent) => {\n if (shouldCloseTooltip(event)) {\n close();\n }\n };\n\n const handleKeyDownEvent = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n close();\n }\n };\n\n const wrapperDiv = containerRef.current;\n if (wrapperDiv) {\n wrapperDiv.addEventListener('pointerdown', handlePointerDownEvent);\n wrapperDiv.addEventListener('keydown', handleKeyDownEvent);\n\n return () => {\n wrapperDiv.removeEventListener('pointerdown', handlePointerDownEvent);\n wrapperDiv.removeEventListener('keydown', handleKeyDownEvent);\n };\n }\n }\n }, [containerRef, hasTooltip, tooltipValue]);\n\n useEffect(() => {\n if (tooltipVisible) {\n return registerTooltip(() => {\n setShowTooltip(false);\n setSupressTooltip(false);\n });\n }\n }, [tooltipVisible]);\n\n return (\n <div\n ref={containerRef}\n {...(hasTooltip && {\n onPointerEnter: () => handlePointerEnter(),\n onPointerLeave: () => handleBlur(true),\n onFocus: e => handleOnFocus(e as any),\n onBlur: () => handleBlur(true),\n })}\n className={clsx(styles['trigger-wrapper'], !highContrastHeader ? styles['remove-high-contrast-header'] : '')}\n >\n <button\n aria-expanded={ariaExpanded}\n aria-controls={ariaControls}\n aria-haspopup={true}\n aria-label={ariaLabel}\n aria-disabled={disabled}\n disabled={disabled}\n className={clsx(\n styles.trigger,\n styles['trigger-button-styles'],\n {\n [styles.selected]: selected,\n [styles.badge]: badge,\n },\n className\n )}\n onClick={handleTriggerClick}\n ref={ref as Ref<HTMLButtonElement>}\n type=\"button\"\n data-testid={testId}\n data-shift-focus=\"awsui-layout-drawer-trigger\"\n >\n <span className={clsx(badge && clsx(styles['trigger-badge-wrapper'], styles['trigger-button-styles']))}>\n {(iconName || iconSvg) && <Icon name={iconName} svg={iconSvg} />}\n </span>\n </button>\n {badge && <div className={styles.dot} />}\n {tooltipVisible && (\n <Tooltip trackRef={containerRef} value={tooltipValue} className={testutilStyles['trigger-tooltip']} />\n )}\n </div>\n );\n}\n\nexport default React.forwardRef(TriggerButton);\n"]}
|
|
@@ -1,14 +1,12 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"trigger-button-styles": "awsui_trigger-button-
|
|
5
|
-
"trigger-badge-wrapper": "awsui_trigger-badge-
|
|
6
|
-
"trigger": "
|
|
7
|
-
"selected": "
|
|
8
|
-
"badge": "
|
|
9
|
-
"trigger-wrapper": "awsui_trigger-
|
|
10
|
-
"
|
|
11
|
-
"dot": "awsui_dot_lpshu_1jpng_244",
|
|
12
|
-
"trigger-tooltip": "awsui_trigger-tooltip_lpshu_1jpng_257"
|
|
4
|
+
"trigger-button-styles": "awsui_trigger-button-styles_lpshu_le6ci_141",
|
|
5
|
+
"trigger-badge-wrapper": "awsui_trigger-badge-wrapper_lpshu_le6ci_164",
|
|
6
|
+
"trigger": "awsui_trigger_lpshu_le6ci_141",
|
|
7
|
+
"selected": "awsui_selected_lpshu_le6ci_208",
|
|
8
|
+
"badge": "awsui_badge_lpshu_le6ci_228",
|
|
9
|
+
"trigger-wrapper": "awsui_trigger-wrapper_lpshu_le6ci_232",
|
|
10
|
+
"dot": "awsui_dot_lpshu_le6ci_240"
|
|
13
11
|
};
|
|
14
12
|
|
|
@@ -138,7 +138,7 @@
|
|
|
138
138
|
*/
|
|
139
139
|
/* Style used for links in slots/components that are text heavy, to help links stand out among
|
|
140
140
|
surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
|
|
141
|
-
.awsui_trigger-button-
|
|
141
|
+
.awsui_trigger-button-styles_lpshu_le6ci_141:not(#\9) {
|
|
142
142
|
background: transparent;
|
|
143
143
|
color: var(--color-text-interactive-default-tkx8fe, #424650);
|
|
144
144
|
border-start-start-radius: 50%;
|
|
@@ -152,16 +152,16 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
152
152
|
justify-content: center;
|
|
153
153
|
box-sizing: border-box;
|
|
154
154
|
}
|
|
155
|
-
.awsui_trigger-button-
|
|
155
|
+
.awsui_trigger-button-styles_lpshu_le6ci_141:not(#\9):hover {
|
|
156
156
|
background: var(--color-background-input-disabled-gvxsk4, #ebebf0);
|
|
157
157
|
color: var(--color-text-interactive-hover-f9gqs8, #0f141a);
|
|
158
158
|
}
|
|
159
|
-
.awsui_trigger-button-
|
|
159
|
+
.awsui_trigger-button-styles_lpshu_le6ci_141:not(#\9):active {
|
|
160
160
|
background: var(--color-background-control-disabled-5cbvij, #dedee3);
|
|
161
161
|
color: var(--color-text-interactive-hover-f9gqs8, #0f141a);
|
|
162
162
|
}
|
|
163
163
|
|
|
164
|
-
.awsui_trigger-badge-
|
|
164
|
+
.awsui_trigger-badge-wrapper_lpshu_le6ci_164:not(#\9) {
|
|
165
165
|
position: absolute;
|
|
166
166
|
inset-block-start: 0;
|
|
167
167
|
inset-inline-start: 0;
|
|
@@ -171,24 +171,24 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
171
171
|
clip-path: path("M29.2862 10.4145C28.7243 10.5998 28.1238 10.7 27.4999 10.7C24.3519 10.7 21.7999 8.14803 21.7999 5C21.7999 3.92883 22.0954 2.92667 22.6093 2.07057C20.3785 0.754846 17.7774 0 15 0C6.71573 0 0 6.71573 0 15C0 23.2843 6.71573 30 15 30C23.2843 30 30 23.2843 30 15C30 13.4007 29.7497 11.8599 29.2862 10.4145Z");
|
|
172
172
|
/* stylelint-disable-next-line plugin/no-unsupported-browser-features */
|
|
173
173
|
}
|
|
174
|
-
.awsui_trigger-badge-
|
|
174
|
+
.awsui_trigger-badge-wrapper_lpshu_le6ci_164:not(#\9):dir(rtl) {
|
|
175
175
|
clip-path: path("M2.21384 10.4145C2.77569 10.5998 3.37617 10.7 4.00007 10.7C7.1481 10.7 9.70007 8.14803 9.70007 5C9.70007 3.92883 9.4046 2.92667 8.89071 2.07057C11.1215 0.754846 13.7226 0 16.5 0C24.7843 0 31.5 6.71573 31.5 15C31.5 23.2843 24.7843 30 16.5 30C8.21573 30 1.5 23.2843 1.5 15C1.5 13.4007 1.75029 11.8599 2.21384 10.4145Z");
|
|
176
176
|
}
|
|
177
177
|
|
|
178
|
-
.
|
|
178
|
+
.awsui_trigger_lpshu_le6ci_141:not(#\9) {
|
|
179
179
|
border-block: none;
|
|
180
180
|
border-inline: none;
|
|
181
181
|
cursor: pointer;
|
|
182
182
|
pointer-events: auto;
|
|
183
183
|
}
|
|
184
|
-
body[data-awsui-focus-visible=true] .
|
|
184
|
+
body[data-awsui-focus-visible=true] .awsui_trigger_lpshu_le6ci_141:not(#\9):focus {
|
|
185
185
|
position: relative;
|
|
186
186
|
}
|
|
187
|
-
body[data-awsui-focus-visible=true] .
|
|
187
|
+
body[data-awsui-focus-visible=true] .awsui_trigger_lpshu_le6ci_141:not(#\9):focus {
|
|
188
188
|
outline: 2px dotted transparent;
|
|
189
189
|
outline-offset: calc(3px - 1px);
|
|
190
190
|
}
|
|
191
|
-
body[data-awsui-focus-visible=true] .
|
|
191
|
+
body[data-awsui-focus-visible=true] .awsui_trigger_lpshu_le6ci_141:not(#\9):focus::before {
|
|
192
192
|
content: " ";
|
|
193
193
|
display: block;
|
|
194
194
|
position: absolute;
|
|
@@ -202,34 +202,34 @@ body[data-awsui-focus-visible=true] .awsui_trigger_lpshu_1jpng_141:not(#\9):focu
|
|
|
202
202
|
border-end-end-radius: var(--border-radius-control-default-focus-ring-u8zbsz, 4px);
|
|
203
203
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-nv6mhz, #006ce0);
|
|
204
204
|
}
|
|
205
|
-
.
|
|
205
|
+
.awsui_trigger_lpshu_le6ci_141:not(#\9):focus {
|
|
206
206
|
outline: none;
|
|
207
207
|
}
|
|
208
|
-
.
|
|
208
|
+
.awsui_trigger_lpshu_le6ci_141.awsui_selected_lpshu_le6ci_208:not(#\9) {
|
|
209
209
|
background: var(--color-background-layout-toggle-selected-default-27rnk6, #006ce0);
|
|
210
210
|
color: var(--color-text-layout-toggle-selected-kb3p9r, #ffffff);
|
|
211
211
|
}
|
|
212
|
-
.
|
|
212
|
+
.awsui_trigger_lpshu_le6ci_141.awsui_selected_lpshu_le6ci_208:not(#\9):hover {
|
|
213
213
|
background: var(--color-background-layout-toggle-selected-hover-eh8bga, #004a9e);
|
|
214
214
|
}
|
|
215
|
-
.
|
|
215
|
+
.awsui_trigger_lpshu_le6ci_141.awsui_selected_lpshu_le6ci_208:not(#\9):active {
|
|
216
216
|
background: var(--color-background-layout-toggle-selected-active-tv8i8b, #006ce0);
|
|
217
217
|
}
|
|
218
|
-
.
|
|
218
|
+
.awsui_trigger_lpshu_le6ci_141.awsui_selected_lpshu_le6ci_208 > .awsui_trigger-badge-wrapper_lpshu_le6ci_164:not(#\9) {
|
|
219
219
|
background: var(--color-background-layout-toggle-selected-default-27rnk6, #006ce0);
|
|
220
220
|
color: var(--color-text-layout-toggle-selected-kb3p9r, #ffffff);
|
|
221
221
|
}
|
|
222
|
-
.
|
|
222
|
+
.awsui_trigger_lpshu_le6ci_141.awsui_selected_lpshu_le6ci_208 > .awsui_trigger-badge-wrapper_lpshu_le6ci_164:not(#\9):hover {
|
|
223
223
|
background: var(--color-background-layout-toggle-selected-hover-eh8bga, #004a9e);
|
|
224
224
|
}
|
|
225
|
-
.
|
|
225
|
+
.awsui_trigger_lpshu_le6ci_141.awsui_selected_lpshu_le6ci_208 > .awsui_trigger-badge-wrapper_lpshu_le6ci_164:not(#\9):active {
|
|
226
226
|
background: var(--color-background-layout-toggle-selected-active-tv8i8b, #006ce0);
|
|
227
227
|
}
|
|
228
|
-
.
|
|
228
|
+
.awsui_trigger_lpshu_le6ci_141.awsui_badge_lpshu_le6ci_228:not(#\9), .awsui_trigger_lpshu_le6ci_141.awsui_badge_lpshu_le6ci_228:not(#\9):hover, .awsui_trigger_lpshu_le6ci_141.awsui_badge_lpshu_le6ci_228:not(#\9):active {
|
|
229
229
|
background: transparent;
|
|
230
230
|
}
|
|
231
231
|
|
|
232
|
-
.awsui_trigger-
|
|
232
|
+
.awsui_trigger-wrapper_lpshu_le6ci_232:not(#\9) {
|
|
233
233
|
position: relative;
|
|
234
234
|
border-start-start-radius: 50%;
|
|
235
235
|
border-start-end-radius: 50%;
|
|
@@ -237,11 +237,7 @@ body[data-awsui-focus-visible=true] .awsui_trigger_lpshu_1jpng_141:not(#\9):focu
|
|
|
237
237
|
border-end-end-radius: 50%;
|
|
238
238
|
}
|
|
239
239
|
|
|
240
|
-
.
|
|
241
|
-
/* used in test-utils*/
|
|
242
|
-
}
|
|
243
|
-
|
|
244
|
-
.awsui_dot_lpshu_1jpng_244:not(#\9) {
|
|
240
|
+
.awsui_dot_lpshu_le6ci_240:not(#\9) {
|
|
245
241
|
position: absolute;
|
|
246
242
|
inline-size: 8px;
|
|
247
243
|
block-size: 8px;
|
|
@@ -252,8 +248,4 @@ body[data-awsui-focus-visible=true] .awsui_trigger_lpshu_1jpng_141:not(#\9):focu
|
|
|
252
248
|
background-color: var(--color-background-badge-icon-n0lc3o, #db0000);
|
|
253
249
|
inset-block-start: 1px;
|
|
254
250
|
inset-inline-end: -1px;
|
|
255
|
-
}
|
|
256
|
-
|
|
257
|
-
.awsui_trigger-tooltip_lpshu_1jpng_257:not(#\9) {
|
|
258
|
-
/* used in test-utils */
|
|
259
251
|
}
|
|
@@ -2,14 +2,12 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"trigger-button-styles": "awsui_trigger-button-
|
|
6
|
-
"trigger-badge-wrapper": "awsui_trigger-badge-
|
|
7
|
-
"trigger": "
|
|
8
|
-
"selected": "
|
|
9
|
-
"badge": "
|
|
10
|
-
"trigger-wrapper": "awsui_trigger-
|
|
11
|
-
"
|
|
12
|
-
"dot": "awsui_dot_lpshu_1jpng_244",
|
|
13
|
-
"trigger-tooltip": "awsui_trigger-tooltip_lpshu_1jpng_257"
|
|
5
|
+
"trigger-button-styles": "awsui_trigger-button-styles_lpshu_le6ci_141",
|
|
6
|
+
"trigger-badge-wrapper": "awsui_trigger-badge-wrapper_lpshu_le6ci_164",
|
|
7
|
+
"trigger": "awsui_trigger_lpshu_le6ci_141",
|
|
8
|
+
"selected": "awsui_selected_lpshu_le6ci_208",
|
|
9
|
+
"badge": "awsui_badge_lpshu_le6ci_228",
|
|
10
|
+
"trigger-wrapper": "awsui_trigger-wrapper_lpshu_le6ci_232",
|
|
11
|
+
"dot": "awsui_dot_lpshu_le6ci_240"
|
|
14
12
|
};
|
|
15
13
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/area-chart/internal.tsx"],"names":[],"mappings":";AAWA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAKjD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAQ9C,KAAK,sBAAsB,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,IAAI,YAAY,CAC5E,cAAc,CAAC,CAAC,CAAC,EACjB,QAAQ,GAAG,YAAY,GAAG,YAAY,GAAG,YAAY,GAAG,mBAAmB,GAAG,aAAa,CAC5F,GACC,0BAA0B,CAAC;AAE7B,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,EAAE,EAC5E,SAAS,EACT,MAAM,EACN,UAAU,EACV,UAAU,EACV,OAAO,EACP,OAAO,EACP,cAAc,EACd,cAAc,EACd,oBAAoB,EACpB,iBAAiB,EAAE,2BAA2B,EAC9C,aAAa,EAAE,uBAAuB,EACtC,MAAM,EAAE,cAAc,EACtB,cAAc,EAAE,yBAAyB,EACzC,iBAAiB,EAAE,2BAA2B,EAC9C,WAAW,EACX,SAAS,EACT,cAAc,EACd,eAAe,EACf,MAAM,EACN,MAAM,EACN,UAAU,EACV,iBAAiB,EACjB,UAAU,EACV,WAAW,EACX,UAAU,EACV,iBAAiB,EACjB,mBAAmB,EACnB,KAAK,EACL,OAAO,EACP,SAAS,EACT,WAAW,EACX,YAAY,EACZ,eAAe,EACf,iBAAwB,EACxB,GAAG,KAAK,EACT,EAAE,sBAAsB,CAAC,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/area-chart/internal.tsx"],"names":[],"mappings":";AAWA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAKjD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAQ9C,KAAK,sBAAsB,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,IAAI,YAAY,CAC5E,cAAc,CAAC,CAAC,CAAC,EACjB,QAAQ,GAAG,YAAY,GAAG,YAAY,GAAG,YAAY,GAAG,mBAAmB,GAAG,aAAa,CAC5F,GACC,0BAA0B,CAAC;AAE7B,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,EAAE,EAC5E,SAAS,EACT,MAAM,EACN,UAAU,EACV,UAAU,EACV,OAAO,EACP,OAAO,EACP,cAAc,EACd,cAAc,EACd,oBAAoB,EACpB,iBAAiB,EAAE,2BAA2B,EAC9C,aAAa,EAAE,uBAAuB,EACtC,MAAM,EAAE,cAAc,EACtB,cAAc,EAAE,yBAAyB,EACzC,iBAAiB,EAAE,2BAA2B,EAC9C,WAAW,EACX,SAAS,EACT,cAAc,EACd,eAAe,EACf,MAAM,EACN,MAAM,EACN,UAAU,EACV,iBAAiB,EACjB,UAAU,EACV,WAAW,EACX,UAAU,EACV,iBAAiB,EACjB,mBAAmB,EACnB,KAAK,EACL,OAAO,EACP,SAAS,EACT,WAAW,EACX,YAAY,EACZ,eAAe,EACf,iBAAwB,EACxB,GAAG,KAAK,EACT,EAAE,sBAAsB,CAAC,CAAC,CAAC,eA6I3B"}
|
package/area-chart/internal.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/area-chart/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, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { getIsRtl } from '@cloudscape-design/component-toolkit/internal';\n\nimport { getBaseProps } from '../internal/base-component';\nimport ChartStatusContainer, { getChartStatus } from '../internal/components/chart-status-container';\nimport { ChartWrapper } from '../internal/components/chart-wrapper';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { isDevelopment } from '../internal/is-development';\nimport { SomeRequired } from '../internal/types';\nimport { nodeBelongs } from '../internal/utils/node-belongs';\nimport ChartContainer from './chart-container';\nimport AreaChartFilter from './elements/area-chart-filter';\nimport AreaChartLegend from './elements/area-chart-legend';\nimport { AreaChartProps } from './interfaces';\nimport useChartModel from './model/use-chart-model';\nimport useFilterProps from './model/use-filter-props';\nimport useHighlightProps from './model/use-highlight-props';\nimport { isSeriesValid } from './model/utils';\n\nimport styles from './styles.css.js';\n\ntype InternalAreaChartProps<T extends AreaChartProps.DataTypes> = SomeRequired<\n AreaChartProps<T>,\n 'height' | 'xScaleType' | 'yScaleType' | 'statusType' | 'detailPopoverSize' | 'i18nStrings'\n> &\n InternalBaseComponentProps;\n\nexport default function InternalAreaChart<T extends AreaChartProps.DataTypes>({\n fitHeight,\n height,\n xScaleType,\n yScaleType,\n xDomain,\n yDomain,\n xTickFormatter,\n yTickFormatter,\n detailTotalFormatter,\n highlightedSeries: controlledHighlightedSeries,\n visibleSeries: controlledVisibleSeries,\n series: externalSeries,\n onFilterChange: controlledOnVisibleChange,\n onHighlightChange: controlledOnHighlightChange,\n i18nStrings,\n ariaLabel,\n ariaLabelledby,\n ariaDescription,\n xTitle,\n yTitle,\n hideFilter,\n additionalFilters,\n hideLegend,\n legendTitle,\n statusType,\n detailPopoverSize,\n detailPopoverFooter,\n empty,\n noMatch,\n errorText,\n loadingText,\n recoveryText,\n onRecoveryClick,\n __internalRootRef = null,\n ...props\n}: InternalAreaChartProps<T>) {\n const baseProps = getBaseProps(props);\n const containerRef = useRef<HTMLDivElement>(null);\n const popoverRef = useRef<HTMLDivElement>(null);\n\n if (isDevelopment) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useEffect(() => {\n if (!isSeriesValid(externalSeries)) {\n warnOnce(\n 'AreaChart',\n \"The `series` property violates the component's constraints: all `area` \" +\n 'series must have `data` arrays of the same length and with the same x-values.'\n );\n }\n }, [externalSeries]);\n }\n\n const [width, setWidth] = useState(0);\n const [visibleSeries, setVisibleSeries] = useFilterProps(\n externalSeries,\n controlledVisibleSeries,\n controlledOnVisibleChange\n );\n const [highlightedSeries, setHighlightedSeries] = useHighlightProps(\n externalSeries,\n controlledHighlightedSeries,\n controlledOnHighlightChange\n );\n const isRtl = containerRef.current ? getIsRtl(containerRef.current) : false;\n const model = useChartModel({\n isRtl,\n fitHeight,\n externalSeries,\n visibleSeries,\n setVisibleSeries,\n highlightedSeries,\n setHighlightedSeries,\n xDomain,\n yDomain,\n xScaleType,\n yScaleType,\n height,\n width,\n popoverRef,\n });\n\n const { isEmpty, isNoMatch, showChart } = getChartStatus({\n externalData: externalSeries,\n visibleData: visibleSeries,\n statusType,\n });\n const showFilters = statusType === 'finished' && (!isEmpty || isNoMatch) && (additionalFilters || !hideFilter);\n const showLegend = !hideLegend && !isEmpty && statusType === 'finished';\n const reserveLegendSpace = !showChart && !hideLegend;\n const reserveFilterSpace = !showChart && !isNoMatch && (!hideFilter || additionalFilters);\n\n useEffect(() => {\n const onKeyDown = model.handlers.onDocumentKeyDown;\n document.addEventListener('keydown', onKeyDown);\n return () => document.removeEventListener('keydown', onKeyDown);\n }, [model.handlers.onDocumentKeyDown]);\n\n const onBlur = (event: React.FocusEvent) => {\n if (event.relatedTarget && !nodeBelongs(containerRef.current, event.relatedTarget)) {\n model.handlers.onContainerBlur();\n }\n };\n\n const mergedRef = useMergeRefs(containerRef, __internalRootRef);\n\n return (\n <ChartWrapper\n ref={mergedRef}\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n fitHeight={!!fitHeight}\n contentMinHeight={height}\n defaultFilter={\n showFilters && !hideFilter ? (\n <AreaChartFilter\n model={model}\n filterLabel={i18nStrings.filterLabel}\n filterPlaceholder={i18nStrings.filterPlaceholder}\n filterSelectedAriaLabel={i18nStrings.filterSelectedAriaLabel}\n />\n ) : null\n }\n additionalFilters={showFilters ? additionalFilters : null}\n reserveFilterSpace={!!reserveFilterSpace}\n reserveLegendSpace={!!reserveLegendSpace}\n chartStatus={\n <ChartStatusContainer\n isEmpty={isEmpty}\n isNoMatch={isNoMatch}\n showChart={showChart}\n statusType={statusType}\n empty={empty}\n noMatch={noMatch}\n loadingText={loadingText}\n errorText={errorText}\n recoveryText={recoveryText}\n onRecoveryClick={onRecoveryClick}\n />\n }\n chart={\n showChart ? (\n <ChartContainer\n model={model}\n autoWidth={setWidth}\n detailPopoverSize={detailPopoverSize}\n detailPopoverFooter={detailPopoverFooter}\n xTitle={xTitle}\n yTitle={yTitle}\n xTickFormatter={xTickFormatter}\n yTickFormatter={yTickFormatter}\n detailTotalFormatter={detailTotalFormatter}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n ariaDescription={ariaDescription}\n i18nStrings={i18nStrings}\n fitHeight={fitHeight}\n minHeight={height}\n isRTL={isRtl}\n />\n ) : null\n }\n legend={\n showLegend ? (\n <AreaChartLegend\n plotContainerRef={containerRef}\n model={model}\n legendTitle={legendTitle}\n ariaLabel={i18nStrings.legendAriaLabel}\n />\n ) : null\n }\n onBlur={onBlur}\n />\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/area-chart/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, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { getIsRtl } from '@cloudscape-design/component-toolkit/internal';\n\nimport { getBaseProps } from '../internal/base-component';\nimport ChartStatusContainer, { getChartStatus } from '../internal/components/chart-status-container';\nimport { ChartWrapper } from '../internal/components/chart-wrapper';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { isDevelopment } from '../internal/is-development';\nimport { SomeRequired } from '../internal/types';\nimport { nodeBelongs } from '../internal/utils/node-belongs';\nimport ChartContainer from './chart-container';\nimport AreaChartFilter from './elements/area-chart-filter';\nimport AreaChartLegend from './elements/area-chart-legend';\nimport { AreaChartProps } from './interfaces';\nimport useChartModel from './model/use-chart-model';\nimport useFilterProps from './model/use-filter-props';\nimport useHighlightProps from './model/use-highlight-props';\nimport { isSeriesValid } from './model/utils';\n\nimport styles from './styles.css.js';\n\ntype InternalAreaChartProps<T extends AreaChartProps.DataTypes> = SomeRequired<\n AreaChartProps<T>,\n 'height' | 'xScaleType' | 'yScaleType' | 'statusType' | 'detailPopoverSize' | 'i18nStrings'\n> &\n InternalBaseComponentProps;\n\nexport default function InternalAreaChart<T extends AreaChartProps.DataTypes>({\n fitHeight,\n height,\n xScaleType,\n yScaleType,\n xDomain,\n yDomain,\n xTickFormatter,\n yTickFormatter,\n detailTotalFormatter,\n highlightedSeries: controlledHighlightedSeries,\n visibleSeries: controlledVisibleSeries,\n series: externalSeries,\n onFilterChange: controlledOnVisibleChange,\n onHighlightChange: controlledOnHighlightChange,\n i18nStrings,\n ariaLabel,\n ariaLabelledby,\n ariaDescription,\n xTitle,\n yTitle,\n hideFilter,\n additionalFilters,\n hideLegend,\n legendTitle,\n statusType,\n detailPopoverSize,\n detailPopoverFooter,\n empty,\n noMatch,\n errorText,\n loadingText,\n recoveryText,\n onRecoveryClick,\n __internalRootRef = null,\n ...props\n}: InternalAreaChartProps<T>) {\n const baseProps = getBaseProps(props);\n const containerRef = useRef<HTMLDivElement>(null);\n const popoverRef = useRef<HTMLDivElement>(null);\n\n if (isDevelopment) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useEffect(() => {\n if (!isSeriesValid(externalSeries)) {\n warnOnce(\n 'AreaChart',\n \"The `series` property violates the component's constraints: all `area` \" +\n 'series must have `data` arrays of the same length and with the same x-values.'\n );\n }\n }, [externalSeries]);\n }\n\n const [width, setWidth] = useState(0);\n const [visibleSeries, setVisibleSeries] = useFilterProps(\n externalSeries,\n controlledVisibleSeries,\n controlledOnVisibleChange\n );\n const [highlightedSeries, setHighlightedSeries] = useHighlightProps(\n externalSeries,\n controlledHighlightedSeries,\n controlledOnHighlightChange\n );\n const isRtl = containerRef.current ? getIsRtl(containerRef.current) : false;\n const model = useChartModel({\n isRtl,\n fitHeight,\n externalSeries,\n visibleSeries,\n setVisibleSeries,\n highlightedSeries,\n setHighlightedSeries,\n xDomain,\n yDomain,\n xScaleType,\n yScaleType,\n height,\n width,\n popoverRef,\n statusType,\n });\n\n const { isEmpty, isNoMatch, showChart } = getChartStatus({\n externalData: externalSeries,\n visibleData: visibleSeries,\n statusType,\n });\n const showFilters = statusType === 'finished' && (!isEmpty || isNoMatch) && (additionalFilters || !hideFilter);\n const showLegend = !hideLegend && !isEmpty && statusType === 'finished';\n const reserveLegendSpace = !showChart && !hideLegend;\n const reserveFilterSpace = !showChart && !isNoMatch && (!hideFilter || additionalFilters);\n\n useEffect(() => {\n const onKeyDown = model.handlers.onDocumentKeyDown;\n document.addEventListener('keydown', onKeyDown);\n return () => document.removeEventListener('keydown', onKeyDown);\n }, [model.handlers.onDocumentKeyDown]);\n\n const onBlur = (event: React.FocusEvent) => {\n if (event.relatedTarget && !nodeBelongs(containerRef.current, event.relatedTarget)) {\n model.handlers.onContainerBlur();\n }\n };\n\n const mergedRef = useMergeRefs(containerRef, __internalRootRef);\n\n return (\n <ChartWrapper\n ref={mergedRef}\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n fitHeight={!!fitHeight}\n contentMinHeight={height}\n defaultFilter={\n showFilters && !hideFilter ? (\n <AreaChartFilter\n model={model}\n filterLabel={i18nStrings.filterLabel}\n filterPlaceholder={i18nStrings.filterPlaceholder}\n filterSelectedAriaLabel={i18nStrings.filterSelectedAriaLabel}\n />\n ) : null\n }\n additionalFilters={showFilters ? additionalFilters : null}\n reserveFilterSpace={!!reserveFilterSpace}\n reserveLegendSpace={!!reserveLegendSpace}\n chartStatus={\n <ChartStatusContainer\n isEmpty={isEmpty}\n isNoMatch={isNoMatch}\n showChart={showChart}\n statusType={statusType}\n empty={empty}\n noMatch={noMatch}\n loadingText={loadingText}\n errorText={errorText}\n recoveryText={recoveryText}\n onRecoveryClick={onRecoveryClick}\n />\n }\n chart={\n showChart ? (\n <ChartContainer\n model={model}\n autoWidth={setWidth}\n detailPopoverSize={detailPopoverSize}\n detailPopoverFooter={detailPopoverFooter}\n xTitle={xTitle}\n yTitle={yTitle}\n xTickFormatter={xTickFormatter}\n yTickFormatter={yTickFormatter}\n detailTotalFormatter={detailTotalFormatter}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n ariaDescription={ariaDescription}\n i18nStrings={i18nStrings}\n fitHeight={fitHeight}\n minHeight={height}\n isRTL={isRtl}\n />\n ) : null\n }\n legend={\n showLegend ? (\n <AreaChartLegend\n plotContainerRef={containerRef}\n model={model}\n legendTitle={legendTitle}\n ariaLabel={i18nStrings.legendAriaLabel}\n />\n ) : null\n }\n onBlur={onBlur}\n />\n );\n}\n"]}
|
|
@@ -17,6 +17,7 @@ export interface UseChartModelProps<T extends AreaChartProps.DataTypes> {
|
|
|
17
17
|
height: number;
|
|
18
18
|
width: number;
|
|
19
19
|
popoverRef: RefObject<HTMLElement>;
|
|
20
|
+
statusType: 'loading' | 'finished' | 'error';
|
|
20
21
|
}
|
|
21
|
-
export default function useChartModel<T extends AreaChartProps.DataTypes>({ isRtl, fitHeight, externalSeries: allSeries, visibleSeries: series, setVisibleSeries, highlightedSeries, setHighlightedSeries, xDomain, yDomain, xScaleType, yScaleType, height: explicitHeight, width, popoverRef, }: UseChartModelProps<T>): ChartModel<T>;
|
|
22
|
+
export default function useChartModel<T extends AreaChartProps.DataTypes>({ isRtl, fitHeight, externalSeries: allSeries, visibleSeries: series, setVisibleSeries, highlightedSeries, setHighlightedSeries, xDomain, yDomain, xScaleType, yScaleType, height: explicitHeight, width, popoverRef, statusType, }: UseChartModelProps<T>): ChartModel<T>;
|
|
22
23
|
//# sourceMappingURL=use-chart-model.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-chart-model.d.ts","sourceRoot":"","sources":["../../../../src/area-chart/model/use-chart-model.ts"],"names":[],"mappings":"AAEA,OAAc,EAAc,SAAS,EAA8B,MAAM,OAAO,CAAC;AAKjF,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,sDAAsD,CAAC;AAShH,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAG/C,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAQrC,MAAM,WAAW,kBAAkB,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS;IACpE,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACpD,aAAa,EAAE,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACnD,gBAAgB,EAAE,CAAC,MAAM,EAAE,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,IAAI,CAAC;IACxE,iBAAiB,EAAE,IAAI,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACnD,oBAAoB,EAAE,CAAC,MAAM,EAAE,IAAI,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACxE,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,UAAU,CAAC;IACvB,UAAU,EAAE,UAAU,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"use-chart-model.d.ts","sourceRoot":"","sources":["../../../../src/area-chart/model/use-chart-model.ts"],"names":[],"mappings":"AAEA,OAAc,EAAc,SAAS,EAA8B,MAAM,OAAO,CAAC;AAKjF,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,sDAAsD,CAAC;AAShH,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAG/C,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAQrC,MAAM,WAAW,kBAAkB,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS;IACpE,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACpD,aAAa,EAAE,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACnD,gBAAgB,EAAE,CAAC,MAAM,EAAE,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,IAAI,CAAC;IACxE,iBAAiB,EAAE,IAAI,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACnD,oBAAoB,EAAE,CAAC,MAAM,EAAE,IAAI,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACxE,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,UAAU,CAAC;IACvB,UAAU,EAAE,UAAU,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IACnC,UAAU,EAAE,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC;CAC9C;AAGD,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,EAAE,EACxE,KAAK,EACL,SAAS,EACT,cAAc,EAAE,SAAS,EACzB,aAAa,EAAE,MAAM,EACrB,gBAAgB,EAChB,iBAAiB,EACjB,oBAAoB,EACpB,OAAO,EACP,OAAO,EACP,UAAU,EACV,UAAU,EACV,MAAM,EAAE,cAAc,EACtB,KAAK,EACL,UAAU,EACV,UAAU,GACX,EAAE,kBAAkB,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAmUvC"}
|
|
@@ -18,7 +18,7 @@ const MAX_HOVER_MARGIN = 6;
|
|
|
18
18
|
const SVG_HOVER_THROTTLE = 25;
|
|
19
19
|
const POPOVER_DEADZONE = 12;
|
|
20
20
|
// Represents the core the chart logic, including the model of all allowed user interactions.
|
|
21
|
-
export default function useChartModel({ isRtl, fitHeight, externalSeries: allSeries, visibleSeries: series, setVisibleSeries, highlightedSeries, setHighlightedSeries, xDomain, yDomain, xScaleType, yScaleType, height: explicitHeight, width, popoverRef, }) {
|
|
21
|
+
export default function useChartModel({ isRtl, fitHeight, externalSeries: allSeries, visibleSeries: series, setVisibleSeries, highlightedSeries, setHighlightedSeries, xDomain, yDomain, xScaleType, yScaleType, height: explicitHeight, width, popoverRef, statusType, }) {
|
|
22
22
|
var _a;
|
|
23
23
|
// Chart elements refs used in handlers.
|
|
24
24
|
const plotRef = useRef(null);
|
|
@@ -26,7 +26,7 @@ export default function useChartModel({ isRtl, fitHeight, externalSeries: allSer
|
|
|
26
26
|
const verticalMarkerRef = useRef(null);
|
|
27
27
|
const plotMeasureRef = useRef(null);
|
|
28
28
|
const hasVisibleSeries = series.length > 0;
|
|
29
|
-
const height = (_a = useHeightMeasure(() => plotMeasureRef.current, !fitHeight, [hasVisibleSeries])) !== null && _a !== void 0 ? _a : explicitHeight;
|
|
29
|
+
const height = (_a = useHeightMeasure(() => plotMeasureRef.current, !fitHeight, [hasVisibleSeries, statusType])) !== null && _a !== void 0 ? _a : explicitHeight;
|
|
30
30
|
const stableSetVisibleSeries = useStableCallback(setVisibleSeries);
|
|
31
31
|
const model = useMemo(() => {
|
|
32
32
|
// Compute scales, ticks and two-dimensional plots.
|