@tabula/forge - npm Package Versions

2.0.0-next.2

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.

2.0.0-next.1

Major Changes

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

2.0.0-next.0

Major Changes

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

Minor Changes

• #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

1.3.5

Patch Changes

• #47 dd9e428 Thanks @demiazz! - update dependencies

1.3.4

Patch Changes

• #45 9e9f585 Thanks @demiazz! - fix node version restrictions

1.3.3

Patch Changes

• #43 936d5e2 Thanks @demiazz! - update dependencies

1.3.2

Patch Changes

• #40 6081c5a Thanks @demiazz! - update dependencies

1.3.1

Patch Changes

• #38 fc41ac8 Thanks @demiazz! - update dependencies

1.3.0

Minor Changes

• #36 8bb0af7 Thanks @demiazz! - add correct handling of user defined displayName property when Storybook docs are generated

1.2.0

Minor Changes

• #32 a92544c Thanks @demiazz! - added cssClassPrefix option

  The option can be boolean or string.

  If string option is used, then it will be used as simple template with following placeholders:

  • [full-name] - full package name (with scope if it presented);
  • [scope] - package scope if presented or an empty string;
  • [name] - package name without scope.

  The prefix has format [full-name]__ by default or when option is true.

  When package name is awesome-ui, then:

  • when the option is [full-name]__, then the prefix is awesome_ui__;
  • when the option is [scope]__, then the prefix is __;
  • when the option is [scope]__[name]__, then the prefix is __awesome_ui__.

  When package name is @awesome-ui/theme, then:

  • when the option is [full-name]__, then the prefix is awesome_ui_theme_;
  • when the option is [scope]__, then the prefix is awesome_ui__;
  • when the option is [scope]__[name]__, then the prefix is awesome_ui__theme__.

Patch Changes

• #32 a92544c Thanks @demiazz! - uses short CSS classes format for CSS Modules and vanilla-extract in production mode

• #32 a92544c Thanks @demiazz! - update dependencies