@saas-support/react 0.7.5 → 0.8.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/README.md +139 -490
  2. package/dist/index.cjs +1 -1
  3. package/dist/index.d.ts +23 -231
  4. package/dist/index.js +204 -288
  5. package/dist/react.cjs +386 -348
  6. package/dist/react.d.ts +41 -438
  7. package/dist/react.js +1133 -2075
  8. package/package.json +2 -2
package/dist/react.cjs CHANGED
@@ -1,8 +1,8 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),r=require("react"),R=require("./index.cjs"),js=require("react-dom"),Z=r.createContext(null);function B(){const e=r.useContext(Z);if(!e)throw new Error("useSaaSContext must be used within a <SaaSProvider>");return e}function vs({publishableKey:e,apiKey:t,baseUrl:a,appearance:l,children:n}){const[u]=r.useState(()=>new R.SaaSSupport({publishableKey:e,apiKey:t,baseUrl:a})),[c,d]=r.useState(null),[i,o]=r.useState(!1),[x,p]=r.useState(null);return r.useEffect(()=>{let h=!1;u.load().then(async()=>{if(h)return;const f=await u.auth.getUser(),b=await u.auth.getSettings();d(f),p(b),o(!0)});const y=u.auth.onAuthStateChange(f=>{h||d(f)});return()=>{h=!0,y(),u.destroy()}},[u]),s.jsx(Z.Provider,{value:{client:u,user:c,isLoaded:i,appearance:l,settings:x},children:n})}const ws={colorPrimary:"#6366f1",colorPrimaryHover:"#4f46e5",colorBackground:"#ffffff",colorText:"#1a1a2e",colorTextSecondary:"#6b7280",colorInputBackground:"#f9fafb",colorInputBorder:"#d1d5db",colorError:"#ef4444",colorSuccess:"#22c55e",colorWarning:"#f59e0b",fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',borderRadius:"8px",authPrimary:"#4648d4",authPrimaryContainer:"#6063ee",authOnPrimary:"#ffffff",authPrimaryFixed:"#e1e0ff",authSurface:"#fcf8ff",authSurfaceContainerLowest:"#ffffff",authSurfaceContainerLow:"#f5f2ff",authSurfaceContainer:"#efecff",authSurfaceContainerHigh:"#e8e5ff",authSurfaceContainerHighest:"#e2e0fc",authOnSurface:"#1a1a2e",authOnSurfaceVariant:"#464554",authOutline:"#767586",authOutlineVariant:"#c7c4d7",authError:"#ba1a1a",authErrorContainer:"#ffdad6",authSuccess:"#22c55e",authFontHeadline:"'Manrope', sans-serif",authFontBody:"'Inter', sans-serif"},Ss={colorPrimary:"#818cf8",colorPrimaryHover:"#6366f1",colorBackground:"#1e1e2e",colorText:"#e2e8f0",colorTextSecondary:"#94a3b8",colorInputBackground:"#2a2a3e",colorInputBorder:"#3f3f5e",colorError:"#f87171",colorSuccess:"#4ade80",colorWarning:"#fbbf24",fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',borderRadius:"8px",authPrimary:"#818cf8",authPrimaryContainer:"#6063ee",authOnPrimary:"#ffffff",authPrimaryFixed:"#2a2a3e",authSurface:"#1e1e2e",authSurfaceContainerLowest:"#161623",authSurfaceContainerLow:"#27273a",authSurfaceContainer:"#2d2d44",authSurfaceContainerHigh:"#363654",authSurfaceContainerHighest:"#3f3f61",authOnSurface:"#e2e8f0",authOnSurfaceVariant:"#94a3b8",authOutline:"#464554",authOutlineVariant:"#44445a",authError:"#f87171",authErrorContainer:"#93000a",authSuccess:"#4ade80",authFontHeadline:"'Manrope', sans-serif",authFontBody:"'Inter', sans-serif"};function Q(e){const t=(e==null?void 0:e.baseTheme)==="dark"?Ss:ws,a=e==null?void 0:e.variables,l=(a==null?void 0:a.colorPrimary)??t.authPrimary;return{colorPrimary:(a==null?void 0:a.colorPrimary)??t.colorPrimary,colorPrimaryHover:a!=null&&a.colorPrimary?Ns(a.colorPrimary,10):t.colorPrimaryHover,colorBackground:(a==null?void 0:a.colorBackground)??t.colorBackground,colorText:(a==null?void 0:a.colorText)??t.colorText,colorTextSecondary:t.colorTextSecondary,colorInputBackground:(a==null?void 0:a.colorInputBackground)??t.colorInputBackground,colorInputBorder:(a==null?void 0:a.colorInputBorder)??t.colorInputBorder,colorError:(a==null?void 0:a.colorError)??t.colorError,colorSuccess:(a==null?void 0:a.colorSuccess)??t.colorSuccess,colorWarning:(a==null?void 0:a.colorWarning)??t.colorWarning,fontFamily:(a==null?void 0:a.fontFamily)??t.fontFamily,borderRadius:(a==null?void 0:a.borderRadius)??t.borderRadius,authPrimary:l,authPrimaryContainer:a!=null&&a.colorPrimary?ks(l,15):t.authPrimaryContainer,authOnPrimary:t.authOnPrimary,authPrimaryFixed:t.authPrimaryFixed,authSurface:(a==null?void 0:a.colorBackground)??t.authSurface,authSurfaceContainerLowest:t.authSurfaceContainerLowest,authSurfaceContainerLow:(a==null?void 0:a.colorInputBackground)??t.authSurfaceContainerLow,authSurfaceContainer:t.authSurfaceContainer,authSurfaceContainerHigh:t.authSurfaceContainerHigh,authSurfaceContainerHighest:t.authSurfaceContainerHighest,authOnSurface:(a==null?void 0:a.colorText)??t.authOnSurface,authOnSurfaceVariant:t.authOnSurfaceVariant,authOutline:t.authOutline,authOutlineVariant:(a==null?void 0:a.colorInputBorder)??t.authOutlineVariant,authError:(a==null?void 0:a.colorError)??t.authError,authErrorContainer:t.authErrorContainer,authSuccess:(a==null?void 0:a.colorSuccess)??t.authSuccess,authFontHeadline:(a==null?void 0:a.fontFamily)??t.authFontHeadline,authFontBody:(a==null?void 0:a.fontFamily)??t.authFontBody}}function Ns(e,t){const a=parseInt(e.replace("#",""),16),l=Math.max(0,(a>>16)-Math.round(2.55*t)),n=Math.max(0,(a>>8&255)-Math.round(2.55*t)),u=Math.max(0,(a&255)-Math.round(2.55*t));return`#${(l<<16|n<<8|u).toString(16).padStart(6,"0")}`}function ks(e,t){const a=parseInt(e.replace("#",""),16),l=Math.min(255,(a>>16)+Math.round(2.55*t)),n=Math.min(255,(a>>8&255)+Math.round(2.55*t)),u=Math.min(255,(a&255)+Math.round(2.55*t));return`#${(l<<16|n<<8|u).toString(16).padStart(6,"0")}`}function J(e){return`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),e=require("react"),J=require("./index.cjs"),ya=require("react-dom"),ta=e.createContext(null);function V(){const a=e.useContext(ta);if(!a)throw new Error("useSaaSContext must be used within a <SaaSProvider>");return a}function va({publishableKey:a,apiKey:r,baseUrl:s,appearance:l,children:c}){const[n]=e.useState(()=>new J.SaaSSupport({publishableKey:a,apiKey:r,baseUrl:s})),[p,d]=e.useState(null),[w,u]=e.useState(!1),[j,x]=e.useState(null);return e.useEffect(()=>{let o=!1;n.load().then(async()=>{if(o)return;const v=await n.auth.getUser(),z=await n.auth.getSettings();d(v),x(z),u(!0)});const S=n.auth.onAuthStateChange(v=>{o||d(v)});return()=>{o=!0,S(),n.destroy()}},[n]),t.jsx(ta.Provider,{value:{client:n,user:p,isLoaded:w,appearance:l,settings:j},children:c})}const wa={colorPrimary:"#6366f1",colorPrimaryHover:"#4f46e5",colorBackground:"#ffffff",colorText:"#1a1a2e",colorTextSecondary:"#6b7280",colorInputBackground:"#f9fafb",colorInputBorder:"#d1d5db",colorError:"#ef4444",colorSuccess:"#22c55e",colorWarning:"#f59e0b",fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',borderRadius:"8px",authPrimary:"#4648d4",authPrimaryContainer:"#6063ee",authOnPrimary:"#ffffff",authPrimaryFixed:"#e1e0ff",authSurface:"#fcf8ff",authSurfaceContainerLowest:"#ffffff",authSurfaceContainerLow:"#f5f2ff",authSurfaceContainer:"#efecff",authSurfaceContainerHigh:"#e8e5ff",authSurfaceContainerHighest:"#e2e0fc",authOnSurface:"#1a1a2e",authOnSurfaceVariant:"#464554",authOutline:"#767586",authOutlineVariant:"#c7c4d7",authError:"#ba1a1a",authErrorContainer:"#ffdad6",authSuccess:"#22c55e",authFontHeadline:"'Manrope', sans-serif",authFontBody:"'Inter', sans-serif"},ja={colorPrimary:"#818cf8",colorPrimaryHover:"#6366f1",colorBackground:"#1e1e2e",colorText:"#e2e8f0",colorTextSecondary:"#94a3b8",colorInputBackground:"#2a2a3e",colorInputBorder:"#3f3f5e",colorError:"#f87171",colorSuccess:"#4ade80",colorWarning:"#fbbf24",fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',borderRadius:"8px",authPrimary:"#818cf8",authPrimaryContainer:"#6063ee",authOnPrimary:"#ffffff",authPrimaryFixed:"#2a2a3e",authSurface:"#1e1e2e",authSurfaceContainerLowest:"#161623",authSurfaceContainerLow:"#27273a",authSurfaceContainer:"#2d2d44",authSurfaceContainerHigh:"#363654",authSurfaceContainerHighest:"#3f3f61",authOnSurface:"#e2e8f0",authOnSurfaceVariant:"#94a3b8",authOutline:"#464554",authOutlineVariant:"#44445a",authError:"#f87171",authErrorContainer:"#93000a",authSuccess:"#4ade80",authFontHeadline:"'Manrope', sans-serif",authFontBody:"'Inter', sans-serif"};function ia(a){const r=(a==null?void 0:a.baseTheme)==="dark"?ja:wa,s=a==null?void 0:a.variables,l=(s==null?void 0:s.colorPrimary)??r.authPrimary;return{colorPrimary:(s==null?void 0:s.colorPrimary)??r.colorPrimary,colorPrimaryHover:s!=null&&s.colorPrimary?Sa(s.colorPrimary,10):r.colorPrimaryHover,colorBackground:(s==null?void 0:s.colorBackground)??r.colorBackground,colorText:(s==null?void 0:s.colorText)??r.colorText,colorTextSecondary:r.colorTextSecondary,colorInputBackground:(s==null?void 0:s.colorInputBackground)??r.colorInputBackground,colorInputBorder:(s==null?void 0:s.colorInputBorder)??r.colorInputBorder,colorError:(s==null?void 0:s.colorError)??r.colorError,colorSuccess:(s==null?void 0:s.colorSuccess)??r.colorSuccess,colorWarning:(s==null?void 0:s.colorWarning)??r.colorWarning,fontFamily:(s==null?void 0:s.fontFamily)??r.fontFamily,borderRadius:(s==null?void 0:s.borderRadius)??r.borderRadius,authPrimary:l,authPrimaryContainer:s!=null&&s.colorPrimary?ka(l,15):r.authPrimaryContainer,authOnPrimary:r.authOnPrimary,authPrimaryFixed:r.authPrimaryFixed,authSurface:(s==null?void 0:s.colorBackground)??r.authSurface,authSurfaceContainerLowest:r.authSurfaceContainerLowest,authSurfaceContainerLow:(s==null?void 0:s.colorInputBackground)??r.authSurfaceContainerLow,authSurfaceContainer:r.authSurfaceContainer,authSurfaceContainerHigh:r.authSurfaceContainerHigh,authSurfaceContainerHighest:r.authSurfaceContainerHighest,authOnSurface:(s==null?void 0:s.colorText)??r.authOnSurface,authOnSurfaceVariant:r.authOnSurfaceVariant,authOutline:r.authOutline,authOutlineVariant:(s==null?void 0:s.colorInputBorder)??r.authOutlineVariant,authError:(s==null?void 0:s.colorError)??r.authError,authErrorContainer:r.authErrorContainer,authSuccess:(s==null?void 0:s.colorSuccess)??r.authSuccess,authFontHeadline:(s==null?void 0:s.fontFamily)??r.authFontHeadline,authFontBody:(s==null?void 0:s.fontFamily)??r.authFontBody}}function Sa(a,r){const s=parseInt(a.replace("#",""),16),l=Math.max(0,(s>>16)-Math.round(2.55*r)),c=Math.max(0,(s>>8&255)-Math.round(2.55*r)),n=Math.max(0,(s&255)-Math.round(2.55*r));return`#${(l<<16|c<<8|n).toString(16).padStart(6,"0")}`}function ka(a,r){const s=parseInt(a.replace("#",""),16),l=Math.min(255,(s>>16)+Math.round(2.55*r)),c=Math.min(255,(s>>8&255)+Math.round(2.55*r)),n=Math.min(255,(s&255)+Math.round(2.55*r));return`#${(l<<16|c<<8|n).toString(16).padStart(6,"0")}`}function la(a){return`
2
2
  :host {
3
3
  all: initial;
4
- font-family: ${e.fontFamily};
5
- color: ${e.colorText};
4
+ font-family: ${a.fontFamily};
5
+ color: ${a.colorText};
6
6
  line-height: 1.5;
7
7
  -webkit-font-smoothing: antialiased;
8
8
  }
@@ -10,13 +10,13 @@
10
10
  * { box-sizing: border-box; margin: 0; padding: 0; }
11
11
 
12
12
  .ss-card {
13
- background: ${e.colorBackground};
14
- border-radius: ${e.borderRadius};
13
+ background: ${a.colorBackground};
14
+ border-radius: ${a.borderRadius};
15
15
  padding: 32px;
16
16
  width: 100%;
17
17
  max-width: 480px;
18
18
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
19
- border: 1px solid ${e.colorInputBorder};
19
+ border: 1px solid ${a.colorInputBorder};
20
20
  }
21
21
 
22
22
  .ss-card-wide { max-width: 640px; }
@@ -24,14 +24,14 @@
24
24
  .ss-title {
25
25
  font-size: 22px;
26
26
  font-weight: 700;
27
- color: ${e.colorText};
27
+ color: ${a.colorText};
28
28
  text-align: center;
29
29
  margin-bottom: 24px;
30
30
  }
31
31
 
32
32
  .ss-subtitle {
33
33
  font-size: 14px;
34
- color: ${e.colorTextSecondary};
34
+ color: ${a.colorTextSecondary};
35
35
  text-align: center;
36
36
  margin-top: -16px;
37
37
  margin-bottom: 24px;
@@ -43,7 +43,7 @@
43
43
  display: block;
44
44
  font-size: 14px;
45
45
  font-weight: 500;
46
- color: ${e.colorText};
46
+ color: ${a.colorText};
47
47
  margin-bottom: 6px;
48
48
  }
49
49
 
@@ -52,20 +52,20 @@
52
52
  padding: 10px 12px;
53
53
  font-size: 14px;
54
54
  font-family: inherit;
55
- border: 1px solid ${e.colorInputBorder};
56
- border-radius: calc(${e.borderRadius} - 2px);
57
- background: ${e.colorInputBackground};
58
- color: ${e.colorText};
55
+ border: 1px solid ${a.colorInputBorder};
56
+ border-radius: calc(${a.borderRadius} - 2px);
57
+ background: ${a.colorInputBackground};
58
+ color: ${a.colorText};
59
59
  outline: none;
60
60
  transition: border-color 0.15s;
61
61
  }
62
62
 
63
63
  .ss-input:focus {
64
- border-color: ${e.colorPrimary};
65
- box-shadow: 0 0 0 3px ${e.colorPrimary}22;
64
+ border-color: ${a.colorPrimary};
65
+ box-shadow: 0 0 0 3px ${a.colorPrimary}22;
66
66
  }
67
67
 
68
- .ss-input.ss-input-error { border-color: ${e.colorError}; }
68
+ .ss-input.ss-input-error { border-color: ${a.colorError}; }
69
69
 
70
70
  .ss-query-textarea {
71
71
  resize: vertical;
@@ -75,16 +75,16 @@
75
75
 
76
76
  .ss-error {
77
77
  font-size: 13px;
78
- color: ${e.colorError};
78
+ color: ${a.colorError};
79
79
  margin-top: 4px;
80
80
  }
81
81
 
82
82
  .ss-global-error {
83
83
  font-size: 13px;
84
- color: ${e.colorError};
85
- background: ${e.colorError}11;
86
- border: 1px solid ${e.colorError}33;
87
- border-radius: calc(${e.borderRadius} - 2px);
84
+ color: ${a.colorError};
85
+ background: ${a.colorError}11;
86
+ border: 1px solid ${a.colorError}33;
87
+ border-radius: calc(${a.borderRadius} - 2px);
88
88
  padding: 10px 12px;
89
89
  margin-bottom: 16px;
90
90
  text-align: center;
@@ -92,10 +92,10 @@
92
92
 
93
93
  .ss-success-msg {
94
94
  font-size: 13px;
95
- color: ${e.colorSuccess};
96
- background: ${e.colorSuccess}11;
97
- border: 1px solid ${e.colorSuccess}33;
98
- border-radius: calc(${e.borderRadius} - 2px);
95
+ color: ${a.colorSuccess};
96
+ background: ${a.colorSuccess}11;
97
+ border: 1px solid ${a.colorSuccess}33;
98
+ border-radius: calc(${a.borderRadius} - 2px);
99
99
  padding: 10px 12px;
100
100
  margin-bottom: 16px;
101
101
  text-align: center;
@@ -104,14 +104,14 @@
104
104
  .ss-loading {
105
105
  text-align: center;
106
106
  padding: 24px;
107
- color: ${e.colorTextSecondary};
107
+ color: ${a.colorTextSecondary};
108
108
  font-size: 14px;
109
109
  }
110
110
 
111
111
  .ss-empty {
112
112
  text-align: center;
113
113
  padding: 24px;
114
- color: ${e.colorTextSecondary};
114
+ color: ${a.colorTextSecondary};
115
115
  font-size: 14px;
116
116
  }
117
117
 
@@ -124,7 +124,7 @@
124
124
  font-weight: 600;
125
125
  font-family: inherit;
126
126
  border: none;
127
- border-radius: calc(${e.borderRadius} - 2px);
127
+ border-radius: calc(${a.borderRadius} - 2px);
128
128
  cursor: pointer;
129
129
  transition: background 0.15s, opacity 0.15s;
130
130
  }
@@ -132,23 +132,23 @@
132
132
  .ss-btn:disabled { opacity: 0.6; cursor: not-allowed; }
133
133
 
134
134
  .ss-btn-primary {
135
- background: ${e.colorPrimary};
135
+ background: ${a.colorPrimary};
136
136
  color: #fff;
137
137
  }
138
138
 
139
- .ss-btn-primary:hover:not(:disabled) { background: ${e.colorPrimaryHover}; }
139
+ .ss-btn-primary:hover:not(:disabled) { background: ${a.colorPrimaryHover}; }
140
140
 
141
141
  .ss-btn-danger {
142
- background: ${e.colorError};
142
+ background: ${a.colorError};
143
143
  color: #fff;
144
144
  }
145
145
 
146
146
  .ss-btn-danger:hover:not(:disabled) { opacity: 0.9; }
147
147
 
148
148
  .ss-btn-current {
149
- background: ${e.colorInputBackground};
150
- color: ${e.colorTextSecondary};
151
- border: 1px solid ${e.colorInputBorder};
149
+ background: ${a.colorInputBackground};
150
+ color: ${a.colorTextSecondary};
151
+ border: 1px solid ${a.colorInputBorder};
152
152
  }
153
153
 
154
154
  .ss-btn-sm {
@@ -169,13 +169,13 @@
169
169
  display: flex;
170
170
  align-items: center;
171
171
  gap: 8px;
172
- background: ${e.colorInputBackground};
173
- border: 1px solid ${e.colorInputBorder};
174
- color: ${e.colorText};
172
+ background: ${a.colorInputBackground};
173
+ border: 1px solid ${a.colorInputBorder};
174
+ color: ${a.colorText};
175
175
  padding: 8px 12px;
176
176
  font-size: 14px;
177
177
  font-family: inherit;
178
- border-radius: calc(${e.borderRadius} - 2px);
178
+ border-radius: calc(${a.borderRadius} - 2px);
179
179
  cursor: pointer;
180
180
  width: auto;
181
181
  }
@@ -192,16 +192,16 @@
192
192
  font-size: 14px;
193
193
  font-weight: 500;
194
194
  font-family: inherit;
195
- border: 1px solid ${e.colorInputBorder};
196
- border-radius: calc(${e.borderRadius} - 2px);
197
- background: ${e.colorInputBackground};
198
- color: ${e.colorText};
195
+ border: 1px solid ${a.colorInputBorder};
196
+ border-radius: calc(${a.borderRadius} - 2px);
197
+ background: ${a.colorInputBackground};
198
+ color: ${a.colorText};
199
199
  cursor: pointer;
200
200
  transition: background 0.15s;
201
201
  margin-bottom: 8px;
202
202
  }
203
203
 
204
- .ss-btn-social:hover:not(:disabled) { background: ${e.colorInputBorder}; }
204
+ .ss-btn-social:hover:not(:disabled) { background: ${a.colorInputBorder}; }
205
205
  .ss-btn-social:disabled { opacity: 0.6; cursor: not-allowed; }
206
206
  .ss-btn-social svg { width: 18px; height: 18px; flex-shrink: 0; }
207
207
 
@@ -210,7 +210,7 @@
210
210
  align-items: center;
211
211
  gap: 12px;
212
212
  margin: 20px 0;
213
- color: ${e.colorTextSecondary};
213
+ color: ${a.colorTextSecondary};
214
214
  font-size: 13px;
215
215
  }
216
216
 
@@ -219,18 +219,18 @@
219
219
  content: '';
220
220
  flex: 1;
221
221
  height: 1px;
222
- background: ${e.colorInputBorder};
222
+ background: ${a.colorInputBorder};
223
223
  }
224
224
 
225
225
  .ss-footer {
226
226
  text-align: center;
227
227
  margin-top: 20px;
228
228
  font-size: 14px;
229
- color: ${e.colorTextSecondary};
229
+ color: ${a.colorTextSecondary};
230
230
  }
231
231
 
232
232
  .ss-link {
233
- color: ${e.colorPrimary};
233
+ color: ${a.colorPrimary};
234
234
  text-decoration: none;
235
235
  cursor: pointer;
236
236
  font-weight: 500;
@@ -260,7 +260,7 @@
260
260
  width: 36px;
261
261
  height: 36px;
262
262
  border-radius: 50%;
263
- background: ${e.colorPrimary};
263
+ background: ${a.colorPrimary};
264
264
  color: #fff;
265
265
  display: flex;
266
266
  align-items: center;
@@ -273,15 +273,15 @@
273
273
  transition: box-shadow 0.15s;
274
274
  }
275
275
 
276
- .ss-avatar:hover { box-shadow: 0 0 0 3px ${e.colorPrimary}33; }
276
+ .ss-avatar:hover { box-shadow: 0 0 0 3px ${a.colorPrimary}33; }
277
277
 
278
278
  .ss-dropdown {
279
279
  position: absolute;
280
280
  top: calc(100% + 8px);
281
281
  right: 0;
282
- background: ${e.colorBackground};
283
- border: 1px solid ${e.colorInputBorder};
284
- border-radius: ${e.borderRadius};
282
+ background: ${a.colorBackground};
283
+ border: 1px solid ${a.colorInputBorder};
284
+ border-radius: ${a.borderRadius};
285
285
  padding: 8px 0;
286
286
  min-width: 200px;
287
287
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
@@ -292,13 +292,13 @@
292
292
 
293
293
  .ss-dropdown-header {
294
294
  padding: 8px 16px 12px;
295
- border-bottom: 1px solid ${e.colorInputBorder};
295
+ border-bottom: 1px solid ${a.colorInputBorder};
296
296
  margin-bottom: 4px;
297
297
  }
298
298
 
299
299
  .ss-dropdown-email {
300
300
  font-size: 13px;
301
- color: ${e.colorTextSecondary};
301
+ color: ${a.colorTextSecondary};
302
302
  word-break: break-all;
303
303
  }
304
304
 
@@ -308,7 +308,7 @@
308
308
  padding: 8px 16px;
309
309
  font-size: 14px;
310
310
  font-family: inherit;
311
- color: ${e.colorText};
311
+ color: ${a.colorText};
312
312
  background: none;
313
313
  border: none;
314
314
  text-align: left;
@@ -316,9 +316,9 @@
316
316
  transition: background 0.1s;
317
317
  }
318
318
 
319
- .ss-dropdown-item:hover { background: ${e.colorInputBackground}; }
320
- .ss-dropdown-item-danger { color: ${e.colorError}; }
321
- .ss-dropdown-item-active { font-weight: 600; color: ${e.colorPrimary}; }
319
+ .ss-dropdown-item:hover { background: ${a.colorInputBackground}; }
320
+ .ss-dropdown-item-danger { color: ${a.colorError}; }
321
+ .ss-dropdown-item-active { font-weight: 600; color: ${a.colorPrimary}; }
322
322
 
323
323
  .ss-dropdown-section-title {
324
324
  padding: 8px 16px 4px;
@@ -326,7 +326,7 @@
326
326
  font-weight: 600;
327
327
  text-transform: uppercase;
328
328
  letter-spacing: 0.5px;
329
- color: ${e.colorTextSecondary};
329
+ color: ${a.colorTextSecondary};
330
330
  }
331
331
 
332
332
  .ss-org-check {
@@ -337,7 +337,7 @@
337
337
  .ss-danger-zone {
338
338
  padding-top: 20px;
339
339
  margin-top: 20px;
340
- border-top: 2px solid ${e.colorError}33;
340
+ border-top: 2px solid ${a.colorError}33;
341
341
  }
342
342
 
343
343
  /* Badges */
@@ -350,21 +350,21 @@
350
350
  border-radius: 999px;
351
351
  text-transform: uppercase;
352
352
  letter-spacing: 0.3px;
353
- background: ${e.colorInputBackground};
354
- color: ${e.colorTextSecondary};
353
+ background: ${a.colorInputBackground};
354
+ color: ${a.colorTextSecondary};
355
355
  }
356
356
 
357
- .ss-badge-active { background: ${e.colorSuccess}22; color: ${e.colorSuccess}; }
358
- .ss-badge-trialing { background: ${e.colorPrimary}22; color: ${e.colorPrimary}; }
359
- .ss-badge-past-due { background: ${e.colorError}22; color: ${e.colorError}; }
360
- .ss-badge-paused { background: ${e.colorWarning}22; color: ${e.colorWarning}; }
361
- .ss-badge-canceled { background: ${e.colorTextSecondary}22; color: ${e.colorTextSecondary}; }
357
+ .ss-badge-active { background: ${a.colorSuccess}22; color: ${a.colorSuccess}; }
358
+ .ss-badge-trialing { background: ${a.colorPrimary}22; color: ${a.colorPrimary}; }
359
+ .ss-badge-past-due { background: ${a.colorError}22; color: ${a.colorError}; }
360
+ .ss-badge-paused { background: ${a.colorWarning}22; color: ${a.colorWarning}; }
361
+ .ss-badge-canceled { background: ${a.colorTextSecondary}22; color: ${a.colorTextSecondary}; }
362
362
 
363
363
  /* Tabs */
364
364
 
365
365
  .ss-tab-group {
366
366
  display: flex;
367
- border-bottom: 1px solid ${e.colorInputBorder};
367
+ border-bottom: 1px solid ${a.colorInputBorder};
368
368
  margin-bottom: 24px;
369
369
  }
370
370
 
@@ -375,7 +375,7 @@
375
375
  font-size: 14px;
376
376
  font-weight: 500;
377
377
  font-family: inherit;
378
- color: ${e.colorTextSecondary};
378
+ color: ${a.colorTextSecondary};
379
379
  background: none;
380
380
  border: none;
381
381
  border-bottom: 2px solid transparent;
@@ -383,11 +383,11 @@
383
383
  transition: color 0.15s, border-color 0.15s;
384
384
  }
385
385
 
386
- .ss-tab:hover { color: ${e.colorText}; }
386
+ .ss-tab:hover { color: ${a.colorText}; }
387
387
 
388
388
  .ss-tab-active {
389
- color: ${e.colorPrimary};
390
- border-bottom-color: ${e.colorPrimary};
389
+ color: ${a.colorPrimary};
390
+ border-bottom-color: ${a.colorPrimary};
391
391
  }
392
392
 
393
393
  .ss-tab-content .ss-card { box-shadow: none; border: none; padding: 0; }
@@ -406,30 +406,30 @@
406
406
  text-align: left;
407
407
  padding: 10px 12px;
408
408
  font-weight: 600;
409
- color: ${e.colorTextSecondary};
410
- border-bottom: 2px solid ${e.colorInputBorder};
409
+ color: ${a.colorTextSecondary};
410
+ border-bottom: 2px solid ${a.colorInputBorder};
411
411
  white-space: nowrap;
412
412
  }
413
413
 
414
414
  .ss-th-sortable { cursor: pointer; user-select: none; }
415
- .ss-th-sortable:hover { color: ${e.colorText}; }
415
+ .ss-th-sortable:hover { color: ${a.colorText}; }
416
416
 
417
417
  .ss-sort-indicator { font-size: 10px; }
418
- .ss-sorted-asc, .ss-sorted-desc { color: ${e.colorPrimary}; }
418
+ .ss-sorted-asc, .ss-sorted-desc { color: ${a.colorPrimary}; }
419
419
 
420
420
  .ss-td {
421
421
  padding: 10px 12px;
422
- border-bottom: 1px solid ${e.colorInputBorder};
423
- color: ${e.colorText};
422
+ border-bottom: 1px solid ${a.colorInputBorder};
423
+ color: ${a.colorText};
424
424
  }
425
425
 
426
- .ss-tr:hover .ss-td { background: ${e.colorInputBackground}; }
426
+ .ss-tr:hover .ss-td { background: ${a.colorInputBackground}; }
427
427
 
428
428
  .ss-table-footer {
429
429
  text-align: center;
430
430
  padding: 8px;
431
431
  font-size: 12px;
432
- color: ${e.colorTextSecondary};
432
+ color: ${a.colorTextSecondary};
433
433
  }
434
434
 
435
435
  /* Pricing */
@@ -441,15 +441,15 @@
441
441
  }
442
442
 
443
443
  .ss-pricing-card {
444
- background: ${e.colorBackground};
445
- border: 1px solid ${e.colorInputBorder};
446
- border-radius: ${e.borderRadius};
444
+ background: ${a.colorBackground};
445
+ border: 1px solid ${a.colorInputBorder};
446
+ border-radius: ${a.borderRadius};
447
447
  padding: 24px;
448
448
  display: flex;
449
449
  flex-direction: column;
450
450
  }
451
451
 
452
- .ss-pricing-card-current { border-color: ${e.colorPrimary}; }
452
+ .ss-pricing-card-current { border-color: ${a.colorPrimary}; }
453
453
 
