chordia-ui 3.3.1 → 3.3.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chordia-ui",
-  "version": "3.3.1",
+  "version": "3.3.2",
   "description": "Chordia Design System - UI components, tokens, and Tailwind preset",
   "type": "module",
   "main": "dist/index.cjs.js",

package/src/components/common/FileUploadingState.jsx

@@ -153,7 +153,7 @@ export default function FileUploadingState({
  */
 export function FileUploadSuccessState({
   title = "File uploaded successfully!",
-  subtitle = "13 files have been uploaded to your project",
+  subtitle = "Redirecting...",
   actionLabel = "Add more files",
   onAction,
   width = 648,
@@ -210,15 +210,15 @@ export function FileUploadSuccessState({
       {/* Subtitle */}
       <p
         style={{
-          fontSize: "13px",
-          fontWeight: 400,
+          fontSize: "14px",
+          fontWeight: 500,
           color: "var(--Grey-Strong, #808183)",
           margin: 0,
           lineHeight: "140%",
           textAlign: "center",
         }}
       >
-        {/* {subtitle} */}
+        {subtitle}
       </p>
 
       {/* Action button */}

package/src/components/login/LoginPage.jsx

@@ -180,6 +180,7 @@ export default function LoginPage({
   const [signupConfirm, setSignupConfirm] = useState('');
   const [showSignupPassword, setShowSignupPassword] = useState(false);
   const [showSignupConfirm, setShowSignupConfirm] = useState(false);
+  const [signupError, setSignupError] = useState('');
   const [resetEmail, setResetEmail] = useState('');
   const [activeSlide, setActiveSlide] = useState(0);
   const SLIDE_COUNT = 3;
@@ -513,7 +514,7 @@ export default function LoginPage({
                 <Field label="Create Password" gap={8}>
                   <div style={{ position: 'relative' }}>
                     <input type={showSignupPassword ? 'text' : 'password'} value={signupPassword}
-                      onChange={(e) => setSignupPassword(e.target.value)}
+                      onChange={(e) => { setSignupPassword(e.target.value); setSignupError(''); }}
                       placeholder="Enter password" autoComplete="new-password"
                       style={{ ...inputBase, padding: '10px 44px 10px 14px' }}
                       onFocus={focusGreen} onBlur={blurGray} />
@@ -524,7 +525,7 @@ export default function LoginPage({
                 <Field label="Confirm Password" gap={8}>
                   <div style={{ position: 'relative' }}>
                     <input type={showSignupConfirm ? 'text' : 'password'} value={signupConfirm}
-                      onChange={(e) => setSignupConfirm(e.target.value)}
+                      onChange={(e) => { setSignupConfirm(e.target.value); setSignupError(''); }}
                       placeholder="Enter password" autoComplete="new-password"
                       style={{ ...inputBase, padding: '10px 44px 10px 14px' }}
                       onFocus={focusGreen} onBlur={blurGray} />
@@ -532,10 +533,27 @@ export default function LoginPage({
                   </div>
                 </Field>
 
+                {signupError && (
+                  <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', padding: 8, gap: 6, width: '100%', boxSizing: 'border-box', background: 'var(--color-error-bg)', borderRadius: 5, fontSize: 15, fontWeight: 400, lineHeight: '22px', color: 'var(--color-text)', fontFamily: FF }}>
+                    <svg width="17" height="17" viewBox="0 0 24 24" fill="var(--color-text)" style={{ flexShrink: 0 }}>
+                      <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"/>
+                    </svg>
+                    {signupError}
+                  </div>
+                )}
+
                 {(() => {
                   const canCreate = firstName && lastName && signupEmail && signupPassword && signupConfirm;
                   return (
-                    <GreenButton onClick={() => { onSignUp?.({ firstName, lastName, email: signupEmail, password: signupPassword }); setView('verifyemail'); }} disabled={!canCreate}>
+                    <GreenButton onClick={() => {
+                      setSignupError('');
+                      if (signupPassword !== signupConfirm) {
+                        setSignupError('Password and Confirm Password do not match!');
+                        return;
+                      }
+                      onSignUp?.({ firstName, lastName, email: signupEmail, password: signupPassword });
+                      setView('verifyemail');
+                    }} disabled={!canCreate}>
                       Create Account
                     </GreenButton>
                   );