@akira-io/ui 2.0.0 → 2.1.0

package/dist/blocks.d.ts

@@ -1,5 +1,5 @@
-import { D as DateFilterValue, a as DateFilterLabels, b as DateFilterOption, c as DateFilterUnit, C as CopyButtonLabels } from './context-Soro3B1I.js';
-export { d as CommandPalette, e as CommandPaletteGroup, f as CommandPaletteItem, g as CommandPaletteProps, h as DATE_FILTER_LABELS, i as DATE_FILTER_OPERATORS, j as DATE_FILTER_PRESETS, k as DATE_FILTER_UNITS, l as DateFilterMode, m as DateFilterOperator, S as SettingsEntry, n as SettingsEntryProps, o as SettingsGroup, p as SettingsGroupProps, q as SettingsLabels, r as SettingsPage, s as SettingsPageProps, t as SettingsSection, u as SettingsSectionProps, U as UiLabelSections, v as UiLabels, w as UiLocaleProvider, x as settingsLabels, y as useCommandPalette, z as useUiLabels, A as useUiLocale } from './context-Soro3B1I.js';
+import { D as DateFilterValue, a as DateFilterLabels, b as DateFilterOption, c as DateFilterUnit, C as CopyButtonLabels } from './context-2wTOwxCk.js';
+export { d as CommandPalette, e as CommandPaletteGroup, f as CommandPaletteItem, g as CommandPaletteProps, h as DATE_FILTER_LABELS, i as DATE_FILTER_OPERATORS, j as DATE_FILTER_PRESETS, k as DATE_FILTER_UNITS, l as DateFilterMode, m as DateFilterOperator, S as SettingsEntry, n as SettingsEntryProps, o as SettingsGroup, p as SettingsGroupProps, q as SettingsLabels, r as SettingsPage, s as SettingsPageProps, t as SettingsSection, u as SettingsSectionProps, U as UiLabelSections, v as UiLabels, w as UiLocaleProvider, x as settingsLabels, y as useCommandPalette, z as useUiLabels, A as useUiLocale } from './context-2wTOwxCk.js';
 import { F as FormOverlayIntent, a as FormOverlayLabels, T as TwoFactorLabelProps, b as TwoFactorCodeMode, c as TwoFactorQrProps } from './types-CfAUvz--.js';
 export { D as DangerZone, d as DangerZoneAction, e as DangerZoneLabels, f as DangerZoneProps, g as FormOverlayActions, h as FormOverlayActionsProps, i as TwoFactorLabels, j as TwoFactorSetupStep, k as dangerZoneLabels, l as formOverlayDefaultLabels, t as twoFactorLabels } from './types-CfAUvz--.js';
 import * as React from 'react';

package/dist/blocks.js

@@ -30,10 +30,10 @@ import {
   TabsList,
   TabsTrigger,
   Textarea
-} from "./chunk-UCJTM3UM.js";
+} from "./chunk-DPLCEU34.js";
 import {
   CopyButton
-} from "./chunk-UXVI326F.js";
+} from "./chunk-PCYYU332.js";
 import {
   Dialog,
   DialogContent,
@@ -41,10 +41,10 @@ import {
   DialogFooter,
   DialogHeader,
   DialogTitle
-} from "./chunk-EYPM6IMS.js";
+} from "./chunk-QZRSQVCN.js";
 import {
   Card
-} from "./chunk-2V6HUWST.js";
+} from "./chunk-NKPFIA32.js";
 import {
   DEFAULT_TOUR_LABELS,
   LoginForm,
@@ -64,27 +64,27 @@ import {
   useLoginFormContext,
   useTour,
   useTourController
-} from "./chunk-DE2AJ54R.js";
+} from "./chunk-BR3JI3KN.js";
 import {
   Alert,
   AlertDescription,
   FieldError
-} from "./chunk-VA6A4HZ2.js";
+} from "./chunk-BH3B26DK.js";
 import {
   UiLocaleProvider,
   useUiLabels,
   useUiLocale
-} from "./chunk-E26KKMGS.js";
+} from "./chunk-OS7YY5R4.js";
 import {
   Label
-} from "./chunk-TM5MN3MI.js";
+} from "./chunk-BP2YDMMI.js";
 import {
   resolveLink
 } from "./chunk-L2H5GIF7.js";
 import {
   Input,
   Separator
-} from "./chunk-3Z2VGVPI.js";
+} from "./chunk-53V4J7MC.js";
 import {
   Button,
   Spinner,
@@ -95,7 +95,7 @@ import {
   focusRing,
   nestedSurfaceReset,
   recessedSurface
-} from "./chunk-KHOA4TEI.js";
+} from "./chunk-PPWJK5T3.js";
 
 // src/blocks/command-palette.tsx
 import { useCallback, useEffect, useState } from "react";

