se-design 1.0.90-dev.0 → 1.0.90

package/dist/index6.js

@@ -1,129 +1,129 @@
-import L from "./index83.js";
-import R from "./index84.js";
-import F from "./index85.js";
-import B from "./index86.js";
-import D from "./index87.js";
-import M from "./index88.js";
-import q from "./index89.js";
-import G from "./index90.js";
-import V from "./index91.js";
-import H from "./index92.js";
-import J from "./index93.js";
-import K from "./index94.js";
-import Q from "./index95.js";
-import U from "./index96.js";
-import W from "./index97.js";
-import X from "./index98.js";
-import Y from "./index99.js";
-import Z from "./index100.js";
-import z from "./index101.js";
-import ss from "./index102.js";
-import os from "./index103.js";
-import _s from "./index104.js";
-import ts from "./index105.js";
-import is from "./index106.js";
-import rs from "./index107.js";
-import es from "./index108.js";
-import cs from "./index109.js";
-import as from "./index110.js";
-import ms from "./index111.js";
-import gs from "./index112.js";
-import vs from "./index113.js";
-import ns from "./index114.js";
-import ls from "./index115.js";
-import fs from "./index116.js";
-import bs from "./index117.js";
-import ps from "./index118.js";
-import ds from "./index119.js";
-import us from "./index120.js";
-import hs from "./index121.js";
-import ks from "./index122.js";
-import xs from "./index123.js";
-import As from "./index124.js";
-import Is from "./index125.js";
-import ws from "./index126.js";
-import ys from "./index127.js";
-import Ps from "./index128.js";
-import Ns from "./index129.js";
-import Cs from "./index130.js";
-import Os from "./index131.js";
-import $s from "./index132.js";
-import Es from "./index133.js";
-import Ss from "./index134.js";
-import Ts from "./index135.js";
-import js from "./index136.js";
-import Ls from "./index137.js";
-import Rs from "./index138.js";
-import Fs from "./index139.js";
-import Bs from "./index140.js";
-import Ds from "./index141.js";
-import Ms from "./index142.js";
-import qs from "./index143.js";
-import Gs from "./index144.js";
-import Vs from "./index145.js";
-import Hs from "./index146.js";
-import Js from "./index147.js";
-import Ks from "./index148.js";
-import Qs from "./index149.js";
-import Us from "./index150.js";
-import Ws from "./index151.js";
-import Xs from "./index152.js";
-import Ys from "./index153.js";
-import Zs from "./index154.js";
-import zs from "./index155.js";
-import so from "./index156.js";
-import oo from "./index157.js";
-import _o from "./index158.js";
-import to from "./index159.js";
-import io from "./index160.js";
-import ro from "./index161.js";
-import eo from "./index162.js";
-import co from "./index163.js";
-import ao from "./index164.js";
-import mo from "./index165.js";
-import go from "./index166.js";
-import vo from "./index167.js";
-import no from "./index168.js";
-import lo from "./index169.js";
-import fo from "./index170.js";
-import bo from "./index171.js";
-import po from "./index172.js";
-import uo from "./index173.js";
-import ho from "./index174.js";
-import ko from "./index175.js";
-import xo from "./index176.js";
-import Ao from "./index177.js";
-import Io from "./index178.js";
-import wo from "./index179.js";
-import yo from "./index180.js";
-import Po from "./index181.js";
-import No from "./index182.js";
-import Co from "./index183.js";
-import Oo from "./index184.js";
-import $o from "./index185.js";
-import Eo from "./index186.js";
-import So from "./index187.js";
-import To from "./index188.js";
-import jo from "./index189.js";
-import Lo from "./index190.js";
-import Ro from "./index191.js";
-import Fo from "./index192.js";
-import Bo from "./index193.js";
-import Do from "./index194.js";
-import Mo from "./index195.js";
-import qo from "./index196.js";
-import Go from "./index197.js";
-import Vo from "./index198.js";
-import Ho from "./index199.js";
-import Jo from "./index200.js";
-import Ko from "./index201.js";
-import Qo from "./index202.js";
-import Uo from "./index203.js";
+import L from "./index84.js";
+import R from "./index85.js";
+import F from "./index86.js";
+import B from "./index87.js";
+import D from "./index88.js";
+import M from "./index89.js";
+import q from "./index90.js";
+import G from "./index91.js";
+import V from "./index92.js";
+import H from "./index93.js";
+import J from "./index94.js";
+import K from "./index95.js";
+import Q from "./index96.js";
+import U from "./index97.js";
+import W from "./index98.js";
+import X from "./index99.js";
+import Y from "./index100.js";
+import Z from "./index101.js";
+import z from "./index102.js";
+import ss from "./index103.js";
+import os from "./index104.js";
+import _s from "./index105.js";
+import ts from "./index106.js";
+import is from "./index107.js";
+import rs from "./index108.js";
+import es from "./index109.js";
+import cs from "./index110.js";
+import as from "./index111.js";
+import ms from "./index112.js";
+import gs from "./index113.js";
+import vs from "./index114.js";
+import ns from "./index115.js";
+import ls from "./index116.js";
+import fs from "./index117.js";
+import bs from "./index118.js";
+import ps from "./index119.js";
+import ds from "./index120.js";
+import us from "./index121.js";
+import hs from "./index122.js";
+import ks from "./index123.js";
+import xs from "./index124.js";
+import As from "./index125.js";
+import Is from "./index126.js";
+import ws from "./index127.js";
+import ys from "./index128.js";
+import Ps from "./index129.js";
+import Ns from "./index130.js";
+import Cs from "./index131.js";
+import Os from "./index132.js";
+import $s from "./index133.js";
+import Es from "./index134.js";
+import Ss from "./index135.js";
+import Ts from "./index136.js";
+import js from "./index137.js";
+import Ls from "./index138.js";
+import Rs from "./index139.js";
+import Fs from "./index140.js";
+import Bs from "./index141.js";
+import Ds from "./index142.js";
+import Ms from "./index143.js";
+import qs from "./index144.js";
+import Gs from "./index145.js";
+import Vs from "./index146.js";
+import Hs from "./index147.js";
+import Js from "./index148.js";
+import Ks from "./index149.js";
+import Qs from "./index150.js";
+import Us from "./index151.js";
+import Ws from "./index152.js";
+import Xs from "./index153.js";
+import Ys from "./index154.js";
+import Zs from "./index155.js";
+import zs from "./index156.js";
+import so from "./index157.js";
+import oo from "./index158.js";
+import _o from "./index159.js";
+import to from "./index160.js";
+import io from "./index161.js";
+import ro from "./index162.js";
+import eo from "./index163.js";
+import co from "./index164.js";
+import ao from "./index165.js";
+import mo from "./index166.js";
+import go from "./index167.js";
+import vo from "./index168.js";
+import no from "./index169.js";
+import lo from "./index170.js";
+import fo from "./index171.js";
+import bo from "./index172.js";
+import po from "./index173.js";
+import uo from "./index174.js";
+import ho from "./index175.js";
+import ko from "./index176.js";
+import xo from "./index177.js";
+import Ao from "./index178.js";
+import Io from "./index179.js";
+import wo from "./index180.js";
+import yo from "./index181.js";
+import Po from "./index182.js";
+import No from "./index183.js";
+import Co from "./index184.js";
+import Oo from "./index185.js";
+import $o from "./index186.js";
+import Eo from "./index187.js";
+import So from "./index188.js";
+import To from "./index189.js";
+import jo from "./index190.js";
+import Lo from "./index191.js";
+import Ro from "./index192.js";
+import Fo from "./index193.js";
+import Bo from "./index194.js";
+import Do from "./index195.js";
+import Mo from "./index196.js";
+import qo from "./index197.js";
+import Go from "./index198.js";
+import Vo from "./index199.js";
+import Ho from "./index200.js";
+import Jo from "./index201.js";
+import Ko from "./index202.js";
+import Qo from "./index203.js";
+import Uo from "./index204.js";
 import a from "react";
