@majapisoftwares/ui 6.0.0 → 6.1.2

package/src/patterns/details-sheet.tsx

@@ -1,53 +1,54 @@
-"use client";
-
-import type { ReactNode } from "react";
-import {
-  Sheet,
-  SheetContent,
-  SheetHeader,
-  SheetTitle,
-  SheetDescription,
-} from "../components/ui/sheet";
-export function DetailsSheet({
-  open,
-  onOpenChange,
-  title,
-  description,
-  children,
-}: {
-  open: boolean;
-  onOpenChange: (open: boolean) => void;
-  title: string;
-  description?: string;
-  children: ReactNode;
-}) {
-  return (
-    <Sheet open={open} onOpenChange={onOpenChange}>
-      <SheetContent className="overflow-y-auto">
-        <SheetHeader>
-          <SheetTitle>{title}</SheetTitle>
-          {description ? (
-            <SheetDescription>{description}</SheetDescription>
-          ) : null}
-        </SheetHeader>
-        <div className="px-4 pb-8">{children}</div>
-      </SheetContent>
-    </Sheet>
-  );
-}
-export function DetailList({
-  items,
-}: {
-  items: { label: string; value: ReactNode }[];
-}) {
-  return (
-    <dl className="grid gap-4 text-sm">
-      {items.map((item) => (
-        <div key={item.label} className="grid gap-1">
-          <dt className="text-muted-foreground">{item.label}</dt>
-          <dd className="font-medium break-words">{item.value}</dd>
-        </div>
-      ))}
-    </dl>
-  );
-}
+"use client";
+
+import type { ReactNode } from "react";
+import {
+  Sheet,
+  SheetContent,
+  SheetHeader,
+  SheetTitle,
+  SheetDescription,
+} from "../components/ui/sheet";
+export function DetailsSheet({
+  open,
+  onOpenChange,
+  title,
+  description,
+  children,
+}: {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  title: string;
+  description?: string;
+  children: ReactNode;
+}) {
+  return (
+    <Sheet open={open} onOpenChange={onOpenChange}>
+      <SheetContent className="overflow-y-auto">
+        <SheetHeader>
+          <SheetTitle>{title}</SheetTitle>
+          {description ? (
+            <SheetDescription>{description}</SheetDescription>
+          ) : null}
+        </SheetHeader>
+        {/* Same inset as SheetHeader (p-6). */}
+        <div className="px-6 pb-8">{children}</div>
+      </SheetContent>
+    </Sheet>
+  );
+}
+export function DetailList({
+  items,
+}: {
+  items: { label: string; value: ReactNode }[];
+}) {
+  return (
+    <dl className="grid gap-4 text-sm">
+      {items.map((item) => (
+        <div key={item.label} className="grid gap-1">
+          <dt className="text-muted-foreground">{item.label}</dt>
+          <dd className="font-medium break-words">{item.value}</dd>
+        </div>
+      ))}
+    </dl>
+  );
+}

package/src/patterns/filter-tabs.tsx

@@ -1,53 +1,53 @@
-"use client";
-
-import type * as React from "react";
-
-import { Badge } from "../components/ui/badge";
-import { Tabs, TabsList, TabsTrigger } from "../components/ui/tabs";
-import { cn } from "cn";
-
-export type FilterTabOption = {
-  count?: number;
-  label: React.ReactNode;
-  value: string;
-};
-
-export function FilterTabs({
-  className,
-  onValueChange,
-  options,
-  value,
-}: {
-  className?: string;
-  onValueChange: (value: string) => void;
-  options: FilterTabOption[];
-  value: string;
-}) {
-  return (
-    <Tabs
-      value={value}
-      onValueChange={onValueChange}
-      className={cn("min-w-0 max-w-full", className)}
-    >
-      <TabsList className="max-w-full flex-wrap justify-start gap-y-1 group-data-horizontal/tabs:h-auto">
-        {options.map((option) => (
-          <TabsTrigger
-            key={option.value}
-            value={option.value}
-            className="flex-none"
-          >
-            {option.label}
-            {typeof option.count === "number" && (
-              <Badge
-                className="min-w-5 px-1.5 tabular-nums"
-                variant="secondary"
-              >
-                {option.count}
-              </Badge>
-            )}
-          </TabsTrigger>
-        ))}
-      </TabsList>
-    </Tabs>
-  );
-}
+"use client";
+
+import type * as React from "react";
+
+import { Badge } from "../components/ui/badge";
+import { Tabs, TabsList, TabsTrigger } from "../components/ui/tabs";
+import { cn } from "cn";
+
+export type FilterTabOption = {
+  count?: number;
+  label: React.ReactNode;
+  value: string;
+};
+
+export function FilterTabs({
+  className,
+  onValueChange,
+  options,
+  value,
+}: {
+  className?: string;
+  onValueChange: (value: string) => void;
+  options: FilterTabOption[];
+  value: string;
+}) {
+  return (
+    <Tabs
+      value={value}
+      onValueChange={onValueChange}
+      className={cn("min-w-0 max-w-full", className)}
+    >
+      <TabsList className="max-w-full flex-wrap justify-start gap-y-1 group-data-horizontal/tabs:h-auto">
+        {options.map((option) => (
+          <TabsTrigger
+            key={option.value}
+            value={option.value}
+            className="flex-none"
+          >
+            {option.label}
+            {typeof option.count === "number" && (
+              <Badge
+                className="min-w-5 px-1.5 tabular-nums"
+                variant="secondary"
+              >
+                {option.count}
+              </Badge>
+            )}
+          </TabsTrigger>
+        ))}
+      </TabsList>
+    </Tabs>
+  );
+}

