Is it possible to generate type definitions for inner classes?

Question

Is it possible to generate type definitions for inner classes?

I'm currently exploring the usage of TypeScript within a Salesforce project involving RemoteObject

One challenge I'm facing is creating typings for the external JavaScript object syntax.

For example, in JavaScript:

var ct = new RemoteObjectModel.Contact({
    FirstName: "Aldo",
    LastName: "Michaels",
    Phone: "(415) 555-1212"
});

The stumbling block lies in new RemoteObjectModel.Contact(). How can I define an interface for this?

Below is a snippet of the code I'm attempting to compile:

import React from 'react'
import ReactDOM from 'react-dom'

declare module RemoteObjectModel {
   export class Account implements IRemoteObject {
       constructor();
       get;
       set;
   }
}

interface IRemoteObject{
    get(field: string): any;
    set(field: string, value: string): any;
}

interface IAppProps{
    remoteObjectModel: RemoteObjectModel
}

export class App extends React.Component<IAppProps, {}>{
    public state : IAppState;

    constructor(props : IAppProps) {
        super(props);

        this.state = {
            accounts: 0
        };
    }

    public render(){
        let account: IRemoteObject = new this.props.remoteObjectModel.Account({
            Name : 'hello!',
            Active : true
        });
        console.log(account);
        return (
            <div>
                New Accounts: {this.state.accounts}
                Account: {account.get('Name')}
            </div>
        )
    }
}

//set on the global state
declare var remoteObjectModel : IRemoteObjectModel;

ReactDOM.render(<App remoteObjectModel={remoteObjectModel} />, document.getElementById('app'));

However, there's an issue with IAppProps:

message: 'Cannot find name 'RemoteObjectModel'.'

I'm also uncertain if my question title accurately reflects the problem (please update as needed!)

typescript typescript-typings

Answer 1

Answer №1

If the class RemoteObjectModel is already defined, you cannot nest another class like Contact within it.

However, with TypeScript's feature of declaration merging, you can create a namespace named RemoteObjectModel alongside the class (or interface) of the same name. Within this namespace, you can then define the class Contact (remember to export it for visibility outside the namespace).

This approach allows TypeScript to differentiate between the standalone use of RemoteObjectModel referring to the class and RemoteObjectModel.something referring to the namespace.

An example implementation would look something like this:

class RemoteObjectModel {
    someProperty: string;
    constructor() {
        this.someProperty = 'someValue';
    }
}

namespace RemoteObjectModel {

    export class Contact {
        FirstName: string;
        LastName: string;
        Phone: string;

        constructor(values: ContactProperties) {
            Object.assign(this, values);
        }
    }
}

interface ContactProperties {
    FirstName: string;
    LastName: string;
    Phone: string;
}

var ct = new RemoteObjectModel.Contact({
    FirstName: "Aldo",
    LastName: "Michaels",
    Phone: "(415) 555-1212"
});

You can also define a constructor signature in the RemoveObjectModel class to enable calling new remoteObjectModel.Contact() as if Contact is defined on the instance too:

class RemoteObjectModel {
    someProperty: string;
    Contact: {new(p: ContactProperties): RemoteObjectModel.Contact}
}

namespace RemoteObjectModel {

    export class Contact {
        FirstName: string;
        LastName: string;
        Phone: string;

        constructor(values: ContactProperties) {
            Object.assign(this, values);
        }
    }
}

interface ContactProperties {
    FirstName: string;
    LastName: string;
    Phone: string;
}

const remoteObjectModel = new RemoteObjectModel();

var c2 = new remoteObjectModel.Contact({
    FirstName: "Aldo",
    LastName: "Michaels",
    Phone: "(415) 555-1212"
});

Alternatively, you can declare an instance property Contact typed as the 'static part' of the Contact class (usable as a constructor), using typeof Contact:

class RemoteObjectModel {
    someProperty: string;
    Contact: typeof RemoteObjectModel.Contact
    constructor() {
        this.Contact = RemoteObjectModel.Contact;
    }
}

