@devalok/shilp-sutra 0.53.0 → 0.55.0

package/dist/composed/error-boundary.js.map

@@ -1 +1 @@
-{"version":3,"file":"error-boundary.js","names":[],"sources":["../../src/composed/error-boundary.tsx"],"sourcesContent":["'use client'\n\nimport { IconAlertTriangle, IconBan, IconFileUnknown, IconServerOff } from '@tabler/icons-react'\nimport * as React from 'react'\n\nimport { Button } from '../ui/button'\nimport { Icon } from '../ui/icon'\nimport { cn } from '../ui/lib/utils'\n\ndeclare const process: { env: { NODE_ENV?: string } } | undefined\n\nexport interface ErrorDisplayProps extends React.ComponentPropsWithoutRef<'div'> {\n  error: unknown\n  onReset?: () => void\n}\n\nfunction getStatusFromError(error: unknown): number | undefined {\n  if (\n    error &&\n    typeof error === 'object' &&\n    'status' in error &&\n    typeof (error as Record<string, unknown>).status === 'number'\n  ) {\n    return (error as Record<string, unknown>).status as number\n  }\n  return undefined\n}\n\nfunction getMessageFromError(error: unknown): string | undefined {\n  if (error instanceof Error) {\n    return error.message\n  }\n  if (\n    error &&\n    typeof error === 'object' &&\n    'data' in error\n  ) {\n    const data = (error as Record<string, unknown>).data\n    if (typeof data === 'string') return data\n    if (data && typeof data === 'object' && 'message' in data) {\n      return String((data as Record<string, unknown>).message)\n    }\n  }\n  if (typeof error === 'string') {\n    return error\n  }\n  return undefined\n}\n\nfunction getStackFromError(error: unknown): string | undefined {\n  if (error instanceof Error) {\n    return error.stack\n  }\n  return undefined\n}\n\nfunction getErrorConfig(status?: number) {\n  switch (status) {\n    case 404:\n      return {\n        icon: IconFileUnknown,\n        title: 'Page not found',\n        message:\n          'The page you are looking for does not exist or has been moved.',\n        bgClass: 'bg-accent-2',\n        iconClass: 'text-accent-11',\n      }\n    case 403:\n      return {\n        icon: IconBan,\n        title: 'Access denied',\n        message:\n          'You do not have permission to view this page. Contact your administrator if you believe this is a mistake.',\n        bgClass: 'bg-warning-3',\n        iconClass: 'text-warning-11',\n      }\n    case 500:\n      return {\n        icon: IconServerOff,\n        title: 'Server error',\n        message:\n          'Something went wrong on our end. Please try again later or contact support if the issue persists.',\n        bgClass: 'bg-error-3',\n        iconClass: 'text-error-11',\n      }\n    default:\n      return {\n        icon: IconAlertTriangle,\n        title: 'Something went wrong',\n        message:\n          'An unexpected error occurred. Please try again or go back to the home page.',\n        bgClass: 'bg-accent-2',\n        iconClass: 'text-accent-11',\n      }\n  }\n}\n\nconst ErrorDisplay = React.forwardRef<HTMLDivElement, ErrorDisplayProps>(\n  function ErrorDisplay({ error, onReset, className, ...props }, ref) {\n  const status = getStatusFromError(error)\n  const message = getMessageFromError(error)\n  const stack = getStackFromError(error)\n  const isDev =\n    typeof process !== 'undefined' &&\n    process.env &&\n    process.env.NODE_ENV === 'development'\n\n  const errorConfig = getErrorConfig(status)\n  const ErrorIcon = errorConfig.icon\n\n  return (\n    <div ref={ref} {...props} className={cn(\"flex min-h-[60vh] items-center justify-center p-ds-05\", className)}>\n      <div\n        className=\"flex w-full max-w-lg flex-col items-center gap-ds-06 rounded-overlay-lg bg-surface-raised p-ds-07 text-center shadow-raised\"\n      >\n        {/* Error Icon */}\n        <div\n          className={cn(\n            'flex h-ds-lg w-ds-lg items-center justify-center rounded-bubble',\n            errorConfig.bgClass,\n          )}\n        >\n          <Icon\n            icon={ErrorIcon}\n            size=\"2xl\"\n            className={errorConfig.iconClass}\n          />\n        </div>\n\n        {/* Error IconInfoCircle */}\n        <div className=\"flex flex-col gap-ds-03\">\n          {status && (\n            <span className=\"text-body-sm text-surface-fg-subtle\">\n              Error {status}\n            </span>\n          )}\n          <h2 className=\"text-heading-md font-semibold text-surface-fg\">\n            {errorConfig.title}\n          </h2>\n          <p className=\"text-body-lg text-surface-fg-subtle\">\n            {message || errorConfig.message}\n          </p>\n        </div>\n\n        {/* Actions */}\n        {onReset && (\n          <div className=\"flex items-center gap-ds-04\">\n            <Button\n              variant=\"soft\"\n              size=\"md\"\n              onClick={onReset}\n            >\n              Try Again\n            </Button>\n          </div>\n        )}\n\n        {/* Dev stack trace */}\n        {isDev && stack && (\n          <div className=\"w-full overflow-auto rounded-surface border border-card-strong bg-surface-raised p-ds-05 text-left\">\n            <p className=\"text-body-sm mb-ds-03 font-semibold text-surface-fg\">\n              Stack Trace (development only)\n            </p>\n            <pre className=\"whitespace-pre-wrap text-body-sm text-surface-fg-subtle\">\n              {stack}\n            </pre>\n          </div>\n        )}\n      </div>\n    </div>\n  )\n},\n)\n\nErrorDisplay.displayName = 'ErrorDisplay'\n\ninterface ErrorBoundaryProps {\n  children: React.ReactNode\n  /** Optional callback when the user clicks \"Try Again\" */\n  onReset?: () => void\n  /** Optional custom fallback — receives the caught error. Defaults to ErrorDisplay. */\n  fallback?: (props: { error: unknown; onReset?: () => void }) => React.ReactNode\n}\n\ninterface ErrorBoundaryState {\n  error: unknown | null\n}\n\nclass ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {\n  constructor(props: ErrorBoundaryProps) {\n    super(props)\n    this.state = { error: null }\n  }\n\n  static getDerivedStateFromError(error: unknown): ErrorBoundaryState {\n    return { error }\n  }\n\n  private handleReset = () => {\n    this.setState({ error: null })\n    this.props.onReset?.()\n  }\n\n  render() {\n    if (this.state.error !== null) {\n      if (this.props.fallback) {\n        return this.props.fallback({ error: this.state.error, onReset: this.handleReset })\n      }\n      return <ErrorDisplay error={this.state.error} onReset={this.handleReset} />\n    }\n    return this.props.children\n  }\n}\n\nexport { ErrorBoundary,ErrorDisplay }\nexport type { ErrorBoundaryProps }\n"],"mappings":"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"}
+{"version":3,"file":"error-boundary.js","names":[],"sources":["../../src/composed/error-boundary.tsx"],"sourcesContent":["'use client'\n\nimport { IconAlertTriangle, IconBan, IconFileUnknown, IconServerOff } from '@tabler/icons-react'\nimport * as React from 'react'\n\nimport { Button } from '../ui/button'\nimport { Icon } from '../ui/icon'\nimport { cn } from '../ui/lib/utils'\n\ndeclare const process: { env: { NODE_ENV?: string } } | undefined\n\nexport interface ErrorDisplayProps extends React.ComponentPropsWithoutRef<'div'> {\n  error: unknown\n  onReset?: () => void\n  /** Custom recovery actions. When set, replaces the default \"Try Again\" button. */\n  actions?: React.ReactNode\n  /** Center in a full-viewport-height region (error page). @default true */\n  fullPage?: boolean\n  /** Move focus to the recovery button on mount (set by ErrorBoundary on swap). @default false */\n  autoFocusReset?: boolean\n}\n\nfunction getStatusFromError(error: unknown): number | undefined {\n  if (\n    error &&\n    typeof error === 'object' &&\n    'status' in error &&\n    typeof (error as Record<string, unknown>).status === 'number'\n  ) {\n    return (error as Record<string, unknown>).status as number\n  }\n  return undefined\n}\n\nfunction getMessageFromError(error: unknown): string | undefined {\n  if (error instanceof Error) return error.message\n  if (error && typeof error === 'object' && 'data' in error) {\n    const data = (error as Record<string, unknown>).data\n    if (typeof data === 'string') return data\n    if (data && typeof data === 'object' && 'message' in data) {\n      return String((data as Record<string, unknown>).message)\n    }\n  }\n  if (typeof error === 'string') return error\n  return undefined\n}\n\nfunction getStackFromError(error: unknown): string | undefined {\n  return error instanceof Error ? error.stack : undefined\n}\n\nfunction isDevEnv() {\n  return typeof process !== 'undefined' && !!process.env && process.env.NODE_ENV === 'development'\n}\n\nfunction getErrorConfig(status?: number) {\n  switch (status) {\n    case 404:\n      return { icon: IconFileUnknown, title: 'Page not found', message: 'The page you are looking for does not exist or has been moved.', bgClass: 'bg-accent-2', iconClass: 'text-accent-11' }\n    case 403:\n      return { icon: IconBan, title: 'Access denied', message: 'You do not have permission to view this page. Contact your administrator if you believe this is a mistake.', bgClass: 'bg-warning-3', iconClass: 'text-warning-11' }\n    case 500:\n      return { icon: IconServerOff, title: 'Server error', message: 'Something went wrong on our end. Please try again later or contact support if the issue persists.', bgClass: 'bg-error-3', iconClass: 'text-error-11' }\n    default:\n      return { icon: IconAlertTriangle, title: 'Something went wrong', message: 'An unexpected error occurred. Please try again or go back to the home page.', bgClass: 'bg-accent-2', iconClass: 'text-accent-11' }\n  }\n}\n\nconst ErrorDisplay = React.forwardRef<HTMLDivElement, ErrorDisplayProps>(\n  function ErrorDisplay({ error, onReset, actions, fullPage = true, autoFocusReset = false, className, ...props }, ref) {\n    const status = getStatusFromError(error)\n    const rawMessage = getMessageFromError(error)\n    const stack = getStackFromError(error)\n    const isDev = isDevEnv()\n    const errorConfig = getErrorConfig(status)\n    const ErrorIcon = errorConfig.icon\n    const resetRef = React.useRef<HTMLButtonElement>(null)\n\n    // Only surface the raw error message in development — in production it can leak\n    // internal detail; users see the friendly, status-mapped copy instead.\n    const shownMessage = isDev ? rawMessage || errorConfig.message : errorConfig.message\n\n    React.useEffect(() => {\n      if (autoFocusReset) resetRef.current?.focus()\n    }, [autoFocusReset])\n\n    return (\n      <div ref={ref} {...props} className={cn('flex items-center justify-center p-ds-05', fullPage && 'min-h-[60vh]', className)}>\n        {/* role=alert → assertive live region: AT announces the error on appearance. */}\n        <div\n          role=\"alert\"\n          className=\"flex w-full max-w-lg flex-col items-center gap-ds-06 rounded-overlay-lg bg-surface-raised p-ds-07 text-center shadow-raised\"\n        >\n          <div className={cn('flex h-ds-lg w-ds-lg items-center justify-center rounded-bubble', errorConfig.bgClass)}>\n            <Icon icon={ErrorIcon} size=\"2xl\" className={errorConfig.iconClass} />\n          </div>\n\n          <div className=\"flex flex-col gap-ds-03\">\n            {status && <span className=\"text-body-sm text-surface-fg-subtle\">Error {status}</span>}\n            <h2 className=\"text-heading-md font-semibold text-surface-fg\">{errorConfig.title}</h2>\n            <p className=\"text-body-lg text-surface-fg-subtle\">{shownMessage}</p>\n          </div>\n\n          {(actions || onReset) && (\n            <div className=\"flex items-center gap-ds-04\">\n              {actions ?? (\n                <Button ref={resetRef} variant=\"soft\" size=\"md\" onClick={onReset}>\n                  Try Again\n                </Button>\n              )}\n            </div>\n          )}\n\n          {isDev && stack && (\n            <div className=\"w-full overflow-auto rounded-surface border border-card bg-surface-raised p-ds-05 text-left\">\n              <p className=\"text-body-sm mb-ds-03 font-semibold text-surface-fg\">Stack Trace (development only)</p>\n              <pre className=\"whitespace-pre-wrap text-body-sm text-surface-fg-subtle\">{stack}</pre>\n            </div>\n          )}\n        </div>\n      </div>\n    )\n  },\n)\nErrorDisplay.displayName = 'ErrorDisplay'\n\ninterface ErrorBoundaryProps {\n  children: React.ReactNode\n  /** Called when the user clicks \"Try Again\" (after the boundary resets). */\n  onReset?: () => void\n  /** Called when an error is caught — wire your logger/Sentry here. */\n  onError?: (error: unknown, info: React.ErrorInfo) => void\n  /** Auto-reset when any value in this array changes (react-error-boundary parity). */\n  resetKeys?: unknown[]\n  /** Custom fallback — receives the caught error + a reset callback. Defaults to ErrorDisplay. */\n  fallback?: (props: { error: unknown; onReset: () => void }) => React.ReactNode\n}\n\ninterface ErrorBoundaryState {\n  error: unknown | null\n}\n\nfunction keysChanged(a: unknown[] | undefined, b: unknown[] | undefined) {\n  if (!a || !b) return false\n  if (a.length !== b.length) return true\n  return a.some((v, i) => !Object.is(v, b[i]))\n}\n\nclass ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {\n  constructor(props: ErrorBoundaryProps) {\n    super(props)\n    this.state = { error: null }\n  }\n\n  static getDerivedStateFromError(error: unknown): ErrorBoundaryState {\n    return { error }\n  }\n\n  componentDidCatch(error: unknown, info: React.ErrorInfo) {\n    this.props.onError?.(error, info)\n  }\n\n  componentDidUpdate(prev: ErrorBoundaryProps) {\n    // Auto-recover when the reset dependencies change.\n    if (this.state.error !== null && keysChanged(prev.resetKeys, this.props.resetKeys)) {\n      this.setState({ error: null })\n    }\n  }\n\n  private handleReset = () => {\n    this.setState({ error: null })\n    this.props.onReset?.()\n  }\n\n  render() {\n    if (this.state.error !== null) {\n      if (this.props.fallback) {\n        return this.props.fallback({ error: this.state.error, onReset: this.handleReset })\n      }\n      return <ErrorDisplay error={this.state.error} onReset={this.handleReset} autoFocusReset />\n    }\n    return this.props.children\n  }\n}\n\nexport { ErrorBoundary, ErrorDisplay }\nexport type { ErrorBoundaryProps }\n"],"mappings":"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"}

