Simple Reactive UI Library (Quark)

[rain lagoon]

I like immersive more

and I don't think mobile players find it less immersive

maybe if you disable light interference with the gui

[digital shale]

I don’t work with mobile players

[rain lagoon]

Then do it

[digital shale]

hm..

would take a new design then for the Ui

Profiles either are all on screen with pages.. or it shows one at a time and u cycle through with a button

Ui design is hard

Like what’s intuitive for ppl…

[rain lagoon]

Ultrakill terminal ultra revamp

Search that in yt

[digital shale]

It’s alright

[worthy dagger]

Hey guys creeper has gone inactive due to school so for the timebeing ill be taking over quark development. Tell me what update you guys want next, like a premium subscription

[rain lagoon]

:0

Quark battlepass when

[digital shale]

Is this real

[rain lagoon]

No

But if someone wants to fix quark I'll gladly take the offer

scopes are kinda bugged

[lilac locust]

feeling cute today might drop a pull request

[rain lagoon]

https://tenor.com/view/kinemaster-roblox-roblox-studi-studio-gif-27662749

[digital shale]

I was not aware of dis…

[rain lagoon]

Yeah so apparently there's a bug where you cant put a tertiary and above scope

Not sure what causes this

[digital shale]

Hm

I did notice this I think

It was stumping me for a while until eventually I just fixed it by just passing only one scope to use in all the components

but do we rly need scopes…?

[rain lagoon]

Yeah you don't need tjem

[worthy dagger]

@wind chasm isnt this ur game

"house game"

[wind chasm]

Uh sure whatever you say

[digital shale]

@rain lagoon should i use a snackbar module or make my own

[rain lagoon]

What's that

Sounds cool

[digital shale]

Uh they’re like the little pop up’s

Games have

Little notifications

[rain lagoon]

Yeah those are very cool

Make them

And add customization

Do you know about the AutomaticSize property

UI can scale to fit it's children

[worthy dagger]

Yes

Basically the ui can scale to fit its children

[digital shale]

But should I be using an existing module to manage them or just made all in quark

[rain lagoon]

You can make a wrapper that uses quark underneath

Or better just use stories

And then use the stories

[digital shale]

stories r still lost on me

just seems like a way to display components using a plugin

[rain lagoon]

Yes

You're correct

No need to play the game to test your ui

It automatically instantly updates when u change the code

[digital shale]

i get that but the ui is needed to actually be used in game

not just live viewed in studio

are stories still a valid organizational format for live ui display

[rain lagoon]

Yeah

They boost productivity

And you can layer multiple stories on each other if you want

[digital shale]

how...

[rain lagoon]

Click the plus button

It's like tabs

on the top

[digital shale]

@rain lagoon

how would u reccomend creating methods for a piece of ui

for like open, close

etc

[digital shale]

the second paramater doesnt seem to be in the types

[digital shale]

@dusk spoke r u using quark still

[dusk spoke]

I made my own thang

[rain lagoon]

Hooks?

Or yeah connecting states

[digital shale]

I found that scopes are unusable

The state Connect also doesn’t have its second parameter type

[digital shale]

Oh….

[digital shale]

And is state change supposed to fire everytime the value is set or everytime the value changes?

[digital shale]

Like running UI to open and close it.

Show/Hide

Stuff like that

[rain lagoon]

Really?

Is it just a type issue or does it not have the old value

[rain lagoon]

Yeah in this you just use a state and connect it

myState(myState())

[digital shale]

idk what this means or if u understand what im referring to

[digital shale]

Just type issue

[digital shale]

@dusk spoke what r u using

@wet trellis do u use reactive ui

[digital shale]

@rain lagoon fix scope..?

Actually don’t

[rain lagoon]

what 😭

i might have an idea of how to fix scopes

[rain lagoon]

THE RELEASE YOU'VE ALL BEEN WAITING FOR

https://github.com/creepersaur/quark/releases/tag/v0.0.20

@lilac locust @reef sundial @wet trellis

[wet trellis]

https://tenor.com/view/breaking-bad-toilet-scene-hank-revealing-gif-18042867

[short narwhal]

That took like only 2.53 years

[rain lagoon]

Yeah who would've though the answer to my problems was converting everything into a function

[lilac locust]

FINALLY

[lilac locust]

couldn't be me

definitely never said smt like that before

[rain lagoon]

I was told by someone a long time ago that modules returned the same mutable data

Which means converting everything into a function worked

[digital shale]

U don’t even use it 🥀

[cursive ginkgo]

@rain lagoon
https://devforum.roblox.com/t/flipbook-—-storybook-plugin-for-roblox-ui/2184387

Could you make a test project with flipbook setup for quark?

[rain lagoon]

Yes you can

But why not use UI Labs

It's better than flipbook

[cursive ginkgo]

shi

fr

i forgot the name of the plugin and just googled roblox flipbook

[rain lagoon]

Check the Quark Docs on stories

[cursive ginkgo]

dam

peak

ima use quark fr

[rain lagoon]

fire

[digital shale]

did u fix the issues with cleanup

Cause I ended up having to create just a blank function and manually call quark cleanup inside of it for uilabs to stop being lame with it

[rain lagoon]

uhhhhh

Ive never encountered that

but cleanup is fixed

It doesn't stack overflow crash Roblox studio

[cursive ginkgo]

not to be that guy but this sentence is dubious

automatically stories

and pass in a function as a param

maybe im just bad at english

[rain lagoon]

Oh yeah it should be "automatically creates stories"

[cursive ginkgo]

i see

makes sense

[cursive ginkgo]

also @rain lagoon in documentation all types are required with Quark.Type
but in reality it should be Quark.Types.Type

in creating instances and in scope types

also @rain lagoon how do i clone uis made with quark? i have some uis that i want to reuse across my project

im not sure if i can put children in a stylesheet

basically i want to reuse a frame with a bunch of children

[rain lagoon]

Really?

Oh
Types must be exported by the main Quark module then

