Migrate to Clay main branch rather than release (#27)

Co-authored-by: Zachary Levy <zachary@sunforge.is>
Reviewed-on: #27

draw/backdrop.odin

@@ -684,7 +684,13 @@ upload_backdrop_primitives :: proc(device: ^sdl.GPUDevice, pass: ^sdl.GPUCopyPas
 		sdl.GPUBufferUsageFlags{.GRAPHICS_STORAGE_READ},
 	)
 
-	prim_array := sdl.MapGPUTransferBuffer(device, GLOB.backdrop.primitive_buffer.transfer, false)
+	// cycle=true: this is a persistent per-frame streaming transfer buffer. The previous
+	// frame's UploadToGPUBuffer is almost certainly still in flight when we map here
+	// (allowedFramesInFlight defaults to 2 on Metal). Without cycling, the CPU memcpy below
+	// races the GPU's blit read on the same MTLBuffer.contents. Cycling rebinds the
+	// container's active internal buffer to an unbound one (or allocates a new one) — O(1)
+	// in steady state, no fence wait. See SDL_gpu_metal.m's METAL_INTERNAL_PrepareBufferForWrite.
+	prim_array := sdl.MapGPUTransferBuffer(device, GLOB.backdrop.primitive_buffer.transfer, true)
 	if prim_array == nil {
 		log.panicf("Failed to map backdrop primitive transfer buffer: %s", sdl.GetError())
 	}

draw/core_2d.odin

@@ -538,7 +538,9 @@ upload :: proc(device: ^sdl.GPUDevice, pass: ^sdl.GPUCopyPass) {
 			sdl.GPUBufferUsageFlags{.VERTEX},
 		)
 
-		vert_array := sdl.MapGPUTransferBuffer(device, GLOB.core_2d.vertex_buffer.transfer, false)
+		// cycle=true: see backdrop.odin upload_backdrop_primitives. Persistent per-frame
+		// streaming buffer; previous frame's blit is still in flight at map time.
+		vert_array := sdl.MapGPUTransferBuffer(device, GLOB.core_2d.vertex_buffer.transfer, true)
 		if vert_array == nil {
 			log.panicf("Failed to map vertex transfer buffer: %s", sdl.GetError())
 		}
@@ -569,7 +571,8 @@ upload :: proc(device: ^sdl.GPUDevice, pass: ^sdl.GPUCopyPass) {
 
 		grow_buffer_if_needed(device, &GLOB.core_2d.index_buffer, index_size, sdl.GPUBufferUsageFlags{.INDEX})
 
-		idx_array := sdl.MapGPUTransferBuffer(device, GLOB.core_2d.index_buffer.transfer, false)
+		// cycle=true: see vertex_buffer above.
+		idx_array := sdl.MapGPUTransferBuffer(device, GLOB.core_2d.index_buffer.transfer, true)
 		if idx_array == nil {
 			log.panicf("Failed to map index transfer buffer: %s", sdl.GetError())
 		}
@@ -596,7 +599,8 @@ upload :: proc(device: ^sdl.GPUDevice, pass: ^sdl.GPUCopyPass) {
 			sdl.GPUBufferUsageFlags{.GRAPHICS_STORAGE_READ},
 		)
 
-		prim_array := sdl.MapGPUTransferBuffer(device, GLOB.core_2d.primitive_buffer.transfer, false)
+		// cycle=true: see vertex_buffer above.
+		prim_array := sdl.MapGPUTransferBuffer(device, GLOB.core_2d.primitive_buffer.transfer, true)
 		if prim_array == nil {
 			log.panicf("Failed to map primitive transfer buffer: %s", sdl.GetError())
 		}

draw/draw.odin

@@ -915,6 +915,8 @@ dispatch_clay_command :: proc(
 			}
 		}
 	case clay.RenderCommandType.ScissorEnd:
+	case clay.RenderCommandType.OverlayColorStart, clay.RenderCommandType.OverlayColorEnd:
+		unimplemented("Clay overlays not supported yet...")
 	case clay.RenderCommandType.Rectangle:
 		render_data := render_command.renderData.rectangle
 		cr := render_data.cornerRadius

draw/examples/hellope.odin

@@ -244,9 +244,8 @@ hellope_clay :: proc() {
 		base_layer := draw.begin({width = 500, height = 500})
 		clay.SetLayoutDimensions({width = base_layer.bounds.width, height = base_layer.bounds.height})
 		clay.BeginLayout()
-		if clay.UI()(
+		if clay.UI(clay.ID("outer"))(
 		{
-			id = clay.ID("outer"),
 			layout = {
 				sizing = {clay.SizingGrow({}), clay.SizingGrow({})},
 				childAlignment = {x = .Center, y = .Center},
@@ -254,11 +253,11 @@ hellope_clay :: proc() {
 			backgroundColor = {127, 127, 127, 255},
 		},
 		) {
-			clay.Text("Hellope!", &text_config)
+			clay.Text("Hellope!", text_config)
 		}
 		clay_batch := draw.ClayBatch {
 			bounds = base_layer.bounds,
-			cmds   = clay.EndLayout(),
+			cmds   = clay.EndLayout(0),
 		}
 		draw.prepare_clay_batch(base_layer, &clay_batch, {0, 0})
 		draw.end(gpu, window)
@@ -282,10 +281,12 @@ hellope_custom :: proc() {
 	gauge := Gauge {
 		value    = 0.73,
 		color    = {50, 200, 100, 255},
+		bg_color = {80, 80, 80, 255},
 	}
 	gauge2 := Gauge {
 		value    = 0.45,
 		color    = {200, 100, 50, 255},
+		bg_color = {80, 80, 80, 255},
 	}
 
 	// `clay.CustomElementConfig.customData` is a rawptr; the Clay integration in `draw`
@@ -320,9 +321,8 @@ hellope_custom :: proc() {
 		clay.SetLayoutDimensions({width = base_layer.bounds.width, height = base_layer.bounds.height})
 		clay.BeginLayout()
 
-		if clay.UI()(
+		if clay.UI(clay.ID("outer"))(
 		{
-			id = clay.ID("outer"),
 			layout = {
 				sizing = {clay.SizingGrow({}), clay.SizingGrow({})},
 				childAlignment = {x = .Center, y = .Center},
@@ -332,8 +332,8 @@ hellope_custom :: proc() {
 			backgroundColor = {50, 50, 50, 255},
 		},
 		) {
-			if clay.UI()({id = clay.ID("title"), layout = {sizing = {clay.SizingFit({}), clay.SizingFit({})}}}) {
+			if clay.UI(clay.ID("title"))({layout = {sizing = {clay.SizingFit({}), clay.SizingFit({})}}}) {
-				clay.Text("Custom Draw Demo", &text_config)
+				clay.Text("Custom Draw Demo", text_config)
 			}
 
 			// gauge1 is BEHIND the backdrop — the backdrop is declared as a floating CHILD
@@ -344,17 +344,15 @@ hellope_custom :: proc() {
 			// reflection inside the strip), and gauge2 is deferred-replayed by
 			// `prepare_clay_batch` after the bracket closes (renders crisp on top of the
 			// bracket output — unrelated to the strip since they don't overlap).
-			if clay.UI()(
+			// `backgroundColor` is omitted on the gauges; bg lives on `Gauge.bg_color`. See `draw_custom`.
+			if clay.UI(clay.ID("gauge"))(
 			{
-				id = clay.ID("gauge"),
 				layout = {sizing = {clay.SizingFixed(300), clay.SizingFixed(30)}},
 				custom = {customData = &gauge_custom},
-				backgroundColor = {80, 80, 80, 255},
 			},
 			) {
-				if clay.UI()(
+				if clay.UI(clay.ID("backdrop"))(
 				{
-					id = clay.ID("backdrop"),
 					floating = {attachTo = .Parent, attachment = {parent = .LeftTop, element = .LeftTop}},
 					layout = {sizing = {clay.SizingFixed(300), clay.SizingFixed(30)}},
 					custom = {customData = &backdrop_custom},
@@ -362,19 +360,17 @@ hellope_custom :: proc() {
 				) {}
 			}
 
-			if clay.UI()(
+			if clay.UI(clay.ID("gauge2"))(
 			{
-				id = clay.ID("gauge2"),
 				layout = {sizing = {clay.SizingFixed(300), clay.SizingFixed(30)}},
 				custom = {customData = &gauge2_custom},
-				backgroundColor = {80, 80, 80, 255},
 			},
 			) {}
 		}
 
 		clay_batch := draw.ClayBatch {
 			bounds = base_layer.bounds,
-			cmds   = clay.EndLayout(),
+			cmds   = clay.EndLayout(0),
 		}
 		draw.prepare_clay_batch(base_layer, &clay_batch, {0, 0}, custom_draw = draw_custom)
 		draw.end(gpu, window)
@@ -383,6 +379,7 @@ hellope_custom :: proc() {
 	Gauge :: struct {
 		value:    f32,
 		color:    draw.Color,
+		bg_color: draw.Color,
 	}
 
 	draw_custom :: proc(layer: ^draw.Layer, bounds: draw.Rectangle, render_data: clay.CustomRenderData) {
@@ -391,14 +388,12 @@ hellope_custom :: proc() {
 		// before the union refactor.
 		gauge := cast(^Gauge)render_data.customData
 
+		// `gauge.bg_color` instead of `render_data.backgroundColor`: under Clay master, an
+		// element with both `custom.customData` and `backgroundColor` emits a Custom AND a
+		// Rectangle for the same bounds, in that order — the Rectangle paints over the
+		// callback's output. Carrying bg on user data sidesteps it.
 		border_width: f32 = 2
-		draw.rectangle(
+		draw.rectangle(layer, bounds, gauge.bg_color, outline_color = draw.WHITE, outline_width = border_width)
-			layer,
-			bounds,
-			draw.color_from_clay(render_data.backgroundColor),
-			outline_color = draw.WHITE,
-			outline_width = border_width,
-		)
 
 		fill := draw.Rectangle {
 			x      = bounds.x,

vendor/clay/clay.odin

@@ -57,11 +57,6 @@ CornerRadius :: struct {
 	bottomRight: c.float,
 }
 
-BorderData :: struct {
-	width: u32,
-	color: Color,
-}
-
 ElementId :: struct {
 	id:       u32,
 	offset:   u32,
@@ -69,6 +64,12 @@ ElementId :: struct {
 	stringId: String,
 }
 
+ElementIdArray :: struct {
+	capacity:      i32,
+	length:        i32,
+	internalArray: [^]ElementId,
+}
+
 when ODIN_OS == .Windows {
 	EnumBackingType :: u32
 } else {
@@ -83,6 +84,8 @@ RenderCommandType :: enum EnumBackingType {
 	Image,
 	ScissorStart,
 	ScissorEnd,
+	OverlayColorStart,
+	OverlayColorEnd,
 	Custom,
 }
 
@@ -138,6 +141,92 @@ BorderElementConfig :: struct {
 	width: BorderWidth,
 }
 
+TransitionData :: struct {
+	boundingBox:     BoundingBox,
+	backgroundColor: Color,
+	overlayColor:    Color,
+	borderColor:     Color,
+	borderWidth:     BorderWidth,
+}
+
+TransitionState :: enum c.int {
+	Idle,
+	Entering,
+	Transitioning,
+	Exiting,
+}
+
+TransitionProperty :: enum c.int {
+	X,
+	Y,
+	Width,
+	Height,
+	BackgroundColor,
+	OverlayColor,
+	CornerRadius,
+	BorderColor,
+	BorderWidth,
+}
+
+TransitionPropertyFlags :: bit_set[TransitionProperty;c.int]
+TransitionPropertyPosition :: TransitionPropertyFlags{.X, .Y}
+TransitionPropertyDimensions :: TransitionPropertyFlags{.Width, .Height}
+TransitionPropertyBoundingBox :: TransitionPropertyPosition + TransitionPropertyDimensions
+TransitionPropertyBorder :: TransitionPropertyFlags{.BorderColor, .BorderWidth}
+
+TransitionCallbackArguments :: struct {
+	transitionState: TransitionState,
+	initial:         TransitionData,
+	current:         ^TransitionData,
+	target:          TransitionData,
+	elapsedTime:     f32,
+	duration:        f32,
+	properties:      TransitionPropertyFlags,
+}
+
+TransitionEnterTriggerType :: enum EnumBackingType {
+	SkipOnFirstParentFrame,
+	TriggerOnFirstParentFrame,
+}
+
+TransitionExitTriggerType :: enum EnumBackingType {
+	SkipWhenParentExits,
+	TriggerWhenParentExits,
+}
+
+TransitionInteractionHandlingType :: enum EnumBackingType {
+	DisableInteractionsWhileTransitioningPosition,
+	AllowInteractionsWhileTransitioningPosition,
+}
+
+ExitTransitionSiblingOrdering :: enum EnumBackingType {
+	UnderneathSiblings,
+	NaturalOrder,
+	AboveSiblings,
+}
+
+TransitionElementConfig :: struct {
+	handler:             proc "c" (args: TransitionCallbackArguments) -> bool,
+	duration:            f32,
+	properties:          TransitionPropertyFlags,
+	interactionHandling: TransitionInteractionHandlingType,
+	enter:               struct {
+		setInitialState: proc "c" (
+			initialState: TransitionData,
+			properties: TransitionPropertyFlags,
+		) -> TransitionData,
+		trigger:         TransitionEnterTriggerType,
+	},
+	exit:                struct {
+		setFinalState:   proc "c" (
+			finalState: TransitionData,
+			properties: TransitionPropertyFlags,
+		) -> TransitionData,
+		trigger:         TransitionExitTriggerType,
+		siblingOrdering: ExitTransitionSiblingOrdering,
+	},
+}
+
 ClipElementConfig :: struct {
 	horizontal:  bool, // clip overflowing elements on the "X" axis
 	vertical:    bool, // clip overflowing elements on the "Y" axis
@@ -215,6 +304,15 @@ CustomRenderData :: struct {
 	customData:      rawptr,
 }
 
+ClipRenderData :: struct {
+	horizontal: bool,
+	vertical:   bool,
+}
+
+OverlayColorRenderData :: struct {
+	color: Color,
+}
+
 BorderRenderData :: struct {
 	color:        Color,
 	cornerRadius: CornerRadius,
@@ -227,6 +325,8 @@ RenderCommandData :: struct #raw_union {
 	image:        ImageRenderData,
 	custom:       CustomRenderData,
 	border:       BorderRenderData,
+	clip:         ClipRenderData,
+	overlayColor: OverlayColorRenderData,
 }
 
 RenderCommand :: struct {
@@ -338,9 +438,9 @@ ClayArray :: struct($type: typeid) {
 }
 
 ElementDeclaration :: struct {
-	id:              ElementId,
 	layout:          LayoutConfig,
 	backgroundColor: Color,
+	overlayColor:    Color,
 	cornerRadius:    CornerRadius,
 	aspectRatio:     AspectRatioElementConfig,
 	image:           ImageElementConfig,
@@ -348,6 +448,7 @@ ElementDeclaration :: struct {
 	custom:          CustomElementConfig,
 	clip:            ClipElementConfig,
 	border:          BorderElementConfig,
+	transition:      TransitionElementConfig,
 	userData:        rawptr,
 }
 
@@ -360,6 +461,7 @@ ErrorType :: enum EnumBackingType {
 	FloatingContainerParentNotFound,
 	PercentageOver1,
 	InternalError,
+	UnbalancedOpenClose,
 }
 
 ErrorData :: struct {
@@ -378,23 +480,27 @@ Context :: struct {} // opaque structure, only use as a pointer
 @(link_prefix = "Clay_", default_calling_convention = "c")
 foreign Clay {
 	_OpenElement :: proc() ---
+	_OpenElementWithId :: proc(id: ElementId) ---
 	_CloseElement :: proc() ---
 	MinMemorySize :: proc() -> u32 ---
 	CreateArenaWithCapacityAndMemory :: proc(capacity: c.size_t, offset: [^]u8) -> Arena ---
 	SetPointerState :: proc(position: Vector2, pointerDown: bool) ---
+	GetPointerState :: proc() -> PointerData ---
 	Initialize :: proc(arena: Arena, layoutDimensions: Dimensions, errorHandler: ErrorHandler) -> ^Context ---
 	GetCurrentContext :: proc() -> ^Context ---
 	SetCurrentContext :: proc(ctx: ^Context) ---
 	UpdateScrollContainers :: proc(enableDragScrolling: bool, scrollDelta: Vector2, deltaTime: c.float) ---
 	SetLayoutDimensions :: proc(dimensions: Dimensions) ---
 	BeginLayout :: proc() ---
-	EndLayout :: proc() -> ClayArray(RenderCommand) ---
+	EndLayout :: proc(deltaTime: c.float) -> ClayArray(RenderCommand) ---
+	GetOpenElementId :: proc() -> u32 ---
 	GetElementId :: proc(id: String) -> ElementId ---
 	GetElementIdWithIndex :: proc(id: String, index: u32) -> ElementId ---
 	GetElementData :: proc(id: ElementId) -> ElementData ---
 	Hovered :: proc() -> bool ---
 	OnHover :: proc(onHoverFunction: proc "c" (id: ElementId, pointerData: PointerData, userData: rawptr), userData: rawptr) ---
 	PointerOver :: proc(id: ElementId) -> bool ---
+	GetPointerOverIds :: proc() -> ElementIdArray ---
 	GetScrollOffset :: proc() -> Vector2 ---
 	GetScrollContainerData :: proc(id: ElementId) -> ScrollContainerData ---
 	SetMeasureTextFunction :: proc(measureTextFunction: proc "c" (text: StringSlice, config: ^TextElementConfig, userData: rawptr) -> Dimensions, userData: rawptr) ---
@@ -408,15 +514,15 @@ foreign Clay {
 	GetMaxMeasureTextCacheWordCount :: proc() -> i32 ---
 	SetMaxMeasureTextCacheWordCount :: proc(maxMeasureTextCacheWordCount: i32) ---
 	ResetMeasureTextCache :: proc() ---
+	EaseOut :: proc(arguments: TransitionCallbackArguments) -> bool ---
 }
 
 @(link_prefix = "Clay_", default_calling_convention = "c", private)
 foreign Clay {
 	_ConfigureOpenElement :: proc(config: ElementDeclaration) ---
-	_HashString :: proc(key: String, offset: u32, seed: u32) -> ElementId ---
+	_HashString :: proc(key: String, seed: u32) -> ElementId ---
-	_OpenTextElement :: proc(text: String, textConfig: ^TextElementConfig) ---
+	_HashStringWithOffset :: proc(key: String, index: u32, seed: u32) -> ElementId ---
-	_StoreTextElementConfig :: proc(config: TextElementConfig) -> ^TextElementConfig ---
+	_OpenTextElement :: proc(text: String, textConfig: TextElementConfig) ---
-	_GetParentElementId :: proc() -> u32 ---
 }
 
 ConfigureOpenElement :: proc(config: ElementDeclaration) -> bool {
@@ -425,25 +531,37 @@ ConfigureOpenElement :: proc(config: ElementDeclaration) -> bool {
 }
 
 @(deferred_none = _CloseElement)
-UI :: proc() -> proc (config: ElementDeclaration) -> bool {
+UI_WithId :: proc(id: ElementId) -> proc(config: ElementDeclaration) -> bool {
+	_OpenElementWithId(id)
+	return ConfigureOpenElement
+}
+
+@(deferred_none = _CloseElement)
+UI_AutoId :: proc() -> proc(config: ElementDeclaration) -> bool {
 	_OpenElement()
 	return ConfigureOpenElement
 }
 
-Text :: proc($text: string, config: ^TextElementConfig) {
+UI :: proc {
+	UI_WithId,
+	UI_AutoId,
+}
+
+Text :: proc {
+	TextStatic,
+	TextDynamic,
+}
+
+TextStatic :: proc($text: string, config: TextElementConfig) {
 	wrapped := MakeString(text)
 	wrapped.isStaticallyAllocated = true
 	_OpenTextElement(wrapped, config)
 }
 
-TextDynamic :: proc(text: string, config: ^TextElementConfig) {
+TextDynamic :: proc(text: string, config: TextElementConfig) {
 	_OpenTextElement(MakeString(text), config)
 }
 
-TextConfig :: proc(config: TextElementConfig) -> ^TextElementConfig {
-	return _StoreTextElementConfig(config)
-}
-
 PaddingAll :: proc(allPadding: u16) -> Padding {
 	return {left = allPadding, right = allPadding, top = allPadding, bottom = allPadding}
 }
@@ -460,11 +578,11 @@ CornerRadiusAll :: proc(radius: f32) -> CornerRadius {
 	return CornerRadius{radius, radius, radius, radius}
 }
 
-SizingFit :: proc(sizeMinMax: SizingConstraintsMinMax) -> SizingAxis {
+SizingFit :: proc(sizeMinMax: SizingConstraintsMinMax = {}) -> SizingAxis {
 	return SizingAxis{type = SizingType.Fit, constraints = {sizeMinMax = sizeMinMax}}
 }
 
-SizingGrow :: proc(sizeMinMax: SizingConstraintsMinMax) -> SizingAxis {
+SizingGrow :: proc(sizeMinMax: SizingConstraintsMinMax = {}) -> SizingAxis {
 	return SizingAxis{type = SizingType.Grow, constraints = {sizeMinMax = sizeMinMax}}
 }
 
@@ -481,9 +599,9 @@ MakeString :: proc(label: string) -> String {
 }
 
 ID :: proc(label: string, index: u32 = 0) -> ElementId {
-	return _HashString(MakeString(label), index, 0)
+	return _HashString(MakeString(label), index)
 }
 
 ID_LOCAL :: proc(label: string, index: u32 = 0) -> ElementId {
-	return _HashString(MakeString(label), index, _GetParentElementId())
+	return _HashStringWithOffset(MakeString(label), index, GetOpenElementId())
 }

vendor/clay/odinfmt.json

@@ -1,6 +0,0 @@
-{
-	"$schema": "https://raw.githubusercontent.com/DanielGavin/ols/master/misc/odinfmt.schema.json",
-	"character_width": 180,
-	"sort_imports": true,
-	"tabs": false
-}