{"id":16395884,"url":"https://github.com/wallpants/pantsdown","last_synced_at":"2025-03-21T02:32:27.837Z","repository":{"id":199907987,"uuid":"703684408","full_name":"wallpants/pantsdown","owner":"wallpants","description":"Markdown to \"GitHub HTML\" parser","archived":false,"fork":false,"pushed_at":"2025-03-01T03:48:30.000Z","size":1282,"stargazers_count":5,"open_issues_count":5,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-15T11:50:25.730Z","etag":null,"topics":["bun","css","gfm","html","markdown","parser","renderer","typescript","vite"],"latest_commit_sha":null,"homepage":"https://wallpants.github.io/pantsdown/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/wallpants.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-10-11T17:48:10.000Z","updated_at":"2025-01-25T07:04:42.000Z","dependencies_parsed_at":"2023-10-16T12:28:14.268Z","dependency_job_id":"c4c4bcd7-83d7-4a69-8247-a5cbfadaf4ee","html_url":"https://github.com/wallpants/pantsdown","commit_stats":null,"previous_names":["wallpants/pantsdown"],"tags_count":48,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wallpants%2Fpantsdown","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wallpants%2Fpantsdown/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wallpants%2Fpantsdown/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wallpants%2Fpantsdown/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/wallpants","download_url":"https://codeload.github.com/wallpants/pantsdown/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244102760,"owners_count":20398386,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["bun","css","gfm","html","markdown","parser","renderer","typescript","vite"],"created_at":"2024-10-11T05:05:52.942Z","updated_at":"2025-03-21T02:32:27.449Z","avatar_url":"https://github.com/wallpants.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Pantsdown\n\n\u003cimg src=\"https://raw.githubusercontent.com/wallpants/pantsdown/main/docs/github.svg\" height=\"60px\" align=\"right\" /\u003e\n\u003cimg src=\"https://raw.githubusercontent.com/wallpants/pantsdown/main/docs/markdown.svg\" height=\"60px\" align=\"right\" /\u003e\n\nPantsdown is a **Markdown** to **HTML** converter. It attempts to render markdown similar to how GitHub does it plus\nsome features developed specifically for [github-preview.nvim](https://github.com/wallpants/github-preview.nvim).\n\n## [▶️ Demo](https://wallpants.github.io/pantsdown/)\n\n## 📦 Installation\n\nThis package is distributed only as a TypeScript module.\nThis means you'll need a bundler to handle transpilation.\nSee below for usage examples.\n\n```sh\n# bun\nbun install pantsdown\n# npm\nnpm install pantsdown\n```\n\n## 💻 Usage\n\n🚨 Pantsdown does not sanitize the output HTML. If you are processing potentially unsafe strings,\nit's recommended you use a sanitization library like [DOMPurify](https://github.com/cure53/DOMPurify).\n\n### Styles\n\nFor styles to be properly applied, either the element containing the generated html or one of its parents\nmust have the classes `class=\"pantsdown light\"` or `class=\"pantsdown dark\"` added. You can also add\nthe class `\"high-contrast\"` to enable high-contrast themes `class=\"pantsdown dark high-contrast\"` or\n`class=\"pantsdown light high-contrast\"`.\n\n### [Bun](https://bun.sh/)\n\nTake a look at [how Pantsdown's demo is built](https://github.com/wallpants/pantsdown/blob/main/docs/build.ts)\nfor a very simple usage example with Bun.\n\n### [Vite](https://vitejs.dev/guide/#scaffolding-your-first-vite-project)\n\nCreate a Vite Project \u0026 install dependencies:\n\n```sh\nbun create vite my-app --template react-swc-ts\ncd my-app\nbun install pantsdown\n```\n\nRemove CSS from `my-app/src/main.tsx`:\n\n```diff\nimport React from 'react'\nimport ReactDOM from 'react-dom/client'\nimport App from './App.tsx'\n- import './index.css'\n\nReactDOM.createRoot(document.getElementById('root')!).render(\n  \u003cReact.StrictMode\u003e\n    \u003cApp /\u003e\n  \u003c/React.StrictMode\u003e,\n)\n```\n\nReplace content in `my-app/src/App.tsx`:\n\n```tsx\nimport { Pantsdown } from \"pantsdown\";\nimport \"pantsdown/styles.css\";\nimport { useEffect } from \"react\";\n\nconst pantsdown = new Pantsdown();\n\nfunction App() {\n  useEffect(() =\u003e {\n    const container = document.getElementById(\"markdown-container\");\n    if (!container) return;\n\n    const markdown = \"# Hello world\\n- [ ] Task 1\\n- [x] Task 2\";\n    const { html, javascript } = pantsdown.parse(markdown);\n    container.innerHTML = html;\n\n    const newScript = document.createElement(\"script\");\n    newScript.text = javascript;\n    container.appendChild(newScript);\n  }, []);\n\n  // ⚠️ for styles to be applied, a parent element must have\n  // the classes \"pantsdown light\" or \"pantsdown dark\" added\n  return \u003cdiv id=\"markdown-container\" className=\"pantsdown light\" /\u003e;\n}\n\nexport default App;\n```\n\n## ⚙️ Configuration\n\nThe Pantsdown constructor accepts an optional configuration object.\nIf you\n\n```typescript\nimport { Pantsdown, type PartialPantsdownConfig } from \"pantsdown\";\n\n// This is the default config object. If you provide\n// a config object, it will be deeply merged into this.\nconst config: PartialPantsdownConfig = {\n  renderer: {\n    /**\n     * Prefix to be added to relative image sources.\n     * Must start and end with \"/\"\n     *\n     * @example\n     * relativeImageUrlPrefix: \"/__localimage__/\"\n     *\n     * ![image](./wallpants-512.png)\n     * relative src is updated and results in:\n     * \u003cimg src=\"/__localimage__/wallpants-512.png\" /\u003e\n     *\n     * ![image](https://avatars.githubusercontent.com/wallpants)\n     * absolute src remains unchanged:\n     * \u003cimg src=\"https://avatars.githubusercontent.com/wallpants\" /\u003e\n     */\n    relativeImageUrlPrefix: \"\",\n\n    /**\n     * Whether to render \u003cdetails\u003e html tags with attribute open=\"\"\n     *\n     * @default\n     * false\n     */\n    detailsTagDefaultOpen: false,\n  },\n};\n\nconst pantsdown = new Pantsdown(config);\nconst html = pantsdown.parse(markdown);\n\nconsole.log(html);\n```\n\n## 🤝 Acknowledgements\n\n\u003ca href=\"https://marked.js.org\"\u003e\n  \u003cimg width=\"60px\" height=\"60px\" src=\"https://marked.js.org/img/logo-black.svg\" align=\"right\" /\u003e\n\u003c/a\u003e\n\nPantsdown is based on [Marked](https://github.com/markedjs/marked). Without their hard work,\nPantsdown would not exist.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwallpants%2Fpantsdown","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwallpants%2Fpantsdown","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwallpants%2Fpantsdown/lists"}