@acronis-platform/ui-react 3.0.0 → 4.1.0

package/dist/components/ui/sheet/sheet.js

@@ -1,136 +1,80 @@
-import { jsx as r, jsxs as u } from "react/jsx-runtime";
-import * as s from "react";
-import { Dialog as a } from "@base-ui/react/dialog";
-import { TimesIcon as b } from "@acronis-platform/icons-react/stroke-mono";
-import { cva as g } from "../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
-import { cn as d } from "../../../lib/utils.js";
-import { usePortalContainer as x } from "../../../lib/portal-container.js";
-const S = g(
-  "fixed z-50 flex flex-col overflow-hidden bg-muted text-foreground shadow-lg duration-300 data-[open]:animate-in data-[closed]:animate-out",
-  {
-    variants: {
-      side: {
-        top: "inset-x-0 top-0 max-h-[80vh] border-b border-border data-[open]:slide-in-from-top data-[closed]:slide-out-to-top",
-        bottom: "inset-x-0 bottom-0 max-h-[80vh] border-t border-border data-[open]:slide-in-from-bottom data-[closed]:slide-out-to-bottom",
-        left: "inset-y-0 left-0 h-full w-3/4 border-r border-border data-[open]:slide-in-from-left data-[closed]:slide-out-to-left sm:max-w-md",
-        right: "inset-y-0 right-0 h-full w-3/4 border-l border-border data-[open]:slide-in-from-right data-[closed]:slide-out-to-right sm:max-w-md"
-      }
-    },
-    defaultVariants: {
-      side: "right"
-    }
-  }
-), H = a.Root, O = a.Trigger, V = a.Portal, I = a.Close, y = s.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
-  a.Backdrop,
-  {
-    ref: t,
-    className: d(
-      "fixed inset-0 z-50 duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[closed]:animate-out data-[closed]:fade-out-0",
-      e
-    ),
-    ...o
-  }
-));
-y.displayName = "SheetOverlay";
-const v = s.forwardRef(
-  ({
-    className: e,
-    children: o,
-    side: t,
-    portal: n = !0,
-    portalContainer: l,
-    keepMounted: m,
-    ...f
-  }, c) => {
-    const p = x(), h = l ?? p, i = /* @__PURE__ */ r(
-      a.Popup,
-      {
-        ref: c,
-        className: d(S({ side: t }), e),
-        ...f,
-        children: o
-      }
-    );
-    return n ? /* @__PURE__ */ r(a.Portal, { container: h, keepMounted: m, children: i }) : i;
-  }
-);
-v.displayName = "SheetContent";
-const N = s.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
-  "div",
-  {
-    ref: t,
-    className: d(
-      "flex h-16 shrink-0 items-center gap-4 border-b border-border bg-background px-5 py-4",
-      e
-    ),
-    ...o
-  }
-));
-N.displayName = "SheetHeader";
-const w = s.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
-  "div",
-  {
-    ref: t,
-    className: d(
-      "flex h-16 shrink-0 items-center justify-end gap-4 border-t border-border bg-background px-6 py-4",
-      e
-    ),
-    ...o
-  }
-));
-w.displayName = "SheetFooter";
-const C = s.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r("div", { ref: t, className: d("flex-1 overflow-auto p-6", e), ...o }));
-C.displayName = "SheetBody";
-const R = s.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
-  a.Title,
-  {
-    ref: t,
-    className: d(
-      "flex-1 text-lg font-semibold leading-7 text-foreground",
-      e
-    ),
-    ...o
-  }
-));
-R.displayName = "SheetTitle";
-const T = s.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
-  a.Description,
-  {
-    ref: t,
-    className: d("text-sm text-muted-foreground", e),
-    ...o
-  }
-));
-T.displayName = "SheetDescription";
-const k = s.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ u(
-  a.Close,
-  {
-    ref: t,
-    className: d(
-      "rounded p-1 text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)] disabled:pointer-events-none",
-      e
-    ),
-    ...o,
-    children: [
-      /* @__PURE__ */ r(b, { size: 24 }),
-      /* @__PURE__ */ r("span", { className: "sr-only", children: "Close" })
-    ]
-  }
-));
-k.displayName = "SheetCloseButton";
-export {
-  H as Sheet,
-  C as SheetBody,
-  I as SheetClose,
-  k as SheetCloseButton,
-  v as SheetContent,
-  T as SheetDescription,
-  w as SheetFooter,
-  N as SheetHeader,
-  y as SheetOverlay,
-  V as SheetPortal,
-  R as SheetTitle,
-  O as SheetTrigger,
-  S as sheetVariants
-};
-//# sourceMappingURL=sheet.js.map
+import { cn as e } from "../../../lib/utils.js";
+import { usePortalContainer as t } from "../../../lib/portal-container.js";
+import { cva as n } from "../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import * as r from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { TimesIcon as o } from "@acronis-platform/icons-react/stroke-mono";
+import { Dialog as s } from "@base-ui/react/dialog";
+//#region src/components/ui/sheet/sheet.tsx
+var c = n("fixed z-50 flex flex-col overflow-hidden bg-muted text-foreground shadow-lg duration-300 data-[open]:animate-in data-[closed]:animate-out", {
+	variants: { side: {
+		top: "inset-x-0 top-0 max-h-[80vh] border-b border-border data-[open]:slide-in-from-top data-[closed]:slide-out-to-top",
+		bottom: "inset-x-0 bottom-0 max-h-[80vh] border-t border-border data-[open]:slide-in-from-bottom data-[closed]:slide-out-to-bottom",
+		left: "inset-y-0 left-0 h-full w-3/4 border-r border-border data-[open]:slide-in-from-left data-[closed]:slide-out-to-left sm:max-w-md",
+		right: "inset-y-0 right-0 h-full w-3/4 border-l border-border data-[open]:slide-in-from-right data-[closed]:slide-out-to-right sm:max-w-md"
+	} },
+	defaultVariants: { side: "right" }
+}), l = s.Root, u = s.Trigger, d = s.Portal, f = s.Close, p = r.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ i(s.Backdrop, {
+	ref: r,
+	className: e("fixed inset-0 z-50 duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[closed]:animate-out data-[closed]:fade-out-0", t),
+	...n
+}));
+p.displayName = "SheetOverlay";
+var m = r.forwardRef(({ className: n, children: r, side: a, portal: o = !0, portalContainer: l, keepMounted: u, ...d }, f) => {
+	let p = t(), m = l ?? p, h = /* @__PURE__ */ i(s.Popup, {
+		ref: f,
+		className: e(c({ side: a }), n),
+		...d,
+		children: r
+	});
+	return o ? /* @__PURE__ */ i(s.Portal, {
+		container: m,
+		keepMounted: u,
+		children: h
+	}) : h;
+});
+m.displayName = "SheetContent";
+var h = r.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ i("div", {
+	ref: r,
+	className: e("flex h-16 shrink-0 items-center gap-4 border-b border-border bg-background px-5 py-4", t),
+	...n
+}));
+h.displayName = "SheetHeader";
+var g = r.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ i("div", {
+	ref: r,
+	className: e("flex h-16 shrink-0 items-center justify-end gap-4 border-t border-border bg-background px-6 py-4", t),
+	...n
+}));
+g.displayName = "SheetFooter";
+var _ = r.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ i("div", {
+	ref: r,
+	className: e("flex-1 overflow-auto p-6", t),
+	...n
+}));
+_.displayName = "SheetBody";
+var v = r.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ i(s.Title, {
+	ref: r,
+	className: e("flex-1 text-lg font-semibold leading-7 text-foreground", t),
+	...n
+}));
+v.displayName = "SheetTitle";
+var y = r.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ i(s.Description, {
+	ref: r,
+	className: e("text-sm text-muted-foreground", t),
+	...n
+}));
+y.displayName = "SheetDescription";
+var b = r.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ a(s.Close, {
+	ref: r,
+	className: e("rounded p-1 text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)] disabled:pointer-events-none", t),
+	...n,
+	children: [/* @__PURE__ */ i(o, { size: 24 }), /* @__PURE__ */ i("span", {
+		className: "sr-only",
+		children: "Close"
+	})]
+}));
+b.displayName = "SheetCloseButton";
+//#endregion
+export { l as Sheet, _ as SheetBody, f as SheetClose, b as SheetCloseButton, m as SheetContent, y as SheetDescription, g as SheetFooter, h as SheetHeader, p as SheetOverlay, d as SheetPortal, v as SheetTitle, u as SheetTrigger, c as sheetVariants };
+
+//# sourceMappingURL=sheet.js.map

