@stfrigerio/sito-template 0.1.36 → 0.1.37

package/storybook-static/assets/SunburstChart.stories-CphfyDsR.js

@@ -0,0 +1,285 @@
+import{r as S,j as B}from"./iframe-BUaP2gIF.js";import{s as M,i as te,c as I}from"./transform-NloTqvdv.js";import{a as q}from"./arc-DgcIQOLP.js";import"./preload-helper-C1FmrZbK.js";import"./path-CbwjOpE9.js";function ae(e){var n=0,t=e.children,i=t&&t.length;if(!i)n=1;else for(;--i>=0;)n+=t[i].value;e.value=n}function ie(){return this.eachAfter(ae)}function re(e,n){let t=-1;for(const i of this)e.call(n,i,++t,this);return this}function se(e,n){for(var t=this,i=[t],s,c,r=-1;t=i.pop();)if(e.call(n,t,++r,this),s=t.children)for(c=s.length-1;c>=0;--c)i.push(s[c]);return this}function oe(e,n){for(var t=this,i=[t],s=[],c,r,m,l=-1;t=i.pop();)if(s.push(t),c=t.children)for(r=0,m=c.length;r<m;++r)i.push(c[r]);for(;t=s.pop();)e.call(n,t,++l,this);return this}function le(e,n){let t=-1;for(const i of this)if(e.call(n,i,++t,this))return i}function ce(e){return this.eachAfter(function(n){for(var t=+e(n.data)||0,i=n.children,s=i&&i.length;--s>=0;)t+=i[s].value;n.value=t})}function me(e){return this.eachBefore(function(n){n.children&&n.children.sort(e)})}function de(e){for(var n=this,t=he(n,e),i=[n];n!==t;)n=n.parent,i.push(n);for(var s=i.length;e!==t;)i.splice(s,0,e),e=e.parent;return i}function he(e,n){if(e===n)return e;var t=e.ancestors(),i=n.ancestors(),s=null;for(e=t.pop(),n=i.pop();e===n;)s=e,e=t.pop(),n=i.pop();return s}function ue(){for(var e=this,n=[e];e=e.parent;)n.push(e);return n}function pe(){return Array.from(this)}function fe(){var e=[];return this.eachBefore(function(n){n.children||e.push(n)}),e}function ge(){var e=this,n=[];return e.each(function(t){t!==e&&n.push({source:t.parent,target:t})}),n}function*ze(){var e=this,n,t=[e],i,s,c;do for(n=t.reverse(),t=[];e=n.pop();)if(yield e,i=e.children)for(s=0,c=i.length;s<c;++s)t.push(i[s]);while(t.length)}function F(e,n){e instanceof Map?(e=[void 0,e],n===void 0&&(n=ve)):n===void 0&&(n=xe);for(var t=new T(e),i,s=[t],c,r,m,l;i=s.pop();)if((r=n(i.data))&&(l=(r=Array.from(r)).length))for(i.children=r,m=l-1;m>=0;--m)s.push(c=r[m]=new T(r[m])),c.parent=i,c.depth=i.depth+1;return t.eachBefore(Ce)}function ye(){return F(this).eachBefore(be)}function xe(e){return e.children}function ve(e){return Array.isArray(e)?e[1]:null}function be(e){e.data.value!==void 0&&(e.value=e.data.value),e.data=e.data.data}function Ce(e){var n=0;do e.height=n;while((e=e.parent)&&e.height<++n)}function T(e){this.data=e,this.depth=this.height=0,this.parent=null}T.prototype=F.prototype={constructor:T,count:ie,each:re,eachAfter:oe,eachBefore:se,find:le,sum:ce,sort:me,path:de,ancestors:ue,descendants:pe,leaves:fe,links:ge,copy:ye,[Symbol.iterator]:ze};function we(e){e.x0=Math.round(e.x0),e.y0=Math.round(e.y0),e.x1=Math.round(e.x1),e.y1=Math.round(e.y1)}function Se(e,n,t,i,s){for(var c=e.children,r,m=-1,l=c.length,u=e.value&&(i-n)/e.value;++m<l;)r=c[m],r.y0=t,r.y1=s,r.x0=n,r.x1=n+=r.value*u}function Me(){var e=1,n=1,t=0,i=!1;function s(r){var m=r.height+1;return r.x0=r.y0=t,r.x1=e,r.y1=n/m,r.eachBefore(c(n,m)),i&&r.eachBefore(we),r}function c(r,m){return function(l){l.children&&Se(l,l.x0,r*(l.depth+1)/m,l.x1,r*(l.depth+2)/m);var u=l.x0,g=l.y0,p=l.x1-t,d=l.y1-t;p<u&&(u=p=(u+p)/2),d<g&&(g=d=(g+d)/2),l.x0=u,l.y0=g,l.x1=p,l.y1=d}}return s.round=function(r){return arguments.length?(i=!!r,s):i},s.size=function(r){return arguments.length?(e=+r[0],n=+r[1],s):[e,n]},s.padding=function(r){return arguments.length?(t=+r,s):t},s}const Ae="_container_11ons_1",Re="_title_11ons_10",De="_chart_11ons_18",_e="_tooltip_11ons_22",A={container:Ae,title:Re,chart:De,tooltip:_e},j=["#6366f1","#8b5cf6","#06b6d4","#10b981","#f59e0b","#ef4444","#ec4899","#84cc16","#f97316","#3b82f6","#14b8a6","#f59e0b"],P=e=>{const n=I(e);if(!n)return"#ffffff";const t=n.rgb();return(.299*t.r+.587*t.g+.114*t.b)/255>.5?"#000000":"#ffffff"},Z=({data:e,width:n=500,height:t=500,title:i="Sunburst Chart",tagColors:s={},unit:c="items",centerLabel:r})=>{const m=S.useRef(null),l=S.useRef(new Map).current,u=S.useRef(0),g=Math.min(n,t)/2,p=(d,z)=>{if(s[d]){const y=I(s[d]);if(y)return z>1?y.darker((z-1)*.3).toString():y.toString()}l.has(d)||(l.set(d,j[u.current%j.length]),u.current++);const x=l.get(d)||"#d4af37",E=I(x);return E?E.darker(z*.3).toString():x};return S.useEffect(()=>{if(!m.current||!e)return;const d=M(m.current);d.selectAll("*").remove();const z=d.append("g").attr("transform",`translate(${n/2},${t/2})`),x=F(e).sum(a=>a.size??0).sort((a,o)=>(o.value??0)-(a.value??0)),y=Me().size([2*Math.PI,g*g])(x).descendants(),$=q().startAngle(a=>a.x0).endAngle(a=>a.x1).innerRadius(a=>Math.sqrt(a.y0)).outerRadius(a=>Math.sqrt(a.y1)).cornerRadius(3),b=M("body").append("div").attr("class",A.tooltip).style("opacity",0).style("position","absolute");z.selectAll("path").data(y.filter(a=>a.depth>0&&a.value&&a.value>0)).enter().append("path").attr("d",$).attr("fill",a=>{let o=a;for(;o.depth>1&&o.parent;)o=o.parent;return p(o.data.name,a.depth)}).attr("stroke","var(--bg-primary)").attr("stroke-width",2).style("cursor","pointer").style("filter","drop-shadow(0 1px 3px rgba(0,0,0,0.12))").on("mouseover",function(a,o){const h=q().startAngle(f=>f.x0).endAngle(f=>f.x1).innerRadius(f=>Math.sqrt(f.y0)-2).outerRadius(f=>Math.sqrt(f.y1)+4).cornerRadius(3);M(this).transition().duration(150).attr("d",f=>h(f)).style("filter","drop-shadow(0 2px 8px rgba(0,0,0,0.2))").style("opacity",.9),b.transition().duration(200).style("opacity",1);const v=o.value||0,w=(v/(x.value||1)*100).toFixed(1);b.html(`
+                    <div><strong>${o.data.name}</strong></div>
+                    <div>Value: ${v}</div>
+                    <div>${w}% of total</div>
+                `).style("left",a.pageX+10+"px").style("top",a.pageY-28+"px")}).on("mouseout",function(a,o){M(this).transition().duration(150).attr("d",h=>$(h)).style("filter","drop-shadow(0 1px 3px rgba(0,0,0,0.12))").style("opacity",1),b.transition().duration(500).style("opacity",0)});const ee=a=>a.x1-a.x0>.15&&a.depth<=2,L=y.filter(a=>a.depth===1),ne=L.length>0?te.gamma(2.2)(...L.map(a=>p(a.data.name,1)))(.5):"#ffffff",C=P(ne);return z.append("text").attr("text-anchor","middle").attr("alignment-baseline","middle").attr("font-size","18px").attr("font-weight","bold").attr("fill",C).style("text-shadow",C==="#ffffff"?"0 1px 3px rgba(0,0,0,0.5)":"0 1px 3px rgba(255,255,255,0.5)").text(r||e.name||"Total"),z.append("text").attr("text-anchor","middle").attr("alignment-baseline","middle").attr("y",20).attr("font-size","14px").attr("font-weight","500").attr("fill",C).style("text-shadow",C==="#ffffff"?"0 1px 2px rgba(0,0,0,0.4)":"0 1px 2px rgba(255,255,255,0.4)").text(`${(x.value||0).toLocaleString()} ${c}`),z.selectAll("text.segment-label").data(y.filter(a=>a.depth>0&&a.value&&a.value>0&&ee(a))).enter().append("text").attr("class","segment-label").attr("transform",a=>{const o=(a.x0+a.x1)/2,h=(Math.sqrt(a.y0)+Math.sqrt(a.y1))/2,v=Math.cos(o-Math.PI/2)*h,w=Math.sin(o-Math.PI/2)*h;return`translate(${v},${w})`}).attr("text-anchor","middle").attr("alignment-baseline","middle").attr("font-size",a=>a.depth===1?"13px":"11px").attr("fill",a=>{let o=a;for(;o.depth>1&&o.parent;)o=o.parent;const h=p(o.data.name,a.depth);return P(h)}).attr("font-weight","600").style("pointer-events","none").style("text-shadow",a=>{let o=a;for(;o.depth>1&&o.parent;)o=o.parent;const h=p(o.data.name,a.depth);return`0 1px 2px ${P(h)==="#ffffff"?"rgba(0,0,0,0.5)":"rgba(255,255,255,0.5)"}`}).text(a=>{const o=a.depth===1?12:8;return a.data.name.substring(0,o)}),()=>{b.remove()}},[e,n,t,l,g]),B.jsxs("div",{className:A.container,children:[B.jsx("h3",{className:A.title,children:i}),B.jsx("svg",{ref:m,width:n,height:t,className:A.chart})]})};Z.__docgenInfo={description:"",methods:[],displayName:"SunburstChart",props:{data:{required:!0,tsType:{name:"SunBurstRecord"},description:""},width:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"500",computed:!1}},height:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"500",computed:!1}},title:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"'Sunburst Chart'",computed:!1}},tagColors:{required:!1,tsType:{name:"Record",elements:[{name:"string"},{name:"string"}],raw:"Record<string, string>"},description:"",defaultValue:{value:"{}",computed:!1}},unit:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"'items'",computed:!1}},centerLabel:{required:!1,tsType:{name:"string"},description:""}}};const Ie={title:"Organisms/Charts/SunburstChart",component:Z,parameters:{layout:"centered"},argTypes:{width:{control:{type:"number",min:400,max:800,step:50}},height:{control:{type:"number",min:400,max:800,step:50}},title:{control:{type:"text"}}}},R={args:{data:{name:"Activities",children:[{name:"Work",children:[{name:"Coding",size:120},{name:"Meetings",size:60},{name:"Planning",size:45},{name:"Code Review",size:30}]},{name:"Health",children:[{name:"Exercise",size:60},{name:"Cooking",size:45},{name:"Walking",size:30},{name:"Meditation",size:20}]},{name:"Personal",children:[{name:"Reading",size:90},{name:"Gaming",size:60},{name:"Learning",size:75},{name:"Hobbies",size:45}]},{name:"Social",children:[{name:"Family",size:80},{name:"Friends",size:60},{name:"Events",size:30}]}]},width:600,height:600,title:"Daily Time Distribution",tagColors:{Work:"#7c3aed",Health:"#10b981",Personal:"#3b82f6",Social:"#f59e0b",Coding:"#6d28d9",Exercise:"#059669",Reading:"#2563eb",Family:"#ea580c"}}},D={args:{data:{name:"Project",children:[{name:"Frontend",children:[{name:"Components",children:[{name:"UI Components",size:45},{name:"Forms",size:30},{name:"Charts",size:25}]},{name:"Styling",children:[{name:"CSS Modules",size:20},{name:"Themes",size:15},{name:"Animations",size:15}]},{name:"State",children:[{name:"Redux",size:25},{name:"Context",size:15},{name:"Hooks",size:20}]}]},{name:"Backend",children:[{name:"API",children:[{name:"REST",size:40},{name:"GraphQL",size:30}]},{name:"Database",children:[{name:"Models",size:25},{name:"Migrations",size:15}]},{name:"Services",children:[{name:"Auth",size:20},{name:"Email",size:15},{name:"Storage",size:20}]}]},{name:"DevOps",children:[{name:"CI/CD",size:30},{name:"Docker",size:25},{name:"Monitoring",size:20},{name:"Testing",size:35}]}]},width:700,height:700,title:"Project Time Allocation",tagColors:{Frontend:"#8b5cf6",Backend:"#3b82f6",DevOps:"#10b981",Components:"#a78bfa",API:"#60a5fa",Database:"#2563eb"}}},_={args:{data:{name:"Budget",children:[{name:"Essentials",children:[{name:"Rent",size:1500},{name:"Utilities",size:200},{name:"Insurance",size:300},{name:"Groceries",size:400}]},{name:"Transportation",children:[{name:"Car Payment",size:350},{name:"Gas",size:150},{name:"Maintenance",size:100},{name:"Public Transit",size:50}]},{name:"Lifestyle",children:[{name:"Dining Out",size:300},{name:"Entertainment",size:200},{name:"Shopping",size:250},{name:"Subscriptions",size:100}]},{name:"Savings",children:[{name:"Emergency Fund",size:500},{name:"Retirement",size:600},{name:"Investments",size:400}]}]},width:650,height:650,title:"Monthly Budget Distribution",tagColors:{Essentials:"#dc2626",Transportation:"#f59e0b",Lifestyle:"#8b5cf6",Savings:"#10b981"}}},k={args:{data:{name:"Root",children:[{name:"Category A",size:100},{name:"Category B",size:80},{name:"Category C",size:60},{name:"Category D",size:40},{name:"Category E",size:20}]},width:500,height:500,title:"Simple Distribution"}};var O,H,N;R.parameters={...R.parameters,docs:{...(O=R.parameters)==null?void 0:O.docs,source:{originalSource:`{
+  args: {
+    data: {
+      name: 'Activities',
+      children: [{
+        name: 'Work',
+        children: [{
+          name: 'Coding',
+          size: 120
+        }, {
+          name: 'Meetings',
+          size: 60
+        }, {
+          name: 'Planning',
+          size: 45
+        }, {
+          name: 'Code Review',
+          size: 30
+        }]
+      }, {
+        name: 'Health',
+        children: [{
+          name: 'Exercise',
+          size: 60
+        }, {
+          name: 'Cooking',
+          size: 45
+        }, {
+          name: 'Walking',
+          size: 30
+        }, {
+          name: 'Meditation',
+          size: 20
+        }]
+      }, {
+        name: 'Personal',
+        children: [{
+          name: 'Reading',
+          size: 90
+        }, {
+          name: 'Gaming',
+          size: 60
+        }, {
+          name: 'Learning',
+          size: 75
+        }, {
+          name: 'Hobbies',
+          size: 45
+        }]
+      }, {
+        name: 'Social',
+        children: [{
+          name: 'Family',
+          size: 80
+        }, {
+          name: 'Friends',
+          size: 60
+        }, {
+          name: 'Events',
+          size: 30
+        }]
+      }]
+    },
+    width: 600,
+    height: 600,
+    title: 'Daily Time Distribution',
+    tagColors: {
+      Work: '#7c3aed',
+      Health: '#10b981',
+      Personal: '#3b82f6',
+      Social: '#f59e0b',
+      Coding: '#6d28d9',
+      Exercise: '#059669',
+      Reading: '#2563eb',
+      Family: '#ea580c'
+    }
+  }
+}`,...(N=(H=R.parameters)==null?void 0:H.docs)==null?void 0:N.source}}};var G,V,W;D.parameters={...D.parameters,docs:{...(G=D.parameters)==null?void 0:G.docs,source:{originalSource:`{
+  args: {
+    data: {
+      name: 'Project',
+      children: [{
+        name: 'Frontend',
+        children: [{
+          name: 'Components',
+          children: [{
+            name: 'UI Components',
+            size: 45
+          }, {
+            name: 'Forms',
+            size: 30
+          }, {
+            name: 'Charts',
+            size: 25
+          }]
+        }, {
+          name: 'Styling',
+          children: [{
+            name: 'CSS Modules',
+            size: 20
+          }, {
+            name: 'Themes',
+            size: 15
+          }, {
+            name: 'Animations',
+            size: 15
+          }]
+        }, {
+          name: 'State',
+          children: [{
+            name: 'Redux',
+            size: 25
+          }, {
+            name: 'Context',
+            size: 15
+          }, {
+            name: 'Hooks',
+            size: 20
+          }]
+        }]
+      }, {
+        name: 'Backend',
+        children: [{
+          name: 'API',
+          children: [{
+            name: 'REST',
+            size: 40
+          }, {
+            name: 'GraphQL',
+            size: 30
+          }]
+        }, {
+          name: 'Database',
+          children: [{
+            name: 'Models',
+            size: 25
+          }, {
+            name: 'Migrations',
+            size: 15
+          }]
+        }, {
+          name: 'Services',
+          children: [{
+            name: 'Auth',
+            size: 20
+          }, {
+            name: 'Email',
+            size: 15
+          }, {
+            name: 'Storage',
+            size: 20
+          }]
+        }]
+      }, {
+        name: 'DevOps',
+        children: [{
+          name: 'CI/CD',
+          size: 30
+        }, {
+          name: 'Docker',
+          size: 25
+        }, {
+          name: 'Monitoring',
+          size: 20
+        }, {
+          name: 'Testing',
+          size: 35
+        }]
+      }]
+    },
+    width: 700,
+    height: 700,
+    title: 'Project Time Allocation',
+    tagColors: {
+      Frontend: '#8b5cf6',
+      Backend: '#3b82f6',
+      DevOps: '#10b981',
+      Components: '#a78bfa',
+      API: '#60a5fa',
+      Database: '#2563eb'
+    }
+  }
+}`,...(W=(V=D.parameters)==null?void 0:V.docs)==null?void 0:W.source}}};var U,Q,X;_.parameters={..._.parameters,docs:{...(U=_.parameters)==null?void 0:U.docs,source:{originalSource:`{
+  args: {
+    data: {
+      name: 'Budget',
+      children: [{
+        name: 'Essentials',
+        children: [{
+          name: 'Rent',
+          size: 1500
+        }, {
+          name: 'Utilities',
+          size: 200
+        }, {
+          name: 'Insurance',
+          size: 300
+        }, {
+          name: 'Groceries',
+          size: 400
+        }]
+      }, {
+        name: 'Transportation',
+        children: [{
+          name: 'Car Payment',
+          size: 350
+        }, {
+          name: 'Gas',
+          size: 150
+        }, {
+          name: 'Maintenance',
+          size: 100
+        }, {
+          name: 'Public Transit',
+          size: 50
+        }]
+      }, {
+        name: 'Lifestyle',
+        children: [{
+          name: 'Dining Out',
+          size: 300
+        }, {
+          name: 'Entertainment',
+          size: 200
+        }, {
+          name: 'Shopping',
+          size: 250
+        }, {
+          name: 'Subscriptions',
+          size: 100
+        }]
+      }, {
+        name: 'Savings',
+        children: [{
+          name: 'Emergency Fund',
+          size: 500
+        }, {
+          name: 'Retirement',
+          size: 600
+        }, {
+          name: 'Investments',
+          size: 400
+        }]
+      }]
+    },
+    width: 650,
+    height: 650,
+    title: 'Monthly Budget Distribution',
+    tagColors: {
+      Essentials: '#dc2626',
+      Transportation: '#f59e0b',
+      Lifestyle: '#8b5cf6',
+      Savings: '#10b981'
+    }
+  }
+}`,...(X=(Q=_.parameters)==null?void 0:Q.docs)==null?void 0:X.source}}};var Y,J,K;k.parameters={...k.parameters,docs:{...(Y=k.parameters)==null?void 0:Y.docs,source:{originalSource:`{
+  args: {
+    data: {
+      name: 'Root',
+      children: [{
+        name: 'Category A',
+        size: 100
+      }, {
+        name: 'Category B',
+        size: 80
+      }, {
+        name: 'Category C',
+        size: 60
+      }, {
+        name: 'Category D',
+        size: 40
+      }, {
+        name: 'Category E',
+        size: 20
+      }]
+    },
+    width: 500,
+    height: 500,
+    title: 'Simple Distribution'
+  }
+}`,...(K=(J=k.parameters)==null?void 0:J.docs)==null?void 0:K.source}}};const Fe=["DailyActivities","ProjectBreakdown","BudgetBreakdown","SimpleData"];export{_ as BudgetBreakdown,R as DailyActivities,D as ProjectBreakdown,k as SimpleData,Fe as __namedExportsOrder,Ie as default};