package/src/patterns/majapi-logo.tsx

@@ -1,32 +1,32 @@
-import type { SVGProps } from "react";
-import { cn } from "cn";
-
-const MARK =
-  "M25.9083 4.2714C25.7631 4.43736 25.6179 4.60332 25.4727 4.76929C25.3274 4.9145 25.2133 5.07009 25.1304 5.23605C24.5495 6.19033 23.8442 7.22758 23.0144 8.34782C22.2053 9.46805 21.2821 10.6194 20.2449 11.8019C19.2076 12.9843 18.077 14.1461 16.8531 15.2871C15.6499 16.428 14.3533 17.4964 12.9634 18.4922L11.0341 16.7807C12.2995 15.9094 13.482 14.9655 14.5815 13.949C15.681 12.9325 16.6871 11.9056 17.5999 10.8683C18.5334 9.81035 19.3425 8.80421 20.0271 7.84993C20.7324 6.89566 21.2821 6.04511 21.6763 5.29829C21.2821 5.29829 20.6909 5.29829 19.9026 5.29829C19.1143 5.29829 18.2015 5.29829 17.1642 5.29829C16.127 5.29829 15.0275 5.29829 13.8658 5.29829C12.7248 5.29829 11.5838 5.29829 10.4428 5.29829C9.32259 5.29829 8.27497 5.29829 7.29995 5.29829C6.32493 5.29829 5.48475 5.29829 4.77941 5.29829C4.09483 5.29829 3.62806 5.29829 3.37912 5.29829C2.98496 5.29829 2.58043 5.30866 2.16553 5.3294C1.75063 5.35015 1.36685 5.37089 1.01418 5.39164C0.682256 5.41238 0.41257 5.4435 0.205119 5.48499V2.6844C0.495551 2.72589 0.8171 2.76738 1.16977 2.80887C1.52243 2.85036 1.88547 2.88148 2.25888 2.90223C2.65304 2.92297 3.02645 2.93334 3.37912 2.93334C3.60732 2.93334 4.05334 2.93334 4.71718 2.93334C5.40177 2.93334 6.23157 2.93334 7.20659 2.93334C8.18161 2.93334 9.22924 2.93334 10.3495 2.93334C11.4905 2.93334 12.6418 2.93334 13.8035 2.93334C14.986 2.93334 16.1062 2.93334 17.1642 2.93334C18.243 2.93334 19.1973 2.93334 20.0271 2.93334C20.8569 2.93334 21.4896 2.93334 21.9252 2.93334C22.8173 2.93334 23.4915 2.85036 23.9479 2.6844L25.9083 4.2714ZM11.2519 19.0523C10.7748 18.5752 10.2146 18.0462 9.57153 17.4653C8.94918 16.8844 8.29571 16.3036 7.61112 15.7227C6.92653 15.1211 6.28344 14.5817 5.68183 14.1046C5.08022 13.6067 4.56159 13.2125 4.12594 12.9221L6.14859 11.2729C6.50126 11.5426 6.96802 11.916 7.54889 12.3931C8.12975 12.8495 8.76248 13.3681 9.44706 13.949C10.1524 14.5299 10.8474 15.1211 11.5319 15.7227C12.2165 16.3243 12.8389 16.9052 13.399 17.4653C14.0628 18.0876 14.7474 18.7722 15.4528 19.5191C16.1789 20.2659 16.8634 20.992 17.5065 21.6973C18.1496 22.4026 18.689 23.0354 19.1247 23.5955L16.8531 25.4003C16.4797 24.8609 15.9714 24.2282 15.3283 23.5021C14.7059 22.7553 14.0317 21.9981 13.3057 21.2305C12.5796 20.4422 11.895 19.7161 11.2519 19.0523Z";
-const TEXT =
-  "M55.2228 24.3057H52.6089L51.9555 13.1033C51.831 11.1325 51.7688 8.54976 51.7688 5.35501L48.1591 20.4471H45.4519L41.5933 5.35501C41.6348 6.10183 41.6555 7.0976 41.6555 8.3423C41.6555 10.2509 41.614 11.8379 41.5311 13.1033L40.9709 24.3057H38.4193L39.6329 2.8656H43.3981L46.8833 17.5531L50.2129 2.8656H54.0092L55.2228 24.3057ZM71.0184 20.7271C71.0184 21.3702 71.1222 21.8474 71.3296 22.1585C71.5371 22.449 71.8794 22.6668 72.3565 22.812L71.703 24.6791C70.1057 24.4716 69.1099 23.6937 68.7157 22.3453C68.1349 23.0921 67.3984 23.6626 66.5064 24.0567C65.6351 24.4509 64.6601 24.648 63.5813 24.648C61.9425 24.648 60.6459 24.1916 59.6916 23.2788C58.7581 22.366 58.2913 21.142 58.2913 19.6069C58.2913 17.9265 58.9448 16.63 60.2517 15.7172C61.5794 14.8044 63.4776 14.348 65.9463 14.348H68.3734V13.01C68.3734 11.8482 68.0415 11.0184 67.3777 10.5205C66.7138 10.0019 65.7492 9.7426 64.4837 9.7426C63.239 9.7426 61.818 10.0227 60.2206 10.5828L59.5049 8.59125C61.4342 7.90666 63.2287 7.56436 64.8883 7.56436C66.8798 7.56436 68.3942 8.03113 69.4314 8.96466C70.4894 9.89819 71.0184 11.1948 71.0184 12.8544V20.7271ZM64.2348 22.6875C65.0439 22.6875 65.8114 22.4801 66.5375 22.0652C67.2843 21.6503 67.8963 21.0798 68.3734 20.3537V16.1528H66.0085C64.2659 16.1528 63.0108 16.4433 62.2433 17.0241C61.4757 17.605 61.0919 18.4555 61.0919 19.5758C61.0919 21.6503 62.1395 22.6875 64.2348 22.6875ZM86.2228 0.251712C86.7829 0.251712 87.2393 0.428046 87.592 0.780713C87.9447 1.11264 88.121 1.54828 88.121 2.08765C88.121 2.62703 87.9447 3.07305 87.592 3.42572C87.2393 3.75764 86.7829 3.9236 86.2228 3.9236C85.6627 3.9236 85.2063 3.75764 84.8536 3.42572C84.501 3.07305 84.3246 2.62703 84.3246 2.08765C84.3246 1.54828 84.501 1.11264 84.8536 0.780713C85.2063 0.428046 85.6627 0.251712 86.2228 0.251712ZM88.65 21.6918C88.65 24.3264 87.7683 26.3698 86.005 27.822C84.2624 29.2949 81.6693 30.3217 78.2256 30.9026L77.7899 28.88C80.4246 28.4443 82.4576 27.6767 83.889 26.5773C85.3204 25.4985 86.0361 23.9219 86.0361 21.8474V9.99154H79.2214V7.90666H88.65V21.6918ZM108.335 20.7271C108.335 21.3702 108.439 21.8474 108.647 22.1585C108.854 22.449 109.196 22.6668 109.673 22.812L109.02 24.6791C107.423 24.4716 106.427 23.6937 106.033 22.3453C105.452 23.0921 104.715 23.6626 103.823 24.0567C102.952 24.4509 101.977 24.648 100.898 24.648C99.2593 24.648 97.9628 24.1916 97.0085 23.2788C96.075 22.366 95.6082 21.142 95.6082 19.6069C95.6082 17.9265 96.2617 16.63 97.5686 15.7172C98.8963 14.8044 100.794 14.348 103.263 14.348H105.69V13.01C105.69 11.8482 105.358 11.0184 104.695 10.5205C104.031 10.0019 103.066 9.7426 101.801 9.7426C100.556 9.7426 99.1349 10.0227 97.5375 10.5828L96.8218 8.59125C98.7511 7.90666 100.546 7.56436 102.205 7.56436C104.197 7.56436 105.711 8.03113 106.748 8.96466C107.806 9.89819 108.335 11.1948 108.335 12.8544V20.7271ZM101.552 22.6875C102.361 22.6875 103.128 22.4801 103.854 22.0652C104.601 21.6503 105.213 21.0798 105.69 20.3537V16.1528H103.325C101.583 16.1528 100.328 16.4433 99.5601 17.0241C98.7926 17.605 98.4088 18.4555 98.4088 19.5758C98.4088 21.6503 99.4564 22.6875 101.552 22.6875ZM122.575 7.56436C126.537 7.56436 128.519 10.4064 128.519 16.0906C128.519 18.6837 127.979 20.7583 126.9 22.3141C125.822 23.87 124.255 24.648 122.202 24.648C120.418 24.648 118.965 24.0256 117.845 22.7809V30.5914L115.231 30.9026V7.90666H117.472L117.69 10.2094C118.291 9.35881 119.007 8.70534 119.837 8.24895C120.687 7.79256 121.6 7.56436 122.575 7.56436ZM121.953 9.68036C121.123 9.68036 120.355 9.92931 119.65 10.4272C118.965 10.9251 118.364 11.5474 117.845 12.2942V20.416C118.281 21.0591 118.82 21.5673 119.463 21.9407C120.127 22.2934 120.843 22.4697 121.61 22.4697C122.98 22.4697 123.996 21.9511 124.66 20.9138C125.345 19.8558 125.687 18.2481 125.687 16.0906C125.687 13.9331 125.386 12.3254 124.784 11.2674C124.183 10.2094 123.239 9.68036 121.953 9.68036ZM140.113 0.251712C140.694 0.251712 141.161 0.428046 141.514 0.780713C141.866 1.11264 142.043 1.54828 142.043 2.08765C142.043 2.62703 141.866 3.07305 141.514 3.42572C141.161 3.75764 140.694 3.9236 140.113 3.9236C139.553 3.9236 139.097 3.75764 138.744 3.42572C138.412 3.07305 138.246 2.62703 138.246 2.08765C138.246 1.54828 138.412 1.11264 138.744 0.780713C139.097 0.428046 139.553 0.251712 140.113 0.251712ZM142.198 22.2208H146.804V24.3057H134.543V22.2208H139.584V9.99154H134.699V7.90666H142.198V22.2208Z";
-
-/**
- * Majapi logo in the current text color; `mark` is the マ symbol alone.
- * Size it by height only (e.g. `h-6`); the width follows the aspect ratio.
- */
-export function MajapiLogo({
-  variant = "full",
-  className,
-  ...props
-}: SVGProps<SVGSVGElement> & { variant?: "full" | "mark" }) {
-  return (
-    <svg
-      viewBox={variant === "mark" ? "0 0 27 31" : "0 0 147 31"}
-      fill="currentColor"
-      role="img"
-      aria-label="Majapi"
-      preserveAspectRatio="xMinYMid meet"
-      className={cn("h-5 w-auto shrink-0", className)}
-      {...props}
-    >
-      <path d={MARK} />
-      {variant === "full" ? <path d={TEXT} /> : null}
-    </svg>
-  );
-}
+import type { SVGProps } from "react";
+import { cn } from "cn";
+
+const MARK =
+  "M25.9083 4.2714C25.7631 4.43736 25.6179 4.60332 25.4727 4.76929C25.3274 4.9145 25.2133 5.07009 25.1304 5.23605C24.5495 6.19033 23.8442 7.22758 23.0144 8.34782C22.2053 9.46805 21.2821 10.6194 20.2449 11.8019C19.2076 12.9843 18.077 14.1461 16.8531 15.2871C15.6499 16.428 14.3533 17.4964 12.9634 18.4922L11.0341 16.7807C12.2995 15.9094 13.482 14.9655 14.5815 13.949C15.681 12.9325 16.6871 11.9056 17.5999 10.8683C18.5334 9.81035 19.3425 8.80421 20.0271 7.84993C20.7324 6.89566 21.2821 6.04511 21.6763 5.29829C21.2821 5.29829 20.6909 5.29829 19.9026 5.29829C19.1143 5.29829 18.2015 5.29829 17.1642 5.29829C16.127 5.29829 15.0275 5.29829 13.8658 5.29829C12.7248 5.29829 11.5838 5.29829 10.4428 5.29829C9.32259 5.29829 8.27497 5.29829 7.29995 5.29829C6.32493 5.29829 5.48475 5.29829 4.77941 5.29829C4.09483 5.29829 3.62806 5.29829 3.37912 5.29829C2.98496 5.29829 2.58043 5.30866 2.16553 5.3294C1.75063 5.35015 1.36685 5.37089 1.01418 5.39164C0.682256 5.41238 0.41257 5.4435 0.205119 5.48499V2.6844C0.495551 2.72589 0.8171 2.76738 1.16977 2.80887C1.52243 2.85036 1.88547 2.88148 2.25888 2.90223C2.65304 2.92297 3.02645 2.93334 3.37912 2.93334C3.60732 2.93334 4.05334 2.93334 4.71718 2.93334C5.40177 2.93334 6.23157 2.93334 7.20659 2.93334C8.18161 2.93334 9.22924 2.93334 10.3495 2.93334C11.4905 2.93334 12.6418 2.93334 13.8035 2.93334C14.986 2.93334 16.1062 2.93334 17.1642 2.93334C18.243 2.93334 19.1973 2.93334 20.0271 2.93334C20.8569 2.93334 21.4896 2.93334 21.9252 2.93334C22.8173 2.93334 23.4915 2.85036 23.9479 2.6844L25.9083 4.2714ZM11.2519 19.0523C10.7748 18.5752 10.2146 18.0462 9.57153 17.4653C8.94918 16.8844 8.29571 16.3036 7.61112 15.7227C6.92653 15.1211 6.28344 14.5817 5.68183 14.1046C5.08022 13.6067 4.56159 13.2125 4.12594 12.9221L6.14859 11.2729C6.50126 11.5426 6.96802 11.916 7.54889 12.3931C8.12975 12.8495 8.76248 13.3681 9.44706 13.949C10.1524 14.5299 10.8474 15.1211 11.5319 15.7227C12.2165 16.3243 12.8389 16.9052 13.399 17.4653C14.0628 18.0876 14.7474 18.7722 15.4528 19.5191C16.1789 20.2659 16.8634 20.992 17.5065 21.6973C18.1496 22.4026 18.689 23.0354 19.1247 23.5955L16.8531 25.4003C16.4797 24.8609 15.9714 24.2282 15.3283 23.5021C14.7059 22.7553 14.0317 21.9981 13.3057 21.2305C12.5796 20.4422 11.895 19.7161 11.2519 19.0523Z";
+const TEXT =
+  "M55.2228 24.3057H52.6089L51.9555 13.1033C51.831 11.1325 51.7688 8.54976 51.7688 5.35501L48.1591 20.4471H45.4519L41.5933 5.35501C41.6348 6.10183 41.6555 7.0976 41.6555 8.3423C41.6555 10.2509 41.614 11.8379 41.5311 13.1033L40.9709 24.3057H38.4193L39.6329 2.8656H43.3981L46.8833 17.5531L50.2129 2.8656H54.0092L55.2228 24.3057ZM71.0184 20.7271C71.0184 21.3702 71.1222 21.8474 71.3296 22.1585C71.5371 22.449 71.8794 22.6668 72.3565 22.812L71.703 24.6791C70.1057 24.4716 69.1099 23.6937 68.7157 22.3453C68.1349 23.0921 67.3984 23.6626 66.5064 24.0567C65.6351 24.4509 64.6601 24.648 63.5813 24.648C61.9425 24.648 60.6459 24.1916 59.6916 23.2788C58.7581 22.366 58.2913 21.142 58.2913 19.6069C58.2913 17.9265 58.9448 16.63 60.2517 15.7172C61.5794 14.8044 63.4776 14.348 65.9463 14.348H68.3734V13.01C68.3734 11.8482 68.0415 11.0184 67.3777 10.5205C66.7138 10.0019 65.7492 9.7426 64.4837 9.7426C63.239 9.7426 61.818 10.0227 60.2206 10.5828L59.5049 8.59125C61.4342 7.90666 63.2287 7.56436 64.8883 7.56436C66.8798 7.56436 68.3942 8.03113 69.4314 8.96466C70.4894 9.89819 71.0184 11.1948 71.0184 12.8544V20.7271ZM64.2348 22.6875C65.0439 22.6875 65.8114 22.4801 66.5375 22.0652C67.2843 21.6503 67.8963 21.0798 68.3734 20.3537V16.1528H66.0085C64.2659 16.1528 63.0108 16.4433 62.2433 17.0241C61.4757 17.605 61.0919 18.4555 61.0919 19.5758C61.0919 21.6503 62.1395 22.6875 64.2348 22.6875ZM86.2228 0.251712C86.7829 0.251712 87.2393 0.428046 87.592 0.780713C87.9447 1.11264 88.121 1.54828 88.121 2.08765C88.121 2.62703 87.9447 3.07305 87.592 3.42572C87.2393 3.75764 86.7829 3.9236 86.2228 3.9236C85.6627 3.9236 85.2063 3.75764 84.8536 3.42572C84.501 3.07305 84.3246 2.62703 84.3246 2.08765C84.3246 1.54828 84.501 1.11264 84.8536 0.780713C85.2063 0.428046 85.6627 0.251712 86.2228 0.251712ZM88.65 21.6918C88.65 24.3264 87.7683 26.3698 86.005 27.822C84.2624 29.2949 81.6693 30.3217 78.2256 30.9026L77.7899 28.88C80.4246 28.4443 82.4576 27.6767 83.889 26.5773C85.3204 25.4985 86.0361 23.9219 86.0361 21.8474V9.99154H79.2214V7.90666H88.65V21.6918ZM108.335 20.7271C108.335 21.3702 108.439 21.8474 108.647 22.1585C108.854 22.449 109.196 22.6668 109.673 22.812L109.02 24.6791C107.423 24.4716 106.427 23.6937 106.033 22.3453C105.452 23.0921 104.715 23.6626 103.823 24.0567C102.952 24.4509 101.977 24.648 100.898 24.648C99.2593 24.648 97.9628 24.1916 97.0085 23.2788C96.075 22.366 95.6082 21.142 95.6082 19.6069C95.6082 17.9265 96.2617 16.63 97.5686 15.7172C98.8963 14.8044 100.794 14.348 103.263 14.348H105.69V13.01C105.69 11.8482 105.358 11.0184 104.695 10.5205C104.031 10.0019 103.066 9.7426 101.801 9.7426C100.556 9.7426 99.1349 10.0227 97.5375 10.5828L96.8218 8.59125C98.7511 7.90666 100.546 7.56436 102.205 7.56436C104.197 7.56436 105.711 8.03113 106.748 8.96466C107.806 9.89819 108.335 11.1948 108.335 12.8544V20.7271ZM101.552 22.6875C102.361 22.6875 103.128 22.4801 103.854 22.0652C104.601 21.6503 105.213 21.0798 105.69 20.3537V16.1528H103.325C101.583 16.1528 100.328 16.4433 99.5601 17.0241C98.7926 17.605 98.4088 18.4555 98.4088 19.5758C98.4088 21.6503 99.4564 22.6875 101.552 22.6875ZM122.575 7.56436C126.537 7.56436 128.519 10.4064 128.519 16.0906C128.519 18.6837 127.979 20.7583 126.9 22.3141C125.822 23.87 124.255 24.648 122.202 24.648C120.418 24.648 118.965 24.0256 117.845 22.7809V30.5914L115.231 30.9026V7.90666H117.472L117.69 10.2094C118.291 9.35881 119.007 8.70534 119.837 8.24895C120.687 7.79256 121.6 7.56436 122.575 7.56436ZM121.953 9.68036C121.123 9.68036 120.355 9.92931 119.65 10.4272C118.965 10.9251 118.364 11.5474 117.845 12.2942V20.416C118.281 21.0591 118.82 21.5673 119.463 21.9407C120.127 22.2934 120.843 22.4697 121.61 22.4697C122.98 22.4697 123.996 21.9511 124.66 20.9138C125.345 19.8558 125.687 18.2481 125.687 16.0906C125.687 13.9331 125.386 12.3254 124.784 11.2674C124.183 10.2094 123.239 9.68036 121.953 9.68036ZM140.113 0.251712C140.694 0.251712 141.161 0.428046 141.514 0.780713C141.866 1.11264 142.043 1.54828 142.043 2.08765C142.043 2.62703 141.866 3.07305 141.514 3.42572C141.161 3.75764 140.694 3.9236 140.113 3.9236C139.553 3.9236 139.097 3.75764 138.744 3.42572C138.412 3.07305 138.246 2.62703 138.246 2.08765C138.246 1.54828 138.412 1.11264 138.744 0.780713C139.097 0.428046 139.553 0.251712 140.113 0.251712ZM142.198 22.2208H146.804V24.3057H134.543V22.2208H139.584V9.99154H134.699V7.90666H142.198V22.2208Z";
+
+/**
+ * Majapi logo in the current text color; `mark` is the マ symbol alone.
+ * Size it by height only (e.g. `h-6`); the width follows the aspect ratio.
+ */
+export function MajapiLogo({
+  variant = "full",
+  className,
+  ...props
+}: SVGProps<SVGSVGElement> & { variant?: "full" | "mark" }) {
+  return (
+    <svg
+      viewBox={variant === "mark" ? "0 0 27 31" : "0 0 147 31"}
+      fill="currentColor"
+      role="img"
+      aria-label="Majapi"
+      preserveAspectRatio="xMinYMid meet"
+      className={cn("h-5 w-auto shrink-0", className)}
+      {...props}
+    >
+      <path d={MARK} />
+      {variant === "full" ? <path d={TEXT} /> : null}
+    </svg>
+  );
+}

