What's Changed

• Do not mangle selectors when in watchmode by @Machy8 in #257
• Types by @Machy8 in #260
• Mangling fixes by @Machy8 in #262

Full Changelog: https://github.com/stylify/packages/compare/v0.6...v0.6.1

What's Changed

• Regular expressions array for selectors areas by @Machy8 in #242
• Configurator cleanup by @Machy8 in #243

@stylify/stylify

Compiler

• return this was removed from configure and addMacro method
• Css variables are now enabled by default and all variables are now exported as CSS variables. Also when used within a a property value as $someVariable it is converted to var(--someVariable).
• replaceVariablesByCssVariables was renamed to cssVariablesEnabled. The cssVariablesEnabled option accepts a boolean value that disables CSS variables if the false value is passed as value.
• selectorsAreas now expect regular expressions instead of strings

// 0.5
const compilerConfig = {
  selectorsAreas: [
    '(?:^|\\s+)class="([^"]+)"',
  ]
}
// 0.6
const compilerConfig = {
  selectorsAreas: [
    /(?:^|\s+)class="([^"]+)"/,
  ]
}

Macros

• The this object within the macro callback now contains the compiler instance
• Instead of selectorProperties.add() return an object with properties: values
• Matches getCapture() method now returns undefined for a default value if capture was not found instead of empty string. This improves comparison for macroMatch.getCapture(0) ??
• hasCapture method has been removed

// 0.5
const compilerConfig = {
 macros: {
   macro: ({ macroMatch, selectorProperties, helpers, variables, dev })  => {
     selectorProperties.add('property', macroMatch.geCapture(0));
   }
 }
}
// 0.6
const compilerConfig = {
 macros: {
   macro(match) {
      const { variables, helpers, dev } = this;
      return  { 
        ['property']: match.getCapture(0),
        'another-property': 'value'
      }
   }
 }
}

Components

• The this object within the component callback now contains the compiler instance
• Component definition now receives RegExpMatch instead of an array of matches. Instead of matches[0] use getCapture(0). Matches indexes are now shorter by 1: the fullMatch is the whole reg exp match, and captures contain only additional captures:
  • matches[0] => match.fullMatch
  • matches[1] is now match.getCapture(0)

// 0.5
const compilerConfig = {
  components: {
     'btn:(\\S+)'(match) {
        const { variables, helpers, dev } = this;
        return `color:${match.getCapture(0)}`
     }
  }
}

Helpers

• The this object within the helper callback now contains the compiler instance

Configurator

• All methods except getExistingConfigFiles were removed. This method returns paths to existing config files.

Compiler hooks

• compiler:newMacroMatch: Now receives Record<string, string> instead of SelectorProperties object

@stylify/bundler

• cssVarsDirPath, sassVarsDirPath, lessVarsDirPath, stylusVarsDirPath were renamed to cssVarsExportPath, sassVarsExportPath, lessVarsExportPath, stylusVarsExportPath. It accepts direct file path (like ./path/to/vars.css) to which it will be saved, or only a directoy path ./path/to/cssDir. If no file name is provided, the stylify-variables file name will be used with correct suffix.

What's Changed

• feat: reexport bundler hooks from packages by @Machy8 in #240
• Fix matching and mangling collisions by @Machy8 in #241

Full Changelog: https://github.com/stylify/packages/compare/v0.5.32...v0.5.33

What's Changed

• Pnpm by @Machy8 in #145
• Add showBundlesStats option by @Machy8 in #234
• Add bundler logs directory option by @Machy8 in #235
• Smallfixes by @Machy8 in #237

Full Changelog: https://github.com/stylify/packages/compare/v0.5.31...v0.5.32

What's Changed

• Fix typo by @MilesPernicious in #225
• Call getElementById('id') instead of querySelector('#id') by @MilesPernicious in #226
• Tunning24 by @Machy8 in #230

New Contributors

• @MilesPernicious made their first contribution in #225

Full Changelog: https://github.com/stylify/packages/compare/v0.5.30...v0.5.31

Full Changelog: https://github.com/stylify/packages/compare/v0.5.29...v0.5.30

Related issues #223

What's Changed

