@saasflare/ui 3.0.1 → 3.1.0

package/dist/chunk-DNLCSV5M.js

@@ -0,0 +1,151 @@
+"use client";
+'use strict';
+
+var chunkFT66KYRN_js = require('./chunk-FT66KYRN.js');
+var chunkD5LKWKG7_js = require('./chunk-D5LKWKG7.js');
+var lucideReact = require('lucide-react');
+var react = require('motion/react');
+var classVarianceAuthority = require('class-variance-authority');
+var Slot = require('@radix-ui/react-slot');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var Slot__namespace = /*#__PURE__*/_interopNamespace(Slot);
+
+var MotionSlot = react.m.create(Slot__namespace.Root);
+var LEGACY_VARIANT_MAP = {
+  default: { variant: "solid", intent: "primary" },
+  destructive: { variant: "solid", intent: "danger" },
+  secondary: { variant: "soft", intent: "neutral" }
+};
+var buttonVariants = classVarianceAuthority.cva(
+  "inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+  {
+    variants: {
+      variant: {
+        solid: "bg-[var(--intent)] text-[var(--intent-fg)] shadow-xs hover:brightness-110 dark:hover:brightness-125",
+        soft: "bg-[var(--intent)]/15 text-[var(--intent)] hover:bg-[var(--intent)]/25 dark:bg-[var(--intent)]/20 dark:hover:bg-[var(--intent)]/30",
+        outline: "border border-[var(--intent)]/30 text-[var(--intent)] shadow-xs hover:bg-[var(--intent)]/10 dark:border-[var(--intent)]/40 dark:hover:bg-[var(--intent)]/15",
+        ghost: "text-[var(--intent)] hover:bg-[var(--intent)]/10 dark:hover:bg-[var(--intent)]/15",
+        link: "text-[var(--intent)] underline-offset-4 hover:underline",
+        glass: "bg-[var(--glass-bg)] text-[var(--intent)] border border-[var(--glass-border)] backdrop-blur-lg shadow-[var(--glass-shadow)] hover:bg-[var(--glass-bg-hover)] hover:border-[var(--glass-border-hover)]",
+        shadow: "bg-[var(--intent)] text-[var(--intent-fg)] shadow-[var(--btn-shadow)] hover:shadow-[var(--btn-shadow-hover)] hover:brightness-110 dark:hover:brightness-125"
+      },
+      size: {
+        xs: "h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
+        sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5",
+        md: "h-9 px-4 py-2 has-[>svg]:px-3",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        xl: "h-12 rounded-lg px-8 text-base has-[>svg]:px-5 [&_svg:not([class*='size-'])]:size-5",
+        icon: "size-9",
+        "icon-xs": "size-6 rounded-md [&_svg:not([class*='size-'])]:size-3",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10"
+      }
+    },
+    defaultVariants: {
+      variant: "solid",
+      size: "md"
+    }
+  }
+);
+function Button({
+  className,
+  variant: variantProp,
+  size = "md",
+  intent: intentProp = "primary",
+  asChild = false,
+  loading = false,
+  fullWidth = false,
+  surface,
+  radius,
+  animated,
+  disabled,
+  children,
+  ...props
+}) {
+  const sf = chunkD5LKWKG7_js.useSaasflareProps({ surface, radius, animated });
+  const motion = chunkFT66KYRN_js.useSaasflareMotion(sf.animated, chunkFT66KYRN_js.spring, disabled ?? false, loading);
+  const effectiveVariant = variantProp ?? (sf.surface === "glass" ? "glass" : "solid");
+  let resolvedVariant = effectiveVariant;
+  let resolvedIntent = intentProp;
+  const legacy = LEGACY_VARIANT_MAP[effectiveVariant];
+  if (legacy) {
+    resolvedVariant = legacy.variant;
+    if (legacy.intent) {
+      resolvedIntent = legacy.intent;
+    }
+  }
+  if (asChild) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      MotionSlot,
+      {
+        ...props,
+        "data-slot": "button",
+        "data-variant": resolvedVariant,
+        "data-intent": resolvedIntent,
+        "data-size": size,
+        "data-surface": sf.surface,
+        "data-radius": sf.radius,
+        "data-animated": String(sf.animated),
+        whileHover: motion.disabled ? void 0 : { scale: 1.02 },
+        whileTap: motion.disabled ? void 0 : { scale: 0.97 },
+        transition: motion.transition,
+        className: chunkD5LKWKG7_js.cn(
+          buttonVariants({ variant: resolvedVariant, size }),
+          fullWidth && "w-full",
+          className
+        ),
+        children
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    react.m.button,
+    {
+      "data-slot": "button",
+      "data-variant": resolvedVariant,
+      "data-intent": resolvedIntent,
+      "data-size": size,
+      "data-surface": sf.surface,
+      "data-radius": sf.radius,
+      "data-animated": String(sf.animated),
+      whileHover: motion.disabled ? void 0 : { scale: 1.02 },
+      whileTap: motion.disabled ? void 0 : { scale: 0.97 },
+      transition: motion.transition,
+      className: chunkD5LKWKG7_js.cn(
+        buttonVariants({ variant: resolvedVariant, size }),
+        fullWidth && "w-full",
+        className
+      ),
+      disabled,
+      "aria-busy": loading || void 0,
+      "aria-disabled": disabled || void 0,
+      ...props,
+      children: [
+        loading && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2Icon, { className: "animate-spin", "aria-hidden": "true" }),
+        children
+      ]
+    }
+  );
+}
+
+exports.Button = Button;
+exports.buttonVariants = buttonVariants;

