refactor(select): move sub-components and utils into internal directory

Moves all sub-components not intended for public use into `__internal__ directory

BREAKING CHANGE: `SelectList`, `ListActionButton`, `SelectTextbox` and utils
have been moved to `__internal__` directory

src/__internal__/input/input.component.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useContext, useRef, useCallback } from "react";
 import StyledInput from "./input.style";
 import { InputContext, InputGroupContext } from "../input-behaviour";
 import { BorderRadiusType } from "../../components/box/box.component";
-import { SelectTextboxContext } from "../../components/select/select-textbox/select-textbox-context";
+import { SelectTextboxContext } from "../../components/select/__internal__/select-textbox/select-textbox.context";
 
 export type EnterKeyHintTypes =
   | "enter"

src/__internal__/input/input.spec.tsx

@@ -5,7 +5,7 @@ import Input, { InputProps, EnterKeyHintTypes } from "./input.component";
 import StyledInput from "./input.style";
 
 import { InputContext, InputContextProps } from "../input-behaviour";
-import { SelectTextboxContext } from "../../components/select/select-textbox/select-textbox-context";
+import { SelectTextboxContext } from "../../components/select/__internal__/select-textbox/select-textbox.context";
 
 import { assertStyleMatch } from "../../__spec_helper__/__internal__/test-utils";
 

src/__spec_helper__/__internal__/select-test-utils.ts

@@ -2,7 +2,7 @@ import { act } from "react-dom/test-utils";
 import type { ReactWrapper } from "enzyme";
 import { mockResizeObserver } from "jsdom-testing-mocks";
 
-import { StyledSelectListContainer } from "../../components/select/select-list/select-list.style";
+import { StyledSelectListContainer } from "../../components/select/__internal__/select-list/select-list.style";
 
 const resizeObserver = mockResizeObserver();
 

src/components/pager/pager.spec.tsx

@@ -7,7 +7,7 @@ import { simulateSelectTextboxEvent } from "../../__spec_helper__/__internal__/s
 import { assertStyleMatch } from "../../__spec_helper__/__internal__/test-utils";
 import Pager, { PagerProps } from "./pager.component";
 import { Select } from "../select";
-import SelectList from "../select/select-list/select-list.component";
+import SelectList from "../select/__internal__/select-list/select-list.component";
 import {
   StyledPagerLink,
   StyledPagerNavInner,

src/components/select/list-action-button/list-action-button.component.tsx → src/components/select/__internal__/list-action-button/list-action-button.component.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import StyledListActionButtonWrapper from "./list-action-button.style";
-import useLocale from "../../../hooks/__internal__/useLocale";
-import Button from "../../button";
+import useLocale from "../../../../hooks/__internal__/useLocale";
+import Button from "../../../button";
 
 export interface ListActionButtonProps {
   listActionButton?: boolean | React.ReactNode;

src/components/select/list-action-button/list-action-button.spec.tsx → src/components/select/__internal__/list-action-button/list-action-button.spec.tsx

@@ -2,7 +2,7 @@ import React, { useRef } from "react";
 import TestRenderer from "react-test-renderer";
 import { shallow, mount, ShallowWrapper } from "enzyme";
 import ListActionButton, { ListActionButtonProps } from ".";
-import Button from "../../button";
+import Button from "../../../button";
 
 function renderListActionButton(
   props: Partial<ListActionButtonProps>,

src/components/select/list-action-button/list-action-button.style.ts → src/components/select/__internal__/list-action-button/list-action-button.style.ts

@@ -1,5 +1,5 @@
 import styled from "styled-components";
-import StyledButton from "../../button/button.style";
+import StyledButton from "../../../button/button.style";
 
 const StyledListActionButtonWrapper = styled.div`
   padding-top: var(--spacing100);

src/components/select/select-list/select-list.component.tsx → src/components/select/__internal__/select-list/select-list.component.tsx

@@ -16,9 +16,9 @@ import {
 } from "@tanstack/react-virtual";
 import findLastIndex from "lodash/findLastIndex";
 
