diff --git a/.eslintrc b/.eslintrc index d7d0de7..a5b9dc3 100644 --- a/.eslintrc +++ b/.eslintrc @@ -27,7 +27,6 @@ "@typescript-eslint/no-empty-function": "error", "@typescript-eslint/no-empty-interface": "error", "@typescript-eslint/no-namespace": "error", - "@typescript-eslint/no-non-null-assertion": "warn", "@typescript-eslint/no-unused-vars": [ "warn", { diff --git a/package.json b/package.json index 606d177..4fef381 100644 --- a/package.json +++ b/package.json @@ -34,6 +34,7 @@ "dependencies": { "@rbxts/character-promise": "^1.0.2", "@rbxts/log": "^0.6.3", + "@rbxts/make": "^1.0.6", "@rbxts/matter": "^0.6.2-ts.6", "@rbxts/plasma": "^0.4.1-ts.1", "@rbxts/reflex": "^4.2.0", diff --git a/src/ReplicatedStorage/ecs/index.ts b/src/ReplicatedStorage/ecs/index.ts index 6c51ee9..3d80d9e 100644 --- a/src/ReplicatedStorage/ecs/index.ts +++ b/src/ReplicatedStorage/ecs/index.ts @@ -6,7 +6,7 @@ import { Host } from "ReplicatedStorage/hosts" import { tags } from "./boundTags" import { Model } from "./components" import { start as startReplication, stop as stopReplication } from "./replication" -import { clientState, serverState } from "./state" +import { ClientState, ServerState } from "./state" import { start as startSystems, stop as stopSystems } from "./systems" import { start as startTags, stop as stopTags } from "./tags" @@ -45,13 +45,13 @@ export function start(host: Host, state: S): [World, S] { }) if (host === Host.All || host === Host.Server) { - const ServerState = state as serverState + const ServerState = state as ServerState startTags(world, tags, ServerState) } if (host === Host.All || host === Host.Client) { - const ClientState = state as clientState + const ClientState = state as ClientState startReplication(world, ClientState) diff --git a/src/ReplicatedStorage/ecs/replication.ts b/src/ReplicatedStorage/ecs/replication.ts index 6b2184b..fd7804f 100644 --- a/src/ReplicatedStorage/ecs/replication.ts +++ b/src/ReplicatedStorage/ecs/replication.ts @@ -1,7 +1,7 @@ import { AnyEntity, World } from "@rbxts/matter" import { waitForEvent } from "ReplicatedStorage/remotes" import * as Components from "./components" -import { clientState } from "./state" +import { ClientState } from "./state" type ComponentNames = keyof typeof Components type ComponentConstructors = (typeof Components)[ComponentNames] @@ -14,7 +14,7 @@ let connection: RBXScriptConnection | undefined * @param world - The world to replicate components in * @param client - The client state for the ECS */ -export function start(world: World, client: clientState): void { +export function start(world: World, client: ClientState): void { if (connection) return const replicationEvent = waitForEvent("EcsReplication") diff --git a/src/ReplicatedStorage/ecs/state.ts b/src/ReplicatedStorage/ecs/state.ts index c536d91..f1a4d21 100644 --- a/src/ReplicatedStorage/ecs/state.ts +++ b/src/ReplicatedStorage/ecs/state.ts @@ -7,7 +7,7 @@ import { InputKind } from "ReplicatedStorage/inputKind" /** * The client ECS state. */ -export class clientState { +export class ClientState { constructor( player: Player, character: CharacterRigR6, @@ -41,7 +41,7 @@ export class clientState { /** * The server ECS state. */ -export class serverState { +export class ServerState { constructor( logger: Logger ) { @@ -54,4 +54,4 @@ export class serverState { /** * The shared ECS state. */ -export type sharedState = serverState & clientState \ No newline at end of file +export type SharedState = ServerState & ClientState \ No newline at end of file diff --git a/src/ReplicatedStorage/ecs/systems/client/customReset.ts b/src/ReplicatedStorage/ecs/systems/client/customReset.ts index e4dcaeb..2a55d91 100644 --- a/src/ReplicatedStorage/ecs/systems/client/customReset.ts +++ b/src/ReplicatedStorage/ecs/systems/client/customReset.ts @@ -1,6 +1,6 @@ import { World, useEvent } from "@rbxts/matter" import { StarterGui } from "@rbxts/services" -import { clientState } from "ReplicatedStorage/ecs/state" +import { ClientState } from "ReplicatedStorage/ecs/state" import { getEvent } from "ReplicatedStorage/remotes" const resetButtonCallback = new Instance("BindableEvent") @@ -8,7 +8,7 @@ StarterGui.SetCore("ResetButtonCallback", resetButtonCallback) getEvent("resetButton") -function customReset(_: World, _client: clientState): void { +function customReset(_: World, _client: ClientState): void { const resetButtonEvent = getEvent("resetButton") for (const [,] of useEvent(resetButtonCallback, "Event")) { resetButtonEvent.FireServer() diff --git a/src/ReplicatedStorage/ecs/systems/client/inputMapper.ts b/src/ReplicatedStorage/ecs/systems/client/inputMapper.ts index e72099b..991e117 100644 --- a/src/ReplicatedStorage/ecs/systems/client/inputMapper.ts +++ b/src/ReplicatedStorage/ecs/systems/client/inputMapper.ts @@ -1,10 +1,10 @@ import { useDeltaTime, useEvent, useThrottle, World } from "@rbxts/matter" import { UserInputService } from "@rbxts/services" -import { clientState } from "ReplicatedStorage/ecs/state" +import { ClientState } from "ReplicatedStorage/ecs/state" import { InputKind } from "ReplicatedStorage/inputKind" let holdDuration = 0 -function inputMapper(_: World, client: clientState): void { +function inputMapper(_: World, client: ClientState): void { for (const [, input, gpe] of useEvent(UserInputService, "InputBegan")) { if (gpe) return undefined if (input.KeyCode !== Enum.KeyCode.Unknown) { diff --git a/src/ReplicatedStorage/ecs/systems/client/sprint.ts b/src/ReplicatedStorage/ecs/systems/client/sprint.ts index 4cf41b0..8df1a1a 100644 --- a/src/ReplicatedStorage/ecs/systems/client/sprint.ts +++ b/src/ReplicatedStorage/ecs/systems/client/sprint.ts @@ -1,8 +1,8 @@ import { World } from "@rbxts/matter" import { match } from "@rbxts/variant" -import { clientState } from "ReplicatedStorage/ecs/state" +import { ClientState } from "ReplicatedStorage/ecs/state" -function sprint(_: World, client: clientState): void { +function sprint(_: World, client: ClientState): void { if (client.lastProcessedCommand !== undefined) { match(client.lastProcessedCommand, { KeyDown: ({ key }) => { diff --git a/src/ReplicatedStorage/ecs/tags.ts b/src/ReplicatedStorage/ecs/tags.ts index c71047c..51200ad 100644 --- a/src/ReplicatedStorage/ecs/tags.ts +++ b/src/ReplicatedStorage/ecs/tags.ts @@ -2,7 +2,7 @@ import { AnyEntity, Component, World } from "@rbxts/matter" import { CollectionService } from "@rbxts/services" import { getIdAttribute } from "ReplicatedStorage/idAttribute" import { Model, Transform } from "./components" -import { serverState } from "./state" +import { ServerState } from "./state" export type ComponentConstructor = () => Component @@ -17,7 +17,7 @@ const connections: RBXScriptConnection[] = [] export function start( world: World, bound: ReadonlyMap>, - server: serverState + server: ServerState ): void { function spawnBound( instance: Instance, diff --git a/src/ReplicatedStorage/reflex/uiStore/hooks/useRootProducer.ts b/src/ReplicatedStorage/reflex/uiStore/hooks/useRootProducer.ts deleted file mode 100644 index f64d7e8..0000000 --- a/src/ReplicatedStorage/reflex/uiStore/hooks/useRootProducer.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { UseProducerHook, useProducer } from "@rbxts/roact-reflex" -import { rootProducer } from "../producer" - -export const useRootProducer: UseProducerHook = useProducer \ No newline at end of file diff --git a/src/ReplicatedStorage/reflex/uiStore/producer/index.ts b/src/ReplicatedStorage/reflex/uiStore/producer/index.ts deleted file mode 100644 index 2646565..0000000 --- a/src/ReplicatedStorage/reflex/uiStore/producer/index.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { InferDispatchers, InferState, combineProducers, loggerMiddleware } from "@rbxts/reflex" - -export type rootProducer = typeof producer -export type rootState = InferState -export type rootDispatchers = InferDispatchers - -export const producer = combineProducers({ - -}).applyMiddleware(loggerMiddleware) \ No newline at end of file diff --git a/src/ReplicatedStorage/ui/components/acrylic/acrylicInstance.tsx b/src/ReplicatedStorage/ui/components/acrylic/acrylicInstance.tsx new file mode 100644 index 0000000..1b87930 --- /dev/null +++ b/src/ReplicatedStorage/ui/components/acrylic/acrylicInstance.tsx @@ -0,0 +1,77 @@ +import Make from "@rbxts/make" + +export type AcrylicInstance = Model & { + Horizontal: Part & { Mesh: SpecialMesh } + Vertical: Part & { Mesh: SpecialMesh } + TopLeft: Part & { Mesh: SpecialMesh } + TopRight: Part & { Mesh: SpecialMesh } + BottomLeft: Part & { Mesh: SpecialMesh } + BottomRight: Part & { Mesh: SpecialMesh } +} + +const fill = { + Color: new Color3(0, 0, 0), + Material: Enum.Material.Glass, + Size: new Vector3(1, 1, 0), + Anchored: true, + CanCollide: false, + Locked: true, + CastShadow: false, + Transparency: 0.999 +} + +const corner = { + Color: new Color3(0, 0, 0), + Material: Enum.Material.Glass, + Size: new Vector3(0, 1, 1), + Anchored: true, + CanCollide: false, + Locked: true, + CastShadow: false, + Transparency: 0.999 +} + +export const acrylicInstance = Make("Model", { + Children: [ + Make("Part", { + Name: "Horizontal", + Children: [ + Make("SpecialMesh", { + MeshType: Enum.MeshType.Brick, + Offset: new Vector3(0, 0, -0.000001) + }) + ], + ...fill + }), + Make("Part", { + Name: "Vertical", + Children: [ + Make("SpecialMesh", { + MeshType: Enum.MeshType.Brick, + Offset: new Vector3(0, 0, 0.000001) + }) + ], + ...fill + }), + Make("Part", { + Name: "TopRight", + Children: [Make("SpecialMesh", { MeshType: Enum.MeshType.Cylinder })], + ...corner + }), + Make("Part", { + Name: "TopLeft", + Children: [Make("SpecialMesh", { MeshType: Enum.MeshType.Cylinder })], + ...corner + }), + Make("Part", { + Name: "BottomRight", + Children: [Make("SpecialMesh", { MeshType: Enum.MeshType.Cylinder })], + ...corner + }), + Make("Part", { + Name: "BottomLeft", + Children: [Make("SpecialMesh", { MeshType: Enum.MeshType.Cylinder })], + ...corner + }) + ] +}) as AcrylicInstance \ No newline at end of file diff --git a/src/ReplicatedStorage/ui/components/acrylic/index.tsx b/src/ReplicatedStorage/ui/components/acrylic/index.tsx new file mode 100644 index 0000000..e59eaa1 --- /dev/null +++ b/src/ReplicatedStorage/ui/components/acrylic/index.tsx @@ -0,0 +1,164 @@ +import Roact from "@rbxts/roact" +import { useEffect, useCallback, useMemo, useMutable } from "@rbxts/roact-hooked" +import { acrylicInstance } from "./acrylicInstance" +import { Lighting, Workspace } from "@rbxts/services" +import Make from "@rbxts/make" + +const cylinderAngleOffset = CFrame.Angles(0, math.rad(90), 0) + +function viewportPointToWorld(location: Vector2, distance: number): Vector3 { + const unitRay = Workspace.CurrentCamera!.ScreenPointToRay(location.X, location.Y) + return unitRay.Origin.add(unitRay.Direction.mul(distance)) +} + +function map(n: number, min0: number, max0: number, min1: number, max1: number): number { + return min1 + ((n - min0) * (max1 - min1)) / (max0 - min0) +} + +function getOffset(): number { + return map(Workspace.CurrentCamera!.ViewportSize.Y, 0, 2560, 8, 56) +} + +interface acrylicProps extends Roact.JsxInstanceProperties { + radius: number + distance: number + + Event?: Roact.JsxInstanceEvents + Change?: Roact.JsxInstanceChangeEvents +} + +function acrylic(props: acrylicProps): Roact.Element { + const { radius, distance } = props + + const spreadableProps = { ...props } as Partial + delete spreadableProps.radius + delete spreadableProps.distance + + const frameInfo = useMutable({ + topleft2d: new Vector2(), + topright2d: new Vector2(), + bottomright2d: new Vector2(), + topleftradius2d: new Vector2() + }) + + const acrylic = useMemo(() => { + const clone = acrylicInstance.Clone() + clone.Parent = Workspace + return clone + }, []) + + useEffect(() => { + return () => acrylic.Destroy() + }, []) + + const updateFrameInfo = useCallback( + (size: Vector2, position: Vector2) => { + const topleftRaw = position.sub(size.div(2)) + const info = frameInfo.current + + info.topleft2d = new Vector2(math.ceil(topleftRaw.X), math.ceil(topleftRaw.Y)) + info.topright2d = info.topleft2d.add(new Vector2(size.X, 0)) + info.bottomright2d = info.topleft2d.add(size) + info.topleftradius2d = info.topleft2d.add(new Vector2(radius, 0)) + }, + [distance, radius] + ) + + const updateInstance = useCallback(() => { + const { topleft2d, topright2d, bottomright2d, topleftradius2d } = frameInfo.current + + const topleft = viewportPointToWorld(topleft2d, distance) + const topright = viewportPointToWorld(topright2d, distance) + const bottomright = viewportPointToWorld(bottomright2d, distance) + const topleftradius = viewportPointToWorld(topleftradius2d, distance) + + const cornerRadius = topleftradius.sub(topleft).Magnitude + const width = topright.sub(topleft).Magnitude + const height = topright.sub(bottomright).Magnitude + + const center = CFrame.fromMatrix( + topleft.add(bottomright).div(2), + Workspace.CurrentCamera!.CFrame.XVector, + Workspace.CurrentCamera!.CFrame.YVector, + Workspace.CurrentCamera!.CFrame.ZVector + ) + + if (radius !== undefined && radius > 0) { + acrylic.Horizontal.CFrame = center + acrylic.Horizontal.Mesh.Scale = new Vector3(width - cornerRadius * 2, height, 0) + acrylic.Vertical.CFrame = center + acrylic.Vertical.Mesh.Scale = new Vector3(width, height - cornerRadius * 2, 0) + } else { + acrylic.Horizontal.CFrame = center + acrylic.Horizontal.Mesh.Scale = new Vector3(width, height, 0) + } + + if (radius !== undefined && radius > 0) { + acrylic.TopLeft.CFrame = center + .mul(new CFrame(-width / 2 + cornerRadius, height / 2 - cornerRadius, 0)) + .mul(cylinderAngleOffset) + acrylic.TopLeft.Mesh.Scale = new Vector3(0, cornerRadius * 2, cornerRadius * 2) + + acrylic.TopRight.CFrame = center + .mul(new CFrame(width / 2 - cornerRadius, height / 2 - cornerRadius, 0)) + .mul(cylinderAngleOffset) + acrylic.TopRight.Mesh.Scale = new Vector3(0, cornerRadius * 2, cornerRadius * 2) + + acrylic.BottomLeft.CFrame = center + .mul(new CFrame(-width / 2 + cornerRadius, -height / 2 + cornerRadius, 0)) + .mul(cylinderAngleOffset) + acrylic.BottomLeft.Mesh.Scale = new Vector3(0, cornerRadius * 2, cornerRadius * 2) + + acrylic.BottomRight.CFrame = center + .mul(new CFrame(width / 2 - cornerRadius, -height / 2 + cornerRadius, 0)) + .mul(cylinderAngleOffset) + acrylic.BottomRight.Mesh.Scale = new Vector3(0, cornerRadius * 2, cornerRadius * 2) + } + }, [radius, distance]) + + useEffect(() => { + updateInstance() + + const posHandle = Workspace.CurrentCamera!.GetPropertyChangedSignal("CFrame").Connect(updateInstance) + const fovHandle = Workspace.CurrentCamera!.GetPropertyChangedSignal("FieldOfView").Connect(updateInstance) + const viewportHandle = Workspace.CurrentCamera!.GetPropertyChangedSignal("ViewportSize").Connect(updateInstance) + + Make("DepthOfFieldEffect", { + FarIntensity: 0, + InFocusRadius: 0.1, + NearIntensity: 1, + Parent: Lighting + }) + + return () => { + posHandle.Disconnect() + fovHandle.Disconnect() + viewportHandle.Disconnect() + } + }, [updateInstance]) + + return ( + { + const blurOffset = getOffset() + const size = rbx.AbsoluteSize.sub(new Vector2(blurOffset, blurOffset)) + const position = rbx.AbsolutePosition.add(rbx.AbsoluteSize.div(2)) + updateFrameInfo(size, position) + task.spawn(updateInstance) + }, + AbsolutePosition: (rbx): void => { + const blurOffset = getOffset() + const size = rbx.AbsoluteSize.sub(new Vector2(blurOffset, blurOffset)) + const position = rbx.AbsolutePosition.add(rbx.AbsoluteSize.div(2)) + updateFrameInfo(size, position) + task.spawn(updateInstance) + } + }} + Size={new UDim2(1, 0, 1, 0)} + BackgroundTransparency={1} + /> + ) +} + +export default acrylic \ No newline at end of file diff --git a/src/ReplicatedStorage/ui/components/padding.tsx b/src/ReplicatedStorage/ui/components/padding.tsx index 326b46b..402d2cf 100644 --- a/src/ReplicatedStorage/ui/components/padding.tsx +++ b/src/ReplicatedStorage/ui/components/padding.tsx @@ -1,4 +1,3 @@ -import Hooks from "@rbxts/roact-hooked" import Roact from "@rbxts/roact" interface paddingProps extends Roact.JsxInstanceProperties { diff --git a/src/ServerScriptService/ecs/systems/server/playersRagdollOnDeath.ts b/src/ServerScriptService/ecs/systems/server/playersRagdollOnDeath.ts index 7d5fdde..d7b7bff 100644 --- a/src/ServerScriptService/ecs/systems/server/playersRagdollOnDeath.ts +++ b/src/ServerScriptService/ecs/systems/server/playersRagdollOnDeath.ts @@ -1,3 +1,4 @@ +import Make from "@rbxts/make" import { World, useEvent } from "@rbxts/matter" import { Model, PlayerCharacter } from "ReplicatedStorage/ecs/components" @@ -15,19 +16,22 @@ function playersRagdollOnDeath(world: World): void { for (const [_] of useEvent(playerCharacter.humanoid, "Died")) { model.model.GetDescendants().forEach((v, _) => { if (v.IsA("Motor6D")) { - const attachment0 = new Instance("Attachment") - const attachment1 = new Instance("Attachment") - attachment0.CFrame = v.C0 - attachment1.CFrame = v.C1 - attachment0.Parent = v.Part0 - attachment1.Parent = v.Part1 + const attachment0 = Make("Attachment", { + CFrame: v.C0, + Parent: v.Part0 + }) + const attachment1 = Make("Attachment", { + CFrame: v.C1, + Parent: v.Part1 + }) - const ballSocketConstraint = new Instance("BallSocketConstraint") - ballSocketConstraint.Attachment0 = attachment0 - ballSocketConstraint.Attachment1 = attachment1 - ballSocketConstraint.LimitsEnabled = true - ballSocketConstraint.TwistLimitsEnabled = true - ballSocketConstraint.Parent = v.Parent + Make("BallSocketConstraint", { + Attachment0: attachment0, + Attachment1: attachment1, + LimitsEnabled: true, + TwistLimitsEnabled: true, + Parent: v.Parent + }) v.Destroy() } diff --git a/src/ServerScriptService/ecs/systems/server/replication.ts b/src/ServerScriptService/ecs/systems/server/replication.ts index aaba13e..08bdb15 100644 --- a/src/ServerScriptService/ecs/systems/server/replication.ts +++ b/src/ServerScriptService/ecs/systems/server/replication.ts @@ -1,7 +1,7 @@ import { useEvent, World } from "@rbxts/matter" import { Players } from "@rbxts/services" import * as Components from "ReplicatedStorage/ecs/components" -import { serverState } from "ReplicatedStorage/ecs/state" +import { ServerState } from "ReplicatedStorage/ecs/state" import { getEvent } from "ReplicatedStorage/remotes" type ComponentName = keyof typeof Components @@ -21,7 +21,7 @@ const replicatedComponents: ReadonlySet = REPLICATED_COMPO getEvent("EcsReplication") -function replication(world: World, server: serverState): void { +function replication(world: World, server: ServerState): void { const replicationEvent = getEvent("EcsReplication") let payload: Map> | undefined diff --git a/src/ServerScriptService/main.server.ts b/src/ServerScriptService/main.server.ts index aa812f7..64cb808 100644 --- a/src/ServerScriptService/main.server.ts +++ b/src/ServerScriptService/main.server.ts @@ -1,6 +1,6 @@ import Log, { Logger } from "@rbxts/log" import { start } from "ReplicatedStorage/ecs" -import { serverState } from "ReplicatedStorage/ecs/state" +import { ServerState } from "ReplicatedStorage/ecs/state" import { Host } from "ReplicatedStorage/hosts" import { setEnvironment } from "ReplicatedStorage/idAttribute" import { getEvent } from "ReplicatedStorage/remotes" @@ -12,7 +12,7 @@ const serverLogger = Logger.configure() .WriteTo(Log.RobloxOutput()) .Create() -const ServerState = new serverState( +const serverState = new ServerState( serverLogger ) @@ -21,4 +21,4 @@ const ServerState = new serverState( getEvent("EcsReplication") setEnvironment(HOST) -start(HOST, ServerState) \ No newline at end of file +start(HOST, serverState) \ No newline at end of file diff --git a/src/StarterPlayer/StarterPlayerScripts/main.client.ts b/src/StarterPlayer/StarterPlayerScripts/main.client.ts index 376216b..6c03ce1 100644 --- a/src/StarterPlayer/StarterPlayerScripts/main.client.ts +++ b/src/StarterPlayer/StarterPlayerScripts/main.client.ts @@ -1,8 +1,8 @@ import { CharacterRigR6 } from "@rbxts/character-promise" import Log, { Logger } from "@rbxts/log" -import { Players } from "@rbxts/services" +import { Players, Workspace } from "@rbxts/services" import { start } from "ReplicatedStorage/ecs" -import { clientState } from "ReplicatedStorage/ecs/state" +import { ClientState } from "ReplicatedStorage/ecs/state" import { Host } from "ReplicatedStorage/hosts" import { setEnvironment } from "ReplicatedStorage/idAttribute" import showGUI from "./showGUI" @@ -13,7 +13,7 @@ const clientLogger = Logger.configure() .WriteTo(Log.RobloxOutput()) .Create() -const ClientState = new clientState( +const clientState = new ClientState( Players.LocalPlayer, (Players.LocalPlayer.Character || Players.LocalPlayer.CharacterAdded.Wait()[0]) as CharacterRigR6, false, @@ -23,6 +23,10 @@ const ClientState = new clientState( clientLogger ) -const worldAndClientState = start(HOST, ClientState) -showGUI(worldAndClientState[0], ClientState) -setEnvironment(HOST) \ No newline at end of file +const worldAndClientState = start(HOST, clientState) +showGUI(worldAndClientState[0], clientState) +setEnvironment(HOST) + +task.delay(10, () => { + print(Workspace.CurrentCamera?.GetChildren()) +}) \ No newline at end of file diff --git a/src/StarterPlayer/StarterPlayerScripts/showGUI.tsx b/src/StarterPlayer/StarterPlayerScripts/showGUI.tsx index e07a659..f653ec5 100644 --- a/src/StarterPlayer/StarterPlayerScripts/showGUI.tsx +++ b/src/StarterPlayer/StarterPlayerScripts/showGUI.tsx @@ -1,12 +1,12 @@ import { World } from "@rbxts/matter" -import { clientState } from "ReplicatedStorage/ecs/state" +import { ClientState } from "ReplicatedStorage/ecs/state" import { WorldContext } from "./ui/contexts/worldContext" import Roact from "@rbxts/roact" import Main from "./ui/main" import { ReflexProvider } from "@rbxts/roact-reflex" import { producer } from "ReplicatedStorage/ui/store/producer" -const showGUI = (world: World, state: clientState): void => { +const showGUI = (world: World, state: ClientState): void => { const playerGui = state.player.WaitForChild("PlayerGui") as PlayerGui const tree = ( diff --git a/src/StarterPlayer/StarterPlayerScripts/ui/contexts/worldContext.tsx b/src/StarterPlayer/StarterPlayerScripts/ui/contexts/worldContext.tsx index 6912cfb..e35744e 100644 --- a/src/StarterPlayer/StarterPlayerScripts/ui/contexts/worldContext.tsx +++ b/src/StarterPlayer/StarterPlayerScripts/ui/contexts/worldContext.tsx @@ -1,16 +1,16 @@ import { World } from "@rbxts/matter" import Roact from "@rbxts/roact" import { useContext } from "@rbxts/roact-hooked" -import { clientState } from "ReplicatedStorage/ecs/state" +import { ClientState } from "ReplicatedStorage/ecs/state" -interface worldContextProps { +interface WorldContextProps { world: World - clientState: clientState + clientState: ClientState } -export const WorldContext = Roact.createContext(undefined) +export const WorldContext = Roact.createContext(undefined) -export function useWorldContext(): worldContextProps { +export function useWorldContext(): WorldContextProps { const context = useContext(WorldContext) if (!context) { error("useContext must be called within a Provider") diff --git a/src/StarterPlayer/StarterPlayerScripts/ui/hotbar/hotbar.tsx b/src/StarterPlayer/StarterPlayerScripts/ui/hotbar/hotbar.tsx index e1a2b1b..b196570 100644 --- a/src/StarterPlayer/StarterPlayerScripts/ui/hotbar/hotbar.tsx +++ b/src/StarterPlayer/StarterPlayerScripts/ui/hotbar/hotbar.tsx @@ -4,15 +4,15 @@ import { useWorldContext } from "../contexts/worldContext" import Padding from "ReplicatedStorage/ui/components/padding" import { StarterGui } from "@rbxts/services" -interface hotbarProps extends Roact.JsxInstanceProperties { +interface HotbarProps extends Roact.JsxInstanceProperties { Event?: Roact.JsxInstanceEvents Change?: Roact.JsxInstanceChangeEvents } StarterGui.SetCoreGuiEnabled(Enum.CoreGuiType.Backpack, false) -function hotbar(props: hotbarProps): Roact.Element { - const spreadableProps = { ...props } as Partial +function hotbar(props: HotbarProps): Roact.Element { + const spreadableProps = { ...props } as Partial const { clientState } = useWorldContext() diff --git a/src/StarterPlayer/StarterPlayerScripts/ui/hotbar/slot.tsx b/src/StarterPlayer/StarterPlayerScripts/ui/hotbar/slot.tsx index 26c7504..1fe0ad8 100644 --- a/src/StarterPlayer/StarterPlayerScripts/ui/hotbar/slot.tsx +++ b/src/StarterPlayer/StarterPlayerScripts/ui/hotbar/slot.tsx @@ -3,8 +3,9 @@ import { useEffect } from "@rbxts/roact-hooked" import { useWorldContext } from "../contexts/worldContext" import { ContextActionService, HttpService } from "@rbxts/services" import Padding from "ReplicatedStorage/ui/components/padding" +import Acrylic from "ReplicatedStorage/ui/components/acrylic" -interface slotProps extends Roact.JsxInstanceProperties { +interface SlotProps extends Roact.JsxInstanceProperties { index: number keycode: Enum.KeyCode tool: Tool @@ -13,10 +14,10 @@ interface slotProps extends Roact.JsxInstanceProperties { Change?: Roact.JsxInstanceChangeEvents } -function slot(props: slotProps): Roact.Element { +function slot(props: SlotProps): Roact.Element { const { index, keycode, tool } = props - const spreadableProps = { ...props } as Partial + const spreadableProps = { ...props } as Partial delete spreadableProps.index delete spreadableProps.keycode delete spreadableProps.tool @@ -48,37 +49,43 @@ function slot(props: slotProps): Roact.Element { + - - - + + + + + ) } diff --git a/src/StarterPlayer/StarterPlayerScripts/ui/main.tsx b/src/StarterPlayer/StarterPlayerScripts/ui/main.tsx index c2b2e13..78614a6 100644 --- a/src/StarterPlayer/StarterPlayerScripts/ui/main.tsx +++ b/src/StarterPlayer/StarterPlayerScripts/ui/main.tsx @@ -2,13 +2,13 @@ import Roact from "@rbxts/roact" import Hotbar from "./hotbar/hotbar" import { withHookDetection } from "@rbxts/roact-hooked" -interface mainProps extends Roact.JsxInstanceEvents { +interface MainProps extends Roact.JsxInstanceEvents { Event?: Roact.JsxInstanceEvents Change?: Roact.JsxInstanceChangeEvents } -export default function main(props: mainProps): Roact.Element { - const spreadableProps = { ...props } as Partial +export default function main(props: MainProps): Roact.Element { + const spreadableProps = { ...props } as Partial withHookDetection(Roact) diff --git a/yarn.lock b/yarn.lock index d3ca8d5..a3a79f0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -86,6 +86,11 @@ dependencies: "@rbxts/validate-tree" "^2.0.1" +"@rbxts/compiler-types@^1.2.3-types.1": + version "1.2.3-types.1" + resolved "https://registry.yarnpkg.com/@rbxts/compiler-types/-/compiler-types-1.2.3-types.1.tgz#d7945531c917d62bafadd2b5aa6c2f2e88a2036a" + integrity sha512-SXXIBazyJ7N6d2xcy471/kqZZpCv7EDOWrRJ45jcv3g00VQaZwYl4Elr10woqRloIblQanwJ7yUqGXAsWv7iuQ== + "@rbxts/compiler-types@^2.1.1-types.0": version "2.1.1-types.0" resolved "https://registry.yarnpkg.com/@rbxts/compiler-types/-/compiler-types-2.1.1-types.0.tgz#a1f02b57402dffec474dd6656ec1d8a897b9756b" @@ -98,6 +103,14 @@ dependencies: "@rbxts/message-templates" "^0.3.1" +"@rbxts/make@^1.0.6": + version "1.0.6" + resolved "https://registry.yarnpkg.com/@rbxts/make/-/make-1.0.6.tgz#9fbed42cd263b6ce997cdb6a840f77fdeb9e6b36" + integrity sha512-ZL1FMxDqWv1TIzE064JFen75rgybV7ulQHTUVqXuvngDBa3lP3btFiIdUO2MMJAOZpHKinC9jFudcCenrprcPg== + dependencies: + "@rbxts/compiler-types" "^1.2.3-types.1" + "@rbxts/types" "^1.0.537" + "@rbxts/matter@^0.6.2-ts.6": version "0.6.4" resolved "https://registry.yarnpkg.com/@rbxts/matter/-/matter-0.6.4.tgz#49ff6ce56bada1ce7c5e2715a05daaa3fb7615e6" @@ -148,6 +161,11 @@ resolved "https://registry.yarnpkg.com/@rbxts/testez/-/testez-0.4.2-ts.0.tgz#4475183d317182ac7099bffee6492ffcb7bcaf0b" integrity sha512-8Q+OG9ddTD2P3aARCuRKpPqUBvuifgSnHvQMZ6jBMqUzxhIysnb0l4c3vnnaQnvdyZ1OW9tKxcdEHMGTb67uOw== +"@rbxts/types@^1.0.537": + version "1.0.709" + resolved "https://registry.yarnpkg.com/@rbxts/types/-/types-1.0.709.tgz#645bd5547ccebed748c167e1c43d3ff62a788db3" + integrity sha512-lvglSXxGNSNgZNvccnh70USvhSn6yYO+yQTA4m0ePjNjyJ8DueVLfuT5Ge0NDFYOlTtx1vJuxd2wlFqCBJAXVw== + "@rbxts/types@^1.0.707": version "1.0.707" resolved "https://registry.yarnpkg.com/@rbxts/types/-/types-1.0.707.tgz#8007f5eb0f0368ec25ff1c4d313bd80c30bbed33"