{"_id":"@cometpisces/tarot-kit-images","_rev":"2-2311381d7b7e5fc79b1bae0f9f89b856","name":"@cometpisces/tarot-kit-images","dist-tags":{"latest":"0.2.0"},"versions":{"0.1.0":{"name":"@cometpisces/tarot-kit-images","version":"0.1.0","keywords":["tarot","rider-waite","images","cards","divination","tarot-cards","major-arcana","minor-arcana","card-images","typescript","react","nextjs","vue"],"license":"SEE LICENSE IN LICENSE.md","_id":"@cometpisces/tarot-kit-images@0.1.0","maintainers":[{"name":"cometpisces","email":"koyostar@gmail.com"}],"dist":{"shasum":"98f7b335636870ed3ae2afa4c80f2405a44d44e8","tarball":"https://registry.npmjs.org/@cometpisces/tarot-kit-images/-/tarot-kit-images-0.1.0.tgz","fileCount":83,"integrity":"sha512-meZ6g+LXS7ozmcPDEv9z/45VGHOjpt/cvjrE+YaO/7Tit2Ut9Q3ZFuczePBSg+cbY1XzNgF9nxpT5x9Lkjtqlw==","signatures":[{"sig":"MEYCIQDFOTurxB39aiOUkj+Q0o9J3MISRzjIpTdP5tbe4+rpzwIhAL1CeackGAFDZ4fJGbqrITHUtHRhymujsoDrSth+68Ly","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":21917357},"main":"./dist/index.js","type":"module","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./images/*":"./images/*"},"gitHead":"d0277853d20b9063227373f35d3b3e6107313d36","scripts":{"build":"tsc"},"_npmUser":{"name":"cometpisces","email":"koyostar@gmail.com"},"_npmVersion":"11.6.2","description":"78 Rider-Waite tarot card images with TypeScript helpers - companion to @cometpisces/tarot-kit for building tarot reading apps","directories":{},"_nodeVersion":"24.13.0","_hasShrinkwrap":false,"devDependencies":{"typescript":"^6.0.2"},"_npmOperationalInternal":{"tmp":"tmp/tarot-kit-images_0.1.0_1779645358383_0.47068941307510204","host":"s3://npm-registry-packages-npm-production"}},"0.2.0":{"name":"@cometpisces/tarot-kit-images","version":"0.2.0","description":"78 Rider-Waite tarot card images with TypeScript helpers - companion to @cometpisces/tarot-kit for building tarot reading apps","license":"SEE LICENSE IN LICENSE.md","type":"module","main":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./images/*":"./images/*"},"scripts":{"build":"tsc"},"devDependencies":{"typescript":"^6.0.2"},"keywords":["tarot","rider-waite","images","cards","divination","tarot-cards","major-arcana","minor-arcana","card-images","typescript","react","nextjs","vue"],"gitHead":"d6a05b4ee6dfff5ce07339f8ed1af3d7a8a9575c","_id":"@cometpisces/tarot-kit-images@0.2.0","_nodeVersion":"24.13.0","_npmVersion":"11.6.2","dist":{"integrity":"sha512-F2RK3bqBoBFwVkBpRJJeQBJD4vc2uMsEvS4naW6d2Zn9lyVv8sujY9Cgs0htBPrCngzRIsck1ulHuR80eDkZfA==","shasum":"ea9ad75565823446b2df39ac352d5115dde63d13","tarball":"https://registry.npmjs.org/@cometpisces/tarot-kit-images/-/tarot-kit-images-0.2.0.tgz","fileCount":83,"unpackedSize":21917353,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCICNQXdpmE8KRMrCSb6gVolqP8fxj9oaeDLjWHwbXIaJrAiAiMZlPdsPThzwr4H9hFryYQcRS1KRqJ47CU/XsVlQv5A=="}]},"_npmUser":{"name":"cometpisces","email":"koyostar@gmail.com"},"directories":{},"maintainers":[{"name":"cometpisces","email":"koyostar@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/tarot-kit-images_0.2.0_1779650765207_0.5447513951593626"},"_hasShrinkwrap":false}},"time":{"created":"2026-05-24T17:55:58.167Z","modified":"2026-05-24T19:26:05.752Z","0.1.0":"2026-05-24T17:55:58.818Z","0.2.0":"2026-05-24T19:26:05.650Z"},"license":"SEE LICENSE IN LICENSE.md","keywords":["tarot","rider-waite","images","cards","divination","tarot-cards","major-arcana","minor-arcana","card-images","typescript","react","nextjs","vue"],"description":"78 Rider-Waite tarot card images with TypeScript helpers - companion to @cometpisces/tarot-kit for building tarot reading apps","maintainers":[{"name":"cometpisces","email":"koyostar@gmail.com"}],"readme":"# @cometpisces/tarot-kit-images\n\n78 Rider-Waite tarot card images with TypeScript helpers for building tarot reading applications.\n\n> šŸ’” **Companion package to [@cometpisces/tarot-kit](https://www.npmjs.com/package/@cometpisces/tarot-kit)** - install both for a complete tarot solution with card data, meanings, and images.\n\n## Installation\n\n```bash\nnpm install @cometpisces/tarot-kit-images\n# or\npnpm add @cometpisces/tarot-kit-images\n# or\nyarn add @cometpisces/tarot-kit-images\n```\n\n## What's Included\n\n- ļæ½ **78 high-quality Rider-Waite card images** (PNG format)\n - 22 Major Arcana (The Fool through The World)\n - 56 Minor Arcana (Cups, Pentacles, Swords, Wands - Ace through King)\n- šŸ—ŗļø **TypeScript image mapping utilities** for easy card ID ā†’ filename resolution\n- šŸ“¦ **Framework agnostic** - works with React, Vue, Next.js, Vite, and more\n- šŸ” **Helper functions** to check image availability and get all image paths\n\n## Quick Start\n\n### Basic Usage\n\n```typescript\nimport { getImagePath } from '@cometpisces/tarot-kit-images';\n\n// Get image filename for a card\nconst foolImage = getImagePath('the-fool');\nconsole.log(foolImage); // \"00-TheFool.png\"\n```\n\n### Direct Image Import\n\n```typescript\n// Import specific images directly\nimport foolImage from \"@cometpisces/tarot-kit-images/images/00-TheFool.png\";\n```\n\n### Complete Example with @cometpisces/tarot-kit\n\n```typescript\nimport { getCardById, drawRandomCard } from '@cometpisces/tarot-kit';\nimport { getImagePath } from '@cometpisces/tarot-kit-images';\n\n// Get a specific card with its image\nconst fool = getCardById('the-fool');\nconst imagePath = getImagePath(fool.id);\nconsole.log(`${fool.name.en}: ${imagePath}`);\n// Output: \"The Fool: 00-TheFool.png\"\n\n// Draw a random card\nconst drawn = drawRandomCard();\nconst drawnImagePath = getImagePath(drawn.card.id);\nconsole.log(`Drew ${drawn.card.name.en} (${drawn.orientation})`);\n```\n\n## Framework Integration\n\n### React / Next.js\n\n```tsx\nimport { useState } from 'react';\nimport { drawRandomCard } from '@cometpisces/tarot-kit';\nimport { getImagePath } from '@cometpisces/tarot-kit-images';\n\nfunction TarotCard() {\n const [drawn] = useState(() => drawRandomCard());\n const imagePath = getImagePath(drawn.card.id);\n\n return (\n
\n \n

{drawn.card.name.en}

\n

{drawn.orientation}

\n
\n );\n}\n```\n\n### Three-Card Spread Example\n\n```tsx\nimport { drawCards } from '@cometpisces/tarot-kit';\nimport { getImagePath } from '@cometpisces/tarot-kit-images';\n\nfunction ThreeCardSpread() {\n const spread = drawCards(3);\n const positions = ['Past', 'Present', 'Future'];\n\n return (\n
\n {spread.map((drawn, index) => (\n
\n

{positions[index]}

\n \n

{drawn.card.name.en} ({drawn.orientation})

\n
\n ))}\n
\n );\n}\n```\n\n## API Reference\n\n### `getImagePath(cardId: string): string | undefined`\n\nGet the image filename for a card by its ID.\n\n```typescript\nimport { getImagePath } from '@cometpisces/tarot-kit-images';\n\nconst imagePath = getImagePath('the-fool'); // \"00-TheFool.png\"\nconst missing = getImagePath('invalid-id'); // undefined\n```\n\n**Parameters:**\n- `cardId` - The card ID from @cometpisces/tarot-kit (e.g., 'the-fool', 'five-of-cups', 'king-of-swords')\n\n**Returns:**\n- The image filename (e.g., '00-TheFool.png') or `undefined` if not found\n\n---\n\n### `getAllImagePaths(): string[]`\n\nGet an array of all available image filenames.\n\n```typescript\nimport { getAllImagePaths } from '@cometpisces/tarot-kit-images';\n\nconst allImages = getAllImagePaths();\nconsole.log(allImages.length); // 78\n\n// Example: preload all images\nallImages.forEach(filename => {\n const img = new Image();\n img.src = `/tarot/${filename}`;\n});\n```\n\n**Returns:**\n- Array of all 78 image filenames\n\n---\n\n### `hasImage(cardId: string): boolean`\n\nCheck if an image exists for a given card ID.\n\n```typescript\nimport { hasImage } from '@cometpisces/tarot-kit-images';\n\nif (hasImage('the-fool')) {\n // Safe to use getImagePath\n const path = getImagePath('the-fool');\n}\n```\n\n**Parameters:**\n- `cardId` - The card ID to check\n\n**Returns:**\n- `true` if an image exists, `false` otherwise\n\n---\n\n### `imageMap: Record`\n\nThe complete mapping object of card IDs to filenames.\n\n```typescript\nimport { imageMap } from '@cometpisces/tarot-kit-images';\n\nconsole.log(imageMap['the-fool']); // \"00-TheFool.png\"\n\n// Iterate over all mappings\nObject.entries(imageMap).forEach(([cardId, filename]) => {\n console.log(`${cardId} -> ${filename}`);\n});\n```\n\n---\n\n## Image Naming Convention\n\nAll images follow a consistent naming pattern:\n\n- **Major Arcana**: `00-TheFool.png` through `21-TheWorld.png`\n- **Cups**: `Cups01.png` through `Cups14.png` (01 = Ace, 11 = Page, 12 = Knight, 13 = Queen, 14 = King)\n- **Pentacles**: `Pentacles01.png` through `Pentacles14.png`\n- **Swords**: `Swords01.png` through `Swords14.png`\n- **Wands**: `Wands01.png` through `Wands14.png`\n\n> **Note**: Card back images are not included. Design your own or use a placeholder for face-down cards.\n\n---\n\n## TypeScript Support\n\nFull TypeScript definitions included with type-safe exports.\n\n```typescript\nimport type { } from '@cometpisces/tarot-kit-images';\nimport { getImagePath, getAllImagePaths, hasImage } from '@cometpisces/tarot-kit-images';\n\n// Type-safe usage\nconst path: string | undefined = getImagePath('the-fool');\nconst allPaths: string[] = getAllImagePaths();\nconst exists: boolean = hasImage('five-of-cups');\n```\n\n**Combined with @cometpisces/tarot-kit:**\n\n```typescript\nimport type { TarotCard, DrawnCard } from '@cometpisces/tarot-kit';\nimport { getCardById, drawRandomCard } from '@cometpisces/tarot-kit';\nimport { getImagePath } from '@cometpisces/tarot-kit-images';\n\nconst card: TarotCard = getCardById('the-fool');\nconst imagePath: string | undefined = getImagePath(card.id);\n\nconst drawn: DrawnCard = drawRandomCard();\nconst drawnPath: string | undefined = getImagePath(drawn.card.id);\n```\n\n## Project Setup\n\n### Next.js (App Router or Pages Router)\n\n**Option 1: Copy to public folder (recommended)**\n\n```bash\n# Copy images to public/tarot/\ncp -r node_modules/@cometpisces/tarot-kit-images/images public/tarot\n```\n\nThen use in components:\n```tsx\n{card.name.en}\n```\n\n**Option 2: Use Next.js Image component**\n\n```tsx\nimport Image from 'next/image';\nimport { getImagePath } from '@cometpisces/tarot-kit-images';\n\nconst imagePath = getImagePath('the-fool');\n\n\n```\n\n### Vite / Create React App\n\n**Copy images to public folder:**\n\n```bash\ncp -r node_modules/@cometpisces/tarot-kit-images/images public/tarot\n```\n\n**Use in components:**\n```tsx\n{card.name.en}\n```\n\n### Vue.js\n\n```vue\n\n\n\n```\n\n---\n\n## Direct Image Imports\n\nYou can also import images directly (useful for bundlers like Webpack/Vite):\n\n```typescript\n// Import a specific image\nimport foolImage from '@cometpisces/tarot-kit-images/images/00-TheFool.png';\n\n// Use in a component\n\"The\n```\n\n---\n\n## Tips & Best Practices\n\n### Preloading Images\n\nFor better UX, preload images before showing them:\n\n```typescript\nimport { getAllImagePaths } from '@cometpisces/tarot-kit-images';\n\nfunction preloadImages(imagePaths: string[]) {\n imagePaths.forEach(path => {\n const img = new Image();\n img.src = `/tarot/${path}`;\n });\n}\n\n// Preload all cards\npreloadImages(getAllImagePaths());\n```\n\n### Handling Missing Images\n\nAlways check if an image exists before using it:\n\n```typescript\nimport { hasImage, getImagePath } from '@cometpisces/tarot-kit-images';\n\nfunction getCardImageSrc(cardId: string): string {\n if (hasImage(cardId)) {\n return `/tarot/${getImagePath(cardId)}`;\n }\n return '/tarot/placeholder.png'; // Fallback image\n}\n```\n\n### Responsive Images\n\nUse CSS or Next.js Image for responsive card images:\n\n```css\n.tarot-card {\n width: 100%;\n max-width: 300px;\n height: auto;\n border-radius: 8px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n}\n\n.tarot-card.reversed {\n transform: rotate(180deg);\n}\n```\n\n---\n\n## Package Size\n\n- **Total package size**: ~15-20 MB (includes all 78 card images)\n- **Individual image size**: ~200-300 KB per card\n- **Installed size**: ~20-25 MB\n\nConsider your deployment strategy:\n- āœ… **Copy to public folder**: Recommended for most projects\n- āœ… **CDN hosting**: For better performance and caching\n- āš ļø **Bundle with app**: May increase initial bundle size\n\n---\n\n## License\n\n### Code & Mappings\n\nThe TypeScript code and image mappings are licensed under the **MIT License**.\n\n### Rider-Waite Images\n\nāš ļø **Important**: The Rider-Waite tarot card images are believed to be in the **public domain** in many jurisdictions due to their age (original publication 1909). However:\n\n- Copyright status may vary by country\n- Some jurisdictions may have different rules for commercial use\n- Derivative works may have additional restrictions\n\n**Before using commercially:**\n1. Verify public domain status in your jurisdiction\n2. Consult with a legal professional if needed\n3. Consider using your own artwork for commercial projects\n\nThis package distributor makes no warranties regarding the copyright status of the images and assumes no liability for their use.\n\n---\n\n## Companion Package\n\nUse with [@cometpisces/tarot-kit](https://www.npmjs.com/package/@cometpisces/tarot-kit) for complete tarot card data and utilities:\n\n- šŸ“– Card meanings (upright & reversed)\n- šŸ”® Reading aspects (love, career, spiritual, shadow)\n- šŸŽ² Helper functions for card drawing\n- šŸŒ Localization support (English & Chinese)\n- šŸ“˜ Full TypeScript definitions\n\n```bash\nnpm install @cometpisces/tarot-kit @cometpisces/tarot-kit-images\n```\n\n---\n\n## Contributing\n\nThis package is part of the [arcana-nyx](https://github.com/cometpisces/arcana-nyx) project. Contributions, issues, and feature requests are welcome!\n\n","readmeFilename":"README.md"}