@tipp/ui 2.1.34 → 2.2.0

package/dist/chunk-X2V77FMW.js

@@ -0,0 +1,151 @@
+import {
+  useCurriculumReviewContext
+} from "./chunk-WZVJYDVP.js";
+import {
+  getCurriculumIcon,
+  getCurriculumQuestionIconColor,
+  getCurriculumQuestionTypeDescription
+} from "./chunk-KQNWWP5M.js";
+import {
+  Grid
+} from "./chunk-EGEQY3KT.js";
+import {
+  Heading
+} from "./chunk-34OQDUQR.js";
+import {
+  Separator
+} from "./chunk-HYITAA4J.js";
+import {
+  Box
+} from "./chunk-4Y5BEXVN.js";
+import {
+  Typo
+} from "./chunk-PARGQUJB.js";
+import {
+  Flex
+} from "./chunk-25HMMI7R.js";
+import {
+  Button
+} from "./chunk-AFPH32MF.js";
+import {
+  Badge
+} from "./chunk-FCIHNIOH.js";
+
+// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/start-review.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var renderPreviewContent = (args) => {
+  const { question } = args;
+  const Icon = getCurriculumIcon({
+    type: question.type,
+    icon: question.icon
+  });
+  const getDescription = () => {
+    return [
+      getCurriculumQuestionTypeDescription(question.type),
+      question.duration ? `${question.duration}\uBD84` : ""
+    ].filter(Boolean).join(" | ");
+  };
+  return /* @__PURE__ */ jsxs(
+    Grid,
+    {
+      columns: "16px 1fr",
+      gap: "2",
+      px: "4",
+      py: "2",
+      width: "100%",
+      children: [
+        /* @__PURE__ */ jsx(Box, { mt: "1", children: /* @__PURE__ */ jsx(Icon, { color: getCurriculumQuestionIconColor(question.type) }) }),
+        /* @__PURE__ */ jsxs(Box, { children: [
+          /* @__PURE__ */ jsx(Typo, { as: "p", color: "gray", weight: "bold", children: question.title }),
+          /* @__PURE__ */ jsx(Typo, { color: "gray", children: getDescription() })
+        ] })
+      ]
+    },
+    question.uuid
+  );
+};
+var getReviewContentValue = (question, answer) => {
+  var _a, _b, _c;
+  if (question.type === "question_satisfaction_option") {
+    return (_c = (_b = (_a = question.options) == null ? void 0 : _a.find((option) => option.value === Number(answer))) == null ? void 0 : _b.label) != null ? _c : "";
+  }
+  return answer;
+};
+var renderReviewContent = (args) => {
+  const { question, answer } = args;
+  const Icon = getCurriculumIcon({
+    type: question.type,
+    icon: question.icon
+  });
+  const color = getCurriculumQuestionIconColor(question.type);
+  const badgeColor = ["question_radio", "question_satisfaction_option"].includes(question.type) ? "accent" : "neutral";
+  const value = getReviewContentValue(question, answer);
+  return /* @__PURE__ */ jsxs(
+    Grid,
+    {
+      columns: "16px 1fr",
+      gap: "2",
+      px: "4",
+      py: "2",
+      width: "100%",
+      children: [
+        /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Icon, { color }) }),
+        /* @__PURE__ */ jsxs(Box, { children: [
+          /* @__PURE__ */ jsx(Typo, { as: "p", color: "gray", mb: "2", weight: "bold", children: question.title }),
+          /* @__PURE__ */ jsx(Badge, { color: badgeColor, size: "large", style: { whiteSpace: "break-spaces", lineBreak: "anywhere" }, children: value || "(\uBBF8 \uC751\uB2F5)" })
+        ] })
+      ]
+    },
+    question.uuid
+  );
+};
+function StartReview({ onStart }) {
+  const { curriculum, reviewContents, sectionTitle, done, formik } = useCurriculumReviewContext();
+  return /* @__PURE__ */ jsx(
+    Flex,
+    {
+      align: "center",
+      direction: "column",
+      height: "100%",
+      justify: "center",
+      width: "100%",
+      children: /* @__PURE__ */ jsxs(
+        Flex,
+        {
+          align: "center",
+          direction: "column",
+          height: "100%",
+          justify: "center",
+          maxWidth: "650px",
+          pb: { initial: "6", sm: "0" },
+          pt: { initial: "4", sm: "0" },
+          px: { initial: "4", sm: "0" },
+          width: "100%",
+          children: [
+            /* @__PURE__ */ jsx(Typo, { color: "gray", mb: "1", children: curriculum.title }),
+            /* @__PURE__ */ jsx(Heading, { variant: "heading3", children: reviewContents.title }),
+            /* @__PURE__ */ jsx(Separator, { my: "4", style: { width: 100 } }),
+            /* @__PURE__ */ jsxs(Typo, { align: "left", as: "p", color: "gray", mb: "4", children: [
+              /* @__PURE__ */ jsx(Typo, { as: "span", weight: "bold", children: sectionTitle }),
+              " ",
+              /* @__PURE__ */ jsx(Typo, { children: reviewContents.description })
+            ] }),
+            /* @__PURE__ */ jsx(Box, { mb: "5", overflowY: "auto", width: "100%", children: reviewContents.questions.map((question) => {
+              if (done) {
+                return renderReviewContent({ question, answer: formik.values.answers[question.uuid] });
+              }
+              return renderPreviewContent({ question });
+            }) }),
+            /* @__PURE__ */ jsx(Button, { color: "yellow", onClick: onStart, variant: done ? "outline" : "solid", children: done ? "\uB098\uC758 \uC751\uB2F5 \uC218\uC815\uD558\uAE30" : reviewContents.buttonTitle })
+          ]
+        }
+      )
+    }
+  );
+}
+var start_review_default = StartReview;
+
+export {
+  start_review_default
+};
+//# sourceMappingURL=chunk-X2V77FMW.js.map

