@stfrigerio/sito-template 0.1.36 → 0.1.37

package/storybook-static/assets/SearchableDropdown.stories-ByZj6lJu.js

@@ -0,0 +1,282 @@
+import{j as e,r as C}from"./iframe-BUaP2gIF.js";import{S as r}from"./SearchableDropdown-ByAXm1md.js";import{e as q,f as Q}from"./index-5bdJXrkD.js";import"./preload-helper-C1FmrZbK.js";import"./proxy-9Y4F2rF8.js";import"./index-CZs7_DA6.js";const ae={title:"Atoms/SearchableDropdown",component:r,parameters:{layout:"centered",docs:{description:{component:"A dropdown component with built-in search functionality and smooth animations."}}},tags:["autodocs"],argTypes:{label:{control:"text",description:"Label for the dropdown"},value:{control:"text",description:"Currently selected value"},placeholder:{control:"text",description:"Placeholder text when no option is selected"},allowEmpty:{control:"boolean",description:"Whether to allow empty/no selection"},onChange:{action:"changed"}}},t=[{label:"United States",value:"us"},{label:"United Kingdom",value:"uk"},{label:"Canada",value:"ca"},{label:"Germany",value:"de"},{label:"France",value:"fr"},{label:"Italy",value:"it"},{label:"Spain",value:"es"},{label:"Japan",value:"jp"},{label:"Australia",value:"au"},{label:"Brazil",value:"br"}],u=[{label:"New York",value:"ny"},{label:"Los Angeles",value:"la"},{label:"Chicago",value:"chi"},{label:"Houston",value:"hou"},{label:"Phoenix",value:"phx"},{label:"Philadelphia",value:"phi"},{label:"San Antonio",value:"sa"},{label:"San Diego",value:"sd"},{label:"Dallas",value:"dal"},{label:"San Jose",value:"sj"}],s=[{label:"React",value:"react"},{label:"Vue.js",value:"vue"},{label:"Angular",value:"angular"},{label:"Svelte",value:"svelte"},{label:"TypeScript",value:"typescript"},{label:"JavaScript",value:"javascript"},{label:"Node.js",value:"nodejs"},{label:"Python",value:"python"},{label:"Java",value:"java"},{label:"C#",value:"csharp"},{label:"Go",value:"go"},{label:"Rust",value:"rust"}],y={args:{label:"Select Country",value:"",options:t,placeholder:"Choose a country",allowEmpty:!0,onChange:()=>{}}},m={args:{label:"Selected Country",value:"us",options:t,placeholder:"Choose a country",allowEmpty:!0,onChange:()=>{}}},g={args:{label:"Technology Stack",value:"react",options:s,placeholder:"Select technology",allowEmpty:!1,onChange:()=>{}}},b={args:{label:"Choose City",value:"",options:u,placeholder:"Search for a city",allowEmpty:!0,onChange:()=>{}}},v={args:{label:"Country",value:"",options:t,placeholder:"Search countries...",allowEmpty:!0,onChange:()=>{}},render:()=>{var p,c;const[l,d]=C.useState(""),[n,i]=C.useState("react");return e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"1rem",width:"300px"},children:[e.jsx(r,{label:"Country",value:l,onChange:d,options:t,placeholder:"Search countries...",allowEmpty:!0}),e.jsx(r,{label:"Technology",value:n,onChange:i,options:s,placeholder:"Search technologies...",allowEmpty:!1}),e.jsxs("div",{style:{marginTop:"1rem",padding:"1rem",background:"#f5f5f5",borderRadius:"4px"},children:[e.jsx("p",{style:{margin:0,fontSize:"0.875rem"},children:e.jsx("strong",{children:"Selected Values:"})}),e.jsxs("ul",{style:{margin:"0.5rem 0 0",paddingLeft:"1.5rem",fontSize:"0.875rem"},children:[e.jsxs("li",{children:["Country: ",l?(p=t.find(o=>o.value===l))==null?void 0:p.label:"None"]}),e.jsxs("li",{children:["Technology: ",(c=s.find(o=>o.value===n))==null?void 0:c.label]})]})]})]})},parameters:{controls:{disable:!0}}},f={args:{label:"Country",value:"",options:t,placeholder:"Search for your country",allowEmpty:!1,onChange:()=>{}},render:()=>{var i,p,c;const[l,d]=C.useState({country:"",city:"",skills:""}),n=(o,h)=>{d(a=>({...a,[o]:h}))};return e.jsxs("div",{style:{padding:"1.5rem",background:"#fff",border:"1px solid #e0e0e0",borderRadius:"8px",maxWidth:"400px"},children:[e.jsxs("h3",{style:{marginTop:0,display:"flex",alignItems:"center",gap:"0.5rem"},children:[e.jsx(q,{})," User Profile"]}),e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"1rem"},children:[e.jsx(r,{label:"Country",value:l.country,onChange:o=>n("country",o),options:t,placeholder:"Search for your country",allowEmpty:!1}),e.jsx(r,{label:"City",value:l.city,onChange:o=>n("city",o),options:u,placeholder:"Search for your city",allowEmpty:!0}),e.jsx(r,{label:"Primary Skill",value:l.skills,onChange:o=>n("skills",o),options:s,placeholder:"Search technologies",allowEmpty:!0})]}),e.jsxs("div",{style:{marginTop:"1rem",padding:"0.75rem",background:"#f8f9fa",borderRadius:"4px",fontSize:"0.875rem"},children:[e.jsx("strong",{children:"Profile Summary:"}),e.jsx("br",{}),"🌍 Country: ",l.country?(i=t.find(o=>o.value===l.country))==null?void 0:i.label:"Not specified",e.jsx("br",{}),"📍 City: ",l.city?(p=u.find(o=>o.value===l.city))==null?void 0:p.label:"Not specified",e.jsx("br",{}),"💻 Skills: ",l.skills?(c=s.find(o=>o.value===l.skills))==null?void 0:c.label:"Not specified"]})]})},parameters:{controls:{disable:!0}}},x={args:{label:"Location",value:"",options:u,placeholder:"Search locations...",allowEmpty:!0,onChange:()=>{}},render:()=>{var c,o,h;const[l,d]=C.useState({location:"",technology:"",experience:""}),n=[{label:"Entry Level (0-2 years)",value:"entry"},{label:"Mid Level (3-5 years)",value:"mid"},{label:"Senior Level (6-10 years)",value:"senior"},{label:"Lead/Principal (10+ years)",value:"lead"}],i=(a,K)=>{d(Y=>({...Y,[a]:K}))},p=()=>{d({location:"",technology:"",experience:""})};return e.jsxs("div",{style:{padding:"1.5rem",background:"#f8f9fa",border:"1px solid #dee2e6",borderRadius:"8px",maxWidth:"500px"},children:[e.jsxs("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",marginBottom:"1rem"},children:[e.jsxs("h3",{style:{margin:0,display:"flex",alignItems:"center",gap:"0.5rem"},children:[e.jsx(Q,{})," Job Search Filters"]}),e.jsx("button",{onClick:p,style:{padding:"0.25rem 0.75rem",fontSize:"0.75rem",backgroundColor:"transparent",border:"1px solid #6c757d",borderRadius:"4px",cursor:"pointer"},children:"Clear All"})]}),e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"1rem"},children:[e.jsx(r,{label:"Location",value:l.location,onChange:a=>i("location",a),options:u,placeholder:"Search locations...",allowEmpty:!0}),e.jsx(r,{label:"Technology",value:l.technology,onChange:a=>i("technology",a),options:s,placeholder:"Search technologies...",allowEmpty:!0}),e.jsx(r,{label:"Experience Level",value:l.experience,onChange:a=>i("experience",a),options:n,placeholder:"Select experience level...",allowEmpty:!0})]}),e.jsxs("div",{style:{marginTop:"1rem",padding:"0.75rem",background:"#fff",borderRadius:"4px",fontSize:"0.875rem"},children:[e.jsx("strong",{children:"Active Filters:"}),e.jsx("br",{}),!l.location&&!l.technology&&!l.experience?e.jsx("em",{children:"No filters applied"}):e.jsxs("ul",{style:{margin:"0.5rem 0 0",paddingLeft:"1.5rem"},children:[l.location&&e.jsxs("li",{children:["📍 ",(c=u.find(a=>a.value===l.location))==null?void 0:c.label]}),l.technology&&e.jsxs("li",{children:["💻 ",(o=s.find(a=>a.value===l.technology))==null?void 0:o.label]}),l.experience&&e.jsxs("li",{children:["🎯 ",(h=n.find(a=>a.value===l.experience))==null?void 0:h.label]})]})]})]})},parameters:{controls:{disable:!0}}},S={args:{label:"With Empty Option",value:"",options:t.slice(0,5),placeholder:"Choose...",allowEmpty:!0,onChange:()=>{}},render:()=>e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"1rem",width:"300px"},children:[e.jsx(r,{label:"With Empty Option",value:"",onChange:()=>{},options:t.slice(0,5),placeholder:"Choose...",allowEmpty:!0}),e.jsx(r,{label:"No Empty Option",value:"react",onChange:()=>{},options:s.slice(0,5),placeholder:"Choose...",allowEmpty:!1}),e.jsx(r,{label:"Pre-selected",value:"us",onChange:()=>{},options:t.slice(0,5),placeholder:"Choose...",allowEmpty:!0}),e.jsx(r,{label:"Long Options List",value:"",onChange:()=>{},options:s,placeholder:"Search technologies...",allowEmpty:!0})]}),parameters:{controls:{disable:!0}}};var w,E,j;y.parameters={...y.parameters,docs:{...(w=y.parameters)==null?void 0:w.docs,source:{originalSource:`{
+  args: {
+    label: 'Select Country',
+    value: '',
+    options: countryOptions,
+    placeholder: 'Choose a country',
+    allowEmpty: true,
+    onChange: () => {}
+  }
+}`,...(j=(E=y.parameters)==null?void 0:E.docs)==null?void 0:j.source}}};var k,O,L;m.parameters={...m.parameters,docs:{...(k=m.parameters)==null?void 0:k.docs,source:{originalSource:`{
+  args: {
+    label: 'Selected Country',
+    value: 'us',
+    options: countryOptions,
+    placeholder: 'Choose a country',
+    allowEmpty: true,
+    onChange: () => {}
+  }
+}`,...(L=(O=m.parameters)==null?void 0:O.docs)==null?void 0:L.source}}};var D,F,T;g.parameters={...g.parameters,docs:{...(D=g.parameters)==null?void 0:D.docs,source:{originalSource:`{
+  args: {
+    label: 'Technology Stack',
+    value: 'react',
+    options: techStackOptions,
+    placeholder: 'Select technology',
+    allowEmpty: false,
+    onChange: () => {}
+  }
+}`,...(T=(F=g.parameters)==null?void 0:F.docs)==null?void 0:T.source}}};var P,N,R;b.parameters={...b.parameters,docs:{...(P=b.parameters)==null?void 0:P.docs,source:{originalSource:`{
+  args: {
+    label: 'Choose City',
+    value: '',
+    options: cityOptions,
+    placeholder: 'Search for a city',
+    allowEmpty: true,
+    onChange: () => {}
+  }
+}`,...(R=(N=b.parameters)==null?void 0:N.docs)==null?void 0:R.source}}};var A,z,W;v.parameters={...v.parameters,docs:{...(A=v.parameters)==null?void 0:A.docs,source:{originalSource:`{
+  args: {
+    label: 'Country',
+    value: '',
+    options: countryOptions,
+    placeholder: 'Search countries...',
+    allowEmpty: true,
+    onChange: () => {}
+  },
+  render: () => {
+    const [selectedCountry, setSelectedCountry] = useState('');
+    const [selectedTech, setSelectedTech] = useState('react');
+    return <div style={{
+      display: 'flex',
+      flexDirection: 'column',
+      gap: '1rem',
+      width: '300px'
+    }}>
+                <SearchableDropdown label="Country" value={selectedCountry} onChange={setSelectedCountry} options={countryOptions} placeholder="Search countries..." allowEmpty={true} />
+                <SearchableDropdown label="Technology" value={selectedTech} onChange={setSelectedTech} options={techStackOptions} placeholder="Search technologies..." allowEmpty={false} />
+                <div style={{
+        marginTop: '1rem',
+        padding: '1rem',
+        background: '#f5f5f5',
+        borderRadius: '4px'
+      }}>
+                    <p style={{
+          margin: 0,
+          fontSize: '0.875rem'
+        }}>
+                        <strong>Selected Values:</strong>
+                    </p>
+                    <ul style={{
+          margin: '0.5rem 0 0',
+          paddingLeft: '1.5rem',
+          fontSize: '0.875rem'
+        }}>
+                        <li>Country: {selectedCountry ? countryOptions.find(c => c.value === selectedCountry)?.label : 'None'}</li>
+                        <li>Technology: {techStackOptions.find(t => t.value === selectedTech)?.label}</li>
+                    </ul>
+                </div>
+            </div>;
+  },
+  parameters: {
+    controls: {
+      disable: true
+    }
+  }
+}`,...(W=(z=v.parameters)==null?void 0:z.docs)==null?void 0:W.source}}};var I,J,V;f.parameters={...f.parameters,docs:{...(I=f.parameters)==null?void 0:I.docs,source:{originalSource:`{
+  args: {
+    label: 'Country',
+    value: '',
+    options: countryOptions,
+    placeholder: 'Search for your country',
+    allowEmpty: false,
+    onChange: () => {}
+  },
+  render: () => {
+    const [profile, setProfile] = useState({
+      country: '',
+      city: '',
+      skills: ''
+    });
+    const handleChange = (field: keyof typeof profile, value: string) => {
+      setProfile(prev => ({
+        ...prev,
+        [field]: value
+      }));
+    };
+    return <div style={{
+      padding: '1.5rem',
+      background: '#fff',
+      border: '1px solid #e0e0e0',
+      borderRadius: '8px',
+      maxWidth: '400px'
+    }}>
+                <h3 style={{
+        marginTop: 0,
+        display: 'flex',
+        alignItems: 'center',
+        gap: '0.5rem'
+      }}>
+                    <FiUsers /> User Profile
+                </h3>
+                <div style={{
+        display: 'flex',
+        flexDirection: 'column',
+        gap: '1rem'
+      }}>
+                    <SearchableDropdown label="Country" value={profile.country} onChange={value => handleChange('country', value)} options={countryOptions} placeholder="Search for your country" allowEmpty={false} />
+                    <SearchableDropdown label="City" value={profile.city} onChange={value => handleChange('city', value)} options={cityOptions} placeholder="Search for your city" allowEmpty={true} />
+                    <SearchableDropdown label="Primary Skill" value={profile.skills} onChange={value => handleChange('skills', value)} options={techStackOptions} placeholder="Search technologies" allowEmpty={true} />
+                </div>
+                <div style={{
+        marginTop: '1rem',
+        padding: '0.75rem',
+        background: '#f8f9fa',
+        borderRadius: '4px',
+        fontSize: '0.875rem'
+      }}>
+                    <strong>Profile Summary:</strong><br />
+                    🌍 Country: {profile.country ? countryOptions.find(c => c.value === profile.country)?.label : 'Not specified'}<br />
+                    📍 City: {profile.city ? cityOptions.find(c => c.value === profile.city)?.label : 'Not specified'}<br />
+                    💻 Skills: {profile.skills ? techStackOptions.find(s => s.value === profile.skills)?.label : 'Not specified'}
+                </div>
+            </div>;
+  },
+  parameters: {
+    controls: {
+      disable: true
+    }
+  }
+}`,...(V=(J=f.parameters)==null?void 0:J.docs)==null?void 0:V.source}}};var U,B,G;x.parameters={...x.parameters,docs:{...(U=x.parameters)==null?void 0:U.docs,source:{originalSource:`{
+  args: {
+    label: 'Location',
+    value: '',
+    options: cityOptions,
+    placeholder: 'Search locations...',
+    allowEmpty: true,
+    onChange: () => {}
+  },
+  render: () => {
+    const [filters, setFilters] = useState({
+      location: '',
+      technology: '',
+      experience: ''
+    });
+    const experienceOptions = [{
+      label: 'Entry Level (0-2 years)',
+      value: 'entry'
+    }, {
+      label: 'Mid Level (3-5 years)',
+      value: 'mid'
+    }, {
+      label: 'Senior Level (6-10 years)',
+      value: 'senior'
+    }, {
+      label: 'Lead/Principal (10+ years)',
+      value: 'lead'
+    }];
+    const updateFilter = (field: keyof typeof filters, value: string) => {
+      setFilters(prev => ({
+        ...prev,
+        [field]: value
+      }));
+    };
+    const clearFilters = () => {
+      setFilters({
+        location: '',
+        technology: '',
+        experience: ''
+      });
+    };
+    return <div style={{
+      padding: '1.5rem',
+      background: '#f8f9fa',
+      border: '1px solid #dee2e6',
+      borderRadius: '8px',
+      maxWidth: '500px'
+    }}>
+                <div style={{
+        display: 'flex',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        marginBottom: '1rem'
+      }}>
+                    <h3 style={{
+          margin: 0,
+          display: 'flex',
+          alignItems: 'center',
+          gap: '0.5rem'
+        }}>
+                        <FiSearch /> Job Search Filters
+                    </h3>
+                    <button onClick={clearFilters} style={{
+          padding: '0.25rem 0.75rem',
+          fontSize: '0.75rem',
+          backgroundColor: 'transparent',
+          border: '1px solid #6c757d',
+          borderRadius: '4px',
+          cursor: 'pointer'
+        }}>
+                        Clear All
+                    </button>
+                </div>
+                
+                <div style={{
+        display: 'flex',
+        flexDirection: 'column',
+        gap: '1rem'
+      }}>
+                    <SearchableDropdown label="Location" value={filters.location} onChange={value => updateFilter('location', value)} options={cityOptions} placeholder="Search locations..." allowEmpty={true} />
+                    <SearchableDropdown label="Technology" value={filters.technology} onChange={value => updateFilter('technology', value)} options={techStackOptions} placeholder="Search technologies..." allowEmpty={true} />
+                    <SearchableDropdown label="Experience Level" value={filters.experience} onChange={value => updateFilter('experience', value)} options={experienceOptions} placeholder="Select experience level..." allowEmpty={true} />
+                </div>
+                
+                <div style={{
+        marginTop: '1rem',
+        padding: '0.75rem',
+        background: '#fff',
+        borderRadius: '4px',
+        fontSize: '0.875rem'
+      }}>
+                    <strong>Active Filters:</strong><br />
+                    {!filters.location && !filters.technology && !filters.experience ? <em>No filters applied</em> : <ul style={{
+          margin: '0.5rem 0 0',
+          paddingLeft: '1.5rem'
+        }}>
+                            {filters.location && <li>📍 {cityOptions.find(c => c.value === filters.location)?.label}</li>}
+                            {filters.technology && <li>💻 {techStackOptions.find(t => t.value === filters.technology)?.label}</li>}
+                            {filters.experience && <li>🎯 {experienceOptions.find(e => e.value === filters.experience)?.label}</li>}
+                        </ul>}
+                </div>
+            </div>;
+  },
+  parameters: {
+    controls: {
+      disable: true
+    }
+  }
+}`,...(G=(B=x.parameters)==null?void 0:B.docs)==null?void 0:G.source}}};var M,_,H;S.parameters={...S.parameters,docs:{...(M=S.parameters)==null?void 0:M.docs,source:{originalSource:`{
+  args: {
+    label: 'With Empty Option',
+    value: '',
+    options: countryOptions.slice(0, 5),
+    placeholder: 'Choose...',
+    allowEmpty: true,
+    onChange: () => {}
+  },
+  render: () => <div style={{
+    display: 'flex',
+    flexDirection: 'column',
+    gap: '1rem',
+    width: '300px'
+  }}>
+            <SearchableDropdown label="With Empty Option" value="" onChange={() => {}} options={countryOptions.slice(0, 5)} placeholder="Choose..." allowEmpty={true} />
+            <SearchableDropdown label="No Empty Option" value="react" onChange={() => {}} options={techStackOptions.slice(0, 5)} placeholder="Choose..." allowEmpty={false} />
+            <SearchableDropdown label="Pre-selected" value="us" onChange={() => {}} options={countryOptions.slice(0, 5)} placeholder="Choose..." allowEmpty={true} />
+            <SearchableDropdown label="Long Options List" value="" onChange={() => {}} options={techStackOptions} placeholder="Search technologies..." allowEmpty={true} />
+        </div>,
+  parameters: {
+    controls: {
+      disable: true
+    }
+  }
+}`,...(H=(_=S.parameters)==null?void 0:_.docs)==null?void 0:H.source}}};const re=["Default","WithValue","NoEmptyOption","LongList","Interactive","ProfileForm","JobFilter","AllVariants"];export{S as AllVariants,y as Default,v as Interactive,x as JobFilter,b as LongList,g as NoEmptyOption,f as ProfileForm,m as WithValue,re as __namedExportsOrder,ae as default};

