umwd-components 0.1.8 → 0.1.10

package/dist/cjs/_virtual/_rollupPluginBabelHelpers.js

@@ -0,0 +1 @@
+"use strict";function t(){return t=Object.assign?Object.assign.bind():function(t){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var e in n)Object.prototype.hasOwnProperty.call(n,e)&&(t[e]=n[e])}return t},t.apply(this,arguments)}exports.extends=t;

package/dist/cjs/node_modules/style-inject/dist/style-inject.es.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=function(e,t){void 0===t&&(t={});var d=t.insertAt;if(e&&"undefined"!=typeof document){var s=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===d&&s.firstChild?s.insertBefore(n,s.firstChild):s.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}};

package/dist/cjs/src/components/Button.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("prop-types");function o({label:r,backgroundColor:o="red",size:n="md",onClick:t}){let l=1;"sm"===n&&(l=.75),"lg"===n&&(l=1.25);const s={backgroundColor:o,padding:`${.5*l}rem ${1*l}rem`,border:"none"};return e.createElement("button",{style:s,onClick:t},r)}o.propTypes={label:r.string,backgroundColor:r.string,size:r.oneOf(["sm","md","lg"]),onClick:r.func},exports.default=o;

package/dist/cjs/src/components/Checkmark/Checkmark.js

@@ -0,0 +1 @@
+"use strict";var e=require("react");exports.Checkmark=()=>e.createElement("svg",{className:"checkmark",viewBox:"0 0 52 52"},e.createElement("circle",{className:"checkmark__circle",cx:"26",cy:"26",r:"25",fill:"none"}),e.createElement("path",{className:"checkmark__check",fill:"none",d:"M14.1 27.2l7.1 7.2 16.7-16.8"}));

package/dist/cjs/src/components/NavBar/NavBar.js

@@ -0,0 +1,2 @@
+"use client";
+"use strict";var e=require("react"),t=require("next/link"),a=require("@mui/material"),r=require("@mui/icons-material/Close"),l=require("@mui/icons-material/MoreVert");exports.NavBar=({site_title:n,logo:o,pages:c})=>{const[x,i]=e.useState(!1),s=e=>{i(!1)};return React.createElement(a.AppBar,{position:"sticky"},React.createElement(a.Container,{maxWidth:"xl"},React.createElement(a.Toolbar,{disableGutters:!0,sx:{py:1}},React.createElement(t,{href:"/",style:{textDecoration:"none",color:"unset"}},React.createElement(a.Box,{sx:{display:{xs:"none",md:"flex"},cursor:"pointer",alignItems:"center"}},React.createElement(a.Box,{sx:{display:"flex",mr:1}},React.createElement("img",{src:o.url,width:o.width||"32px",height:o.height||"32px",alt:"site logo",style:{maxWidth:"60px",maxHeight:"60px"}})),void 0!==n&&React.createElement(a.Typography,{variant:"h6",noWrap:!0,component:"h1",sx:{display:"flex",textDecoration:"none"}},n))),React.createElement(a.Box,{sx:{flexGrow:1,display:{xs:"none",md:"flex"},alignItems:"center"}},c.map((e=>React.createElement(a.Button,{key:e.name,onClick:()=>e.action(),sx:{my:2,color:"primary.contrastText",display:"block"}},e.name)))),React.createElement(t,{href:"/",style:{textDecoration:"none",color:"unset"}},React.createElement(a.Box,{sx:{display:{xs:"flex",md:"none"},alignItems:"center"}},void 0!==o.url&&React.createElement(a.Box,{sx:{display:"flex",mr:1}},React.createElement("img",{src:o.url,width:o.width||"32px",height:o.height||"32px",alt:o.alt||"site logo",style:{maxWidth:"60px",maxHeight:"60px"}})),void 0!==n&&React.createElement(a.Typography,{variant:"h5",noWrap:!0,component:"h1",sx:{display:"flex",flexGrow:1}},n))),React.createElement(a.Box,{sx:{display:{xs:"flex",md:"none"},flexGrow:1}}),React.createElement(a.Box,{sx:{flexGrow:0,display:{xs:"flex",md:"none"}}},React.createElement(a.Button,{onClick:e=>{i(!0)},sx:{width:"40px",height:"40px",borderRadius:"50%",p:0,minWidth:"unset",color:"primary.contrastText",boxShadow:"0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)"}},React.createElement(l,{sx:{color:"primary.contrastText"}})),React.createElement(a.Dialog,{fullScreen:!0,open:x,onClose:s},React.createElement(a.AppBar,{position:"sticky"},React.createElement(a.Container,{maxWidth:"xl"},React.createElement(a.Toolbar,{disableGutters:!0,sx:{py:1,justifyContent:"space-between"}},React.createElement(t,{href:"/",style:{textDecoration:"none",color:"unset"}},React.createElement(a.Box,{sx:{display:"flex",flexDirection:"row",alignItems:"center"}},React.createElement(a.Box,{sx:{display:"flex",mr:1}},React.createElement("img",{src:o.url,alt:o.alt||"logo",width:o.width||"32px",height:o.height||"32px",style:{maxWidth:"60px",maxHeight:"60px"}})),React.createElement(a.Typography,{variant:"h5",noWrap:!0,component:"h1",sx:{display:"flex",flexGrow:1}},void 0!==n&&n))),React.createElement(a.Button,{onClick:s,sx:{width:"40px",height:"40px",borderRadius:"50%",p:0,minWidth:"unset",color:"primary.contrastText",boxShadow:"0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)"},"aria-label":"close"},React.createElement(r,{sx:{color:"primary.contrastText"}}))))),React.createElement(a.List,null,c.map((e=>React.createElement(React.Fragment,null,React.createElement(a.ListItem,{key:e.name,onClick:()=>{e.action(),s()}},React.createElement(a.ListItemText,{primary:e.name})),React.createElement(a.Divider,null))))))))))};

