se-design 0.0.93 → 0.0.94

package/dist/index7.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index7.cjs","sources":["../src/components/Tag/Tag.tsx"],"sourcesContent":["import { FC } from 'react';\n\ntype TagProps = {\n  label: string;\n};\n\nexport const Tag: FC<TagProps> = ({ label }) => {\n  return (\n    <span className=\"inline-block px-1.5 py-1 text-xs font-bold rounded-sm bg-yellow-400 uppercase leading-4\">\n      {label}\n    </span>\n  );\n};\n"],"names":["Tag","label","jsx"],"mappings":"iHAMaA,EAAoB,CAAC,CAAE,MAAAC,KAE/BC,EAAAA,kBAAAA,IAAA,OAAA,CAAK,UAAU,0FACb,SACHD,CAAA,CAAA"}

package/dist/index7.js

@@ -0,0 +1,6 @@
+import { j as s } from "./index12.js";
+const o = ({ label: e }) => /* @__PURE__ */ s.jsx("span", { className: "inline-block px-1.5 py-1 text-xs font-bold rounded-sm bg-yellow-400 uppercase leading-4", children: e });
+export {
+  o as Tag
+};
+//# sourceMappingURL=index7.js.map

package/dist/index7.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index7.js","sources":["../src/components/Tag/Tag.tsx"],"sourcesContent":["import { FC } from 'react';\n\ntype TagProps = {\n  label: string;\n};\n\nexport const Tag: FC<TagProps> = ({ label }) => {\n  return (\n    <span className=\"inline-block px-1.5 py-1 text-xs font-bold rounded-sm bg-yellow-400 uppercase leading-4\">\n      {label}\n    </span>\n  );\n};\n"],"names":["Tag","label","jsx"],"mappings":";AAMO,MAAMA,IAAoB,CAAC,EAAE,OAAAC,QAE/BC,gBAAAA,EAAAA,IAAA,QAAA,EAAK,WAAU,2FACb,UACHD,EAAA,CAAA;"}

package/dist/index8.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index12.cjs"),s=require("./index3.cjs"),u=n=>{const{title:t,content:i,successButtonType:c,cancelButtonType:l,successButtonText:o,cancelButtonText:x,cancelAction:r,successAction:a}=n;return e.jsxRuntimeExports.jsx("div",{className:"fixed inset-0 flex items-start justify-center z-50 backdrop-brightness-50",children:e.jsxRuntimeExports.jsxs("div",{className:"flex flex-col gap-3 bg-white rounded shadow-lg p-8 mt-14 w-[500px]",children:[t&&e.jsxRuntimeExports.jsx("div",{className:"text-lg font-semibold",children:t}),e.jsxRuntimeExports.jsx("p",{className:"leading-normal",children:i}),e.jsxRuntimeExports.jsxs("div",{className:"flex items-center justify-end gap-4 pt-2",children:[e.jsxRuntimeExports.jsx(s.Button,{type:l,onClick:r,label:x}),e.jsxRuntimeExports.jsx(s.Button,{type:c,onClick:a,label:o})]})]})})};exports.Modal=u;
+//# sourceMappingURL=index8.cjs.map