package/storybook-static/assets/SelectInput-BTPptV1H.css

@@ -0,0 +1 @@
+._selectInput_evuah_1{margin-bottom:var(--spacing-lg);position:relative}._selectInput_evuah_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)}._selectWrapper_evuah_16{position:relative;width:100%}._selectInput_evuah_1 select{width:100%;padding:var(--spacing-sm) var(--spacing-md);padding-right:48px;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;appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;transition:all var(--transition-base);min-height:44px;outline:none}._selectInput_evuah_1 select:hover:not(:focus):not(:disabled){border-color:var(--color-border-hover);background:var(--color-background);box-shadow:var(--shadow-sm);transform:translateY(-1px)}._selectInput_evuah_1 select:focus{border-color:var(--color-primary);background:var(--color-background);box-shadow:0 0 0 3px #7c3aed1a;transform:translateY(-2px)}._selectInput_evuah_1 select:disabled{background:var(--color-background-tertiary);border-color:var(--color-border);color:var(--color-text-tertiary);cursor:not-allowed;opacity:.6;transform:none}._selectIcon_evuah_68{position:absolute;right:var(--spacing-md);top:50%;transform:translateY(-50%);pointer-events:none;color:var(--color-primary);width:20px;height:20px;transition:color var(--transition-base)}._selectInput_evuah_1 select:hover:not(:disabled)~._selectIcon_evuah_68{color:var(--color-primary-hover)}._selectInput_evuah_1 select:focus~._selectIcon_evuah_68{color:var(--color-primary-hover)}._selectWrapper_evuah_16:before{content:"";position:absolute;right:8px;top:50%;transform:translateY(-50%);width:32px;height:32px;background:linear-gradient(135deg,#7c3aed0d,#7c3aed1a);border-radius:var(--radius-md);pointer-events:none;opacity:0;transition:opacity var(--transition-base)}._selectInput_evuah_1 select:focus~:before{opacity:1}._selectInput_evuah_1 select option{padding:var(--spacing-sm);background:var(--color-background);color:var(--color-text);font-weight:var(--font-weight-normal)}._selectInput_evuah_1 select option:checked{background:linear-gradient(135deg,var(--color-primary-lighter),var(--color-primary-light));color:var(--color-text)}._selectInput_evuah_1 select option[value=""]{color:var(--color-text-secondary);font-style:italic}._error_evuah_134 select{border-color:var(--color-error);background:linear-gradient(135deg,var(--color-error-bg),var(--color-background));animation:_shake_evuah_1 .3s cubic-bezier(.36,.07,.19,.97) both}._error_evuah_134 label{color:var(--color-error)}._error_evuah_134 select:focus{box-shadow:0 0 0 3px #f43f5e26}._error_evuah_134 ._selectIcon_evuah_68{color:var(--color-error)}@keyframes _shake_evuah_1{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-3px)}40%,60%{transform:translate(3px)}}._success_evuah_163 select{border-color:var(--color-success)}._success_evuah_163:after{content:"✓";position:absolute;right:52px;top:50%;transform:translateY(-50%);color:var(--color-success);font-weight:700;animation:_checkIn_evuah_1 .3s ease-out}@keyframes _checkIn_evuah_1{0%{opacity:0;transform:translateY(-50%) scale(0)}to{opacity:1;transform:translateY(-50%) scale(1)}}._loading_evuah_190 select{position:relative;overflow:hidden}._loading_evuah_190:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(124,58,237,.1),transparent);animation:_shimmer_evuah_1 2s infinite;pointer-events:none}@keyframes _shimmer_evuah_1{to{left:100%}}[data-theme=dark] ._selectInput_evuah_1 select{background:linear-gradient(135deg,var(--color-background-secondary),var(--color-background-tertiary));border-color:var(--color-border)}[data-theme=dark] ._selectInput_evuah_1 select:hover:not(:disabled){background:var(--color-background-secondary);border-color:var(--color-border-hover)}[data-theme=dark] ._selectInput_evuah_1 select:focus{background:var(--color-background-secondary);border-color:var(--color-primary-light);box-shadow:0 0 0 3px #a78bfa1a}[data-theme=dark] ._selectIcon_evuah_68{color:var(--color-primary-light)}[data-theme=dark] ._selectWrapper_evuah_16:before{background:linear-gradient(135deg,#a78bfa0d,#a78bfa1a)}[data-theme=dark] ._selectInput_evuah_1 select option{background:var(--color-background-secondary)}[data-theme=dark] ._selectInput_evuah_1 select option:checked{background:var(--color-primary)}@media (max-width: 768px){._selectInput_evuah_1{margin-bottom:var(--spacing-md)}._selectInput_evuah_1 label{font-size:var(--font-size-base);margin-bottom:var(--spacing-xs)}._selectInput_evuah_1 select{min-height:48px;padding:var(--spacing-md);padding-right:52px;font-size:16px}._selectIcon_evuah_68{right:var(--spacing-md);width:24px;height:24px}._selectWrapper_evuah_16:before{width:36px;height:36px;right:10px}._selectInput_evuah_1 select:active:not(:disabled){transform:translateY(0);background:var(--color-background-tertiary)}}@-moz-document url-prefix(){._selectInput_evuah_1 select{padding-top:calc(var(--spacing-sm) + 1px);padding-bottom:calc(var(--spacing-sm) + 1px)}}@media (prefers-contrast: high){._selectInput_evuah_1 select{border-width:3px}._selectInput_evuah_1 select:focus{outline:2px solid var(--color-primary);outline-offset:2px}}

package/storybook-static/assets/SelectInput-D-AwfWVz.js

@@ -0,0 +1,31 @@
+import{j as s}from"./iframe-BUaP2gIF.js";import{g as m}from"./index-5bdJXrkD.js";const _="_selectInput_evuah_1",b="_selectWrapper_evuah_16",g="_selectIcon_evuah_68",y="_error_evuah_134",I="_success_evuah_163",x="_loading_evuah_190",l={selectInput:_,selectWrapper:b,selectIcon:g,error:y,success:I,loading:x};function S({label:r,value:o,onChange:c,options:u,placeholder:i="Select...",disabled:p=!1,error:d=!1,success:f=!1,loading:a=!1,required:t=!1}){const v=()=>{const e=[l.selectInput];return d&&e.push(l.error),f&&e.push(l.success),a&&e.push(l.loading),e.join(" ")};return s.jsxs("div",{className:v(),children:[s.jsxs("label",{children:[r,t&&s.jsx("span",{style:{color:"var(--color-error)"},children:" *"})]}),s.jsxs("div",{className:l.selectWrapper,children:[s.jsxs("select",{value:o,onChange:e=>c(e.target.value),disabled:p||a,required:t,children:[s.jsx("option",{value:"",children:i}),u.map(e=>{const n=typeof e=="string"?e:e.value,h=typeof e=="string"?e:e.label;return s.jsx("option",{value:n,children:h},n)})]}),s.jsx(m,{className:l.selectIcon})]})]})}S.__docgenInfo={description:`SelectInput component - Styled dropdown selector with flexible option format
+
+@component
+@description
+A customizable select dropdown that accepts both simple string arrays and
+label-value object arrays for options. Features custom styling that maintains
+consistency across browsers while preserving native select functionality.
+Includes a styled chevron icon for better visual feedback.
+
+@example
+// With simple string options
+<SelectInput
+  label="Country"
+  value={country}
+  onChange={setCountry}
+  options={['Italy', 'France', 'Spain', 'Germany']}
+  placeholder="Select a country"
+/>
+
+@example
+// With label-value pairs
+<SelectInput
+  label="Status"
+  value={status}
+  onChange={setStatus}
+  options={[
+    { label: 'Active', value: 'active' },
+    { label: 'Pending', value: 'pending' },
+    { label: 'Archived', value: 'archived' }
+  ]}
+/>`,methods:[],displayName:"SelectInput",props:{placeholder:{defaultValue:{value:'"Select..."',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},required:{defaultValue:{value:"false",computed:!1},required:!1}}};export{S};

package/storybook-static/assets/SelectInput.stories-MyE-GqOw.js

@@ -0,0 +1,112 @@
+import{r as w,j as t}from"./iframe-BUaP2gIF.js";import{S as l}from"./SelectInput-D-AwfWVz.js";import"./preload-helper-C1FmrZbK.js";import"./index-5bdJXrkD.js";const E={title:"Atoms/SelectInput",component:l,parameters:{layout:"centered",docs:{description:{component:"A simple dropdown select component with customizable options."}}},tags:["autodocs"],argTypes:{label:{control:"text",description:"Label for the select input"},value:{control:"text",description:"Currently selected value"},placeholder:{control:"text",description:"Placeholder text when no value is selected"},onChange:{action:"changed"}}},P=["Option 1","Option 2","Option 3","Option 4"],p=[{label:"United States",value:"us"},{label:"United Kingdom",value:"uk"},{label:"Canada",value:"ca"},{label:"Australia",value:"au"},{label:"Germany",value:"de"},{label:"France",value:"fr"},{label:"Italy",value:"it"},{label:"Spain",value:"es"}],r={args:{label:"Select an option",value:"",options:P,placeholder:"Choose..."}},n={args:{label:"Choose your favorite",value:"Option 2",options:P}},s={args:{label:"Country",value:"uk",options:p,placeholder:"Select a country"}},i={args:{label:"Priority",value:"",options:["Low","Medium","High","Critical"]}},c={render:()=>{var a;const[e,o]=w.useState("");return t.jsxs("div",{children:[t.jsx(l,{label:"Select your country",value:e,onChange:o,options:p,placeholder:"Choose a country"}),e&&t.jsxs("p",{style:{marginTop:"1rem",fontSize:"0.875rem",color:"#666"},children:["Selected: ",((a=p.find(k=>k.value===e))==null?void 0:a.label)||e]})]})}},u={render:()=>{const[e,o]=w.useState({title:"",category:"",priority:"",assignee:""});return t.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"1rem",padding:"1.5rem",background:"#f9f9f9",borderRadius:"8px",minWidth:"300px"},children:[t.jsx("h3",{style:{marginTop:0},children:"Create Task"}),t.jsx(l,{label:"Title",value:e.title,onChange:a=>o({...e,title:a}),options:["Mr","Mrs","Ms","Dr","Prof"],placeholder:"Select title"}),t.jsx(l,{label:"Category",value:e.category,onChange:a=>o({...e,category:a}),options:[{label:"Bug",value:"bug"},{label:"Feature",value:"feature"},{label:"Documentation",value:"docs"},{label:"Testing",value:"test"}],placeholder:"Select category"}),t.jsx(l,{label:"Priority",value:e.priority,onChange:a=>o({...e,priority:a}),options:["Low","Medium","High","Critical"],placeholder:"Select priority"}),t.jsx(l,{label:"Assignee",value:e.assignee,onChange:a=>o({...e,assignee:a}),options:[{label:"John Doe",value:"john"},{label:"Jane Smith",value:"jane"},{label:"Bob Johnson",value:"bob"},{label:"Alice Brown",value:"alice"}],placeholder:"Select assignee"})]})},parameters:{controls:{disable:!0}}};var d,m,g;r.parameters={...r.parameters,docs:{...(d=r.parameters)==null?void 0:d.docs,source:{originalSource:`{
+  args: {
+    label: 'Select an option',
+    value: '',
+    options: simpleOptions,
+    placeholder: 'Choose...'
+  }
+}`,...(g=(m=r.parameters)==null?void 0:m.docs)==null?void 0:g.source}}};var v,h,b;n.parameters={...n.parameters,docs:{...(v=n.parameters)==null?void 0:v.docs,source:{originalSource:`{
+  args: {
+    label: 'Choose your favorite',
+    value: 'Option 2',
+    options: simpleOptions
+  }
+}`,...(b=(h=n.parameters)==null?void 0:h.docs)==null?void 0:b.source}}};var y,S,C;s.parameters={...s.parameters,docs:{...(y=s.parameters)==null?void 0:y.docs,source:{originalSource:`{
+  args: {
+    label: 'Country',
+    value: 'uk',
+    options: countryOptions,
+    placeholder: 'Select a country'
+  }
+}`,...(C=(S=s.parameters)==null?void 0:S.docs)==null?void 0:C.source}}};var f,x,D;i.parameters={...i.parameters,docs:{...(f=i.parameters)==null?void 0:f.docs,source:{originalSource:`{
+  args: {
+    label: 'Priority',
+    value: '',
+    options: ['Low', 'Medium', 'High', 'Critical']
+  }
+}`,...(D=(x=i.parameters)==null?void 0:x.docs)==null?void 0:D.source}}};var O,j,F;c.parameters={...c.parameters,docs:{...(O=c.parameters)==null?void 0:O.docs,source:{originalSource:`{
+  render: () => {
+    const [selectedCountry, setSelectedCountry] = useState('');
+    return <div>
+                <SelectInput label="Select your country" value={selectedCountry} onChange={setSelectedCountry} options={countryOptions} placeholder="Choose a country" />
+                {selectedCountry && <p style={{
+        marginTop: '1rem',
+        fontSize: '0.875rem',
+        color: '#666'
+      }}>
+                        Selected: {countryOptions.find(opt => opt.value === selectedCountry)?.label || selectedCountry}
+                    </p>}
+            </div>;
+  }
+}`,...(F=(j=c.parameters)==null?void 0:j.docs)==null?void 0:F.source}}};var T,I,M;u.parameters={...u.parameters,docs:{...(T=u.parameters)==null?void 0:T.docs,source:{originalSource:`{
+  render: () => {
+    const [formData, setFormData] = useState({
+      title: '',
+      category: '',
+      priority: '',
+      assignee: ''
+    });
+    return <div style={{
+      display: 'flex',
+      flexDirection: 'column',
+      gap: '1rem',
+      padding: '1.5rem',
+      background: '#f9f9f9',
+      borderRadius: '8px',
+      minWidth: '300px'
+    }}>
+            <h3 style={{
+        marginTop: 0
+      }}>Create Task</h3>
+            
+            <SelectInput label="Title" value={formData.title} onChange={value => setFormData({
+        ...formData,
+        title: value
+      })} options={['Mr', 'Mrs', 'Ms', 'Dr', 'Prof']} placeholder="Select title" />
+            
+            <SelectInput label="Category" value={formData.category} onChange={value => setFormData({
+        ...formData,
+        category: value
+      })} options={[{
+        label: 'Bug',
+        value: 'bug'
+      }, {
+        label: 'Feature',
+        value: 'feature'
+      }, {
+        label: 'Documentation',
+        value: 'docs'
+      }, {
+        label: 'Testing',
+        value: 'test'
+      }]} placeholder="Select category" />
+            
+            <SelectInput label="Priority" value={formData.priority} onChange={value => setFormData({
+        ...formData,
+        priority: value
+      })} options={['Low', 'Medium', 'High', 'Critical']} placeholder="Select priority" />
+            
+            <SelectInput label="Assignee" value={formData.assignee} onChange={value => setFormData({
+        ...formData,
+        assignee: value
+      })} options={[{
+        label: 'John Doe',
+        value: 'john'
+      }, {
+        label: 'Jane Smith',
+        value: 'jane'
+      }, {
+        label: 'Bob Johnson',
+        value: 'bob'
+      }, {
+        label: 'Alice Brown',
+        value: 'alice'
+      }]} placeholder="Select assignee" />
+        </div>;
+  },
+  parameters: {
+    controls: {
+      disable: true
+    }
+  }
+}`,...(M=(I=u.parameters)==null?void 0:I.docs)==null?void 0:M.source}}};const L=["Default","WithSimpleOptions","WithObjectOptions","NoPlaceholder","Interactive","FormExample"];export{r as Default,u as FormExample,c as Interactive,i as NoPlaceholder,s as WithObjectOptions,n as WithSimpleOptions,L as __namedExportsOrder,E as default};