package/dist/{chunk-3Z2VGVPI.js → chunk-53V4J7MC.js}

@@ -2,7 +2,7 @@ import {
   cn,
   fieldFocus,
   fieldSurface
-} from "./chunk-KHOA4TEI.js";
+} from "./chunk-PPWJK5T3.js";
 
 // src/components/ui/input.tsx
 import { jsx } from "react/jsx-runtime";
@@ -55,4 +55,4 @@ export {
   Input,
   Separator
 };
-//# sourceMappingURL=chunk-3Z2VGVPI.js.map
+//# sourceMappingURL=chunk-53V4J7MC.js.map

package/dist/{chunk-VA6A4HZ2.js → chunk-BH3B26DK.js}

@@ -1,18 +1,18 @@
 import {
   useUiLabels
-} from "./chunk-E26KKMGS.js";
+} from "./chunk-OS7YY5R4.js";
 import {
   Label
-} from "./chunk-TM5MN3MI.js";
+} from "./chunk-BP2YDMMI.js";
 import {
   Input
-} from "./chunk-3Z2VGVPI.js";
+} from "./chunk-53V4J7MC.js";
 import {
   Button,
   cn,
   elevatedSurface,
   focusRing
-} from "./chunk-KHOA4TEI.js";
+} from "./chunk-PPWJK5T3.js";
 
 // src/components/ui/alert.tsx
 import { cva } from "class-variance-authority";
@@ -391,4 +391,4 @@ export {
   passwordInputDefaultLabels,
   PasswordInput
 };
-//# sourceMappingURL=chunk-VA6A4HZ2.js.map
+//# sourceMappingURL=chunk-BH3B26DK.js.map

package/dist/{chunk-TM5MN3MI.js → chunk-BP2YDMMI.js}

@@ -1,6 +1,6 @@
 import {
   cn
-} from "./chunk-KHOA4TEI.js";
+} from "./chunk-PPWJK5T3.js";
 
 // src/components/ui/label.tsx
 import * as LabelPrimitive from "@radix-ui/react-label";
@@ -26,4 +26,4 @@ function Label({
 export {
   Label
 };
-//# sourceMappingURL=chunk-TM5MN3MI.js.map
+//# sourceMappingURL=chunk-BP2YDMMI.js.map

package/dist/{chunk-DE2AJ54R.js → chunk-BR3JI3KN.js}

@@ -6,23 +6,23 @@ import {
   FieldControl,
   FieldLabel,
   PasswordInput
-} from "./chunk-VA6A4HZ2.js";
+} from "./chunk-BH3B26DK.js";
 import {
   useUiLabels
-} from "./chunk-E26KKMGS.js";
+} from "./chunk-OS7YY5R4.js";
 import {
   Label
-} from "./chunk-TM5MN3MI.js";
+} from "./chunk-BP2YDMMI.js";
 import {
   resolveLink
 } from "./chunk-L2H5GIF7.js";
 import {
   Input
-} from "./chunk-3Z2VGVPI.js";
+} from "./chunk-53V4J7MC.js";
 import {
   Button,
   cn
-} from "./chunk-KHOA4TEI.js";
+} from "./chunk-PPWJK5T3.js";
 
 // src/blocks/login-form/types.ts
 var loginFormLabels = {
@@ -455,4 +455,4 @@ export {
   useTourController,
   useTour
 };
-//# sourceMappingURL=chunk-DE2AJ54R.js.map
+//# sourceMappingURL=chunk-BR3JI3KN.js.map

package/dist/{chunk-YBXRJSR3.js → chunk-CAUTXZ4U.js}

@@ -3,7 +3,7 @@ import {
   controlFill,
   focusRing,
   glassControl
-} from "./chunk-KHOA4TEI.js";
+} from "./chunk-PPWJK5T3.js";
 
 // src/components/ui/toggle.tsx
 import * as TogglePrimitive from "@radix-ui/react-toggle";