package/dist/cjs/src/components/NoteTextField/NoteTextField.js

@@ -0,0 +1 @@
+"use strict";var e=require("../../../_virtual/_rollupPluginBabelHelpers.js"),r=require("react"),t=require("@mui/material");exports.NoteTextField=a=>r.createElement(t.TextField,e.extends({},a,{sx:{background:"linear-gradient(45deg, rgba(251,246,137,1) 30%, rgba(252,242,138,1) 90%)"}}));

package/dist/cjs/src/components/Requirement/Requirement.js

@@ -0,0 +1 @@
+"use strict";var e=require("../Xmark/Xmark.js"),r=require("../Checkmark/Checkmark.js"),t=require("react");exports.Requirement=({value:a,requirement:m})=>{const[l,c]=t.useState();return t.useEffect((()=>{c(m.validator(a))}),[a,m]),t.createElement("div",{className:"requirement"},l?t.createElement(r.Checkmark,null):t.createElement(e.Xmark,null),t.createElement("p",{className:l?"valid":"invalid"},m.text))};

package/dist/cjs/src/components/Requirements/Requirements.js

@@ -0,0 +1 @@
+"use strict";require("../../styles.css.js");var e=require("../Requirement/Requirement.js"),r=require("react");exports.Requirements=({value:t,requirements:u,onValidChange:a})=>{const s=r.useCallback(a,[]);return r.useEffect((()=>{s(u.every((e=>e.validator(t))))}),[t,u,s]),u.map(((u,s)=>r.createElement(e.Requirement,{key:s,value:t,requirement:u,onValidChange:a})))};

package/dist/cjs/src/components/Stack.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("prop-types");function o({children:r,spacing:o=2,direction:p="row",wrap:t=!1}){const i={display:"flex",gap:.25*o+"rem",flexWrap:t?"wrap":"nowrap",flexDirection:p};return e.createElement("div",{style:i},r)}o.propTypes={spacing:r.number,wrap:r.bool,direction:r.oneOf(["row","column"])},exports.default=o;

package/dist/cjs/src/components/Xmark/Xmark.js