• feat: Add importDefaultBundle option for disabling defult bundle import by @Machy8 in #222

Full Changelog: https://github.com/stylify/packages/compare/v0.5.28...v0.5.29

What's Changed

• External variables tunning, Svelte matching area, Astro fix on Windows by @Machy8 in #216
• Bundler configuration hot reload by @Machy8 in #207
• Windows fixes by @Machy8 in #219

Stylify

• Indented CSS variable in generated CSS

Bundler

• Config hot reloading
• Added restart method
• Normalized output file path

Astro

• Fixed Windows build

Nuxt Module

• Fixed Windows build

Nuxt

• Fixed Windows build
• Fixed mangled selectors rewriting in content module

Unplugin

• Added yaml, neon, mdx file formats
• Fixed ignored areas matching
• Fixed duplicated bundler instances

Full Changelog: https://github.com/stylify/packages/compare/v0.5.27...v0.5.28

What's Changed

• refactoring: Default preset refactoring by @Machy8 in #200
• Pass mangledSelectorsPrefix and selectorsPrefix into unplugin by @Machy8 in #203
• Update to 0.5.27 by @Machy8 in #205

Full Changelog: https://github.com/stylify/packages/compare/v0.5.26...v0.5.27

Fixes of duplicated areas mangling

Full Changelog: https://github.com/stylify/packages/compare/v0.5.25...v0.5.26

What's Changed

• mangledSelectorsPrefix and selectorsPrefix can be used to prevent collision with already existing selectors
• Mangled blocks are without new lines and duplicated spaces. This makes the output look prettier.
• Mangling can handle escaped areas for example within yaml files

• Mangled selectors tunning, Astro v2 tests by @Machy8 in #199

Full Changelog: https://github.com/stylify/packages/compare/v0.5.24...v0.5.25

• Fixed cached results reset in Stylify Compiler.
• Added stop method in the Bundler.

Full Changelog: https://github.com/stylify/packages/compare/v0.5.23...v0.5.24

What's Changed

• Mangling by @Machy8 in #189
• External variables content option by @Machy8 in #193
• Mangling fixes, Twig match areas, Tunning by @Machy8 in #194

Full Changelog: https://github.com/stylify/packages/compare/v0.5.22...v0.5.23

What's Changed

• Pseudo classes tokenization by @Machy8 in #187

Full Changelog: https://github.com/stylify/packages/compare/v0.5.21...v0.5.22

What's Changed

• Fixes15 by @Machy8 in #179

Full Changelog: https://github.com/stylify/packages/compare/v0.5.20...v0.5.21

• Bug fixes in Stylify Cache

Full Changelog: https://github.com/stylify/packages/compare/v0.5.19...v0.5.20

What's Changed

• Fixes13 by @Machy8 in #176
• Fixes14 by @Machy8 in #177

Full Changelog: https://github.com/stylify/packages/compare/v0.5.18...v0.5.19

What's Changed

• Fix similar screens matching by @Machy8 in #175

Full Changelog: https://github.com/stylify/packages/compare/v0.5.17...v0.5.18

What's Changed

• Fixes4 by @Machy8 in #173

Full Changelog: https://github.com/stylify/packages/compare/v0.5.16...v0.5.17

Bugfixes + Typehint fixes

Full Changelog: https://github.com/stylify/packages/compare/v0.5.15...v0.5.16

External variables feature

When some external variables are defined (for example CSS variables) it makes no sense to define or import them into Stylify. Instead you can use mark them as external. More info in docs.

