{"_id":"@alimohammadiwork/cytostyle","name":"@alimohammadiwork/cytostyle","dist-tags":{"latest":"1.0.82"},"versions":{"1.0.82":{"name":"@alimohammadiwork/cytostyle","version":"1.0.82","description":"Reusable CytoStyle React and Material UI components, providers, hooks, utilities, and design tokens for Cytognosis products.","type":"module","main":"dist/index.js","module":"dist/index.js","types":"dist/types/index.d.ts","scripts":{"build":"node esbuild.js && tsc --emitDeclarationOnly","pack:check":"npm pack --dry-run","storybook":"storybook dev -p 6006","build-storybook":"storybook build","test":"pnpm build"},"exports":{".":{"types":"./dist/types/index.d.ts","import":"./dist/index.js"},"./components":{"types":"./dist/types/components/index.d.ts","import":"./dist/components/index.js"},"./providers":{"types":"./dist/types/providers/index.d.ts","import":"./dist/providers/index.js"},"./hooks":{"types":"./dist/types/hooks/index.d.ts","import":"./dist/hooks/index.js"},"./libs":{"types":"./dist/types/libs/index.d.ts","import":"./dist/libs/index.js"},"./utils":{"types":"./dist/types/utils/index.d.ts","import":"./dist/utils/index.js"},"./context":{"types":"./dist/types/context/index.d.ts","import":"./dist/context/index.js"},"./constants":{"types":"./dist/types/constants/index.d.ts","import":"./dist/constants/index.js"},"./types":{"types":"./dist/types/types/index.d.ts","import":"./dist/types/index.js"},"./fonts.css":"./dist/fonts/fonts.css"},"typesVersions":{"*":{"components":["dist/types/components/index.d.ts"],"providers":["dist/types/providers/index.d.ts"],"hooks":["dist/types/hooks/index.d.ts"],"libs":["dist/types/libs/index.d.ts"],"utils":["dist/types/utils/index.d.ts"],"context":["dist/types/context/index.d.ts"],"constants":["dist/types/constants/index.d.ts"],"types":["dist/types/types/index.d.ts"],"*":["dist/types/index.d.ts"]}},"publishConfig":{"registry":"https://registry.npmjs.org/","access":"public"},"keywords":["cytostyle","cytognosis","react","react-18","vite","figma-make","make-kit","design-system-package","material-ui","mui","components","ltr","english","design-system"],"author":"","license":"ISC","dependencies":{"@emotion/cache":"^11.14.0","@emotion/react":"^11.14.0","@emotion/styled":"^11.14.0","@mui/icons-material":"^6.3.1","@mui/material":"^6.3.1","@mui/system":"^6.3.1","@mui/x-date-pickers":"^7.22.0","@sentry/react":"^9.18.0","@wojtekmaj/react-hooks":"^1.22.0","axios":"^1.12.1","iconsax-react":"^0.0.8","jalaali-js":"^1.2.7","lodash":"^4.17.21","material-react-table":"^3.2.1","persian-number":"^1.6.0","react-date-object":"^2.1.9","react-multi-date-picker":"^4.5.2","stylis":"^4.3.4","stylis-plugin-rtl":"^2.1.1"},"peerDependencies":{"react":"^18.2.0 || ^19.0.0","react-dom":"^18.2.0 || ^19.0.0"},"devDependencies":{"@chromatic-com/storybook":"^5.0.0","@eslint/eslintrc":"^3","@storybook/addon-docs":"^10.2.3","@storybook/addon-onboarding":"^10.2.3","@storybook/react":"^10.2.3","@storybook/react-vite":"^10.2.3","@types/jalaali-js":"^1.1.3","@types/lodash":"^4.17.14","@types/node":"^22.10.7","@types/react":"^18.3.12","@types/react-dom":"^18.3.1","@types/stylis":"^4.2.7","eslint":"^9","eslint-plugin-storybook":"^10.2.3","react":"^18.2.0","react-dom":"^18.2.0","storybook":"^10.2.3","typescript":"^5.7.3","vite":"^6.0.0","esbuild":"^0.25.9"},"eslintConfig":{"extends":["plugin:storybook/recommended"]},"_id":"@alimohammadiwork/cytostyle@1.0.82","_nodeVersion":"22.13.0","_npmVersion":"10.9.2","dist":{"integrity":"sha512-l+ikAN+Cds0Ccwh2fPX9YmSRfuFl3C9O8Ca1iPu/JVATBlb72qjwgIMBFV63VA+dDwCQN06dzeRrP+gY8FqSgA==","shasum":"409b8d7e990c1ee258b4c82bbda5924c8ae4d33c","tarball":"https://registry.npmjs.org/@alimohammadiwork/cytostyle/-/cytostyle-1.0.82.tgz","fileCount":149,"unpackedSize":1092322,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIG/F3cJF11KuzRgN5oZJyoNw1O9rkkfc4xlkRC6iRScxAiBGfJRYWYFa1meIQJ6pHU4OTCcfsQ23cjFJWinn4eaSGQ=="}]},"_npmUser":{"name":"alimohammadiwork","email":"1380ali.mohamadi@gmail.com"},"directories":{},"maintainers":[{"name":"alimohammadiwork","email":"1380ali.mohamadi@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/cytostyle_1.0.82_1783101011629_0.21232201099124204"},"_hasShrinkwrap":false}},"time":{"created":"2026-07-03T17:50:11.510Z","1.0.82":"2026-07-03T17:50:11.842Z","modified":"2026-07-03T17:50:12.090Z"},"maintainers":[{"name":"alimohammadiwork","email":"1380ali.mohamadi@gmail.com"}],"description":"Reusable CytoStyle React and Material UI components, providers, hooks, utilities, and design tokens for Cytognosis products.","keywords":["cytostyle","cytognosis","react","react-18","vite","figma-make","make-kit","design-system-package","material-ui","mui","components","ltr","english","design-system"],"license":"ISC","readme":"# CytoStyle\n\nReusable React components, Material UI theme providers, hooks, utilities, and design tokens for Cytognosis products.\n\nCytoStyle is English-first and LTR by default. Compatibility helpers for Jalali dates and digit normalization remain available where products need them, but the documented product surface is English.\n\n## Installation\n\n```bash\nnpm install @alimohammadiwork/cytostyle\n```\n\nPeer requirements:\n\n```bash\nnpm install react@^18.2.0 react-dom@^18.2.0\n```\n\n## Usage\n\n```tsx\nimport { Button, TextField, ThemeProvider } from \"@alimohammadiwork/cytostyle\";\n```\n\nSubpath imports are available for narrower bundles:\n\n```tsx\nimport { Button, TextField } from \"@alimohammadiwork/cytostyle/components\";\nimport { ThemeProvider, SPAThemeProvider } from \"@alimohammadiwork/cytostyle/providers\";\nimport { createApiRequest } from \"@alimohammadiwork/cytostyle/libs\";\nimport { createQueryParams } from \"@alimohammadiwork/cytostyle/utils\";\nimport { defaultColors } from \"@alimohammadiwork/cytostyle/constants\";\n```\n\n## Theme Providers\n\nFor React single-page applications:\n\n```tsx\nimport { SPAThemeProvider, cytognosisAppColors } from \"@alimohammadiwork/cytostyle\";\n\nexport function AppProviders({ children }: { children: React.ReactNode }) {\n  return (\n    <SPAThemeProvider\n      dir=\"ltr\"\n      locale=\"en\"\n      themeMode=\"light\"\n      appColors={cytognosisAppColors}\n    >\n      {children}\n    </SPAThemeProvider>\n  );\n}\n```\n\nFor Next.js client layouts:\n\n```tsx\n\"use client\";\n\nimport { ThemeProvider, cytognosisAppColors } from \"@alimohammadiwork/cytostyle\";\n\nexport function Providers({ children }: { children: React.ReactNode }) {\n  return (\n    <ThemeProvider\n      dir=\"ltr\"\n      locale=\"en\"\n      themeMode=\"light\"\n      appColors={cytognosisAppColors}\n    >\n      {children}\n    </ThemeProvider>\n  );\n}\n```\n\n## Components\n\n`@alimohammadiwork/cytostyle/components` exports wrappers and custom components including `Button`, `TextField`, `Select`, `Modal`, `Toast`, `MobileDatePicker`, `WheelDatePicker`, `DataGrid`, `MultiSelect`, `OtpInput`, `NumberInput`, `CardNumberInput`, and common Material UI layout primitives.\n\nMost wrapper components accept the corresponding Material UI component props, with additional CytoStyle-specific props documented in Storybook.\n\n## Utilities And Hooks\n\nUtilities are exported from `@alimohammadiwork/cytostyle/utils`, including date conversion helpers, digit normalization, query string creation, iframe messaging, and async helpers.\n\nHooks are exported from `@alimohammadiwork/cytostyle/hooks`, including shared Material UI hooks and CytoStyle helpers such as `useErrorHandler`, `useMessage`, and `useWebOtpListener`.\n\n## Fonts\n\nLoad the bundled font stylesheet once near the app root:\n\n```tsx\nimport \"@alimohammadiwork/cytostyle/fonts.css\";\n```\n\n## Storybook\n\n```bash\nnpm run storybook\n```\n\nStorybook runs on [http://localhost:6006](http://localhost:6006).\n","readmeFilename":"README.md","_rev":"1-55f90b6324d5dcece0d0ac9cbb8f4251"}