454
454
  .ss-pricing-header {
455
455
  display: flex;
@@ -461,7 +461,7 @@
461
461
  .ss-pricing-name {
462
462
  font-size: 18px;
463
463
  font-weight: 600;
464
- color: ${e.colorText};
464
+ color: ${a.colorText};
465
465
  }
466
466
 
467
467
  .ss-pricing-price { margin-bottom: 12px; }
@@ -469,17 +469,17 @@
469
469
  .ss-pricing-amount {
470
470
  font-size: 32px;
471
471
  font-weight: 700;
472
- color: ${e.colorText};
472
+ color: ${a.colorText};
473
473
  }
474
474
 
475
475
  .ss-pricing-interval {
476
476
  font-size: 14px;
477
- color: ${e.colorTextSecondary};
477
+ color: ${a.colorTextSecondary};
478
478
  }
479
479
 
480
480
  .ss-pricing-desc {
481
481
  font-size: 14px;
482
- color: ${e.colorTextSecondary};
482
+ color: ${a.colorTextSecondary};
483
483
  margin-bottom: 16px;
484
484
  }
485
485
 
@@ -491,11 +491,11 @@
491
491
 
492
492
  .ss-pricing-feature {
493
493
  font-size: 14px;
494
- color: ${e.colorText};
494
+ color: ${a.colorText};
495
495
  padding: 4px 0;
496
496
  }
497
497
 
498
- .ss-check { color: ${e.colorSuccess}; margin-right: 6px; }
498
+ .ss-check { color: ${a.colorSuccess}; margin-right: 6px; }
499
499
 
500
500
  /* Usage / Progress */
501
501
 
@@ -510,30 +510,30 @@
510
510
  .ss-usage-metric {
511
511
  font-size: 14px;
512
512
  font-weight: 500;
513
- color: ${e.colorText};
513
+ color: ${a.colorText};
514
514
  }
515
515
 
516
516
  .ss-usage-value {
517
517
  font-size: 14px;
518
- color: ${e.colorTextSecondary};
518
+ color: ${a.colorTextSecondary};
519
519
  }
520
520
 
521
521
  .ss-progress-bar {
522
522
  width: 100%;
523
523
  height: 8px;
524
- background: ${e.colorInputBackground};
524
+ background: ${a.colorInputBackground};
525
525
  border-radius: 4px;
526
526
  overflow: hidden;
527
527
  }
528
528
 
529
529
  .ss-progress-fill {
530
530
  height: 100%;
531
- background: ${e.colorPrimary};
531
+ background: ${a.colorPrimary};
532
532
  border-radius: 4px;
533
533
  transition: width 0.3s;
534
534
  }
535
535
 
536
- .ss-progress-danger { background: ${e.colorError}; }
536
+ .ss-progress-danger { background: ${a.colorError}; }
537
537
 
538
538
  /* Chart */
539
539
 
@@ -542,7 +542,7 @@
542
542
  .ss-chart-title {
543
543
  font-size: 16px;
544
544
  font-weight: 600;
545
- color: ${e.colorText};
545
+ color: ${a.colorText};
546
546
  margin-bottom: 12px;
547
547
  }
548
548
 
@@ -555,16 +555,16 @@
555
555
  }
556
556
 
557
557
  .ss-widget {
558
- background: ${e.colorBackground};
559
- border: 1px solid ${e.colorInputBorder};
560
- border-radius: ${e.borderRadius};
558
+ background: ${a.colorBackground};
559
+ border: 1px solid ${a.colorInputBorder};
560
+ border-radius: ${a.borderRadius};
561
561
  padding: 16px;
562
562
  }
563
563
 
564
564
  .ss-widget-header {
565
565
  font-size: 14px;
566
566
  font-weight: 600;
567
- color: ${e.colorText};
567
+ color: ${a.colorText};
568
568
  margin-bottom: 12px;
569
569
  }
570
570
 
@@ -572,14 +572,14 @@
572
572
 
573
573
  .ss-saved-query-card {
574
574
  padding: 12px 16px;
575
- border: 1px solid ${e.colorInputBorder};
576
- border-radius: calc(${e.borderRadius} - 2px);
575
+ border: 1px solid ${a.colorInputBorder};
576
+ border-radius: calc(${a.borderRadius} - 2px);
577
577
  margin-bottom: 8px;
578
578
  cursor: pointer;
579
579
  transition: border-color 0.15s;
580
580
  }
581
581
 
582
- .ss-saved-query-card:hover { border-color: ${e.colorPrimary}; }
582
+ .ss-saved-query-card:hover { border-color: ${a.colorPrimary}; }
583
583
 
584
584
  .ss-saved-query-header {
585
585
  display: flex;
@@ -591,12 +591,12 @@
591
591
  .ss-saved-query-name {
592
592
  font-size: 14px;
593
593
  font-weight: 600;
594
- color: ${e.colorText};
594
+ color: ${a.colorText};
595
595
  }
596
596
 
597
597
  .ss-saved-query-desc {
598
598
  font-size: 13px;
599
- color: ${e.colorTextSecondary};
599
+ color: ${a.colorTextSecondary};
600
600
  margin-bottom: 8px;
601
601
  }
602
602
 
@@ -608,7 +608,7 @@
608
608
 
609
609
  .ss-saved-query-date {
610
610
  font-size: 12px;
611
- color: ${e.colorTextSecondary};
611
+ color: ${a.colorTextSecondary};
612
612
  }
613
613
 
614
614
  /* Modal Overlay */
@@ -633,15 +633,15 @@
633
633
  }
634
634
 
635
635
  .ss-modal {
636
- background: ${e.colorBackground};
637
- border-radius: ${e.borderRadius};
636
+ background: ${a.colorBackground};
637
+ border-radius: ${a.borderRadius};
638
638
  padding: 32px;
639
639
  width: 90%;
640
640
  max-width: 480px;
641
641
  max-height: 90vh;
642
642
  overflow-y: auto;
643
643
  box-shadow: 0 16px 64px rgba(0, 0, 0, 0.2);
644
- border: 1px solid ${e.colorInputBorder};
644
+ border: 1px solid ${a.colorInputBorder};
645
645
  animation: ss-scale-in 0.15s ease-out;
646
646
  }
647
647
 
@@ -660,14 +660,14 @@
660
660
  .ss-modal-title {
661
661
  font-size: 18px;
662
662
  font-weight: 700;
663
- color: ${e.colorText};
663
+ color: ${a.colorText};
664
664
  }
665
665
 
666
666
  .ss-modal-close {
667
667
  background: none;
668
668
  border: none;
669
669
  font-size: 20px;
670
- color: ${e.colorTextSecondary};
670
+ color: ${a.colorTextSecondary};
671
671
  cursor: pointer;
672
672
  padding: 4px;
673
673
  line-height: 1;
@@ -677,20 +677,20 @@
677
677
  }
678
678
 
679
679
  .ss-modal-close:hover {
680
- background: ${e.colorInputBackground};
681
- color: ${e.colorText};
680
+ background: ${a.colorInputBackground};
681
+ color: ${a.colorText};
682
682
  }
683
683
 
684
684
  .ss-modal-section {
685
685
  padding-top: 20px;
686
686
  margin-top: 20px;
687
- border-top: 1px solid ${e.colorInputBorder};
687
+ border-top: 1px solid ${a.colorInputBorder};
688
688
  }
689
689
 
690
690
  .ss-modal-section-title {
691
691
  font-size: 15px;
692
692
  font-weight: 600;
693
- color: ${e.colorText};
693
+ color: ${a.colorText};
694
694
  margin-bottom: 16px;
695
695
  }
696
696
 
@@ -698,7 +698,7 @@
698
698
  width: 64px;
699
699
  height: 64px;
700
700
  border-radius: 50%;
701
- background: ${e.colorPrimary};
701
+ background: ${a.colorPrimary};
702
702
  color: #fff;
703
703
  display: flex;
704
704
  align-items: center;
@@ -748,7 +748,7 @@
748
748
  }
749
749
 
750
750
  .ss-avatar-canvas {
751
- border-radius: ${e.borderRadius};
751
+ border-radius: ${a.borderRadius};
752
752
  background: #111;
753
753
  touch-action: none;
754
754
  max-width: 100%;
@@ -763,7 +763,7 @@
763
763
 
764
764
  .ss-avatar-zoom-label {
765
765
  font-size: 13px;
766
- color: ${e.colorTextSecondary};
766
+ color: ${a.colorTextSecondary};
767
767
  flex-shrink: 0;
768
768
  }
769
769
 
@@ -772,7 +772,7 @@
772
772
  height: 4px;
773
773
  -webkit-appearance: none;
774
774
  appearance: none;
775
- background: ${e.colorInputBorder};
775
+ background: ${a.colorInputBorder};
776
776
  border-radius: 2px;
777
777
  outline: none;
778
778
  }
@@ -782,7 +782,7 @@
782
782
  width: 16px;
783
783
  height: 16px;
784
784
  border-radius: 50%;
785
- background: ${e.colorPrimary};
785
+ background: ${a.colorPrimary};
786
786
  cursor: pointer;
787
787
  }
788
788
 
@@ -790,20 +790,20 @@
790
790
  width: 16px;
791
791
  height: 16px;
792
792
  border-radius: 50%;
793
- background: ${e.colorPrimary};
793
+ background: ${a.colorPrimary};
794
794
  cursor: pointer;
795
795
  border: none;
796
796
  }
797
797
 
798
798
  /* Dropzone */
799
799
  .ss-avatar-dropzone {
800
- border: 2px dashed ${e.colorInputBorder};
801
- border-radius: ${e.borderRadius};
800
+ border: 2px dashed ${a.colorInputBorder};
801
+ border-radius: ${a.borderRadius};
802
802
  padding: 40px 24px;
803
803
  text-align: center;
804
804
  cursor: pointer;
805
805
  transition: border-color 0.15s, background 0.15s;
806
- color: ${e.colorTextSecondary};
806
+ color: ${a.colorTextSecondary};
807
807
  display: flex;
808
808
  flex-direction: column;
809
809
  align-items: center;
@@ -812,8 +812,8 @@
812
812
 
813
813
  .ss-avatar-dropzone:hover,
814
814
  .ss-avatar-dropzone-active {
815
- border-color: ${e.colorPrimary};
816
- background: ${e.colorPrimary}08;
815
+ border-color: ${a.colorPrimary};
816
+ background: ${a.colorPrimary}08;
817
817
  }
818
818
 
819
819
  .ss-avatar-dropzone svg {
@@ -829,7 +829,7 @@
829
829
 
830
830
  .ss-dropdown-divider {
831
831
  height: 1px;
832
- background: ${e.colorInputBorder};
832
+ background: ${a.colorInputBorder};
833
833
  margin: 4px 0;
834
834
  }
835
835
 
@@ -874,12 +874,11 @@
874
874
 
875
875
  /* Auth Card */
876
876
  .ss-auth-card {
877
- background: ${e.authSurfaceContainerLowest};
877
+ background: ${a.authSurfaceContainerLowest};
878
878
  border-radius: 12px;
879
- border: 1px solid ${e.authOutlineVariant}26;
879
+ border: 1px solid ${a.authOutlineVariant}26;
880
880
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
881
- width: 100%;
882
- max-width: 520px;
881
+ width: min(520px, 90vw);
883
882
  overflow: hidden;
884
883
  }
885
884
 
@@ -900,12 +899,12 @@
900
899
  width: 48px;
901
900
  height: 48px;
902
901
  border-radius: 12px;
903
- background: ${e.authPrimary}1a;
902
+ background: ${a.authPrimary}1a;
904
903
  margin-bottom: 16px;
905
904
  }
906
905
 
907
906
  .ss-auth-brand-icon .material-symbols-outlined {
908
- color: ${e.authPrimary};
907
+ color: ${a.authPrimary};
909
908
  font-size: 28px;
910
909
  }
911
910
 
@@ -916,23 +915,23 @@
916
915
  width: 48px;
917
916
  height: 48px;
918
917
  border-radius: 12px;
919
- background: linear-gradient(135deg, ${e.authPrimary}, ${e.authPrimaryContainer});
920
- box-shadow: 0 8px 24px ${e.authPrimary}33;
918
+ background: linear-gradient(135deg, ${a.authPrimary}, ${a.authPrimaryContainer});
919
+ box-shadow: 0 8px 24px ${a.authPrimary}33;
921
920
  margin-bottom: 16px;
922
921
  }
923
922
 
924
923
  .ss-auth-brand-icon-gradient .material-symbols-outlined {
925
- color: ${e.authOnPrimary};
924
+ color: ${a.authOnPrimary};
926
925
  font-size: 24px;
927
926
  }
928
927
 
929
928
  /* Auth Typography */
930
929
  .ss-auth-title {
931
- font-family: ${e.authFontHeadline};
930
+ font-family: ${a.authFontHeadline};
932
931
  font-size: 24px;
933
932
  font-weight: 800;
934
933
  letter-spacing: -0.02em;
935
- color: ${e.authOnSurface};
934
+ color: ${a.authOnSurface};
936
935
  margin: 0;
937
936
  line-height: 1.2;
938
937
  }
@@ -940,20 +939,20 @@
940
939
  .ss-auth-title-lg { font-size: 28px; }
941
940
 
942
941
  .ss-auth-subtitle {
943
- font-family: ${e.authFontBody};
942
+ font-family: ${a.authFontBody};
944
943
  font-size: 14px;
945
- color: ${e.authOnSurfaceVariant};
944
+ color: ${a.authOnSurfaceVariant};
946
945
  margin-top: 8px;
947
946
  }
948
947
 
949
948
  .ss-auth-label {
950
949
  display: block;
951
- font-family: ${e.authFontHeadline};
950
+ font-family: ${a.authFontHeadline};
952
951
  font-size: 11px;
953
952
  font-weight: 700;
954
953
  text-transform: uppercase;
955
954
  letter-spacing: 0.1em;
956
- color: ${e.authOnSurfaceVariant};
955
+ color: ${a.authOnSurfaceVariant};
957
956
  margin-bottom: 6px;
958
957
  padding-left: 2px;
959
958
  }
@@ -963,29 +962,29 @@
963
962
  width: 100%;
964
963
  padding: 12px 16px;
965
964
  font-size: 14px;
966
- font-family: ${e.authFontBody};
967
- background: ${e.authSurfaceContainerLow};
965
+ font-family: ${a.authFontBody};
966
+ background: ${a.authSurfaceContainerLow};
968
967
  border: none;
969
968
  border-radius: 8px;
970
- color: ${e.authOnSurface};
969
+ color: ${a.authOnSurface};
971
970
  outline: none;
972
- box-shadow: 0 0 0 1px ${e.authOutlineVariant}4d;
971
+ box-shadow: 0 0 0 1px ${a.authOutlineVariant}4d;
973
972
  transition: box-shadow 0.15s, background 0.15s;
974
973
  }
975
974
 
976
- .ss-auth-input::placeholder { color: ${e.authOnSurfaceVariant}80; }
975
+ .ss-auth-input::placeholder { color: ${a.authOnSurfaceVariant}80; }
977
976
 
978
977
  .ss-auth-input:focus {
979
- box-shadow: 0 0 0 2px ${e.authPrimary};
978
+ box-shadow: 0 0 0 2px ${a.authPrimary};
980
979
  }
981
980
 
982
981
  .ss-auth-input-error {
983
- box-shadow: 0 0 0 1px ${e.authError};
982
+ box-shadow: 0 0 0 1px ${a.authError};
984
983
  }
985
984
 
986
985
  .ss-auth-input-readonly {
987
- background: ${e.authSurfaceContainer}80;
988
- color: ${e.authOnSurfaceVariant};
986
+ background: ${a.authSurfaceContainer}80;
987
+ color: ${a.authOnSurfaceVariant};
989
988
  cursor: not-allowed;
990
989
  }
991
990
 
@@ -1004,7 +1003,7 @@
1004
1003
  left: 12px;
1005
1004
  top: 50%;
1006
1005
  transform: translateY(-50%);
1007
- color: ${e.authOnSurfaceVariant};
1006
+ color: ${a.authOnSurfaceVariant};
1008
1007
  font-size: 18px;
1009
1008
  }
1010
1009
 
@@ -1015,14 +1014,14 @@
1015
1014
  transform: translateY(-50%);
1016
1015
  background: none;
1017
1016
  border: none;
1018
- color: ${e.authOnSurfaceVariant};
1017
+ color: ${a.authOnSurfaceVariant};
1019
1018
  cursor: pointer;
1020
1019
  padding: 0;
1021
1020
  display: flex;
1022
1021
  font-size: 20px;
1023
1022
  }
1024
1023
 
1025
- .ss-auth-visibility-toggle:hover { color: ${e.authOnSurface}; }
1024
+ .ss-auth-visibility-toggle:hover { color: ${a.authOnSurface}; }
1026
1025
 
1027
1026
  /* Auth Buttons */
1028
1027
  .ss-auth-btn-primary {
@@ -1030,13 +1029,13 @@
1030
1029
  padding: 14px 24px;
1031
1030
  font-size: 14px;
1032
1031
  font-weight: 700;
1033
- font-family: ${e.authFontHeadline};
1034
- color: ${e.authOnPrimary};
1035
- background: linear-gradient(135deg, ${e.authPrimary}, ${e.authPrimaryContainer});
1032
+ font-family: ${a.authFontHeadline};
1033
+ color: ${a.authOnPrimary};
1034
+ background: linear-gradient(135deg, ${a.authPrimary}, ${a.authPrimaryContainer});
1036
1035
  border: none;
1037
1036
  border-radius: 8px;
1038
1037
  cursor: pointer;
1039
- box-shadow: 0 4px 16px ${e.authPrimary}33;
1038
+ box-shadow: 0 4px 16px ${a.authPrimary}33;
1040
1039
  transition: box-shadow 0.2s, transform 0.1s, opacity 0.15s;
1041
1040
  display: flex;
1042
1041
  align-items: center;
@@ -1045,7 +1044,7 @@
1045
1044
  }
1046
1045
 
1047
1046
  .ss-auth-btn-primary:hover:not(:disabled) {
1048
- box-shadow: 0 6px 24px ${e.authPrimary}4d;
1047
+ box-shadow: 0 6px 24px ${a.authPrimary}4d;
1049
1048
  transform: translateY(-1px);
1050
1049
  }
1051
1050
 
@@ -1061,8 +1060,8 @@
1061
1060
  padding: 10px 24px;
1062
1061
  font-size: 14px;
1063
1062
  font-weight: 700;
1064
- font-family: ${e.authFontHeadline};
1065
- color: ${e.authOnSurfaceVariant};
1063
+ font-family: ${a.authFontHeadline};
1064
+ color: ${a.authOnSurfaceVariant};
1066
1065
  background: transparent;
1067
1066
  border: none;
1068
1067
  border-radius: 8px;
@@ -1070,14 +1069,14 @@
1070
1069
  transition: background 0.15s, color 0.15s;
1071
1070
  }
1072
1071
 
1073
- .ss-auth-btn-ghost:hover { background: ${e.authSurfaceContainer}; color: ${e.authOnSurface}; }
1072
+ .ss-auth-btn-ghost:hover { background: ${a.authSurfaceContainer}; color: ${a.authOnSurface}; }
1074
1073
 
1075
1074
  .ss-auth-btn-danger {
1076
1075
  padding: 10px 24px;
1077
1076
  font-size: 14px;
1078
1077
  font-weight: 700;
1079
- font-family: ${e.authFontHeadline};
1080
- color: ${e.authError};
1078
+ font-family: ${a.authFontHeadline};
1079
+ color: ${a.authError};
1081
1080
  background: transparent;
1082
1081
  border: none;
1083
1082
  border-radius: 8px;
@@ -1089,22 +1088,22 @@
1089
1088
  width: 100%;
1090
1089
  }
1091
1090
 
1092
- .ss-auth-btn-danger:hover { background: ${e.authErrorContainer}33; }
1091
+ .ss-auth-btn-danger:hover { background: ${a.authErrorContainer}33; }
1093
1092
 
1094
1093
  .ss-auth-btn-outline {
1095
1094
  padding: 10px 24px;
1096
1095
  font-size: 14px;
1097
1096
  font-weight: 700;
1098
- font-family: ${e.authFontHeadline};
1099
- color: ${e.authOnSurfaceVariant};
1097
+ font-family: ${a.authFontHeadline};
1098
+ color: ${a.authOnSurfaceVariant};
1100
1099
  background: transparent;
1101
- border: 1px solid ${e.authOutlineVariant}4d;
1100
+ border: 1px solid ${a.authOutlineVariant}4d;
1102
1101
  border-radius: 8px;
1103
1102
  cursor: pointer;
1104
1103
  transition: background 0.15s, color 0.15s;
1105
1104
  }
1106
1105
 
1107
- .ss-auth-btn-outline:hover { background: ${e.authSurfaceContainer}; color: ${e.authOnSurface}; }
1106
+ .ss-auth-btn-outline:hover { background: ${a.authSurfaceContainer}; color: ${a.authOnSurface}; }
1108
1107
 
1109
1108
  .ss-auth-btn-social {
1110
1109
  display: flex;
@@ -1114,19 +1113,19 @@
1114
1113
  padding: 10px 16px;
1115
1114
  font-size: 14px;
1116
1115
  font-weight: 600;
1117
- font-family: ${e.authFontBody};
1118
- color: ${e.authOnSurface};
1119
- background: ${e.authSurfaceContainerLow};
1120
- border: 1px solid ${e.authOutlineVariant}1a;
1116
+ font-family: ${a.authFontBody};
1117
+ color: ${a.authOnSurface};
1118
+ background: ${a.authSurfaceContainerLow};
1119
+ border: 1px solid ${a.authOutlineVariant}1a;
1121
1120
  border-radius: 8px;
1122
1121
  cursor: pointer;
1123
1122
  transition: background 0.15s;
1124
1123
  }
1125
1124
 
1126
- .ss-auth-btn-social:hover { background: ${e.authSurfaceContainerHigh}; }
1125
+ .ss-auth-btn-social:hover { background: ${a.authSurfaceContainerHigh}; }
1127
1126
  .ss-auth-btn-social:disabled { opacity: 0.6; cursor: not-allowed; }
1128
1127
  .ss-auth-btn-social svg { width: 20px; height: 20px; flex-shrink: 0; }
1129
- .ss-auth-btn-social svg path[fill="currentColor"] { fill: ${e.authOnSurface}; }
1128
+ .ss-auth-btn-social svg path[fill="currentColor"] { fill: ${a.authOnSurface}; }
1130
1129
 
1131
1130
  .ss-auth-btn-sm {
1132
1131
  width: auto;
@@ -1141,6 +1140,9 @@
1141
1140
  gap: 12px;
1142
1141
  margin-bottom: 24px;
1143
1142
  }
1143
+ .ss-auth-oauth-grid > :only-child {
1144
+ grid-column: 1 / -1;
1145
+ }
1144
1146
 
1145
1147
  /* Auth Divider */
1146
1148
  .ss-auth-divider {
@@ -1152,7 +1154,7 @@
1152
1154
  font-weight: 600;
1153
1155
  text-transform: uppercase;
1154
1156
  letter-spacing: 0.05em;
1155
- color: ${e.authOnSurfaceVariant};
1157
+ color: ${a.authOnSurfaceVariant};
1156
1158
  }
1157
1159
 
1158
1160
  .ss-auth-divider::before,
@@ -1160,21 +1162,21 @@
1160
1162
  content: '';
1161
1163
  flex: 1;
1162
1164
  height: 1px;
1163
- background: ${e.authOutlineVariant}33;
1165
+ background: ${a.authOutlineVariant}33;
1164
1166
  }
1165
1167
 
1166
1168
  /* Auth Error Message */
1167
1169
  .ss-auth-error {
1168
1170
  padding: 12px;
1169
- background: ${e.authError}1a;
1170
- border: 1px solid ${e.authError}33;
1171
+ background: ${a.authError}1a;
1172
+ border: 1px solid ${a.authError}33;
1171
1173
  border-radius: 8px;
1172
1174
  margin-bottom: 16px;
1173
1175
  display: flex;
1174
1176
  align-items: flex-start;
1175
1177
  gap: 8px;
1176
1178
  font-size: 13px;
1177
- color: ${e.authError};
1179
+ color: ${a.authError};
1178
1180
  }
1179
1181
 
1180
1182
  .ss-auth-error .material-symbols-outlined { font-size: 18px; flex-shrink: 0; margin-top: 1px; }
@@ -1192,23 +1194,23 @@
1192
1194
  text-align: center;
1193
1195
  font-size: 20px;
1194
1196
  font-weight: 700;
1195
- font-family: ${e.authFontBody};
1196
- background: ${e.authSurfaceContainerHigh};
1197
+ font-family: ${a.authFontBody};
1198
+ background: ${a.authSurfaceContainerHigh};
1197
1199
  border: none;
1198
1200
  border-radius: 8px;
1199
- color: ${e.authOnSurface};
1201
+ color: ${a.authOnSurface};
1200
1202
  outline: none;
1201
- box-shadow: 0 0 0 1px ${e.authOutlineVariant}1a;
1203
+ box-shadow: 0 0 0 1px ${a.authOutlineVariant}1a;
1202
1204
  transition: box-shadow 0.15s;
1203
1205
  }
1204
1206
 
1205
1207
  .ss-auth-mfa-digit:focus {
1206
- box-shadow: 0 0 0 2px ${e.authPrimary};
1208
+ box-shadow: 0 0 0 2px ${a.authPrimary};
1207
1209
  }
1208
1210
 
1209
1211
  .ss-auth-mfa-hint {
1210
1212
  font-size: 11px;
1211
- color: ${e.authOnSurfaceVariant}99;
1213
+ color: ${a.authOnSurfaceVariant}99;
1212
1214
  text-align: center;
1213
1215
  margin-top: 12px;
1214
1216
  }
@@ -1225,7 +1227,7 @@
1225
1227
  content: '';
1226
1228
  flex: 1;
1227
1229
  height: 1px;
1228
- background: ${e.authOutlineVariant}33;
1230
+ background: ${a.authOutlineVariant}33;
1229
1231
  }
1230
1232
 
1231
1233
  .ss-auth-mfa-divider span {
@@ -1233,7 +1235,7 @@
1233
1235
  font-weight: 700;
1234
1236
  text-transform: uppercase;
1235
1237
  letter-spacing: 0.2em;
1236
- color: ${e.authOutline};
1238
+ color: ${a.authOutline};
1237
1239
  }
1238
1240
 
1239
1241
  /* Footer Link */
@@ -1241,13 +1243,13 @@
1241
1243
  text-align: center;
1242
1244
  margin-top: 32px;
1243
1245
  font-size: 14px;
1244
- color: ${e.authOnSurfaceVariant};
1245
- font-family: ${e.authFontBody};
1246
+ color: ${a.authOnSurfaceVariant};
1247
+ font-family: ${a.authFontBody};
1246
1248
  }
1247
1249
 
1248
1250
  .ss-auth-footer a,
1249
1251
  .ss-auth-link {
1250
- color: ${e.authPrimary};
1252
+ color: ${a.authPrimary};
1251
1253
  text-decoration: none;
1252
1254
  font-weight: 600;
1253
1255
  cursor: pointer;
@@ -1256,14 +1258,30 @@
1256
1258
  .ss-auth-footer a:hover,
1257
1259
  .ss-auth-link:hover { text-decoration: underline; }
1258
1260
 
1261
+ .ss-auth-legal-links {
1262
+ text-align: center;
1263
+ margin-top: 24px;
1264
+ font-size: 12px;
1265
+ color: ${a.authOnSurfaceVariant};
1266
+ font-family: ${a.authFontBody};
1267
+ }
1268
+ .ss-auth-legal-links a {
1269
+ color: ${a.authOnSurfaceVariant};
1270
+ text-decoration: none;
1271
+ }
1272
+ .ss-auth-legal-links a:hover {
1273
+ text-decoration: underline;
1274
+ color: ${a.authPrimary};
1275
+ }
1276
+
1259
1277
  /* Glass Panel (dropdown) */
1260
1278
  .ss-auth-glass-panel {
1261
1279
  backdrop-filter: blur(20px);
1262
1280
  -webkit-backdrop-filter: blur(20px);
1263
- background: ${e.authSurfaceContainerLowest}e6;
1281
+ background: ${a.authSurfaceContainerLowest}e6;
1264
1282
  border-radius: 12px;
1265
1283
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
1266
- border: 1px solid ${e.authOutlineVariant}1a;
1284
+ border: 1px solid ${a.authOutlineVariant}1a;
1267
1285
  overflow: hidden;
1268
1286
  }
1269
1287
 
@@ -1274,17 +1292,17 @@
1274
1292
  gap: 8px;
1275
1293
  padding: 4px 12px 4px 4px;
1276
1294
  border-radius: 999px;
1277
- border: 1px solid ${e.authOutlineVariant}33;
1278
- background: ${e.authSurfaceContainerLow};
1295
+ border: 1px solid ${a.authOutlineVariant}33;
1296
+ background: ${a.authSurfaceContainerLow};
1279
1297
  cursor: pointer;
1280
1298
  transition: background 0.15s, box-shadow 0.15s;
1281
- font-family: ${e.authFontBody};
1299
+ font-family: ${a.authFontBody};
1282
1300
  max-width: 200px;
1283
1301
  }
1284
1302
 
1285
1303
  .ss-auth-user-trigger:hover {
1286
- background: ${e.authSurfaceContainer};
1287
- box-shadow: 0 0 0 2px ${e.authPrimary}33;
1304
+ background: ${a.authSurfaceContainer};
1305
+ box-shadow: 0 0 0 2px ${a.authPrimary}33;
1288
1306
  }
1289
1307
 
1290
1308
  .ss-auth-user-trigger:active { transform: scale(0.98); }
@@ -1292,7 +1310,7 @@
1292
1310
  .ss-auth-trigger-org-name {
1293
1311
  font-size: 13px;
1294
1312
  font-weight: 600;
1295
- color: ${e.authOnSurface};
1313
+ color: ${a.authOnSurface};
1296
1314
  max-width: 140px;
1297
1315
  overflow: hidden;
1298
1316
  text-overflow: ellipsis;
@@ -1305,12 +1323,32 @@
1305
1323
  width: 40px;
1306
1324
  height: 40px;
1307
1325
  border-radius: 50%;
1308
- border: 2px solid ${e.authPrimary};
1309
- overflow: hidden;
1326
+ border: 2px solid ${a.authPrimary};
1327
+ overflow: visible;
1310
1328
  transition: transform 0.15s, box-shadow 0.15s;
1311
1329
  padding: 0;
1312
1330
  background: none;
1313
1331
  flex-shrink: 0;
1332
+ position: relative;
1333
+ }
1334
+
1335
+ .ss-auth-invite-badge {
1336
+ position: absolute;
1337
+ top: -4px;
1338
+ right: -4px;
1339
+ min-width: 18px;
1340
+ height: 18px;
1341
+ border-radius: 9px;
1342
+ font-size: 10px;
1343
+ font-weight: 700;
1344
+ display: flex;
1345
+ align-items: center;
1346
+ justify-content: center;
1347
+ background: ${a.authError||"#ef4444"};
1348
+ color: #fff;
1349
+ padding: 0 4px;
1350
+ line-height: 1;
1351
+ pointer-events: none;
1314
1352
  }
1315
1353
 