-import { ReactSVG as Wo } from "./index204.js";
-import { getA11yNameAttributes as Xo } from "./index81.js";
-import { useAccessiblePress as Yo } from "./index67.js";
-import "./index72.js";
+import { ReactSVG as Wo } from "./index205.js";
+import { getA11yNameAttributes as Xo } from "./index82.js";
+import { useAccessiblePress as Yo } from "./index68.js";
+import "./index73.js";
 function m() {
   return m = Object.assign ? Object.assign.bind() : function(s) {
     for (var t = 1; t < arguments.length; t++) {

package/dist/index60.js

@@ -1,122 +1,89 @@
-import e, { useState as p, useRef as g, useEffect as I } from "react";
-import { Button as x } from "./index4.js";
-const n = 40, f = 7, y = 3, T = Array.from({
-  length: 12
-}, (r, o) => String(o + 1).padStart(2, "0")), w = Array.from({
-  length: 60
-}, (r, o) => String(o).padStart(2, "0")), M = ["AM", "PM"], h = ({
-  items: r,
-  selectedIndex: o,
-  onSelect: d,
-  automationId: u = ""
+import e, { useRef as S, useState as f } from "react";
+import { CustomModal as T } from "./index13.js";
+import { Icon as v } from "./index6.js";
+/* empty css         */
+const C = ({
+  children: c = null,
+  title: n = "",
+  onClose: s = () => {
+  },
+  showCloseIcon: l = !1,
+  showBackButton: a = !1,
+  onBack: m = () => {
+  },
+  className: i = "",
+  automationId: r = "",
+  minHeight: u = "auto"
 }) => {
-  const l = g(null), s = g(null);
-  I(() => {
-    l.current && l.current.scrollTo({
-      top: o * n,
-      behavior: "smooth"
-    });
-  }, [o]);
-  const a = () => {
-    l.current && (s.current && clearTimeout(s.current), s.current = setTimeout(() => {
-      const t = l.current;
-      if (!t) return;
-      const c = Math.round(t.scrollTop / n), m = Math.max(0, Math.min(r.length - 1, c));
-      t.scrollTo({
-        top: m * n,
-        behavior: "smooth"
-      }), m !== o && d(m);
-    }, 100));
-  }, i = (t) => {
-    d(t), l.current?.scrollTo({
-      top: t * n,
-      behavior: "smooth"
-    });
+  const t = S(null), [g, p] = f(0), [E, h] = f(0), [b, Y] = f(!1), k = (o) => {
+    p(o.touches[0].clientY), h(o.touches[0].clientY), Y(!0);
+  }, N = (o) => {
+    if (!b) return;
+    const d = o.touches[0].clientY, x = d - g;
+    x > 0 && (h(d), t.current && (t.current.style.transform = `translateY(${x}px)`));
+  }, y = () => {
+    if (!b) return;
+    E - g > 60 ? s() : t.current && (t.current.style.transform = "translateY(0)"), Y(!1), p(0), h(0);
   };
   return /* @__PURE__ */ e.createElement("div", {
-    className: "w-14"
-  }, /* @__PURE__ */ e.createElement("div", {
-    ref: l,
-    className: "overflow-y-auto [&::-webkit-scrollbar]:hidden",
-    onScroll: a,
+    ref: t,
+    className: `se-design-bottom-sheet relative h-max max-h-[98vh] rounded-t-2xl flex flex-col pt-5 ${i}`,
+    onClick: (o) => o.stopPropagation(),
+    onTouchStart: k,
+    onTouchMove: N,
+    onTouchEnd: y,
+    "data-automation-id": r,
     style: {
-      height: f * n,
-      paddingTop: y * n,
-      paddingBottom: y * n,
-      scrollSnapType: "y mandatory",
-      scrollbarWidth: "none"
+      minHeight: u
     }
-  }, r.map((t, c) => /* @__PURE__ */ e.createElement("div", {
-    key: t,
-    className: `flex items-center justify-center cursor-pointer select-none transition-colors h-10 ${c === o ? "text-[var(--color-blue-500)] font-semibold" : "text-[var(--color-gray-700)] hover:text-[var(--color-blue-500)]"}`,
-    onClick: () => i(c),
-    style: {
-      scrollSnapAlign: "center"
-    },
-    "data-automation-id": `${u}-item-${c}`
-  }, t))));
-}, $ = ({
-  initialHour: r = 12,
-  initialMinute: o = 0,
-  onApply: d,
-  ctaLabel: u = "Apply",
-  onClose: l,
-  className: s = "",
-  automationId: a = "timepicker"
-}) => {
-  const [i, t] = p(() => r === 0 ? 11 : r > 12 ? r - 12 - 1 : r - 1), [c, m] = p(Math.max(0, Math.min(59, o ?? 0))), [v, E] = p(
-    () => r >= 12 ? 1 : 0
-    // 0-11 = AM, 12-23 = PM
-  ), b = () => {
-    const S = v === 1 ? i + 12 : i;
-    d?.({
-      hour: S + 1,
-      minute: c
-    }), l?.();
-  };
-  return /* @__PURE__ */ e.createElement("div", {
-    className: `se-design-timepicker-container w-full min-w-[216px] bg-[var(--color-white)] rounded-xl shadow-md border border-[var(--color-gray-400)] overflow-hidden ${s}`
-  }, /* @__PURE__ */ e.createElement("div", {
-    className: "se-design-timepicker-content w-full relative p-4"
-  }, /* @__PURE__ */ e.createElement("div", {
-    className: "absolute left-4 right-4 top-1/2 -translate-y-1/2 h-10 bg-[var(--color-blue-50)] rounded-lg pointer-events-none z-0"
-  }), /* @__PURE__ */ e.createElement("div", {
-    className: "flex justify-between gap-2 relative z-10"
-  }, /* @__PURE__ */ e.createElement(h, {
-    items: T,
-    selectedIndex: i,
-    onSelect: t,
-    automationId: `${a}-hours`
+  }, (n || a) && /* @__PURE__ */ e.createElement("div", {
+    className: "se-design-bottom-sheet-header flex items-center justify-left gap-3 mr-6 px-4"
+  }, a && /* @__PURE__ */ e.createElement(v, {
+    name: "back",
+    stroke: "var(--color-gray-700)",
+    onClick: m,
+    className: "se-design-bottom-sheet-back-icon cursor-pointer",
+    automationId: `${r}-back-icon`
+  }), n && /* @__PURE__ */ e.createElement("div", {
+    className: "se-design-bottom-sheet-title text-lg font-semibold"
+  }, n)), l && /* @__PURE__ */ e.createElement(v, {
+    name: "close",
+    onClick: s,
+    className: "se-design-bottom-sheet-close-icon absolute top-6 right-4 cursor-pointer z-10",
+    automationId: `${r}-close-icon`
   }), /* @__PURE__ */ e.createElement("div", {
-    className: "w-px bg-[var(--color-gray-200)]",
-    style: {
-      height: f * n
-    }
-  }), /* @__PURE__ */ e.createElement(h, {
-    items: w,
-    selectedIndex: c,
-    onSelect: m,
-    automationId: `${a}-minutes`
-  }), /* @__PURE__ */ e.createElement("div", {
-    className: "w-px bg-[var(--color-gray-200)]",
-    style: {
-      height: f * n
-    }
-  }), /* @__PURE__ */ e.createElement(h, {
-    items: M,
-    selectedIndex: v,
-    onSelect: E,
-    automationId: `${a}-periods`
-  }))), /* @__PURE__ */ e.createElement("div", {
-    className: "se-design-timepicker-footer flex justify-end p-3 border-t border-[var(--color-gray-200)]"
-  }, /* @__PURE__ */ e.createElement(x, {
-    label: u,
-    type: "primary",
-    onClick: b,
-    automationId: `${a}-apply-button`
-  })));
-};
+    className: "se-design-bottom-sheet-content px-4 pb-5 flex-1 min-h-0 overflow-y-auto"
+  }, c));
+}, I = ({
+  isOpen: c = !1,
+  title: n = "",
+  onClose: s = () => {
+  },
+  children: l = null,
+  showCloseIcon: a = !0,
+  showBackButton: m = !1,
+  onBack: i = () => {
+  },
+  className: r = "",
+  automationId: u = "bottomsheet",
+  minHeight: t = ""
+}) => /* @__PURE__ */ e.createElement(T, {
+  isOpen: c,
+  onClose: s,
+  onModalClick: s,
+  className: "custom-bottom-sheet",
+  renderModalContent: () => /* @__PURE__ */ e.createElement(C, {
+    title: n,
+    onClose: s,
+    showCloseIcon: a,
+    showBackButton: m,
+    onBack: i,
+    className: r,
+    automationId: u,
+    minHeight: t
+  }, l)
+});
 export {
-  $ as TimePicker
+  I as BottomSheet
 };
 //# sourceMappingURL=index60.js.map

package/dist/index60.js.map

@@ -1 +1 @@
-{"version":3,"file":"index60.js","sources":["../src/components/TimePicker/index.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\nimport { Button } from '../Button';\n\nexport interface TimePickerProps {\n  initialHour?: number;\n  initialMinute?: number;\n  onApply?: (time: { hour: number; minute: number }) => void;\n  ctaLabel?: string;\n  onClose?: () => void;\n  className?: string;\n  automationId?: string;\n}\n\nconst ITEM_HEIGHT = 40;\nconst VISIBLE_ITEMS = 7;\nconst BUFFER_ITEMS = 3;\n\nconst HOURS = Array.from({ length: 12 }, (_, i) => String(i + 1).padStart(2, '0'));\nconst MINUTES = Array.from({ length: 60 }, (_, i) => String(i).padStart(2, '0'));\nconst PERIODS: ('AM' | 'PM')[] = ['AM', 'PM'];\n\ninterface ScrollColumnProps {\n  items: readonly string[];\n  selectedIndex: number;\n  onSelect: (index: number) => void;\n  automationId?: string;\n}\n\nconst ScrollColumn: React.FC<ScrollColumnProps> = ({ items, selectedIndex, onSelect, automationId = '' }) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const scrollTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(() => {\n    if (containerRef.current) {\n      containerRef.current.scrollTo({ top: selectedIndex * ITEM_HEIGHT, behavior: 'smooth' });\n    }\n  }, [selectedIndex]);\n\n  const handleScroll = () => {\n    if (!containerRef.current) return;\n\n    if (scrollTimeout.current) clearTimeout(scrollTimeout.current);\n\n    scrollTimeout.current = setTimeout(() => {\n      const container = containerRef.current;\n      if (!container) return;\n\n      const newIndex = Math.round(container.scrollTop / ITEM_HEIGHT);\n      const clampedIndex = Math.max(0, Math.min(items.length - 1, newIndex));\n\n      container.scrollTo({ top: clampedIndex * ITEM_HEIGHT, behavior: 'smooth' });\n\n      if (clampedIndex !== selectedIndex) onSelect(clampedIndex);\n    }, 100);\n  };\n\n  const handleItemClick = (index: number) => {\n    onSelect(index);\n    containerRef.current?.scrollTo({ top: index * ITEM_HEIGHT, behavior: 'smooth' });\n  };\n\n  return (\n    <div className=\"w-14\">\n      <div\n        ref={containerRef}\n        className=\"overflow-y-auto [&::-webkit-scrollbar]:hidden\"\n        onScroll={handleScroll}\n        style={{\n          height: VISIBLE_ITEMS * ITEM_HEIGHT,\n          paddingTop: BUFFER_ITEMS * ITEM_HEIGHT,\n          paddingBottom: BUFFER_ITEMS * ITEM_HEIGHT,\n          scrollSnapType: 'y mandatory',\n          scrollbarWidth: 'none'\n        }}\n      >\n        {items.map((item, index) => (\n          <div\n            key={item}\n            className={`flex items-center justify-center cursor-pointer select-none transition-colors h-10 ${\n              index === selectedIndex\n                ? 'text-[var(--color-blue-500)] font-semibold'\n                : 'text-[var(--color-gray-700)] hover:text-[var(--color-blue-500)]'\n            }`}\n            onClick={() => handleItemClick(index)}\n            style={{ scrollSnapAlign: 'center' }}\n            data-automation-id={`${automationId}-item-${index}`}\n          >\n            {item}\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n};\n\nexport const TimePicker: React.FC<TimePickerProps> = ({\n  initialHour = 12,\n  initialMinute = 0,\n  onApply,\n  ctaLabel = 'Apply',\n  onClose,\n  className = '',\n  automationId = 'timepicker'\n}) => {\n  const [selectedHourIndex, setSelectedHourIndex] = useState(() => {\n    if (initialHour === 0) return 11; // 0 = 12 AM\n    if (initialHour > 12) return initialHour - 12 - 1; // 13-23 → 1-11 (PM hours)\n    return initialHour - 1; // 1-12 → 0-11\n  });\n  const [selectedMinuteIndex, setSelectedMinuteIndex] = useState(Math.max(0, Math.min(59, initialMinute ?? 0)));\n  const [selectedPeriodIndex, setSelectedPeriodIndex] = useState(\n    () => (initialHour >= 12 ? 1 : 0) // 0-11 = AM, 12-23 = PM\n  );\n\n  const handleApply = () => {\n    const hourIn24Format = selectedPeriodIndex === 1 ? selectedHourIndex + 12 : selectedHourIndex;\n    onApply?.({\n      hour: hourIn24Format + 1,\n      minute: selectedMinuteIndex\n    });\n    onClose?.();\n  };\n\n  return (\n    <div\n      className={`se-design-timepicker-container w-full min-w-[216px] bg-[var(--color-white)] rounded-xl shadow-md border border-[var(--color-gray-400)] overflow-hidden ${className}`}\n    >\n      <div className=\"se-design-timepicker-content w-full relative p-4\">\n        <div className=\"absolute left-4 right-4 top-1/2 -translate-y-1/2 h-10 bg-[var(--color-blue-50)] rounded-lg pointer-events-none z-0\" />\n        <div className=\"flex justify-between gap-2 relative z-10\">\n          <ScrollColumn\n            items={HOURS}\n            selectedIndex={selectedHourIndex}\n            onSelect={setSelectedHourIndex}\n            automationId={`${automationId}-hours`}\n          />\n          <div className=\"w-px bg-[var(--color-gray-200)]\" style={{ height: VISIBLE_ITEMS * ITEM_HEIGHT }} />\n          <ScrollColumn\n            items={MINUTES}\n            selectedIndex={selectedMinuteIndex}\n            onSelect={setSelectedMinuteIndex}\n            automationId={`${automationId}-minutes`}\n          />\n          <div className=\"w-px bg-[var(--color-gray-200)]\" style={{ height: VISIBLE_ITEMS * ITEM_HEIGHT }} />\n          <ScrollColumn\n            items={PERIODS}\n            selectedIndex={selectedPeriodIndex}\n            onSelect={setSelectedPeriodIndex}\n            automationId={`${automationId}-periods`}\n          />\n        </div>\n      </div>\n      <div className=\"se-design-timepicker-footer flex justify-end p-3 border-t border-[var(--color-gray-200)]\">\n        <Button label={ctaLabel} type=\"primary\" onClick={handleApply} automationId={`${automationId}-apply-button`} />\n      </div>\n    </div>\n  );\n};\n"],"names":["ITEM_HEIGHT","VISIBLE_ITEMS","BUFFER_ITEMS","HOURS","Array","from","length","_","i","String","padStart","MINUTES","PERIODS","ScrollColumn","items","selectedIndex","onSelect","automationId","containerRef","useRef","scrollTimeout","useEffect","current","scrollTo","top","behavior","handleScroll","clearTimeout","setTimeout","container","newIndex","Math","round","scrollTop","clampedIndex","max","min","handleItemClick","index","React","createElement","className","ref","onScroll","style","height","paddingTop","paddingBottom","scrollSnapType","scrollbarWidth","map","item","key","onClick","scrollSnapAlign","TimePicker","initialHour","initialMinute","onApply","ctaLabel","onClose","selectedHourIndex","setSelectedHourIndex","useState","selectedMinuteIndex","setSelectedMinuteIndex","selectedPeriodIndex","setSelectedPeriodIndex","handleApply","hourIn24Format","hour","minute","Button","label","type"],"mappings":"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"}
+{"version":3,"file":"index60.js","sources":["../src/components/BottomSheet/index.tsx"],"sourcesContent":["import React, { FC, useState, useRef } from 'react';\nimport { CustomModal } from '../CustomModal';\nimport { Icon } from '../Icon';\n\nimport './style.scss';\n\nexport interface BottomSheetProps {\n  isOpen: boolean;\n  title?: string;\n  onClose: () => void;\n  showCloseIcon?: boolean;\n  showBackButton?: boolean;\n  onBack?: () => void;\n  children: React.ReactNode;\n  className?: string;\n  automationId?: string;\n  minHeight?: string;\n}\n\ninterface BottomSheetContentProps {\n  title?: string;\n  onClose: () => void;\n  showCloseIcon?: boolean;\n  showBackButton?: boolean;\n  onBack?: () => void;\n  children: React.ReactNode;\n  className?: string;\n  automationId?: string;\n  minHeight?: string;\n}\n\nconst BottomSheetContent: FC<BottomSheetContentProps> = ({\n  children = null,\n  title = '',\n  onClose = () => {},\n  showCloseIcon = false,\n  showBackButton = false,\n  onBack = () => {},\n  className = '',\n  automationId = '',\n  minHeight = 'auto'\n}) => {\n  const contentRef = useRef<HTMLDivElement>(null);\n  const [startY, setStartY] = useState<number>(0);\n  const [currentY, setCurrentY] = useState<number>(0);\n  const [isDragging, setIsDragging] = useState<boolean>(false);\n\n  const handleTouchStart = (e: React.TouchEvent) => {\n    setStartY(e.touches[0].clientY);\n    setCurrentY(e.touches[0].clientY);\n    setIsDragging(true);\n  };\n\n  const handleTouchMove = (e: React.TouchEvent) => {\n    if (!isDragging) return;\n\n    const touchY = e.touches[0].clientY;\n    const deltaY = touchY - startY;\n\n    // Only allow dragging down\n    if (deltaY > 0) {\n      setCurrentY(touchY);\n      if (contentRef.current) {\n        contentRef.current.style.transform = `translateY(${deltaY}px)`;\n      }\n    }\n  };\n\n  const handleTouchEnd = () => {\n    if (!isDragging) return;\n\n    const deltaY = currentY - startY;\n    const threshold = 60; // pixels to swipe down to trigger close\n\n    if (deltaY > threshold) {\n      // Trigger close\n      onClose();\n    } else {\n      // Reset position\n      if (contentRef.current) {\n        contentRef.current.style.transform = 'translateY(0)';\n      }\n    }\n\n    setIsDragging(false);\n    setStartY(0);\n    setCurrentY(0);\n  };\n\n  return (\n    <div\n      ref={contentRef}\n      className={`se-design-bottom-sheet relative h-max max-h-[98vh] rounded-t-2xl flex flex-col pt-5 ${className}`}\n      onClick={(e) => e.stopPropagation()}\n      onTouchStart={handleTouchStart}\n      onTouchMove={handleTouchMove}\n      onTouchEnd={handleTouchEnd}\n      data-automation-id={automationId}\n      style={{ minHeight }}\n    >\n      {(title || showBackButton) && (\n        <div className=\"se-design-bottom-sheet-header flex items-center justify-left gap-3 mr-6 px-4\">\n          {showBackButton && (\n            <Icon\n              name=\"back\"\n              stroke=\"var(--color-gray-700)\"\n              onClick={onBack}\n              className=\"se-design-bottom-sheet-back-icon cursor-pointer\"\n              automationId={`${automationId}-back-icon`}\n            />\n          )}\n          {title && <div className=\"se-design-bottom-sheet-title text-lg font-semibold\">{title}</div>}\n        </div>\n      )}\n      {showCloseIcon && (\n        <Icon\n          name=\"close\"\n          onClick={onClose}\n          className=\"se-design-bottom-sheet-close-icon absolute top-6 right-4 cursor-pointer z-10\"\n          automationId={`${automationId}-close-icon`}\n        />\n      )}\n      <div className=\"se-design-bottom-sheet-content px-4 pb-5 flex-1 min-h-0 overflow-y-auto\">{children}</div>\n    </div>\n  );\n};\n\nexport const BottomSheet: FC<BottomSheetProps> = ({\n  isOpen = false,\n  title = '',\n  onClose = () => {},\n  children = null,\n  showCloseIcon = true,\n  showBackButton = false,\n  onBack = () => {},\n  className = '',\n  automationId = 'bottomsheet',\n  minHeight = ''\n}) => {\n  return (\n    <CustomModal\n      isOpen={isOpen}\n      onClose={onClose}\n      onModalClick={onClose}\n      className=\"custom-bottom-sheet\"\n      renderModalContent={() => (\n        <BottomSheetContent\n          title={title}\n          onClose={onClose}\n          showCloseIcon={showCloseIcon}\n          showBackButton={showBackButton}\n          onBack={onBack}\n          className={className}\n          automationId={automationId}\n          minHeight={minHeight}\n        >\n          {children}\n        </BottomSheetContent>\n      )}\n    />\n  );\n};\n"],"names":["BottomSheetContent","children","title","onClose","showCloseIcon","showBackButton","onBack","className","automationId","minHeight","contentRef","useRef","startY","setStartY","useState","currentY","setCurrentY","isDragging","setIsDragging","handleTouchStart","e","touches","clientY","handleTouchMove","touchY","deltaY","current","style","transform","handleTouchEnd","React","createElement","ref","onClick","stopPropagation","onTouchStart","onTouchMove","onTouchEnd","Icon","name","stroke","BottomSheet","isOpen","CustomModal","onModalClick","renderModalContent"],"mappings":"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"}