package/storybook-static/assets/SleepChart-yGsG5RlQ.css

@@ -0,0 +1 @@
+._container_9r92y_1{background:var(--color-background-secondary);border-radius:var(--radius-lg);padding:var(--spacing-xl)}._header_9r92y_7{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-xl)}._title_9r92y_14{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text)}._legend_9r92y_20{display:flex;gap:var(--spacing-xl)}._legendItem_9r92y_25{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-sm);color:var(--color-text-secondary)}._sleepDot_9r92y_33{width:12px;height:12px;border-radius:var(--radius-full);background:#9b59b6}._wakeDot_9r92y_40{width:12px;height:12px;border-radius:var(--radius-full);background:#3498db}._chart_9r92y_47{display:block}._gridLine_9r92y_51{stroke:var(--color-border);stroke-opacity:.1;stroke-dasharray:2,2}._sleepBar_9r92y_57{transition:var(--transition-base)}._sleepBar_9r92y_57:hover{filter:brightness(1.1)}._xAxis_9r92y_65,._yAxis_9r92y_66{color:var(--color-text-secondary);font-size:var(--font-size-xs)}._xAxis_9r92y_65 line,._xAxis_9r92y_65 path,._yAxis_9r92y_66 line,._yAxis_9r92y_66 path{stroke:var(--color-border)}._xAxis_9r92y_65 text,._yAxis_9r92y_66 text{fill:var(--color-text-secondary)}

package/storybook-static/assets/SleepChart.stories-Dsz1U6F9.js

@@ -0,0 +1,58 @@
+import{r as B,j as f}from"./iframe-BUaP2gIF.js";import{s as I}from"./transform-NloTqvdv.js";import{i as Z,l as rt,a as nt,b as ot}from"./linear-4t_RuQok.js";import"./preload-helper-C1FmrZbK.js";class N extends Map{constructor(e,r=lt){if(super(),Object.defineProperties(this,{_intern:{value:new Map},_key:{value:r}}),e!=null)for(const[a,n]of e)this.set(a,n)}get(e){return super.get(R(this,e))}has(e){return super.has(R(this,e))}set(e,r){return super.set(st(this,e),r)}delete(e){return super.delete(it(this,e))}}function R({_intern:t,_key:e},r){const a=e(r);return t.has(a)?t.get(a):r}function st({_intern:t,_key:e},r){const a=e(r);return t.has(a)?t.get(a):(t.set(a,r),r)}function it({_intern:t,_key:e},r){const a=e(r);return t.has(a)&&(r=t.get(a),t.delete(a)),r}function lt(t){return t!==null&&typeof t=="object"?t.valueOf():t}function T(t,e,r){t=+t,e=+e,r=(n=arguments.length)<2?(e=t,t=0,1):n<3?1:+r;for(var a=-1,n=Math.max(0,Math.ceil((e-t)/r))|0,o=new Array(n);++a<n;)o[a]=t+a*r;return o}const O=Symbol("implicit");function tt(){var t=new N,e=[],r=[],a=O;function n(o){let l=t.get(o);if(l===void 0){if(a!==O)return a;t.set(o,l=e.push(o)-1)}return r[l%r.length]}return n.domain=function(o){if(!arguments.length)return e.slice();e=[],t=new N;for(const l of o)t.has(l)||t.set(l,e.push(l)-1);return n},n.range=function(o){return arguments.length?(r=Array.from(o),n):r.slice()},n.unknown=function(o){return arguments.length?(a=o,n):a},n.copy=function(){return tt(e,r).unknown(a)},Z.apply(n,arguments),n}function et(){var t=tt().unknown(void 0),e=t.domain,r=t.range,a=0,n=1,o,l,m=!1,p=0,M=0,d=.5;delete t.unknown;function c(){var i=e().length,x=n<a,y=x?n:a,S=x?a:n;o=(S-y)/Math.max(1,i-p+M*2),m&&(o=Math.floor(o)),y+=(S-y-o*(i-p))*d,l=o*(1-p),m&&(y=Math.round(y),l=Math.round(l));var k=T(i).map(function(s){return y+o*s});return r(x?k.reverse():k)}return t.domain=function(i){return arguments.length?(e(i),c()):e()},t.range=function(i){return arguments.length?([a,n]=i,a=+a,n=+n,c()):[a,n]},t.rangeRound=function(i){return[a,n]=i,a=+a,n=+n,m=!0,c()},t.bandwidth=function(){return l},t.step=function(){return o},t.round=function(i){return arguments.length?(m=!!i,c()):m},t.padding=function(i){return arguments.length?(p=Math.min(1,M=+i),c()):p},t.paddingInner=function(i){return arguments.length?(p=Math.min(1,i),c()):p},t.paddingOuter=function(i){return arguments.length?(M=+i,c()):M},t.align=function(i){return arguments.length?(d=Math.max(0,Math.min(1,i)),c()):d},t.copy=function(){return et(e(),[a,n]).round(m).paddingInner(p).paddingOuter(M).align(d)},Z.apply(c(),arguments)}const dt="_container_9r92y_1",ct="_header_9r92y_7",ut="_title_9r92y_14",pt="_legend_9r92y_20",ht="_legendItem_9r92y_25",mt="_sleepDot_9r92y_33",gt="_wakeDot_9r92y_40",ft="_chart_9r92y_47",Mt="_gridLine_9r92y_51",yt="_sleepBar_9r92y_57",_t="_xAxis_9r92y_65",St="_yAxis_9r92y_66",u={container:dt,header:ct,title:ut,legend:pt,legendItem:ht,sleepDot:mt,wakeDot:gt,chart:ft,gridLine:Mt,sleepBar:yt,xAxis:_t,yAxis:St},W=t=>{const[e,r]=t.split(":").map(Number);return e+r/60},at=({sleepData:t,width:e=800,height:r=300,onDateClick:a})=>{const n=B.useRef(null),o={top:20,right:20,bottom:40,left:60},l=e-o.left-o.right,m=r-o.top-o.bottom;return B.useEffect(()=>{if(!n.current||t.length===0)return;const p=I(n.current);p.selectAll("*").remove();const M=p.append("g").attr("transform",`translate(${o.left},${o.top})`),d=rt().domain([18,42]).range([0,l]),c=t.map(s=>s.date),i=et().domain(c).range([0,m]).paddingInner(.1).paddingOuter(.05);M.selectAll(".grid-line-x").data(T(18,43,3)).enter().append("line").attr("class",u.gridLine).attr("x1",s=>d(s)).attr("y1",0).attr("x2",s=>d(s)).attr("y2",m),t.forEach(s=>{const h=i(s.date);if(h===void 0)return;const w=i.bandwidth(),$=M.append("g").attr("class",u.sleepBar).style("cursor","pointer").on("click",()=>a==null?void 0:a(s.date));let g=null,_=null;s.sleep_time&&(g=W(s.sleep_time),g<18&&(g+=24)),s.wake_hour&&(_=W(s.wake_hour),(g!==null&&_<g-18||g===null&&_<12)&&(_+=24)),g!==null&&_!==null&&$.append("rect").attr("x",d(g)).attr("y",h).attr("width",d(_)-d(g)).attr("height",w).attr("rx",4).attr("fill","url(#sleepGradient)").attr("opacity",.8),g!==null&&$.append("circle").attr("cx",d(g)).attr("cy",h+w/2).attr("r",4).attr("fill","#9B59B6"),_!==null&&$.append("circle").attr("cx",d(_)).attr("cy",h+w/2).attr("r",4).attr("fill","#3498DB"),$.on("mouseenter",function(){I(this).select("rect").transition().duration(200).attr("opacity",1)}).on("mouseleave",function(){I(this).select("rect").transition().duration(200).attr("opacity",.8)})});const y=p.append("defs").append("linearGradient").attr("id","sleepGradient").attr("x1","0%").attr("x2","100%");y.append("stop").attr("offset","0%").attr("stop-color","#9B59B6").attr("stop-opacity",.8),y.append("stop").attr("offset","100%").attr("stop-color","#3498DB").attr("stop-opacity",.8);const S=T(18,43,3).map(s=>({value:s,label:(s%24).toString().padStart(2,"0")+":00"}));M.append("g").attr("class",u.xAxis).attr("transform",`translate(0,${m})`).call(nt(d).tickValues(S.map(s=>s.value)).tickFormat(s=>{const h=S.find(w=>w.value===s);return h?h.label:""}));const k=c.filter((s,h)=>h%Math.ceil(c.length/10)===0);M.append("g").attr("class",u.yAxis).call(ot(i).tickValues(k).tickFormat(s=>{const h=new Date(s);return`${(h.getMonth()+1).toString().padStart(2,"0")}/${h.getDate().toString().padStart(2,"0")}`}))},[t,l,m,o,a]),f.jsxs("div",{className:u.container,children:[f.jsxs("div",{className:u.header,children:[f.jsx("h3",{className:u.title,children:"Sleep Pattern"}),f.jsxs("div",{className:u.legend,children:[f.jsxs("div",{className:u.legendItem,children:[f.jsx("span",{className:u.sleepDot}),f.jsx("span",{children:"Sleep Time"})]}),f.jsxs("div",{className:u.legendItem,children:[f.jsx("span",{className:u.wakeDot}),f.jsx("span",{children:"Wake Time"})]})]})]}),f.jsx("svg",{ref:n,width:e,height:r,className:u.chart})]})};at.__docgenInfo={description:"",methods:[],displayName:"SleepChart",props:{sleepData:{required:!0,tsType:{name:"Array",elements:[{name:"SleepData"}],raw:"SleepData[]"},description:""},width:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"800",computed:!1}},height:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"300",computed:!1}},onDateClick:{required:!1,tsType:{name:"signature",type:"function",raw:"(date: string) => void",signature:{arguments:[{type:{name:"string"},name:"date"}],return:{name:"void"}}},description:""}}};const Dt={title:"Organisms/Charts/SleepChart",component:at,parameters:{layout:"centered"},argTypes:{width:{control:{type:"number",min:400,max:1200,step:50}},height:{control:{type:"number",min:200,max:600,step:50}},onDateClick:{action:"dateClicked"}}},A=t=>{const e=[],r=new Date;for(let a=t-1;a>=0;a--){const n=new Date(r);n.setDate(n.getDate()-a),e.push(n.toISOString().split("T")[0])}return e},D={args:{sleepData:A(7).map(t=>{const e=Math.floor(Math.random()*3)+22,r=Math.floor(Math.random()*3)+6;return{date:t,sleep_time:`${e%24}:${Math.floor(Math.random()*60).toString().padStart(2,"0")}`,wake_hour:`${r}:${Math.floor(Math.random()*60).toString().padStart(2,"0")}`}}),width:800,height:400}},b={args:{sleepData:A(30).map(t=>({date:t,sleep_time:`${(Math.floor(Math.random()*3)+22)%24}:${Math.floor(Math.random()*60).toString().padStart(2,"0")}`,wake_hour:`${Math.floor(Math.random()*2)+7}:${Math.floor(Math.random()*60).toString().padStart(2,"0")}`})),width:900,height:400}},v={args:{sleepData:A(14).map((t,e)=>{const r=e%7===5||e%7===6,a=r?Math.floor(Math.random()*4)+24:Math.floor(Math.random()*2)+22,n=r?Math.floor(Math.random()*3)+9:Math.floor(Math.random()*2)+6;return{date:t,sleep_time:`${a%24}:${Math.floor(Math.random()*60).toString().padStart(2,"0")}`,wake_hour:`${n}:${Math.floor(Math.random()*60).toString().padStart(2,"0")}`}}),width:850,height:400}},H={args:{sleepData:A(14).map((t,e)=>({date:t,sleep_time:e%3===0?null:`${(Math.floor(Math.random()*3)+22)%24}:30`,wake_hour:e%3===0?null:`${Math.floor(Math.random()*2)+7}:00`})),width:800,height:400}},j={args:{sleepData:[],width:800,height:400}};var E,L,V;D.parameters={...D.parameters,docs:{...(E=D.parameters)==null?void 0:E.docs,source:{originalSource:`{
+  args: {
+    sleepData: generateDateRange(7).map(date => {
+      const bedHour = Math.floor(Math.random() * 3) + 22;
+      const wakeHour = Math.floor(Math.random() * 3) + 6;
+      return {
+        date,
+        sleep_time: \`\${bedHour % 24}:\${Math.floor(Math.random() * 60).toString().padStart(2, '0')}\`,
+        wake_hour: \`\${wakeHour}:\${Math.floor(Math.random() * 60).toString().padStart(2, '0')}\`
+      };
+    }),
+    width: 800,
+    height: 400
+  }
+}`,...(V=(L=D.parameters)==null?void 0:L.docs)==null?void 0:V.source}}};var q,G,C;b.parameters={...b.parameters,docs:{...(q=b.parameters)==null?void 0:q.docs,source:{originalSource:`{
+  args: {
+    sleepData: generateDateRange(30).map(date => ({
+      date,
+      sleep_time: \`\${(Math.floor(Math.random() * 3) + 22) % 24}:\${Math.floor(Math.random() * 60).toString().padStart(2, '0')}\`,
+      wake_hour: \`\${Math.floor(Math.random() * 2) + 7}:\${Math.floor(Math.random() * 60).toString().padStart(2, '0')}\`
+    })),
+    width: 900,
+    height: 400
+  }
+}`,...(C=(G=b.parameters)==null?void 0:G.docs)==null?void 0:C.source}}};var F,P,z;v.parameters={...v.parameters,docs:{...(F=v.parameters)==null?void 0:F.docs,source:{originalSource:`{
+  args: {
+    sleepData: generateDateRange(14).map((date, i) => {
+      // Simulate irregular sleep pattern
+      const isWeekend = i % 7 === 5 || i % 7 === 6;
+      const bedHour = isWeekend ? Math.floor(Math.random() * 4) + 24 : Math.floor(Math.random() * 2) + 22;
+      const wakeHour = isWeekend ? Math.floor(Math.random() * 3) + 9 : Math.floor(Math.random() * 2) + 6;
+      return {
+        date,
+        sleep_time: \`\${bedHour % 24}:\${Math.floor(Math.random() * 60).toString().padStart(2, '0')}\`,
+        wake_hour: \`\${wakeHour}:\${Math.floor(Math.random() * 60).toString().padStart(2, '0')}\`
+      };
+    }),
+    width: 850,
+    height: 400
+  }
+}`,...(z=(P=v.parameters)==null?void 0:P.docs)==null?void 0:z.source}}};var J,K,Q;H.parameters={...H.parameters,docs:{...(J=H.parameters)==null?void 0:J.docs,source:{originalSource:`{
+  args: {
+    sleepData: generateDateRange(14).map((date, i) => ({
+      date,
+      // Some days have missing data
+      sleep_time: i % 3 === 0 ? null : \`\${(Math.floor(Math.random() * 3) + 22) % 24}:30\`,
+      wake_hour: i % 3 === 0 ? null : \`\${Math.floor(Math.random() * 2) + 7}:00\`
+    })),
+    width: 800,
+    height: 400
+  }
+}`,...(Q=(K=H.parameters)==null?void 0:K.docs)==null?void 0:Q.source}}};var U,X,Y;j.parameters={...j.parameters,docs:{...(U=j.parameters)==null?void 0:U.docs,source:{originalSource:`{
+  args: {
+    sleepData: [],
+    width: 800,
+    height: 400
+  }
+}`,...(Y=(X=j.parameters)==null?void 0:X.docs)==null?void 0:Y.source}}};const bt=["WeeklySleep","MonthlySleep","IrregularSleep","MissingSleepData","EmptyState"];export{j as EmptyState,v as IrregularSleep,H as MissingSleepData,b as MonthlySleep,D as WeeklySleep,bt as __namedExportsOrder,Dt as default};

package/storybook-static/assets/SunburstChart-ChXvU9py.css

@@ -0,0 +1 @@
+._container_11ons_1{background:var(--color-background-secondary);border-radius:var(--radius-lg);padding:var(--spacing-xl);display:flex;flex-direction:column;align-items:center}._title_11ons_10{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-lg);text-align:center}._chart_11ons_18{display:block}._tooltip_11ons_22{background:var(--color-background);border:2px solid var(--color-primary);border-radius:var(--radius-md);padding:var(--spacing-sm);font-size:var(--font-size-sm);color:var(--color-text);box-shadow:var(--shadow-lg);pointer-events:none;z-index:1000}._tooltip_11ons_22 div{margin:var(--spacing-xs) 0}._tooltip_11ons_22 strong{color:var(--color-primary)}