fix: Add old internal paths as temporary available to use (#369)

Co-authored-by: Timur Manyanov <[email protected]>

package.json

@@ -6,6 +6,77 @@
     "registry": "https://registry.npmjs.org"
   },
   "exports": {
+    "./ebay-dialog-base/components/animation": {
+        "types": "./ebay-dialog-base/components/animation.d.ts",
+        "default": "./ebay-dialog-base/components/animation.js"
+    },
+    "./ebay-dialog-base/components/dialog-header": {
+        "types": "./ebay-dialog-base/components/dialog-header.d.ts",
+        "default": "./ebay-dialog-base/components/dialog-header.js"
+    },
+    "./ebay-dialog-base/components/dialog-footer": {
+        "types": "./ebay-dialog-base/components/dialog-footer.d.ts",
+        "default": "./ebay-dialog-base/components/dialog-footer.js"
+    },
+    "./ebay-notice-base/components/*": {
+        "types": "./ebay-notice-base/index.d.ts",
+        "default": "./ebay-notice-base.js"
+    },
+    "./common/component-utils/forwardRef": {
+      "types": "./common/component-utils/forwardRef.d.ts",
+      "default": "./common/component-utils/forwardRef.js"
+    },
+    "./common/component-utils/utils": {
+      "types": "./common/component-utils/utils.d.ts",
+      "default": "./common/component-utils/utils.js"
+    },
+    "./common/component-utils": {
+      "types": "./common/component-utils/index.d.ts",
+      "default": "./common/component-utils.js"
+    },
+    "./common/event-utils/types": {
+      "types": "./common/event-utils/event-utils/types.d.ts"
+    },
+    "./common/event-utils": {
+      "types": "./common/event-utils/event-utils/index.d.ts",
+      "default": "./common/event-utils/event-utils.js"
+    },
+    "./common/floating-label-utils": {
+      "types": "./common/floating-label-utils/hooks.d.ts",
+      "default": "./common/floating-label-utils/hooks.js"
+    },
+    "./common/notice-utils/notice-cta": {
+      "types": "./common/notice-utils/notice-cta.d.ts",
+      "default": "./common/notice-utils/notice-cta.js"
+    },
+    "./common/random-id": {
+      "types": "./common/random-id.d.ts",
+      "default": "./common/random-id.js"
+    },
+    "./common/tooltip-utils/constants": {
+      "types": "./common/tooltip-utils/constants.d.ts",
+      "default": "./common/tooltip-utils/constants.js"
+    },
+    "./common/tooltip-utils/types": {
+      "types": "./common/tooltip-utils/types.d.ts"
+    },
+    "./common/tooltip-utils": {
+      "types": "./common/tooltip-utils/index.d.ts",
+      "default": "./common/tooltip-utils.js"
+    },
+    "./ebay-radio/radio": {
+      "types": "./ebay-radio/radio.d.ts",
+      "default": "./ebay-radio/radio.js"
+    },
+    "./ebay-fake-menu-button/menu-button": {
+      "types": "./ebay-fake-menu-button/menu-button.d.ts",
+      "default": "./ebay-fake-menu-button/menu-button.js"
+    },
+    "./ebay-fake-menu/menu-item": {
+      "types": "./ebay-fake-menu/menu-item.d.ts",
+      "default": "./ebay-fake-menu/menu-item.js"
+    },
+
     "./package.json": "./package.json",
     "./*": {
       "types": "./*/index.d.ts",

src/common/__mocks__/random-id.ts

@@ -0,0 +1,2 @@
+export const randomId = (): string => 'abc123'
+export const useRandomId = (): string => 'abc123'

src/common/event-utils/index.ts

@@ -87,7 +87,7 @@ export function preventDefaultIfHijax(e: React.KeyboardEvent, hijax: boolean): v
     }
 }
 
-type Handler = (e: KeyboardEvent) => void
+type Handler = (e: KeyboardEvent | Event) => void
 
 const handlers: Handler[] = []
 
@@ -103,7 +103,7 @@ export function removeEventListener(_: unknown, handler: Handler): void {
     }
     handlers.splice(handlers.indexOf(handler), 1)
 }
