import React, { memo, useEffect, useMemo, type ReactNode } from 'react'; import { type AssetName } from './AssetName'; import Context, { type ContextType } from './private/Context'; type AssetComposerProps = Readonly<{ children?: ReactNode | undefined; }>; const SLIDING_DOTS_SVG_STRING = ''; const SLIDING_DOTS_REDUCED_MOTION_SVG_STRING = SLIDING_DOTS_SVG_STRING.replaceAll( 'repeatCount="indefinite"', 'repeatCount="0.01" fill="freeze"' ); const AssetComposer = memo(({ children }: AssetComposerProps) => { const slidingDotsURL = useMemo( // Content is hardcoded. // eslint-disable-next-line no-restricted-properties () => URL.createObjectURL(new Blob([SLIDING_DOTS_SVG_STRING], { type: 'image/svg+xml' })), [] ); const slidingDotsReducedMotionURL = useMemo( // Content is hardcoded. // eslint-disable-next-line no-restricted-properties () => URL.createObjectURL(new Blob([SLIDING_DOTS_REDUCED_MOTION_SVG_STRING], { type: 'image/svg+xml' })), [] ); useEffect(() => () => URL.revokeObjectURL(slidingDotsURL), [slidingDotsURL]); useEffect(() => () => URL.revokeObjectURL(slidingDotsReducedMotionURL), [slidingDotsReducedMotionURL]); const context = useMemo( () => Object.freeze({ urlStateMap: new Map([ ['sliding dots', Object.freeze([new URL(slidingDotsURL)])], ['sliding dots reduced-motion', Object.freeze([new URL(slidingDotsReducedMotionURL)])] ]) }), [slidingDotsURL, slidingDotsReducedMotionURL] ); return {children}; }); AssetComposer.displayName = 'AssetComposer'; export default AssetComposer;