@kaizen/components 1.70.24 → 1.72.0

package/src/{__rc__ → __next__}/Menu/_docs/Menu.spec.stories.tsx

@@ -2,12 +2,12 @@ import React, { useState } from 'react'
 import { type Meta, type StoryObj } from '@storybook/react'
 import { expect, fn, userEvent, waitFor, within } from '@storybook/test'
 import isChromatic from 'chromatic'
-import { Button } from '~components/__rc__/Button'
-import { Icon } from '~components/__rc__/Icon'
+import { Button } from '~components/__next__/Button'
+import { Icon } from '~components/__next__/Icon'
 import { Menu, MenuHeader, MenuItem, MenuPopover, MenuSection, MenuTrigger } from '../index'
 
 const meta = {
-  title: 'Components/Menu/Menu (v3)/Tests',
+  title: 'Components/Menu/Menu (next)/Menu (next) tests',
   component: MenuTrigger,
   args: {
     defaultOpen: isChromatic(),

package/src/{__rc__ → __next__}/Menu/_docs/Menu.stories.tsx

@@ -2,13 +2,13 @@ import React, { type FunctionComponent } from 'react'
 import { type Meta, type StoryObj } from '@storybook/react'
 import isChromatic from 'chromatic'
 import { Text } from '~components/Text'
-import { Button } from '~components/__rc__/Button'
-import { Icon } from '~components/__rc__/Icon'
+import { Button } from '~components/__next__/Button'
+import { Icon } from '~components/__next__/Icon'
 import { Menu, MenuHeader, MenuItem, MenuPopover, MenuSection, MenuTrigger } from '../index'
 import * as testStories from './Menu.spec.stories'
 
 const meta = {
-  title: 'Components/Menu/Menu (v3)',
+  title: 'Components/Menu/Menu (next)',
   component: MenuTrigger,
   args: {
     defaultOpen: isChromatic(),

package/src/{__rc__ → __next__}/Select/_docs/Select.mdx

@@ -4,7 +4,7 @@ import * as SelectStories from './Select.stories'
 
 <Meta of={SelectStories} />
 
-# Select
+# Select (future)
 
 <ResourceLinks
   sourceCode="https://github.com/cultureamp/kaizen-design-system/tree/main/packages/components/src/Select"
@@ -13,7 +13,7 @@ import * as SelectStories from './Select.stories'
 
 />
 
-<KAIOInstallation exportNames="Select" isFuture />
+<KAIOInstallation exportNames="Select" isNext />
 
 ## Playground
 

package/src/{__rc__ → __next__}/Select/_docs/Select.stickersheet.stories.tsx

@@ -14,7 +14,7 @@ import {
 const IS_CHROMATIC = isChromatic()
 
 export default {
-  title: 'Components/Select/Future',
+  title: 'Components/Select/Select (future)',
   parameters: {
     chromatic: { disable: false },
     controls: { disable: true },

package/src/{__rc__ → __next__}/Select/_docs/Select.stories.tsx

@@ -7,7 +7,7 @@ import { type SelectOption } from '../types'
 import { groupedMockItems, mixedMockItemsDisabled, singleMockItems } from './mockData'
 
 const meta = {
-  title: 'Components/Select/Future',
+  title: 'Components/Select/Select (future)',
   component: Select,
   argTypes: {
     items: {

package/src/{__rc__ → __next__}/Select/subcomponents/ListBox/ListBox.tsx

@@ -2,8 +2,8 @@ import React, { useEffect, useRef, type HTMLAttributes, type Key, type ReactNode
 import { useListBox, type AriaListBoxOptions } from '@react-aria/listbox'
 import { type SelectState } from '@react-stately/select'
 import classnames from 'classnames'
-import { useIsClientReady } from '~components/__utilities__/useIsClientReady'
 import { type OverrideClassName } from '~components/types/OverrideClassName'
+import { useIsClientReady } from '~components/utils/useIsClientReady'
 import { useSelectContext } from '../../context'
 import { type SelectItem, type SelectOption } from '../../types'
 import styles from './ListBox.module.scss'

package/src/{__rc__ → __next__}/Select/subcomponents/Option/Option.tsx

@@ -2,7 +2,7 @@ import React, { type HTMLAttributes } from 'react'
 import { type FocusableElement } from '@react-types/shared'
 import classnames from 'classnames'
 import { mergeProps, useFocusRing, useOption } from 'react-aria'
-import { Icon } from '~components/__rc__/Icon'
+import { Icon } from '~components/__next__/Icon'
 import { type OverrideClassName } from '~components/types/OverrideClassName'
 import { useSelectContext } from '../../context'
 import { type SelectOption, type SelectOptionNode } from '../../types'

package/src/{__rc__ → __next__}/Select/subcomponents/SelectToggle/SelectToggle.tsx

@@ -2,7 +2,7 @@ import React, { type HTMLAttributes } from 'react'
 import { type DOMAttributes, type FocusableElement } from '@react-types/shared'
 import classnames from 'classnames'
 import { Label } from '~components/Label'
-import { Icon } from '~components/__rc__/Icon'
+import { Icon } from '~components/__next__/Icon'
 import { type OverrideClassName } from '~components/types/OverrideClassName'
 import styles from './SelectToggle.module.scss'
 

package/src/{__rc__ → __next__}/Tabs/_docs/Tabs--api-specification.mdx

@@ -2,9 +2,9 @@ import { Canvas, Controls, Meta } from '@storybook/blocks'
 import { ResourceLinks, KAIOInstallation } from '~storybook/components'
 import * as TabsStories from './Tabs.stories'
 
-<Meta title="Components/Tabs/Tabs (Future)/API Specification" />
+<Meta title="Components/Tabs/Tabs (next)/API Specification" />
 
-# Tabs
+# Tabs (next)
 
 <ResourceLinks
   sourceCode="https://github.com/cultureamp/kaizen-design-system/tree/main/packages/components/src/Tabs"
@@ -13,7 +13,7 @@ import * as TabsStories from './Tabs.stories'
 
 />
 
-<KAIOInstallation exportNames={['Tabs', 'TabList', 'Tab', 'TabPanel']} isFuture />
+<KAIOInstallation exportNames={['Tabs', 'TabList', 'Tab', 'TabPanel']} isNext />
 
 ## Overview
 

package/src/{__rc__ → __next__}/Tabs/_docs/Tabs--migration-guide.mdx

@@ -1,10 +1,10 @@
 import { Meta } from '@storybook/blocks'
 
-<Meta title="Components/Tabs/Tabs (Future)/Migration Guide" />
+<Meta title="Components/Tabs/Migration guide" />
 
-# Future Tabs migration guide
+# Next Tabs migration guide
 
-A brief guide on how and why to migrate from Kaizen's current `Tabs` to the `future` release.
+A brief guide on how and why to migrate from Kaizen's current `Tabs` to the `next` release.
 
 ## Why the change?
 

package/src/{__rc__ → __next__}/Tabs/_docs/Tabs.spec.stories.tsx

@@ -5,7 +5,7 @@ import { Text } from '~components/Text'
 import { Tab, TabList, TabPanel, Tabs } from '../index'
 
 const meta = {
-  title: 'Components/Tabs/Tabs (Future)/Tests',
+  title: 'Components/Tabs/Tabs (next)/Tabs (next) tests',
   parameters: {
     controls: { disable: true },
   },

package/src/{__rc__ → __next__}/Tabs/_docs/Tabs.stickersheet.stories.tsx

@@ -5,7 +5,7 @@ import { StickerSheet, type StickerSheetStory } from '~storybook/components/Stic
 import { Tab, TabList, TabPanel, Tabs } from '../index'
 
 export default {
-  title: 'Components/Tabs/Tabs (Future)',
+  title: 'Components/Tabs/Tabs (next)',
   parameters: {
     chromatic: { disable: false },
     controls: { disable: true },

package/src/{__rc__ → __next__}/Tabs/_docs/Tabs.stories.tsx

@@ -5,7 +5,7 @@ import { Text } from '~components/Text'
 import { Tab, TabList, TabPanel, Tabs, type Key } from '../index'
 
 const meta = {
-  title: 'Components/Tabs/Tabs (Future)',
+  title: 'Components/Tabs/Tabs (next)',
   component: Tabs,
   args: {
     children: (

package/src/{__rc__ → __next__}/Tabs/subcomponents/TabList/TabList.tsx

@@ -5,8 +5,8 @@ import {
   TabListStateContext,
   type TabListProps as RACTabListProps,
 } from 'react-aria-components'
-import { Icon } from '~components/__rc__/Icon'
-import { isRTL as isRTLCheck } from '~components/__utilities__/isRTL'
+import { Icon } from '~components/__next__/Icon'
+import { isRTL as isRTLCheck } from '~components/utils/isRTL'
 import { SCROLL_AMOUNT } from '../../constants'
 import styles from './TabList.module.css'
 

package/src/{__rc__ → __next__}/Tag/RemovableTag/_docs/RemovableTag.mdx

@@ -4,11 +4,11 @@ import * as RemovableTagStories from './RemovableTag.stories'
 
 <Meta of={RemovableTagStories} />
 
-# RemovableTag
+# RemovableTag (next)
 
-<ResourceLinks sourceCode="https://github.com/cultureamp/kaizen-design-system/tree/main/packages/components/src/__rc__/Tag/RemovableTag.tsx" />
+<ResourceLinks sourceCode="https://github.com/cultureamp/kaizen-design-system/tree/main/packages/components/src/__next__/Tag/RemovableTag.tsx" />
 
-<KAIOInstallation exportNames="RemovableTag" />
+<KAIOInstallation exportNames="RemovableTag" isNext />
 
 ## Overview
 

package/src/{__rc__ → __next__}/Tag/RemovableTag/_docs/RemovableTag.stickersheet.stories.tsx

@@ -4,7 +4,7 @@ import { StickerSheet, type StickerSheetStory } from '~storybook/components/Stic
 import { RemovableTag } from '../index'
 
 export default {
-  title: 'Components/Tag/Future/RemovableTag',
+  title: 'Components/Tag/Tag (next)/RemovableTag',
   parameters: {
     chromatic: { disable: false },
     controls: { disable: true },

package/src/{__rc__ → __next__}/Tag/RemovableTag/_docs/RemovableTag.stories.tsx

@@ -2,7 +2,7 @@ import { type Meta, type StoryObj } from '@storybook/react'
 import { RemovableTag } from '../RemovableTag'
 
 const meta = {
-  title: 'Components/Tag/Future/RemovableTag',
+  title: 'Components/Tag/Tag (next)/RemovableTag',
   component: RemovableTag,
   args: {
     children: 'My tag',

package/src/{__rc__ → __next__}/Tag/RemovableTag/subcomponents/RemoveButton.tsx

@@ -1,6 +1,6 @@
 import React, { type ButtonHTMLAttributes } from 'react'
 import classnames from 'classnames'
-import { Icon } from '~components/__rc__/Icon'
+import { Icon } from '~components/__next__/Icon'
 import { type OverrideClassName } from '~components/types/OverrideClassName'
 import styles from './RemoveButton.module.scss'
 

package/src/{__rc__ → __next__}/Tag/Tag/_docs/Tag-migration-guide.mdx

@@ -4,9 +4,9 @@ import * as TagMigrationStories from './Tag-migration-guide.stories'
 
 <Meta of={TagMigrationStories} />
 
-# Future Tag migration guide
+# Tag migration guide
 
-A brief guide on how and why to migrate from Kaizen's current `Tag` to the `future` release.
+A brief guide on how and why to migrate from Kaizen's current `Tag` to the `next` release.
 
 ## Why the change?
 
@@ -14,7 +14,7 @@ Tag was rebuilt to allow for greater composability as the number of cases for a
 
 ## Component and API changes at a glance
 
-There were a number key changes between current and future `Tag` to achieve the flexibility we were aiming to provide, we've listed these below but also go into further detail in the [migration examples](/docs/components-tag-future-migration-guide--migrationguide#migration-examples).
+There were a number key changes between current and next `Tag` to achieve the flexibility we were aiming to provide, we've listed these below but also go into further detail in the [migration examples](/docs/components-tag-next-migration-guide--migrationguide#migration-examples).
 
 - `variant` prop has been removed
   - This has been superseded by a combination of the `color` and `icon` prop
@@ -45,7 +45,7 @@ For the most part these can all be replaced with the use of the `color` prop, wi
 
 <Canvas of={TagMigrationStories.StatusMigration} sourceState="shown" />
 
-While the `LiveIcon` is exported from `@kaizen/components` the current `Tag` uses an animated implementation, which is not exported directly from Kaizen. As an interim solution, you can use the following Story's code snippet to create a `LiveIconComponent`. This can then be passed into the future `Tag` as `Children`.
+While the `LiveIcon` is exported from `@kaizen/components` the current `Tag` uses an animated implementation, which is not exported directly from Kaizen. As an interim solution, you can use the following Story's code snippet to create a `LiveIconComponent`. This can then be passed into the next `Tag` as `Children`.
 
 <Canvas of={TagMigrationStories.LiveIconComponentStory} sourceState="hidden" />
 
@@ -65,7 +65,7 @@ Note: because the icons convey meaning, they should have an accessible label tha
 
 Note: When using the `icon` prop, the icon's color will be determined by the `color` value that has been set. This is to ensure that an accessible contrast ratio is achieved.
 
-Any Icons added as a child of future `Tag` will need to set their own colors and ensure the right contrast ratio is achieved.
+Any Icons added as a child of next `Tag` will need to set their own colors and ensure the right contrast ratio is achieved.
 
 ### Sentiment
 
@@ -87,7 +87,7 @@ This is also a good time to stop and check if this change is necessary. If there
 
 ### Dismissible
 
-The `dismissible` prop is no longer available in the future `Tag` component. We have split the dismissible functionality into the [RemovableTag](/docs/components-tag-future-removabletag--docs).
+The `dismissible` prop is no longer available in the next `Tag` component. We have split the dismissible functionality into the [RemovableTag](/docs/components-tag-next-removabletag--docs).
 
 This increases the hit box for the dismiss button and makes the `ariaLabel` in the `removeButtonProps` a required prop. This offers a more accessible experience for user and address one of the standing [accessibility issues](https://github.com/cultureamp/kaizen-discourse/issues/101) with the legacy `Tag`.
 
@@ -125,7 +125,7 @@ Following a similar pattern to the above, you can use the `RemovableTag` with an
 
 Originally the `Tag` was built with the assumption that it would always required spacing at the end. This necessitated the need for the `inline` prop to remove the margin from end when it was not required.
 
-In future `Tag` this has been removed so consumers can now control spacing with CSS properties like `gap` or `margin-inline`.
+In next `Tag` this has been removed so consumers can now control spacing with CSS properties like `gap` or `margin-inline`.
 
 #### Before
 
@@ -139,7 +139,7 @@ To simplify this example we have avoided DOM elements such as `ul` and `li`. In
 
 ### truncationWidth
 
-While the current Tag controls truncation via the `truncationWidth` prop, which set a `max-width` of inner text via inline styles, we have chosen not to adopt this in the future `Tag` as it presents a risk of violating accessibility standards. While truncation can still be achieved in future `Tag` via Tailwind or DOM manipulation, it is important to call out out this as a accessibility concern.
+While the current Tag controls truncation via the `truncationWidth` prop, which set a `max-width` of inner text via inline styles, we have chosen not to adopt this in the next `Tag` as it presents a risk of violating accessibility standards. While truncation can still be achieved in next `Tag` via Tailwind or DOM manipulation, it is important to call out out this as a accessibility concern.
 
 #### Before
 

package/src/{__rc__ → __next__}/Tag/Tag/_docs/Tag-migration-guide.stories.tsx

@@ -3,11 +3,11 @@ import { type Meta, type StoryObj } from '@storybook/react'
 import { fn } from '@storybook/test'
 import { Avatar } from '~components/Avatar'
 import { LiveIcon } from '~components/Tag/subcomponents'
-import { Icon } from '~components/__rc__/Icon'
+import { Icon } from '~components/__next__/Icon'
 import { RemovableTag, Tag } from '../..'
 
 const meta = {
-  title: 'Components/Tag/Future Tag Migration Guide',
+  title: 'Components/Tag/Migration guide',
   component: Tag,
   args: {
     children: 'My tag',

package/src/{__rc__ → __next__}/Tag/Tag/_docs/Tag.mdx

@@ -4,14 +4,14 @@ import * as TagStories from './Tag.stories'
 
 <Meta of={TagStories} />
 
-# Tag
+# Tag (next)
 
 <ResourceLinks
-  sourceCode="https://github.com/cultureamp/kaizen-design-system/tree/main/packages/components/src/__rc__/Tag"
+  sourceCode="https://github.com/cultureamp/kaizen-design-system/tree/main/packages/components/src/__next__/Tag"
   designGuidelines="https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3293283155/Tag"
 />
 
-<KAIOInstallation exportNames="Tag" isFuture />
+<KAIOInstallation exportNames="Tag" isNext />
 
 ## Overview
 
@@ -55,6 +55,6 @@ Allows classnames to be attached to the outermost element of Tag.
 
 `variant` has been dropped as a catch all way to supply context and mean to `Tag`. Instead, `color` and `icon` should be used to capture sentiment, validation and status.
 
-### Migrating to future Tag
+### Migrating to next Tag
 
-See our [full guide](?path=/docs/components-tag-future-tag-migration-guide--docs) here to migrate to the future release of `Tag`.
+See our [full guide](?path=/docs/components-tag-next-tag-migration-guide--docs) here to migrate to the next release of `Tag`.

package/src/{__rc__ → __next__}/Tag/Tag/_docs/Tag.stickersheet.stories.tsx

@@ -1,12 +1,12 @@
 import React from 'react'
 import { type Meta } from '@storybook/react'
-import { Icon } from '~components/__rc__/Icon'
+import { Icon } from '~components/__next__/Icon'
 import { StickerSheet, type StickerSheetStory } from '~storybook/components/StickerSheet'
 import { Tag } from '../Tag'
 import { TagColorKeys } from '../types'
 
 export default {
-  title: 'Components/Tag/Future',
+  title: 'Components/Tag/Tag (next)',
   parameters: {
     chromatic: { disable: false },
     controls: { disable: true },

package/src/{__rc__ → __next__}/Tag/Tag/_docs/Tag.stories.tsx

@@ -1,11 +1,11 @@
 import React from 'react'
 import { type Meta, type StoryObj } from '@storybook/react'
-import { Icon } from '~components/__rc__/Icon'
+import { Icon } from '~components/__next__/Icon'
 import { TagColorKeys } from '../types'
 import { Tag } from '..'
 
 const meta = {
-  title: 'Components/Tag/Future',
+  title: 'Components/Tag/Tag (next)',
   component: Tag,
   args: {
     children: 'My tag',

package/src/{__rc__ → __next__}/Tooltip/OverlayArrow.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { OverlayArrow as RACOverlayArrow, type OverlayArrowProps } from 'react-aria-components'
-import { useReversedColors } from '~components/__utilities__/v3'
+import { useReversedColors } from '~components/utils'
 import { mergeClassNames } from '~components/utils/mergeClassNames'
 
 import styles from './OverlayArrow.module.scss'

package/src/{__rc__ → __next__}/Tooltip/Tooltip.tsx

@@ -7,7 +7,7 @@ import {
   type TooltipProps as RACTooltipProps,
 } from 'react-aria-components'
 import { VisuallyHidden } from '~components/VisuallyHidden'
-import { useReversedColors } from '~components/__utilities__/v3'
+import { useReversedColors } from '~components/utils'
 import { mergeClassNames } from '~components/utils/mergeClassNames'
 import { OverlayArrow } from './OverlayArrow'
 import styles from './Tooltip.module.scss'

package/src/{__rc__ → __next__}/Tooltip/_docs/ApiSpecification.mdx

@@ -3,20 +3,20 @@ import { KAIOInstallation, ResourceLinks } from '~storybook/components'
 import * as docsStories from './Tooltip.docs.stories'
 import * as exampleStories from './Tooltip.stories'
 
-<Meta title="Components/Tooltip/Tooltip (v3)/API Specification" />
+<Meta title="Components/Tooltip/Tooltip (next)/API Specification" />
 
-# Tooltip API Specification (v3)
+# Tooltip API Specification (next)
 
 Updated June 25, 2024
 
 <ResourceLinks
   sourceCode="https://github.com/cultureamp/kaizen-design-system/tree/main/packages/components/src/Tooltip"
   figma="https://www.figma.com/file/eZKEE5kXbEMY3lx84oz8iN/%F0%9F%92%9C-UI-Kit%3A-Heart?type=design&node-id=1929%3A32006&mode=design&t=LwTCBZ5E1uRvOA1l-1"
-  designGuidelines="/?path=/docs/overlays-tooltip-v3-usage-guidelines--docs"
+  designGuidelines="/?path=/docs/overlays-tooltip-next-usage-guidelines--docs"
   ariaComponentPage="https://react-spectrum.adobe.com/react-aria/Tooltip.html"
 />
 
-<KAIOInstallation exportNames={['Tooltip', 'TooltipTrigger']} family="overlays" version="3" />
+<KAIOInstallation exportNames={['Tooltip', 'TooltipTrigger']} isNext />
 
 ## Overview
 
@@ -55,7 +55,7 @@ Placement controls where the `Tooltip` will float, relative to its reference ele
 
 The option, `shouldFlip`, will control whether the `Tooltip` inverts its orientation when
 insufficient room is available in the viewport. You can see the below example with a constrained
-[viewport here](?path=/story/overlays-tooltip-v3--should-flip&globals=viewport:small).
+[viewport here](?path=/story/overlays-tooltip-next--should-flip&globals=viewport:small).
 
 <Canvas className="mb-64" of={docsStories.ShouldFlip} />
 
@@ -98,7 +98,7 @@ To enable the reversed theme, you will need to the component or application in t
 </ReversedColors>
 ```
 
-These utilities can be imported from `@kaizen/components/v3/utilities`. This is an emerging
+These utilities can be imported from `@kaizen/components/next`. This is an emerging
 pattern so more documentation will come.
 
 ## Examples

package/src/{__rc__ → __next__}/Tooltip/_docs/Tooltip.docs.stories.tsx

@@ -3,15 +3,16 @@ import { type Meta, type StoryObj } from '@storybook/react'
 import isChromatic from 'chromatic'
 import { Button, IconButton } from '~components/Button'
 import { FieldMessage } from '~components/FieldMessage'
+import { Focusable } from '~components/Focusable'
 import { Input } from '~components/Input'
 import { Label } from '~components/Label'
 import { Text } from '~components/Text'
-import { Icon } from '~components/__rc__/Icon'
-import { Focusable, Tooltip, TooltipTrigger } from '../index'
+import { Icon } from '~components/__next__/Icon'
+import { Tooltip, TooltipTrigger } from '../index'
 import * as TestStories from './Tooltip.spec.stories'
 
 const meta = {
-  title: 'Components/Tooltip/Tooltip (v3)/Docs Assets',
+  title: 'Components/Tooltip/Tooltip (next)/Docs Assets',
   component: Tooltip,
   parameters: {
     layout: 'centered',

package/src/{__rc__ → __next__}/Tooltip/_docs/Tooltip.mdx

@@ -6,23 +6,23 @@ import PlacementPng from './assets/tooltip_placement.png'
 import DesignSpecPng from './assets/tooltip_spec.png'
 import WhenToUsePng from './assets/tooltip_variant.png'
 
-<Meta title="Components/Tooltip/Tooltip (v3)/Usage Guidelines" />
+<Meta title="Components/Tooltip/Tooltip (next)/Usage Guidelines" />
 
-# Tooltip (v3)
+# Tooltip (next)
 
 Updated June 25, 2024
 
 <ResourceLinks
   sourceCode="https://github.com/cultureamp/kaizen-design-system/tree/main/packages/components/src/Tooltip"
   figma="https://www.figma.com/file/eZKEE5kXbEMY3lx84oz8iN/%F0%9F%92%9C-UI-Kit%3A-Heart?type=design&node-id=1929%3A32006&mode=design&t=LwTCBZ5E1uRvOA1l-1"
-  designGuidelines="/?path=/docs/overlays-tooltip-v3-usage-guidelines--docs"
+  designGuidelines="/?path=/docs/overlays-tooltip-next-usage-guidelines--docs"
   ariaComponentPage="https://react-spectrum.adobe.com/react-aria/Tooltip.html"
-  apiSpecification="/?path=/docs/overlays-tooltip-v3-api-specifications--docs"
+  apiSpecification="/?path=/docs/overlays-tooltip-next-api-specifications--docs"
 />
 
 <Installation
   installCommand="pnpm add @kaizen/components"
-  importStatement='import { Tooltip, TooltipTrigger } from "@kaizen/components/v3/overlays"'
+  importStatement='import { Tooltip, TooltipTrigger } from "@kaizen/components/next"'
 />
 
 ## Overview

package/src/{__rc__ → __next__}/Tooltip/_docs/Tooltip.spec.stories.tsx

@@ -3,14 +3,15 @@ import { type Meta, type StoryObj } from '@storybook/react'
 import { expect, userEvent, waitFor, within } from '@storybook/test'
 import isChromatic from 'chromatic'
 import { Button, IconButton } from '~components/Button'
+import { Focusable } from '~components/Focusable'
 import { Tab, TabList, TabPanel, TabPanels, Tabs } from '~components/Tabs'
 import { Text } from '~components/Text'
-import { Icon } from '~components/__rc__/Icon'
-import { Tag } from '~components/__rc__/Tag'
-import { Focusable, Tooltip, TooltipTrigger } from '../index'
+import { Icon } from '~components/__next__/Icon'
+import { Tag } from '~components/__next__/Tag'
+import { Tooltip, TooltipTrigger } from '../index'
 
 const meta = {
-  title: 'Components/Tooltip/Tooltip (v3)/Tests',
+  title: 'Components/Tooltip/Tooltip (next)/Tests',
   component: Tooltip,
   parameters: {
     layout: 'centered',
@@ -31,7 +32,7 @@ export default meta
 
 type Story = StoryObj<typeof meta>
 
-// TODO: update this to use the new button component v3
+// TODO: update this to use the new `next` button component
 
 export const OnButton: Story = {
   render: ({ defaultOpen, isOpen, ...args }) => (

package/src/{__rc__ → __next__}/Tooltip/_docs/Tooltip.stickersheet.stories.tsx

@@ -1,11 +1,11 @@
 import React from 'react'
 import { composeStories, type Meta, type StoryObj } from '@storybook/react'
-import { ReversedColors } from '~components/__utilities__/v3'
+import { ReversedColors } from '~components/utils'
 import { mergeClassNames } from '~components/utils/mergeClassNames'
 import * as testStories from './Tooltip.spec.stories'
 
 export default {
-  title: 'Components/Tooltip/Tooltip (v3)',
+  title: 'Components/Tooltip/Tooltip (next)',
   parameters: {
     chromatic: { disable: false },
     controls: { disable: true },

package/src/{__rc__ → __next__}/Tooltip/_docs/Tooltip.stories.tsx

@@ -2,12 +2,13 @@ import React, { type FunctionComponent } from 'react'
 import { type Meta, type StoryObj } from '@storybook/react'
 import isChromatic from 'chromatic'
 import { Button } from '~components/Button'
-import { Tag } from '~components/__rc__'
-import { Focusable, Tooltip, TooltipTrigger } from '../index'
+import { Focusable } from '~components/Focusable'
+import { Tag } from '~components/__next__'
+import { Tooltip, TooltipTrigger } from '../index'
 import * as testStories from './Tooltip.spec.stories'
 
 const meta = {
-  title: 'Components/Tooltip/Tooltip (v3)',
+  title: 'Components/Tooltip/Tooltip (next)',
   component: Tooltip,
   parameters: {
     layout: 'centered',

package/src/{__rc__ → __next__}/Tooltip/index.ts

@@ -1,3 +1,2 @@
 export * from './Tooltip'
 export * from './TooltipTrigger'
-export * from './subcomponents/Focusable'

package/src/__next__/index.ts

@@ -0,0 +1,11 @@
+export * from './Button'
+export * from './Icon'
+export * from './Menu'
+export * from './Select'
+export * from './Tag'
+export * from './Tabs'
+export * from './Tooltip'
+
+// This Focusable component was originally exported from here, but since moved to the main entry point because there's no name clash.
+// This is just here to keep backwards compatibility until the 2.0 release
+export * from '../Focusable'

package/src/__utilities__/index.ts

@@ -0,0 +1,2 @@
+// Remove this folder in 2.0 release when v3/utilities entry point is removed
+export * from '../utils/ReversedColors'

package/src/index.ts

@@ -21,6 +21,7 @@ export * from './ErrorPage'
 export * from './FieldGroup'
 export * from './FieldMessage'
 export * from './Filter'
+export * from './Focusable'
 export * from './GuidanceBlock'
 export * from './Heading'
 export * from './Icon'

package/src/utils/index.ts

@@ -1,3 +1,4 @@
 // Not all utils are exported because most are intended for internal use only
 export * from './useMediaQueries'
 export * from './hostedAssets'
+export * from './ReversedColors'

package/src/v3-actions.ts

@@ -1,2 +1,2 @@
-export * from './__rc__/Button'
-export * from './__rc__/Menu'
+export * from './__next__/Button'
+export * from './__next__/Menu'

package/src/v3-overlays.ts

@@ -1 +1 @@
-export * from './__rc__/Tooltip'
+export * from './__next__/Tooltip'

package/v3/utilities/package.json

@@ -1,5 +1,5 @@
 {
   "main": "../../dist/cjs/utilitiesV3.cjs",
   "module": "../../dist/esm/utilitiesV3.mjs",
-  "types": "../../dist/types/__utilities__/v3.d.ts"
+  "types": "../../dist/types/__utilities__/index.d.ts"
 }

package/dist/cjs/Tooltip/index.cjs

@@ -1,8 +0,0 @@
-'use strict';
-
-var Tooltip$1 = require('./Tooltip.cjs');
-
-// Since we can't add a deprecation flag on a * export
-/** * @deprecated use v2 or upgrade to v3 for the latest release */
-var Tooltip = Tooltip$1.Tooltip;
-exports.Tooltip = Tooltip;