Answer 2

If the class RemoteObjectModel is already defined, you cannot nest another class like Contact within it.

However, with TypeScript's feature of declaration merging, you can create a namespace named RemoteObjectModel alongside the class (or interface) of the same name. Within this namespace, you can then define the class Contact (remember to export it for visibility outside the namespace).

This approach allows TypeScript to differentiate between the standalone use of RemoteObjectModel referring to the class and RemoteObjectModel.something referring to the namespace.

An example implementation would look something like this:

class RemoteObjectModel {
    someProperty: string;
    constructor() {
        this.someProperty = 'someValue';
    }
}

namespace RemoteObjectModel {

    export class Contact {
        FirstName: string;
        LastName: string;
        Phone: string;

        constructor(values: ContactProperties) {
            Object.assign(this, values);
        }
    }
}

interface ContactProperties {
    FirstName: string;
    LastName: string;
    Phone: string;
}

var ct = new RemoteObjectModel.Contact({
    FirstName: "Aldo",
    LastName: "Michaels",
    Phone: "(415) 555-1212"
});

You can also define a constructor signature in the RemoveObjectModel class to enable calling new remoteObjectModel.Contact() as if Contact is defined on the instance too:

class RemoteObjectModel {
    someProperty: string;
    Contact: {new(p: ContactProperties): RemoteObjectModel.Contact}
}

namespace RemoteObjectModel {

    export class Contact {
        FirstName: string;
        LastName: string;
        Phone: string;

        constructor(values: ContactProperties) {
            Object.assign(this, values);
        }
    }
}

interface ContactProperties {
    FirstName: string;
    LastName: string;
    Phone: string;
}

const remoteObjectModel = new RemoteObjectModel();

var c2 = new remoteObjectModel.Contact({
    FirstName: "Aldo",
    LastName: "Michaels",
    Phone: "(415) 555-1212"
});

Alternatively, you can declare an instance property Contact typed as the 'static part' of the Contact class (usable as a constructor), using typeof Contact:

class RemoteObjectModel {
    someProperty: string;
    Contact: typeof RemoteObjectModel.Contact
    constructor() {
        this.Contact = RemoteObjectModel.Contact;
    }
}

Is it possible to generate type definitions for inner classes?

Answer №1

Similar questions

Guide on successfully importing a pretrained model in Angular using TensorFlow.js

Enhancing Javascript performance with the power of the V8 engine and Typescript

Is it possible for Typescript interface A to extend B while lacking certain properties from B?

Broadening Cypress.config by incorporating custom attributes using Typescript

There was an error parsing the data from the specified URL (http://localhost:8000/src/client/assets/data.json

Using the *ngFor directive within an <ng-container> element and wrapping it in an <ng-template> is a great way to dynamically display various data in

What is it about Typescript's "typeof function" that meets the Generic Condition of "extends (...args: any[]) => any"?

Import TypeScript files with RequireJS

Encountering the error "No overload matches this call" while utilizing useQuery in TypeScript may indicate a mismatch in function parameters

Updating Dropdown Selection in Angular 9 and 10

Adjusting the background opacity when the sidebar is open in a React + Typescript project

Using react-google-charts to create visually appealing dual-Y stacked bar charts

Encountering an error when attempting to access undefined property while using a method as a callback

When Typescript compiles to JavaScript, it may result in code that appears to be a function

Encountering a failure in the NativeScript 2.0 [1.7.1] build specifically at the 'processF0DebugResources' stage when including gulp dependencies in the 'devDependencies' section

error TS2559: The type 'BookInterface[]' does not share any properties with the type 'BookInterface'

Navigating VSCode for Correct Import Setup

What is the best way to transpile TypeScript within the Astro framework?

Error: AppModule requires an array of arguments in order to function properly

Converting JSON Arrays into Typed Arrays in NativeScript using Typescript