diff --git a/package.json b/package.json index 4e8a485..a9bee73 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@rbxts/zenui-core", - "version": "0.6.2", + "version": "0.6.3", "description": "", "main": "out/init.lua", "scripts": { diff --git a/src/Controllers/PageController.tsx b/src/Controllers/PageController.tsx index a6f706a..c667524 100644 --- a/src/Controllers/PageController.tsx +++ b/src/Controllers/PageController.tsx @@ -52,7 +52,7 @@ export class PageController extends Roact.PureComponent (this.page = page)} diff --git a/src/Controllers/TabController.tsx b/src/Controllers/TabController.tsx index 3dc4379..399d0b8 100644 --- a/src/Controllers/TabController.tsx +++ b/src/Controllers/TabController.tsx @@ -2,12 +2,21 @@ import Roact from "@rbxts/roact"; import { ComponentLike, InferEnumNames, InferProps } from "../Utility/Types"; import { View } from "../Views/View"; +export interface SortableTabProps { + readonly TabIndex: number; +} + export interface TabControllerRenderRequest

{ /** * The properties for this tab item */ readonly TabItem: P; + /** + * The layout order of this tab + */ + readonly LayoutOrder: number; + /** * Whether or not this particular tab is considered active */ @@ -18,7 +27,7 @@ export interface TabControllerRenderRequest

{ readonly TabClickDelegate: () => void; } -export interface TabControllerRenderContainerRequests { +export interface TabControllerRenderContainerRequests> { /** * The tab components passed into the tab controller */ @@ -35,10 +44,12 @@ export interface TabControllerRenderContainerRequests; } -interface TabControllerDefaultProps {} +interface TabControllerDefaultProps { + readonly TabSortOrder: InferEnumNames | Enum.SortOrder; +} -export interface TabControllerProps - extends TabControllerDefaultProps { +export interface TabControllerProps> + extends TabControllerDefaultProps { /** * The size of the tab controller */ @@ -87,6 +98,10 @@ export interface TabControllerProps export class TabController extends Roact.PureComponent< TabControllerProps > { + public static defaultProps: TabControllerDefaultProps = { + TabSortOrder: "LayoutOrder", + }; + public render() { const elements = new Map(); @@ -100,10 +115,13 @@ export class TabController extends Roac // If tab view, we'll render as a tab if (child.component === this.props.TabComponent) { const currTabIndex = tabIndex; + const currTabProps = child.props as SortableTabProps; + elements.set( key, this.props.RenderTabItem({ - TabItem: child.props as InferProps, + LayoutOrder: currTabProps.TabIndex, + TabItem: currTabProps as InferProps, TabClickDelegate: () => this.props.OnTabClicked(currTabIndex, child.props as InferProps), IsActive: this.props.SelectedTabIndex === tabIndex, @@ -123,7 +141,11 @@ export class TabController extends Roac } else { return ( - + {children} {elements}