Search

Changelog

Breaking changes may continue until v1.0, so all notable changes are documented here.

lism-css v.0.17.0 (2026.05.09)

This release contains breaking changes.

Introducing -max-sz:bleed (#360)

  • Removed -max-sz:container and introduced -max-sz:bleed, a new full-bleed utility that expands up to the outermost is--container width
  • Set the initial-value of --sz--bleed to 100svi, providing a viewport-width fallback when no is--container ancestor exists

Removed --REM and simplified --fz--base

  • Removed --REM and unified --fz--base to 1rem
  • Aligned --hl-unit / --s-unit to be derived from --fz--base
  • Removed --link-td-thickness / --link-td-color styles from the a tag

Bug Fixes

  • Added inline-size: 100% to is--wrapper to prevent layout shifts inside stack (#356)
  • Changed the default value of --td-p from var(--s10) to var(--s10) var(--s15)

Other

  • Unified styles for blockquote and pre, and added italic style to q and blockquote
  • Adjusted lts tokens and added xl size

@lism-css/ui v.0.17.0 (2026.05.09)

Deep path import support (#354)

  • Each component can now be imported individually via @lism-css/ui/react/{Name} / @lism-css/ui/astro/{Name} deep paths.
  • Deep path import is recommended in docs and examples since it reliably avoids pulling in unused components.

Other

  • All components are now exposed as named exports (barrel imports remain compatible since they were already named).
  • Added a gen:exports script that auto-generates exports from src/components/, regenerated and committed during build.

lism-css v.0.16.1 (2026.04.29)

  • Changed the --list-px-s fallback value to 1.75em
  • Added min-width: 0 to l--withSide flex children

lism-css v.0.16.0 (2026.04.21)

This release contains breaking changes.

Rename u--trimChildren and refine the exclusion rules (#324, #326)

The utility class that trims half-leading margins on children has been cleaned up.

OldNew
u--trimChildren / util="trimChildren"u--trimAll / util="trimAll"

The old u--trimChildren / util="trimChildren" has been removed (no backward-compatible alias). Any direct usage must be replaced.

The selector strategy has also been refined to simply exclude elements that shouldn’t be trimmed (:empty, figure, picture, video, button, textarea, table). The :empty pseudo-class automatically covers void elements like img/hr and empty decorative divs (e.g. a--divider, a--spacer). If you need to exclude additional elements, add a rule like .u--trimAll > xxx { margin-block: 0 } on the consumer side.

Rename u--collapseGrid and add u--divide (#323)

The utility classes that draw dividing lines between children of a grid / flex container have been reorganized.

OldNewPurpose
u--divideDisplay dividers between children only (no outer frame)
u--collapseGridu--cellsWrap each child with a border (table-cell / calendar style)

The pattern that previously required combining u--collapseGrid with p="0" and ov="clip" to show only interior dividers is now covered by the new u--divide class.

The old u--collapseGrid / util="collapseGrid" has been removed (no backward-compatible alias). Any direct usage must be replaced.

Opacity token renames (#316)

The opacity tokens have been renamed from the numeric step convention with three consecutive hyphens (--o---10) to semantic names derived from musical dynamic markings (the piano family). A new token for a light attenuation value (0.9) — previously untokenized — has been added, bringing the scale to four steps.

OldNewValue
--o--mp / -o:mp0.9 (new)
--o---10 / -o:-10--o--p / -o:p0.75
--o---20 / -o:-20--o--pp / -o:pp0.5
--o---30 / -o:-30--o--ppp / -o:ppp0.25

The old tokens (--o---10/-20/-30) and old utility classes (-o:-10/-20/-30) have been removed. Any direct usage must be replaced with the new names. -o:0 (fully transparent) remains unchanged.

Layout Primitive renames (#319)

The following Layout Primitive class names / component names / layout literal values have been renamed.

OldNew
l--sideMain / <SideMain> / layout="sideMain"l--withSide / <WithSide> / layout="withSide"
l--fluidCols / <FluidCols> / layout="fluidCols"l--autoColumns / <AutoColumns> / layout="autoColumns"
l--switchCols / <SwitchCols> / layout="switchCols"l--switchColumns / <SwitchColumns> / layout="switchColumns"

The old React / Astro component names (<SideMain> / <FluidCols> / <SwitchCols>) remain as @deprecated aliases for now. They will be removed in the next major release, so migrate to the new names as soon as possible. There is no backward compatibility for the SCSS classes (l--sideMain, etc.) or layout literal values (layout="sideMain", etc.) — any direct usage must be updated.

Other changes

  • Updated the formula for the top margin of headings inside l--flow
  • Changed the -hov:-o opacity fallback from 0.7 to var(--o--p)
  • Internal refactor: reorganized trait SCSS files into is/ and has/ subdirectories

@lism-css/ui v.0.16.0 (2026.04.21)

This release contains breaking changes.

  • Aligned with lism-css 0.16.0 (Layout Primitive naming cleanup)
  • Changed the Alert component’s layout prop literal value from "sideMain" to "withSide"

lism-css v.0.15.0 (2026.04.21)

This release contains breaking changes.

CSS Layer Restructuring (#304)

  • Changed layer order to lism-trait → lism-primitive → lism-component
  • Separated lism-trait layer and restored has--* Trait Classes
  • Redesigned class output order: set-- → trait(is--/has--) → u-- → -prop
  • Migrated set--mask to has--mask under the trait layer

set-- Class Overhaul (#304)

  • Reclassified with var: prefix
    • set--hovset--var:hov
    • set--shadowset--var:sh
    • set--innerRsset--var:bdrsInner
  • Migrated set--mask to has--mask under the trait layer
  • Added new set--revert (replaces automatic ul / ol detection with explicit class usage)

-hov: Class Naming Cleanup (#300)

  • Renamed Property Class composition group to -hov:-{prop} format
    • -hov:c-hov:-c
    • -hov:bgc-hov:-bgc
    • -hov:bdc-hov:-bdc
    • -hov:o-hov:-o
    • -hov:bxsh-hov:-bxsh
  • Renamed set--var:hov group from -hov:to:* to -hov:in:*
  • Added -hov:underline preset
  • -hov:neutral etc. remain unchanged
  • Removed auto-shortening of hov string values; unified behavior of object true values
  • Removed class: key handling from hov prop object notation

Shadow Token Overhaul (#311)

The --shsz-- scale has been shifted down one step, and --shsz--5 was removed. To use the same shadow as before, shift the step by +10.

Old tokenValueNew token
--shsz--100px 2px 6px--shsz--20
--shsz--200px 4px 12px--shsz--30
--shsz--300px 8px 24px--shsz--40
--shsz--400px 16px 48px--shsz--50
  • New --shsz--10 is 0px 1px 3px (the new smallest size)
  • Added --bxsh--50 / --shsz--50
  • Adjusted --shc opacity from 12% → 15%

Other

  • Removed prop="-" notation in favor of true only (#310)
  • Removed overwriteBaseVar and merged into alwaysVar; improved BP class output
  • Reorganized has--transition variables (--transProp--transitionProps, --hov-duration--transition-duration) and adjusted default duration to 0.25s
  • Changed has--snap CSS variable defaults to element-side initialization
  • Introduced AstroLayoutProps<L> and removed AstroFlowProps / AstroFlexProps
  • Made LismElementProps['className'] type explicit (string | undefined)

@lism-css/ui v.0.15.0 (2026.04.21)

This release contains breaking changes.

Breaking Changes

  • Aligned with lism-css 0.15.0 (-hov:-{prop} / -hov:in:* / set--var:* / shadow token scale changes, etc.)
  • Changed default element of NavMenu.Link (Astro / React) from span to a. If you were using it without href, specify as="span" to keep the old behavior

TypeScript Support for Astro Components

  • Added Props types to the following Astro components
    • Accordion / Alert / Avatar / Badge / Button / Callout / Chat / Details / Modal / NavMenu / ShapeDivider / Tabs
  • Added Polymorphic<{as: Tag}> generics to Astro components
  • Unified AstroFlowProps / AstroFlexProps into AstroLayoutProps<L>

Type System Improvements

  • Added LismComponentProps<T> generics to React components
  • Applied LayoutComponentProps<T, L> to layout components

Bug Fixes and Internal Improvements

  • Changed client scripts to use tag-agnostic selectors and types (Accordion / Tabs / Modal)
  • Made Accordion/react/Panel generic
  • Used Flex component in Details/Summary
  • Aligned Details/Content React implementation with Astro using Flow
  • Used Flex / Flow in Accordion/Button / Panel
  • Added gen:registry script to generate registry-index.json

lism-css v.0.14.0 (2026.04.17)

This release contains breaking changes.

Props system cleanup

  • Removed lismClass / variant props in favor of unified className
  • Removed dedicated clipPath / boxSizing props from Decorator

Property Class renames

  • yszbsz (block-size)
  • isolationiso
  • whspacewhs (white-space)
  • ovwrapovw (overflow-wrap)

Trait Class / token cleanup

  • Removed is--vertical; migrated to Property Class -wm:vertical-rl
  • Disabled set--bp
  • Renamed negative token variables from --o--n{N} to --o---{N}
  • Removed --sz--min / --sz--full tokens

Other

  • Changed fluidCols default min size to 20rem

@lism-css/ui v.0.14.0 (2026.04.17)

This release contains breaking changes.

  • Aligned with lism-css 0.14.0 (removed lismClass / variant props, unified to className)
  • Removed the DummyImage component (use the CDN dummy image URL directly instead, e.g. https://cdn.lism-css.com/dummy-image.jpg)
  • Renamed internal files for Details / Tabs to the Root convention
  • Added the buildModifierClass helper for BEM modifier composition
  • Fixed an issue where component CSS imports were not included in the built output (vite.config adjustment)
  • Fixed React/Astro initial props mismatches (6 components)
  • Split React components into the same file structure as Astro
  • Inlined getProps into components

lism-css v.0.13.1 (2026.04.15)

  • Added the atomic prop

@lism-css/ui v.0.13.1 (2026.04.15)

  • Aligned with lism-css 0.13.1
  • Cleaned up Tabs styles

lism-css v.0.13.0 (2026.04.14)

This release contains breaking changes.

Module → Primitive concept rename

  • Renamed concept ModulePrimitive
    • CSS layer lism-moduleslism-primitive
    • SCSS directory src/scss/modulessrc/scss/primitives
  • Added new CSS layer lism-component

State → Trait identifier unification

Renamed State identifiers in the Props system to Trait.

  • Type StatePropsTraitProps
  • Constant STATESTRAITS
  • lism.config.js key statestraits
  • File config/defaults/states.tsconfig/defaults/traits.ts

Note: Prop names such as isContainer / isWrapper and is--* class names are unchanged.

set / util props unification

  • Added util prop; unified set / util as strings with - prefix for exclusion

Trait Class / naming cleanup

  • Renamed is--linkBoxis--boxLink
  • Renamed u--expandedLinkis--coverLink
  • Removed Container’s size prop in favor of isWrapper

Other

  • Unified BEM element notation for c-- components to single _
  • Reorganized class output order (moved set-- / u-- before property classes)

@lism-css/ui v.0.13.0 (2026.04.14)

  • Aligned with lism-css 0.13.0
  • Added util prop; unified set / util as strings with - prefix for exclusion
  • Moved c-- components to the lism-component CSS layer
  • Unified CSS layer names to singular (lism-componentslism-component)

@lism-css/ui v.0.12.0 (2026.04.10)

  • Aligned with lism-css 0.12.0
  • Migrated all .js/.jsx files to TypeScript (.ts/.tsx)
  • Added Storybook stories for all components
  • Fixed Tabs useId() conditional call (Rules of Hooks violation)

@lism-css/ui v.0.11.0 (2026.04.05)

  • Adjusted Callout component styles to align with the shadow design changes in lism-css v0.11.0

v.0.12.0 (2026.04.10)

  • Added TileGrid layout module (promoted from -gt:repeat)
  • Added flex, grid, inline-grid, inline, inline-block to d (display)
  • Changed gap shorthands from g-x/g-y to cg/rg
  • Removed setXxxx individual props in favor of unified set="" unset=""
  • Repositioned @layer lism-custom between modules and utility
  • Changed list padding-inline-start to --list-px-s custom property
  • Removed deprecated HTML component files
  • Changed Property Class value abbreviations to CSS actual values (in-flexinline-flex, relrelative, absabsolute, colcolumn, cccurrent, etc.)
  • Renamed “Prop Class” terminology to “Property Class”
  • Removed --gtr/--gtc/--gta CSS variables and grid-template declarations from l--grid
  • Removed unused --bdrs--5 token

v.0.11.0 (2026.04.05)

  • Reduced bdrs/bxsh tokens, redesigned shadow system, removed --sh-inset
  • Improved utility class (u--) specificity
  • Simplified --td-p to s10

v.0.10.5 (2026.04.05)

  • Removed set--cqUnit from core and moved to docs side

v.0.10.4 (2026.04.04)

  • Fixed missed migrations from the @layer naming change (lism.xxxlism-xxx).

v.0.10.3 (2026.04.04)

  • Changed --fw--bold to 600 and reorganized fw tokens to light / normal / bold.
  • Switched font-size calculation to CSS custom property-based (--fz-mol) approach, removing SCSS functions.

v.0.10.2 (2026.04.04)

  • Media.astro now automatically maps as="img" / as="picture" to Astro’s built-in Image / Picture components.
  • Introduced MediaPolymorphic type for Media.astro, enabling type completion for Image/Picture-specific props.
  • Added AllowedTag type constraints to the as prop on semantic wrappers (Group, Text, Inline, List, Heading, etc.) for both React and Astro.
  • Renamed CSS custom properties from --heading- to --headings- for consistency.
  • Reorganized table element styles using --td- / --th- tokens.
  • Adjusted base form control initial styles.
  • Fixed type-related issues including distributive conditional type handling for OmitIndexSignature.

v.0.10.1 (2026.04.03)

  • Negative margins can now be specified using space tokens. (e.g., my-s="-20", mt="-10")
  • Special prop handling in certain components such as <Layer>, <Decorator>, and <Media> has been removed. This includes filter-related props (translate, rotate, scale, transform, blur, contrast, etc.) and prop sugars for objectFit / objectPosition.
  • The <HTML.xxx> components have been removed and replaced with named components suited to their intended use.
  • The <Dummy> component has been moved to @lism-css/ui and reimplemented as DummyText (for text) and DummyImage (for images).

Replacing <HTML.xxx> with semantic wrapper components

ComponentDefault asPurpose
TextpBlock-level text content elements
InlinespanInline elements
GroupdivStructural wrappers
Headingh2Headings (h1–h6 via the lv prop)
LinkaLinks
ListulLists (as="ol" for ordered lists)
ListItemliList items

lism-css v.0.9.4 (2026.03.31)

  • Fixed an issue where no shadow was applied to the -bxsh:5 class.
  • Added types to Astro components.

@lism-css/ui v.0.9.3 (2026.03.30)

  • Fixed the package to distribute compiled output from dist instead of raw source components.
  • Fixed an issue where "use client" was being stripped during the build.

v.0.9.2 (2026.03.18)

  • Updated README.md.

v.0.9.1 (2026.03.18)

  • Removed the tag property from the <Lism> component and consolidated it into the as property.

v.0.9.0 (2026.03.17)

  • Changes in lism-css
    • React components have been migrated to TypeScript, enabling property suggestions in editors.
    • set-xxxset--xxx
    • u-xxxu--xxx
    • u-trimItemsu--trimChildren
    • set-snapu--snap
    • -content:-contentSize:
  • Major overhaul of @lism-css/ui.
  • Published @lism-css/mcp updated to v.0.9.0.

v.0.8.3

  • Minor CSS adjustments for linkbox.
  • Minor adjustments to the default --divider color.

v.0.8.2

  • Added -hov:to:zoom to the core.
  • Minor adjustments to l--flow.

v.0.8 (Major changes)

[Breaking] Line-height specification changed

The system has been updated to manage line-height using half-leading.

See Typography & Scaling for details.

Layout module changes

BeforeAfterNotes
WithSide(l--withSide)SideMain(l--sideMain)Layout module renamed
<Grid gtc="liquid"> (-gtc:liquid)<FluidCols>(l--fluidCols)Extracted as a standalone layout module
SwitchCols(l--switchCols)New layout module added

Removal of Dynamic Modules

d--accordion, d--modal, and d--tabs have been removed.

<Accordion>, <Modal>, and <Tabs> are no longer available in lism-css.

They are now provided by the @lism-css/ui package instead.

Token / CSS variable changes

BeforeAfterNotes
--c--main--brandColor token renamed
--c--line--dividerColor token renamed
--duration, --ease, --delay--hov-duration, --hov-ease, --hov-delayHover-related variable names clarified
--isHov_--_isHovNaming convention changed
--gutter--gutter-sizeVariable name clarified
  • Spacing scale has been overhauled.
  • Color tokens have been globally adjusted.

Property Class changes

BeforeAfterNotes
ovwovwrapoverflow-wrap
whitespaewhspace
-td:underRemoved
--tt:upper, -tt:lowerNewly added
  • translate, scale, and rotate have been removed from Property Classes.

Utility class changes

BeforeAfterNotes
-writing:verticalis--verticalMoved to State Class
u-bgclipTextRemoved (opt-out)
u-itemDivideru--collapseGridClass renamed
-gtc:liquidl--fluidColsExtracted as a layout class
-bdDefault value of --bdc changed-bdc:current added
  • Added set--bp.

Content size management class changes

is--container now only handles setting container-type. Content size management functionality has been separated into is--wrapper.

BeforeAfter
-max-sz:outer-max-sz:container
--sz--outer--sz--container

© Lism CSS. All rights reserved.

TOC