@spark-ui/components 17.2.3 → 17.2.4-beta.0

package/dist/divider/index.mjs

@@ -1,185 +1,180 @@
-import { jsx as a } from "react/jsx-runtime";
-import { Separator as h } from "@base-ui/react/separator";
-import { cva as E, cx as f } from "class-variance-authority";
-import { S as x } from "../Slot-DLY1rJrG.mjs";
-import { tw as e } from "@spark-ui/internal-utils";
-const D = [
-  // current
-  {
-    intent: "current",
-    isEmpty: !0,
-    class: e(["border-current"])
-  },
-  {
-    intent: "current",
-    isEmpty: !1,
-    class: e(["before:border-current after:border-current"])
-  },
-  // outline
-  {
-    intent: "outline",
-    isEmpty: !0,
-    class: e(["border-outline"])
-  },
-  {
-    intent: "outline",
-    isEmpty: !1,
-    class: e(["before:border-outline after:border-outline"])
-  }
-], N = E(["overflow-hidden group"], {
-  variants: {
-    isEmpty: {
-      true: ["border-solid"],
-      false: ["inline-flex items-center", "after:border-solid before:border-solid"]
-    },
-    orientation: {
-      vertical: ["w-fit inline-flex"],
-      horizontal: ["w-full"]
-    },
-    writingMode: {
-      "horizontal-tb": [],
-      "vertical-lr": []
-    },
-    alignment: {
-      start: [],
-      end: [],
-      center: []
-    },
-    intent: {
-      current: [],
-      outline: []
-    }
-  },
-  defaultVariants: {
-    orientation: "horizontal",
-    writingMode: "horizontal-tb",
-    alignment: "center",
-    intent: "outline"
-  },
-  compoundVariants: [
-    {
-      isEmpty: !0,
-      orientation: "horizontal",
-      class: e(["my-lg border-t-sm"])
-    },
-    {
-      isEmpty: !0,
-      orientation: "vertical",
-      class: e(["mx-lg min-h-sz-24 border-l-sm"])
-    },
-    {
-      isEmpty: !1,
-      orientation: "horizontal",
-      writingMode: "horizontal-tb",
-      class: e(["flex-row my-sm grow-0", "before:border-t-sm", "after:border-t-sm", "*:px-lg"])
-    },
-    {
-      isEmpty: !1,
-      orientation: "vertical",
-      writingMode: "horizontal-tb",
-      class: e(["flex-col mx-sm", "before:border-l-sm", "after:border-l-sm", "*:py-lg"])
-    },
-    {
-      isEmpty: !1,
-      orientation: "vertical",
-      writingMode: "vertical-lr",
-      class: e(["flex-col mx-sm", "before:border-l-sm", "after:border-l-sm", "*:px-lg"])
-    },
-    {
-      isEmpty: !1,
-      orientation: "horizontal",
-      alignment: "end",
-      class: e(["after:w-sz-40 before:grow after:grow-0"])
-    },
-    {
-      isEmpty: !1,
-      orientation: "horizontal",
-      alignment: "start",
-      class: e(["before:w-sz-40 before:grow-0 after:grow"])
-    },
-    {
-      isEmpty: !1,
-      orientation: "horizontal",
-      alignment: "center",
-      class: e(["justify-center before:grow after:grow"])
-    },
-    {
-      isEmpty: !1,
-      orientation: "vertical",
-      alignment: "end",
-      class: e(["after:h-sz-40 before:grow after:grow-0 before:min-h-sz-40"])
-    },
-    {
-      isEmpty: !1,
-      orientation: "vertical",
-      alignment: "start",
-      class: e(["before:h-sz-40 before:grow-0 after:grow after:min-h-sz-40"])
-    },
-    {
-      isEmpty: !1,
-      orientation: "vertical",
-      alignment: "center",
-      class: e(["justify-center before:grow after:grow before:min-h-sz-40 after:min-h-sz-40"])
-    },
-    ...D
-  ]
-}), c = ({
-  asChild: t,
-  className: o,
-  isDecorative: i = !1,
-  children: r,
-  orientation: s = "horizontal",
-  writingMode: l = "horizontal-tb",
-  alignment: b = "center",
-  intent: g = "outline",
-  ref: u,
-  role: m,
-  ...w
-}) => {
-  const y = t ? !r?.props?.children : !r;
-  let n;
-  i ? n = { role: "none" } : m !== void 0 && (n = { role: m });
-  const v = t ? (
-    // Base UI uses its `render` prop to swap the underlying element.
-    // We rely on Spark's `Slot` to mimic Radix's `asChild` behavior.
-    ((z) => /* @__PURE__ */ a(x, { ...z }))
-  ) : void 0;
-  return /* @__PURE__ */ a(
-    h,
-    {
-      "data-spark-component": "divider",
-      className: f(
-        N({ isEmpty: y, orientation: s, alignment: b, intent: g, writingMode: l }),
-        o
-      ),
-      orientation: s,
-      ref: u,
-      ...w,
-      render: v,
-      ...n,
-      "data-writing-mode": l,
-      children: r
-    }
-  );
+import { Slot as e } from "../slot/index.mjs";
+import { cva as t, cx as n } from "class-variance-authority";
+import { jsx as r } from "react/jsx-runtime";
+import { tw as i } from "@spark-ui/internal-utils";
+import { Separator as a } from "@base-ui/react/separator";
+//#region src/divider/variants/intents.tsx
+var o = [
+	{
+		intent: "current",
+		isEmpty: !0,
+		class: i(["border-current"])
+	},
+	{
+		intent: "current",
+		isEmpty: !1,
+		class: i(["before:border-current after:border-current"])
+	},
+	{
+		intent: "outline",
+		isEmpty: !0,
+		class: i(["border-outline"])
+	},
+	{
+		intent: "outline",
+		isEmpty: !1,
+		class: i(["before:border-outline after:border-outline"])
+	}
+], s = t(["overflow-hidden group"], {
+	variants: {
+		isEmpty: {
+			true: ["border-solid"],
+			false: ["inline-flex items-center", "after:border-solid before:border-solid"]
+		},
+		orientation: {
+			vertical: ["w-fit inline-flex"],
+			horizontal: ["w-full"]
+		},
+		writingMode: {
+			"horizontal-tb": [],
+			"vertical-lr": []
+		},
+		alignment: {
+			start: [],
+			end: [],
+			center: []
+		},
+		intent: {
+			current: [],
+			outline: []
+		}
+	},
+	defaultVariants: {
+		orientation: "horizontal",
+		writingMode: "horizontal-tb",
+		alignment: "center",
+		intent: "outline"
+	},
+	compoundVariants: [
+		{
+			isEmpty: !0,
+			orientation: "horizontal",
+			class: i(["my-lg border-t-sm"])
+		},
+		{
+			isEmpty: !0,
+			orientation: "vertical",
+			class: i(["mx-lg min-h-sz-24 border-l-sm"])
+		},
+		{
+			isEmpty: !1,
+			orientation: "horizontal",
+			writingMode: "horizontal-tb",
+			class: i([
+				"flex-row my-sm grow-0",
+				"before:border-t-sm",
+				"after:border-t-sm",
+				"*:px-lg"
+			])
+		},
+		{
+			isEmpty: !1,
+			orientation: "vertical",
+			writingMode: "horizontal-tb",
+			class: i([
+				"flex-col mx-sm",
+				"before:border-l-sm",
+				"after:border-l-sm",
+				"*:py-lg"
+			])
+		},
+		{
+			isEmpty: !1,
+			orientation: "vertical",
+			writingMode: "vertical-lr",
+			class: i([
+				"flex-col mx-sm",
+				"before:border-l-sm",
+				"after:border-l-sm",
+				"*:px-lg"
+			])
+		},
+		{
+			isEmpty: !1,
+			orientation: "horizontal",
+			alignment: "end",
+			class: i(["after:w-sz-40 before:grow after:grow-0"])
+		},
+		{
+			isEmpty: !1,
+			orientation: "horizontal",
+			alignment: "start",
+			class: i(["before:w-sz-40 before:grow-0 after:grow"])
+		},
+		{
+			isEmpty: !1,
+			orientation: "horizontal",
+			alignment: "center",
+			class: i(["justify-center before:grow after:grow"])
+		},
+		{
+			isEmpty: !1,
+			orientation: "vertical",
+			alignment: "end",
+			class: i(["after:h-sz-40 before:grow after:grow-0 before:min-h-sz-40"])
+		},
+		{
+			isEmpty: !1,
+			orientation: "vertical",
+			alignment: "start",
+			class: i(["before:h-sz-40 before:grow-0 after:grow after:min-h-sz-40"])
+		},
+		{
+			isEmpty: !1,
+			orientation: "vertical",
+			alignment: "center",
+			class: i(["justify-center before:grow after:grow before:min-h-sz-40 after:min-h-sz-40"])
+		},
+		...o
+	]
+}), c = ({ asChild: t, className: i, isDecorative: o = !1, children: c, orientation: l = "horizontal", writingMode: u = "horizontal-tb", alignment: d = "center", intent: f = "outline", ref: p, role: m, ...h }) => {
+	let g = t ? !c?.props?.children : !c, _;
+	o ? _ = { role: "none" } : m !== void 0 && (_ = { role: m });
+	let v = t ? (t) => /* @__PURE__ */ r(e, { ...t }) : void 0;
+	return /* @__PURE__ */ r(a, {
+		"data-spark-component": "divider",
+		className: n(s({
+			isEmpty: g,
+			orientation: l,
+			alignment: d,
+			intent: f,
+			writingMode: u
+		}), i),
+		orientation: l,
+		ref: p,
+		...h,
+		render: v,
+		..._,
+		"data-writing-mode": u,
+		children: c
+	});
 };
 c.displayName = "Divider";
-const d = ({ children: t, ref: o, className: i, ...r }) => t ? /* @__PURE__ */ a(
-  "span",
-  {
-    "data-spark-component": "divider-content",
-    ref: o,
-    ...r,
-    className: f("group-data-[writing-mode=vertical-lr]:[writing-mode:vertical-lr]", i),
-    children: t
-  }
-) : null;
-d.displayName = "Divider.Content";
-const p = Object.assign(c, {
-  Content: d
-});
-p.displayName = "Divider";
-p.Content.displayName = "Divider.Content";
-export {
-  p as Divider
-};
-//# sourceMappingURL=index.mjs.map
+//#endregion
+//#region src/divider/DividerContent.tsx
+var l = ({ children: e, ref: t, className: i, ...a }) => e ? /* @__PURE__ */ r("span", {
+	"data-spark-component": "divider-content",
+	ref: t,
+	...a,
+	className: n("group-data-[writing-mode=vertical-lr]:[writing-mode:vertical-lr]", i),
+	children: e
+}) : null;
+l.displayName = "Divider.Content";
+//#endregion
+//#region src/divider/index.ts
+var u = Object.assign(c, { Content: l });
+u.displayName = "Divider", u.Content.displayName = "Divider.Content";
+//#endregion
+export { u as Divider };
+
+//# sourceMappingURL=index.mjs.map

package/dist/divider/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/divider/variants/intents.tsx","../../src/divider/Divider.styles.ts","../../src/divider/Divider.tsx","../../src/divider/DividerContent.tsx","../../src/divider/index.ts"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const intentVariants = [\n  // current\n  {\n    intent: 'current',\n    isEmpty: true,\n    class: tw(['border-current']),\n  },\n  {\n    intent: 'current',\n    isEmpty: false,\n    class: tw(['before:border-current after:border-current']),\n  },\n  // outline\n  {\n    intent: 'outline',\n    isEmpty: true,\n    class: tw(['border-outline']),\n  },\n  {\n    intent: 'outline',\n    isEmpty: false,\n    class: tw(['before:border-outline after:border-outline']),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { intentVariants } from './variants/intents'\n\nexport const dividerStyles = cva(['overflow-hidden group'], {\n  variants: {\n    isEmpty: {\n      true: ['border-solid'],\n      false: ['inline-flex items-center', 'after:border-solid before:border-solid'],\n    },\n    orientation: {\n      vertical: ['w-fit inline-flex'],\n      horizontal: ['w-full'],\n    },\n    writingMode: {\n      'horizontal-tb': [],\n      'vertical-lr': [],\n    },\n    alignment: {\n      start: [],\n      end: [],\n      center: [],\n    },\n    intent: {\n      current: [],\n      outline: [],\n    },\n  },\n  defaultVariants: {\n    orientation: 'horizontal',\n    writingMode: 'horizontal-tb',\n    alignment: 'center',\n    intent: 'outline',\n  },\n  compoundVariants: [\n    {\n      isEmpty: true,\n      orientation: 'horizontal',\n      class: tw(['my-lg border-t-sm']),\n    },\n    {\n      isEmpty: true,\n      orientation: 'vertical',\n      class: tw(['mx-lg min-h-sz-24 border-l-sm']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'horizontal',\n      writingMode: 'horizontal-tb',\n      class: tw(['flex-row my-sm grow-0', 'before:border-t-sm', 'after:border-t-sm', '*:px-lg']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'vertical',\n      writingMode: 'horizontal-tb',\n      class: tw(['flex-col mx-sm', 'before:border-l-sm', 'after:border-l-sm', '*:py-lg']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'vertical',\n      writingMode: 'vertical-lr',\n      class: tw(['flex-col mx-sm', 'before:border-l-sm', 'after:border-l-sm', '*:px-lg']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'horizontal',\n      alignment: 'end',\n      class: tw(['after:w-sz-40 before:grow after:grow-0']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'horizontal',\n      alignment: 'start',\n      class: tw(['before:w-sz-40 before:grow-0 after:grow']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'horizontal',\n      alignment: 'center',\n      class: tw(['justify-center before:grow after:grow']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'vertical',\n      alignment: 'end',\n      class: tw(['after:h-sz-40 before:grow after:grow-0 before:min-h-sz-40']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'vertical',\n      alignment: 'start',\n      class: tw(['before:h-sz-40 before:grow-0 after:grow after:min-h-sz-40']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'vertical',\n      alignment: 'center',\n      class: tw(['justify-center before:grow after:grow before:min-h-sz-40 after:min-h-sz-40']),\n    },\n    ...intentVariants,\n  ],\n})\n\nexport type DividerStylesProps = VariantProps<typeof dividerStyles>\n","import { Separator as BaseSeparator } from '@base-ui/react/separator'\nimport { cx } from 'class-variance-authority'\nimport { HTMLAttributes, ReactElement, ReactNode, Ref } from 'react'\n\nimport { Slot } from '../slot'\nimport { dividerStyles, type DividerStylesProps } from './Divider.styles'\n\nexport interface DividerProps\n  extends HTMLAttributes<HTMLDivElement>,\n    Omit<DividerStylesProps, 'isEmpty'> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  children?: ReactElement\n  /**\n   * The orientation of the inner content.\n   */\n  alignment?: 'start' | 'end' | 'center'\n  /**\n   * The orientation of the separator.\n   */\n  orientation?: 'vertical' | 'horizontal'\n  /**\n   * When true, signifies that it is purely visual, carries no semantic meaning, and ensures it is not present in the accessibility tree.\n   */\n  isDecorative?: boolean\n  /**\n   * Color scheme of the divider.\n   */\n  intent?: 'outline' | 'current'\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const Divider = ({\n  asChild,\n  className,\n  isDecorative = false,\n  children,\n  orientation = 'horizontal',\n  writingMode = 'horizontal-tb',\n  alignment = 'center',\n  intent = 'outline',\n  ref,\n  role: roleProp,\n  ...props\n}: DividerProps) => {\n  const isEmpty = asChild ? !(children?.props as { children: ReactNode })?.children : !children\n\n  let roleProps: { role: string } | undefined\n  if (isDecorative) {\n    roleProps = { role: 'none' }\n  } else if (roleProp !== undefined) {\n    roleProps = { role: roleProp }\n  }\n\n  const renderSlot = asChild\n    ? // Base UI uses its `render` prop to swap the underlying element.\n      // We rely on Spark's `Slot` to mimic Radix's `asChild` behavior.\n      (slotProps: any) => <Slot {...slotProps} />\n    : undefined\n\n  return (\n    <BaseSeparator\n      data-spark-component=\"divider\"\n      className={cx(\n        dividerStyles({ isEmpty, orientation, alignment, intent, writingMode }),\n        className\n      )}\n      orientation={orientation}\n      ref={ref}\n      {...props}\n      render={renderSlot}\n      {...roleProps}\n      data-writing-mode={writingMode}\n    >\n      {children}\n    </BaseSeparator>\n  )\n}\n\nDivider.displayName = 'Divider'\n","import { cx } from 'class-variance-authority'\nimport { HTMLAttributes, ReactNode, Ref } from 'react'\n\nexport interface DividerContentProps extends HTMLAttributes<HTMLSpanElement> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  children?: ReactNode\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const DividerContent = ({ children, ref, className, ...props }: DividerContentProps) => {\n  return children ? (\n    <span\n      data-spark-component=\"divider-content\"\n      ref={ref}\n      {...props}\n      className={cx('group-data-[writing-mode=vertical-lr]:[writing-mode:vertical-lr]', className)}\n    >\n      {children}\n    </span>\n  ) : null\n}\n\nDividerContent.displayName = 'Divider.Content'\n","import { Divider as Root } from './Divider'\nimport { DividerContent } from './DividerContent'\n\nexport { type DividerContentProps } from './DividerContent'\n\nexport const Divider: typeof Root & {\n  Content: typeof DividerContent\n} = Object.assign(Root, {\n  Content: DividerContent,\n})\n\nDivider.displayName = 'Divider'\nDivider.Content.displayName = 'Divider.Content'\n"],"names":["intentVariants","tw","dividerStyles","cva","Divider","asChild","className","isDecorative","children","orientation","writingMode","alignment","intent","ref","roleProp","props","isEmpty","roleProps","renderSlot","slotProps","jsx","Slot","BaseSeparator","cx","DividerContent","Root"],"mappings":";;;;;AAEO,MAAMA,IAAiB;AAAA;AAAA,EAE5B;AAAA,IACE,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,OAAOC,EAAG,CAAC,gBAAgB,CAAC;AAAA,EAAA;AAAA,EAE9B;AAAA,IACE,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,OAAOA,EAAG,CAAC,4CAA4C,CAAC;AAAA,EAAA;AAAA;AAAA,EAG1D;AAAA,IACE,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,OAAOA,EAAG,CAAC,gBAAgB,CAAC;AAAA,EAAA;AAAA,EAE9B;AAAA,IACE,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,OAAOA,EAAG,CAAC,4CAA4C,CAAC;AAAA,EAAA;AAE5D,GCpBaC,IAAgBC,EAAI,CAAC,uBAAuB,GAAG;AAAA,EAC1D,UAAU;AAAA,IACR,SAAS;AAAA,MACP,MAAM,CAAC,cAAc;AAAA,MACrB,OAAO,CAAC,4BAA4B,wCAAwC;AAAA,IAAA;AAAA,IAE9E,aAAa;AAAA,MACX,UAAU,CAAC,mBAAmB;AAAA,MAC9B,YAAY,CAAC,QAAQ;AAAA,IAAA;AAAA,IAEvB,aAAa;AAAA,MACX,iBAAiB,CAAA;AAAA,MACjB,eAAe,CAAA;AAAA,IAAC;AAAA,IAElB,WAAW;AAAA,MACT,OAAO,CAAA;AAAA,MACP,KAAK,CAAA;AAAA,MACL,QAAQ,CAAA;AAAA,IAAC;AAAA,IAEX,QAAQ;AAAA,MACN,SAAS,CAAA;AAAA,MACT,SAAS,CAAA;AAAA,IAAC;AAAA,EACZ;AAAA,EAEF,iBAAiB;AAAA,IACf,aAAa;AAAA,IACb,aAAa;AAAA,IACb,WAAW;AAAA,IACX,QAAQ;AAAA,EAAA;AAAA,EAEV,kBAAkB;AAAA,IAChB;AAAA,MACE,SAAS;AAAA,MACT,aAAa;AAAA,MACb,OAAOF,EAAG,CAAC,mBAAmB,CAAC;AAAA,IAAA;AAAA,IAEjC;AAAA,MACE,SAAS;AAAA,MACT,aAAa;AAAA,MACb,OAAOA,EAAG,CAAC,+BAA+B,CAAC;AAAA,IAAA;AAAA,IAE7C;AAAA,MACE,SAAS;AAAA,MACT,aAAa;AAAA,MACb,aAAa;AAAA,MACb,OAAOA,EAAG,CAAC,yBAAyB,sBAAsB,qBAAqB,SAAS,CAAC;AAAA,IAAA;AAAA,IAE3F;AAAA,MACE,SAAS;AAAA,MACT,aAAa;AAAA,MACb,aAAa;AAAA,MACb,OAAOA,EAAG,CAAC,kBAAkB,sBAAsB,qBAAqB,SAAS,CAAC;AAAA,IAAA;AAAA,IAEpF;AAAA,MACE,SAAS;AAAA,MACT,aAAa;AAAA,MACb,aAAa;AAAA,MACb,OAAOA,EAAG,CAAC,kBAAkB,sBAAsB,qBAAqB,SAAS,CAAC;AAAA,IAAA;AAAA,IAEpF;AAAA,MACE,SAAS;AAAA,MACT,aAAa;AAAA,MACb,WAAW;AAAA,MACX,OAAOA,EAAG,CAAC,wCAAwC,CAAC;AAAA,IAAA;AAAA,IAEtD;AAAA,MACE,SAAS;AAAA,MACT,aAAa;AAAA,MACb,WAAW;AAAA,MACX,OAAOA,EAAG,CAAC,yCAAyC,CAAC;AAAA,IAAA;AAAA,IAEvD;AAAA,MACE,SAAS;AAAA,MACT,aAAa;AAAA,MACb,WAAW;AAAA,MACX,OAAOA,EAAG,CAAC,uCAAuC,CAAC;AAAA,IAAA;AAAA,IAErD;AAAA,MACE,SAAS;AAAA,MACT,aAAa;AAAA,MACb,WAAW;AAAA,MACX,OAAOA,EAAG,CAAC,2DAA2D,CAAC;AAAA,IAAA;AAAA,IAEzE;AAAA,MACE,SAAS;AAAA,MACT,aAAa;AAAA,MACb,WAAW;AAAA,MACX,OAAOA,EAAG,CAAC,2DAA2D,CAAC;AAAA,IAAA;AAAA,IAEzE;AAAA,MACE,SAAS;AAAA,MACT,aAAa;AAAA,MACb,WAAW;AAAA,MACX,OAAOA,EAAG,CAAC,4EAA4E,CAAC;AAAA,IAAA;AAAA,IAE1F,GAAGD;AAAA,EAAA;AAEP,CAAC,GCpEYI,IAAU,CAAC;AAAA,EACtB,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,UAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,aAAAC,IAAc;AAAA,EACd,WAAAC,IAAY;AAAA,EACZ,QAAAC,IAAS;AAAA,EACT,KAAAC;AAAA,EACA,MAAMC;AAAA,EACN,GAAGC;AACL,MAAoB;AAClB,QAAMC,IAAUX,IAAU,CAAEG,GAAU,OAAmC,WAAW,CAACA;AAErF,MAAIS;AACJ,EAAIV,IACFU,IAAY,EAAE,MAAM,OAAA,IACXH,MAAa,WACtBG,IAAY,EAAE,MAAMH,EAAA;AAGtB,QAAMI,IAAab;AAAA;AAAA;AAAA,KAGf,CAACc,MAAmB,gBAAAC,EAACC,GAAA,EAAM,GAAGF,EAAA,CAAW;AAAA,MACzC;AAEJ,SACE,gBAAAC;AAAA,IAACE;AAAAA,IAAA;AAAA,MACC,wBAAqB;AAAA,MACrB,WAAWC;AAAA,QACTrB,EAAc,EAAE,SAAAc,GAAS,aAAAP,GAAa,WAAAE,GAAW,QAAAC,GAAQ,aAAAF,GAAa;AAAA,QACtEJ;AAAA,MAAA;AAAA,MAEF,aAAAG;AAAA,MACA,KAAAI;AAAA,MACC,GAAGE;AAAA,MACJ,QAAQG;AAAA,MACP,GAAGD;AAAA,MACJ,qBAAmBP;AAAA,MAElB,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP;AAEAJ,EAAQ,cAAc;ACrEf,MAAMoB,IAAiB,CAAC,EAAE,UAAAhB,GAAU,KAAAK,GAAK,WAAAP,GAAW,GAAGS,QACrDP,IACL,gBAAAY;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,wBAAqB;AAAA,IACrB,KAAAP;AAAA,IACC,GAAGE;AAAA,IACJ,WAAWQ,EAAG,oEAAoEjB,CAAS;AAAA,IAE1F,UAAAE;AAAA,EAAA;AAAA,IAED;AAGNgB,EAAe,cAAc;ACpBtB,MAAMpB,IAET,OAAO,OAAOqB,GAAM;AAAA,EACtB,SAASD;AACX,CAAC;AAEDpB,EAAQ,cAAc;AACtBA,EAAQ,QAAQ,cAAc;"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../src/divider/variants/intents.tsx","../../src/divider/Divider.styles.ts","../../src/divider/Divider.tsx","../../src/divider/DividerContent.tsx","../../src/divider/index.ts"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const intentVariants = [\n  // current\n  {\n    intent: 'current',\n    isEmpty: true,\n    class: tw(['border-current']),\n  },\n  {\n    intent: 'current',\n    isEmpty: false,\n    class: tw(['before:border-current after:border-current']),\n  },\n  // outline\n  {\n    intent: 'outline',\n    isEmpty: true,\n    class: tw(['border-outline']),\n  },\n  {\n    intent: 'outline',\n    isEmpty: false,\n    class: tw(['before:border-outline after:border-outline']),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { intentVariants } from './variants/intents'\n\nexport const dividerStyles = cva(['overflow-hidden group'], {\n  variants: {\n    isEmpty: {\n      true: ['border-solid'],\n      false: ['inline-flex items-center', 'after:border-solid before:border-solid'],\n    },\n    orientation: {\n      vertical: ['w-fit inline-flex'],\n      horizontal: ['w-full'],\n    },\n    writingMode: {\n      'horizontal-tb': [],\n      'vertical-lr': [],\n    },\n    alignment: {\n      start: [],\n      end: [],\n      center: [],\n    },\n    intent: {\n      current: [],\n      outline: [],\n    },\n  },\n  defaultVariants: {\n    orientation: 'horizontal',\n    writingMode: 'horizontal-tb',\n    alignment: 'center',\n    intent: 'outline',\n  },\n  compoundVariants: [\n    {\n      isEmpty: true,\n      orientation: 'horizontal',\n      class: tw(['my-lg border-t-sm']),\n    },\n    {\n      isEmpty: true,\n      orientation: 'vertical',\n      class: tw(['mx-lg min-h-sz-24 border-l-sm']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'horizontal',\n      writingMode: 'horizontal-tb',\n      class: tw(['flex-row my-sm grow-0', 'before:border-t-sm', 'after:border-t-sm', '*:px-lg']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'vertical',\n      writingMode: 'horizontal-tb',\n      class: tw(['flex-col mx-sm', 'before:border-l-sm', 'after:border-l-sm', '*:py-lg']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'vertical',\n      writingMode: 'vertical-lr',\n      class: tw(['flex-col mx-sm', 'before:border-l-sm', 'after:border-l-sm', '*:px-lg']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'horizontal',\n      alignment: 'end',\n      class: tw(['after:w-sz-40 before:grow after:grow-0']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'horizontal',\n      alignment: 'start',\n      class: tw(['before:w-sz-40 before:grow-0 after:grow']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'horizontal',\n      alignment: 'center',\n      class: tw(['justify-center before:grow after:grow']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'vertical',\n      alignment: 'end',\n      class: tw(['after:h-sz-40 before:grow after:grow-0 before:min-h-sz-40']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'vertical',\n      alignment: 'start',\n      class: tw(['before:h-sz-40 before:grow-0 after:grow after:min-h-sz-40']),\n    },\n    {\n      isEmpty: false,\n      orientation: 'vertical',\n      alignment: 'center',\n      class: tw(['justify-center before:grow after:grow before:min-h-sz-40 after:min-h-sz-40']),\n    },\n    ...intentVariants,\n  ],\n})\n\nexport type DividerStylesProps = VariantProps<typeof dividerStyles>\n","import { Separator as BaseSeparator } from '@base-ui/react/separator'\nimport { cx } from 'class-variance-authority'\nimport { HTMLAttributes, ReactElement, ReactNode, Ref } from 'react'\n\nimport { Slot } from '../slot'\nimport { dividerStyles, type DividerStylesProps } from './Divider.styles'\n\nexport interface DividerProps\n  extends HTMLAttributes<HTMLDivElement>, Omit<DividerStylesProps, 'isEmpty'> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  children?: ReactElement\n  /**\n   * The orientation of the inner content.\n   */\n  alignment?: 'start' | 'end' | 'center'\n  /**\n   * The orientation of the separator.\n   */\n  orientation?: 'vertical' | 'horizontal'\n  /**\n   * When true, signifies that it is purely visual, carries no semantic meaning, and ensures it is not present in the accessibility tree.\n   */\n  isDecorative?: boolean\n  /**\n   * Color scheme of the divider.\n   */\n  intent?: 'outline' | 'current'\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const Divider = ({\n  asChild,\n  className,\n  isDecorative = false,\n  children,\n  orientation = 'horizontal',\n  writingMode = 'horizontal-tb',\n  alignment = 'center',\n  intent = 'outline',\n  ref,\n  role: roleProp,\n  ...props\n}: DividerProps) => {\n  const isEmpty = asChild ? !(children?.props as { children: ReactNode })?.children : !children\n\n  let roleProps: { role: string } | undefined\n  if (isDecorative) {\n    roleProps = { role: 'none' }\n  } else if (roleProp !== undefined) {\n    roleProps = { role: roleProp }\n  }\n\n  const renderSlot = asChild\n    ? // Base UI uses its `render` prop to swap the underlying element.\n      // We rely on Spark's `Slot` to mimic Radix's `asChild` behavior.\n      (slotProps: any) => <Slot {...slotProps} />\n    : undefined\n\n  return (\n    <BaseSeparator\n      data-spark-component=\"divider\"\n      className={cx(\n        dividerStyles({ isEmpty, orientation, alignment, intent, writingMode }),\n        className\n      )}\n      orientation={orientation}\n      ref={ref}\n      {...props}\n      render={renderSlot}\n      {...roleProps}\n      data-writing-mode={writingMode}\n    >\n      {children}\n    </BaseSeparator>\n  )\n}\n\nDivider.displayName = 'Divider'\n","import { cx } from 'class-variance-authority'\nimport { HTMLAttributes, ReactNode, Ref } from 'react'\n\nexport interface DividerContentProps extends HTMLAttributes<HTMLSpanElement> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  children?: ReactNode\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const DividerContent = ({ children, ref, className, ...props }: DividerContentProps) => {\n  return children ? (\n    <span\n      data-spark-component=\"divider-content\"\n      ref={ref}\n      {...props}\n      className={cx('group-data-[writing-mode=vertical-lr]:[writing-mode:vertical-lr]', className)}\n    >\n      {children}\n    </span>\n  ) : null\n}\n\nDividerContent.displayName = 'Divider.Content'\n","import { Divider as Root } from './Divider'\nimport { DividerContent } from './DividerContent'\n\nexport { type DividerContentProps } from './DividerContent'\n\nexport const Divider: typeof Root & {\n  Content: typeof DividerContent\n} = Object.assign(Root, {\n  Content: DividerContent,\n})\n\nDivider.displayName = 'Divider'\nDivider.Content.displayName = 'Divider.Content'\n"],"mappings":"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"}

