@rbxts/react-clean-ui 1.0.38 → 1.1.0

package/out/Components/Surface/Box.luau

@@ -9,15 +9,14 @@ local BoxShadow = _Decorator.BoxShadow
 local Container = TS.import(script, script.Parent.Parent, "Layout").Container
 local _Helpers = TS.import(script, script.Parent.Parent.Parent, "Helpers")
 local SizeHelper = _Helpers.SizeHelper
-local CssHelper = _Helpers.CssHelper
+local SpacingHelper = _Helpers.SpacingHelper
 local Box = React.forwardRef(function(props, ref)
 	local theme = React.useContext(CleanThemeContext)
-	local paddingSourceProps = props
-	local hasCustomPadding = paddingSourceProps.top ~= nil or paddingSourceProps.bottom ~= nil or paddingSourceProps.left ~= nil or paddingSourceProps.right ~= nil or paddingSourceProps.spacing ~= nil or paddingSourceProps.padding ~= nil or paddingSourceProps.resolvedPadding ~= nil
-	local themePadding = theme.components.box.padding
-	local paddingProps = if not hasCustomPadding and themePadding ~= nil then {
-		resolvedPadding = CssHelper:parseCssQuad(themePadding),
-	} else paddingSourceProps
+	local _condition = props["border-thickness"]
+	if _condition == nil then
+		_condition = theme.components.box.borderThickness
+	end
+	local borderThickness = _condition
 	local _attributes = {
 		ref = ref,
 	}
@@ -26,31 +25,26 @@ local Box = React.forwardRef(function(props, ref)
 	end
 	_attributes.Size = SizeHelper:GetSize(props, UDim2.fromScale(1, 1))
 	_attributes.AutomaticSize = SizeHelper:GetAutoSize(props)
-	local _condition = props.BackgroundTransparency
-	if _condition == nil then
-		_condition = theme.components.box.backgroundTransparency
+	local _condition_1 = props.BackgroundTransparency
+	if _condition_1 == nil then
+		_condition_1 = theme.components.box.backgroundTransparency
 	end
-	_attributes.BackgroundTransparency = _condition
+	_attributes.BackgroundTransparency = _condition_1
 	_attributes.BackgroundColor3 = props.BackgroundColor3 or theme.components.box.backgroundColor
 	_attributes.ZIndex = props.ZIndex
 	_attributes.Event = props.Event
 	_attributes.backgroundImage = props["background-image"] or theme.components.box.backgroundImage
-	local _attributes_1 = {}
-	local _condition_1 = props["border-thickness"]
-	if _condition_1 == nil then
-		_condition_1 = theme.components.box.borderThickness
-	end
-	_attributes_1.Thickness = _condition_1
-	_attributes_1.BorderStrokePosition = Enum.BorderStrokePosition.Inner
-	_attributes_1.Color = props["border-color"] or theme.components.box.borderColor
-	local _exp = React.createElement("uistroke", _attributes_1)
-	local _attributes_2 = table.clone(props)
-	setmetatable(_attributes_2, nil)
-	_attributes_2.value = theme.components.box.boxShadow
-	local _exp_1 = React.createElement(BoxShadow, _attributes_2)
-	local _attributes_3 = table.clone(paddingProps)
-	setmetatable(_attributes_3, nil)
-	return React.createElement(Container, _attributes, _exp, _exp_1, React.createElement(Padding, _attributes_3), React.createElement(Corners, {
+	local _exp = borderThickness > 0 and (React.createElement("uistroke", {
+		Thickness = borderThickness,
+		BorderStrokePosition = Enum.BorderStrokePosition.Inner,
+		Color = props["border-color"] or theme.components.box.borderColor,
+	}))
+	local _attributes_1 = table.clone(props)
+	setmetatable(_attributes_1, nil)
+	_attributes_1.value = theme.components.box.boxShadow
+	return React.createElement(Container, _attributes, _exp, React.createElement(BoxShadow, _attributes_1), React.createElement(Padding, {
+		resolvedPadding = SpacingHelper:GetResolvedPadding(theme, props, theme.components.box.spacing, theme.components.box.padding),
+	}), React.createElement(Corners, {
 		radius = theme.components.box.cornerRadius,
 	}), props.children)
 end)

package/out/Components/Surface/Card.d.ts

@@ -1,9 +1,11 @@
 import React from "@rbxts/react";
 import { BoxProps } from "./Box";
-import { IntentElementProps, PositionElementProps, ZIndexElementProps } from "../../Interfaces";
-interface CardHeaderProps extends IntentElementProps, PositionElementProps, ZIndexElementProps {
+import { CssPadding, IntentElementProps, PositionElementProps, ResolvedPadding, SpacedElementProps, ZIndexElementProps } from "../../Interfaces";
+interface CardHeaderProps extends IntentElementProps, PositionElementProps, ZIndexElementProps, SpacedElementProps {
     children?: React.ReactNode;
     overlay?: boolean;
+    padding?: CssPadding;
+    resolvedPadding?: ResolvedPadding;
 }
 export declare const CardHeader: React.ForwardRefExoticComponent<CardHeaderProps & React.RefAttributes<ImageLabel>>;
 interface CardBodyProps extends BoxProps {
@@ -11,6 +13,8 @@ interface CardBodyProps extends BoxProps {
 export declare const CardBody: React.ForwardRefExoticComponent<Omit<CardBodyProps, "ref"> & React.RefAttributes<ImageLabel>>;
 interface CardFooterProps extends BoxProps, IntentElementProps {
     overlay?: boolean;
+    padding?: CssPadding;
+    resolvedPadding?: ResolvedPadding;
 }
 export declare const CardFooter: React.ForwardRefExoticComponent<Omit<CardFooterProps, "ref"> & React.RefAttributes<ImageLabel>>;
 interface CardProps extends BoxProps, IntentElementProps {

package/out/Components/Surface/Card.luau

@@ -159,7 +159,7 @@ local CardHeader = React.forwardRef(function(props, ref)
 	local theme = React.useContext(CleanThemeContext)
 	local card = React.useContext(CardContext)
 	local intent = ColorHelper:getIntentColors(theme, props.intent or card.intent or "primary", "default", theme.components.card.header.intents)
-	local padding = SpacingHelper:ResolveNumberPadding(SpacingHelper:GetPadding(theme, "md", theme.components.card.header.spacing))
+	local padding = SpacingHelper:GetResolvedPadding(theme, props, theme.components.card.header.spacing, theme.components.card.header.padding, "md")
 	local corners = CssHelper:parseCssSize(theme.components.card.cornerRadius)
 	local _binding = resolveOverlayPosition(props, theme.components.card.header.position)
 	local overlay = _binding.overlay
@@ -207,39 +207,15 @@ local CardHeader = React.forwardRef(function(props, ref)
 end)
 local CardBody = React.forwardRef(function(props, ref)
 	local theme = React.useContext(CleanThemeContext)
-	-- Mirrors Box.tsx's own padding resolution (CardBody wraps its
-	-- children in a Container, not a Box, so it doesn't get Box's
-	-- automatic `box.padding` application for free) — apply the card
-	-- body's own theme padding only when the caller hasn't set explicit
-	-- padding props. `card.body.padding`, when set, is an intentional
-	-- full-override escape hatch and wins wholesale over everything
-	-- below. Absent that, top/bottom fall back to the same generic
-	-- md-scale default Header/Footer use for their own padding (NOT
-	-- `box.padding`'s top/bottom) — CardBody's bottom padding stacks
-	-- directly against an in-flow CardFooter's own top padding (the
-	-- VStack's spacing is "None"), so inheriting `box.padding`'s
-	-- vertical values here would double them up with Footer's/Header's
-	-- own padding. Left/right still inherit `box.padding` since nothing
-	-- else contributes horizontal padding at that seam.
+	-- Unified 4-tier padding resolution (see SpacingHelper.GetResolvedPadding):
+	-- `card.body.spacing` (tier 2) overrides the global spacing map per
+	-- scale key, falling back to it for any key it doesn't define, and
+	-- `card.body.padding` (tier 3) overrides the scale-based tiers
+	-- entirely at the active key. CardBody wraps its children in a
+	-- Container, not a Box, so it doesn't get Box's automatic
+	-- `box.padding` application for free — this resolves independently
+	-- against `theme.components.card.body`'s own tiers.
 	local paddingSourceProps = props
-	local hasCustomPadding = paddingSourceProps.top ~= nil or paddingSourceProps.bottom ~= nil or paddingSourceProps.left ~= nil or paddingSourceProps.right ~= nil or paddingSourceProps.spacing ~= nil or paddingSourceProps.padding ~= nil or paddingSourceProps.resolvedPadding ~= nil
-	local _bodyThemePadding = theme.components.card.body
-	if _bodyThemePadding ~= nil then
-		_bodyThemePadding = _bodyThemePadding.padding
-	end
-	local bodyThemePadding = _bodyThemePadding
-	local boxThemePadding = theme.components.box.padding
-	local mdPadding = SpacingHelper:GetPadding(theme, "md")
-	local paddingProps = if hasCustomPadding then paddingSourceProps elseif bodyThemePadding ~= nil then {
-		resolvedPadding = CssHelper:parseCssQuad(bodyThemePadding),
-	} else {
-		resolvedPadding = {
-			top = mdPadding,
-			bottom = mdPadding,
-			left = if boxThemePadding ~= nil then CssHelper:parseCssQuad(boxThemePadding).left else mdPadding,
-			right = if boxThemePadding ~= nil then CssHelper:parseCssQuad(boxThemePadding).right else mdPadding,
-		},
-	}
 	local _attributes = {
 		ref = ref,
 		Size = SizeHelper:GetSize(props, UDim2.fromScale(0, 0)),
@@ -248,15 +224,23 @@ local CardBody = React.forwardRef(function(props, ref)
 		_attributes[_k] = _v
 	end
 	_attributes.AutomaticSize = Enum.AutomaticSize.XY
-	local _attributes_1 = table.clone(paddingProps)
-	setmetatable(_attributes_1, nil)
+	local _attributes_1 = {}
+	local _result = theme.components.card.body
+	if _result ~= nil then
+		_result = _result.spacing
+	end
+	local _result_1 = theme.components.card.body
+	if _result_1 ~= nil then
+		_result_1 = _result_1.padding
+	end
+	_attributes_1.resolvedPadding = SpacingHelper:GetResolvedPadding(theme, paddingSourceProps, _result, _result_1)
 	return React.createElement(FlexItem, nil, React.createElement(Container, _attributes, React.createElement(Padding, _attributes_1), props.children))
 end)
 local CardFooter = React.forwardRef(function(props, ref)
 	local theme = React.useContext(CleanThemeContext)
 	local card = React.useContext(CardContext)
 	local intent = ColorHelper:getIntentColors(theme, props.intent or card.intent or "primary", "default", theme.components.card.footer.intents)
-	local padding = SpacingHelper:ResolveNumberPadding(SpacingHelper:GetPadding(theme, "md", theme.components.card.footer.spacing))
+	local padding = SpacingHelper:GetResolvedPadding(theme, props, theme.components.card.footer.spacing, theme.components.card.footer.padding, "md")
 	local corners = CssHelper:parseCssSize(theme.components.card.cornerRadius)
 	local _binding = resolveOverlayPosition(props, theme.components.card.footer.position)
 	local overlay = _binding.overlay
@@ -396,6 +380,41 @@ local Card = React.forwardRef(function(props, ref)
 	local overlayHeader = _binding.overlayHeader
 	local overlayFooter = _binding.overlayFooter
 	local hasOverlay = overlayHeader ~= nil or overlayFooter ~= nil
+	React.useEffect(function()
+		if not hasOverlay then
+			return nil
+		end
+		local frame = overlayWrapperRef.current
+		if not frame then
+			return nil
+		end
+		-- Some renderers (e.g. the browser-based Loom scene preview) don't
+		-- back this ref with an instance that supports property-changed
+		-- signals, so guard the subscription instead of throwing and
+		-- losing overlay clearance tracking.
+		local positionConn
+		local sizeConn
+		pcall(function()
+			positionConn = frame:GetPropertyChangedSignal("AbsolutePosition"):Connect(function()
+				return setWrapperAbsoluteY(frame.AbsolutePosition.Y)
+			end)
+		end)
+		pcall(function()
+			sizeConn = frame:GetPropertyChangedSignal("AbsoluteSize"):Connect(function()
+				return setWrapperAbsoluteSize(frame.AbsoluteSize)
+			end)
+		end)
+		return function()
+			local _result = positionConn
+			if _result ~= nil then
+				_result:Disconnect()
+			end
+			local _result_1 = sizeConn
+			if _result_1 ~= nil then
+				_result_1:Disconnect()
+			end
+		end
+	end, { hasOverlay })
 	-- How far the overlay header's bottom edge extends past the
 	-- wrapper's (i.e. the Box's) top edge — 0 when there's no overlap
 	-- (e.g. a small/no theme offset) or nothing has been measured yet.
@@ -428,27 +447,54 @@ local Card = React.forwardRef(function(props, ref)
 		_result = props
 	end
 	local boxProps = _result
-	-- When an overlay header and/or footer measurably overlaps into the
-	-- Box (headerClearance/footerClearance > 0), reserve that much extra
-	-- top/bottom padding via resolvedPadding — this takes over Box's own
-	-- outer padding, which is harmless since Card always forces
-	-- spacing="None" on Box below anyway (so it was always 0/0/0/0 until
-	-- now).
+	-- When there's no footer at all, footerClearance is always 0 (there's
+	-- nothing to measure an overlap against), so fall back to the Box's
+	-- own explicit theme.components.box.padding bottom inset — if the
+	-- theme sets one — as a floor instead. This keeps content clear of a
+	-- themed Box's decorative border image (e.g. wooden's wood-frame art,
+	-- which needs a real bottom inset) even when there's no footer to
+	-- reserve that space via measured overlap. Themes that don't set an
+	-- explicit box padding (GetExplicitPadding returns undefined) resolve
+	-- this floor to 0, so behavior there is unchanged. When a footer IS
+	-- present, footerClearance (its real measured overlap) is used as-is
+	-- exactly as before — this floor never applies then, since the
+	-- footer's own overlap already reserves whatever space it needs.
 	local _result_1
-	if headerClearance > 0 or footerClearance > 0 then
+	if overlayFooter == nil then
+		local _result_2 = SpacingHelper:GetExplicitPadding(theme.components.box.padding, theme.default.spacing)
+		if _result_2 ~= nil then
+			_result_2 = _result_2.bottom
+		end
+		local _condition = _result_2
+		if _condition == nil then
+			_condition = 0
+		end
+		_result_1 = _condition
+	else
+		_result_1 = 0
+	end
+	local explicitBoxBottomFloor = _result_1
+	-- When an overlay header and/or footer measurably overlaps into the
+	-- Box (headerClearance/footerClearance > 0), or the footer-absent
+	-- floor above is nonzero, reserve that much extra top/bottom padding
+	-- via resolvedPadding — this takes over Box's own outer padding,
+	-- which is otherwise 0/0/0/0 since Card always forces spacing="None"
+	-- on Box below.
+	local _result_2
+	if headerClearance > 0 or footerClearance > 0 or explicitBoxBottomFloor > 0 then
 		local _object = table.clone(boxProps)
 		setmetatable(_object, nil)
 		_object.resolvedPadding = {
 			top = headerClearance,
-			bottom = footerClearance,
+			bottom = math.max(footerClearance, explicitBoxBottomFloor),
 			left = 0,
 			right = 0,
 		}
-		_result_1 = _object
+		_result_2 = _object
 	else
-		_result_1 = boxProps
+		_result_2 = boxProps
 	end
-	local boxPropsWithOverlayClearance = _result_1
+	local boxPropsWithOverlayClearance = _result_2
 	local _attributes = table.clone(boxPropsWithOverlayClearance)
 	setmetatable(_attributes, nil)
 	_attributes.ref = ref
@@ -489,14 +535,6 @@ local Card = React.forwardRef(function(props, ref)
 		AnchorPoint = SizeHelper:GetAnchor(wrapperPositionProps),
 		ZIndex = props.ZIndex,
 		LayoutOrder = props.LayoutOrder,
-		Change = {
-			AbsolutePosition = function(instance)
-				return setWrapperAbsoluteY(instance.AbsolutePosition.Y)
-			end,
-			AbsoluteSize = function(instance)
-				return setWrapperAbsoluteSize(instance.AbsoluteSize)
-			end,
-		},
 	}, cardBox, overlayHeader, overlayFooter)) else cardBox
 	local isCentered = props.center == true and props.Position == nil and props.AnchorPoint == nil
 	return React.createElement(CardContext.Provider, {

package/out/Helpers/spacing.helper.d.ts

@@ -1,7 +1,8 @@
-import { PaddingProps, ResolvedPadding, ScaleSize, ScaleSizeValue } from "../Interfaces";
+import { PaddingProps, ResolvedPadding, ScaleSize, ScaleSizeValue, ScaledCssPadding } from "../Interfaces";
 import { ThemeTemplate } from "../Theme";
 export declare class SpacingHelper {
-    static GetResolvedPadding(theme: ThemeTemplate, props: PaddingProps, component?: ScaleSizeValue<number>): ResolvedPadding;
     static GetPadding(theme: ThemeTemplate, spacing?: ScaleSize | "None", component?: ScaleSizeValue<number>): number;
+    static GetResolvedPadding(theme: ThemeTemplate, props: PaddingProps, componentSpacing?: ScaleSizeValue<number>, componentPadding?: ScaledCssPadding, defaultSpacing?: ScaleSize): ResolvedPadding;
+    static GetExplicitPadding(componentPadding: ScaledCssPadding | undefined, key: ScaleSize): ResolvedPadding | undefined;
     static ResolveNumberPadding(value: number): ResolvedPadding;
 }

package/out/Helpers/spacing.helper.luau

@@ -1,4 +1,6 @@
 -- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local CssHelper = TS.import(script, script.Parent, "css.helper").CssHelper
 local SpacingHelper
 do
 	SpacingHelper = setmetatable({}, {
@@ -13,35 +15,117 @@ do
 	end
 	function SpacingHelper:constructor()
 	end
-	function SpacingHelper:GetResolvedPadding(theme, props, component)
-		local amount = self:GetPadding(theme, props.spacing, component)
-		return {
-			top = if props.top then self:GetPadding(theme, props.top) else amount,
-			bottom = if props.bottom then self:GetPadding(theme, props.bottom) else amount,
-			left = if props.left then self:GetPadding(theme, props.left) else amount,
-			right = if props.right then self:GetPadding(theme, props.right) else amount,
-		}
-	end
 	function SpacingHelper:GetPadding(theme, spacing, component)
 		if spacing == "None" then
 			return 0
 		end
-		local resolveSpacing = if spacing ~= nil then spacing else theme.default.spacing
-		local _result
-		if component ~= nil then
-			local _condition = component[resolveSpacing]
+		local key = spacing or theme.default.spacing
+		local _result = component
+		if _result ~= nil then
+			_result = _result[key]
+		end
+		local _condition = _result
+		if _condition == nil then
+			_condition = theme.spacing[key]
 			if _condition == nil then
 				_condition = 0
 			end
-			_result = _condition
+		end
+		return _condition
+	end
+	function SpacingHelper:GetResolvedPadding(theme, props, componentSpacing, componentPadding, defaultSpacing)
+		if props.resolvedPadding ~= nil then
+			return props.resolvedPadding
+		end
+		local isNone = props.spacing == "None"
+		local key = if props.spacing ~= nil and props.spacing ~= "None" then props.spacing else (defaultSpacing or theme.default.spacing)
+		-- tier 3: a scale-indexed map picks the quad for the active key
+		-- (falling through to tiers 1/2 if that key isn't defined in the
+		-- map); a plain quad applies regardless of key.
+		local _result
+		if isNone or componentPadding == nil then
+			_result = nil
+		else
+			local _componentPadding = componentPadding
+			_result = if type(_componentPadding) == "table" then componentPadding[key] else componentPadding
+		end
+		local quadForKey = _result
+		local base = if quadForKey ~= nil then CssHelper:parseCssQuad(quadForKey) else self:ResolveNumberPadding(if isNone then 0 else self:GetPadding(theme, key, componentSpacing))
+		local instanceQuad = if props.padding ~= nil then CssHelper:parseCssQuad(props.padding) else nil
+		local _object = {}
+		local _left = "top"
+		local _result_1
+		if props.top ~= nil then
+			_result_1 = self:GetPadding(theme, props.top, componentSpacing)
 		else
-			local _condition = theme.spacing[resolveSpacing]
+			local _result_2 = instanceQuad
+			if _result_2 ~= nil then
+				_result_2 = _result_2.top
+			end
+			local _condition = _result_2
 			if _condition == nil then
-				_condition = 0
+				_condition = base.top
+			end
+			_result_1 = _condition
+		end
+		_object[_left] = _result_1
+		local _left_1 = "bottom"
+		local _result_2
+		if props.bottom ~= nil then
+			_result_2 = self:GetPadding(theme, props.bottom, componentSpacing)
+		else
+			local _result_3 = instanceQuad
+			if _result_3 ~= nil then
+				_result_3 = _result_3.bottom
+			end
+			local _condition = _result_3
+			if _condition == nil then
+				_condition = base.bottom
+			end
+			_result_2 = _condition
+		end
+		_object[_left_1] = _result_2
+		local _left_2 = "left"
+		local _result_3
+		if props.left ~= nil then
+			_result_3 = self:GetPadding(theme, props.left, componentSpacing)
+		else
+			local _result_4 = instanceQuad
+			if _result_4 ~= nil then
+				_result_4 = _result_4.left
+			end
+			local _condition = _result_4
+			if _condition == nil then
+				_condition = base.left
 			end
-			_result = _condition
+			_result_3 = _condition
+		end
+		_object[_left_2] = _result_3
+		local _left_3 = "right"
+		local _result_4
+		if props.right ~= nil then
+			_result_4 = self:GetPadding(theme, props.right, componentSpacing)
+		else
+			local _result_5 = instanceQuad
+			if _result_5 ~= nil then
+				_result_5 = _result_5.right
+			end
+			local _condition = _result_5
+			if _condition == nil then
+				_condition = base.right
+			end
+			_result_4 = _condition
+		end
+		_object[_left_3] = _result_4
+		return _object
+	end
+	function SpacingHelper:GetExplicitPadding(componentPadding, key)
+		if componentPadding == nil then
+			return nil
 		end
-		return _result
+		local _componentPadding = componentPadding
+		local quad = if type(_componentPadding) == "table" then componentPadding[key] else componentPadding
+		return if quad ~= nil then CssHelper:parseCssQuad(quad) else nil
 	end
 	function SpacingHelper:ResolveNumberPadding(value)
 		return {

package/out/Interfaces/css.types.d.ts

@@ -1,3 +1,4 @@
+import { ScaleSizeValue } from "./responsive.types";
 export type CssUnit = "px" | "%";
 export type CssSize = "Auto" | number | `${number}` | `${number}${CssUnit}`;
 export type CssCalcSize = CssSize | `${number}% - ${number}px` | `${number}% + ${number}px`;
@@ -25,4 +26,5 @@ export type CssBoxShadow = {
     transparency: number;
 };
 export type CssPadding = CssQuad;
+export type ScaledCssPadding = CssPadding | ScaleSizeValue<CssPadding>;
 export type ResponsiveCssSize = CssSize | CssBreakpointSize;

package/out/Interfaces/css.types.luau

@@ -15,3 +15,7 @@
 -- absolute pixel corner coordinates for Rect.new(minX, minY, maxX, maxY)-style slicing,
 -- e.g. Roblox's SliceCenter — not a CSS border-image-slice edge-inset shorthand, since
 -- Roblox has no intrinsic-image-size equivalent to derive corners from an inset alone
+-- A CssPadding quad, or a scale-key-indexed map of quads (e.g. a component's
+-- theme.components.X.padding tier, which can pick a different quad shape per
+-- spacing scale key the same way theme.components.X.spacing does for the
+-- numeric tier).

package/out/Interfaces/index.d.ts

@@ -1,5 +1,5 @@
-export * from './css.types';
+export type * from './css.types';
 export * from './responsive.types';
-export * from './element.props';
-export * from './semantics';
-export * from './icon';
+export type * from './element.props';
+export type * from './semantics';
+export type * from './icon';

package/out/Interfaces/init.luau

@@ -1,19 +1,7 @@
 -- Compiled with roblox-ts v3.0.0
 local TS = _G[script]
 local exports = {}
-for _k, _v in TS.import(script, script, "css.types") or {} do
-	exports[_k] = _v
-end
 for _k, _v in TS.import(script, script, "responsive.types") or {} do
 	exports[_k] = _v
 end
-for _k, _v in TS.import(script, script, "element.props") or {} do
-	exports[_k] = _v
-end
-for _k, _v in TS.import(script, script, "semantics") or {} do
-	exports[_k] = _v
-end
-for _k, _v in TS.import(script, script, "icon") or {} do
-	exports[_k] = _v
-end
 return exports

package/out/Theme/theme.template.d.ts

@@ -1,4 +1,4 @@
-import { CssShadow, CssSize, CssPadding, Breakpoint, BreakpointValue, ScaleSizeValue, ScaleSize, Intent, IconSet, TextVariant, PositionElementProps, CssBoxShadow } from "../Interfaces/";
+import { CssShadow, CssSize, ScaledCssPadding, Breakpoint, BreakpointValue, ScaleSizeValue, ScaleSize, Intent, IconSet, TextVariant, PositionElementProps, CssBoxShadow } from "../Interfaces/";
 import { TypographyStyle, ScaledTypographyStyle, IntentScheme, IntentColors, InlineIntentColors, CssBackgroundImage, CssPosition } from "./theme.style";
 export interface ThemeTemplate {
     colors: {
@@ -48,7 +48,8 @@ export interface ThemeTemplate {
             borderColor: Color3;
             borderThickness: number;
             cornerRadius: CssSize;
-            padding?: CssPadding;
+            spacing?: ScaleSizeValue<number>;
+            padding?: ScaledCssPadding;
             boxShadow?: CssShadow;
             backgroundImage?: CssBackgroundImage;
             intents?: Partial<Record<Intent, InlineIntentColors>>;
@@ -89,14 +90,17 @@ export interface ThemeTemplate {
             cornerRadius: CssSize;
             intents?: Partial<Record<Intent, InlineIntentColors>>;
             spacing?: ScaleSizeValue<number>;
+            padding?: ScaledCssPadding;
             backgroundImage?: CssBackgroundImage;
         };
         tabs: {
             borderColor: Color3;
             backgroundColor: Color3;
+            backgroundImage?: CssBackgroundImage;
             borderThickness: number;
             cornerRadius: CssSize;
             spacing?: ScaleSizeValue<number>;
+            padding?: ScaledCssPadding;
             list: {
                 borderColor?: Color3;
                 backgroundColor?: Color3;
@@ -104,12 +108,14 @@ export interface ThemeTemplate {
                 borderThickness: number;
                 cornerRadius: CssSize;
                 spacing?: ScaleSizeValue<number>;
+                padding?: ScaledCssPadding;
                 backgroundImage?: CssBackgroundImage;
             };
             button: {
                 borderThickness: number;
                 cornerRadius: CssSize;
                 spacing?: ScaleSizeValue<number>;
+                padding?: ScaledCssPadding;
                 boxShadow?: CssShadow;
                 typography?: Partial<TypographyStyle> | ScaledTypographyStyle;
                 intents?: Partial<Record<Intent, InlineIntentColors>>;
@@ -122,6 +128,7 @@ export interface ThemeTemplate {
             spacing?: ScaleSizeValue<number>;
             header: {
                 spacing?: ScaleSizeValue<number>;
+                padding?: ScaledCssPadding;
                 typography?: Partial<TypographyStyle> | ScaledTypographyStyle;
                 intents?: Partial<Record<Intent, InlineIntentColors>>;
                 indicatorSize: number;
@@ -129,6 +136,7 @@ export interface ThemeTemplate {
             };
             content: {
                 spacing?: ScaleSizeValue<number>;
+                padding?: ScaledCssPadding;
                 backgroundColor: Color3;
                 backgroundTransparency: number;
             };
@@ -142,17 +150,20 @@ export interface ThemeTemplate {
             header: {
                 borderThickness?: number;
                 spacing?: ScaleSizeValue<number>;
+                padding?: ScaledCssPadding;
                 intents?: Partial<Record<Intent, InlineIntentColors>>;
                 position?: CssPosition;
             };
             footer: {
                 borderThickness?: number;
                 spacing?: ScaleSizeValue<number>;
+                padding?: ScaledCssPadding;
                 intents?: Partial<Record<Intent, InlineIntentColors>>;
                 position?: CssPosition;
             };
             body?: {
-                padding?: CssPadding;
+                spacing?: ScaleSizeValue<number>;
+                padding?: ScaledCssPadding;
             };
         };
         slider: {