package/storybook-static/assets/Tabs-BfJ7skOE.css

@@ -0,0 +1 @@
+._tabs_jgahw_1{display:inline-flex;gap:0;padding:0;background:transparent;position:relative}._tabs_jgahw_1:before{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgba(var(--color-border-rgb),.1) 10%,rgba(var(--color-border-rgb),.1) 90%,transparent)}._tab_jgahw_1{position:relative;padding:16px 24px;background:transparent;border:none;border-radius:0;cursor:pointer;font-size:15px;font-weight:600;font-family:var(--font-family);letter-spacing:-.02em;transition:all .4s cubic-bezier(.16,1,.3,1);display:flex;align-items:center;gap:10px;color:var(--color-text-secondary);opacity:.7}._tab_jgahw_1:before{content:"";position:absolute;bottom:0;left:50%;width:0;height:3px;background:var(--color-primary);transform:translate(-50%);transition:width .4s cubic-bezier(.16,1,.3,1);border-radius:3px 3px 0 0}._tab_jgahw_1:hover{color:var(--color-text);opacity:1;transform:translateY(-2px)}._tab_jgahw_1:hover:before{width:30%}._tab_jgahw_1[data-active=true]:before{width:100%}._activeTabBackground_jgahw_70{position:absolute;top:0;right:0;bottom:0;left:0;background:transparent;pointer-events:none}._tab_jgahw_1[data-active=true]{color:var(--color-primary);opacity:1;transform:translateY(-2px)}._tabIcon_jgahw_83{width:18px;height:18px;flex-shrink:0;transition:all .4s cubic-bezier(.16,1,.3,1)}._tab_jgahw_1:hover ._tabIcon_jgahw_83{transform:rotate(5deg) scale(1.1)}._tab_jgahw_1[data-active=true] ._tabIcon_jgahw_83{transform:rotate(0) scale(1.15);filter:drop-shadow(0 2px 4px rgba(var(--color-primary-rgb),.3))}._tab_jgahw_1:active{transform:translateY(0)}._tab_jgahw_1:active ._tabIcon_jgahw_83{transform:scale(.95)}

