{"_id":"@barddev/honeycomb-svelte","_rev":"2-894a3b2270963f567026e439f897df1c","name":"@barddev/honeycomb-svelte","dist-tags":{"latest":"0.1.1"},"versions":{"0.1.0":{"name":"@barddev/honeycomb-svelte","version":"0.1.0","keywords":["hive","blockchain","svelte","svelte5","components","web3","honeycomb"],"author":{"name":"KKocot"},"license":"MIT","_id":"@barddev/honeycomb-svelte@0.1.0","maintainers":[{"name":"barddev","email":"k.kocot0@gmail.com"}],"homepage":"https://github.com/KKocot/honeycomb#readme","bugs":{"url":"https://github.com/KKocot/honeycomb/issues"},"dist":{"shasum":"f78e1c011e9f24627f32d0fd41ef08d5a1403109","tarball":"https://registry.npmjs.org/@barddev/honeycomb-svelte/-/honeycomb-svelte-0.1.0.tgz","fileCount":44,"integrity":"sha512-RMkdjr7ImIZlsE2w6SxVR83OghGwRwEyU7XbFm1UqpH2SjdK65ljkds28GZtf/3357+GltxBkHzBnafdkm4Umw==","signatures":[{"sig":"MEQCIGqyQBjy1LE5Y5OWcJ//Zm2aU5MQQGKkY4DD/2PBfItDAiAyPROsq8MawRe+3bXC7MckSxNS2F+PpiARJnQMlA0MbQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":144368},"main":"./dist/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","svelte":"./dist/index.js","engines":{"node":">=18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","svelte":"./dist/index.js"},"./plugins":{"import":{"types":"./dist/vite-plugins.d.ts","default":"./dist/vite-plugins.js"}},"./base.css":"./dist/base.css","./theme.css":"./dist/theme.css","./styles.css":"./dist/styles.css"},"gitHead":"11c26a3c33aaf28c4ab5875670b980ad70649b49","scripts":{"dev":"svelte-package -i src -o dist --watch","build":"rm -rf dist && svelte-package -i src -o dist && tsup && bash scripts/build-css.sh","typecheck":"svelte-check --tsconfig ./tsconfig.json","prepublishOnly":"pnpm build"},"_npmUser":{"name":"barddev","email":"k.kocot0@gmail.com"},"repository":{"url":"git+https://github.com/KKocot/honeycomb.git","type":"git","directory":"packages/svelte"},"_npmVersion":"11.8.0","description":"Svelte 5 components for Hive Blockchain applications","directories":{},"sideEffects":["./dist/styles.css","./dist/base.css","./dist/theme.css"],"_nodeVersion":"25.5.0","dependencies":{"zod":"^4.0.0","clsx":"^2.1.1","remarkable":"^2.0.1","sanitize-html":"^2.13.0","@xmldom/xmldom":"^0.8.10","tailwind-merge":"^3.4.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.1","vite":"^7.0.0","svelte":"^5.0.0","typescript":"^5.3.3","@hiveio/wax":"^1.28.4-rc0","svelte-check":"^4.0.0","@tailwindcss/cli":"^4.0.0","@sveltejs/package":"^2.3.0","@kkocot/honeycomb-core":"workspace:*","@kkocot/honeycomb-renderer":"workspace:*","@sveltejs/vite-plugin-svelte":"^5.0.0"},"peerDependencies":{"svelte":">=5.0.0","bits-ui":">=1.0.0","@hiveio/wax":">=1.28.0","tailwindcss":">=4.0.0"},"peerDependenciesMeta":{"bits-ui":{"optional":true},"tailwindcss":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/honeycomb-svelte_0.1.0_1772008298620_0.5889970724141227","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@barddev/honeycomb-svelte","version":"0.1.1","description":"Svelte 5 components for Hive Blockchain applications","keywords":["hive","blockchain","svelte","svelte5","components","web3","honeycomb"],"repository":{"type":"git","url":"git+https://github.com/KKocot/honeycomb.git","directory":"packages/svelte"},"homepage":"https://github.com/KKocot/honeycomb#readme","bugs":{"url":"https://github.com/KKocot/honeycomb/issues"},"publishConfig":{"access":"public"},"license":"MIT","author":{"name":"KKocot"},"type":"module","svelte":"./dist/index.js","main":"./dist/index.js","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"svelte":"./dist/index.js","types":"./dist/index.d.ts","import":"./dist/index.js"},"./styles.css":"./dist/styles.css","./base.css":"./dist/base.css","./theme.css":"./dist/theme.css","./plugins":{"import":{"types":"./dist/vite-plugins.d.ts","default":"./dist/vite-plugins.js"}}},"sideEffects":["./dist/styles.css","./dist/base.css","./dist/theme.css"],"scripts":{"build":"rm -rf dist && svelte-package -i src -o dist && tsup && bash scripts/build-css.sh","dev":"svelte-package -i src -o dist --watch","typecheck":"svelte-check --tsconfig ./tsconfig.json","prepublishOnly":"pnpm build"},"peerDependencies":{"@codemirror/autocomplete":">=6.0.0","@codemirror/commands":">=6.0.0","@codemirror/lang-markdown":">=6.0.0","@codemirror/language-data":">=6.0.0","@codemirror/search":">=6.0.0","@codemirror/state":">=6.0.0","@codemirror/theme-one-dark":">=6.0.0","@codemirror/view":">=6.0.0","@hiveio/wax":">=1.28.0","bits-ui":">=1.0.0","svelte":">=5.0.0","tailwindcss":">=4.0.0"},"peerDependenciesMeta":{"@codemirror/autocomplete":{"optional":true},"@codemirror/commands":{"optional":true},"@codemirror/lang-markdown":{"optional":true},"@codemirror/language-data":{"optional":true},"@codemirror/search":{"optional":true},"@codemirror/state":{"optional":true},"@codemirror/theme-one-dark":{"optional":true},"@codemirror/view":{"optional":true},"bits-ui":{"optional":true},"tailwindcss":{"optional":true}},"dependencies":{"@xmldom/xmldom":"^0.8.10","clsx":"^2.1.1","remarkable":"^2.0.1","sanitize-html":"^2.13.0","tailwind-merge":"^3.4.0","zod":"^4.0.0"},"devDependencies":{"@codemirror/autocomplete":"^6.20.1","@codemirror/commands":"^6.10.2","@codemirror/lang-markdown":"^6.5.0","@codemirror/language-data":"^6.5.2","@codemirror/search":"^6.6.0","@codemirror/state":"^6.5.4","@codemirror/theme-one-dark":"^6.1.3","@codemirror/view":"^6.39.16","@hiveio/wax":"^1.28.4-rc0","@kkocot/honeycomb-core":"workspace:*","@kkocot/honeycomb-renderer":"workspace:*","bits-ui":"^1.0.0","@sveltejs/package":"^2.3.0","@sveltejs/vite-plugin-svelte":"^5.0.0","@tailwindcss/cli":"^4.0.0","svelte":"^5.0.0","svelte-check":"^4.0.0","tsup":"^8.0.1","typescript":"^5.3.3","vite":"^7.0.0"},"engines":{"node":">=18"},"gitHead":"68f85373e2d661721b0c4f66dae365cc9fd8b783","_id":"@barddev/honeycomb-svelte@0.1.1","_nodeVersion":"25.5.0","_npmVersion":"11.8.0","dist":{"integrity":"sha512-IzCtlGHC6RNbzx0o55owWr9QMKe1DIE5s01U6ogTdMtcBI+Kj3errxcqU+hmnTGGIiksdNaFfHr7/+N+Iz/tQw==","shasum":"65ccdce6c9ee8d407507711253d90b423c7b101b","tarball":"https://registry.npmjs.org/@barddev/honeycomb-svelte/-/honeycomb-svelte-0.1.1.tgz","fileCount":74,"unpackedSize":225069,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQCeGWfseccH+FPi9O+sirQztXsTl1PqaUzkreFAUHUhQwIgaiXGHz8RD+mIuPoJEQk4x7RMQnl8jM7JeuR5QeEzeb0="}]},"_npmUser":{"name":"barddev","email":"k.kocot0@gmail.com"},"directories":{},"maintainers":[{"name":"barddev","email":"k.kocot0@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/honeycomb-svelte_0.1.1_1772627379348_0.2089254516293768"},"_hasShrinkwrap":false}},"time":{"created":"2026-02-25T08:31:38.443Z","modified":"2026-03-04T12:29:39.611Z","0.1.0":"2026-02-25T08:31:38.794Z","0.1.1":"2026-03-04T12:29:39.502Z"},"bugs":{"url":"https://github.com/KKocot/honeycomb/issues"},"author":{"name":"KKocot"},"license":"MIT","homepage":"https://github.com/KKocot/honeycomb#readme","keywords":["hive","blockchain","svelte","svelte5","components","web3","honeycomb"],"repository":{"type":"git","url":"git+https://github.com/KKocot/honeycomb.git","directory":"packages/svelte"},"description":"Svelte 5 components for Hive Blockchain applications","maintainers":[{"name":"barddev","email":"k.kocot0@gmail.com"}],"readme":"# @barddev/honeycomb-svelte\n\n[![npm version](https://img.shields.io/npm/v/@barddev/honeycomb-svelte)](https://www.npmjs.com/package/@barddev/honeycomb-svelte) [![license](https://img.shields.io/npm/l/@barddev/honeycomb-svelte)](https://github.com/KKocot/honeycomb/blob/main/LICENSE)\n\nSvelte 5 components and hooks for Hive Blockchain applications. Read-only (passive) -- displays blockchain data without auth or transaction signing. Uses Svelte 5 runes ($state, $derived, $props).\n\n[Documentation](https://honeycomb.bard-dev.com/docs/svelte/introduction) | [GitHub](https://github.com/KKocot/honeycomb)\n\n## Requirements\n\n| Dependency | Version | Required |\n|------------|---------|----------|\n| svelte | >= 5.0.0 | Yes |\n| @hiveio/wax | >= 1.28.0 | Yes |\n| tailwindcss | >= 4.0.0 | Recommended (for theme.css) |\n| bits-ui | >= 1.0.0 | Only for ApiTracker |\n\n## Installation\n\n```bash\nnpm install @barddev/honeycomb-svelte @hiveio/wax svelte\n# or\npnpm add @barddev/honeycomb-svelte @hiveio/wax svelte\n# or\nyarn add @barddev/honeycomb-svelte @hiveio/wax svelte\n# or\nbun add @barddev/honeycomb-svelte @hiveio/wax svelte\n```\n\n## CSS Setup\n\nThe package exports 3 CSS files -- pick what fits your project:\n\n| File | What it includes | When to use |\n|------|-----------------|-------------|\n| `styles.css` | CSS vars + component styles + Tailwind utilities + theme tokens | Quick start -- all-in-one, no Tailwind needed |\n| `base.css` | CSS vars + component styles only | You have your own Tailwind setup |\n| `theme.css` | `@theme inline` tokens only | Add `hive-*` utility classes to your Tailwind project |\n\n### Option A: All-in-one (no Tailwind required)\n\n```ts\nimport \"@barddev/honeycomb-svelte/styles.css\";\n```\n\n### Option B: With your own Tailwind CSS (recommended)\n\n1. Import `base.css` for component styles in your entry file:\n\n```ts\nimport \"@barddev/honeycomb-svelte/base.css\";\n```\n\n2. Import `theme.css` in your global CSS to get `hive-*` utility classes:\n\n```css\n@import \"tailwindcss\";\n@import \"@barddev/honeycomb-svelte/theme.css\";\n\n@theme inline {\n  --color-background: hsl(var(--hive-background));\n  --color-foreground: hsl(var(--hive-foreground));\n  --color-border: hsl(var(--hive-border));\n  --color-muted: hsl(var(--hive-muted));\n  --color-muted-foreground: hsl(var(--hive-muted-foreground));\n  --color-card: hsl(var(--hive-card));\n  --color-card-foreground: hsl(var(--hive-card-foreground));\n}\n```\n\n## Dark Mode\n\nAdd `dark` class to `<html>` and apply body classes:\n\n```html\n<html lang=\"en\" class=\"dark\">\n  <body class=\"min-h-screen antialiased bg-hive-background text-hive-foreground\">\n```\n\nLight mode works by default (no `dark` class needed).\n\n## Quick Start\n\n### Vite + Svelte (SPA)\n\n```svelte\n<!-- src/App.svelte -->\n<script lang=\"ts\">\n  import { HiveProvider } from \"@barddev/honeycomb-svelte\";\n  import \"@barddev/honeycomb-svelte/styles.css\";\n  import Inner from \"./Inner.svelte\";\n</script>\n\n<HiveProvider>\n  <Inner />\n</HiveProvider>\n```\n\n```svelte\n<!-- src/Inner.svelte -->\n<script lang=\"ts\">\n  import { useHive, HiveAvatar, UserCard } from \"@barddev/honeycomb-svelte\";\n\n  const hive = useHive();\n</script>\n\n{#if hive.is_loading}\n  <div>Connecting to Hive...</div>\n{:else if hive.error}\n  <div>Error: {hive.error}</div>\n{:else}\n  <p>Status: {hive.status}</p>\n  <HiveAvatar username=\"blocktrades\" size=\"lg\" />\n  <UserCard username=\"blocktrades\" variant=\"expanded\" />\n{/if}\n```\n\n### SvelteKit\n\n`@hiveio/wax` uses WASM which does not work in Node.js SSR. Use a `{#if browser}` guard to render HiveProvider only on the client.\n\n```svelte\n<!-- src/routes/+page.svelte -->\n<script lang=\"ts\">\n  import { browser } from \"$app/environment\";\n  import { HiveProvider } from \"@barddev/honeycomb-svelte\";\n  import \"@barddev/honeycomb-svelte/styles.css\";\n</script>\n\n{#if browser}\n  <HiveProvider>\n    <YourApp />\n  </HiveProvider>\n{:else}\n  <div class=\"min-h-screen bg-background\"></div>\n{/if}\n```\n\n```ts\n// vite.config.ts (SvelteKit)\nimport { sveltekit } from \"@sveltejs/kit/vite\";\nimport { wasmUrlPlugin } from \"@barddev/honeycomb-svelte/plugins\";\nimport { defineConfig } from \"vite\";\n\nexport default defineConfig({\n  plugins: [sveltekit(), wasmUrlPlugin()],\n});\n```\n\n### Astro + Svelte\n\nUse `client:only=\"svelte\"` (NOT `client:load`) -- WASM does not work in Node.js SSR.\n\n```astro\n---\nimport DemoApp from \"../components/DemoApp.svelte\";\nimport \"@barddev/honeycomb-svelte/styles.css\";\n---\n\n<html lang=\"en\" class=\"dark\">\n  <body class=\"min-h-screen antialiased bg-hive-background text-hive-foreground\">\n    <DemoApp client:only=\"svelte\" />\n  </body>\n</html>\n```\n\n```js\n// astro.config.mjs\nimport { defineConfig } from \"astro/config\";\nimport svelte from \"@astrojs/svelte\";\nimport { wasmUrlPlugin } from \"@barddev/honeycomb-svelte/plugins\";\n\nexport default defineConfig({\n  integrations: [svelte()],\n  vite: {\n    plugins: [wasmUrlPlugin()],\n  },\n});\n```\n\n> Note: `wasmUrlPlugin` is required for projects outside the honeycomb monorepo.\n\n## Troubleshooting\n\n**Components render without styles**\n- Ensure you import `styles.css` or `base.css` in your entry file.\n- If using Option B (own Tailwind), check that `theme.css` is imported in your global CSS.\n\n**White/blank page after adding Tailwind**\n- Add `class=\"dark\"` to `<html>` element.\n- Add `bg-hive-background text-hive-foreground` to `<body>`.\n\n**WASM error: Failed to fetch dynamically imported module**\n- SvelteKit/Astro: add `wasmUrlPlugin()` from `@barddev/honeycomb-svelte/plugins` to your Vite config.\n\n**SSR errors with SvelteKit**\n- Wrap `HiveProvider` in `{#if browser}` guard (import `browser` from `$app/environment`).\n- Add `wasmUrlPlugin()` to Vite config.\n\n## Components\n\n- **HiveProvider** -- context provider, wraps your app (uses Svelte context + runes)\n- **HiveAvatar** -- user profile picture\n- **UserCard** -- user profile card (compact / expanded)\n- **BalanceCard** -- HIVE / HBD / HP balances\n- **HiveManabar** -- resource credit / voting manabar\n- **HivePostCard** -- single post card\n- **HivePostList** -- paginated post feed\n- **HiveContentRenderer** -- renders Hive Markdown content\n- **ApiTracker** -- API endpoint status (requires `bits-ui`)\n\n## Hooks\n\n- `useHive()` -- connection status, chain instance, error state\n- `useHiveChain()` -- direct access to the Wax chain object\n- `useApiEndpoint()` -- current API endpoint info\n- `useHiveStatus()` -- connection status and endpoints\n- `useHiveAccount(username)` -- fetch account data\n- `useHivePost(author, permlink)` -- fetch a single post\n- `useHivePostList(options)` -- fetch paginated post list\n\n## Documentation\n\nFull API reference, live examples, and guides:\n\n**[honeycomb.bard-dev.com/docs/svelte/introduction](https://honeycomb.bard-dev.com/docs/svelte/introduction)**\n\n## License\n\nMIT\n","readmeFilename":"README.md"}