local J=game:GetService("\082\101\112\108\105\099\097\116\101\100\083\116\111\114\097\103\101")local h=require(J.Shared.Quark)local g=h.Animations.Spring local r=h.New local C=h.State local d={Elasticity=C(.1),Stiffness=C(.7)}local L={Elasticity=.1;Stiffness=.7}return{controls=L,render=function(J)local L=C(UDim2.fromScale(.05,.1))local j=g(L(),L,d.Elasticity,d.Stiffness);(r("\084\101\120\116\076\097\098\101\108"))({Text="\067\117\115\116\111\109 \081\117\097\114\107 \083\112\114\105\110\103\115 \117\112\100\097\116\101 \119\104\101\110 \116\104\101 \116\097\114\103\101\116 \115\116\097\116\101 \117\112\100\097\116\101\115\046 \040\084\104\101\121 \117\115\101 \069\108\097\115\116\105\099\105\116\121\044 \083\116\105\102\102\110\101\115\115\041";TextColor3=Color3.new(1,1,1);Size=UDim2.new(1,0,0,20);BackgroundTransparency=.5,BackgroundColor3=Color3.new(),TextXAlignment="\076\101\102\116",Parent=J.target});(r("\084\101\120\116\066\117\116\116\111\110"))({Position=UDim2.fromOffset(0,25);Parent=J.target,Size=j:Play(),MouseEnter=L.setLambda(UDim2.fromScale(.1,.2));MouseLeave=L.setLambda(L())})J.subscribe(function(J,h)d.Elasticity(h.Elasticity.__new)d.Stiffness(h.Stiffness.__new)end)return h.Cleanup end}
local ReplicatedStorage = game:GetService "ReplicatedStorage"

local Quark = require(ReplicatedStorage.Shared.Quark)
local Spring = Quark.Animations.Spring
local New = Quark.New
local State = Quark.State

-- Spring settings can be States
local SpringSettings = {
	Elasticity = State(0.1),
	Stiffness = State(0.7),
}

-- Control initial definitions
local controls = {
	Elasticity = 0.1,
	Stiffness = 0.7,
}

-- Since we're using controls, let's make an advanced story.
return {
	controls = controls,
	render = function(props)
		-- Hovering will be a state so that it updates automatically
		local Hovering = State(UDim2.fromScale(0.05, 0.1))

		local size_spring = Spring(
			Hovering(), -- Set initial start to state VALUE
			Hovering, -- Set target to the STATE (So it updates automatically)
			SpringSettings.Elasticity, -- We use the States defined in SpringSettings
			SpringSettings.Stiffness
		)

		-- Tip text
		New "TextLabel" {
			Text = "Custom Quark Springs update when the target state updates. (They use Elasticity, Stiffness)",
			TextColor3 = Color3.new(1, 1, 1),
			Size = UDim2.new(1, 0, 0, 20),
			BackgroundTransparency = 0.5,
			BackgroundColor3 = Color3.new(),
			TextXAlignment = "Left",
			Parent = props.target,
		}

		-- Create a button
		New "TextButton" {
			Position = UDim2.fromOffset(0, 25),
			Parent = props.target,
			Size = size_spring:Play(),

			-- setLamda returns a function telling it to update
			MouseEnter = Hovering.setLambda(UDim2.fromScale(0.1, 0.2)),
			-- Use Hovering's initial value (by calling it)
			MouseLeave = Hovering.setLambda(Hovering()),
		}

		-- subscribe to the story controls
		props.subscribe(function(_, info)
			SpringSettings.Elasticity(info.Elasticity.__new)
			SpringSettings.Stiffness(info.Stiffness.__new)
		end)

		-- CLEANUP
		return Quark.Cleanup
	end,
}
