sham-ui-macro


Babel macros for sham-ui.

$3

Install from yarn:
yarn add sham-ui-macro --dev

And add babel-macros plugin to your babel config.

$3

Add to to package.json

- for app for dev envrimonent

``json
"babelMacros": {
"ref": {
"uniq": false,
"enabled": true
}
}
`

- for app for prod envrimonent

`json
"babelMacros": {
"ref": {
"uniq": true,
"enabled": true
}
}
`

- for library

`json
"babelMacros": {
"ref": {
"enabled": false
}
}
`

$3

##### Table of Contents

- inject
- Parameters
- Examples
- $
- Parameters
- Examples
- this$
- Parameters
- Examples

#### inject

Macro for DI.resolve

##### Parameters

- name string? Name of injected item

##### Examples

`javascript
import { inject } from 'sham-ui-macro/inject.macro';
class Service {
@inject api;
@inject( 'sham-ui:store' ) uiStore;
}


// ↓ ↓ ↓ ↓ ↓ ↓

class Service {
get api() {
return this.DI.resolve('api');
}

get uiStore() {
return this.DI.resolve('sham-ui:store');
}

}
`

#### $

Macro for get/generate uniq reference

##### Parameters

- name (string \| Object)? Name of reference or object for processing

##### Examples

`javascript
// Config in package.json
// "babelMacros": {
// "ref": {
// "enabled": true,
// "uniq": true
// }
// }

import { $ } from 'sham-ui-macro/ref.macro';

const firstName = $();
const lastName = $.lastName;
const state = {
[ firstName ]: 'John',
[ lastName ]: 'Smith'
}
const fullName = state[ $( 'firstName' ) ] + state[ $.lastName ];
const user = $( { firstName: 'John', lastName: 'Smith' } );

// ↓ ↓ ↓ ↓ ↓ ↓

const firstName = 0;
const lastName = 1;
const state = {
[ firstName ]: 'John',
[ lastName ]: 'Smith'
}
const fullName = state[ 0 ] + state[ 1 ];
const user = { 0: 'John', 1: 'Smith' };
`

#### this$

Sugar for $ macro. Translate this$.foo to analog this[ $.foo ]

##### Parameters

- name string? Name of reference

##### Examples

`javascript
// Config in package.json
// "babelMacros": {
// "ref": {
// "enabled": true,
// "uniq": true
// }
// }

import { this$ } from 'sham-ui-macro/ref.macro';

this$.handleClick = e => { };

// ↓ ↓ ↓ ↓ ↓ ↓

this[ 0 ] = e => {};
``