1316
1354
  .ss-auth-avatar-trigger img {
@@ -1326,7 +1364,7 @@
1326
1364
  height: 128px;
1327
1365
  border-radius: 16px;
1328
1366
  overflow: hidden;
1329
- border: 4px solid ${e.authSurfaceContainer};
1367
+ border: 4px solid ${a.authSurfaceContainer};
1330
1368
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
1331
1369
  position: relative;
1332
1370
  cursor: pointer;
@@ -1345,7 +1383,7 @@
1345
1383
  .ss-auth-avatar-overlay {
1346
1384
  position: absolute;
1347
1385
  inset: 0;
1348
- background: ${e.authPrimary}99;
1386
+ background: ${a.authPrimary}99;
1349
1387
  display: flex;
1350
1388
  flex-direction: column;
1351
1389
  align-items: center;
@@ -1369,21 +1407,21 @@
1369
1407
  font-weight: 700;
1370
1408
  text-transform: uppercase;
1371
1409
  letter-spacing: 0.15em;
1372
- font-family: ${e.authFontHeadline};
1410
+ font-family: ${a.authFontHeadline};
1373
1411
  }
1374
1412
 
1375
1413
  /* Auth Sections */
1376
1414
  .ss-auth-section {
1377
1415
  padding-top: 32px;
1378
1416
  margin-top: 32px;
1379
- border-top: 1px solid ${e.authOutlineVariant}1a;
1417
+ border-top: 1px solid ${a.authOutlineVariant}1a;
1380
1418
  }
1381
1419
 
1382
1420
  .ss-auth-section-title {
1383
- font-family: ${e.authFontHeadline};
1421
+ font-family: ${a.authFontHeadline};
1384
1422
  font-size: 16px;
1385
1423
  font-weight: 700;
1386
- color: ${e.authOnSurface};
1424
+ color: ${a.authOnSurface};
1387
1425
  letter-spacing: -0.01em;
1388
1426
  display: flex;
1389
1427
  align-items: center;
@@ -1391,13 +1429,13 @@
1391
1429
  }
1392
1430
 
1393
1431
  .ss-auth-section-title .material-symbols-outlined {
1394
- color: ${e.authPrimary};
1432
+ color: ${a.authPrimary};
1395
1433
  font-size: 20px;
1396
1434
  }
1397
1435
 
1398
1436
  .ss-auth-section-desc {
1399
1437
  font-size: 12px;
1400
- color: ${e.authOnSurfaceVariant};
1438
+ color: ${a.authOnSurfaceVariant};
1401
1439
  margin-top: 4px;
1402
1440
  }
1403
1441
 
@@ -1406,14 +1444,14 @@
1406
1444
  font-weight: 800;
1407
1445
  text-transform: uppercase;
1408
1446
  letter-spacing: 0.15em;
1409
- color: ${e.authOnSurfaceVariant}99;
1447
+ color: ${a.authOnSurfaceVariant}99;
1410
1448
  padding: 8px 16px 4px;
1411
1449
  }
1412
1450
 
1413
1451
  /* Sign Out Section */
1414
1452
  .ss-auth-signout-section {
1415
- background: ${e.authError}0d;
1416
- border-top: 1px solid ${e.authOutlineVariant}1a;
1453
+ background: ${a.authError}0d;
1454
+ border-top: 1px solid ${a.authOutlineVariant}1a;
1417
1455
  padding: 8px;
1418
1456
  }
1419
1457
 
@@ -1429,25 +1467,25 @@
1429
1467
  background: none;
1430
1468
  border: none;
1431
1469
  width: 100%;
1432
- font-family: ${e.authFontBody};
1470
+ font-family: ${a.authFontBody};
1433
1471
  font-size: 14px;
1434
- color: ${e.authOnSurfaceVariant};
1472
+ color: ${a.authOnSurfaceVariant};
1435
1473
  text-align: left;
1436
1474
  }
1437
1475
 
1438
1476
  .ss-auth-org-item:hover {
1439
- background: ${e.authSurfaceContainerLow};
1440
- color: ${e.authOnSurface};
1477
+ background: ${a.authSurfaceContainerLow};
1478
+ color: ${a.authOnSurface};
1441
1479
  }
1442
1480
 
1443
1481
  .ss-auth-org-item-active {
1444
- background: ${e.authPrimaryFixed}4d;
1445
- color: ${e.authPrimary};
1482
+ background: ${a.authPrimaryFixed}4d;
1483
+ color: ${a.authPrimary};
1446
1484
  font-weight: 600;
1447
1485
  }
1448
1486
 
1449
1487
  .ss-auth-org-item-active:hover {
1450
- background: ${e.authPrimaryFixed}4d;
1488
+ background: ${a.authPrimaryFixed}4d;
1451
1489
  }
1452
1490
 
1453
1491
  .ss-auth-org-item-inner {
@@ -1460,8 +1498,8 @@
1460
1498
  width: 32px;
1461
1499
  height: 32px;
1462
1500
  border-radius: 6px;
1463
- background: linear-gradient(135deg, ${e.authPrimary}, ${e.authPrimaryContainer});
1464
- color: ${e.authOnPrimary};
1501
+ background: linear-gradient(135deg, ${a.authPrimary}, ${a.authPrimaryContainer});
1502
+ color: ${a.authOnPrimary};
1465
1503
  display: flex;
1466
1504
  align-items: center;
1467
1505
  justify-content: center;
@@ -1471,12 +1509,12 @@
1471
1509
  }
1472
1510
 
1473
1511
  .ss-auth-org-avatar-inactive {
1474
- background: ${e.authSurfaceContainerHigh};
1475
- color: ${e.authOnSurfaceVariant};
1512
+ background: ${a.authSurfaceContainerHigh};
1513
+ color: ${a.authOnSurfaceVariant};
1476
1514
  }
1477
1515
 
1478
1516
  .ss-auth-org-check {
1479
- color: ${e.authPrimary};
1517
+ color: ${a.authPrimary};
1480
1518
  font-variation-settings: 'FILL' 1;
1481
1519
  }
1482
1520
 
@@ -1489,13 +1527,13 @@
1489
1527
  letter-spacing: 0.05em;
1490
1528
  padding: 2px 8px;
1491
1529
  border-radius: 999px;
1492
- background: ${e.authPrimary}1a;
1493
- color: ${e.authPrimary};
1494
- border: 1px solid ${e.authPrimary}33;
1530
+ background: ${a.authPrimary}1a;
1531
+ color: ${a.authPrimary};
1532
+ border: 1px solid ${a.authPrimary}33;
1495
1533
  margin-left: auto;
1496
1534
  white-space: nowrap;
1497
1535
  flex-shrink: 0;
1498
- font-family: ${e.authFontBody};
1536
+ font-family: ${a.authFontBody};
1499
1537
  }
1500
1538
 
1501
1539
  /* Modal Overlay */
@@ -1522,7 +1560,7 @@
1522
1560
  }
1523
1561
 
1524
1562
  .ss-auth-modal {
1525
- background: ${e.authSurfaceContainer};
1563
+ background: ${a.authSurfaceContainer};
1526
1564
  border-radius: 12px;
1527
1565
  width: 100%;
1528
1566
  max-width: 560px;
@@ -1542,22 +1580,22 @@
1542
1580
  align-items: center;
1543
1581
  justify-content: space-between;
1544
1582
  padding: 24px 32px;
1545
- background: ${e.authSurfaceContainerHigh}80;
1583
+ background: ${a.authSurfaceContainerHigh}80;
1546
1584
  }
1547
1585
 
1548
1586
  .ss-auth-modal-header h2 {
1549
- font-family: ${e.authFontHeadline};
1587
+ font-family: ${a.authFontHeadline};
1550
1588
  font-size: 20px;
1551
1589
  font-weight: 700;
1552
1590
  letter-spacing: -0.02em;
1553
- color: ${e.authOnSurface};
1591
+ color: ${a.authOnSurface};
1554
1592
  margin: 0;
1555
1593
  }
1556
1594
 
1557
1595
  .ss-auth-modal-close {
1558
1596
  background: none;
1559
1597
  border: none;
1560
- color: ${e.authOnSurfaceVariant};
1598
+ color: ${a.authOnSurfaceVariant};
1561
1599
  cursor: pointer;
1562
1600
  padding: 4px;
1563
1601
  border-radius: 50%;
@@ -1565,7 +1603,7 @@
1565
1603
  display: flex;
1566
1604
  }
1567
1605
 
1568
- .ss-auth-modal-close:hover { color: ${e.authOnSurface}; background: ${e.authSurfaceContainerHigh}; }
1606
+ .ss-auth-modal-close:hover { color: ${a.authOnSurface}; background: ${a.authSurfaceContainerHigh}; }
1569
1607
 
1570
1608
  .ss-auth-modal-body { padding: 32px; }
1571
1609
 
@@ -1575,7 +1613,7 @@
1575
1613
  justify-content: flex-end;
1576
1614
  gap: 12px;
1577
1615
  padding: 16px 32px;
1578
- border-top: 1px solid ${e.authOutlineVariant}4d;
1616
+ border-top: 1px solid ${a.authOutlineVariant}4d;
1579
1617
  }
1580
1618
 
1581
1619
  /* Profile Header (gradient bg) */
@@ -1586,24 +1624,24 @@
1586
1624
  flex-direction: row;
1587
1625
  align-items: center;
1588
1626
  gap: 32px;
1589
- border-bottom: 1px solid ${e.authOutlineVariant}1a;
1590
- background: linear-gradient(135deg, ${e.authSurfaceContainerHigh}, ${e.authSurface});
1627
+ border-bottom: 1px solid ${a.authOutlineVariant}1a;
1628
+ background: linear-gradient(135deg, ${a.authSurfaceContainerHigh}, ${a.authSurface});
1591
1629
  }
1592
1630
 
1593
1631
  .ss-auth-profile-info { flex: 1; }
1594
1632
 
1595
1633
  .ss-auth-profile-name {
1596
- font-family: ${e.authFontHeadline};
1634
+ font-family: ${a.authFontHeadline};
1597
1635
  font-size: 22px;
1598
1636
  font-weight: 800;
1599
- color: ${e.authOnSurface};
1637
+ color: ${a.authOnSurface};
1600
1638
  letter-spacing: -0.02em;
1601
1639
  margin: 0;
1602
1640
  }
1603
1641
 
1604
1642
  .ss-auth-profile-desc {
1605
1643
  font-size: 13px;
1606
- color: ${e.authOnSurfaceVariant};
1644
+ color: ${a.authOnSurfaceVariant};
1607
1645
  margin-top: 4px;
1608
1646
  line-height: 1.5;
1609
1647
  }
@@ -1619,17 +1657,17 @@
1619
1657
  font-weight: 700;
1620
1658
  text-transform: uppercase;
1621
1659
  letter-spacing: 0.1em;
1622
- background: ${e.authPrimary}33;
1623
- color: ${e.authPrimary};
1624
- border: 1px solid ${e.authPrimary}4d;
1660
+ background: ${a.authPrimary}33;
1661
+ color: ${a.authPrimary};
1662
+ border: 1px solid ${a.authPrimary}4d;
1625
1663
  margin-left: 8px;
1626
1664
  vertical-align: middle;
1627
1665
  }
1628
1666
 
1629
1667
  .ss-auth-badge-success {
1630
- background: ${e.authSuccess}1a;
1631
- color: ${e.authSuccess};
1632
- border-color: ${e.authSuccess}4d;
1668
+ background: ${a.authSuccess}1a;
1669
+ color: ${a.authSuccess};
1670
+ border-color: ${a.authSuccess}4d;
1633
1671
  }
1634
1672
 
1635
1673
  /* Profile Grid */
@@ -1650,21 +1688,21 @@
1650
1688
 
1651
1689
  /* Info Box */
1652
1690
  .ss-auth-info-box {
1653
- background: ${e.authSurfaceContainerLowest}66;
1691
+ background: ${a.authSurfaceContainerLowest}66;
1654
1692
  border-radius: 8px;
1655
1693
  padding: 12px 16px;
1656
- border: 1px solid ${e.authOutlineVariant}33;
1694
+ border: 1px solid ${a.authOutlineVariant}33;
1657
1695
  display: flex;
1658
1696
  align-items: flex-start;
1659
1697
  gap: 12px;
1660
1698
  font-size: 11px;
1661
1699
  line-height: 1.6;
1662
- color: ${e.authOnSurfaceVariant};
1700
+ color: ${a.authOnSurfaceVariant};
1663
1701
  }
1664
1702
 
1665
1703
  .ss-auth-info-box .material-symbols-outlined {
1666
1704
  font-size: 16px;
1667
- color: ${e.authPrimary};
1705
+ color: ${a.authPrimary};
1668
1706
  flex-shrink: 0;
1669
1707
  margin-top: 1px;
1670
1708
  }
@@ -1679,7 +1717,7 @@
1679
1717
 
1680
1718
  /* Dropzone */
1681
1719
  .ss-auth-dropzone {
1682
- border: 2px dashed ${e.authOutlineVariant};
1720
+ border: 2px dashed ${a.authOutlineVariant};
1683
1721
  border-radius: 12px;
1684
1722
  padding: 32px 24px;
1685
1723
  text-align: center;
@@ -1695,15 +1733,15 @@
1695
1733
 
1696
1734
  .ss-auth-dropzone:hover,
1697
1735
  .ss-auth-dropzone-active {
1698
- border-color: ${e.authPrimary};
1699
- background: ${e.authSurfaceContainerLow};
1736
+ border-color: ${a.authPrimary};
1737
+ background: ${a.authSurfaceContainerLow};
1700
1738
  }
1701
1739
 
1702
1740
  .ss-auth-dropzone-icon {
1703
1741
  width: 48px;
1704
1742
  height: 48px;
1705
1743
  border-radius: 50%;
1706
- background: ${e.authPrimaryContainer}33;
1744
+ background: ${a.authPrimaryContainer}33;
1707
1745
  display: flex;
1708
1746
  align-items: center;
1709
1747
  justify-content: center;
@@ -1714,20 +1752,20 @@
1714
1752
  .ss-auth-dropzone:hover .ss-auth-dropzone-icon { transform: scale(1.1); }
1715
1753
 
1716
1754
  .ss-auth-dropzone-icon .material-symbols-outlined {
1717
- color: ${e.authPrimary};
1755
+ color: ${a.authPrimary};
1718
1756
  font-size: 24px;
1719
1757
  }
1720
1758
 
1721
1759
  .ss-auth-dropzone-title {
1722
- font-family: ${e.authFontHeadline};
1760
+ font-family: ${a.authFontHeadline};
1723
1761
  font-size: 14px;
1724
1762
  font-weight: 700;
1725
- color: ${e.authOnSurface};
1763
+ color: ${a.authOnSurface};
1726
1764
  }
1727
1765
 
1728
1766
  .ss-auth-dropzone-desc {
1729
1767
  font-size: 12px;
1730
- color: ${e.authOnSurfaceVariant};
1768
+ color: ${a.authOnSurfaceVariant};
1731
1769
  line-height: 1.5;
1732
1770
  }
1733
1771
 
@@ -1736,8 +1774,8 @@
1736
1774
  padding: 8px 16px;
1737
1775
  font-size: 12px;
1738
1776
  font-weight: 600;
1739
- background: ${e.authSurfaceContainerHighest};
1740
- color: ${e.authOnSurfaceVariant};
1777
+ background: ${a.authSurfaceContainerHighest};
1778
+ color: ${a.authOnSurfaceVariant};
1741
1779
  border: none;
1742
1780
  border-radius: 8px;
1743
1781
  cursor: pointer;
@@ -1745,8 +1783,8 @@
1745
1783
  }
1746
1784
 
1747
1785
  .ss-auth-dropzone-btn:hover {
1748
- background: ${e.authPrimary};
1749
- color: ${e.authOnPrimary};
1786
+ background: ${a.authPrimary};
1787
+ color: ${a.authOnPrimary};
1750
1788
  }
1751
1789
 
1752
1790
  /* Zoom Controls */
@@ -1755,12 +1793,12 @@
1755
1793
  align-items: center;
1756
1794
  gap: 16px;
1757
1795
  padding: 16px;
1758
- background: ${e.authSurfaceContainer};
1796
+ background: ${a.authSurfaceContainer};
1759
1797
  border-radius: 8px;
1760
1798
  }
1761
1799
 
1762
1800
  .ss-auth-zoom-control .material-symbols-outlined {
1763
- color: ${e.authOnSurfaceVariant};
1801
+ color: ${a.authOnSurfaceVariant};
1764
1802
  font-size: 20px;
1765
1803
  }
1766
1804
 
@@ -1769,7 +1807,7 @@
1769
1807
  height: 6px;
1770
1808
  -webkit-appearance: none;
1771
1809
  appearance: none;
1772
- background: ${e.authOutlineVariant}4d;
1810
+ background: ${a.authOutlineVariant}4d;
1773
1811
  border-radius: 3px;
1774
1812
  outline: none;
1775
1813
  }
@@ -1779,9 +1817,9 @@
1779
1817
  width: 18px;
1780
1818
  height: 18px;
1781
1819
  border-radius: 50%;
1782
- background: ${e.authPrimary};
1820
+ background: ${a.authPrimary};
1783
1821
  cursor: pointer;
1784
- border: 2px solid ${e.authSurfaceContainerLowest};
1822
+ border: 2px solid ${a.authSurfaceContainerLowest};
1785
1823
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
1786
1824
  }
1787
1825
 
@@ -1789,9 +1827,9 @@
1789
1827
  width: 18px;
1790
1828
  height: 18px;
1791
1829
  border-radius: 50%;
1792
- background: ${e.authPrimary};
1830
+ background: ${a.authPrimary};
1793
1831
  cursor: pointer;
1794
- border: 2px solid ${e.authSurfaceContainerLowest};
1832
+ border: 2px solid ${a.authSurfaceContainerLowest};
1795
1833
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
1796
1834
  }
1797
1835
 
@@ -1800,7 +1838,7 @@
1800
1838
  width: 320px;
1801
1839
  max-width: 100%;
1802
1840
  aspect-ratio: 1;
1803
- background: ${e.authSurfaceContainerLowest};
1841
+ background: ${a.authSurfaceContainerLowest};
1804
1842
  border-radius: 8px;
1805
1843
  overflow: hidden;
1806
1844
  position: relative;
@@ -1811,14 +1849,14 @@
1811
1849
  position: absolute;
1812
1850
  bottom: 12px;
1813
1851
  left: 12px;
1814
- background: ${e.authSurfaceContainerHighest}cc;
1852
+ background: ${a.authSurfaceContainerHighest}cc;
1815
1853
  backdrop-filter: blur(8px);
1816
1854
  padding: 4px 12px;
1817
1855
  border-radius: 999px;
1818
- border: 1px solid ${e.authOutlineVariant}4d;
1856
+ border: 1px solid ${a.authOutlineVariant}4d;
1819
1857
  font-size: 11px;
1820
1858
  font-weight: 600;
1821
- color: ${e.authOnSurfaceVariant};
1859
+ color: ${a.authOnSurfaceVariant};
1822
1860
  }
1823
1861
 
1824
1862
  /* Dropdown for UserButton / OrgSwitcher */
@@ -1837,15 +1875,15 @@
1837
1875
  display: flex;
1838
1876
  align-items: center;
1839
1877
  gap: 16px;
1840
- border-bottom: 1px solid ${e.authOutlineVariant}1a;
1841
- background: ${e.authSurfaceContainerLow}80;
1878
+ border-bottom: 1px solid ${a.authOutlineVariant}1a;
1879
+ background: ${a.authSurfaceContainerLow}80;
1842
1880
  }
1843
1881
 
1844
1882
  .ss-auth-dropdown-avatar {
1845
1883
  width: 48px;
1846
1884
  height: 48px;
1847
1885
  border-radius: 50%;
1848
- border: 2px solid ${e.authPrimaryContainer};
1886
+ border: 2px solid ${a.authPrimaryContainer};
1849
1887
  overflow: hidden;
1850
1888
  flex-shrink: 0;
1851
1889
  }
@@ -1857,16 +1895,16 @@
1857
1895
  }
1858
1896
 
1859
1897
  .ss-auth-dropdown-name {
1860
- font-family: ${e.authFontHeadline};
1898
+ font-family: ${a.authFontHeadline};
1861
1899
  font-size: 14px;
1862
1900
  font-weight: 800;
1863
- color: ${e.authOnSurface};
1901
+ color: ${a.authOnSurface};
1864
1902
  letter-spacing: -0.01em;
1865
1903
  }
1866
1904
 
1867
1905
  .ss-auth-dropdown-email {
1868
1906
  font-size: 13px;
1869
- color: ${e.authOnSurfaceVariant};
1907
+ color: ${a.authOnSurfaceVariant};
1870
1908
  }
1871
1909
 
1872
1910
  .ss-auth-dropdown-action {
@@ -1880,18 +1918,18 @@
1880
1918
  background: none;
1881
1919
  border: none;
1882
1920
  width: 100%;
1883
- font-family: ${e.authFontBody};
1921
+ font-family: ${a.authFontBody};
1884
1922
  font-size: 14px;
1885
1923
  font-weight: 600;
1886
- color: ${e.authOnSurface};
1924
+ color: ${a.authOnSurface};
1887
1925
  text-align: left;
1888
1926
  text-decoration: none;
1889
1927
  }
1890
1928
 
1891
- .ss-auth-dropdown-action:hover { background: ${e.authSurfaceContainer}; }
1929
+ .ss-auth-dropdown-action:hover { background: ${a.authSurfaceContainer}; }
1892
1930
 
1893
1931
  .ss-auth-dropdown-action .material-symbols-outlined {
1894
- color: ${e.authPrimary};
1932
+ color: ${a.authPrimary};
1895
1933
  font-size: 20px;
1896
1934
  transition: transform 0.15s;
1897
1935
  }
@@ -1904,17 +1942,17 @@
1904
1942
  align-items: center;
1905
1943
  justify-content: space-between;
1906
1944
  padding: 12px 16px;
1907
- background: ${e.authSurfaceContainerLowest};
1945
+ background: ${a.authSurfaceContainerLowest};
1908
1946
  border: 1px solid transparent;
1909
1947
  border-radius: 8px;
1910
1948
  cursor: pointer;
1911
1949
  transition: border-color 0.15s, box-shadow 0.15s;
1912
1950
  width: 100%;
1913
- font-family: ${e.authFontBody};
1951
+ font-family: ${a.authFontBody};
1914
1952
  }
1915
1953
 
1916
1954
  .ss-auth-org-trigger:hover {
1917
- border-color: ${e.authOutlineVariant}4d;
1955
+ border-color: ${a.authOutlineVariant}4d;
1918
1956
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
1919
1957
  }
1920
1958
 
@@ -1927,29 +1965,29 @@
1927
1965
  .ss-auth-org-trigger-label {
1928
1966
  font-size: 11px;
1929
1967
  font-weight: 700;
1930
- color: ${e.authPrimary};
1968
+ color: ${a.authPrimary};
1931
1969
  text-transform: uppercase;
1932
1970
  letter-spacing: 0.05em;
1933
1971
  margin-bottom: 2px;
1934
1972
  }
1935
1973
 
1936
1974
  .ss-auth-org-trigger-name {
1937
- font-family: ${e.authFontHeadline};
1975
+ font-family: ${a.authFontHeadline};
1938
1976
  font-size: 14px;
1939
1977
  font-weight: 700;
1940
- color: ${e.authOnSurface};
1978
+ color: ${a.authOnSurface};
1941
1979
  }
1942
1980
 
1943
1981
  .ss-auth-org-trigger .material-symbols-outlined {
1944
- color: ${e.authOnSurfaceVariant};
1982
+ color: ${a.authOnSurfaceVariant};
1945
1983
  transition: color 0.15s;
1946
1984
  }
1947
1985
 
1948
- .ss-auth-org-trigger:hover .material-symbols-outlined { color: ${e.authPrimary}; }
1986
+ .ss-auth-org-trigger:hover .material-symbols-outlined { color: ${a.authPrimary}; }
1949
1987
 
1950
1988
  /* OrgSwitcher Create Section */
1951
1989
  .ss-auth-org-create {
1952
- background: ${e.authSurfaceContainerLow}80;
1990
+ background: ${a.authSurfaceContainerLow}80;
1953
1991
  padding: 16px;
1954
1992
  }
1955
1993
 
@@ -1962,11 +2000,11 @@
1962
2000
  font-weight: 700;
1963
2001
  text-transform: uppercase;
1964
2002
  letter-spacing: 0.05em;
1965
- color: ${e.authOnSurfaceVariant};
2003
+ color: ${a.authOnSurfaceVariant};
1966
2004
  }
1967
2005
 
1968
2006
  .ss-auth-org-create-header .material-symbols-outlined {
1969
- color: ${e.authPrimary};
2007
+ color: ${a.authPrimary};
1970
2008
  font-size: 16px;
1971
2009
  }
1972
2010
 
@@ -1981,14 +2019,14 @@
1981
2019
  top: 50%;
1982
2020
  transform: translateY(-50%);
1983
2021
  font-size: 12px;
1984
- color: ${e.authOutline};
2022
+ color: ${a.authOutline};
1985
2023
  font-weight: 500;
1986
2024
  }
1987
2025
 
1988
2026
  /* Inline Create (UserButton dropdown) */
1989
2027
  .ss-auth-inline-create {
1990
2028
  padding: 12px 16px;
1991
- border-top: 1px solid ${e.authOutlineVariant}1a;
2029
+ border-top: 1px solid ${a.authOutlineVariant}1a;
1992
2030
  }
1993
2031
 
1994
2032
  .ss-auth-inline-create-input {
@@ -2007,7 +2045,7 @@
2007
2045
  transform: translateY(-50%);
2008
2046
  background: none;
2009
2047
  border: none;
2010
- color: ${e.authPrimary};
2048
+ color: ${a.authPrimary};
2011
2049
  cursor: pointer;
2012
2050
  padding: 4px;
2013
2051
  border-radius: 6px;
@@ -2015,7 +2053,7 @@
2015
2053
  transition: background 0.15s;
2016
2054
  }
2017
2055
 
2018
- .ss-auth-inline-create-btn:hover { background: ${e.authPrimary}1a; }
2056
+ .ss-auth-inline-create-btn:hover { background: ${a.authPrimary}1a; }
2019
2057
 
2020
2058
  /* Signout row in profile */
2021
2059
  .ss-auth-signout-row {
@@ -2035,27 +2073,27 @@
2035
2073
  width: 40px;
2036
2074
  height: 40px;
2037
2075
  border-radius: 50%;
2038
- background: ${e.authError}1a;
2076
+ background: ${a.authError}1a;
2039
2077
  display: flex;
2040
2078
  align-items: center;
2041
2079
  justify-content: center;
2042
2080
  }
2043
2081
 
2044
2082
  .ss-auth-signout-icon .material-symbols-outlined {
2045
- color: ${e.authError};
2083
+ color: ${a.authError};
2046
2084
  font-size: 20px;
2047
2085
  }
2048
2086
 
2049
2087
  .ss-auth-signout-title {
2050
- font-family: ${e.authFontHeadline};
2088
+ font-family: ${a.authFontHeadline};
2051
2089
  font-size: 14px;
2052
2090
  font-weight: 700;
2053
- color: ${e.authOnSurface};
2091
+ color: ${a.authOnSurface};
2054
2092
  }
2055
2093
 
2056
2094
  .ss-auth-signout-desc {
2057
2095
  font-size: 12px;
2058
- color: ${e.authOnSurfaceVariant};
2096
+ color: ${a.authOnSurfaceVariant};
2059
2097
  }
2060
2098
 
2061
2099
  /* Auth Spinner */
@@ -2063,8 +2101,8 @@
2063
2101
  display: inline-block;
2064
2102
  width: 16px;
2065
2103
  height: 16px;
2066
- border: 2px solid ${e.authOnPrimary}4d;
2067
- border-top-color: ${e.authOnPrimary};
2104
+ border: 2px solid ${a.authOnPrimary}4d;
2105
+ border-top-color: ${a.authOnPrimary};
2068
2106
  border-radius: 50%;
2069
2107
  animation: ss-spin 0.6s linear infinite;
2070
2108
  }
@@ -2076,7 +2114,7 @@
2076
2114
  z-index: 99999;
2077
2115
  display: flex;
2078
2116
  flex-direction: column;
2079
- background: ${e.authSurface};
2117
+ background: ${a.authSurface};
2080
2118
  animation: ss-auth-fade-in 0.2s ease-out;
2081
2119
  }
2082
2120
 
@@ -2085,17 +2123,17 @@
2085
2123
  align-items: center;
2086
2124
  justify-content: space-between;
2087
2125
  padding: 20px 32px;
2088
- border-bottom: 1px solid ${e.authOutlineVariant}1a;
2089
- background: ${e.authSurfaceContainerHigh}80;
2126
+ border-bottom: 1px solid ${a.authOutlineVariant}1a;
2127
+ background: ${a.authSurfaceContainerHigh}80;
2090
2128
  flex-shrink: 0;
2091
2129
  }
2092
2130
 
2093
2131
  .ss-auth-settings-header h2 {
2094
- font-family: ${e.authFontHeadline};
2132
+ font-family: ${a.authFontHeadline};
2095
2133
  font-size: 20px;
2096
2134
  font-weight: 700;
2097
2135
  letter-spacing: -0.02em;
2098
- color: ${e.authOnSurface};
2136
+ color: ${a.authOnSurface};
2099
2137
  margin: 0;
2100
2138
  }
2101
2139
 
@@ -2109,12 +2147,12 @@
2109
2147
  border: none;
2110
2148
  background: none;
2111
2149
  cursor: pointer;
2112
- color: ${e.authOnSurfaceVariant};
2150
+ color: ${a.authOnSurfaceVariant};
2113
2151
  transition: background 0.15s, color 0.15s;
2114
2152
  }
2115
2153
  .ss-auth-settings-back:hover {
2116
- background: ${e.authSurfaceContainer};
2117
- color: ${e.authOnSurface};
2154
+ background: ${a.authSurfaceContainer};
2155
+ color: ${a.authOnSurface};
2118
2156
  }
2119
2157
  .ss-auth-settings-back .material-symbols-outlined { font-size: 22px; }
2120
2158
 
@@ -2127,12 +2165,12 @@
2127
2165
  .ss-auth-settings-nav {
2128
2166
  width: 220px;
2129
2167
  padding: 16px;
2130
- border-right: 1px solid ${e.authOutlineVariant}1a;
2168
+ border-right: 1px solid ${a.authOutlineVariant}1a;
2131
2169
  display: flex;
2132
2170
  flex-direction: column;
2133
2171
  gap: 4px;
2134
2172
  flex-shrink: 0;
2135
- background: ${e.authSurfaceContainerLow};
2173
+ background: ${a.authSurfaceContainerLow};
2136
2174
  }
2137
2175
 
2138
2176
  .ss-auth-settings-nav-item {
@@ -2146,26 +2184,26 @@
2146
2184
  background: none;
2147
2185
  border: none;
2148
2186
  width: 100%;
2149
- font-family: ${e.authFontBody};
2187
+ font-family: ${a.authFontBody};
2150
2188
  font-size: 14px;
2151
2189
  font-weight: 500;
2152
- color: ${e.authOnSurfaceVariant};
2190
+ color: ${a.authOnSurfaceVariant};
2153
2191
  text-align: left;
2154
2192
  }
2155
2193
 
2156
2194
  .ss-auth-settings-nav-item:hover {
2157
- background: ${e.authSurfaceContainer};
2158
- color: ${e.authOnSurface};
2195
+ background: ${a.authSurfaceContainer};
2196
+ color: ${a.authOnSurface};
2159
2197
  }
2160
2198
 
2161
2199
  .ss-auth-settings-nav-item-active {
2162
- background: ${e.authPrimaryFixed}4d;
2163
- color: ${e.authPrimary};
2200
+ background: ${a.authPrimaryFixed}4d;
2201
+ color: ${a.authPrimary};
2164
2202
  font-weight: 600;
2165
2203
  }
2166
2204
 
2167
2205
  .ss-auth-settings-nav-item-active:hover {
2168
- background: ${e.authPrimaryFixed}4d;
2206
+ background: ${a.authPrimaryFixed}4d;
2169
2207
  }
2170
2208
 
2171
2209
  .ss-auth-settings-nav-item .material-symbols-outlined {
@@ -2182,27 +2220,27 @@
2182
2220
  }
2183
2221
 
