-- Compiled with roblox-ts v1.3.2
local TS = _G[script]
local Hooks = TS.import(script, TS.getModule(script, "@rbxts", "roact-hooks").src)
local Roact = TS.import(script, TS.getModule(script, "@rbxts", "roact").src)
local _story_actions = TS.import(script, script.Parent, "story-actions")
local LowercaseText = _story_actions.LowercaseText
local SetText = _story_actions.SetText
local UppercaseText = _story_actions.UppercaseText
local useDispatch = TS.import(script, script.Parent.Parent, "hooks", "use-dispatch").default
local Component = function(props, hooks)
	local dispatch = useDispatch(hooks)
	local currentText, setCurrentText = hooks.useBinding("")
	local onTextChange = hooks.useCallback(function(rbx)
		return setCurrentText(rbx.Text)
	end, {})
	local onSetActivated = hooks.useCallback(function()
		dispatch(SetText(currentText:getValue()))
	end, { dispatch })
	local onLowerActivated = hooks.useCallback(function()
		dispatch(LowercaseText(currentText:getValue()))
	end, { dispatch })
	local onUpperActivated = hooks.useCallback(function()
		dispatch(UppercaseText(currentText:getValue()))
	end, { dispatch })
	return Roact.createElement("Frame", {
		AnchorPoint = props.AnchorPoint,
		AutomaticSize = Enum.AutomaticSize.XY,
		BackgroundTransparency = 1,
		LayoutOrder = props.LayoutOrder,
		Position = props.Position,
		Size = UDim2.new(),
	}, {
		UIListLayout = Roact.createElement("UIListLayout", {
			FillDirection = Enum.FillDirection.Horizontal,
			HorizontalAlignment = Enum.HorizontalAlignment.Center,
			Padding = UDim.new(0, 5),
			SortOrder = Enum.SortOrder.LayoutOrder,
			VerticalAlignment = Enum.VerticalAlignment.Center,
		}),
		TextBox = Roact.createElement("TextBox", {
			BackgroundColor3 = Color3.fromRGB(37, 37, 37),
			BorderSizePixel = 0,
			[Roact.Change.Text] = onTextChange,
			Font = Enum.Font.Gotham,
			PlaceholderColor3 = Color3.fromRGB(170, 170, 170),
			PlaceholderText = "Entry...",
			Size = UDim2.fromOffset(200, 35),
			Text = currentText,
			TextColor3 = Color3.fromRGB(204, 204, 204),
			TextSize = 22,
		}),
		SetButton = Roact.createElement("TextButton", {
			BackgroundColor3 = Color3.fromRGB(0, 162, 255),
			BorderSizePixel = 0,
			[Roact.Event.Activated] = onSetActivated,
			Font = Enum.Font.GothamBlack,
			LayoutOrder = 1,
			Size = UDim2.fromOffset(100, 35),
			Text = "Set",
			TextColor3 = Color3.fromRGB(255, 255, 255),
			TextSize = 22,
		}),
		UppercaseButton = Roact.createElement("TextButton", {
			BackgroundColor3 = Color3.fromRGB(60, 60, 60),
			BorderSizePixel = 0,
			[Roact.Event.Activated] = onUpperActivated,
			Font = Enum.Font.GothamMedium,
			LayoutOrder = 2,
			Size = UDim2.fromOffset(100, 35),
			Text = "Upper",
			TextColor3 = Color3.fromRGB(204, 204, 204),
			TextSize = 22,
		}),
		LowercaseButton = Roact.createElement("TextButton", {
			BackgroundColor3 = Color3.fromRGB(60, 60, 60),
			BorderSizePixel = 0,
			[Roact.Event.Activated] = onLowerActivated,
			Font = Enum.Font.GothamMedium,
			LayoutOrder = 3,
			Size = UDim2.fromOffset(100, 35),
			Text = "Lower",
			TextColor3 = Color3.fromRGB(204, 204, 204),
			TextSize = 22,
		}),
	})
end
local TextModifier = Hooks.new(Roact)(Component, {
	componentType = "PureComponent",
	name = "TextModifier",
})
local default = TextModifier
return {
	TextModifier = TextModifier,
	default = default,
}