@tuturuuu/ui 0.26.0 → 0.26.1

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Changelog
 
+## [0.26.1](https://github.com/tutur3u/platform/compare/ui-v0.26.0...ui-v0.26.1) (2026-08-11)
+
+
+### Bug Fixes
+
+* **vercel:** harden navigation prefetch policy ([b8cf61c](https://github.com/tutur3u/platform/commit/b8cf61c86727817faff1f28da768fee4b3e52e68))
+
+
+### Performance Improvements
+
+* **vercel:** reduce speculative app requests ([423e240](https://github.com/tutur3u/platform/commit/423e2401c16b2cad4785ba46a08bf5b3d1c8a749))
+* **vercel:** reduce speculative app requests ([#5116](https://github.com/tutur3u/platform/issues/5116)) ([9e2b59b](https://github.com/tutur3u/platform/commit/9e2b59bcaa0bbc7a593ff91e2d2331aca4ab6595))
+
 ## [0.26.0](https://github.com/tutur3u/platform/compare/ui-v0.25.3...ui-v0.26.0) (2026-08-09)
 
 

package/README.md

@@ -6,12 +6,11 @@ Shared UI components and design system for Tuturuuu Platform.
 
 ```bash
 npm install @tuturuuu/ui
-# or
-yarn add @tuturuuu/ui
-# or
-bun add @tuturuuu/ui
 ```
 
+Using another package manager? Run `pnpm add @tuturuuu/ui`,
+`yarn add @tuturuuu/ui`, or `bun add @tuturuuu/ui` instead.
+
 The public package depends on other published Tuturuuu packages, including
 `@tuturuuu/apis` and `@tuturuuu/ai`. Release those dependencies first, then
 publish UI from the same production commit so standalone apps can install
@@ -19,18 +18,41 @@ publish UI from the same production commit so standalone apps can install
 
 ## Usage
 
+Import the shared stylesheet once from your app's root layout or entry point:
+
 ```typescript
-import { Button, Card } from '@tuturuuu/ui'
+import '@tuturuuu/ui/globals.css';
+```
+
+Then import each component from its public subpath:
+
+```tsx
+import { Button } from '@tuturuuu/ui/button';
+import {
+  Card,
+  CardContent,
+  CardHeader,
+  CardTitle,
+} from '@tuturuuu/ui/card';
 
 export default function MyComponent() {
   return (
     <Card>
-      <Button variant="primary">Click me</Button>
+      <CardHeader>
+        <CardTitle>Welcome to Tuturuuu</CardTitle>
+      </CardHeader>
+      <CardContent>
+        <Button>Get started</Button>
+      </CardContent>
     </Card>
-  )
+  );
 }
 ```
 
+The package exports TypeScript and TSX source files. Configure your framework
+or bundler to transpile `@tuturuuu/ui` and its published Tuturuuu dependencies
+when it does not transpile package source automatically.
+
 ## Features
 
 - Fully accessible components

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tuturuuu/ui",
-  "version": "0.26.0",
+  "version": "0.26.1",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -92,7 +92,7 @@
     "@tuturuuu/icons": "0.1.0",
     "@tuturuuu/internal-api": "0.29.0",
     "@tuturuuu/supabase": "0.5.0",
-    "@tuturuuu/utils": "0.24.0",
+    "@tuturuuu/utils": "0.24.1",
     "@types/debug": "^4.1.13",
     "browser-image-compression": "^2.0.2",
     "class-variance-authority": "^0.7.1",
@@ -396,12 +396,6 @@
     },
     "./calendar-app/hooks/*": "./src/components/ui/calendar-app/hooks/*.ts",
     "./calendar-app/components/*": "./src/components/ui/calendar-app/components/*.tsx",
-    "./calendar-app/components/sidebar/*": "./src/components/ui/calendar-app/components/sidebar/*.tsx",
-    "./calendar-app/components/time-tracker": {
-      "types": "./src/components/ui/calendar-app/components/time-tracker/index.tsx",
-      "import": "./src/components/ui/calendar-app/components/time-tracker/index.tsx"
-    },
-    "./calendar-app/components/time-tracker/*": "./src/components/ui/calendar-app/components/time-tracker/*.tsx",
     "./custom/icon-picker": {
       "types": "./src/components/ui/custom/icon-picker/index.ts",
       "import": "./src/components/ui/custom/icon-picker/index.ts"

package/src/components/ui/calendar-app/hooks/use-calendar-settings.test.ts

@@ -0,0 +1,32 @@
+import {
+  resolveFirstDayOfWeek as resolveCanonicalFirstDayOfWeek,
+  resolveTimezone as resolveCanonicalTimezone,
+} from '@tuturuuu/utils/calendar-settings-resolver';
+import { describe, expect, it } from 'vitest';
+import {
+  resolveFirstDayOfWeek,
+  resolveTimezone,
+} from '../../../../lib/calendar-settings-resolver';
+
+describe('shared calendar settings resolver integration', () => {
+  it('keeps the UI compatibility path on the canonical resolver', () => {
+    expect(resolveTimezone).toBe(resolveCanonicalTimezone);
+    expect(resolveFirstDayOfWeek).toBe(resolveCanonicalFirstDayOfWeek);
+  });
+
+  it('prefers saved user values and preserves locale fallback', () => {
+    expect(
+      resolveTimezone(
+        { timezone: 'Asia/Ho_Chi_Minh' },
+        { timezone: 'Europe/London' }
+      )
+    ).toBe('Asia/Ho_Chi_Minh');
+    expect(
+      resolveFirstDayOfWeek(
+        { first_day_of_week: 'auto' },
+        { first_day_of_week: 'auto' },
+        'vi-VN'
+      )
+    ).toBe('monday');
+  });
+});

package/src/components/ui/custom/nav-link.test.tsx

@@ -7,10 +7,12 @@ import { NavLink } from './nav-link';
 
 const navigationState = vi.hoisted(() => ({
   pathname: '/personal/tasks',
+  prefetch: vi.fn(),
 }));
 
 vi.mock('next/navigation', () => ({
   usePathname: () => navigationState.pathname,
+  useRouter: () => ({ prefetch: navigationState.prefetch }),
 }));
 
 vi.mock('next-intl', () => ({
@@ -51,9 +53,54 @@ function renderNavLink(
 describe('NavLink', () => {
   beforeEach(() => {
     navigationState.pathname = '/personal/tasks';
+    navigationState.prefetch.mockReset();
     vi.restoreAllMocks();
   });
 
+  it('prefetches internal routes only after navigation intent', () => {
+    renderNavLink({
+      href: '/personal/tasks/boards',
+      title: 'Boards',
+    });
+
+    const link = screen.getByRole('link', { name: 'Boards' });
+    expect(navigationState.prefetch).not.toHaveBeenCalled();
+
+    fireEvent.mouseEnter(link);
+    fireEvent.focus(link);
+
+    expect(navigationState.prefetch).toHaveBeenCalledTimes(1);
+    expect(navigationState.prefetch).toHaveBeenCalledWith(
+      '/personal/tasks/boards'
+    );
+  });
+
+  it('does not prefetch external routes', () => {
+    renderNavLink({
+      external: true,
+      href: 'https://docs.tuturuuu.com',
+      title: 'Docs',
+    });
+
+    fireEvent.mouseEnter(screen.getByRole('link', { name: 'Docs' }));
+
+    expect(navigationState.prefetch).not.toHaveBeenCalled();
+  });
+
+  it.each([
+    ['protocol-relative', '//docs.tuturuuu.com/guide'],
+    ['email', 'mailto:support@tuturuuu.com'],
+    ['telephone', 'tel:+84123456789'],
+  ])('does not prefetch %s URLs', (_label, href) => {
+    renderNavLink({ href, title: 'External destination' });
+
+    fireEvent.mouseEnter(
+      screen.getByRole('link', { name: 'External destination' })
+    );
+
+    expect(navigationState.prefetch).not.toHaveBeenCalled();
+  });
+
   it('matches wildcard aliases even when the primary route is exact', () => {
     navigationState.pathname = '/personal/tasks/boards/board-1';
 

package/src/components/ui/custom/nav-link.tsx

@@ -12,9 +12,9 @@ import {
 import { getWorkspaceConfigIdList } from '@tuturuuu/internal-api';
 import { cn } from '@tuturuuu/utils/format';
 import Link from 'next/link';
-import { usePathname } from 'next/navigation';
+import { usePathname, useRouter } from 'next/navigation';
 import { useTranslations } from 'next-intl';
-import { useState } from 'react';
+import { useRef, useState } from 'react';
 import { Badge } from '../badge';
 import { Button } from '../button';
 import {
@@ -58,7 +58,7 @@ function getComparablePath(
       ? new URL(target)
       : new URL(target, base);
 
-    if (isAbsoluteHttpUrl(target) && url.origin !== base) return null;
+    if (url.origin !== base) return null;
 
     return url.pathname;
   } catch {
@@ -103,6 +103,7 @@ export function NavLink({
 }: NavLinkProps) {
   const t = useTranslations();
   const pathname = usePathname();
+  const router = useRouter();
   const {
     title,
     icon,
@@ -338,6 +339,27 @@ export function NavLink({
         })()
       : href;
 
+  const prefetchedHrefRef = useRef<string | null>(null);
+  const prefetchOnIntent = () => {
+    if (
+      !effectiveHref ||
+      newTab ||
+      link.external ||
+      isDisabled ||
+      isResolvingHref ||
+      hasSubMenu ||
+      archivedItems.length > 0 ||
+      !getComparablePath(effectiveHref)
+    ) {
+      return;
+    }
+
+    if (prefetchedHrefRef.current === effectiveHref) return;
+
+    prefetchedHrefRef.current = effectiveHref;
+    router.prefetch(effectiveHref);
+  };
+
   const commonProps = {
     className: cn(
       'group/navlink flex w-full cursor-pointer items-center justify-between rounded-md p-2 font-medium text-sm',
@@ -388,6 +410,8 @@ export function NavLink({
         onClick();
       }
     },
+    onFocus: prefetchOnIntent,
+    onMouseEnter: prefetchOnIntent,
   };
 
   const linkElement =
@@ -425,6 +449,7 @@ export function NavLink({
     ) : effectiveHref && !isDisabled ? (
       <Link
         href={effectiveHref}
+        prefetch={false}
         {...commonProps}
         target={newTab ? '_blank' : '_self'}
       >

package/src/components/ui/legacy/polls/poll-display.test.tsx

@@ -0,0 +1,118 @@
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { PlanDetailsPollContent } from './poll-display';
+
+const mocks = vi.hoisted(() => ({
+  addPollOption: vi.fn(),
+  createPoll: vi.fn(),
+  deletePoll: vi.fn(),
+  deletePollOption: vi.fn(),
+  refresh: vi.fn(),
+  submitVote: vi.fn(),
+  toast: vi.fn(),
+  toggleWherePoll: vi.fn(),
+  useTimeBlocking: vi.fn(),
+}));
+
+vi.mock('@tuturuuu/apis/meet/actions', () => ({
+  addPollOption: (...args: unknown[]) => mocks.addPollOption(...args),
+  createPoll: (...args: unknown[]) => mocks.createPoll(...args),
+  deletePoll: (...args: unknown[]) => mocks.deletePoll(...args),
+  deletePollOption: (...args: unknown[]) => mocks.deletePollOption(...args),
+  submitVote: (...args: unknown[]) => mocks.submitVote(...args),
+  toggleWherePoll: (...args: unknown[]) => mocks.toggleWherePoll(...args),
+}));
+
+vi.mock('@tuturuuu/ui/hooks/time-blocking-provider', () => ({
+  useTimeBlocking: () => mocks.useTimeBlocking(),
+}));
+
+vi.mock('@tuturuuu/ui/hooks/use-toast', () => ({
+  toast: (...args: unknown[]) => mocks.toast(...args),
+}));
+
+vi.mock('next/navigation', () => ({
+  useRouter: () => ({ refresh: mocks.refresh }),
+}));
+
+vi.mock('next-intl', () => ({
+  useTranslations: () => (key: string) => key,
+}));
+
+vi.mock('./where-tu-meet', () => ({
+  DefaultWherePollContent: ({
+    onAddOption,
+    onVote,
+  }: {
+    onAddOption: (pollId: string, value: string) => Promise<unknown>;
+    onVote: (pollId: string, optionIds: string[]) => Promise<void>;
+  }) => (
+    <div>
+      <button type="button" onClick={() => onAddOption('poll-1', 'Cafe')}>
+        add guest option
+      </button>
+      <button type="button" onClick={() => onVote('poll-1', ['option-1'])}>
+        submit guest vote
+      </button>
+    </div>
+  ),
+}));
+
+describe('PlanDetailsPollContent guest authorization', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    mocks.useTimeBlocking.mockReturnValue({
+      user: {
+        display_name: 'Guest',
+        id: 'guest-1',
+        is_guest: true,
+        password_hash: 'plan-bound-credential',
+      },
+    });
+    mocks.addPollOption.mockResolvedValue({
+      data: {
+        option: {
+          created_at: '2026-08-10T00:00:00.000Z',
+          guestVotes: [],
+          id: 'option-1',
+          poll_id: 'poll-1',
+          totalVotes: 0,
+          userVotes: [],
+          value: 'Cafe',
+        },
+      },
+    });
+    mocks.submitVote.mockResolvedValue({ data: { success: true } });
+  });
+
+  it('forwards the selected guest credential to option and vote actions', async () => {
+    render(
+      <PlanDetailsPollContent
+        plan={{ id: 'plan-1', is_confirmed: false, where_to_meet: true }}
+        isCreator={false}
+        platformUser={null}
+        polls={null}
+      />
+    );
+
+    fireEvent.click(screen.getByRole('button', { name: 'add guest option' }));
+    fireEvent.click(screen.getByRole('button', { name: 'submit guest vote' }));
+
+    await waitFor(() => {
+      expect(mocks.addPollOption).toHaveBeenCalledWith('plan-1', {
+        guestId: 'guest-1',
+        guestPasswordHash: 'plan-bound-credential',
+        pollId: 'poll-1',
+        userType: 'GUEST',
+        value: 'Cafe',
+      });
+      expect(mocks.submitVote).toHaveBeenCalledWith('plan-1', {
+        guestId: 'guest-1',
+        guestPasswordHash: 'plan-bound-credential',
+        optionIds: ['option-1'],
+        pollId: 'poll-1',
+        userType: 'GUEST',
+      });
+    });
+  });
+});

package/src/components/ui/legacy/polls/poll-display.tsx

@@ -94,6 +94,10 @@ export function PlanDetailsPollContent({
       optionIds,
       userType: userType as 'PLATFORM' | 'GUEST',
       guestId: userType === 'GUEST' ? (user?.id ?? undefined) : undefined,
+      guestPasswordHash:
+        userType === 'GUEST' && guestUser?.is_guest
+          ? guestUser.password_hash
+          : undefined,
     });
     if (result.error) {
       toast({
@@ -111,6 +115,10 @@ export function PlanDetailsPollContent({
       value,
       userType: userType as 'PLATFORM' | 'GUEST',
       guestId: userType === 'GUEST' ? (user?.id ?? undefined) : undefined,
+      guestPasswordHash:
+        userType === 'GUEST' && guestUser?.is_guest
+          ? guestUser.password_hash
+          : undefined,
     });
     if (result.error) {
       toast({

package/src/lib/calendar-settings-resolver.ts

@@ -1,200 +1 @@
-/**
- * Calendar Settings Resolver
- *
- * Implements priority system for calendar preferences:
- * User settings > Workspace settings > Auto-detection
- */
-
-type FirstDayOfWeek = 'auto' | 'sunday' | 'monday' | 'saturday';
-
-interface CalendarSettings {
-  timezone: string;
-  firstDayOfWeek: FirstDayOfWeek;
-  timeFormat: '12h' | '24h';
-}
-
-export interface CalendarUserSettings {
-  timezone?: string | null;
-  first_day_of_week?: string | null;
-  time_format?: string | null;
-}
-
-export interface CalendarWorkspaceSettings {
-  timezone?: string | null;
-  first_day_of_week?: string | null;
-}
-
-/**
- * Detects the system timezone using Intl API
- */
-export function detectSystemTimezone(): string {
-  try {
-    return Intl.DateTimeFormat().resolvedOptions().timeZone;
-  } catch {
-    // Fallback to UTC if detection fails
-    return 'UTC';
-  }
-}
-
-/**
- * Detects the first day of week based on locale
- * Vietnamese: Monday
- * US/Canada: Sunday
- * Middle East: Saturday
- */
-export function detectLocaleFirstDay(locale?: string): FirstDayOfWeek {
-  const userLocale =
-    locale || (typeof navigator !== 'undefined' ? navigator.language : 'en-US');
-
-  // Vietnamese locale uses Monday as first day
-  if (userLocale.startsWith('vi')) {
-    return 'monday';
-  }
-
-  // US, Canada, and some other countries use Sunday
-  if (userLocale.startsWith('en-US') || userLocale.startsWith('en-CA')) {
-    return 'sunday';
-  }
-
-  // Middle Eastern countries typically use Saturday
-  if (userLocale.startsWith('ar') || userLocale.startsWith('he')) {
-    return 'saturday';
-  }
-
-  // Most European and other countries use Monday
-  return 'monday';
-}
-
-/**
- * Detects the preferred time format based on locale
- * Uses Intl.DateTimeFormat to determine if the locale uses 12h or 24h format
- */
-export function detectLocaleTimeFormat(locale?: string): '12h' | '24h' {
-  const userLocale =
-    locale || (typeof navigator !== 'undefined' ? navigator.language : 'en-US');
-
-  try {
-    // Use Intl.DateTimeFormat to detect the locale's preferred format
-    const formatter = new Intl.DateTimeFormat(userLocale, { hour: 'numeric' });
-    const parts = formatter.formatToParts(new Date(2000, 0, 1, 13, 0));
-    const hourPart = parts.find((p) => p.type === 'hour');
-
-    // If hour is "1" instead of "13", it's 12-hour format
-    return hourPart?.value === '1' ? '12h' : '24h';
-  } catch {
-    // Fallback to 12h for English locales, 24h for others
-    return userLocale.startsWith('en') ? '12h' : '24h';
-  }
-}
-
-/**
- * Resolves the effective time format based on user setting
- */
-export function resolveTimeFormat(
-  user?: Pick<CalendarUserSettings, 'time_format'> | null,
-  locale?: string
-): '12h' | '24h' {
-  // User setting takes priority
-  if (user?.time_format && user.time_format !== 'auto') {
-    return user.time_format as '12h' | '24h';
-  }
-
-  // Auto-detection based on locale
-  return detectLocaleTimeFormat(locale);
-}
-
-/**
- * Resolves the effective timezone based on priority system
- */
-export function resolveTimezone(
-  user?: Pick<CalendarUserSettings, 'timezone'> | null,
-  workspace?: Pick<CalendarWorkspaceSettings, 'timezone'> | null
-): string {
-  // Priority 1: User setting
-  if (user?.timezone && user.timezone !== 'auto') {
-    return user.timezone;
-  }
-
-  // Priority 2: Workspace setting
-  if (workspace?.timezone && workspace.timezone !== 'auto') {
-    return workspace.timezone;
-  }
-
-  // Priority 3: Auto-detection
-  return detectSystemTimezone();
-}
-
-/**
- * Resolves the effective first day of week based on priority system
- */
-export function resolveFirstDayOfWeek(
-  user?: Pick<CalendarUserSettings, 'first_day_of_week'> | null,
-  workspace?: Pick<CalendarWorkspaceSettings, 'first_day_of_week'> | null,
-  locale?: string
-): FirstDayOfWeek {
-  // Priority 1: User setting
-  if (user?.first_day_of_week && user.first_day_of_week !== 'auto') {
-    return user.first_day_of_week as FirstDayOfWeek;
-  }
-
-  // Priority 2: Workspace setting
-  if (workspace?.first_day_of_week && workspace.first_day_of_week !== 'auto') {
-    return workspace.first_day_of_week as FirstDayOfWeek;
-  }
-
-  // Priority 3: Auto-detection based on locale
-  return detectLocaleFirstDay(locale);
-}
-
-/**
- * Resolves all calendar settings at once
- */
-export function resolveCalendarSettings(
-  user?: CalendarUserSettings | null,
-  workspace?: CalendarWorkspaceSettings | null,
-  locale?: string
-): CalendarSettings {
-  return {
-    timezone: resolveTimezone(user, workspace),
-    firstDayOfWeek: resolveFirstDayOfWeek(user, workspace, locale),
-    timeFormat: resolveTimeFormat(user, locale),
-  };
-}
-
-/**
- * Converts first day of week string to number (for Date compatibility)
- * 0 = Sunday, 1 = Monday, 6 = Saturday
- */
-export function firstDayToNumber(day: FirstDayOfWeek, locale?: string): number {
-  if (day === 'auto') {
-    day = detectLocaleFirstDay(locale);
-  }
-
-  switch (day) {
-    case 'sunday':
-      return 0;
-    case 'monday':
-      return 1;
-    case 'saturday':
-      return 6;
-    default:
-      return 1; // Default to Monday
-  }
-}
-
-/**
- * Converts number to first day of week string
- * 0 = Sunday, 1 = Monday, 6 = Saturday
- */
-export function numberToFirstDay(num: number): FirstDayOfWeek {
-  switch (num) {
-    case 0:
-      return 'sunday';
-    case 1:
-      return 'monday';
-    case 6:
-      return 'saturday';
-    default:
-      return 'monday'; // Default to Monday
-  }
-}
+export * from '@tuturuuu/utils/calendar-settings-resolver';

package/src/readme-contract.test.tsx

@@ -0,0 +1,57 @@
+import { readFileSync } from 'node:fs';
+import { resolve } from 'node:path';
+import { render, screen } from '@testing-library/react';
+import { Button } from '@tuturuuu/ui/button';
+import { Card, CardContent, CardHeader, CardTitle } from '@tuturuuu/ui/card';
+import { describe, expect, it } from 'vitest';
+
+const repoRoot = resolve(
+  process.cwd(),
+  process.cwd().endsWith('/packages/ui') ? '../..' : '.'
+);
+
+function readRepoFile(path: string) {
+  return readFileSync(resolve(repoRoot, path), 'utf8');
+}
+
+describe('@tuturuuu/ui public quickstart', () => {
+  it('documents only executable public package entry points', () => {
+    const readme = readRepoFile('packages/ui/README.md');
+    const packageJson = JSON.parse(
+      readRepoFile('packages/ui/package.json')
+    ) as {
+      exports: Record<string, unknown>;
+    };
+
+    expect(
+      readme.match(/import '@tuturuuu\/ui\/globals\.css';/gu) ?? []
+    ).toHaveLength(1);
+    expect(readme).toContain("import { Button } from '@tuturuuu/ui/button';");
+    expect(readme).toMatch(
+      /import\s*\{[\s\S]*?Card[\s\S]*?CardContent[\s\S]*?CardHeader[\s\S]*?CardTitle[\s\S]*?\}\s*from '@tuturuuu\/ui\/card';/u
+    );
+    expect(readme).not.toMatch(/from ['"]@tuturuuu\/ui['"]/u);
+    expect(readme).not.toContain('variant="primary"');
+    expect(packageJson.exports['.']).toBeUndefined();
+    expect(packageJson.exports['./button']).toBeDefined();
+    expect(packageJson.exports['./*']).toBe('./src/components/ui/*.tsx');
+  });
+
+  it('renders the documented component tree through public subpaths', () => {
+    render(
+      <Card>
+        <CardHeader>
+          <CardTitle>Welcome to Tuturuuu</CardTitle>
+        </CardHeader>
+        <CardContent>
+          <Button>Get started</Button>
+        </CardContent>
+      </Card>
+    );
+
+    expect(
+      screen.getByRole('button', { name: 'Get started' })
+    ).toBeInTheDocument();
+    expect(screen.getByText('Welcome to Tuturuuu')).toBeInTheDocument();
+  });
+});