package/dist/components/ui/sheet/sheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"sheet.js","sources":["../../../../src/components/ui/sheet/sheet.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { TimesIcon } from '@acronis-platform/icons-react/stroke-mono';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\nimport { usePortalContainer } from '@/lib/portal-container';\n\n// Initial version ported from `@acronis-platform/shadcn-uikit`'s `sheet`\n// (packages/ui-legacy/src/components/ui/sheet.tsx). A modal side panel — the\n// same Base UI Dialog primitive the `Dialog` component uses (keyboard, focus\n// trap, scroll lock, ARIA come from Base UI), but anchored to a screen edge with\n// a slide transition. In the Vue kit this was `Details`; it's re-exported under\n// `Details*` aliases for a 1:1 drop-in. No `--ui-sheet-*` token tier exists yet,\n// so this design-pending v1 mirrors the Dialog family's semantic theming.\n// Sheets do NOT render a backdrop — they open on top of the page — so the\n// `SheetOverlay`/`DetailsOverlay` export is retained for drop-in compat but is\n// no longer part of the default `SheetContent` render.\n//   • panel    -> bg-muted        = --ui-background-surface-secondary\n//   • header / footer -> bg-background = --ui-background-surface-primary bars,\n//     divided by border-border\n//   • title    -> text-foreground / description -> text-muted-foreground\n//   • close    -> text-muted-foreground → hover text-foreground, focus ring\n//     var(--ui-focus-primary)\n// Enter/exit slide animations use `tw-animate-css` (imported in styles/index.css),\n// keyed to Base UI's data-[open] / data-[closed] state attributes. Reconcile\n// against the real design with `/figma-component Sheet <url> --update`\n// (Cyber-Compliance node 3442-31542) once the mockup is ready for dev.\n\nconst sheetVariants = cva(\n  'fixed z-50 flex flex-col overflow-hidden bg-muted text-foreground shadow-lg duration-300 data-[open]:animate-in data-[closed]:animate-out',\n  {\n    variants: {\n      side: {\n        top: 'inset-x-0 top-0 max-h-[80vh] border-b border-border data-[open]:slide-in-from-top data-[closed]:slide-out-to-top',\n        bottom:\n          'inset-x-0 bottom-0 max-h-[80vh] border-t border-border data-[open]:slide-in-from-bottom data-[closed]:slide-out-to-bottom',\n        left: 'inset-y-0 left-0 h-full w-3/4 border-r border-border data-[open]:slide-in-from-left data-[closed]:slide-out-to-left sm:max-w-md',\n        right:\n          'inset-y-0 right-0 h-full w-3/4 border-l border-border data-[open]:slide-in-from-right data-[closed]:slide-out-to-right sm:max-w-md',\n      },\n    },\n    defaultVariants: {\n      side: 'right',\n    },\n  }\n);\n\nconst Sheet = DialogPrimitive.Root;\n\nconst SheetTrigger = DialogPrimitive.Trigger;\n\nconst SheetPortal = DialogPrimitive.Portal;\n\nconst SheetClose = DialogPrimitive.Close;\n\nconst SheetOverlay = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Backdrop>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Backdrop>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Backdrop\n    ref={ref}\n    className={cn(\n      'fixed inset-0 z-50 duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[closed]:animate-out data-[closed]:fade-out-0',\n      className\n    )}\n    {...props}\n  />\n));\nSheetOverlay.displayName = 'SheetOverlay';\n\nexport interface SheetContentProps\n  extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Popup>,\n    VariantProps<typeof sheetVariants> {\n  /** Screen edge the panel anchors to. Defaults to `right`. */\n  side?: VariantProps<typeof sheetVariants>['side'];\n  /**\n   * Render the content inside a portal (default `true`). Base UI requires the\n   * Popup to sit in a Portal for correct stacking; set `false` for inline usage\n   * (e.g. when the caller supplies its own `SheetPortal`, or in tests).\n   */\n  portal?: boolean;\n  /**\n   * Portal container. Pass a shadow-root mount for isolated-style previews\n   * (the docs demos do this via `useShadowMount`).\n   */\n  portalContainer?: DialogPrimitive.Portal.Props['container'];\n  /** Keep the content mounted while closed (Base UI `Portal` prop). */\n  keepMounted?: DialogPrimitive.Portal.Props['keepMounted'];\n}\n\nconst SheetContent = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Popup>,\n  SheetContentProps\n>(\n  (\n    {\n      className,\n      children,\n      side,\n      portal = true,\n      portalContainer,\n      keepMounted,\n      ...props\n    },\n    ref\n  ) => {\n    const ctxContainer = usePortalContainer();\n    const resolvedContainer = portalContainer ?? ctxContainer;\n\n    const popup = (\n      <DialogPrimitive.Popup\n        ref={ref}\n        className={cn(sheetVariants({ side }), className)}\n        {...props}\n      >\n        {children}\n      </DialogPrimitive.Popup>\n    );\n\n    return portal ? (\n      <DialogPrimitive.Portal container={resolvedContainer} keepMounted={keepMounted}>\n        {popup}\n      </DialogPrimitive.Portal>\n    ) : (\n      popup\n    );\n  }\n);\nSheetContent.displayName = 'SheetContent';\n\nconst SheetHeader = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex h-16 shrink-0 items-center gap-4 border-b border-border bg-background px-5 py-4',\n      className\n    )}\n    {...props}\n  />\n));\nSheetHeader.displayName = 'SheetHeader';\n\nconst SheetFooter = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex h-16 shrink-0 items-center justify-end gap-4 border-t border-border bg-background px-6 py-4',\n      className\n    )}\n    {...props}\n  />\n));\nSheetFooter.displayName = 'SheetFooter';\n\nconst SheetBody = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn('flex-1 overflow-auto p-6', className)} {...props} />\n));\nSheetBody.displayName = 'SheetBody';\n\nconst SheetTitle = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Title\n    ref={ref}\n    className={cn(\n      'flex-1 text-lg font-semibold leading-7 text-foreground',\n      className\n    )}\n    {...props}\n  />\n));\nSheetTitle.displayName = 'SheetTitle';\n\nconst SheetDescription = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Description\n    ref={ref}\n    className={cn('text-sm text-muted-foreground', className)}\n    {...props}\n  />\n));\nSheetDescription.displayName = 'SheetDescription';\n\nconst SheetCloseButton = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Close>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Close\n    ref={ref}\n    className={cn(\n      'rounded p-1 text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)] disabled:pointer-events-none',\n      className\n    )}\n    {...props}\n  >\n    <TimesIcon size={24} />\n    <span className=\"sr-only\">Close</span>\n  </DialogPrimitive.Close>\n));\nSheetCloseButton.displayName = 'SheetCloseButton';\n\nexport {\n  Sheet,\n  SheetTrigger,\n  SheetPortal,\n  SheetClose,\n  SheetCloseButton,\n  SheetOverlay,\n  SheetContent,\n  SheetHeader,\n  SheetFooter,\n  SheetBody,\n  SheetTitle,\n  SheetDescription,\n  sheetVariants,\n};\n"],"names":["sheetVariants","cva","Sheet","DialogPrimitive","SheetTrigger","SheetPortal","SheetClose","SheetOverlay","React","className","props","ref","jsx","cn","SheetContent","children","side","portal","portalContainer","keepMounted","ctxContainer","usePortalContainer","resolvedContainer","popup","SheetHeader","SheetFooter","SheetBody","SheetTitle","SheetDescription","SheetCloseButton","jsxs","TimesIcon"],"mappings":"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"}
+{"version":3,"file":"sheet.js","names":[],"sources":["../../../../src/components/ui/sheet/sheet.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { TimesIcon } from '@acronis-platform/icons-react/stroke-mono';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\nimport { usePortalContainer } from '@/lib/portal-container';\n\n// Initial version ported from `@acronis-platform/shadcn-uikit`'s `sheet`\n// (packages/ui-legacy/src/components/ui/sheet.tsx). A modal side panel — the\n// same Base UI Dialog primitive the `Dialog` component uses (keyboard, focus\n// trap, scroll lock, ARIA come from Base UI), but anchored to a screen edge with\n// a slide transition. In the Vue kit this was `Details`; it's re-exported under\n// `Details*` aliases for a 1:1 drop-in. No `--ui-sheet-*` token tier exists yet,\n// so this design-pending v1 mirrors the Dialog family's semantic theming.\n// Sheets do NOT render a backdrop — they open on top of the page — so the\n// `SheetOverlay`/`DetailsOverlay` export is retained for drop-in compat but is\n// no longer part of the default `SheetContent` render.\n//   • panel    -> bg-muted        = --ui-background-surface-secondary\n//   • header / footer -> bg-background = --ui-background-surface-primary bars,\n//     divided by border-border\n//   • title    -> text-foreground / description -> text-muted-foreground\n//   • close    -> text-muted-foreground → hover text-foreground, focus ring\n//     var(--ui-focus-primary)\n// Enter/exit slide animations use `tw-animate-css` (imported in styles/index.css),\n// keyed to Base UI's data-[open] / data-[closed] state attributes. Reconcile\n// against the real design with `/figma-component Sheet <url> --update`\n// (Cyber-Compliance node 3442-31542) once the mockup is ready for dev.\n\nconst sheetVariants = cva(\n  'fixed z-50 flex flex-col overflow-hidden bg-muted text-foreground shadow-lg duration-300 data-[open]:animate-in data-[closed]:animate-out',\n  {\n    variants: {\n      side: {\n        top: 'inset-x-0 top-0 max-h-[80vh] border-b border-border data-[open]:slide-in-from-top data-[closed]:slide-out-to-top',\n        bottom:\n          'inset-x-0 bottom-0 max-h-[80vh] border-t border-border data-[open]:slide-in-from-bottom data-[closed]:slide-out-to-bottom',\n        left: 'inset-y-0 left-0 h-full w-3/4 border-r border-border data-[open]:slide-in-from-left data-[closed]:slide-out-to-left sm:max-w-md',\n        right:\n          'inset-y-0 right-0 h-full w-3/4 border-l border-border data-[open]:slide-in-from-right data-[closed]:slide-out-to-right sm:max-w-md',\n      },\n    },\n    defaultVariants: {\n      side: 'right',\n    },\n  }\n);\n\nconst Sheet = DialogPrimitive.Root;\n\nconst SheetTrigger = DialogPrimitive.Trigger;\n\nconst SheetPortal = DialogPrimitive.Portal;\n\nconst SheetClose = DialogPrimitive.Close;\n\nconst SheetOverlay = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Backdrop>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Backdrop>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Backdrop\n    ref={ref}\n    className={cn(\n      'fixed inset-0 z-50 duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[closed]:animate-out data-[closed]:fade-out-0',\n      className\n    )}\n    {...props}\n  />\n));\nSheetOverlay.displayName = 'SheetOverlay';\n\nexport interface SheetContentProps\n  extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Popup>,\n    VariantProps<typeof sheetVariants> {\n  /** Screen edge the panel anchors to. Defaults to `right`. */\n  side?: VariantProps<typeof sheetVariants>['side'];\n  /**\n   * Render the content inside a portal (default `true`). Base UI requires the\n   * Popup to sit in a Portal for correct stacking; set `false` for inline usage\n   * (e.g. when the caller supplies its own `SheetPortal`, or in tests).\n   */\n  portal?: boolean;\n  /**\n   * Portal container. Pass a shadow-root mount for isolated-style previews\n   * (the docs demos do this via `useShadowMount`).\n   */\n  portalContainer?: DialogPrimitive.Portal.Props['container'];\n  /** Keep the content mounted while closed (Base UI `Portal` prop). */\n  keepMounted?: DialogPrimitive.Portal.Props['keepMounted'];\n}\n\nconst SheetContent = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Popup>,\n  SheetContentProps\n>(\n  (\n    {\n      className,\n      children,\n      side,\n      portal = true,\n      portalContainer,\n      keepMounted,\n      ...props\n    },\n    ref\n  ) => {\n    const ctxContainer = usePortalContainer();\n    const resolvedContainer = portalContainer ?? ctxContainer;\n\n    const popup = (\n      <DialogPrimitive.Popup\n        ref={ref}\n        className={cn(sheetVariants({ side }), className)}\n        {...props}\n      >\n        {children}\n      </DialogPrimitive.Popup>\n    );\n\n    return portal ? (\n      <DialogPrimitive.Portal container={resolvedContainer} keepMounted={keepMounted}>\n        {popup}\n      </DialogPrimitive.Portal>\n    ) : (\n      popup\n    );\n  }\n);\nSheetContent.displayName = 'SheetContent';\n\nconst SheetHeader = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex h-16 shrink-0 items-center gap-4 border-b border-border bg-background px-5 py-4',\n      className\n    )}\n    {...props}\n  />\n));\nSheetHeader.displayName = 'SheetHeader';\n\nconst SheetFooter = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex h-16 shrink-0 items-center justify-end gap-4 border-t border-border bg-background px-6 py-4',\n      className\n    )}\n    {...props}\n  />\n));\nSheetFooter.displayName = 'SheetFooter';\n\nconst SheetBody = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn('flex-1 overflow-auto p-6', className)} {...props} />\n));\nSheetBody.displayName = 'SheetBody';\n\nconst SheetTitle = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Title\n    ref={ref}\n    className={cn(\n      'flex-1 text-lg font-semibold leading-7 text-foreground',\n      className\n    )}\n    {...props}\n  />\n));\nSheetTitle.displayName = 'SheetTitle';\n\nconst SheetDescription = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Description\n    ref={ref}\n    className={cn('text-sm text-muted-foreground', className)}\n    {...props}\n  />\n));\nSheetDescription.displayName = 'SheetDescription';\n\nconst SheetCloseButton = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Close>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Close\n    ref={ref}\n    className={cn(\n      'rounded p-1 text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)] disabled:pointer-events-none',\n      className\n    )}\n    {...props}\n  >\n    <TimesIcon size={24} />\n    <span className=\"sr-only\">Close</span>\n  </DialogPrimitive.Close>\n));\nSheetCloseButton.displayName = 'SheetCloseButton';\n\nexport {\n  Sheet,\n  SheetTrigger,\n  SheetPortal,\n  SheetClose,\n  SheetCloseButton,\n  SheetOverlay,\n  SheetContent,\n  SheetHeader,\n  SheetFooter,\n  SheetBody,\n  SheetTitle,\n  SheetDescription,\n  sheetVariants,\n};\n"],"mappings":";;;;;;;;AA6BA,IAAM,IAAgB,EACpB,6IACA;CACE,UAAU,EACR,MAAM;EACJ,KAAK;EACL,QACE;EACF,MAAM;EACN,OACE;CACJ,EACF;CACA,iBAAiB,EACf,MAAM,QACR;AACF,CACF,GAEM,IAAQ,EAAgB,MAExB,IAAe,EAAgB,SAE/B,IAAc,EAAgB,QAE9B,IAAa,EAAgB,OAE7B,IAAe,EAAM,YAGxB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,EAAgB,UAAjB;CACO;CACL,WAAW,EACT,mIACA,CACF;CACA,GAAI;AACL,CAAA,CACF;AACD,EAAa,cAAc;AAsB3B,IAAM,IAAe,EAAM,YAKvB,EACE,cACA,aACA,SACA,YAAS,IACT,oBACA,gBACA,GAAG,KAEL,MACG;CACH,IAAM,IAAe,EAAmB,GAClC,IAAoB,KAAmB,GAEvC,IACJ,kBAAC,EAAgB,OAAjB;EACO;EACL,WAAW,EAAG,EAAc,EAAE,QAAK,CAAC,GAAG,CAAS;EAChD,GAAI;EAEH;CACoB,CAAA;CAGzB,OAAO,IACL,kBAAC,EAAgB,QAAjB;EAAwB,WAAW;EAAgC;EAChE,UAAA;CACqB,CAAA,IAExB;AAEJ,CACF;AACA,EAAa,cAAc;AAE3B,IAAM,IAAc,EAAM,YAGvB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,OAAD;CACO;CACL,WAAW,EACT,wFACA,CACF;CACA,GAAI;AACL,CAAA,CACF;AACD,EAAY,cAAc;AAE1B,IAAM,IAAc,EAAM,YAGvB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,OAAD;CACO;CACL,WAAW,EACT,oGACA,CACF;CACA,GAAI;AACL,CAAA,CACF;AACD,EAAY,cAAc;AAE1B,IAAM,IAAY,EAAM,YAGrB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,OAAD;CAAU;CAAK,WAAW,EAAG,4BAA4B,CAAS;CAAG,GAAI;AAAQ,CAAA,CAClF;AACD,EAAU,cAAc;AAExB,IAAM,IAAa,EAAM,YAGtB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,EAAgB,OAAjB;CACO;CACL,WAAW,EACT,0DACA,CACF;CACA,GAAI;AACL,CAAA,CACF;AACD,EAAW,cAAc;AAEzB,IAAM,IAAmB,EAAM,YAG5B,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,EAAgB,aAAjB;CACO;CACL,WAAW,EAAG,iCAAiC,CAAS;CACxD,GAAI;AACL,CAAA,CACF;AACD,EAAiB,cAAc;AAE/B,IAAM,IAAmB,EAAM,YAG5B,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,EAAgB,OAAjB;CACO;CACL,WAAW,EACT,uMACA,CACF;CACA,GAAI;CANN,UAAA,CAQE,kBAAC,GAAD,EAAW,MAAM,GAAK,CAAA,GACtB,kBAAC,QAAD;EAAM,WAAU;EAAU,UAAA;CAAW,CAAA,CAChB;AACxB,CAAA,CAAA;AACD,EAAiB,cAAc"}