package/storybook-static/assets/Tabs.stories-c24Ffu3K.js

@@ -0,0 +1,49 @@
+import{j as a,R as G,r as l}from"./iframe-BUaP2gIF.js";import{G as N,r as T,s as q}from"./index-5bdJXrkD.js";import{m as v}from"./proxy-9Y4F2rF8.js";import"./preload-helper-C1FmrZbK.js";function E(e){return N({attr:{role:"img",viewBox:"0 0 24 24"},child:[{tag:"path",attr:{d:"M11.571 11.513H0a5.218 5.218 0 0 0 5.232 5.215h2.13v2.057A5.215 5.215 0 0 0 12.575 24V12.518a1.005 1.005 0 0 0-1.005-1.005zm5.723-5.756H5.736a5.215 5.215 0 0 0 5.215 5.214h2.129v2.058a5.218 5.218 0 0 0 5.215 5.214V6.758a1.001 1.001 0 0 0-1.001-1.001zM23.013 0H11.455a5.215 5.215 0 0 0 5.215 5.215h2.129v2.057A5.215 5.215 0 0 0 24 12.483V1.005A1.001 1.001 0 0 0 23.013 0Z"},child:[]}]})(e)}const F="_tabs_jgahw_1",H="_tab_jgahw_1",J="_tabIcon_jgahw_83",r={tabs:F,tab:H,tabIcon:J},V=[{id:"details",icon:T,label:"Dettagli"},{id:"github",icon:q,label:"GitHub"},{id:"jira",icon:E,label:"Jira"},{id:"functional",icon:T,label:"Analisi funzionale"}],i=({activeTab:e,onTabChange:t,tabs:n,className:C=""})=>{const I=n??V;return a.jsx("div",{className:`${r.tabs} ${C}`,children:I.map(s=>{const u=e===s.id;return a.jsxs(v.button,{className:r.tab,"data-active":u,onClick:()=>t(s.id),style:{position:"relative"},children:[a.jsx(v.div,{animate:{rotate:u?[0,-10,10,-5,5,0]:0},transition:{rotate:{duration:.5,ease:"easeInOut"}},children:s.icon&&(typeof s.icon=="function"?a.jsx("span",{className:r.tabIcon,children:G.createElement(s.icon)}):a.jsx("span",{className:r.tabIcon,children:s.icon}))}),a.jsx("span",{children:s.label})]},s.id)})})};i.__docgenInfo={description:"",methods:[],displayName:"Tabs",props:{activeTab:{required:!0,tsType:{name:"string"},description:""},onTabChange:{required:!0,tsType:{name:"signature",type:"function",raw:"(tab: string) => void",signature:{arguments:[{type:{name:"string"},name:"tab"}],return:{name:"void"}}},description:""},tabs:{required:!1,tsType:{name:"Array",elements:[{name:"Tab"}],raw:"Tab[]"},description:""},className:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"''",computed:!1}}}};const O={title:"Molecules/Tabs",component:i,parameters:{layout:"centered"},tags:["autodocs"],argTypes:{activeTab:{control:"select",options:["details","github","jira","functional"]}}},c={render:e=>{const[t,n]=l.useState("details");return a.jsx("div",{style:{width:"600px"},children:a.jsx(i,{...e,activeTab:t,onTabChange:n})})},args:{activeTab:"details"}},o={render:e=>{const[t,n]=l.useState("github");return a.jsx("div",{style:{width:"600px"},children:a.jsx(i,{...e,activeTab:t,onTabChange:n})})},args:{activeTab:"github"}},d={render:e=>{const[t,n]=l.useState("jira");return a.jsx("div",{style:{width:"600px"},children:a.jsx(i,{...e,activeTab:t,onTabChange:n})})},args:{activeTab:"jira"}},b={render:e=>{const[t,n]=l.useState("functional");return a.jsx("div",{style:{width:"600px"},children:a.jsx(i,{...e,activeTab:t,onTabChange:n})})},args:{activeTab:"functional"}};var p,m,g;c.parameters={...c.parameters,docs:{...(p=c.parameters)==null?void 0:p.docs,source:{originalSource:`{
+  render: args => {
+    const [activeTab, setActiveTab] = useState<TabType>('details');
+    return <div style={{
+      width: '600px'
+    }}>
+                <Tabs {...args} activeTab={activeTab} onTabChange={setActiveTab} />
+            </div>;
+  },
+  args: {
+    activeTab: 'details'
+  }
+}`,...(g=(m=c.parameters)==null?void 0:m.docs)==null?void 0:g.source}}};var h,x,j;o.parameters={...o.parameters,docs:{...(h=o.parameters)==null?void 0:h.docs,source:{originalSource:`{
+  render: args => {
+    const [activeTab, setActiveTab] = useState<TabType>('github');
+    return <div style={{
+      width: '600px'
+    }}>
+                <Tabs {...args} activeTab={activeTab} onTabChange={setActiveTab} />
+            </div>;
+  },
+  args: {
+    activeTab: 'github'
+  }
+}`,...(j=(x=o.parameters)==null?void 0:x.docs)==null?void 0:j.source}}};var y,f,A;d.parameters={...d.parameters,docs:{...(y=d.parameters)==null?void 0:y.docs,source:{originalSource:`{
+  render: args => {
+    const [activeTab, setActiveTab] = useState<TabType>('jira');
+    return <div style={{
+      width: '600px'
+    }}>
+                <Tabs {...args} activeTab={activeTab} onTabChange={setActiveTab} />
+            </div>;
+  },
+  args: {
+    activeTab: 'jira'
+  }
+}`,...(A=(f=d.parameters)==null?void 0:f.docs)==null?void 0:A.source}}};var w,S,_;b.parameters={...b.parameters,docs:{...(w=b.parameters)==null?void 0:w.docs,source:{originalSource:`{
+  render: args => {
+    const [activeTab, setActiveTab] = useState<TabType>('functional');
+    return <div style={{
+      width: '600px'
+    }}>
+                <Tabs {...args} activeTab={activeTab} onTabChange={setActiveTab} />
+            </div>;
+  },
+  args: {
+    activeTab: 'functional'
+  }
+}`,...(_=(S=b.parameters)==null?void 0:S.docs)==null?void 0:_.source}}};const $=["Default","GithubActive","JiraActive","FunctionalActive"];export{c as Default,b as FunctionalActive,o as GithubActive,d as JiraActive,$ as __namedExportsOrder,O as default};