@@ -50,4 +50,4 @@ export {
   toggleVariants,
   Toggle
 };
-//# sourceMappingURL=chunk-YBXRJSR3.js.map
+//# sourceMappingURL=chunk-CAUTXZ4U.js.map

package/dist/{chunk-UCJTM3UM.js → chunk-DPLCEU34.js}

@@ -7,16 +7,16 @@ import {
   DialogFooter,
   DialogHeader,
   DialogTitle
-} from "./chunk-EYPM6IMS.js";
+} from "./chunk-QZRSQVCN.js";
 import {
   useUiLabels
-} from "./chunk-E26KKMGS.js";
+} from "./chunk-OS7YY5R4.js";
 import {
   Label
-} from "./chunk-TM5MN3MI.js";
+} from "./chunk-BP2YDMMI.js";
 import {
   Input
-} from "./chunk-3Z2VGVPI.js";
+} from "./chunk-53V4J7MC.js";
 import {
   Button,
   buttonVariants,
@@ -30,8 +30,11 @@ import {
   menuSurface,
   modalSurface,
   nestedSurfaceReset,
-  panelSurface
-} from "./chunk-KHOA4TEI.js";
+  panelSurface,
+  scrollEdgeTransition,
+  scrollShadowFromBottom,
+  scrollShadowFromTop
+} from "./chunk-PPWJK5T3.js";
 
 // src/components/ui/confirm-dialog.tsx
 import { AlertCircle, ChevronRight } from "lucide-react";
@@ -773,6 +776,12 @@ function useFloatingSheetStack() {
   }
   return context;
 }
+var floatingSheetDefaultEdges = {
+  top: true,
+  bottom: true
+};
+var FloatingSheetEdgesContext = React3.createContext(floatingSheetDefaultEdges);
+var FloatingSheetReportEdgesContext = React3.createContext(null);
 
 // src/components/ui/floating-sheet-stack.tsx
 import * as DialogPrimitive from "@radix-ui/react-dialog";
