@tw-classed/react@1.4.3

Patch Changes

• #96 714d2389 Thanks @sannajammeh! - Fixes the merged className order from classed->component->variants to classed->variants->component

@tw-classed/react@1.4.2

Patch Changes

• 1715d071 Thanks @sannajammeh! - Refactors displayName set in #a382966 to use .name and .displayName raw when set on parent component

@tw-classed/react@1.4.1

Patch Changes

• db2effb5 Thanks @sannajammeh! - Extend inherited components displayName if not classed component

@tw-classed/solid@1.4.0

Patch Changes

• #70 a5763359 Thanks @sannajammeh! - Add Solid.js library

  @tw-classed/solid is a library that allows you to create classed components in Solid.js. It has 1-1 API parity with @tw-classed/react, but with Solid specific internals. Follow the React guide to learn more about the API.

  import { classed } from "@tw-classed/solid";
  
  const Button = classed.button("bg-blue-500 text-white p-2 rounded");
  
  () => <Button>Click me</Button>;

• Updated dependencies [785bcaaa, 0f5f46fa]:

  • @tw-classed/core@1.4.0

@tw-classed/react@1.4.0

Minor Changes

• #82 0f5f46fa Thanks @sannajammeh! - Adds support for deriveClassed & makeStrict. Updated core internal typing for compatibility.

Patch Changes

• #89 785bcaaa Thanks @sannajammeh! - Adds support for compoundVariants to be inherit via the composition API.

  Example:

  const Button = classed.button({
    base: "bg-blue-500 text-white",
    variants: {
      size: {
        sm: "px-2 py-1 text-sm",
        md: "px-4 py-2 text-base",
      },
      color: {
        red: "bg-red-500",
        green: "bg-green-500",
      },
    },
    compoundVariants: [
      {
        size: "sm",
        color: "green"
        class: "super-special-class-modifyer"
      },
    ],
  });
  
  const GreenButton = classed(Button, {
    defaultVariants: {
      color: "green", // This now triggers the compoundVariant
    },
  });

• #89 fc48bf56 Thanks @sannajammeh! - Sets target to es2018 in tsconfig to allow bundling to newer syntax

• #89 d392ab1c Thanks @sannajammeh! - Export Classed Proxy type due to TS error on pnpm

• #89 b183d8ab Thanks @sannajammeh! - Reverse insert order of first element composition to allow overriding of defaultVariants & other variant properties when re-classing

• #89 81a77612 Thanks @sannajammeh! - Fixes As prop usage inside a derived component's render method by implicitly requiring As generic.

  NOTE: Use only when manually setting as inside derive's render method. Otherwise, let the compiler infer the As generic.

  deriveClassed<Comp, Props, "div">((props, ref) => (
    <BaseComp as="div" {...props} ref={ref} />
  ));

• Updated dependencies [785bcaaa, 0f5f46fa]:

  • @tw-classed/core@1.4.0

@tw-classed/core@1.4.0

Minor Changes

• #82 0f5f46fa Thanks @sannajammeh! - Adds support for deriveClassed & makeStrict. Updated core internal typing for compatibility.

Patch Changes

• #89 785bcaaa Thanks @sannajammeh! - Adds support for compoundVariants to be inherit via the composition API.

  Example:

  const Button = classed.button({
    base: "bg-blue-500 text-white",
    variants: {
      size: {
        sm: "px-2 py-1 text-sm",
        md: "px-4 py-2 text-base",
      },
      color: {
        red: "bg-red-500",
        green: "bg-green-500",
      },
    },
    compoundVariants: [
      {
        size: "sm",
        color: "green"
        class: "super-special-class-modifyer"
      },
    ],
  });
  
  const GreenButton = classed(Button, {
    defaultVariants: {
      color: "green", // This now triggers the compoundVariant
    },
  });

@tw-classed/react@1.4.0-canary.6

Patch Changes

• fc48bf56 Thanks @sannajammeh! - Sets target to es2018 in tsconfig to allow bundling to newer syntax

@tw-classed/solid@1.4.0-canary.5

Patch Changes

• Updated dependencies [785bcaaa]:
  • @tw-classed/core@1.4.0-canary.5

@tw-classed/react@1.4.0-canary.5

Patch Changes

• 785bcaaa Thanks @sannajammeh! - Adds support for compoundVariants to be inherit via the composition API.

  Example:

  const Button = classed.button({
    base: "bg-blue-500 text-white",
    variants: {
      size: {
        sm: "px-2 py-1 text-sm",
        md: "px-4 py-2 text-base",
      },
      color: {
        red: "bg-red-500",
        green: "bg-green-500",
      },
    },
    compoundVariants: [
      {
        size: "sm",
        color: "green"
        class: "super-special-class-modifyer"
      },
    ],
  });
  
  const GreenButton = classed(Button, {
    defaultVariants: {
      color: "green", // This now triggers the compoundVariant
    },
  });

• Updated dependencies [785bcaaa]:

  • @tw-classed/core@1.4.0-canary.5

@tw-classed/react@1.4.0-canary.4

Patch Changes

• b183d8ab Thanks @sannajammeh! - Reverse insert order of first element composition to allow overriding of defaultVariants & other variant properties when re-classing