chore: add formatting

2026-06-01 21:34:05 +00:00
parent f64d5a73d2
commit 6cc028305a
21 changed files with 542 additions and 177 deletions
@@ -22,9 +22,30 @@ type DrawingSidebarProps = {
 function DrawerIcon() {
  return (
    <svg viewBox="0 0 24 24" aria-hidden="true">
-      <rect x="3.5" y="5" width="17" height="14" rx="2.5" fill="none" stroke="currentColor" strokeWidth="1.8" />
-      <path d="M9 5v14" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
-      <path d="M5.75 9h1.5M5.75 12h1.5M5.75 15h1.5" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" />
+      <rect
+        x="3.5"
+        y="5"
+        width="17"
+        height="14"
+        rx="2.5"
+        fill="none"
+        stroke="currentColor"
+        strokeWidth="1.8"
+      />
+      <path
+        d="M9 5v14"
+        fill="none"
+        stroke="currentColor"
+        strokeWidth="1.8"
+        strokeLinecap="round"
+      />
+      <path
+        d="M5.75 9h1.5M5.75 12h1.5M5.75 15h1.5"
+        fill="none"
+        stroke="currentColor"
+        strokeWidth="1.8"
+        strokeLinecap="round"
+      />
    </svg>
  );
 }
@@ -62,23 +83,35 @@ export function DrawingSidebar({
  onDisablePublication,
 }: DrawingSidebarProps) {
  const publicPath = publication.enabled ? `/p/${publication.slug}` : null;
-  const publicationStatus = publication.enabled ? `Published at ${publicPath}` : "Not published";
+  const publicationStatus = publication.enabled
+    ? `Published at ${publicPath}`
+    : "Not published";

  return (
    <>
      <div
-        className={open ? "sidebar-backdrop sidebar-backdrop-open" : "sidebar-backdrop"}
+        className={
+          open ? "sidebar-backdrop sidebar-backdrop-open" : "sidebar-backdrop"
+        }
        onClick={onClose}
        aria-hidden={!open}
      />
-      <aside className={open ? "sidebar sidebar-open" : "sidebar"} aria-hidden={!open}>
+      <aside
+        className={open ? "sidebar sidebar-open" : "sidebar"}
+        aria-hidden={!open}
+      >
        <div className="sidebar-header">
          <h1>excali-box</h1>
          <div className="sidebar-actions">
            <button type="button" className="primary-button" onClick={onCreate}>
              New
            </button>
-            <button type="button" className="icon-button" onClick={onClose} aria-label="Close drawings">
+            <button
+              type="button"
+              className="icon-button"
+              onClick={onClose}
+              aria-label="Close drawings"
+            >
              ×
            </button>
          </div>
@@ -87,7 +120,11 @@ export function DrawingSidebar({
          {drawings.map((drawing) => (
            <div
              key={drawing.id}
-              className={drawing.id === activeId ? "drawing-item drawing-item-active" : "drawing-item"}
+              className={
+                drawing.id === activeId
+                  ? "drawing-item drawing-item-active"
+                  : "drawing-item"
+              }
            >
              {drawing.id === activeId ? (
                <div className="drawing-link drawing-link-active">
@@ -113,20 +150,30 @@ export function DrawingSidebar({
                    </button>
                  </div>
                  <div className="publication-panel">
-                    <label className="publication-label" htmlFor="publication-slug">
+                    <label
+                      className="publication-label"
+                      htmlFor="publication-slug"
+                    >
                      Public name
                    </label>
                    <input
                      id="publication-slug"
                      className="title-input publication-input"
                      value={publicationSlug}
-                      onChange={(event) => onPublicationSlugChange(event.target.value)}
+                      onChange={(event) =>
+                        onPublicationSlugChange(event.target.value)
+                      }
                      spellCheck={false}
                      autoCapitalize="none"
                      autoCorrect="off"
                    />
                    <div className="publication-actions">
-                      <button type="button" className="secondary-button" onClick={onPublish} disabled={publicationBusy}>
+                      <button
+                        type="button"
+                        className="secondary-button"
+                        onClick={onPublish}
+                        disabled={publicationBusy}
+                      >
                        {publication.enabled ? "Update link" : "Publish"}
                      </button>
                      <button
@@ -140,7 +187,12 @@ export function DrawingSidebar({
                    </div>
                    <div className="publication-status">
                      {publication.enabled ? (
-                        <a href={publicPath ?? "#"} target="_blank" rel="noreferrer" className="publication-link">
+                        <a
+                          href={publicPath ?? "#"}
+                          target="_blank"
+                          rel="noreferrer"
+                          className="publication-link"
+                        >
                          {publicationStatus}
                        </a>
                      ) : (
@@ -150,7 +202,11 @@ export function DrawingSidebar({
                  </div>
                </div>
              ) : (
-                <button type="button" className="drawing-link" onClick={() => onSelect(drawing.id)}>
+                <button
+                  type="button"
+                  className="drawing-link"
+                  onClick={() => onSelect(drawing.id)}
+                >
                  <span className="drawing-title">{drawing.title}</span>
                </button>
              )}