v1.2.0

✨ HighlightsLink to this section

Parallax Animation for Images and VideosLink to this section

A new parallax scroll animation ships across all packages, including controls in the editor for Hero, Feature, and Media blocks. A simple toggle makes it effortless to add depth and motion to images and videos with consistent behavior across the stack.

Custom Text States in PayloadCMSLink to this section

Lexical editors now support custom text states with a dedicated customTextState configuration. You can define your own formatting rules and render them cleanly on the frontend, with smarter conversion producing tighter, merged markup.

Example payload.config.ts usage:

const userSysthemaConfig = {
  customTextStates: [
    {
      editor: ['root', 'region', 'fragment', 'slot'],
      state: {
        color: {
          // fancy gradients!
          galaxy: {
            label: 'Galaxy',
            css: {
              background: 'linear-gradient(to right, #0000ff, #ff0000)',
              color: 'white',
            },
          },
          sunset: {
            label: 'Sunset',
            css: {
              background: 'linear-gradient(to top, #ff5f6d, #6a3093)',
            },
          },
        },
        // You can have both colored and underlined text at the same time.
        // If you don't want that, group them within the same key.
        // (just like the gradients above)
        underline: {
          solid: {
            label: 'Solid',
            css: {
              'text-decoration': 'underline',
              'text-underline-offset': '4px',
            },
          },
          // You'll probably want to use the CSS light-dark() utility.
          'yellow-dashed': {
            label: 'Yellow Dashed',
            css: {
              'text-decoration': 'underline dashed',
              'text-decoration-color': 'light-dark(#EAB308,yellow)',
              'text-underline-offset': '4px',
            },
          },
        },
      },
    },
  ],
}

List of all changesLink to this section

🚀 FeaturesLink to this section

core,react,nextLink to this section

• feat(core,react,next): add centralized parallax configuration
• feat(core,react,next): add parallax scroll effect module

react,nextLink to this section

• feat(react,next): add parallax prop to Image and Video components

payloadLink to this section

• feat(payload): add parallax support to hero blocks and feature block
• feat(payload): add whitelabel configuration option
• feat(payload): add parallax toggle to image and video blocks
• feat(payload): added custom TextJSXConverter, so we can convert TextStates from the lexical editors to frontend code
• feat(payload): add support for custom text states in lexical editors
• feat(payload): added 'width' setting for Card, otherwise NestedCard didn't have anything else different from top level version of this block

actionsLink to this section

• feat(actions): added internal version publisher workflow

♻️ RefactorsLink to this section

coreLink to this section

• refactor(core): remove --ui flag from CLI in favor of new --react flag, adapting from the previous withSysthema helper functions removed modules argument, to the new systhema.config.js file's packages.react and packages.payload configuration objects; while also using the new @import '@systhemaui/core/tailwind'; in the default files generated by the --payload flag

payloadLink to this section

• refactor(payload): replace Feature block reversed checkbox with Media Float iconGroup
• refactor(payload): use slotLexicalEditor in hero block
• refactor(payload): optimize text converter to use single tag with merged styles
• refactor(payload): better types for customTextState config
• !refactor(payload): removed "columns" and "blocks" editors, and merged them into the "nested" editor, with configurable arguments to enable columns and cards, avoiding circular dependencies (breaking)
• refactor(payload): remove legacy lexical editor files (basic, full, mini, nested) as part of the transition to new editor structure
• refactor(payload): update lexical editors to use new naming conventions and replace full/nested/basic/mini editors with root/region/fragment/slot editors

🐛 Bug fixesLink to this section

coreLink to this section