@@ -0,0 +1 @@
+"use strict";var e=require("react");exports.Xmark=()=>e.createElement("svg",{x:"0px",y:"0px",width:"15px",height:"15px",viewBox:"0 0 122.879 122.879",enableBackground:"new 0 0 122.879 122.879"},e.createElement("g",null,e.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",fill:"#FF4141",d:"M61.44,0c33.933,0,61.439,27.507,61.439,61.439 s-27.506,61.439-61.439,61.439C27.507,122.879,0,95.372,0,61.439S27.507,0,61.44,0L61.44,0z M73.451,39.151 c2.75-2.793,7.221-2.805,9.986-0.027c2.764,2.776,2.775,7.292,0.027,10.083L71.4,61.445l12.076,12.249 c2.729,2.77,2.689,7.257-0.08,10.022c-2.773,2.765-7.23,2.758-9.955-0.013L61.446,71.54L49.428,83.728 c-2.75,2.793-7.22,2.805-9.986,0.027c-2.763-2.776-2.776-7.293-0.027-10.084L51.48,61.434L39.403,49.185 c-2.728-2.769-2.689-7.256,0.082-10.022c2.772-2.765,7.229-2.758,9.953,0.013l11.997,12.165L73.451,39.151L73.451,39.151z"})));

package/dist/cjs/src/index.js

@@ -0,0 +1 @@
+"use strict";var e=require("./components/Requirements/Requirements.js"),t=require("./components/NoteTextField/NoteTextField.js"),r=require("./components/Button.js"),o=require("./components/Stack.js"),s=require("./components/NavBar/NavBar.js");exports.Requirements=e.Requirements,exports.NoteTextField=t.NoteTextField,exports.Button=r.default,exports.Stack=o.default,exports.NavBar=s.NavBar;

package/dist/cjs/src/styles.css.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=".requirement{align-items:center;display:flex;height:35px}.requirement p{font-family:sans-serif;font-size:14px;font-weight:700;margin-left:10px}.invalid{color:red}.valid{color:#7ac142}.checkmark{stroke-width:5;stroke:#fff;stroke-miterlimit:10;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both;border-radius:50%;box-shadow:inset 0 0 0 #7ac142;display:block;height:15px;width:15px}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#7ac142;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .2s cubic-bezier(.65,0,.45,1) .5s forwards;transform-origin:50% 50%}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #7ac142}}";require("../node_modules/style-inject/dist/style-inject.es.js").default(e),exports.default=e;

package/dist/esm/_virtual/_rollupPluginBabelHelpers.js

@@ -0,0 +1 @@
+function t(){return t=Object.assign?Object.assign.bind():function(t){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var e in r)Object.prototype.hasOwnProperty.call(r,e)&&(t[e]=r[e])}return t},t.apply(this,arguments)}export{t as extends};

package/dist/esm/node_modules/style-inject/dist/style-inject.es.js

@@ -0,0 +1 @@
+function e(e,t){void 0===t&&(t={});var d=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===d&&n.firstChild?n.insertBefore(s,n.firstChild):n.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}export{e as default};

package/dist/esm/src/components/Button.js

@@ -0,0 +1 @@
+import o from"react";import r from"prop-types";function e({label:r,backgroundColor:e="red",size:n="md",onClick:t}){let l=1;"sm"===n&&(l=.75),"lg"===n&&(l=1.25);const c={backgroundColor:e,padding:`${.5*l}rem ${1*l}rem`,border:"none"};return o.createElement("button",{style:c,onClick:t},r)}e.propTypes={label:r.string,backgroundColor:r.string,size:r.oneOf(["sm","md","lg"]),onClick:r.func};export{e as default};

package/dist/esm/src/components/Checkmark/Checkmark.js

@@ -0,0 +1 @@
+import e from"react";const c=()=>e.createElement("svg",{className:"checkmark",viewBox:"0 0 52 52"},e.createElement("circle",{className:"checkmark__circle",cx:"26",cy:"26",r:"25",fill:"none"}),e.createElement("path",{className:"checkmark__check",fill:"none",d:"M14.1 27.2l7.1 7.2 16.7-16.8"}));export{c as Checkmark};

package/dist/esm/src/components/NavBar/NavBar.js

