diff --git a/build/api/layout.api.md b/build/api/layout.api.md index 5cd33e4b34..6a738f5cbb 100644 --- a/build/api/layout.api.md +++ b/build/api/layout.api.md @@ -1052,7 +1052,7 @@ export const SidebarRightSlotTargets: Readonly>; -// @public (undocumented) +// @public @deprecated (undocumented) type SlotComponentsRecords = Readonly<{ readonly [P in PascalCase]: ComponentType; }>; @@ -1215,7 +1215,7 @@ export function useElementInsets(elementRef: RefObject): ContainerI const useGetLayoutPanelsStateContext: () => GetLayoutPanelsStateContextType; // @public (undocumented) -function useHasActiveSlotsFactory>(SlotTargets: T): (...slots: ReadonlyArray) => boolean; +function useHasActiveSlotsFactory>(SlotTargets: T): (...slots: ReadonlyArray) => boolean; // @public @deprecated (undocumented) const useLayoutContainerWidth: typeof useContainerWidth; @@ -1239,12 +1239,12 @@ export const useSafeAreaInsetsContext: () => ContainerInsets; const useSetLayoutPanelsStateContext: () => SetLayoutPanelsStateContextType; // @public -function useSlotTargetsFactory>(SlotTargets: R): (slots: ReadonlyArray, override?: T | undefined) => NonNullable | FunctionComponentElement< { +function useSlotTargetsFactory>(SlotTargets: R): (slots: ReadonlyArray, override?: T | undefined) => NonNullable | FunctionComponentElement< { children?: ReactNode; }> | null; // @public @deprecated -function useTargetsIfActiveFactory>(SlotTargets: R): (slots: readonly (keyof R & string)[], override?: T | undefined) => FunctionComponentElement< { +function useTargetsIfActiveFactory>(SlotTargets: R): (slots: readonly (keyof R & string)[], override?: T | undefined) => FunctionComponentElement< { children?: ReactNode; }> | NonNullable | null; diff --git a/packages/layout/src/slots/contexts.ts b/packages/layout/src/slots/contexts.ts index d929b31dad..8ae5f293a5 100644 --- a/packages/layout/src/slots/contexts.ts +++ b/packages/layout/src/slots/contexts.ts @@ -1,7 +1,8 @@ import { createNonNullableContextFactory, noop } from '@contember/react-utils' import { deprecate } from '@contember/utilities' -import { ComponentType, ElementType, Fragment, ReactNode, RefObject, createElement, useCallback } from 'react' -import { SlotComponentsRecords } from './types' +import { Fragment, createElement, useCallback } from 'react' +import { createSlotTargetComponent } from './createSlotTargetComponent' +import { SlotTargetComponentsRecord } from './types' export type SlotsRefMap = Map export type RegisterSlotTarget = (id: string, name: string, ref: HTMLElement) => void; @@ -10,7 +11,7 @@ export type UnregisterSlotTarget = (id: string, name: string) => void; export type ActiveSlotPortalsContextType = Set; export const [ActiveSlotPortalsContext, useActiveSlotPortalsContext] = createNonNullableContextFactory('ActiveSlotPortalsContext', new Set()) -export function useHasActiveSlotsFactory>(SlotTargets: T) { +export function useHasActiveSlotsFactory>(SlotTargets: T) { const activeSlotPortals = useActiveSlotPortalsContext() return useCallback((...slots: ReadonlyArray) => { @@ -22,7 +23,7 @@ export function useHasActiveSlotsFactory * Creates a function that returns a list of slot targets if any of them are active. * @param SlotTargets - List of slot targets to create */ -export function useSlotTargetsFactory>(SlotTargets: R) { +export function useSlotTargetsFactory>(SlotTargets: R) { const activeSlotPortals = useActiveSlotPortalsContext() return useCallback(function createSlotTargets(slots: ReadonlyArray, override?: T) { @@ -32,7 +33,7 @@ export function useSlotTargetsFactory>(S } else { return createElement(Fragment, {}, ...slots.map(slot => { if (slot in SlotTargets) { - const Target = SlotTargets[slot] as ComponentType + const Target = SlotTargets[slot] as ReturnType> return createElement(Target, { key: `multi-element:${slot}`, @@ -51,7 +52,7 @@ export function useSlotTargetsFactory>(S * Fallback for `useSlotTargetsFactory` for backwards compatibility. * @deprecated Use `useSlotTargetsFactory` instead */ -export function useTargetsIfActiveFactory>(SlotTargets: R) { +export function useTargetsIfActiveFactory>(SlotTargets: R) { deprecate('1.3.0', true, '`useTargetsIfActiveFactory()`', '`useSlotTargetsFactory()`') return useSlotTargetsFactory(SlotTargets) } diff --git a/packages/layout/src/slots/types.ts b/packages/layout/src/slots/types.ts index 5086eed38d..ac82726219 100644 --- a/packages/layout/src/slots/types.ts +++ b/packages/layout/src/slots/types.ts @@ -1,8 +1,9 @@ import { ComponentClassNameProps, PascalCase } from '@contember/utilities' -import { CSSProperties, ComponentType, ElementType, ReactNode } from 'react' +import { ComponentType, ElementType, ReactNode } from 'react' import { createSlotSourceComponent } from './createSlotSourceComponent' import { createSlotTargetComponent } from './createSlotTargetComponent' +/** @deprecated No alternative since 1.4.0 */ export type SlotComponentsRecords = Readonly<{ readonly [P in PascalCase]: ComponentType }>