package/dist/{chunk-W53NTFPB.mjs → chunk-EJHYM2HP.mjs}

@@ -1,18 +1,4 @@
-"use client";
-import * as React from 'react';
-
-// src/hooks/use-reduced-motion.ts
-var QUERY = "(prefers-reduced-motion: reduce)";
-var subscribe = (cb) => {
-  const mql = window.matchMedia(QUERY);
-  mql.addEventListener("change", cb);
-  return () => mql.removeEventListener("change", cb);
-};
-var getSnapshot = () => window.matchMedia(QUERY).matches;
-var getServerSnapshot = () => false;
-function useReducedMotion() {
-  return React.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
-}
+import { useReducedMotion } from './chunk-WRONFPRI.mjs';
 
 // src/components/ui/motion-config.ts
 var spring = { type: "spring", stiffness: 400, damping: 25 };
@@ -24,5 +10,10 @@ var fadeIn = { initial: { opacity: 0 }, animate: { opacity: 1 } };
 var scaleIn = { initial: { opacity: 0, scale: 0.95 }, animate: { opacity: 1, scale: 1 } };
 var slideUp = { initial: { opacity: 0, y: 8 }, animate: { opacity: 1, y: 0 } };
 var slideDown = { initial: { opacity: 0, y: -8 }, animate: { opacity: 1, y: 0 } };
+function useSaasflareMotion(animated, base = spring, ...extraDisablers) {
+  const reduced = useReducedMotion();
+  const disabled = !animated || reduced || extraDisablers.some(Boolean);
+  return { transition: disabled ? noMotion : base, disabled };
+}
 
-export { fadeIn, noMotion, scaleIn, slideDown, slideUp, spring, springBouncy, springGentle, springStiff, useReducedMotion };
+export { fadeIn, noMotion, scaleIn, slideDown, slideUp, spring, springBouncy, springGentle, springStiff, useSaasflareMotion };

package/dist/chunk-FT66KYRN.js