@@ -0,0 +1,2 @@
+"use client";
+import{useState as e}from"react";import t from"next/link";import{AppBar as a,Container as r,Toolbar as l,Box as n,Typography as c,Button as o,Dialog as x,List as i,ListItem as m,ListItemText as s,Divider as p}from"@mui/material";import d from"@mui/icons-material/Close";import h from"@mui/icons-material/MoreVert";const R=({site_title:R,logo:E,pages:y})=>{const[g,f]=e(!1),u=e=>{f(!1)};return React.createElement(a,{position:"sticky"},React.createElement(r,{maxWidth:"xl"},React.createElement(l,{disableGutters:!0,sx:{py:1}},React.createElement(t,{href:"/",style:{textDecoration:"none",color:"unset"}},React.createElement(n,{sx:{display:{xs:"none",md:"flex"},cursor:"pointer",alignItems:"center"}},React.createElement(n,{sx:{display:"flex",mr:1}},React.createElement("img",{src:E.url,width:E.width||"32px",height:E.height||"32px",alt:"site logo",style:{maxWidth:"60px",maxHeight:"60px"}})),void 0!==R&&React.createElement(c,{variant:"h6",noWrap:!0,component:"h1",sx:{display:"flex",textDecoration:"none"}},R))),React.createElement(n,{sx:{flexGrow:1,display:{xs:"none",md:"flex"},alignItems:"center"}},y.map((e=>React.createElement(o,{key:e.name,onClick:()=>e.action(),sx:{my:2,color:"primary.contrastText",display:"block"}},e.name)))),React.createElement(t,{href:"/",style:{textDecoration:"none",color:"unset"}},React.createElement(n,{sx:{display:{xs:"flex",md:"none"},alignItems:"center"}},void 0!==E.url&&React.createElement(n,{sx:{display:"flex",mr:1}},React.createElement("img",{src:E.url,width:E.width||"32px",height:E.height||"32px",alt:E.alt||"site logo",style:{maxWidth:"60px",maxHeight:"60px"}})),void 0!==R&&React.createElement(c,{variant:"h5",noWrap:!0,component:"h1",sx:{display:"flex",flexGrow:1}},R))),React.createElement(n,{sx:{display:{xs:"flex",md:"none"},flexGrow:1}}),React.createElement(n,{sx:{flexGrow:0,display:{xs:"flex",md:"none"}}},React.createElement(o,{onClick:e=>{f(!0)},sx:{width:"40px",height:"40px",borderRadius:"50%",p:0,minWidth:"unset",color:"primary.contrastText",boxShadow:"0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)"}},React.createElement(h,{sx:{color:"primary.contrastText"}})),React.createElement(x,{fullScreen:!0,open:g,onClose:u},React.createElement(a,{position:"sticky"},React.createElement(r,{maxWidth:"xl"},React.createElement(l,{disableGutters:!0,sx:{py:1,justifyContent:"space-between"}},React.createElement(t,{href:"/",style:{textDecoration:"none",color:"unset"}},React.createElement(n,{sx:{display:"flex",flexDirection:"row",alignItems:"center"}},React.createElement(n,{sx:{display:"flex",mr:1}},React.createElement("img",{src:E.url,alt:E.alt||"logo",width:E.width||"32px",height:E.height||"32px",style:{maxWidth:"60px",maxHeight:"60px"}})),React.createElement(c,{variant:"h5",noWrap:!0,component:"h1",sx:{display:"flex",flexGrow:1}},void 0!==R&&R))),React.createElement(o,{onClick:u,sx:{width:"40px",height:"40px",borderRadius:"50%",p:0,minWidth:"unset",color:"primary.contrastText",boxShadow:"0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)"},"aria-label":"close"},React.createElement(d,{sx:{color:"primary.contrastText"}}))))),React.createElement(i,null,y.map((e=>React.createElement(React.Fragment,null,React.createElement(m,{key:e.name,onClick:()=>{e.action(),u()}},React.createElement(s,{primary:e.name})),React.createElement(p,null))))))))))};export{R as NavBar};

package/dist/esm/src/components/NoteTextField/NoteTextField.js