package/src/patterns/page-header.tsx

@@ -1,62 +1,62 @@
-import type { ReactNode } from "react";
-import {
-  Card,
-  CardAction,
-  CardDescription,
-  CardFooter,
-  CardHeader,
-  CardTitle,
-} from "../components/ui/card";
-
-export function PageHeader({
-  title,
-  description,
-  actions,
-}: {
-  title: string;
-  description?: string;
-  actions?: ReactNode;
-}) {
-  return (
-    <div className="flex flex-wrap items-end justify-between gap-4">
-      <div className="flex flex-col gap-1">
-        <h1 className="text-2xl font-semibold tracking-tight">{title}</h1>
-        {description ? (
-          <p className="text-sm text-muted-foreground">{description}</p>
-        ) : null}
-      </div>
-      {actions ? (
-        <div className="flex items-center gap-2">{actions}</div>
-      ) : null}
-    </div>
-  );
-}
-
-export interface Metric {
-  label: string;
-  value: ReactNode;
-  badge?: ReactNode;
-  note?: ReactNode;
-}
-export function MetricStrip({ items }: { items: Metric[] }) {
-  return (
-    <div className="grid gap-4 sm:grid-cols-2 md:gap-6 xl:grid-cols-4">
-      {items.map((item) => (
-        <Card key={item.label}>
-          <CardHeader>
-            <CardDescription>{item.label}</CardDescription>
-            <CardTitle className="text-2xl font-semibold tabular-nums">
-              {item.value}
-            </CardTitle>
-            {item.badge ? <CardAction>{item.badge}</CardAction> : null}
-          </CardHeader>
-          {item.note ? (
-            <CardFooter className="text-sm text-muted-foreground">
-              {item.note}
-            </CardFooter>
-          ) : null}
-        </Card>
-      ))}
-    </div>
-  );
-}
+import type { ReactNode } from "react";
+import {
+  Card,
+  CardAction,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from "../components/ui/card";
+
+export function PageHeader({
+  title,
+  description,
+  actions,
+}: {
+  title: string;
+  description?: string;
+  actions?: ReactNode;
+}) {
+  return (
+    <div className="flex flex-wrap items-end justify-between gap-4">
+      <div className="flex flex-col gap-1">
+        <h1 className="text-2xl font-semibold tracking-tight">{title}</h1>
+        {description ? (
+          <p className="text-sm text-muted-foreground">{description}</p>
+        ) : null}
+      </div>
+      {actions ? (
+        <div className="flex items-center gap-2">{actions}</div>
+      ) : null}
+    </div>
+  );
+}
+
+export interface Metric {
+  label: string;
+  value: ReactNode;
+  badge?: ReactNode;
+  note?: ReactNode;
+}
+export function MetricStrip({ items }: { items: Metric[] }) {
+  return (
+    <div className="grid gap-4 sm:grid-cols-2 md:gap-6 xl:grid-cols-4">
+      {items.map((item) => (
+        <Card key={item.label}>
+          <CardHeader>
+            <CardDescription>{item.label}</CardDescription>
+            <CardTitle className="text-2xl font-semibold tabular-nums">
+              {item.value}
+            </CardTitle>
+            {item.badge ? <CardAction>{item.badge}</CardAction> : null}
+          </CardHeader>
+          {item.note ? (
+            <CardFooter className="text-sm text-muted-foreground">
+              {item.note}
+            </CardFooter>
+          ) : null}
+        </Card>
+      ))}
+    </div>
+  );
+}

package/src/patterns/preferences.tsx

@@ -32,6 +32,7 @@ const PreferencesContext = createContext<{
   theme: Theme;
   setTheme: (theme: Theme) => void;
 } | null>(null);
+const PreferencesReadyContext = createContext(true);
 
 function read(key: string) {
   try {
@@ -53,7 +54,7 @@ function write(key: string, value: string) {
  * Inline this in `<head>` (e.g. `<script dangerouslySetInnerHTML>`) so the
  * stored theme applies before paint.
  */
-export const preferencesScript = `try{var d=document.documentElement;if(localStorage.getItem("theme")==="dark")d.classList.add("dark");var l=localStorage.getItem("locale");if(l!=="en"&&l!=="pt-BR"){l="en";var a=navigator.languages||[];for(var i=0;i<a.length;i++){if(/^pt/i.test(a[i])){l="pt-BR";break}if(/^en/i.test(a[i]))break}}if(l!=="en"){d.lang=l;d.setAttribute("data-locale-pending",l);setTimeout(function(){d.removeAttribute("data-locale-pending")},2000)}}catch(e){}`;
+export const preferencesScript = `try{var d=document.documentElement;if(localStorage.getItem("theme")==="dark")d.classList.add("dark");var l=localStorage.getItem("locale");if(l!=="en"&&l!=="pt-BR"){l="en";var a=navigator.languages||[];for(var i=0;i<a.length;i++){if(/^pt/i.test(a[i])){l="pt-BR";break}if(/^en/i.test(a[i]))break}}if(l!==d.lang){d.lang=l;d.setAttribute("data-locale-pending",l)}}catch(e){}`;
 
 /**
  * Locale + theme for the whole app. Renders `defaultLocale` first (matches
@@ -68,6 +69,7 @@ export function Preferences({
 }) {
   const [locale, setLocale] = useState<Locale>(defaultLocale);
   const [theme, setTheme] = useState<Theme>("light");
+  const [ready, setReady] = useState(false);
   useEffect(() => {
     const stored = read("locale");
     // eslint-disable-next-line react-hooks/set-state-in-effect -- sync from browser-only storage after hydration
@@ -77,14 +79,16 @@ export function Preferences({
         : matchLocale(navigator.languages),
     );
     setTheme(read("theme") === "dark" ? "dark" : "light");
+    setReady(true);
   }, []);
   useEffect(() => {
+    if (!ready) return;
     const root = document.documentElement;
     root.lang = locale;
     // The pre-paint script hides the page until the saved locale is rendered.
     if (root.dataset.localePending === locale)
       delete root.dataset.localePending;
-  }, [locale]);
+  }, [locale, ready]);
   useEffect(() => {
     document.documentElement.classList.toggle("dark", theme === "dark");
   }, [theme]);
@@ -103,10 +107,12 @@ export function Preferences({
         },
       }}
     >
-      <LocaleProvider locale={locale}>
-        {children}
-        <Toaster theme={theme} />
-      </LocaleProvider>
+      <PreferencesReadyContext.Provider value={ready}>
+        <LocaleProvider locale={locale}>
+          {children}
+          <Toaster theme={theme} />
+        </LocaleProvider>
+      </PreferencesReadyContext.Provider>
     </PreferencesContext.Provider>
   );
 }
@@ -116,9 +122,11 @@ export function Preferences({
  * of Next.js metadata, or Next will overwrite it after hydration.
  */
 export function useDocumentTitle(title: string) {
+  const ready = useContext(PreferencesReadyContext);
   useEffect(() => {
+    if (!ready) return;
     document.title = title;
-  }, [title]);
+  }, [title, ready]);
 }
 
 export function usePreferences() {

package/src/patterns/status-badge.tsx

@@ -1,24 +1,24 @@
-import type { ReactNode } from "react";
-import { Badge } from "../components/ui/badge";
-export function StatusBadge({
-  children,
-  tone = "neutral",
-}: {
-  children: ReactNode;
-  tone?: "neutral" | "success" | "warning" | "danger";
-}) {
-  return (
-    <Badge
-      variant={
-        tone === "danger"
-          ? "destructive"
-          : tone === "neutral"
-            ? "outline"
-            : tone
-      }
-    >
-      <span className="size-1.5 rounded-full bg-current" aria-hidden="true" />
-      {children}
-    </Badge>
-  );
-}
+import type { ReactNode } from "react";
+import { Badge } from "../components/ui/badge";
+export function StatusBadge({
+  children,
+  tone = "neutral",
+}: {
+  children: ReactNode;
+  tone?: "neutral" | "success" | "warning" | "danger";
+}) {
+  return (
+    <Badge
+      variant={
+        tone === "danger"
+          ? "destructive"
+          : tone === "neutral"
+            ? "outline"
+            : tone
+      }
+    >
+      <span className="size-1.5 rounded-full bg-current" aria-hidden="true" />
+      {children}
+    </Badge>
+  );
+}