@compiled/css@0.21.1

Patch Changes

• a990973: Add support for @position-try global at-rule

  Added support for CSS @position-try at-rule (CSS Anchor Positioning Level 1) in Compiled's cssMap API. The @position-try at-rule defines named fallback positions for CSS Anchor Positioning and is now correctly handled as a global at-rule, similar to @keyframes.

  What changed:

  • Added 'position-try' to the ignored at-rules list in packages/css/src/plugins/atomicify-rules.ts
  • This ensures @position-try rules are emitted globally without atomification or component scoping
  • Both nested and flat syntax styles are supported:
    • Nested: '@position-try': { '--name': { ... } }
    • Flat: '@position-try --name': { ... }

  Browser support:

  • Chrome 125+ (May 2024)
  • Firefox 131+ (Oct 2024)
  • Safari 18.2+ (Dec 2024)

  Example usage:

  const styles = cssMap({
    arrowBlockStart: {
      '@position-try --ds-arrow-block-start': {
        positionArea: 'block-start',
        margin: 0,
        marginBlockEnd: 'var(--ds-arrow-size, 8px)',
      },
    },
  });

  Note: Type support for @position-try was already present via csstype 3.2.3 (added in #1867). This change completes the implementation by ensuring the CSS transformation correctly handles it as a global at-rule.

@compiled/babel-plugin@0.39.1

Patch Changes

• a990973: Add support for @position-try global at-rule

  Added support for CSS @position-try at-rule (CSS Anchor Positioning Level 1) in Compiled's cssMap API. The @position-try at-rule defines named fallback positions for CSS Anchor Positioning and is now correctly handled as a global at-rule, similar to @keyframes.

  What changed:

  • Added 'position-try' to the ignored at-rules list in packages/css/src/plugins/atomicify-rules.ts
  • This ensures @position-try rules are emitted globally without atomification or component scoping
  • Both nested and flat syntax styles are supported:
    • Nested: '@position-try': { '--name': { ... } }
    • Flat: '@position-try --name': { ... }

  Browser support:

  • Chrome 125+ (May 2024)
  • Firefox 131+ (Oct 2024)
  • Safari 18.2+ (Dec 2024)

  Example usage:

  const styles = cssMap({
    arrowBlockStart: {
      '@position-try --ds-arrow-block-start': {
        positionArea: 'block-start',
        margin: 0,
        marginBlockEnd: 'var(--ds-arrow-size, 8px)',
      },
    },
  });

  Note: Type support for @position-try was already present via csstype 3.2.3 (added in #1867). This change completes the implementation by ensuring the CSS transformation correctly handles it as a global at-rule.

• Updated dependencies [a990973]

  • @compiled/css@0.21.1

@compiled/webpack-loader@0.20.1

Patch Changes

• Updated dependencies [6429bfe]
  • @compiled/babel-plugin@0.39.0

@compiled/vite-plugin@1.1.4

Patch Changes

• Updated dependencies [6429bfe]
  • @compiled/babel-plugin@0.39.0

@compiled/react@0.20.0

Minor Changes

• 6429bfe: Bump csstype from 3.1.3 to 3.2.3 and add missing @container support to cssMap validation

  Updates csstype to the latest version which reflects the evolution of CSS standards. This change also fixes a bug where @container (CSS Container Queries) was partially supported in CSS processing but was missing from the cssMap type validation lookup table.

  Removed at-rules:

  • @scroll-timeline - Abandoned CSS proposal; Scroll-driven Animations now use animation-timeline property instead
  • @viewport - Obsolete at-rule with no modern browser support; viewport configuration is now handled via meta tags and media queries

  Added at-rules (with full support):

  • @container - CSS Container Queries (now fully validated in cssMap)
  • @position-try - CSS Anchor Positioning
  • @view-transition - View Transitions API

  What changed:

  • Updated csstype dependency to 3.2.3 across all packages
  • Updated AtRules type mapping in packages/babel-plugin/src/utils/css-map.ts to include the new at-rules and remove deprecated ones
  • Bumped to minor for @compiled/babel-plugin due to adding @container support to cssMap validation

  Note: The @scroll-timeline and @viewport at-rules are not used anywhere in the Compiled codebase, so this is not a breaking change.

@compiled/parcel-transformer@0.19.1

Patch Changes

• Updated dependencies [6429bfe]
  • @compiled/babel-plugin@0.39.0

@compiled/jest@0.11.0

Minor Changes

• 6429bfe: Bump csstype from 3.1.3 to 3.2.3 and add missing @container support to cssMap validation

  Updates csstype to the latest version which reflects the evolution of CSS standards. This change also fixes a bug where @container (CSS Container Queries) was partially supported in CSS processing but was missing from the cssMap type validation lookup table.

  Removed at-rules:

  • @scroll-timeline - Abandoned CSS proposal; Scroll-driven Animations now use animation-timeline property instead
  • @viewport - Obsolete at-rule with no modern browser support; viewport configuration is now handled via meta tags and media queries

  Added at-rules (with full support):

  • @container - CSS Container Queries (now fully validated in cssMap)
  • @position-try - CSS Anchor Positioning
  • @view-transition - View Transitions API

  What changed:

  • Updated csstype dependency to 3.2.3 across all packages
  • Updated AtRules type mapping in packages/babel-plugin/src/utils/css-map.ts to include the new at-rules and remove deprecated ones
  • Bumped to minor for @compiled/babel-plugin due to adding @container support to cssMap validation

  Note: The @scroll-timeline and @viewport at-rules are not used anywhere in the Compiled codebase, so this is not a breaking change.

@compiled/babel-plugin@0.39.0

Minor Changes

• 6429bfe: Bump csstype from 3.1.3 to 3.2.3 and add missing @container support to cssMap validation

  Updates csstype to the latest version which reflects the evolution of CSS standards. This change also fixes a bug where @container (CSS Container Queries) was partially supported in CSS processing but was missing from the cssMap type validation lookup table.

  Removed at-rules:

  • @scroll-timeline - Abandoned CSS proposal; Scroll-driven Animations now use animation-timeline property instead
  • @viewport - Obsolete at-rule with no modern browser support; viewport configuration is now handled via meta tags and media queries

  Added at-rules (with full support):

  • @container - CSS Container Queries (now fully validated in cssMap)
  • @position-try - CSS Anchor Positioning
  • @view-transition - View Transitions API

  What changed:

  • Updated csstype dependency to 3.2.3 across all packages
  • Updated AtRules type mapping in packages/babel-plugin/src/utils/css-map.ts to include the new at-rules and remove deprecated ones
  • Bumped to minor for @compiled/babel-plugin due to adding @container support to cssMap validation

  Note: The @scroll-timeline and @viewport at-rules are not used anywhere in the Compiled codebase, so this is not a breaking change.

@compiled/vite-plugin@1.1.3

Patch Changes

• a4c1ee8: Fix #1861 by adding extensions into @compiled/vite-plugin and @compiled/react packages to fix ESM support.

@compiled/react@0.19.1

Patch Changes

• a4c1ee8: Fix #1861 by adding extensions into @compiled/vite-plugin and @compiled/react packages to fix ESM support.