package/dist/chunk-XI365RDH.js

@@ -0,0 +1,58 @@
+import {
+  Tooltip
+} from "./chunk-WSJ2CEUB.js";
+import {
+  Typo
+} from "./chunk-PARGQUJB.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-2NMEKWO5.js";
+
+// src/atoms/ellipsis-tooltip.tsx
+import { useEffect, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+function EllipsisTooltip(props) {
+  const _a = props, { children, style, lineClamp = 2 } = _a, rest = __objRest(_a, ["children", "style", "lineClamp"]);
+  const ref = useRef(null);
+  const [tooltipDisplay, setTooltipDisplay] = useState(
+    "none"
+  );
+  useEffect(() => {
+    if (ref.current) {
+      const typo = ref.current;
+      const mouseOver = () => {
+        if (typo.clientHeight < typo.scrollHeight) {
+          setTooltipDisplay("block");
+        }
+      };
+      const mouseOut = () => {
+        setTooltipDisplay("none");
+      };
+      ref.current.addEventListener("mouseenter", mouseOver);
+      ref.current.addEventListener("mouseleave", mouseOut);
+    }
+  }, [children]);
+  return /* @__PURE__ */ jsx(Tooltip, { content: children, style: { display: tooltipDisplay }, children: /* @__PURE__ */ jsx(
+    Typo,
+    __spreadProps(__spreadValues({}, rest), {
+      ref,
+      style: __spreadValues({
+        width: "100%",
+        textOverflow: "ellipsis",
+        overflow: "hidden",
+        WebkitLineClamp: lineClamp,
+        display: "-webkit-box",
+        WebkitBoxOrient: "vertical",
+        wordBreak: "break-word"
+      }, style),
+      children
+    })
+  ) });
+}
+
+export {
+  EllipsisTooltip
+};
+//# sourceMappingURL=chunk-XI365RDH.js.map

package/dist/chunk-XI365RDH.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/ellipsis-tooltip.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Tooltip } from './tooltip';\nimport { Typo, type TypoProps } from './typo';\n\nexport type EllipsisTooltipProps = TypoProps & {\n  lineClamp?: number;\n  children?: string;\n};\n\nexport function EllipsisTooltip(\n  props: EllipsisTooltipProps\n): React.ReactNode {\n  const { children, style, lineClamp = 2, ...rest } = props;\n  const ref = useRef<HTMLSpanElement>(null);\n\n  const [tooltipDisplay, setTooltipDisplay] = useState<'none' | 'block'>(\n    'none'\n  );\n\n  useEffect(() => {\n    if (ref.current) {\n      const typo = ref.current;\n      const mouseOver = (): void => {\n        if (typo.clientHeight < typo.scrollHeight) {\n          setTooltipDisplay('block');\n        }\n      };\n\n      const mouseOut = (): void => {\n        setTooltipDisplay('none');\n      };\n\n      ref.current.addEventListener('mouseenter', mouseOver);\n      ref.current.addEventListener('mouseleave', mouseOut);\n    }\n  }, [children]);\n\n  return (\n    <Tooltip content={children} style={{ display: tooltipDisplay }}>\n      <Typo\n        {...rest}\n        ref={ref}\n        style={{\n          width: '100%',\n          textOverflow: 'ellipsis',\n          overflow: 'hidden',\n          WebkitLineClamp: lineClamp,\n\n          display: '-webkit-box',\n          WebkitBoxOrient: 'vertical',\n          wordBreak: 'break-word',\n          ...style,\n        }}\n      >\n        {children}\n      </Typo>\n    </Tooltip>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;AAAA,SAAgB,WAAW,QAAQ,gBAAgB;AAuC7C;AA9BC,SAAS,gBACd,OACiB;AACjB,QAAoD,YAA5C,YAAU,OAAO,YAAY,EAZvC,IAYsD,IAAT,iBAAS,IAAT,CAAnC,YAAU,SAAO;AACzB,QAAM,MAAM,OAAwB,IAAI;AAExC,QAAM,CAAC,gBAAgB,iBAAiB,IAAI;AAAA,IAC1C;AAAA,EACF;AAEA,YAAU,MAAM;AACd,QAAI,IAAI,SAAS;AACf,YAAM,OAAO,IAAI;AACjB,YAAM,YAAY,MAAY;AAC5B,YAAI,KAAK,eAAe,KAAK,cAAc;AACzC,4BAAkB,OAAO;AAAA,QAC3B;AAAA,MACF;AAEA,YAAM,WAAW,MAAY;AAC3B,0BAAkB,MAAM;AAAA,MAC1B;AAEA,UAAI,QAAQ,iBAAiB,cAAc,SAAS;AACpD,UAAI,QAAQ,iBAAiB,cAAc,QAAQ;AAAA,IACrD;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,SACE,oBAAC,WAAQ,SAAS,UAAU,OAAO,EAAE,SAAS,eAAe,GAC3D;AAAA,IAAC;AAAA,qCACK,OADL;AAAA,MAEC;AAAA,MACA,OAAO;AAAA,QACL,OAAO;AAAA,QACP,cAAc;AAAA,QACd,UAAU;AAAA,QACV,iBAAiB;AAAA,QAEjB,SAAS;AAAA,QACT,iBAAiB;AAAA,QACjB,WAAW;AAAA,SACR;AAAA,MAGJ;AAAA;AAAA,EACH,GACF;AAEJ;","names":[]}

package/dist/chunk-XQDU2EAW.js

@@ -0,0 +1,58 @@
+import {
+  Tooltip
+} from "./chunk-7JGVZ5VX.js";
+import {
+  Typo
+} from "./chunk-PARGQUJB.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-2NMEKWO5.js";
+
+// src/atoms/ellipsis-tooltip.tsx
+import { useEffect, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+function EllipsisTooltip(props) {
+  const _a = props, { children, style, lineClamp = 2 } = _a, rest = __objRest(_a, ["children", "style", "lineClamp"]);
+  const ref = useRef(null);
+  const [tooltipDisplay, setTooltipDisplay] = useState(
+    "none"
+  );
+  useEffect(() => {
+    if (ref.current) {
+      const typo = ref.current;
+      const mouseOver = () => {
+        if (typo.clientHeight < typo.scrollHeight) {
+          setTooltipDisplay("block");
+        }
+      };
+      const mouseOut = () => {
+        setTooltipDisplay("none");
+      };
+      ref.current.addEventListener("mouseenter", mouseOver);
+      ref.current.addEventListener("mouseleave", mouseOut);
+    }
+  }, [children]);
+  return /* @__PURE__ */ jsx(Tooltip, { content: children, style: { display: tooltipDisplay }, children: /* @__PURE__ */ jsx(
+    Typo,
+    __spreadProps(__spreadValues({}, rest), {
+      ref,
+      style: __spreadValues({
+        width: "100%",
+        textOverflow: "ellipsis",
+        overflow: "hidden",
+        WebkitLineClamp: lineClamp,
+        display: "-webkit-box",
+        WebkitBoxOrient: "vertical",
+        wordBreak: "break-word"
+      }, style),
+      children
+    })
+  ) });
+}
+
+export {
+  EllipsisTooltip
+};
+//# sourceMappingURL=chunk-XQDU2EAW.js.map

package/dist/chunk-XQDU2EAW.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/ellipsis-tooltip.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Tooltip } from './tooltip';\nimport { Typo, type TypoProps } from './typo';\n\nexport type EllipsisTooltipProps = TypoProps & {\n  lineClamp?: number;\n  children?: string;\n};\n\nexport function EllipsisTooltip(\n  props: EllipsisTooltipProps\n): React.ReactNode {\n  const { children, style, lineClamp = 2, ...rest } = props;\n  const ref = useRef<HTMLSpanElement>(null);\n\n  const [tooltipDisplay, setTooltipDisplay] = useState<'none' | 'block'>(\n    'none'\n  );\n\n  useEffect(() => {\n    if (ref.current) {\n      const typo = ref.current;\n      const mouseOver = (): void => {\n        if (typo.clientHeight < typo.scrollHeight) {\n          setTooltipDisplay('block');\n        }\n      };\n\n      const mouseOut = (): void => {\n        setTooltipDisplay('none');\n      };\n\n      ref.current.addEventListener('mouseenter', mouseOver);\n      ref.current.addEventListener('mouseleave', mouseOut);\n    }\n  }, [children]);\n\n  return (\n    <Tooltip content={children} style={{ display: tooltipDisplay }}>\n      <Typo\n        {...rest}\n        ref={ref}\n        style={{\n          width: '100%',\n          textOverflow: 'ellipsis',\n          overflow: 'hidden',\n          WebkitLineClamp: lineClamp,\n\n          display: '-webkit-box',\n          WebkitBoxOrient: 'vertical',\n          wordBreak: 'break-word',\n          ...style,\n        }}\n      >\n        {children}\n      </Typo>\n    </Tooltip>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;AAAA,SAAgB,WAAW,QAAQ,gBAAgB;AAuC7C;AA9BC,SAAS,gBACd,OACiB;AACjB,QAAoD,YAA5C,YAAU,OAAO,YAAY,EAZvC,IAYsD,IAAT,iBAAS,IAAT,CAAnC,YAAU,SAAO;AACzB,QAAM,MAAM,OAAwB,IAAI;AAExC,QAAM,CAAC,gBAAgB,iBAAiB,IAAI;AAAA,IAC1C;AAAA,EACF;AAEA,YAAU,MAAM;AACd,QAAI,IAAI,SAAS;AACf,YAAM,OAAO,IAAI;AACjB,YAAM,YAAY,MAAY;AAC5B,YAAI,KAAK,eAAe,KAAK,cAAc;AACzC,4BAAkB,OAAO;AAAA,QAC3B;AAAA,MACF;AAEA,YAAM,WAAW,MAAY;AAC3B,0BAAkB,MAAM;AAAA,MAC1B;AAEA,UAAI,QAAQ,iBAAiB,cAAc,SAAS;AACpD,UAAI,QAAQ,iBAAiB,cAAc,QAAQ;AAAA,IACrD;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,SACE,oBAAC,WAAQ,SAAS,UAAU,OAAO,EAAE,SAAS,eAAe,GAC3D;AAAA,IAAC;AAAA,qCACK,OADL;AAAA,MAEC;AAAA,MACA,OAAO;AAAA,QACL,OAAO;AAAA,QACP,cAAc;AAAA,QACd,UAAU;AAAA,QACV,iBAAiB;AAAA,QAEjB,SAAS;AAAA,QACT,iBAAiB;AAAA,QACjB,WAAW;AAAA,SACR;AAAA,MAGJ;AAAA;AAAA,EACH,GACF;AAEJ;","names":[]}

package/dist/chunk-Z5PFJO4K.js

@@ -0,0 +1,72 @@
+import {
+  useUIState
+} from "./chunk-PT57HCAI.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-2NMEKWO5.js";
+
+// src/atoms/tooltip.tsx
+import {
+  Box,
+  Tooltip as RadixTooltip
+} from "@radix-ui/themes";
+import { useCallback, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+function Tooltip(_a) {
+  var _b = _a, {
+    children
+  } = _b, props = __objRest(_b, [
+    "children"
+  ]);
+  var _a2;
+  const { isMobile } = useUIState();
+  const [open, setOpen] = useState((_a2 = props.defaultOpen) != null ? _a2 : false);
+  const onTouchEnd = useCallback(
+    (e) => {
+      if (!isMobile) return;
+      e.preventDefault();
+      setOpen(false);
+    },
+    [isMobile]
+  );
+  const onTouchStart = useCallback(
+    (e) => {
+      if (!isMobile) return;
+      e.preventDefault();
+      setOpen(true);
+    },
+    [isMobile]
+  );
+  const onOpenChange = useCallback(
+    (e) => {
+      if (!isMobile) return;
+      setOpen(e);
+    },
+    [isMobile]
+  );
+  return /* @__PURE__ */ jsx(
+    RadixTooltip,
+    __spreadProps(__spreadValues({
+      delayDuration: isMobile ? props.delayDuration : 0,
+      onOpenChange,
+      open
+    }, props), {
+      children: /* @__PURE__ */ jsx(
+        Box,
+        {
+          asChild: true,
+          onTouchEnd,
+          onTouchStart,
+          children
+        }
+      )
+    })
+  );
+}
+
+export {
+  Tooltip
+};
+//# sourceMappingURL=chunk-Z5PFJO4K.js.map

package/dist/chunk-Z5PFJO4K.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/tooltip.tsx"],"sourcesContent":["import {\n  Box,\n  Tooltip as RadixTooltip,\n  type TooltipProps as RadixTooltipProps,\n} from '@radix-ui/themes';\nimport { useCallback, useState } from 'react';\nimport { useUIState } from '@/context/ui-state-provider';\n\nexport function Tooltip({\n  children,\n  ...props\n}: RadixTooltipProps): React.ReactElement {\n  const { isMobile } = useUIState();\n  const [open, setOpen] = useState<boolean>(props.defaultOpen ?? false);\n\n  const onTouchEnd = useCallback(\n    (e: React.TouchEvent<HTMLDivElement>) => {\n      if (!isMobile) return;\n      e.preventDefault();\n      setOpen(false);\n    },\n    [isMobile]\n  );\n\n  const onTouchStart = useCallback(\n    (e: React.TouchEvent<HTMLDivElement>) => {\n      if (!isMobile) return;\n      e.preventDefault();\n      setOpen(true);\n    },\n    [isMobile]\n  );\n\n  const onOpenChange = useCallback(\n    (e: boolean) => {\n      if (!isMobile) return;\n      setOpen(e);\n    },\n    [isMobile]\n  );\n\n  return (\n    <RadixTooltip\n      delayDuration={isMobile ? props.delayDuration : 0}\n      onOpenChange={onOpenChange}\n      open={open}\n      {...props}\n    >\n      <Box\n        asChild\n        onTouchEnd={onTouchEnd}\n        onTouchStart={onTouchStart}\n      >\n        {children}\n      </Box>\n    </RadixTooltip>\n  );\n}\n"],"mappings":";;;;;;;;;;AAAA;AAAA,EACE;AAAA,EACA,WAAW;AAAA,OAEN;AACP,SAAS,aAAa,gBAAgB;AA2ChC;AAxCC,SAAS,QAAQ,IAGkB;AAHlB,eACtB;AAAA;AAAA,EATF,IAQwB,IAEnB,kBAFmB,IAEnB;AAAA,IADH;AAAA;AATF,MAAAA;AAYE,QAAM,EAAE,SAAS,IAAI,WAAW;AAChC,QAAM,CAAC,MAAM,OAAO,IAAI,UAAkBA,MAAA,MAAM,gBAAN,OAAAA,MAAqB,KAAK;AAEpE,QAAM,aAAa;AAAA,IACjB,CAAC,MAAwC;AACvC,UAAI,CAAC,SAAU;AACf,QAAE,eAAe;AACjB,cAAQ,KAAK;AAAA,IACf;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,eAAe;AAAA,IACnB,CAAC,MAAwC;AACvC,UAAI,CAAC,SAAU;AACf,QAAE,eAAe;AACjB,cAAQ,IAAI;AAAA,IACd;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,eAAe;AAAA,IACnB,CAAC,MAAe;AACd,UAAI,CAAC,SAAU;AACf,cAAQ,CAAC;AAAA,IACX;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAe,WAAW,MAAM,gBAAgB;AAAA,MAChD;AAAA,MACA;AAAA,OACI,QAJL;AAAA,MAMC;AAAA,QAAC;AAAA;AAAA,UACC,SAAO;AAAA,UACP;AAAA,UACA;AAAA,UAEC;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;","names":["_a"]}

package/dist/chunk-ZAPTCVQ4.js

@@ -0,0 +1,79 @@
+import {
+  useUIState
+} from "./chunk-PT57HCAI.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-2NMEKWO5.js";
+
+// src/atoms/tooltip.tsx
+import {
+  Box,
+  Tooltip as RadixTooltip
+} from "@radix-ui/themes";
+import { useCallback, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+function Tooltip(_a) {
+  var _b = _a, {
+    children
+  } = _b, props = __objRest(_b, [
+    "children"
+  ]);
+  var _a2;
+  const { isMobile } = useUIState();
+  const [open, setOpen] = useState((_a2 = props.defaultOpen) != null ? _a2 : false);
+  const onTouchEnd = useCallback(
+    (e) => {
+      if (!isMobile) return;
+      e.preventDefault();
+      setOpen(false);
+    },
+    [isMobile]
+  );
+  const onTouchStart = useCallback(
+    (e) => {
+      if (!isMobile) return;
+      e.preventDefault();
+      setOpen(true);
+    },
+    [isMobile]
+  );
+  const onOpenChange = useCallback(
+    (e) => {
+      if (isMobile) return;
+      setOpen(e);
+    },
+    [isMobile]
+  );
+  const onClick = useCallback(
+    (e) => {
+      if (!isMobile) return;
+      e.preventDefault();
+      setOpen(true);
+    },
+    [isMobile]
+  );
+  return /* @__PURE__ */ jsx(
+    RadixTooltip,
+    __spreadProps(__spreadValues({
+      delayDuration: isMobile ? props.delayDuration : 0,
+      onOpenChange,
+      open
+    }, props), {
+      children: /* @__PURE__ */ jsx(
+        Box,
+        {
+          asChild: true,
+          onClick,
+          children
+        }
+      )
+    })
+  );
+}
+
+export {
+  Tooltip
+};
+//# sourceMappingURL=chunk-ZAPTCVQ4.js.map

package/dist/chunk-ZAPTCVQ4.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/tooltip.tsx"],"sourcesContent":["import {\n  Box,\n  Tooltip as RadixTooltip,\n  type TooltipProps as RadixTooltipProps,\n} from '@radix-ui/themes';\nimport { useCallback, useState } from 'react';\nimport { useUIState } from '@/context/ui-state-provider';\n\nexport function Tooltip({\n  children,\n  ...props\n}: RadixTooltipProps): React.ReactElement {\n  const { isMobile } = useUIState();\n  const [open, setOpen] = useState<boolean>(props.defaultOpen ?? false);\n\n  const onTouchEnd = useCallback(\n    (e: React.TouchEvent<HTMLDivElement>) => {\n      if (!isMobile) return;\n      e.preventDefault();\n      setOpen(false);\n    },\n    [isMobile]\n  );\n\n  const onTouchStart = useCallback(\n    (e: React.TouchEvent<HTMLDivElement>) => {\n      if (!isMobile) return;\n      e.preventDefault();\n      setOpen(true);\n    },\n    [isMobile]\n  );\n\n  const onOpenChange = useCallback(\n    (e: boolean) => {\n      if (isMobile) return;\n      setOpen(e);\n    },\n    [isMobile]\n  );\n\n  const onClick = useCallback(\n    (e: React.MouseEvent<HTMLDivElement>) => {\n      if (!isMobile) return;\n      e.preventDefault();\n      setOpen(true);\n    },\n    [isMobile]\n  );\n  \n\n  return (\n    <RadixTooltip\n      delayDuration={isMobile ? props.delayDuration : 0}\n      onOpenChange={onOpenChange}\n      open={open}\n      {...props}\n    >\n      <Box\n        asChild\n        // onTouchEnd={onTouchEnd}\n        // onTouchStart={onTouchStart}\n        onClick={onClick}\n      >\n        {children}\n      </Box>\n    </RadixTooltip>\n  );\n}\n"],"mappings":";;;;;;;;;;AAAA;AAAA,EACE;AAAA,EACA,WAAW;AAAA,OAEN;AACP,SAAS,aAAa,gBAAgB;AAqDhC;AAlDC,SAAS,QAAQ,IAGkB;AAHlB,eACtB;AAAA;AAAA,EATF,IAQwB,IAEnB,kBAFmB,IAEnB;AAAA,IADH;AAAA;AATF,MAAAA;AAYE,QAAM,EAAE,SAAS,IAAI,WAAW;AAChC,QAAM,CAAC,MAAM,OAAO,IAAI,UAAkBA,MAAA,MAAM,gBAAN,OAAAA,MAAqB,KAAK;AAEpE,QAAM,aAAa;AAAA,IACjB,CAAC,MAAwC;AACvC,UAAI,CAAC,SAAU;AACf,QAAE,eAAe;AACjB,cAAQ,KAAK;AAAA,IACf;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,eAAe;AAAA,IACnB,CAAC,MAAwC;AACvC,UAAI,CAAC,SAAU;AACf,QAAE,eAAe;AACjB,cAAQ,IAAI;AAAA,IACd;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,eAAe;AAAA,IACnB,CAAC,MAAe;AACd,UAAI,SAAU;AACd,cAAQ,CAAC;AAAA,IACX;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,UAAU;AAAA,IACd,CAAC,MAAwC;AACvC,UAAI,CAAC,SAAU;AACf,QAAE,eAAe;AACjB,cAAQ,IAAI;AAAA,IACd;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAGA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAe,WAAW,MAAM,gBAAgB;AAAA,MAChD;AAAA,MACA;AAAA,OACI,QAJL;AAAA,MAMC;AAAA,QAAC;AAAA;AAAA,UACC,SAAO;AAAA,UAGP;AAAA,UAEC;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;","names":["_a"]}

package/dist/chunk-ZPKFO5Y3.js

@@ -0,0 +1,45 @@
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-2NMEKWO5.js";
+
+// src/atoms/tooltip.tsx
+import {
+  Tooltip as RadixTooltip
+} from "@radix-ui/themes";
+import { useState } from "react";
+import { jsx } from "react/jsx-runtime";
+function Tooltip(_a) {
+  var _b = _a, {
+    children
+  } = _b, props = __objRest(_b, [
+    "children"
+  ]);
+  var _a2;
+  const [open, setOpen] = useState((_a2 = props.defaultOpen) != null ? _a2 : false);
+  const isMobile = true;
+  console.log("isMobile", isMobile);
+  console.log("open", open);
+  return /* @__PURE__ */ jsx(
+    RadixTooltip,
+    __spreadProps(__spreadValues({
+      delayDuration: isMobile ? props.delayDuration : 0,
+      onOpenChange: (e) => {
+        setOpen(e);
+      },
+      open,
+      onClick: (e) => {
+        console.log("onTouchStart");
+        setOpen(true);
+      }
+    }, props), {
+      children
+    })
+  );
+}
+
+export {
+  Tooltip
+};
+//# sourceMappingURL=chunk-ZPKFO5Y3.js.map

package/dist/chunk-ZPKFO5Y3.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/tooltip.tsx"],"sourcesContent":["import {\n  Tooltip as RadixTooltip,\n  type TooltipProps as RadixTooltipProps,\n} from '@radix-ui/themes';\nimport { useState } from 'react';\nimport { useUIState } from '@/context/ui-state-provider';\n\nexport function Tooltip({\n  children,\n  ...props\n}: RadixTooltipProps): React.ReactElement {\n  //   const { isMobile } = useUIState();\n  const [open, setOpen] = useState<boolean>(props.defaultOpen ?? false);\n\n  const isMobile = true;\n  console.log('isMobile', isMobile);\n  console.log('open', open);\n\n  return (\n    <RadixTooltip\n      delayDuration={isMobile ? props.delayDuration : 0}\n      onOpenChange={(e) => {\n        setOpen(e);\n      }}\n      open={open}\n      onClick={(e) => {\n        console.log('onTouchStart');\n        setOpen(true);\n      }}\n      {...props}\n    >\n      {children}\n    </RadixTooltip>\n  );\n}\n"],"mappings":";;;;;;;AAAA;AAAA,EACE,WAAW;AAAA,OAEN;AACP,SAAS,gBAAgB;AAerB;AAZG,SAAS,QAAQ,IAGkB;AAHlB,eACtB;AAAA;AAAA,EARF,IAOwB,IAEnB,kBAFmB,IAEnB;AAAA,IADH;AAAA;AARF,MAAAA;AAYE,QAAM,CAAC,MAAM,OAAO,IAAI,UAAkBA,MAAA,MAAM,gBAAN,OAAAA,MAAqB,KAAK;AAEpE,QAAM,WAAW;AACjB,UAAQ,IAAI,YAAY,QAAQ;AAChC,UAAQ,IAAI,QAAQ,IAAI;AAExB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAe,WAAW,MAAM,gBAAgB;AAAA,MAChD,cAAc,CAAC,MAAM;AACnB,gBAAQ,CAAC;AAAA,MACX;AAAA,MACA;AAAA,MACA,SAAS,CAAC,MAAM;AACd,gBAAQ,IAAI,cAAc;AAC1B,gBAAQ,IAAI;AAAA,MACd;AAAA,OACI,QAVL;AAAA,MAYE;AAAA;AAAA,EACH;AAEJ;","names":["_a"]}

package/dist/context/ui-state-provider.cjs

@@ -0,0 +1,53 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/context/ui-state-provider.tsx
+var ui_state_provider_exports = {};
+__export(ui_state_provider_exports, {
+  UIStateContext: () => UIStateContext,
+  UIStateProvider: () => UIStateProvider,
+  useUIState: () => useUIState
+});
+module.exports = __toCommonJS(ui_state_provider_exports);
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var UIStateContext = (0, import_react.createContext)({
+  isMobile: false
+});
+function UIStateProvider({
+  children,
+  isMobile
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(UIStateContext.Provider, { value: { isMobile }, children });
+}
+var useUIState = () => {
+  try {
+    const state = (0, import_react.useContext)(UIStateContext);
+    return state;
+  } catch (error) {
+    throw new Error("UIStateProvider not found");
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  UIStateContext,
+  UIStateProvider,
+  useUIState
+});
+//# sourceMappingURL=ui-state-provider.cjs.map

package/dist/context/ui-state-provider.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/context/ui-state-provider.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\n\ninterface UIStateContextType {\n  isMobile: boolean;\n}\n\nexport const UIStateContext = createContext<UIStateContextType>({\n  isMobile: false,\n});\n\nexport type UiStateProviderProps = React.ReactNode;\n\nexport function UIStateProvider({\n  children,\n  isMobile,\n}: {\n  children: UiStateProviderProps;\n  isMobile: boolean;\n}): React.ReactElement {\n  return (\n    <UIStateContext.Provider value={{ isMobile }}>\n      {children}\n    </UIStateContext.Provider>\n  );\n}\n\nexport const useUIState = (): UIStateContextType => {\n  try {\n    const state = useContext(UIStateContext);\n    return state;\n  } catch (error) {\n    throw new Error('UIStateProvider not found');\n  }\n};"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA0C;AAoBtC;AAdG,IAAM,qBAAiB,4BAAkC;AAAA,EAC9D,UAAU;AACZ,CAAC;AAIM,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AACF,GAGuB;AACrB,SACE,4CAAC,eAAe,UAAf,EAAwB,OAAO,EAAE,SAAS,GACxC,UACH;AAEJ;AAEO,IAAM,aAAa,MAA0B;AAClD,MAAI;AACF,UAAM,YAAQ,yBAAW,cAAc;AACvC,WAAO;AAAA,EACT,SAAS,OAAO;AACd,UAAM,IAAI,MAAM,2BAA2B;AAAA,EAC7C;AACF;","names":[]}

package/dist/context/ui-state-provider.d.cts

@@ -0,0 +1,14 @@
+import * as React$1 from 'react';
+
+interface UIStateContextType {
+    isMobile: boolean;
+}
+declare const UIStateContext: React$1.Context<UIStateContextType>;
+type UiStateProviderProps = React.ReactNode;
+declare function UIStateProvider({ children, isMobile, }: {
+    children: UiStateProviderProps;
+    isMobile: boolean;
+}): React.ReactElement;
+declare const useUIState: () => UIStateContextType;
+
+export { UIStateContext, UIStateProvider, type UiStateProviderProps, useUIState };

package/dist/context/ui-state-provider.d.ts

@@ -0,0 +1,14 @@
+import * as React$1 from 'react';
+
+interface UIStateContextType {
+    isMobile: boolean;
+}
+declare const UIStateContext: React$1.Context<UIStateContextType>;
+type UiStateProviderProps = React.ReactNode;
+declare function UIStateProvider({ children, isMobile, }: {
+    children: UiStateProviderProps;
+    isMobile: boolean;
+}): React.ReactElement;
+declare const useUIState: () => UIStateContextType;
+
+export { UIStateContext, UIStateProvider, type UiStateProviderProps, useUIState };

package/dist/context/ui-state-provider.js

@@ -0,0 +1,12 @@
+import {
+  UIStateContext,
+  UIStateProvider,
+  useUIState
+} from "../chunk-PT57HCAI.js";
+import "../chunk-2NMEKWO5.js";
+export {
+  UIStateContext,
+  UIStateProvider,
+  useUIState
+};
+//# sourceMappingURL=ui-state-provider.js.map

package/dist/icon.js

@@ -66,15 +66,9 @@ import {
   VideoIcon
 } from "./chunk-V5XKNSCK.js";
 import "./chunk-WJ34ZHTU.js";
-import {
-  PhoneRingIcon
-} from "./chunk-MEKWBVXE.js";
 import {
   TriangleArrowUpIcon
 } from "./chunk-PVL7SJYR.js";
-import {
-  CirclePlayIcon
-} from "./chunk-K25BYIJ7.js";
 import {
   CircleQuoteIcon
 } from "./chunk-ECVAWQXV.js";
@@ -90,6 +84,9 @@ import {
 import {
   MicIcon
 } from "./chunk-XD3KUE4Q.js";
+import {
+  PhoneRingIcon
+} from "./chunk-MEKWBVXE.js";
 import {
   CameraDisabledIcon
 } from "./chunk-25Q6QLSN.js";
@@ -105,6 +102,9 @@ import {
 import {
   CirclePencilIcon
 } from "./chunk-UQN63IRS.js";
+import {
+  CirclePlayIcon
+} from "./chunk-K25BYIJ7.js";
 import "./chunk-2NMEKWO5.js";
 export {
   ArchiveIcon,

package/dist/icons/index.js

@@ -1,13 +1,7 @@
 import "../chunk-WJ34ZHTU.js";
-import {
-  PhoneRingIcon
-} from "../chunk-MEKWBVXE.js";
 import {
   TriangleArrowUpIcon
 } from "../chunk-PVL7SJYR.js";
-import {
-  CirclePlayIcon
-} from "../chunk-K25BYIJ7.js";
 import {
   CircleQuoteIcon
 } from "../chunk-ECVAWQXV.js";
@@ -23,6 +17,9 @@ import {
 import {
   MicIcon
 } from "../chunk-XD3KUE4Q.js";
+import {
+  PhoneRingIcon
+} from "../chunk-MEKWBVXE.js";
 import {
   CameraDisabledIcon
 } from "../chunk-25Q6QLSN.js";
@@ -38,6 +35,9 @@ import {
 import {
   CirclePencilIcon
 } from "../chunk-UQN63IRS.js";
+import {
+  CirclePlayIcon
+} from "../chunk-K25BYIJ7.js";
 import "../chunk-2NMEKWO5.js";
 export {
   CameraDisabledIcon,