package/dist/drawer/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),n=require("@base-ui/react/dialog"),u=require("react"),B=require("@spark-ui/hooks/use-merge-refs"),S=require("@spark-ui/hooks/use-scroll-overflow"),s=require("class-variance-authority"),C=require("../useRenderSlot-DATwjgpo.js"),R=require("@spark-ui/icons/Close"),T=require("../Icon-C-cNTnzd.js"),q=require("../IconButton-BR1bJSQA.js"),j=u.createContext(null),P=({children:e,withFade:a=!1})=>r.jsx(j.Provider,{value:{withFade:a},children:e}),O=()=>{const e=u.useContext(j);if(!e)throw Error("useDrawer must be used within a Drawer provider");return e},z=({onOpenChange:e,withFade:a=!1,...t})=>{const o=e?(l,i)=>{e(l)}:void 0;return r.jsx(P,{withFade:a,children:r.jsx(n.Dialog.Root,{"data-spark-component":"drawer",onOpenChange:o,...t})})};z.displayName="Drawer.Root";const F=s.cva(["grow","overflow-y-auto","outline-hidden","focus-visible:u-outline"],{variants:{inset:{true:"",false:"px-xl py-lg"}},defaultVariants:{inset:!1}}),w=({children:e,inset:a=!1,className:t,ref:o,...l})=>{const i=u.useRef(null),c=B.useMergeRefs(o,i),{withFade:p}=O(),{overflow:m}=S.useScrollOverflow(i);return r.jsx("div",{"data-spark-component":"drawer-body",ref:c,className:F({inset:a,className:t}),style:{...p&&{maskImage:"linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))",maskSize:`100% calc(100% + ${m.top?"0px":"44px"} + ${m.bottom?"0px":"44px"})`,maskPosition:`0 ${m.top?"0px":"-44px"}`}},...l,children:e})};w.displayName="Drawer.Body";const d=({asChild:e=!1,...a})=>{const t=C.useRenderSlot(e,"button");return r.jsx(n.Dialog.Close,{"data-spark-component":"drawer-close",render:t,...a})};d.displayName="Drawer.Close";const f=({"aria-label":e,className:a,size:t="md",intent:o="neutral",design:l="ghost",children:i=r.jsx(R.Close,{}),ref:c,...p})=>r.jsx(d,{"data-spark-component":"drawer-close-button",ref:c,className:s.cx(["absolute","top-sm","right-xl"],a),asChild:!0,...p,children:r.jsx(q.IconButton,{intent:o,size:t,design:l,"aria-label":e,children:r.jsx(T.Icon,{children:i})})});f.displayName="Drawer.CloseButton";const I=s.cva(["fixed z-modal flex flex-col bg-surface shadow-md","data-open:animation-duration-400 data-closed:animation-duration-200","data-nested-dialog-open:after:pointer-events-none","after:bg-transparent","after:transition-all","after:duration-200","data-nested-dialog-open:after:inset-0","data-nested-dialog-open:after:absolute","data-nested-dialog-open:after:rounded-[inherit]","data-nested-dialog-open:after:bg-overlay/dim-3"],{variants:{size:{sm:"",md:"",lg:"",fluid:"",fullscreen:"h-screen w-screen"},side:{right:["inset-y-0 right-0","data-open:animate-slide-in-right ","data-closed:animate-slide-out-right"],left:["inset-y-0 left-0","data-open:animate-slide-in-left","data-closed:animate-slide-out-left"],top:["top-0 left-0","w-screen","data-open:animate-slide-in-top","data-closed:animate-slide-out-top"],bottom:["bottom-0 left-0","w-screen","data-open:animate-slide-in-bottom","data-closed:animate-slide-out-bottom"]}},compoundVariants:[{side:["right","left"],size:"sm",class:["w-sz-480","max-w-full"]},{side:["right","left"],size:"md",class:["w-sz-672","max-w-full"]},{side:["right","left"],size:"lg",class:["w-sz-864","max-w-full"]},{side:["left","right"],size:"fluid",class:["w-auto","max-w-full"]},{side:["top","bottom"],size:"sm",class:["h-sz-480","max-h-full"]},{side:["top","bottom"],size:"md",class:["h-sz-672","max-h-full"]},{side:["top","bottom"],size:"lg",class:["h-sz-864","max-h-full"]},{side:["top","bottom"],size:"fluid",class:["h-auto","max-h-full"]}],defaultVariants:{side:"right",size:"md"}}),g=({className:e,size:a="md",side:t="right",ref:o,...l})=>r.jsx(n.Dialog.Popup,{ref:o,"data-spark-component":"drawer-content",role:"dialog",className:i=>s.cx(I({size:a,side:t,className:typeof e=="function"?e(i):e})),...l});g.displayName="Drawer.Content";const x=e=>r.jsx(n.Dialog.Description,{"data-spark-component":"drawer-description",...e});x.displayName="Drawer.Description";const D=({className:e,ref:a,...t})=>r.jsx("footer",{"data-spark-component":"drawer-footer",ref:a,className:s.cx(["px-xl","py-lg"],e),...t});D.displayName="Drawer.Footer";const y=({children:e,className:a,ref:t,...o})=>r.jsx("header",{"data-spark-component":"drawer-header",ref:t,className:s.cx(["px-xl","py-lg"],a),...o,children:e});y.displayName="Dialog.Header";const h=({className:e,...a})=>r.jsx(n.Dialog.Backdrop,{"data-spark-component":"drawer-overlay",className:t=>s.cx("z-overlay fixed top-0 left-0 h-screen w-screen","bg-overlay/dim-1","data-starting-style:animate-fade-in","data-ending-style:animate-fade-out",typeof e=="function"?e(t):e),...a});h.displayName="Drawer.Overlay";const b=({className:e,...a})=>r.jsx(n.Dialog.Portal,{"data-spark-component":"drawer-portal",className:s.cx(e,"z-modal absolute"),...a});b.displayName="Drawer.Portal";const N=({className:e,...a})=>r.jsx(n.Dialog.Title,{"data-spark-component":"drawer-title",className:s.cx("text-headline-2 text-on-surface",e),...a});N.displayName="Drawer.Title";const v=({asChild:e=!1,...a})=>{const t=C.useRenderSlot(e,"button");return r.jsx(n.Dialog.Trigger,{"data-spark-component":"drawer-trigger",render:t,...a})};v.displayName="Drawer.Trigger";const k=Object.assign(z,{Trigger:v,Portal:b,Overlay:h,Content:g,Header:y,Body:w,Footer:D,Close:d,CloseButton:f,Title:N,Description:x});k.displayName="Drawer";v.displayName="Drawer.Trigger";b.displayName="Drawer.Portal";h.displayName="Drawer.Overlay";g.displayName="Drawer.Content";y.displayName="Drawer.Header";w.displayName="Drawer.Body";D.displayName="Drawer.Footer";d.displayName="Drawer.Close";f.displayName="Drawer.CloseButton";N.displayName="Drawer.Title";x.displayName="Drawer.Description";exports.Drawer=k;
-//# sourceMappingURL=index.js.map
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../icon-CRPcdgYp.js`),t=require(`../icon-button-CykysbgJ.js`),n=require(`../useRenderSlot-Xxf_s88b.js`);let r=require(`class-variance-authority`),i=require(`react`),a=require(`react/jsx-runtime`),o=require(`@spark-ui/hooks/use-merge-refs`),s=require(`@spark-ui/hooks/use-scroll-overflow`),c=require(`@spark-ui/icons/Close`),l=require(`@base-ui/react/dialog`);var u=(0,i.createContext)(null),d=({children:e,withFade:t=!1})=>(0,a.jsx)(u.Provider,{value:{withFade:t},children:e}),f=()=>{let e=(0,i.useContext)(u);if(!e)throw Error(`useDrawer must be used within a Drawer provider`);return e},p=({onOpenChange:e,withFade:t=!1,...n})=>{let r=e?(t,n)=>{e(t)}:void 0;return(0,a.jsx)(d,{withFade:t,children:(0,a.jsx)(l.Dialog.Root,{"data-spark-component":`drawer`,onOpenChange:r,...n})})};p.displayName=`Drawer.Root`;var m=(0,r.cva)([`grow`,`overflow-y-auto`,`outline-hidden`,`focus-visible:u-outline`],{variants:{inset:{true:``,false:`px-xl py-lg`}},defaultVariants:{inset:!1}}),h=({children:e,inset:t=!1,className:n,ref:r,...c})=>{let l=(0,i.useRef)(null),u=(0,o.useMergeRefs)(r,l),{withFade:d}=f(),{overflow:p}=(0,s.useScrollOverflow)(l);return(0,a.jsx)(`div`,{"data-spark-component":`drawer-body`,ref:u,className:m({inset:t,className:n}),style:{...d&&{maskImage:`linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))`,maskSize:`100% calc(100% + ${p.top?`0px`:`44px`} + ${p.bottom?`0px`:`44px`})`,maskPosition:`0 ${p.top?`0px`:`-44px`}`}},...c,children:e})};h.displayName=`Drawer.Body`;var g=({asChild:e=!1,...t})=>{let r=n.t(e,`button`);return(0,a.jsx)(l.Dialog.Close,{"data-spark-component":`drawer-close`,render:r,...t})};g.displayName=`Drawer.Close`;var _=({"aria-label":n,className:i,size:o=`md`,intent:s=`neutral`,design:l=`ghost`,children:u=(0,a.jsx)(c.Close,{}),ref:d,...f})=>(0,a.jsx)(g,{"data-spark-component":`drawer-close-button`,ref:d,className:(0,r.cx)([`absolute`,`top-sm`,`right-xl`],i),asChild:!0,...f,children:(0,a.jsx)(t.t,{intent:s,size:o,design:l,"aria-label":n,children:(0,a.jsx)(e.t,{children:u})})});_.displayName=`Drawer.CloseButton`;var v=(0,r.cva)([`fixed z-modal flex flex-col bg-surface shadow-md`,`data-open:animation-duration-400 data-closed:animation-duration-200`,`data-nested-dialog-open:after:pointer-events-none`,`after:bg-transparent`,`after:transition-all`,`after:duration-200`,`data-nested-dialog-open:after:inset-0`,`data-nested-dialog-open:after:absolute`,`data-nested-dialog-open:after:rounded-[inherit]`,`data-nested-dialog-open:after:bg-overlay/dim-3`],{variants:{size:{sm:``,md:``,lg:``,fluid:``,fullscreen:`h-screen w-screen`},side:{right:[`inset-y-0 right-0`,`data-open:animate-slide-in-right `,`data-closed:animate-slide-out-right`],left:[`inset-y-0 left-0`,`data-open:animate-slide-in-left`,`data-closed:animate-slide-out-left`],top:[`top-0 left-0`,`w-screen`,`data-open:animate-slide-in-top`,`data-closed:animate-slide-out-top`],bottom:[`bottom-0 left-0`,`w-screen`,`data-open:animate-slide-in-bottom`,`data-closed:animate-slide-out-bottom`]}},compoundVariants:[{side:[`right`,`left`],size:`sm`,class:[`w-sz-480`,`max-w-full`]},{side:[`right`,`left`],size:`md`,class:[`w-sz-672`,`max-w-full`]},{side:[`right`,`left`],size:`lg`,class:[`w-sz-864`,`max-w-full`]},{side:[`left`,`right`],size:`fluid`,class:[`w-auto`,`max-w-full`]},{side:[`top`,`bottom`],size:`sm`,class:[`h-sz-480`,`max-h-full`]},{side:[`top`,`bottom`],size:`md`,class:[`h-sz-672`,`max-h-full`]},{side:[`top`,`bottom`],size:`lg`,class:[`h-sz-864`,`max-h-full`]},{side:[`top`,`bottom`],size:`fluid`,class:[`h-auto`,`max-h-full`]}],defaultVariants:{side:`right`,size:`md`}}),y=({className:e,size:t=`md`,side:n=`right`,ref:i,...o})=>(0,a.jsx)(l.Dialog.Popup,{ref:i,"data-spark-component":`drawer-content`,role:`dialog`,className:i=>(0,r.cx)(v({size:t,side:n,className:typeof e==`function`?e(i):e})),...o});y.displayName=`Drawer.Content`;var b=e=>(0,a.jsx)(l.Dialog.Description,{"data-spark-component":`drawer-description`,...e});b.displayName=`Drawer.Description`;var x=({className:e,ref:t,...n})=>(0,a.jsx)(`footer`,{"data-spark-component":`drawer-footer`,ref:t,className:(0,r.cx)([`px-xl`,`py-lg`],e),...n});x.displayName=`Drawer.Footer`;var S=({children:e,className:t,ref:n,...i})=>(0,a.jsx)(`header`,{"data-spark-component":`drawer-header`,ref:n,className:(0,r.cx)([`px-xl`,`py-lg`],t),...i,children:e});S.displayName=`Dialog.Header`;var C=({className:e,...t})=>(0,a.jsx)(l.Dialog.Backdrop,{"data-spark-component":`drawer-overlay`,className:t=>(0,r.cx)(`z-overlay fixed top-0 left-0 h-screen w-screen`,`bg-overlay/dim-1`,`data-starting-style:animate-fade-in`,`data-ending-style:animate-fade-out`,typeof e==`function`?e(t):e),...t});C.displayName=`Drawer.Overlay`;var w=({className:e,...t})=>(0,a.jsx)(l.Dialog.Portal,{"data-spark-component":`drawer-portal`,className:(0,r.cx)(e,`z-modal absolute`),...t});w.displayName=`Drawer.Portal`;var T=({className:e,...t})=>(0,a.jsx)(l.Dialog.Title,{"data-spark-component":`drawer-title`,className:(0,r.cx)(`text-headline-2 text-on-surface`,e),...t});T.displayName=`Drawer.Title`;var E=({asChild:e=!1,...t})=>{let r=n.t(e,`button`);return(0,a.jsx)(l.Dialog.Trigger,{"data-spark-component":`drawer-trigger`,render:r,...t})};E.displayName=`Drawer.Trigger`;var D=Object.assign(p,{Trigger:E,Portal:w,Overlay:C,Content:y,Header:S,Body:h,Footer:x,Close:g,CloseButton:_,Title:T,Description:b});D.displayName=`Drawer`,E.displayName=`Drawer.Trigger`,w.displayName=`Drawer.Portal`,C.displayName=`Drawer.Overlay`,y.displayName=`Drawer.Content`,S.displayName=`Drawer.Header`,h.displayName=`Drawer.Body`,x.displayName=`Drawer.Footer`,g.displayName=`Drawer.Close`,_.displayName=`Drawer.CloseButton`,T.displayName=`Drawer.Title`,b.displayName=`Drawer.Description`,exports.Drawer=D;
+//# sourceMappingURL=index.js.map

package/dist/drawer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/drawer/DrawerContext.tsx","../../src/drawer/Drawer.tsx","../../src/drawer/DrawerBody.styles.ts","../../src/drawer/DrawerBody.tsx","../../src/drawer/DrawerClose.tsx","../../src/drawer/DrawerCloseButton.tsx","../../src/drawer/DrawerContent.styles.tsx","../../src/drawer/DrawerContent.tsx","../../src/drawer/DrawerDescription.tsx","../../src/drawer/DrawerFooter.tsx","../../src/drawer/DrawerHeader.tsx","../../src/drawer/DrawerOverlay.tsx","../../src/drawer/DrawerPortal.tsx","../../src/drawer/DrawerTitle.tsx","../../src/drawer/DrawerTrigger.tsx","../../src/drawer/index.ts"],"sourcesContent":["import { createContext, type ReactNode, useContext } from 'react'\n\nexport interface DrawerContextState {\n  withFade: boolean\n}\n\nconst DrawerContext = createContext<DrawerContextState | null>(null)\n\nexport const DrawerProvider = ({\n  children: childrenProp,\n  withFade = false,\n}: {\n  children: ReactNode\n  withFade?: boolean\n}) => {\n  return (\n    <DrawerContext.Provider\n      value={{\n        withFade,\n      }}\n    >\n      {childrenProp}\n    </DrawerContext.Provider>\n  )\n}\n\nexport const useDrawer = () => {\n  const context = useContext(DrawerContext)\n\n  if (!context) {\n    throw Error('useDrawer must be used within a Drawer provider')\n  }\n\n  return context\n}\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, type ReactElement } from 'react'\n\nimport { DrawerProvider } from './DrawerContext'\n\nexport interface DrawerProps\n  extends Omit<ComponentProps<typeof BaseDialog.Root>, 'onOpenChange' | 'render'> {\n  /**\n   * Specifies if the dialog is open or not.\n   */\n  open?: boolean\n  /**\n   * Default open state.\n   */\n  defaultOpen?: boolean\n  /**\n   * Handler executed on every dialog open state change.\n   */\n  onOpenChange?: (open: boolean) => void\n  /**\n   * Specifies if the dialog is a modal.\n   */\n  modal?: boolean\n  /**\n   * Specifies if the drawer should have a fade animation on its body (in case it is scrollable).\n   */\n  withFade?: boolean\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n}\n\nexport const Drawer = ({ onOpenChange, withFade = false, ...props }: DrawerProps): ReactElement => {\n  const handleOpenChange = onOpenChange\n    ? (open: boolean, _eventDetails: unknown) => {\n        onOpenChange(open)\n      }\n    : undefined\n\n  return (\n    <DrawerProvider withFade={withFade}>\n      <BaseDialog.Root data-spark-component=\"drawer\" onOpenChange={handleOpenChange} {...props} />\n    </DrawerProvider>\n  )\n}\n\nDrawer.displayName = 'Drawer.Root'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const drawerBodyStyles = cva(\n  ['grow', 'overflow-y-auto', 'outline-hidden', 'focus-visible:u-outline'],\n  {\n    variants: {\n      inset: {\n        true: '',\n        false: 'px-xl py-lg',\n      },\n    },\n    defaultVariants: {\n      inset: false,\n    },\n  }\n)\n\nexport type DrawerBodyStylesProps = VariantProps<typeof drawerBodyStyles>\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { type ReactNode, Ref, useRef } from 'react'\n\nimport { drawerBodyStyles, type DrawerBodyStylesProps } from './DrawerBody.styles'\nimport { useDrawer } from './DrawerContext'\n\nexport interface DrawerBodyProps extends DrawerBodyStylesProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerBody = ({\n  children,\n  inset = false,\n  className,\n  ref: forwardedRef,\n  ...rest\n}: DrawerBodyProps) => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n  const { withFade } = useDrawer()\n\n  const { overflow } = useScrollOverflow(scrollAreaRef)\n\n  return (\n    <div\n      data-spark-component=\"drawer-body\"\n      ref={ref}\n      className={drawerBodyStyles({ inset, className })}\n      style={{\n        ...(withFade && {\n          maskImage:\n            'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n          maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n          maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n        }),\n      }}\n      {...rest}\n    >\n      {children}\n    </div>\n  )\n}\n\nDrawerBody.displayName = 'Drawer.Body'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface DrawerCloseProps extends Omit<ComponentProps<typeof BaseDialog.Close>, 'render'> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const DrawerClose = ({ asChild = false, ...props }: DrawerCloseProps) => {\n  const renderSlot = useRenderSlot(asChild, 'button')\n\n  return <BaseDialog.Close data-spark-component=\"drawer-close\" render={renderSlot} {...props} />\n}\n\nDrawerClose.displayName = 'Drawer.Close'\n","import { Close as CloseSVG } from '@spark-ui/icons/Close'\nimport { cx } from 'class-variance-authority'\n\nimport { Icon } from '../icon'\nimport { IconButton, type IconButtonProps } from '../icon-button'\nimport { DrawerClose, type DrawerCloseProps } from './DrawerClose'\n\nexport type DrawerCloseButtonProps = DrawerCloseProps &\n  Pick<IconButtonProps, 'size' | 'intent' | 'design' | 'aria-label'>\n\nexport const DrawerCloseButton = ({\n  'aria-label': ariaLabel,\n  className,\n  size = 'md',\n  intent = 'neutral',\n  design = 'ghost',\n  children = <CloseSVG />,\n  ref,\n  ...rest\n}: DrawerCloseButtonProps) => (\n  <DrawerClose\n    data-spark-component=\"drawer-close-button\"\n    ref={ref}\n    className={cx(['absolute', 'top-sm', 'right-xl'], className)}\n    asChild\n    {...rest}\n  >\n    <IconButton intent={intent} size={size} design={design} aria-label={ariaLabel}>\n      <Icon>{children}</Icon>\n    </IconButton>\n  </DrawerClose>\n)\n\nDrawerCloseButton.displayName = 'Drawer.CloseButton'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const drawerContentStyles = cva(\n  [\n    'fixed z-modal flex flex-col bg-surface shadow-md',\n    // Base UI uses data-open and data-closed for transitions\n    'data-open:animation-duration-400 data-closed:animation-duration-200',\n    // Nested dialog effect\n    'data-nested-dialog-open:after:pointer-events-none',\n    'after:bg-transparent',\n    'after:transition-all',\n    'after:duration-200',\n    'data-nested-dialog-open:after:inset-0',\n    'data-nested-dialog-open:after:absolute',\n    'data-nested-dialog-open:after:rounded-[inherit]',\n    'data-nested-dialog-open:after:bg-overlay/dim-3',\n  ],\n  {\n    variants: {\n      size: {\n        sm: '',\n        md: '',\n        lg: '',\n        fluid: '',\n        fullscreen: 'h-screen w-screen',\n      },\n      side: {\n        right: [\n          'inset-y-0 right-0',\n          'data-open:animate-slide-in-right ',\n          'data-closed:animate-slide-out-right',\n        ],\n        left: [\n          'inset-y-0 left-0',\n          'data-open:animate-slide-in-left',\n          'data-closed:animate-slide-out-left',\n        ],\n        top: [\n          'top-0 left-0',\n          'w-screen',\n          'data-open:animate-slide-in-top',\n          'data-closed:animate-slide-out-top',\n        ],\n        bottom: [\n          'bottom-0 left-0',\n          'w-screen',\n          'data-open:animate-slide-in-bottom',\n          'data-closed:animate-slide-out-bottom',\n        ],\n      },\n    },\n    compoundVariants: [\n      {\n        side: ['right', 'left'],\n        size: 'sm',\n        class: ['w-sz-480', 'max-w-full'],\n      },\n      {\n        side: ['right', 'left'],\n        size: 'md',\n        class: ['w-sz-672', 'max-w-full'],\n      },\n      {\n        side: ['right', 'left'],\n        size: 'lg',\n        class: ['w-sz-864', 'max-w-full'],\n      },\n      {\n        side: ['left', 'right'],\n        size: 'fluid',\n        class: ['w-auto', 'max-w-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'sm',\n        class: ['h-sz-480', 'max-h-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'md',\n        class: ['h-sz-672', 'max-h-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'lg',\n        class: ['h-sz-864', 'max-h-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'fluid',\n        class: ['h-auto', 'max-h-full'],\n      },\n    ],\n    defaultVariants: {\n      side: 'right',\n      size: 'md',\n    },\n  }\n)\n\nexport type DrawerContentStylesProps = VariantProps<typeof drawerContentStyles>\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { drawerContentStyles, type DrawerContentStylesProps } from './DrawerContent.styles'\n\nexport interface DrawerContentProps\n  extends Omit<ComponentProps<typeof BaseDialog.Popup>, 'render'>,\n    DrawerContentStylesProps {\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerContent = ({\n  className,\n  size = 'md',\n  side = 'right',\n  ref,\n  ...rest\n}: DrawerContentProps) => {\n  return (\n    <BaseDialog.Popup\n      ref={ref}\n      data-spark-component=\"drawer-content\"\n      role=\"dialog\"\n      className={state =>\n        cx(\n          drawerContentStyles({\n            size,\n            side,\n            className: typeof className === 'function' ? className(state) : className,\n          })\n        )\n      }\n      {...rest}\n    />\n  )\n}\n\nDrawerContent.displayName = 'Drawer.Content'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface DrawerDescriptionProps\n  extends Omit<ComponentProps<typeof BaseDialog.Description>, 'render'> {\n  ref?: Ref<HTMLParagraphElement>\n}\n\nexport const DrawerDescription = (props: DrawerDescriptionProps) => {\n  return <BaseDialog.Description data-spark-component=\"drawer-description\" {...props} />\n}\n\nDrawerDescription.displayName = 'Drawer.Description'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, type ReactElement, Ref } from 'react'\n\nexport type DrawerFooterProps = ComponentPropsWithoutRef<'footer'> & {\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerFooter = ({ className, ref, ...rest }: DrawerFooterProps): ReactElement => (\n  <footer\n    data-spark-component=\"drawer-footer\"\n    ref={ref}\n    className={cx(['px-xl', 'py-lg'], className)}\n    {...rest}\n  />\n)\n\nDrawerFooter.displayName = 'Drawer.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface DrawerHeaderProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerHeader = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: DrawerHeaderProps): ReactElement => (\n  <header\n    data-spark-component=\"drawer-header\"\n    ref={ref}\n    className={cx(['px-xl', 'py-lg'], className)}\n    {...rest}\n  >\n    {children}\n  </header>\n)\n\nDrawerHeader.displayName = 'Dialog.Header'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface DrawerOverlayProps\n  extends Omit<ComponentProps<typeof BaseDialog.Backdrop>, 'render'> {\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerOverlay = ({ className, ...props }: DrawerOverlayProps) => {\n  return (\n    <BaseDialog.Backdrop\n      data-spark-component=\"drawer-overlay\"\n      className={state =>\n        cx(\n          'z-overlay fixed top-0 left-0 h-screen w-screen',\n          'bg-overlay/dim-1',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          'data-starting-style:animate-fade-in',\n          'data-ending-style:animate-fade-out',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      {...props}\n    />\n  )\n}\n\nDrawerOverlay.displayName = 'Drawer.Overlay'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type DrawerPortalProps = ComponentProps<typeof BaseDialog.Portal>\n\nexport const DrawerPortal = ({ className, ...props }: DrawerPortalProps) => {\n  return (\n    <BaseDialog.Portal\n      data-spark-component=\"drawer-portal\"\n      className={cx(className, 'z-modal absolute')}\n      {...props}\n    />\n  )\n}\n\nDrawerPortal.displayName = 'Drawer.Portal'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface DrawerTitleProps extends Omit<ComponentProps<typeof BaseDialog.Title>, 'render'> {\n  ref?: Ref<HTMLHeadingElement>\n}\n\nexport const DrawerTitle = ({ className, ...props }: DrawerTitleProps) => {\n  return (\n    <BaseDialog.Title\n      data-spark-component=\"drawer-title\"\n      className={cx('text-headline-2 text-on-surface', className)}\n      {...props}\n    />\n  )\n}\n\nDrawerTitle.displayName = 'Drawer.Title'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface DrawerTriggerProps\n  extends Omit<ComponentProps<typeof BaseDialog.Trigger>, 'render'> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const DrawerTrigger = ({ asChild = false, ...props }: DrawerTriggerProps) => {\n  const renderSlot = useRenderSlot(asChild, 'button')\n\n  return <BaseDialog.Trigger data-spark-component=\"drawer-trigger\" render={renderSlot} {...props} />\n}\n\nDrawerTrigger.displayName = 'Drawer.Trigger'\n","import { Drawer as Root } from './Drawer'\nimport { DrawerBody } from './DrawerBody'\nimport { DrawerClose } from './DrawerClose'\nimport { DrawerCloseButton } from './DrawerCloseButton'\nimport { DrawerContent } from './DrawerContent'\nimport { DrawerDescription } from './DrawerDescription' // aria-describedby\nimport { DrawerFooter } from './DrawerFooter'\nimport { DrawerHeader } from './DrawerHeader'\nimport { DrawerOverlay } from './DrawerOverlay'\nimport { DrawerPortal } from './DrawerPortal'\nimport { DrawerTitle } from './DrawerTitle'\nimport { DrawerTrigger } from './DrawerTrigger'\n\nexport const Drawer: typeof Root & {\n  Trigger: typeof DrawerTrigger\n  Portal: typeof DrawerPortal\n  Overlay: typeof DrawerOverlay\n  Content: typeof DrawerContent\n  Header: typeof DrawerHeader\n  Body: typeof DrawerBody\n  Footer: typeof DrawerFooter\n  Close: typeof DrawerClose\n  CloseButton: typeof DrawerCloseButton\n  Title: typeof DrawerTitle\n  Description: typeof DrawerDescription\n} = Object.assign(Root, {\n  Trigger: DrawerTrigger,\n  Portal: DrawerPortal,\n  Overlay: DrawerOverlay,\n  Content: DrawerContent,\n  Header: DrawerHeader,\n  Body: DrawerBody,\n  Footer: DrawerFooter,\n  Close: DrawerClose,\n  CloseButton: DrawerCloseButton,\n  Title: DrawerTitle,\n  Description: DrawerDescription,\n})\n\nDrawer.displayName = 'Drawer'\nDrawerTrigger.displayName = 'Drawer.Trigger'\nDrawerPortal.displayName = 'Drawer.Portal'\nDrawerOverlay.displayName = 'Drawer.Overlay'\nDrawerContent.displayName = 'Drawer.Content'\nDrawerHeader.displayName = 'Drawer.Header'\nDrawerBody.displayName = 'Drawer.Body'\nDrawerFooter.displayName = 'Drawer.Footer'\nDrawerClose.displayName = 'Drawer.Close'\nDrawerCloseButton.displayName = 'Drawer.CloseButton'\nDrawerTitle.displayName = 'Drawer.Title'\nDrawerDescription.displayName = 'Drawer.Description'\n\nexport { type DrawerProps } from './Drawer'\nexport { type DrawerContentProps } from './DrawerContent'\nexport { type DrawerHeaderProps } from './DrawerHeader'\nexport { type DrawerBodyProps } from './DrawerBody'\nexport { type DrawerFooterProps } from './DrawerFooter'\nexport { type DrawerTriggerProps } from './DrawerTrigger'\nexport { type DrawerOverlayProps } from './DrawerOverlay'\nexport { type DrawerPortalProps } from './DrawerPortal'\nexport { type DrawerTitleProps } from './DrawerTitle'\nexport { type DrawerDescriptionProps } from './DrawerDescription'\nexport { type DrawerCloseProps } from './DrawerClose'\nexport { type DrawerCloseButtonProps } from './DrawerCloseButton'\n"],"names":["DrawerContext","createContext","DrawerProvider","childrenProp","withFade","jsx","useDrawer","context","useContext","Drawer","onOpenChange","props","handleOpenChange","open","_eventDetails","BaseDialog","drawerBodyStyles","cva","DrawerBody","children","inset","className","forwardedRef","rest","scrollAreaRef","useRef","ref","useMergeRefs","overflow","useScrollOverflow","DrawerClose","asChild","renderSlot","useRenderSlot","DrawerCloseButton","ariaLabel","size","intent","design","CloseSVG","cx","IconButton","Icon","drawerContentStyles","DrawerContent","side","state","DrawerDescription","DrawerFooter","DrawerHeader","DrawerOverlay","DrawerPortal","DrawerTitle","DrawerTrigger","Root"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/drawer/DrawerContext.tsx","../../src/drawer/Drawer.tsx","../../src/drawer/DrawerBody.styles.ts","../../src/drawer/DrawerBody.tsx","../../src/drawer/DrawerClose.tsx","../../src/drawer/DrawerCloseButton.tsx","../../src/drawer/DrawerContent.styles.tsx","../../src/drawer/DrawerContent.tsx","../../src/drawer/DrawerDescription.tsx","../../src/drawer/DrawerFooter.tsx","../../src/drawer/DrawerHeader.tsx","../../src/drawer/DrawerOverlay.tsx","../../src/drawer/DrawerPortal.tsx","../../src/drawer/DrawerTitle.tsx","../../src/drawer/DrawerTrigger.tsx","../../src/drawer/index.ts"],"sourcesContent":["import { createContext, type ReactNode, useContext } from 'react'\n\nexport interface DrawerContextState {\n  withFade: boolean\n}\n\nconst DrawerContext = createContext<DrawerContextState | null>(null)\n\nexport const DrawerProvider = ({\n  children: childrenProp,\n  withFade = false,\n}: {\n  children: ReactNode\n  withFade?: boolean\n}) => {\n  return (\n    <DrawerContext.Provider\n      value={{\n        withFade,\n      }}\n    >\n      {childrenProp}\n    </DrawerContext.Provider>\n  )\n}\n\nexport const useDrawer = () => {\n  const context = useContext(DrawerContext)\n\n  if (!context) {\n    throw Error('useDrawer must be used within a Drawer provider')\n  }\n\n  return context\n}\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, type ReactElement } from 'react'\n\nimport { DrawerProvider } from './DrawerContext'\n\nexport interface DrawerProps extends Omit<\n  ComponentProps<typeof BaseDialog.Root>,\n  'onOpenChange' | 'render'\n> {\n  /**\n   * Specifies if the dialog is open or not.\n   */\n  open?: boolean\n  /**\n   * Default open state.\n   */\n  defaultOpen?: boolean\n  /**\n   * Handler executed on every dialog open state change.\n   */\n  onOpenChange?: (open: boolean) => void\n  /**\n   * Specifies if the dialog is a modal.\n   */\n  modal?: boolean\n  /**\n   * Specifies if the drawer should have a fade animation on its body (in case it is scrollable).\n   */\n  withFade?: boolean\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n}\n\nexport const Drawer = ({ onOpenChange, withFade = false, ...props }: DrawerProps): ReactElement => {\n  const handleOpenChange = onOpenChange\n    ? (open: boolean, _eventDetails: unknown) => {\n        onOpenChange(open)\n      }\n    : undefined\n\n  return (\n    <DrawerProvider withFade={withFade}>\n      <BaseDialog.Root data-spark-component=\"drawer\" onOpenChange={handleOpenChange} {...props} />\n    </DrawerProvider>\n  )\n}\n\nDrawer.displayName = 'Drawer.Root'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const drawerBodyStyles = cva(\n  ['grow', 'overflow-y-auto', 'outline-hidden', 'focus-visible:u-outline'],\n  {\n    variants: {\n      inset: {\n        true: '',\n        false: 'px-xl py-lg',\n      },\n    },\n    defaultVariants: {\n      inset: false,\n    },\n  }\n)\n\nexport type DrawerBodyStylesProps = VariantProps<typeof drawerBodyStyles>\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { type ReactNode, Ref, useRef } from 'react'\n\nimport { drawerBodyStyles, type DrawerBodyStylesProps } from './DrawerBody.styles'\nimport { useDrawer } from './DrawerContext'\n\nexport interface DrawerBodyProps extends DrawerBodyStylesProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerBody = ({\n  children,\n  inset = false,\n  className,\n  ref: forwardedRef,\n  ...rest\n}: DrawerBodyProps) => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n  const { withFade } = useDrawer()\n\n  const { overflow } = useScrollOverflow(scrollAreaRef)\n\n  return (\n    <div\n      data-spark-component=\"drawer-body\"\n      ref={ref}\n      className={drawerBodyStyles({ inset, className })}\n      style={{\n        ...(withFade && {\n          maskImage:\n            'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n          maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n          maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n        }),\n      }}\n      {...rest}\n    >\n      {children}\n    </div>\n  )\n}\n\nDrawerBody.displayName = 'Drawer.Body'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface DrawerCloseProps extends Omit<ComponentProps<typeof BaseDialog.Close>, 'render'> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const DrawerClose = ({ asChild = false, ...props }: DrawerCloseProps) => {\n  const renderSlot = useRenderSlot(asChild, 'button')\n\n  return <BaseDialog.Close data-spark-component=\"drawer-close\" render={renderSlot} {...props} />\n}\n\nDrawerClose.displayName = 'Drawer.Close'\n","import { Close as CloseSVG } from '@spark-ui/icons/Close'\nimport { cx } from 'class-variance-authority'\n\nimport { Icon } from '../icon'\nimport { IconButton, type IconButtonProps } from '../icon-button'\nimport { DrawerClose, type DrawerCloseProps } from './DrawerClose'\n\nexport type DrawerCloseButtonProps = DrawerCloseProps &\n  Pick<IconButtonProps, 'size' | 'intent' | 'design' | 'aria-label'>\n\nexport const DrawerCloseButton = ({\n  'aria-label': ariaLabel,\n  className,\n  size = 'md',\n  intent = 'neutral',\n  design = 'ghost',\n  children = <CloseSVG />,\n  ref,\n  ...rest\n}: DrawerCloseButtonProps) => (\n  <DrawerClose\n    data-spark-component=\"drawer-close-button\"\n    ref={ref}\n    className={cx(['absolute', 'top-sm', 'right-xl'], className)}\n    asChild\n    {...rest}\n  >\n    <IconButton intent={intent} size={size} design={design} aria-label={ariaLabel}>\n      <Icon>{children}</Icon>\n    </IconButton>\n  </DrawerClose>\n)\n\nDrawerCloseButton.displayName = 'Drawer.CloseButton'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const drawerContentStyles = cva(\n  [\n    'fixed z-modal flex flex-col bg-surface shadow-md',\n    // Base UI uses data-open and data-closed for transitions\n    'data-open:animation-duration-400 data-closed:animation-duration-200',\n    // Nested dialog effect\n    'data-nested-dialog-open:after:pointer-events-none',\n    'after:bg-transparent',\n    'after:transition-all',\n    'after:duration-200',\n    'data-nested-dialog-open:after:inset-0',\n    'data-nested-dialog-open:after:absolute',\n    'data-nested-dialog-open:after:rounded-[inherit]',\n    'data-nested-dialog-open:after:bg-overlay/dim-3',\n  ],\n  {\n    variants: {\n      size: {\n        sm: '',\n        md: '',\n        lg: '',\n        fluid: '',\n        fullscreen: 'h-screen w-screen',\n      },\n      side: {\n        right: [\n          'inset-y-0 right-0',\n          'data-open:animate-slide-in-right ',\n          'data-closed:animate-slide-out-right',\n        ],\n        left: [\n          'inset-y-0 left-0',\n          'data-open:animate-slide-in-left',\n          'data-closed:animate-slide-out-left',\n        ],\n        top: [\n          'top-0 left-0',\n          'w-screen',\n          'data-open:animate-slide-in-top',\n          'data-closed:animate-slide-out-top',\n        ],\n        bottom: [\n          'bottom-0 left-0',\n          'w-screen',\n          'data-open:animate-slide-in-bottom',\n          'data-closed:animate-slide-out-bottom',\n        ],\n      },\n    },\n    compoundVariants: [\n      {\n        side: ['right', 'left'],\n        size: 'sm',\n        class: ['w-sz-480', 'max-w-full'],\n      },\n      {\n        side: ['right', 'left'],\n        size: 'md',\n        class: ['w-sz-672', 'max-w-full'],\n      },\n      {\n        side: ['right', 'left'],\n        size: 'lg',\n        class: ['w-sz-864', 'max-w-full'],\n      },\n      {\n        side: ['left', 'right'],\n        size: 'fluid',\n        class: ['w-auto', 'max-w-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'sm',\n        class: ['h-sz-480', 'max-h-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'md',\n        class: ['h-sz-672', 'max-h-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'lg',\n        class: ['h-sz-864', 'max-h-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'fluid',\n        class: ['h-auto', 'max-h-full'],\n      },\n    ],\n    defaultVariants: {\n      side: 'right',\n      size: 'md',\n    },\n  }\n)\n\nexport type DrawerContentStylesProps = VariantProps<typeof drawerContentStyles>\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { drawerContentStyles, type DrawerContentStylesProps } from './DrawerContent.styles'\n\nexport interface DrawerContentProps\n  extends Omit<ComponentProps<typeof BaseDialog.Popup>, 'render'>, DrawerContentStylesProps {\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerContent = ({\n  className,\n  size = 'md',\n  side = 'right',\n  ref,\n  ...rest\n}: DrawerContentProps) => {\n  return (\n    <BaseDialog.Popup\n      ref={ref}\n      data-spark-component=\"drawer-content\"\n      role=\"dialog\"\n      className={state =>\n        cx(\n          drawerContentStyles({\n            size,\n            side,\n            className: typeof className === 'function' ? className(state) : className,\n          })\n        )\n      }\n      {...rest}\n    />\n  )\n}\n\nDrawerContent.displayName = 'Drawer.Content'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface DrawerDescriptionProps extends Omit<\n  ComponentProps<typeof BaseDialog.Description>,\n  'render'\n> {\n  ref?: Ref<HTMLParagraphElement>\n}\n\nexport const DrawerDescription = (props: DrawerDescriptionProps) => {\n  return <BaseDialog.Description data-spark-component=\"drawer-description\" {...props} />\n}\n\nDrawerDescription.displayName = 'Drawer.Description'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, type ReactElement, Ref } from 'react'\n\nexport type DrawerFooterProps = ComponentPropsWithoutRef<'footer'> & {\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerFooter = ({ className, ref, ...rest }: DrawerFooterProps): ReactElement => (\n  <footer\n    data-spark-component=\"drawer-footer\"\n    ref={ref}\n    className={cx(['px-xl', 'py-lg'], className)}\n    {...rest}\n  />\n)\n\nDrawerFooter.displayName = 'Drawer.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface DrawerHeaderProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerHeader = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: DrawerHeaderProps): ReactElement => (\n  <header\n    data-spark-component=\"drawer-header\"\n    ref={ref}\n    className={cx(['px-xl', 'py-lg'], className)}\n    {...rest}\n  >\n    {children}\n  </header>\n)\n\nDrawerHeader.displayName = 'Dialog.Header'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface DrawerOverlayProps extends Omit<\n  ComponentProps<typeof BaseDialog.Backdrop>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerOverlay = ({ className, ...props }: DrawerOverlayProps) => {\n  return (\n    <BaseDialog.Backdrop\n      data-spark-component=\"drawer-overlay\"\n      className={state =>\n        cx(\n          'z-overlay fixed top-0 left-0 h-screen w-screen',\n          'bg-overlay/dim-1',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          'data-starting-style:animate-fade-in',\n          'data-ending-style:animate-fade-out',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      {...props}\n    />\n  )\n}\n\nDrawerOverlay.displayName = 'Drawer.Overlay'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type DrawerPortalProps = ComponentProps<typeof BaseDialog.Portal>\n\nexport const DrawerPortal = ({ className, ...props }: DrawerPortalProps) => {\n  return (\n    <BaseDialog.Portal\n      data-spark-component=\"drawer-portal\"\n      className={cx(className, 'z-modal absolute')}\n      {...props}\n    />\n  )\n}\n\nDrawerPortal.displayName = 'Drawer.Portal'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface DrawerTitleProps extends Omit<ComponentProps<typeof BaseDialog.Title>, 'render'> {\n  ref?: Ref<HTMLHeadingElement>\n}\n\nexport const DrawerTitle = ({ className, ...props }: DrawerTitleProps) => {\n  return (\n    <BaseDialog.Title\n      data-spark-component=\"drawer-title\"\n      className={cx('text-headline-2 text-on-surface', className)}\n      {...props}\n    />\n  )\n}\n\nDrawerTitle.displayName = 'Drawer.Title'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface DrawerTriggerProps extends Omit<\n  ComponentProps<typeof BaseDialog.Trigger>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const DrawerTrigger = ({ asChild = false, ...props }: DrawerTriggerProps) => {\n  const renderSlot = useRenderSlot(asChild, 'button')\n\n  return <BaseDialog.Trigger data-spark-component=\"drawer-trigger\" render={renderSlot} {...props} />\n}\n\nDrawerTrigger.displayName = 'Drawer.Trigger'\n","import { Drawer as Root } from './Drawer'\nimport { DrawerBody } from './DrawerBody'\nimport { DrawerClose } from './DrawerClose'\nimport { DrawerCloseButton } from './DrawerCloseButton'\nimport { DrawerContent } from './DrawerContent'\nimport { DrawerDescription } from './DrawerDescription' // aria-describedby\nimport { DrawerFooter } from './DrawerFooter'\nimport { DrawerHeader } from './DrawerHeader'\nimport { DrawerOverlay } from './DrawerOverlay'\nimport { DrawerPortal } from './DrawerPortal'\nimport { DrawerTitle } from './DrawerTitle'\nimport { DrawerTrigger } from './DrawerTrigger'\n\nexport const Drawer: typeof Root & {\n  Trigger: typeof DrawerTrigger\n  Portal: typeof DrawerPortal\n  Overlay: typeof DrawerOverlay\n  Content: typeof DrawerContent\n  Header: typeof DrawerHeader\n  Body: typeof DrawerBody\n  Footer: typeof DrawerFooter\n  Close: typeof DrawerClose\n  CloseButton: typeof DrawerCloseButton\n  Title: typeof DrawerTitle\n  Description: typeof DrawerDescription\n} = Object.assign(Root, {\n  Trigger: DrawerTrigger,\n  Portal: DrawerPortal,\n  Overlay: DrawerOverlay,\n  Content: DrawerContent,\n  Header: DrawerHeader,\n  Body: DrawerBody,\n  Footer: DrawerFooter,\n  Close: DrawerClose,\n  CloseButton: DrawerCloseButton,\n  Title: DrawerTitle,\n  Description: DrawerDescription,\n})\n\nDrawer.displayName = 'Drawer'\nDrawerTrigger.displayName = 'Drawer.Trigger'\nDrawerPortal.displayName = 'Drawer.Portal'\nDrawerOverlay.displayName = 'Drawer.Overlay'\nDrawerContent.displayName = 'Drawer.Content'\nDrawerHeader.displayName = 'Drawer.Header'\nDrawerBody.displayName = 'Drawer.Body'\nDrawerFooter.displayName = 'Drawer.Footer'\nDrawerClose.displayName = 'Drawer.Close'\nDrawerCloseButton.displayName = 'Drawer.CloseButton'\nDrawerTitle.displayName = 'Drawer.Title'\nDrawerDescription.displayName = 'Drawer.Description'\n\nexport { type DrawerProps } from './Drawer'\nexport { type DrawerContentProps } from './DrawerContent'\nexport { type DrawerHeaderProps } from './DrawerHeader'\nexport { type DrawerBodyProps } from './DrawerBody'\nexport { type DrawerFooterProps } from './DrawerFooter'\nexport { type DrawerTriggerProps } from './DrawerTrigger'\nexport { type DrawerOverlayProps } from './DrawerOverlay'\nexport { type DrawerPortalProps } from './DrawerPortal'\nexport { type DrawerTitleProps } from './DrawerTitle'\nexport { type DrawerDescriptionProps } from './DrawerDescription'\nexport { type DrawerCloseProps } from './DrawerClose'\nexport { type DrawerCloseButtonProps } from './DrawerCloseButton'\n"],"mappings":"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"}