[rain lagoon]

local function MyComponent(New)
    return New "Frame"
end

return MyComponent

You could make a module that exports a component as a function

Then call it however u like

(for autocomplete and types you can import Quark but make sure to not use Quark.New because then cleanup wouldn't work)

(instead pass a scope into the function as a parameter)

[cursive ginkgo]

nice

[cursive ginkgo]

that was very hard to understand and also didnt work when passing a scope

only worked when passing quark.new

with a scope it errored saying "attempt to call a table"

[cursive ginkgo]

im stupid

it is not Scope()

but Scope().New

sorry

[rain lagoon]

Yeah
Scope() just makes another version of Quark basically

[digital shale]

@rain lagoon vro

u killed all the quark types

switching back to the older version

ur a new type solver user..

https://tenor.com/view/spit-take-gif-21560963

[rain lagoon]

Can you quickly copy paste the export type lines from QuarkBase into Quark

Quark.QuarkBase module

[digital shale]

https://tenor.com/view/regalt-homelander-disgusted-the-boys-go-away-gif-26199297

[rain lagoon]

And also make a pull request on the GitHub repo I'll merge it

[rain lagoon]

💀

[digital shale]

At run time it will use the new one

[rain lagoon]

What

[digital shale]

runtime not in studio

[rain lagoon]

Dude can you go into Quark base and send a screenshot

[digital shale]

I edited the old quark module to require and return the new quark module at runtime

[rain lagoon]

Copy paste that massive chunk into Quark

[digital shale]

starting where

[rain lagoon]

Anywhere before the return

And change the require types thing

script.Types

[rain lagoon]

Remove the new function

[rain lagoon]

Actually you can remove the local Types thing and just write QuarkBase.State<T> and stuff

And type of Quark should be QuarkBase.Quark

[digital shale]

@rain lagoon

[rain lagoon]

And you can make the Last line be

return Quark :: Quark

❤️

[digital shale]

it still wont work

[rain lagoon]

Try closing the script and reopeningg

[digital shale]

this in base will still remain an error

[rain lagoon]

Hover over it

[digital shale]

its recursive

[rain lagoon]

Go into types.Quark

[short narwhal]

https://tenor.com/view/napoleon-there's-nothing-we-can-do-napoleon-pyritesian-gif-17490332095914688011

(new type solver issue)

or rtaher blame the person for using new solver

[rain lagoon]

Go into the Types module and show Quark

[digital shale]

im not using it

[rain lagoon]

How tf is it recursive 😭

[short narwhal]

Try changing the Scope to () -> any

and see what happens

[rain lagoon]

That doesnt do anything

[digital shale]

y not just remove the typeof(new()) part

[rain lagoon]

Try it?

[digital shale]

no error

but why was it there

the new

[rain lagoon]

hm

[short narwhal]

Dang, that idea was suppose to....... work!!!!!

because it causes a cool spiral into HELL

[rain lagoon]

What is new returning

[digital shale]

quark

from the type

[rain lagoon]

Remove that

Just do return thing

Without the type cast

[digital shale]

ok

[rain lagoon]

Did it qwork

[digital shale]

would appear so

thank you

[rain lagoon]

You're welcoem

[rain lagoon]

Make a pull request if you want

[digital shale]

:(

[rain lagoon]

💀

[rain lagoon]

What's the issue

[digital shale]

its prolly cause u added the scope in the new()

fixed

added back the typeof

[rain lagoon]

Yayyy

Write a list of what you did and I'll add them to quark as a bug fix

[digital shale]

https://tenor.com/view/dog-dog-staring-at-sun-cute-dog-dog-closed-eyes-dog-staring-at-sunset-gif-10310895250239531072

[rain lagoon]

It's 1:40am

[digital shale]

no rush

@short narwhal do u use quark

i cant figure out how best to organize logic with the quark component.... its just a UI Labs demonstration rn with animations

[short narwhal]

I don't 😭

but if types are angry then you done messed up

[rain lagoon]

he fixed those

[short narwhal]

That is absoltuel a LEI and it will appear in 2 YEARS

[digital shale]

y

[short narwhal]

oh yea I also misunderstood what I said

but still the point stands, I don't use quark because I never planned a "proper" game yet

I only make smoll components

[rain lagoon]

Make a folder called Components where you write the code for your components

Make a folder called Stories where you write modules that show off the components and use some default/multiple testing values

[digital shale]

@rain lagoon i dont see how stories can be used in live game

[rain lagoon]

You can use the Components to make other Components

[digital shale]

theyre so restrictive

[rain lagoon]

Then use those to build the UI

[digital shale]

i got all that

but i want to actually add logic externally

have methods for opening and closing

etc

and returning a cleanup function does not help that

im better off not using stories to actually utilize the ui

but then its not easily visualized

[rain lagoon]

Yeah stories are restrictive in that they are just functions returning cleanup

Instead you should just write your code for Components and write stories that use those components as testing grounds

When I was making robalatro i put my cards in a story, made a story for the cardHolder, and a story for the FullGame

[digital shale]

i saw

but everything there was basically contained

[rain lagoon]

Then I made a localscript that just ran the FullGame and parented to a screengui

[digital shale]

thats not realistic for a full game that isnt fully ui based

tho

[rain lagoon]

Yes

Usually you keep data in Values

Like leaderstats

[digital shale]

so u recommend just using components

and stories only for testing

not live

thank you

that helps a lot

[rain lagoon]

I mean you can use stories for live but it's less flexible

[digital shale]

im free

[rain lagoon]

Unless you only want a create->cleanup thing

[digital shale]

https://tenor.com/view/stantwt-chained-up-chained-gif-67266779391248431

[rain lagoon]

https://cdn.discordapp.com/attachments/726414295063068722/1457476058059247637/togif-14.gif

[cursive ginkgo]

@rain lagoon

im trying to use the quark sprint example

[rain lagoon]

Add these 2 brackets

[cursive ginkgo]

https://tenor.com/view/violence-cat-speed-cat-slap-gif-1134650139805887121

thanks for the fix

the library is peak tho i ain gon lie pure cinema

[cursive ginkgo]

entries example is also broken

https://github.com/creepersaur/quark/blob/master/src/examples/Stories/Entries.story.luau

[rain lagoon]

Dw I'm making a fix

[rain lagoon]

Lock in Twin!
https://github.com/creepersaur/quark/releases/tag/v0.0.21

[cursive ginkgo]

https://tenor.com/view/лев-покой-покой-в-богатстве-звонок-gif-13724723958516134429

(it says "rest in wealth is calling")

[cursive ginkgo]

very sigma lock in moment indeed

[rain lagoon]

What the helly

[cursive ginkgo]

@rain lagoon ayo

i think a boundary condition for this would make sense

also it can be negative

same for elasticity

xdd

[rain lagoon]

My ears

Lol yeah more than 1 is just infinitely bigger

[digital shale]

Still using stories…

[rain lagoon]

?

What i do is make my components in a story

then move everything to a component

and then make the story use the component

and use the component in a different component when needed

[digital shale]

But not using stories at runtime

[rain lagoon]

you're not supposed to

😔

[cursive ginkgo]

bro stories are like unit tests for gui

they show if shit even launches and show how it looks if it does

[rain lagoon]

this is probably the best example

but like its the actually fun version of a unit test

[cursive ginkgo]

unit test with tweakable params

[rain lagoon]

yeah

[cursive ginkgo]

@rain lagoon do you plan on making a plugin to convert a gui to quark code?

[rain lagoon]

There's a thing called Reflection service that lets you get the names of all properties of an instance

And etc.

What if you tried making it

Then I could add you into the docs 🤑

[cursive ginkgo]

buh

you tryna get that free labor from me

I would say the plugin should first collect all gui object default properties, then compare your existing guis with defaults to only write necessary stuff

https://tenor.com/view/thanos-i'll-do-it-myself-fine-i'll-do-it-myself-gif-8520717464660444716

[cursive ginkgo]

im 70% done

AYOOOOOO

@rain lagoon AYO

ima implement recursion for children real quick

but shit already works for single gui instances

⁨```lua
--!strict

-- SERVICES

local Reflection_Service = game:GetService("ReflectionService")

-- LOCAL TYPES

type GUI_Class_Name = string
type GUI_Class_Property_Name = string

type DEPRECATED_PROPERTY = "DEPRECATED"

type GUI_Class_Properties_Map = {
[GUI_Class_Name]: {
Properties: {
[GUI_Class_Property_Name]: DEPRECATED_PROPERTY | any
},
Child_Classes: {GUI_Class_Name}
}
}

-- CONSTANTS

local DEPRECATED_PROPERTY_NAME: DEPRECATED_PROPERTY = "DEPRECATED"

-- LOCAL VARIABLES

local Default_GUI_Class_Properties = {} :: GUI_Class_Properties_Map

-- LOCAL FUNCTIONS

local function Prepare_GUI_Class_Properties_Table(gui_class_name: string)
--
-- Class already exists in the table? => return
--
if (Default_GUI_Class_Properties[gui_class_name] ~= nil) then
return
end

⁨```lua
local class_dump = Reflection_Service:GetClass(gui_class_name)
--
-- Invalid class name? => return.
--
if (class_dump == nil) then
return
end
--
-- Valid class name?
-- =>
-- Add all properties of this class
-- to Default_GUI_Class_Properties, and call this function
-- with all child class names to recursively construct
-- the whole Default_GUI_Class_Properties table.
--
local properties_dump = Reflection_Service:GetPropertiesOfClass(gui_class_name)
local properties_table = {}

⁨```lua

pcall(function()
    local instance_with_default_property_values = Instance.new(gui_class_name)

    for _, property in properties_dump do
        --
        -- Deprecated property? => Set value to "DEPRECATED" and continue.
        --
        if (property.Display ~= nil) then
            if (property.Display.DeprecationMessage ~= nil) then
                properties_table[property.Name] = DEPRECATED_PROPERTY_NAME
                continue
            end
        end
        --
        -- Normal property? => Copy the value from instance_with_default_property_values.
        --
        local success, value = pcall(function()
            return instance_with_default_property_values[property.Name]
        end)
        if (success == true) then
            properties_table[property.Name] = value
        else
            properties_table[property.Name] = true
        end
    end
end)

Default_GUI_Class_Properties[gui_class_name] = {
    Child_Classes = class_dump.Subclasses or {},
    Properties    = properties_table
}

if (class_dump.Subclasses == nil) then
    return
end

for key, child_class in class_dump.Subclasses do
    Prepare_GUI_Class_Properties_Table(child_class)
end

end

local function GUI_Instance_To_Quark_Code(gui_instance: GuiBase, recursion: number?): string
local class = gui_instance.ClassName
recursion = recursion or 1

local quark_code = `local {gui_instance.Name} = New "{class}" \{`

local class_dump = Default_GUI_Class_Properties[class]
if (class_dump == nil) then
    warn(`Class dump for {class} wan't found. Report this to the plugin developers.`)
    return ""
end

⁨```lua

quark_code = `{quark_code}\n--Propeties start\n`

for key, property in Default_GUI_Class_Properties[class].Properties do
    local success, instance_property_value = pcall(function()
        return gui_instance[key]
    end)
    if (not success) then
        continue
    end
    --
    -- Gui instance's property has the default value? => Skip this property.
    --
    if (instance_property_value == property) then
        continue
    end
    --
    -- Developer is using a deprecated property? => We don't care, skip this property.
    --
    if (property == DEPRECATED_PROPERTY_NAME) then
        print(`Property {key} of class {class} in instance {gui_instance.Name} is deprecated. Skipping it.`)
        continue
    end

    for i = 1, recursion do
        quark_code = quark_code .. "\t"
    end
    quark_code = `{quark_code} {key} = {instance_property_value},\n`
end
quark_code = `{quark_code}\n--Propeties end`
quark_code = `{quark_code}\n}`

return quark_code

end

-- MODULE OPERATION

Prepare_GUI_Class_Properties_Table("GuiBase2d")

-- RETURN VALUE

return GUI_Instance_To_Quark_Code

shit i forgot to destroy temp instances lmfao

@rain lagoon so sadly the reflection service doesn't specify default values for properties, only their names, so i actually use instance.new and collect all defaults via pcalls

if that doesn't work i just set them to true

and if an instance is impossible to create with instance.new then you don't want it anyway so i dont bother getting values for such shit

⛹️ 🎣 🛀

✈️ 🗼 🤯

🥀 📤

[wet trellis]

https://tenor.com/view/please7tv-please-beg-pray-hope-gif-3860103425950934673

i need the rbxm 🙏

[cursive ginkgo]

bro wait for it cro

[cursive ginkgo]

@rain lagoon I added some syntax highlighting for the love of the game lmfao

[rain lagoon]

AYO

This is fire

Except I don't see where it says "UDim2.new()"

[cursive ginkgo]

ye i need to add that

[rain lagoon]

Fun fact: You can use Quark in plugins

uh

🤣

[cursive ginkgo]

i know

[cursive ginkgo]

ok @rain lagoon I'm pretty happy with how it ended up

had to clean up some code

textbox is not highlighted because i didnt go through the trouble of building a map on all roblox classes or anything, if you need to highlight em you add them manually in code i couldnt be bothered

to copy the text you disable highlighting anyway

because if you look inside you see it's using rich text

wait

wait

wait

there's focused event in textbox

damn

ok then ima just make text unhighlighted on focus

ok i made it react to focus events

ok @rain lagoon

https://github.com/Kvil-git/Roblox-gui-to-quark-code-plugin

here's the code

I put it under MIT license just you know cause dudes gotta get credit where credit is deserved

it really only requires credit

@lilac locust rate my code in this thing

https://github.com/Kvil-git/Roblox-gui-to-quark-code-plugin/tree/main/src/StarterGUI/ScreenGui/GUI_To_Quark_Plugin/Helper_Modules

somehow highlighting is still not perfect but ion give a shit no more bro it took too long already

[lilac locust]

you can use ReflectionService here

to cache properties of the particular gui object when you encounter one

a lazy cache

oh wait you are doing it mb

but you stil pcall it

yeah all good here

pcall again is just a decision atp

okay this looks pretty good

[rain lagoon]

woah

sorry man i was doing cranberry stuff

i managed to get opengl working

[digital shale]

that’s actually so sigma

[rain lagoon]

thats actually amazing
you even cache the data to make it faster (i think)
im not sure if it handles every single datatype but thats fine
(you can try adding Font and stuff)

does it automatically handle children and stuff like Constraints, UIGradient, UIStroke, etc?

ohh wait i understand

I would also maybe limit numbers to 4 decimals max?

[cursive ginkgo]

I dont add children, I just make them separate variables

like if you want them you select them

and the generator spits the code

And because it's recursive, children are always on top of the output, and parents are on bottom

so you never have problems with undeclared variables or whatevee

[rain lagoon]

pretty cool but i think children should be on the bottom so you dont get Parent = nil issues

[digital shale]

tired of quark story demos

we wanna see a live game

[cursive ginkgo]

i was meaning you can always do
children {...}

[digital shale]

@rain lagoon anyway to animate a list -> make the item add and remove and list reorder animated/smooth?

[rain lagoon]

You could make the actual element be inside a Frame and animate that at startup

Or animate the size of the frame if you want all the other list elements to react

Assuming everything is in a UIListLayout

[digital shale]

So that will still allow you to use the UiListlayout

and dynamically add elements to it

[cursive ginkgo]

@rain lagoon so what are you planning to do with the plugin etc

[rain lagoon]

I think most people who wanna try getting into declarative reactive UI hate the idea of memorizing and writing syntax

I've seen some people who only want the animation and reactivity and like designing UI in real time using Roblox tools

[cursive ginkgo]

yes

[rain lagoon]

This is great for those people i think

[cursive ginkgo]

so what are you gonna do with the plugin

[rain lagoon]

Cus they can make something and see what the code equivalent is

[cursive ginkgo]

I layed a starting point but im not gonna maintain allat

[rain lagoon]

I probably won't use it as much as others because i like writing the code and am pretty good at designing UI in my head more than with tools

(and because I design stuff in figma and don't wanna re-create stuff twice in Roblox)

[cursive ginkgo]

I mean are you gonna maintain it and allat

[rain lagoon]

Maybe I could but the plugin doesn't really take advantage of any other features and it doesn't need to i feel

Animations are something the user should add by themselves

[cursive ginkgo]

will you credit my ass in the docs

[rain lagoon]

Yeah sure

[cursive ginkgo]

⛹🏿

ballin

[rain lagoon]

you can add your plugin into the docs yourself

and pull request

(cus I haven't checked it out you can make an entire tutorial for it)

[cursive ginkgo]

dam

[rain lagoon]

The

Premade Instances

Page is pretty short

just append a tutorial to it lol

[cursive ginkgo]

aight I'll do it vro

👍🏿

[cursive ginkgo]

@rain lagoon I am working with QML rn and they really cooked with their State object

basically a state in qml is a table of properties, and you can use states on actual UI elements later for example on events

could you do a similar thing? Named differently ofc

also a multi-property state from quark would be good, I usually have to use more than one state if I use any

[rain lagoon]

multi-property state :0

-- HOVERING CONTROLS OTHER STATES
local hovering = State(false)

-- SIZE
local size_state = State(function(use)
    if use(hovering) then
        return UDim2.fromScale(1, 1)
    end
    return UDim2.fromScale(0.5, 0.5)
end)

-- COLOR
local color_state = State(function(use)
    if use(hovering) then
        return Color3.new(1)
    end
    return Color3.new(0)
end)

But I do like the idea of a State that consists of other states

[cursive ginkgo]

ok true

[rain lagoon]

So you could have ```lua
local StateManager = Manager({
Health = 100,
Hungry = false,
})

And in the properties you can do

[cursive ginkgo]

but sugar tho

this looks to imperative

🥷🏿

[rain lagoon]

New "Frame" {
    Size = state_manager.Health
}

[cursive ginkgo]

ye

thad be tough

[rain lagoon]

it is sugar though :/

[cursive ginkgo]

👨🏿‍🌾

[cursive ginkgo]

we love sugar cro

[rain lagoon]

Yeah lol

[cursive ginkgo]

i was asking for sugar here

like where my sugar at here

too imperative

[rain lagoon]

I hate the way lua handles function lambdas

[cursive ginkgo]

you mean in no way

cause its the same syntax

you only write 1 word less that word being the actual name

im making an ide for coding luau on android btw

[rain lagoon]

woah

[cursive ginkgo]

cause my laptop has ass battery life

xd

[rain lagoon]

lol

if roblox supported ternary operators like that it would be so cool

[cursive ginkgo]

ye rn we have this bullshit with and

[rain lagoon]

local x = use(hovering) and "yes" or "no"

[cursive ginkgo]

69 and 120 or "gtfout"

[rain lagoon]

local x = if use(hovering) then "yes" or "no"

i hate these one liners

[cursive ginkgo]

yes

[rain lagoon]

you can't even stack them well

[cursive ginkgo]

so fucking retarded

like actual brainrot

sometimes i look at it and im like:

https://tenor.com/view/bait-cat-is-this-bait-cat-is-this-ragebait-gif-10902073105296387701

[rain lagoon]

lmao

this is so beautiful

why cant roblox just use it 😠

apparently : is reserved for funny method

[cursive ginkgo]

well that is default lua

[rain lagoon]

if use(hovering)
    then Color3.new(1, 1, 1)
    else Color3.new(1, 0, 0)

[cursive ginkgo]

eh

i mean its alright i guess

not the satanic warcrimes with and

[rain lagoon]

yeah

[cursive ginkgo]

the

69 and 120 or "gtfout"

is straight from epstein's island bro

🎣

[rain lagoon]

i also want if let syntax

[digital shale]

https://create.roblox.com/docs/ui/page-layouts

Is this something worth using with quark

or just do full custom

[rain lagoon]

You definitely can use it but it's hard to use it with Reactivity

Since the CurrentPage is Read Only

You could bind a Signal to call Layout:JumpTo()

but JumpTo requires the instance

not the ID or name

PageLayout's require you to name the pages or decide their order

[digital shale]

youd have to do that with quark no

[rain lagoon]

Yeah you can its just annoying

[digital shale]

Would pagelayout not make it easier to develop page ui

with quark

rather than doing all the logic yourself

[rain lagoon]

the logic you have to write is```lua
New "Frame" {
Visible = State(function(use)
return use(Page) == 1
end)
}

[rain lagoon]

lol

man i wish roblox lambdas were better 😠

[digital shale]

now make me a toast framework

[rain lagoon]

New "Frame" {
    Visible = State(
        fn(use) => use(Page) == 1
    )
}

😔

[rain lagoon]

whats that

[digital shale]

toasts

snackbars

notifications

[rain lagoon]

ooooh

yeah those are pretty simple

[digital shale]

its why i asked ab animated ui lists

i gotta make a framework so that i can have dif systems give notifs..

[rain lagoon]

ohhh

but whats wrong with a UIListLayout and just spawning components

children = {
    Notification("Name", "Warning", "Description")
}

or just set the parent at runtime

AddChild or whatever

[digital shale]

no idea i havent started

but i think ui list makes animations harder?

[rain lagoon]

it can depending on how you wanna animate stuff

but i like that it automatically lays out where each frame should go

you can do the thing where you keep the real frame inside a pseudo-parent frame

[digital shale]

and then i lerp the position to where it should be

or something

[rain lagoon]

just use a spring

[digital shale]

u know what i mean

[rain lagoon]

yeh

[digital shale]

main thing is making the api for this

[rain lagoon]

https://media.discordapp.net/attachments/1028140087424331826/1062735734555033631/watermark.gif

[digital shale]

:SendToast(erjherhjkere)

and then that doing some quark stuff

gotta design the look of it too..

would would the module be tho......... a "ToastService", a "ToastManager", a "ToastFramework", a "ToastCore", or a "ToastSystem"

[rain lagoon]

local Toast = {}
local ToastComponent = require("path")
local holder

function Toast.Init(gui: ScreenGui)
    holder = ToastComponent.Holder(gui)
end

function Toast.Send(name, description)
    ToastComponent.Toast(holder, name, description)
end

return Toast

[digital shale]

ill prolly create the screengui in the init

[rain lagoon]

ToastComponent module

local ToastComponent = {}
local Quark = require("path")
local New = Quark.New

function ToastComponent.Holder(gui: ScreenGui)
    return New "Frame" {
        Parent = gui,
        Position = UDim2.new(1, 1),
        AnchorPoint = Vector2.one
    }
end

function ToastComponent.Toast(holder, name, desc)
    return New "Frame" {
        Parent = holder
        -- stuff
   }
end

[rain lagoon]

thats cool too

im not writing the entire code obviously but yeah

also add the UIListLayout i forgor

[digital shale]

ill have to have cleanup for when they get destroyed

[digital shale]

@rain lagoon this type of stuff usually stumps me

[rain lagoon]

ToastManager

ToastService sounds like bloat

ToastCore doesnt make sense

ToastSystem could work

[digital shale]

isnt manager something that is tracking live items

[rain lagoon]

ToastHandler

[digital shale]

ToastHandler

[cursive ginkgo]

Bruh just put the bread in the toaster

[rain lagoon]

Woman go make me a sandwich

[lilac locust]

it actually works

on incognito

[rain lagoon]

woah

[cursive ginkgo]

⛹🏿 🔥 👨🏿‍🌾

Elite ball knowledge from creeper

[rain lagoon]

Man goes on incognito
Starts quarking

[rain lagoon]

(you can edit the content but keep it 80% the same)

[cursive ginkgo]

i aint diddling allat

[cursive ginkgo]

Exploiting my plugin and chinese clankers to blitz quark guis

plugin does the heavy lifting then clanker adjusts it to my codin standards

✋🏿 🙏🏿 🤚🏿

but yeah this clanker is fucking retarded so I still have to do some stuff manually

😭

[digital shale]

@rain lagoon CREEEEEEEEEEEEPER

[rain lagoon]

hi sato

i just made this

[digital shale]

i love those types of buttons

[rain lagoon]

me too (its for a commission)

[digital shale]

was my favorite type to make when i did web react

[lilac locust]

bro always cooking

https://klipy.com/gifs/feels-the-aura

[rain lagoon]

button:hover::before {
    translate: 0 4px;
}

:P

[digital shale]

what is that..

[rain lagoon]

CSS?

[lilac locust]

why is named before instead of start 💀 is this css

oh wait

is it before hover?

[digital shale]

looks like css

[lilac locust]

and after hover

[digital shale]

but why and how r u doing css

for roblox

[rain lagoon]

on hovering over the button, its before pseudo element should move down by 4 pixels

[rain lagoon]

no css is for web dev

[lilac locust]

okay fair

[digital shale]

creeper.... im gonna make an interface that uses keys to navigate instead of mouse

[rain lagoon]

linux users

[digital shale]

in game computer terminal

no touch screen

should i use buttons for the selectables

is there a way to manually select a button

like a method

:click

[rain lagoon]

Button.Activated:Connect(callback)
```To manually click the button```rs
callback()

[digital shale]

meep

ill figure it out

i could just tag textlabels

@rain lagoon ok but what i wanted to ask

was about using the ui at runtime

outside of a story

[rain lagoon]

you can just call the Component function

[digital shale]

wanted to know what a good practice would be for setting up a module

Are Mount and Render proper terms

[rain lagoon]

MyButton(Scope, "Text") {
    Parent = script.Parent,
    Position = UDim2.new(0.5, 0.5)
}

[digital shale]

creeper..

[digital shale]

WeaponWheel being one distinct ui interface. Not being an object I suppose? (or maybe a singleton?)

And the WeaponWheel module just owns the lifecycle of the Components/Story

and when you want to show or hide it you WeaponWheel.Show()

But if its populated with data that has a limited lifetime..... do you want it to be an object that is owned by another object..?

Like

Inventory = {

Wheel = WeaponWheel.New()

}

@rain lagoon

https://klipy.com/gifs/angry-bird-21

[rain lagoon]

Theoretically yeah

You're write

Wheel:Mount(script.Parent)
Wheel:FillItems({a, b, c})
Wheel:Show()
Wheel:Hide()

Mount() is just setting the parent in this case

hell you could just write

WeaponWheel.new(script.Parent)
``` and mount it instantly

https://tenor.com/view/red-bird-sad-bird-angry-birds-gif-1535853775821462327

[digital shale]

so what is render then

[digital shale]

so i should make it an object?

Not just a "stateless" modulescript

[rain lagoon]

what if FillItems() just instantly renders them

keep a track of all created items

keep a track of their connections

if it was quark you could just write ```rs
Scope.Cleanup()

cus each item would be a component and all state is maintained inside the item you wont worry about leaking states

[digital shale]

im using quark..

[rain lagoon]

i didnt see it sorry

[rain lagoon]

i saw this and thought you were doing this manually lol

[digital shale]

im tryna figure how best wrap around the quark objects for use in the wider game

[rain lagoon]

makes sense

[digital shale]

sooooo

object.....? or stateless module

And what could the terms render and mount be used for

[rain lagoon]

I dont think you need the render and mount terms

because components are just created and automatically connected to functions

unless your weapon wheel changes in realtime i doubt you need to do anything

[digital shale]

the weapon wheel shows weapons in your inventory. so it has to be updated with what those are

[rain lagoon]

your rendering thing could be positioning the weapons with a Spring

[digital shale]

and then selection has to be connected to the equiping systems

[rain lagoon]

local PositionState = State(function(use)
    local current_number = use(CurrentNumberState)
    return -- calculate position for circle thingy 
end)

local PositionSpring = Spring(
    Center,
    PositionState,
    0.6,
    0.3
):Play()

[digital shale]

https://tenor.com/view/dachshund-dog-stare-staring-look-gif-1338547858078985908

[digital shale]

Did something change with Quark Springs

This module is a return function

In order for it to work here in the Spring it needs to be called first

Reactive()

but it is called........ inside of QuarkBase..

im confused

but not if Spring requires it directly

[rain lagoon]

QuarkBase runs Animations which requires Spring

Are you using the latest quark version

[rain lagoon]

i dont think he's using the latest quark version

or maybe the release is weird?

[digital shale]

No im sorry

I went and checked for a more recent release

And updated and it worked

And then i forgot to delete

My messages

[digital shale]

@rain lagoon https://discord.com/channels/909926338801061961/1345842437611982878

is this compatible

[rain lagoon]

well this is how it works```rs
Text.Create(
"This text is awesome!",
frame,
{
LineSorting = true,
WordSorting = true
}
)

it requires the frame

it could definitely work

local text_holder = New("Frame")

Text.Create(
    "This text is awesome!",
    text_holder.Object,
    {
        LineSorting = true,
        WordSorting = true
    }
)

[digital shale]

I probably wouldn’t do the line and word sorting, i really just need it for custom fonts

as long as it’s able to be cleaned up with quark

And be used with quark animations and states

[rain lagoon]

Yeah it should be

[rain lagoon]

this used to be the quark logo

[digital shale]

animations?

[rain lagoon]

animations would be controller by the Text+

Quark would just store the Text+ elements in a parent frame

[digital shale]

But i want quark animations..

[rain lagoon]

write your own Text component

[digital shale]

And the state updates

[cursive ginkgo]

@rain lagoon HUGE L from you cro

this is on wiki

this is in source code

https://tenor.com/view/son-im-crine-son-im-crine-gif-5176045023480767429

https://tenor.com/view/l-take-the-l-loser-gif-2755135762293631066

https://tenor.com/view/death-note-death-note-l-ll-l-lawliet-farted-gif-24991426

[rain lagoon]

😭

send the PR

[cursive ginkgo]

https://tenor.com/view/baby-laugh-ai-baby-babyfryingme-baby-sob-folk-gif-18221933230434867320

[cursive ginkgo]

I use this readme for LLMs btw

they vibecode me guis

[rain lagoon]

aw

[cursive ginkgo]

claude cooks hard bro

[rain lagoon]

fr

[cursive ginkgo]

always works first try

[rain lagoon]

by the way

[cursive ginkgo]

im scared of it

[rain lagoon]

https://creepersaur.github.io/quark/raw.html

paste the prompt into claude

(theres a button)

i already have a quark prompt

[cursive ginkgo]

DAMN

COMMON CREEPER W

https://tenor.com/view/jarvis-epstein-gif-1271162636612055521

[cursive ginkgo]

lmfao

i mean is it wrong

as if you don't look at your own examples

[cursive ginkgo]

typechecking is kinda homeless

[rain lagoon]

wth 😭

[cursive ginkgo]

LMFAO

because I do exact and not question mark shit

I think this is just luau language server being retarded at this point

[rain lagoon]

lmao

[cursive ginkgo]

so sorry for the shots fired at ya

[rain lagoon]

why are you making custom type checking

[cursive ginkgo]

xd

it's not custom

i use https://github.com/JohnnyMorganz/luau-lsp

which uses actual luau under the hood

roblox actually have their typechecking directly in the language source code

and this dude just has a language server protocol wrapper

[rain lagoon]

w

woah its written in lune?

thats crazy

[cursive ginkgo]

uh no?

its c++

and typescript

typescript is for vscode extension

it also has a neovim version

btw @rain lagoon have you ever tried putting quark components into states?

is that a thing you can do?

i am making a custom chat and would just put messages into a state

[rain lagoon]

yeah you can do that but it doesnt have any effect

cus its just a table

[cursive ginkgo]

ok

thats peak

🫡

[rain lagoon]

theoretically you could make a state that uses it

[cursive ginkgo]

no but i get a reference to the quark obj right?

[rain lagoon]

State(function(use)
    return use(obj_state).Parent
end)

idk

[cursive ginkgo]

wat

https://tenor.com/view/blink-cat-gif-9940464674384740360

https://tenor.com/view/stare-gif-2569577427706793549

[rain lagoon]

5 days later

[digital shale]

had to follow up..

wdym by my own text component.......

i just wanna use quark anims..

[rain lagoon]

make your own QuarkText+

maybe

idk

[cursive ginkgo]

I will update the gui-to-quark plugin

tomorrow

it still processes some unnecessary bullshit properties + doesnt save child-parent relationships + no ui corners or list layouts

[digital shale]

bro…

I just want to shove it into the quark ecosystem..

[rain lagoon]

you can do that

but text+ handles its own text characters i think

[digital shale]

I’d like to use quark to be able to just manage the animations of the “textlabel” as a whole

[rain lagoon]

like manage the animations of every character?

cus Text+ makes a frame with all characters as separate text labels

you can wrap that in with a New() if you want

[digital shale]

Nah just like the properties of the textlabel like position size etc

[digital shale]

Yeah

I guess

I’d just use quark on that frame

But connecting Text property to state updates…

[rain lagoon]

I haven't used text+

Read their docs

[cursive ginkgo]

sneaky peaky

[cursive ginkgo]

https://github.com/Kvil-git/Roblox-gui-to-quark-code-plugin/releases/tag/2.0

[rain lagoon]

If I could pin this i would

[cursive ginkgo]

you should make a devforum post about quark and include my plugin

[rain lagoon]

lol

[cursive ginkgo]

what the fuck was the prompt lmfao

[cursive ginkgo]

LMFAOOOO

🔥 🔥 🔥 🔥 🔥 🔥 🔥

nah @rain lagoon twin you really gotta lock in with the documentation and devforum post trust

[rain lagoon]

whats wrong with the docs

😭

[cursive ginkgo]

stylesheet

and no plugin mentioned

[rain lagoon]

yeah thats why i said

make the PR

[cursive ginkgo]

LMFAOOOO

nice

i have like 20x more bullshit named commits in my game btw

@rain lagoon where the fuck is the documentation stored it's not in the repo bro how do i make a pr for it

[rain lagoon]

its in a branh

branh

[cursive ginkgo]

bruh

use your brainh

[rain lagoon]

github pages

[cursive ginkgo]

dam

[rain lagoon]

https://github.com/creepersaur/quark/tree/pages/docs/docs

[cursive ginkgo]

i had to do cli black 🥷🏿 magic boohoo shenanigans with git to get this branch on my fork of quark repo

a whole diff remote added

but ye now i can do a pr

[rain lagoon]

cant you just do ```arm
git clone ... -b pages

[cursive ginkgo]

when you fork you only add main to origin you dont clone all the branches they are non existent

so i had to add another origin to get that branch

anyway

@rain lagoon there are 2 ways here, either renaming Stylesheets to StyleSheets in docu, or changing the name to Stylesheets in implementation

im a fan of option 2

stylesheet is a whole word not 2 words why camelcase

[rain lagoon]

yeah true

but you'd have to change a lot more

[cursive ginkgo]

but it will be better so ima do it

https://tenor.com/view/balls-gif-22045792

[cursive ginkgo]

https://github.com/creepersaur/quark/pull/7

https://github.com/creepersaur/quark/pull/8

[cursive ginkgo]

@rain lagoon you gotta add a readme for the pages or somethin

how do i verify a new markdown page works

index.html aint working

i click docs button i get this

ok it looks like this is just a browser issue

lemme try making a local server with this

ye ok it works when hosted

but when just opening index html it will be opened as file://path/index.html and wont work

[rain lagoon]

well i did get a notification on my phone

[cursive ginkgo]

whatever i used a python script to locally host this

its just inconvenient

but thats a browser issyou

[rain lagoon]

lmao

[rain lagoon]

not sure if it should be in the readme

[cursive ginkgo]

read the comment for the change

[rain lagoon]

I gotta get some props for the plugin fam

[cursive ginkgo]

^

[cursive ginkgo]

https://github.com/creepersaur/quark/pull/9

[cursive ginkgo]

it's only truth tho

fax

[rain lagoon]

I wanna change a little and put it under the documentation

[cursive ginkgo]

ok

[rain lagoon]

(it's not important to the users directly)

[cursive ginkgo]

(😭)

[cursive ginkgo]

anyway ive also made additions to documentation

you review

ima go touch grass

⛹🏿 ⛹🏿 ⛹🏿

[rain lagoon]

cool idea and all

but im gonna ask you to move that from a different page into the Premade Instances page

and also im changing the link

[cursive ginkgo]

ok

fair

[cursive ginkgo]

have you tried the new plugin version out?

[rain lagoon]

nah i was buying a cake

[junior aurora]

you amateur

real ones use the code editor that they made in pure Luau

[cursive ginkgo]

sybau

[junior aurora]

lmao

[cursive ginkgo]

you can't ragebait me

im listening to ashwagandha 2000mg playlist

[junior aurora]

im not ragebaiting

its simply the truth

[cursive ginkgo]

you are simply an attention seeking retard on the internet

https://tenor.com/view/i-don't-know-idk-idk-about-that-gif-7336250873949261946

[junior aurora]

yk how it was to make that goddamn editor in pure Lua??

[digital shale]

what is that pairs keyword usage

[cursive ginkgo]

it's just a function bro

you give it params and get output

[digital shale]

ive never seen it used like that

[cursive ginkgo]

https://tenor.com/view/chill-guy-chill-guy-just-a-chill-guy-relax-gif-1579445140409713118

[digital shale]

what is the output

[cursive ginkgo]

https://tryitands.ee

[digital shale]

sybau

[cursive ginkgo]

skiddy got mad

[digital shale]

punk

https://klipy.com/gifs/high-cortisol-level

[cursive ginkgo]

https://tenor.com/view/caterpillar-smoking-catterpillar-cool-worm-cool-catterpillar-smoking-bug-gif-25843920

[junior aurora]

lmao

[rain lagoon]

this is so quark

my laptop is lagging

and im not even inside a roblox game right now

just the homescreen

[junior aurora]

gives me flashbacks of my old laptop

[rain lagoon]

lmao

[lilac locust]

https://tryitands.ee/

no way

this works

[rain lagoon]

yay

yeah it redirects to the video

[rain lagoon]

Quark people is this a good change

for comparison this is what it used to look like

@lilac locust @cursive ginkgo @digital shale

[wet trellis]

https://media.discordapp.net/attachments/1126145668482871296/1136292679236464690/togif-1-3.gif

[lilac locust]

@rain lagoon I need yo help

how do I link a specific folder in game in project.json

like I want ReplicatedStorage\Client to be replicated to Client

[rain lagoon]

"ReplicatedStorage": {
    "Client": {
        "$path": "ReplicatedStorage/Client"
    }
}

something like that

is this good

[lilac locust]

I did that and it still synced everything 🥀

[rain lagoon]

restart the plugin

[lilac locust]

alr

[rain lagoon]

and server

[lilac locust]

this is correct right

I only need these 2 to replicate

[digital shale]

Looks better

[rain lagoon]

yeah that should work

[lilac locust]

it didn't at least not for initial sync

[rain lagoon]

https://creepersaur.github.io/quark

[worthy dagger]

i'd only use this resource

if there was some guarantee that it's maintained by an indian unemployed chud daily

and not gonna be dropped then u on ur own

[rain lagoon]

hi

go use it

[cursive ginkgo]

@rain lagoon

im not sure if this is supposed to happen

3

this stuff also fails

actually theres a ton of test failures hot dam

[rain lagoon]

hm

is this lua or luau

quicklist only works with luau

[cursive ginkgo]

it is luau bruh

here are all the tests

most of these fail

i skip them from now cause most fail

[rain lagoon]

works for me

[cursive ginkgo]

thats not what the test does cro

[rain lagoon]

i dont think the tests work with metatables then

:(

[cursive ginkgo]

hmm

nah i have metatable tests and they pass

[cursive ginkgo]

local list = ql({1, 2, 3})
local sum = 0
list:forEach(function(v) sum += v end)
expect(sum).to.equal(6)

try something like this

and this

 local list = ql({"a", "b", "c"})
 local indices = {}
            list:enumerate(function(i, v) indices[v] = i end)
expect(indices["a"]).to.equal(1)
expect(indices["b"]).to.equal(2)
expect(indices["c"]).to.equal(3)

[rain lagoon]

you're using colons

[cursive ginkgo]

a

dafuq

leme rerun

[rain lagoon]

yeah quicklist uses dots

[cursive ginkgo]

holy

shit

it passes

[rain lagoon]

https://cdn.discordapp.com/attachments/737763628618613008/1499738895670054912/togif.gif

[cursive ginkgo]

xd

[rain lagoon]

yeah

also it might be your formatter

but

[cursive ginkgo]

ye

tests are ai generated obviously

🙂‍↕️

[rain lagoon]

https://cdn.discordapp.com/attachments/1138164798652166264/1465820633723044113/ezgif.com-animated-gif-maker.gif

the only use of AI thats actually good

testicles

[digital shale]

@rain lagoon

what’s the best way to make sure menus won’t occupy the same space on the screen at the same time