Merge remote-tracking branch 'origin/main' into reset-settings-to-def…

…ault

.luaurc

@@ -1,4 +1,5 @@
 {
+	"languageMode": "strict",
 	"aliases": {
 		"pkg": "./Packages",
 		"root": "./src"

.lune/build.luau

@@ -10,7 +10,10 @@ local watch = require("./lib/watcher/watch")
 local args = parseArgs(process.args)
 
 local target = if args.target then args.target else "prod"
+assert(target == "dev" or target == "prod", `bad value for target (must be one of "dev" or "prod", got "{target}")`)
+
 local output = if args.output then args.output else `{getPluginsPath(process.os)}/{constants.PLUGIN_FILENAME}`
+assert(typeof(output) == "string", `bad value for output (string expected, got {typeof(output)})`)
 
 local function build()
 	clean()

.lune/lib/findClientSettings.luau

@@ -1,6 +1,6 @@
 local run = require("./run")
 
-local function findClientSettings(os: string)
+local function findClientSettings(os: string): string?
 	if os == "macos" then
 		return "/Applications/RobloxStudio.app/Contents/MacOS/ClientSettings"
 	elseif os == "windows" then

.lune/lib/getPluginsPath.luau

@@ -1,6 +1,6 @@
 local run = require("./run")
 
-local function getPluginsPath(os: string)
+local function getPluginsPath(os: string): string?
 	if os == "macos" then
 		return run("realpath", { "$HOME/Documents/Roblox/Plugins" })
 	elseif os == "windows" then

.lune/lib/parseArgs.luau

@@ -1,8 +1,9 @@
 local FLAG_PATTERN = "%-%-(%w+)"
 local FLAG_ALL_IN_ONE_PATTERN = `{FLAG_PATTERN}=(%w+)`
 
-local function parseArgs(args: { string }): { [string]: string | boolean | number }
-	local parsedArgs: { [string]: string } = {}
+local function parseArgs(args: { string })
+	local parsedArgs: { [string]: string | boolean | number } = {}
+
 	local skipNextToken = false
 
 	for index, token in args do
@@ -28,16 +29,14 @@ local function parseArgs(args: { string }): { [string]: string | boolean | numbe
 			if nextToken then
 				-- When processing `--foo` in `--foo --bar` treat it like a boolean
 				if nextToken:match(FLAG_PATTERN) then
-					flagValue = true
+					parsedArgs[flagName] = true
 				else
-					flagValue = nextToken
+					parsedArgs[flagName] = nextToken
 					skipNextToken = true
 				end
 			else
-				flagValue = true
+				parsedArgs[flagName] = true
 			end
-
-			parsedArgs[flagName] = flagValue
 		else
 			error(`something went wrong: {token}`)
 		end

.lune/lib/setFlags.luau

@@ -3,8 +3,10 @@ local run = require("./run")
 
 local function setFlags(os: string)
 	local clientSettings = findClientSettings(os)
-	run("mkdir", { "-p", clientSettings })
-	run("cp", { "-R", "tests/ClientAppSettings.json", clientSettings })
+	if clientSettings then
+		run("mkdir", { "-p", clientSettings })
+		run("cp", { "-R", "tests/ClientAppSettings.json", clientSettings })
+	end
 end
 
 return setFlags

.lune/lib/watcher/watch.luau

@@ -16,7 +16,7 @@ type Options = {
 }
 
 local function watch(options: Options)
-	local prevWatchedFileMetadata: { [string]: string } = {}
+	local prevWatchedFileMetadata: { [string]: fs.Metadata } = {}
 	local watchedFiles = getWatchedFiles(options.filePatterns)
 	local prevWatchedFiles
 

LICENSE

@@ -1,4 +1,4 @@
-Copyright 2021 David Minnerly
+Copyright 2021 flipbook-labs
 
 Permission is hereby granted, free of charge, to any person obtaining a copy of
 this software and associated documentation files (the "Software"), to deal in

example/CanvasTests/Resizing.story.luau

@@ -3,16 +3,16 @@ local RunService = game:GetService("RunService")
 local React = require("@pkg/React")
 local ReactRoblox = require("@pkg/ReactRoblox")
 
-local RESIZE_DURATIOn = 3 -- seconds
+local RESIZE_DURATION = 3 -- seconds
 local MAX_SIZE = 2000 -- px
 
 local function Story()
 	local alpha, setAlpha = React.useState(0)
 
 	React.useEffect(function()
-		local conn = RunService.Heartbeat:Connect(function(dt)
+		local conn = RunService.Heartbeat:Connect(function(dt: number)
 			setAlpha(function(prev)
-				local newAlpha = prev + (dt / RESIZE_DURATIOn)
+				local newAlpha = prev + (dt / RESIZE_DURATION)
 				return if newAlpha > 1 then 0 else newAlpha
 			end)
 		end)

src/Common/Branding.story.luau

@@ -8,7 +8,7 @@ return {
 	summary = "Icon and Typography for flipbook",
 	controls = {},
 	story = React.createElement(ContextProviders, {
-		plugin = MockPlugin.new(),
+		plugin = MockPlugin.new() :: any,
 	}, {
 		Branding = React.createElement(Branding),
 	}),

src/Common/ContextStack.luau

@@ -1,4 +1,3 @@
---!strict
 local React = require("@pkg/React")
 
 export type Props = {

src/Common/ScrollingFrame.story.luau

@@ -16,7 +16,7 @@ type Props = {
 return {
 	controls = controls,
 	story = function(props: Props)
-		local children = {}
+		local children: { [string]: React.Node } = {}
 
 		children.Layout = React.createElement("UIListLayout", {
 			SortOrder = Enum.SortOrder.LayoutOrder,
@@ -34,7 +34,7 @@ return {
 		end
 
 		return React.createElement(ContextProviders, {
-			plugin = MockPlugin.new(),
+			plugin = MockPlugin.new() :: any,
 		}, {
 			Wrapper = React.createElement("Frame", {
 				Size = UDim2.new(1, 0, 0, 200),

src/Common/useDescendants.luau

@@ -26,7 +26,7 @@ local function useDescendants(parent: Instance, predicate: (descendant: Instance
 
 			return prev
 		end)
-	end, { predicate, descendants })
+	end, { predicate, descendants } :: { unknown })
 
 	-- Setup the initial list of descendants for the current parent
 	React.useEffect(function()
@@ -54,7 +54,7 @@ local function useDescendants(parent: Instance, predicate: (descendant: Instance
 				conn:Disconnect()
 			end
 		end
-	end, { parent, onDescendantChanged })
+	end, { parent, onDescendantChanged } :: { unknown })
 
 	return descendants
 end

src/Common/useDescendants.spec.luau

@@ -97,7 +97,7 @@ test("force an update when a matching descendant's name changes", function()
 	expect(#descendants).toBe(1)
 
 	local prev = descendants
-	local match = tree:FindFirstChild("Match")
+	local match = tree:FindFirstChild("Match") :: Instance
 
 	ReactRoblox.act(function()
 		match.Name = "Changed"

src/Common/useTheme.luau

@@ -48,7 +48,7 @@ local function useTheme()
 		end
 	end, { themeOverride, prevThemeOverride, themeName })
 
-	useEffect(function()
+	useEffect(function(): any
 		if themeOverride == "system" then
 			local conn = studio.ThemeChanged:Connect(function()
 				set(themes[studio.Theme.Name])

src/Common/useZoom.luau

@@ -7,11 +7,11 @@ local function useZoom(story: ModuleScript)
 
 	local zoomIn = React.useCallback(function()
 		setValue(value + ZOOM_INCREMENT)
-	end, { value, setValue })
+	end, { value, setValue } :: { unknown })
 
 	local zoomOut = React.useCallback(function()
 		setValue(value - ZOOM_INCREMENT)
-	end, { value, setValue })
+	end, { value, setValue } :: { unknown })
 
 	React.useEffect(function()
 		setValue(0)

src/Explorer/Component.story.luau

@@ -6,22 +6,25 @@ local MockPlugin = require("@root/Testing/MockPlugin")
 
 local childNode1 = {
 	name = "Button",
-	icon = "story",
+	icon = "story" :: "story",
+	children = {},
 }
 
 local childNode2 = {
 	name = "Toggle",
-	icon = "story",
+	icon = "story" :: "story",
+	children = {},
 }
 
 local childNode3 = {
 	name = "Radio",
-	icon = "story",
+	icon = "story" :: "story",
+	children = {},
 }
 
 local directoryNode1 = {
 	name = "Files",
-	icon = "folder",
+	icon = "folder" :: "folder",
 	children = {
 		childNode1,
 		childNode2,
@@ -31,7 +34,7 @@ local directoryNode1 = {
 
 local storybookNode = {
 	name = "Storybook",
-	icon = "storybook",
+	icon = "storybook" :: "storybook",
 	children = {
 		directoryNode1,
 	},
@@ -41,7 +44,7 @@ return {
 	summary = "Component as storybook with children",
 	controls = {},
 	story = React.createElement(ContextProviders, {
-		plugin = MockPlugin.new(),
+		plugin = MockPlugin.new() :: any,
 	}, {
 		Component = React.createElement(Component, {
 			activeNode = nil,

src/Explorer/Component/init.luau

@@ -38,7 +38,7 @@ local function Component(providedProps: Props)
 		end
 	end, { setExpanded })
 
-	local children = {
+	local children: { [string]: React.Node } = {
 		UIListLayout = if hasChildren
 			then e("UIListLayout", {
 				SortOrder = Enum.SortOrder.Name,

src/Explorer/init.luau

@@ -14,7 +14,7 @@ export type Props = {
 }
 
 local function ComponentTree(props: Props)
-	local children = {}
+	local children: { [string]: React.Node } = {}
 
 	children.UIListLayoutLayout = e("UIListLayout", {
 		SortOrder = Enum.SortOrder.Name,

src/Forms/Button.luau

@@ -58,7 +58,7 @@ local function Button(providedProps: Props)
 		[React.Event.MouseLeave] = function()
 			setHover(false)
 		end,
-		[React.Event.Activated] = props.onClick,
+		[React.Event.Activated] = props.onClick :: any,
 	}, {
 		UICorner = e("UICorner", {
 			CornerRadius = theme.corner,

src/Forms/Button.story.luau

@@ -16,7 +16,9 @@ return {
 	summary = "A generic button component that can be used anywhere",
 	controls = controls,
 	story = function(props: Props)
-		return React.createElement(ContextProviders, { plugin = MockPlugin.new() }, {
+		return React.createElement(ContextProviders, {
+			plugin = MockPlugin.new() :: any,
+		}, {
 			Button = React.createElement(Button, {
 				text = props.controls.text,
 				onClick = function()

src/Forms/Checkbox.story.luau

@@ -7,7 +7,7 @@ local MockPlugin = require("@root/Testing/MockPlugin")
 return {
 	summary = "Generic checkbox used for story controls",
 	story = React.createElement(ContextProviders, {
-		plugin = MockPlugin.new(),
+		plugin = MockPlugin.new() :: any,
 	}, {
 		Checkbox = React.createElement(Checkbox, {
 			initialState = true,

src/Forms/Dropdown.luau

@@ -13,7 +13,7 @@ local function Dropdown(props: Props)
 	local isExpanded, setIsExpanded = React.useState(false)
 	local selectedOption, setSelectedOption = React.useState(props.default)
 
-	local options = {}
+	local options: { [string]: React.Node } = {}
 	for index, option in props.options do
 		options["Option" .. index] = React.createElement("TextButton", {
 			LayoutOrder = index,

src/Forms/Dropdown.story.luau

@@ -22,7 +22,7 @@ return {
 		end
 
 		return React.createElement(ContextProviders, {
-			plugin = MockPlugin.new(),
+			plugin = MockPlugin.new() :: any,
 		}, {
 			Dropdown = React.createElement(Dropdown, {
 				placeholder = "Select an option",

src/Forms/InputField.luau

@@ -25,23 +25,26 @@ type InternalProps = Props & typeof(defaultProps)
 local function InputField(providedProps: Props)
 	local props: InternalProps = Sift.Dictionary.merge(defaultProps, providedProps)
 
-	local ref = React.createRef()
+	local ref = React.useRef(nil :: TextBox?)
 	local text, setText = React.useState("")
 	local isValid, setIsValid = React.useState(false)
 	local theme = useTheme()
 
-	local onFocusLost = React.useCallback(function(_rbx: TextBox, enterPressed: boolean)
-		if props.onFocusLost then
-			props.onFocusLost()
-		end
-
-		if enterPressed and props.onSubmit then
-			props.onSubmit(text, isValid)
-		end
-	end, {
-		isValid,
-		props.onSubmit,
-	})
+	local onFocusLost = React.useCallback(
+		function(_rbx: TextBox, enterPressed: boolean)
+			if props.onFocusLost then
+				props.onFocusLost()
+			end
+
+			if enterPressed and props.onSubmit then
+				props.onSubmit(text, isValid)
+			end
+		end,
+		{
+			isValid,
+			props.onSubmit,
+		} :: { unknown }
+	)
 
 	local onTextChanged = React.useCallback(function(rbx: TextBox)
 		local newText = rbx.Text
@@ -63,11 +66,11 @@ local function InputField(providedProps: Props)
 		if props.validate then
 			setIsValid(props.validate(newText))
 		end
-	end, { text, props.transform, props.validate, props.onTextChange })
+	end, { text, props.transform, props.validate, props.onTextChange } :: { unknown })
 
 	React.useEffect(function()
-		if props.autoFocus then
-			ref:getValue():CaptureFocus()
+		if ref.current and props.autoFocus then
+			ref.current:CaptureFocus()
 		end
 	end, {
 		props.autoFocus,
@@ -88,8 +91,8 @@ local function InputField(providedProps: Props)
 		Text = text,
 		ref = ref,
 		[React.Change.Text] = onTextChanged,
-		[React.Event.Focused] = props.onFocus,
-		[React.Event.FocusLost] = onFocusLost,
+		[React.Event.Focused] = props.onFocus :: any,
+		[React.Event.FocusLost] = onFocusLost :: any,
 	})
 end
 

src/Forms/InputField.story.luau

@@ -6,7 +6,7 @@ local MockPlugin = require("@root/Testing/MockPlugin")
 
 return {
 	story = React.createElement(ContextProviders, {
-		plugin = MockPlugin.new(),
+		plugin = MockPlugin.new() :: any,
 	}, {
 		InputField = React.createElement(InputField, {
 			placeholder = "Enter information...",

src/Forms/Searchbar.luau

@@ -101,6 +101,7 @@ local function Searchbar(providedProps: Props)
 				onFocus = onFocus,
 				onFocusLost = onFocusLost,
 				onTextChange = onTextChange,
+				onSubmit = function() end,
 			}),
 		}),
 

src/Forms/Searchbar.story.luau

@@ -8,7 +8,7 @@ return {
 	summary = "Searchbar used to search for components",
 	controls = {},
 	story = React.createElement(ContextProviders, {
-		plugin = MockPlugin.new(),
+		plugin = MockPlugin.new() :: any,
 	}, {
 		Searchbar = React.createElement(Searchbar),
 	}),