@@ -0,0 +1 @@
+import{extends as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import e from"react";import{TextField as a}from"@mui/material";const t=t=>e.createElement(a,r({},t,{sx:{background:"linear-gradient(45deg, rgba(251,246,137,1) 30%, rgba(252,242,138,1) 90%)"}}));export{t as NoteTextField};

package/dist/esm/src/components/Requirement/Requirement.js

@@ -0,0 +1 @@
+import{Xmark as e}from"../Xmark/Xmark.js";import{Checkmark as r}from"../Checkmark/Checkmark.js";import t,{useState as a,useEffect as m}from"react";const l=({value:l,requirement:n})=>{const[c,i]=a();return m((()=>{i(n.validator(l))}),[l,n]),t.createElement("div",{className:"requirement"},c?t.createElement(r,null):t.createElement(e,null),t.createElement("p",{className:c?"valid":"invalid"},n.text))};export{l as Requirement};

package/dist/esm/src/components/Requirements/Requirements.js

@@ -0,0 +1 @@
+import"../../styles.css.js";import{Requirement as e}from"../Requirement/Requirement.js";import r,{useCallback as t,useEffect as n}from"react";const a=({value:a,requirements:m,onValidChange:o})=>{const i=t(o,[]);return n((()=>{i(m.every((e=>e.validator(a))))}),[a,m,i]),m.map(((t,n)=>r.createElement(e,{key:n,value:a,requirement:t,onValidChange:o})))};export{a as Requirements};

package/dist/esm/src/components/Stack.js

@@ -0,0 +1 @@
+import r from"react";import e from"prop-types";function o({children:e,spacing:o=2,direction:p="row",wrap:n=!1}){const t={display:"flex",gap:.25*o+"rem",flexWrap:n?"wrap":"nowrap",flexDirection:p};return r.createElement("div",{style:t},e)}o.propTypes={spacing:e.number,wrap:e.bool,direction:e.oneOf(["row","column"])};export{o as default};

package/dist/esm/src/components/Xmark/Xmark.js

@@ -0,0 +1 @@
+import e from"react";const c=()=>e.createElement("svg",{x:"0px",y:"0px",width:"15px",height:"15px",viewBox:"0 0 122.879 122.879",enableBackground:"new 0 0 122.879 122.879"},e.createElement("g",null,e.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",fill:"#FF4141",d:"M61.44,0c33.933,0,61.439,27.507,61.439,61.439 s-27.506,61.439-61.439,61.439C27.507,122.879,0,95.372,0,61.439S27.507,0,61.44,0L61.44,0z M73.451,39.151 c2.75-2.793,7.221-2.805,9.986-0.027c2.764,2.776,2.775,7.292,0.027,10.083L71.4,61.445l12.076,12.249 c2.729,2.77,2.689,7.257-0.08,10.022c-2.773,2.765-7.23,2.758-9.955-0.013L61.446,71.54L49.428,83.728 c-2.75,2.793-7.22,2.805-9.986,0.027c-2.763-2.776-2.776-7.293-0.027-10.084L51.48,61.434L39.403,49.185 c-2.728-2.769-2.689-7.256,0.082-10.022c2.772-2.765,7.229-2.758,9.953,0.013l11.997,12.165L73.451,39.151L73.451,39.151z"})));export{c as Xmark};

package/dist/esm/src/index.js

@@ -0,0 +1 @@
+export{Requirements}from"./components/Requirements/Requirements.js";export{NoteTextField}from"./components/NoteTextField/NoteTextField.js";export{default as Button}from"./components/Button.js";export{default as Stack}from"./components/Stack.js";export{NavBar}from"./components/NavBar/NavBar.js";

package/dist/esm/src/styles.css.js

@@ -0,0 +1 @@
+import e from"../node_modules/style-inject/dist/style-inject.es.js";var s=".requirement{align-items:center;display:flex;height:35px}.requirement p{font-family:sans-serif;font-size:14px;font-weight:700;margin-left:10px}.invalid{color:red}.valid{color:#7ac142}.checkmark{stroke-width:5;stroke:#fff;stroke-miterlimit:10;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both;border-radius:50%;box-shadow:inset 0 0 0 #7ac142;display:block;height:15px;width:15px}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#7ac142;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .2s cubic-bezier(.65,0,.45,1) .5s forwards;transform-origin:50% 50%}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #7ac142}}";e(s);export{s as default};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "umwd-components",
-  "version": "0.1.8",
+  "version": "0.1.10",
   "description": "UMWD Component library",
   "main": "dist/index.js",
   "module": "dist/index.es.js",
@@ -34,9 +34,9 @@
     ]
   },
   "devDependencies": {
+    "@babel/preset-react": "7.23.3",
     "@emotion/react": "^11.11.3",
     "@emotion/styled": "^11.11.0",
-    "@babel/preset-react": "7.23.3",
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-node-resolve": "^15.2.3",
     "@rollup/plugin-terser": "^0.4.4",
@@ -59,6 +59,7 @@
     "rollup": "^4.9.2",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-postcss": "^4.0.2",
+    "rollup-plugin-preserve-directives": "^0.4.0",
     "storybook": "^7.6.7",
     "web-vitals": "^3.5.1",
     "webpack": "^5.89.0"

package/rollup.config.mjs

@@ -3,19 +3,27 @@ import resolve from "@rollup/plugin-node-resolve";
 import external from "rollup-plugin-peer-deps-external";
 import terser from "@rollup/plugin-terser";
 import postcss from "rollup-plugin-postcss";
+import preserveDirectives from 'rollup-plugin-preserve-directives';
+
+const outputOptions = {
+  exports: 'named',
+  preserveModules: true
+}
+
 
 const config = [
   {
     input: "./src/index.js",
     output: [
       {
-        file: "dist/index.js",
+        dir: "dist/cjs",
         format: "cjs",
+        ...outputOptions
       },
       {
-        file: "dist/index.es.js",
-        format: "es",
-        exports: "named",
+        dir: "dist/esm",
+        format: "esm",
+        ...outputOptions
       },
     ],
     plugins: [
@@ -29,10 +37,10 @@ const config = [
       }),
       external(),
       resolve(),
+      preserveDirectives(),
       terser(),
     ],
   },
 ];
 
-export default config;
-
+export default config;

package/src/components/NavBar/NavBar.js

@@ -1,3 +1,5 @@
+'use client';
+
 import { useState } from "react";
 import Link from "next/link";