package/storybook-static/assets/TextArea-B2UrQsuf.css

@@ -0,0 +1 @@
+._textareaContainer_1p1q8_1{margin-bottom:var(--spacing-lg);position:relative}._textareaContainer_1p1q8_1._compact_1p1q8_6{margin-bottom:var(--spacing-sm)}._textareaContainer_1p1q8_1._compact_1p1q8_6 ._textareaLabel_1p1q8_10{margin-bottom:var(--spacing-xs);font-size:var(--font-size-xs)}._textareaLabel_1p1q8_10{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-sm);letter-spacing:var(--letter-spacing-wide);transition:color var(--transition-base)}._requiredIndicator_1p1q8_25{color:var(--color-error);margin-left:4px;font-weight:var(--font-weight-bold)}._textareaInput_1p1q8_31{width:100%;padding:var(--spacing-sm) var(--spacing-md);border:2px solid var(--color-border);border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--color-background),var(--color-background-secondary));font-size:var(--font-size-base);line-height:var(--line-height-relaxed);color:var(--color-text);resize:vertical;min-height:120px;max-height:400px;font-family:inherit;transition:all var(--transition-base);outline:none;box-sizing:border-box}._compact_1p1q8_6 ._textareaInput_1p1q8_31{padding:var(--spacing-xs) var(--spacing-sm);min-height:80px;max-height:200px;font-size:var(--font-size-sm);border-radius:var(--radius-md)}._textareaInput_1p1q8_31:hover:not(:focus):not(:disabled){border-color:var(--color-border-hover);background:var(--color-background);box-shadow:var(--shadow-sm);transform:translateY(-1px)}._textareaInput_1p1q8_31:focus{border-color:var(--color-primary);background:var(--color-background);box-shadow:0 0 0 3px #7c3aed1a;transform:translateY(-2px)}._textareaInput_1p1q8_31::placeholder{color:var(--color-text-secondary);opacity:.6}._textareaInput_1p1q8_31:disabled{background:var(--color-background-tertiary);border-color:var(--color-border);color:var(--color-text-tertiary);cursor:not-allowed;opacity:.6;transform:none;resize:none}._characterCount_1p1q8_90{position:absolute;bottom:-28px;right:0;font-size:var(--font-size-xs);color:var(--color-text-secondary);padding:4px 8px;background:linear-gradient(135deg,var(--color-background),var(--color-background-secondary));border:1px solid var(--color-border);border-radius:var(--radius-sm);font-weight:var(--font-weight-medium);transition:all var(--transition-base);letter-spacing:var(--letter-spacing-wide)}._compact_1p1q8_6 ._characterCount_1p1q8_90{bottom:-24px;font-size:10px;padding:2px 6px}._characterCount_1p1q8_90._nearLimit_1p1q8_115{color:var(--color-warning);background:linear-gradient(135deg,#f59e0b0d,#f59e0b1a);border-color:var(--color-warning-light)}._characterCount_1p1q8_90._atLimit_1p1q8_124{color:var(--color-error);background:linear-gradient(135deg,#f43f5e0d,#f43f5e1a);border-color:var(--color-error-light);font-weight:var(--font-weight-semibold);animation:_pulse_1p1q8_1 1s ease-in-out infinite}@keyframes _pulse_1p1q8_1{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.9}}._textareaInput_1p1q8_31:hover:after{content:"";position:absolute;bottom:4px;right:4px;width:12px;height:12px;border-right:2px solid var(--color-border-hover);border-bottom:2px solid var(--color-border-hover);opacity:.5}._textareaInput_1p1q8_31::-webkit-scrollbar{width:6px}._textareaInput_1p1q8_31::-webkit-scrollbar-track{background:var(--color-background-secondary);border-radius:var(--radius-sm)}._textareaInput_1p1q8_31::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--radius-sm);transition:background var(--transition-base)}._textareaInput_1p1q8_31::-webkit-scrollbar-thumb:hover{background:var(--color-border-hover)}._error_1p1q8_180 ._textareaInput_1p1q8_31{border-color:var(--color-error);background:linear-gradient(135deg,var(--color-error-bg),var(--color-background));animation:_shake_1p1q8_1 .3s cubic-bezier(.36,.07,.19,.97) both}._error_1p1q8_180 ._textareaLabel_1p1q8_10{color:var(--color-error)}._error_1p1q8_180 ._textareaInput_1p1q8_31:focus{box-shadow:0 0 0 3px #f43f5e26}@keyframes _shake_1p1q8_1{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-3px)}40%,60%{transform:translate(3px)}}._success_1p1q8_205 ._textareaInput_1p1q8_31{border-color:var(--color-success)}._success_1p1q8_205:after{content:"✓";position:absolute;top:8px;right:8px;color:var(--color-success);font-weight:700;font-size:var(--font-size-lg);animation:_checkIn_1p1q8_1 .3s ease-out}@keyframes _checkIn_1p1q8_1{0%{opacity:0;transform:scale(0) rotate(-45deg)}to{opacity:1;transform:scale(1) rotate(0)}}._loading_1p1q8_232 ._textareaInput_1p1q8_31{background-image:linear-gradient(90deg,var(--color-background) 0%,rgba(124,58,237,.05) 50%,var(--color-background) 100%);background-size:200% 100%;animation:_loading_1p1q8_232 2s ease-in-out infinite}@keyframes _loading_1p1q8_232{0%{background-position:200% 0}to{background-position:-200% 0}}._focusMode_1p1q8_249 ._textareaInput_1p1q8_31{min-height:200px;transition:min-height var(--transition-slow)}[data-theme=dark] ._textareaInput_1p1q8_31{background:linear-gradient(135deg,var(--color-background-secondary),var(--color-background-tertiary));border-color:var(--color-border)}[data-theme=dark] ._textareaInput_1p1q8_31:hover:not(:focus):not(:disabled){background:var(--color-background-secondary);border-color:var(--color-border-hover)}[data-theme=dark] ._textareaInput_1p1q8_31:focus{background:var(--color-background-secondary);border-color:var(--color-primary-light);box-shadow:0 0 0 3px #a78bfa1a}[data-theme=dark] ._characterCount_1p1q8_90{background:linear-gradient(135deg,var(--color-background-secondary),var(--color-background-tertiary));border-color:var(--color-border)}[data-theme=dark] ._textareaInput_1p1q8_31::-webkit-scrollbar-track{background:var(--color-background-tertiary)}[data-theme=dark] ._textareaInput_1p1q8_31::-webkit-scrollbar-thumb{background:var(--color-border)}@media (max-width: 768px){._textareaContainer_1p1q8_1{margin-bottom:calc(var(--spacing-lg) + 20px)}._textareaContainer_1p1q8_1._compact_1p1q8_6{margin-bottom:calc(var(--spacing-sm) + 16px)}._textareaLabel_1p1q8_10{font-size:var(--font-size-base);margin-bottom:var(--spacing-xs)}._textareaInput_1p1q8_31{padding:var(--spacing-md);font-size:16px;min-height:100px;border-radius:var(--radius-md)}._compact_1p1q8_6 ._textareaInput_1p1q8_31{padding:var(--spacing-sm);min-height:70px;font-size:16px}._textareaInput_1p1q8_31:focus{min-height:150px}._compact_1p1q8_6 ._textareaInput_1p1q8_31:focus{min-height:100px}._characterCount_1p1q8_90{font-size:var(--font-size-sm);padding:6px 10px}._compact_1p1q8_6 ._characterCount_1p1q8_90{font-size:11px;padding:3px 6px}}@media (prefers-contrast: high){._textareaInput_1p1q8_31{border-width:3px}._textareaInput_1p1q8_31:focus{outline:2px solid var(--color-primary);outline-offset:2px}}@media (prefers-reduced-motion: reduce){._textareaInput_1p1q8_31,._characterCount_1p1q8_90{transition:none}._atLimit_1p1q8_124{animation:none}}

package/storybook-static/assets/TextArea-B_sATPlw.js

@@ -0,0 +1,28 @@
+import{j as t}from"./iframe-BUaP2gIF.js";const C="_textareaContainer_1p1q8_1",b="_compact_1p1q8_6",v="_textareaLabel_1p1q8_10",j="_requiredIndicator_1p1q8_25",I="_textareaInput_1p1q8_31",L="_characterCount_1p1q8_90",V="_nearLimit_1p1q8_115",N="_atLimit_1p1q8_124",M="_error_1p1q8_180",T="_success_1p1q8_205",w="_loading_1p1q8_232",A="_focusMode_1p1q8_249",e={textareaContainer:C,compact:b,textareaLabel:v,requiredIndicator:j,textareaInput:I,characterCount:L,nearLimit:V,atLimit:N,error:M,success:T,loading:w,focusMode:A};function y({label:r,value:n,onChange:d,rows:p=5,placeholder:f="",required:o=!1,maxLength:s,disabled:m=!1,error:i=!1,success:h=!1,loading:c=!1,focusMode:_=!1,compact:x=!1}){const l=`textarea-${Math.random().toString(36).substr(2,9)}`,q=()=>{const a=[e.textareaContainer];return i&&a.push(e.error),h&&a.push(e.success),c&&a.push(e.loading),_&&a.push(e.focusMode),x&&a.push(e.compact),a.join(" ")},g=()=>{if(!s)return e.characterCount;const a=[e.characterCount],u=n.length/s*100;return u>=100?a.push(e.atLimit):u>=80&&a.push(e.nearLimit),a.join(" ")};return t.jsxs("div",{className:q(),children:[r&&t.jsxs("label",{htmlFor:l,className:e.textareaLabel,children:[r,o&&t.jsx("span",{className:e.requiredIndicator,children:"*"})]}),t.jsx("textarea",{id:l,value:n,onChange:a=>d(a.target.value),rows:p,placeholder:f,maxLength:s,className:e.textareaInput,"aria-required":o,disabled:m||c,"aria-invalid":i}),s&&t.jsxs("div",{className:g(),children:[t.jsx("span",{children:n.length}),t.jsx("span",{style:{opacity:.7},children:" / "}),t.jsx("span",{children:s})]})]})}y.__docgenInfo={description:`TextArea component - Multi-line text input with character counting
+
+@component
+@description
+A resizable text area component designed for longer form content like descriptions,
+comments, or messages. Features automatic character counting when maxLength is set,
+and maintains consistent styling with other form inputs. The component is optimized
+for both desktop and mobile experiences with appropriate touch targets.
+
+@example
+// Basic usage
+<TextArea
+  label="Description"
+  value={description}
+  onChange={setDescription}
+  rows={4}
+  placeholder="Enter a detailed description..."
+/>
+
+@example
+// With character limit
+<TextArea
+  label="Bio"
+  value={bio}
+  onChange={setBio}
+  maxLength={500}
+  required
+/>`,methods:[],displayName:"TextArea",props:{rows:{defaultValue:{value:"5",computed:!1},required:!1},placeholder:{defaultValue:{value:'""',computed:!1},required:!1},required:{defaultValue:{value:"false",computed:!1},required:!1},disabled:{defaultValue:{value:"false",computed:!1},required:!1},error:{defaultValue:{value:"false",computed:!1},required:!1},success:{defaultValue:{value:"false",computed:!1},required:!1},loading:{defaultValue:{value:"false",computed:!1},required:!1},focusMode:{defaultValue:{value:"false",computed:!1},required:!1},compact:{defaultValue:{value:"false",computed:!1},required:!1}}};export{y as T};

package/storybook-static/assets/TextArea.stories-CCqRRpwq.js

@@ -0,0 +1,145 @@
+import{r as g,j as e}from"./iframe-BUaP2gIF.js";import{T as u}from"./TextArea-B_sATPlw.js";import"./preload-helper-C1FmrZbK.js";const O={title:"Atoms/TextArea",component:u,parameters:{layout:"centered",docs:{description:{component:"A multiline text input component with character counter support and compact mode for arrays."}}},tags:["autodocs"],argTypes:{label:{control:"text",description:"Label text for the textarea"},value:{control:"text",description:"Current value of the textarea"},placeholder:{control:"text",description:"Placeholder text"},rows:{control:"number",description:"Number of visible rows"},maxLength:{control:"number",description:"Maximum character limit"},required:{control:"boolean",description:"Whether the textarea is required"},compact:{control:"boolean",description:"Compact mode for use in arrays or dense layouts"},onChange:{action:"changed"}}},s={args:{label:"Description",value:"",placeholder:"Enter your description here...",rows:4,onChange:()=>{}}},l={args:{label:"Bio",value:"Software developer passionate about creating great user experiences.",placeholder:"Tell us about yourself...",rows:4,maxLength:200,onChange:()=>{}}},c={args:{label:"Required Message",value:"",placeholder:"This field is required",required:!0,rows:3,onChange:()=>{}}},i={args:{label:"Notes",value:"",placeholder:"Compact mode for arrays...",rows:3,compact:!0,onChange:()=>{}}},d={args:{label:"",value:"",placeholder:"No label, compact mode...",rows:2,compact:!0,onChange:()=>{}}},m={render:()=>{const[t,a]=g.useState(""),[x,h]=g.useState("");return e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"2rem",width:"400px"},children:[e.jsxs("div",{children:[e.jsx("h4",{style:{marginBottom:"1rem",color:"#333"},children:"Regular TextArea"}),e.jsx(u,{label:"Description",value:t,onChange:a,placeholder:"Regular size textarea...",rows:4,maxLength:200})]}),e.jsxs("div",{children:[e.jsx("h4",{style:{marginBottom:"1rem",color:"#333"},children:"Compact TextArea"}),e.jsx(u,{label:"Description",value:x,onChange:h,placeholder:"Compact size textarea...",rows:4,maxLength:200,compact:!0})]})]})},parameters:{controls:{disable:!0}}},p={render:()=>{const[t,a]=g.useState(["First item with some text",""]),x=(n,r)=>{const o=[...t];o[n]=r,a(o)},h=()=>{a([...t,""])},W=n=>{a(t.filter((r,o)=>o!==n))};return e.jsxs("div",{style:{width:"400px"},children:[e.jsx("h4",{style:{marginBottom:"1rem",color:"#333"},children:"TextArea in Array Context (Compact Mode)"}),e.jsxs("div",{style:{background:"#f8f9fa",padding:"1rem",borderRadius:"8px",border:"1px solid #dee2e6"},children:[t.map((n,r)=>e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",gap:"0.5rem",marginBottom:r<t.length-1?"1rem":"0"},children:[e.jsx(u,{label:"",value:n,onChange:o=>x(r,o),placeholder:`Item ${r+1}...`,rows:2,compact:!0}),e.jsx("button",{onClick:()=>W(r),style:{background:"#dc3545",color:"white",border:"none",borderRadius:"4px",padding:"4px 8px",cursor:"pointer",fontSize:"12px",marginTop:"2px"},children:"×"})]},r)),e.jsx("button",{onClick:h,style:{background:"#007bff",color:"white",border:"none",borderRadius:"4px",padding:"8px 16px",cursor:"pointer",fontSize:"14px",marginTop:"1rem"},children:"+ Add Item"})]})]})},parameters:{controls:{disable:!0}}};var b,C,v;s.parameters={...s.parameters,docs:{...(b=s.parameters)==null?void 0:b.docs,source:{originalSource:`{
+  args: {
+    label: 'Description',
+    value: '',
+    placeholder: 'Enter your description here...',
+    rows: 4,
+    onChange: () => {}
+  }
+}`,...(v=(C=s.parameters)==null?void 0:C.docs)==null?void 0:v.source}}};var f,y,w;l.parameters={...l.parameters,docs:{...(f=l.parameters)==null?void 0:f.docs,source:{originalSource:`{
+  args: {
+    label: 'Bio',
+    value: 'Software developer passionate about creating great user experiences.',
+    placeholder: 'Tell us about yourself...',
+    rows: 4,
+    maxLength: 200,
+    onChange: () => {}
+  }
+}`,...(w=(y=l.parameters)==null?void 0:y.docs)==null?void 0:w.source}}};var T,I,A;c.parameters={...c.parameters,docs:{...(T=c.parameters)==null?void 0:T.docs,source:{originalSource:`{
+  args: {
+    label: 'Required Message',
+    value: '',
+    placeholder: 'This field is required',
+    required: true,
+    rows: 3,
+    onChange: () => {}
+  }
+}`,...(A=(I=c.parameters)==null?void 0:I.docs)==null?void 0:A.source}}};var S,R,j;i.parameters={...i.parameters,docs:{...(S=i.parameters)==null?void 0:S.docs,source:{originalSource:`{
+  args: {
+    label: 'Notes',
+    value: '',
+    placeholder: 'Compact mode for arrays...',
+    rows: 3,
+    compact: true,
+    onChange: () => {}
+  }
+}`,...(j=(R=i.parameters)==null?void 0:R.docs)==null?void 0:j.source}}};var D,L,k;d.parameters={...d.parameters,docs:{...(D=d.parameters)==null?void 0:D.docs,source:{originalSource:`{
+  args: {
+    label: '',
+    value: '',
+    placeholder: 'No label, compact mode...',
+    rows: 2,
+    compact: true,
+    onChange: () => {}
+  }
+}`,...(k=(L=d.parameters)==null?void 0:L.docs)==null?void 0:k.source}}};var q,B,z;m.parameters={...m.parameters,docs:{...(q=m.parameters)==null?void 0:q.docs,source:{originalSource:`{
+  render: () => {
+    const [regularText, setRegularText] = useState('');
+    const [compactText, setCompactText] = useState('');
+    return <div style={{
+      display: 'flex',
+      flexDirection: 'column',
+      gap: '2rem',
+      width: '400px'
+    }}>
+                <div>
+                    <h4 style={{
+          marginBottom: '1rem',
+          color: '#333'
+        }}>Regular TextArea</h4>
+                    <TextArea label="Description" value={regularText} onChange={setRegularText} placeholder="Regular size textarea..." rows={4} maxLength={200} />
+                </div>
+                <div>
+                    <h4 style={{
+          marginBottom: '1rem',
+          color: '#333'
+        }}>Compact TextArea</h4>
+                    <TextArea label="Description" value={compactText} onChange={setCompactText} placeholder="Compact size textarea..." rows={4} maxLength={200} compact />
+                </div>
+            </div>;
+  },
+  parameters: {
+    controls: {
+      disable: true
+    }
+  }
+}`,...(z=(B=m.parameters)==null?void 0:B.docs)==null?void 0:z.source}}};var E,M,N;p.parameters={...p.parameters,docs:{...(E=p.parameters)==null?void 0:E.docs,source:{originalSource:`{
+  render: () => {
+    const [items, setItems] = useState(['First item with some text', '']);
+    const handleItemChange = (index: number, value: string) => {
+      const newItems = [...items];
+      newItems[index] = value;
+      setItems(newItems);
+    };
+    const addItem = () => {
+      setItems([...items, '']);
+    };
+    const removeItem = (index: number) => {
+      setItems(items.filter((_, i) => i !== index));
+    };
+    return <div style={{
+      width: '400px'
+    }}>
+                <h4 style={{
+        marginBottom: '1rem',
+        color: '#333'
+      }}>
+                    TextArea in Array Context (Compact Mode)
+                </h4>
+                <div style={{
+        background: '#f8f9fa',
+        padding: '1rem',
+        borderRadius: '8px',
+        border: '1px solid #dee2e6'
+      }}>
+                    {items.map((item, index) => <div key={index} style={{
+          display: 'flex',
+          alignItems: 'flex-start',
+          gap: '0.5rem',
+          marginBottom: index < items.length - 1 ? '1rem' : '0'
+        }}>
+                            <TextArea label="" value={item} onChange={value => handleItemChange(index, value)} placeholder={\`Item \${index + 1}...\`} rows={2} compact />
+                            <button onClick={() => removeItem(index)} style={{
+            background: '#dc3545',
+            color: 'white',
+            border: 'none',
+            borderRadius: '4px',
+            padding: '4px 8px',
+            cursor: 'pointer',
+            fontSize: '12px',
+            marginTop: '2px'
+          }}>
+                                ×
+                            </button>
+                        </div>)}
+                    <button onClick={addItem} style={{
+          background: '#007bff',
+          color: 'white',
+          border: 'none',
+          borderRadius: '4px',
+          padding: '8px 16px',
+          cursor: 'pointer',
+          fontSize: '14px',
+          marginTop: '1rem'
+        }}>
+                        + Add Item
+                    </button>
+                </div>
+            </div>;
+  },
+  parameters: {
+    controls: {
+      disable: true
+    }
+  }
+}`,...(N=(M=p.parameters)==null?void 0:M.docs)==null?void 0:N.source}}};const P=["Default","WithCharacterLimit","Required","Compact","CompactWithoutLabel","CompactComparison","ArrayInputDemo"];export{p as ArrayInputDemo,i as Compact,m as CompactComparison,d as CompactWithoutLabel,s as Default,c as Required,l as WithCharacterLimit,P as __namedExportsOrder,O as default};

package/storybook-static/assets/TextInput-BjVJQEYN.css

@@ -0,0 +1 @@
+._textInput_mb1yv_1{margin-bottom:var(--spacing-lg);position:relative}._textInput_mb1yv_1 label{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-sm);letter-spacing:var(--letter-spacing-wide);transition:color var(--transition-base)}._textInput_mb1yv_1 input{width:100%;padding:var(--spacing-sm) var(--spacing-md);border:2px solid var(--color-border);border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--color-background),var(--color-background-secondary));font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text);display:block;transition:all var(--transition-base);min-height:44px;-webkit-appearance:none;outline:none;box-sizing:border-box}._textInput_mb1yv_1 input:hover:not(:focus):not(:disabled){border-color:var(--color-border-hover);background:var(--color-background);box-shadow:var(--shadow-sm);transform:translateY(-1px)}._textInput_mb1yv_1 input:focus{border-color:var(--color-primary);background:var(--color-background);box-shadow:0 0 0 3px #7c3aed1a;transform:translateY(-2px)}._textInput_mb1yv_1 input::placeholder{color:var(--color-text-secondary);opacity:.6}._textInput_mb1yv_1 input:disabled{background:var(--color-background-tertiary);border-color:var(--color-border);color:var(--color-text-tertiary);cursor:not-allowed;opacity:.6;transform:none}._textInput_mb1yv_1 input[type=password]{font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,Consolas,monospace;letter-spacing:.15em}._textInput_mb1yv_1 input[type=number]::-webkit-inner-spin-button,._textInput_mb1yv_1 input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}._textInput_mb1yv_1 input[type=number]{-moz-appearance:textfield}._required_mb1yv_82{color:var(--color-error);font-weight:var(--font-weight-bold);margin-left:4px}._inputError_mb1yv_89{border-color:var(--color-error)!important;background:linear-gradient(135deg,var(--color-error-bg),var(--color-background))!important;animation:_shake_mb1yv_1 .3s cubic-bezier(.36,.07,.19,.97) both}._inputError_mb1yv_89:focus{box-shadow:0 0 0 3px #f43f5e26!important}._errorMessage_mb1yv_102{position:absolute;color:var(--color-error);font-size:var(--font-size-xs);margin-top:var(--spacing-xs);display:flex;align-items:center;gap:var(--spacing-xs);animation:_slideDown_mb1yv_1 .3s ease-out;font-weight:var(--font-weight-medium)}._errorMessage_mb1yv_102:before{content:"⚠";font-size:1.2em}@keyframes _shake_mb1yv_1{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-3px)}40%,60%{transform:translate(3px)}}@keyframes _slideDown_mb1yv_1{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}._success_mb1yv_138 input{border-color:var(--color-success)!important}._success_mb1yv_138:after{content:"✓";position:absolute;right:var(--spacing-md);top:50%;transform:translateY(-50%);color:var(--color-success);font-weight:700;font-size:var(--font-size-lg);animation:_checkIn_mb1yv_1 .3s ease-out;pointer-events:none}@keyframes _checkIn_mb1yv_1{0%{opacity:0;transform:translateY(-50%) scale(0) rotate(-45deg)}to{opacity:1;transform:translateY(-50%) scale(1) rotate(0)}}._loading_mb1yv_167 input{background-image:linear-gradient(90deg,var(--color-background) 0%,rgba(124,58,237,.05) 50%,var(--color-background) 100%);background-size:200% 100%;animation:_loading_mb1yv_167 2s ease-in-out infinite}@keyframes _loading_mb1yv_167{0%{background-position:200% 0}to{background-position:-200% 0}}._withIcon_mb1yv_184{position:relative}._withIcon_mb1yv_184 input{padding-left:44px}._inputIcon_mb1yv_192{position:absolute;left:var(--spacing-md);top:50%;transform:translateY(-50%);color:var(--color-text-secondary);width:20px;height:20px;pointer-events:none;transition:color var(--transition-base)}._textInput_mb1yv_1 input:focus~._inputIcon_mb1yv_192{color:var(--color-primary)}._withAction_mb1yv_209 input{padding-right:100px}._actionButton_mb1yv_213{position:absolute;right:8px;top:50%;transform:translateY(-50%);padding:6px 12px;background:linear-gradient(135deg,var(--color-primary),var(--color-primary-hover));color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-base)}._actionButton_mb1yv_213:hover{background:linear-gradient(135deg,var(--color-primary-hover),var(--color-primary-active));transform:translateY(-50%) scale(1.05)}._actionButton_mb1yv_213:active{transform:translateY(-50%) scale(.95)}[data-theme=dark] ._textInput_mb1yv_1 input{background:linear-gradient(135deg,var(--color-background-secondary),var(--color-background-tertiary));border-color:var(--color-border)}[data-theme=dark] ._textInput_mb1yv_1 input:hover:not(:focus):not(:disabled){background:var(--color-background-secondary);border-color:var(--color-border-hover)}[data-theme=dark] ._textInput_mb1yv_1 input:focus{background:var(--color-background-secondary);border-color:var(--color-primary-light);box-shadow:0 0 0 3px #a78bfa1a}[data-theme=dark] ._inputError_mb1yv_89{background:linear-gradient(135deg,rgba(244,63,94,.1),var(--color-background-secondary))!important}[data-theme=dark] ._inputIcon_mb1yv_192{color:var(--color-text-tertiary)}[data-theme=dark] ._textInput_mb1yv_1 input:focus~._inputIcon_mb1yv_192{color:var(--color-primary-light)}@media (max-width: 768px){._textInput_mb1yv_1{margin-bottom:var(--spacing-md)}._textInput_mb1yv_1 label{font-size:var(--font-size-base);margin-bottom:var(--spacing-xs)}._textInput_mb1yv_1 input{min-height:48px;padding:var(--spacing-md);font-size:16px;border-radius:var(--radius-md)}._withIcon_mb1yv_184 input{padding-left:48px}._inputIcon_mb1yv_192{left:var(--spacing-md);width:24px;height:24px}._errorMessage_mb1yv_102{font-size:var(--font-size-sm);position:static;margin-top:var(--spacing-sm)}}@media (prefers-contrast: high){._textInput_mb1yv_1 input{border-width:3px}._textInput_mb1yv_1 input:focus{outline:2px solid var(--color-primary);outline-offset:2px}}@media (prefers-reduced-motion: reduce){._textInput_mb1yv_1 input,._inputIcon_mb1yv_192,._errorMessage_mb1yv_102{animation:none;transition:none}}._textInput_mb1yv_1 input:-webkit-autofill,._textInput_mb1yv_1 input:-webkit-autofill:hover,._textInput_mb1yv_1 input:-webkit-autofill:focus{-webkit-text-fill-color:var(--color-text);-webkit-box-shadow:0 0 0px 1000px var(--color-background) inset;transition:background-color 5000s ease-in-out 0s;border:2px solid var(--color-primary)}._textInput_mb1yv_1 input[type=search]::-webkit-search-decoration,._textInput_mb1yv_1 input[type=search]::-webkit-search-cancel-button,._textInput_mb1yv_1 input[type=search]::-webkit-search-results-button,._textInput_mb1yv_1 input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none}

package/storybook-static/assets/TextInput-ZGg8LTL_.js

@@ -0,0 +1,28 @@
+import{j as s}from"./iframe-BUaP2gIF.js";const g="_textInput_mb1yv_1",I="_required_mb1yv_82",w="_inputError_mb1yv_89",j="_errorMessage_mb1yv_102",q="_success_mb1yv_138",E="_loading_mb1yv_167",N="_withIcon_mb1yv_184",A="_inputIcon_mb1yv_192",C="_withAction_mb1yv_209",T="_actionButton_mb1yv_213",e={textInput:g,required:I,inputError:w,errorMessage:j,success:q,loading:E,withIcon:N,inputIcon:A,withAction:C,actionButton:T};function M({label:u,value:c,onChange:d,type:p="text",onFocus:m,onBlur:h,placeholder:_,error:n,required:f,disabled:l=!1,success:v=!1,loading:o=!1,icon:r,actionButton:a,maxLength:b,autoComplete:x}){const i=`input-${Math.random().toString(36).substr(2,9)}`,y=()=>{const t=[e.textInput];return v&&t.push(e.success),o&&t.push(e.loading),r&&t.push(e.withIcon),a&&t.push(e.withAction),t.join(" ")};return s.jsxs("div",{className:y(),children:[s.jsxs("label",{htmlFor:i,children:[u,f&&s.jsx("span",{className:e.required,children:"*"})]}),s.jsxs("div",{style:{position:"relative"},children:[r&&s.jsx("div",{className:e.inputIcon,children:r}),s.jsx("input",{id:i,type:p,value:c,onChange:t=>d(t.target.value),onFocus:m,onBlur:h,placeholder:_,className:n?e.inputError:"","aria-invalid":!!n,"aria-describedby":n?`${i}-error`:void 0,disabled:l||o,maxLength:b,autoComplete:x}),a&&s.jsx("button",{type:"button",className:e.actionButton,onClick:a.onClick,disabled:l||o,children:a.label})]}),n&&s.jsx("span",{id:`${i}-error`,className:e.errorMessage,children:n})]})}M.__docgenInfo={description:`TextInput component - A versatile text input field with label and error handling
+
+@component
+@description
+A foundational input component that provides a clean, accessible text field with
+built-in support for labels, validation errors, and various HTML5 input types.
+Follows design system tokens for consistent theming across light/dark modes.
+
+@example
+// Basic usage
+<TextInput
+  label="Email Address"
+  value={email}
+  onChange={setEmail}
+  type="email"
+  placeholder="Enter your email"
+/>
+
+@example
+// With validation error
+<TextInput
+  label="Password"
+  value={password}
+  onChange={setPassword}
+  type="password"
+  error="Password must be at least 8 characters"
+  required
+/>`,methods:[],displayName:"TextInput",props:{type:{defaultValue:{value:'"text"',computed:!1},required:!1},disabled:{defaultValue:{value:"false",computed:!1},required:!1},success:{defaultValue:{value:"false",computed:!1},required:!1},loading:{defaultValue:{value:"false",computed:!1},required:!1}}};export{M as T};