@epilot/spark-ui 0.23.1 → 0.23.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/dist/components/attachment.d.cts +1 -1
  2. package/dist/components/attachment.d.ts +1 -1
  3. package/dist/components/avatar.js +1 -1
  4. package/dist/components/badge.js +1 -1
  5. package/dist/components/box.js +1 -1
  6. package/dist/components/bubble.d.cts +1 -1
  7. package/dist/components/bubble.d.ts +1 -1
  8. package/dist/components/button-group.js +1 -1
  9. package/dist/components/button.d.cts +3 -3
  10. package/dist/components/button.d.ts +3 -3
  11. package/dist/components/button.js +1 -1
  12. package/dist/components/callout.d.cts +1 -1
  13. package/dist/components/callout.d.ts +1 -1
  14. package/dist/components/card.js +1 -1
  15. package/dist/components/checkbox.js +1 -1
  16. package/dist/components/icon.js +1 -1
  17. package/dist/components/input-group.d.cts +1 -1
  18. package/dist/components/input-group.d.ts +1 -1
  19. package/dist/components/input-otp.cjs +1 -1
  20. package/dist/components/input-otp.js +1 -1
  21. package/dist/components/input.cjs +1 -1
  22. package/dist/components/input.js +1 -1
  23. package/dist/components/marker.d.cts +1 -1
  24. package/dist/components/marker.d.ts +1 -1
  25. package/dist/components/message-scroller.cjs +1 -1
  26. package/dist/components/message-scroller.js +1 -1
  27. package/dist/components/page-header.d.cts +1 -1
  28. package/dist/components/page-header.d.ts +1 -1
  29. package/dist/components/pill.js +1 -1
  30. package/dist/components/radio.js +1 -1
  31. package/dist/components/select.cjs +1 -1
  32. package/dist/components/select.js +1 -1
  33. package/dist/components/sheet.cjs +1 -1
  34. package/dist/components/sheet.cjs.map +1 -1
  35. package/dist/components/sheet.js +1 -1
  36. package/dist/components/sheet.js.map +1 -1
  37. package/dist/components/switch.js +1 -1
  38. package/dist/components/textarea.cjs +1 -1
  39. package/dist/components/textarea.js +1 -1
  40. package/dist/components/theme.js +1 -1
  41. package/dist/components/toggle-group.js +1 -1
  42. package/dist/components/toggle.cjs +1 -1
  43. package/dist/components/toggle.js +2 -2
  44. package/package.json +1 -1
@@ -7,7 +7,7 @@ import { useRender } from "@base-ui/react/use-render";
7
7
 
8
8
  //#region src/components/attachment.d.ts
