@veevarts/design-system 2.1.0-beta.23 → 2.1.0-beta.24

package/dist/patterns/EntityRow/EntityList.d.ts

@@ -5,5 +5,11 @@ export declare const EntityList: React.FC<EntityListProps>;
  * The list in skeleton form, at the same row height so nothing shifts when the
  * rows arrive. The placeholder rows are hidden from assistive tech; `label` is
  * announced once through a `role="status"` region instead.
+ *
+ * The root is `aria-busy`: the area is loading. `role="status"` stays on the
+ * label, not on the root, so the live region itself is never busy, which would
+ * let a screen reader hold its announcement back.
+ *
+ * The bars are the DS `Skeleton`, so their shimmer stops under reduced motion.
  */
 export declare const EntityListSkeleton: React.FC<EntityListSkeletonProps>;

package/dist/providers/ToastProvider.d.ts

@@ -4,13 +4,18 @@ export type ToastProviderProps = ComponentProps<typeof BaseToastProvider>;
 /**
  * Drop-in for HeroUI's `ToastProvider` (same props, same `addToast` queue).
  *
- * - Titles wrap instead of truncating. A `toastProps.classNames.title` you pass
- *   is merged after the default, so it can still restyle the title.
+ * - Titles wrap instead of truncating.
+ * - From `sm` up the toast takes the width its text needs, between 356px and
+ *   `min(32rem, 100vw - 11rem)`, so it keeps up with a larger root font size.
+ * - The close button sits inside the toast, beside the title, always visible,
+ *   as a 44px target.
+ * - A `toastProps.classNames` you pass is merged after these defaults, slot by
+ *   slot, so it can still restyle any of them.
  * - Animation is off when the OS or the POS asks for reduced motion, unless
  *   `disableAnimation` is passed.
  *
  * HeroUI merges an `addToast({ classNames })` over the provider's `classNames`
- * as a whole object, so a per-toast `classNames` without a `title` key brings
- * the truncation back for that toast.
+ * as a whole object, so a per-toast `classNames` drops these defaults for that
+ * toast: its title truncates again and its close button floats on the corner.
  */
 export declare function ToastProvider({ toastProps, disableAnimation, ...props }: ToastProviderProps): JSX.Element;

package/dist/test/reducedMotionCss.d.ts

@@ -0,0 +1,40 @@
+/**
+ * Story helpers for checking a `motion-reduce:` utility in a real browser without changing the
+ * browser's media.
+ *
+ * A page cannot turn `prefers-reduced-motion` on for itself, and emulating it through the
+ * runner's CDP session changes the whole page, which Vitest shares between story files running
+ * in parallel: another story measuring its own animation in that window would read `none`. So
+ * the reduced-motion half is proved from the page's compiled CSS instead, which is what the
+ * browser applies anyway:
+ *
+ * 1. the element carries the still class;
+ * 2. that class sets `animation-name: none` inside `@media (prefers-reduced-motion: reduce)`;
+ * 3. it comes later in the stylesheet than the rule that starts the animation. Both are one class
+ *    (plus the same pseudo-element), so at equal specificity the later rule wins.
+ *
+ * The motion-allowed half is read straight off `getComputedStyle`.
+ */
+export interface ReducedMotionCascade {
+    /** The element carries both classes. */
+    carriesBoth: boolean;
+    /** `animation-name` of the rule that starts the motion (e.g. `shimmer`), or `undefined`. */
+    movingAnimation: string | undefined;
+    /** `animation-name` the still class sets under reduced motion (`none`), or `undefined`. */
+    stillAnimation: string | undefined;
+    /** The still rule is later in the cascade than the moving one, so it wins. */
+    stillComesLater: boolean;
+}
+/**
+ * What the stylesheets say happens to `movingClass`'s animation on `element` (or its `pseudo`)
+ * when the OS asks for reduced motion and `stillClass` is the utility meant to stop it.
+ */
+export declare function reducedMotionCascade(element: Element, { movingClass, stillClass, pseudo }: {
+    movingClass: string;
+    stillClass: string;
+    pseudo?: '' | '::before';
+}): ReducedMotionCascade;
+/** Whether the reader's OS currently asks for reduced motion (the Storybook UI is theirs). */
+export declare function osReducesMotion(): boolean;
+/** The `animation-name` running on an element's `::before`, where HeroUI draws the skeleton shimmer. */
+export declare function beforeAnimationName(element: Element): string;

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@veevarts/design-system",
     "private": false,
-    "version": "2.1.0-beta.23",
+    "version": "2.1.0-beta.24",
     "type": "module",
     "main": "dist/index.js",
     "module": "dist/index.js",