Explanation below in comment

emotion_ts.ts

import { Omit, Overwrapped } from '@emotion/styled-base/types/helper';

import { Interpolation } from '@emotion/serialize';

import { WithTheme, StyledComponent } from '@emotion/styled-base';

// -------
//  This is just to shush the compiler
type Theme = {};
type InnerProps = {};
type ReactClassPropKeys = {};
type StyleProps = {};
// type ExtraProps = {}; // only used in default value, kept for sake of accuracy
// -------




type WrappedProps = Overwrapped<InnerProps, StyleProps>;
type OmitType = Omit<WrappedProps, ReactClassPropKeys>;
// default value is = Omit<InnerProps & ExtraProps, ReactClassPropKeys>;

type AThemedObject = WithTheme<StyleProps, Theme>;
type InterpolatedThemedItems = Interpolation<AThemedObject>;
type AnArrayOfInterpolatedStyledObjects = Array<InterpolatedThemedItems>;

type CanonicalSC = StyledComponent<InnerProps, StyleProps, Theme>;

//  -- this next ExtendType isn't a real typedef, but cleans it up
//      hence doing it commented out. (sorry)
// type ExtendType = InnerProps, ExtraProps, Theme extends object;

// CreateStyledComponentBase<ExtendType>;
export interface ReallyLongTypeName {
  // ====== OVERLOAD 1 ====================
  /*
    in scope:
    some StyleProps type, such that StyleProps extends OmitType as defined above
    e.g., props which do NOT include WrappedProps, ReactClassPropKeys

    so, we know this is a type that we're aware of.
  */
  <StyleProps extends OmitType>
  // ------ actual sig starts here, with generic above in scope. -----
  //       the naked parens means we're actually describing a function
  //   ARGUMENTS = styles
  //   RETURNS = a styled component.
  (...styles: AnArrayOfInterpolatedStyledObjects): CanonicalSC
  // ====== END OVERLOAD 1 ==================

  // ====== OVERLOAD 2 ====================
  <StyleProps extends OmitType>
  // second verse same as the first
  (
    template: TemplateStringsArray,
    ...styles: AnArrayOfInterpolatedStyledObjects
  ): CanonicalSC
  // ====== END OVERLOAD 2 ==================
}

const bob: ReallyLongTypeName = () => null as unknown as StyledComponent<InnerProps, StyleProps, Theme>;

So, the issue is that since TS can't deduce the most specific type of baseStyles from the original repo, it widens the type, which means it picks a more permissive type.

The more permissive type is NOT the allowed type of the first overload spread argument array.

As a result, the compiler moves on to the second overload -- which is a tagged template function. The baseStyles object DEFINITELY is not a TemplateStringArray, hence the error.

I'd assume this means that the types which do count as being valid in my long-named AnArrayOfInterpolatedStyledObjects does NOT include the borderTopStyle key and a number of others, hence the erratic failure.

If you change the originally erroring line from this:

const NotWorkingDivider = styled.hr(baseStyles);

to this:

const NotWorkingDivider = styled.hr`${baseStyles}`;

you get this error instead:

Argument of type '{ borderTopStyle: string; }' is not assignable to parameter of type 'Interpolation<Pick<DetailedHTMLProps<HTMLAttributes, HTMLHRElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | ... 246 more ... | "onTransitionEndCapture"> & { ...; }>'.

Type '{ borderTopStyle: string; }' is not assignable to type 'ObjectInterpolation<Pick<DetailedHTMLProps<HTMLAttributes, HTMLHRElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | ... 246 more ... | "onTransitionEndCapture"> & { ...; }>'.

Types of property 'borderTopStyle' are incompatible.

Type 'string' is not assignable to type '"hidden" | "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "dashed" | "dotted" | "double" | "groove" | "inset" | "outset" | "ridge" | "solid" | BorderBottomStyleProperty[]'.