Styled Ppx Versions Save

CHANGES:

0.56.0

• Improvement for locations in both code-gen and error reporting (#456) by @davesnx
• Support css min and max functions (#411) by @lubegasimon
• Update docs (#457) by @zakybilfagih
• Native support for styled.{{tag}} (#461) by @zakybilfagih
• background-clip: text support by @davesnx
• Fix linear-gradient and radial-gradient (#464) by @davesnx
• Rename emotion-hash into murmur2 and remove public testing cli by @davesnx
• Use server-reason-react from opam by @davesnx

What's Changed

• Fix media query regression by @lubegasimon in https://github.com/davesnx/styled-ppx/pull/446
• Fix handling comments by @zakybilfagih in https://github.com/davesnx/styled-ppx/pull/445
• Support filter by @davesnx in https://github.com/davesnx/styled-ppx/pull/449
• Fix closing bracket in drop-shadow property when we stringify Color by @denis-ok in https://github.com/davesnx/styled-ppx/pull/450
• Support relative selector list for :has pseudo class by @zakybilfagih in https://github.com/davesnx/styled-ppx/pull/451
• add support for tab-size property by @lubegasimon in https://github.com/davesnx/styled-ppx/pull/388
• Add justify-self support by @rusty-key in https://github.com/davesnx/styled-ppx/pull/453
• Migrate css-support to cram tests by @davesnx in https://github.com/davesnx/styled-ppx/pull/454

New Contributors

• @denis-ok made their first contribution in https://github.com/davesnx/styled-ppx/pull/450

Full Changelog: https://github.com/davesnx/styled-ppx/compare/0.54.0...v0.54.1

What's Changed

• Support for more global values by @lubegasimon in https://github.com/davesnx/styled-ppx/pull/389
• Support more css props (imageRendering and borderImageSource) by @lubegasimon in https://github.com/davesnx/styled-ppx/pull/405
• color-mix function by @lubegasimon in https://github.com/davesnx/styled-ppx/pull/408
• support for media-queries5 by @lubegasimon in https://github.com/davesnx/styled-ppx/pull/424
• Support melange 3 from opam (by @jchavarri) by @davesnx in https://github.com/davesnx/styled-ppx/pull/423
• Allow a prop as to change the tag at runtime by @zakybilfagih in https://github.com/davesnx/styled-ppx/pull/436
• Fix attribute selector attribute name by @zakybilfagih in https://github.com/davesnx/styled-ppx/pull/439
• Support grid-template-columns by @davesnx in https://github.com/davesnx/styled-ppx/pull/440
  • Fix rendering test_* while printing help on make
  • Split ppx_snapshot_tests in ReScript (ppx_snapshot_rescript_test) and Reason (ppx_snapshot_reason_test)
  • Add e2e tests between the ppx and the library (ensuring type-safety between them)
  • Support grid-template-columns as safe code-generation
  • Added max-height: auto
  • Supported interpolation in overflow, overflow-inline
  • Support overflowBlock (with interpolation)
• Render more than one global selector on %styled.global by @zakybilfagih in https://github.com/davesnx/styled-ppx/pull/437
• Cleanup Css_lexer from #372 by @davesnx in https://github.com/davesnx/styled-ppx/pull/444

Full Changelog: https://github.com/davesnx/styled-ppx/compare/v0.53.1...0.54

This new release of styled-ppx brings one exciting breaking change: deprecation of bs-css and bs-css-emotion in favor of styled-ppx/css and styled-ppx/emotion

The reason for the deprecation are very simple:

• bs-css is slower to change than a vendored library
• bs-css currently supports much less CSS features as styled-ppx (https://github.com/search?q=repo%3Adavesnx%2Fstyled-ppx+bs-css+language%3AReason&type=code&l=Reason)
• We want to make the runtime as minimal as possible (near zero) and with an external library this isn't possible
• Want to use array/curried functions as much as possible while bs-css still exposes Css (while styled-ppx only uses CssJs)
• bs-css doesn't have an API reference where users can jump into it and solve their doubt

How to migrate

Future releases of styled-ppx will rely on features only shipped on styled-ppx/css and it will break your compilation.

npm install @davesnx/styled-ppx

{
  "bs-dependencies": [
    "@rescript/react",
-  "bs-css",
-  "bs-css-emotion",
+   "@davesnx/styled-ppx/css",
+   "@davesnx/styled-ppx/emotion"
  ]
}

What's Changed

• Embed bs-emotion under let%label by @davesnx in https://github.com/davesnx/styled-ppx/pull/341
• Fixing a bunch of issues with parsing by @davesnx in https://github.com/davesnx/styled-ppx/pull/345
• Remove logger reporter and refactor parsing to have result by @davesnx in https://github.com/davesnx/styled-ppx/pull/347
• Migrate to opam by @davesnx in https://github.com/davesnx/styled-ppx/pull/350
• Embed bs-css and bs-css-emotion by @davesnx in https://github.com/davesnx/styled-ppx/pull/349
• Add vertical-align and interpolation safe by @davesnx in https://github.com/davesnx/styled-ppx/pull/351
• Embed bs-css and bs-css-emotion as packages by @davesnx in https://github.com/davesnx/styled-ppx/pull/352
• Create js/native with copy_files under styled-ppx.css/bs-css by @davesnx in https://github.com/davesnx/styled-ppx/pull/353

Full Changelog: https://github.com/davesnx/styled-ppx/compare/v0.37.7...0.40.0

Features

• Support JSX4 in ReScript
• Support for ReScript v10
• Relax ppxlib constraint

Fix and CSS Support

• Remove all semi_colons conflicts (#328)
• Warning on last expression of the sequence when needs to be static (#326)
• Support more than two selectors by reducing stuff (#329)
• Support for grid-column/row-gap
• Support box/text-shadow: none

Features

• CSS: linear-gradient()
• CSS: repeating-linear-gradient()
• CSS: radial-gradient()
• CSS: repeating-radial-gradient()
• CSS: conic-gradient()
• CSS: hsl/a now are able for interpolation

Fix

• CSS: text-decoration-line
• CSS/code-gen: animation-time/transition-time etc
• CSS: fix min-height/min-width

Infra

• Add support for consumption in opam
• Removed reason-native packages (refmterr, rely)
• Add Parser.Types to code generation
• Update CI to latest actions

• Support CSS Selectors Level 3. Fixing https://github.com/davesnx/styled-ppx/issues/274 and https://github.com/davesnx/styled-ppx/issues/268
• Interpolation variables support (') https://github.com/davesnx/styled-ppx/issues/272
• Add type annotation to interpolated rules https://github.com/davesnx/styled-ppx/pull/285
• New rules for parsing keyframes. Now supports wrap in curly or not.
• Support complex at_media combinations (almost Media Queries Level 5)
• Treat prelude interpolation (in selectors/media) to be treated as string and respect whitespace.
• Push a new version of the documentation with all the goodies: Syntax highlight, fix the search box, fixed dark theme.
• Added a bunch of documentation sections: CSS Support, FAQ, Guides
• Polished most pages from the "Reference"

Features

This release includes a big change in how the parser treats interpolation, making it possible to have type holes in the CSS values, enabling type-safe variables at runtime with bs-css types.

Most single-value properties are supported and a few shorthands as well. We will enable as more as we found them useful. This will be documented under: https://styled-ppx.vercel.app/usage/interpolation

• Add interpolation and enforce parser rules for shadow #226
• Type-safe interpolation, for single-value properties and shorthand properties (margin, padding) #219

Fixes

• Add a unit as last argument #228 (Fixes https://github.com/davesnx/styled-ppx/issues/142)
• Shadowing makeProps by dynamic user props #227 (Fixes https://github.com/davesnx/styled-ppx/issues/143)
• Remove restriction for html tags #224 (Fixes https://github.com/davesnx/styled-ppx/issues/222)
• Add alias for type_ #225 (Fixes https://github.com/davesnx/styled-ppx/issues/221)

• Support for interpolation within values (at any position).
• Added a solid syntax: $()
• Pushed new documentation explaining the array API
• Added CssJs.label for styled calls.
• Rename css to cx, and keep cx