{"_id":"@anilreddy11/trivo-ui","_rev":"5-c4cb9c4a9f2b2a9cb0c3166319bd4d81","name":"@anilreddy11/trivo-ui","dist-tags":{"latest":"0.4.0"},"versions":{"0.1.0":{"name":"@anilreddy11/trivo-ui","version":"0.1.0","keywords":["trivo","react-native","design-system","ui"],"license":"MIT","_id":"@anilreddy11/trivo-ui@0.1.0","maintainers":[{"name":"anilreddy11","email":"kondaanilusa@gmail.com"}],"homepage":"https://github.com/trivo/trivo-ui#readme","bugs":{"url":"https://github.com/trivo/trivo-ui/issues"},"dist":{"shasum":"9df0c33d3bae7652244550cd10d33737bd61d169","tarball":"https://registry.npmjs.org/@anilreddy11/trivo-ui/-/trivo-ui-0.1.0.tgz","fileCount":83,"integrity":"sha512-tAXCShcBE4Y3/iicGYEFAUISWao2sd08XCkr2OBNBySk+wkdFIE9fMbLaotn7QGl33Mk2JSjsxxKMRcj7x4KVA==","signatures":[{"sig":"MEUCIQDJW4zvKdzgB+vDjJpVrfgncAZdzsQOG3j5gQstxeYa1AIgSfL1XhmpmAGC0xBP09ny+lGx8tT/Xu2KhcXBofRURgI=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":116758},"main":"dist/index.js","types":"dist/index.d.ts","scripts":{"build":"tsc"},"_npmUser":{"name":"anilreddy11","email":"kondaanilusa@gmail.com"},"repository":{"url":"git+https://github.com/trivo/trivo-ui.git","type":"git"},"_npmVersion":"10.9.8","description":"Trivo design system — React Native component library","directories":{},"_nodeVersion":"22.22.3","_hasShrinkwrap":false,"devDependencies":{"react":"^18.3.1","typescript":"^5.7.2","@types/react":"^18.3.12","expo-haptics":"^14.0.0","react-native":"^0.76.5","react-native-svg":"^15.8.0","react-native-reanimated":"^3.16.1","react-native-gesture-handler":"^2.20.2"},"peerDependencies":{"react":">=18","expo-haptics":">=13","react-native":">=0.73","react-native-svg":">=15","react-native-reanimated":">=3","react-native-gesture-handler":">=2"},"_npmOperationalInternal":{"tmp":"tmp/trivo-ui_0.1.0_1782884507822_0.3089356108744583","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@anilreddy11/trivo-ui","version":"0.1.1","keywords":["trivo","react-native","design-system","ui"],"license":"MIT","_id":"@anilreddy11/trivo-ui@0.1.1","maintainers":[{"name":"anilreddy11","email":"kondaanilusa@gmail.com"}],"homepage":"https://github.com/trivo/trivo-ui#readme","bugs":{"url":"https://github.com/trivo/trivo-ui/issues"},"dist":{"shasum":"39f9976fc46af14295892a7713854b810e7d841e","tarball":"https://registry.npmjs.org/@anilreddy11/trivo-ui/-/trivo-ui-0.1.1.tgz","fileCount":83,"integrity":"sha512-4m8q5X9wsT1n5cM8UaUmAFncRhuFG61vUjTXSIswNxc8KzTj3X8ozMt5yEU9IJCd56k5ICXYwDe8MwscSFfFbQ==","signatures":[{"sig":"MEQCIBKz3tWFnqDbYV6skkyiMIv9+sluAWkZhuwNMddJdvnLAiBF2IgukLUadymt/grryytRXfgykVaGARGRkHxh/VoAjA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":116798},"main":"dist/index.js","types":"dist/index.d.ts","scripts":{"build":"tsc"},"_npmUser":{"name":"anilreddy11","email":"kondaanilusa@gmail.com"},"repository":{"url":"git+https://github.com/trivo/trivo-ui.git","type":"git"},"_npmVersion":"10.9.8","description":"Trivo design system — React Native component library","directories":{},"_nodeVersion":"22.22.3","_hasShrinkwrap":false,"devDependencies":{"react":"^18.3.1","typescript":"^5.7.2","@types/react":"^18.3.12","expo-haptics":"^14.0.0","react-native":"^0.76.5","react-native-svg":"^15.8.0","react-native-reanimated":"^3.16.1","react-native-gesture-handler":"^2.20.2"},"peerDependencies":{"react":">=18","expo-haptics":">=13","react-native":">=0.73","react-native-svg":">=15","react-native-reanimated":">=3","react-native-gesture-handler":">=2"},"_npmOperationalInternal":{"tmp":"tmp/trivo-ui_0.1.1_1782911652886_0.2705438461555447","host":"s3://npm-registry-packages-npm-production"}},"0.2.0":{"name":"@anilreddy11/trivo-ui","version":"0.2.0","keywords":["trivo","react-native","design-system","ui"],"license":"MIT","_id":"@anilreddy11/trivo-ui@0.2.0","maintainers":[{"name":"anilreddy11","email":"kondaanilusa@gmail.com"}],"homepage":"https://github.com/trivo/trivo-ui#readme","bugs":{"url":"https://github.com/trivo/trivo-ui/issues"},"dist":{"shasum":"c6dda2d6c91377fbb3c4cac717df6c50b4a76246","tarball":"https://registry.npmjs.org/@anilreddy11/trivo-ui/-/trivo-ui-0.2.0.tgz","fileCount":83,"integrity":"sha512-HOQ5D7btGu15ln0KmZsp9jntGLjqeZgvWSoaL9S2E0EnA0ijFjoOWsIOBPXBs/CNpWo927sl89ny4aQ2xCRLMg==","signatures":[{"sig":"MEUCIQDf6pVTueVtQq2PSvrFu7rX/tryY+PNWLcS0htpAIveDAIgV4+9Q6sHx0i/w0LVEhJpV9X5u3xbYxl1iHfE/4+aR4M=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":118197},"main":"dist/index.js","types":"dist/index.d.ts","scripts":{"build":"tsc"},"_npmUser":{"name":"anilreddy11","email":"kondaanilusa@gmail.com"},"repository":{"url":"git+https://github.com/trivo/trivo-ui.git","type":"git"},"_npmVersion":"10.9.8","description":"Trivo design system — React Native component library","directories":{},"_nodeVersion":"22.22.3","_hasShrinkwrap":false,"devDependencies":{"react":"^18.3.1","typescript":"^5.7.2","@types/react":"^18.3.12","expo-haptics":"^14.0.0","react-native":"^0.76.5","react-native-svg":"^15.8.0","react-native-reanimated":"^3.16.1","react-native-gesture-handler":"^2.20.2"},"peerDependencies":{"react":">=18","expo-haptics":">=13","react-native":">=0.73","react-native-svg":">=15","react-native-reanimated":">=3","react-native-gesture-handler":">=2"},"_npmOperationalInternal":{"tmp":"tmp/trivo-ui_0.2.0_1782913438716_0.4479170012638136","host":"s3://npm-registry-packages-npm-production"}},"0.3.0":{"name":"@anilreddy11/trivo-ui","version":"0.3.0","keywords":["trivo","react-native","design-system","ui"],"license":"MIT","_id":"@anilreddy11/trivo-ui@0.3.0","maintainers":[{"name":"anilreddy11","email":"kondaanilusa@gmail.com"}],"homepage":"https://github.com/trivo/trivo-ui#readme","bugs":{"url":"https://github.com/trivo/trivo-ui/issues"},"dist":{"shasum":"7deffe59286ac839a2d65516885bdcff8ff1b107","tarball":"https://registry.npmjs.org/@anilreddy11/trivo-ui/-/trivo-ui-0.3.0.tgz","fileCount":110,"integrity":"sha512-diSwrDxIfSnGfMCkIUFe3Y7hVp0w3EhjUBpgsraK5nU1Ga1nbXd6MYjd7kkeddjCGooP43YhgGGL/yBs8+HT3g==","signatures":[{"sig":"MEQCIGDT1OmgBsliSZYRcext1ZpN+3wz9MR7KQUIil3gmLDpAiBCuMdA9LgYJ/NboZE+wWORItNCt153YVG/NCx0kaYHqw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":178102},"main":"dist/index.js","types":"dist/index.d.ts","scripts":{"build":"tsc"},"_npmUser":{"name":"anilreddy11","email":"kondaanilusa@gmail.com"},"repository":{"url":"git+https://github.com/trivo/trivo-ui.git","type":"git"},"_npmVersion":"10.9.8","description":"Trivo design system — React Native component library","directories":{},"_nodeVersion":"22.22.3","_hasShrinkwrap":false,"devDependencies":{"react":"^18.3.1","typescript":"^5.7.2","@types/react":"^18.3.12","expo-haptics":"^14.0.0","react-native":"^0.76.5","react-native-svg":"^15.8.0","@expo/vector-icons":"^14.0.4","react-native-reanimated":"^3.16.1","react-native-gesture-handler":"^2.20.2","react-native-safe-area-context":"^4.12.0"},"peerDependencies":{"react":">=18","expo-haptics":">=13","react-native":">=0.73","react-native-svg":">=15","@expo/vector-icons":">=14","react-native-reanimated":">=3","react-native-gesture-handler":">=2","react-native-safe-area-context":">=4"},"_npmOperationalInternal":{"tmp":"tmp/trivo-ui_0.3.0_1782914884252_0.24606615042714264","host":"s3://npm-registry-packages-npm-production"}},"0.4.0":{"name":"@anilreddy11/trivo-ui","version":"0.4.0","description":"Trivo design system — React Native component library","main":"dist/index.js","types":"dist/index.d.ts","scripts":{"build":"tsc"},"peerDependencies":{"@expo/vector-icons":">=14","expo-haptics":">=13","react":">=18","react-native":">=0.73","react-native-gesture-handler":">=2","react-native-reanimated":">=3","react-native-safe-area-context":">=4","react-native-svg":">=15"},"devDependencies":{"@expo/vector-icons":"^14.0.4","@types/react":"^18.3.12","expo-haptics":"^14.0.0","react":"^18.3.1","react-native":"^0.76.5","react-native-gesture-handler":"^2.20.2","react-native-reanimated":"^3.16.1","react-native-safe-area-context":"^4.12.0","react-native-svg":"^15.8.0","typescript":"^5.7.2"},"keywords":["trivo","react-native","design-system","ui"],"license":"MIT","repository":{"type":"git","url":"git+https://github.com/trivo/trivo-ui.git"},"_id":"@anilreddy11/trivo-ui@0.4.0","bugs":{"url":"https://github.com/trivo/trivo-ui/issues"},"homepage":"https://github.com/trivo/trivo-ui#readme","_nodeVersion":"22.22.3","_npmVersion":"10.9.8","dist":{"integrity":"sha512-S7giAfF5XSFZBkWcRUm3wD3DC4YzeqOIe1yw9hjFmcL+wVpOd8Tk9X1NtDeIT+Z3gswy5d3ThJNUxDsVEoIHGg==","shasum":"f6b38f99a44c494a5566c035981d4a95dcd777cf","tarball":"https://registry.npmjs.org/@anilreddy11/trivo-ui/-/trivo-ui-0.4.0.tgz","fileCount":125,"unpackedSize":201672,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQDRnTB7LqNfZPzIADYA5PqTAHjF06lG1RKdCqbmplrEMQIhAPJ5lmLZhaCBN8/UIJjIu2WYCzdeSAMVJbJ8maTV13iT"}]},"_npmUser":{"name":"anilreddy11","email":"kondaanilusa@gmail.com"},"directories":{},"maintainers":[{"name":"anilreddy11","email":"kondaanilusa@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/trivo-ui_0.4.0_1782954224098_0.12686828397236116"},"_hasShrinkwrap":false}},"time":{"created":"2026-07-01T05:41:47.622Z","modified":"2026-07-02T01:03:44.360Z","0.1.0":"2026-07-01T05:41:47.961Z","0.1.1":"2026-07-01T13:14:13.050Z","0.2.0":"2026-07-01T13:43:58.860Z","0.3.0":"2026-07-01T14:08:04.412Z","0.4.0":"2026-07-02T01:03:44.250Z"},"bugs":{"url":"https://github.com/trivo/trivo-ui/issues"},"license":"MIT","homepage":"https://github.com/trivo/trivo-ui#readme","keywords":["trivo","react-native","design-system","ui"],"repository":{"type":"git","url":"git+https://github.com/trivo/trivo-ui.git"},"description":"Trivo design system — React Native component library","maintainers":[{"name":"anilreddy11","email":"kondaanilusa@gmail.com"}],"readme":"# @anilreddy11/trivo-ui\n\nShared design system for **Trivo** — a dark-theme React Native component library used by `trivo-mobile` and `trivo-web`.\n\n## Install\n\n```bash\nnpm install @anilreddy11/trivo-ui\n```\n\n### Peer dependencies\n\nYour app must already include:\n\n- `react`\n- `react-native`\n- `react-native-reanimated`\n- `react-native-svg`\n- `react-native-gesture-handler`\n- `expo-haptics`\n\nConfigure Reanimated in your app's `babel.config.js`:\n\n```js\nmodule.exports = {\n  presets: ['module:@react-native/babel-preset'],\n  plugins: ['react-native-reanimated/plugin'],\n};\n```\n\n## Quick start\n\n```tsx\nimport {\n  PageContainer,\n  MacroRing,\n  SectionHeader,\n  colors,\n} from '@anilreddy11/trivo-ui';\n\nexport function FitnessToday() {\n  return (\n    <PageContainer>\n      <SectionHeader title=\"Today\" subtitle=\"Your macros\" />\n      <MacroRing\n        calories={{ current: 1420, goal: 2000 }}\n        protein={{ current: 98, goal: 150 }}\n        carbs={{ current: 145, goal: 200 }}\n        fat={{ current: 42, goal: 65 }}\n        size={260}\n        animated\n      />\n    </PageContainer>\n  );\n}\n```\n\n## Design tokens\n\nAll colors, spacing, typography, and radius values live in `tokens`:\n\n```tsx\nimport { colors, spacing, radius, fontSize, fontWeight } from '@anilreddy11/trivo-ui';\n\nconst card = {\n  backgroundColor: colors.bg.surface,\n  padding: spacing.md,\n  borderRadius: radius.md,\n};\n```\n\nNever hardcode hex values in consuming apps — import from tokens.\n\n## Components\n\n### Primitives\n\n| Component   | Description                                      |\n|------------|--------------------------------------------------|\n| `Box`      | Layout container with spacing props              |\n| `Text`     | Typography with token-based size/weight/color    |\n| `Pressable`| Reanimated scale press + optional haptic feedback|\n\n### Layout\n\n| Component        | Description                |\n|-----------------|-----------------------------|\n| `PageContainer` | Safe-area scrollable screen |\n| `SectionHeader` | Title + optional action     |\n| `Divider`       | Horizontal or vertical rule |\n\n### Data display\n\n| Component      | Description                                      |\n|---------------|--------------------------------------------------|\n| `MacroRing`   | **Signature** 4-ring animated macro progress   |\n| `StatCard`    | Metric card with accent stripe                   |\n| `ProgressBar` | Animated horizontal bar                          |\n| `SpendingBar` | Stacked budget breakdown                         |\n| `NutrientRow` | Label + progress for one nutrient                |\n| `WeightChart` | Simple SVG weight trend                          |\n\n### Forms\n\n| Component          | Description                    |\n|-------------------|--------------------------------|\n| `Input`           | Text field with label/error    |\n| `SearchBar`       | Debounced search with clear    |\n| `QuantitySelector`| +/- stepper                    |\n| `SegmentedControl`| Tab-style option picker        |\n\n### Feedback\n\n| Component    | Description              |\n|-------------|--------------------------|\n| `Toast`     | Auto-dismiss notification|\n| `Modal`     | Centered overlay dialog  |\n| `Skeleton`  | Loading placeholder      |\n| `EmptyState`| Zero-data CTA screen     |\n\n### Trivo AI\n\n| Component         | Description                    |\n|------------------|--------------------------------|\n| `ChatBubble`     | User vs assistant message      |\n| `TrivoAIInput`   | Chat input with focus animation|\n| `QuickAddPill`   | Horizontal suggestion chips    |\n| `TypingIndicator`| Animated thinking dots         |\n| `ApiKeySetup`    | Anthropic API key onboarding   |\n\n## MacroRing\n\nThe hero fitness component — four concentric rings (calories → protein → carbs → fat) with spring animation, SVG glow on the active ring, and danger + shake when any macro exceeds 100% of goal.\n\n```tsx\n<MacroRing\n  calories={{ current: 2100, goal: 2000 }}\n  protein={{ current: 120, goal: 150 }}\n  carbs={{ current: 180, goal: 200 }}\n  fat={{ current: 70, goal: 65 }}\n  size={280}\n  animated\n/>\n```\n\nRing colors map to tokens:\n\n- Calories → `colors.semantic.info`\n- Protein → `colors.brand.fitness`\n- Carbs → `colors.brand.focus`\n- Fat → `colors.brand.finance`\n\n## Development\n\n```bash\ncd trivo-ui\nnpm install\nnpm run build\n```\n\nBuild output goes to `dist/` via TypeScript (`tsc`).\n\n## Publishing\n\n```bash\nnpm login\nnpm publish --access public\n```\n\nStart at `0.1.0`, follow semver for breaking changes.\n\n## License\n\nMIT\n","readmeFilename":"README.md"}