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:containerand introduced-max-sz:bleed, a new full-bleed utility that expands up to the outermostis--containerwidth - Set the initial-value of
--sz--bleedto100svi, providing a viewport-width fallback when nois--containerancestor exists
Removed --REM and simplified --fz--base
- Removed
--REMand unified--fz--baseto1rem - Aligned
--hl-unit/--s-unitto be derived from--fz--base
Removed link decoration styles from a tag
- Removed
--link-td-thickness/--link-td-colorstyles from theatag
Bug Fixes
- Added
inline-size: 100%tois--wrapperto prevent layout shifts insidestack(#356) - Changed the default value of
--td-pfromvar(--s10)tovar(--s10) var(--s15)
Other
- Unified styles for
blockquoteandpre, and added italic style toqandblockquote - Adjusted
ltstokens and addedxlsize
@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:exportsscript that auto-generatesexportsfromsrc/components/, regenerated and committed during build.
lism-css v.0.16.1 (2026.04.29)
- Changed the
--list-px-sfallback value to1.75em - Added
min-width: 0tol--withSideflex 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.
| Old | New |
|---|---|
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.
| Old | New | Purpose |
|---|---|---|
| — | u--divide | Display dividers between children only (no outer frame) |
u--collapseGrid | u--cells | Wrap 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.
| Old | New | Value |
|---|---|---|
| — | --o--mp / -o:mp | 0.9 (new) |
--o---10 / -o:-10 | --o--p / -o:p | 0.75 |
--o---20 / -o:-20 | --o--pp / -o:pp | 0.5 |
--o---30 / -o:-30 | --o--ppp / -o:ppp | 0.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.
| Old | New |
|---|---|
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:-oopacity fallback from0.7tovar(--o--p) - Internal refactor: reorganized trait SCSS files into
is/andhas/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
Alertcomponent’slayoutprop 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-traitlayer and restoredhas--*Trait Classes - Redesigned class output order:
set-- → trait(is--/has--) → u-- → -prop - Migrated
set--masktohas--maskunder the trait layer
set-- Class Overhaul (#304)
- Reclassified with
var:prefixset--hov→set--var:hovset--shadow→set--var:shset--innerRs→set--var:bdrsInner
- Migrated
set--masktohas--maskunder the trait layer - Added new
set--revert(replaces automaticul/oldetection 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:hovgroup from-hov:to:*to-hov:in:* - Added
-hov:underlinepreset -hov:neutraletc. remain unchanged- Removed auto-shortening of hov string values; unified behavior of object
truevalues - 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 token | Value | New token |
|---|---|---|
--shsz--10 | 0px 2px 6px | --shsz--20 |
--shsz--20 | 0px 4px 12px | --shsz--30 |
--shsz--30 | 0px 8px 24px | --shsz--40 |
--shsz--40 | 0px 16px 48px | --shsz--50 |
- New
--shsz--10is0px 1px 3px(the new smallest size) - Added
--bxsh--50/--shsz--50 - Adjusted
--shcopacity from 12% → 15%
Other
- Removed
prop="-"notation in favor oftrueonly (#310) - Removed
overwriteBaseVarand merged intoalwaysVar; improved BP class output - Reorganized
has--transitionvariables (--transProp→--transitionProps,--hov-duration→--transition-duration) and adjusted default duration to 0.25s - Changed
has--snapCSS variable defaults to element-side initialization - Introduced
AstroLayoutProps<L>and removedAstroFlowProps/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) fromspantoa. If you were using it withouthref, specifyas="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/AstroFlexPropsintoAstroLayoutProps<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
Flexcomponent inDetails/Summary - Aligned
Details/ContentReact implementation with Astro usingFlow - Used
Flex/FlowinAccordion/Button/Panel - Added
gen:registryscript to generateregistry-index.json
lism-css v.0.14.0 (2026.04.17)
This release contains breaking changes.
Props system cleanup
- Removed
lismClass/variantprops in favor of unifiedclassName - Removed dedicated
clipPath/boxSizingprops fromDecorator
Property Class renames
ysz→bsz(block-size)isolation→isowhspace→whs(white-space)ovwrap→ovw(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--fulltokens
Other
- Changed
fluidColsdefault 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/variantprops, unified toclassName) - Removed the
DummyImagecomponent (use the CDN dummy image URL directly instead, e.g.https://cdn.lism-css.com/dummy-image.jpg) - Renamed internal files for
Details/Tabsto theRootconvention - Added the
buildModifierClasshelper 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
getPropsinto components
lism-css v.0.13.1 (2026.04.15)
- Added the
atomicprop
@lism-css/ui v.0.13.1 (2026.04.15)
- Aligned with lism-css 0.13.1
- Cleaned up
Tabsstyles
lism-css v.0.13.0 (2026.04.14)
This release contains breaking changes.
Module → Primitive concept rename
- Renamed concept
Module→Primitive- CSS layer
lism-modules→lism-primitive - SCSS directory
src/scss/modules→src/scss/primitives
- CSS layer
- Added new CSS layer
lism-component
State → Trait identifier unification
Renamed State identifiers in the Props system to Trait.
- Type
StateProps→TraitProps - Constant
STATES→TRAITS lism.config.jskeystates→traits- File
config/defaults/states.ts→config/defaults/traits.ts
Note: Prop names such as isContainer / isWrapper and is--* class names are unchanged.
set / util props unification
- Added
utilprop; unifiedset/utilas strings with-prefix for exclusion
Trait Class / naming cleanup
- Renamed
is--linkBox→is--boxLink - Renamed
u--expandedLink→is--coverLink - Removed
Container’ssizeprop in favor ofisWrapper
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
utilprop; unifiedset/utilas strings with-prefix for exclusion - Moved
c--components to thelism-componentCSS layer - Unified CSS layer names to singular (
lism-components→lism-component)
@lism-css/ui v.0.12.0 (2026.04.10)
- Aligned with lism-css 0.12.0
- Migrated all
.js/.jsxfiles 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-ytocg/rg - Removed
setXxxxindividual props in favor of unifiedset=""unset="" - Repositioned
@layer lism-custombetween modules and utility - Changed list padding-inline-start to
--list-px-scustom property - Removed deprecated HTML component files
- Changed Property Class value abbreviations to CSS actual values (
in-flex→inline-flex,rel→relative,abs→absolute,col→column,cc→current, etc.) - Renamed “Prop Class” terminology to “Property Class”
- Removed
--gtr/--gtc/--gtaCSS variables and grid-template declarations froml--grid - Removed unused
--bdrs--5token
v.0.11.0 (2026.04.05)
- Reduced
bdrs/bxshtokens, redesigned shadow system, removed--sh-inset - Improved utility class (
u--) specificity - Simplified
--td-ptos10
v.0.10.5 (2026.04.05)
- Removed
set--cqUnitfrom core and moved to docs side
v.0.10.4 (2026.04.04)
- Fixed missed migrations from the
@layernaming change (lism.xxx→lism-xxx).
v.0.10.3 (2026.04.04)
- Changed
--fw--boldto 600 and reorganizedfwtokens tolight/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
asprop 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 forobjectFit/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/uiand reimplemented asDummyText(for text) andDummyImage(for images).
Replacing <HTML.xxx> with semantic wrapper components
| Component | Default as | Purpose |
|---|---|---|
Text | p | Block-level text content elements |
Inline | span | Inline elements |
Group | div | Structural wrappers |
Heading | h2 | Headings (h1–h6 via the lv prop) |
Link | a | Links |
List | ul | Lists (as="ol" for ordered lists) |
ListItem | li | List items |
lism-css v.0.9.4 (2026.03.31)
- Fixed an issue where no shadow was applied to the
-bxsh:5class. - Added types to Astro components.
@lism-css/ui v.0.9.3 (2026.03.30)
- Fixed the package to distribute compiled output from
distinstead 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
tagproperty from the<Lism>component and consolidated it into theasproperty.
v.0.9.0 (2026.03.17)
- Changes in
lism-css- React components have been migrated to TypeScript, enabling property suggestions in editors.
set-xxx→set--xxxu-xxx→u--xxxu-trimItems→u--trimChildrenset-snap→u--snap-content:→-contentSize:
- Major overhaul of
@lism-css/ui. - Published
@lism-css/mcpupdated to v.0.9.0.
v.0.8.3
- Minor CSS adjustments for linkbox.
- Minor adjustments to the default
--dividercolor.
v.0.8.2
- Added
-hov:to:zoomto 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
| Before | After | Notes |
|---|---|---|
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
| Before | After | Notes |
|---|---|---|
--c--main | --brand | Color token renamed |
--c--line | --divider | Color token renamed |
--duration, --ease, --delay | --hov-duration, --hov-ease, --hov-delay | Hover-related variable names clarified |
--isHov_ | --_isHov | Naming convention changed |
--gutter | --gutter-size | Variable name clarified |
- Spacing scale has been overhauled.
- Color tokens have been globally adjusted.
Property Class changes
| Before | After | Notes |
|---|---|---|
ovw | ovwrap | overflow-wrap |
whitespae | whspace | |
-td:under | Removed | |
| - | -tt:upper, -tt:lower | Newly added |
translate,scale, androtatehave been removed from Property Classes.
Utility class changes
| Before | After | Notes |
|---|---|---|
-writing:vertical | is--vertical | Moved to State Class |
u-bgclipText | Removed (opt-out) | |
u-itemDivider | u--collapseGrid | Class renamed |
-gtc:liquid | l--fluidCols | Extracted as a layout class |
-bd | Default 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.
| Before | After |
|---|---|
-max-sz:outer | -max-sz:container |
--sz--outer | --sz--container |