[Suggestion]: Provide types for use with roblox-ts

[AdamRaichu]

I'm a relatively new Roblox developer, and I have much more experience with JavaScript than Lua, so I've been using roblox-ts. If you provide types for Lua modules, you can integrate more easily with the typescript files of your project. I have already made a simple types file with no in-built documentation, (and can will likely make a PR soon that includes it), but I would love to have help in order to get all of the parameter types correct.

(Making this issue as per the contributing guide.)

Docs: Using Existing Lua | roblox-ts

This would also be a good opportunity to double check the accuracy of the documentation, because I've already found at least one error (see #128).

Edit: I'm going to be unavailable for the next 4 weeks, but am happy to answer any questions you have after that / respond to any discussion here.

[AdamRaichu]

I just found out about grilme99's port of this module. I still think it would be useful to use mine as it doesn't change any of the functionality like his does (see https://github.com/grilme99/TopbarPlus/tree/main/src#readme).

Here is my index.d.ts file.

/**
 * Typings for TopbarPlus v3, by AdamRaichu
 *
 * For use with roblox-ts.
 */

// Apparently is a reimplementation of RBXScriptSignal, see Packages/GoodSignal.lua
type GoodSignal = RBXScriptSignal;

type IconState = "Deselected" | "Selected" | "Viewing";

declare class Icon {
  // Functions
  getIcons(this: void): {
    [UID: string]: Icon;
  };
  getIcon(this: void, nameOrUID: string): Icon;
  setTopbarEnabled(this: void, bool: boolean): void;
  modifyBaseTheme(this: void, modifications: Array<unknown> | Array<Array<unknown>>): void;
  setDisplayOrder(this: void, integer: number): void;

  // Properties
  readonly name: string;
  readonly isSelected: boolean;
  // Different from the docs, but this is what the code says. See init.lua:299
  readonly isEnabled: boolean;
  readonly totalNotices: number;
  readonly locked: boolean;

  // Events
  readonly selected: GoodSignal;
  readonly deselected: GoodSignal;
  readonly toggled: GoodSignal;
  readonly viewingStarted: GoodSignal;
  readonly viewingEnded: GoodSignal;
  readonly notified: GoodSignal;

  constructor();

  // Methods
  setName(this: Icon, name: string): Icon;
  getInstance(this: Icon, instanceName: string): Instance;
  modifyTheme(this: Icon, modifications: Array<unknown> | Array<Array<unknown>>): Icon;
  modifyChildTheme(this: Icon, modifications: Array<unknown> | Array<Array<unknown>>): Icon;
  setEnabled(this: Icon, bool: boolean): Icon;
  select(this: Icon): Icon;
  deselect(this: Icon): Icon;
  notify(this: Icon, clearNoticeEvent: GoodSignal | BindableEvent): Icon;
  clearNotices(this: Icon): Icon;
  disableOverlay(this: Icon, bool: boolean): Icon;
  setImage(this: Icon, imageId: unknown /* string | number ?*/, iconState: IconState): Icon;
  setLabel(this: Icon, text: string, iconState: IconState): Icon;
  setOrder(this: Icon, order: number, iconState: IconState): Icon;
  setCornerRadius(this: Icon, scale: number, offset: number, iconState: IconState): Icon;
  align(this: Icon, alignment: "Left" | "Center" | "Right"): Icon;
  setWidth(this: Icon, minimumSize: number, iconState: IconState): Icon;
  setImageScale(this: Icon, number: number, iconState: IconState): Icon;
  setImageRatio(this: Icon, number: number, iconState: IconState): Icon;
  setTextSize(this: Icon, number: number, iconState: IconState): Icon;
  setTextFont(
    this: Icon,
    font: string | number | Enum.Font,
    fontWeight: Enum.FontWeight,
    fontStyle: Enum.FontStyle,
    iconState: IconState,
  ): Icon;
  bindToggleItem(this: Icon, guiObjectOrLayerCollector: GuiObject | LayerCollector): Icon;
  unbindToggleItem(this: Icon, guiObjectOrLayerCollector: GuiObject | LayerCollector): Icon;
  bindEvent(this: Icon, iconEventName: string, callback: (self: Icon, ...args: unknown[]) => void): Icon;
  unbindEvent(this: Icon, iconEventName: string): Icon;
  bindToggleKey(this: Icon, keyCodeEnum: Enum.KeyCode): Icon;
  unbindToggleKey(this: Icon, keyCodeEnum: Enum.KeyCode): Icon;
  call(this: Icon, func: (self: Icon) => void): Icon;
  // FIXME: I don't know what this is.
  addToJanitor(this: Icon, userdata: unknown): Icon;
  lock(this: Icon): Icon;
  unlock(this: Icon): Icon;
  debounce(this: Icon, seconds: number): Icon;
  autoDeselect(this: Icon, bool: boolean): Icon;
  oneClick(this: Icon, bool: boolean): Icon;
  setCaption(this: Icon, text: string): Icon;
  setCaptionHint(this: Icon, keyCodeEnum: Enum.KeyCode): Icon;
  setDropdown(this: Icon, icons: Array<Icon>): Icon;
  joinDropdown(this: Icon, parentIcon: Icon): Icon;
  setMenu(this: Icon, icons: Array<Icon>): Icon;
  joinMenu(this: Icon, parentIcon: Icon): Icon;
  leave(this: Icon): Icon;
  destroy(this: Icon): Icon;
}

export = Icon;

[christopher-buss]

Grilme99's version of topbar plus is using a very outdated version of top bar. For the latest roblox-ts version, you can view it here: https://www.npmjs.com/package/@rbxts/topbar-plus

[AdamRaichu]

Grilme99's version of topbar plus is using a very outdated version of top bar. For the latest roblox-ts version, you can view it here: npmjs.com/package/@rbxts/topbar-plus

Oh.

[christopher-buss]

This isn't an official package, but wad does actively maintain the typings so if there's any issues you're free to make a PR to get it sorted.