9
9
  declare const attachmentVariants: (props?: ({
10
- size?: "sm" | "default" | "xs" | null | undefined;
10
+ size?: "default" | "sm" | "xs" | null | undefined;
11
11
  orientation?: "horizontal" | "vertical" | null | undefined;
12
12
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
13
13
  declare function Attachment({
@@ -7,7 +7,7 @@ import { useRender } from "@base-ui/react/use-render";
7
7
 
8
8
  //#region src/components/attachment.d.ts
9
9
  declare const attachmentVariants: (props?: ({
10
- size?: "sm" | "default" | "xs" | null | undefined;
10
+ size?: "default" | "sm" | "xs" | null | undefined;
11
11
  orientation?: "horizontal" | "vertical" | null | undefined;
12
12
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
13
13
  declare function Attachment({
@@ -1,6 +1,6 @@
1
1
  "use client";
2
- import { cn } from "../utils/cn.js";
3
2
  import { accentByColor } from "../lib/accent-colors.js";
3
+ import { cn } from "../utils/cn.js";
4
4
  import * as React$1 from "react";
5
5
  import { jsx, jsxs } from "react/jsx-runtime";
6
6
  import { Avatar as Avatar$1 } from "@base-ui/react/avatar";
@@ -1,6 +1,6 @@
1
1
  "use client";
2
- import { cn } from "../utils/cn.js";
3
2
  import { accentByColor } from "../lib/accent-colors.js";
3
+ import { cn } from "../utils/cn.js";
4
4
  import * as React$1 from "react";
5
5
  import { jsx } from "react/jsx-runtime";
6
6
  //#region src/components/badge.tsx
@@ -1,6 +1,6 @@
1
1
  "use client";
2
- import { cn } from "../utils/cn.js";
3
2
  import { containerChrome, containerInteractiveClasses, containerPaddingAll, radiusClasses } from "../lib/container-chrome.js";
3
+ import { cn } from "../utils/cn.js";
4
4
  import { cva } from "class-variance-authority";
5
5
  import { mergeProps } from "@base-ui/react/merge-props";
6
6
  import { useRender } from "@base-ui/react/use-render";
@@ -10,7 +10,7 @@ declare function BubbleGroup({
10
10
  ...props
11
11
  }: React$1.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
12
12
  declare const bubbleVariants: (props?: ({
13
- variant?: "ghost" | "outline" | "default" | "secondary" | "muted" | "tinted" | "destructive" | null | undefined;
13
+ variant?: "default" | "destructive" | "secondary" | "ghost" | "outline" | "muted" | "tinted" | null | undefined;
14
14
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
15
15
  declare function Bubble({
16
16
  variant,
@@ -10,7 +10,7 @@ declare function BubbleGroup({
10
10
  ...props
11
11
  }: React$1.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
12
12
  declare const bubbleVariants: (props?: ({
13
- variant?: "ghost" | "outline" | "default" | "secondary" | "muted" | "tinted" | "destructive" | null | undefined;
13
+ variant?: "default" | "destructive" | "secondary" | "ghost" | "outline" | "muted" | "tinted" | null | undefined;
14
14
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
15
15
  declare function Bubble({
16
16
  variant,
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  "use client";
3
- import { cn } from "../utils/cn.js";
4
3
  import { accentByColor } from "../lib/accent-colors.js";
4
+ import { cn } from "../utils/cn.js";
5
5
  import * as React$1 from "react";
6
6
  import { jsx } from "react/jsx-runtime";
7
7
  import { Button } from "@base-ui/react/button";
@@ -7,9 +7,9 @@ import { VariantProps } from "class-variance-authority";
7
7
 
8
8
  //#region src/components/button.d.ts
9
9
  declare const buttonVariants: (props?: ({
10
- variant?: "secondary" | "destructive" | "primary" | "tertiary" | "bare" | null | undefined;
11
- color?: "neutral" | "accent" | "destructive" | "primary" | "danger" | null | undefined;
12
- size?: "small" | "default" | "medium" | "icon-small" | "icon" | "icon-medium" | null | undefined;
10
+ variant?: "primary" | "destructive" | "secondary" | "tertiary" | "bare" | null | undefined;
11
+ color?: "accent" | "primary" | "neutral" | "danger" | "destructive" | null | undefined;
12
+ size?: "default" | "small" | "medium" | "icon-small" | "icon" | "icon-medium" | null | undefined;
13
13
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
14
14
  /** Preferred: `primary` | `neutral` | `destructive`. `accent` / `danger` stay as aliases. */
15
15
  type SparkButtonColor = 'primary' | 'accent' | 'neutral' | 'destructive' | 'danger';
@@ -7,9 +7,9 @@ import { VariantProps } from "class-variance-authority";
7
7
 
8
8
  //#region src/components/button.d.ts
9
9
  declare const buttonVariants: (props?: ({
10
- variant?: "secondary" | "destructive" | "primary" | "tertiary" | "bare" | null | undefined;
11
- color?: "neutral" | "accent" | "destructive" | "primary" | "danger" | null | undefined;
12
- size?: "small" | "default" | "medium" | "icon-small" | "icon" | "icon-medium" | null | undefined;
10
+ variant?: "primary" | "destructive" | "secondary" | "tertiary" | "bare" | null | undefined;
11
+ color?: "accent" | "primary" | "neutral" | "danger" | "destructive" | null | undefined;
12
+ size?: "default" | "small" | "medium" | "icon-small" | "icon" | "icon-medium" | null | undefined;
13
13
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
14
14
  /** Preferred: `primary` | `neutral` | `destructive`. `accent` / `danger` stay as aliases. */
15
15
  type SparkButtonColor = 'primary' | 'accent' | 'neutral' | 'destructive' | 'danger';
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  "use client";
3
- import { cn } from "../utils/cn.js";
4
3
  import { accentByColor } from "../lib/accent-colors.js";
4
+ import { cn } from "../utils/cn.js";
5
5
  import * as React$1 from "react";
6
6
  import { jsx } from "react/jsx-runtime";
7
7
  import { Button as Button$1 } from "@base-ui/react/button";
@@ -8,7 +8,7 @@ import { SparkIcon } from "@epilot/spark-icons";
8
8
  //#region src/components/callout.d.ts
9
9
  type CalloutVariant = 'error' | 'info' | 'neutral' | 'success' | 'warning';
10
10
  declare const calloutVariants: (props?: ({
11
- variant?: "neutral" | "error" | "success" | "warning" | "info" | null | undefined;
11
+ variant?: "neutral" | "success" | "warning" | "error" | "info" | null | undefined;
12
12
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
13
13
  interface CalloutProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof calloutVariants> {
14
14
  /** Overrides the variant's default icon; the variant's color is kept. `false` renders no icon. */
@@ -8,7 +8,7 @@ import { VariantProps } from "class-variance-authority";
8
8
  //#region src/components/callout.d.ts
9
9
  type CalloutVariant = 'error' | 'info' | 'neutral' | 'success' | 'warning';
10
10
  declare const calloutVariants: (props?: ({
11
- variant?: "neutral" | "error" | "success" | "warning" | "info" | null | undefined;
11
+ variant?: "neutral" | "success" | "warning" | "error" | "info" | null | undefined;
12
12
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
13
13
  interface CalloutProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof calloutVariants> {
14
14
  /** Overrides the variant's default icon; the variant's color is kept. `false` renders no icon. */
@@ -1,6 +1,6 @@
1
1
  "use client";
2
- import { cn } from "../utils/cn.js";
3
2
  import { containerChrome, containerInteractiveClasses, containerPaddingX, radiusClasses } from "../lib/container-chrome.js";
3
+ import { cn } from "../utils/cn.js";
4
4
  import * as React$1 from "react";
5
5
  import { jsx, jsxs } from "react/jsx-runtime";
6
6
  import { cva } from "class-variance-authority";
@@ -1,6 +1,6 @@
1
1
  "use client";
2
- import { cn } from "../utils/cn.js";
3
2
  import { accentByColor } from "../lib/accent-colors.js";
3
+ import { cn } from "../utils/cn.js";
4
4
  import * as React$1 from "react";
5
5
  import { jsx, jsxs } from "react/jsx-runtime";
6
6
  import { Checkbox as Checkbox$1 } from "@base-ui/react/checkbox";
@@ -1,6 +1,6 @@
1
1
  "use client";
2
- import { cn } from "../utils/cn.js";
3
2
  import { accentByColor } from "../lib/accent-colors.js";
3
+ import { cn } from "../utils/cn.js";
4
4
  import "react";
5
5
  import { jsx } from "react/jsx-runtime";
6
6
  //#region src/components/icon.tsx
@@ -10,7 +10,7 @@ declare function InputGroup({
10
10
  ...props
11
11
  }: React$1.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
12
12
  declare const inputGroupAddonVariants: (props?: ({
13
- align?: "inline-end" | "inline-start" | null | undefined;
13
+ align?: "inline-start" | "inline-end" | null | undefined;
14
14
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
15
15
  declare function InputGroupAddon({
16
16
  className,
@@ -10,7 +10,7 @@ declare function InputGroup({
10
10
  ...props
11
11
  }: React$1.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
12
12
  declare const inputGroupAddonVariants: (props?: ({
13
- align?: "inline-end" | "inline-start" | null | undefined;
13
+ align?: "inline-start" | "inline-end" | null | undefined;
14
14
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
15
15
  declare function InputGroupAddon({
16
16
  className,
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const require_components_field = require("./field.cjs");
4
3
  const require_lib_input_box_variants = require("../lib/input-box-variants.cjs");
4
+ const require_components_field = require("./field.cjs");
5
5
  let react_jsx_runtime = require("react/jsx-runtime");
6
6
  let class_variance_authority = require("class-variance-authority");
7
7
  let _base_ui_react_otp_field = require("@base-ui/react/otp-field");
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import { cn } from "../utils/cn.js";
3
- import { useFieldControl } from "./field.js";
4
3
  import { GHOST_UNDERLINE, boxChrome } from "../lib/input-box-variants.js";
4
+ import { useFieldControl } from "./field.js";
5
5
  import { jsx } from "react/jsx-runtime";
6
6
  import { cva } from "class-variance-authority";
7
7
  import { OTPField } from "@base-ui/react/otp-field";
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const require_chunk = require("../chunk-DY84GLCh.cjs");
4
- const require_components_field = require("./field.cjs");
5
4
  const require_lib_input_box_variants = require("../lib/input-box-variants.cjs");
5
+ const require_components_field = require("./field.cjs");
6
6
  let react = require("react");
7
7
  react = require_chunk.__toESM(react);
8
8
  let react_jsx_runtime = require("react/jsx-runtime");
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import { cn } from "../utils/cn.js";
3
- import { useFieldControl } from "./field.js";
4
3
  import { GHOST_UNDERLINE, boxChrome } from "../lib/input-box-variants.js";
4
+ import { useFieldControl } from "./field.js";
5
5
  import * as React$1 from "react";
6
6
  import { jsx } from "react/jsx-runtime";
7
7
  import { cva } from "class-variance-authority";
@@ -6,7 +6,7 @@ import { useRender } from "@base-ui/react/use-render";
6
6
 
7
7
  //#region src/components/marker.d.ts
8
8
  declare const markerVariants: (props?: ({
9
- variant?: "separator" | "default" | "border" | null | undefined;
9
+ variant?: "default" | "separator" | "border" | null | undefined;
10
10
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
11
11
  declare function Marker({
12
12
  className,
@@ -6,7 +6,7 @@ import { useRender } from "@base-ui/react/use-render";
6
6
 
7
7
  //#region src/components/marker.d.ts
8
8
  declare const markerVariants: (props?: ({
9
- variant?: "separator" | "default" | "border" | null | undefined;
9
+ variant?: "default" | "separator" | "border" | null | undefined;
10
10
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
11
11
  declare function Marker({
12
12
  className,
@@ -2,8 +2,8 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const require_chunk = require("../chunk-DY84GLCh.cjs");
4
4
  const require_hooks_use_reduced_motion = require("../hooks/use-reduced-motion.cjs");
5
- const require_components_button = require("./button.cjs");
6
5
  const require_lib_message_animations = require("../lib/message-animations.cjs");
6
+ const require_components_button = require("./button.cjs");
7
7
  let react = require("react");
8
8
  react = require_chunk.__toESM(react);
9
9
  let _epilot_spark_icons = require("@epilot/spark-icons");
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import { useReducedMotion } from "../hooks/use-reduced-motion.js";
3
3
  import { cn } from "../utils/cn.js";
4
- import { Button } from "./button.js";
5
4
  import { MESSAGE_ANIMATIONS } from "../lib/message-animations.js";
5
+ import { Button } from "./button.js";
6
6
  import * as React$1 from "react";
7
7
  import { ArrowDownward, ArrowUpward } from "@epilot/spark-icons";
8
8
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -6,7 +6,7 @@ import { useRender } from "@base-ui/react/use-render";
6
6
 
7
7
  //#region src/components/page-header.d.ts
8
8
  declare const PageHeader: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLElement> & React$1.RefAttributes<HTMLElement>>;
9
- declare const PageHeaderBackButton: React$1.ForwardRefExoticComponent<Omit<ButtonProps, "color" | "styleVariant" | "size"> & React$1.RefAttributes<HTMLButtonElement>>;
9
+ declare const PageHeaderBackButton: React$1.ForwardRefExoticComponent<Omit<ButtonProps, "color" | "size" | "styleVariant"> & React$1.RefAttributes<HTMLButtonElement>>;
10
10
  declare const PageHeaderTitle: ({
11
11
  className,
12
12
  ...props
@@ -6,7 +6,7 @@ import { useRender } from "@base-ui/react/use-render";
6
6
 
7
7
  //#region src/components/page-header.d.ts
8
8
  declare const PageHeader: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLElement> & React$1.RefAttributes<HTMLElement>>;
9
- declare const PageHeaderBackButton: React$1.ForwardRefExoticComponent<Omit<ButtonProps, "color" | "styleVariant" | "size"> & React$1.RefAttributes<HTMLButtonElement>>;
9
+ declare const PageHeaderBackButton: React$1.ForwardRefExoticComponent<Omit<ButtonProps, "color" | "size" | "styleVariant"> & React$1.RefAttributes<HTMLButtonElement>>;
10
10
  declare const PageHeaderTitle: ({
11
11
  className,
12
12
  ...props
@@ -1,6 +1,6 @@
1
1
  "use client";
2
- import { cn } from "../utils/cn.js";
3
2
  import { accentByColor } from "../lib/accent-colors.js";
3
+ import { cn } from "../utils/cn.js";
4
4
  import * as React$1 from "react";
5
5
  import { Close } from "@epilot/spark-icons";
6
6
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -1,6 +1,6 @@
1
1
  "use client";
2
- import { cn } from "../utils/cn.js";
3
2
  import { accentByColor } from "../lib/accent-colors.js";
3
+ import { cn } from "../utils/cn.js";
4
4
  import "react";
5
5
  import { jsx } from "react/jsx-runtime";
6
6
  import { Radio as Radio$1 } from "@base-ui/react/radio";
@@ -2,8 +2,8 @@
2
2
  "use client";
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
4
4
  const require_chunk = require("../chunk-DY84GLCh.cjs");
5
- const require_components_field = require("./field.cjs");
6
5
  const require_lib_input_box_variants = require("../lib/input-box-variants.cjs");
6
+ const require_components_field = require("./field.cjs");
7
7
  let react = require("react");
8
8
  react = require_chunk.__toESM(react);
9
9
  let _epilot_spark_icons = require("@epilot/spark-icons");
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  "use client";
3
3
  import { cn } from "../utils/cn.js";
4
- import { useFieldControl } from "./field.js";
5
4
  import { boxChrome } from "../lib/input-box-variants.js";
5
+ import { useFieldControl } from "./field.js";
6
6
  import "react";
7
7
  import { Check, Close, KeyboardArrowDown } from "@epilot/spark-icons";
8
8
  import { jsx, jsxs } from "react/jsx-runtime";
@@ -52,7 +52,7 @@ function SheetContent({ side = "right", className, ...props }) {
52
52
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_dialog.Dialog.Popup, {
53
53
  "data-slot": "sheet-content",
54
54
  "data-side": side,
55
- className: (0, cn.cn)("fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-1 p-safe-offset-4 text-gray shadow-lg transition-[translate] duration-200 ease-in-out data-ending-style:duration-300 motion-reduce:transition-none", "data-[side=top]:inset-x-0 data-[side=top]:top-(--spark-viewport-top,0) data-[side=top]:border-b data-[side=top]:data-ending-style:-translate-y-full data-[side=top]:data-starting-style:-translate-y-full", "data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-(--spark-viewport-bottom-offset,0) data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-full data-[side=bottom]:data-starting-style:translate-y-full", "data-[side=left]:top-(--spark-viewport-top,0) data-[side=left]:left-0 data-[side=left]:h-(--spark-viewport-height,100%) data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:-translate-x-full data-[side=left]:data-starting-style:-translate-x-full data-[side=left]:sm:max-w-sm", "data-[side=right]:top-(--spark-viewport-top,0) data-[side=right]:right-0 data-[side=right]:h-(--spark-viewport-height,100%) data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-full data-[side=right]:data-starting-style:translate-x-full data-[side=right]:sm:max-w-sm", className),
55
+ className: (0, cn.cn)("fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-2 p-safe-offset-4 text-gray shadow-lg transition-[translate] duration-200 ease-in-out data-ending-style:duration-300 motion-reduce:transition-none", "data-[side=top]:inset-x-0 data-[side=top]:top-(--spark-viewport-top,0) data-[side=top]:border-b data-[side=top]:data-ending-style:-translate-y-full data-[side=top]:data-starting-style:-translate-y-full", "data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-(--spark-viewport-bottom-offset,0) data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-full data-[side=bottom]:data-starting-style:translate-y-full", "data-[side=left]:top-(--spark-viewport-top,0) data-[side=left]:left-0 data-[side=left]:h-(--spark-viewport-height,100%) data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:-translate-x-full data-[side=left]:data-starting-style:-translate-x-full data-[side=left]:sm:max-w-sm", "data-[side=right]:top-(--spark-viewport-top,0) data-[side=right]:right-0 data-[side=right]:h-(--spark-viewport-height,100%) data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-full data-[side=right]:data-starting-style:translate-x-full data-[side=right]:sm:max-w-sm", className),
56
56
  ...props
57
57
  });
58
58
  }
@@ -1 +1 @@
1
- {"version":3,"file":"sheet.cjs","names":["SheetPrimitive","buttonVariants","Close"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { Dialog as SheetPrimitive } from '@base-ui/react/dialog'\nimport { Close } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\nimport { buttonVariants } from './button'\n\nfunction Sheet(props: React.ComponentProps<typeof SheetPrimitive.Root>) {\n return <SheetPrimitive.Root {...props} />\n}\n\nfunction SheetTrigger(\n props: React.ComponentProps<typeof SheetPrimitive.Trigger>,\n) {\n return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />\n}\n\n// bare = the ready-made corner X (label is the consumer's, via aria-label);\n// with children or a render prop it stays the bare primitive (footer buttons, labeled closes)\nfunction SheetClose({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Close>) {\n if (children || props.render) {\n return (\n <SheetPrimitive.Close\n data-slot=\"sheet-close\"\n className={className}\n {...props}\n >\n {children}\n </SheetPrimitive.Close>\n )\n }\n\n return (\n <SheetPrimitive.Close\n data-slot=\"sheet-close\"\n className={cn(\n buttonVariants({ size: 'icon', variant: 'tertiary' }),\n 'absolute top-2.5 right-3 rounded-full',\n className,\n )}\n {...props}\n >\n <Close className=\"[--spark-icon-size:calc(20px*var(--spark-scaling,1))]\" />\n </SheetPrimitive.Close>\n )\n}\n\nfunction SheetPortal(\n props: React.ComponentProps<typeof SheetPrimitive.Portal>,\n) {\n return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />\n}\n\nfunction SheetOverlay({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Backdrop>) {\n return (\n <SheetPrimitive.Backdrop\n data-slot=\"sheet-overlay\"\n className={cn(\n 'fixed top-(--spark-viewport-top,0) right-0 left-0 z-50 h-(--spark-viewport-height,100%) bg-(--color-overlay) transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none',\n className,\n )}\n {...props}\n />\n )\n}\n\ninterface SheetContentProps extends React.ComponentProps<\n typeof SheetPrimitive.Popup\n> {\n side?: 'top' | 'right' | 'bottom' | 'left'\n}\n\nfunction SheetContent({\n side = 'right',\n className,\n ...props\n}: SheetContentProps) {\n return (\n <SheetPrimitive.Popup\n data-slot=\"sheet-content\"\n data-side={side}\n className={cn(\n 'fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-1 p-safe-offset-4 text-gray shadow-lg transition-[translate] duration-200 ease-in-out data-ending-style:duration-300 motion-reduce:transition-none',\n 'data-[side=top]:inset-x-0 data-[side=top]:top-(--spark-viewport-top,0) data-[side=top]:border-b data-[side=top]:data-ending-style:-translate-y-full data-[side=top]:data-starting-style:-translate-y-full',\n 'data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-(--spark-viewport-bottom-offset,0) data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-full data-[side=bottom]:data-starting-style:translate-y-full',\n 'data-[side=left]:top-(--spark-viewport-top,0) data-[side=left]:left-0 data-[side=left]:h-(--spark-viewport-height,100%) data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:-translate-x-full data-[side=left]:data-starting-style:-translate-x-full data-[side=left]:sm:max-w-sm',\n 'data-[side=right]:top-(--spark-viewport-top,0) data-[side=right]:right-0 data-[side=right]:h-(--spark-viewport-height,100%) data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-full data-[side=right]:data-starting-style:translate-x-full data-[side=right]:sm:max-w-sm',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"sheet-header\"\n className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n {...props}\n />\n )\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"sheet-footer\"\n className={cn(\n 'mt-auto flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction SheetTitle({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Title>) {\n return (\n <SheetPrimitive.Title\n data-slot=\"sheet-title\"\n className={cn('text-lg font-semibold text-gray', className)}\n {...props}\n />\n )\n}\n\nfunction SheetDescription({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Description>) {\n return (\n <SheetPrimitive.Description\n data-slot=\"sheet-description\"\n className={cn('text-sm text-gray-light', className)}\n {...props}\n />\n )\n}\n\nexport {\n Sheet,\n SheetClose,\n SheetContent,\n SheetDescription,\n SheetFooter,\n SheetHeader,\n SheetOverlay,\n SheetPortal,\n SheetTitle,\n SheetTrigger,\n}\nexport type { SheetContentProps }\n"],"mappings":";;;;;;;;;;;AAMA,SAAS,MAAM,OAAyD;CACtE,OAAO,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,MAAhB,EAAqB,GAAI,MAAQ,CAAA;AAC1C;AAEA,SAAS,aACP,OACA;CACA,OAAO,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAIA,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACiD;CACpD,IAAI,YAAY,MAAM,QACpB,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACC;EACX,GAAI;EAEH;CACmB,CAAA;CAI1B,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACEC,0BAAAA,eAAe;GAAE,MAAM;GAAQ,SAAS;EAAW,CAAC,GACpD,yCACA,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,OAAD,EAAO,WAAU,wDAAyD,CAAA;CACtD,CAAA;AAE1B;AAEA,SAAS,YACP,OACA;CACA,OAAO,iBAAA,GAAA,kBAAA,KAACF,sBAAAA,OAAe,QAAhB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,aAAa,EACpB,WACA,GAAG,SACoD;CACvD,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,UAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,wOACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAQA,SAAS,aAAa,EACpB,OAAO,SACP,WACA,GAAG,SACiB;CACpB,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,aAAW;EACX,YAAA,GAAA,GAAA,IACE,4MACA,6MACA,uOACA,qTACA,4TACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,kEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAClB,WACA,GAAG,SACiD;CACpD,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,aAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,2BAA2B,SAAS;EAClD,GAAI;CACL,CAAA;AAEL"}
1
+ {"version":3,"file":"sheet.cjs","names":["SheetPrimitive","buttonVariants","Close"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { Dialog as SheetPrimitive } from '@base-ui/react/dialog'\nimport { Close } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\nimport { buttonVariants } from './button'\n\nfunction Sheet(props: React.ComponentProps<typeof SheetPrimitive.Root>) {\n return <SheetPrimitive.Root {...props} />\n}\n\nfunction SheetTrigger(\n props: React.ComponentProps<typeof SheetPrimitive.Trigger>,\n) {\n return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />\n}\n\n// bare = the ready-made corner X (label is the consumer's, via aria-label);\n// with children or a render prop it stays the bare primitive (footer buttons, labeled closes)\nfunction SheetClose({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Close>) {\n if (children || props.render) {\n return (\n <SheetPrimitive.Close\n data-slot=\"sheet-close\"\n className={className}\n {...props}\n >\n {children}\n </SheetPrimitive.Close>\n )\n }\n\n return (\n <SheetPrimitive.Close\n data-slot=\"sheet-close\"\n className={cn(\n buttonVariants({ size: 'icon', variant: 'tertiary' }),\n 'absolute top-2.5 right-3 rounded-full',\n className,\n )}\n {...props}\n >\n <Close className=\"[--spark-icon-size:calc(20px*var(--spark-scaling,1))]\" />\n </SheetPrimitive.Close>\n )\n}\n\nfunction SheetPortal(\n props: React.ComponentProps<typeof SheetPrimitive.Portal>,\n) {\n return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />\n}\n\nfunction SheetOverlay({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Backdrop>) {\n return (\n <SheetPrimitive.Backdrop\n data-slot=\"sheet-overlay\"\n className={cn(\n 'fixed top-(--spark-viewport-top,0) right-0 left-0 z-50 h-(--spark-viewport-height,100%) bg-(--color-overlay) transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none',\n className,\n )}\n {...props}\n />\n )\n}\n\ninterface SheetContentProps extends React.ComponentProps<\n typeof SheetPrimitive.Popup\n> {\n side?: 'top' | 'right' | 'bottom' | 'left'\n}\n\nfunction SheetContent({\n side = 'right',\n className,\n ...props\n}: SheetContentProps) {\n return (\n <SheetPrimitive.Popup\n data-slot=\"sheet-content\"\n data-side={side}\n className={cn(\n 'fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-2 p-safe-offset-4 text-gray shadow-lg transition-[translate] duration-200 ease-in-out data-ending-style:duration-300 motion-reduce:transition-none',\n 'data-[side=top]:inset-x-0 data-[side=top]:top-(--spark-viewport-top,0) data-[side=top]:border-b data-[side=top]:data-ending-style:-translate-y-full data-[side=top]:data-starting-style:-translate-y-full',\n 'data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-(--spark-viewport-bottom-offset,0) data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-full data-[side=bottom]:data-starting-style:translate-y-full',\n 'data-[side=left]:top-(--spark-viewport-top,0) data-[side=left]:left-0 data-[side=left]:h-(--spark-viewport-height,100%) data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:-translate-x-full data-[side=left]:data-starting-style:-translate-x-full data-[side=left]:sm:max-w-sm',\n 'data-[side=right]:top-(--spark-viewport-top,0) data-[side=right]:right-0 data-[side=right]:h-(--spark-viewport-height,100%) data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-full data-[side=right]:data-starting-style:translate-x-full data-[side=right]:sm:max-w-sm',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"sheet-header\"\n className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n {...props}\n />\n )\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"sheet-footer\"\n className={cn(\n 'mt-auto flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction SheetTitle({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Title>) {\n return (\n <SheetPrimitive.Title\n data-slot=\"sheet-title\"\n className={cn('text-lg font-semibold text-gray', className)}\n {...props}\n />\n )\n}\n\nfunction SheetDescription({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Description>) {\n return (\n <SheetPrimitive.Description\n data-slot=\"sheet-description\"\n className={cn('text-sm text-gray-light', className)}\n {...props}\n />\n )\n}\n\nexport {\n Sheet,\n SheetClose,\n SheetContent,\n SheetDescription,\n SheetFooter,\n SheetHeader,\n SheetOverlay,\n SheetPortal,\n SheetTitle,\n SheetTrigger,\n}\nexport type { SheetContentProps }\n"],"mappings":";;;;;;;;;;;AAMA,SAAS,MAAM,OAAyD;CACtE,OAAO,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,MAAhB,EAAqB,GAAI,MAAQ,CAAA;AAC1C;AAEA,SAAS,aACP,OACA;CACA,OAAO,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAIA,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACiD;CACpD,IAAI,YAAY,MAAM,QACpB,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACC;EACX,GAAI;EAEH;CACmB,CAAA;CAI1B,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACEC,0BAAAA,eAAe;GAAE,MAAM;GAAQ,SAAS;EAAW,CAAC,GACpD,yCACA,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,OAAD,EAAO,WAAU,wDAAyD,CAAA;CACtD,CAAA;AAE1B;AAEA,SAAS,YACP,OACA;CACA,OAAO,iBAAA,GAAA,kBAAA,KAACF,sBAAAA,OAAe,QAAhB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,aAAa,EACpB,WACA,GAAG,SACoD;CACvD,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,UAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,wOACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAQA,SAAS,aAAa,EACpB,OAAO,SACP,WACA,GAAG,SACiB;CACpB,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,aAAW;EACX,YAAA,GAAA,GAAA,IACE,4MACA,6MACA,uOACA,qTACA,4TACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IACE,kEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAClB,WACA,GAAG,SACiD;CACpD,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,OAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,iBAAA,GAAA,kBAAA,KAACA,sBAAAA,OAAe,aAAhB;EACE,aAAU;EACV,YAAA,GAAA,GAAA,IAAc,2BAA2B,SAAS;EAClD,GAAI;CACL,CAAA;AAEL"}
@@ -49,7 +49,7 @@ function SheetContent({ side = "right", className, ...props }) {
49
49
  return /* @__PURE__ */ jsx(Dialog.Popup, {
50
50
  "data-slot": "sheet-content",
51
51
  "data-side": side,
52
- className: cn("fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-1 p-safe-offset-4 text-gray shadow-lg transition-[translate] duration-200 ease-in-out data-ending-style:duration-300 motion-reduce:transition-none", "data-[side=top]:inset-x-0 data-[side=top]:top-(--spark-viewport-top,0) data-[side=top]:border-b data-[side=top]:data-ending-style:-translate-y-full data-[side=top]:data-starting-style:-translate-y-full", "data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-(--spark-viewport-bottom-offset,0) data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-full data-[side=bottom]:data-starting-style:translate-y-full", "data-[side=left]:top-(--spark-viewport-top,0) data-[side=left]:left-0 data-[side=left]:h-(--spark-viewport-height,100%) data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:-translate-x-full data-[side=left]:data-starting-style:-translate-x-full data-[side=left]:sm:max-w-sm", "data-[side=right]:top-(--spark-viewport-top,0) data-[side=right]:right-0 data-[side=right]:h-(--spark-viewport-height,100%) data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-full data-[side=right]:data-starting-style:translate-x-full data-[side=right]:sm:max-w-sm", className),
52
+ className: cn("fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-2 p-safe-offset-4 text-gray shadow-lg transition-[translate] duration-200 ease-in-out data-ending-style:duration-300 motion-reduce:transition-none", "data-[side=top]:inset-x-0 data-[side=top]:top-(--spark-viewport-top,0) data-[side=top]:border-b data-[side=top]:data-ending-style:-translate-y-full data-[side=top]:data-starting-style:-translate-y-full", "data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-(--spark-viewport-bottom-offset,0) data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-full data-[side=bottom]:data-starting-style:translate-y-full", "data-[side=left]:top-(--spark-viewport-top,0) data-[side=left]:left-0 data-[side=left]:h-(--spark-viewport-height,100%) data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:-translate-x-full data-[side=left]:data-starting-style:-translate-x-full data-[side=left]:sm:max-w-sm", "data-[side=right]:top-(--spark-viewport-top,0) data-[side=right]:right-0 data-[side=right]:h-(--spark-viewport-height,100%) data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-full data-[side=right]:data-starting-style:translate-x-full data-[side=right]:sm:max-w-sm", className),
53
53
  ...props
54
54
  });
55
55
  }
@@ -1 +1 @@
1
- {"version":3,"file":"sheet.js","names":["SheetPrimitive"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { Dialog as SheetPrimitive } from '@base-ui/react/dialog'\nimport { Close } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\nimport { buttonVariants } from './button'\n\nfunction Sheet(props: React.ComponentProps<typeof SheetPrimitive.Root>) {\n return <SheetPrimitive.Root {...props} />\n}\n\nfunction SheetTrigger(\n props: React.ComponentProps<typeof SheetPrimitive.Trigger>,\n) {\n return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />\n}\n\n// bare = the ready-made corner X (label is the consumer's, via aria-label);\n// with children or a render prop it stays the bare primitive (footer buttons, labeled closes)\nfunction SheetClose({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Close>) {\n if (children || props.render) {\n return (\n <SheetPrimitive.Close\n data-slot=\"sheet-close\"\n className={className}\n {...props}\n >\n {children}\n </SheetPrimitive.Close>\n )\n }\n\n return (\n <SheetPrimitive.Close\n data-slot=\"sheet-close\"\n className={cn(\n buttonVariants({ size: 'icon', variant: 'tertiary' }),\n 'absolute top-2.5 right-3 rounded-full',\n className,\n )}\n {...props}\n >\n <Close className=\"[--spark-icon-size:calc(20px*var(--spark-scaling,1))]\" />\n </SheetPrimitive.Close>\n )\n}\n\nfunction SheetPortal(\n props: React.ComponentProps<typeof SheetPrimitive.Portal>,\n) {\n return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />\n}\n\nfunction SheetOverlay({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Backdrop>) {\n return (\n <SheetPrimitive.Backdrop\n data-slot=\"sheet-overlay\"\n className={cn(\n 'fixed top-(--spark-viewport-top,0) right-0 left-0 z-50 h-(--spark-viewport-height,100%) bg-(--color-overlay) transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none',\n className,\n )}\n {...props}\n />\n )\n}\n\ninterface SheetContentProps extends React.ComponentProps<\n typeof SheetPrimitive.Popup\n> {\n side?: 'top' | 'right' | 'bottom' | 'left'\n}\n\nfunction SheetContent({\n side = 'right',\n className,\n ...props\n}: SheetContentProps) {\n return (\n <SheetPrimitive.Popup\n data-slot=\"sheet-content\"\n data-side={side}\n className={cn(\n 'fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-1 p-safe-offset-4 text-gray shadow-lg transition-[translate] duration-200 ease-in-out data-ending-style:duration-300 motion-reduce:transition-none',\n 'data-[side=top]:inset-x-0 data-[side=top]:top-(--spark-viewport-top,0) data-[side=top]:border-b data-[side=top]:data-ending-style:-translate-y-full data-[side=top]:data-starting-style:-translate-y-full',\n 'data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-(--spark-viewport-bottom-offset,0) data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-full data-[side=bottom]:data-starting-style:translate-y-full',\n 'data-[side=left]:top-(--spark-viewport-top,0) data-[side=left]:left-0 data-[side=left]:h-(--spark-viewport-height,100%) data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:-translate-x-full data-[side=left]:data-starting-style:-translate-x-full data-[side=left]:sm:max-w-sm',\n 'data-[side=right]:top-(--spark-viewport-top,0) data-[side=right]:right-0 data-[side=right]:h-(--spark-viewport-height,100%) data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-full data-[side=right]:data-starting-style:translate-x-full data-[side=right]:sm:max-w-sm',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"sheet-header\"\n className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n {...props}\n />\n )\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"sheet-footer\"\n className={cn(\n 'mt-auto flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction SheetTitle({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Title>) {\n return (\n <SheetPrimitive.Title\n data-slot=\"sheet-title\"\n className={cn('text-lg font-semibold text-gray', className)}\n {...props}\n />\n )\n}\n\nfunction SheetDescription({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Description>) {\n return (\n <SheetPrimitive.Description\n data-slot=\"sheet-description\"\n className={cn('text-sm text-gray-light', className)}\n {...props}\n />\n )\n}\n\nexport {\n Sheet,\n SheetClose,\n SheetContent,\n SheetDescription,\n SheetFooter,\n SheetHeader,\n SheetOverlay,\n SheetPortal,\n SheetTitle,\n SheetTrigger,\n}\nexport type { SheetContentProps }\n"],"mappings":";;;;;;;;AAMA,SAAS,MAAM,OAAyD;CACtE,OAAO,oBAACA,OAAe,MAAhB,EAAqB,GAAI,MAAQ,CAAA;AAC1C;AAEA,SAAS,aACP,OACA;CACA,OAAO,oBAACA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAIA,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACiD;CACpD,IAAI,YAAY,MAAM,QACpB,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACC;EACX,GAAI;EAEH;CACmB,CAAA;CAI1B,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GACT,eAAe;GAAE,MAAM;GAAQ,SAAS;EAAW,CAAC,GACpD,yCACA,SACF;EACA,GAAI;YAEJ,oBAAC,OAAD,EAAO,WAAU,wDAAyD,CAAA;CACtD,CAAA;AAE1B;AAEA,SAAS,YACP,OACA;CACA,OAAO,oBAACA,OAAe,QAAhB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,aAAa,EACpB,WACA,GAAG,SACoD;CACvD,OACE,oBAACA,OAAe,UAAhB;EACE,aAAU;EACV,WAAW,GACT,wOACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAQA,SAAS,aAAa,EACpB,OAAO,SACP,WACA,GAAG,SACiB;CACpB,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,aAAW;EACX,WAAW,GACT,4MACA,6MACA,uOACA,qTACA,4TACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,kEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAClB,WACA,GAAG,SACiD;CACpD,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GAAG,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,oBAACA,OAAe,aAAhB;EACE,aAAU;EACV,WAAW,GAAG,2BAA2B,SAAS;EAClD,GAAI;CACL,CAAA;AAEL"}
1
+ {"version":3,"file":"sheet.js","names":["SheetPrimitive"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { Dialog as SheetPrimitive } from '@base-ui/react/dialog'\nimport { Close } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\nimport { buttonVariants } from './button'\n\nfunction Sheet(props: React.ComponentProps<typeof SheetPrimitive.Root>) {\n return <SheetPrimitive.Root {...props} />\n}\n\nfunction SheetTrigger(\n props: React.ComponentProps<typeof SheetPrimitive.Trigger>,\n) {\n return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />\n}\n\n// bare = the ready-made corner X (label is the consumer's, via aria-label);\n// with children or a render prop it stays the bare primitive (footer buttons, labeled closes)\nfunction SheetClose({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Close>) {\n if (children || props.render) {\n return (\n <SheetPrimitive.Close\n data-slot=\"sheet-close\"\n className={className}\n {...props}\n >\n {children}\n </SheetPrimitive.Close>\n )\n }\n\n return (\n <SheetPrimitive.Close\n data-slot=\"sheet-close\"\n className={cn(\n buttonVariants({ size: 'icon', variant: 'tertiary' }),\n 'absolute top-2.5 right-3 rounded-full',\n className,\n )}\n {...props}\n >\n <Close className=\"[--spark-icon-size:calc(20px*var(--spark-scaling,1))]\" />\n </SheetPrimitive.Close>\n )\n}\n\nfunction SheetPortal(\n props: React.ComponentProps<typeof SheetPrimitive.Portal>,\n) {\n return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />\n}\n\nfunction SheetOverlay({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Backdrop>) {\n return (\n <SheetPrimitive.Backdrop\n data-slot=\"sheet-overlay\"\n className={cn(\n 'fixed top-(--spark-viewport-top,0) right-0 left-0 z-50 h-(--spark-viewport-height,100%) bg-(--color-overlay) transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none',\n className,\n )}\n {...props}\n />\n )\n}\n\ninterface SheetContentProps extends React.ComponentProps<\n typeof SheetPrimitive.Popup\n> {\n side?: 'top' | 'right' | 'bottom' | 'left'\n}\n\nfunction SheetContent({\n side = 'right',\n className,\n ...props\n}: SheetContentProps) {\n return (\n <SheetPrimitive.Popup\n data-slot=\"sheet-content\"\n data-side={side}\n className={cn(\n 'fixed z-50 flex flex-col gap-4 border-gray-a1 bg-gray-2 p-safe-offset-4 text-gray shadow-lg transition-[translate] duration-200 ease-in-out data-ending-style:duration-300 motion-reduce:transition-none',\n 'data-[side=top]:inset-x-0 data-[side=top]:top-(--spark-viewport-top,0) data-[side=top]:border-b data-[side=top]:data-ending-style:-translate-y-full data-[side=top]:data-starting-style:-translate-y-full',\n 'data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-(--spark-viewport-bottom-offset,0) data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-full data-[side=bottom]:data-starting-style:translate-y-full',\n 'data-[side=left]:top-(--spark-viewport-top,0) data-[side=left]:left-0 data-[side=left]:h-(--spark-viewport-height,100%) data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:-translate-x-full data-[side=left]:data-starting-style:-translate-x-full data-[side=left]:sm:max-w-sm',\n 'data-[side=right]:top-(--spark-viewport-top,0) data-[side=right]:right-0 data-[side=right]:h-(--spark-viewport-height,100%) data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-full data-[side=right]:data-starting-style:translate-x-full data-[side=right]:sm:max-w-sm',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"sheet-header\"\n className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n {...props}\n />\n )\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"sheet-footer\"\n className={cn(\n 'mt-auto flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction SheetTitle({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Title>) {\n return (\n <SheetPrimitive.Title\n data-slot=\"sheet-title\"\n className={cn('text-lg font-semibold text-gray', className)}\n {...props}\n />\n )\n}\n\nfunction SheetDescription({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Description>) {\n return (\n <SheetPrimitive.Description\n data-slot=\"sheet-description\"\n className={cn('text-sm text-gray-light', className)}\n {...props}\n />\n )\n}\n\nexport {\n Sheet,\n SheetClose,\n SheetContent,\n SheetDescription,\n SheetFooter,\n SheetHeader,\n SheetOverlay,\n SheetPortal,\n SheetTitle,\n SheetTrigger,\n}\nexport type { SheetContentProps }\n"],"mappings":";;;;;;;;AAMA,SAAS,MAAM,OAAyD;CACtE,OAAO,oBAACA,OAAe,MAAhB,EAAqB,GAAI,MAAQ,CAAA;AAC1C;AAEA,SAAS,aACP,OACA;CACA,OAAO,oBAACA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAIA,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACiD;CACpD,IAAI,YAAY,MAAM,QACpB,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACC;EACX,GAAI;EAEH;CACmB,CAAA;CAI1B,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GACT,eAAe;GAAE,MAAM;GAAQ,SAAS;EAAW,CAAC,GACpD,yCACA,SACF;EACA,GAAI;YAEJ,oBAAC,OAAD,EAAO,WAAU,wDAAyD,CAAA;CACtD,CAAA;AAE1B;AAEA,SAAS,YACP,OACA;CACA,OAAO,oBAACA,OAAe,QAAhB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,aAAa,EACpB,WACA,GAAG,SACoD;CACvD,OACE,oBAACA,OAAe,UAAhB;EACE,aAAU;EACV,WAAW,GACT,wOACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAQA,SAAS,aAAa,EACpB,OAAO,SACP,WACA,GAAG,SACiB;CACpB,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,aAAW;EACX,WAAW,GACT,4MACA,6MACA,uOACA,qTACA,4TACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,kEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAClB,WACA,GAAG,SACiD;CACpD,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GAAG,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,oBAACA,OAAe,aAAhB;EACE,aAAU;EACV,WAAW,GAAG,2BAA2B,SAAS;EAClD,GAAI;CACL,CAAA;AAEL"}
@@ -1,6 +1,6 @@
1
1
  "use client";
2
- import { cn } from "../utils/cn.js";
3
2
  import { accentByColor } from "../lib/accent-colors.js";
3
+ import { cn } from "../utils/cn.js";
4
4
  import { jsx } from "react/jsx-runtime";
5
5
  import { Switch as Switch$1 } from "@base-ui/react/switch";
6
6
  //#region src/components/switch.tsx
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const require_chunk = require("../chunk-DY84GLCh.cjs");
4
- const require_components_field = require("./field.cjs");
5
4
  const require_lib_input_box_variants = require("../lib/input-box-variants.cjs");
5
+ const require_components_field = require("./field.cjs");
6
6
  let react = require("react");
7
7
  react = require_chunk.__toESM(react);
8
8
  let react_jsx_runtime = require("react/jsx-runtime");
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import { cn } from "../utils/cn.js";
3
- import { useFieldControl } from "./field.js";
4
3
  import { GHOST_UNDERLINE, boxChrome } from "../lib/input-box-variants.js";
4
+ import { useFieldControl } from "./field.js";
5
5
  import * as React$1 from "react";
6
6
  import { jsx } from "react/jsx-runtime";
7
7
  import { cva } from "class-variance-authority";
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  "use client";
3
- import { cn } from "../utils/cn.js";
4
3
  import { isSparkNeutralFamily } from "../lib/theme-types.js";
5
4
  import { CURATED_ACCENTS, accentSparkVars, appearanceForBackground, generateAccentScale, getMatchingNeutral, invertAccentScale, isParsableColor, neutralFamilyVars, neutralSparkVars, resolveAutoNeutral } from "../lib/accent-theme.js";
5
+ import { cn } from "../utils/cn.js";
6
6
  import * as React$1 from "react";
7
7
  import { jsx, jsxs } from "react/jsx-runtime";
8
8
  import { mergeProps } from "@base-ui/react/merge-props";
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  "use client";
3
- import { cn } from "../utils/cn.js";
4
3
  import { accentByColor } from "../lib/accent-colors.js";
4
+ import { cn } from "../utils/cn.js";
5
5
  import { ToggleGroupContext } from "../lib/toggle-group-context.js";
6
6
  import * as React$1 from "react";
7
7
  import { jsx } from "react/jsx-runtime";
@@ -3,8 +3,8 @@
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
4
4
  const require_chunk = require("../chunk-DY84GLCh.cjs");
5
5
  const require_lib_accent_colors = require("../lib/accent-colors.cjs");
6
- const require_components_button = require("./button.cjs");
7
6
  const require_lib_toggle_group_context = require("../lib/toggle-group-context.cjs");
7
+ const require_components_button = require("./button.cjs");
8
8
  let react = require("react");
9
9
  react = require_chunk.__toESM(react);
10
10
  let react_jsx_runtime = require("react/jsx-runtime");
@@ -1,9 +1,9 @@
1
1
  "use client";
2
2
  "use client";
3
- import { cn } from "../utils/cn.js";
4
3
  import { accentByColor } from "../lib/accent-colors.js";
5
- import { buttonVariants } from "./button.js";
4
+ import { cn } from "../utils/cn.js";
6
5
  import { ToggleGroupContext } from "../lib/toggle-group-context.js";
6
+ import { buttonVariants } from "./button.js";
7
7
  import * as React$1 from "react";
8
8
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
9
9
  import { Toggle as Toggle$1 } from "@base-ui/react/toggle";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@epilot/spark-ui",
3
- "version": "0.23.1",
3
+ "version": "0.23.2",
4
4
  "description": "React UI component library from Spark SDK",
5
5
  "homepage": "https://spark-ui.epilot.io/docs/ui",
6
6
  "license": "Apache-2.0",