package/dist/index8.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index8.cjs","sources":["../src/components/Modal/Modal.tsx"],"sourcesContent":["import { FC } from 'react';\nimport { Button } from '../Button';\n\nexport interface ModalProps {\n  title?: string;\n  content: string;\n  successButtonText: string;\n  cancelButtonText: string;\n  successButtonType: 'primary' | 'secondary' | 'negative' | 'negative-secondary';\n  cancelButtonType: 'primary' | 'secondary' | 'negative' | 'negative-secondary';\n  cancelAction?: () => void;\n  successAction?: () => void;\n}\n\nexport const Modal: FC<ModalProps> = (props) => {\n  const {\n    title,\n    content,\n    successButtonType,\n    cancelButtonType,\n    successButtonText,\n    cancelButtonText,\n    cancelAction,\n    successAction\n  } = props;\n\n  return (\n    <div className=\"fixed inset-0 flex items-start justify-center z-50 backdrop-brightness-50\">\n      <div className=\"flex flex-col gap-3 bg-white rounded shadow-lg p-8 mt-14 w-[500px]\">\n        {title && <div className=\"text-lg font-semibold\">{title}</div>}\n        <p className=\"leading-normal\">{content}</p>\n        <div className=\"flex items-center justify-end gap-4 pt-2\">\n          <Button type={cancelButtonType} onClick={cancelAction} label={cancelButtonText} />\n          <Button type={successButtonType} onClick={successAction} label={successButtonText} />\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["Modal","props","title","content","successButtonType","cancelButtonType","successButtonText","cancelButtonText","cancelAction","successAction","jsxs","jsx","Button"],"mappings":"2IAcaA,EAAyBC,GAAU,CACxC,KAAA,CACJ,MAAAC,EACA,QAAAC,EACA,kBAAAC,EACA,iBAAAC,EACA,kBAAAC,EACA,iBAAAC,EACA,aAAAC,EACA,cAAAC,CACE,EAAAR,EAEJ,+BACG,MAAI,CAAA,UAAU,4EACb,SAACS,EAAA,kBAAA,KAAA,MAAA,CAAI,UAAU,qEACZ,SAAA,CAAAR,GAAUS,EAAA,kBAAA,IAAA,MAAA,CAAI,UAAU,wBAAyB,SAAMT,EAAA,EACvDS,EAAA,kBAAA,IAAA,IAAA,CAAE,UAAU,iBAAkB,SAAQR,EAAA,EACvCO,EAAAA,kBAAAA,KAAC,MAAI,CAAA,UAAU,2CACb,SAAA,CAAAC,wBAACC,EAAAA,QAAO,KAAMP,EAAkB,QAASG,EAAc,MAAOD,EAAkB,0BAC/EK,EAAAA,OAAO,CAAA,KAAMR,EAAmB,QAASK,EAAe,MAAOH,EAAmB,CAAA,EACrF,CAAA,CACF,CAAA,CACF,CAAA,CAEJ"}

package/dist/index8.js

@@ -0,0 +1,26 @@
+import { j as e } from "./index12.js";
+import { Button as s } from "./index3.js";
+const p = (c) => {
+  const {
+    title: t,
+    content: n,
+    successButtonType: l,
+    cancelButtonType: i,
+    successButtonText: o,
+    cancelButtonText: a,
+    cancelAction: r,
+    successAction: x
+  } = c;
+  return /* @__PURE__ */ e.jsx("div", { className: "fixed inset-0 flex items-start justify-center z-50 backdrop-brightness-50", children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-3 bg-white rounded shadow-lg p-8 mt-14 w-[500px]", children: [
+    t && /* @__PURE__ */ e.jsx("div", { className: "text-lg font-semibold", children: t }),
+    /* @__PURE__ */ e.jsx("p", { className: "leading-normal", children: n }),
+    /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-end gap-4 pt-2", children: [
+      /* @__PURE__ */ e.jsx(s, { type: i, onClick: r, label: a }),
+      /* @__PURE__ */ e.jsx(s, { type: l, onClick: x, label: o })
+    ] })
+  ] }) });
+};
+export {
+  p as Modal
+};
+//# sourceMappingURL=index8.js.map

