local p=require(script.Parent.Parent.Configuration)local m=require(script.Parent.Button)local O=require(script.Parent.Card)local j=require(script.Parent.TextView)local q=require(script.Parent.Parent.Utility.ThemeAccessor)local f=p.Roact local Y=p.RoactAnimate local S=f.Component:extend("\077\097\116\101\114\105\097\108\077\101\110\117")S.Divider=newproxy(false)function S.init(p)p:setState({_size=Y.Value.new(UDim2.new())})end function S.didUpdate(p)if p.props.Open then(Y(p.state._size,TweenInfo.new(.2),p:_computeOpenSize())):Start()else(Y(p.state._size,TweenInfo.new(.2),UDim2.new())):Start()end end function S._computeOpenSize(p)local m=p.props.Width local O=0 for p,m in ipairs(p.props.Options)do if m==S.Divider then O+=7 else O+=32 end end return UDim2.new(m.Scale,m.Offset,0,O)end function S.render(p)local Y={__Layout=f.createElement("\085\073\076\105\115\116\076\097\121\111\117\116",{FillDirection=Enum.FillDirection.Vertical,HorizontalAlignment=Enum.HorizontalAlignment.Center,SortOrder=Enum.SortOrder.LayoutOrder,VerticalAlignment=Enum.VerticalAlignment.Top})}for O,X in ipairs(p.props.Options)do if X==S.Divider then Y["\068\105\118\105\100\101\114\095"..O]=f.createElement("\070\114\097\109\101",{Size=UDim2.new(1,0,0,7),LayoutOrder=O,BackgroundTransparency=1},table.create(1,f.createElement("\070\114\097\109\101",{Size=UDim2.new(1,0,0,1),Position=UDim2.fromScale(0,.5);AnchorPoint=Vector2.new(0,.5);BackgroundTransparency=.85,BackgroundColor3=q.Get(p,"\073\110\118\101\114\115\101\066\097\099\107\103\114\111\117\110\100\067\111\108\111\114");BorderSizePixel=0})))else local q,S if type(X)=="\115\116\114\105\110\103"then S=X q=table.create(1,f.createElement(j,{Class="\066\111\100\121\049";Text=X,Size=UDim2.new(1,-24,1,0);Position=UDim2.fromOffset(24,0),TextXAlignment=Enum.TextXAlignment.Left}))elseif type(X)=="\116\097\098\108\101"then local p=X.Content S=X.Key or tostring(p)if type(p)=="\115\116\114\105\110\103"then q=f.createElement(j,{Class="\066\111\100\121\049",Text=p,Size=UDim2.new(1,-24,1,0),TextXAlignment=Enum.TextXAlignment.Left})else q=p end end Y["\079\112\116\105\111\110\095"..S]=f.createElement(m,{Flat=true,Size=UDim2.new(1,0,0,32),Text="",LayoutOrder=O;InkColor3=Color3.new(.6,.6,.6),HoverColor3=Color3.new(.8,.8,.8),PressColor3=Color3.new(.7,.7,.7);OnClicked=function()p.props.OnOptionSelected(X)end},q)end end return f.createElement(O,{Elevation=p.props.Open and 2 or 0,ZIndex=p.props.ZIndex,Size=p.state._size,Position=p.props.Position,AnchorPoint=p.props.AnchorPoint},Y)end return S
local Configuration = require(script.Parent.Parent.Configuration)

local Button = require(script.Parent.Button)
local Card = require(script.Parent.Card)
local TextView = require(script.Parent.TextView)

local ThemeAccessor = require(script.Parent.Parent.Utility.ThemeAccessor)

local Roact = Configuration.Roact
local RoactAnimate = Configuration.RoactAnimate

local Menu = Roact.Component:extend("MaterialMenu")
Menu.Divider = newproxy(false)

function Menu:init()
	self:setState({
		_size = RoactAnimate.Value.new(UDim2.new()),
	})
end

function Menu:didUpdate()
	if self.props.Open then
		RoactAnimate(self.state._size, TweenInfo.new(0.2), self:_computeOpenSize()):Start()
	else
		RoactAnimate(self.state._size, TweenInfo.new(0.2), UDim2.new()):Start()
	end
end

function Menu:_computeOpenSize()
	local width = self.props.Width
	local height = 0

	for _, option in ipairs(self.props.Options) do
		if option == Menu.Divider then
			height += 7
		else
			height += 32
		end
	end

	return UDim2.new(width.Scale, width.Offset, 0, height)
end

function Menu:render()
	local contents = {
		__Layout = Roact.createElement("UIListLayout", {
			FillDirection = Enum.FillDirection.Vertical,
			HorizontalAlignment = Enum.HorizontalAlignment.Center,
			SortOrder = Enum.SortOrder.LayoutOrder,
			VerticalAlignment = Enum.VerticalAlignment.Top,
		}),
	}

	for index, option in ipairs(self.props.Options) do
		if option == Menu.Divider then
			contents["Divider_" .. index] = Roact.createElement("Frame", {
				Size = UDim2.new(1, 0, 0, 7),
				LayoutOrder = index,
				BackgroundTransparency = 1,
			}, table.create(1, Roact.createElement("Frame", {
				Size = UDim2.new(1, 0, 0, 1),
				Position = UDim2.fromScale(0, 0.5),
				AnchorPoint = Vector2.new(0, 0.5),
				BackgroundTransparency = 0.85,
				BackgroundColor3 = ThemeAccessor.Get(self, "InverseBackgroundColor"),
				BorderSizePixel = 0,
			})))
		else
			local buttonContent, key
			if type(option) == "string" then
				key = option
				buttonContent = table.create(1, Roact.createElement(TextView, {
					Class = "Body1",
					Text = option,
					Size = UDim2.new(1, -24, 1, 0),
					Position = UDim2.fromOffset(24, 0),
					TextXAlignment = Enum.TextXAlignment.Left,
				}))
			elseif type(option) == "table" then
				local optionContent = option.Content
				key = option.Key or tostring(optionContent)

				if type(optionContent) == "string" then
					buttonContent = Roact.createElement(TextView, {
						Class = "Body1",
						Text = optionContent,
						Size = UDim2.new(1, -24, 1, 0),
						TextXAlignment = Enum.TextXAlignment.Left,
					})
				else
					buttonContent = optionContent
				end
			end

			contents["Option_" .. key] = Roact.createElement(Button, {
				Flat = true,
				Size = UDim2.new(1, 0, 0, 32),
				Text = "",
				LayoutOrder = index,
				InkColor3 = Color3.new(0.6, 0.6, 0.6),
				HoverColor3 = Color3.new(0.8, 0.8, 0.8),
				PressColor3 = Color3.new(0.7, 0.7, 0.7),

				OnClicked = function()
					self.props.OnOptionSelected(option)
				end,
			}, buttonContent)
		end
	end

	return Roact.createElement(Card, {
		Elevation = self.props.Open and 2 or 0,
		ZIndex = self.props.ZIndex,
		Size = self.state._size,
		Position = self.props.Position,
		AnchorPoint = self.props.AnchorPoint,
	}, contents)
end

return Menu
