# jigsass-tools-bidi > Painless bidirectional style authoring Latest version **1.1.6** (published 2016-04-22) · MIT license · 0 weekly downloads ## Install ```sh npm install jigsass-tools-bidi pnpm add jigsass-tools-bidi yarn add jigsass-tools-bidi bun add jigsass-tools-bidi ``` ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 1.1.6 | | Published | 2016-04-22 | | First published | 2016-03-27 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 4 | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 0 | | Author | TxHawks | | Maintainers | txhawks | | Keywords | jigsass, sass, scss, css, oocss, atomic css, eyeglass-module | ## Links - npm: https://www.npmjs.com/package/jigsass-tools-bidi - Repository: https://github.com/txhawks/jigsass-tools-bidi - Homepage: https://github.com/txhawks/jigsass-tools-bidi#readme - npm.io page: https://npm.io/package/jigsass-tools-bidi ## Dependencies (4) - [jigsass-tools-mq](https://npm.io/package/jigsass-tools-mq.md) ^1.4.5 - [jigsass-tools-maps](https://npm.io/package/jigsass-tools-maps.md) ^1.0.8 - [jigsass-tools-strings](https://npm.io/package/jigsass-tools-strings.md) ^1.3.1 - [jigsass-tools-typography](https://npm.io/package/jigsass-tools-typography.md) ^1.2.2 ## Alternatives - [style-dictionary](https://npm.io/package/style-dictionary.md) — 2.0M weekly downloads - [postcss-merge-idents](https://npm.io/package/postcss-merge-idents.md) — 1.7M weekly downloads - [@fontsource/noto-sans](https://npm.io/package/@fontsource/noto-sans.md) — 93.0K weekly downloads - [uglifycss](https://npm.io/package/uglifycss.md) — 71.6K weekly downloads - [mat4-interpolate](https://npm.io/package/mat4-interpolate.md) — 23.3K weekly downloads ## Recent versions - 1.1.6 (latest) — 2016-04-22 - 1.1.5 — 2016-04-21 - 1.1.4 — 2016-04-12 - 1.1.3 — 2016-04-10 - 1.1.2 — 2016-04-08 - 1.1.1 — 2016-04-02 - 1.1.0 — 2016-03-30 - 1.0.0 — 2016-03-27 ## README # JigSass Tools Bidi [![NPM version][npm-image]][npm-url] [![Build Status][travis-image]][travis-url] [![Dependency Status][daviddm-image]][daviddm-url] > Painless bidirectional style authoring ## Installation Using npm: ```sh npm i -S jigsass-tools-bidi ``` ## Usage ```scss @import 'path/to/jigsass-tools-bidi/scss/index'; ``` Managing bi-directionality in CSS can be an annoying, time consuming and error-prone task. JigSass Bidi was written to make this process as simple as possible, without sacrificing flxibilty. It eases the process of writing clean and maintainable bidirectional style sheets by using a single mixin to handle transformation of all direction-related styles (values and/or properties) by automatically interpreting directions as `start`\`end` instead of `left`\`right`. ### Configuration JigSass Bidi has only two configuration variables: - `$jigsass-direction`, which can be set to either `ltr` (default) or `rtl`. JigSass Bidi will determine how to interpert what `start`/`end` means, and transform values accordingly [documentation](https://txhawks.github.io/jigsass-tools-bidi/#variable-jigsass-direction). - $jigsass-bidi-rem-default, which determines if pixel values should be automatically converted into `rem` unit. This setting can be overriden individually at every call to the `jigsass-bidi` mixin by passing `true` or `false` to the `$rem` argument [(documentation)](https://txhawks.github.io/jigsass-tools-bidi/#variable-jigsass-bidi-rem-default). ### Mixins - `jigsass-bidi`
takes 4 arguments: `$property`, `$values`, `$bps` and `$rem` [(documentation)](https://txhawks.github.io/jigsass-tools-bidi/#mixin-jigsass-bidi). - `jigsass-bidi-direction`
Temporarily set the direction for the context of the mixin's execution [(documentation)](https://txhawks.github.io/jigsass-tools-bidi/#mixin-jigsass-bidi-direction). ### Caveats - The `background` shorthand is not supported. Set the `background-image` and `background-position` properties directly. - When multi-dimensional lists are passsed to to `$values` argument (e.g., to border-radius, box-shadow, text-shadow or background-position), They should be passed as space separated lists inside a comma-separated list. - The `X` argument of `backgrond-position` and `transform-origin` can be transformed only if set to `start`, `end` or a number in percentage (`%`). transforming non-relative widths requires knowledge of the container's dimensions. ## Development It is a best practice for JigSass modules to *not* automatically generate css on `@import`, but rather have to user explicitly enable the generation of specific styles from the module. Contributions in the form of pull-requests, issues, bug reports, etc. are welcome. Please feel free to fork, hack or modify JigSass Tools Bidi in any way you see fit. #### Writing documentation Good documentation is crucial for scalability and maintainability. When contributing, please do make sure that all Sass functionality (functions, mixins, variables and placeholder selectors) is well documented. Documentation is auto-generated using [SassDoc](http://sassdoc.com/) #### Running tests `gulp lint` will, well, lint the contents scss files in the `scss` directory. `gulp test` with run module's test using Mocha and Sassaby. `gulp tdd` will watch both the Sass files and the test specs for changes, and will run tests automatically upon them. #### Writing tests JigSass Tools Bidi tests are written using [Sassaby](https://github.com/ryanbahniuk/sassaby) and Mocha. Spec files are located in the `test` directory. Mocha allows us to place a call to `before()` in the root of any test file and it will be run once, before all the other tests in every `test_*.js` file. We can also `require()` files and assign them to the global object to make them available to all `test_*.js` files. jigsass-tools-bidi uses a file called `helper.js` can be used to set up mocha globals requires and `before()`. In addition to Sassaby's testing functions, jigsass-tools-bidi makes a few Sass functions available to the test suite, for use inside Sassaby tests:
jig-var-equals($value, $var) -> {boolean}
Check if a variable equals a value.
$value {*}: A value to compare the value of $var to.
$var {*}: The variable to test
jig-var-type-is($type, $var) -> {boolean}
Check if a variable is of a certain type.
$type {string}: A type to compare with the type of $var.
$var {*}: The variable to test
jig-map-key-equals($value, $map, $keys...) -> {boolean}
Check if a map's key is assigned a cerain value.
$value {*}: A value to compare the value of a key in $map with.
$map {map}: The map to test.
$keys... {arglist}: A recursive chain of keys.
jig-map-key-type-is($type, $map, keys...) -> {boolean}
Check if a map's key is of a certain type
$type {string}: A type to compare with the type of $var.
$map {map}: The map to test.
$keys... {arglist}: A recursive chain of keys.
## File structure ```bash ┬ ./ │ ├─┬ scss/ │ └─ index.scss # The module's importable file. │ ├── sassdoc/ # Generated documentation │ # of the module's sass features │ └─┬─ test/ │ ├─┬ helpers/ │ │ │ ├── importer.scss # Used for easilty importing tested scss files │ │ │ └── _test_helpers.scss # JigSass's assertion helpers, │ # for use inside Sassaby tests. │ ├── helper.js # Used for defining global `before()` │ # functions and requiring modules. │ └── test_jigsass-tools-bidi # Specs. Mocha will automatically # run all javascript files located # in the `test` directory. ``` **License:** MIT [npm-image]: https://badge.fury.io/js/jigsass-tools-bidi.svg [npm-url]: https://npmjs.org/package/jigsass-tools-bidi [travis-image]: https://travis-ci.org/TxHawks/jigsass-tools-bidi.svg?branch=master [travis-url]: https://travis-ci.org/TxHawks/jigsass-tools-bidi [daviddm-image]: https://david-dm.org/TxHawks/jigsass-tools-bidi.svg?theme=shields.io [daviddm-url]: https://david-dm.org/TxHawks/jigsass-tools-bidi --- _Source: https://npm.io/package/jigsass-tools-bidi · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._