How to only select regular list item and not task list item?

[ooker777]

To select only listItem, I use:

import {fromMarkdown} from 'mdast-util-from-markdown'
import {inspect} from 'unist-util-inspect'
import {selectAll} from 'unist-util-select'
import {gfm} from 'micromark-extension-gfm'
import {gfmFromMarkdown, gfmToMarkdown} from 'mdast-util-gfm'

const doc = `
## List 
- One
- Two 
## Tasklist
* [ ] to do
* [x] done
`
const tree = fromMarkdown(doc, {
  extensions: [gfm()],
  mdastExtensions: [gfmFromMarkdown()]
})

const listItems = selectAll("listItem", tree)
console.log(inspect(listItems))

The output:

├─0 listItem[1] (3:1-3:6, 10-15)
│   │ spread: false
│   │ checked: null
│   └─0 paragraph[1] (3:3-3:6, 12-15)
│       └─0 text "One" (3:3-3:6, 12-15)
├─1 listItem[1] (4:1-4:7, 16-22)
│   │ spread: false
│   │ checked: null
│   └─0 paragraph[1] (4:3-4:7, 18-22)
│       └─0 text "Two" (4:3-4:6, 18-21)
├─2 listItem[1] (6:1-6:12, 35-46)
│   │ spread: false
│   │ checked: false
│   └─0 paragraph[1] (6:7-6:12, 41-46)
│       └─0 text "to do" (6:7-6:12, 41-46)
└─3 listItem[1] (7:1-7:11, 47-57)
    │ spread: false
    │ checked: true
    └─0 paragraph[1] (7:7-7:11, 53-57)
        └─0 text "done" (7:7-7:11, 53-57)

I notice that task list items have boolean checked, while regular list items have null checked. So to select only task list items, I can use:

const taskItems = selectAll("[checked]", tree)

But how can I only select regular list item? Either of these doesn't work:

const regularItems = selectAll("[checked=null]", tree)  // [] 
const regularItems = selectAll(":not([checked])", tree) // select all nodes
const regularItems = filter(listItems, node => node.checked === null) // undefined
const regularItems = filter(listItems, node => node.checked !== true && node.checked !== false) //undefined

I know I can work on the text, but that's cumbersome and defeats the purpose of the AST.

(Also asked on Stack Overflow)

[ChristianMurphy]

Hey again @ooker777! 👋
What you seem to want is tree traversal https://unifiedjs.com/learn/recipe/tree-traversal/
You could also use select or filter, but a visitor pattern will probably be the easiest.
This is also a place where a unified pipeline could simplify the structure a bit.

example of a pipeline that gets list items

import type {Root} from "mdast"
import {remark} from 'remark'
import remarkGfm from 'remark-gfm'
import {visit} from 'unist-util-visit'

const sourceMarkdown = `
## List 
- One
- Two
## Tasklist
* [ ] to do
* [x] done
`

function remarkListPlugin () {
  return (tree: Root) => {
    visit(tree, "listItem", (node) => {
      if (node.checked === null) {
        // Do something with the list item nodes
        console.log(node)
      }
    })
  }
}

try {
  // this renders the source to the page
  document.querySelector('#source')!.textContent = sourceMarkdown

  // this is the transformation pipeline
  const file = await remark()
    .use(remarkGfm)
    .use(remarkListPlugin)
    .process(sourceMarkdown)

  // these render the output to the page
  document.querySelector('#result')!.textContent = String(file)
  document.querySelector('#error')!.textContent = ''
} catch (error) {
  document.querySelector('#error')!.textContent = String(error)
}

runnable example: https://codesandbox.io/p/devbox/remark-with-vite-rh4w48

[ooker777]

why do you want this? Why did you invent this data format?

It's just to have most convenience to write the input. Perhaps there is a better, more standard way but I don't know.