@@ -0,0 +1,30 @@
+'use strict';
+
+var chunkD5LKWKG7_js = require('./chunk-D5LKWKG7.js');
+
+// src/components/ui/motion-config.ts
+var spring = { type: "spring", stiffness: 400, damping: 25 };
+var springBouncy = { type: "spring", stiffness: 300, damping: 15 };
+var springGentle = { type: "spring", stiffness: 200, damping: 20 };
+var springStiff = { type: "spring", stiffness: 500, damping: 30 };
+var noMotion = { duration: 0 };
+var fadeIn = { initial: { opacity: 0 }, animate: { opacity: 1 } };
+var scaleIn = { initial: { opacity: 0, scale: 0.95 }, animate: { opacity: 1, scale: 1 } };
+var slideUp = { initial: { opacity: 0, y: 8 }, animate: { opacity: 1, y: 0 } };
+var slideDown = { initial: { opacity: 0, y: -8 }, animate: { opacity: 1, y: 0 } };
+function useSaasflareMotion(animated, base = spring, ...extraDisablers) {
+  const reduced = chunkD5LKWKG7_js.useReducedMotion();
+  const disabled = !animated || reduced || extraDisablers.some(Boolean);
+  return { transition: disabled ? noMotion : base, disabled };
+}
+
+exports.fadeIn = fadeIn;
+exports.noMotion = noMotion;
+exports.scaleIn = scaleIn;
+exports.slideDown = slideDown;
+exports.slideUp = slideUp;
+exports.spring = spring;
+exports.springBouncy = springBouncy;
+exports.springGentle = springGentle;
+exports.springStiff = springStiff;
+exports.useSaasflareMotion = useSaasflareMotion;

package/dist/{chunk-7UGPCRZ6.mjs → chunk-RW2S3KNB.mjs}

@@ -1,6 +1,6 @@
 "use client";
-import { useReducedMotion, noMotion, springBouncy } from './chunk-W53NTFPB.mjs';
-import { cn } from './chunk-S26666D6.mjs';
+import { useSaasflareMotion, springBouncy } from './chunk-EJHYM2HP.mjs';
+import { cn, useSaasflareProps } from './chunk-WRONFPRI.mjs';
 import { m } from 'motion/react';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { XIcon } from 'lucide-react';
