Wrap a function and infer types

[rocky thicket]

Hi, I don't know if Im just having brain lag today or what it is. Im trying to do something very basic

I have this function from a lib, looks like this (but its a more advanced type)

function doSomething<G>(thing: G, otherThing: string): number

and I want to wrap this function and infer the types from the original function and still be able to use generics etc etc

const myWrappedFunction: typeof doSomething = (thing, otherThing) => {
  if (otherThing.length = 0) otherThing = "Hello World!"

  doSomething(thing, otherThing)
}

what am i missing here?

[hasty rain]

Your code works.

[ocean ravine]

nonspicyburrito#0

Playground Link

Preview:```ts
declare function doSomething<G>(
thing: G,
otherThing: string
): number

const myWrappedFunction: typeof doSomething = (
thing,
otherThing
) => {
if (otherThing.length === 0)
otherThing = "Hello World!"

return doSomething(thing, otherThing)
}```

You can choose specific lines to embed by selecting them before copying the link.

[hasty rain]

Make a TS playground reproduction.

[rocky thicket]

Hard to make ts playground reproduction when most of the type is from a lib

[frank bridge]

you can import the lib types in the playground

[rocky thicket]

interface CreateStyled {
  <C extends React.ComponentClass<React.ComponentProps<C>>, ForwardedProps extends keyof React.ComponentProps<C> &
      string = keyof React.ComponentProps<C> & string
  >(
    component: C,
    options: FilteringStyledOptions<React.ComponentProps<C>, ForwardedProps>
  ): CreateStyledComponent<
    Pick<PropsOf<C>, ForwardedProps> & {
      theme?: Theme
    },
    {},
    {
      ref?: React.Ref<InstanceType<C>>
    }
  >

  <C extends React.ComponentClass<React.ComponentProps<C>>>(
    component: C,
    options?: StyledOptions<React.ComponentProps<C>>
  ): CreateStyledComponent<
    PropsOf<C> & {
      theme?: Theme
    },
    {},
    {
      ref?: React.Ref<InstanceType<C>>
    }
  >

  <
    C extends React.ComponentType<React.ComponentProps<C>>,
    ForwardedProps extends keyof React.ComponentProps<C> &
      string = keyof React.ComponentProps<C> & string
  >(
    component: C,
    options: FilteringStyledOptions<React.ComponentProps<C>, ForwardedProps>
  ): CreateStyledComponent<
    Pick<PropsOf<C>, ForwardedProps> & {
      theme?: Theme
    }
  >

  <C extends React.ComponentType<React.ComponentProps<C>>>(
    component: C,
    options?: StyledOptions<React.ComponentProps<C>>
  ): CreateStyledComponent<
    PropsOf<C> & {
      theme?: Theme
    }
  >

  <
    Tag extends keyof JSX.IntrinsicElements,
    ForwardedProps extends keyof JSX.IntrinsicElements[Tag] &
      string = keyof JSX.IntrinsicElements[Tag] & string
  >(
    tag: Tag,
    options: FilteringStyledOptions<JSX.IntrinsicElements[Tag], ForwardedProps>
  ): CreateStyledComponent<
    { theme?: Theme; as?: React.ElementType },
    Pick<JSX.IntrinsicElements[Tag], ForwardedProps>
  >

  <Tag extends keyof JSX.IntrinsicElements>(
    tag: Tag,
    options?: StyledOptions<JSX.IntrinsicElements[Tag]>
  ): CreateStyledComponent<
    { theme?: Theme; as?: React.ElementType },
    JSX.IntrinsicElements[Tag]
  >
}```

[rocky thicket]

how?

[frank bridge]

just like in your source code

import { Something } from 'yourlib'

[ocean ravine]

fisknn#0

Playground Link

Preview:```ts
import React from "react"
import styled from "@emotion/styled"

const myWrappedFunction: typeof styled = (
component,
options
) => {
return styled(component, options)
}```

You can choose specific lines to embed by selecting them before copying the link.

[frank bridge]

https://github.com/emotion-js/emotion/blob/f3b268f7c52103979402da919c9c0dd3f9e0e189/packages/styled/src/index.js#L6-L13

[median nacelle]

const newStyled = styled.bind()

tags.forEach(tagName => {
  // $FlowFixMe: we can ignore this because its exposed type is defined by the CreateStyled type
  newStyled[tagName] = newStyled(tagName)
})

export default newStyled

[frank bridge]

its not just a function

might be easier with a Proxy?