@papernote/ui 1.12.0 → 1.13.0

package/dist/styles.css

@@ -4739,6 +4739,10 @@ input:checked + .slider:before{
   letter-spacing: 0.05em;
 }
 
+.tracking-widest{
+  letter-spacing: 0.1em;
+}
+
 .text-accent-200{
   --tw-text-opacity: 1;
   color: rgb(232 231 224 / var(--tw-text-opacity, 1));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@papernote/ui",
-  "version": "1.12.0",
+  "version": "1.13.0",
   "type": "module",
   "description": "A modern React component library with a paper notebook aesthetic - minimal, professional, and expressive",
   "main": "dist/index.js",

package/src/components/AdminModal.tsx

@@ -109,6 +109,7 @@ export function AdminModal({
             className="flex-1 overflow-y-auto min-h-0 h-0 px-6 py-6 admin-modal-form"
             onSubmit={handleFormSubmit}
             id={formId}
+            noValidate
           >
             {activeTab?.content || children}
           </form>

package/src/components/Sidebar.tsx

@@ -331,8 +331,26 @@ export default function Sidebar({
       {/* Navigation */}
       <nav className="flex-1 px-3 py-2 space-y-1 overflow-y-auto">
         {items.map((item) => {
-          // Render separator
+          // Render separator or section header
           if (item.separator) {
+            // Section header: separator with a label
+            if (item.label) {
+              return (
+                <div
+                  key={item.id}
+                  className="mt-6 mb-2 px-3"
+                  data-testid={item.dataAttributes?.['data-testid'] || `sidebar-section-${item.id}`}
+                  {...item.dataAttributes}
+                >
+                  <div className="border-t border-paper-300 pt-3">
+                    <span className="text-[10px] font-semibold uppercase tracking-widest text-ink-400">
+                      {item.label}
+                    </span>
+                  </div>
+                </div>
+              );
+            }
+            // Plain separator: just a line
             return (
               <div
                 key={item.id}