Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Ambiguity with nested lists #32

Closed
arve0 opened this issue Oct 14, 2016 · 1 comment
Closed

Ambiguity with nested lists #32

arve0 opened this issue Oct 14, 2016 · 1 comment

Comments

@arve0
Copy link
Owner

arve0 commented Oct 14, 2016 

- item
  - nested
  {.red}
{.blue}

gives

<ul>
<li>item
<ul class="blue red">
<li>nested</li>
</ul>
</li>
</ul>

and not what one might expect

<ul class="blue">
<li>item
<ul class="red">
<li>nested</li>
</ul>
</li>
</ul>
arve0 added a commit that referenced this issue Aug 5, 2017
@arve0
added test for issue #32
2c8ef7d
@arve0 arve0 mentioned this issue Aug 7, 2017
Merged
@arve0
Copy link
Owner Author

arve0 commented Aug 7, 2017 •
edited
Loading

Syntax will be:

- in end of list item, apply to <li> {.a}
  - also for nested lists {.b}
  - newlines before {curly} will apply to nearest <ul> or <ol>
{.c}

{.d}

to force attributes to outer <ul> or <ol>, add curly by itself on a paragraph below

This gives:

<ul class="d">
<li class="a">in end of list item, apply to &lt;li&gt;
<ul class="c">
<li class="b">also for nested lists</li>
<li>newlines before {curly} will apply to nearest &lt;ul&gt; or &lt;ol&gt;</li>
</ul>
</li>
</ul>
<p>to force attributes to outer &lt;ul&gt; or &lt;ol&gt;, add curly by itself on a paragraph below</p>

I think this should be good enough for most cases, but it's not optimal. markdown-it removes preceding spaces after newline in parsing step, so one need to write a parser-plugin if one would like the format:

- item1 {apply-to=li}
  - item2 {apply-to=nested-li}
  {apply-to=nested-ul} <-- spaces before are removed in parsing, not available in token stream
{apply-to=outer-ul} <-- not possible to distinguish indentation difference from above in token stream

Complete token stream of last example:

[
  {
    "type": "bullet_list_open",
    "tag": "ul",
    "attrs": null,
    "map": [
      0,
      4
    ],
    "nesting": 1,
    "level": 0,
    "children": null,
    "content": "",
    "markup": "-",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": false
  },
  {
    "type": "list_item_open",
    "tag": "li",
    "attrs": null,
    "map": [
      0,
      4
    ],
    "nesting": 1,
    "level": 1,
    "children": null,
    "content": "",
    "markup": "-",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": false
  },
  {
    "type": "paragraph_open",
    "tag": "p",
    "attrs": null,
    "map": [
      0,
      1
    ],
    "nesting": 1,
    "level": 2,
    "children": null,
    "content": "",
    "markup": "",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": true
  },
  {
    "type": "inline",
    "tag": "",
    "attrs": null,
    "map": [
      0,
      1
    ],
    "nesting": 0,
    "level": 3,
    "children": [
      {
        "type": "text",
        "tag": "",
        "attrs": null,
        "map": null,
        "nesting": 0,
        "level": 0,
        "children": null,
        "content": "item1 {apply-to=li}",
        "markup": "",
        "info": "",
        "meta": null,
        "block": false,
        "hidden": false
      }
    ],
    "content": "item1 {apply-to=li}",
    "markup": "",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": false
  },
  {
    "type": "paragraph_close",
    "tag": "p",
    "attrs": null,
    "map": null,
    "nesting": -1,
    "level": 2,
    "children": null,
    "content": "",
    "markup": "",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": true
  },
  {
    "type": "bullet_list_open",
    "tag": "ul",
    "attrs": null,
    "map": [
      1,
      4
    ],
    "nesting": 1,
    "level": 2,
    "children": null,
    "content": "",
    "markup": "-",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": false
  },
  {
    "type": "list_item_open",
    "tag": "li",
    "attrs": null,
    "map": [
      1,
      4
    ],
    "nesting": 1,
    "level": 3,
    "children": null,
    "content": "",
    "markup": "-",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": false
  },
  {
    "type": "paragraph_open",
    "tag": "p",
    "attrs": null,
    "map": [
      1,
      4
    ],
    "nesting": 1,
    "level": 4,
    "children": null,
    "content": "",
    "markup": "",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": true
  },
  {
    "type": "inline",
    "tag": "",
    "attrs": null,
    "map": [
      1,
      4
    ],
    "nesting": 0,
    "level": 5,
    "children": [
      {
        "type": "text",
        "tag": "",
        "attrs": null,
        "map": null,
        "nesting": 0,
        "level": 0,
        "children": null,
        "content": "item2 {apply-to=nested-li}",
        "markup": "",
        "info": "",
        "meta": null,
        "block": false,
        "hidden": false
      },
      {
        "type": "softbreak",
        "tag": "br",
        "attrs": null,
        "map": null,
        "nesting": 0,
        "level": 0,
        "children": null,
        "content": "",
        "markup": "",
        "info": "",
        "meta": null,
        "block": false,
        "hidden": false
      },
      {
        "type": "text",
        "tag": "",
        "attrs": null,
        "map": null,
        "nesting": 0,
        "level": 0,
        "children": null,
        "content": "{apply-to=nested-ul}",
        "markup": "",
        "info": "",
        "meta": null,
        "block": false,
        "hidden": false
      },
      {
        "type": "softbreak",
        "tag": "br",
        "attrs": null,
        "map": null,
        "nesting": 0,
        "level": 0,
        "children": null,
        "content": "",
        "markup": "",
        "info": "",
        "meta": null,
        "block": false,
        "hidden": false
      },
      {
        "type": "text",
        "tag": "",
        "attrs": null,
        "map": null,
        "nesting": 0,
        "level": 0,
        "children": null,
        "content": "{apply-to=outer-ul}",
        "markup": "",
        "info": "",
        "meta": null,
        "block": false,
        "hidden": false
      }
    ],
    "content": "item2 {apply-to=nested-li}\n{apply-to=nested-ul}\n{apply-to=outer-ul}",
    "markup": "",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": false
  },
  {
    "type": "paragraph_close",
    "tag": "p",
    "attrs": null,
    "map": null,
    "nesting": -1,
    "level": 4,
    "children": null,
    "content": "",
    "markup": "",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": true
  },
  {
    "type": "list_item_close",
    "tag": "li",
    "attrs": null,
    "map": null,
    "nesting": -1,
    "level": 3,
    "children": null,
    "content": "",
    "markup": "-",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": false
  },
  {
    "type": "bullet_list_close",
    "tag": "ul",
    "attrs": null,
    "map": null,
    "nesting": -1,
    "level": 2,
    "children": null,
    "content": "",
    "markup": "-",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": false
  },
  {
    "type": "list_item_close",
    "tag": "li",
    "attrs": null,
    "map": null,
    "nesting": -1,
    "level": 1,
    "children": null,
    "content": "",
    "markup": "-",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": false
  },
  {
    "type": "bullet_list_close",
    "tag": "ul",
    "attrs": null,
    "map": null,
    "nesting": -1,
    "level": 0,
    "children": null,
    "content": "",
    "markup": "-",
    "info": "",
    "meta": null,
    "block": true,
    "hidden": false
  }
]