-import usePrevious from "../../../hooks/__internal__/usePrevious";
-import useScrollBlock from "../../../hooks/__internal__/useScrollBlock";
-import useModalManager from "../../../hooks/__internal__/useModalManager";
+import usePrevious from "../../../../hooks/__internal__/usePrevious";
+import useScrollBlock from "../../../../hooks/__internal__/useScrollBlock";
+import useModalManager from "../../../../hooks/__internal__/useModalManager";
 import {
   StyledSelectList,
   StyledSelectLoaderContainer,
@@ -28,15 +28,15 @@ import {
   StyledSelectListContainer,
   StyledScrollableContainer,
 } from "./select-list.style";
-import Popover from "../../../__internal__/popover";
-import OptionRow from "../option-row/option-row.component";
+import Popover from "../../../../__internal__/popover";
+import OptionRow from "../../option-row/option-row.component";
 import getNextChildByText from "../utils/get-next-child-by-text";
 import getNextIndexByKey from "../utils/get-next-index-by-key";
 import isNavigationKey from "../utils/is-navigation-key";
 import ListActionButton from "../list-action-button";
-import Loader from "../../loader";
-import Option, { OptionProps } from "../option";
-import SelectListContext from "../__internal__/select-list-context";
+import Loader from "../../../loader";
+import Option, { OptionProps } from "../../option";
+import SelectListContext from "./select-list.context";
 
 export interface SelectListProps {
   /** The ID for the parent <div> */

src/components/select/select-list/select-list.spec.tsx → src/components/select/__internal__/select-list/select-list.spec.tsx

@@ -9,17 +9,17 @@ import {
   StyledSelectListContainer,
   StyledScrollableContainer,
 } from "./select-list.style";
-import Option from "../option";
-import OptionRow from "../option-row/option-row.component";
-import OptionGroupHeader from "../option-group-header";
+import Option from "../../option";
+import OptionRow from "../../option-row/option-row.component";
+import OptionGroupHeader from "../../option-group-header";
 import ListActionButton from "../list-action-button";
-import Loader from "../../loader";
-import { assertStyleMatch } from "../../../__spec_helper__/__internal__/test-utils";
-import Popover from "../../../__internal__/popover";
-import * as guidModule from "../../../__internal__/utils/helpers/guid";
-import StyledOption from "../option/option.style";
-import StyledOptionRow from "../option-row/option-row.style";
-import StyledOptionGroupHeader from "../option-group-header/option-group-header.style";
+import Loader from "../../../loader";
+import { assertStyleMatch } from "../../../../__spec_helper__/__internal__/test-utils";
+import Popover from "../../../../__internal__/popover";
+import * as guidModule from "../../../../__internal__/utils/helpers/guid";
+import StyledOption from "../../option/option.style";
+import StyledOptionRow from "../../option-row/option-row.style";
+import StyledOptionGroupHeader from "../../option-group-header/option-group-header.style";
 
 const mockedGuid = "guid-12345";
 const guidSpy = jest.spyOn(guidModule, "default");

src/components/select/select-list/select-list.style.ts → src/components/select/__internal__/select-list/select-list.style.ts

@@ -1,5 +1,5 @@
 import styled, { css } from "styled-components";
-import { baseTheme } from "../../../style/themes";
+import { baseTheme } from "../../../../style/themes";
 import { SelectListProps } from ".";
 
 interface StyledSelectListProps {

src/components/select/__internal__/select-text/select-text.component.tsx

@@ -9,16 +9,8 @@ export interface SelectTextProps {
   disabled?: boolean;
   /** Value to be displayed */
   formattedValue?: string;
-  /** Label id passed from Select component  */
-  labelId?: string;
-  /** If true, the list is displayed */
-  isOpen?: boolean;
-  /** Callback function for when the Select Textbox loses it's focus. */
-  onBlur?: (ev: React.FocusEvent<HTMLElement>) => void;
   /** Callback function for when the component is clicked. */
   onClick?: (ev: React.MouseEvent<HTMLElement>) => void;
-  /** Callback function for when the Select Textbox is focused. */
-  onFocus?: (ev: React.FocusEvent<HTMLElement>) => void;
   /** Callback function for when the key is pressed when focused on Select Text. */
   /** Callback function for when the left mouse key is pressed when focused on Select Text. */
   onMouseDown?: (ev: React.MouseEvent<HTMLElement>) => void;

src/components/select/select-textbox/select-textbox.component.tsx → src/components/select/__internal__/select-textbox/select-textbox.component.tsx

@@ -1,13 +1,13 @@
 import React, { useMemo } from "react";
 import { offset, size as sizeMiddleware } from "@floating-ui/dom";
 
-import useFloating from "../../../hooks/__internal__/useFloating";
-import Textbox, { CommonTextboxProps } from "../../textbox";
-import SelectText from "../__internal__/select-text";
-import useLocale from "../../../hooks/__internal__/useLocale";
-import { ValidationProps } from "../../../__internal__/validations";
-import { CustomSelectChangeEvent } from "../simple-select/simple-select.component";
-import { SelectTextboxContext } from "./select-textbox-context";
+import useFloating from "../../../../hooks/__internal__/useFloating";
+import Textbox, { CommonTextboxProps } from "../../../textbox";
+import SelectText from "../select-text";
+import useLocale from "../../../../hooks/__internal__/useLocale";
+import { ValidationProps } from "../../../../__internal__/validations";
+import { CustomSelectChangeEvent } from "../../simple-select/simple-select.component";
+import { SelectTextboxContext } from "./select-textbox.context";
 
 const floatingMiddleware = [
   offset(({ rects }) => ({

src/components/select/select-textbox/select-textbox.spec.tsx → src/components/select/__internal__/select-textbox/select-textbox.spec.tsx

@@ -3,13 +3,13 @@ import { mount } from "enzyme";
 import { act } from "react-dom/test-utils";
 
 import SelectTextbox, { SelectTextboxProps } from ".";
-import Textbox from "../../textbox";
+import Textbox from "../../../textbox";
 import InputPresentationStyle, {
   StyledInputPresentationContainer,
-} from "../../../__internal__/input/input-presentation.style";
-import * as guidModule from "../../../__internal__/utils/helpers/guid";
-import Translation from "../../../locales/en-gb";
-import * as useFloatingModule from "../../../hooks/__internal__/useFloating/useFloating";
+} from "../../../../__internal__/input/input-presentation.style";
+import * as guidModule from "../../../../__internal__/utils/helpers/guid";
+import Translation from "../../../../locales/en-gb";
+import * as useFloatingModule from "../../../../hooks/__internal__/useFloating/useFloating";
 
 const useFloatingSpy = jest.spyOn(useFloatingModule, "default");
 const guidSpy = jest.spyOn(guidModule, "default");

src/components/select/utils/get-next-child-by-text.spec.tsx → src/components/select/__internal__/utils/get-next-child-by-text.spec.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import { mount } from "enzyme";
 import getNextChildByText from "./get-next-child-by-text";
-import Option from "../option";
+import Option from "../../option";
 
 function renderList(renderer = mount) {
   return renderer(

src/components/select/utils/is-expected-option.spec.tsx → src/components/select/__internal__/utils/is-expected-option.spec.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import Option from "../option";
+import Option from "../../option";
 import isExpectedOption from "./is-expected-option";
 
 describe("isExpectedOption", () => {

src/components/select/utils/is-expected-option.ts → src/components/select/__internal__/utils/is-expected-option.ts

@@ -1,5 +1,5 @@
-import Option from "../option";
-import OptionRow from "../option-row/option-row.component";
+import Option from "../../option";
+import OptionRow from "../../option-row/option-row.component";
 import isExpectedValue from "./is-expected-value";
 
 export default function isExpectedOption(

src/components/select/utils/with-filter.hoc.tsx → src/components/select/__internal__/utils/with-filter.hoc.tsx

@@ -1,9 +1,11 @@
 import React, { useCallback } from "react";
-import useLocale from "../../../hooks/__internal__/useLocale";
-import StyledOptionRow from "../option-row/option-row.style";
-import StyledOption from "../option/option.style";
-import Option, { OptionProps } from "../option";
-import OptionRow, { OptionRowProps } from "../option-row/option-row.component";
+import useLocale from "../../../../hooks/__internal__/useLocale";
+import StyledOptionRow from "../../option-row/option-row.style";
+import StyledOption from "../../option/option.style";
+import Option, { OptionProps } from "../../option";
+import OptionRow, {
+  OptionRowProps,
+} from "../../option-row/option-row.component";
 import highlightPartOfText from "./highlight-part-of-text";
 
 const filterOptions = (option: React.ReactElement, filterText: string) => {

src/components/select/utils/with-filter.spec.tsx → src/components/select/__internal__/utils/with-filter.spec.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 import { mount } from "enzyme";
 import withFilter, { FilteredComponentProps } from "./with-filter.hoc";
-import Option from "../option";
-import OptionRow from "../option-row/option-row.component";
+import Option from "../../option";
+import OptionRow from "../../option-row/option-row.component";
 
 const FilterableList = withFilter(({ children }: FilteredComponentProps) => (
   <ul data-element="select-list">{children}</ul>

src/components/select/filterable-select/filterable-select.component.tsx

@@ -4,15 +4,17 @@ import { Side } from "@floating-ui/dom";
 
 import { ButtonProps } from "../../button";
 import { filterOutStyledSystemSpacingProps } from "../../../style/utils";
-import SelectTextbox, { FormInputPropTypes } from "../select-textbox";
+import SelectTextbox, {
+  FormInputPropTypes,
+} from "../__internal__/select-textbox";
 import guid from "../../../__internal__/utils/helpers/guid";
-import withFilter from "../utils/with-filter.hoc";
+import withFilter from "../__internal__/utils/with-filter.hoc";
 import StyledSelect from "../select.style";
 import SelectList, {
   SelectListProps,
-} from "../select-list/select-list.component";
-import isExpectedOption from "../utils/is-expected-option";
-import isNavigationKey from "../utils/is-navigation-key";
+} from "../__internal__/select-list/select-list.component";
+import isExpectedOption from "../__internal__/utils/is-expected-option";
+import isNavigationKey from "../__internal__/utils/is-navigation-key";
 import Logger from "../../../__internal__/utils/logger";
 import useStableCallback from "../../../hooks/__internal__/useStableCallback";
 import useFormSpacing from "../../../hooks/__internal__/useFormSpacing";

src/components/select/filterable-select/filterable-select.mdx

@@ -2,7 +2,7 @@ import { Meta, ArgTypes, Canvas } from "@storybook/blocks";
 import TranslationKeysTable from "../../../../.storybook/utils/translation-keys-table";
 
 import * as OptionStories from "../option/option.stories";
-import * as SelectTextboxStories from "../select-textbox/select-textbox.stories";
+import * as SelectTextboxStories from "../__internal__/select-textbox/select-textbox.stories";
 import * as FilterableSelectStories from "./filterable-select.stories";
 
 <Meta title="Select/Filterable" of={FilterableSelectStories} />

src/components/select/filterable-select/filterable-select.spec.tsx

@@ -16,12 +16,12 @@ import {
 import { FilterableSelect, Option, FilterableSelectProps } from "..";
 import StyledOption from "../option/option.style";
 import Textbox from "../../textbox";
-import MatchingText from "../utils/matching-text.style";
-import SelectList from "../select-list/select-list.component";
+import MatchingText from "../__internal__/utils/matching-text.style";
+import SelectList from "../__internal__/select-list/select-list.component";
 import {
   StyledSelectListContainer,
   StyledScrollableContainer,
-} from "../select-list/select-list.style";
+} from "../__internal__/select-list/select-list.style";
 import Button from "../../button";
 import Label from "../../../__internal__/label";
 import InputIconToggle from "../../../__internal__/input-icon-toggle";

src/components/select/multi-select/multi-select.component.tsx

@@ -9,19 +9,21 @@ import invariant from "invariant";
 import { Side } from "@floating-ui/dom";
 
 import { filterOutStyledSystemSpacingProps } from "../../../style/utils";
-import SelectTextbox, { FormInputPropTypes } from "../select-textbox";
+import SelectTextbox, {
+  FormInputPropTypes,
+} from "../__internal__/select-textbox";
 import guid from "../../../__internal__/utils/helpers/guid";
-import withFilter from "../utils/with-filter.hoc";
-import SelectList from "../select-list/select-list.component";
+import withFilter from "../__internal__/utils/with-filter.hoc";
+import SelectList from "../__internal__/select-list/select-list.component";
 import {
   StyledSelectPillContainer,
   StyledSelectMultiSelect,
   StyledAccessibilityLabelContainer,
 } from "./multi-select.style";
 import Pill, { PillProps } from "../../pill";
-import isExpectedOption from "../utils/is-expected-option";
-import isExpectedValue from "../utils/is-expected-value";
-import isNavigationKey from "../utils/is-navigation-key";
+import isExpectedOption from "../__internal__/utils/is-expected-option";
+import isExpectedValue from "../__internal__/utils/is-expected-value";
+import isNavigationKey from "../__internal__/utils/is-navigation-key";
 import Logger from "../../../__internal__/utils/logger";
 import useStableCallback from "../../../hooks/__internal__/useStableCallback";
 import useFormSpacing from "../../../hooks/__internal__/useFormSpacing";

src/components/select/multi-select/multi-select.mdx

@@ -2,7 +2,7 @@ import { Meta, ArgTypes, Canvas } from "@storybook/blocks";
 import TranslationKeysTable from "../../../../.storybook/utils/translation-keys-table";
 
 import * as OptionStories from "../option/option.stories";
-import * as SelectTextboxStories from "../select-textbox/select-textbox.stories";
+import * as SelectTextboxStories from "../__internal__/select-textbox/select-textbox.stories";
 import * as MultiSelectStories from "./multi-select.stories";
 
 <Meta title="Select/MultiSelect" of={MultiSelectStories} />

src/components/select/multi-select/multi-select.spec.tsx

@@ -16,13 +16,13 @@ import {
 import { MultiSelect, Option, MultiSelectProps } from "..";
 import StyledOption from "../option/option.style";
 import Textbox from "../../textbox";
-import MatchingText from "../utils/matching-text.style";
-import SelectList from "../select-list/select-list.component";
+import MatchingText from "../__internal__/utils/matching-text.style";
+import SelectList from "../__internal__/select-list/select-list.component";
 import {
   StyledSelectList,
   StyledSelectListContainer,
   StyledScrollableContainer,
-} from "../select-list/select-list.style";
+} from "../__internal__/select-list/select-list.style";
 import Pill from "../../pill";
 import InputPresentationStyle from "../../../__internal__/input/input-presentation.style";
 import { InputPresentation } from "../../../__internal__/input";

src/components/select/option-row/option-row.component.tsx

@@ -3,7 +3,7 @@ import { CSSProperties } from "styled-components";
 import { TagProps } from "__internal__/utils/helpers/tags";
 import guid from "../../../__internal__/utils/helpers/guid";
 import StyledOptionRow from "./option-row.style";
-import SelectListContext from "../__internal__/select-list-context";
+import SelectListContext from "../__internal__/select-list/select-list.context";
 
 export interface OptionRowProps extends TagProps {
   /** The option's visible text, displayed within <Textbox> of <Select> */

src/components/select/option-row/option-row.spec.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import TestRenderer from "react-test-renderer";
 import { shallow, mount } from "enzyme";
 import OptionRow, { OptionRowProps } from "./option-row.component";
-import SelectListContext from "../__internal__/select-list-context";
+import SelectListContext from "../__internal__/select-list/select-list.context";
 
 function renderOptionRow(
   props: Omit<OptionRowProps, "id" | "children">,

src/components/select/option/option.component.tsx

@@ -2,7 +2,7 @@ import React, { useContext, useRef } from "react";
 import guid from "../../../__internal__/utils/helpers/guid";
 import { TagProps } from "../../../__internal__/utils/helpers/tags";
 import StyledOption from "./option.style";
-import SelectListContext from "../__internal__/select-list-context";
+import SelectListContext from "../__internal__/select-list/select-list.context";
 
 export interface OptionProps
   extends Omit<

src/components/select/option/option.spec.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import TestRenderer from "react-test-renderer";
 import { shallow, mount } from "enzyme";
 import Option, { OptionProps } from ".";
-import SelectListContext from "../__internal__/select-list-context";
+import SelectListContext from "../__internal__/select-list/select-list.context";
 import guid from "../../../__internal__/utils/helpers/guid";
 
 const mockedGuid = "guid-12345";

src/components/select/simple-select/simple-select.component.tsx

@@ -10,12 +10,14 @@ import { Side } from "@floating-ui/dom";
 
 import { filterOutStyledSystemSpacingProps } from "../../../style/utils";
 import StyledSelect from "../select.style";
-import SelectTextbox, { FormInputPropTypes } from "../select-textbox";
-import SelectList from "../select-list/select-list.component";
+import SelectTextbox, {
+  FormInputPropTypes,
+} from "../__internal__/select-textbox";
+import SelectList from "../__internal__/select-list/select-list.component";
 import guid from "../../../__internal__/utils/helpers/guid";
-import getNextChildByText from "../utils/get-next-child-by-text";
-import isExpectedOption from "../utils/is-expected-option";
-import isNavigationKey from "../utils/is-navigation-key";
+import getNextChildByText from "../__internal__/utils/get-next-child-by-text";
+import isExpectedOption from "../__internal__/utils/is-expected-option";
+import isNavigationKey from "../__internal__/utils/is-navigation-key";
 import Logger from "../../../__internal__/utils/logger";
 import useFormSpacing from "../../../hooks/__internal__/useFormSpacing";
 import useInputAccessibility from "../../../hooks/__internal__/useInputAccessibility/useInputAccessibility";