@@ -882,8 +891,49 @@ function FloatingSheetStack({
 
 // src/components/ui/floating-sheet.tsx
 import { ArrowLeftIcon, XIcon } from "lucide-react";
-import * as React5 from "react";
+import * as React6 from "react";
 import { createPortal } from "react-dom";
+
+// src/hooks/use-floating-sheet-body-edges.ts
+import * as React5 from "react";
+function useFloatingSheetBodyEdges(containerRef, topSentinelRef, bottomSentinelRef, reportEdges) {
+  React5.useEffect(() => {
+    const container = containerRef.current;
+    const topSentinel = topSentinelRef.current;
+    const bottomSentinel = bottomSentinelRef.current;
+    if (!reportEdges || !container || !topSentinel || !bottomSentinel || typeof IntersectionObserver === "undefined") {
+      return;
+    }
+    let edges = floatingSheetDefaultEdges;
+    const edgeKeyByTarget = /* @__PURE__ */ new Map([
+      [topSentinel, "top"],
+      [bottomSentinel, "bottom"]
+    ]);
+    const observer = new IntersectionObserver(
+      (entries) => {
+        const next = { ...edges };
+        for (const entry of entries) {
+          const key = edgeKeyByTarget.get(entry.target);
+          if (!key) {
+            continue;
+          }
+          next[key] = entry.isIntersecting;
+        }
+        edges = next;
+        reportEdges(next);
+      },
+      { root: container, threshold: 0 }
+    );
+    observer.observe(topSentinel);
+    observer.observe(bottomSentinel);
+    return () => {
+      observer.disconnect();
+      reportEdges(floatingSheetDefaultEdges);
+    };
+  }, [containerRef, topSentinelRef, bottomSentinelRef, reportEdges]);
+}
+
+// src/components/ui/floating-sheet.tsx
 import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
 function FloatingSheet({
   open,
@@ -897,20 +947,23 @@ function FloatingSheet({
   ...props
 }) {
   const { labels, container, entries, register, unregister, closeAll } = useFloatingSheetStack();
-  const id = React5.useId();
+  const id = React6.useId();
   const titleId = `${id}-title`;
   const descriptionId = `${id}-description`;
-  const close = React5.useCallback(() => onOpenChange(false), [onOpenChange]);
-  const closeRef = React5.useRef(close);
-  const titleRef = React5.useRef(title);
-  const openerRef = React5.useRef(null);
-  const panelRef = React5.useRef(null);
-  const focusedRef = React5.useRef(false);
-  React5.useEffect(() => {
+  const close = React6.useCallback(() => onOpenChange(false), [onOpenChange]);
+  const closeRef = React6.useRef(close);
+  const titleRef = React6.useRef(title);
+  const openerRef = React6.useRef(null);
+  const panelRef = React6.useRef(null);
+  const focusedRef = React6.useRef(false);
+  const [edges, setEdges] = React6.useState(
+    floatingSheetDefaultEdges
+  );
+  React6.useEffect(() => {
     closeRef.current = close;
     titleRef.current = title;
   });
-  React5.useEffect(() => {
+  React6.useEffect(() => {
     if (!open) {
       return;
     }
@@ -921,7 +974,7 @@ function FloatingSheet({
       close: () => closeRef.current()
     });
   }, [open, id, persistent, register]);
-  React5.useEffect(() => {
+  React6.useEffect(() => {
     if (!open) {
       return;
     }
@@ -930,7 +983,7 @@ function FloatingSheet({
   const index = entries.findIndex((entry) => entry.id === id);
   const depth = index === -1 ? 0 : entries.length - 1 - index;
   const isTop = index !== -1 && depth === 0;
-  React5.useEffect(() => {
+  React6.useEffect(() => {
     if (open) {
       openerRef.current = document.activeElement;
       return;
@@ -941,7 +994,7 @@ function FloatingSheet({
       opener.focus();
     }
   }, [open]);
-  React5.useEffect(() => {
+  React6.useEffect(() => {
     if (!open) {
       focusedRef.current = false;
       return;
@@ -985,7 +1038,11 @@ function FloatingSheet({
             "header",
             {
               "data-slot": "floating-sheet-header",
-              className: "gap-1 p-5 flex flex-col",
+              className: cn(
+                "gap-1 p-5 relative z-10 flex flex-col",
+                scrollEdgeTransition,
+                !edges.top && scrollShadowFromTop
+              ),
               children: [
                 index > 0 ? /* @__PURE__ */ jsxs5(
                   "button",
@@ -1024,7 +1081,7 @@ function FloatingSheet({
               ]
             }
           ),
-          children,
+          /* @__PURE__ */ jsx7(FloatingSheetReportEdgesContext.Provider, { value: setEdges, children: /* @__PURE__ */ jsx7(FloatingSheetEdgesContext.Provider, { value: edges, children }) }),
           /* @__PURE__ */ jsx7(
             "button",
             {
@@ -1033,7 +1090,7 @@ function FloatingSheet({
               "aria-label": labels.closeLabel,
               onClick: closeAll,
               className: cn(
-                "top-4 right-4 size-9 shadow-xs absolute flex items-center justify-center rounded-full border border-border bg-muted text-muted-foreground transition-colors hover:bg-accent hover:text-foreground disabled:pointer-events-none",
+                "top-4 right-4 size-9 shadow-xs absolute z-20 flex items-center justify-center rounded-full border border-border bg-muted text-muted-foreground transition-colors hover:bg-accent hover:text-foreground disabled:pointer-events-none",
                 focusRing
               ),
               children: /* @__PURE__ */ jsx7(XIcon, { className: "size-4" })
@@ -1048,14 +1105,47 @@ function FloatingSheet({
 function FloatingSheetBody({
   className,
   slotName = "floating-sheet-body",
+  children,
   ...props
 }) {
-  return /* @__PURE__ */ jsx7(
+  const reportEdges = React6.useContext(FloatingSheetReportEdgesContext);
+  const containerRef = React6.useRef(null);
+  const topSentinelRef = React6.useRef(null);
+  const bottomSentinelRef = React6.useRef(null);
+  useFloatingSheetBodyEdges(
+    containerRef,
+    topSentinelRef,
+    bottomSentinelRef,
+    reportEdges
+  );
+  return /* @__PURE__ */ jsxs5(
     "div",
     {
+      ref: containerRef,
       className: cn("p-5 flex-1 overflow-y-auto", className),
       ...props,
-      "data-slot": slotName
+      "data-slot": slotName,
+      children: [
+        /* @__PURE__ */ jsx7(
+          "div",
+          {
+            ref: topSentinelRef,
+            "aria-hidden": "true",
+            "data-slot": "floating-sheet-top-sentinel",
+            className: "h-0"
+          }
+        ),
+        children,
+        /* @__PURE__ */ jsx7(
+          "div",
+          {
+            ref: bottomSentinelRef,
+            "aria-hidden": "true",
+            "data-slot": "floating-sheet-bottom-sentinel",
+            className: "h-0"
+          }
+        )
+      ]
     }
   );
 }
@@ -1064,11 +1154,14 @@ function FloatingSheetFooter({
   slotName = "floating-sheet-footer",
   ...props
 }) {
+  const edges = React6.useContext(FloatingSheetEdgesContext);
   return /* @__PURE__ */ jsx7(
     "div",
     {
       className: cn(
-        "gap-2 p-5 mt-auto flex items-center justify-end",
+        "gap-2 p-5 relative z-10 mt-auto flex items-center justify-end",
+        scrollEdgeTransition,
+        !edges.bottom && scrollShadowFromBottom,
         className
       ),
       ...props,
@@ -1080,9 +1173,9 @@ function FloatingSheetFooter({
 // src/components/ui/input-otp.tsx
 import { OTPInput, OTPInputContext } from "input-otp";
 import { Minus } from "lucide-react";
-import * as React6 from "react";
+import * as React7 from "react";
 import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
-var InputOTP = React6.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ jsx8(
+var InputOTP = React7.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ jsx8(
   OTPInput,
   {
     ref,
@@ -1095,10 +1188,10 @@ var InputOTP = React6.forwardRef(({ className, containerClassName, ...props }, r
   }
 ));
 InputOTP.displayName = "InputOTP";
-var InputOTPGroup = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8("div", { ref, className: cn("flex items-center", className), ...props }));
+var InputOTPGroup = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8("div", { ref, className: cn("flex items-center", className), ...props }));
 InputOTPGroup.displayName = "InputOTPGroup";
-var InputOTPSlot = React6.forwardRef(({ index, className, slotName = "input-otp-slot", ...props }, ref) => {
-  const inputOTPContext = React6.useContext(OTPInputContext);
+var InputOTPSlot = React7.forwardRef(({ index, className, slotName = "input-otp-slot", ...props }, ref) => {
+  const inputOTPContext = React7.useContext(OTPInputContext);
   const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index];
   return /* @__PURE__ */ jsxs6(
     "div",
@@ -1121,14 +1214,14 @@ var InputOTPSlot = React6.forwardRef(({ index, className, slotName = "input-otp-
   );
 });
 InputOTPSlot.displayName = "InputOTPSlot";
-var InputOTPSeparator = React6.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx8("div", { ref, role: "separator", ...props, children: /* @__PURE__ */ jsx8(Minus, {}) }));
+var InputOTPSeparator = React7.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx8("div", { ref, role: "separator", ...props, children: /* @__PURE__ */ jsx8(Minus, {}) }));
 InputOTPSeparator.displayName = "InputOTPSeparator";
 
 // src/components/ui/switch.tsx
 import * as SwitchPrimitives from "@radix-ui/react-switch";
-import * as React7 from "react";
+import * as React8 from "react";
 import { jsx as jsx9 } from "react/jsx-runtime";
-var Switch = React7.forwardRef(({ className, slotName = "switch", ...props }, ref) => /* @__PURE__ */ jsx9(
+var Switch = React8.forwardRef(({ className, slotName = "switch", ...props }, ref) => /* @__PURE__ */ jsx9(
   SwitchPrimitives.Root,
   {
     className: cn(
@@ -1153,11 +1246,11 @@ Switch.displayName = SwitchPrimitives.Root.displayName;
 
 // src/components/ui/tabs.tsx
 import * as TabsPrimitive from "@radix-ui/react-tabs";
-import * as React8 from "react";
+import * as React9 from "react";
 import { jsx as jsx10 } from "react/jsx-runtime";
-var Tabs = React8.forwardRef(({ slotName = "tabs", ...props }, ref) => /* @__PURE__ */ jsx10(TabsPrimitive.Root, { ref, ...props, "data-slot": slotName }));
+var Tabs = React9.forwardRef(({ slotName = "tabs", ...props }, ref) => /* @__PURE__ */ jsx10(TabsPrimitive.Root, { ref, ...props, "data-slot": slotName }));
 Tabs.displayName = TabsPrimitive.Root.displayName;
-var TabsList = React8.forwardRef(({ className, slotName = "tabs-list", ...props }, ref) => /* @__PURE__ */ jsx10(
+var TabsList = React9.forwardRef(({ className, slotName = "tabs-list", ...props }, ref) => /* @__PURE__ */ jsx10(
   TabsPrimitive.List,
   {
     ref,
@@ -1170,7 +1263,7 @@ var TabsList = React8.forwardRef(({ className, slotName = "tabs-list", ...props
   }
 ));
 TabsList.displayName = TabsPrimitive.List.displayName;
-var TabsTrigger = React8.forwardRef(({ className, slotName = "tabs-trigger", ...props }, ref) => /* @__PURE__ */ jsx10(
+var TabsTrigger = React9.forwardRef(({ className, slotName = "tabs-trigger", ...props }, ref) => /* @__PURE__ */ jsx10(
   TabsPrimitive.Trigger,
   {
     ref,
@@ -1183,7 +1276,7 @@ var TabsTrigger = React8.forwardRef(({ className, slotName = "tabs-trigger", ...
   }
 ));
 TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
-var TabsContent = React8.forwardRef(({ className, slotName = "tabs-content", ...props }, ref) => /* @__PURE__ */ jsx10(
+var TabsContent = React9.forwardRef(({ className, slotName = "tabs-content", ...props }, ref) => /* @__PURE__ */ jsx10(
   TabsPrimitive.Content,
   {
     ref,
@@ -1200,9 +1293,9 @@ var TabsContent = React8.forwardRef(({ className, slotName = "tabs-content", ...
 TabsContent.displayName = TabsPrimitive.Content.displayName;
 
 // src/components/ui/textarea.tsx
-import * as React9 from "react";
+import * as React10 from "react";
 import { jsx as jsx11 } from "react/jsx-runtime";
-var Textarea = React9.forwardRef(({ className, slotName = "textarea", ...props }, ref) => {
+var Textarea = React10.forwardRef(({ className, slotName = "textarea", ...props }, ref) => {
   return /* @__PURE__ */ jsx11(
     "textarea",
     {
@@ -1265,4 +1358,4 @@ export {
   TabsContent,
   Textarea
 };
-//# sourceMappingURL=chunk-UCJTM3UM.js.map
+//# sourceMappingURL=chunk-DPLCEU34.js.map