@bolerish/ui 0.0.0-stage → 0.11.0

package/dist/drawer.js

@@ -0,0 +1,773 @@
+"use client";
+
+// src/drawer.tsx
+import { c as _c } from "react/compiler-runtime";
+import { Drawer as DrawerPrimitive } from "@base-ui/react/drawer";
+import * as stylex from "@stylexjs/stylex";
+import { createContext, useContext } from "react";
+
+// src/styles/merge-styles.ts
+function mergeStyles(base, className, style) {
+  if (className === void 0 && style === void 0) return base;
+  return {
+    ...base,
+    className: [base.className, className].filter(Boolean).join(" ") || void 0,
+    style: base.style || style ? {
+      ...base.style,
+      ...style
+    } : void 0
+  };
+}
+
+// src/drawer.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var styles = {
+  overlay: {
+    kWkggS: "xt65qkv",
+    kpwlN0: "x10a8y8t",
+    kVAEAm: "xixxii4",
+    kIyJzY: "x1cvj37l",
+    k1ekBW: "x19991ni",
+    kAMwcw: "x1oxff63",
+    kY2c9j: "x1ya9j91",
+    kJcGZN: "x1llxi74",
+    kMqVnt: "x1gqblgl",
+    kQuUWH: "x1w3282i",
+    kRVfsM: "xqoz2hw",
+    kxero2: "xt8ron0",
+    kJ7s2Z: "x1mnfbwj",
+    $$css: true
+  },
+  overlayTransparent: {
+    kWkggS: "xjbqb8w",
+    $$css: true
+  },
+  popup: {
+    kWkggS: "xssngo0",
+    kVAM5u: "x1kqtvf4",
+    ksu8eU: "x1y0btm7",
+    kMzoRj: "x1al7nqq",
+    kGVxlE: "x1wlfqej",
+    kMwMTN: "x1t28c4i",
+    k1xSpc: "x78zum5",
+    kXwgrk: "xdt5ytf",
+    kAzted: "x2lwn1j",
+    kI3sdo: "x1a2a7pz",
+    kVQacm: "xb3r6kr",
+    kVAEAm: "xixxii4",
+    kIyJzY: "x1cvj37l",
+    k1ekBW: "x6o7n8i",
+    kAMwcw: "x1oxff63",
+    k6sLGO: "x1so62im",
+    kQuUWH: "x1w3282i",
+    kRVfsM: "xqoz2hw",
+    kxero2: "xt8ron0",
+    kJ7s2Z: "x1mnfbwj",
+    $$css: true
+  },
+  verticalPopup: {
+    kbCHJM: "xu96u03",
+    kUOVxO: "xvueqy4",
+    kskxy: "x18bvk7g",
+    kCIrl2: "x3m8u43",
+    kzqmXN: "xh8yej3",
+    $$css: true
+  },
+  horizontalPopup: {
+    krVfgx: "x1ey2m1c",
+    ks0D6T: "xx2ukoz",
+    k87sOh: "x13vifvy",
+    kzqmXN: "xdlckem",
+    $$css: true
+  },
+  content: {
+    k1xSpc: "x78zum5",
+    kUk6DE: "x98rzlu",
+    kXwgrk: "xdt5ytf",
+    kAzted: "x2lwn1j",
+    $$css: true
+  },
+  swipeHandle: {
+    kSGwAc: "xamitd3",
+    kWkggS: "xh31czb",
+    kaIpWk: "xwhwt5f",
+    kmuXW: "x2lah0s",
+    kZKoxP: "x1cusoj7",
+    kqGvvJ: "xaa60fa",
+    kzqmXN: "x12qe176",
+    $$css: true
+  },
+  horizontalSwipeHandle: {
+    kZKoxP: "x13ro12l",
+    kqGvvJ: "x10im51j",
+    kVAEAm: "x10l6tqk",
+    k87sOh: "xwa60dl",
+    k3aq6I: "x1cb1t30",
+    kzqmXN: "xzx1x6j",
+    $$css: true
+  },
+  header: {
+    k1xSpc: "x78zum5",
+    kXwgrk: "xdt5ytf",
+    kOIVth: "x136xbx3",
+    k8WAf4: "x1l39a5x",
+    kGO01o: "xuhgr7q",
+    kg3NbH: "xetp7e",
+    $$css: true
+  },
+  footer: {
+    kGNEyG: "x6s0dn4",
+    k1xSpc: "x78zum5",
+    kwnvtZ: "x1a02dak",
+    kOIVth: "x136xbx3",
+    kjj79g: "x1nhvcw1",
+    k8WAf4: "x1l39a5x",
+    kLKAdn: "x3ujxdc",
+    kg3NbH: "xetp7e",
+    $$css: true
+  },
+  sideFooter: {
+    kbsgHX: "xrezwjf",
+    $$css: true
+  },
+  title: {
+    kMwMTN: "x1t28c4i",
+    kGuDYH: "xr5nsds",
+    k63SB2: "x5cgamv",
+    kLWn49: "x15rnifv",
+    kogj98: "x1ghz6dp",
+    $$css: true
+  },
+  description: {
+    kMwMTN: "xj9e3ow",
+    kGuDYH: "x1lskvfa",
+    kLWn49: "xipl0i2",
+    kogj98: "x1ghz6dp",
+    $$css: true
+  }
+};
+var popupDirectionStyles = {
+  down: {
+    kaIpWk: "xnl101a",
+    krVfgx: "x1ey2m1c",
+    kAzted: "xafkwjd",
+    k3aq6I: "x1y5dkz8",
+    kdD3Bq: "x1i2unn7",
+    koVVf4: "x1ait54v",
+    kZj1XV: "xt71plt",
+    $$css: true
+  },
+  up: {
+    kaIpWk: "x84ibkz",
+    kAzted: "xafkwjd",
+    k87sOh: "x13vifvy",
+    k3aq6I: "x1y5dkz8",
+    kdD3Bq: "x1i2unn7",
+    koVVf4: "xoejiej",
+    kZj1XV: "x1hgagxy",
+    $$css: true
+  },
+  left: {
+    kaIpWk: "xpe1lwl",
+    kbCHJM: "xu96u03",
+    k3aq6I: "x1xq5odm",
+    kdD3Bq: "x1i2unn7",
+    koVVf4: "xuw5tg6",
+    kZj1XV: "x3y2ooc",
+    $$css: true
+  },
+  right: {
+    kaIpWk: "x16hr4jk",
+    kCIrl2: "x3m8u43",
+    k3aq6I: "x1xq5odm",
+    kdD3Bq: "x1i2unn7",
+    koVVf4: "x1ouavn2",
+    kZj1XV: "x1qhio4g",
+    $$css: true
+  }
+};
+var handleDirectionStyles = {
+  down: {
+    $$css: true
+  },
+  up: {
+    krVfgx: "x15z6xjk",
+    kbCHJM: "xu96u03",
+    kqGvvJ: "x10im51j",
+    kUOVxO: "xvueqy4",
+    kVAEAm: "x10l6tqk",
+    kCIrl2: "x3m8u43",
+    $$css: true
+  },
+  left: {
+    kCIrl2: "xfb8ih7",
+    $$css: true
+  },
+  right: {
+    kbCHJM: "xcjxhq0",
+    $$css: true
+  }
+};
+var DrawerContext = createContext({
+  overlay: "visible",
+  showSwipeHandle: false,
+  swipeDirection: "down"
+});
+function Drawer(t0) {
+  const $ = _c(15);
+  let props2;
+  let t1;
+  let t2;
+  let t3;
+  if ($[0] !== t0) {
+    ({
+      overlay: t1,
+      showSwipeHandle: t2,
+      swipeDirection: t3,
+      ...props2
+    } = t0);
+    $[0] = t0;
+    $[1] = props2;
+    $[2] = t1;
+    $[3] = t2;
+    $[4] = t3;
+  } else {
+    props2 = $[1];
+    t1 = $[2];
+    t2 = $[3];
+    t3 = $[4];
+  }
+  const overlay = t1 === void 0 ? "visible" : t1;
+  const showSwipeHandle = t2 === void 0 ? false : t2;
+  const swipeDirection = t3 === void 0 ? "down" : t3;
+  let t4;
+  if ($[5] !== overlay || $[6] !== showSwipeHandle || $[7] !== swipeDirection) {
+    t4 = {
+      overlay,
+      showSwipeHandle,
+      swipeDirection
+    };
+    $[5] = overlay;
+    $[6] = showSwipeHandle;
+    $[7] = swipeDirection;
+    $[8] = t4;
+  } else {
+    t4 = $[8];
+  }
+  let t5;
+  if ($[9] !== props2 || $[10] !== swipeDirection) {
+    t5 = /* @__PURE__ */ jsx(DrawerPrimitive.Root, { ...props2, swipeDirection });
+    $[9] = props2;
+    $[10] = swipeDirection;
+    $[11] = t5;
+  } else {
+    t5 = $[11];
+  }
+  let t6;
+  if ($[12] !== t4 || $[13] !== t5) {
+    t6 = /* @__PURE__ */ jsx(DrawerContext.Provider, { value: t4, children: t5 });
+    $[12] = t4;
+    $[13] = t5;
+    $[14] = t6;
+  } else {
+    t6 = $[14];
+  }
+  return t6;
+}
+function DrawerTrigger(t0) {
+  const $ = _c(12);
+  let className;
+  let props2;
+  let style;
+  let xstyle;
+  if ($[0] !== t0) {
+    ({
+      className,
+      style,
+      xstyle,
+      ...props2
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props2;
+    $[3] = style;
+    $[4] = xstyle;
+  } else {
+    className = $[1];
+    props2 = $[2];
+    style = $[3];
+    xstyle = $[4];
+  }
+  let t1;
+  if ($[5] !== className || $[6] !== style || $[7] !== xstyle) {
+    t1 = mergeStyles(stylex.props(xstyle), className, style);
+    $[5] = className;
+    $[6] = style;
+    $[7] = xstyle;
+    $[8] = t1;
+  } else {
+    t1 = $[8];
+  }
+  let t2;
+  if ($[9] !== props2 || $[10] !== t1) {
+    t2 = /* @__PURE__ */ jsx(DrawerPrimitive.Trigger, { ...props2, ...t1 });
+    $[9] = props2;
+    $[10] = t1;
+    $[11] = t2;
+  } else {
+    t2 = $[11];
+  }
+  return t2;
+}
+function DrawerClose(t0) {
+  const $ = _c(12);
+  let className;
+  let props2;
+  let style;
+  let xstyle;
+  if ($[0] !== t0) {
+    ({
+      className,
+      style,
+      xstyle,
+      ...props2
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props2;
+    $[3] = style;
+    $[4] = xstyle;
+  } else {
+    className = $[1];
+    props2 = $[2];
+    style = $[3];
+    xstyle = $[4];
+  }
+  let t1;
+  if ($[5] !== className || $[6] !== style || $[7] !== xstyle) {
+    t1 = mergeStyles(stylex.props(xstyle), className, style);
+    $[5] = className;
+    $[6] = style;
+    $[7] = xstyle;
+    $[8] = t1;
+  } else {
+    t1 = $[8];
+  }
+  let t2;
+  if ($[9] !== props2 || $[10] !== t1) {
+    t2 = /* @__PURE__ */ jsx(DrawerPrimitive.Close, { ...props2, ...t1 });
+    $[9] = props2;
+    $[10] = t1;
+    $[11] = t2;
+  } else {
+    t2 = $[11];
+  }
+  return t2;
+}
+function DrawerOverlay(t0) {
+  const $ = _c(12);
+  let className;
+  let props2;
+  let style;
+  let xstyle;
+  if ($[0] !== t0) {
+    ({
+      className,
+      style,
+      xstyle,
+      ...props2
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props2;
+    $[3] = style;
+    $[4] = xstyle;
+  } else {
+    className = $[1];
+    props2 = $[2];
+    style = $[3];
+    xstyle = $[4];
+  }
+  let t1;
+  if ($[5] !== className || $[6] !== style || $[7] !== xstyle) {
+    t1 = mergeStyles(stylex.props(styles.overlay, xstyle), className, style);
+    $[5] = className;
+    $[6] = style;
+    $[7] = xstyle;
+    $[8] = t1;
+  } else {
+    t1 = $[8];
+  }
+  let t2;
+  if ($[9] !== props2 || $[10] !== t1) {
+    t2 = /* @__PURE__ */ jsx(DrawerPrimitive.Backdrop, { ...props2, "data-slot": "drawer-overlay", ...t1 });
+    $[9] = props2;
+    $[10] = t1;
+    $[11] = t2;
+  } else {
+    t2 = $[11];
+  }
+  return t2;
+}
+function DrawerSwipeHandle(t0) {
+  const $ = _c(14);
+  let className;
+  let props2;
+  let style;
+  let xstyle;
+  if ($[0] !== t0) {
+    ({
+      className,
+      style,
+      xstyle,
+      ...props2
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props2;
+    $[3] = style;
+    $[4] = xstyle;
+  } else {
+    className = $[1];
+    props2 = $[2];
+    style = $[3];
+    xstyle = $[4];
+  }
+  const {
+    swipeDirection
+  } = useContext(DrawerContext);
+  const isHorizontal = swipeDirection === "left" || swipeDirection === "right";
+  let t1;
+  if ($[5] !== className || $[6] !== isHorizontal || $[7] !== style || $[8] !== swipeDirection || $[9] !== xstyle) {
+    t1 = mergeStyles(stylex.props(styles.swipeHandle, isHorizontal && styles.horizontalSwipeHandle, handleDirectionStyles[swipeDirection], xstyle), className, style);
+    $[5] = className;
+    $[6] = isHorizontal;
+    $[7] = style;
+    $[8] = swipeDirection;
+    $[9] = xstyle;
+    $[10] = t1;
+  } else {
+    t1 = $[10];
+  }
+  let t2;
+  if ($[11] !== props2 || $[12] !== t1) {
+    t2 = /* @__PURE__ */ jsx("div", { "aria-hidden": "true", "data-slot": "drawer-swipe-handle", ...props2, ...t1 });
+    $[11] = props2;
+    $[12] = t1;
+    $[13] = t2;
+  } else {
+    t2 = $[13];
+  }
+  return t2;
+}
+function DrawerContent(t0) {
+  const $ = _c(29);
+  let children;
+  let className;
+  let props2;
+  let style;
+  let xstyle;
+  if ($[0] !== t0) {
+    ({
+      className,
+      style,
+      children,
+      xstyle,
+      ...props2
+    } = t0);
+    $[0] = t0;
+    $[1] = children;
+    $[2] = className;
+    $[3] = props2;
+    $[4] = style;
+    $[5] = xstyle;
+  } else {
+    children = $[1];
+    className = $[2];
+    props2 = $[3];
+    style = $[4];
+    xstyle = $[5];
+  }
+  const {
+    overlay,
+    showSwipeHandle,
+    swipeDirection
+  } = useContext(DrawerContext);
+  const isHorizontal = swipeDirection === "left" || swipeDirection === "right";
+  let t1;
+  if ($[6] !== overlay) {
+    t1 = overlay === "none" ? null : /* @__PURE__ */ jsx(DrawerOverlay, { xstyle: overlay === "transparent" ? styles.overlayTransparent : void 0 });
+    $[6] = overlay;
+    $[7] = t1;
+  } else {
+    t1 = $[7];
+  }
+  let t2;
+  if ($[8] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t2 = {
+      className: "x10a8y8t xixxii4 xqehhcd"
+    };
+    $[8] = t2;
+  } else {
+    t2 = $[8];
+  }
+  let t3;
+  if ($[9] !== isHorizontal || $[10] !== swipeDirection) {
+    t3 = stylex.props(styles.popup, isHorizontal ? styles.horizontalPopup : styles.verticalPopup, popupDirectionStyles[swipeDirection]);
+    $[9] = isHorizontal;
+    $[10] = swipeDirection;
+    $[11] = t3;
+  } else {
+    t3 = $[11];
+  }
+  let t4;
+  if ($[12] !== showSwipeHandle) {
+    t4 = showSwipeHandle ? /* @__PURE__ */ jsx(DrawerSwipeHandle, {}) : null;
+    $[12] = showSwipeHandle;
+    $[13] = t4;
+  } else {
+    t4 = $[13];
+  }
+  let t5;
+  if ($[14] !== className || $[15] !== style || $[16] !== xstyle) {
+    t5 = mergeStyles(stylex.props(styles.content, xstyle), className, style);
+    $[14] = className;
+    $[15] = style;
+    $[16] = xstyle;
+    $[17] = t5;
+  } else {
+    t5 = $[17];
+  }
+  let t6;
+  if ($[18] !== children || $[19] !== t5) {
+    t6 = /* @__PURE__ */ jsx(DrawerPrimitive.Content, { ...t5, children });
+    $[18] = children;
+    $[19] = t5;
+    $[20] = t6;
+  } else {
+    t6 = $[20];
+  }
+  let t7;
+  if ($[21] !== props2 || $[22] !== t3 || $[23] !== t4 || $[24] !== t6) {
+    t7 = /* @__PURE__ */ jsx(DrawerPrimitive.Viewport, { ...t2, children: /* @__PURE__ */ jsxs(DrawerPrimitive.Popup, { ...props2, "data-slot": "drawer-popup", ...t3, children: [
+      t4,
+      t6
+    ] }) });
+    $[21] = props2;
+    $[22] = t3;
+    $[23] = t4;
+    $[24] = t6;
+    $[25] = t7;
+  } else {
+    t7 = $[25];
+  }
+  let t8;
+  if ($[26] !== t1 || $[27] !== t7) {
+    t8 = /* @__PURE__ */ jsxs(DrawerPrimitive.Portal, { children: [
+      t1,
+      t7
+    ] });
+    $[26] = t1;
+    $[27] = t7;
+    $[28] = t8;
+  } else {
+    t8 = $[28];
+  }
+  return t8;
+}
+function DrawerHeader(t0) {
+  const $ = _c(12);
+  let className;
+  let props2;
+  let style;
+  let xstyle;
+  if ($[0] !== t0) {
+    ({
+      className,
+      style,
+      xstyle,
+      ...props2
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props2;
+    $[3] = style;
+    $[4] = xstyle;
+  } else {
+    className = $[1];
+    props2 = $[2];
+    style = $[3];
+    xstyle = $[4];
+  }
+  let t1;
+  if ($[5] !== className || $[6] !== style || $[7] !== xstyle) {
+    t1 = mergeStyles(stylex.props(styles.header, xstyle), className, style);
+    $[5] = className;
+    $[6] = style;
+    $[7] = xstyle;
+    $[8] = t1;
+  } else {
+    t1 = $[8];
+  }
+  let t2;
+  if ($[9] !== props2 || $[10] !== t1) {
+    t2 = /* @__PURE__ */ jsx("div", { ...props2, ...t1 });
+    $[9] = props2;
+    $[10] = t1;
+    $[11] = t2;
+  } else {
+    t2 = $[11];
+  }
+  return t2;
+}
+function DrawerFooter(t0) {
+  const $ = _c(13);
+  let className;
+  let props2;
+  let style;
+  let xstyle;
+  if ($[0] !== t0) {
+    ({
+      className,
+      style,
+      xstyle,
+      ...props2
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props2;
+    $[3] = style;
+    $[4] = xstyle;
+  } else {
+    className = $[1];
+    props2 = $[2];
+    style = $[3];
+    xstyle = $[4];
+  }
+  const {
+    swipeDirection
+  } = useContext(DrawerContext);
+  const isSideDrawer = swipeDirection === "left" || swipeDirection === "right";
+  let t1;
+  if ($[5] !== className || $[6] !== isSideDrawer || $[7] !== style || $[8] !== xstyle) {
+    t1 = mergeStyles(stylex.props(styles.footer, isSideDrawer && styles.sideFooter, xstyle), className, style);
+    $[5] = className;
+    $[6] = isSideDrawer;
+    $[7] = style;
+    $[8] = xstyle;
+    $[9] = t1;
+  } else {
+    t1 = $[9];
+  }
+  let t2;
+  if ($[10] !== props2 || $[11] !== t1) {
+    t2 = /* @__PURE__ */ jsx("div", { ...props2, ...t1 });
+    $[10] = props2;
+    $[11] = t1;
+    $[12] = t2;
+  } else {
+    t2 = $[12];
+  }
+  return t2;
+}
+function DrawerTitle(t0) {
+  const $ = _c(12);
+  let className;
+  let props2;
+  let style;
+  let xstyle;
+  if ($[0] !== t0) {
+    ({
+      className,
+      style,
+      xstyle,
+      ...props2
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props2;
+    $[3] = style;
+    $[4] = xstyle;
+  } else {
+    className = $[1];
+    props2 = $[2];
+    style = $[3];
+    xstyle = $[4];
+  }
+  let t1;
+  if ($[5] !== className || $[6] !== style || $[7] !== xstyle) {
+    t1 = mergeStyles(stylex.props(styles.title, xstyle), className, style);
+    $[5] = className;
+    $[6] = style;
+    $[7] = xstyle;
+    $[8] = t1;
+  } else {
+    t1 = $[8];
+  }
+  let t2;
+  if ($[9] !== props2 || $[10] !== t1) {
+    t2 = /* @__PURE__ */ jsx(DrawerPrimitive.Title, { ...props2, ...t1 });
+    $[9] = props2;
+    $[10] = t1;
+    $[11] = t2;
+  } else {
+    t2 = $[11];
+  }
+  return t2;
+}
+function DrawerDescription(t0) {
+  const $ = _c(12);
+  let className;
+  let props2;
+  let style;
+  let xstyle;
+  if ($[0] !== t0) {
+    ({
+      className,
+      style,
+      xstyle,
+      ...props2
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props2;
+    $[3] = style;
+    $[4] = xstyle;
+  } else {
+    className = $[1];
+    props2 = $[2];
+    style = $[3];
+    xstyle = $[4];
+  }
+  let t1;
+  if ($[5] !== className || $[6] !== style || $[7] !== xstyle) {
+    t1 = mergeStyles(stylex.props(styles.description, xstyle), className, style);
+    $[5] = className;
+    $[6] = style;
+    $[7] = xstyle;
+    $[8] = t1;
+  } else {
+    t1 = $[8];
+  }
+  let t2;
+  if ($[9] !== props2 || $[10] !== t1) {
+    t2 = /* @__PURE__ */ jsx(DrawerPrimitive.Description, { ...props2, ...t1 });
+    $[9] = props2;
+    $[10] = t1;
+    $[11] = t2;
+  } else {
+    t2 = $[11];
+  }
+  return t2;
+}
+export {
+  Drawer,
+  DrawerClose,
+  DrawerContent,
+  DrawerDescription,
+  DrawerFooter,
+  DrawerHeader,
+  DrawerTitle,
+  DrawerTrigger
+};
+//# sourceMappingURL=drawer.js.map