Files
metabuilder/packages/css_designer/seed/scripts/export/to_css.lua
2025-12-30 19:59:58 +00:00

125 lines
4.3 KiB
Lua

-- Export theme to CSS custom properties
-- Generates CSS variable declarations from theme config
---@class ToCss
local M = {}
---Generate CSS color variables
---@param colors ColorPalette Color palette
---@return string css CSS variable declarations
local function generate_color_variables(colors)
local lines = {
" /* Color Variables */",
" --color-primary: " .. colors.primary.hex .. ";",
" --color-secondary: " .. colors.secondary.hex .. ";",
" --color-background: " .. colors.background.hex .. ";",
" --color-surface: " .. colors.surface.hex .. ";",
" --color-text-primary: " .. colors.text_primary.hex .. ";",
" --color-text-secondary: " .. colors.text_secondary.hex .. ";",
" --color-error: " .. colors.error.hex .. ";",
" --color-warning: " .. colors.warning.hex .. ";",
" --color-success: " .. colors.success.hex .. ";",
" --color-info: " .. colors.info.hex .. ";"
}
return table.concat(lines, "\n")
end
---Generate CSS typography variables
---@param typography TypographyConfig Typography config
---@return string css CSS variable declarations
local function generate_typography_variables(typography)
local lines = {
"",
" /* Typography Variables */",
" --font-family: '" .. typography.fontFamily .. "', sans-serif;",
" --font-family-heading: '" .. typography.headingFont .. "', sans-serif;",
" --font-family-code: '" .. typography.codeFont .. "', monospace;",
" --font-size-base: " .. typography.baseFontSize .. "px;"
}
return table.concat(lines, "\n")
end
---Generate CSS spacing variables
---@param spacing SpacingConfig Spacing config
---@return string css CSS variable declarations
local function generate_spacing_variables(spacing)
local unit = spacing.spacingUnit
local lines = {
"",
" /* Spacing Variables */",
" --spacing-unit: " .. unit .. "px;",
" --spacing-xs: " .. (unit * 0.5) .. "px;",
" --spacing-sm: " .. unit .. "px;",
" --spacing-md: " .. (unit * 2) .. "px;",
" --spacing-lg: " .. (unit * 3) .. "px;",
" --spacing-xl: " .. (unit * 4) .. "px;",
" --border-radius: " .. spacing.borderRadius .. "px;",
" --container-width: " .. spacing.containerWidth .. "px;"
}
return table.concat(lines, "\n")
end
---Generate CSS border variables
---@param borders BorderConfig Border config
---@return string css CSS variable declarations
local function generate_border_variables(borders)
local lines = {
"",
" /* Border Variables */",
" --border-width: " .. borders.width .. "px;",
" --border-color: " .. borders.color.hex .. ";",
" --border-style: " .. borders.style .. ";"
}
return table.concat(lines, "\n")
end
---Generate CSS shadow variables
---@param shadows ShadowConfig Shadow config
---@return string css CSS variable declarations
local function generate_shadow_variables(shadows)
local opacity = shadows.opacity / 100
local offsetX = shadows.offsetX or 0
local offsetY = shadows.offsetY or 2
local lines = {
"",
" /* Shadow Variables */",
" --shadow-blur: " .. shadows.blur .. "px;",
" --shadow-spread: " .. shadows.spread .. "px;",
" --shadow-opacity: " .. opacity .. ";",
" --shadow-default: " .. offsetX .. "px " .. offsetY .. "px " .. shadows.blur .. "px " .. shadows.spread .. "px rgba(0, 0, 0, " .. opacity .. ");"
}
return table.concat(lines, "\n")
end
---Generate all CSS variables from theme config
---@param theme ThemeConfig Theme configuration
---@return string css Complete CSS :root block content
function M.generate_css_variables(theme)
local sections = {
"/* Generated by CSS Designer */",
"/* Theme: " .. theme.name .. " */",
"",
":root {",
generate_color_variables(theme.colors),
generate_typography_variables(theme.typography),
generate_spacing_variables(theme.spacing),
generate_border_variables(theme.borders),
generate_shadow_variables(theme.shadows),
"}"
}
return table.concat(sections, "\n")
end
---Export theme to CSS
---@param theme ThemeConfig Theme configuration
---@return ThemeExport export Export result with css field populated
function M.to_css(theme)
return {
scss = "",
css = M.generate_css_variables(theme),
json = ""
}
end
return M