@veevarts/design-system 2.27.0 → 2.28.0

package/README.md

@@ -203,6 +203,23 @@ For `mode="datetime"`, the design system does not convert timezones. The consumi
 </HeroUIProvider>
 ```
 
+**Reduced motion (`HeroUIProvider`).** `reducedMotion` defaults to `"user"`: overlays, toasts and every other framer-motion animation follow the OS "reduce motion" setting. HeroUI's own default is `"never"`, which animates regardless. Pass `"always"` to drop them for an app-level preference, or `"never"` to opt out.
+
+```tsx
+<HeroUIProvider reducedMotion={posPrefersStill ? 'always' : 'user'}>
+  {/* ... */}
+</HeroUIProvider>
+```
+
+**Readable toasts (`ToastProvider`).** The `ToastProvider` exported here wraps HeroUI's: same props, same `addToast` queue. Titles wrap instead of truncating to one line, and the animation is off when the OS or the POS (`data-pos-reduce-motion`) asks for reduced motion, unless you pass `disableAnimation`. A `toastProps.classNames.title` you pass is merged after the default. HeroUI replaces the provider `classNames` with a per-toast `addToast({ classNames })` as a whole object, so a per-toast `classNames` without a `title` key truncates that toast again.
+
+```tsx
+<HeroUIProvider>
+  <ToastProvider placement="top-right" />
+  {/* addToast({ title, description }) anywhere below */}
+</HeroUIProvider>
+```
+
 **Table header contrast (`Table`).** Column headers default to `text-default-600` (`text-default-700` on a hovered sortable column) so 12px header text clears 4.5:1 (WCAG 1.4.3). Your classes win: a `classNames.th` color on the table, or a `className` on a `TableColumn`, replaces the default.
 
 For complete HeroUI documentation, visit: [HeroUI Storybook](https://storybook.heroui.com/)