2184
2222
  .ss-auth-settings-content h3 {
2185
- font-family: ${e.authFontHeadline};
2223
+ font-family: ${a.authFontHeadline};
2186
2224
  font-size: 18px;
2187
2225
  font-weight: 700;
2188
- color: ${e.authOnSurface};
2226
+ color: ${a.authOnSurface};
2189
2227
  letter-spacing: -0.01em;
2190
2228
  margin: 0 0 24px 0;
2191
2229
  }
2192
2230
 
2193
2231
  .ss-auth-settings-card {
2194
- background: ${e.authSurfaceContainer};
2195
- border: 1px solid ${e.authOutlineVariant}1a;
2232
+ background: ${a.authSurfaceContainer};
2233
+ border: 1px solid ${a.authOutlineVariant}1a;
2196
2234
  border-radius: 12px;
2197
2235
  padding: 24px;
2198
2236
  margin-bottom: 24px;
2199
2237
  }
2200
2238
 
2201
2239
  .ss-auth-settings-card h4 {
2202
- font-family: ${e.authFontHeadline};
2240
+ font-family: ${a.authFontHeadline};
2203
2241
  font-size: 15px;
2204
2242
  font-weight: 700;
2205
- color: ${e.authOnSurface};
2243
+ color: ${a.authOnSurface};
2206
2244
  margin: 0 0 16px 0;
2207
2245
  display: flex;
2208
2246
  align-items: center;
@@ -2210,7 +2248,7 @@
2210
2248
  }
2211
2249
 
2212
2250
  .ss-auth-settings-card h4 .material-symbols-outlined {
2213
- color: ${e.authPrimary};
2251
+ color: ${a.authPrimary};
2214
2252
  font-size: 20px;
2215
2253
  }
2216
2254
 
@@ -2218,7 +2256,7 @@
2218
2256
  .ss-auth-settings-table {
2219
2257
  width: 100%;
2220
2258
  border-collapse: collapse;
2221
- font-family: ${e.authFontBody};
2259
+ font-family: ${a.authFontBody};
2222
2260
  font-size: 14px;
2223
2261
  }
2224
2262
 
@@ -2229,14 +2267,14 @@
2229
2267
  font-weight: 700;
2230
2268
  text-transform: uppercase;
2231
2269
  letter-spacing: 0.08em;
2232
- color: ${e.authOnSurfaceVariant};
2233
- border-bottom: 1px solid ${e.authOutlineVariant}33;
2270
+ color: ${a.authOnSurfaceVariant};
2271
+ border-bottom: 1px solid ${a.authOutlineVariant}33;
2234
2272
  }
2235
2273
 
2236
2274
  .ss-auth-settings-table td {
2237
2275
  padding: 10px 12px;
2238
- color: ${e.authOnSurface};
2239
- border-bottom: 1px solid ${e.authOutlineVariant}1a;
2276
+ color: ${a.authOnSurface};
2277
+ border-bottom: 1px solid ${a.authOutlineVariant}1a;
2240
2278
  }
2241
2279
 
2242
2280
  .ss-auth-settings-table tr:last-child td {
@@ -2244,7 +2282,7 @@
2244
2282
  }
2245
2283
 
2246
2284
  .ss-auth-settings-table tr:hover td {
2247
- background: ${e.authSurfaceContainerLow};
2285
+ background: ${a.authSurfaceContainerLow};
2248
2286
  }
2249
2287
 
2250
2288
  /* Settings Role Badges */
@@ -2256,7 +2294,7 @@
2256
2294
  letter-spacing: 0.05em;
2257
2295
  padding: 2px 8px;
2258
2296
  border-radius: 999px;
2259
- font-family: ${e.authFontBody};
2297
+ font-family: ${a.authFontBody};
2260
2298
  }
2261
2299
 
2262
2300
  .ss-auth-role-badge-owner {
@@ -2272,9 +2310,9 @@
2272
2310
  }
2273
2311
 
2274
2312
  .ss-auth-role-badge-member {
2275
- background: ${e.authOnSurfaceVariant}1a;
2276
- color: ${e.authOnSurfaceVariant};
2277
- border: 1px solid ${e.authOutlineVariant}33;
2313
+ background: ${a.authOnSurfaceVariant}1a;
2314
+ color: ${a.authOnSurfaceVariant};
2315
+ border: 1px solid ${a.authOutlineVariant}33;
2278
2316
  }
2279
2317
 
2280
2318
  /* Settings icon buttons */
@@ -2284,7 +2322,7 @@
2284
2322
  cursor: pointer;
2285
2323
  padding: 4px;
2286
2324
  border-radius: 6px;
2287
- color: ${e.authOnSurfaceVariant};
2325
+ color: ${a.authOnSurfaceVariant};
2288
2326
  display: inline-flex;
2289
2327
  align-items: center;
2290
2328
  justify-content: center;
@@ -2292,13 +2330,13 @@
2292
2330
  }
2293
2331
 
2294
2332
  .ss-auth-icon-btn:hover {
2295
- background: ${e.authSurfaceContainerHigh};
2296
- color: ${e.authOnSurface};
2333
+ background: ${a.authSurfaceContainerHigh};
2334
+ color: ${a.authOnSurface};
2297
2335
  }
2298
2336
 
2299
2337
  .ss-auth-icon-btn-danger:hover {
2300
- background: ${e.authError}1a;
2301
- color: ${e.authError};
2338
+ background: ${a.authError}1a;
2339
+ color: ${a.authError};
2302
2340
  }
2303
2341
 
2304
2342
  .ss-auth-icon-btn .material-symbols-outlined {
@@ -2309,7 +2347,7 @@
2309
2347
  .ss-auth-settings-empty {
2310
2348
  text-align: center;
2311
2349
  padding: 40px 20px;
2312
- color: ${e.authOnSurfaceVariant};
2350
+ color: ${a.authOnSurfaceVariant};
2313
2351
  font-size: 14px;
2314
2352
  }
2315
2353
 
@@ -2328,11 +2366,11 @@
2328
2366
 
2329
2367
  /* Settings Danger Card */
2330
2368
  .ss-auth-settings-danger {
2331
- border-color: ${e.authError}33;
2369
+ border-color: ${a.authError}33;
2332
2370
  }
2333
2371
 
2334
2372
  .ss-auth-settings-danger h4 {
2335
- color: ${e.authError};
2373
+ color: ${a.authError};
2336
2374
  }
2337
2375
 
2338
2376
  /* Responsive overrides */
@@ -2354,4 +2392,4 @@
2354
2392
  .ss-auth-trigger-org-name { display: none; }
2355
2393
  .ss-auth-user-trigger { padding: 0; border: none; background: none; }
2356
2394
  }
