Registry / web-framework / unifyedx-storybook-new

unifyedx-storybook-new

JSON →
library0.2.288jsnpmunverified

A modern, accessible React component library (v0.2.288) built with Storybook and Vite. It provides a collection of reusable, WCAG-compliant components including Buttons, Forms, Navigation, Overlays, and Date Pickers, styled with pure CSS. Published frequently via CI/CD, it integrates with Headless UI, Floating UI, Framer Motion, and Syncfusion (ej2) for advanced interactions, and expects React 18+, React Router, and React Toastify. Fully typed with JSDoc for TypeScript projects.

npm install unifyedx-storybook-new
INSTALL
IMPORT
SIG · UNIFYEDX-STORYBOOK
U
unifyedx-storybook-new
web-frameworkjavascriptv0.2.288
harness data pending
Install & Compatibility
Where this runs

No compatibility data collected yet for this library.

Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

Button
import { Button } from 'unifyedx-storybook-new'
const Button = require('unifyedx-storybook-new').Button
ESM-only; CJS require not supported in this version. Named export.
Modal
import { Modal } from 'unifyedx-storybook-new'
import Modal from 'unifyedx-storybook-new'
Default export does not exist; must use named import.
style.css
import 'unifyedx-storybook-new/style.css'
import 'unifyedx-storybook-new/dist/style.css'
CSS file path is unifyedx-storybook-new/style.css, not under dist.
Breadcrumbs
import { Breadcrumbs } from 'unifyedx-storybook-new'
import { Breadcrumbs } from 'unifyedx-storybook-new/Breadcrumbs'
Components are barrel-exported from the main package; subpath imports may not be available.

Demonstrates importing Button, Modal, Input and CSS, and using them in a React component with state.

import React from 'react'; import { Button, Modal, Input } from 'unifyedx-storybook-new'; import 'unifyedx-storybook-new/style.css'; function App() { const [isOpen, setIsOpen] = React.useState(false); const [value, setValue] = React.useState(''); return ( <div> <Button onClick={() => setIsOpen(true)}>Open Modal</Button> <Modal open={isOpen} onClose={() => setIsOpen(false)} title='Example'> <Input value={value} onChange={e => setValue(e.target.value)} placeholder='Type here'/> </Modal> </div> ); } export default App;
Debug
Known issues
breakingPeer dependency @syncfusion/ej2-react-grids:32.1.19 etc. must be exactly that version; mismatches cause runtime errors.
fix
Install exact versions: npm i @syncfusion/ej2-base@32.1.19 @syncfusion/ej2-react-base@32.1.19 @syncfusion/ej2-react-grids@32.1.19 @syncfusion/ej2-react-inputs@32.1.19 @syncfusion/ej2-react-splitbuttons@32.1.19
affects: >=0.0.0
breakingReact 18+ required. React 17 or below will break.
fix
Upgrade to React 18 or 19: npm install react@18 react-dom@18
affects: >=0.0.0
gotchaCSS must be explicitly imported; components have no style otherwise.
fix
Add import 'unifyedx-storybook-new/style.css' at your app entry point.
affects: >=0.0.0
deprecatedSome components may rely on Syncfusion ej2 which has commercial licensing.
fix
Review your use case; evaluate if Syncfusion components require a license.
affects: >=0.0.0
gotchaSubpath imports (e.g., 'unifyedx-storybook-new/Button') are not documented; always import from the main entry.
fix
Use import { Button } from 'unifyedx-storybook-new' instead.
affects: >=0.0.0
Errors
Common errors & fixes
Module not found: Can't resolve 'unifyedx-storybook-new/style.css'
Missing CSS import or incorrect path.
fix
Ensure you do: import 'unifyedx-storybook-new/style.css' (not under dist).
Cannot find module '@syncfusion/ej2-react-grids'
Missing Syncfusion peer dependency.
fix
Install it: npm i @syncfusion/ej2-react-grids@32.1.19
React is not defined
Missing React import in file using JSX when not using automatic runtime.
fix
Add import React from 'react'; at top of file or enable jsx-runtime.
Attempted import error: 'Button' is not exported from 'unifyedx-storybook-new'
Using default import instead of named import.
fix
Use import { Button } from 'unifyedx-storybook-new' instead of import Button from ...
Upgrade
Version history
0.2.288latest on npm
Audit
Dependencies
reactrequiredReact >=18 required as peer dependency
react-domrequiredDOM rendering peer dependency
react-router-domrequiredRequired for navigation components like Breadcrumbs and Sidebar
@headlessui/reactrequiredAccessible primitive components (Modal, Tooltip, etc.)
framer-motionrequiredAnimation library for transitions
@floating-ui/reactrequiredFloating UI positioning for Tooltip, Popover
react-toastifyrequiredToast notification system (v10)
lodashrequiredUtility functions (debounce, etc.)
@syncfusion/ej2-baserequiredSyncfusion base for ej2 components (grids, inputs, etc.)
@syncfusion/ej2-react-baserequiredSyncfusion React wrapper for ej2
@syncfusion/ej2-react-gridsrequiredData grid component
@syncfusion/ej2-react-inputsrequiredSyncfusion input components
@syncfusion/ej2-react-splitbuttonsrequiredSplit button components
Agent activity
4 hits · last 30 days
node
4
Resources
unifyedx-storybook-new — npm install unifyedx-storybook-new · libregistry