• fix(core): include parallax css in class generation for tailwind plugin
• fix(core): add .parallax and .parallax-wrapper classes to the safelist.txt generation
• fix(core): rename comments with systhema cli commands instead of leftover direct calls to src/systhema/core/*.ts files (legacy code from era before monorepo and npm packages)
• fix(core): higher specificity for .feature-inversed class to ensure it overrides base .feature styles
• fix(core): add function to remove asterisks from token names and values for token processing, this way we can use asterisk (*) symbols, to point to certain tokens without actually impacting references in the codebase
• fix(core): normalize decimal values and adjust bracket notation for tailwind theme paths, to be able to find tailwindcss references in tokens where commas are used. for example {tailwindcss.spacing.2,5} turned into theme(spacing[2.5]) which would result in 10px
• fix(core): remove unnecessary marginTop from sections having the same colorSystem next to each other
• fix(core): in a next.js website with unoptimized CSS, two accordions following each other did not have the corect reduced margins that we needed in our conditional spacing logic
• fix(core): better balance header-navigation-item when it has submenu, and header-navigation-item-icon
• fix(core): incorrect color of header-navigation-item-icon-subnavigation when not hovered
• fix(core): move blocks/sections with same colorSystem to a bit closer to each other
• fix(core): .columns, .stack, .card-* and .accordion-* inside .richtext were having margins when they were :first-child or :last-child, while it should've been removed
• fix(core): add helper function to check token reference values across screen sizes

core,react,nextLink to this section

• fix(core,react,next): look for elements' parent as well, when evaluating .parallax--big and .parallax--noscale classes

payloadLink to this section

• fix(payload): region lexical editor should have NestedColumns block instead of a full section, compared to root lexical editor
• fix(payload): remove module-level applyArticleColorSetting call for Turbopack
• fix(payload): use lazy access for defaultPageTemplate to fix Turbopack TDZ error
• fix(payload): prevent SCSS imports from breaking Node.js CLI commands
• fix(payload): resolve circular dependency breaking Turbopack builds
• fix(payload): enable BalanceTextFeature to work with TextStateFeature
• fix(payload): ignore eslint warnings, the FeatureProviderServer type comes from payload's package this way
• fix(payload): columns section to have the same default paddings as a simple section
• fix(payload): comment out CSS zoom from elements in lexical editors
• fix(payload): RichText (Lexical) component was not compatible with client side code, it could only run on the server
• fix(payload): types generated with default tokens

react,nextLink to this section

• fix(react,next): added parallaxNoWrapper attribute to Media components, so we can prevent the default wrapping methodology when using `parallax, also change default 1280/1280 px sizes for next/image
• fix(react,next): parallax media components className appending, problems caused by fill="true" and unnecessary width, height attributes forcing

templates/nextLink to this section

• fix(templates/next): adapted default files to be using properties provided by the default tokens, while also removing the tailwind.config.ts file from the template, since that's not the encouraged way of working anymore with v4
• fix(templates/next): correct theme and layoutBackground properties for default tokens

templates/payloadLink to this section

• fix(templates/payload): remove leftover legacy @systhema path from tsconfig.json (leftover from era before monorepo and npm packages)
• fix(templates/payload): temporarily supress "critical dependency" errors by adding config.module.exprContextCritical = false to the next.config.mjs file
• fix(templates/payload): installing the correct font, and missing @tailwindcss/postcss package
• fix(templates/payload): adapted layout and styles to the default systhema tokens

generalLink to this section

• fix: added @parcel/watcher to pnpm.onlyBuiltDependencies in package.json files to approve builds
• fix: updated main .gitignore file to include the root pnpm-lock.yaml, but never include for sub-directories, and added .pnpm-debug.logs

💄 StyleLink to this section

• style(core): formatting handleTokens.ts
• style(payload): ran prettier on payload-types.d.ts
• style(payload): line break change on customTextStatesStore.ts
• style(templates/payload): formatted README.md with prettier

📚 DocsLink to this section

• docs(templates/*): updated documentation for next and payload templates, with tailwindcss v4 in mind, and recent changes to CLI usage and config generation

🧹 ChoresLink to this section

• chore(*): cleanup deprecated Group component and block
• chore(deps): updated packages and main pnpm-lock.yaml file
• chore(payload): code cleanup
• chore(payload): cleanup Relationship feature from full editor, 'component' collection now has its own block
• chore(templates/*): remove tailwind.config.ts from prettierrc files
• chore(templates/*): delete lock files
• chore(templates/html): updated .gitignore
• chore(templates/payload): generated importMap and payload-types.ts
• chore(templates/payload): updated payload-types.ts with root-level Card's width setting
• chore: added CLAUDE.md for agent guidance
• chore: add CLAUDE.md for AI assistant guidance
• chore: updated pnpm-lock.yaml
• chore: bump version numbers to 1.1.0 across all packages and templates
• chore: update pnpm version in package.json, and generated pnpm-lock.yaml
• chore: update all package versions to 1.0.0, removing canary releases
• chore: bump version to 1.0.0-canary.2 for all packages
• deps(templates/): update @systhemaui/ packages to version 1.0.0-canary.2 in all templates
• deps(*): updated all packages, while also removing unused autoprefixer from packages/core and from templates/payload