Version Packages

[github-actions]

This PR was opened by the Changesets release GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated.

Releases

@tabula/forge@2.0.0

Major Changes

• #57 d3c40d7 Thanks @demiazz! - enable memo by default for SVGR transformations

• #60 5611ead Thanks @demiazz! - update target node up to 20.x

Minor Changes

• #62 bcd685a Thanks @demiazz! - emulate Vite's environment variables

  The vanilla-extract uses esbuild under the hood with CJS format. In that case, if you import any code with usage of
  import.

  We assume usage only import.meta.env.DEV, import.meta.env.PROD and import.meta.env.MODE variables in bundler
  user's code and emulate only it with defining constants.

  But this constants working only in compile time when CSS is generated and based on mode in which the forge is running
  at compilation moment.

  Be careful when use code which based on that variables in your vanilla-extract styles.

• #57 d3c40d7 Thanks @demiazz! - added support of transformation of SVG component name with svgrComponentName option.

  By default, SVGR uses Svg<CamelCaseFileName> name for components. You can override this behaviour through
  svgrComponentName options, which should be function of format (svgrName: string) => string.

  Example:

  export default {
    // ...
    svgrComponentName(name) {
      return `Ui${name.slice(3)}Icon`;
    },
    // ...
  };

  If you have a file column.svg then component name is SvgColumn by default. But with config from about the name
  will be UiColumnIcon.

  If you use memoization it looks like:

  import { memo } from "react";
  
  const UiColumnIcon = (props) => {
    // ...
  };
  
  const Memo = memo(UiColumnIcon);
  
  export { Memo as ReactComponent };

  This option doesn't affect named exports.

• #57 d3c40d7 Thanks @demiazz! - allow to append displayName for SVGR components.

  By default, SVGR doesn't append displayName for exported components. You can add this behaviour through svgrDisplayName
  option, which should be function of format (componentName: string) => string | { displayName: string; isDebugOnly?: boolean }.

  When function is returns string, then isDebugOnly equals to false.

  The componentName is name of component itself (before memoization if enabled). If you provide svgrComponentName option,
  then result of applying this function is componentName.

  The isDebugOnly enables wrapping the assignment in Vite compatible condition.

  // `isDebugOnly` = false
  
  Component.displayName = "scope(ComponentDisplayName)";
  
  // `isDebugOnly` = true
  
  if (import.meta.env.DEV) {
    Component.displayName = `scope(ComponentDisplayName)`;
  }

  If memoization is enabled, then the displayName will be assigned to the memoized component:

  const Component = (props) => {
    // ...
  };
  
  const Memo = memo(Component);
  
  Memo.displayName = `scope(ComponentDisplayName)`;

Patch Changes

• #57 d3c40d7 Thanks @demiazz! - add typings and exports config type

• #57 d3c40d7 Thanks @demiazz! - add @babel/types dependency