const stylifyConfig = {
 compiler: {
  externalVariables: [
     // Simple string check
     'test',
     // Flexible function check. Return true if matched. Otherwise return undefined or nothing.
     (variable) => {
       if (variable.startsWith('md-') return true;
     }
  ]
 }
}

Full Changelog: https://github.com/stylify/packages/compare/v0.5.14...v0.5.15

• Fixed watching for directories with special characters.
• Used chokidar for watching directories instead of fs.watch, because the watching system is simply a huge mess.

Full Changelog: https://github.com/stylify/packages/compare/v0.5.13...v0.5.14

• Fix: Bundler: Already normalized path should not be normalized again

Full Changelog: https://github.com/stylify/packages/compare/v0.5.12...v0.5.13

Features

Now you can define Dynamic Components. With this feature, you can create components, that changes style based on matches from regular expression

For example:

title--large title--$red

const compilerConfig = {
    components: {
        // title--$red
        // title--#06f
        'title(?:--(\\S+))?': ({ matches, variables, helpers, dev }) => {
            const color = matches[1] ?? '#000';
            return `font-size:24px${color ? ` color:${color}` : ''}`;
        },
    }
}; 

What's Changed

• Dynamic components by @Machy8 in #165

Full Changelog: https://github.com/stylify/packages/compare/v0.5.11...v0.5.12

Features

• Added screen and pseudo classes group md:{font-size:24px;margin-bottom:8px} lg:hover:{color:purple;scale:1.4}
• Utilities, that are not matched within a content are not generated even though they have been added within component or custom selector
• Removed unnecessary escaping of - and _ in generated CSS
• Characters aliases such as _ can be now escaped \_, so the _ is preserved: [.some\_\_selector]{color:blue} => this will not replace underscores

What's Changed

• Optimization tunning by @Machy8 in #159
• Multiple properties can be wrapped into pseudo class or screen group by @Machy8 in #160
• Aliases escaping by @Machy8 in #164

Full Changelog: https://github.com/stylify/packages/compare/v0.5.10...v0.5.11

• Removed isRoot from bundler file when processed Full Changelog: https://github.com/stylify/packages/compare/v0.5.9...v0.5.10

• Bug fixes in Bundler watch task

Full Changelog: https://github.com/stylify/packages/compare/v0.5.8...v0.5.9

What's Changed

• Added bundler initialized hook. This allows you to get initialized Bundler from anywhere within the app.
• Fix bundler watch command by @Machy8 in #157

Full Changelog: https://github.com/stylify/packages/compare/v0.5.7...v0.5.8

What's Changed

• Bundler can now watch newly added files, no restart is required
• Bundler can export CSS into CSS layers
• Fixed bug: Astro supports multiple files
• Unplugin can now be initialized without config or empty brackets
• Astro now doesn't mangle selectors in source files but in generated js
• Tunning9 by @Machy8 in #156

Full Changelog: https://github.com/stylify/packages/compare/v0.5.6...v0.5.7

What's Changed

• Unplugin (any type) can now load config without empty configuration object: stylifyVite({}) => stylifyVite()

• Fixes3 by @Machy8 in #154

Full Changelog: https://github.com/stylify/packages/compare/v0.5.5...v0.5.6

What's Changed

• Added how to contribute nodes by @Machy8 in #149
• Replace multiple variables in one selector by @Machy8 in #153

Full Changelog: https://github.com/stylify/packages/compare/v0.5.4...v0.5.5

• Bug fixes
• Unplugin now have a shared bundler called default
• Each plugin can then have an id. This will create it's own bundler and compiler for rewritting selectors.

What's Changed

• Fixes by @Machy8 in #148 Full Changelog: https://github.com/stylify/packages/compare/v0.5.3...v0.5.4

• Bugfixes
• Lerna publish remains for publishing. Yarn workspaces work somehow weirdly when publishing packages.

What's Changed

• Switch to yarn workspaces from lerna by @Machy8 in #141
• Fix bug when incorrectly replaced white characters by a space by @Machy8 in #142

Full Changelog: https://github.com/stylify/packages/compare/v0.5.2...v0.5.3

Bug fixes

Full Changelog: https://github.com/stylify/packages/compare/v0.5.1...v0.5.2

• Unplugin configuration can be overriden

Full Changelog: https://github.com/stylify/packages/compare/v0.5.0...v0.5.1

@stylify/stylify

• Plain Selectors renamed to Custom selectors
• Components and custom selectors now accepts only string instead of an array of strings and etc.
• Components and custom selectors can have nested selectors

const components = {
   'button': `
      cursor:pointer
      .icon { color:yellow }
      > {
      .icon, span { vertical-align:middle }
      }
  `
}

• Custom selectors can be generated directly from selector within the markup
• Stylify packages now use hookable system instead of properties and configurations
• Runtime now uses Hookable system, instead of dom custom event
• Rewrite selectors method now doesn't need compilation result because it uses the MinifiedSelectorsGenerator register.
• Macro functions now receive one object without changing this object:

'macro': ({ macroMatch, selectorProperties, helpers, variables, dev }) => {
  // ...
}

• The Rewrite Selectors method now accepts an object instead of two arguments or a string.

.rewriteSelectors({ content, rewriteOnlyInSelectorsAreas, matchSelectorsWithPrefix })

• The Rewrite Selectors method now accepts a new argument: matchSelectorsWithPrefix that causes to match element according to the given prefix during compilation => If matched selector had to be class, the prefix is . and is rewritten as .selector instead of selector.
• The Minified Selectors Generator now returns a character with prefix if defined.

@stylify/bundler

• When waiting on the Bundler to process, the await bundler.waitOnBundlesProcessed() can be called on its own. It now internally waits on the bundle() method to finish. The await bundler.bundle(). Can be removed if is used to wait on the Bundler before another step in the build.
• When generated or rewritten content is the same as in the file, that file is not overridden. This decreases the amount of "file saved" triggers during development. If the file doesn't exist, it is created.

@stylify/unplugin

• Transform method is triggered only when selectors are rewritten. Otherwise, it just returns code that was passed as argument
• When a new config is passed, the getBundler() method now waits on the previous bundler to finish and then creates a new bundler during development

What's Changed

• Tunning8 by @Machy8 in #140

Full Changelog: https://github.com/stylify/packages/compare/v0.4.0...v0.5.0

@stylify/astro

• stylifyIntegration export renamed to stylify.
• There is no config nor empty object necessary when initializing the integration
• Selectors are now matched within class:list.

@stylify/stylify

• One underscore for a selector instead of two: _ => border:2px_solid_red.
• Helpers now works even when replaceVariablesByCssVariables is enabled.

What's Changed

• Tunning6 by @Machy8 in #137
• Tunning7 by @Machy8 in #138

Full Changelog: https://github.com/stylify/packages/compare/v0.3.0...v0.4.0

News and features

• Native preset is now by default in Compiler. No need to load it anymore
• Variables can be now added under classes

const compilerConfig = {
  variables: {
     '.dark': {
        bg: '#000'
     }
  }
}

• Helpers like lighten(#000,10) can now be used by default in selectors properties border:2px__solid__lighten(#000,10), color:lighten(#000, 10).
• Extend keyword removed. The configuration is now merged and not overridden by default.
• Selector areas for React, Vue, Angular, Nette, Lit and Alpine added directly into the compiler.
• Unplugin exports fixed
• Runtime now has only Stylify.configure() without runtime key.
• A few bugfixes - Runtime, Replacement of $ in ignored area

Packages

• Added @stylify/astro integration for AstroJS
• @stylify/autoprefixer discontinued

What's Changed

• Tunning5 by @Machy8 in #128
• Typo word Nittro by @chz in #129
• Typo word nittro by @chz in #130
• Astroplugin by @Machy8 in #131
• Tunning6 by @Machy8 in #132

New Contributors

• @chz made their first contribution in #129

Full Changelog: https://github.com/stylify/packages/compare/v0.2.1...v0.3.0

• Variables can be used within variables
• New mangling alghoritm
• Selectors can start only with alphanumeric characters
• Autoprefixer by default in bundler
• Variables can be different for each screen
• Dropped profiler and its support in Nuxt packages

What's Changed

• Tunning4 by @Machy8 in #127

Full Changelog: https://github.com/stylify/packages/compare/v0.1.3...v0.2.1

Keyframes feature added

What's Changed

• Various updates by @Machy8 in #124

Full Changelog: https://github.com/stylify/packages/compare/v0.1.1...v0.1.2

What's Changed

• Fix cjs build for nuxt @Machy8 in #121

Full Changelog: https://github.com/stylify/packages/compare/v0.1.0...v0.1.1

What's Changed

• Switch from rollup to esbuild by @Machy8 in #108
• Content options tunning by @Machy8 in #115
• Try to find ts and js config by default by @Machy8 in #116
• Tunning by @Machy8 in #119
• The more tags, more adidbugs by @Machy8 in #120

Full Changelog: https://github.com/stylify/packages/compare/v0.0.16...v0.1.0

What's Changed

• Fixes from by @Machy8 in #101

Full Changelog: https://github.com/stylify/packages/compare/v0.0.15...v0.0.16

Fixed bug in the compilation result: unwanted comonents list reset

Full Changelog: https://github.com/stylify/packages/compare/v0.0.14...v0.0.15

What's Changed

• Nuxt and unplugin packages fixes by @Machy8 in #94
• Bugfix: Allow components reconfiguration in bundler watch mode by @Machy8 in #95
• Config definitions by @Machy8 in #96
• Rename StylifyUnplugin to unplugin and export plugin types separately by @Machy8 in #97
• Ignored elements renamed to ignoredAreas and it's a reg exp now instead of a string by @Machy8 in #98
• Content options tunning by @Machy8 in #99

Features and tunning

• Nuxt, Nuxt Module, Bundler and Unplugin have defineConfig method
• Unplugin has export for each plugin like. Instead of unplugin.rollupPlugin the rollupPlugin can be imported
• Content options can now contain brackets. The syntax is changes to @stylify-<option><content>/@stylify-<option>
• Content option for components can now have syntax as javascript object instead of the json syntax

Full Changelog: https://github.com/stylify/packages/compare/v0.0.13...v0.0.14

What's Changed

• numbered breakpoints fix by @JirakLu in #88
• @stylify/nuxt, @stylify/nuxt-module, @stylify/unplugin by @Machy8 in #85
• Update versions to 0.0.13 by @Machy8 in #93

Full Changelog: https://github.com/stylify/packages/compare/v0.0.12...v0.0.13

What's Changed

• Bundler tunning by @Machy8 in #82

Full Changelog: https://github.com/stylify/packages/compare/v0.0.11...v0.0.12

What's Changed

• A few fixes by @Machy8 in #80

Full Changelog: https://github.com/stylify/packages/compare/v0.0.10...v0.0.11

What's Changed

• Ignored elements are now internal and matched only without attributes. Only stylify-ignore and stylify-runtime-ignore is matched by default

Full Changelog: https://github.com/stylify/packages/compare/v0.0.9...v0.0.10

What's Changed

• Bundler hooks tunning by @Machy8 in #75

Full Changelog: https://github.com/stylify/packages/compare/v0.0.8...v0.0.9

What's Changed

• Single letter selectors by @Machy8 in #73
• Various bugs fixed

Full Changelog: https://github.com/stylify/packages/compare/v0.0.7...v0.0.8

What's Changed

• Readme-img-fix by @JirakLu in #69
• Vendor prefixes by @Machy8 in #70

Full Changelog: https://github.com/stylify/packages/compare/v0.0.6...v0.0.7

• Fixed: Do not watch bundler config when non is specified Full Changelog: https://github.com/stylify/packages/compare/v0.0.5...v0.0.6

What's Changed

• Multiple components inside key by @JirakLu in #68
• Fixed multiple bundler runs when watching files
• Fixed versions in generated files
• Fixed missing esm for in distributed files
• Fixed typos
• Better logs in bundler
• Fixed bundler config reload
• Bundles can be configured directly when creating a new Bundler instance

Full Changelog: https://github.com/stylify/packages/compare/v0.0.4...v0.0.5

What's Changed

• Added cross-env for windows support. by @JirakLu in #66
• Fix rollup build on windows by @Machy8 in #65
• Multiple fixes by @Machy8 in #67

Full Changelog: https://github.com/stylify/packages/compare/v0.0.3...v0.0.4

Stylify

• replaceVariablesByCssVariables: Css variables can be used instead of fixed variables: color:$blue => .color\:\$blue { color: var(--blue) }.
• Better error when variable is missing
• root is used instead of html as a target element for CSS variables
• Undefined window is now fixed in runtime

Bundler

• Non unix paths are now normalized
• Information about created variables file is logged now
• Infinite loop in watch mode is fixed
• Bundle specific configuration is allowed by adding compilerConfig to bundle config.

Nuxt module

• Fixed: Profiler info is not dumped in production

Other

• Fixed watch mode in profiler build
• Removed unnecessary files from tarballs

Initial release 🎉