Nested Typescript Map Value Type

Question

Similar to Nested Typescript Map Type but the nesting is on the "value" side.

Typescript Playground

const mapObjectObject: Map<string, string | Map<string, string>> = new Map(Object.entries({
    "a": "b",
    "c": new Map(Object.entries({
        "d": "e",
    }))
})); // ✓

const mapObjectMap: Map<string, string | Map<string, string>> = new Map(Object.entries({
    "a": "b",
    "c": new Map([
        ["d", "e"]
    ])
})); // ✓

const mapMapObject: Map<string, string | Map<string, string>> = new Map([
    ["a", "b"],
    ["c", new Map(Object.entries({
        "d": "e",
    }))
]); // ✗


const mapMapMap: Map<string, string | Map<string, string>> = new Map([
    ["a", "b"],
    ["c", new Map([
        ["d", "e"]
    ])]
]); // ✗

Why do the first two work, but the second two don't. They both error with:

  Overload 1 of 3, '(iterable: Iterable<readonly [string, string]>): Map<string, string>', gave the following error.
    Argument of type '([string, string] | [string, Map<string, string>])[]' is not assignable to parameter of type 'Iterable<readonly [string, string]>'.
      The types returned by '[Symbol.iterator]().next(...)' are incompatible between these types.
        Type 'IteratorResult<[string, string] | [string, Map<string, string>], any>' is not assignable to type 'IteratorResult<readonly [string, string], any>'.
          Type 'IteratorYieldResult<[string, string] | [string, Map<string, string>]>' is not assignable to type 'IteratorResult<readonly [string, string], any>'.
            Type 'IteratorYieldResult<[string, string] | [string, Map<string, string>]>' is not assignable to type 'IteratorYieldResult<readonly [string, string]>'.
              Type '[string, string] | [string, Map<string, string>]' is not assignable to type 'readonly [string, string]'.
                Type '[string, Map<string, string>]' is not assignable to type 'readonly [string, string]'.
                  Types of property '1' are incompatible.
                    Type 'Map<string, string>' is not assignable to type 'string'.
  Overload 2 of 3, '(entries?: readonly (readonly [string, string])[] | null | undefined): Map<string, string>', gave the following error.
    Type 'Map<string, string>' is not assignable to type 'string'.(2769)

and

No overload matches this call.
  Overload 1 of 3, '(iterable: Iterable<readonly [string, string]>): Map<string, string>', gave the following error.
    Argument of type '([string, string] | [string, Map<string, string>])[]' is not assignable to parameter of type 'Iterable<readonly [string, string]>'.
  Overload 2 of 3, '(entries?: readonly (readonly [string, string])[] | null | undefined): Map<string, string>', gave the following error.
    Type 'Map<string, string>' is not assignable to type 'string'.(2769)

Respectively. Removing the type declaration doesn't help either. Inferred types also have the same error.

Answer 1

You should give a hint to TS about types:

const mapMapObject = new Map<string, string | Map<string, string>>([
    ["a", "b"],
    ["c", new Map(Object.entries({
        "d": "e",
    }))
]]);

const mapMapMap = new Map<string, string | Map<string, string>>([
    ["a", "b"],
    ["c", new Map([
        ["d", "e"]
    ])]
]);