-export function handleResize(e: KeyboardEvent): void {
+export function handleResize(e: KeyboardEvent | Event): void {
     window.removeEventListener('resize', handleResize)
     const callback = () => {
         if (handlers.length) {

src/common/random-id.ts

@@ -1 +1,14 @@
+import { useEffect, useState } from 'react'
+
 export const randomId = (): string => Math.random().toString(16).slice(-4)
+
+export const useRandomId = (): string => {
+    const [id, setId] = useState('')
+
+    useEffect(() => {
+        setId(randomId())
+    }, [])
+
+    return id
+}
+

src/ebay-alert-dialog/__tests__/index.spec.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import { screen, fireEvent, render } from '@testing-library/react'
 import { EbayAlertDialog } from '../index'
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 const closeSpy = jest.fn()
 const openSpy = jest.fn()

src/ebay-confirm-dialog/__tests__/index.spec.tsx

@@ -3,7 +3,7 @@ import { screen, render, fireEvent } from '@testing-library/react'
 import { EbayDialogHeader } from '../../ebay-dialog-base'
 import { EbayConfirmDialog } from '../index'
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 const openSpy = jest.fn()
 const confirmSpy = jest.fn()

src/ebay-confirm-dialog/__tests__/render.spec.tsx

@@ -6,7 +6,7 @@ import Meta, { Default, WithAnimation } from './index.stories'
 const DefaultStory = composeStory(Default, Meta)
 const AnimationStory = composeStory(WithAnimation, Meta)
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 describe('ebay-confirm-dialog rendering', () => {
     it('renders default story correctly', () => {

src/ebay-dialog-base/index.ts

@@ -5,3 +5,4 @@ export type { WindowType, DialogBaseProps } from './components/dialogBase'
 export { default as DialogBaseWithState } from './dialog-base-with-state'
 export { default as EbayDialogActions } from './components/dialog-actions'
 export { default as EbayDialogPreviousButton } from './components/dialog-previous-button'
+export { type TransitionElement, useDialogAnimation } from './components/animation'

src/ebay-drawer-dialog/__tests__/index.spec.tsx

@@ -3,7 +3,7 @@ import { render, fireEvent } from '@testing-library/react'
 import { EbayDrawerDialog } from '../index'
 import { EbayDialogHeader } from '../../ebay-dialog-base'
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 const classPrefix = 'drawer-dialog'
 const closeDrawerHandler = jest.fn()

src/ebay-fake-menu-button/index.ts

@@ -1,4 +1,8 @@
-export { default as EbayFakeMenuButton, type EbayFakeMenuButtonProps } from './menu-button'
+export {
+    default as EbayFakeMenuButton,
+    type EbayFakeMenuButtonProps,
+    type EbayFakeMenuButtonVariant
+} from './menu-button'
 export { default as EbayFakeMenuButtonItem } from './menu-button-item'
 export { default as EbayFakeMenuButtonSeparator } from './menu-button-separator'
 export { default as EbayFakeMenuButtonLabel } from './menu-button-label'

src/ebay-fullscreen-dialog/__tests__/index.spec.tsx

@@ -3,7 +3,7 @@ import { render, fireEvent } from '@testing-library/react'
 import { EbayDialogHeader } from '../../ebay-dialog-base'
 import { EbayFullscreenDialog } from '../index'
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 const closeSpy = jest.fn()
 const openSpy = jest.fn()

src/ebay-fullscreen-dialog/__tests__/render.spec.tsx

@@ -6,7 +6,7 @@ import Meta, { Default, AlwaysOpened } from './index.stories'
 const DefaultStory = composeStory(Default, Meta)
 const AlwaysOpenedStory = composeStory(AlwaysOpened, Meta)
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 describe('ebay-fullscreen-dialog rendering', () => {
     it('renders default story correctly', () => {

src/ebay-icon/__tests__/index.spec.tsx

@@ -5,7 +5,7 @@ import * as stories from './index.stories'
 
 const { AllIcons, CustomColor, NonDecorative } = composeStories(stories)
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 describe('ebay-icon rendering', () => {
     describe('AllIcons story', () => {

src/ebay-infotip/__tests__/index.spec.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import { render, fireEvent, RenderResult } from '@testing-library/react'
 import { EbayInfotip, EbayInfotipContent, EbayInfotipHeading } from '../index'
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 const renderComponent = (props?: any) => render(
     <EbayInfotip {...props}>

src/ebay-infotip/__tests__/render.spec.tsx

@@ -13,7 +13,7 @@ const {
     Modal
 } = composeStories(stories)
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 describe('ebay-infotip rendering', () => {
     it('renders default story correctly', () => {

src/ebay-inline-notice/__tests__/index.spec.tsx

@@ -65,4 +65,4 @@ describe('<EbayInlineNotice>', () => {
     })
 })
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')

src/ebay-lightbox-dialog/__tests__/index.spec.tsx

@@ -3,7 +3,7 @@ import { render, fireEvent } from '@testing-library/react'
 import { EbayDialogFooter, EbayDialogHeader } from '../../ebay-dialog-base'
 import { EbayLightboxDialog } from '../index'
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 const closeSpy = jest.fn()
 const openSpy = jest.fn()

src/ebay-page-notice/__tests__/index.spec.tsx

@@ -3,7 +3,7 @@ import { act, render } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 import { EbayNoticeContent, EbayPageNotice, EbayPageNoticeTitle } from '../index'
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 const clickEvent = expect.objectContaining({ type: 'click' })
 const keyDownEvent = expect.objectContaining({ type: 'keydown' })

src/ebay-pagination/__tests__/index.spec.tsx

@@ -3,7 +3,7 @@ import { fireEvent, render } from '@testing-library/react'
 import { EbayPagination, EbayPaginationItem as Item } from '../index'
 import { eventOfType } from '../../common/event-utils/__tests__/helpers'
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 jest.mock('react-dom', () => {
     const original = jest.requireActual('react-dom')

src/ebay-panel-dialog/__tests__/index.spec.tsx

@@ -3,7 +3,7 @@ import { render, fireEvent } from '@testing-library/react'
 import { EbayDialogCloseButton, EbayDialogHeader } from '../../ebay-dialog-base'
 import { EbayPanelDialog } from '../index'
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 const closeSpy = jest.fn()
 const openSpy = jest.fn()

src/ebay-section-notice/index.ts

@@ -5,4 +5,5 @@ export {
 } from './section-notice'
 export { default as EbaySectionNoticeTitle } from './section-notice-title'
 export { default as EbaySectionNoticeFooter } from './section-notice-footer'
+export { default as EbaySectionNoticeCTA } from './section-notice-cta'
 export { EbayNoticeContent } from '../ebay-notice-base/components/ebay-notice-content'

src/ebay-section-notice/section-notice-cta.tsx

@@ -0,0 +1,15 @@
+import React, { FC, ReactNode } from 'react'
+import NoticeCTA from '../common/notice-utils/notice-cta'
+
+type Props = {
+    className?: string;
+    children?: ReactNode;
+}
+
+const EbaySectionNoticeCTA: FC<Props> = ({ className, children }) => (
+    <NoticeCTA className={className} type="section">
+        {children}
+    </NoticeCTA>
+)
+
+export default EbaySectionNoticeCTA

src/ebay-split-button/__tests__/index.spec.tsx

@@ -5,7 +5,7 @@ import { EbaySplitButton, Props } from '../index'
 
 const values = ['first', 'second', 'third']
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 describe('<EbaySplitButton>', () => {
     describe('on button click', () => {

src/ebay-split-button/__tests__/render.spec.tsx

@@ -5,7 +5,7 @@ import * as stories from './index.stories'
 
 const { Default, Disabled, Controls, Loading, Size, Transparent, Truncated } = composeStories(stories)
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 describe('ebay-split-button rendering', () => {
     it('renders split button correctly', () => {

src/ebay-star-rating-select/star-rating-select.tsx

@@ -2,8 +2,8 @@ import React, { ComponentProps, FC, useEffect, useState } from 'react'
 import classNames from 'classnames'
 import { EbayIcon } from '../ebay-icon'
 import { range } from '../common/range'
-import { randomId } from '../common/random-id'
 import { EbayChangeEventHandler, EbayFocusEventHandler, EbayKeyboardEventHandler } from '../common/event-utils/types'
+import { useRandomId } from '../common/random-id'
 
 export type EventProps = { value: number }
 type Props = ComponentProps<'div'> & {
@@ -33,9 +33,11 @@ const EbayStarRatingSelect: FC<Props> = ({
     onChange = () => {},
     onFocus = () => {},
     onKeyDown = () => {},
-    name = `star-rating-${randomId()}`,
+    name,
     ...rest
 }) => {
+    const rId = useRandomId()
+    const inputName = name || `star-rating-${rId}`
     const [checkedValue, setChecked] = useState(getValue(value))
     useEffect(() => {
         setChecked(getValue(value))
@@ -74,7 +76,7 @@ const EbayStarRatingSelect: FC<Props> = ({
                             { 'star-rating-select__control--filled': i <= checkedValue })
                         }
                         type="radio"
-                        name={name}
+                        name={inputName}
                         value={i}
                         disabled={disabled}
                         defaultChecked={checkedValue === i}

src/ebay-textbox/index.ts

@@ -3,4 +3,5 @@ export { default as EbayTextboxPrefixIcon } from './prefix-icon'
 export { default as EbayTextboxPrefixText } from './prefix-text'
 export { default as EbayTextboxPostfixIcon } from './postfix-icon'
 export { default as EbayTextboxPostfixText } from './postfix-text'
+export { useFloatingLabel } from '../common/floating-label-utils/hooks'
 export type { Size } from './types'

src/ebay-toast-dialog/__tests__/index.spec.tsx

@@ -3,7 +3,7 @@ import { render, fireEvent } from '@testing-library/react'
 import { EbayDialogHeader } from '../../ebay-dialog-base'
 import { EbayToast } from '../index'
 
-jest.mock('../../common/random-id', () => ({ randomId: () => 'abc123' }))
+jest.mock('../../common/random-id')
 
 describe('<EbayToast>', () => {
     const closeToastHandler = jest.fn()

src/ebay-tooltip/index.ts

@@ -1,4 +1,8 @@
 export { default as EbayTooltip } from './ebay-tooltip'
 export { default as EbayTooltipContent } from './ebay-tooltip-content'
 export { default as EbayTooltipHost } from './ebay-tooltip-host'
-export { type PointerDirection, Tooltip } from '../common/tooltip-utils'
+export { type PointerDirection, Tooltip, TooltipFooter } from '../common/tooltip-utils'
+export {
+    DEFAULT_POINTER_DIRECTION,
+    POINTER_STYLES
+} from '../common/tooltip-utils/constants'

src/events/README.md

@@ -0,0 +1,13 @@
+# events
+
+Utils functions to handle events in your application.
+
+## Usage
+
+```jsx
+import {
+    handleEnterKeydown,
+    useKeyPress,
+    ...
+} from '@ebay/ui-core-react/events'
+```