{"_id":"@_janina/ui","_rev":"2-5bc675e7731b5ed17639773d7ffa6bb2","name":"@_janina/ui","dist-tags":{"latest":"1.0.3"},"versions":{"0.0.1-0":{"name":"@_janina/ui","version":"0.0.1-0","author":{"name":"Janina Wibker"},"license":"MIT","_id":"@_janina/ui@0.0.1-0","maintainers":[{"name":"_janina","email":"me@janina.lol"}],"homepage":"https://github.com/JaninaWibker/docs/tree/main/lib","bugs":{"url":"https://github.com/JaninaWibker/docs/issues"},"dist":{"shasum":"7453241931dbfec3b0ad2d7ce149333faabb42bc","tarball":"https://registry.npmjs.org/@_janina/ui/-/ui-0.0.1-0.tgz","fileCount":30,"integrity":"sha512-sm3aPsOxznZCymxRXZAowoYIEEuBuPABVgjW0j7uZLenVikznJdXN6PqSOAfWNjLGmQVKA4UTbNnR+fnAprFXw==","signatures":[{"sig":"MEQCIFW4i7GJR7wSuJBNHOuY0QBSskKd5pY6FL/Rc5sxTq3yAiA6XwUBV13Kwoc1TEsVXWOipk0VJnkXtdtdRAbNnKIRGA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":43121},"main":"index.ts","gitHead":"25721d863908508b248a0c4a75cefa3e2d99cfc9","scripts":{"dev":"npx tsc --watch","lint":"eslint --ext .ts,.tsx .","build":"npx tsc","ci:publish-preparations":"cp ../LICENSE ."},"_npmUser":{"name":"_janina","email":"me@janina.lol"},"repository":{"url":"git+https://github.com/JaninaWibker/docs.git","type":"git"},"_npmVersion":"10.9.2","description":"A collection of useful UI components for documentation websites","directories":{},"_nodeVersion":"22.14.0","_hasShrinkwrap":false,"devDependencies":{"next":"13.4.12","eslint":"^8.47.0","prettier":"^2.8.8","typescript":"^5.1.6","@twind/core":"^1.1.3","@types/react":"^18.2.20","eslint-plugin-n":"^15.7.0","@types/react-dom":"^18.2.7","eslint-plugin-import":"^2.28.0","eslint-plugin-promise":"^6.1.1","@twind/preset-tailwind":"^1.1.4","eslint-config-prettier":"^8.10.0","eslint-config-standard":"^17.1.0","eslint-plugin-prettier":"^4.2.1","@twind/preset-autoprefix":"^1.0.7","@twind/preset-typography":"^1.0.7","@typescript-eslint/parser":"^5.62.0","@twind/preset-tailwind-forms":"^1.1.2","@typescript-eslint/eslint-plugin":"^5.62.0"},"peerDependencies":{"next":"^13.4.12","react":"^18.2.0","react-dom":"^18.2.0","@twind/core":"^1.1.2","lucide-react":"^0.265.0","@twind/preset-tailwind":"^1.1.2","@twind/preset-autoprefix":"^1.0.6","@twind/preset-typography":"^1.0.6","@twind/preset-tailwind-forms":"^1.1.0"},"_npmOperationalInternal":{"tmp":"tmp/ui_0.0.1-0_1742209326579_0.6758505459118753","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@_janina/ui","version":"1.0.3","description":"A collection of useful UI components for documentation websites","license":"MIT","author":{"name":"Janina Wibker"},"homepage":"https://github.com/JaninaWibker/docs/tree/main/lib","repository":{"type":"git","url":"git+https://github.com/JaninaWibker/docs.git"},"main":"index.ts","scripts":{"build":"npx tsc","dev":"npx tsc --watch","lint":"eslint --ext .ts,.tsx .","ci:publish-preparations":"cp ../LICENSE ."},"devDependencies":{"@twind/core":"^1.1.3","@twind/preset-autoprefix":"^1.0.7","@twind/preset-tailwind":"^1.1.4","@twind/preset-tailwind-forms":"^1.1.2","@twind/preset-typography":"^1.0.7","@types/react":"^18.2.20","@types/react-dom":"^18.2.7","@typescript-eslint/eslint-plugin":"^5.62.0","@typescript-eslint/parser":"^5.62.0","eslint":"^8.47.0","eslint-config-prettier":"^8.10.0","eslint-config-standard":"^17.1.0","eslint-plugin-import":"^2.28.0","eslint-plugin-n":"^15.7.0","eslint-plugin-prettier":"^4.2.1","eslint-plugin-promise":"^6.1.1","next":"13.4.12","prettier":"^2.8.8","typescript":"^5.1.6"},"peerDependencies":{"@twind/core":"^1.1.2","@twind/preset-autoprefix":"^1.0.6","@twind/preset-tailwind":"^1.1.2","@twind/preset-tailwind-forms":"^1.1.0","@twind/preset-typography":"^1.0.6","lucide-react":"^0.265.0","next":"^13.4.12","react":"^18.2.0","react-dom":"^18.2.0"},"_id":"@_janina/ui@1.0.3","gitHead":"2f137a57c318ad95227805be810151d389e526c4","bugs":{"url":"https://github.com/JaninaWibker/docs/issues"},"_nodeVersion":"22.14.0","_npmVersion":"10.9.2","dist":{"integrity":"sha512-ZiTdTsHiDUV6p8HEdUXLCvAuF0ARVvMRRtPnqCseIfm3vkgnpzlMCEy73hK4v+dszNz8piqPP9FsJWG8iw0O+A==","shasum":"7ae129379414d08f96863dbeb03c6b298a734e65","tarball":"https://registry.npmjs.org/@_janina/ui/-/ui-1.0.3.tgz","fileCount":30,"unpackedSize":43119,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDyttrIRmwuHD6Gdo99dcQzEg+/s2x25K5tVKtrMjPq8AIgNIDyVEaG3TK+vlsoYmm8Q4CInmzKifVwiN0UYtqVVoo="}]},"_npmUser":{"name":"_janina","email":"me@janina.lol"},"directories":{},"maintainers":[{"name":"_janina","email":"me@janina.lol"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/ui_1.0.3_1742209622523_0.6399523773019251"},"_hasShrinkwrap":false}},"time":{"created":"2025-03-17T11:02:06.456Z","modified":"2025-03-17T11:07:02.848Z","0.0.1-0":"2025-03-17T11:02:06.801Z","1.0.3":"2025-03-17T11:07:02.704Z"},"bugs":{"url":"https://github.com/JaninaWibker/docs/issues"},"author":{"name":"Janina Wibker"},"license":"MIT","homepage":"https://github.com/JaninaWibker/docs/tree/main/lib","repository":{"type":"git","url":"git+https://github.com/JaninaWibker/docs.git"},"description":"A collection of useful UI components for documentation websites","maintainers":[{"name":"_janina","email":"me@janina.lol"}],"readme":"# Docs ui components\n\nThis is a collection of useful UI components for documentation websites.\nWorks best together with [@_janina/mdx](../mdx).\n\n## Features\n\n- Pure TypeScript, no JS bundle\n- Fancy code blocks\n- Sidebar with headings, etc.\n- Cards\n- A few icons\n- [twind](https://twind.style)\n\n## Usage\n\n1. Install\n2. Add twind dependencies\n3. Set up next to transpile `@_janina/ui`\n4. Configure mdx to use `@_janina/ui`\n5. Initialize twind\n6. Start using the components, icons and hooks\n\n\n**Install**:\n\n```bash\npnpm add @_janina/ui\n```\n\n**Set up next to transpile `@_janina/ui`**:\n\n```js\n// next.config.mjs\nconst nextConfig = {\n  distDir: 'build',\n  reactStrictMode: true,\n  pageExtensions: ['ts', 'tsx', 'mdx'],\n  swcMinify: true,\n  transpilePackages: ['@_janina/ui']\n}\n\nexport default withMDX(nextConfig)\n```\n\n**Add twind dependencies**:\n\n```bash\npnpm add @twind/core @twind/preset-autoprefix @twind/preset-tailwind @twind/preset-tailwind-forms @twind/preset-typography\n```\n\n\n**Configure mdx to use `@_janina/ui`**:\n\n```tsx\n// pages/_app.tsx\nimport { components } from '@_janina/ui/components/native-replacements'\n\n<MDXProvider components={components}>\n  {/* ... */}\n</MDXProvider>\n```\n\n**Initialize twind**:\n\n```tsx\n// pages/_app.tsx\nimport { tw } from '@twind/core'\nimport withNextApp from '@_janina/ui/twind/next/app'\nimport { config } from '@_janina/ui/twind/config'\n\n// ...\n\nexport default withNextApp(config, MyApp)\n```\n\n**Start using the components, icons and hooks**:\n\n```tsx\nimport { Card } from '@_janina/ui'\nimport { Info } from '@_janina/ui/icons'\n\n<Card variant=\"primary\" Icon={Info}>\n  This is some kind of message.\n\n  Some more text.\n</Card>\n```\n","readmeFilename":"readme.md"}