package/dist/index8.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index8.js","sources":["../src/components/Modal/Modal.tsx"],"sourcesContent":["import { FC } from 'react';\nimport { Button } from '../Button';\n\nexport interface ModalProps {\n  title?: string;\n  content: string;\n  successButtonText: string;\n  cancelButtonText: string;\n  successButtonType: 'primary' | 'secondary' | 'negative' | 'negative-secondary';\n  cancelButtonType: 'primary' | 'secondary' | 'negative' | 'negative-secondary';\n  cancelAction?: () => void;\n  successAction?: () => void;\n}\n\nexport const Modal: FC<ModalProps> = (props) => {\n  const {\n    title,\n    content,\n    successButtonType,\n    cancelButtonType,\n    successButtonText,\n    cancelButtonText,\n    cancelAction,\n    successAction\n  } = props;\n\n  return (\n    <div className=\"fixed inset-0 flex items-start justify-center z-50 backdrop-brightness-50\">\n      <div className=\"flex flex-col gap-3 bg-white rounded shadow-lg p-8 mt-14 w-[500px]\">\n        {title && <div className=\"text-lg font-semibold\">{title}</div>}\n        <p className=\"leading-normal\">{content}</p>\n        <div className=\"flex items-center justify-end gap-4 pt-2\">\n          <Button type={cancelButtonType} onClick={cancelAction} label={cancelButtonText} />\n          <Button type={successButtonType} onClick={successAction} label={successButtonText} />\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["Modal","props","title","content","successButtonType","cancelButtonType","successButtonText","cancelButtonText","cancelAction","successAction","jsxs","jsx","Button"],"mappings":";;AAca,MAAAA,IAAwB,CAACC,MAAU;AACxC,QAAA;AAAA,IACJ,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,EACE,IAAAR;AAEJ,+BACG,OAAI,EAAA,WAAU,6EACb,UAACS,gBAAAA,EAAA,KAAA,OAAA,EAAI,WAAU,sEACZ,UAAA;AAAA,IAAAR,KAAUS,gBAAAA,EAAA,IAAA,OAAA,EAAI,WAAU,yBAAyB,UAAMT,GAAA;AAAA,IACvDS,gBAAAA,EAAA,IAAA,KAAA,EAAE,WAAU,kBAAkB,UAAQR,GAAA;AAAA,IACvCO,gBAAAA,EAAAA,KAAC,OAAI,EAAA,WAAU,4CACb,UAAA;AAAA,MAAAC,gBAAAA,MAACC,KAAO,MAAMP,GAAkB,SAASG,GAAc,OAAOD,GAAkB;AAAA,4BAC/EK,GAAO,EAAA,MAAMR,GAAmB,SAASK,GAAe,OAAOH,GAAmB;AAAA,IAAA,GACrF;AAAA,EAAA,EACF,CAAA,EACF,CAAA;AAEJ;"}

package/dist/index9.cjs

@@ -0,0 +1,5 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./index12.cjs"),s=require("react"),d=({content:l,tooltipSrc:a,position:t="bottom-center",displayOn:o="hover"})=>{const[c,f]=s.useState(o==="always-on"),r=s.useRef(null);s.useEffect(()=>{const e=r.current;e&&(t=="bottom-center"?(e.setAttribute("style","left: 50%;transform: translateX(-50%);"),e.classList.add("before:left-[calc(50%-7px)]"),e.classList.add("before:top-[-7px]")):t=="bottom-left"?(e.classList.add("before:left-[calc(10%-7px)]"),e.classList.add("before:top-[-7px]")):t=="bottom-right"?(e.setAttribute("style","right: 0;"),e.classList.add("before:right-[calc(10%+7px)]"),e.classList.add("before:top-[-7px]")):t=="left"?(e.setAttribute("style","right: calc(100% + 10px);top:0;"),e.classList.add("before:right-[-6px]"),e.classList.add("before:top-0px")):t=="right"&&(e.setAttribute("style","left: calc(100% + 10px);top:0;"),e.classList.add("before:left-[-6px]"),e.classList.add("before:top-0px")),o=="hover"&&e.classList.add("group-hover:visible"))},[l]),s.useEffect(()=>{const e=r.current;e&&(c?e.classList.remove("invisible"):e.classList.add("invisible"))},[c]);const n=()=>{o=="click"&&f(e=>!e)};return i.jsxRuntimeExports.jsxs("div",{className:"group relative",onClick:n,children:[i.jsxRuntimeExports.jsx("div",{className:"cursor-pointer",id:"tooltip-trigger",children:a}),i.jsxRuntimeExports.jsx("div",{ref:r,id:"tooltip-content",className:`flex justify-center px-3 py-2 min-w-24 max-w-60
+          absolute top-[calc(100%+8px)] w-max bg-gray-800 text-white text-xs rounded-[3px]
+          before:content-[' '] before:w-3.5 before:h-3.5 before:bg-gray-800 before:inline-block
+          before:absolute before:rounded-tl-sm before:rotate-45`,children:l})]})};exports.Tooltip=d;
+//# sourceMappingURL=index9.cjs.map

package/dist/index9.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index9.cjs","sources":["../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import { useEffect, useState, useRef } from \"react\";\n\nexport interface TooltipProps {\n  /**\n   * Tooltip contents\n   */\n  content: string;\n  /**\n   * Tooltip position\n   */\n  position?: \"bottom-center\" | \"bottom-left\" | \"bottom-right\" | \"left\" | \"right\";\n  /**\n   * Display tooltip on Hover, Click or Always\n   */\n  displayOn?: 'hover' | 'click' | 'always-on';\n  /**\n   * Tooltip trigger contents\n   */\n  tooltipSrc?: React.ReactNode;\n}\n\nexport const Tooltip = ({ content, tooltipSrc, position = 'bottom-center', displayOn = 'hover' }: TooltipProps) => {\n  const [displayTooltip, setDisplayTooltip] = useState(displayOn === 'always-on');\n  const tooltipContentRef = useRef<HTMLDivElement>(null);;\n\n  useEffect(() => {\n    const tooltipContent = tooltipContentRef.current;\n\n    if(!tooltipContent) {\n      return\n    }\n    \n    if(position == 'bottom-center') {\n      tooltipContent.setAttribute(\"style\", `left: 50%;transform: translateX(-50%);`);\n      tooltipContent.classList.add(`before:left-[calc(50%-7px)]`);\n      tooltipContent.classList.add(`before:top-[-7px]`);\n    } else if(position == 'bottom-left') {\n      tooltipContent.classList.add(`before:left-[calc(10%-7px)]`);\n      tooltipContent.classList.add(`before:top-[-7px]`);\n    } else if(position == 'bottom-right') {\n      tooltipContent.setAttribute(\"style\", `right: 0;`);\n      tooltipContent.classList.add(`before:right-[calc(10%+7px)]`);\n      tooltipContent.classList.add(`before:top-[-7px]`);\n    } else if(position == 'left') {\n      tooltipContent.setAttribute(\"style\", `right: calc(100% + 10px);top:0;`);\n      tooltipContent.classList.add(`before:right-[-6px]`);\n      tooltipContent.classList.add(`before:top-0px`);\n    } else if(position == 'right') {\n      tooltipContent.setAttribute(\"style\", `left: calc(100% + 10px);top:0;`);\n      tooltipContent.classList.add(`before:left-[-6px]`);\n      tooltipContent.classList.add(`before:top-0px`);\n    }\n\n    if(displayOn == 'hover') {\n      tooltipContent.classList.add(`group-hover:visible`);\n    }\n  }, [content]);\n\n  useEffect(() => {\n    const tooltipContent = tooltipContentRef.current;\n\n    if(!tooltipContent) {\n      return;\n    }\n    if(displayTooltip) {\n      tooltipContent.classList.remove(`invisible`);\n    } else {\n      tooltipContent.classList.add(`invisible`);\n    }\n  }, [displayTooltip])\n\n  const onTooltipSrcClick = () => {\n    if(displayOn == 'click') {\n      setDisplayTooltip((displayTooltip) => !displayTooltip)\n    }\n  }\n\n  return (\n    <div className=\"group relative\" onClick={onTooltipSrcClick}>\n      <div className=\"cursor-pointer\" id=\"tooltip-trigger\">\n        {tooltipSrc}\n      </div>\n      <div\n        ref={tooltipContentRef}\n        id=\"tooltip-content\"\n        className=\"flex justify-center px-3 py-2 min-w-24 max-w-60\n          absolute top-[calc(100%+8px)] w-max bg-gray-800 text-white text-xs rounded-[3px]\n          before:content-[' '] before:w-3.5 before:h-3.5 before:bg-gray-800 before:inline-block\n          before:absolute before:rounded-tl-sm before:rotate-45\"\n      >\n        {content}\n      </div>\n    </div>\n  );\n};\n"],"names":["Tooltip","content","tooltipSrc","position","displayOn","displayTooltip","setDisplayTooltip","useState","tooltipContentRef","useRef","useEffect","tooltipContent","onTooltipSrcClick","jsxs","jsx"],"mappings":"oIAqBaA,EAAU,CAAC,CAAE,QAAAC,EAAS,WAAAC,EAAY,SAAAC,EAAW,gBAAiB,UAAAC,EAAY,WAA4B,CACjH,KAAM,CAACC,EAAgBC,CAAiB,EAAIC,EAAAA,SAASH,IAAc,WAAW,EACxEI,EAAoBC,SAAuB,IAAI,EAErDC,EAAAA,UAAU,IAAM,CACd,MAAMC,EAAiBH,EAAkB,QAErCG,IAIDR,GAAY,iBACEQ,EAAA,aAAa,QAAS,wCAAwC,EAC9DA,EAAA,UAAU,IAAI,6BAA6B,EAC3CA,EAAA,UAAU,IAAI,mBAAmB,GACxCR,GAAY,eACLQ,EAAA,UAAU,IAAI,6BAA6B,EAC3CA,EAAA,UAAU,IAAI,mBAAmB,GACxCR,GAAY,gBACLQ,EAAA,aAAa,QAAS,WAAW,EACjCA,EAAA,UAAU,IAAI,8BAA8B,EAC5CA,EAAA,UAAU,IAAI,mBAAmB,GACxCR,GAAY,QACLQ,EAAA,aAAa,QAAS,iCAAiC,EACvDA,EAAA,UAAU,IAAI,qBAAqB,EACnCA,EAAA,UAAU,IAAI,gBAAgB,GACrCR,GAAY,UACLQ,EAAA,aAAa,QAAS,gCAAgC,EACtDA,EAAA,UAAU,IAAI,oBAAoB,EAClCA,EAAA,UAAU,IAAI,gBAAgB,GAG5CP,GAAa,SACCO,EAAA,UAAU,IAAI,qBAAqB,EACpD,EACC,CAACV,CAAO,CAAC,EAEZS,EAAAA,UAAU,IAAM,CACd,MAAMC,EAAiBH,EAAkB,QAErCG,IAGDN,EACcM,EAAA,UAAU,OAAO,WAAW,EAE5BA,EAAA,UAAU,IAAI,WAAW,EAC1C,EACC,CAACN,CAAc,CAAC,EAEnB,MAAMO,EAAoB,IAAM,CAC3BR,GAAa,SACIE,EAACD,GAAmB,CAACA,CAAc,CACvD,EAGF,OACGQ,EAAAA,kBAAAA,KAAA,MAAA,CAAI,UAAU,iBAAiB,QAASD,EACvC,SAAA,CAAAE,wBAAC,MAAI,CAAA,UAAU,iBAAiB,GAAG,kBAChC,SACHZ,EAAA,EACAY,EAAA,kBAAA,IAAC,MAAA,CACC,IAAKN,EACL,GAAG,kBACH,UAAU;AAAA;AAAA;AAAA,iEAKT,SAAAP,CAAA,CACH,CACF,CAAA,CAAA,CAEJ"}

package/dist/index9.js

@@ -0,0 +1,34 @@
+import { j as r } from "./index12.js";
+import { useState as p, useRef as d, useEffect as a } from "react";
+const u = ({ content: l, tooltipSrc: c, position: t = "bottom-center", displayOn: s = "hover" }) => {
+  const [i, f] = p(s === "always-on"), o = d(null);
+  a(() => {
+    const e = o.current;
+    e && (t == "bottom-center" ? (e.setAttribute("style", "left: 50%;transform: translateX(-50%);"), e.classList.add("before:left-[calc(50%-7px)]"), e.classList.add("before:top-[-7px]")) : t == "bottom-left" ? (e.classList.add("before:left-[calc(10%-7px)]"), e.classList.add("before:top-[-7px]")) : t == "bottom-right" ? (e.setAttribute("style", "right: 0;"), e.classList.add("before:right-[calc(10%+7px)]"), e.classList.add("before:top-[-7px]")) : t == "left" ? (e.setAttribute("style", "right: calc(100% + 10px);top:0;"), e.classList.add("before:right-[-6px]"), e.classList.add("before:top-0px")) : t == "right" && (e.setAttribute("style", "left: calc(100% + 10px);top:0;"), e.classList.add("before:left-[-6px]"), e.classList.add("before:top-0px")), s == "hover" && e.classList.add("group-hover:visible"));
+  }, [l]), a(() => {
+    const e = o.current;
+    e && (i ? e.classList.remove("invisible") : e.classList.add("invisible"));
+  }, [i]);
+  const n = () => {
+    s == "click" && f((e) => !e);
+  };
+  return /* @__PURE__ */ r.jsxs("div", { className: "group relative", onClick: n, children: [
+    /* @__PURE__ */ r.jsx("div", { className: "cursor-pointer", id: "tooltip-trigger", children: c }),
+    /* @__PURE__ */ r.jsx(
+      "div",
+      {
+        ref: o,
+        id: "tooltip-content",
+        className: `flex justify-center px-3 py-2 min-w-24 max-w-60
+          absolute top-[calc(100%+8px)] w-max bg-gray-800 text-white text-xs rounded-[3px]
+          before:content-[' '] before:w-3.5 before:h-3.5 before:bg-gray-800 before:inline-block
+          before:absolute before:rounded-tl-sm before:rotate-45`,
+        children: l
+      }
+    )
+  ] });
+};
+export {
+  u as Tooltip
+};
+//# sourceMappingURL=index9.js.map

package/dist/index9.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index9.js","sources":["../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import { useEffect, useState, useRef } from \"react\";\n\nexport interface TooltipProps {\n  /**\n   * Tooltip contents\n   */\n  content: string;\n  /**\n   * Tooltip position\n   */\n  position?: \"bottom-center\" | \"bottom-left\" | \"bottom-right\" | \"left\" | \"right\";\n  /**\n   * Display tooltip on Hover, Click or Always\n   */\n  displayOn?: 'hover' | 'click' | 'always-on';\n  /**\n   * Tooltip trigger contents\n   */\n  tooltipSrc?: React.ReactNode;\n}\n\nexport const Tooltip = ({ content, tooltipSrc, position = 'bottom-center', displayOn = 'hover' }: TooltipProps) => {\n  const [displayTooltip, setDisplayTooltip] = useState(displayOn === 'always-on');\n  const tooltipContentRef = useRef<HTMLDivElement>(null);;\n\n  useEffect(() => {\n    const tooltipContent = tooltipContentRef.current;\n\n    if(!tooltipContent) {\n      return\n    }\n    \n    if(position == 'bottom-center') {\n      tooltipContent.setAttribute(\"style\", `left: 50%;transform: translateX(-50%);`);\n      tooltipContent.classList.add(`before:left-[calc(50%-7px)]`);\n      tooltipContent.classList.add(`before:top-[-7px]`);\n    } else if(position == 'bottom-left') {\n      tooltipContent.classList.add(`before:left-[calc(10%-7px)]`);\n      tooltipContent.classList.add(`before:top-[-7px]`);\n    } else if(position == 'bottom-right') {\n      tooltipContent.setAttribute(\"style\", `right: 0;`);\n      tooltipContent.classList.add(`before:right-[calc(10%+7px)]`);\n      tooltipContent.classList.add(`before:top-[-7px]`);\n    } else if(position == 'left') {\n      tooltipContent.setAttribute(\"style\", `right: calc(100% + 10px);top:0;`);\n      tooltipContent.classList.add(`before:right-[-6px]`);\n      tooltipContent.classList.add(`before:top-0px`);\n    } else if(position == 'right') {\n      tooltipContent.setAttribute(\"style\", `left: calc(100% + 10px);top:0;`);\n      tooltipContent.classList.add(`before:left-[-6px]`);\n      tooltipContent.classList.add(`before:top-0px`);\n    }\n\n    if(displayOn == 'hover') {\n      tooltipContent.classList.add(`group-hover:visible`);\n    }\n  }, [content]);\n\n  useEffect(() => {\n    const tooltipContent = tooltipContentRef.current;\n\n    if(!tooltipContent) {\n      return;\n    }\n    if(displayTooltip) {\n      tooltipContent.classList.remove(`invisible`);\n    } else {\n      tooltipContent.classList.add(`invisible`);\n    }\n  }, [displayTooltip])\n\n  const onTooltipSrcClick = () => {\n    if(displayOn == 'click') {\n      setDisplayTooltip((displayTooltip) => !displayTooltip)\n    }\n  }\n\n  return (\n    <div className=\"group relative\" onClick={onTooltipSrcClick}>\n      <div className=\"cursor-pointer\" id=\"tooltip-trigger\">\n        {tooltipSrc}\n      </div>\n      <div\n        ref={tooltipContentRef}\n        id=\"tooltip-content\"\n        className=\"flex justify-center px-3 py-2 min-w-24 max-w-60\n          absolute top-[calc(100%+8px)] w-max bg-gray-800 text-white text-xs rounded-[3px]\n          before:content-[' '] before:w-3.5 before:h-3.5 before:bg-gray-800 before:inline-block\n          before:absolute before:rounded-tl-sm before:rotate-45\"\n      >\n        {content}\n      </div>\n    </div>\n  );\n};\n"],"names":["Tooltip","content","tooltipSrc","position","displayOn","displayTooltip","setDisplayTooltip","useState","tooltipContentRef","useRef","useEffect","tooltipContent","onTooltipSrcClick","jsxs","jsx"],"mappings":";;AAqBa,MAAAA,IAAU,CAAC,EAAE,SAAAC,GAAS,YAAAC,GAAY,UAAAC,IAAW,iBAAiB,WAAAC,IAAY,cAA4B;AACjH,QAAM,CAACC,GAAgBC,CAAiB,IAAIC,EAASH,MAAc,WAAW,GACxEI,IAAoBC,EAAuB,IAAI;AAErD,EAAAC,EAAU,MAAM;AACd,UAAMC,IAAiBH,EAAkB;AAEzC,IAAIG,MAIDR,KAAY,mBACEQ,EAAA,aAAa,SAAS,wCAAwC,GAC9DA,EAAA,UAAU,IAAI,6BAA6B,GAC3CA,EAAA,UAAU,IAAI,mBAAmB,KACxCR,KAAY,iBACLQ,EAAA,UAAU,IAAI,6BAA6B,GAC3CA,EAAA,UAAU,IAAI,mBAAmB,KACxCR,KAAY,kBACLQ,EAAA,aAAa,SAAS,WAAW,GACjCA,EAAA,UAAU,IAAI,8BAA8B,GAC5CA,EAAA,UAAU,IAAI,mBAAmB,KACxCR,KAAY,UACLQ,EAAA,aAAa,SAAS,iCAAiC,GACvDA,EAAA,UAAU,IAAI,qBAAqB,GACnCA,EAAA,UAAU,IAAI,gBAAgB,KACrCR,KAAY,YACLQ,EAAA,aAAa,SAAS,gCAAgC,GACtDA,EAAA,UAAU,IAAI,oBAAoB,GAClCA,EAAA,UAAU,IAAI,gBAAgB,IAG5CP,KAAa,WACCO,EAAA,UAAU,IAAI,qBAAqB;AAAA,EACpD,GACC,CAACV,CAAO,CAAC,GAEZS,EAAU,MAAM;AACd,UAAMC,IAAiBH,EAAkB;AAEzC,IAAIG,MAGDN,IACcM,EAAA,UAAU,OAAO,WAAW,IAE5BA,EAAA,UAAU,IAAI,WAAW;AAAA,EAC1C,GACC,CAACN,CAAc,CAAC;AAEnB,QAAMO,IAAoB,MAAM;AAC9B,IAAGR,KAAa,WACIE,EAAA,CAACD,MAAmB,CAACA,CAAc;AAAA,EACvD;AAGF,SACGQ,gBAAAA,EAAAA,KAAA,OAAA,EAAI,WAAU,kBAAiB,SAASD,GACvC,UAAA;AAAA,IAAAE,gBAAAA,MAAC,OAAI,EAAA,WAAU,kBAAiB,IAAG,mBAChC,UACHZ,GAAA;AAAA,IACAY,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAKN;AAAA,QACL,IAAG;AAAA,QACH,WAAU;AAAA;AAAA;AAAA;AAAA,QAKT,UAAAP;AAAA,MAAA;AAAA,IACH;AAAA,EACF,EAAA,CAAA;AAEJ;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "se-design",
-  "version": "0.0.93",
+  "version": "0.0.94",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
@@ -30,6 +30,9 @@
     "react": ">=16.9.0",
     "react-dom": ">=16.9.0"
   },
+  "publishConfig": {
+    "access": "public"
+  },
   "devDependencies": {
     "@chromatic-com/storybook": "^1.6.1",
     "@storybook/addon-essentials": "^8.2.7",