diff --git a/packages/cloud-cognitive/src/components/CreateFullPage/CreateFullPage.js b/packages/cloud-cognitive/src/components/CreateFullPage/CreateFullPage.js index 0f912ef9dc..cb144a5e53 100644 --- a/packages/cloud-cognitive/src/components/CreateFullPage/CreateFullPage.js +++ b/packages/cloud-cognitive/src/components/CreateFullPage/CreateFullPage.js @@ -26,9 +26,11 @@ import { } from 'carbon-components-react'; import { CreateInfluencer } from '../CreateInfluencer'; import { ActionSet } from '../ActionSet'; -import { usePreviousValue } from '../../global/js/use/usePreviousValue'; -import { useValidCreateStepCount } from '../../global/js/use/useValidCreateStepCount'; -import { useCreateComponentFocus } from '../../global/js/use/useCreateComponentFocus'; +import { + usePreviousValue, + useValidCreateStepCount, + useCreateComponentFocus, +} from '../../global/js/hooks'; import { hasValidChildType } from '../../global/js/utils/hasValidChildType'; const blockClass = `${pkg.prefix}--create-full-page`; diff --git a/packages/cloud-cognitive/src/components/CreateTearsheet/CreateTearsheet.js b/packages/cloud-cognitive/src/components/CreateTearsheet/CreateTearsheet.js index cc91349d3d..d87fb4697e 100644 --- a/packages/cloud-cognitive/src/components/CreateTearsheet/CreateTearsheet.js +++ b/packages/cloud-cognitive/src/components/CreateTearsheet/CreateTearsheet.js @@ -23,11 +23,13 @@ import { CreateInfluencer } from '../CreateInfluencer'; import { CreateTearsheetDivider } from './CreateTearsheetDivider'; import { carbon, pkg } from '../../settings'; import { CREATE_TEARSHEET_SECTION, CREATE_TEARSHEET_STEP } from './constants'; -import { usePreviousValue } from '../../global/js/use/usePreviousValue'; -import { useValidCreateStepCount } from '../../global/js/use/useValidCreateStepCount'; -import { useResetCreateComponent } from '../../global/js/use/useResetCreateComponent'; -import { useCreateComponentFocus } from '../../global/js/use/useCreateComponentFocus'; -import { useCreateComponentStepChange } from '../../global/js/use/useCreateComponentStepChange'; +import { + usePreviousValue, + useValidCreateStepCount, + useResetCreateComponent, + useCreateComponentFocus, + useCreateComponentStepChange, +} from '../../global/js/hooks'; import { hasValidChildType } from '../../global/js/utils/hasValidChildType'; const componentName = 'CreateTearsheet'; diff --git a/packages/cloud-cognitive/src/components/NotificationsPanel/NotificationsPanel.js b/packages/cloud-cognitive/src/components/NotificationsPanel/NotificationsPanel.js index 9296148754..dae9df805e 100644 --- a/packages/cloud-cognitive/src/components/NotificationsPanel/NotificationsPanel.js +++ b/packages/cloud-cognitive/src/components/NotificationsPanel/NotificationsPanel.js @@ -11,7 +11,7 @@ import React, { useEffect, useState, useRef } from 'react'; // Other standard imports. import PropTypes from 'prop-types'; import cx from 'classnames'; -import useClickOutside from '../../global/js/use/useClickOutside'; +import { useClickOutside } from '../../global/js/hooks'; import { pkg } from '../../settings'; import { timeAgo } from './utils'; import { NotificationsEmptyState } from '../EmptyStates/NotificationsEmptyState'; diff --git a/packages/cloud-cognitive/src/components/PageHeader/PageHeader.js b/packages/cloud-cognitive/src/components/PageHeader/PageHeader.js index 445c651ded..b5053f697a 100644 --- a/packages/cloud-cognitive/src/components/PageHeader/PageHeader.js +++ b/packages/cloud-cognitive/src/components/PageHeader/PageHeader.js @@ -11,7 +11,7 @@ import { extractShapesArray } from '../../global/js/utils/props-helper'; import { layout05, baseFontSize } from '@carbon/layout'; import cx from 'classnames'; import { useResizeDetector } from 'react-resize-detector'; -import { useWindowResize, useWindowScroll } from '../../global/js/use'; +import { useWindowResize, useWindowScroll } from '../../global/js/hooks'; import { BreadcrumbItem, Grid, diff --git a/packages/cloud-cognitive/src/global/js/hooks/index.js b/packages/cloud-cognitive/src/global/js/hooks/index.js new file mode 100644 index 0000000000..13e8b16a13 --- /dev/null +++ b/packages/cloud-cognitive/src/global/js/hooks/index.js @@ -0,0 +1,15 @@ +/** + * Copyright IBM Corp. 2020, 2021 + * + * This source code is licensed under the Apache-2.0 license found in the + * LICENSE file in the root directory of this source tree. + */ + +export { useWindowScroll } from './useWindowScroll'; +export { useWindowResize } from './useWindowResize'; +export { useClickOutside } from './useClickOutside'; +export { useCreateComponentFocus } from './useCreateComponentFocus'; +export { useCreateComponentStepChange } from './useCreateComponentStepChange'; +export { usePreviousValue } from './usePreviousValue'; +export { useResetCreateComponent } from './useResetCreateComponent'; +export { useValidCreateStepCount } from './useValidCreateStepCount'; diff --git a/packages/cloud-cognitive/src/global/js/use/useClickOutside.js b/packages/cloud-cognitive/src/global/js/hooks/useClickOutside.js similarity index 86% rename from packages/cloud-cognitive/src/global/js/use/useClickOutside.js rename to packages/cloud-cognitive/src/global/js/hooks/useClickOutside.js index 6cbf833b9f..15418e2789 100644 --- a/packages/cloud-cognitive/src/global/js/use/useClickOutside.js +++ b/packages/cloud-cognitive/src/global/js/hooks/useClickOutside.js @@ -7,7 +7,7 @@ import { useEffect } from 'react'; -const useOutsideClick = (ref, callback) => { +export const useClickOutside = (ref, callback) => { const handleClick = (event) => { if (ref.current && !ref.current.contains(event.target)) { callback(); @@ -22,5 +22,3 @@ const useOutsideClick = (ref, callback) => { }; }); }; - -export default useOutsideClick; diff --git a/packages/cloud-cognitive/src/global/js/use/useCreateComponentFocus.js b/packages/cloud-cognitive/src/global/js/hooks/useCreateComponentFocus.js similarity index 100% rename from packages/cloud-cognitive/src/global/js/use/useCreateComponentFocus.js rename to packages/cloud-cognitive/src/global/js/hooks/useCreateComponentFocus.js diff --git a/packages/cloud-cognitive/src/global/js/use/useCreateComponentStepChange.js b/packages/cloud-cognitive/src/global/js/hooks/useCreateComponentStepChange.js similarity index 100% rename from packages/cloud-cognitive/src/global/js/use/useCreateComponentStepChange.js rename to packages/cloud-cognitive/src/global/js/hooks/useCreateComponentStepChange.js diff --git a/packages/cloud-cognitive/src/global/js/use/usePreviousValue.js b/packages/cloud-cognitive/src/global/js/hooks/usePreviousValue.js similarity index 100% rename from packages/cloud-cognitive/src/global/js/use/usePreviousValue.js rename to packages/cloud-cognitive/src/global/js/hooks/usePreviousValue.js diff --git a/packages/cloud-cognitive/src/global/js/use/useResetCreateComponent.js b/packages/cloud-cognitive/src/global/js/hooks/useResetCreateComponent.js similarity index 100% rename from packages/cloud-cognitive/src/global/js/use/useResetCreateComponent.js rename to packages/cloud-cognitive/src/global/js/hooks/useResetCreateComponent.js diff --git a/packages/cloud-cognitive/src/global/js/use/useValidCreateStepCount.js b/packages/cloud-cognitive/src/global/js/hooks/useValidCreateStepCount.js similarity index 100% rename from packages/cloud-cognitive/src/global/js/use/useValidCreateStepCount.js rename to packages/cloud-cognitive/src/global/js/hooks/useValidCreateStepCount.js diff --git a/packages/cloud-cognitive/src/global/js/use/useWindowResize.js b/packages/cloud-cognitive/src/global/js/hooks/useWindowResize.js similarity index 94% rename from packages/cloud-cognitive/src/global/js/use/useWindowResize.js rename to packages/cloud-cognitive/src/global/js/hooks/useWindowResize.js index 578b562a89..5bb15fcd52 100644 --- a/packages/cloud-cognitive/src/global/js/use/useWindowResize.js +++ b/packages/cloud-cognitive/src/global/js/hooks/useWindowResize.js @@ -12,7 +12,7 @@ const getWindowSize = () => { return { innerHeight, innerWidth, outerHeight, outerWidth }; }; -export function useWindowResize(effect, deps, throttleInterval = 0) { +export const useWindowResize = (effect, deps, throttleInterval = 0) => { const windowSize = useRef({}); const throttleTimeout = useRef(null); @@ -45,4 +45,4 @@ export function useWindowResize(effect, deps, throttleInterval = 0) { return () => window.removeEventListener('resize', handleResize); // eslint-disable-next-line react-hooks/exhaustive-deps }, deps); -} +}; diff --git a/packages/cloud-cognitive/src/global/js/use/useWindowScroll.js b/packages/cloud-cognitive/src/global/js/hooks/useWindowScroll.js similarity index 94% rename from packages/cloud-cognitive/src/global/js/use/useWindowScroll.js rename to packages/cloud-cognitive/src/global/js/hooks/useWindowScroll.js index 61be0028cc..22e9c4b670 100644 --- a/packages/cloud-cognitive/src/global/js/use/useWindowScroll.js +++ b/packages/cloud-cognitive/src/global/js/hooks/useWindowScroll.js @@ -12,7 +12,7 @@ const getScrollPosition = () => { return { scrollX, scrollY }; }; -export function useWindowScroll(effect, deps, throttleInterval = 0) { +export const useWindowScroll = (effect, deps, throttleInterval = 0) => { const scrollPosition = useRef({}); const throttleTimeout = useRef(null); @@ -49,4 +49,4 @@ export function useWindowScroll(effect, deps, throttleInterval = 0) { return () => window.removeEventListener('scroll', handleScroll); // eslint-disable-next-line react-hooks/exhaustive-deps }, deps); -} +}; diff --git a/packages/cloud-cognitive/src/global/js/use/index.js b/packages/cloud-cognitive/src/global/js/use/index.js deleted file mode 100644 index ef04fa63c5..0000000000 --- a/packages/cloud-cognitive/src/global/js/use/index.js +++ /dev/null @@ -1,2 +0,0 @@ -export { useWindowScroll } from './useWindowScroll'; -export { useWindowResize } from './useWindowResize';