The code data[key] = value, for the input Field 1: value 1, cannot output ["value 1", …

The data of a note will be fill into the data object. Then it will be pushed/flatten to the elements array:

elements.push([data["Field 1"], data["Field 2"], ..., [data["List"][0], data["List"][1], ...], [data["Tasklist"][0], data["Tasklist"][1], ...]])

I don’t understand how Field 1: value 1 turns into value 1. Why drop Field 1? Why store this as an array, where it seems like an object?

It is used in the headers of the table, which is stored in a separate variable. I store this as an array because that how the API I use to render the table requires (dv.table(headers, elements)). But yeah I'm considering not using it anymore and just build the table with HTML.

why do you use obsidian/markdown if you don‘t allow anything from markdown other than paragraphs and lists?

I allow anything, but only need data from tables, lists, tasklists, headings, paragraphs with colons. Other else can be ignored.

I was under the impression that you were the only user, as you know for certain only paragraphs/lists are used, but this point seems to indicate there are many unknown users?

I write it for my needs first, but I will also publish it for other people to use. If they use my plugin they will need to follow my structure I guess?

Do you have an actual real non-abbreviated example of what they write? And can you then, by hand, make the exact non-abbreviated output you want to generate?

Is this what you are looking for? It's all the data for a coffee shop. The header cells of the table are their shop locations. The lists are for their strengths and weaknesses.

Giá nước: 0
Giờ mở cửa: 8:00 - 21:00
Liên hệ: 867990125
Website: [The best cafe](https://tonkin.coffee/aboutbestcoffee/)
Facebook: [Tonkin Specialty Coffee | Ho Chi Minh City | Facebook](https://www.facebook.com/tonkinspecialtycoffee)

| Chi nhánh  | 91 Lý Tự Trọng, Q1                           | 135/50 Trần Hưng Đạo, Q1 |
| ---------- | -------------------------------------------- | ------------------------ |
| Giá giữ xe | 10k                                          | 0                        |
| Số lượng   | 30 người                                     | 10 người                 |
| Ghi chú    | Lối vào nhỏ, dễ khuất, phải nhìn kỹ mới thấy |                          |
| Lưu ý      | Xe lăn không tiếp cận được                   |                          |
| Điểm cộng  | Không gian ngoài trời                        |                          |

## Lưu ý
- Không có loa và mic
- Cần đặt chỗ trước

## Ghi chú
- Chỉ miễn phí với các sự kiện phi lợi nhuận

[wooorm]

Yes. That is exactly what I am looking for. Thank you!
Can you also post the exact output you want? Can you, by hand, copy/paste the parts of that markdown, and make it into a table? How do you want that table to look?

[ooker777]

const data = {
  Name: "Tonkin",
  "Location type": "Quán có phòng riêng",
  "Price": 0,
  "Opening hour": [new Date("8:00"), new Date("21:00")],
  "Contact": "867990125", 
  Website: 'https://tonkin.coffee/aboutbestcoffee/',
  Facebook: "https://www.facebook.com/tonkinspecialtycoffee",
  "Locations": [
    {
      "Address": "91 Lý Tự Trọng, Q1",
      "Parking price": 10000,
      "Quantity": 30,
      "Notes": ["Lối vào nhỏ, dễ khuất, phải nhìn kỹ mới thấy"],
      "Keep in mind": ["Xe lăn không tiếp cận được"],
      "Bonus": ["Không gian ngoài trời"],
    },
    {
      "Address": "135/50 Trần Hưng Đạo, Q1",
      "Parking price": 0,
      "Quantity": 10,
    }
  ],
  "Keep in mind": ["Không có loa và mic", "Cần đặt chỗ trước"],
  "Notes": ["Chỉ miễn phí với các sự kiện phi lợi nhuận"],
}
const headers = ["Name", "Quantity", "Price", "Opening hour", "Keep in mind", "Address", "Bonus" ]
const elements = [
  [
    "Tonkin 1",
    30,
    0,
    [new Date("8:00"), new Date("21:00")],
    ["Xe lăn không tiếp cận được", "Không có loa và mic", "Cần đặt chỗ trước"],
    "91 Lý Tự Trọng, Q1",
    ["Không gian ngoài trời"]  
  ], 
  [
    "Tonkin 2",
    30,
    0,
    [new Date("8:00"), new Date("21:00")],
    ["Không có loa và mic", "Cần đặt chỗ trước"],
    "135/50 Trần Hưng Đạo, Q1",
  ], 
] 

copy/paste the parts of that markdown, and make it into a table

I don't get what parts of that markdown it is, but the output table would be:

Name	Quantity	Price	Opening hour	Keep in mind	Address	Bonus
Tonkin 1	30	0	8:00 - 21:00	Xe lăn không tiếp cận được Không có loa và mic Cần đặt chỗ trước	91 Lý Tự Trọng, Q1	Không gian ngoài trời
Tonkin 2	10	0	8:00 - 21:00	Không có loa và mic Cần đặt chỗ trước	135/50 Trần Hưng Đạo, Q1

[wooorm]

Sorry, but I am looking for input which maps to output.
You gave me input markdown, about water price for example, which is not present in your output.
And your output includes fields such as Name and Website, which do not exist in your input markdown.
Also, beware that new Date("8:00") is not valid. That is broken. I am not sure what you want with that.
Then, your input is Vietnamese, but in JavaScript it is suddenly in English. Where do you imagine this translation to occur?

I am sorry. It is unclear to me how I can help you best. I do not understand what you want.

[ooker777]

Sorry for making the situation more complicated. At the beginning I sent you the Vietnamese markdown input, but after that I think it would be a barrier for you to read my intention. So I translate the keys for you the output. I didn't translate the values, as I think you'd need to compare it to the already given input. In my real case I'll use Vietnamese in both input and output. With you I'll translate both, but if you need the Vietnamese version I'll provide.

Let's just ignore what I send above and use the below instead.

Input

Filepath: Coffee shop with meeting room/Tonkin.md

Price: 0
Opening hour: 8:00 - 21:00
Contact: 867990125
Website: [The best cafe](https://tonkin.coffee/aboutbestcoffee/)
Facebook: [Tonkin Specialty Coffee | Ho Chi Minh City | Facebook](https://www.facebook.com/tonkinspecialtycoffee)

| Locations     | 91 Road A, District 1                                    | 135/50 Street B, District 1 |
| ------------- | -------------------------------------------------------- | --------------------------- |
| Parking price | 10k                                                      | 0                           |
| Quantity      | 30 people                                                | 10 people                   |
| Notes         | Small entry and hidden from view, have to look carefully |                             |
| Keep in mind  | Wheelchair inaccessible                                  |                             |
| Bonus         | Outdoor                                                  |                             |

## Keep in mind
- No speaker and microphone
- Reservation required

## Notes
- Only free for non-profit events

Output

const data = {
  Name: "Tonkin",  // infer from basename
  "Location type": "Coffee shop with meeting room",  // infer from path
  "Price": 0,
  "Opening hour": getOpeningHour("8:00 - 21:00"),  // return's type: [Date, Date] 
  "Contact": "867990125",
  Website: new URL("https://tonkin.coffee/aboutbestcoffee/"),
  Facebook: new URL("https://www.facebook.com/tonkinspecialtycoffee"),
  "Locations": [
    {
      "Address": "91 Road A, District 1",
      "Parking price": 10000,
      "Quantity": 30,
      "Notes": ["Small entry and hidden from view, have to look carefully"],
      "Keep in mind": ["Wheelchair inaccessible"],
      "Bonus": ["Outdoor"],
    },
    {
      "Address": "135/50 Street B, District 1",
      "Parking price": 0,
      "Quantity": 10,
    }
  ],
  "Keep in mind": ["No speaker and microphone", "Reservation required"],
  "Notes": ["Only free for non-profit events"],
} 
// Header values are selected and ordered by users
const headers = ["Name", "Quantity", "Price", "Opening hour", "Keep in mind", "Address", "Bonus"];
const elements = [
  [
    "Tonkin 1",
    30,
    0,
    "8:00 - 21:00",
    ["Wheelchair inaccessible", "No speaker and microphone", "Reservation required"],
    "91 Road A, District 1",
    ["Outdoor"]
  ],
  [
    "Tonkin 2",
    30,
    0,
    "8:00 - 21:00",
    ["No speaker and microphone", "Reservation required"],
    "135/50 Street B, District 1",
  ],
];

Name	Quantity	Price	Opening hour	Keep in mind	Address	Bonus
Tonkin 1	30	0	8:00 - 21:00	Wheelchair inaccessible No speaker and microphone Reservation required	91 Road A, Q1	Outdoor
Tonkin 2	10	0	8:00 - 21:00	No speaker and microphone Reservation required	135/50 Street B, Q1

I hope this is better. Thank you for your patience.