@@ -45,24 +45,31 @@ function DialogOverlay({
 function DialogContent({
   className,
   children,
+  surface,
+  radius,
+  animated,
   ...props
 }) {
-  const reduced = useReducedMotion();
+  const sf = useSaasflareProps({ surface, radius, animated });
+  const motion = useSaasflareMotion(sf.animated, springBouncy);
   return /* @__PURE__ */ jsxs(DialogPortal, { children: [
     /* @__PURE__ */ jsx(DialogOverlay, {}),
     /* @__PURE__ */ jsx(
       DialogPrimitive.Content,
       {
+        ...props,
         "data-slot": "dialog-content",
         asChild: true,
-        ...props,
         children: /* @__PURE__ */ jsxs(
           m.div,
           {
-            initial: reduced ? { opacity: 1 } : { opacity: 0, scale: 0.95, y: 10 },
+            "data-surface": sf.surface,
+            "data-radius": sf.radius,
+            "data-animated": String(sf.animated),
+            initial: motion.disabled ? { opacity: 1 } : { opacity: 0, scale: 0.95, y: 10 },
             animate: { opacity: 1, scale: 1, y: 0 },
-            exit: reduced ? { opacity: 0 } : { opacity: 0, scale: 0.95, y: 10 },
-            transition: reduced ? noMotion : springBouncy,
+            exit: motion.disabled ? { opacity: 0 } : { opacity: 0, scale: 0.95, y: 10 },
+            transition: motion.transition,
             className: cn(
               "fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border bg-background p-6 shadow-lg sm:max-w-lg",
               className

package/dist/chunk-WPOOC2FX.mjs

@@ -0,0 +1,128 @@
+"use client";
+import { useSaasflareMotion, spring } from './chunk-EJHYM2HP.mjs';
+import { useSaasflareProps, cn } from './chunk-WRONFPRI.mjs';
+import { Loader2Icon } from 'lucide-react';
+import { m } from 'motion/react';
+import { cva } from 'class-variance-authority';
+import * as Slot from '@radix-ui/react-slot';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var MotionSlot = m.create(Slot.Root);
+var LEGACY_VARIANT_MAP = {
+  default: { variant: "solid", intent: "primary" },
+  destructive: { variant: "solid", intent: "danger" },
+  secondary: { variant: "soft", intent: "neutral" }
+};
+var buttonVariants = cva(
+  "inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+  {
+    variants: {
+      variant: {
+        solid: "bg-[var(--intent)] text-[var(--intent-fg)] shadow-xs hover:brightness-110 dark:hover:brightness-125",
+        soft: "bg-[var(--intent)]/15 text-[var(--intent)] hover:bg-[var(--intent)]/25 dark:bg-[var(--intent)]/20 dark:hover:bg-[var(--intent)]/30",
+        outline: "border border-[var(--intent)]/30 text-[var(--intent)] shadow-xs hover:bg-[var(--intent)]/10 dark:border-[var(--intent)]/40 dark:hover:bg-[var(--intent)]/15",
+        ghost: "text-[var(--intent)] hover:bg-[var(--intent)]/10 dark:hover:bg-[var(--intent)]/15",
+        link: "text-[var(--intent)] underline-offset-4 hover:underline",
+        glass: "bg-[var(--glass-bg)] text-[var(--intent)] border border-[var(--glass-border)] backdrop-blur-lg shadow-[var(--glass-shadow)] hover:bg-[var(--glass-bg-hover)] hover:border-[var(--glass-border-hover)]",
+        shadow: "bg-[var(--intent)] text-[var(--intent-fg)] shadow-[var(--btn-shadow)] hover:shadow-[var(--btn-shadow-hover)] hover:brightness-110 dark:hover:brightness-125"
+      },
+      size: {
+        xs: "h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
+        sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5",
+        md: "h-9 px-4 py-2 has-[>svg]:px-3",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        xl: "h-12 rounded-lg px-8 text-base has-[>svg]:px-5 [&_svg:not([class*='size-'])]:size-5",
+        icon: "size-9",
+        "icon-xs": "size-6 rounded-md [&_svg:not([class*='size-'])]:size-3",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10"
+      }
+    },
+    defaultVariants: {
+      variant: "solid",
+      size: "md"
+    }
+  }
+);
+function Button({
+  className,
+  variant: variantProp,
+  size = "md",
+  intent: intentProp = "primary",
+  asChild = false,
+  loading = false,
+  fullWidth = false,
+  surface,
+  radius,
+  animated,
+  disabled,
+  children,
+  ...props
+}) {
+  const sf = useSaasflareProps({ surface, radius, animated });
+  const motion = useSaasflareMotion(sf.animated, spring, disabled ?? false, loading);
+  const effectiveVariant = variantProp ?? (sf.surface === "glass" ? "glass" : "solid");
+  let resolvedVariant = effectiveVariant;
+  let resolvedIntent = intentProp;
+  const legacy = LEGACY_VARIANT_MAP[effectiveVariant];
+  if (legacy) {
+    resolvedVariant = legacy.variant;
+    if (legacy.intent) {
+      resolvedIntent = legacy.intent;
+    }
+  }
+  if (asChild) {
+    return /* @__PURE__ */ jsx(
+      MotionSlot,
+      {
+        ...props,
+        "data-slot": "button",
+        "data-variant": resolvedVariant,
+        "data-intent": resolvedIntent,
+        "data-size": size,
+        "data-surface": sf.surface,
+        "data-radius": sf.radius,
+        "data-animated": String(sf.animated),
+        whileHover: motion.disabled ? void 0 : { scale: 1.02 },
+        whileTap: motion.disabled ? void 0 : { scale: 0.97 },
+        transition: motion.transition,
+        className: cn(
+          buttonVariants({ variant: resolvedVariant, size }),
+          fullWidth && "w-full",
+          className
+        ),
+        children
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    m.button,
+    {
+      "data-slot": "button",
+      "data-variant": resolvedVariant,
+      "data-intent": resolvedIntent,
+      "data-size": size,
+      "data-surface": sf.surface,
+      "data-radius": sf.radius,
+      "data-animated": String(sf.animated),
+      whileHover: motion.disabled ? void 0 : { scale: 1.02 },
+      whileTap: motion.disabled ? void 0 : { scale: 0.97 },
+      transition: motion.transition,
+      className: cn(
+        buttonVariants({ variant: resolvedVariant, size }),
+        fullWidth && "w-full",
+        className
+      ),
+      disabled,
+      "aria-busy": loading || void 0,
+      "aria-disabled": disabled || void 0,
+      ...props,
+      children: [
+        loading && /* @__PURE__ */ jsx(Loader2Icon, { className: "animate-spin", "aria-hidden": "true" }),
+        children
+      ]
+    }
+  );
+}
+
+export { Button, buttonVariants };

package/dist/{chunk-QWLQV6FS.mjs → chunk-WRONFPRI.mjs}

@@ -1,13 +1,17 @@
 "use client";
-import { useReducedMotion, noMotion, spring } from './chunk-W53NTFPB.mjs';
-import { cn } from './chunk-S26666D6.mjs';
-import { cva } from 'class-variance-authority';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import * as React2 from 'react';
 import { createContext, useContext, useEffect, useCallback, useRef, useState } from 'react';
+import 'class-variance-authority';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { ThemeProvider, useTheme } from 'next-themes';
-import { m, LazyMotion, domAnimation } from 'motion/react';
-import { Loader2Icon } from 'lucide-react';
-import * as Slot from '@radix-ui/react-slot';
+import { LazyMotion, domAnimation } from 'motion/react';
+
+// src/lib/utils.ts
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
 
 // src/lib/color.ts
 function hexToOklch(hex) {
@@ -53,6 +57,17 @@ function srgbToLinear(c) {
 function isHex(input) {
   return typeof input === "string" && /^#?[0-9a-f]{3,8}$/i.test(input.trim());
 }
+var QUERY = "(prefers-reduced-motion: reduce)";
+var subscribe = (cb) => {
+  const mql = window.matchMedia(QUERY);
+  mql.addEventListener("change", cb);
+  return () => mql.removeEventListener("change", cb);
+};
+var getSnapshot = () => window.matchMedia(QUERY).matches;
+var getServerSnapshot = () => false;
+function useReducedMotion() {
+  return React2.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+}
 var AnimationContext = createContext(
   void 0
 );
@@ -410,119 +425,5 @@ function useSaasflareProps(props = {}) {
     palette: ctx.palette
   };
 }
-var MotionSlot = m.create(Slot.Root);
-var LEGACY_VARIANT_MAP = {
-  default: { variant: "solid", intent: "primary" },
-  destructive: { variant: "solid", intent: "danger" },
-  secondary: { variant: "soft", intent: "neutral" }
-};
-var buttonVariants = cva(
-  "inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-  {
-    variants: {
-      variant: {
-        solid: "bg-[var(--intent)] text-[var(--intent-fg)] shadow-xs hover:brightness-110 dark:hover:brightness-125",
-        soft: "bg-[var(--intent)]/15 text-[var(--intent)] hover:bg-[var(--intent)]/25 dark:bg-[var(--intent)]/20 dark:hover:bg-[var(--intent)]/30",
-        outline: "border border-[var(--intent)]/30 text-[var(--intent)] shadow-xs hover:bg-[var(--intent)]/10 dark:border-[var(--intent)]/40 dark:hover:bg-[var(--intent)]/15",
-        ghost: "text-[var(--intent)] hover:bg-[var(--intent)]/10 dark:hover:bg-[var(--intent)]/15",
-        link: "text-[var(--intent)] underline-offset-4 hover:underline",
-        glass: "bg-[var(--glass-bg)] text-[var(--intent)] border border-[var(--glass-border)] backdrop-blur-lg shadow-[var(--glass-shadow)] hover:bg-[var(--glass-bg-hover)] hover:border-[var(--glass-border-hover)]",
-        shadow: "bg-[var(--intent)] text-[var(--intent-fg)] shadow-[var(--btn-shadow)] hover:shadow-[var(--btn-shadow-hover)] hover:brightness-110 dark:hover:brightness-125"
-      },
-      size: {
-        xs: "h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
-        sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5",
-        md: "h-9 px-4 py-2 has-[>svg]:px-3",
-        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
-        xl: "h-12 rounded-lg px-8 text-base has-[>svg]:px-5 [&_svg:not([class*='size-'])]:size-5",
-        icon: "size-9",
-        "icon-xs": "size-6 rounded-md [&_svg:not([class*='size-'])]:size-3",
-        "icon-sm": "size-8",
-        "icon-lg": "size-10"
-      }
-    },
-    defaultVariants: {
-      variant: "solid",
-      size: "md"
-    }
-  }
-);
-function Button({
-  className,
-  variant: variantProp,
-  size = "md",
-  intent: intentProp = "primary",
-  asChild = false,
-  loading = false,
-  fullWidth = false,
-  surface,
-  animated,
-  disabled,
-  children,
-  ...props
-}) {
-  const sfProps = useSaasflareProps({ surface, animated });
-  const reduced = useReducedMotion();
-  const effectiveVariant = variantProp ?? (sfProps.surface === "glass" ? "glass" : "solid");
-  let resolvedVariant = effectiveVariant;
-  let resolvedIntent = intentProp;
-  const legacy = LEGACY_VARIANT_MAP[effectiveVariant];
-  if (legacy) {
-    resolvedVariant = legacy.variant;
-    if (legacy.intent) {
-      resolvedIntent = legacy.intent;
-    }
-  }
-  const motionDisabled = !sfProps.animated || reduced || disabled || loading;
-  const transition = !sfProps.animated || reduced ? noMotion : spring;
-  if (asChild) {
-    return /* @__PURE__ */ jsx(
-      MotionSlot,
-      {
-        "data-slot": "button",
-        "data-variant": resolvedVariant,
-        "data-intent": resolvedIntent,
-        "data-size": size,
-        "data-surface": sfProps.surface,
-        whileHover: motionDisabled ? void 0 : { scale: 1.02 },
-        whileTap: motionDisabled ? void 0 : { scale: 0.97 },
-        transition,
-        className: cn(
-          buttonVariants({ variant: resolvedVariant, size }),
-          fullWidth && "w-full",
-          className
-        ),
-        ...props,
-        children
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs(
-    m.button,
-    {
-      "data-slot": "button",
-      "data-variant": resolvedVariant,
-      "data-intent": resolvedIntent,
-      "data-size": size,
-      "data-surface": sfProps.surface,
-      whileHover: motionDisabled ? void 0 : { scale: 1.02 },
-      whileTap: motionDisabled ? void 0 : { scale: 0.97 },
-      transition,
-      className: cn(
-        buttonVariants({ variant: resolvedVariant, size }),
-        fullWidth && "w-full",
-        className
-      ),
-      disabled,
-      "aria-busy": loading || void 0,
-      "aria-disabled": disabled || void 0,
-      ...props,
-      children: [
-        loading && /* @__PURE__ */ jsx(Loader2Icon, { className: "animate-spin", "aria-hidden": "true" }),
-        children
-      ]
-    }
-  );
-}
 
-export { Button, SaasflareProvider, SaasflareScript, SaasflareShell, SmoothScrollProvider, buttonVariants, useAnimation, useSaasflareProps, useSaasflareTheme };
+export { SaasflareProvider, SaasflareScript, SaasflareShell, SmoothScrollProvider, cn, useAnimation, useReducedMotion, useSaasflareProps, useSaasflareTheme };

package/dist/{dialog-CwyBJeNl.d.mts → dialog-BmY55WSX.d.ts}

@@ -1,19 +1,22 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { c as SaasflareComponentProps } from './use-saasflare-props-NrM2Glmp.js';
 
 declare function Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>): react_jsx_runtime.JSX.Element;
 declare function DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
 declare function DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>): react_jsx_runtime.JSX.Element;
 declare function DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>): react_jsx_runtime.JSX.Element;
 declare function DialogOverlay({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Overlay>): react_jsx_runtime.JSX.Element;
+interface DialogContentProps extends Omit<React.ComponentProps<typeof DialogPrimitive.Content>, keyof SaasflareComponentProps>, SaasflareComponentProps {
+}
 /**
  * Dialog content panel with spring entry animation.
  *
  * @component
  * @layer core
  */
-declare function DialogContent({ className, children, ...props }: React.ComponentProps<typeof DialogPrimitive.Content>): react_jsx_runtime.JSX.Element;
+declare function DialogContent({ className, children, surface, radius, animated, ...props }: DialogContentProps): react_jsx_runtime.JSX.Element;
 declare function DialogHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare function DialogFooter({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare function DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>): react_jsx_runtime.JSX.Element;

package/dist/{dialog-CwyBJeNl.d.ts → dialog-CcaHMAsS.d.mts}

@@ -1,19 +1,22 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { c as SaasflareComponentProps } from './use-saasflare-props-NrM2Glmp.mjs';
 
 declare function Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>): react_jsx_runtime.JSX.Element;
 declare function DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
 declare function DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>): react_jsx_runtime.JSX.Element;
 declare function DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>): react_jsx_runtime.JSX.Element;
 declare function DialogOverlay({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Overlay>): react_jsx_runtime.JSX.Element;
+interface DialogContentProps extends Omit<React.ComponentProps<typeof DialogPrimitive.Content>, keyof SaasflareComponentProps>, SaasflareComponentProps {
+}
 /**
  * Dialog content panel with spring entry animation.
  *
  * @component
  * @layer core
  */
-declare function DialogContent({ className, children, ...props }: React.ComponentProps<typeof DialogPrimitive.Content>): react_jsx_runtime.JSX.Element;
+declare function DialogContent({ className, children, surface, radius, animated, ...props }: DialogContentProps): react_jsx_runtime.JSX.Element;
 declare function DialogHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare function DialogFooter({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare function DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>): react_jsx_runtime.JSX.Element;

package/dist/entries/calendar.d.mts

@@ -1,13 +1,15 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import { DayPicker, DayButton } from 'react-day-picker';
-import { B as Button } from '../button-DUQJ0X7e.mjs';
+import { c as SaasflareComponentProps } from '../use-saasflare-props-NrM2Glmp.mjs';
+import { B as Button } from '../button-Brb4BhPO.mjs';
 import 'class-variance-authority/types';
 import 'class-variance-authority';
 
-declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, ...props }: React.ComponentProps<typeof DayPicker> & {
+type CalendarProps = React.ComponentProps<typeof DayPicker> & SaasflareComponentProps & {
     buttonVariant?: React.ComponentProps<typeof Button>["variant"];
-}): react_jsx_runtime.JSX.Element;
+};
+declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, surface, radius, animated, ...props }: CalendarProps): react_jsx_runtime.JSX.Element;
 declare function CalendarDayButton({ className, day, modifiers, ...props }: React.ComponentProps<typeof DayButton>): react_jsx_runtime.JSX.Element;
 
 export { Calendar, CalendarDayButton };

package/dist/entries/calendar.d.ts

@@ -1,13 +1,15 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import { DayPicker, DayButton } from 'react-day-picker';
-import { B as Button } from '../button-DUQJ0X7e.js';
+import { c as SaasflareComponentProps } from '../use-saasflare-props-NrM2Glmp.js';
+import { B as Button } from '../button-0Bdl7Nqm.js';
 import 'class-variance-authority/types';
 import 'class-variance-authority';
 
-declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, ...props }: React.ComponentProps<typeof DayPicker> & {
+type CalendarProps = React.ComponentProps<typeof DayPicker> & SaasflareComponentProps & {
     buttonVariant?: React.ComponentProps<typeof Button>["variant"];
-}): react_jsx_runtime.JSX.Element;
+};
+declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, surface, radius, animated, ...props }: CalendarProps): react_jsx_runtime.JSX.Element;
 declare function CalendarDayButton({ className, day, modifiers, ...props }: React.ComponentProps<typeof DayButton>): react_jsx_runtime.JSX.Element;
 
 export { Calendar, CalendarDayButton };