2357
- `}function M({children:e,appearance:t}){const a=r.useRef(null),[l,n]=r.useState(null);r.useEffect(()=>{var x;if(!a.current||a.current.shadowRoot){n(((x=a.current)==null?void 0:x.shadowRoot)??null);return}const c=a.current.attachShadow({mode:"open"});if((t==null?void 0:t.fontUrl)!==null){const p=(t==null?void 0:t.fontUrl)??"https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Inter:wght@400;500;600&family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=swap";if(!document.querySelector(`link[href="${p}"]`)){const y=document.createElement("link");y.rel="stylesheet",y.href=p,document.head.appendChild(y)}const h=document.createElement("link");h.rel="stylesheet",h.href=p,c.appendChild(h)}const d=Q(t),i=document.createElement("style");i.textContent=J(d),c.appendChild(i);const o=document.createElement("div");c.appendChild(o),n(c)},[]),r.useEffect(()=>{if(!l)return;const c=l.querySelector("style");if(c){const d=Q(t);c.textContent=J(d)}},[t,l]);const u=(l==null?void 0:l.querySelector("div"))??null;return s.jsx("div",{ref:a,style:{display:"contents"},children:u&&js.createPortal(e,u)})}function W(){const{client:e,user:t,isLoaded:a}=B();return{isLoaded:a,isSignedIn:!!t,user:t,signOut:r.useCallback(()=>e.auth.signOut(),[e]),getToken:r.useCallback(()=>e.auth.getToken(),[e]),refreshUser:r.useCallback(()=>e.auth.refreshUser(),[e])}}function $s(){const{user:e,isLoaded:t}=B();return{user:e,isLoaded:t}}function K(){const{client:e}=B(),[t,a]=r.useState(!1),[l,n]=r.useState(null),u=r.useCallback(async(i,o)=>{a(!0),n(null);try{return await e.auth.signIn(i,o)}catch(x){return n(x instanceof Error?x.message:"Sign in failed"),null}finally{a(!1)}},[e]),c=r.useCallback(async i=>{a(!0),n(null);try{return await e.auth.signInWithOAuth(i)}catch(o){return n(o instanceof Error?o.message:"OAuth sign in failed"),null}finally{a(!1)}},[e]),d=r.useCallback(async(i,o)=>{a(!0),n(null);try{return await e.auth.submitMfaCode(i,o)}catch(x){return n(x instanceof Error?x.message:"MFA verification failed"),null}finally{a(!1)}},[e]);return{signIn:u,signInWithOAuth:c,submitMfaCode:d,isLoading:t,error:l,setError:n}}function es(){const{client:e}=B(),[t,a]=r.useState(!1),[l,n]=r.useState(null);return{signUp:r.useCallback(async(c,d)=>{a(!0),n(null);try{return await e.auth.signUp(c,d)}catch(i){return n(i instanceof Error?i.message:"Sign up failed"),null}finally{a(!1)}},[e]),isLoading:t,error:l,setError:n}}function H(){const{client:e}=B(),[t,a]=r.useState([]),[l,n]=r.useState(null),[u,c]=r.useState([]),[d,i]=r.useState([]),[o,x]=r.useState(!1),[p,h]=r.useState(null),y=r.useRef(!1),f=r.useCallback(async()=>{x(!0),h(null);try{const m=await e.auth.listOrgs();if(a(m),!y.current&&m.length>0){const j=typeof window<"u"?localStorage.getItem("ss_selected_org"):null,k=(j?m.find(T=>T.id===j):null)??(m.length===1?m[0]:null);if(k){y.current=!0,n(k),typeof window<"u"&&localStorage.setItem("ss_selected_org",k.id);try{const T=await e.auth.listMembers(k.id);c(T)}catch{}}}}catch(m){h(m instanceof Error?m.message:"Failed to load organizations")}finally{x(!1)}},[e]);r.useEffect(()=>{f()},[f]);const b=r.useCallback(async m=>{try{const j=await e.auth.getOrg(m);n(j),typeof window<"u"&&localStorage.setItem("ss_selected_org",m);const O=await e.auth.listMembers(m);c(O)}catch(j){h(j instanceof Error?j.message:"Failed to load organization")}},[e]),$=r.useCallback(async(m,j)=>{try{const O=await e.auth.createOrg(m,j);return a(k=>[...k,O]),O}catch(O){return h(O instanceof Error?O.message:"Failed to create organization"),null}},[e]),v=r.useCallback(async(m,j)=>{try{const O=await e.auth.updateOrg(m,j);return a(k=>k.map(T=>T.id===m?O:T)),(l==null?void 0:l.id)===m&&n(O),O}catch(O){return h(O instanceof Error?O.message:"Failed to update organization"),null}},[e,l]),z=r.useCallback(async m=>{try{return await e.auth.deleteOrg(m),a(j=>j.filter(O=>O.id!==m)),(l==null?void 0:l.id)===m&&(n(null),c([]),i([]),typeof window<"u"&&localStorage.removeItem("ss_selected_org")),!0}catch(j){return h(j instanceof Error?j.message:"Failed to delete organization"),!1}},[e,l]),N=r.useCallback(async(m,j,O)=>{try{return await e.auth.sendInvite(m,j,O)}catch(k){return h(k instanceof Error?k.message:"Failed to send invite"),null}},[e]),g=r.useCallback(async m=>{try{const j=await e.auth.listInvites(m);i(j)}catch(j){h(j instanceof Error?j.message:"Failed to load invites")}},[e]),C=r.useCallback(async(m,j)=>{try{return await e.auth.revokeInvite(m,j),i(O=>O.filter(k=>k.id!==j)),!0}catch(O){return h(O instanceof Error?O.message:"Failed to revoke invite"),!1}},[e]),P=r.useCallback(async(m,j,O)=>{try{return await e.auth.updateMemberRole(m,j,O),c(k=>k.map(T=>T.userId===j?{...T,role:O}:T)),!0}catch(k){return h(k instanceof Error?k.message:"Failed to update member role"),!1}},[e]),E=r.useCallback(async(m,j)=>{try{return await e.auth.removeMember(m,j),c(O=>O.filter(k=>k.userId!==j)),!0}catch(O){return h(O instanceof Error?O.message:"Failed to remove member"),!1}},[e]),F=r.useCallback(async m=>{try{const j=await e.auth.listMembers(m);c(j)}catch(j){h(j instanceof Error?j.message:"Failed to load members")}},[e]);return{orgs:t,selectedOrg:l,members:u,invites:d,isLoading:o,error:p,setError:h,refresh:f,selectOrg:b,createOrg:$,updateOrg:v,deleteOrg:z,sendInvite:N,refreshInvites:g,revokeInvite:C,updateMemberRole:P,removeMember:E,refreshMembers:F}}function as(){const{client:e}=B(),[t,a]=r.useState(!1),[l,n]=r.useState(null);return{deleteAccount:r.useCallback(async()=>{a(!0),n(null);try{return await e.auth.deleteAccount(),!0}catch(c){return n(c instanceof Error?c.message:"Failed to delete account"),!1}finally{a(!1)}},[e]),isLoading:t,error:l,setError:n}}function X(){const{client:e,user:t}=B(),[a,l]=r.useState(!1),[n,u]=r.useState(null),[c,d]=r.useState(null),i=r.useCallback(async p=>{l(!0),u(null),d(null);try{const h=await e.auth.updateProfile(p);return d("Profile updated"),h}catch(h){return u(h instanceof Error?h.message:"Failed to update profile"),null}finally{l(!1)}},[e]),o=r.useCallback(async(p,h)=>{l(!0),u(null),d(null);try{return await e.auth.changePassword(p,h),d("Password changed successfully"),!0}catch(y){return u(y instanceof Error?y.message:"Failed to change password"),!1}finally{l(!1)}},[e]),x=r.useCallback(async p=>{l(!0),u(null),d(null);try{const h=await e.auth.uploadAvatar(p);return d("Avatar updated"),h}catch(h){return u(h instanceof Error?h.message:"Failed to upload avatar"),null}finally{l(!1)}},[e]);return{user:t,updateProfile:i,uploadAvatar:x,changePassword:o,isLoading:a,error:n,success:c,setError:u,setSuccess:d}}const ts='<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92a5.06 5.06 0 0 1-2.2 3.32v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.1z" fill="#4285F4"/><path d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" fill="#34A853"/><path d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z" fill="#FBBC05"/><path d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z" fill="#EA4335"/></svg>',rs='<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0 0 24 12c0-6.63-5.37-12-12-12z" fill="currentColor"/></svg>',w={close:"close",person:"person",logout:"logout",checkCircle:"check_circle",unfoldMore:"unfold_more",cloudUpload:"cloud_upload",zoomIn:"zoom_in",zoomOut:"zoom_out",lock:"lock",visibility:"visibility",visibilityOff:"visibility_off",add:"add",addCircle:"add_circle",camera:"photo_camera",security:"security",errorOutline:"error_outline",info:"info",arrowBack:"arrow_back",arrowForward:"arrow_forward",verified:"verified",token:"token",autoAwesome:"auto_awesome",corporateFare:"corporate_fare",cloudDone:"cloud_done",check:"check",image:"image",settings:"settings",group:"group",creditCard:"credit_card",edit:"edit",send:"send",personRemove:"person_remove"};function Cs({appearance:e,signUpUrl:t,onSignUp:a}){const{appearance:l,settings:n}=B(),{signIn:u,signInWithOAuth:c,submitMfaCode:d,isLoading:i,error:o,setError:x}=K(),p=e??l,[h,y]=r.useState(""),[f,b]=r.useState(""),[$,v]=r.useState(!1),[z,N]=r.useState(!1),[g,C]=r.useState(""),[P,E]=r.useState(["","","","","",""]),F=r.useRef([]),m=r.useCallback(async I=>{if(I.preventDefault(),z){await d(g,P.join(""));return}const S=await u(h,f);S&&R.isMfaRequired(S)&&(C(S.mfaToken),N(!0),x(null))},[h,f,z,g,P,u,d,x]),j=r.useCallback(async I=>{await c(I)},[c]),O=r.useCallback((I,S)=>{var V;if(!/^\d*$/.test(S))return;const L=S.slice(-1);E(G=>{const q=[...G];return q[I]=L,q}),L&&I<5&&((V=F.current[I+1])==null||V.focus())},[]),k=r.useCallback((I,S)=>{var L;S.key==="Backspace"&&!P[I]&&I>0&&((L=F.current[I-1])==null||L.focus())},[P]),T=(n==null?void 0:n.googleEnabled)||(n==null?void 0:n.githubEnabled);return s.jsx(M,{appearance:p,children:s.jsx("div",{className:"ss-auth-card",children:s.jsxs("div",{className:"ss-auth-card-body",children:[s.jsxs("div",{className:"ss-auth-header",children:[s.jsx("div",{className:"ss-auth-brand-icon",children:s.jsx("span",{className:"material-symbols-outlined",children:w.token})}),s.jsx("h1",{className:"ss-auth-title",children:"Sign in to your account"}),s.jsx("p",{className:"ss-auth-subtitle",children:"Welcome back to your workspace"})]}),!z&&T&&s.jsxs(s.Fragment,{children:[s.jsxs("div",{className:"ss-auth-oauth-grid",children:[(n==null?void 0:n.googleEnabled)&&s.jsxs("button",{type:"button",className:"ss-auth-btn-social",onClick:()=>j("google"),disabled:i,children:[s.jsx("span",{dangerouslySetInnerHTML:{__html:ts}}),"Google"]}),(n==null?void 0:n.githubEnabled)&&s.jsxs("button",{type:"button",className:"ss-auth-btn-social",onClick:()=>j("github"),disabled:i,children:[s.jsx("span",{dangerouslySetInnerHTML:{__html:rs}}),"GitHub"]})]}),s.jsx("div",{className:"ss-auth-divider",children:"or continue with"})]}),o&&s.jsxs("div",{className:"ss-auth-error",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.errorOutline}),s.jsx("span",{children:o})]}),s.jsxs("form",{onSubmit:m,children:[z?s.jsxs(s.Fragment,{children:[s.jsx("div",{className:"ss-auth-mfa-divider",children:s.jsx("span",{children:"Verification Required"})}),s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",children:"6-Digit Code"}),s.jsx("div",{className:"ss-auth-mfa-group",children:P.map((I,S)=>s.jsx("input",{ref:L=>{F.current[S]=L},className:"ss-auth-mfa-digit",type:"text",inputMode:"numeric",maxLength:1,value:I,onChange:L=>O(S,L.target.value),onKeyDown:L=>k(S,L),autoFocus:S===0},S))}),s.jsx("p",{className:"ss-auth-mfa-hint",children:"We sent a 6-digit code to your registered email."})]})]}):s.jsxs(s.Fragment,{children:[s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",htmlFor:"ss-email",children:"Email Address"}),s.jsx("input",{id:"ss-email",className:"ss-auth-input",type:"email",autoComplete:"email",placeholder:"name@company.com",value:h,onChange:I=>y(I.target.value),required:!0})]}),s.jsxs("div",{className:"ss-auth-field",children:[s.jsxs("div",{className:"ss-auth-field-row",children:[s.jsx("label",{className:"ss-auth-label",htmlFor:"ss-password",style:{marginBottom:0},children:"Password"}),s.jsx("span",{className:"ss-auth-link",style:{fontSize:"12px"},children:"Forgot?"})]}),s.jsxs("div",{style:{position:"relative"},children:[s.jsx("input",{id:"ss-password",className:"ss-auth-input",type:$?"text":"password",autoComplete:"current-password",placeholder:"••••••••",value:f,onChange:I=>b(I.target.value),required:!0}),s.jsx("button",{type:"button",className:"ss-auth-visibility-toggle",onClick:()=>v(!$),children:s.jsx("span",{className:"material-symbols-outlined",children:$?w.visibilityOff:w.visibility})})]})]})]}),s.jsxs("button",{type:"submit",className:"ss-auth-btn-primary",disabled:i,children:[i&&s.jsx("span",{className:"ss-auth-spinner"}),z?"Verify":"Sign in",!i&&s.jsx("span",{className:"material-symbols-outlined",children:w.arrowForward})]})]}),z?s.jsx("div",{className:"ss-auth-footer",children:s.jsx("span",{className:"ss-auth-link",onClick:()=>{N(!1),E(["","","","","",""]),x(null)},children:"Back to sign in"})}):s.jsxs("div",{className:"ss-auth-footer",children:["Don't have an account?"," ",a?s.jsx("span",{className:"ss-auth-link",onClick:a,children:"Sign up"}):t?s.jsx("a",{className:"ss-auth-link",href:t,children:"Sign up"}):s.jsx("span",{className:"ss-auth-link",children:"Sign up"})]})]})})})}function zs({appearance:e,signInUrl:t,onSignIn:a}){const{appearance:l,settings:n}=B(),{signUp:u,isLoading:c,error:d,setError:i}=es(),{signInWithOAuth:o}=K(),x=e??l,[p,h]=r.useState(""),[y,f]=r.useState(""),[b,$]=r.useState(""),[v,z]=r.useState(!1),[N,g]=r.useState(null),C=r.useCallback(async m=>{if(m.preventDefault(),g(null),y!==b){g("Passwords do not match");return}const j=(n==null?void 0:n.passwordMinLength)??8;if(y.length<j){g(`Password must be at least ${j} characters`);return}await u(p,y)},[p,y,b,n,u]),P=r.useCallback(async m=>{await o(m)},[o]),E=(n==null?void 0:n.googleEnabled)||(n==null?void 0:n.githubEnabled),F=N||d;return s.jsx(M,{appearance:x,children:s.jsxs("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",width:"100%",maxWidth:"520px"},children:[s.jsxs("div",{className:"ss-auth-header",children:[s.jsx("div",{className:"ss-auth-brand-icon-gradient",children:s.jsx("span",{className:"material-symbols-outlined",children:w.autoAwesome})}),s.jsx("h1",{className:"ss-auth-title ss-auth-title-lg",children:"Create your account"}),s.jsx("p",{className:"ss-auth-subtitle",children:"Join the ecosystem"})]}),s.jsx("div",{className:"ss-auth-card",children:s.jsxs("div",{className:"ss-auth-card-body",children:[E&&s.jsxs(s.Fragment,{children:[s.jsxs("div",{className:"ss-auth-oauth-grid",children:[(n==null?void 0:n.googleEnabled)&&s.jsxs("button",{type:"button",className:"ss-auth-btn-social",onClick:()=>P("google"),disabled:c,children:[s.jsx("span",{dangerouslySetInnerHTML:{__html:ts}}),"Google"]}),(n==null?void 0:n.githubEnabled)&&s.jsxs("button",{type:"button",className:"ss-auth-btn-social",onClick:()=>P("github"),disabled:c,children:[s.jsx("span",{dangerouslySetInnerHTML:{__html:rs}}),"GitHub"]})]}),s.jsx("div",{className:"ss-auth-divider",children:"or sign up with email"})]}),F&&s.jsxs("div",{className:"ss-auth-error",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.errorOutline}),s.jsx("span",{children:F})]}),s.jsxs("form",{onSubmit:C,children:[s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",htmlFor:"ss-signup-email",children:"Email"}),s.jsx("input",{id:"ss-signup-email",className:"ss-auth-input",type:"email",autoComplete:"email",placeholder:"name@company.com",value:p,onChange:m=>h(m.target.value),required:!0})]}),s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",htmlFor:"ss-signup-password",children:"Password"}),s.jsxs("div",{style:{position:"relative"},children:[s.jsx("input",{id:"ss-signup-password",className:"ss-auth-input",type:v?"text":"password",autoComplete:"new-password",placeholder:"••••••••",value:y,onChange:m=>{f(m.target.value),g(null)},required:!0}),s.jsx("button",{type:"button",className:"ss-auth-visibility-toggle",onClick:()=>z(!v),children:s.jsx("span",{className:"material-symbols-outlined",children:v?w.visibilityOff:w.visibility})})]})]}),s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",htmlFor:"ss-signup-confirm",children:"Confirm Password"}),s.jsx("input",{id:"ss-signup-confirm",className:"ss-auth-input",type:"password",autoComplete:"new-password",placeholder:"••••••••",value:b,onChange:m=>{$(m.target.value),g(null)},required:!0})]}),s.jsxs("button",{type:"submit",className:"ss-auth-btn-primary",disabled:c,children:[c&&s.jsx("span",{className:"ss-auth-spinner"}),"Sign up",!c&&s.jsx("span",{className:"material-symbols-outlined",children:w.arrowForward})]})]}),s.jsxs("div",{className:"ss-auth-footer",children:["Already have an account?"," ",a?s.jsx("span",{className:"ss-auth-link",onClick:a,children:"Sign in"}):t?s.jsx("a",{className:"ss-auth-link",href:t,children:"Sign in"}):s.jsx("span",{className:"ss-auth-link",children:"Sign in"})]})]})})]})})}const A=320,U=128,Ps=r.forwardRef(function({file:t,onCrop:a,onCancel:l},n){const u=r.useRef(null),c=r.useRef(null),[d,i]=r.useState(1),[o,x]=r.useState({x:0,y:0}),[p,h]=r.useState(!1),y=r.useRef({x:0,y:0,ox:0,oy:0}),[f,b]=r.useState(!1);r.useEffect(()=>{const g=new Image,C=URL.createObjectURL(t);return g.onload=()=>{c.current=g,b(!0),x({x:0,y:0}),i(1)},g.src=C,()=>URL.revokeObjectURL(C)},[t]),r.useEffect(()=>{if(!f||!c.current||!u.current)return;const g=u.current.getContext("2d");if(!g)return;const C=c.current;g.clearRect(0,0,A,A),g.fillStyle="#111",g.fillRect(0,0,A,A);const P=Math.max(A/C.width,A/C.height)*d,E=C.width*P,F=C.height*P,m=(A-E)/2+o.x,j=(A-F)/2+o.y;g.save(),g.beginPath(),g.arc(A/2,A/2,U,0,Math.PI*2),g.clip(),g.drawImage(C,m,j,E,F),g.restore(),g.save(),g.fillStyle="rgba(0, 0, 0, 0.6)",g.fillRect(0,0,A,A),g.globalCompositeOperation="destination-out",g.beginPath(),g.arc(A/2,A/2,U,0,Math.PI*2),g.fill(),g.restore(),g.save(),g.beginPath(),g.arc(A/2,A/2,U,0,Math.PI*2),g.clip(),g.drawImage(C,m,j,E,F),g.restore(),g.strokeStyle="rgba(255, 255, 255, 0.4)",g.lineWidth=2,g.beginPath(),g.arc(A/2,A/2,U,0,Math.PI*2),g.stroke()},[d,o,f]);const $=r.useCallback(g=>{h(!0),y.current={x:g.clientX,y:g.clientY,ox:o.x,oy:o.y},g.target.setPointerCapture(g.pointerId)},[o]),v=r.useCallback(g=>{p&&x({x:y.current.ox+(g.clientX-y.current.x),y:y.current.oy+(g.clientY-y.current.y)})},[p]),z=r.useCallback(()=>h(!1),[]),N=r.useCallback(()=>{if(!c.current)return;const g=document.createElement("canvas"),C=U*2;g.width=C,g.height=C;const P=g.getContext("2d");if(!P)return;const E=c.current,F=Math.max(A/E.width,A/E.height)*d,m=E.width*F,j=E.height*F,O=(A-m)/2+o.x-(A/2-U),k=(A-j)/2+o.y-(A/2-U);P.beginPath(),P.arc(U,U,U,0,Math.PI*2),P.clip(),P.drawImage(E,O,k,m,j),g.toBlob(T=>{T&&a(T)},"image/png")},[d,o,a]);return r.useImperativeHandle(n,()=>({triggerCrop:()=>N()}),[N]),s.jsxs("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",gap:"24px"},children:[s.jsxs("div",{className:"ss-auth-crop-area",children:[s.jsx("canvas",{ref:u,width:A,height:A,style:{cursor:p?"grabbing":"grab",width:"100%",height:"100%"},onPointerDown:$,onPointerMove:v,onPointerUp:z}),s.jsx("div",{className:"ss-auth-crop-size-badge",children:"256 x 256 px"})]}),s.jsxs("div",{className:"ss-auth-zoom-control",style:{width:"100%",maxWidth:"280px"},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.zoomOut}),s.jsx("input",{type:"range",min:"1",max:"3",step:"0.01",value:d,onChange:g=>i(parseFloat(g.target.value)),className:"ss-auth-zoom-slider"}),s.jsx("span",{className:"material-symbols-outlined",children:w.zoomIn})]})]})});function ns({onUpload:e,onClose:t,isLoading:a}){const[l,n]=r.useState(null),[u,c]=r.useState(!1),[d,i]=r.useState(null),o=r.useRef(null),x=r.useRef(null),p=r.useCallback(f=>{if(!f.type.startsWith("image/")){i("Please select an image file");return}if(f.size>5*1024*1024){i("Image must be smaller than 5 MB");return}i(null),n(f)},[]),h=r.useCallback(f=>{f.preventDefault(),c(!1);const b=f.dataTransfer.files[0];b&&p(b)},[p]),y=r.useCallback(async f=>{await e(f)},[e]);return s.jsx("div",{className:"ss-auth-modal-overlay",onClick:f=>{f.target===f.currentTarget&&t()},children:s.jsxs("div",{className:"ss-auth-modal",style:{maxWidth:"480px"},children:[s.jsxs("div",{className:"ss-auth-modal-header",children:[s.jsx("h2",{children:"Upload avatar"}),s.jsx("button",{type:"button",className:"ss-auth-modal-close",onClick:t,children:s.jsx("span",{className:"material-symbols-outlined",children:w.close})})]}),s.jsxs("div",{className:"ss-auth-modal-body",children:[d&&s.jsxs("div",{className:"ss-auth-error",style:{marginBottom:"16px"},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.errorOutline}),s.jsx("span",{children:d})]}),l?s.jsxs(s.Fragment,{children:[s.jsx(Ps,{ref:x,file:l,onCrop:y,onCancel:()=>n(null)}),s.jsx("div",{style:{textAlign:"center",marginTop:"8px"},children:s.jsxs("button",{type:"button",className:"ss-auth-btn-ghost",style:{fontSize:"13px"},onClick:()=>{var f;return(f=o.current)==null?void 0:f.click()},children:[s.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"16px"},children:w.image}),"Change image"]})})]}):s.jsxs("div",{className:`ss-auth-dropzone${u?" ss-auth-dropzone-active":""}`,onDragOver:f=>{f.preventDefault(),c(!0)},onDragLeave:()=>c(!1),onDrop:h,onClick:()=>{var f;return(f=o.current)==null?void 0:f.click()},style:{minHeight:"240px"},children:[s.jsx("div",{className:"ss-auth-dropzone-icon",children:s.jsx("span",{className:"material-symbols-outlined",children:w.cloudUpload})}),s.jsx("span",{className:"ss-auth-dropzone-title",children:"Drag and drop"}),s.jsxs("span",{className:"ss-auth-dropzone-desc",children:["JPG, PNG or WEBP",s.jsx("br",{}),"Max file size 5 MB"]}),s.jsx("button",{type:"button",className:"ss-auth-dropzone-btn",children:"Choose File"})]}),s.jsx("input",{ref:o,type:"file",accept:"image/*",style:{display:"none"},onChange:f=>{var b;(b=f.target.files)!=null&&b[0]&&p(f.target.files[0])}}),s.jsxs("div",{className:"ss-auth-info-box",style:{marginTop:"16px"},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.info}),s.jsx("span",{children:"Your profile photo will be visible to all members of your organization."})]})]}),s.jsxs("div",{className:"ss-auth-modal-footer",children:[s.jsx("button",{type:"button",className:"ss-auth-btn-ghost",onClick:t,children:"Cancel"}),s.jsxs("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",onClick:()=>{var f;return(f=x.current)==null?void 0:f.triggerCrop()},disabled:!l||a,style:{width:"auto"},children:[a&&s.jsx("span",{className:"ss-auth-spinner"}),"Save Profile",!a&&s.jsx("span",{className:"material-symbols-outlined",children:w.check})]})]})]})})}function os({onClose:e,afterDeleteAccountUrl:t,defaultTab:a="profile",onOrgDeleted:l,onOrgUpdated:n}){const[u,c]=r.useState(a),d=[{key:"profile",label:"Profile",icon:w.person},{key:"organization",label:"Organization",icon:w.corporateFare},{key:"people",label:"People",icon:w.group},{key:"billing",label:"Billing",icon:w.creditCard}];return s.jsxs("div",{className:"ss-auth-settings-page",children:[s.jsxs("div",{className:"ss-auth-settings-header",children:[s.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"12px"},children:[s.jsx("button",{type:"button",className:"ss-auth-settings-back",onClick:e,children:s.jsx("span",{className:"material-symbols-outlined",children:w.arrowBack})}),s.jsx("h2",{children:"Settings"})]}),s.jsx("button",{type:"button",className:"ss-auth-modal-close",onClick:e,children:s.jsx("span",{className:"material-symbols-outlined",children:w.close})})]}),s.jsxs("div",{className:"ss-auth-settings-layout",children:[s.jsx("nav",{className:"ss-auth-settings-nav",children:d.map(i=>s.jsxs("button",{type:"button",className:`ss-auth-settings-nav-item${u===i.key?" ss-auth-settings-nav-item-active":""}`,onClick:()=>c(i.key),children:[s.jsx("span",{className:"material-symbols-outlined",children:i.icon}),i.label]},i.key))}),s.jsxs("div",{className:"ss-auth-settings-content",children:[u==="profile"&&s.jsx(Os,{afterDeleteAccountUrl:t}),u==="organization"&&s.jsx(Es,{onOrgDeleted:l,onOrgUpdated:n}),u==="people"&&s.jsx(Is,{}),u==="billing"&&s.jsx(Fs,{})]})]})]})}function Os({afterDeleteAccountUrl:e}){const{user:t,updateProfile:a,uploadAvatar:l,changePassword:n,isLoading:u,error:c,success:d,setError:i,setSuccess:o}=X(),{signOut:x}=W(),{deleteAccount:p,isLoading:h,error:y,setError:f}=as(),[b,$]=r.useState((t==null?void 0:t.name)??""),[v,z]=r.useState((t==null?void 0:t.avatarUrl)??""),[N,g]=r.useState(!1),[C,P]=r.useState(""),[E,F]=r.useState(""),[m,j]=r.useState(""),[O,k]=r.useState(null),[T,I]=r.useState(!1),[S,L]=r.useState(""),V=r.useCallback(async D=>{D.preventDefault(),i(null),o(null),await a({name:b,avatarUrl:v||void 0})},[b,v,a,i,o]),G=r.useCallback(async D=>{const Y=await l(D);Y&&(z(Y.avatarUrl),g(!1))},[l]),q=r.useCallback(async D=>{if(D.preventDefault(),k(null),i(null),o(null),E!==m){k("Passwords do not match");return}if(E.length<8){k("Password must be at least 8 characters");return}await n(C,E)&&(P(""),F(""),j(""))},[C,E,m,n,i,o]),ms=r.useCallback(async()=>{await p()&&(await x(),e&&(window.location.href=e))},[p,x,e]),fs=(t==null?void 0:t.provider)==="email",bs=S===(t==null?void 0:t.email),ys=((t==null?void 0:t.name)||(t==null?void 0:t.email)||"?").charAt(0).toUpperCase();return s.jsxs(s.Fragment,{children:[s.jsx("h3",{children:"Profile"}),s.jsxs("div",{className:"ss-auth-settings-card",children:[s.jsxs("div",{className:"ss-auth-profile-header",style:{border:"none",background:"none",padding:0,marginBottom:16},children:[s.jsxs("div",{className:"ss-auth-avatar-lg",onClick:()=>g(!0),children:[v?s.jsx("img",{src:v,alt:""}):s.jsx("div",{style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",fontSize:"48px",fontWeight:800,opacity:.4},children:ys}),s.jsxs("div",{className:"ss-auth-avatar-overlay",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.camera}),s.jsx("span",{children:"Edit"})]})]}),s.jsxs("div",{className:"ss-auth-profile-info",children:[s.jsxs("h2",{className:"ss-auth-profile-name",children:[(t==null?void 0:t.name)||"Unnamed User",(t==null?void 0:t.emailVerified)&&s.jsxs("span",{className:"ss-auth-badge ss-auth-badge-success",children:[s.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"12px",fontVariationSettings:"'FILL' 1"},children:w.verified}),"Verified"]})]}),s.jsx("p",{className:"ss-auth-profile-desc",children:t==null?void 0:t.email})]})]}),c&&s.jsxs("div",{className:"ss-auth-error",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.errorOutline}),s.jsx("span",{children:c})]}),d&&s.jsxs("div",{className:"ss-auth-info-box",style:{marginBottom:"16px"},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.check}),s.jsx("span",{children:d})]}),s.jsxs("form",{onSubmit:V,children:[s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",children:"Full Name"}),s.jsx("input",{className:"ss-auth-input",type:"text",placeholder:"Your name",value:b,onChange:D=>$(D.target.value)})]}),s.jsxs("div",{className:"ss-auth-profile-grid",style:{marginBottom:"16px"},children:[s.jsxs("div",{children:[s.jsx("label",{className:"ss-auth-label",children:"Email Address"}),s.jsxs("div",{style:{position:"relative"},children:[s.jsx("input",{className:"ss-auth-input ss-auth-input-readonly",type:"email",value:(t==null?void 0:t.email)??"",readOnly:!0}),s.jsx("span",{className:"ss-auth-visibility-toggle",style:{cursor:"default"},children:s.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"18px"},children:w.lock})})]})]}),s.jsxs("div",{children:[s.jsx("label",{className:"ss-auth-label",children:"Auth Provider"}),s.jsx("input",{className:"ss-auth-input ss-auth-input-readonly",type:"text",value:(t==null?void 0:t.provider)??"",readOnly:!0})]})]}),s.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:s.jsxs("button",{type:"submit",className:"ss-auth-btn-primary ss-auth-btn-sm",disabled:u,style:{width:"auto"},children:[u&&s.jsx("span",{className:"ss-auth-spinner"}),"Save changes"]})})]})]}),fs&&s.jsxs("div",{className:"ss-auth-settings-card",children:[s.jsxs("h4",{children:[s.jsx("span",{className:"material-symbols-outlined",children:w.security}),"Security Credentials"]}),O&&s.jsxs("div",{className:"ss-auth-error",style:{marginBottom:"16px"},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.errorOutline}),s.jsx("span",{children:O})]}),s.jsxs("form",{onSubmit:q,children:[s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",children:"Current Password"}),s.jsx("input",{className:"ss-auth-input",type:"password",placeholder:"••••••••••••",value:C,onChange:D=>P(D.target.value),required:!0})]}),s.jsxs("div",{className:"ss-auth-profile-grid",style:{marginBottom:"16px"},children:[s.jsxs("div",{children:[s.jsx("label",{className:"ss-auth-label",children:"New Password"}),s.jsx("input",{className:"ss-auth-input",type:"password",placeholder:"Min. 8 characters",value:E,onChange:D=>F(D.target.value),required:!0})]}),s.jsxs("div",{children:[s.jsx("label",{className:"ss-auth-label",children:"Confirm New Password"}),s.jsx("input",{className:"ss-auth-input",type:"password",placeholder:"Repeat new password",value:m,onChange:D=>j(D.target.value),required:!0})]})]}),s.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:s.jsx("button",{type:"submit",className:"ss-auth-btn-ghost",disabled:u,children:"Update Security"})})]})]}),s.jsxs("div",{className:"ss-auth-settings-card ss-auth-settings-danger",children:[s.jsx("h4",{children:"Danger Zone"}),s.jsx("p",{className:"ss-auth-section-desc",style:{marginBottom:"16px"},children:"Deleting your account is permanent. All organizations you own will also be deleted."}),y&&s.jsxs("div",{className:"ss-auth-error",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.errorOutline}),s.jsx("span",{children:y})]}),T?s.jsxs("div",{children:[s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",children:"Type your email to confirm"}),s.jsx("input",{className:"ss-auth-input",type:"email",placeholder:t==null?void 0:t.email,value:S,onChange:D=>L(D.target.value),autoFocus:!0})]}),s.jsxs("div",{style:{display:"flex",gap:"8px",justifyContent:"flex-end"},children:[s.jsx("button",{type:"button",className:"ss-auth-btn-ghost",onClick:()=>{I(!1),L(""),f(null)},children:"Cancel"}),s.jsxs("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",style:{width:"auto",background:"linear-gradient(135deg, #ef4444, #dc2626)"},disabled:!bs||h,onClick:ms,children:[h&&s.jsx("span",{className:"ss-auth-spinner"}),"Delete account"]})]})]}):s.jsx("button",{type:"button",className:"ss-auth-btn-outline",style:{borderColor:"currentColor",width:"auto"},onClick:()=>I(!0),children:"Delete my account"})]}),N&&s.jsx(ns,{onUpload:G,onClose:()=>g(!1),isLoading:u})]})}function Es({onOrgDeleted:e,onOrgUpdated:t}){const{selectedOrg:a,updateOrg:l,deleteOrg:n,isLoading:u,error:c,setError:d}=H(),[i,o]=r.useState((a==null?void 0:a.name)??""),[x,p]=r.useState(!1),[h,y]=r.useState(!1),[f,b]=r.useState(!1),[$,v]=r.useState(!1),[z,N]=r.useState("");if(r.useEffect(()=>{a&&(o(a.name),b(!1))},[a]),f)return s.jsxs(s.Fragment,{children:[s.jsx("h3",{children:"Organization"}),s.jsxs("div",{className:"ss-auth-settings-card",style:{textAlign:"center",padding:"48px 24px"},children:[s.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"48px",opacity:.4,marginBottom:"16px",display:"block"},children:w.check}),s.jsx("h4",{style:{margin:"0 0 8px"},children:"Organization deleted"}),s.jsx("p",{className:"ss-auth-section-desc",children:"The organization has been permanently deleted."})]})]});if(!a)return s.jsxs(s.Fragment,{children:[s.jsx("h3",{children:"Organization"}),s.jsxs("div",{className:"ss-auth-settings-empty",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.corporateFare}),s.jsx("div",{children:"Select an organization from the user menu to manage its settings."})]})]});const g=async P=>{if(P.preventDefault(),!i.trim())return;p(!0),y(!1);const E=await l(a.id,{name:i.trim()});p(!1),E&&(y(!0),t==null||t())},C=async()=>{await n(a.id)&&(v(!1),b(!0),e==null||e())};return s.jsxs(s.Fragment,{children:[s.jsx("h3",{children:"Organization"}),s.jsxs("div",{className:"ss-auth-settings-card",children:[s.jsxs("h4",{children:[s.jsx("span",{className:"material-symbols-outlined",children:w.corporateFare}),"General"]}),c&&s.jsxs("div",{className:"ss-auth-error",style:{marginBottom:"16px"},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.errorOutline}),s.jsx("span",{children:c})]}),h&&s.jsxs("div",{className:"ss-auth-info-box",style:{marginBottom:"16px"},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.check}),s.jsx("span",{children:"Organization updated"})]}),s.jsxs("form",{onSubmit:g,children:[s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",children:"Organization Name"}),s.jsx("input",{className:"ss-auth-input",type:"text",value:i,onChange:P=>{o(P.target.value),y(!1)}})]}),s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",children:"Slug"}),s.jsx("input",{className:"ss-auth-input ss-auth-input-readonly",type:"text",value:a.slug,readOnly:!0})]}),s.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:s.jsxs("button",{type:"submit",className:"ss-auth-btn-primary ss-auth-btn-sm",disabled:x,style:{width:"auto"},children:[x&&s.jsx("span",{className:"ss-auth-spinner"}),"Save"]})})]})]}),s.jsxs("div",{className:"ss-auth-settings-card ss-auth-settings-danger",children:[s.jsx("h4",{children:"Danger Zone"}),s.jsx("p",{className:"ss-auth-section-desc",style:{marginBottom:"16px"},children:"Deleting this organization is permanent and will remove all members."}),$?s.jsxs("div",{children:[s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",children:"Type the organization name to confirm"}),s.jsx("input",{className:"ss-auth-input",type:"text",placeholder:a.name,value:z,onChange:P=>N(P.target.value),autoFocus:!0})]}),s.jsxs("div",{style:{display:"flex",gap:"8px",justifyContent:"flex-end"},children:[s.jsx("button",{type:"button",className:"ss-auth-btn-ghost",onClick:()=>{v(!1),N("")},children:"Cancel"}),s.jsxs("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",style:{width:"auto",background:"linear-gradient(135deg, #ef4444, #dc2626)"},disabled:z!==a.name||u,onClick:C,children:[u&&s.jsx("span",{className:"ss-auth-spinner"}),"Delete organization"]})]})]}):s.jsx("button",{type:"button",className:"ss-auth-btn-outline",style:{borderColor:"currentColor",width:"auto"},onClick:()=>v(!0),children:"Delete this organization"})]})]})}function Is(){const{selectedOrg:e,members:t,invites:a,isLoading:l,error:n,setError:u,sendInvite:c,refreshInvites:d,revokeInvite:i,updateMemberRole:o,removeMember:x,refreshMembers:p}=H(),[h,y]=r.useState(""),[f,b]=r.useState("member"),[$,v]=r.useState(!1),[z,N]=r.useState(!1),[g,C]=r.useState(null),[P,E]=r.useState(""),[F,m]=r.useState(null);if(r.useEffect(()=>{e&&(p(e.id),d(e.id))},[e,p,d]),!e)return s.jsxs(s.Fragment,{children:[s.jsx("h3",{children:"People"}),s.jsxs("div",{className:"ss-auth-settings-empty",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.group}),s.jsx("div",{children:"Select an organization from the user menu to manage members."})]})]});const j=async S=>{S.preventDefault(),N(!1),await c(e.id,h,f)&&(y(""),b("member"),N(!0),v(!1),d(e.id))},O=async()=>{if(!g)return;await o(e.id,g.userId,P)&&C(null)},k=async()=>{if(!F)return;await x(e.id,F.userId)&&m(null)},T=async S=>{await i(e.id,S)},I=S=>S==="owner"?"ss-auth-role-badge ss-auth-role-badge-owner":S==="admin"?"ss-auth-role-badge ss-auth-role-badge-admin":"ss-auth-role-badge ss-auth-role-badge-member";return s.jsxs(s.Fragment,{children:[s.jsx("h3",{children:"People"}),n&&s.jsxs("div",{className:"ss-auth-error",style:{marginBottom:"16px"},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.errorOutline}),s.jsx("span",{children:n})]}),z&&s.jsxs("div",{className:"ss-auth-info-box",style:{marginBottom:"16px"},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.check}),s.jsx("span",{children:"Invitation sent"})]}),s.jsxs("div",{className:"ss-auth-settings-card",children:[s.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:"16px"},children:[s.jsxs("h4",{style:{margin:0},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.group}),"Members"]}),s.jsxs("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",style:{width:"auto"},onClick:()=>v(!$),children:[s.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"16px"},children:w.add}),"Invite"]})]}),$&&s.jsx("form",{onSubmit:j,style:{marginBottom:"16px",padding:"16px",background:"rgba(0,0,0,0.05)",borderRadius:"8px"},children:s.jsxs("div",{style:{display:"flex",gap:"8px",alignItems:"flex-end"},children:[s.jsxs("div",{style:{flex:1},children:[s.jsx("label",{className:"ss-auth-label",children:"Email"}),s.jsx("input",{className:"ss-auth-input",type:"email",placeholder:"member@example.com",value:h,onChange:S=>y(S.target.value),required:!0})]}),s.jsxs("div",{style:{width:"120px"},children:[s.jsx("label",{className:"ss-auth-label",children:"Role"}),s.jsxs("select",{className:"ss-auth-input",value:f,onChange:S=>b(S.target.value),style:{cursor:"pointer"},children:[s.jsx("option",{value:"admin",children:"Admin"}),s.jsx("option",{value:"member",children:"Member"})]})]}),s.jsx("button",{type:"submit",className:"ss-auth-btn-primary ss-auth-btn-sm",disabled:l,style:{width:"auto",marginBottom:"0"},children:"Send"})]})}),t.length===0?s.jsx("div",{className:"ss-auth-settings-empty",style:{padding:"20px"},children:s.jsx("div",{children:"No members yet."})}):s.jsxs("table",{className:"ss-auth-settings-table",children:[s.jsx("thead",{children:s.jsxs("tr",{children:[s.jsx("th",{children:"Email"}),s.jsx("th",{children:"Role"}),s.jsx("th",{style:{width:"80px"},children:"Actions"})]})}),s.jsx("tbody",{children:t.map(S=>s.jsxs("tr",{children:[s.jsx("td",{children:S.email}),s.jsx("td",{children:s.jsx("span",{className:I(S.role),children:S.role})}),s.jsx("td",{children:S.role==="owner"?s.jsx("span",{style:{fontSize:"12px",opacity:.4},children:"—"}):s.jsxs("div",{className:"ss-auth-settings-actions",children:[s.jsx("button",{type:"button",className:"ss-auth-icon-btn",title:"Edit role",onClick:()=>{C(S),E(S.role)},children:s.jsx("span",{className:"material-symbols-outlined",children:w.edit})}),s.jsx("button",{type:"button",className:"ss-auth-icon-btn ss-auth-icon-btn-danger",title:"Remove member",onClick:()=>m(S),children:s.jsx("span",{className:"material-symbols-outlined",children:w.personRemove})})]})})]},S.userId))})]})]}),a.length>0&&s.jsxs("div",{className:"ss-auth-settings-card",children:[s.jsxs("h4",{children:[s.jsx("span",{className:"material-symbols-outlined",children:w.send}),"Pending Invites"]}),s.jsxs("table",{className:"ss-auth-settings-table",children:[s.jsx("thead",{children:s.jsxs("tr",{children:[s.jsx("th",{children:"Email"}),s.jsx("th",{children:"Role"}),s.jsx("th",{style:{width:"80px"},children:"Actions"})]})}),s.jsx("tbody",{children:a.map(S=>s.jsxs("tr",{children:[s.jsx("td",{children:S.email}),s.jsx("td",{children:s.jsx("span",{className:I(S.role),children:S.role})}),s.jsx("td",{children:s.jsx("button",{type:"button",className:"ss-auth-icon-btn ss-auth-icon-btn-danger",title:"Revoke invite",onClick:()=>T(S.id),children:s.jsx("span",{className:"material-symbols-outlined",children:w.close})})})]},S.id))})]})]}),g&&s.jsx("div",{className:"ss-auth-modal-overlay",onClick:S=>{S.target===S.currentTarget&&C(null)},children:s.jsxs("div",{className:"ss-auth-modal",style:{maxWidth:"400px"},children:[s.jsxs("div",{className:"ss-auth-modal-header",children:[s.jsx("h2",{children:"Edit Role"}),s.jsx("button",{type:"button",className:"ss-auth-modal-close",onClick:()=>C(null),children:s.jsx("span",{className:"material-symbols-outlined",children:w.close})})]}),s.jsxs("div",{className:"ss-auth-modal-body",children:[s.jsxs("p",{style:{fontSize:"14px",marginBottom:"16px",margin:"0 0 16px 0"},children:["Change role for ",s.jsx("strong",{children:g.email})]}),s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",children:"Role"}),s.jsxs("select",{className:"ss-auth-input",value:P,onChange:S=>E(S.target.value),style:{cursor:"pointer"},children:[s.jsx("option",{value:"admin",children:"Admin"}),s.jsx("option",{value:"member",children:"Member"})]})]}),s.jsxs("div",{style:{display:"flex",gap:"8px",justifyContent:"flex-end"},children:[s.jsx("button",{type:"button",className:"ss-auth-btn-ghost",onClick:()=>C(null),children:"Cancel"}),s.jsx("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",style:{width:"auto"},onClick:O,children:"Save"})]})]})]})}),F&&s.jsx("div",{className:"ss-auth-modal-overlay",onClick:S=>{S.target===S.currentTarget&&m(null)},children:s.jsxs("div",{className:"ss-auth-modal",style:{maxWidth:"400px"},children:[s.jsxs("div",{className:"ss-auth-modal-header",children:[s.jsx("h2",{children:"Remove Member"}),s.jsx("button",{type:"button",className:"ss-auth-modal-close",onClick:()=>m(null),children:s.jsx("span",{className:"material-symbols-outlined",children:w.close})})]}),s.jsxs("div",{className:"ss-auth-modal-body",children:[s.jsxs("p",{style:{fontSize:"14px",margin:"0 0 16px 0"},children:["Are you sure you want to remove ",s.jsx("strong",{children:F.email})," from the organization?"]}),s.jsxs("div",{style:{display:"flex",gap:"8px",justifyContent:"flex-end"},children:[s.jsx("button",{type:"button",className:"ss-auth-btn-ghost",onClick:()=>m(null),children:"Cancel"}),s.jsx("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",style:{width:"auto",background:"linear-gradient(135deg, #ef4444, #dc2626)"},onClick:k,children:"Remove"})]})]})]})})]})}function Fs(){const{selectedOrg:e}=H();return e?s.jsxs(s.Fragment,{children:[s.jsx("h3",{children:"Billing"}),s.jsxs("div",{className:"ss-auth-settings-card",children:[s.jsxs("h4",{children:[s.jsx("span",{className:"material-symbols-outlined",children:w.creditCard}),"Plan & Billing"]}),s.jsx("div",{className:"ss-auth-settings-empty",style:{padding:"20px"},children:s.jsx("div",{children:"No billing plan configured for this organization."})})]})]}):s.jsxs(s.Fragment,{children:[s.jsx("h3",{children:"Billing"}),s.jsxs("div",{className:"ss-auth-settings-empty",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.creditCard}),s.jsx("div",{children:"Select an organization from the user menu to manage billing."})]})]})}function Bs({appearance:e,afterSignOutUrl:t,afterDeleteAccountUrl:a,showOrgSwitcher:l=!0,onOrgChange:n,onOrgSettingsClick:u}){const{appearance:c}=B(),{user:d,signOut:i}=W(),o=e??c,[x,p]=r.useState(!1),[h,y]=r.useState(!1),[f,b]=r.useState(""),[$,v]=r.useState(null),[z,N]=r.useState(!1),g=r.useRef(null),{orgs:C,selectedOrg:P,selectOrg:E,createOrg:F,refresh:m}=H(),j=r.useCallback(k=>{g.current&&!k.composedPath().includes(g.current)&&p(!1)},[]);r.useEffect(()=>{if(x){const k=setTimeout(()=>{document.addEventListener("click",j)},0);return()=>{clearTimeout(k),document.removeEventListener("click",j)}}},[x,j]);const O=r.useCallback(async k=>{k.preventDefault(),v(null),N(!0);const T=f.toLowerCase().replace(/[^a-z0-9]+/g,"-").replace(/^-|-$/g,"");try{const I=await F(f,T);I&&(await E(I.id),n==null||n(I),b(""),p(!1))}catch(I){v(I instanceof Error?I.message:"Failed to create organization")}finally{N(!1)}},[f,F,E,n]);return d?s.jsx(M,{appearance:o,children:s.jsxs("div",{style:{position:"relative",display:"inline-block"},ref:g,children:[s.jsxs("button",{type:"button",className:"ss-auth-user-trigger",onClick:()=>p(!x),"aria-label":"User menu",children:[s.jsx("span",{className:"ss-auth-avatar-trigger",children:d.avatarUrl?s.jsx("img",{src:d.avatarUrl,alt:""}):s.jsx("div",{style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",fontSize:"16px",fontWeight:700},children:(d.name||d.email).charAt(0).toUpperCase()})}),P&&s.jsx("span",{className:"ss-auth-trigger-org-name",children:P.name})]}),x&&s.jsxs("div",{className:"ss-auth-dropdown ss-auth-glass-panel",style:{minWidth:"320px"},children:[s.jsxs("div",{className:"ss-auth-dropdown-header",children:[s.jsx("div",{className:"ss-auth-dropdown-avatar",children:d.avatarUrl?s.jsx("img",{src:d.avatarUrl,alt:""}):s.jsx("div",{style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",fontSize:"20px",fontWeight:800},children:(d.name||d.email).charAt(0).toUpperCase()})}),s.jsxs("div",{children:[d.name&&s.jsx("div",{className:"ss-auth-dropdown-name",children:d.name}),s.jsx("div",{className:"ss-auth-dropdown-email",children:d.email})]})]}),s.jsx("div",{style:{padding:"4px 8px"},children:s.jsxs("button",{type:"button",className:"ss-auth-dropdown-action",onClick:()=>{p(!1),y(!0)},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.settings}),"Settings"]})}),l&&s.jsxs(s.Fragment,{children:[s.jsx("div",{className:"ss-auth-section-label",children:"Organizations"}),s.jsx("div",{style:{padding:"0 8px 4px"},children:C.map(k=>{const T=(P==null?void 0:P.id)===k.id,I=k.name.split(" ").map(S=>S[0]).join("").slice(0,2).toUpperCase();return s.jsxs("button",{type:"button",className:`ss-auth-org-item${T?" ss-auth-org-item-active":""}`,onClick:async()=>{p(!1),await E(k.id),n==null||n(k)},children:[s.jsxs("div",{className:"ss-auth-org-item-inner",children:[s.jsx("div",{className:`ss-auth-org-avatar${T?"":" ss-auth-org-avatar-inactive"}`,children:I}),s.jsx("span",{style:{fontFamily:"'Manrope', sans-serif",letterSpacing:"-0.01em"},children:k.name}),k.planName&&s.jsx("span",{className:"ss-auth-plan-badge",children:k.planName})]}),T&&s.jsx("span",{className:"material-symbols-outlined ss-auth-org-check",style:{fontSize:"18px"},children:w.checkCircle})]},k.id)})}),s.jsxs("div",{className:"ss-auth-inline-create",children:[$&&s.jsx("div",{className:"ss-auth-error",style:{marginBottom:"8px",fontSize:"12px"},children:s.jsx("span",{children:$})}),s.jsx("form",{onSubmit:O,children:s.jsxs("div",{className:"ss-auth-inline-create-input",children:[s.jsx("input",{className:"ss-auth-input",type:"text",placeholder:"New organization name",value:f,onChange:k=>b(k.target.value),required:!0,style:{fontSize:"13px",padding:"10px 40px 10px 12px"}}),s.jsx("button",{type:"submit",className:"ss-auth-inline-create-btn",disabled:z||!f.trim(),children:s.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"20px"},children:w.add})})]})})]}),P&&u&&s.jsx("div",{style:{padding:"0 8px 4px"},children:s.jsxs("button",{type:"button",className:"ss-auth-dropdown-action",onClick:()=>{p(!1),u(P)},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.corporateFare}),"Org settings"]})})]}),s.jsx("div",{className:"ss-auth-signout-section",style:{padding:"8px"},children:s.jsxs("button",{type:"button",className:"ss-auth-dropdown-action",onClick:async()=>{p(!1),await i(),t&&(window.location.href=t)},style:{color:"inherit"},children:[s.jsx("span",{className:"material-symbols-outlined",style:{color:"inherit"},children:w.logout}),"Sign out"]})})]}),h&&s.jsx(os,{onClose:()=>y(!1),afterDeleteAccountUrl:a,onOrgDeleted:m,onOrgUpdated:m})]})}):null}function Ls({appearance:e}){const{appearance:t}=B(),{user:a,signOut:l}=W(),{updateProfile:n,uploadAvatar:u,changePassword:c,isLoading:d,error:i,success:o,setError:x,setSuccess:p}=X(),h=e??t,[y,f]=r.useState((a==null?void 0:a.name)??""),[b,$]=r.useState((a==null?void 0:a.avatarUrl)??""),[v,z]=r.useState(!1),[N,g]=r.useState(""),[C,P]=r.useState(""),[E,F]=r.useState(""),[m,j]=r.useState(null),O=r.useCallback(async L=>{L.preventDefault(),x(null),p(null),await n({name:y,avatarUrl:b||void 0})},[y,b,n,x,p]),k=r.useCallback(async L=>{const V=await u(L);V&&($(V.avatarUrl),z(!1))},[u]),T=r.useCallback(async L=>{if(L.preventDefault(),j(null),x(null),p(null),C!==E){j("Passwords do not match");return}if(C.length<8){j("Password must be at least 8 characters");return}await c(N,C)&&(g(""),P(""),F(""))},[N,C,E,c,x,p]);if(!a)return null;const I=a.provider==="email",S=(a.name||a.email).charAt(0).toUpperCase();return s.jsx(M,{appearance:h,children:s.jsxs("div",{className:"ss-auth-card",style:{maxWidth:"640px"},children:[s.jsxs("div",{className:"ss-auth-profile-header",children:[s.jsxs("div",{className:"ss-auth-avatar-lg",onClick:()=>z(!0),children:[b?s.jsx("img",{src:b,alt:""}):s.jsx("div",{style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",fontSize:"48px",fontWeight:800,opacity:.4},children:S}),s.jsxs("div",{className:"ss-auth-avatar-overlay",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.camera}),s.jsx("span",{children:"Edit"})]})]}),s.jsxs("div",{className:"ss-auth-profile-info",children:[s.jsxs("h2",{className:"ss-auth-profile-name",children:[a.name||"Unnamed User",a.emailVerified&&s.jsxs("span",{className:"ss-auth-badge ss-auth-badge-success",children:[s.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"12px",fontVariationSettings:"'FILL' 1"},children:w.verified}),"Verified"]})]}),s.jsx("p",{className:"ss-auth-profile-desc",children:a.email})]})]}),s.jsxs("div",{className:"ss-auth-card-body",children:[i&&s.jsxs("div",{className:"ss-auth-error",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.errorOutline}),s.jsx("span",{children:i})]}),o&&s.jsxs("div",{className:"ss-auth-info-box",style:{marginBottom:"16px"},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.check}),s.jsx("span",{children:o})]}),s.jsxs("form",{onSubmit:O,children:[s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",children:"Full Name"}),s.jsx("input",{className:"ss-auth-input",type:"text",placeholder:"Your name",value:y,onChange:L=>f(L.target.value)})]}),s.jsxs("div",{className:"ss-auth-profile-grid",style:{marginBottom:"16px"},children:[s.jsxs("div",{children:[s.jsx("label",{className:"ss-auth-label",children:"Email Address"}),s.jsxs("div",{style:{position:"relative"},children:[s.jsx("input",{className:"ss-auth-input ss-auth-input-readonly",type:"email",value:a.email,readOnly:!0}),s.jsx("span",{className:"ss-auth-visibility-toggle",style:{cursor:"default"},children:s.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"18px"},children:w.lock})})]})]}),s.jsxs("div",{children:[s.jsx("label",{className:"ss-auth-label",children:"Auth Provider"}),s.jsxs("div",{style:{position:"relative"},children:[s.jsx("input",{className:"ss-auth-input ss-auth-input-readonly",type:"text",value:a.provider,readOnly:!0}),s.jsx("span",{className:"ss-auth-visibility-toggle",style:{cursor:"default"},children:s.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"18px"},children:w.cloudDone})})]})]})]}),s.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:s.jsxs("button",{type:"submit",className:"ss-auth-btn-primary ss-auth-btn-sm",disabled:d,style:{width:"auto"},children:[d&&s.jsx("span",{className:"ss-auth-spinner"}),"Save changes"]})})]}),I&&s.jsxs("div",{className:"ss-auth-section",children:[s.jsxs("div",{className:"ss-auth-section-title",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.security}),"Security Credentials"]}),s.jsx("p",{className:"ss-auth-section-desc",style:{marginBottom:"24px"},children:"Update your password to keep your account secure."}),m&&s.jsxs("div",{className:"ss-auth-error",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.errorOutline}),s.jsx("span",{children:m})]}),s.jsxs("form",{onSubmit:T,children:[s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",children:"Current Password"}),s.jsx("input",{className:"ss-auth-input",type:"password",placeholder:"••••••••••••",value:N,onChange:L=>g(L.target.value),required:!0})]}),s.jsxs("div",{className:"ss-auth-profile-grid",style:{marginBottom:"16px"},children:[s.jsxs("div",{children:[s.jsx("label",{className:"ss-auth-label",children:"New Password"}),s.jsx("input",{className:"ss-auth-input",type:"password",placeholder:"Min. 8 characters",value:C,onChange:L=>P(L.target.value),required:!0})]}),s.jsxs("div",{children:[s.jsx("label",{className:"ss-auth-label",children:"Confirm New Password"}),s.jsx("input",{className:"ss-auth-input",type:"password",placeholder:"Repeat new password",value:E,onChange:L=>F(L.target.value),required:!0})]})]}),s.jsxs("div",{className:"ss-auth-info-box",style:{marginBottom:"16px"},children:[s.jsx("span",{className:"material-symbols-outlined",children:w.info}),s.jsx("span",{children:"Password must be at least 8 characters long."})]}),s.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:s.jsx("button",{type:"submit",className:"ss-auth-btn-ghost",disabled:d,children:"Update Security"})})]})]}),s.jsx("div",{className:"ss-auth-section",style:{borderTop:"none",paddingTop:0,marginTop:"24px"},children:s.jsx("div",{className:"ss-auth-signout-section",style:{borderRadius:"12px",padding:"16px 20px"},children:s.jsxs("div",{className:"ss-auth-signout-row",children:[s.jsxs("div",{className:"ss-auth-signout-info",children:[s.jsx("div",{className:"ss-auth-signout-icon",children:s.jsx("span",{className:"material-symbols-outlined",children:w.logout})}),s.jsxs("div",{children:[s.jsx("div",{className:"ss-auth-signout-title",children:"End Session"}),s.jsx("div",{className:"ss-auth-signout-desc",children:"Terminate your active session"})]})]}),s.jsx("button",{type:"button",className:"ss-auth-btn-outline",onClick:()=>l(),style:{width:"auto",flexShrink:0},children:"Sign out"})]})})})]}),v&&s.jsx(ns,{onUpload:k,onClose:()=>z(!1),isLoading:d})]})})}function Ts({appearance:e,onOrgChange:t}){const{appearance:a}=B(),{orgs:l,selectedOrg:n,selectOrg:u,createOrg:c,isLoading:d}=H(),i=e??a,[o,x]=r.useState(!1),[p,h]=r.useState(""),[y,f]=r.useState(""),[b,$]=r.useState(null),[v,z]=r.useState(!1),N=r.useRef(null),g=r.useCallback(m=>{N.current&&!m.composedPath().includes(N.current)&&x(!1)},[]);r.useEffect(()=>{if(o){const m=setTimeout(()=>{document.addEventListener("click",g)},0);return()=>{clearTimeout(m),document.removeEventListener("click",g)}}},[o,g]);const C=r.useCallback(m=>{h(m),f(m.toLowerCase().replace(/[^a-z0-9]+/g,"-").replace(/^-|-$/g,""))},[]),P=r.useCallback(async m=>{m.preventDefault(),$(null),z(!0);try{const j=await c(p,y);j&&(await u(j.id),t==null||t(j),h(""),f(""),x(!1))}catch(j){$(j instanceof Error?j.message:"Failed to create organization")}finally{z(!1)}},[p,y,c,u,t]);if(d)return null;const E=(n==null?void 0:n.name)??(l.length===0?"No organization":"Select organization"),F=n?n.name.split(" ").map(m=>m[0]).join("").slice(0,2).toUpperCase():"--";return s.jsx(M,{appearance:i,children:s.jsxs("div",{style:{position:"relative",display:"inline-block",width:"100%",maxWidth:"360px"},ref:N,children:[s.jsxs("button",{type:"button",className:"ss-auth-org-trigger",onClick:()=>x(!o),children:[s.jsxs("div",{className:"ss-auth-org-trigger-inner",children:[s.jsx("div",{className:"ss-auth-org-avatar",children:F}),s.jsxs("div",{style:{textAlign:"left"},children:[s.jsx("div",{className:"ss-auth-org-trigger-label",children:"Current Organization"}),s.jsx("div",{className:"ss-auth-org-trigger-name",children:E})]})]}),s.jsx("span",{className:"material-symbols-outlined",children:w.unfoldMore})]}),o&&s.jsxs("div",{className:"ss-auth-dropdown ss-auth-dropdown-left ss-auth-glass-panel",style:{width:"100%"},children:[s.jsx("div",{className:"ss-auth-section-label",children:"Your Organizations"}),s.jsx("div",{style:{padding:"0 8px 4px"},children:l.map(m=>{const j=(n==null?void 0:n.id)===m.id,O=m.name.split(" ").map(k=>k[0]).join("").slice(0,2).toUpperCase();return s.jsxs("button",{type:"button",className:`ss-auth-org-item${j?" ss-auth-org-item-active":""}`,onClick:async()=>{x(!1),await u(m.id),t==null||t(m)},children:[s.jsxs("div",{className:"ss-auth-org-item-inner",children:[s.jsx("div",{className:`ss-auth-org-avatar${j?"":" ss-auth-org-avatar-inactive"}`,children:O}),s.jsx("span",{style:{fontFamily:"'Manrope', sans-serif",letterSpacing:"-0.01em"},children:m.name})]}),j&&s.jsx("span",{className:"material-symbols-outlined ss-auth-org-check",style:{fontSize:"18px"},children:w.checkCircle})]},m.id)})}),s.jsxs("div",{className:"ss-auth-org-create",children:[s.jsxs("div",{className:"ss-auth-org-create-header",children:[s.jsx("span",{className:"material-symbols-outlined",children:w.addCircle}),s.jsx("span",{children:"Create organization"})]}),b&&s.jsx("div",{className:"ss-auth-error",style:{marginBottom:"12px",fontSize:"12px"},children:s.jsx("span",{children:b})}),s.jsxs("form",{onSubmit:P,children:[s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",style:{fontSize:"10px"},children:"Org Name"}),s.jsx("input",{className:"ss-auth-input",type:"text",placeholder:"e.g. Nexus Dynamics",value:p,onChange:m=>C(m.target.value),required:!0,style:{fontSize:"13px",padding:"10px 12px"}})]}),s.jsxs("div",{className:"ss-auth-field",children:[s.jsx("label",{className:"ss-auth-label",style:{fontSize:"10px"},children:"Workspace Slug"}),s.jsxs("div",{style:{position:"relative"},children:[s.jsx("span",{className:"ss-auth-org-slug-prefix",children:"/"}),s.jsx("input",{className:"ss-auth-input",type:"text",placeholder:"nexus-dynamics",value:y,onChange:m=>f(m.target.value),required:!0,style:{fontSize:"13px",padding:"10px 12px 10px 22px"}})]})]}),s.jsxs("button",{type:"submit",className:"ss-auth-btn-primary",disabled:v||!p.trim(),style:{marginTop:"8px"},children:[v&&s.jsx("span",{className:"ss-auth-spinner"}),"Initialize Organization"]})]})]})]})]})})}function As(e,t="USD"){return new Intl.NumberFormat("en-US",{style:"currency",currency:t,minimumFractionDigits:e%100===0?0:2}).format(e/100)}function Ds({plans:e,currentPlanId:t,onSelectPlan:a,interval:l,appearance:n}){const{appearance:u}=B(),c=n??u,d=l?e.filter(i=>i.interval===l||i.isFree):e;return s.jsx(M,{appearance:c,children:s.jsx("div",{className:"ss-pricing-grid",children:d.map(i=>{const o=i.id===t;return s.jsxs("div",{className:`ss-pricing-card ${o?"ss-pricing-card-current":""}`,children:[s.jsxs("div",{className:"ss-pricing-header",children:[s.jsx("h3",{className:"ss-pricing-name",children:i.name}),i.trialDays>0&&s.jsxs("span",{className:"ss-badge ss-badge-trialing",children:[i.trialDays,"-day trial"]}),i.isFree&&s.jsx("span",{className:"ss-badge ss-badge-active",children:"Free"})]}),s.jsx("div",{className:"ss-pricing-price",children:i.isFree?s.jsx("span",{className:"ss-pricing-amount",children:"Free"}):s.jsxs(s.Fragment,{children:[s.jsx("span",{className:"ss-pricing-amount",children:As(i.amountCents,i.currency)}),s.jsxs("span",{className:"ss-pricing-interval",children:["/",i.interval]})]})}),i.description&&s.jsx("p",{className:"ss-pricing-desc",children:i.description}),i.features.length>0&&s.jsx("ul",{className:"ss-pricing-features",children:i.features.map((x,p)=>s.jsxs("li",{className:"ss-pricing-feature",children:[s.jsx("span",{className:"ss-check",children:"✓"})," ",x]},p))}),s.jsx("button",{type:"button",className:`ss-btn ${o?"ss-btn-current":"ss-btn-primary"}`,disabled:o,onClick:()=>a(i.id),children:o?"Current plan":"Select plan"})]},i.id)})})})}function Ms(){const{client:e}=B();return{billing:e.billing}}function _(e){const{client:t}=B();return r.useMemo(()=>{if(e){const a=new R.Transport("https://api.saas-support.com/v1",{type:"portalToken",token:e});return new R.BillingClient(a)}return t.billing},[t,e])}function is(e,t){const a=_(t),[l,n]=r.useState(null),[u,c]=r.useState(!0),[d,i]=r.useState(null),o=r.useCallback(async()=>{c(!0),i(null);try{const x=await a.getCustomer(e);n(x)}catch(x){i(x instanceof Error?x.message:"Failed to load subscription")}finally{c(!1)}},[a,e]);return r.useEffect(()=>{o()},[o]),{customer:l,isLoading:u,error:d,refresh:o}}function ls(e,t){const a=_(t),[l,n]=r.useState([]),[u,c]=r.useState(!0),[d,i]=r.useState(null),o=r.useCallback(async()=>{c(!0),i(null);try{const x=await a.getInvoices(e);n(x)}catch(x){i(x instanceof Error?x.message:"Failed to load invoices")}finally{c(!1)}},[a,e]);return r.useEffect(()=>{o()},[o]),{invoices:l,isLoading:u,error:d,refresh:o}}function cs(e,t){const a=_(t),[l,n]=r.useState([]),[u,c]=r.useState(!0),[d,i]=r.useState(null),o=r.useCallback(async()=>{c(!0),i(null);try{const x=await a.getCurrentUsage(e);n(x)}catch(x){i(x instanceof Error?x.message:"Failed to load usage")}finally{c(!1)}},[a,e]);return r.useEffect(()=>{o()},[o]),{usage:l,isLoading:u,error:d,refresh:o}}const Rs={active:"ss-badge-active"};function ds({customerId:e,portalToken:t,onChangePlan:a,onCancel:l,appearance:n}){const{appearance:u}=B(),{customer:c,isLoading:d,error:i}=is(e,t),o=n??u;return s.jsx(M,{appearance:o,children:s.jsxs("div",{className:"ss-card",children:[s.jsx("h2",{className:"ss-title",children:"Subscription"}),d&&s.jsxs("div",{className:"ss-loading",children:[s.jsx("span",{className:"ss-spinner"})," Loading..."]}),i&&s.jsx("div",{className:"ss-global-error",children:i}),c&&!d&&s.jsxs(s.Fragment,{children:[s.jsxs("div",{className:"ss-field",children:[s.jsx("label",{className:"ss-label",children:"Customer"}),s.jsx("input",{className:"ss-input",value:c.name||c.email,disabled:!0,readOnly:!0})]}),s.jsxs("div",{className:"ss-field",children:[s.jsx("label",{className:"ss-label",children:"Status"}),s.jsx("div",{children:s.jsx("span",{className:`ss-badge ${Rs.active}`,children:"Active"})})]}),s.jsxs("div",{className:"ss-btn-group",children:[a&&s.jsx("button",{type:"button",className:"ss-btn ss-btn-primary",onClick:a,children:"Change plan"}),l&&s.jsx("button",{type:"button",className:"ss-btn ss-btn-danger",onClick:l,children:"Cancel subscription"})]})]})]})})}const Us={paid:"ss-badge-active",open:"ss-badge-trialing",draft:"ss-badge-paused",void:"ss-badge-canceled",uncollectible:"ss-badge-past-due"};function Vs(e){return new Date(e).toLocaleDateString("en-US",{year:"numeric",month:"short",day:"numeric"})}function Hs(e){return new Intl.NumberFormat("en-US",{style:"currency",currency:"USD",minimumFractionDigits:2}).format(e/100)}function us({customerId:e,portalToken:t,appearance:a}){const{appearance:l}=B(),{invoices:n,isLoading:u,error:c}=ls(e,t),d=a??l,i=[...n].sort((o,x)=>new Date(x.createdAt).getTime()-new Date(o.createdAt).getTime());return s.jsx(M,{appearance:d,children:s.jsxs("div",{className:"ss-card ss-card-wide",children:[s.jsx("h2",{className:"ss-title",children:"Invoices"}),u&&s.jsxs("div",{className:"ss-loading",children:[s.jsx("span",{className:"ss-spinner"})," Loading..."]}),c&&s.jsx("div",{className:"ss-global-error",children:c}),!u&&i.length===0&&s.jsx("p",{className:"ss-empty",children:"No invoices yet."}),!u&&i.length>0&&s.jsxs("table",{className:"ss-table",children:[s.jsx("thead",{children:s.jsxs("tr",{children:[s.jsx("th",{className:"ss-th",children:"Date"}),s.jsx("th",{className:"ss-th",children:"Amount"}),s.jsx("th",{className:"ss-th",children:"Status"}),s.jsx("th",{className:"ss-th",children:"PDF"})]})}),s.jsx("tbody",{children:i.map(o=>s.jsxs("tr",{className:"ss-tr",children:[s.jsx("td",{className:"ss-td",children:Vs(o.createdAt)}),s.jsx("td",{className:"ss-td",children:Hs(o.amountCents)}),s.jsx("td",{className:"ss-td",children:s.jsx("span",{className:`ss-badge ${Us[o.status]||""}`,children:o.status})}),s.jsx("td",{className:"ss-td",children:o.pdfUrl?s.jsx("a",{className:"ss-link",href:o.pdfUrl,target:"_blank",rel:"noopener noreferrer",children:"Download"}):"—"})]},o.id))})]})]})})}function ps({customerId:e,limits:t,portalToken:a,appearance:l}){const{appearance:n}=B(),{usage:u,isLoading:c,error:d}=cs(e,a),i=l??n;return s.jsx(M,{appearance:i,children:s.jsxs("div",{className:"ss-card",children:[s.jsx("h2",{className:"ss-title",children:"Usage"}),c&&s.jsxs("div",{className:"ss-loading",children:[s.jsx("span",{className:"ss-spinner"})," Loading..."]}),d&&s.jsx("div",{className:"ss-global-error",children:d}),!c&&u.length===0&&s.jsx("p",{className:"ss-empty",children:"No usage data."}),!c&&u.map(o=>{const x=t==null?void 0:t[o.metric],p=x?Math.min(100,o.total/x*100):null;return s.jsxs("div",{className:"ss-usage-item",children:[s.jsxs("div",{className:"ss-usage-header",children:[s.jsx("span",{className:"ss-usage-metric",children:o.metric}),s.jsxs("span",{className:"ss-usage-value",children:[o.total.toLocaleString(),x?` / ${x.toLocaleString()}`:""]})]}),p!==null&&s.jsx("div",{className:"ss-progress-bar",children:s.jsx("div",{className:`ss-progress-fill ${p>90?"ss-progress-danger":""}`,style:{width:`${p}%`}})})]},o.metric)})]})})}function qs({customerId:e,portalToken:t,limits:a,onChangePlan:l,onCancel:n,appearance:u}){const{appearance:c}=B(),d=u??c,[i,o]=r.useState("subscription"),x=[{id:"subscription",label:"Subscription"},{id:"invoices",label:"Invoices"},{id:"usage",label:"Usage"}];return s.jsx(M,{appearance:d,children:s.jsxs("div",{className:"ss-card ss-card-wide",children:[s.jsx("h2",{className:"ss-title",children:"Billing"}),s.jsx("div",{className:"ss-tab-group",children:x.map(p=>s.jsx("button",{type:"button",className:`ss-tab ${i===p.id?"ss-tab-active":""}`,onClick:()=>o(p.id),children:p.label},p.id))}),s.jsxs("div",{className:"ss-tab-content",children:[i==="subscription"&&s.jsx(ds,{customerId:e,portalToken:t,onChangePlan:l,onCancel:n}),i==="invoices"&&s.jsx(us,{customerId:e,portalToken:t}),i==="usage"&&s.jsx(ps,{customerId:e,portalToken:t,limits:a})]})]})})}function Ws({customerId:e,portalToken:t,onApplied:a,appearance:l}){const{appearance:n}=B(),u=_(t),c=l??n,[d,i]=r.useState(""),[o,x]=r.useState(!1),[p,h]=r.useState(null),[y,f]=r.useState(null),b=r.useCallback(async $=>{if($.preventDefault(),!!d.trim()){x(!0),h(null),f(null);try{const v=await u.applyCoupon(e,d.trim());f(`Coupon applied! ${v.discountType==="percent"?`${v.amount}% off`:`$${(v.amount/100).toFixed(2)} off`}`),i(""),a==null||a(v)}catch(v){h(v instanceof Error?v.message:"Invalid coupon code")}finally{x(!1)}}},[u,e,d,a]);return s.jsx(M,{appearance:c,children:s.jsxs("div",{className:"ss-card",children:[s.jsx("h2",{className:"ss-title",children:"Apply coupon"}),p&&s.jsx("div",{className:"ss-global-error",children:p}),y&&s.jsx("div",{className:"ss-success-msg",children:y}),s.jsxs("form",{onSubmit:b,children:[s.jsxs("div",{className:"ss-field",children:[s.jsx("label",{className:"ss-label",htmlFor:"ss-coupon-code",children:"Coupon code"}),s.jsx("input",{id:"ss-coupon-code",className:"ss-input",type:"text",placeholder:"Enter coupon code",value:d,onChange:$=>i($.target.value),required:!0})]}),s.jsxs("button",{type:"submit",className:"ss-btn ss-btn-primary",disabled:o||!d.trim(),children:[o&&s.jsx("span",{className:"ss-spinner"}),"Apply"]})]})]})})}function _s(){const{client:e}=B();return{report:e.report}}function ss(){const{client:e}=B(),[t,a]=r.useState(null),[l,n]=r.useState(!1),[u,c]=r.useState(null),d=r.useCallback(async i=>{n(!0),c(null);try{const o=await e.report.executeQuery(i);return a(o),o}catch(o){return c(o instanceof Error?o.message:"Query failed"),null}finally{n(!1)}},[e]);return{result:t,execute:d,isLoading:l,error:u}}function hs(e){const{client:t}=B(),[a,l]=r.useState(null),[n,u]=r.useState(!0),[c,d]=r.useState(null),i=r.useCallback(async()=>{u(!0),d(null);try{const o=await t.report.listQueries(e);l(o)}catch(o){d(o instanceof Error?o.message:"Failed to load queries")}finally{u(!1)}},[t,e]);return r.useEffect(()=>{i()},[i]),{queries:(a==null?void 0:a.data)??[],meta:a==null?void 0:a.meta,isLoading:n,error:c,refresh:i}}function Gs(e){const{client:t}=B(),[a,l]=r.useState(null),[n,u]=r.useState(!0),[c,d]=r.useState(null),i=r.useCallback(async()=>{u(!0),d(null);try{const o=await t.report.getDashboard(e);l(o)}catch(o){d(o instanceof Error?o.message:"Failed to load dashboard")}finally{u(!1)}},[t,e]);return r.useEffect(()=>{i()},[i]),{dashboard:a,isLoading:n,error:c,refresh:i}}function Ys(e,t,a="https://api.saas-support.com/v1"){const l=r.useMemo(()=>{const p=new R.Transport(a,{type:"embedToken",token:e});return new R.ReportClient(p)},[e,a]),[n,u]=r.useState(null),[c,d]=r.useState(!0),[i,o]=r.useState(null),x=r.useCallback(async()=>{d(!0),o(null);try{const p=await l.getDashboard(t);u(p)}catch(p){o(p instanceof Error?p.message:"Failed to load dashboard")}finally{d(!1)}},[l,t]);return r.useEffect(()=>{x()},[x]),{dashboard:n,reportClient:l,isLoading:c,error:i,refresh:x}}function Qs({onResult:e,mode:t="both",placeholder:a,appearance:l}){const{appearance:n}=B(),{execute:u,isLoading:c,error:d}=ss(),i=l??n,[o,x]=r.useState(""),[p,h]=r.useState(t==="sql"?"sql":"nl"),y=r.useCallback(async f=>{if(f.preventDefault(),!o.trim())return;const $=await u(p==="sql"?{sql:o}:{naturalLanguage:o});$&&(e==null||e($))},[o,p,u,e]);return s.jsx(M,{appearance:i,children:s.jsxs("div",{className:"ss-card ss-card-wide",children:[t==="both"&&s.jsxs("div",{className:"ss-tab-group ss-tab-group-sm",children:[s.jsx("button",{type:"button",className:`ss-tab ${p==="nl"?"ss-tab-active":""}`,onClick:()=>h("nl"),children:"Natural Language"}),s.jsx("button",{type:"button",className:`ss-tab ${p==="sql"?"ss-tab-active":""}`,onClick:()=>h("sql"),children:"SQL"})]}),d&&s.jsx("div",{className:"ss-global-error",children:d}),s.jsxs("form",{onSubmit:y,children:[s.jsx("div",{className:"ss-field",children:s.jsx("textarea",{className:"ss-input ss-query-textarea",placeholder:a??(p==="sql"?"SELECT ...":"Ask a question about your data..."),value:o,onChange:f=>x(f.target.value),rows:3})}),s.jsxs("button",{type:"submit",className:"ss-btn ss-btn-primary",disabled:c||!o.trim(),children:[c&&s.jsx("span",{className:"ss-spinner"}),"Run query"]})]})]})})}function xs({columns:e,rows:t,sortable:a=!0,maxRows:l,appearance:n}){const{appearance:u}=B(),c=n??u,[d,i]=r.useState(null),[o,x]=r.useState("asc"),p=r.useMemo(()=>d?[...t].sort((b,$)=>{const v=b[d],z=$[d];if(v==null&&z==null)return 0;if(v==null)return 1;if(z==null)return-1;if(typeof v=="number"&&typeof z=="number")return o==="asc"?v-z:z-v;const N=String(v),g=String(z);return o==="asc"?N.localeCompare(g):g.localeCompare(N)}):t,[t,d,o]),h=l?p.slice(0,l):p,y=b=>{a&&(d===b?x($=>$==="asc"?"desc":"asc"):(i(b),x("asc")))};function f(b){return b==null?"":typeof b=="object"?JSON.stringify(b):String(b)}return s.jsx(M,{appearance:c,children:s.jsxs("div",{className:"ss-table-container",children:[s.jsxs("table",{className:"ss-table",children:[s.jsx("thead",{children:s.jsx("tr",{children:e.map(b=>s.jsxs("th",{className:`ss-th ${a?"ss-th-sortable":""} ${d===b?o==="asc"?"ss-sorted-asc":"ss-sorted-desc":""}`,onClick:()=>y(b),children:[b,d===b&&s.jsx("span",{className:"ss-sort-indicator",children:o==="asc"?" ▲":" ▼"})]},b))})}),s.jsx("tbody",{children:h.map((b,$)=>s.jsx("tr",{className:"ss-tr",children:e.map(v=>s.jsx("td",{className:"ss-td",children:f(b[v])},v))},$))})]}),l&&t.length>l&&s.jsxs("div",{className:"ss-table-footer",children:["Showing ",l," of ",t.length," rows"]})]})})}function Js(e,t="#6366f1"){const a=parseInt(t.replace("#","").slice(0,2),16),l=[];for(let n=0;n<e;n++){const u=(a+n*Math.floor(360/Math.max(e,1)))%360;l.push(`hsl(${u}, 65%, 55%)`)}return l}function Zs({labels:e,values:t,w:a,h:l,colors:n}){const u=Math.max(...t,1),c=40,d=a-c*2,i=l-c*2,o=Math.max(1,d/e.length-4);return s.jsxs("g",{children:[s.jsx("line",{x1:c,y1:l-c,x2:a-c,y2:l-c,stroke:"#ccc",strokeWidth:1}),t.map((x,p)=>{const h=x/u*i,y=c+d/e.length*p+2,f=l-c-h;return s.jsxs("g",{children:[s.jsx("rect",{x:y,y:f,width:o,height:h,fill:n[p%n.length],rx:2}),s.jsx("text",{x:y+o/2,y:l-c+14,textAnchor:"middle",fontSize:10,fill:"#666",children:e[p].length>8?e[p].slice(0,8)+"...":e[p]})]},p)})]})}function Ks({labels:e,values:t,w:a,h:l,colors:n}){const u=Math.max(...t,1),c=40,d=a-c*2,i=l-c*2,o=e.length>1?d/(e.length-1):0,x=t.map((p,h)=>{const y=c+o*h,f=l-c-p/u*i;return`${y},${f}`});return s.jsxs("g",{children:[[.25,.5,.75,1].map(p=>{const h=l-c-p*i;return s.jsx("line",{x1:c,y1:h,x2:a-c,y2:h,stroke:"#eee",strokeWidth:1},p)}),s.jsx("polyline",{points:x.join(" "),fill:"none",stroke:n[0],strokeWidth:2}),t.map((p,h)=>{const y=c+o*h,f=l-c-p/u*i;return s.jsx("circle",{cx:y,cy:f,r:4,fill:n[0]},h)})]})}function Xs({labels:e,values:t,w:a,h:l,colors:n}){const u=t.reduce((h,y)=>h+y,0)||1,c=a/2,d=l/2-20,i=Math.min(a,l)/2-40,o=2*Math.PI*i;let x=0;const p=t.map((h,y)=>{const f=h/u,b=f*o,$={dash:b,offset:x,color:n[y%n.length],label:e[y],pct:f};return x+=b,$});return s.jsxs("g",{children:[p.map((h,y)=>s.jsx("circle",{cx:c,cy:d,r:i,fill:"none",stroke:h.color,strokeWidth:i*.6,strokeDasharray:`${h.dash} ${o-h.dash}`,strokeDashoffset:-h.offset,transform:`rotate(-90 ${c} ${d})`},y)),s.jsx("g",{transform:`translate(${c-e.length*30}, ${l-20})`,children:p.slice(0,6).map((h,y)=>s.jsxs("g",{transform:`translate(${y*60}, 0)`,children:[s.jsx("rect",{width:10,height:10,fill:h.color,rx:2}),s.jsx("text",{x:14,y:9,fontSize:9,fill:"#666",children:h.label.length>6?h.label.slice(0,6)+"..":h.label})]},y))})]})}function gs({type:e,data:t,title:a,width:l=400,height:n=300,appearance:u}){const{appearance:c}=B(),d=u??c,i=r.useMemo(()=>Js(t.labels.length),[t.labels.length]);return s.jsx(M,{appearance:d,children:s.jsxs("div",{className:"ss-chart-container",children:[a&&s.jsx("h3",{className:"ss-chart-title",children:a}),s.jsxs("svg",{viewBox:`0 0 ${l} ${n}`,width:"100%",style:{maxWidth:l},children:[e==="bar"&&s.jsx(Zs,{labels:t.labels,values:t.values,w:l,h:n,colors:i}),e==="line"&&s.jsx(Ks,{labels:t.labels,values:t.values,w:l,h:n,colors:i}),e==="pie"&&s.jsx(Xs,{labels:t.labels,values:t.values,w:l,h:n,colors:i})]})]})})}function se({dashboardId:e,embedToken:t,baseUrl:a,refreshInterval:l,appearance:n}){const u=B(),c=n??(u==null?void 0:u.appearance),d=r.useMemo(()=>{if(t){const v=a??"https://api.saas-support.com/v1",z=new R.Transport(v,{type:"embedToken",token:t});return new R.ReportClient(z)}return u.client.report},[t,a,u]),[i,o]=r.useState([]),[x,p]=r.useState({}),[h,y]=r.useState(!0),[f,b]=r.useState(null),$=r.useCallback(async()=>{y(!0),b(null);try{const v=await d.getDashboard(e),z=JSON.parse(v.layoutJson||"[]");o(z);const N={};for(const g of z)try{const C=await d.listQueries({search:g.queryId,perPage:1});if(C.data.length>0&&C.data[0].generatedSql){const P=await d.executeQuery({sql:C.data[0].generatedSql});N[g.queryId]=P}}catch{}p(N)}catch(v){b(v instanceof Error?v.message:"Failed to load dashboard")}finally{y(!1)}},[d,e]);return r.useEffect(()=>{$()},[$]),r.useEffect(()=>{if(!l||l<=0)return;const v=setInterval($,l*1e3);return()=>clearInterval(v)},[l,$]),s.jsx(M,{appearance:c,children:s.jsxs("div",{className:"ss-dashboard-grid",children:[h&&s.jsxs("div",{className:"ss-loading",children:[s.jsx("span",{className:"ss-spinner"})," Loading dashboard..."]}),f&&s.jsx("div",{className:"ss-global-error",children:f}),!h&&i.map((v,z)=>{const N=x[v.queryId];if(!N)return null;const g=N.columns.length>=2?{labels:N.rows.map(C=>String(C[N.columns[0]]??"")),values:N.rows.map(C=>Number(C[N.columns[1]]??0))}:{labels:[],values:[]};return s.jsxs("div",{className:"ss-widget",children:[v.title&&s.jsx("h4",{className:"ss-widget-header",children:v.title}),v.chartType==="table"?s.jsx(xs,{columns:N.columns,rows:N.rows,maxRows:50}):s.jsx(gs,{type:v.chartType||"bar",data:g,width:v.w,height:v.h})]},z)})]})})}function ee(e){return new Date(e).toLocaleDateString("en-US",{year:"numeric",month:"short",day:"numeric"})}function ae({onSelectQuery:e,onRunQuery:t,appearance:a}){const{appearance:l}=B(),{queries:n,isLoading:u,error:c}=hs(),{execute:d,isLoading:i}=ss(),o=a??l,x=r.useCallback(async p=>{if(!p.generatedSql)return;const h=await d({sql:p.generatedSql});h&&(t==null||t(h))},[d,t]);return s.jsx(M,{appearance:o,children:s.jsxs("div",{className:"ss-card ss-card-wide",children:[s.jsx("h2",{className:"ss-title",children:"Saved Queries"}),u&&s.jsxs("div",{className:"ss-loading",children:[s.jsx("span",{className:"ss-spinner"})," Loading..."]}),c&&s.jsx("div",{className:"ss-global-error",children:c}),!u&&n.length===0&&s.jsx("p",{className:"ss-empty",children:"No saved queries."}),!u&&n.map(p=>s.jsxs("div",{className:"ss-saved-query-card",onClick:()=>e==null?void 0:e(p),children:[s.jsxs("div",{className:"ss-saved-query-header",children:[s.jsx("span",{className:"ss-saved-query-name",children:p.name}),p.chartType&&s.jsx("span",{className:"ss-badge",children:p.chartType})]}),p.naturalLanguage&&s.jsx("p",{className:"ss-saved-query-desc",children:p.naturalLanguage}),s.jsxs("div",{className:"ss-saved-query-footer",children:[s.jsx("span",{className:"ss-saved-query-date",children:ee(p.createdAt)}),s.jsx("button",{type:"button",className:"ss-btn ss-btn-sm ss-btn-primary",disabled:i||!p.generatedSql,onClick:h=>{h.stopPropagation(),x(p)},children:i?s.jsx("span",{className:"ss-spinner"}):"Run"})]})]},p.id))]})})}function te({embedToken:e,dashboardId:t,baseUrl:a="https://api.saas-support.com/v1",refreshInterval:l,appearance:n}){const u=r.useMemo(()=>{const b=new R.Transport(a,{type:"embedToken",token:e});return new R.ReportClient(b)},[e,a]),[c,d]=r.useState([]),[i,o]=r.useState(!0),[x,p]=r.useState(null),h=r.useMemo(()=>Q(n),[n]),y=r.useMemo(()=>J(h),[h]),f=r.useCallback(async()=>{o(!0),p(null);try{const b=await u.getDashboard(t),$=JSON.parse(b.layoutJson||"[]"),v=await Promise.all($.map(async z=>{try{const N=await u.listQueries({search:z.queryId,perPage:1});if(N.data.length>0&&N.data[0].generatedSql){const g=await u.executeQuery({sql:N.data[0].generatedSql});return{...z,result:g}}}catch{}return z}));d(v)}catch(b){p(b instanceof Error?b.message:"Failed to load dashboard")}finally{o(!1)}},[u,t]);return r.useEffect(()=>{f()},[f]),r.useEffect(()=>{if(!l||l<=0)return;const b=setInterval(f,l*1e3);return()=>clearInterval(b)},[l,f]),s.jsx("div",{ref:b=>{if(!b||b.shadowRoot)return;const $=b.attachShadow({mode:"open"}),v=document.createElement("style");v.textContent=y,$.appendChild(v);const z=document.createElement("div");$.appendChild(z)},style:{display:"contents"},children:s.jsxs("div",{className:"ss-dashboard-grid",children:[i&&s.jsx("div",{className:"ss-loading",children:"Loading dashboard..."}),x&&s.jsx("div",{className:"ss-global-error",children:x}),!i&&c.map((b,$)=>{if(!b.result)return null;const{columns:v,rows:z}=b.result;return s.jsxs("div",{className:"ss-widget",children:[b.title&&s.jsx("h4",{className:"ss-widget-header",children:b.title}),s.jsxs("table",{className:"ss-table",children:[s.jsx("thead",{children:s.jsx("tr",{children:v.map(N=>s.jsx("th",{className:"ss-th",children:N},N))})}),s.jsx("tbody",{children:z.slice(0,50).map((N,g)=>s.jsx("tr",{className:"ss-tr",children:v.map(C=>s.jsx("td",{className:"ss-td",children:String(N[C]??"")},C))},g))})]})]},$)})]})})}exports.SaaSError=R.SaaSError;exports.SaaSSupport=R.SaaSSupport;exports.isMfaRequired=R.isMfaRequired;exports.Chart=gs;exports.CouponInput=Ws;exports.DashboardView=se;exports.DataTable=xs;exports.InvoiceHistory=us;exports.OrgSwitcher=Ts;exports.PaymentPortal=qs;exports.PricingTable=Ds;exports.QueryInput=Qs;exports.ReportEmbed=te;exports.SaaSContext=Z;exports.SaaSProvider=vs;exports.SavedQueryList=ae;exports.SettingsPanel=os;exports.SignIn=Cs;exports.SignUp=zs;exports.SubscriptionStatus=ds;exports.UsageDisplay=ps;exports.UserButton=Bs;exports.UserProfile=Ls;exports.useAuth=W;exports.useBilling=Ms;exports.useDashboard=Gs;exports.useDeleteAccount=as;exports.useEmbedDashboard=Ys;exports.useInvoices=ls;exports.useOrg=H;exports.useProfile=X;exports.useQuery=ss;exports.useReport=_s;exports.useSaaSContext=B;exports.useSavedQueries=hs;exports.useSignIn=K;exports.useSignUp=es;exports.useSubscription=is;exports.useUsage=cs;exports.useUser=$s;
2395
+ `}function ca({children:a,appearance:r}){const s=e.useRef(null),[l,c]=e.useState(null);e.useEffect(()=>{var j;if(!s.current||s.current.shadowRoot){c(((j=s.current)==null?void 0:j.shadowRoot)??null);return}const p=s.current.attachShadow({mode:"open"});if((r==null?void 0:r.fontUrl)!==null){const x=(r==null?void 0:r.fontUrl)??"https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Inter:wght@400;500;600&family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=block";if(!document.querySelector(`link[href="${x}"]`)){const S=document.createElement("link");S.rel="stylesheet",S.href=x,document.head.appendChild(S)}const o=document.createElement("link");o.rel="stylesheet",o.href=x,p.appendChild(o)}const d=ia(r),w=document.createElement("style");w.textContent=la(d),p.appendChild(w);const u=document.createElement("div");p.appendChild(u),c(p)},[]),e.useEffect(()=>{if(!l)return;const p=l.querySelector("style");if(p){const d=ia(r);p.textContent=la(d)}},[r,l]);const n=(l==null?void 0:l.querySelector("div"))??null;return t.jsx("div",{ref:s,style:{display:"contents"},children:n&&ya.createPortal(a,n)})}function sa(){const{client:a,user:r,isLoaded:s}=V();return{isLoaded:s,isSignedIn:!!r,user:r,signOut:e.useCallback(()=>a.auth.signOut(),[a]),getToken:e.useCallback(()=>a.auth.getToken(),[a]),refreshUser:e.useCallback(()=>a.auth.refreshUser(),[a])}}function $a(){const{user:a,isLoaded:r}=V();return{user:a,isLoaded:r}}function da(){const{client:a}=V(),[r,s]=e.useState(!1),[l,c]=e.useState(null),n=e.useCallback(async(w,u)=>{s(!0),c(null);try{return await a.auth.signIn(w,u)}catch(j){return c(j instanceof Error?j.message:"Sign in failed"),null}finally{s(!1)}},[a]),p=e.useCallback(async w=>{s(!0),c(null);try{return await a.auth.signInWithOAuth(w)}catch(u){return c(u instanceof Error?u.message:"OAuth sign in failed"),null}finally{s(!1)}},[a]),d=e.useCallback(async(w,u)=>{s(!0),c(null);try{return await a.auth.submitMfaCode(w,u)}catch(j){return c(j instanceof Error?j.message:"MFA verification failed"),null}finally{s(!1)}},[a]);return{signIn:n,signInWithOAuth:p,submitMfaCode:d,isLoading:r,error:l,setError:c}}function ua(){const{client:a}=V(),[r,s]=e.useState(!1),[l,c]=e.useState(null);return{signUp:e.useCallback(async(p,d)=>{s(!0),c(null);try{return await a.auth.signUp(p,d)}catch(w){return c(w instanceof Error?w.message:"Sign up failed"),null}finally{s(!1)}},[a]),isLoading:r,error:l,setError:c}}function W(){const{client:a}=V(),[r,s]=e.useState([]),[l,c]=e.useState(null),[n,p]=e.useState([]),[d,w]=e.useState([]),[u,j]=e.useState(!1),[x,o]=e.useState(null),S=e.useRef(!1),v=e.useCallback(async()=>{j(!0),o(null);try{const m=await a.auth.listOrgs();if(s(m),c(g=>g&&(m.find(f=>f.id===g.id)??null)),!S.current&&m.length>0){const g=typeof window<"u"?localStorage.getItem("ss_selected_org"):null,f=(g?m.find(C=>C.id===g):null)??(m.length===1?m[0]:null);if(f){S.current=!0,c(f),typeof window<"u"&&localStorage.setItem("ss_selected_org",f.id);try{const C=await a.auth.listMembers(f.id);p(C)}catch{}}}}catch(m){o(m instanceof Error?m.message:"Failed to load organizations")}finally{j(!1)}},[a]);e.useEffect(()=>{v()},[v]);const z=e.useCallback(async m=>{try{const g=await a.auth.getOrg(m);c(g),typeof window<"u"&&localStorage.setItem("ss_selected_org",m);const h=await a.auth.listMembers(m);p(h)}catch(g){o(g instanceof Error?g.message:"Failed to load organization")}},[a]),R=e.useCallback(async(m,g)=>{try{const h=await a.auth.createOrg(m,g);return s(f=>[...f,h]),h}catch(h){return o(h instanceof Error?h.message:"Failed to create organization"),null}},[a]),E=e.useCallback(async(m,g)=>{try{const h=await a.auth.updateOrg(m,g);return s(f=>f.map(C=>C.id===m?h:C)),(l==null?void 0:l.id)===m&&c(h),h}catch(h){return o(h instanceof Error?h.message:"Failed to update organization"),null}},[a,l]),L=e.useCallback(async m=>{try{return await a.auth.deleteOrg(m),s(g=>g.filter(h=>h.id!==m)),(l==null?void 0:l.id)===m&&(c(null),p([]),w([]),typeof window<"u"&&localStorage.removeItem("ss_selected_org")),!0}catch(g){return o(g instanceof Error?g.message:"Failed to delete organization"),!1}},[a,l]),F=e.useCallback(async(m,g,h)=>{try{return await a.auth.sendInvite(m,g,h)}catch(f){return o(f instanceof Error?f.message:"Failed to send invite"),null}},[a]),i=e.useCallback(async m=>{try{const g=await a.auth.listInvites(m);w(g)}catch(g){o(g instanceof Error?g.message:"Failed to load invites")}},[a]),k=e.useCallback(async(m,g)=>{try{return await a.auth.revokeInvite(m,g),w(h=>h.filter(f=>f.id!==g)),!0}catch(h){return o(h instanceof Error?h.message:"Failed to revoke invite"),!1}},[a]),$=e.useCallback(async(m,g,h)=>{try{return await a.auth.updateMemberRole(m,g,h),p(f=>f.map(C=>C.userId===g?{...C,role:h}:C)),!0}catch(f){return o(f instanceof Error?f.message:"Failed to update member role"),!1}},[a]),N=e.useCallback(async(m,g)=>{try{return await a.auth.removeMember(m,g),p(h=>h.filter(f=>f.userId!==g)),!0}catch(h){return o(h instanceof Error?h.message:"Failed to remove member"),!1}},[a]),B=e.useCallback(async m=>{try{const g=await a.auth.listMembers(m);p(g)}catch(g){o(g instanceof Error?g.message:"Failed to load members")}},[a]),I=e.useCallback(async(m,g)=>{try{const h=await a.auth.uploadOrgAvatar(m,g);return s(f=>f.map(C=>C.id===m?{...C,avatarUrl:h.avatarUrl}:C)),(l==null?void 0:l.id)===m&&c(f=>f&&{...f,avatarUrl:h.avatarUrl}),h}catch(h){return o(h instanceof Error?h.message:"Failed to upload org avatar"),null}},[a,l]);return{orgs:r,selectedOrg:l,members:n,invites:d,isLoading:u,error:x,setError:o,refresh:v,selectOrg:z,createOrg:R,updateOrg:E,deleteOrg:L,sendInvite:F,refreshInvites:i,revokeInvite:k,updateMemberRole:$,removeMember:N,refreshMembers:B,uploadOrgAvatar:I}}function pa(){const{client:a}=V(),[r,s]=e.useState(!1),[l,c]=e.useState(null);return{deleteAccount:e.useCallback(async()=>{s(!0),c(null);try{return await a.auth.deleteAccount(),!0}catch(p){return c(p instanceof Error?p.message:"Failed to delete account"),!1}finally{s(!1)}},[a]),isLoading:r,error:l,setError:c}}function ha(){const{client:a,user:r}=V(),[s,l]=e.useState(!1),[c,n]=e.useState(null),[p,d]=e.useState(null),w=e.useCallback(async x=>{l(!0),n(null),d(null);try{const o=await a.auth.updateProfile(x);return d("Profile updated"),o}catch(o){return n(o instanceof Error?o.message:"Failed to update profile"),null}finally{l(!1)}},[a]),u=e.useCallback(async(x,o)=>{l(!0),n(null),d(null);try{return await a.auth.changePassword(x,o),d("Password changed successfully"),!0}catch(S){return n(S instanceof Error?S.message:"Failed to change password"),!1}finally{l(!1)}},[a]),j=e.useCallback(async x=>{l(!0),n(null),d(null);try{const o=await a.auth.uploadAvatar(x);return d("Avatar updated"),o}catch(o){return n(o instanceof Error?o.message:"Failed to upload avatar"),null}finally{l(!1)}},[a]);return{user:r,updateProfile:w,uploadAvatar:j,changePassword:u,isLoading:s,error:c,success:p,setError:n,setSuccess:d}}function Q(){const{client:a}=V(),[r,s]=e.useState([]),[l,c]=e.useState(!1),[n,p]=e.useState(null),d=e.useCallback(async()=>{c(!0),p(null);try{const j=await a.auth.listMyInvites();s(j)}catch(j){p(j instanceof Error?j.message:"Failed to load invites")}finally{c(!1)}},[a]);e.useEffect(()=>{d()},[d]);const w=e.useCallback(async j=>{try{const x=await a.auth.acceptInviteById(j);return s(o=>o.filter(S=>S.id!==j)),x}catch(x){return p(x instanceof Error?x.message:"Failed to accept invite"),null}},[a]),u=e.useCallback(async j=>{try{return await a.auth.declineInvite(j),s(x=>x.filter(o=>o.id!==j)),!0}catch(x){return p(x instanceof Error?x.message:"Failed to decline invite"),!1}},[a]);return{invites:r,isLoading:l,error:n,setError:p,refresh:d,accept:w,decline:u}}const Na='<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92a5.06 5.06 0 0 1-2.2 3.32v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.1z" fill="#4285F4"/><path d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" fill="#34A853"/><path d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z" fill="#FBBC05"/><path d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z" fill="#EA4335"/></svg>',Ca='<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0 0 24 12c0-6.63-5.37-12-12-12z" fill="currentColor"/></svg>',y={close:"close",person:"person",logout:"logout",checkCircle:"check_circle",cloudUpload:"cloud_upload",zoomIn:"zoom_in",zoomOut:"zoom_out",lock:"lock",visibility:"visibility",visibilityOff:"visibility_off",add:"add",camera:"photo_camera",security:"security",errorOutline:"error_outline",info:"info",arrowBack:"arrow_back",arrowForward:"arrow_forward",verified:"verified",corporateFare:"corporate_fare",mail:"mail",check:"check",image:"image",settings:"settings",group:"group",creditCard:"credit_card",edit:"edit",send:"send",personRemove:"person_remove"};function za({appearance:a,afterSignInUrl:r,afterSignUpUrl:s,initialMode:l="signIn"}){const{appearance:c,settings:n}=V(),{signIn:p,signInWithOAuth:d,submitMfaCode:w,isLoading:u,error:j,setError:x}=da(),{signUp:o,isLoading:S,error:v,setError:z}=ua(),R=a??c,[E,L]=e.useState(l),[F,i]=e.useState(""),[k,$]=e.useState(""),[N,B]=e.useState(!1),[I,m]=e.useState(""),[g,h]=e.useState(null),[f,C]=e.useState(!1),[b,H]=e.useState(!1),[K,aa]=e.useState(""),[q,G]=e.useState(["","","","","",""]),Y=e.useRef([]),U=E==="signIn"?u:S,X=E==="signIn"?j:g||v,T=e.useCallback(P=>{L(P),x(null),z(null),h(null),H(!1),G(["","","","","",""])},[x,z]),Z=e.useCallback(async P=>{if(P.preventDefault(),b){await w(K,q.join(""));return}const M=await p(F,k);M&&J.isMfaRequired(M)&&(aa(M.mfaToken),H(!0),x(null))},[F,k,b,K,q,p,w,x]),ga=e.useCallback(async P=>{if(P.preventDefault(),h(null),k!==I){h("Passwords do not match");return}const M=(n==null?void 0:n.passwordMinLength)??8;if(k.length<M){h(`Password must be at least ${M} characters`);return}await o(F,k)},[F,k,I,n,o]),ea=e.useCallback(async P=>{await d(P)},[d]),fa=e.useCallback((P,M)=>{var na;if(!/^\d*$/.test(M))return;const A=M.slice(-1);G(ba=>{const oa=[...ba];return oa[P]=A,oa}),A&&P<5&&((na=Y.current[P+1])==null||na.focus())},[]),ma=e.useCallback((P,M)=>{var A;M.key==="Backspace"&&!q[P]&&P>0&&((A=Y.current[P-1])==null||A.focus())},[q]),ra=(n==null?void 0:n.googleEnabled)||(n==null?void 0:n.githubEnabled),_=E==="signIn";return t.jsx(ca,{appearance:R,children:t.jsx("div",{className:"ss-auth-card",children:t.jsxs("div",{className:"ss-auth-card-body",children:[t.jsxs("div",{className:"ss-auth-header",children:[t.jsx("h1",{className:"ss-auth-title",children:_?"Sign in to your account":"Create your account"}),t.jsx("p",{className:"ss-auth-subtitle",children:_?"Welcome back to your workspace":"Join the ecosystem"})]}),!b&&ra&&t.jsxs(t.Fragment,{children:[t.jsxs("div",{className:"ss-auth-oauth-grid",children:[(n==null?void 0:n.googleEnabled)&&t.jsxs("button",{type:"button",className:"ss-auth-btn-social",onClick:()=>ea("google"),disabled:U,children:[t.jsx("span",{dangerouslySetInnerHTML:{__html:Na}}),"Google"]}),(n==null?void 0:n.githubEnabled)&&t.jsxs("button",{type:"button",className:"ss-auth-btn-social",onClick:()=>ea("github"),disabled:U,children:[t.jsx("span",{dangerouslySetInnerHTML:{__html:Ca}}),"GitHub"]})]}),f?t.jsx("div",{className:"ss-auth-divider",children:_?"or continue with":"or sign up with email"}):t.jsx("div",{className:"ss-auth-divider",children:t.jsx("span",{className:"ss-auth-link",onClick:()=>C(!0),children:_?"or sign in with email":"or sign up with email"})})]}),(!ra||f||b)&&t.jsxs(t.Fragment,{children:[X&&t.jsxs("div",{className:"ss-auth-error",children:[t.jsx("span",{className:"material-symbols-outlined",children:y.errorOutline}),t.jsx("span",{children:X})]}),_&&t.jsxs("form",{onSubmit:Z,children:[b?t.jsxs(t.Fragment,{children:[t.jsx("div",{className:"ss-auth-mfa-divider",children:t.jsx("span",{children:"Verification Required"})}),t.jsxs("div",{className:"ss-auth-field",children:[t.jsx("label",{className:"ss-auth-label",children:"6-Digit Code"}),t.jsx("div",{className:"ss-auth-mfa-group",children:q.map((P,M)=>t.jsx("input",{ref:A=>{Y.current[M]=A},className:"ss-auth-mfa-digit",type:"text",inputMode:"numeric",maxLength:1,value:P,onChange:A=>fa(M,A.target.value),onKeyDown:A=>ma(M,A),autoFocus:M===0},M))}),t.jsx("p",{className:"ss-auth-mfa-hint",children:"We sent a 6-digit code to your registered email."})]})]}):t.jsxs(t.Fragment,{children:[t.jsxs("div",{className:"ss-auth-field",children:[t.jsx("label",{className:"ss-auth-label",htmlFor:"ss-email",children:"Email Address"}),t.jsx("input",{id:"ss-email",className:"ss-auth-input",type:"email",autoComplete:"email",placeholder:"name@company.com",value:F,onChange:P=>i(P.target.value),required:!0})]}),t.jsxs("div",{className:"ss-auth-field",children:[t.jsxs("div",{className:"ss-auth-field-row",children:[t.jsx("label",{className:"ss-auth-label",htmlFor:"ss-password",style:{marginBottom:0},children:"Password"}),t.jsx("span",{className:"ss-auth-link",style:{fontSize:"12px"},children:"Forgot?"})]}),t.jsxs("div",{style:{position:"relative"},children:[t.jsx("input",{id:"ss-password",className:"ss-auth-input",type:N?"text":"password",autoComplete:"current-password",placeholder:"••••••••",value:k,onChange:P=>$(P.target.value),required:!0}),t.jsx("button",{type:"button",className:"ss-auth-visibility-toggle",onClick:()=>B(!N),children:t.jsx("span",{className:"material-symbols-outlined",children:N?y.visibilityOff:y.visibility})})]})]})]}),t.jsxs("button",{type:"submit",className:"ss-auth-btn-primary",disabled:U,children:[U&&t.jsx("span",{className:"ss-auth-spinner"}),b?"Verify":"Sign in",!U&&t.jsx("span",{className:"material-symbols-outlined",children:y.arrowForward})]})]}),!_&&t.jsxs("form",{onSubmit:ga,children:[t.jsxs("div",{className:"ss-auth-field",children:[t.jsx("label",{className:"ss-auth-label",htmlFor:"ss-signup-email",children:"Email"}),t.jsx("input",{id:"ss-signup-email",className:"ss-auth-input",type:"email",autoComplete:"email",placeholder:"name@company.com",value:F,onChange:P=>i(P.target.value),required:!0})]}),t.jsxs("div",{className:"ss-auth-field",children:[t.jsx("label",{className:"ss-auth-label",htmlFor:"ss-signup-password",children:"Password"}),t.jsxs("div",{style:{position:"relative"},children:[t.jsx("input",{id:"ss-signup-password",className:"ss-auth-input",type:N?"text":"password",autoComplete:"new-password",placeholder:"••••••••",value:k,onChange:P=>{$(P.target.value),h(null)},required:!0}),t.jsx("button",{type:"button",className:"ss-auth-visibility-toggle",onClick:()=>B(!N),children:t.jsx("span",{className:"material-symbols-outlined",children:N?y.visibilityOff:y.visibility})})]})]}),t.jsxs("div",{className:"ss-auth-field",children:[t.jsx("label",{className:"ss-auth-label",htmlFor:"ss-signup-confirm",children:"Confirm Password"}),t.jsx("input",{id:"ss-signup-confirm",className:"ss-auth-input",type:"password",autoComplete:"new-password",placeholder:"••••••••",value:I,onChange:P=>{m(P.target.value),h(null)},required:!0})]}),t.jsxs("button",{type:"submit",className:"ss-auth-btn-primary",disabled:U,children:[U&&t.jsx("span",{className:"ss-auth-spinner"}),"Sign up",!U&&t.jsx("span",{className:"material-symbols-outlined",children:y.arrowForward})]})]})]}),((n==null?void 0:n.privacyPolicyUrl)||(n==null?void 0:n.termsOfServiceUrl))&&t.jsxs("div",{className:"ss-auth-legal-links",children:[n.privacyPolicyUrl&&t.jsx("a",{href:n.privacyPolicyUrl,target:"_blank",rel:"noopener noreferrer",children:"Privacy Policy"}),n.privacyPolicyUrl&&n.termsOfServiceUrl&&t.jsx("span",{children:" · "}),n.termsOfServiceUrl&&t.jsx("a",{href:n.termsOfServiceUrl,target:"_blank",rel:"noopener noreferrer",children:"Terms of Service"})]}),b?t.jsx("div",{className:"ss-auth-footer",children:t.jsx("span",{className:"ss-auth-link",onClick:()=>{H(!1),G(["","","","","",""]),x(null)},children:"Back to sign in"})}):_?t.jsxs("div",{className:"ss-auth-footer",children:["Don't have an account?"," ",t.jsx("span",{className:"ss-auth-link",onClick:()=>T("signUp"),children:"Sign up"})]}):t.jsxs("div",{className:"ss-auth-footer",children:["Already have an account?"," ",t.jsx("span",{className:"ss-auth-link",onClick:()=>T("signIn"),children:"Sign in"})]})]})})})}const O=320,D=128,Pa=e.forwardRef(function({file:r,onCrop:s,onCancel:l},c){const n=e.useRef(null),p=e.useRef(null),[d,w]=e.useState(1),[u,j]=e.useState({x:0,y:0}),[x,o]=e.useState(!1),S=e.useRef({x:0,y:0,ox:0,oy:0}),[v,z]=e.useState(!1);e.useEffect(()=>{const i=new Image,k=URL.createObjectURL(r);return i.onload=()=>{p.current=i,z(!0),j({x:0,y:0}),w(1)},i.src=k,()=>URL.revokeObjectURL(k)},[r]),e.useEffect(()=>{if(!v||!p.current||!n.current)return;const i=n.current.getContext("2d");if(!i)return;const k=p.current;i.clearRect(0,0,O,O),i.fillStyle="#111",i.fillRect(0,0,O,O);const $=Math.max(O/k.width,O/k.height)*d,N=k.width*$,B=k.height*$,I=(O-N)/2+u.x,m=(O-B)/2+u.y;i.save(),i.beginPath(),i.arc(O/2,O/2,D,0,Math.PI*2),i.clip(),i.drawImage(k,I,m,N,B),i.restore(),i.save(),i.fillStyle="rgba(0, 0, 0, 0.6)",i.fillRect(0,0,O,O),i.globalCompositeOperation="destination-out",i.beginPath(),i.arc(O/2,O/2,D,0,Math.PI*2),i.fill(),i.restore(),i.save(),i.beginPath(),i.arc(O/2,O/2,D,0,Math.PI*2),i.clip(),i.drawImage(k,I,m,N,B),i.restore(),i.strokeStyle="rgba(255, 255, 255, 0.4)",i.lineWidth=2,i.beginPath(),i.arc(O/2,O/2,D,0,Math.PI*2),i.stroke()},[d,u,v]);const R=e.useCallback(i=>{o(!0),S.current={x:i.clientX,y:i.clientY,ox:u.x,oy:u.y},i.target.setPointerCapture(i.pointerId)},[u]),E=e.useCallback(i=>{x&&j({x:S.current.ox+(i.clientX-S.current.x),y:S.current.oy+(i.clientY-S.current.y)})},[x]),L=e.useCallback(()=>o(!1),[]),F=e.useCallback(()=>{if(!p.current)return;const i=document.createElement("canvas"),k=D*2;i.width=k,i.height=k;const $=i.getContext("2d");if(!$)return;const N=p.current,B=Math.max(O/N.width,O/N.height)*d,I=N.width*B,m=N.height*B,g=(O-I)/2+u.x-(O/2-D),h=(O-m)/2+u.y-(O/2-D);$.beginPath(),$.arc(D,D,D,0,Math.PI*2),$.clip(),$.drawImage(N,g,h,I,m),i.toBlob(f=>{f&&s(f)},"image/png")},[d,u,s]);return e.useImperativeHandle(c,()=>({triggerCrop:()=>F()}),[F]),t.jsxs("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",gap:"24px"},children:[t.jsxs("div",{className:"ss-auth-crop-area",children:[t.jsx("canvas",{ref:n,width:O,height:O,style:{cursor:x?"grabbing":"grab",width:"100%",height:"100%"},onPointerDown:R,onPointerMove:E,onPointerUp:L}),t.jsx("div",{className:"ss-auth-crop-size-badge",children:"256 x 256 px"})]}),t.jsxs("div",{className:"ss-auth-zoom-control",style:{width:"100%",maxWidth:"280px"},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.zoomOut}),t.jsx("input",{type:"range",min:"1",max:"3",step:"0.01",value:d,onChange:i=>w(parseFloat(i.target.value)),className:"ss-auth-zoom-slider"}),t.jsx("span",{className:"material-symbols-outlined",children:y.zoomIn})]})]})});function Oa({onUpload:a,onClose:r,isLoading:s}){const[l,c]=e.useState(null),[n,p]=e.useState(!1),[d,w]=e.useState(null),u=e.useRef(null),j=e.useRef(null),x=e.useCallback(v=>{if(!v.type.startsWith("image/")){w("Please select an image file");return}if(v.size>5*1024*1024){w("Image must be smaller than 5 MB");return}w(null),c(v)},[]),o=e.useCallback(v=>{v.preventDefault(),p(!1);const z=v.dataTransfer.files[0];z&&x(z)},[x]),S=e.useCallback(async v=>{await a(v)},[a]);return t.jsx("div",{className:"ss-auth-modal-overlay",onClick:v=>{v.target===v.currentTarget&&r()},children:t.jsxs("div",{className:"ss-auth-modal",style:{maxWidth:"480px"},children:[t.jsxs("div",{className:"ss-auth-modal-header",children:[t.jsx("h2",{children:"Upload avatar"}),t.jsx("button",{type:"button",className:"ss-auth-modal-close",onClick:r,children:t.jsx("span",{className:"material-symbols-outlined",children:y.close})})]}),t.jsxs("div",{className:"ss-auth-modal-body",children:[d&&t.jsxs("div",{className:"ss-auth-error",style:{marginBottom:"16px"},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.errorOutline}),t.jsx("span",{children:d})]}),l?t.jsxs(t.Fragment,{children:[t.jsx(Pa,{ref:j,file:l,onCrop:S,onCancel:()=>c(null)}),t.jsx("div",{style:{textAlign:"center",marginTop:"8px"},children:t.jsxs("button",{type:"button",className:"ss-auth-btn-ghost",style:{fontSize:"13px"},onClick:()=>{var v;return(v=u.current)==null?void 0:v.click()},children:[t.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"16px"},children:y.image}),"Change image"]})})]}):t.jsxs("div",{className:`ss-auth-dropzone${n?" ss-auth-dropzone-active":""}`,onDragOver:v=>{v.preventDefault(),p(!0)},onDragLeave:()=>p(!1),onDrop:o,onClick:()=>{var v;return(v=u.current)==null?void 0:v.click()},style:{minHeight:"240px"},children:[t.jsx("div",{className:"ss-auth-dropzone-icon",children:t.jsx("span",{className:"material-symbols-outlined",children:y.cloudUpload})}),t.jsx("span",{className:"ss-auth-dropzone-title",children:"Drag and drop"}),t.jsxs("span",{className:"ss-auth-dropzone-desc",children:["JPG, PNG or WEBP",t.jsx("br",{}),"Max file size 5 MB"]}),t.jsx("button",{type:"button",className:"ss-auth-dropzone-btn",children:"Choose File"})]}),t.jsx("input",{ref:u,type:"file",accept:"image/*",style:{display:"none"},onChange:v=>{var z;(z=v.target.files)!=null&&z[0]&&x(v.target.files[0])}}),t.jsxs("div",{className:"ss-auth-info-box",style:{marginTop:"16px"},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.info}),t.jsx("span",{children:"Your profile photo will be visible to all members of your organization."})]})]}),t.jsxs("div",{className:"ss-auth-modal-footer",children:[t.jsx("button",{type:"button",className:"ss-auth-btn-ghost",onClick:r,children:"Cancel"}),t.jsxs("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",onClick:()=>{var v;return(v=j.current)==null?void 0:v.triggerCrop()},disabled:!l||s,style:{width:"auto"},children:[s&&t.jsx("span",{className:"ss-auth-spinner"}),"Save Profile",!s&&t.jsx("span",{className:"material-symbols-outlined",children:y.check})]})]})]})})}function xa({onClose:a,afterDeleteAccountUrl:r,defaultTab:s="profile",onOrgDeleted:l,onOrgUpdated:c}){const[n,p]=e.useState(s),{invites:d}=Q(),w=[{key:"profile",label:"Profile",icon:y.person},{key:"organization",label:"Organization",icon:y.corporateFare},{key:"people",label:"People",icon:y.group},{key:"invites",label:"Invites",icon:y.mail,badge:d.length||void 0},{key:"billing",label:"Billing",icon:y.creditCard}];return t.jsxs("div",{className:"ss-auth-settings-page",children:[t.jsxs("div",{className:"ss-auth-settings-header",children:[t.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"12px"},children:[t.jsx("button",{type:"button",className:"ss-auth-settings-back",onClick:a,children:t.jsx("span",{className:"material-symbols-outlined",children:y.arrowBack})}),t.jsx("h2",{children:"Settings"})]}),t.jsx("button",{type:"button",className:"ss-auth-modal-close",onClick:a,children:t.jsx("span",{className:"material-symbols-outlined",children:y.close})})]}),t.jsxs("div",{className:"ss-auth-settings-layout",children:[t.jsx("nav",{className:"ss-auth-settings-nav",children:w.map(u=>t.jsxs("button",{type:"button",className:`ss-auth-settings-nav-item${n===u.key?" ss-auth-settings-nav-item-active":""}`,onClick:()=>p(u.key),children:[t.jsx("span",{className:"material-symbols-outlined",children:u.icon}),u.label,u.badge!=null&&u.badge>0&&t.jsx("span",{className:"ss-auth-invite-badge",style:{position:"static",marginLeft:"6px"},children:u.badge})]},u.key))}),t.jsxs("div",{className:"ss-auth-settings-content",children:[n==="profile"&&t.jsx(Ia,{afterDeleteAccountUrl:r}),n==="organization"&&t.jsx(Ea,{onOrgDeleted:l,onOrgUpdated:c}),n==="people"&&t.jsx(Fa,{}),n==="invites"&&t.jsx(Ba,{}),n==="billing"&&t.jsx(Ta,{})]})]})]})}function Ia({afterDeleteAccountUrl:a}){const{user:r,updateProfile:s,uploadAvatar:l,changePassword:c,isLoading:n,error:p,success:d,setError:w,setSuccess:u}=ha(),{signOut:j}=sa(),{deleteAccount:x,isLoading:o,error:S,setError:v}=pa(),[z,R]=e.useState((r==null?void 0:r.name)??""),[E,L]=e.useState((r==null?void 0:r.avatarUrl)??""),[F,i]=e.useState(!1),[k,$]=e.useState(""),[N,B]=e.useState(""),[I,m]=e.useState(""),[g,h]=e.useState(null),[f,C]=e.useState(!1),[b,H]=e.useState(""),K=e.useCallback(async T=>{T.preventDefault(),w(null),u(null),await s({name:z,avatarUrl:E||void 0})},[z,E,s,w,u]),aa=e.useCallback(async T=>{const Z=await l(T);Z&&(L(Z.avatarUrl),i(!1))},[l]),q=e.useCallback(async T=>{if(T.preventDefault(),h(null),w(null),u(null),N!==I){h("Passwords do not match");return}if(N.length<8){h("Password must be at least 8 characters");return}await c(k,N)&&($(""),B(""),m(""))},[k,N,I,c,w,u]),G=e.useCallback(async()=>{await x()&&(await j(),a&&(window.location.href=a))},[x,j,a]),Y=(r==null?void 0:r.provider)==="email",U=b===(r==null?void 0:r.email),X=((r==null?void 0:r.name)||(r==null?void 0:r.email)||"?").charAt(0).toUpperCase();return t.jsxs(t.Fragment,{children:[t.jsx("h3",{children:"Profile"}),t.jsxs("div",{className:"ss-auth-settings-card",children:[t.jsxs("div",{className:"ss-auth-profile-header",style:{border:"none",background:"none",padding:0,marginBottom:16},children:[t.jsxs("div",{className:"ss-auth-avatar-lg",onClick:()=>i(!0),children:[E?t.jsx("img",{src:E,alt:""}):t.jsx("div",{style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",fontSize:"48px",fontWeight:800,opacity:.4},children:X}),t.jsxs("div",{className:"ss-auth-avatar-overlay",children:[t.jsx("span",{className:"material-symbols-outlined",children:y.camera}),t.jsx("span",{children:"Edit"})]})]}),t.jsxs("div",{className:"ss-auth-profile-info",children:[t.jsxs("h2",{className:"ss-auth-profile-name",children:[(r==null?void 0:r.name)||"Unnamed User",(r==null?void 0:r.emailVerified)&&t.jsxs("span",{className:"ss-auth-badge ss-auth-badge-success",children:[t.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"12px",fontVariationSettings:"'FILL' 1"},children:y.verified}),"Verified"]})]}),t.jsx("p",{className:"ss-auth-profile-desc",children:r==null?void 0:r.email})]})]}),p&&t.jsxs("div",{className:"ss-auth-error",children:[t.jsx("span",{className:"material-symbols-outlined",children:y.errorOutline}),t.jsx("span",{children:p})]}),d&&t.jsxs("div",{className:"ss-auth-info-box",style:{marginBottom:"16px"},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.check}),t.jsx("span",{children:d})]}),t.jsxs("form",{onSubmit:K,children:[t.jsxs("div",{className:"ss-auth-field",children:[t.jsx("label",{className:"ss-auth-label",children:"Full Name"}),t.jsx("input",{className:"ss-auth-input",type:"text",placeholder:"Your name",value:z,onChange:T=>R(T.target.value)})]}),t.jsxs("div",{className:"ss-auth-profile-grid",style:{marginBottom:"16px"},children:[t.jsxs("div",{children:[t.jsx("label",{className:"ss-auth-label",children:"Email Address"}),t.jsxs("div",{style:{position:"relative"},children:[t.jsx("input",{className:"ss-auth-input ss-auth-input-readonly",type:"email",value:(r==null?void 0:r.email)??"",readOnly:!0}),t.jsx("span",{className:"ss-auth-visibility-toggle",style:{cursor:"default"},children:t.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"18px"},children:y.lock})})]})]}),t.jsxs("div",{children:[t.jsx("label",{className:"ss-auth-label",children:"Auth Provider"}),t.jsx("input",{className:"ss-auth-input ss-auth-input-readonly",type:"text",value:(r==null?void 0:r.provider)??"",readOnly:!0})]})]}),t.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:t.jsxs("button",{type:"submit",className:"ss-auth-btn-primary ss-auth-btn-sm",disabled:n,style:{width:"auto"},children:[n&&t.jsx("span",{className:"ss-auth-spinner"}),"Save changes"]})})]})]}),Y&&t.jsxs("div",{className:"ss-auth-settings-card",children:[t.jsxs("h4",{children:[t.jsx("span",{className:"material-symbols-outlined",children:y.security}),"Security Credentials"]}),g&&t.jsxs("div",{className:"ss-auth-error",style:{marginBottom:"16px"},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.errorOutline}),t.jsx("span",{children:g})]}),t.jsxs("form",{onSubmit:q,children:[t.jsxs("div",{className:"ss-auth-field",children:[t.jsx("label",{className:"ss-auth-label",children:"Current Password"}),t.jsx("input",{className:"ss-auth-input",type:"password",placeholder:"••••••••••••",value:k,onChange:T=>$(T.target.value),required:!0})]}),t.jsxs("div",{className:"ss-auth-profile-grid",style:{marginBottom:"16px"},children:[t.jsxs("div",{children:[t.jsx("label",{className:"ss-auth-label",children:"New Password"}),t.jsx("input",{className:"ss-auth-input",type:"password",placeholder:"Min. 8 characters",value:N,onChange:T=>B(T.target.value),required:!0})]}),t.jsxs("div",{children:[t.jsx("label",{className:"ss-auth-label",children:"Confirm New Password"}),t.jsx("input",{className:"ss-auth-input",type:"password",placeholder:"Repeat new password",value:I,onChange:T=>m(T.target.value),required:!0})]})]}),t.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:t.jsx("button",{type:"submit",className:"ss-auth-btn-ghost",disabled:n,children:"Update Security"})})]})]}),t.jsxs("div",{className:"ss-auth-settings-card ss-auth-settings-danger",children:[t.jsx("h4",{children:"Danger Zone"}),t.jsx("p",{className:"ss-auth-section-desc",style:{marginBottom:"16px"},children:"Deleting your account is permanent. All organizations you own will also be deleted."}),S&&t.jsxs("div",{className:"ss-auth-error",children:[t.jsx("span",{className:"material-symbols-outlined",children:y.errorOutline}),t.jsx("span",{children:S})]}),f?t.jsxs("div",{children:[t.jsxs("div",{className:"ss-auth-field",children:[t.jsx("label",{className:"ss-auth-label",children:"Type your email to confirm"}),t.jsx("input",{className:"ss-auth-input",type:"email",placeholder:r==null?void 0:r.email,value:b,onChange:T=>H(T.target.value),autoFocus:!0})]}),t.jsxs("div",{style:{display:"flex",gap:"8px",justifyContent:"flex-end"},children:[t.jsx("button",{type:"button",className:"ss-auth-btn-ghost",onClick:()=>{C(!1),H(""),v(null)},children:"Cancel"}),t.jsxs("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",style:{width:"auto",background:"linear-gradient(135deg, #ef4444, #dc2626)"},disabled:!U||o,onClick:G,children:[o&&t.jsx("span",{className:"ss-auth-spinner"}),"Delete account"]})]})]}):t.jsx("button",{type:"button",className:"ss-auth-btn-outline",style:{borderColor:"currentColor",width:"auto"},onClick:()=>C(!0),children:"Delete my account"})]}),F&&t.jsx(Oa,{onUpload:aa,onClose:()=>i(!1),isLoading:n})]})}function Ea({onOrgDeleted:a,onOrgUpdated:r}){const{selectedOrg:s,updateOrg:l,deleteOrg:c,isLoading:n,error:p,setError:d}=W(),[w,u]=e.useState((s==null?void 0:s.name)??""),[j,x]=e.useState(!1),[o,S]=e.useState(!1),[v,z]=e.useState(!1),[R,E]=e.useState(!1),[L,F]=e.useState("");if(e.useEffect(()=>{s&&(u(s.name),z(!1))},[s]),v)return t.jsxs(t.Fragment,{children:[t.jsx("h3",{children:"Organization"}),t.jsxs("div",{className:"ss-auth-settings-card",style:{textAlign:"center",padding:"48px 24px"},children:[t.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"48px",opacity:.4,marginBottom:"16px",display:"block"},children:y.check}),t.jsx("h4",{style:{margin:"0 0 8px"},children:"Organization deleted"}),t.jsx("p",{className:"ss-auth-section-desc",children:"The organization has been permanently deleted."})]})]});if(!s)return t.jsxs(t.Fragment,{children:[t.jsx("h3",{children:"Organization"}),t.jsxs("div",{className:"ss-auth-settings-empty",children:[t.jsx("span",{className:"material-symbols-outlined",children:y.corporateFare}),t.jsx("div",{children:"Select an organization from the user menu to manage its settings."})]})]});const i=async $=>{if($.preventDefault(),!w.trim())return;x(!0),S(!1);const N=await l(s.id,{name:w.trim()});x(!1),N&&(S(!0),r==null||r())},k=async()=>{await c(s.id)&&(E(!1),z(!0),a==null||a())};return t.jsxs(t.Fragment,{children:[t.jsx("h3",{children:"Organization"}),t.jsxs("div",{className:"ss-auth-settings-card",children:[t.jsxs("h4",{children:[t.jsx("span",{className:"material-symbols-outlined",children:y.corporateFare}),"General"]}),p&&t.jsxs("div",{className:"ss-auth-error",style:{marginBottom:"16px"},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.errorOutline}),t.jsx("span",{children:p})]}),o&&t.jsxs("div",{className:"ss-auth-info-box",style:{marginBottom:"16px"},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.check}),t.jsx("span",{children:"Organization updated"})]}),t.jsxs("form",{onSubmit:i,children:[t.jsxs("div",{className:"ss-auth-field",children:[t.jsx("label",{className:"ss-auth-label",children:"Organization Name"}),t.jsx("input",{className:"ss-auth-input",type:"text",value:w,onChange:$=>{u($.target.value),S(!1)}})]}),t.jsxs("div",{className:"ss-auth-field",children:[t.jsx("label",{className:"ss-auth-label",children:"Slug"}),t.jsx("input",{className:"ss-auth-input ss-auth-input-readonly",type:"text",value:s.slug,readOnly:!0})]}),t.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:t.jsxs("button",{type:"submit",className:"ss-auth-btn-primary ss-auth-btn-sm",disabled:j,style:{width:"auto"},children:[j&&t.jsx("span",{className:"ss-auth-spinner"}),"Save"]})})]})]}),t.jsxs("div",{className:"ss-auth-settings-card ss-auth-settings-danger",children:[t.jsx("h4",{children:"Danger Zone"}),t.jsx("p",{className:"ss-auth-section-desc",style:{marginBottom:"16px"},children:"Deleting this organization is permanent and will remove all members."}),R?t.jsxs("div",{children:[t.jsxs("div",{className:"ss-auth-field",children:[t.jsx("label",{className:"ss-auth-label",children:"Type the organization name to confirm"}),t.jsx("input",{className:"ss-auth-input",type:"text",placeholder:s.name,value:L,onChange:$=>F($.target.value),autoFocus:!0})]}),t.jsxs("div",{style:{display:"flex",gap:"8px",justifyContent:"flex-end"},children:[t.jsx("button",{type:"button",className:"ss-auth-btn-ghost",onClick:()=>{E(!1),F("")},children:"Cancel"}),t.jsxs("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",style:{width:"auto",background:"linear-gradient(135deg, #ef4444, #dc2626)"},disabled:L!==s.name||n,onClick:k,children:[n&&t.jsx("span",{className:"ss-auth-spinner"}),"Delete organization"]})]})]}):t.jsx("button",{type:"button",className:"ss-auth-btn-outline",style:{borderColor:"currentColor",width:"auto"},onClick:()=>E(!0),children:"Delete this organization"})]})]})}function Fa(){const{selectedOrg:a,members:r,invites:s,isLoading:l,error:c,setError:n,sendInvite:p,refreshInvites:d,revokeInvite:w,updateMemberRole:u,removeMember:j,refreshMembers:x}=W(),[o,S]=e.useState(""),[v,z]=e.useState("member"),[R,E]=e.useState(!1),[L,F]=e.useState(!1),[i,k]=e.useState(null),[$,N]=e.useState(""),[B,I]=e.useState(null);if(e.useEffect(()=>{a&&(x(a.id),d(a.id))},[a,x,d]),!a)return t.jsxs(t.Fragment,{children:[t.jsx("h3",{children:"People"}),t.jsxs("div",{className:"ss-auth-settings-empty",children:[t.jsx("span",{className:"material-symbols-outlined",children:y.group}),t.jsx("div",{children:"Select an organization from the user menu to manage members."})]})]});const m=async b=>{b.preventDefault(),F(!1),await p(a.id,o,v)&&(S(""),z("member"),F(!0),E(!1),d(a.id))},g=async()=>{if(!i)return;await u(a.id,i.userId,$)&&k(null)},h=async()=>{if(!B)return;await j(a.id,B.userId)&&I(null)},f=async b=>{await w(a.id,b)},C=b=>b==="owner"?"ss-auth-role-badge ss-auth-role-badge-owner":b==="admin"?"ss-auth-role-badge ss-auth-role-badge-admin":"ss-auth-role-badge ss-auth-role-badge-member";return t.jsxs(t.Fragment,{children:[t.jsx("h3",{children:"People"}),c&&t.jsxs("div",{className:"ss-auth-error",style:{marginBottom:"16px"},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.errorOutline}),t.jsx("span",{children:c})]}),L&&t.jsxs("div",{className:"ss-auth-info-box",style:{marginBottom:"16px"},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.check}),t.jsx("span",{children:"Invitation sent"})]}),t.jsxs("div",{className:"ss-auth-settings-card",children:[t.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:"16px"},children:[t.jsxs("h4",{style:{margin:0},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.group}),"Members"]}),t.jsxs("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",style:{width:"auto"},onClick:()=>E(!R),children:[t.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"16px"},children:y.add}),"Invite"]})]}),R&&t.jsx("form",{onSubmit:m,style:{marginBottom:"16px",padding:"16px",background:"rgba(0,0,0,0.05)",borderRadius:"8px"},children:t.jsxs("div",{style:{display:"flex",gap:"8px",alignItems:"flex-end"},children:[t.jsxs("div",{style:{flex:1},children:[t.jsx("label",{className:"ss-auth-label",children:"Email"}),t.jsx("input",{className:"ss-auth-input",type:"email",placeholder:"member@example.com",value:o,onChange:b=>S(b.target.value),required:!0})]}),t.jsxs("div",{style:{width:"120px"},children:[t.jsx("label",{className:"ss-auth-label",children:"Role"}),t.jsxs("select",{className:"ss-auth-input",value:v,onChange:b=>z(b.target.value),style:{cursor:"pointer"},children:[t.jsx("option",{value:"admin",children:"Admin"}),t.jsx("option",{value:"member",children:"Member"})]})]}),t.jsx("button",{type:"submit",className:"ss-auth-btn-primary ss-auth-btn-sm",disabled:l,style:{width:"auto",marginBottom:"0"},children:"Send"})]})}),r.length===0?t.jsx("div",{className:"ss-auth-settings-empty",style:{padding:"20px"},children:t.jsx("div",{children:"No members yet."})}):t.jsxs("table",{className:"ss-auth-settings-table",children:[t.jsx("thead",{children:t.jsxs("tr",{children:[t.jsx("th",{children:"Email"}),t.jsx("th",{children:"Role"}),t.jsx("th",{style:{width:"80px"},children:"Actions"})]})}),t.jsx("tbody",{children:r.map(b=>t.jsxs("tr",{children:[t.jsx("td",{children:b.email}),t.jsx("td",{children:t.jsx("span",{className:C(b.role),children:b.role})}),t.jsx("td",{children:b.role==="owner"?t.jsx("span",{style:{fontSize:"12px",opacity:.4},children:"—"}):t.jsxs("div",{className:"ss-auth-settings-actions",children:[t.jsx("button",{type:"button",className:"ss-auth-icon-btn",title:"Edit role",onClick:()=>{k(b),N(b.role)},children:t.jsx("span",{className:"material-symbols-outlined",children:y.edit})}),t.jsx("button",{type:"button",className:"ss-auth-icon-btn ss-auth-icon-btn-danger",title:"Remove member",onClick:()=>I(b),children:t.jsx("span",{className:"material-symbols-outlined",children:y.personRemove})})]})})]},b.userId))})]})]}),s.length>0&&t.jsxs("div",{className:"ss-auth-settings-card",children:[t.jsxs("h4",{children:[t.jsx("span",{className:"material-symbols-outlined",children:y.send}),"Pending Invites"]}),t.jsxs("table",{className:"ss-auth-settings-table",children:[t.jsx("thead",{children:t.jsxs("tr",{children:[t.jsx("th",{children:"Email"}),t.jsx("th",{children:"Role"}),t.jsx("th",{style:{width:"80px"},children:"Actions"})]})}),t.jsx("tbody",{children:s.map(b=>t.jsxs("tr",{children:[t.jsx("td",{children:b.email}),t.jsx("td",{children:t.jsx("span",{className:C(b.role),children:b.role})}),t.jsx("td",{children:t.jsx("button",{type:"button",className:"ss-auth-icon-btn ss-auth-icon-btn-danger",title:"Revoke invite",onClick:()=>f(b.id),children:t.jsx("span",{className:"material-symbols-outlined",children:y.close})})})]},b.id))})]})]}),i&&t.jsx("div",{className:"ss-auth-modal-overlay",onClick:b=>{b.target===b.currentTarget&&k(null)},children:t.jsxs("div",{className:"ss-auth-modal",style:{maxWidth:"400px"},children:[t.jsxs("div",{className:"ss-auth-modal-header",children:[t.jsx("h2",{children:"Edit Role"}),t.jsx("button",{type:"button",className:"ss-auth-modal-close",onClick:()=>k(null),children:t.jsx("span",{className:"material-symbols-outlined",children:y.close})})]}),t.jsxs("div",{className:"ss-auth-modal-body",children:[t.jsxs("p",{style:{fontSize:"14px",marginBottom:"16px",margin:"0 0 16px 0"},children:["Change role for ",t.jsx("strong",{children:i.email})]}),t.jsxs("div",{className:"ss-auth-field",children:[t.jsx("label",{className:"ss-auth-label",children:"Role"}),t.jsxs("select",{className:"ss-auth-input",value:$,onChange:b=>N(b.target.value),style:{cursor:"pointer"},children:[t.jsx("option",{value:"admin",children:"Admin"}),t.jsx("option",{value:"member",children:"Member"})]})]}),t.jsxs("div",{style:{display:"flex",gap:"8px",justifyContent:"flex-end"},children:[t.jsx("button",{type:"button",className:"ss-auth-btn-ghost",onClick:()=>k(null),children:"Cancel"}),t.jsx("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",style:{width:"auto"},onClick:g,children:"Save"})]})]})]})}),B&&t.jsx("div",{className:"ss-auth-modal-overlay",onClick:b=>{b.target===b.currentTarget&&I(null)},children:t.jsxs("div",{className:"ss-auth-modal",style:{maxWidth:"400px"},children:[t.jsxs("div",{className:"ss-auth-modal-header",children:[t.jsx("h2",{children:"Remove Member"}),t.jsx("button",{type:"button",className:"ss-auth-modal-close",onClick:()=>I(null),children:t.jsx("span",{className:"material-symbols-outlined",children:y.close})})]}),t.jsxs("div",{className:"ss-auth-modal-body",children:[t.jsxs("p",{style:{fontSize:"14px",margin:"0 0 16px 0"},children:["Are you sure you want to remove ",t.jsx("strong",{children:B.email})," from the organization?"]}),t.jsxs("div",{style:{display:"flex",gap:"8px",justifyContent:"flex-end"},children:[t.jsx("button",{type:"button",className:"ss-auth-btn-ghost",onClick:()=>I(null),children:"Cancel"}),t.jsx("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",style:{width:"auto",background:"linear-gradient(135deg, #ef4444, #dc2626)"},onClick:h,children:"Remove"})]})]})]})})]})}function Ba(){const{invites:a,isLoading:r,error:s,setError:l,accept:c,decline:n,refresh:p}=Q(),{refresh:d}=W(),[w,u]=e.useState(null),j=async o=>{u(o),l(null);const S=await c(o);u(null),S&&d()},x=async o=>{u(o),l(null),await n(o),u(null)};return t.jsxs(t.Fragment,{children:[t.jsx("h3",{children:"Invites"}),s&&t.jsxs("div",{className:"ss-auth-error",style:{marginBottom:"16px"},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.errorOutline}),t.jsx("span",{children:s})]}),r?t.jsx("div",{className:"ss-auth-settings-empty",style:{padding:"40px"},children:t.jsx("span",{className:"ss-auth-spinner"})}):a.length===0?t.jsxs("div",{className:"ss-auth-settings-empty",children:[t.jsx("span",{className:"material-symbols-outlined",children:y.mail}),t.jsx("div",{children:"No pending invitations"})]}):t.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"12px"},children:a.map(o=>t.jsx("div",{className:"ss-auth-settings-card",style:{marginBottom:0},children:t.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:"16px",flexWrap:"wrap"},children:[t.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"12px",flex:1,minWidth:0},children:[t.jsx("div",{className:"ss-auth-org-avatar",style:{width:"40px",height:"40px",fontSize:"14px",flexShrink:0},children:o.orgName.split(" ").map(S=>S[0]).join("").slice(0,2).toUpperCase()}),t.jsxs("div",{style:{minWidth:0},children:[t.jsx("div",{style:{fontWeight:600,fontSize:"14px",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:o.orgName}),t.jsxs("div",{style:{fontSize:"12px",opacity:.6,display:"flex",gap:"8px",alignItems:"center"},children:[t.jsx("span",{className:"ss-auth-role-badge ss-auth-role-badge-member",children:o.role}),t.jsxs("span",{children:["Expires ",new Date(o.expiresAt).toLocaleDateString()]})]})]})]}),t.jsxs("div",{style:{display:"flex",gap:"8px",flexShrink:0},children:[t.jsx("button",{type:"button",className:"ss-auth-btn-ghost",style:{padding:"6px 12px",fontSize:"13px"},onClick:()=>x(o.id),disabled:w===o.id,children:"Decline"}),t.jsxs("button",{type:"button",className:"ss-auth-btn-primary ss-auth-btn-sm",style:{width:"auto",padding:"6px 16px",fontSize:"13px"},onClick:()=>j(o.id),disabled:w===o.id,children:[w===o.id&&t.jsx("span",{className:"ss-auth-spinner"}),"Accept"]})]})]})},o.id))})]})}function Ta(){const{selectedOrg:a}=W();return a?t.jsxs(t.Fragment,{children:[t.jsx("h3",{children:"Billing"}),t.jsxs("div",{className:"ss-auth-settings-card",children:[t.jsxs("h4",{children:[t.jsx("span",{className:"material-symbols-outlined",children:y.creditCard}),"Plan & Billing"]}),t.jsx("div",{className:"ss-auth-settings-empty",style:{padding:"20px"},children:t.jsx("div",{children:"No billing plan configured for this organization."})})]})]}):t.jsxs(t.Fragment,{children:[t.jsx("h3",{children:"Billing"}),t.jsxs("div",{className:"ss-auth-settings-empty",children:[t.jsx("span",{className:"material-symbols-outlined",children:y.creditCard}),t.jsx("div",{children:"Select an organization from the user menu to manage billing."})]})]})}function Ma({appearance:a,afterSignOutUrl:r,afterDeleteAccountUrl:s,showOrgSwitcher:l=!0,onOrgChange:c,onOrgSettingsClick:n}){const{appearance:p}=V(),{user:d,signOut:w}=sa(),u=a??p,[j,x]=e.useState(!1),[o,S]=e.useState(!1),[v,z]=e.useState(""),[R,E]=e.useState(null),[L,F]=e.useState(!1),i=e.useRef(null),{orgs:k,selectedOrg:$,selectOrg:N,createOrg:B,refresh:I}=W(),{invites:m}=Q(),g=e.useCallback(f=>{i.current&&!f.composedPath().includes(i.current)&&x(!1)},[]);e.useEffect(()=>{if(j){const f=setTimeout(()=>{document.addEventListener("click",g)},0);return()=>{clearTimeout(f),document.removeEventListener("click",g)}}},[j,g]);const h=e.useCallback(async f=>{f.preventDefault(),E(null),F(!0);const C=v.toLowerCase().replace(/[^a-z0-9]+/g,"-").replace(/^-|-$/g,"");try{const b=await B(v,C);b&&(await N(b.id),c==null||c(b),z(""),x(!1))}catch(b){E(b instanceof Error?b.message:"Failed to create organization")}finally{F(!1)}},[v,B,N,c]);return d?t.jsx(ca,{appearance:u,children:t.jsxs("div",{style:{position:"relative",display:"inline-block"},ref:i,children:[t.jsxs("button",{type:"button",className:"ss-auth-user-trigger",onClick:()=>x(!j),"aria-label":"User menu",children:[t.jsxs("span",{className:"ss-auth-avatar-trigger",children:[d.avatarUrl?t.jsx("img",{src:d.avatarUrl,alt:""}):t.jsx("div",{style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",fontSize:"16px",fontWeight:700},children:(d.name||d.email).charAt(0).toUpperCase()}),m.length>0&&t.jsx("span",{className:"ss-auth-invite-badge",children:m.length})]}),$&&t.jsx("span",{className:"ss-auth-trigger-org-name",children:$.name})]}),j&&t.jsxs("div",{className:"ss-auth-dropdown ss-auth-glass-panel",style:{minWidth:"320px"},children:[t.jsxs("div",{className:"ss-auth-dropdown-header",children:[t.jsx("div",{className:"ss-auth-dropdown-avatar",children:d.avatarUrl?t.jsx("img",{src:d.avatarUrl,alt:""}):t.jsx("div",{style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",fontSize:"20px",fontWeight:800},children:(d.name||d.email).charAt(0).toUpperCase()})}),t.jsxs("div",{children:[d.name&&t.jsx("div",{className:"ss-auth-dropdown-name",children:d.name}),t.jsx("div",{className:"ss-auth-dropdown-email",children:d.email})]})]}),t.jsx("div",{style:{padding:"4px 8px"},children:t.jsxs("button",{type:"button",className:"ss-auth-dropdown-action",onClick:()=>{x(!1),S(!0)},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.settings}),"Settings"]})}),l&&t.jsxs(t.Fragment,{children:[t.jsx("div",{className:"ss-auth-section-label",children:"Organizations"}),t.jsx("div",{style:{padding:"0 8px 4px"},children:k.map(f=>{const C=($==null?void 0:$.id)===f.id,b=f.name.split(" ").map(H=>H[0]).join("").slice(0,2).toUpperCase();return t.jsxs("button",{type:"button",className:`ss-auth-org-item${C?" ss-auth-org-item-active":""}`,onClick:async()=>{x(!1),await N(f.id),c==null||c(f)},children:[t.jsxs("div",{className:"ss-auth-org-item-inner",children:[t.jsx("div",{className:`ss-auth-org-avatar${C?"":" ss-auth-org-avatar-inactive"}`,children:b}),t.jsx("span",{style:{fontFamily:"'Manrope', sans-serif",letterSpacing:"-0.01em"},children:f.name}),f.planName&&t.jsx("span",{className:"ss-auth-plan-badge",children:f.planName})]}),C&&t.jsx("span",{className:"material-symbols-outlined ss-auth-org-check",style:{fontSize:"18px"},children:y.checkCircle})]},f.id)})}),t.jsxs("div",{className:"ss-auth-inline-create",children:[R&&t.jsx("div",{className:"ss-auth-error",style:{marginBottom:"8px",fontSize:"12px"},children:t.jsx("span",{children:R})}),t.jsx("form",{onSubmit:h,children:t.jsxs("div",{className:"ss-auth-inline-create-input",children:[t.jsx("input",{className:"ss-auth-input",type:"text",placeholder:"New organization name",value:v,onChange:f=>z(f.target.value),required:!0,style:{fontSize:"13px",padding:"10px 40px 10px 12px"}}),t.jsx("button",{type:"submit",className:"ss-auth-inline-create-btn",disabled:L||!v.trim(),children:t.jsx("span",{className:"material-symbols-outlined",style:{fontSize:"20px"},children:y.add})})]})})]}),$&&n&&t.jsx("div",{style:{padding:"0 8px 4px"},children:t.jsxs("button",{type:"button",className:"ss-auth-dropdown-action",onClick:()=>{x(!1),n($)},children:[t.jsx("span",{className:"material-symbols-outlined",children:y.corporateFare}),"Org settings"]})})]}),t.jsx("div",{className:"ss-auth-signout-section",style:{padding:"8px"},children:t.jsxs("button",{type:"button",className:"ss-auth-dropdown-action",onClick:async()=>{x(!1),await w(),r&&(window.location.href=r)},style:{color:"inherit"},children:[t.jsx("span",{className:"material-symbols-outlined",style:{color:"inherit"},children:y.logout}),"Sign out"]})})]}),o&&t.jsx(xa,{onClose:()=>S(!1),afterDeleteAccountUrl:s,onOrgDeleted:I,onOrgUpdated:I})]})}):null}exports.SaaSError=J.SaaSError;exports.SaaSSupport=J.SaaSSupport;exports.isMfaRequired=J.isMfaRequired;exports.SaaSContext=ta;exports.SaaSProvider=va;exports.SettingsPanel=xa;exports.SignIn=za;exports.UserButton=Ma;exports.useAuth=sa;exports.useDeleteAccount=pa;exports.useInvites=Q;exports.useOrg=W;exports.useProfile=ha;exports.useSaaSContext=V;exports.useSignIn=da;exports.useSignUp=ua;exports.useUser=$a;