# 11. __Versioning__

[![+Professional Support](https://www.totaljs.com/img/badge-support.svg)](https://www.totaljs.com/support/) [![+Chat with contributors](https://www.totaljs.com/img/badge-chat.svg)](https://messenger.totaljs.com)

`+v14.0.0` jComponent supports versioning of components. In other words: you can provide multiple same components with different versions.

- [Browse CDN versions](http://cdn.componentator.com/)
- jComponent downloads specific version automatically if it's missing

## Specifying a component version

```javascript
// COMPONENT('name@VERSION', ...)

COMPONENT('textbox', function(self, config) {
	self.make = function() {
		console.log('textbox');
	};
});

COMPONENT('textbox@1', function(self, config) {
	self.make = function() {
		console.log('textbox v1');
	};
});

COMPONENT('textbox@2', function(self, config) {
	self.make = function() {
		console.log('textbox v2');
	};
});
```

__Multiple versions in the one component__:

```javascript
COMPONENT('textbox, textbox@1, textbox@2', function(self, config) {
	self.make = function() {
		console.log('3 versions of textbox');
	};
});
```

### Usage in HTML

```html
<!-- MAIN VERSION -->
<div data-jc="textbox"></div>

<!-- VERSION 1 -->
<div data-jc="textbox@1"></div>

<!-- VERSION 2 -->
<div data-jc="textbox@2"></div>

<script>
	// Travelsing for all version
	SETTER('textbox', 'setter', 'test');

	// Travelsing for version 1
	SETTER('textbox@1', 'setter', 'test');

	// Travelsing for version 2
	SETTER('textbox@2', 'setter', 'test');
</script>
```

## Good to know

jComponent brings great new features for versioning. You can define same components with different functionality.

### Set a default version for all components

This version will be applied for all components which don't have added specific version manually.

```javascript
DEF.version = '1';
// {String} Sets the default version for all components
// Default: empty
```

### Set a default version for specific components

This version will be applied for all components which don't have added specific version manually.

```javascript
VERSION('textbox@1', 'dropdown@3', 'textarea@2');
```