tw-in-js/twind v0.16.6

on GitHub

• test: initial observe test 8c316b7

• fix: re-export twind from twind/shim f828c10

• support not- prefix for pseudo class variants (#149) c65c8b9

  The prefix will be expanded to :not(...).

  Examples:

  Class name	Selector
  not-focus:invalid:border-red-500	.not-focus\\:invalid\\:border-red-500:not(:focus):invalid
  invalid:not-focus:border-red-500	.invalid\\:not-focus\\:border-red-500:invalid:not(:focus)
  not-disabled:focus:font-bold	.not-disabled\\:focus\\:font-bold:not(:disabled):focus
  not-last-child:mb-5	.not-last-child\\:mb-5:not(:last-child)

  Core and user defined variants are not expanded and stay as is.

  Example:

  setup({
    variants: {
      'not-logged-in': 'body:not(.logged-in) &',
    },
  })
  
  tw`not-logged-in:hidden`
  // => `body:not(.logged-in) .not-logged-in\\:hidden`

• support arbitrary values using square bracket notation like top-[-113px] (#148) 039e241

  It works in places where a theme value would be used. So almost everywhere. It works with variants too, like md:top-[-113px].

  Here are some examples:

  bg-[#0f0]
  bg-[#ff0000]
  bg-[#0000ffcc]
  bg-[hsl(0,100%,50%)]
  bg-[hsla(0,100%,50%,0.3)]
  bg-[rgb(123,123,123)]
  bg-[rgba(123,123,123,var(--tw-bg-opacity))]
  bg-opacity-[0.11]
  border-[#f00]
  border-[2.5px]
  duration-[2s]
  grid-cols-[200px,repeat(auto-fill,minmax(15%,100px)),300px]
  grid-cols-[minmax(100px,max-content)repeat(auto-fill,200px)20%]
  grid-cols-[repeat(auto-fit,minmax(150px,1fr))]
  flex-[30%]
  ring-[#1da1f2]
  ring-[7px]
  ring-offset-[#1da1f2]
  ring-offset-[7px]
  rotate-[0.5turn]
  rotate-[23deg]
  rotate-[2.3rad]
  rotate-[401grad]
  rotate-[1.5turn]
  rounded-[33%]
  scale-[2]
  scale-x-[1.15]
  skew-[30deg]
  skew-x-[1.07rad]
  space-x-[20cm]
  space-x-[calc(20%-1cm)]
  text-[#1da1f2]
  text-[2.23rem]
  text-[6px]
  text-[calc(1vw+1vh+.5vmin)]
  top-[-123px]
  top-[123px]
  transition-[font-size,color,width]
  translate-[3in]
  translate-y-[2px]
  w-[3.23rem]
  w-[calc(100%+1rem)]
  w-[clamp(23ch,50%,46ch)]
  

v0.16.3...v0.16.6