@_linked/primitives 1.0.9 → 1.2.0

package/lib/esm/components/TruncatedText.module.css

@@ -0,0 +1,162 @@
+@import './helpers/mixins.css';
+@import '@_linked/css/package.css';
+
+/* ============================================================================
+   TruncatedText.module.css
+
+   Truncated text component with hover popover for full content.
+   Uses semantic tokens from theme.css.
+   ============================================================================ */
+
+/* === Truncated Text Trigger === */
+.truncatedText {
+  cursor: help;
+  border-bottom: 1px dotted var(--truncated-text-gray-400, var(--color-gray-400));
+}
+
+/* === Hover Card Content === */
+.hoverContent {
+  background-color: var(--surface-bg);
+  border: 1px solid var(--surface-border);
+  border-radius: var(--radius-field);
+  box-shadow: var(--surface-shadow);
+  padding: var(--space-sm);
+  max-width: 400px;
+  min-width: 200px;
+  z-index: 1000;
+}
+
+/* === Content Wrapper === */
+.contentWrapper {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-xs);
+}
+
+/* === Scroll Area === */
+.scrollArea {
+  max-height: 150px;
+  overflow-y: auto;
+}
+
+/* === Full Text === */
+.fullText {
+  font-size: var(--typography-small-size);
+  color: var(--text-primary);
+  line-height: 1.5;
+  margin: 0;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+/* === Copy Button Wrapper === */
+.copyButtonWrapper {
+  display: flex;
+  justify-content: flex-end;
+  border-top: 1px solid var(--surface-border);
+  padding-top: var(--space-xs);
+  margin-top: var(--space-xs);
+}
+
+/* === Copy Button === */
+.copyButton {
+  color: var(--truncated-text-tertiary-500, var(--color-tertiary-500)) !important;
+  padding: var(--space-xs) !important;
+}
+
+.copyButton:hover {
+  color: var(--truncated-text-tertiary-600, var(--color-tertiary-600)) !important;
+  background-color: color-mix(
+    in srgb,
+    var(--truncated-text-tertiary-500, var(--color-tertiary-500)) 12%,
+    transparent
+  ) !important;
+}
+
+/* === Arrow === */
+.arrow {
+  fill: var(--surface-bg);
+}
+
+/* ============================================================================
+   Mobile Dialog Styles
+   ============================================================================ */
+
+.dialogContent {
+  max-width: 90vw;
+  width: 400px;
+  background-color: var(--surface-bg);
+  border: 1px solid var(--surface-border);
+}
+
+.dialogBody {
+  padding: var(--space-sm) 0;
+  color: var(--text-primary);
+}
+
+.dialogFooter {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  padding-top: var(--space-xs);
+  border-top: 1px solid var(--surface-border);
+}
+
+/* ============================================================================
+   Dark Mode
+   ============================================================================ */
+
+[data-theme='dark'] .truncatedText {
+  border-bottom-color: var(--truncated-text-gray-500, var(--color-gray-500));
+}
+
+[data-theme='dark'] .hoverContent {
+  background-color: var(--surface-bg);
+  border-color: var(--surface-border);
+}
+
+/* .fullText uses --text-primary which auto-adjusts for dark mode */
+
+[data-theme='dark'] .copyButtonWrapper {
+  border-top-color: var(--surface-border);
+}
+
+[data-theme='dark'] .copyButton {
+  color: var(--truncated-text-tertiary-400, var(--color-tertiary-400)) !important;
+}
+
+[data-theme='dark'] .copyButton:hover {
+  color: var(--truncated-text-tertiary-300, var(--color-tertiary-300)) !important;
+  background-color: color-mix(
+    in srgb,
+    var(--truncated-text-tertiary-500, var(--color-tertiary-500)) 15%,
+    transparent
+  ) !important;
+}
+
+[data-theme='dark'] .arrow {
+  fill: var(--surface-bg);
+}
+
+[data-theme='dark'] .dialogContent {
+  background-color: var(--surface-bg);
+  border-color: var(--surface-border);
+}
+
+/* .dialogBody uses --text-primary which auto-adjusts for dark mode */
+
+[data-theme='dark'] .dialogFooter {
+  border-top-color: var(--surface-border);
+}
+
+/* Dialog close button in dark mode */
+[data-theme='dark'] .dialogContent button[aria-label="Close"],
+[data-theme='dark'] .dialogContent [class*="Close"] {
+  color: var(--truncated-text-gray-400, var(--color-gray-400));
+}
+
+[data-theme='dark'] .dialogContent button[aria-label="Close"]:hover,
+[data-theme='dark'] .dialogContent [class*="Close"]:hover {
+  color: var(--truncated-text-gray-200, var(--color-gray-200));
+  background-color: var(--truncated-text-gray-700, var(--color-gray-700));
+}

package/lib/esm/hooks/useReducedMotion.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Whether the viewer has asked for reduced motion.
+ *
+ * Plain `matchMedia`, deliberately: this is the one piece of the motion story that every
+ * component needs and that carries no dependency, so it lives here rather than travelling
+ * with an animation library.
+ *
+ * Starts `false` and corrects on mount. Server-rendered markup cannot know the preference,
+ * and rendering the still version first would flash into motion for everyone else; erring
+ * toward motion and stopping it is the less disruptive order.
+ */
+export declare function useReducedMotion(): boolean;

package/lib/esm/hooks/useReducedMotion.js

@@ -0,0 +1,32 @@
+import { useEffect, useState } from 'react';
+/**
+ * Whether the viewer has asked for reduced motion.
+ *
+ * Plain `matchMedia`, deliberately: this is the one piece of the motion story that every
+ * component needs and that carries no dependency, so it lives here rather than travelling
+ * with an animation library.
+ *
+ * Starts `false` and corrects on mount. Server-rendered markup cannot know the preference,
+ * and rendering the still version first would flash into motion for everyone else; erring
+ * toward motion and stopping it is the less disruptive order.
+ */
+export function useReducedMotion() {
+    const [reduced, setReduced] = useState(false);
+    useEffect(() => {
+        if (typeof window === 'undefined' || !window.matchMedia)
+            return;
+        const query = window.matchMedia('(prefers-reduced-motion: reduce)');
+        setReduced(query.matches);
+        const onChange = (event) => setReduced(event.matches);
+        // `addEventListener` on MediaQueryList is not in older Safari; both are kept because a
+        // component library cannot choose its host browser.
+        if (query.addEventListener) {
+            query.addEventListener('change', onChange);
+            return () => query.removeEventListener('change', onChange);
+        }
+        query.addListener(onChange);
+        return () => query.removeListener(onChange);
+    }, []);
+    return reduced;
+}
+//# sourceMappingURL=useReducedMotion.js.map

package/lib/esm/hooks/useReducedMotion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useReducedMotion.js","sourceRoot":"","sources":["../../../src/hooks/useReducedMotion.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,QAAQ,EAAC,MAAM,OAAO,CAAC;AAE1C;;;;;;;;;;GAUG;AACH,MAAM,UAAU,gBAAgB;IAC9B,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9C,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,CAAC,MAAM,CAAC,UAAU;YAAE,OAAO;QAChE,MAAM,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC,kCAAkC,CAAC,CAAC;QACpE,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAC1B,MAAM,QAAQ,GAAG,CAAC,KAA0B,EAAE,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAC3E,uFAAuF;QACvF,oDAAoD;QACpD,IAAI,KAAK,CAAC,gBAAgB,EAAE,CAAC;YAC3B,KAAK,CAAC,gBAAgB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;YAC3C,OAAO,GAAG,EAAE,CAAC,KAAK,CAAC,mBAAmB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;QAC7D,CAAC;QACD,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;QAC5B,OAAO,GAAG,EAAE,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;IAC9C,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,OAAO,CAAC;AACjB,CAAC"}

package/lib/esm/index.d.ts

@@ -1,6 +1,7 @@
 import './theme.css';
 import './types.js';
 import './ontologies/primitives.js';
+import './components/Badge.js';
 import './components/Button.js';
 import './components/Input.js';
 import './components/Tabs.js';
@@ -34,6 +35,10 @@ import './components/NavigationMenu.js';
 import './components/Menubar.js';
 import './components/MultiSelect.js';
 import './components/Spinner.js';
+import './components/ConfirmDialog.js';
+import './components/SkeletonLoader.js';
+import './components/ImageThumb.js';
+import './components/TruncatedText.js';
 import './components/Breadcrumb.js';
 import './components/Drawer.js';
 import './components/IconButton.js';
@@ -43,3 +48,4 @@ import './components/Form.js';
 import './components/Toolbar.js';
 import './components/VisuallyHidden.js';
 import './hooks/use-toast.js';
+export * from './motion.js';

package/lib/esm/index.js

@@ -4,6 +4,7 @@ import './ontologies/primitives.js';
 //SHAPES FIRST
 // import './shapes/YourShape.js';
 //THEN COMPONENTS
+import './components/Badge.js';
 import './components/Button.js';
 import './components/Input.js';
 import './components/Tabs.js';
@@ -37,6 +38,10 @@ import './components/NavigationMenu.js';
 import './components/Menubar.js';
 import './components/MultiSelect.js';
 import './components/Spinner.js';
+import './components/ConfirmDialog.js';
+import './components/SkeletonLoader.js';
+import './components/ImageThumb.js';
+import './components/TruncatedText.js';
 import './components/Breadcrumb.js';
 import './components/Drawer.js';
 import './components/IconButton.js';
@@ -46,4 +51,7 @@ import './components/Form.js';
 import './components/Toolbar.js';
 import './components/VisuallyHidden.js';
 import './hooks/use-toast.js';
+// The motion presets. Reachable from the entry point so tsc emits them: this package's
+// tsconfig compiles what `index.ts` reaches, not the whole src tree.
+export * from './motion.js';
 //# sourceMappingURL=index.js.map

package/lib/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAC;AACrB,OAAO,YAAY,CAAC;AACpB,OAAO,4BAA4B,CAAC;AAEpC,cAAc;AACd,kCAAkC;AAElC,iBAAiB;AACjB,OAAO,wBAAwB,CAAC;AAChC,OAAO,uBAAuB,CAAC;AAC/B,OAAO,sBAAsB,CAAC;AAC9B,OAAO,wBAAwB,CAAC;AAChC,OAAO,0BAA0B,CAAC;AAClC,OAAO,4BAA4B,CAAC;AACpC,OAAO,wBAAwB,CAAC;AAChC,OAAO,uBAAuB,CAAC;AAC/B,OAAO,2BAA2B,CAAC;AACnC,OAAO,wBAAwB,CAAC;AAChC,OAAO,6BAA6B,CAAC;AACrC,OAAO,0BAA0B,CAAC;AAClC,OAAO,2BAA2B,CAAC;AACnC,OAAO,2BAA2B,CAAC;AACnC,OAAO,6BAA6B,CAAC;AACrC,OAAO,4BAA4B,CAAC;AACpC,OAAO,sBAAsB,CAAC;AAC9B,OAAO,yBAAyB,CAAC;AACjC,OAAO,6BAA6B,CAAC;AACrC,OAAO,wBAAwB,CAAC;AAChC,OAAO,4BAA4B,CAAC;AACpC,OAAO,yBAAyB,CAAC;AACjC,OAAO,yBAAyB,CAAC;AACjC,OAAO,wBAAwB,CAAC;AAChC,OAAO,6BAA6B,CAAC;AACrC,OAAO,wBAAwB,CAAC;AAChC,OAAO,uBAAuB,CAAC;AAC/B,OAAO,yBAAyB,CAAC;AACjC,OAAO,0BAA0B,CAAC;AAClC,OAAO,gCAAgC,CAAC;AACxC,OAAO,yBAAyB,CAAC;AACjC,OAAO,6BAA6B,CAAC;AACrC,OAAO,yBAAyB,CAAC;AACjC,OAAO,4BAA4B,CAAC;AACpC,OAAO,wBAAwB,CAAC;AAChC,OAAO,4BAA4B,CAAC;AACpC,OAAO,8BAA8B,CAAC;AACtC,OAAO,6BAA6B,CAAC;AACrC,OAAO,sBAAsB,CAAC;AAC9B,OAAO,yBAAyB,CAAC;AACjC,OAAO,gCAAgC,CAAC;AAExC,OAAO,sBAAsB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAC;AACrB,OAAO,YAAY,CAAC;AACpB,OAAO,4BAA4B,CAAC;AAEpC,cAAc;AACd,kCAAkC;AAElC,iBAAiB;AACjB,OAAO,uBAAuB,CAAC;AAC/B,OAAO,wBAAwB,CAAC;AAChC,OAAO,uBAAuB,CAAC;AAC/B,OAAO,sBAAsB,CAAC;AAC9B,OAAO,wBAAwB,CAAC;AAChC,OAAO,0BAA0B,CAAC;AAClC,OAAO,4BAA4B,CAAC;AACpC,OAAO,wBAAwB,CAAC;AAChC,OAAO,uBAAuB,CAAC;AAC/B,OAAO,2BAA2B,CAAC;AACnC,OAAO,wBAAwB,CAAC;AAChC,OAAO,6BAA6B,CAAC;AACrC,OAAO,0BAA0B,CAAC;AAClC,OAAO,2BAA2B,CAAC;AACnC,OAAO,2BAA2B,CAAC;AACnC,OAAO,6BAA6B,CAAC;AACrC,OAAO,4BAA4B,CAAC;AACpC,OAAO,sBAAsB,CAAC;AAC9B,OAAO,yBAAyB,CAAC;AACjC,OAAO,6BAA6B,CAAC;AACrC,OAAO,wBAAwB,CAAC;AAChC,OAAO,4BAA4B,CAAC;AACpC,OAAO,yBAAyB,CAAC;AACjC,OAAO,yBAAyB,CAAC;AACjC,OAAO,wBAAwB,CAAC;AAChC,OAAO,6BAA6B,CAAC;AACrC,OAAO,wBAAwB,CAAC;AAChC,OAAO,uBAAuB,CAAC;AAC/B,OAAO,yBAAyB,CAAC;AACjC,OAAO,0BAA0B,CAAC;AAClC,OAAO,gCAAgC,CAAC;AACxC,OAAO,yBAAyB,CAAC;AACjC,OAAO,6BAA6B,CAAC;AACrC,OAAO,yBAAyB,CAAC;AACjC,OAAO,+BAA+B,CAAC;AACvC,OAAO,gCAAgC,CAAC;AACxC,OAAO,4BAA4B,CAAC;AACpC,OAAO,+BAA+B,CAAC;AACvC,OAAO,4BAA4B,CAAC;AACpC,OAAO,wBAAwB,CAAC;AAChC,OAAO,4BAA4B,CAAC;AACpC,OAAO,8BAA8B,CAAC;AACtC,OAAO,6BAA6B,CAAC;AACrC,OAAO,sBAAsB,CAAC;AAC9B,OAAO,yBAAyB,CAAC;AACjC,OAAO,gCAAgC,CAAC;AAExC,OAAO,sBAAsB,CAAC;AAE9B,uFAAuF;AACvF,qEAAqE;AACrE,cAAc,aAAa,CAAC"}

package/lib/esm/motion.d.ts

@@ -0,0 +1,219 @@
+/**
+ * Motion presets.
+ *
+ * Design tokens that happen to be objects rather than CSS custom properties, because that is
+ * the shape an animation library consumes. Same purpose as a colour token: one definition of
+ * "how a list staggers in", so two surfaces cannot disagree about it.
+ *
+ * This module imports **nothing**, not even types. Every export is a plain object whose type
+ * is inferred, and an inferred object literal is structurally assignable to `framer-motion`'s
+ * `Variants` and `Transition` at the point of use — so a consumer gets full checking without
+ * this package depending on the animation library at all.
+ *
+ * That matters more than it looks. Naming the types here would mean a devDependency to build
+ * and a peer to consume, which is how the workspace ended up with two copies of
+ * `framer-motion` and presets from one that were not assignable to the other. A library that
+ * animates with CSS should not carry an animation library so it can describe some constants.
+ */
+import { useReducedMotion } from './hooks/useReducedMotion.js';
+/**
+ * Shared animation variants for consistent motion across the app
+ */
+export declare const fadeInUp: {
+    initial: {
+        opacity: number;
+        y: number;
+    };
+    animate: {
+        opacity: number;
+        y: number;
+    };
+    exit: {
+        opacity: number;
+        y: number;
+    };
+};
+export declare const fadeIn: {
+    initial: {
+        opacity: number;
+    };
+    animate: {
+        opacity: number;
+    };
+    exit: {
+        opacity: number;
+    };
+};
+export declare const scaleIn: {
+    initial: {
+        opacity: number;
+        scale: number;
+    };
+    animate: {
+        opacity: number;
+        scale: number;
+    };
+    exit: {
+        opacity: number;
+        scale: number;
+    };
+};
+export declare const slideInRight: {
+    initial: {
+        x: number;
+        opacity: number;
+    };
+    animate: {
+        x: number;
+        opacity: number;
+    };
+    exit: {
+        x: number;
+        opacity: number;
+    };
+};
+/**
+ * Easing and transition configurations
+ */
+/**
+ * A cubic-bezier easing: the four control points, as a tuple.
+ *
+ * The tuple type is load-bearing. Written inline, `[0.16, 1, 0.3, 1]` infers as `number[]`,
+ * which is not assignable to an animation library's easing type — it wants exactly four
+ * numbers. Naming it once fixes that and stops the curve being retyped at each use.
+ */
+export type Easing = [number, number, number, number];
+/** The shared ease-out curve. Decelerates hard at the end, so motion settles rather than stops. */
+export declare const EASE_OUT_CURVE: Easing;
+export declare const spring: {
+    type: string;
+    stiffness: number;
+    damping: number;
+};
+export declare const easeOut: {
+    duration: number;
+    ease: Easing;
+};
+export declare const easeSlow: {
+    duration: number;
+    ease: Easing;
+};
+/**
+ * Stagger animation configurations
+ */
+export declare const staggerContainer: {
+    animate: {
+        transition: {
+            staggerChildren: number;
+        };
+    };
+};
+export declare const staggerItem: {
+    initial: {
+        opacity: number;
+        y: number;
+    };
+    animate: {
+        opacity: number;
+        y: number;
+    };
+};
+/**
+ * Slower stagger for table rows - more subtle and elegant
+ */
+export declare const tableStaggerContainer: {
+    animate: {
+        transition: {
+            staggerChildren: number;
+            delayChildren: number;
+        };
+    };
+};
+export declare const tableRowItem: {
+    initial: {
+        opacity: number;
+        y: number;
+    };
+    animate: {
+        opacity: number;
+        y: number;
+        transition: {
+            duration: number;
+            ease: Easing;
+        };
+    };
+};
+/**
+ * Stagger for card grids - elegant cascade effect
+ */
+export declare const cardGridContainer: {
+    hidden: {
+        opacity: number;
+    };
+    visible: {
+        opacity: number;
+        transition: {
+            staggerChildren: number;
+            delayChildren: number;
+        };
+    };
+};
+export declare const cardGridItem: {
+    hidden: {
+        opacity: number;
+        y: number;
+        scale: number;
+    };
+    visible: {
+        opacity: number;
+        y: number;
+        scale: number;
+        transition: {
+            duration: number;
+            ease: Easing;
+        };
+    };
+};
+/**
+ * Stagger for list items - subtle slide-in effect
+ */
+export declare const listContainer: {
+    hidden: {
+        opacity: number;
+    };
+    visible: {
+        opacity: number;
+        transition: {
+            staggerChildren: number;
+            delayChildren: number;
+        };
+    };
+};
+export declare const listItem: {
+    hidden: {
+        opacity: number;
+        x: number;
+    };
+    visible: {
+        opacity: number;
+        x: number;
+        transition: {
+            duration: number;
+            ease: Easing;
+        };
+    };
+};
+/**
+ * Re-exported so a component reaching for the motion presets does not have to know that the
+ * preference hook lives elsewhere. It carries no animation dependency of its own.
+ */
+export { useReducedMotion };
+/**
+ * Get appropriate transition based on reduced motion preference
+ */
+export declare const getTransition: (reducedMotion: boolean) => {
+    duration: number;
+    ease: Easing;
+} | {
+    duration: number;
+};

package/lib/esm/motion.js

@@ -0,0 +1,154 @@
+/**
+ * Motion presets.
+ *
+ * Design tokens that happen to be objects rather than CSS custom properties, because that is
+ * the shape an animation library consumes. Same purpose as a colour token: one definition of
+ * "how a list staggers in", so two surfaces cannot disagree about it.
+ *
+ * This module imports **nothing**, not even types. Every export is a plain object whose type
+ * is inferred, and an inferred object literal is structurally assignable to `framer-motion`'s
+ * `Variants` and `Transition` at the point of use — so a consumer gets full checking without
+ * this package depending on the animation library at all.
+ *
+ * That matters more than it looks. Naming the types here would mean a devDependency to build
+ * and a peer to consume, which is how the workspace ended up with two copies of
+ * `framer-motion` and presets from one that were not assignable to the other. A library that
+ * animates with CSS should not carry an animation library so it can describe some constants.
+ */
+import { useReducedMotion } from './hooks/useReducedMotion.js';
+/**
+ * Shared animation variants for consistent motion across the app
+ */
+// Fade animations
+export const fadeInUp = {
+    initial: { opacity: 0, y: 20 },
+    animate: { opacity: 1, y: 0 },
+    exit: { opacity: 0, y: -20 },
+};
+export const fadeIn = {
+    initial: { opacity: 0 },
+    animate: { opacity: 1 },
+    exit: { opacity: 0 },
+};
+export const scaleIn = {
+    initial: { opacity: 0, scale: 0.95 },
+    animate: { opacity: 1, scale: 1 },
+    exit: { opacity: 0, scale: 0.95 },
+};
+export const slideInRight = {
+    initial: { x: -20, opacity: 0 },
+    animate: { x: 0, opacity: 1 },
+    exit: { x: -20, opacity: 0 },
+};
+/** The shared ease-out curve. Decelerates hard at the end, so motion settles rather than stops. */
+export const EASE_OUT_CURVE = [0.16, 1, 0.3, 1];
+export const spring = {
+    type: 'spring',
+    stiffness: 300,
+    damping: 30,
+};
+export const easeOut = {
+    duration: 0.2,
+    ease: EASE_OUT_CURVE,
+};
+export const easeSlow = {
+    duration: 0.3,
+    ease: EASE_OUT_CURVE,
+};
+/**
+ * Stagger animation configurations
+ */
+export const staggerContainer = {
+    animate: {
+        transition: {
+            staggerChildren: 0.05,
+        },
+    },
+};
+export const staggerItem = {
+    initial: { opacity: 0, y: 10 },
+    animate: { opacity: 1, y: 0 },
+};
+/**
+ * Slower stagger for table rows - more subtle and elegant
+ */
+export const tableStaggerContainer = {
+    animate: {
+        transition: {
+            staggerChildren: 0.08,
+            delayChildren: 0.1,
+        },
+    },
+};
+export const tableRowItem = {
+    initial: { opacity: 0, y: 8 },
+    animate: {
+        opacity: 1,
+        y: 0,
+        transition: {
+            duration: 0.35,
+            ease: EASE_OUT_CURVE,
+        },
+    },
+};
+/**
+ * Stagger for card grids - elegant cascade effect
+ */
+export const cardGridContainer = {
+    hidden: { opacity: 0 },
+    visible: {
+        opacity: 1,
+        transition: {
+            staggerChildren: 0.04,
+            delayChildren: 0.05,
+        },
+    },
+};
+export const cardGridItem = {
+    hidden: { opacity: 0, y: 12, scale: 0.98 },
+    visible: {
+        opacity: 1,
+        y: 0,
+        scale: 1,
+        transition: {
+            duration: 0.3,
+            ease: EASE_OUT_CURVE,
+        },
+    },
+};
+/**
+ * Stagger for list items - subtle slide-in effect
+ */
+export const listContainer = {
+    hidden: { opacity: 0 },
+    visible: {
+        opacity: 1,
+        transition: {
+            staggerChildren: 0.03,
+            delayChildren: 0.02,
+        },
+    },
+};
+export const listItem = {
+    hidden: { opacity: 0, x: -8 },
+    visible: {
+        opacity: 1,
+        x: 0,
+        transition: {
+            duration: 0.25,
+            ease: EASE_OUT_CURVE,
+        },
+    },
+};
+/**
+ * Re-exported so a component reaching for the motion presets does not have to know that the
+ * preference hook lives elsewhere. It carries no animation dependency of its own.
+ */
+export { useReducedMotion };
+/**
+ * Get appropriate transition based on reduced motion preference
+ */
+export const getTransition = (reducedMotion) => {
+    return reducedMotion ? { duration: 0 } : easeOut;
+};
+//# sourceMappingURL=motion.js.map

package/lib/esm/motion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.js","sourceRoot":"","sources":["../../src/motion.ts"],"names":[],"mappings":"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"}

package/lib/esm/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@_linked/primitives",
-  "description": "lincd-primitives is a UI library based on Radix UI",
+  "description": "A UI component library: a headless behaviour source (Radix UI, cmdk, vaul, or hand-written) plus a CSS module reading @_linked/css design tokens — and no knowledge of data, of shapes, or of any particular application.",
   "author": {
     "name": "",
     "email": "",
@@ -8,9 +8,9 @@
   },
   "repository": {
     "type": "git",
-    "url": ""
+    "url": "git+https://github.com/linked-cm/primitives.git"
   },
-  "version": "1.0.9",
+  "version": "1.2.0",
   "linkedPackage": true,
   "license": "ISC",
   "scripts": {
@@ -70,11 +70,11 @@
     "@_linked/cli": "^1.2",
     "@changesets/changelog-github": "^0.5.2",
     "@changesets/cli": "^2.29.8",
+    "copyfiles": "^2.4.1",
+    "rimraf": "^5.0.7",
     "tsconfig-to-dual-package": "^1.2.0",
     "typescript": "^5.7.3",
-    "typescript-plugin-css-modules": "^5.1.0",
-    "rimraf": "^5.0.7",
-    "copyfiles": "^2.4.1"
+    "typescript-plugin-css-modules": "^5.1.0"
   },
   "typesVersions": {
     "*": {