@stfrigerio/sito-template 0.1.36 → 0.1.37

package/storybook-static/assets/EditFAB-CntUhqRB.css

@@ -0,0 +1 @@
+._fab_1ffxw_2{width:56px;height:56px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px #0000001f,0 2px 4px #00000014;outline:none;font-size:24px;font-weight:500;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:relative;overflow:hidden;z-index:1000;transition:box-shadow .2s ease}._fab_1ffxw_2:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff4d;transform:translate(-50%,-50%);transition:width .3s ease,height .3s ease}._fab_1ffxw_2:active:before{width:100%;height:100%}._fab_1ffxw_2:hover:not(:disabled){box-shadow:0 8px 24px #00000026,0 4px 8px #0000001a}._fab_1ffxw_2:active:not(:disabled){box-shadow:0 2px 8px #00000026,0 1px 2px #0000001a}._fab_1ffxw_2:disabled{opacity:.6;cursor:not-allowed}._primary_1ffxw_54{background:linear-gradient(135deg,#667eea,#764ba2);color:var(--color-white)}._primary_1ffxw_54:hover:not(:disabled){background:linear-gradient(135deg,#7c8fff,#8e5fc4);box-shadow:0 8px 24px #667eea66,0 4px 8px #764ba233}._secondary_1ffxw_64{background:linear-gradient(135deg,#e0e0e0,#b0b0b0);color:var(--color-text-primary)}._secondary_1ffxw_64:hover:not(:disabled){background:linear-gradient(135deg,#f0f0f0,silver);box-shadow:0 8px 24px #0000001f,0 4px 8px #00000014}._success_1ffxw_74{background:linear-gradient(135deg,#84fab0,#8fd3f4);color:var(--color-white)}._success_1ffxw_74:hover:not(:disabled){background:linear-gradient(135deg,#96ffc1,#a3e0ff);box-shadow:0 8px 24px #84fab066,0 4px 8px #8fd3f433}._loader_1ffxw_85{width:24px;height:24px;border:3px solid rgba(255,255,255,.2);border-top-color:#ffffffe6;border-right-color:#ffffffb3;border-bottom-color:#fff6;border-radius:50%;animation:_spin_1ffxw_1 .8s cubic-bezier(.68,-.55,.265,1.55) infinite}@keyframes _spin_1ffxw_1{0%{transform:rotate(0)}to{transform:rotate(360deg)}}._draggable_1ffxw_102{cursor:move;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}._dragging_1ffxw_110{cursor:grabbing!important;opacity:.8;box-shadow:0 12px 32px #00000040,0 6px 12px #00000026;z-index:10000}@media (max-width: 768px){._fab_1ffxw_2{width:48px;height:48px;font-size:20px}._loader_1ffxw_85{width:20px;height:20px}}

package/storybook-static/assets/EditFAB.stories-CmfJxWns.js

@@ -0,0 +1,408 @@
+import{r as i,j as e}from"./iframe-BUaP2gIF.js";import{m as be}from"./proxy-9Y4F2rF8.js";import"./preload-helper-C1FmrZbK.js";/**
+ * @license lucide-react v0.539.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const Me=n=>n.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase(),Se=n=>n.replace(/^([A-Z])|[\s-_]+(\w)/g,(t,s,a)=>a?a.toUpperCase():s.toLowerCase()),B=n=>{const t=Se(n);return t.charAt(0).toUpperCase()+t.slice(1)},ue=(...n)=>n.filter((t,s,a)=>!!t&&t.trim()!==""&&a.indexOf(t)===s).join(" ").trim(),ye=n=>{for(const t in n)if(t.startsWith("aria-")||t==="role"||t==="title")return!0};/**
+ * @license lucide-react v0.539.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */var Ce={xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};/**
+ * @license lucide-react v0.539.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const we=i.forwardRef(({color:n="currentColor",size:t=24,strokeWidth:s=2,absoluteStrokeWidth:a,className:u="",children:o,iconNode:l,...c},E)=>i.createElement("svg",{ref:E,...Ce,width:t,height:t,stroke:n,strokeWidth:a?Number(s)*24/Number(t):s,className:ue("lucide",u),...!o&&!ye(c)&&{"aria-hidden":"true"},...c},[...l.map(([g,v])=>i.createElement(g,v)),...Array.isArray(o)?o:[o]]));/**
+ * @license lucide-react v0.539.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const D=(n,t)=>{const s=i.forwardRef(({className:a,...u},o)=>i.createElement(we,{ref:o,iconNode:t,className:ue(`lucide-${Me(B(n))}`,`lucide-${n}`,a),...u}));return s.displayName=B(n),s};/**
+ * @license lucide-react v0.539.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const Ue=[["path",{d:"M20 6 9 17l-5-5",key:"1gmf2c"}]],je=D("check",Ue);/**
+ * @license lucide-react v0.539.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const ke=[["path",{d:"M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7",key:"1m0v6g"}],["path",{d:"M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z",key:"ohrbg2"}]],Te=D("square-pen",ke);/**
+ * @license lucide-react v0.539.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const _e=[["path",{d:"M18 6 6 18",key:"1bl5f8"}],["path",{d:"m6 6 12 12",key:"d8bk6v"}]],Ie=D("x",_e),Re="_fab_1ffxw_2",ze="_primary_1ffxw_54",Ae="_secondary_1ffxw_64",He="_success_1ffxw_74",De="_loader_1ffxw_85",Be="_draggable_1ffxw_102",Le="_dragging_1ffxw_110",p={fab:Re,primary:ze,secondary:Ae,success:He,loader:De,draggable:Be,dragging:Le},m=({canEdit:n,isEditMode:t,hasUnsavedChanges:s=!1,isSaving:a=!1,onEnterEditMode:u,onExitEditMode:o,position:l={bottom:32,right:32}})=>{const[c,E]=i.useState(!1),[g,v]=i.useState(null),[d,r]=i.useState(!1),x=i.useRef(null),b=i.useRef(null),M=i.useRef(null);i.useEffect(()=>{const h=()=>{E(window.innerWidth<=768)};return h(),window.addEventListener("resize",h),()=>{window.removeEventListener("resize",h)}},[]);const ge=h=>{var y;if(!c)return;const S=h.touches[0],f=(y=x.current)==null?void 0:y.getBoundingClientRect();f&&(b.current={x:S.clientX,y:S.clientY},M.current={x:f.left+f.width/2,y:f.top+f.height/2},r(!0))},he=h=>{if(!d||!b.current||!M.current)return;h.preventDefault();const S=h.touches[0],f=S.clientX-b.current.x,y=S.clientY-b.current.y;let A=M.current.x+f,H=M.current.y+y;const C=30;A=Math.max(C,Math.min(window.innerWidth-C,A)),H=Math.max(C,Math.min(window.innerHeight-C,H)),v({x:A,y:H})},pe=()=>{r(!1),b.current=null,M.current=null},me=h=>{!d&&!a&&(t?o():u())};if(!n)return null;const Ee=()=>g?{position:"fixed",left:`${g.x}px`,top:`${g.y}px`,transform:"translate(-50%, -50%)",touchAction:"none"}:{position:"fixed",...l,touchAction:c?"none":"auto"},ve=()=>a?p.primary:t?s?p.success:p.secondary:p.primary,fe=()=>a?e.jsx("div",{className:p.loader}):t?s?e.jsx(je,{size:24}):e.jsx(Ie,{size:24}):e.jsx(Te,{size:24}),xe=()=>a?"Saving changes":t?s?"Save and exit edit mode":"Exit edit mode":"Enter edit mode";return e.jsx(be.button,{ref:x,className:`${p.fab} ${ve()} ${c?p.draggable:""} ${d?p.dragging:""}`,style:Ee(),onClick:me,onTouchStart:ge,onTouchMove:he,onTouchEnd:pe,disabled:a,"aria-label":xe(),initial:{scale:0,opacity:0},animate:{scale:1,opacity:1},exit:{scale:0,opacity:0},whileHover:!a&&!d?{scale:1.1}:{},whileTap:!a&&!d?{scale:.9}:{},transition:{type:"spring",stiffness:260,damping:20},children:fe()})};m.__docgenInfo={description:"",methods:[],displayName:"EditFAB",props:{canEdit:{required:!0,tsType:{name:"boolean"},description:""},isEditMode:{required:!0,tsType:{name:"boolean"},description:""},hasUnsavedChanges:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},isSaving:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},onEnterEditMode:{required:!0,tsType:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},description:""},onExitEditMode:{required:!0,tsType:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},description:""},position:{required:!1,tsType:{name:"signature",type:"object",raw:`{
+    bottom?: string | number;
+    right?: string | number;
+    top?: string | number;
+    left?: string | number;
+}`,signature:{properties:[{key:"bottom",value:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}],required:!1}},{key:"right",value:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}],required:!1}},{key:"top",value:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}],required:!1}},{key:"left",value:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}],required:!1}}]}},description:"",defaultValue:{value:"{ bottom: 32, right: 32 }",computed:!1}}}};const qe={title:"Molecules/EditFAB",component:m,parameters:{layout:"fullscreen",docs:{description:{component:"A floating action button for edit mode with touch-friendly mobile dragging support and state management."}}},tags:["autodocs"],argTypes:{canEdit:{control:"boolean",description:"Whether the user has permission to edit"},isEditMode:{control:"boolean",description:"Whether edit mode is currently active"},hasUnsavedChanges:{control:"boolean",description:"Whether there are unsaved changes"},isSaving:{control:"boolean",description:"Whether a save operation is in progress"},position:{control:"object",description:"CSS positioning properties for the FAB"},onEnterEditMode:{action:"enter-edit-mode"},onExitEditMode:{action:"exit-edit-mode"}}},w={args:{canEdit:!0,isEditMode:!1,hasUnsavedChanges:!1,isSaving:!1,onEnterEditMode:()=>{},onExitEditMode:()=>{}}},U={args:{canEdit:!0,isEditMode:!0,hasUnsavedChanges:!1,isSaving:!1,onEnterEditMode:()=>{},onExitEditMode:()=>{}}},j={args:{canEdit:!0,isEditMode:!0,hasUnsavedChanges:!0,isSaving:!1,onEnterEditMode:()=>{},onExitEditMode:()=>{}}},k={args:{canEdit:!0,isEditMode:!0,hasUnsavedChanges:!0,isSaving:!0,onEnterEditMode:()=>{},onExitEditMode:()=>{}}},T={args:{canEdit:!1,isEditMode:!1,hasUnsavedChanges:!1,isSaving:!1,onEnterEditMode:()=>{},onExitEditMode:()=>{}}},_={args:{canEdit:!0,isEditMode:!1,hasUnsavedChanges:!1,isSaving:!1,position:{top:32,left:32},onEnterEditMode:()=>{},onExitEditMode:()=>{}}},I={args:{canEdit:!0,isEditMode:!1,hasUnsavedChanges:!1,isSaving:!1,onEnterEditMode:()=>{},onExitEditMode:()=>{}},render:()=>{const[n,t]=i.useState(!1),[s,a]=i.useState(!1),[u,o]=i.useState(!1),[l,c]=i.useState("Click the edit button to start editing this content."),E=()=>{t(!0),a(!1)},g=async()=>{s&&(o(!0),await new Promise(d=>setTimeout(d,2e3)),o(!1)),t(!1),a(!1)},v=d=>{c(d),a(!0)};return e.jsxs("div",{style:{position:"relative",height:"100vh",padding:"2rem",background:"linear-gradient(135deg, #667eea 0%, #764ba2 100%)",color:"white"},children:[e.jsxs("div",{style:{maxWidth:"600px",margin:"0 auto",padding:"2rem",background:"rgba(255, 255, 255, 0.1)",borderRadius:"12px",backdropFilter:"blur(10px)"},children:[e.jsx("h1",{style:{marginTop:0},children:"Interactive Edit Demo"}),n?e.jsxs("div",{children:[e.jsx("textarea",{value:l,onChange:d=>v(d.target.value),style:{width:"100%",height:"200px",padding:"1rem",border:"none",borderRadius:"8px",fontSize:"1rem",resize:"vertical"},placeholder:"Enter your content here..."}),e.jsx("p",{style:{fontSize:"0.875rem",opacity:.8,marginTop:"0.5rem"},children:s?"⚠️ You have unsaved changes":"✅ No changes"})]}):e.jsx("div",{style:{padding:"1rem",background:"rgba(255, 255, 255, 0.1)",borderRadius:"8px",lineHeight:1.6},children:l}),e.jsxs("div",{style:{marginTop:"2rem",fontSize:"0.875rem",opacity:.8},children:[e.jsxs("p",{children:["Mode: ",n?"Edit Mode":"View Mode"]}),e.jsxs("p",{children:["Status: ",u?"Saving...":s?"Unsaved Changes":"Saved"]})]})]}),e.jsx(m,{canEdit:!0,isEditMode:n,hasUnsavedChanges:s,isSaving:u,onEnterEditMode:E,onExitEditMode:g})]})},parameters:{controls:{disable:!0}}},R={args:{canEdit:!0,isEditMode:!1,hasUnsavedChanges:!1,isSaving:!1,onEnterEditMode:()=>{},onExitEditMode:()=>{}},render:()=>{const[n,t]=i.useState(!1),[s,a]=i.useState(!1),[u,o]=i.useState(!1),[l,c]=i.useState({title:"Project Documentation",content:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",lastSaved:new Date().toLocaleTimeString()}),E=()=>{t(!0),a(!1)},g=async()=>{s&&(o(!0),await new Promise(r=>setTimeout(r,1500)),c(r=>({...r,lastSaved:new Date().toLocaleTimeString()})),o(!1)),t(!1),a(!1)},v=r=>{c(x=>({...x,title:r})),a(!0)},d=r=>{c(x=>({...x,content:r})),a(!0)};return e.jsxs("div",{style:{position:"relative",height:"100vh",background:"#f5f5f5"},children:[e.jsxs("div",{style:{maxWidth:"800px",margin:"0 auto",padding:"2rem",background:"white",minHeight:"100vh",boxShadow:"0 0 20px rgba(0,0,0,0.1)"},children:[e.jsxs("div",{style:{borderBottom:"2px solid #e9ecef",paddingBottom:"1rem",marginBottom:"2rem"},children:[n?e.jsx("input",{type:"text",value:l.title,onChange:r=>v(r.target.value),style:{fontSize:"2rem",fontWeight:"bold",border:"2px solid #007bff",outline:"none",width:"100%",padding:"0.5rem",borderRadius:"4px"}}):e.jsx("h1",{style:{margin:0,fontSize:"2rem"},children:l.title}),e.jsxs("p",{style:{margin:"0.5rem 0 0",fontSize:"0.875rem",color:"#6c757d"},children:["Last saved: ",l.lastSaved," | Status: ",u?"Saving...":s?"Unsaved changes":"All changes saved"]})]}),n?e.jsx("textarea",{value:l.content,onChange:r=>d(r.target.value),style:{width:"100%",height:"400px",padding:"1rem",border:"2px solid #007bff",borderRadius:"8px",fontSize:"1rem",lineHeight:1.6,resize:"vertical",fontFamily:"inherit"},placeholder:"Start writing your document..."}):e.jsx("div",{style:{padding:"1rem",lineHeight:1.8,fontSize:"1rem",minHeight:"400px",whiteSpace:"pre-wrap"},children:l.content}),n&&e.jsx("div",{style:{marginTop:"1rem",padding:"1rem",background:s?"#fff3cd":"#d1edff",borderRadius:"8px",fontSize:"0.875rem"},children:s?e.jsx(e.Fragment,{children:"⚠️ You have unsaved changes. Click the save button to save your work."}):e.jsx(e.Fragment,{children:"✅ All changes saved."})})]}),e.jsx(m,{canEdit:!0,isEditMode:n,hasUnsavedChanges:s,isSaving:u,onEnterEditMode:E,onExitEditMode:g,position:{bottom:32,right:32}})]})},parameters:{controls:{disable:!0}}},z={args:{canEdit:!0,isEditMode:!1,hasUnsavedChanges:!1,isSaving:!1,onEnterEditMode:()=>{},onExitEditMode:()=>{}},render:()=>e.jsx("div",{style:{position:"relative",height:"100vh",background:"#f8f9fa",padding:"2rem"},children:e.jsxs("div",{style:{display:"grid",gridTemplateColumns:"repeat(auto-fit, minmax(300px, 1fr))",gap:"2rem",maxWidth:"1200px",margin:"0 auto"},children:[e.jsxs("div",{style:{padding:"1.5rem",background:"white",borderRadius:"8px",boxShadow:"0 2px 8px rgba(0,0,0,0.1)"},children:[e.jsx("h3",{children:"View Mode"}),e.jsx("p",{children:"Default state when not editing"}),e.jsx(m,{canEdit:!0,isEditMode:!1,hasUnsavedChanges:!1,isSaving:!1,onEnterEditMode:()=>{},onExitEditMode:()=>{},position:{bottom:16,right:16}})]}),e.jsxs("div",{style:{padding:"1.5rem",background:"white",borderRadius:"8px",boxShadow:"0 2px 8px rgba(0,0,0,0.1)"},children:[e.jsx("h3",{children:"Edit Mode (No Changes)"}),e.jsx("p",{children:"In edit mode but no changes made yet"}),e.jsx(m,{canEdit:!0,isEditMode:!0,hasUnsavedChanges:!1,isSaving:!1,onEnterEditMode:()=>{},onExitEditMode:()=>{},position:{bottom:16,right:16}})]}),e.jsxs("div",{style:{padding:"1.5rem",background:"white",borderRadius:"8px",boxShadow:"0 2px 8px rgba(0,0,0,0.1)"},children:[e.jsx("h3",{children:"Unsaved Changes"}),e.jsx("p",{children:"Changes made but not saved yet"}),e.jsx(m,{canEdit:!0,isEditMode:!0,hasUnsavedChanges:!0,isSaving:!1,onEnterEditMode:()=>{},onExitEditMode:()=>{},position:{bottom:16,right:16}})]}),e.jsxs("div",{style:{padding:"1.5rem",background:"white",borderRadius:"8px",boxShadow:"0 2px 8px rgba(0,0,0,0.1)"},children:[e.jsx("h3",{children:"Saving"}),e.jsx("p",{children:"Save operation in progress"}),e.jsx(m,{canEdit:!0,isEditMode:!0,hasUnsavedChanges:!0,isSaving:!0,onEnterEditMode:()=>{},onExitEditMode:()=>{},position:{bottom:16,right:16}})]})]})}),parameters:{controls:{disable:!0}}};var L,P,W;w.parameters={...w.parameters,docs:{...(L=w.parameters)==null?void 0:L.docs,source:{originalSource:`{
+  args: {
+    canEdit: true,
+    isEditMode: false,
+    hasUnsavedChanges: false,
+    isSaving: false,
+    onEnterEditMode: () => {},
+    onExitEditMode: () => {}
+  }
+}`,...(W=(P=w.parameters)==null?void 0:P.docs)==null?void 0:W.source}}};var F,q,N;U.parameters={...U.parameters,docs:{...(F=U.parameters)==null?void 0:F.docs,source:{originalSource:`{
+  args: {
+    canEdit: true,
+    isEditMode: true,
+    hasUnsavedChanges: false,
+    isSaving: false,
+    onEnterEditMode: () => {},
+    onExitEditMode: () => {}
+  }
+}`,...(N=(q=U.parameters)==null?void 0:q.docs)==null?void 0:N.source}}};var $,V,Y;j.parameters={...j.parameters,docs:{...($=j.parameters)==null?void 0:$.docs,source:{originalSource:`{
+  args: {
+    canEdit: true,
+    isEditMode: true,
+    hasUnsavedChanges: true,
+    isSaving: false,
+    onEnterEditMode: () => {},
+    onExitEditMode: () => {}
+  }
+}`,...(Y=(V=j.parameters)==null?void 0:V.docs)==null?void 0:Y.source}}};var X,O,Z;k.parameters={...k.parameters,docs:{...(X=k.parameters)==null?void 0:X.docs,source:{originalSource:`{
+  args: {
+    canEdit: true,
+    isEditMode: true,
+    hasUnsavedChanges: true,
+    isSaving: true,
+    onEnterEditMode: () => {},
+    onExitEditMode: () => {}
+  }
+}`,...(Z=(O=k.parameters)==null?void 0:O.docs)==null?void 0:Z.source}}};var K,G,J;T.parameters={...T.parameters,docs:{...(K=T.parameters)==null?void 0:K.docs,source:{originalSource:`{
+  args: {
+    canEdit: false,
+    isEditMode: false,
+    hasUnsavedChanges: false,
+    isSaving: false,
+    onEnterEditMode: () => {},
+    onExitEditMode: () => {}
+  }
+}`,...(J=(G=T.parameters)==null?void 0:G.docs)==null?void 0:J.source}}};var Q,ee,te;_.parameters={..._.parameters,docs:{...(Q=_.parameters)==null?void 0:Q.docs,source:{originalSource:`{
+  args: {
+    canEdit: true,
+    isEditMode: false,
+    hasUnsavedChanges: false,
+    isSaving: false,
+    position: {
+      top: 32,
+      left: 32
+    },
+    onEnterEditMode: () => {},
+    onExitEditMode: () => {}
+  }
+}`,...(te=(ee=_.parameters)==null?void 0:ee.docs)==null?void 0:te.source}}};var ne,ae,se;I.parameters={...I.parameters,docs:{...(ne=I.parameters)==null?void 0:ne.docs,source:{originalSource:`{
+  args: {
+    canEdit: true,
+    isEditMode: false,
+    hasUnsavedChanges: false,
+    isSaving: false,
+    onEnterEditMode: () => {},
+    onExitEditMode: () => {}
+  },
+  render: () => {
+    const [isEditMode, setIsEditMode] = useState(false);
+    const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);
+    const [isSaving, setIsSaving] = useState(false);
+    const [content, setContent] = useState('Click the edit button to start editing this content.');
+    const handleEnterEditMode = () => {
+      setIsEditMode(true);
+      setHasUnsavedChanges(false);
+    };
+    const handleExitEditMode = async () => {
+      if (hasUnsavedChanges) {
+        setIsSaving(true);
+        // Simulate saving
+        await new Promise(resolve => setTimeout(resolve, 2000));
+        setIsSaving(false);
+      }
+      setIsEditMode(false);
+      setHasUnsavedChanges(false);
+    };
+    const handleContentChange = (newContent: string) => {
+      setContent(newContent);
+      setHasUnsavedChanges(true);
+    };
+    return <div style={{
+      position: 'relative',
+      height: '100vh',
+      padding: '2rem',
+      background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
+      color: 'white'
+    }}>
+                <div style={{
+        maxWidth: '600px',
+        margin: '0 auto',
+        padding: '2rem',
+        background: 'rgba(255, 255, 255, 0.1)',
+        borderRadius: '12px',
+        backdropFilter: 'blur(10px)'
+      }}>
+                    <h1 style={{
+          marginTop: 0
+        }}>Interactive Edit Demo</h1>
+                    
+                    {isEditMode ? <div>
+                            <textarea value={content} onChange={e => handleContentChange(e.target.value)} style={{
+            width: '100%',
+            height: '200px',
+            padding: '1rem',
+            border: 'none',
+            borderRadius: '8px',
+            fontSize: '1rem',
+            resize: 'vertical'
+          }} placeholder="Enter your content here..." />
+                            <p style={{
+            fontSize: '0.875rem',
+            opacity: 0.8,
+            marginTop: '0.5rem'
+          }}>
+                                {hasUnsavedChanges ? '⚠️ You have unsaved changes' : '✅ No changes'}
+                            </p>
+                        </div> : <div style={{
+          padding: '1rem',
+          background: 'rgba(255, 255, 255, 0.1)',
+          borderRadius: '8px',
+          lineHeight: 1.6
+        }}>
+                            {content}
+                        </div>}
+                    
+                    <div style={{
+          marginTop: '2rem',
+          fontSize: '0.875rem',
+          opacity: 0.8
+        }}>
+                        <p>Mode: {isEditMode ? 'Edit Mode' : 'View Mode'}</p>
+                        <p>Status: {isSaving ? 'Saving...' : hasUnsavedChanges ? 'Unsaved Changes' : 'Saved'}</p>
+                    </div>
+                </div>
+                
+                <EditFAB canEdit={true} isEditMode={isEditMode} hasUnsavedChanges={hasUnsavedChanges} isSaving={isSaving} onEnterEditMode={handleEnterEditMode} onExitEditMode={handleExitEditMode} />
+            </div>;
+  },
+  parameters: {
+    controls: {
+      disable: true
+    }
+  }
+}`,...(se=(ae=I.parameters)==null?void 0:ae.docs)==null?void 0:se.source}}};var ie,oe,re;R.parameters={...R.parameters,docs:{...(ie=R.parameters)==null?void 0:ie.docs,source:{originalSource:`{
+  args: {
+    canEdit: true,
+    isEditMode: false,
+    hasUnsavedChanges: false,
+    isSaving: false,
+    onEnterEditMode: () => {},
+    onExitEditMode: () => {}
+  },
+  render: () => {
+    const [isEditMode, setIsEditMode] = useState(false);
+    const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);
+    const [isSaving, setIsSaving] = useState(false);
+    const [document, setDocument] = useState({
+      title: 'Project Documentation',
+      content: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+      lastSaved: new Date().toLocaleTimeString()
+    });
+    const handleEnterEditMode = () => {
+      setIsEditMode(true);
+      setHasUnsavedChanges(false);
+    };
+    const handleExitEditMode = async () => {
+      if (hasUnsavedChanges) {
+        setIsSaving(true);
+        await new Promise(resolve => setTimeout(resolve, 1500));
+        setDocument(prev => ({
+          ...prev,
+          lastSaved: new Date().toLocaleTimeString()
+        }));
+        setIsSaving(false);
+      }
+      setIsEditMode(false);
+      setHasUnsavedChanges(false);
+    };
+    const handleTitleChange = (newTitle: string) => {
+      setDocument(prev => ({
+        ...prev,
+        title: newTitle
+      }));
+      setHasUnsavedChanges(true);
+    };
+    const handleContentChange = (newContent: string) => {
+      setDocument(prev => ({
+        ...prev,
+        content: newContent
+      }));
+      setHasUnsavedChanges(true);
+    };
+    return <div style={{
+      position: 'relative',
+      height: '100vh',
+      background: '#f5f5f5'
+    }}>
+                <div style={{
+        maxWidth: '800px',
+        margin: '0 auto',
+        padding: '2rem',
+        background: 'white',
+        minHeight: '100vh',
+        boxShadow: '0 0 20px rgba(0,0,0,0.1)'
+      }}>
+                    <div style={{
+          borderBottom: '2px solid #e9ecef',
+          paddingBottom: '1rem',
+          marginBottom: '2rem'
+        }}>
+                        {isEditMode ? <input type="text" value={document.title} onChange={e => handleTitleChange(e.target.value)} style={{
+            fontSize: '2rem',
+            fontWeight: 'bold',
+            border: '2px solid #007bff',
+            outline: 'none',
+            width: '100%',
+            padding: '0.5rem',
+            borderRadius: '4px'
+          }} /> : <h1 style={{
+            margin: 0,
+            fontSize: '2rem'
+          }}>{document.title}</h1>}
+                        <p style={{
+            margin: '0.5rem 0 0',
+            fontSize: '0.875rem',
+            color: '#6c757d'
+          }}>
+                            Last saved: {document.lastSaved} | Status: {isSaving ? 'Saving...' : hasUnsavedChanges ? 'Unsaved changes' : 'All changes saved'}
+                        </p>
+                    </div>
+                    
+                    {isEditMode ? <textarea value={document.content} onChange={e => handleContentChange(e.target.value)} style={{
+          width: '100%',
+          height: '400px',
+          padding: '1rem',
+          border: '2px solid #007bff',
+          borderRadius: '8px',
+          fontSize: '1rem',
+          lineHeight: 1.6,
+          resize: 'vertical',
+          fontFamily: 'inherit'
+        }} placeholder="Start writing your document..." /> : <div style={{
+          padding: '1rem',
+          lineHeight: 1.8,
+          fontSize: '1rem',
+          minHeight: '400px',
+          whiteSpace: 'pre-wrap'
+        }}>
+                            {document.content}
+                        </div>}
+                    
+                    {isEditMode && <div style={{
+          marginTop: '1rem',
+          padding: '1rem',
+          background: hasUnsavedChanges ? '#fff3cd' : '#d1edff',
+          borderRadius: '8px',
+          fontSize: '0.875rem'
+        }}>
+                            {hasUnsavedChanges ? <>⚠️ You have unsaved changes. Click the save button to save your work.</> : <>✅ All changes saved.</>}
+                        </div>}
+                </div>
+                
+                <EditFAB canEdit={true} isEditMode={isEditMode} hasUnsavedChanges={hasUnsavedChanges} isSaving={isSaving} onEnterEditMode={handleEnterEditMode} onExitEditMode={handleExitEditMode} position={{
+        bottom: 32,
+        right: 32
+      }} />
+            </div>;
+  },
+  parameters: {
+    controls: {
+      disable: true
+    }
+  }
+}`,...(re=(oe=R.parameters)==null?void 0:oe.docs)==null?void 0:re.source}}};var de,le,ce;z.parameters={...z.parameters,docs:{...(de=z.parameters)==null?void 0:de.docs,source:{originalSource:`{
+  args: {
+    canEdit: true,
+    isEditMode: false,
+    hasUnsavedChanges: false,
+    isSaving: false,
+    onEnterEditMode: () => {},
+    onExitEditMode: () => {}
+  },
+  render: () => <div style={{
+    position: 'relative',
+    height: '100vh',
+    background: '#f8f9fa',
+    padding: '2rem'
+  }}>
+            <div style={{
+      display: 'grid',
+      gridTemplateColumns: 'repeat(auto-fit, minmax(300px, 1fr))',
+      gap: '2rem',
+      maxWidth: '1200px',
+      margin: '0 auto'
+    }}>
+                <div style={{
+        padding: '1.5rem',
+        background: 'white',
+        borderRadius: '8px',
+        boxShadow: '0 2px 8px rgba(0,0,0,0.1)'
+      }}>
+                    <h3>View Mode</h3>
+                    <p>Default state when not editing</p>
+                    <EditFAB canEdit={true} isEditMode={false} hasUnsavedChanges={false} isSaving={false} onEnterEditMode={() => {}} onExitEditMode={() => {}} position={{
+          bottom: 16,
+          right: 16
+        }} />
+                </div>
+                
+                <div style={{
+        padding: '1.5rem',
+        background: 'white',
+        borderRadius: '8px',
+        boxShadow: '0 2px 8px rgba(0,0,0,0.1)'
+      }}>
+                    <h3>Edit Mode (No Changes)</h3>
+                    <p>In edit mode but no changes made yet</p>
+                    <EditFAB canEdit={true} isEditMode={true} hasUnsavedChanges={false} isSaving={false} onEnterEditMode={() => {}} onExitEditMode={() => {}} position={{
+          bottom: 16,
+          right: 16
+        }} />
+                </div>
+                
+                <div style={{
+        padding: '1.5rem',
+        background: 'white',
+        borderRadius: '8px',
+        boxShadow: '0 2px 8px rgba(0,0,0,0.1)'
+      }}>
+                    <h3>Unsaved Changes</h3>
+                    <p>Changes made but not saved yet</p>
+                    <EditFAB canEdit={true} isEditMode={true} hasUnsavedChanges={true} isSaving={false} onEnterEditMode={() => {}} onExitEditMode={() => {}} position={{
+          bottom: 16,
+          right: 16
+        }} />
+                </div>
+                
+                <div style={{
+        padding: '1.5rem',
+        background: 'white',
+        borderRadius: '8px',
+        boxShadow: '0 2px 8px rgba(0,0,0,0.1)'
+      }}>
+                    <h3>Saving</h3>
+                    <p>Save operation in progress</p>
+                    <EditFAB canEdit={true} isEditMode={true} hasUnsavedChanges={true} isSaving={true} onEnterEditMode={() => {}} onExitEditMode={() => {}} position={{
+          bottom: 16,
+          right: 16
+        }} />
+                </div>
+            </div>
+        </div>,
+  parameters: {
+    controls: {
+      disable: true
+    }
+  }
+}`,...(ce=(le=z.parameters)==null?void 0:le.docs)==null?void 0:ce.source}}};const Ne=["Default","EditMode","WithUnsavedChanges","Saving","NoEditPermission","TopLeftPosition","Interactive","DocumentEditor","AllStates"];export{z as AllStates,w as Default,R as DocumentEditor,U as EditMode,I as Interactive,T as NoEditPermission,k as Saving,_ as TopLeftPosition,j as WithUnsavedChanges,Ne as __namedExportsOrder,qe as default};

package/storybook-static/assets/MoodChart-2hr_Y2GI.css

@@ -0,0 +1 @@
+._container_1cfkm_1{position:relative;background:var(--color-background-secondary);border-radius:var(--radius-lg);padding:var(--spacing-xl);display:flex;flex-direction:column;align-items:center}._chart_1cfkm_11{display:block;margin:0 auto}._gridLine_1cfkm_16{stroke:var(--color-border);stroke-opacity:.15;stroke-dasharray:4,4}._line_1cfkm_22{fill:none;stroke:var(--color-primary);stroke-width:2.5;stroke-opacity:.8;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}._xAxis_1cfkm_30,._yAxis_1cfkm_31{color:var(--color-text-secondary);font-size:11px;font-weight:500}._xAxis_1cfkm_30 line,._xAxis_1cfkm_30 path,._yAxis_1cfkm_31 line,._yAxis_1cfkm_31 path{stroke:var(--color-border);stroke-opacity:.3}._xAxis_1cfkm_30 text,._yAxis_1cfkm_31 text{fill:var(--color-text-secondary)}._dataPoint_1cfkm_50{cursor:pointer;stroke:var(--color-text-inverse);stroke-width:2;transition:all .3s ease;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}._dataPoint_1cfkm_50:hover{filter:drop-shadow(0 4px 8px rgba(0,0,0,.3));transform:scale(1.2)}._tooltip_1cfkm_63{position:absolute;background:var(--color-background-secondary);border:2px solid var(--color-primary);border-radius:12px;padding:16px;box-shadow:0 8px 24px #00000026;pointer-events:none;z-index:10;min-width:280px;max-width:400px;animation:_fadeIn_1cfkm_1 .2s ease}@keyframes _fadeIn_1cfkm_1{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}._tooltipHeader_1cfkm_88{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--color-border)}._tooltipDate_1cfkm_97{font-weight:600;color:var(--color-text);font-size:14px}._tooltipRating_1cfkm_103{display:flex;align-items:baseline;gap:2px;background:linear-gradient(135deg,var(--color-primary),var(--color-primary-hover));padding:4px 10px;border-radius:20px;color:var(--color-text-inverse)}._ratingValue_1cfkm_113{font-size:18px;font-weight:700}._ratingMax_1cfkm_118{font-size:12px;opacity:.9}._tooltipTags_1cfkm_123{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}._tag_1cfkm_130{display:inline-block;padding:4px 10px;background:var(--color-primary-lighter);color:var(--color-primary-active);border-radius:12px;font-size:12px;font-weight:500;border:1px solid var(--color-primary-light);animation:_tagBounce_1cfkm_1 .3s ease}@keyframes _tagBounce_1cfkm_1{0%{transform:scale(.8)}60%{transform:scale(1.05)}to{transform:scale(1)}}._tooltipComment_1cfkm_148{color:var(--color-text-secondary);font-size:13px;line-height:1.5;max-height:200px;overflow-y:auto;padding:12px;background:var(--color-background-tertiary);border-radius:8px;border:1px solid var(--color-border)}._tooltipComment_1cfkm_148::-webkit-scrollbar{width:4px}._tooltipComment_1cfkm_148::-webkit-scrollbar-track{background:var(--color-background-tertiary)}._tooltipComment_1cfkm_148::-webkit-scrollbar-thumb{background:var(--color-primary);border-radius:2px}._moodIndicator_1cfkm_174{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:8px}

package/storybook-static/assets/MoodChart.stories-V-wKOSu-.js

@@ -0,0 +1,40 @@
+import{r as i,j as n}from"./iframe-BUaP2gIF.js";import{s as S}from"./transform-NloTqvdv.js";import{l as A,a as z,b as Y}from"./linear-4t_RuQok.js";import{e as G,t as J,l as K,m as U}from"./monotone-BYG7Mesf.js";import{t as Z}from"./defaultLocale-DJ2q5QjE.js";import"./preload-helper-C1FmrZbK.js";import"./array-BKyUJesY.js";import"./path-CbwjOpE9.js";const tt="_container_1cfkm_1",at="_chart_1cfkm_11",et="_gridLine_1cfkm_16",ot="_line_1cfkm_22",nt="_xAxis_1cfkm_30",rt="_yAxis_1cfkm_31",st="_dataPoint_1cfkm_50",it="_tooltip_1cfkm_63",ct="_tooltipHeader_1cfkm_88",lt="_tooltipDate_1cfkm_97",mt="_tooltipRating_1cfkm_103",dt="_ratingValue_1cfkm_113",pt="_ratingMax_1cfkm_118",gt="_tooltipTags_1cfkm_123",ht="_tag_1cfkm_130",ut="_tooltipComment_1cfkm_148",a={container:tt,chart:at,gridLine:et,line:ot,xAxis:nt,yAxis:rt,dataPoint:st,tooltip:it,tooltipHeader:ct,tooltipDate:lt,tooltipRating:mt,ratingValue:dt,ratingMax:pt,tooltipTags:gt,tag:ht,tooltipComment:ut},O=({moodData:o,width:p=800,height:u=400})=>{const s=i.useRef(null),g=i.useRef(null),[c,f]=i.useState(null),[T,W]=i.useState({x:0,y:0}),l={top:20,right:20,bottom:50,left:40},D=p-l.left-l.right,k=u-l.top-l.bottom,h=i.useMemo(()=>o.map(e=>{const r=e.tag?e.tag.split(",").map(m=>m.trim()).filter(m=>m):[];return{date:new Date(e.date),rating:e.rating,tags:r,comment:e.comment}}).filter(e=>!isNaN(e.date.getTime())&&isFinite(e.rating)),[o]),j=i.useMemo(()=>A().domain([1,5,10]).range(["#FF6B6B","#FFD93D","#6BCB77"]).clamp(!0),[]);return i.useEffect(()=>{if(!s.current||h.length===0)return;const e=S(s.current);e.selectAll("*").remove();const r=e.append("g").attr("transform",`translate(${l.left},${l.top})`),m=G(h,t=>t.date);if(!m[0]||!m[1])return;const v=J().domain(m).range([0,D]),d=A().domain([1,10]).range([k,0]),Q=K().x(t=>v(t.date)).y(t=>d(t.rating)).curve(U);r.selectAll(".grid-line-y").data(d.ticks(5)).enter().append("line").attr("class",a.gridLine).attr("x1",0).attr("y1",t=>d(t)).attr("x2",D).attr("y2",t=>d(t)),r.append("path").datum(h).attr("class",a.line).attr("d",Q),r.append("g").attr("class",a.xAxis).attr("transform",`translate(0,${k})`).call(z(v).tickFormat(t=>Z("%m/%d")(t))),r.append("g").attr("class",a.yAxis).call(Y(d)),r.selectAll(".mood-circle").data(h).enter().append("circle").attr("class",a.dataPoint).attr("cx",t=>v(t.date)).attr("cy",t=>d(t.rating)).attr("r",5).attr("fill",t=>j(t.rating)).style("cursor","pointer").on("mouseenter",(t,X)=>{var w;const N=(w=s.current)==null?void 0:w.getBoundingClientRect();N&&W({x:t.clientX-N.left+20,y:t.clientY-N.top-10}),f(X),S(t.currentTarget).transition().duration(200).attr("r",8)}).on("mouseleave",t=>{setTimeout(()=>{f(null)},0),S(t.currentTarget).transition().duration(200).attr("r",5)})},[h,D,k,j,l]),i.useEffect(()=>()=>{f(null)},[]),n.jsxs("div",{className:a.container,ref:g,onMouseLeave:()=>f(null),children:[n.jsx("svg",{ref:s,width:p,height:u,className:a.chart}),c&&n.jsxs("div",{className:a.tooltip,style:{position:"absolute",pointerEvents:"none",left:T.x,top:T.y,zIndex:1e3},children:[n.jsxs("div",{className:a.tooltipHeader,children:[n.jsx("div",{className:a.tooltipDate,children:c.date.toLocaleDateString()}),n.jsxs("div",{className:a.tooltipRating,children:[n.jsx("span",{className:a.ratingValue,children:c.rating}),n.jsx("span",{className:a.ratingMax,children:"/10"})]})]}),c.tags.length>0&&n.jsx("div",{className:a.tooltipTags,children:c.tags.map((e,r)=>n.jsx("span",{className:a.tag,children:e},r))}),c.comment&&n.jsx("div",{className:a.tooltipComment,children:c.comment})]})]})};O.__docgenInfo={description:"",methods:[],displayName:"MoodChart",props:{moodData:{required:!0,tsType:{name:"Array",elements:[{name:"MoodNoteData"}],raw:"MoodNoteData[]"},description:""},width:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"800",computed:!1}},height:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"400",computed:!1}}}};const Nt={title:"Organisms/Charts/MoodChart",component:O,parameters:{layout:"centered"},argTypes:{width:{control:{type:"number",min:300,max:1200,step:50}},height:{control:{type:"number",min:200,max:800,step:50}}}},R=o=>{const p=[],u=new Date;for(let s=o-1;s>=0;s--){const g=new Date(u);g.setDate(g.getDate()-s),p.push(g.toISOString().split("T")[0])}return p},_={args:{moodData:R(30).map(o=>({date:o,rating:Math.floor(Math.random()*10)+1,tag:["happy","excited","calm","focused"][Math.floor(Math.random()*4)],comment:`Feeling ${Math.random()>.5?"good":"okay"} today`})),width:800,height:400}},x={args:{moodData:R(7).map(o=>({date:o,rating:Math.floor(Math.random()*10)+1,tag:["happy","calm","energetic","focused"][Math.floor(Math.random()*4)],comment:`Day ${o.split("-")[2]} mood note`})),width:600,height:300}},y={args:{moodData:R(90).map(o=>({date:o,rating:Math.floor(Math.random()*10)+1,tag:["productive","creative","stressed","relaxed","motivated"][Math.floor(Math.random()*5)],comment:Math.random()>.7?`Notable day - ${o}`:void 0})),width:1e3,height:400}},M={args:{moodData:[],width:800,height:400}};var b,C,$;_.parameters={..._.parameters,docs:{...(b=_.parameters)==null?void 0:b.docs,source:{originalSource:`{
+  args: {
+    moodData: generateDateRange(30).map(date => ({
+      date,
+      rating: Math.floor(Math.random() * 10) + 1,
+      tag: ['happy', 'excited', 'calm', 'focused'][Math.floor(Math.random() * 4)],
+      comment: \`Feeling \${Math.random() > 0.5 ? 'good' : 'okay'} today\`
+    })),
+    width: 800,
+    height: 400
+  }
+}`,...($=(C=_.parameters)==null?void 0:C.docs)==null?void 0:$.source}}};var F,E,L;x.parameters={...x.parameters,docs:{...(F=x.parameters)==null?void 0:F.docs,source:{originalSource:`{
+  args: {
+    moodData: generateDateRange(7).map(date => ({
+      date,
+      rating: Math.floor(Math.random() * 10) + 1,
+      tag: ['happy', 'calm', 'energetic', 'focused'][Math.floor(Math.random() * 4)],
+      comment: \`Day \${date.split('-')[2]} mood note\`
+    })),
+    width: 600,
+    height: 300
+  }
+}`,...(L=(E=x.parameters)==null?void 0:E.docs)==null?void 0:L.source}}};var B,P,V;y.parameters={...y.parameters,docs:{...(B=y.parameters)==null?void 0:B.docs,source:{originalSource:`{
+  args: {
+    moodData: generateDateRange(90).map(date => ({
+      date,
+      rating: Math.floor(Math.random() * 10) + 1,
+      tag: ['productive', 'creative', 'stressed', 'relaxed', 'motivated'][Math.floor(Math.random() * 5)],
+      comment: Math.random() > 0.7 ? \`Notable day - \${date}\` : undefined
+    })),
+    width: 1000,
+    height: 400
+  }
+}`,...(V=(P=y.parameters)==null?void 0:P.docs)==null?void 0:V.source}}};var H,q,I;M.parameters={...M.parameters,docs:{...(H=M.parameters)==null?void 0:H.docs,source:{originalSource:`{
+  args: {
+    moodData: [],
+    width: 800,
+    height: 400
+  }
+}`,...(I=(q=M.parameters)==null?void 0:q.docs)==null?void 0:I.source}}};const St=["Default","Weekly","Quarterly","EmptyState"];export{_ as Default,M as EmptyState,y as Quarterly,x as Weekly,St as __namedExportsOrder,Nt as default};

package/storybook-static/assets/Navbar-B8vEvGnB.css

@@ -0,0 +1 @@
+._navbar_1ou84_1{position:fixed;background:var(--color-surface);padding:var(--spacing-md);z-index:var(--z-index-sticky);display:flex;flex-direction:column;transition:transform var(--transition-base)}._navbarSidebar_1ou84_12{top:0;left:0;bottom:0;width:280px;box-shadow:var(--shadow-lg);overflow-y:auto}._navbarTop_1ou84_22{top:0;left:0;right:0;height:auto;flex-direction:row;align-items:center;padding:var(--spacing-sm) var(--spacing-lg);box-shadow:var(--shadow-md)}._navbarTop_1ou84_22 ._navList_1ou84_33{flex-direction:row;gap:var(--spacing-md);margin:0}._navbarTop_1ou84_22 ._navItem_1ou84_39{margin:0}._navbarMinimal_1ou84_44{background:transparent;box-shadow:none;position:relative;padding:0}._navbarMinimal_1ou84_44 ._navList_1ou84_33{flex-direction:row;gap:var(--spacing-sm)}._navLogo_1ou84_57{margin-bottom:var(--spacing-xl)}._navbarTop_1ou84_22 ._navLogo_1ou84_57{margin-bottom:0;margin-right:auto}._logoContainer_1ou84_66{display:flex;align-items:center;gap:var(--spacing-md)}._logoImage_1ou84_72{width:48px;height:48px;object-fit:contain;border-radius:var(--radius-md)}._logoPlaceholder_1ou84_79{width:48px;height:48px;background:var(--color-primary);color:var(--color-text-inverse);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-weight:var(--font-weight-bold);font-size:var(--font-size-lg)}._logoContent_1ou84_92{display:flex;flex-direction:column}._logoText_1ou84_97{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text);line-height:var(--line-height-tight)}._logoSubtitle_1ou84_104{font-size:var(--font-size-xs);color:var(--color-text-secondary);line-height:var(--line-height-tight)}._navList_1ou84_33{list-style:none;padding:0;margin:0;flex:1;display:flex;flex-direction:column}._navItem_1ou84_39{margin-bottom:var(--spacing-xs)}._subNavItem_1ou84_124{margin-left:var(--spacing-lg)}._navLink_1ou84_128{display:flex;align-items:center;width:100%;padding:var(--spacing-sm) var(--spacing-md);border:none;background:none;color:var(--color-text);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);text-align:left;text-decoration:none;border-radius:var(--radius-md);position:relative;cursor:pointer;transition:all var(--transition-fast)}._navLink_1ou84_128:hover{background:var(--color-background-secondary)}._navLink_1ou84_128._active_1ou84_150{color:var(--color-text-inverse)}._activeBackground_1ou84_154{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--color-primary);border-radius:var(--radius-md);z-index:0}._navIcon_1ou84_165{font-size:1.25rem;margin-right:var(--spacing-sm);position:relative;z-index:1;transition:color var(--transition-fast)}._activeIcon_1ou84_173{color:var(--color-text-inverse)}._navText_1ou84_177{position:relative;z-index:1;flex:1;transition:color var(--transition-fast)}._activeText_1ou84_184{color:var(--color-text-inverse)}._navBadge_1ou84_188{position:relative;z-index:1;padding:2px 6px;background:var(--color-accent);color:var(--color-text-inverse);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);margin-left:auto}._chevron_1ou84_200{position:relative;z-index:1;margin-left:auto;font-size:var(--font-size-xs);color:var(--color-text-secondary)}._subNavList_1ou84_209{list-style:none;padding:0;margin:var(--spacing-xs) 0 0 0;overflow:hidden}._subNavList_1ou84_209 ._navLink_1ou84_128{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-sm)}._navFooter_1ou84_222{margin-top:auto;padding-top:var(--spacing-md);border-top:1px solid var(--color-border)}._mobileMenuButton_1ou84_229{display:none;position:fixed;top:var(--spacing-md);left:var(--spacing-md);z-index:calc(var(--z-index-sticky) + 1);background:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);width:48px;height:48px;align-items:center;justify-content:center;box-shadow:var(--shadow-lg);cursor:pointer}._mobileMenuButton_1ou84_229:hover{background:var(--color-primary-hover)}._mobileMenuButton_1ou84_229 svg{font-size:1.5rem}._mobileBackdrop_1ou84_256{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;z-index:calc(var(--z-index-sticky) - 1)}@media (max-width: 768px){._mobileMenuButton_1ou84_229{display:flex}._navbarSidebar_1ou84_12{transform:translate(-100%)}._navbarSidebar_1ou84_12._mobileMenuOpen_1ou84_276{transform:translate(0)}._navbarTop_1ou84_22{padding:var(--spacing-sm) var(--spacing-md)}._navbarTop_1ou84_22 ._navList_1ou84_33{position:fixed;top:60px;left:0;right:0;background:var(--color-surface);flex-direction:column;padding:var(--spacing-md);box-shadow:var(--shadow-lg);transform:translateY(-100%);transition:transform var(--transition-base)}._navbarTop_1ou84_22._mobileMenuOpen_1ou84_276 ._navList_1ou84_33{transform:translateY(0)}}._navbar_t9p09_2{position:fixed;bottom:0;left:0;right:0;background:var(--color-surface);padding:var(--spacing-xs) var(--spacing-sm);box-shadow:0 -2px 10px #0000001a;z-index:var(--z-index-sticky)}._navLogo_t9p09_14{display:none}._navList_t9p09_18{list-style:none;padding:0;margin:0;display:flex;flex-direction:row;justify-content:space-around;align-items:center}._navItem_t9p09_28{flex:1;margin:0}._navLink_t9p09_33{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-xs);border:none;background:none;color:var(--color-text-secondary);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);text-decoration:none;border-radius:var(--radius-sm);position:relative;cursor:pointer;transition:all var(--transition-fast);width:100%}._navLink_t9p09_33:active{transform:scale(.95)}._navLink_t9p09_33._active_t9p09_56{color:var(--color-primary)}._activeBackground_t9p09_60{display:none}._navIcon_t9p09_64{font-size:1.5rem;margin-right:0;margin-bottom:2px;transition:color var(--transition-fast)}._activeIcon_t9p09_71{color:var(--color-primary)}._navText_t9p09_75{font-size:var(--font-size-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}._activeText_t9p09_83{color:var(--color-primary)}._navBadge_t9p09_87{position:absolute;top:2px;right:calc(50% - 12px);padding:1px 4px;background:var(--color-accent);color:var(--color-text-inverse);border-radius:var(--radius-full);font-size:10px;font-weight:var(--font-weight-bold);min-width:16px;text-align:center}._chevron_t9p09_102,._subNavList_t9p09_103,._navFooter_t9p09_108,._mobileMenuButton_t9p09_113,._mobileBackdrop_t9p09_117{display:none}._navbarTop_t9p09_122{top:0;bottom:auto;flex-direction:row;padding:var(--spacing-sm) var(--spacing-md)}._navbarTop_t9p09_122 ._navLogo_t9p09_14{display:block;margin-right:auto;margin-bottom:0}._navbarTop_t9p09_122 ._navList_t9p09_18{flex-direction:row;gap:var(--spacing-sm)}._navbarTop_t9p09_122 ._navLink_t9p09_33{flex-direction:row;padding:var(--spacing-xs) var(--spacing-sm)}._navbarTop_t9p09_122 ._navIcon_t9p09_64{margin-right:var(--spacing-xs);margin-bottom:0}._navbarTop_t9p09_122 ._navText_t9p09_75{font-size:var(--font-size-sm)}._navbarMinimal_t9p09_155{position:relative;background:transparent;box-shadow:none;padding:var(--spacing-sm)}._navbarMinimal_t9p09_155 ._navList_t9p09_18{justify-content:flex-start;gap:var(--spacing-xs)}