package/dist/composed/extensions/emoji-data.d.ts

@@ -1,4 +1,3 @@
-"use client";
 interface EmojiSkin {
     native: string;
 }

package/dist/composed/extensions/emoji-node.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import { Node } from '@tiptap/core';
 export interface EmojiNodeAttrs {
     id: string;

package/dist/composed/extensions/emoji-suggestion.d.ts

@@ -1,6 +1,5 @@
-"use client";
 import { Extension } from '@tiptap/core';
-import { ResolvedEmoji } from './emoji-data';
+import { ResolvedEmoji } from './emoji-data.js';
 export type { ResolvedEmoji as EmojiSuggestionItem };
 /** Factory: returns the configured `:shortcode:` emoji suggestion extension. */
 export declare function createEmojiSuggestion(): Extension<any, any>;

package/dist/composed/extensions/file-attachment.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import { Node } from '@tiptap/core';
 export declare const FileAttachment: Node<any, any>;
 //# sourceMappingURL=file-attachment.d.ts.map

package/dist/composed/extensions/mention-suggestion.d.ts

@@ -1,6 +1,5 @@
-"use client";
 import { SuggestionKeyDownProps, SuggestionProps } from '@tiptap/suggestion';
-import { MentionItem } from '../rich-text-editor';
+import { MentionItem } from '../rich-text-editor.js';
 export declare function createSuggestionRenderer(onMentionSelect?: (item: MentionItem) => void): () => {
     onStart: (props: SuggestionProps<MentionItem>) => void;
     onUpdate: (props: SuggestionProps<MentionItem>) => void;

package/dist/composed/extensions/slash-command.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import { Editor, Extension } from '@tiptap/core';
 import * as React from 'react';
 export interface SlashCommand {

package/dist/composed/file-preview/audio-preview.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export default function AudioPreview({ url, fileName, onError }: {
     url: string;

package/dist/composed/file-preview/document-preview.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export default function DocumentPreview({ url, initialPage, onError }: {
     url: string;

package/dist/composed/file-preview/embed-preview.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export default function EmbedPreview({ url, embedUrl, onError }: {
     url: string;

package/dist/composed/file-preview/image-preview.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export default function ImagePreview({ url, alt, onError }: {
     url: string;

package/dist/composed/file-preview/shared.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export declare function ErrorFallback({ message, url }: {
     message: string;

package/dist/composed/file-preview/video-preview.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export default function VideoPreview({ url, onError }: {
     url: string;

package/dist/composed/file-preview.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 type FileType = 'image' | 'pdf' | 'video' | 'audio' | 'embed';
 export interface FilePreviewProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onError'> {

package/dist/composed/filter-bar.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 type FilterBarSize = 'xs' | 'sm' | 'md';
 /**

package/dist/composed/form-section.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export interface FormSectionProps extends React.HTMLAttributes<HTMLDivElement> {
     title: string;

package/dist/composed/global-loading.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export interface GlobalLoadingProps extends React.ComponentPropsWithoutRef<'div'> {
     isLoading: boolean;

package/dist/composed/index.d.ts

@@ -1,4 +1,3 @@
-"use client";
 /**
  * @module @devalok/shilp-sutra/composed
  *
@@ -13,53 +12,53 @@
  * import { PageHeader } from '@devalok/shilp-sutra/composed/page-header'
  * import { DatePicker } from '@devalok/shilp-sutra/composed/date-picker'
  */
-export type { ActivityFeedProps, ActivityItem, GroupLabels } from './activity-feed';
-export { ActivityFeed, groupItemsByTime } from './activity-feed';
-export type { AvatarGroupProps, AvatarUser } from './avatar-group';
-export { AvatarGroup } from './avatar-group';
-export type { BulkActionBarAction, BulkActionBarProps } from './bulk-action-bar';
-export { BulkActionBar } from './bulk-action-bar';
-export type { CommandGroup, CommandItem, CommandPaletteProps, FooterHint } from './command-palette';
-export { CommandPalette } from './command-palette';
-export type { ConfirmDialogProps } from './confirm-dialog';
-export { ConfirmDialog } from './confirm-dialog';
-export type { ContentCardProps } from './content-card';
-export { ContentCard, contentCardVariants } from './content-card';
-export type { DeadlineIndicatorProps } from './deadline-indicator';
-export { DeadlineIndicator } from './deadline-indicator';
-export type { EmptyStateProps } from './empty-state';
-export { EmptyState } from './empty-state';
-export type { ErrorBoundaryProps, ErrorDisplayProps } from './error-boundary';
-export { ErrorBoundary, ErrorDisplay } from './error-boundary';
-export type { SlashCommand, SlashCommandGroup } from './extensions/slash-command';
-export type { FilterBarProps, FilterMultiSelectProps, FilterSelectProps } from './filter-bar';
-export { FilterBar, FilterMultiSelect, FilterSelect } from './filter-bar';
-export type { FormSectionProps } from './form-section';
-export { FormSection } from './form-section';
-export type { GlobalLoadingProps } from './global-loading';
-export { GlobalLoading } from './global-loading';
-export type { InlineEditProps } from './inline-edit';
-export { InlineEdit } from './inline-edit';
-export { getInitials } from './lib/string-utils';
-export type { BoardSkeletonProps, CardSkeletonProps, ListSkeletonProps, TableSkeletonProps } from './loading-skeleton';
-export { BoardSkeleton, CardSkeleton, ListSkeleton, TableSkeleton } from './loading-skeleton';
-export type { MasterDetailProps } from './master-detail';
-export { MasterDetail } from './master-detail';
-export type { MemberPickerMember, MemberPickerProps } from './member-picker';
-export { MemberPicker } from './member-picker';
-export type { MultiSelectGroup, MultiSelectItem, MultiSelectPopoverProps } from './multi-select-popover';
-export { MultiSelectPopover } from './multi-select-popover';
-export type { Breadcrumb, PageHeaderProps } from './page-header';
-export { PageHeader } from './page-header';
-export { DashboardSkeleton, ProjectListSkeleton, TaskDetailSkeleton, } from './page-skeletons';
-export type { Priority, PriorityIndicatorProps } from './priority-indicator';
-export { PriorityIndicator } from './priority-indicator';
-export type { ResponsiveModalContentProps, ResponsiveModalProps, } from './responsive-modal';
-export { ResponsiveModal, ResponsiveModalBackground, ResponsiveModalBody, ResponsiveModalClose, ResponsiveModalContent, ResponsiveModalDescription, ResponsiveModalFooter, ResponsiveModalHeader, ResponsiveModalOverlay, ResponsiveModalPortal, ResponsiveModalTitle, ResponsiveModalTrigger, } from './responsive-modal';
-export type { ScheduleEvent, ScheduleViewProps } from './schedule-view';
-export { ScheduleView } from './schedule-view';
-export type { SimpleTooltipProps } from './simple-tooltip';
-export { SimpleTooltip } from './simple-tooltip';
-export type { StatusBadgeProps } from './status-badge';
-export { StatusBadge } from './status-badge';
+export type { ActivityFeedProps, ActivityItem, GroupLabels } from './activity-feed.js';
+export { ActivityFeed, groupItemsByTime } from './activity-feed.js';
+export type { AvatarGroupProps, AvatarUser } from './avatar-group.js';
+export { AvatarGroup } from './avatar-group.js';
+export type { BulkActionBarAction, BulkActionBarProps } from './bulk-action-bar.js';
+export { BulkActionBar } from './bulk-action-bar.js';
+export type { CommandGroup, CommandItem, CommandPaletteProps, FooterHint } from './command-palette.js';
+export { CommandPalette } from './command-palette.js';
+export type { ConfirmDialogProps } from './confirm-dialog.js';
+export { ConfirmDialog } from './confirm-dialog.js';
+export type { ContentCardProps } from './content-card.js';
+export { ContentCard, contentCardVariants } from './content-card.js';
+export type { DeadlineIndicatorProps } from './deadline-indicator.js';
+export { DeadlineIndicator } from './deadline-indicator.js';
+export type { EmptyStateProps } from './empty-state.js';
+export { EmptyState } from './empty-state.js';
+export type { ErrorBoundaryProps, ErrorDisplayProps } from './error-boundary.js';
+export { ErrorBoundary, ErrorDisplay } from './error-boundary.js';
+export type { SlashCommand, SlashCommandGroup } from './extensions/slash-command.js';
+export type { FilterBarProps, FilterMultiSelectProps, FilterSelectProps } from './filter-bar.js';
+export { FilterBar, FilterMultiSelect, FilterSelect } from './filter-bar.js';
+export type { FormSectionProps } from './form-section.js';
+export { FormSection } from './form-section.js';
+export type { GlobalLoadingProps } from './global-loading.js';
+export { GlobalLoading } from './global-loading.js';
+export type { InlineEditProps } from './inline-edit.js';
+export { InlineEdit } from './inline-edit.js';
+export { getInitials } from './lib/string-utils.js';
+export type { BoardSkeletonProps, CardSkeletonProps, ListSkeletonProps, TableSkeletonProps } from './loading-skeleton.js';
+export { BoardSkeleton, CardSkeleton, ListSkeleton, TableSkeleton } from './loading-skeleton.js';
+export type { MasterDetailProps } from './master-detail.js';
+export { MasterDetail } from './master-detail.js';
+export type { MemberPickerMember, MemberPickerProps } from './member-picker.js';
+export { MemberPicker } from './member-picker.js';
+export type { MultiSelectGroup, MultiSelectItem, MultiSelectPopoverProps } from './multi-select-popover.js';
+export { MultiSelectPopover } from './multi-select-popover.js';
+export type { Breadcrumb, PageHeaderProps } from './page-header.js';
+export { PageHeader } from './page-header.js';
+export { DashboardSkeleton, ProjectListSkeleton, TaskDetailSkeleton, } from './page-skeletons.js';
+export type { Priority, PriorityIndicatorProps } from './priority-indicator.js';
+export { PriorityIndicator } from './priority-indicator.js';
+export type { ResponsiveModalContentProps, ResponsiveModalProps, } from './responsive-modal.js';
+export { ResponsiveModal, ResponsiveModalBackground, ResponsiveModalBody, ResponsiveModalClose, ResponsiveModalContent, ResponsiveModalDescription, ResponsiveModalFooter, ResponsiveModalHeader, ResponsiveModalOverlay, ResponsiveModalPortal, ResponsiveModalTitle, ResponsiveModalTrigger, } from './responsive-modal.js';
+export type { ScheduleEvent, ScheduleViewProps } from './schedule-view.js';
+export { ScheduleView } from './schedule-view.js';
+export type { SimpleTooltipProps } from './simple-tooltip.js';
+export { SimpleTooltip } from './simple-tooltip.js';
+export type { StatusBadgeProps } from './status-badge.js';
+export { StatusBadge } from './status-badge.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/composed/inline-edit.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export interface InlineEditProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSave'> {
     value: string;

package/dist/composed/loading-skeleton.d.ts

@@ -1,6 +1,8 @@
 import * as React from 'react';
 export interface CardSkeletonProps extends React.ComponentPropsWithoutRef<'div'> {
     className?: string;
+    /** Accessible label for the loading region. @default 'Loading' */
+    label?: string;
 }
 declare const CardSkeleton: React.ForwardRefExoticComponent<CardSkeletonProps & React.RefAttributes<HTMLDivElement>>;
 export interface TableSkeletonProps extends CardSkeletonProps {

package/dist/composed/loading-skeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"loading-skeleton.d.ts","sourceRoot":"","sources":["../../src/composed/loading-skeleton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC;IAC9E,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,QAAA,MAAM,YAAY,0FA2BjB,CAAA;AAID,MAAM,WAAW,kBAAmB,SAAQ,iBAAiB;IAC3D,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,QAAA,MAAM,aAAa,2FAqDlB,CAAA;AAID,MAAM,WAAW,kBAAmB,SAAQ,iBAAiB;IAC3D,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAED,QAAA,MAAM,aAAa,2FAiDlB,CAAA;AAID,MAAM,WAAW,iBAAkB,SAAQ,iBAAiB;IAC1D,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,QAAA,MAAM,YAAY,0FA+BjB,CAAA;AAID,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAAC,aAAa,EAAE,CAAA"}
+{"version":3,"file":"loading-skeleton.d.ts","sourceRoot":"","sources":["../../src/composed/loading-skeleton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAkB9B,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC;IAC9E,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kEAAkE;IAClE,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,QAAA,MAAM,YAAY,0FA0BjB,CAAA;AAGD,MAAM,WAAW,kBAAmB,SAAQ,iBAAiB;IAC3D,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,QAAA,MAAM,aAAa,2FAsClB,CAAA;AAGD,MAAM,WAAW,kBAAmB,SAAQ,iBAAiB;IAC3D,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAED,QAAA,MAAM,aAAa,2FA0ClB,CAAA;AAGD,MAAM,WAAW,iBAAkB,SAAQ,iBAAiB;IAC1D,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,QAAA,MAAM,YAAY,0FAyBjB,CAAA;AAGD,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,CAAA"}

package/dist/composed/loading-skeleton.js

@@ -3,102 +3,125 @@ import { Skeleton as t } from "../ui/skeleton.js";
 import * as n from "react";
 import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/composed/loading-skeleton.tsx
-var a = n.forwardRef(function({ className: n, ...a }, o) {
+var a = (e, t) => Math.max(0, Math.floor(typeof e == "number" && !Number.isNaN(e) ? e : t));
+function o(e) {
+	return {
+		role: "status",
+		"aria-busy": !0,
+		"aria-label": e ?? "Loading"
+	};
+}
+function s({ label: e }) {
+	return /* @__PURE__ */ i("span", {
+		className: "sr-only",
+		children: [e ?? "Loading", "…"]
+	});
+}
+var c = n.forwardRef(function({ className: n, label: a, ...c }, l) {
 	return /* @__PURE__ */ i("div", {
-		ref: o,
-		...a,
-		className: e("rounded-surface border border-card-strong bg-surface-raised p-ds-05b", n),
+		ref: l,
+		...o(a),
+		...c,
+		className: e("rounded-surface border border-card bg-surface-raised p-ds-05b", n),
 		children: [
+			/* @__PURE__ */ r(s, { label: a }),
 			/* @__PURE__ */ i("div", {
 				className: "flex items-center justify-between pb-ds-05",
-				children: [/* @__PURE__ */ r(t, { className: "h-ds-05 w-[128px] bg-surface-raised-hover" }), /* @__PURE__ */ r(t, { className: "h-ico-sm w-ico-sm rounded bg-surface-raised-hover" })]
+				children: [/* @__PURE__ */ r(t, { className: "h-ds-05 w-ds-13" }), /* @__PURE__ */ r(t, { className: "h-ico-sm w-ico-sm rounded" })]
 			}),
 			/* @__PURE__ */ i("div", {
 				className: "space-y-ds-04",
 				children: [
-					/* @__PURE__ */ r(t, { className: "h-ds-04 w-full bg-surface-raised-hover" }),
-					/* @__PURE__ */ r(t, { className: "h-ds-04 w-4/5 bg-surface-raised-hover" }),
-					/* @__PURE__ */ r(t, { className: "h-ds-04 w-3/5 bg-surface-raised-hover" })
+					/* @__PURE__ */ r(t, { className: "h-ds-04 w-full" }),
+					/* @__PURE__ */ r(t, { className: "h-ds-04 w-4/5" }),
+					/* @__PURE__ */ r(t, { className: "h-ds-04 w-3/5" })
 				]
 			}),
 			/* @__PURE__ */ i("div", {
 				className: "flex items-center gap-ds-03 pt-ds-05",
-				children: [/* @__PURE__ */ r(t, { className: "h-ds-xs w-ds-xs rounded-pill bg-surface-raised-hover" }), /* @__PURE__ */ r(t, { className: "h-ds-04 w-ds-11 bg-surface-raised-hover" })]
+				children: [/* @__PURE__ */ r(t, { className: "h-ds-xs w-ds-xs rounded-pill" }), /* @__PURE__ */ r(t, { className: "h-ds-04 w-ds-11" })]
 			})
 		]
 	});
 });
-a.displayName = "CardSkeleton";
-var o = n.forwardRef(function({ rows: n = 5, columns: a = 4, className: o, ...s }, c) {
+c.displayName = "CardSkeleton";
+var l = n.forwardRef(function({ rows: n = 5, columns: c = 4, className: l, label: u, ...d }, f) {
+	let p = a(n, 5), m = Math.max(1, a(c, 4));
 	return /* @__PURE__ */ i("div", {
-		ref: c,
-		...s,
-		className: e("overflow-hidden rounded-surface border border-card-strong", o),
-		children: [/* @__PURE__ */ r("div", {
-			className: "flex items-center gap-ds-05 border-b border-surface-border-strong bg-surface-raised px-ds-05 py-ds-04",
-			children: Array.from({ length: a }).map((n, i) => /* @__PURE__ */ r(t, { className: e("h-ds-04 bg-surface-raised-hover", i === 0 ? "w-ds-13" : "flex-1") }, `head-${i}`))
-		}), Array.from({ length: n }).map((i, o) => /* @__PURE__ */ r("div", {
-			className: e("flex items-center gap-ds-05 px-ds-05 py-ds-04", o < n - 1 && "border-b border-surface-border-strong"),
-			style: { animationDelay: `${o * 50}ms` },
-			children: Array.from({ length: a }).map((n, i) => /* @__PURE__ */ r(t, { className: e("h-ds-04 bg-surface-raised-hover", i === 0 ? "w-ds-13" : "flex-1") }, `cell-${o}-${i}`))
-		}, `row-${o}`))]
+		ref: f,
+		...o(u),
+		...d,
+		className: e("overflow-hidden rounded-surface border border-card", l),
+		children: [
+			/* @__PURE__ */ r(s, { label: u }),
+			/* @__PURE__ */ r("div", {
+				className: "flex items-center gap-ds-05 border-b border-surface-border-strong bg-surface-raised px-ds-05 py-ds-04",
+				children: Array.from({ length: m }).map((n, i) => /* @__PURE__ */ r(t, { className: e("h-ds-04", i === 0 ? "w-ds-13" : "flex-1") }, `head-${i}`))
+			}),
+			Array.from({ length: p }).map((n, i) => /* @__PURE__ */ r("div", {
+				className: e("flex items-center gap-ds-05 px-ds-05 py-ds-04", i < p - 1 && "border-b border-surface-border-strong"),
+				children: Array.from({ length: m }).map((n, a) => /* @__PURE__ */ r(t, { className: e("h-ds-04", a === 0 ? "w-ds-13" : "flex-1") }, `cell-${i}-${a}`))
+			}, `row-${i}`))
+		]
 	});
 });
-o.displayName = "TableSkeleton";
-var s = n.forwardRef(function({ columns: n = 4, cardsPerColumn: a = 3, className: o, ...s }, c) {
-	return /* @__PURE__ */ r("div", {
-		ref: c,
-		...s,
-		className: e("flex gap-ds-05 overflow-x-auto", o),
-		children: Array.from({ length: n }).map((e, n) => /* @__PURE__ */ i("div", {
+l.displayName = "TableSkeleton";
+var u = n.forwardRef(function({ columns: n = 4, cardsPerColumn: c = 3, className: l, label: u, ...d }, f) {
+	let p = a(n, 4), m = a(c, 3);
+	return /* @__PURE__ */ i("div", {
+		ref: f,
+		...o(u),
+		...d,
+		className: e("flex gap-ds-05 overflow-x-auto", l),
+		children: [/* @__PURE__ */ r(s, { label: u }), Array.from({ length: p }).map((e, n) => /* @__PURE__ */ i("div", {
 			className: "flex w-[272px] shrink-0 flex-col gap-ds-03",
 			children: [/* @__PURE__ */ i("div", {
 				className: "flex items-center justify-between px-ds-02 py-ds-03",
 				children: [/* @__PURE__ */ i("div", {
 					className: "flex items-center gap-ds-03",
 					children: [
-						/* @__PURE__ */ r(t, { className: "h-ds-04 w-ds-04 rounded bg-surface-raised-hover" }),
-						/* @__PURE__ */ r(t, { className: "h-ds-04 w-ds-11 bg-surface-raised-hover" }),
-						/* @__PURE__ */ r(t, { className: "h-ds-05 w-ds-05b rounded-pill bg-surface-raised-hover" })
+						/* @__PURE__ */ r(t, { className: "h-ds-04 w-ds-04 rounded" }),
+						/* @__PURE__ */ r(t, { className: "h-ds-04 w-ds-11" }),
+						/* @__PURE__ */ r(t, { className: "h-ds-05 w-ds-05b rounded-pill" })
 					]
-				}), /* @__PURE__ */ r(t, { className: "h-ico-sm w-ico-sm rounded bg-surface-raised-hover" })]
-			}), Array.from({ length: a }).map((e, o) => /* @__PURE__ */ i("div", {
-				className: "rounded-surface border border-card-strong bg-surface-raised p-ds-04",
-				style: { animationDelay: `${(n * a + o) * 50}ms` },
+				}), /* @__PURE__ */ r(t, { className: "h-ico-sm w-ico-sm rounded" })]
+			}), Array.from({ length: m }).map((e, a) => /* @__PURE__ */ i("div", {
+				className: "rounded-surface border border-card bg-surface-raised p-ds-04",
 				children: [/* @__PURE__ */ i("div", {
 					className: "space-y-ds-03",
-					children: [/* @__PURE__ */ r(t, { className: "h-ds-04 w-4/5 bg-surface-raised-hover" }), /* @__PURE__ */ r(t, { className: "h-ds-04 w-3/5 bg-surface-raised-hover" })]
+					children: [/* @__PURE__ */ r(t, { className: "h-ds-04 w-4/5" }), /* @__PURE__ */ r(t, { className: "h-ds-04 w-3/5" })]
 				}), /* @__PURE__ */ i("div", {
 					className: "flex items-center justify-between pt-ds-04",
 					children: [/* @__PURE__ */ i("div", {
 						className: "flex items-center gap-ds-02b",
-						children: [/* @__PURE__ */ r(t, { className: "h-ico-md w-ico-md rounded-pill bg-surface-raised-hover" }), /* @__PURE__ */ r(t, { className: "h-ds-03 w-ds-10 bg-surface-raised-hover" })]
-					}), /* @__PURE__ */ r(t, { className: "h-ds-05 w-ds-lg rounded-pill bg-surface-raised-hover" })]
+						children: [/* @__PURE__ */ r(t, { className: "h-ico-md w-ico-md rounded-pill" }), /* @__PURE__ */ r(t, { className: "h-ds-03 w-ds-10" })]
+					}), /* @__PURE__ */ r(t, { className: "h-ds-05 w-ds-lg rounded-pill" })]
 				})]
-			}, `card-${n}-${o}`))]
-		}, `col-${n}`))
+			}, `card-${n}-${a}`))]
+		}, `col-${n}`))]
 	});
 });
-s.displayName = "BoardSkeleton";
-var c = n.forwardRef(function({ rows: n = 6, showAvatar: a = !0, className: o, ...s }, c) {
-	return /* @__PURE__ */ r("div", {
-		ref: c,
-		...s,
-		className: e("flex flex-col", o),
-		children: Array.from({ length: n }).map((o, s) => /* @__PURE__ */ i("div", {
-			className: e("flex items-center gap-ds-04 py-ds-04", s < n - 1 && "border-b border-surface-border-strong"),
-			style: { animationDelay: `${s * 50}ms` },
+u.displayName = "BoardSkeleton";
+var d = n.forwardRef(function({ rows: n = 6, showAvatar: c = !0, className: l, label: u, ...d }, f) {
+	let p = a(n, 6);
+	return /* @__PURE__ */ i("div", {
+		ref: f,
+		...o(u),
+		...d,
+		className: e("flex flex-col", l),
+		children: [/* @__PURE__ */ r(s, { label: u }), Array.from({ length: p }).map((n, a) => /* @__PURE__ */ i("div", {
+			className: e("flex items-center gap-ds-04 py-ds-04", a < p - 1 && "border-b border-surface-border-strong"),
 			children: [
-				a && /* @__PURE__ */ r(t, { className: "h-ds-sm w-ds-sm shrink-0 rounded-pill bg-surface-raised-hover" }),
+				c && /* @__PURE__ */ r(t, { className: "h-ds-sm w-ds-sm shrink-0 rounded-pill" }),
 				/* @__PURE__ */ i("div", {
 					className: "flex flex-1 flex-col gap-ds-02b",
-					children: [/* @__PURE__ */ r(t, { className: "h-ds-04 w-2/5 bg-surface-raised-hover" }), /* @__PURE__ */ r(t, { className: "h-ds-03 w-3/5 bg-surface-raised-hover" })]
+					children: [/* @__PURE__ */ r(t, { className: "h-ds-04 w-2/5" }), /* @__PURE__ */ r(t, { className: "h-ds-03 w-3/5" })]
 				}),
-				/* @__PURE__ */ r(t, { className: "h-ds-05b w-[56px] rounded-pill bg-surface-raised-hover" })
+				/* @__PURE__ */ r(t, { className: "h-ds-05b w-ds-09 rounded-pill" })
 			]
-		}, `list-${s}`))
+		}, `list-${a}`))]
 	});
 });
-c.displayName = "ListSkeleton";
+d.displayName = "ListSkeleton";
 //#endregion
-export { s as BoardSkeleton, a as CardSkeleton, c as ListSkeleton, o as TableSkeleton };
+export { u as BoardSkeleton, c as CardSkeleton, d as ListSkeleton, l as TableSkeleton };

package/dist/composed/loading-skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"loading-skeleton.js","names":[],"sources":["../../src/composed/loading-skeleton.tsx"],"sourcesContent":["// @server-safe\nimport * as React from 'react'\n\nimport { cn } from '../ui/lib/utils'\nimport { Skeleton } from '../ui/skeleton'\n\nexport interface CardSkeletonProps extends React.ComponentPropsWithoutRef<'div'> {\n  className?: string\n}\n\nconst CardSkeleton = React.forwardRef<HTMLDivElement, CardSkeletonProps>(\n  function CardSkeleton({ className, ...props }, ref) {\n  return (\n    <div\n      ref={ref}\n      {...props}\n      className={cn(\n        'rounded-surface border border-card-strong bg-surface-raised p-ds-05b',\n        className,\n      )}\n    >\n      <div className=\"flex items-center justify-between pb-ds-05\">\n        <Skeleton className=\"h-ds-05 w-[128px] bg-surface-raised-hover\" />\n        <Skeleton className=\"h-ico-sm w-ico-sm rounded bg-surface-raised-hover\" />\n      </div>\n      <div className=\"space-y-ds-04\">\n        <Skeleton className=\"h-ds-04 w-full bg-surface-raised-hover\" />\n        <Skeleton className=\"h-ds-04 w-4/5 bg-surface-raised-hover\" />\n        <Skeleton className=\"h-ds-04 w-3/5 bg-surface-raised-hover\" />\n      </div>\n      <div className=\"flex items-center gap-ds-03 pt-ds-05\">\n        <Skeleton className=\"h-ds-xs w-ds-xs rounded-pill bg-surface-raised-hover\" />\n        <Skeleton className=\"h-ds-04 w-ds-11 bg-surface-raised-hover\" />\n      </div>\n    </div>\n  )\n},\n)\n\nCardSkeleton.displayName = 'CardSkeleton'\n\nexport interface TableSkeletonProps extends CardSkeletonProps {\n  rows?: number\n  columns?: number\n}\n\nconst TableSkeleton = React.forwardRef<HTMLDivElement, TableSkeletonProps>(\n  function TableSkeleton({\n  rows = 5,\n  columns = 4,\n  className,\n  ...props\n}, ref) {\n  return (\n    <div\n      ref={ref}\n      {...props}\n      className={cn(\n        'overflow-hidden rounded-surface border border-card-strong',\n        className,\n      )}\n    >\n      {/* Header */}\n      <div className=\"flex items-center gap-ds-05 border-b border-surface-border-strong bg-surface-raised px-ds-05 py-ds-04\">\n        {Array.from({ length: columns }).map((_, i) => (\n          <Skeleton\n            key={`head-${i}`}\n            className={cn(\n              'h-ds-04 bg-surface-raised-hover',\n              i === 0 ? 'w-ds-13' : 'flex-1',\n            )}\n          />\n        ))}\n      </div>\n\n      {/* Rows */}\n      {Array.from({ length: rows }).map((_, rowIndex) => (\n        <div\n          key={`row-${rowIndex}`}\n          className={cn(\n            'flex items-center gap-ds-05 px-ds-05 py-ds-04',\n            rowIndex < rows - 1 && 'border-b border-surface-border-strong',\n          )}\n          style={{ animationDelay: `${rowIndex * 50}ms` }}\n        >\n          {Array.from({ length: columns }).map((_, colIndex) => (\n            <Skeleton\n              key={`cell-${rowIndex}-${colIndex}`}\n              className={cn(\n                'h-ds-04 bg-surface-raised-hover',\n                colIndex === 0 ? 'w-ds-13' : 'flex-1',\n              )}\n            />\n          ))}\n        </div>\n      ))}\n    </div>\n  )\n},\n)\n\nTableSkeleton.displayName = 'TableSkeleton'\n\nexport interface BoardSkeletonProps extends CardSkeletonProps {\n  columns?: number\n  cardsPerColumn?: number\n}\n\nconst BoardSkeleton = React.forwardRef<HTMLDivElement, BoardSkeletonProps>(\n  function BoardSkeleton({\n  columns = 4,\n  cardsPerColumn = 3,\n  className,\n  ...props\n}, ref) {\n  return (\n    <div ref={ref} {...props} className={cn('flex gap-ds-05 overflow-x-auto', className)}>\n      {Array.from({ length: columns }).map((_, colIndex) => (\n        <div\n          key={`col-${colIndex}`}\n          className=\"flex w-[272px] shrink-0 flex-col gap-ds-03\"\n        >\n          {/* Column header */}\n          <div className=\"flex items-center justify-between px-ds-02 py-ds-03\">\n            <div className=\"flex items-center gap-ds-03\">\n              <Skeleton className=\"h-ds-04 w-ds-04 rounded bg-surface-raised-hover\" />\n              <Skeleton className=\"h-ds-04 w-ds-11 bg-surface-raised-hover\" />\n              <Skeleton className=\"h-ds-05 w-ds-05b rounded-pill bg-surface-raised-hover\" />\n            </div>\n            <Skeleton className=\"h-ico-sm w-ico-sm rounded bg-surface-raised-hover\" />\n          </div>\n\n          {/* Column cards */}\n          {Array.from({ length: cardsPerColumn }).map((_, cardIndex) => (\n            <div\n              key={`card-${colIndex}-${cardIndex}`}\n              className=\"rounded-surface border border-card-strong bg-surface-raised p-ds-04\"\n              style={{ animationDelay: `${(colIndex * cardsPerColumn + cardIndex) * 50}ms` }}\n            >\n              <div className=\"space-y-ds-03\">\n                <Skeleton className=\"h-ds-04 w-4/5 bg-surface-raised-hover\" />\n                <Skeleton className=\"h-ds-04 w-3/5 bg-surface-raised-hover\" />\n              </div>\n              <div className=\"flex items-center justify-between pt-ds-04\">\n                <div className=\"flex items-center gap-ds-02b\">\n                  <Skeleton className=\"h-ico-md w-ico-md rounded-pill bg-surface-raised-hover\" />\n                  <Skeleton className=\"h-ds-03 w-ds-10 bg-surface-raised-hover\" />\n                </div>\n                <Skeleton className=\"h-ds-05 w-ds-lg rounded-pill bg-surface-raised-hover\" />\n              </div>\n            </div>\n          ))}\n        </div>\n      ))}\n    </div>\n  )\n},\n)\n\nBoardSkeleton.displayName = 'BoardSkeleton'\n\nexport interface ListSkeletonProps extends CardSkeletonProps {\n  rows?: number\n  showAvatar?: boolean\n}\n\nconst ListSkeleton = React.forwardRef<HTMLDivElement, ListSkeletonProps>(\n  function ListSkeleton({\n  rows = 6,\n  showAvatar = true,\n  className,\n  ...props\n}, ref) {\n  return (\n    <div ref={ref} {...props} className={cn('flex flex-col', className)}>\n      {Array.from({ length: rows }).map((_, i) => (\n        <div\n          key={`list-${i}`}\n          className={cn(\n            'flex items-center gap-ds-04 py-ds-04',\n            i < rows - 1 && 'border-b border-surface-border-strong',\n          )}\n          style={{ animationDelay: `${i * 50}ms` }}\n        >\n          {showAvatar && (\n            <Skeleton className=\"h-ds-sm w-ds-sm shrink-0 rounded-pill bg-surface-raised-hover\" />\n          )}\n          <div className=\"flex flex-1 flex-col gap-ds-02b\">\n            <Skeleton className=\"h-ds-04 w-2/5 bg-surface-raised-hover\" />\n            <Skeleton className=\"h-ds-03 w-3/5 bg-surface-raised-hover\" />\n          </div>\n          <Skeleton className=\"h-ds-05b w-[56px] rounded-pill bg-surface-raised-hover\" />\n        </div>\n      ))}\n    </div>\n  )\n},\n)\n\nListSkeleton.displayName = 'ListSkeleton'\n\nexport { BoardSkeleton, CardSkeleton, ListSkeleton,TableSkeleton }\n"],"mappings":"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"}
+{"version":3,"file":"loading-skeleton.js","names":[],"sources":["../../src/composed/loading-skeleton.tsx"],"sourcesContent":["// @server-safe\nimport * as React from 'react'\n\nimport { cn } from '../ui/lib/utils'\nimport { Skeleton } from '../ui/skeleton'\n\n// Non-negative integer count (guards Array.from against NaN / negatives → RangeError).\nconst clamp = (n: number | undefined, fallback: number) =>\n  Math.max(0, Math.floor(typeof n === 'number' && !Number.isNaN(n) ? n : fallback))\n\n// role=status + aria-busy so AT announces the loading region (child Skeletons are\n// aria-hidden). sr-only label gives the announcement text.\nfunction statusProps(label?: string) {\n  return { role: 'status' as const, 'aria-busy': true, 'aria-label': label ?? 'Loading' }\n}\nfunction SrLabel({ label }: { label?: string }) {\n  return <span className=\"sr-only\">{label ?? 'Loading'}…</span>\n}\n\nexport interface CardSkeletonProps extends React.ComponentPropsWithoutRef<'div'> {\n  className?: string\n  /** Accessible label for the loading region. @default 'Loading' */\n  label?: string\n}\n\nconst CardSkeleton = React.forwardRef<HTMLDivElement, CardSkeletonProps>(\n  function CardSkeleton({ className, label, ...props }, ref) {\n    return (\n      <div\n        ref={ref}\n        {...statusProps(label)}\n        {...props}\n        className={cn('rounded-surface border border-card bg-surface-raised p-ds-05b', className)}\n      >\n        <SrLabel label={label} />\n        <div className=\"flex items-center justify-between pb-ds-05\">\n          <Skeleton className=\"h-ds-05 w-ds-13\" />\n          <Skeleton className=\"h-ico-sm w-ico-sm rounded\" />\n        </div>\n        <div className=\"space-y-ds-04\">\n          <Skeleton className=\"h-ds-04 w-full\" />\n          <Skeleton className=\"h-ds-04 w-4/5\" />\n          <Skeleton className=\"h-ds-04 w-3/5\" />\n        </div>\n        <div className=\"flex items-center gap-ds-03 pt-ds-05\">\n          <Skeleton className=\"h-ds-xs w-ds-xs rounded-pill\" />\n          <Skeleton className=\"h-ds-04 w-ds-11\" />\n        </div>\n      </div>\n    )\n  },\n)\nCardSkeleton.displayName = 'CardSkeleton'\n\nexport interface TableSkeletonProps extends CardSkeletonProps {\n  rows?: number\n  columns?: number\n}\n\nconst TableSkeleton = React.forwardRef<HTMLDivElement, TableSkeletonProps>(\n  function TableSkeleton({ rows = 5, columns = 4, className, label, ...props }, ref) {\n    const r = clamp(rows, 5)\n    const c = Math.max(1, clamp(columns, 4))\n    return (\n      <div\n        ref={ref}\n        {...statusProps(label)}\n        {...props}\n        className={cn('overflow-hidden rounded-surface border border-card', className)}\n      >\n        <SrLabel label={label} />\n        {/* Header */}\n        <div className=\"flex items-center gap-ds-05 border-b border-surface-border-strong bg-surface-raised px-ds-05 py-ds-04\">\n          {Array.from({ length: c }).map((_, i) => (\n            <Skeleton key={`head-${i}`} className={cn('h-ds-04', i === 0 ? 'w-ds-13' : 'flex-1')} />\n          ))}\n        </div>\n        {/* Rows */}\n        {Array.from({ length: r }).map((_, rowIndex) => (\n          <div\n            key={`row-${rowIndex}`}\n            className={cn(\n              'flex items-center gap-ds-05 px-ds-05 py-ds-04',\n              rowIndex < r - 1 && 'border-b border-surface-border-strong',\n            )}\n          >\n            {Array.from({ length: c }).map((_, colIndex) => (\n              <Skeleton\n                key={`cell-${rowIndex}-${colIndex}`}\n                className={cn('h-ds-04', colIndex === 0 ? 'w-ds-13' : 'flex-1')}\n              />\n            ))}\n          </div>\n        ))}\n      </div>\n    )\n  },\n)\nTableSkeleton.displayName = 'TableSkeleton'\n\nexport interface BoardSkeletonProps extends CardSkeletonProps {\n  columns?: number\n  cardsPerColumn?: number\n}\n\nconst BoardSkeleton = React.forwardRef<HTMLDivElement, BoardSkeletonProps>(\n  function BoardSkeleton({ columns = 4, cardsPerColumn = 3, className, label, ...props }, ref) {\n    const c = clamp(columns, 4)\n    const cards = clamp(cardsPerColumn, 3)\n    return (\n      <div ref={ref} {...statusProps(label)} {...props} className={cn('flex gap-ds-05 overflow-x-auto', className)}>\n        <SrLabel label={label} />\n        {Array.from({ length: c }).map((_, colIndex) => (\n          <div key={`col-${colIndex}`} className=\"flex w-[272px] shrink-0 flex-col gap-ds-03\">\n            {/* Column header */}\n            <div className=\"flex items-center justify-between px-ds-02 py-ds-03\">\n              <div className=\"flex items-center gap-ds-03\">\n                <Skeleton className=\"h-ds-04 w-ds-04 rounded\" />\n                <Skeleton className=\"h-ds-04 w-ds-11\" />\n                <Skeleton className=\"h-ds-05 w-ds-05b rounded-pill\" />\n              </div>\n              <Skeleton className=\"h-ico-sm w-ico-sm rounded\" />\n            </div>\n            {/* Column cards */}\n            {Array.from({ length: cards }).map((_, cardIndex) => (\n              <div\n                key={`card-${colIndex}-${cardIndex}`}\n                className=\"rounded-surface border border-card bg-surface-raised p-ds-04\"\n              >\n                <div className=\"space-y-ds-03\">\n                  <Skeleton className=\"h-ds-04 w-4/5\" />\n                  <Skeleton className=\"h-ds-04 w-3/5\" />\n                </div>\n                <div className=\"flex items-center justify-between pt-ds-04\">\n                  <div className=\"flex items-center gap-ds-02b\">\n                    <Skeleton className=\"h-ico-md w-ico-md rounded-pill\" />\n                    <Skeleton className=\"h-ds-03 w-ds-10\" />\n                  </div>\n                  <Skeleton className=\"h-ds-05 w-ds-lg rounded-pill\" />\n                </div>\n              </div>\n            ))}\n          </div>\n        ))}\n      </div>\n    )\n  },\n)\nBoardSkeleton.displayName = 'BoardSkeleton'\n\nexport interface ListSkeletonProps extends CardSkeletonProps {\n  rows?: number\n  showAvatar?: boolean\n}\n\nconst ListSkeleton = React.forwardRef<HTMLDivElement, ListSkeletonProps>(\n  function ListSkeleton({ rows = 6, showAvatar = true, className, label, ...props }, ref) {\n    const r = clamp(rows, 6)\n    return (\n      <div ref={ref} {...statusProps(label)} {...props} className={cn('flex flex-col', className)}>\n        <SrLabel label={label} />\n        {Array.from({ length: r }).map((_, i) => (\n          <div\n            key={`list-${i}`}\n            className={cn(\n              'flex items-center gap-ds-04 py-ds-04',\n              i < r - 1 && 'border-b border-surface-border-strong',\n            )}\n          >\n            {showAvatar && <Skeleton className=\"h-ds-sm w-ds-sm shrink-0 rounded-pill\" />}\n            <div className=\"flex flex-1 flex-col gap-ds-02b\">\n              <Skeleton className=\"h-ds-04 w-2/5\" />\n              <Skeleton className=\"h-ds-03 w-3/5\" />\n            </div>\n            <Skeleton className=\"h-ds-05b w-ds-09 rounded-pill\" />\n          </div>\n        ))}\n      </div>\n    )\n  },\n)\nListSkeleton.displayName = 'ListSkeleton'\n\nexport { BoardSkeleton, CardSkeleton, ListSkeleton, TableSkeleton }\n"],"mappings":"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"}

package/dist/composed/markdown-viewer.d.ts

@@ -1,4 +1,3 @@
-"use client";
 import * as React from 'react';
 export interface MarkdownViewerProps extends React.HTMLAttributes<HTMLDivElement> {
     content: string;

package/dist/composed/master-detail.d.ts

@@ -1,13 +1,22 @@
-"use client";
 import * as React from 'react';
 /**
- * A responsive master-detail layout. On desktop, shows a fixed-width list panel
- * alongside a detail panel. Below the breakpoint, switches to a stacked view
- * with animated transitions and a back button.
+ * A responsive master-detail layout. Desktop: fixed-width list panel + detail
+ * panel. Below the breakpoint: stacked view with a back button. The list is an
+ * ARIA `listbox` with roving keyboard nav (Arrow/Home/End + Enter/Space).
+ *
+ * Selection can be **controlled** (`selected`) or **owned** by the component
+ * (`defaultSelected` + `onSelect`, deriving each row's active state from its
+ * `value` — no hand-wiring `active` + `onClick` per row).
  */
-export interface MasterDetailProps extends React.HTMLAttributes<HTMLDivElement> {
-    /** ID of currently selected item. null = no selection (show list on mobile). */
+export interface MasterDetailProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> {
+    /** Controlled selected item id. `null` = no selection. Omit for uncontrolled. */
     selected?: string | null;
+    /** Uncontrolled initial selection. */
+    defaultSelected?: string | null;
+    /** Called with a row's `value` when it's chosen (click or Enter/Space). */
+    onSelect?: (value: string) => void;
+    /** Accessible name for the list (the `listbox`). @default 'Items' */
+    label?: string;
     /** Called when mobile back button is pressed. */
     onBack?: () => void;
     /** Master panel width on desktop. @default '280px' */
@@ -16,7 +25,7 @@ export interface MasterDetailProps extends React.HTMLAttributes<HTMLDivElement>
     breakpoint?: 'sm' | 'md' | 'lg';
     /** Content to show in the detail pane when nothing is selected. */
     emptyState?: React.ReactNode;
-    /** Called when user presses ArrowUp/ArrowDown while the list has focus. */
+    /** Called when the user presses ArrowUp/ArrowDown while the list has focus. */
     onNavigate?: (direction: 'up' | 'down') => void;
 }
 interface MasterDetailListProps extends React.HTMLAttributes<HTMLDivElement> {
@@ -24,11 +33,14 @@ interface MasterDetailListProps extends React.HTMLAttributes<HTMLDivElement> {
 interface MasterDetailDetailProps extends React.HTMLAttributes<HTMLDivElement> {
 }
 interface MasterDetailListItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Explicit active state. Omit to derive from `value` === the selected id. */
     active?: boolean;
+    /** Row id — enables derived selection + auto-fires `onSelect` on activate. */
+    value?: string;
 }
-declare function MasterDetailList({ children, className, ...props }: MasterDetailListProps): React.JSX.Element | null;
+declare function MasterDetailList({ children, className, 'aria-label': ariaLabel, ...props }: MasterDetailListProps): React.JSX.Element | null;
 declare function MasterDetailDetail({ children, className, ...props }: MasterDetailDetailProps): React.JSX.Element | null;
-declare function MasterDetailRoot({ selected, onBack, masterWidth, breakpoint, emptyState, onNavigate, children, className, style, ...props }: MasterDetailProps): React.JSX.Element;
+declare function MasterDetailRoot({ selected, defaultSelected, onSelect, label, onBack, masterWidth, breakpoint, emptyState, onNavigate, children, className, style, ...props }: MasterDetailProps): React.JSX.Element;
 declare const MasterDetail: typeof MasterDetailRoot & {
     List: typeof MasterDetailList;
     Detail: typeof MasterDetailDetail;

package/dist/composed/master-detail.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"master-detail.d.ts","sourceRoot":"","sources":["../../src/composed/master-detail.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAW9B;;;;GAIG;AACH,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC7E,gFAAgF;IAChF,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACxB,iDAAiD;IACjD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,sDAAsD;IACtD,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mEAAmE;IACnE,UAAU,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IAC/B,mEAAmE;IACnE,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,2EAA2E;IAC3E,UAAU,CAAC,EAAE,CAAC,SAAS,EAAE,IAAI,GAAG,MAAM,KAAK,IAAI,CAAA;CAChD;AAED,UAAU,qBAAsB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAE/E,UAAU,uBAAwB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAEjF,UAAU,yBAA0B,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACvF,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AA0DD,iBAAS,gBAAgB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,qBAAqB,4BAgFjF;AAED,iBAAS,kBAAkB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,uBAAuB,4BA4BrF;AAwCD,iBAAS,gBAAgB,CAAC,EACxB,QAAe,EACf,MAAM,EACN,WAAqB,EACrB,UAAiB,EACjB,UAAU,EACV,UAAU,EACV,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,iBAAiB,qBA4BnB;AAED,QAAA,MAAM,YAAY;;;;CAIhB,CAAA;AAEF,OAAO,EAAE,YAAY,EAAE,CAAA;AACvB,YAAY,EAAE,yBAAyB,EAAE,CAAA"}
+{"version":3,"file":"master-detail.d.ts","sourceRoot":"","sources":["../../src/composed/master-detail.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B;;;;;;;;GAQG;AACH,MAAM,WAAW,iBAEf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IAC9D,iFAAiF;IACjF,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACxB,sCAAsC;IACtC,eAAe,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC/B,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,qEAAqE;IACrE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iDAAiD;IACjD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,sDAAsD;IACtD,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mEAAmE;IACnE,UAAU,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IAC/B,mEAAmE;IACnE,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,+EAA+E;IAC/E,UAAU,CAAC,EAAE,CAAC,SAAS,EAAE,IAAI,GAAG,MAAM,KAAK,IAAI,CAAA;CAChD;AAED,UAAU,qBAAsB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAC/E,UAAU,uBAAwB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AACjF,UAAU,yBAA0B,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACvF,8EAA8E;IAC9E,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,8EAA8E;IAC9E,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AA6CD,iBAAS,gBAAgB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,qBAAqB,4BA2D1G;AAED,iBAAS,kBAAkB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,uBAAuB,4BA4BrF;AA4CD,iBAAS,gBAAgB,CAAC,EACxB,QAAQ,EACR,eAAsB,EACtB,QAAQ,EACR,KAAe,EACf,MAAM,EACN,WAAqB,EACrB,UAAiB,EACjB,UAAU,EACV,UAAU,EACV,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,iBAAiB,qBAmCnB;AAED,QAAA,MAAM,YAAY;;;;CAIhB,CAAA;AAEF,OAAO,EAAE,YAAY,EAAE,CAAA;AACvB,YAAY,EAAE,yBAAyB,EAAE,CAAA"}