Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vsm/string-style-html
Converts a string and a style-instructions string to HTML
https://github.com/vsm/string-style-html
Last synced: 20 days ago
JSON representation
Converts a string and a style-instructions string to HTML
- Host: GitHub
- URL: https://github.com/vsm/string-style-html
- Owner: vsm
- License: agpl-3.0
- Created: 2018-04-24T15:11:19.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2022-02-11T00:28:23.000Z (almost 3 years ago)
- Last Synced: 2024-11-19T10:56:28.747Z (about 1 month ago)
- Language: JavaScript
- Size: 67.4 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# string-style-html
Converts a **string** and a simple '**style**'-instructions string,
to **HTML** code that has styling tags inserted.
It also HTML-encodes any `&`, `<`, and `>` characters in the string,
so they don't interfere with any inserted style tags.
This functionality is used by both
[`vsm-autocomplete`](https://github.com/vsm/vsm-autocomplete) and
[`vsm-box`](https://github.com/vsm/vsm-box).
## Specification
This package provides a function `f(str, style, extraContent)`.
All arguments are Strings, and the last two are optional.
- If `style` is not given, or a not String, or `''`,
then it returns `str` unchanged.
+ E.g. `f('abcd', '')` returns `'abcd'`.
- If `style` is a String that contains a `'<'`, then it is supposed to hold
a styled version of `str`, with HTML-tags already inserted.
In this case it returns `style`.
+ E.g. `f('abcd', 'abcd')` returns `'abcd'`.
- Else it returns `str`, with HTML styling tags inserted:
- If `style` is the single character `'i'`, `'b'`, `'s'`, or `'u'`, then
it applies the italic, bold, subscript, or superscript style resp.,
to the entire string.
+ E.g. `f('abcd', 'i')` returns `'abcd'`.
- `style` can also include a range '{startIndex}-{stopIndex}' that says
which part of the string should be styled.
E.g. `'i0-3'` applies italic to the first three characters of `str`.
Indexes count from 0, and `stopIndex` is the location just before where
styling stops.
+ E.g. `f('abcd', 'i1-3')` returns `'abcd'`.
- `style` can also include a single index for a one-character range.
+ E.g. `f('abcd', 'i2')` returns `'abcd'`.
- `style` can include multiple styling instructions, separated by a `;`.
(Note: overlapping ranges are handled correctly, see
[index.test.js](src/index.test.js)).
+ E.g. `f('abcd', 'i1;u2-4')`
returns `'abcd'`.
- It html-encodes `<`, `>`, and `&` (also if no `style` is given).
+ E.g. `f('', 'b2')`
returns `'<b&d>'`.
- If given an `extraContent` argument,
it adds that extra content to inserted opening-tags.
+ E.g. `f('abc', 'i', 'style="pointer-events: none;"')` returns
`'abc'`.
## Example Use
```
const stringStyleHtml = require('string-style-html');
console.dir( stringStyleHtml('cdc2', 'i') );
// => 'cdc2'.
console.dir( stringStyleHtml('Ca2+', 'u2-4') );
// => 'Ca2+'.
console.dir( stringStyleHtml('HCO3-', 's3;u4') );
// =>'HCO3-'.
console.dir( stringStyleHtml('abc', 'abc') );
// =>'abc'.
```
## License
This project is licensed under the AGPL license - see [LICENSE.md](LICENSE.md).