arve0 added a commit that referenced this issue Aug 7, 2017
@arve0
rewrite logic as patterns and transforms (#42)
f5c6e81 
* added test for issue #32

* rewrite logic as patterns and transforms

The logic works like this:

1. Try matching pattern to token stream.
2. If pattern matches, run `pattern.transform`.
3. `pattern.transform` finds attributes and alters token stream accordingly.

A patterns consist of several tests. Each test must contain either
`shift` or `position`. For each token, tests of all patterns are rerun, such
that you can match which tokens follow each other in the token stream.

Example:

```js
{
  /**
   * | h1 |
   * | -- |
   * | c1 |
   * {.c}
   */
  name: 'tables',
  tests: [
    {
      shift: 0,
      type: 'table_close'
    }, {
      shift: 1,
      type: 'paragraph_open'
    }, {
      shift: 2,
      type: 'inline',
      content: utils.hasCurly('only')
    }
  ],...
```

The pattern above will match the token stream if
1. current token is of type table_close
2. the next token is a paragraph_open
3. the token after paragraph_open is of type inline
4. and it has content with curly

One may also specify patterns of children:
```js
    /**
     * - item
     * {.a}
     */
    name: 'list softbreak',
    tests: [
      {
        shift: -2,
        type: 'list_item_open'
      }, {
        shift: 0,
        type: 'inline',
        children: [
          {
            position: -2,
            type: 'softbreak'
          }, {
            position: -1,
            content: utils.hasCurly('only')
          }
        ]
      }
    ],...
```

The children pattern is similar as previous example, but uses `position`
here instead of `shift`. This makes it easy to specify last token (position: -1).

A transform is usually something like this:
1. get attributes
2. find correct token where attributes should be set
3. set attributes
4. remove curly from output

Example:
```js
transform: (tokens, i) => {
  let token = tokens[i];
  let start = token.info.lastIndexOf('{');
  let attrs = utils.getAttrs(token.info, start);
  utils.addAttrs(attrs, token);
  token.info = utils.removeCurly(token.info);
}
```

Note that keys in tests may be:

1. boolean | number | string: strict compare with token
2. function: function is called with token[key], should return true or false
3. array of functions: same as above, but all functions are called
4. array of tests: only for the key `children`, same as a token test,
   but will loop childrens of token, note that token should then be of type 'inline'

* update readme

* add issue template
@arve0 arve0 closed this as completed Aug 7, 2017
@jrchudy jrchudy mentioned this issue Jul 5, 2018
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@arve0