@alneas/appkit-react 0.1.0 → 0.3.0

package/dist/tools/components/priority-queue/PriorityCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"PriorityCard.js","names":["React","React$1","getScoreColor","score","getScoreBg","PriorityCard","DEFAULT_SNOOZE_OPTIONS","controlledExpanded","localExpanded","setLocalExpanded","expanded","setExpanded","onExpandedChange","factors","setFactors","task","isOverdue","handleFactorChange","newFactors","field","value","onFactorsUpdate","Card","testId","rank","cn","onClick","CardHeader","Badge","Zap","CardTitle","Clock","formatDistanceToNow","Avatar","AvatarImage","AvatarFallback","readOnly","Button","onComplete","Check","DropdownMenu","DropdownMenuTrigger","Pause","DropdownMenuContent","snoozeOptions","DropdownMenuItem","onSnooze","opt","Collapsible","CollapsibleTrigger","Sparkles","jsx","ChevronUp","ChevronDown","CollapsibleContent","CardContent","Slider","v","val"],"sources":["../../../../src/tools/components/priority-queue/PriorityCard.tsx"],"sourcesContent":["/**\n * Priority Card Component\n *\n * Focus Mode 用の優先度タスクカード\n */\n\nimport * as React from 'react';\nimport { formatDistanceToNow } from 'date-fns';\nimport { Check, ChevronDown, ChevronUp, Clock, Pause, Sparkles, Zap } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\nimport { Card, CardContent, CardHeader, CardTitle } from '../ui/card';\nimport { Badge } from '../ui/badge';\nimport { Button } from '../ui/button';\nimport { Slider } from '../ui/slider';\nimport { Avatar, AvatarFallback, AvatarImage } from '../ui/avatar';\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n} from '../ui/dropdown-menu';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '../ui/collapsible';\nimport type { PriorityCardProps } from './types';\nimport { DEFAULT_SNOOZE_OPTIONS } from './types';\n\n/**\n * スコアに応じた色クラス\n */\nfunction getScoreColor(score: number): string {\n  if (score >= 15) return 'text-destructive';\n  if (score >= 10) return 'text-orange-600 dark:text-orange-400';\n  if (score >= 5) return 'text-yellow-600 dark:text-yellow-400';\n  return 'text-muted-foreground';\n}\n\n/**\n * スコアに応じた背景\n */\nfunction getScoreBg(score: number): string {\n  if (score >= 15) return 'bg-destructive/5';\n  if (score >= 10) return 'bg-orange-50/50 dark:bg-orange-950/10';\n  return '';\n}\n\n/**\n * 優先度カード\n */\nexport const PriorityCard = React.forwardRef<HTMLDivElement, PriorityCardProps>(\n  (\n    {\n      task,\n      rank,\n      onClick,\n      onComplete,\n      onSnooze,\n      onFactorsUpdate,\n      snoozeOptions = DEFAULT_SNOOZE_OPTIONS,\n      testId,\n      readOnly = false,\n      expanded: controlledExpanded,\n      onExpandedChange,\n    },\n    ref,\n  ) => {\n    const [localExpanded, setLocalExpanded] = React.useState(false);\n    const expanded = controlledExpanded ?? localExpanded;\n    const setExpanded = onExpandedChange ?? setLocalExpanded;\n\n    const [factors, setFactors] = React.useState({\n      impact: task.impact || 5,\n      effort: task.effort || 5,\n      risk: task.risk || 0,\n    });\n\n    const score = task.score ?? 0;\n    const isOverdue = task.due_date && new Date(task.due_date) < new Date();\n\n    const handleFactorChange = (field: 'impact' | 'effort' | 'risk', value: number) => {\n      const newFactors = { ...factors, [field]: value };\n      setFactors(newFactors);\n      onFactorsUpdate?.(newFactors);\n    };\n\n    return (\n      <Card\n        ref={ref}\n        data-slot='priority-card'\n        data-testid={testId}\n        data-rank={rank}\n        data-score={score}\n        className={cn(\n          'transition-all duration-200',\n          getScoreBg(score),\n          rank === 1 &&\n            'ring-2 ring-primary shadow-md bg-gradient-to-r from-primary/5 to-transparent',\n          onClick && 'cursor-pointer hover:shadow-md',\n        )}\n        onClick={onClick}\n      >\n        <CardHeader className='p-3 pb-2'>\n          <div className='flex items-start gap-3'>\n            {/* ランク */}\n            <div\n              data-slot='priority-rank'\n              className={cn(\n                'flex items-center justify-center w-8 h-8 rounded-full text-sm font-bold',\n                rank === 1\n                  ? 'bg-primary text-primary-foreground'\n                  : rank <= 3\n                    ? 'bg-muted text-foreground'\n                    : 'bg-muted/50 text-muted-foreground',\n              )}\n            >\n              {rank}\n            </div>\n\n            {/* コンテンツ */}\n            <div className='flex-1 min-w-0'>\n              <div className='flex items-center justify-between gap-2 mb-1'>\n                {/* プロジェクト */}\n                {task.project?.name && (\n                  <Badge\n                    variant='outline'\n                    className='text-[10px] px-1.5 py-0 font-normal shrink-0'\n                    style={{\n                      borderColor: task.project.color,\n                      color: task.project.color,\n                    }}\n                  >\n                    {task.project.name}\n                  </Badge>\n                )}\n\n                {/* スコア */}\n                <div\n                  data-slot='priority-score'\n                  className={cn('flex items-center gap-1 text-sm font-bold', getScoreColor(score))}\n                >\n                  <Zap className='w-3 h-3' />\n                  {score.toFixed(1)}\n                </div>\n              </div>\n\n              <CardTitle className='text-sm font-medium leading-snug line-clamp-2'>\n                {task.title}\n              </CardTitle>\n\n              {/* メタ情報 */}\n              <div className='flex items-center gap-2 mt-2 text-xs text-muted-foreground'>\n                {task.due_date && (\n                  <span\n                    className={cn(\n                      'flex items-center gap-0.5',\n                      isOverdue && 'text-destructive font-medium',\n                    )}\n                  >\n                    <Clock className='w-3 h-3' />\n                    {formatDistanceToNow(new Date(task.due_date), {\n                      addSuffix: true,\n                    })}\n                  </span>\n                )}\n                {task.assignee && (\n                  <Avatar className='h-4 w-4'>\n                    {task.assignee.avatar && <AvatarImage src={task.assignee.avatar} />}\n                    <AvatarFallback className='text-[8px]'>\n                      {task.assignee.name?.[0]}\n                    </AvatarFallback>\n                  </Avatar>\n                )}\n              </div>\n            </div>\n\n            {/* アクション */}\n            {!readOnly && (\n              <div\n                data-slot='priority-actions'\n                className='flex gap-1'\n                onClick={(e) => e.stopPropagation()}\n              >\n                <Button\n                  size='icon'\n                  variant='ghost'\n                  className='h-7 w-7'\n                  onClick={onComplete}\n                  testId={testId ? `${testId}-complete` : undefined}\n                >\n                  <Check className='h-4 w-4 text-green-600' />\n                </Button>\n\n                <DropdownMenu>\n                  <DropdownMenuTrigger\n                    className='inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-7 w-7'\n                    data-testid={testId ? `${testId}-snooze` : undefined}\n                  >\n                    <Pause className='h-4 w-4 text-muted-foreground' />\n                  </DropdownMenuTrigger>\n                  <DropdownMenuContent align='end'>\n                    {snoozeOptions.map((opt) => (\n                      <DropdownMenuItem key={opt.minutes} onClick={() => onSnooze?.(opt.minutes)}>\n                        {opt.label}\n                      </DropdownMenuItem>\n                    ))}\n                  </DropdownMenuContent>\n                </DropdownMenu>\n              </div>\n            )}\n          </div>\n        </CardHeader>\n\n        {/* ファクターエディター */}\n        {!readOnly && onFactorsUpdate && (\n          <Collapsible open={expanded} onOpenChange={setExpanded}>\n            <CollapsibleTrigger\n              className='w-full h-6 flex items-center justify-center text-xs text-muted-foreground hover:bg-muted/50 transition-colors'\n              data-testid={testId ? `${testId}-expand` : undefined}\n              onClick={(e) => e.stopPropagation()}\n            >\n              <Sparkles className='w-3 h-3 mr-1' />\n              Adjust Factors\n              {expanded ? (\n                <ChevronUp className='w-3 h-3 ml-1' />\n              ) : (\n                <ChevronDown className='w-3 h-3 ml-1' />\n              )}\n            </CollapsibleTrigger>\n            <CollapsibleContent>\n              <CardContent\n                data-slot='priority-factors'\n                className='p-3 pt-2 space-y-3 border-t'\n                onClick={(e) => e.stopPropagation()}\n              >\n                {/* Impact */}\n                <div className='space-y-1'>\n                  <div className='flex justify-between text-xs'>\n                    <span className='text-muted-foreground'>Impact</span>\n                    <span className='font-medium'>{factors.impact}</span>\n                  </div>\n                  <Slider\n                    value={[factors.impact]}\n                    min={1}\n                    max={10}\n                    step={1}\n                    onValueChange={(val) => {\n                      const v = Array.isArray(val) ? val[0] : val;\n                      handleFactorChange('impact', v as number);\n                    }}\n                  />\n                </div>\n\n                {/* Effort */}\n                <div className='space-y-1'>\n                  <div className='flex justify-between text-xs'>\n                    <span className='text-muted-foreground'>Effort</span>\n                    <span className='font-medium'>{factors.effort}</span>\n                  </div>\n                  <Slider\n                    value={[factors.effort]}\n                    min={1}\n                    max={10}\n                    step={1}\n                    onValueChange={(val) => {\n                      const v = Array.isArray(val) ? val[0] : val;\n                      handleFactorChange('effort', v as number);\n                    }}\n                  />\n                </div>\n\n                {/* Risk */}\n                <div className='space-y-1'>\n                  <div className='flex justify-between text-xs'>\n                    <span className='text-muted-foreground'>Risk</span>\n                    <span className='font-medium'>{factors.risk}</span>\n                  </div>\n                  <Slider\n                    value={[factors.risk]}\n                    min={0}\n                    max={10}\n                    step={1}\n                    onValueChange={(val) => {\n                      const v = Array.isArray(val) ? val[0] : val;\n                      handleFactorChange('risk', v as number);\n                    }}\n                  />\n                </div>\n              </CardContent>\n            </CollapsibleContent>\n          </Collapsible>\n        )}\n      </Card>\n    );\n  },\n);\n\nPriorityCard.displayName = 'PriorityCard';\n"],"mappings":"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"}
+{"version":3,"file":"PriorityCard.js","names":["React","React$1","getScoreColor","score","getScoreBg","PriorityCard","DEFAULT_SNOOZE_OPTIONS","controlledExpanded","localExpanded","setLocalExpanded","expanded","setExpanded","onExpandedChange","factors","setFactors","task","isOverdue","handleFactorChange","newFactors","field","value","onFactorsUpdate","Card","testId","rank","cn","onClick","CardHeader","Badge","Zap","CardTitle","Clock","formatDistanceToNow","Avatar","AvatarImage","AvatarFallback","readOnly","Button","onComplete","Check","DropdownMenu","DropdownMenuTrigger","Pause","DropdownMenuContent","snoozeOptions","DropdownMenuItem","onSnooze","opt","Collapsible","CollapsibleTrigger","Sparkles","jsx","ChevronUp","ChevronDown","CollapsibleContent","CardContent","Slider","v","val"],"sources":["../../../../src/tools/components/priority-queue/PriorityCard.tsx"],"sourcesContent":["/**\n * Priority Card Component\n *\n * Focus Mode 用の優先度タスクカード\n */\n\nimport * as React from 'react';\nimport { formatDistanceToNow } from 'date-fns';\nimport { Check, ChevronDown, ChevronUp, Clock, Pause, Sparkles, Zap } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\nimport { Card, CardContent, CardHeader, CardTitle } from '../ui/card';\nimport { Badge } from '../ui/badge';\nimport { Button } from '../ui/button';\nimport { Slider } from '../ui/slider';\nimport { Avatar, AvatarFallback, AvatarImage } from '../ui/avatar';\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n} from '../ui/dropdown-menu';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '../ui/collapsible';\nimport type { PriorityCardProps } from './types';\nimport { DEFAULT_SNOOZE_OPTIONS } from './types';\n\n/**\n * スコアに応じた色クラス\n */\nfunction getScoreColor(score: number): string {\n  if (score >= 15) return 'text-destructive';\n  if (score >= 10) return 'text-orange-700 dark:text-orange-400';\n  if (score >= 5) return 'text-yellow-800 dark:text-yellow-400';\n  return 'text-muted-foreground';\n}\n\n/**\n * スコアに応じた背景\n */\nfunction getScoreBg(score: number): string {\n  if (score >= 15) return 'bg-destructive/5';\n  if (score >= 10) return 'bg-orange-50/50 dark:bg-orange-950/10';\n  return '';\n}\n\n/**\n * 優先度カード\n */\nexport function PriorityCard({\n  ref,\n  task,\n  rank,\n  onClick,\n  onComplete,\n  onSnooze,\n  onFactorsUpdate,\n  snoozeOptions = DEFAULT_SNOOZE_OPTIONS,\n  testId,\n  readOnly = false,\n  expanded: controlledExpanded,\n  onExpandedChange,\n}: React.PropsWithoutRef<PriorityCardProps> & React.RefAttributes<HTMLDivElement>) {\n  const [localExpanded, setLocalExpanded] = React.useState(false);\n  const expanded = controlledExpanded ?? localExpanded;\n  const setExpanded = onExpandedChange ?? setLocalExpanded;\n\n  const [factors, setFactors] = React.useState({\n    impact: task.impact || 5,\n    effort: task.effort || 5,\n    risk: task.risk || 0,\n  });\n\n  const score = task.score ?? 0;\n  const isOverdue = task.due_date && new Date(task.due_date) < new Date();\n\n  const handleFactorChange = (field: 'impact' | 'effort' | 'risk', value: number) => {\n    const newFactors = { ...factors, [field]: value };\n    setFactors(newFactors);\n    onFactorsUpdate?.(newFactors);\n  };\n\n  return (\n    <Card\n      ref={ref}\n      data-slot='priority-card'\n      data-testid={testId}\n      data-rank={rank}\n      data-score={score}\n      className={cn(\n        'transition-all duration-200',\n        getScoreBg(score),\n        rank === 1 &&\n          'ring-2 ring-primary shadow-md bg-gradient-to-r from-primary/5 to-transparent',\n        onClick && 'cursor-pointer hover:shadow-md',\n      )}\n      onClick={onClick}\n    >\n      <CardHeader className='p-3 pb-2'>\n        <div className='flex items-start gap-3'>\n          {/* ランク */}\n          <div\n            data-slot='priority-rank'\n            className={cn(\n              'flex items-center justify-center w-8 h-8 rounded-full text-sm font-bold',\n              rank === 1\n                ? 'bg-primary text-primary-foreground'\n                : rank <= 3\n                  ? 'bg-muted text-foreground'\n                  : 'bg-muted/50 text-muted-foreground',\n            )}\n          >\n            {rank}\n          </div>\n\n          {/* コンテンツ */}\n          <div className='flex-1 min-w-0'>\n            <div className='flex items-center justify-between gap-2 mb-1'>\n              {/* プロジェクト */}\n              {task.project?.name && (\n                <Badge\n                  variant='outline'\n                  className='text-[10px] px-1.5 py-0 font-normal shrink-0'\n                  style={{\n                    borderColor: task.project.color,\n                    color: task.project.color,\n                  }}\n                >\n                  {task.project.name}\n                </Badge>\n              )}\n\n              {/* スコア */}\n              <div\n                data-slot='priority-score'\n                className={cn('flex items-center gap-1 text-sm font-bold', getScoreColor(score))}\n              >\n                <Zap className='w-3 h-3' />\n                {score.toFixed(1)}\n              </div>\n            </div>\n\n            <CardTitle className='text-sm font-medium leading-snug line-clamp-2'>\n              {task.title}\n            </CardTitle>\n\n            {/* メタ情報 */}\n            <div className='flex items-center gap-2 mt-2 text-xs text-muted-foreground'>\n              {task.due_date && (\n                <span\n                  className={cn(\n                    'flex items-center gap-0.5',\n                    isOverdue && 'text-destructive font-medium',\n                  )}\n                >\n                  <Clock className='w-3 h-3' />\n                  {formatDistanceToNow(new Date(task.due_date), {\n                    addSuffix: true,\n                  })}\n                </span>\n              )}\n              {task.assignee && (\n                <Avatar className='h-4 w-4'>\n                  {task.assignee.avatar && <AvatarImage src={task.assignee.avatar} />}\n                  <AvatarFallback className='text-[8px]'>{task.assignee.name?.[0]}</AvatarFallback>\n                </Avatar>\n              )}\n            </div>\n          </div>\n\n          {/* アクション */}\n          {!readOnly && (\n            <div\n              data-slot='priority-actions'\n              className='flex gap-1'\n              onClick={(e) => e.stopPropagation()}\n            >\n              <Button\n                size='icon'\n                variant='ghost'\n                className='h-7 w-7'\n                aria-label={`Complete ${task.title}`}\n                onClick={onComplete}\n                testId={testId ? `${testId}-complete` : undefined}\n              >\n                <Check className='h-4 w-4 text-green-600' />\n              </Button>\n\n              <DropdownMenu>\n                <DropdownMenuTrigger\n                  aria-label={`Snooze ${task.title}`}\n                  className='inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-7 w-7'\n                  data-testid={testId ? `${testId}-snooze` : undefined}\n                >\n                  <Pause className='h-4 w-4 text-muted-foreground' />\n                </DropdownMenuTrigger>\n                <DropdownMenuContent align='end'>\n                  {snoozeOptions.map((opt) => (\n                    <DropdownMenuItem key={opt.minutes} onClick={() => onSnooze?.(opt.minutes)}>\n                      {opt.label}\n                    </DropdownMenuItem>\n                  ))}\n                </DropdownMenuContent>\n              </DropdownMenu>\n            </div>\n          )}\n        </div>\n      </CardHeader>\n\n      {/* ファクターエディター */}\n      {!readOnly && onFactorsUpdate && (\n        <Collapsible open={expanded} onOpenChange={setExpanded}>\n          <CollapsibleTrigger\n            className='w-full h-6 flex items-center justify-center text-xs text-muted-foreground hover:bg-muted/50 transition-colors'\n            data-testid={testId ? `${testId}-expand` : undefined}\n            onClick={(e) => e.stopPropagation()}\n          >\n            <Sparkles className='w-3 h-3 mr-1' />\n            Adjust Factors\n            {expanded ? (\n              <ChevronUp className='w-3 h-3 ml-1' />\n            ) : (\n              <ChevronDown className='w-3 h-3 ml-1' />\n            )}\n          </CollapsibleTrigger>\n          <CollapsibleContent>\n            <CardContent\n              data-slot='priority-factors'\n              className='p-3 pt-2 space-y-3 border-t'\n              onClick={(e) => e.stopPropagation()}\n            >\n              {/* Impact */}\n              <div className='space-y-1'>\n                <div className='flex justify-between text-xs'>\n                  <span className='text-muted-foreground'>Impact</span>\n                  <span className='font-medium'>{factors.impact}</span>\n                </div>\n                <Slider\n                  value={[factors.impact]}\n                  min={1}\n                  max={10}\n                  step={1}\n                  onValueChange={(val) => {\n                    const v = Array.isArray(val) ? val[0] : val;\n                    handleFactorChange('impact', v as number);\n                  }}\n                />\n              </div>\n\n              {/* Effort */}\n              <div className='space-y-1'>\n                <div className='flex justify-between text-xs'>\n                  <span className='text-muted-foreground'>Effort</span>\n                  <span className='font-medium'>{factors.effort}</span>\n                </div>\n                <Slider\n                  value={[factors.effort]}\n                  min={1}\n                  max={10}\n                  step={1}\n                  onValueChange={(val) => {\n                    const v = Array.isArray(val) ? val[0] : val;\n                    handleFactorChange('effort', v as number);\n                  }}\n                />\n              </div>\n\n              {/* Risk */}\n              <div className='space-y-1'>\n                <div className='flex justify-between text-xs'>\n                  <span className='text-muted-foreground'>Risk</span>\n                  <span className='font-medium'>{factors.risk}</span>\n                </div>\n                <Slider\n                  value={[factors.risk]}\n                  min={0}\n                  max={10}\n                  step={1}\n                  onValueChange={(val) => {\n                    const v = Array.isArray(val) ? val[0] : val;\n                    handleFactorChange('risk', v as number);\n                  }}\n                />\n              </div>\n            </CardContent>\n          </CollapsibleContent>\n        </Collapsible>\n      )}\n    </Card>\n  );\n}\n\nPriorityCard.displayName = 'PriorityCard';\n"],"mappings":"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"}

package/dist/tools/components/priority-queue/PriorityQueue.cjs

@@ -1,2 +1,2 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../ui/lib/utils.cjs"),n=require("../../../ui/components/ui/button-components.cjs"),r=require("../../../ui/components/ui/scroll-area.cjs"),i=require("./types.cjs"),a=require("./PriorityCard.cjs");let o=require("react/jsx-runtime"),s=require("react");s=e.__toESM(s,1);let c=require("lucide-react");var l=s.forwardRef(({tasks:e,maxItems:l,onTaskClick:u,onTaskComplete:d,onTaskSnooze:f,onFactorsUpdate:p,onRecalculate:m,snoozeOptions:h=i.DEFAULT_SNOOZE_OPTIONS,className:g,testId:_,readOnly:v=!1,compact:y=!1},b)=>{let[x,S]=s.useState(!1),C=s.useMemo(()=>{let t=e.map(e=>({...e,score:e.score??i.calculatePriorityScore(e)}));return t.sort((e,t)=>(t.score??0)-(e.score??0)),l?t.slice(0,l):t},[e,l]);return(0,o.jsxs)(`div`,{ref:b,"data-slot":`priority-queue`,"data-testid":_,className:t.cn(`flex flex-col h-full`,g),children:[(0,o.jsxs)(`div`,{"data-slot":`priority-queue-header`,className:`flex items-center justify-between px-4 py-3 border-b`,children:[(0,o.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,o.jsx)(c.Target,{className:`w-5 h-5 text-primary`}),(0,o.jsx)(`h2`,{className:`text-lg font-semibold`,children:`Focus Mode`}),(0,o.jsxs)(`span`,{className:`text-sm text-muted-foreground`,children:[C.length,` tasks`]})]}),m&&(0,o.jsxs)(n.Button,{variant:`outline`,size:`sm`,onClick:async()=>{if(m){S(!0);try{await m()}finally{S(!1)}}},disabled:x,testId:_?`${_}-recalc`:void 0,children:[(0,o.jsx)(c.RefreshCw,{className:t.cn(`w-4 h-4 mr-2`,x&&`animate-spin`)}),`Recalculate`]})]}),(0,o.jsx)(r.ScrollArea,{className:`flex-1`,children:(0,o.jsx)(`div`,{"data-slot":`priority-queue-list`,className:t.cn(`p-4 space-y-3`,y&&`p-2 space-y-2`),children:C.length===0?(0,o.jsxs)(`div`,{"data-slot":`priority-queue-empty`,className:`flex flex-col items-center justify-center py-12 text-muted-foreground`,children:[(0,o.jsx)(c.Target,{className:`w-12 h-12 mb-4 opacity-30`}),(0,o.jsx)(`p`,{className:`text-sm`,children:`No tasks to focus on`}),(0,o.jsx)(`p`,{className:`text-xs`,children:`Great job! 🎉`})]}):C.map((e,t)=>(0,o.jsx)(a.PriorityCard,{task:e,rank:t+1,testId:_?`${_}-task-${e.id}`:void 0,onClick:()=>u?.(e),onComplete:()=>d?.(e.id),onSnooze:t=>f?.(e.id,t),onFactorsUpdate:p?t=>p(e.id,t):void 0,snoozeOptions:h,readOnly:v},e.id))})})]})});l.displayName=`PriorityQueue`,exports.PriorityQueue=l;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../ui/lib/utils.cjs"),n=require("../../../ui/components/ui/button-components.cjs"),r=require("../../../ui/components/ui/scroll-area.cjs"),i=require("./types.cjs"),a=require("./PriorityCard.cjs");let o=require("react/jsx-runtime"),s=require("react");s=e.__toESM(s,1);let c=require("lucide-react");function l({ref:e,tasks:l,maxItems:u,onTaskClick:d,onTaskComplete:f,onTaskSnooze:p,onFactorsUpdate:m,onRecalculate:h,snoozeOptions:g=i.DEFAULT_SNOOZE_OPTIONS,className:_,testId:v,readOnly:y=!1,compact:b=!1}){let[x,S]=s.useState(!1),C=s.useMemo(()=>{let e=l.map(e=>({...e,score:e.score??i.calculatePriorityScore(e)}));return e.sort((e,t)=>(t.score??0)-(e.score??0)),u?e.slice(0,u):e},[l,u]);return(0,o.jsxs)(`div`,{ref:e,"data-slot":`priority-queue`,"data-testid":v,className:t.cn(`flex flex-col h-full`,_),children:[(0,o.jsxs)(`div`,{"data-slot":`priority-queue-header`,className:`flex items-center justify-between px-4 py-3 border-b`,children:[(0,o.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,o.jsx)(c.Target,{className:`w-5 h-5 text-primary`}),(0,o.jsx)(`h2`,{className:`text-lg font-semibold`,children:`Focus Mode`}),(0,o.jsxs)(`span`,{className:`text-sm text-muted-foreground`,children:[C.length,` tasks`]})]}),h&&(0,o.jsxs)(n.Button,{variant:`outline`,size:`sm`,onClick:async()=>{if(h){S(!0);try{await h()}finally{S(!1)}}},disabled:x,testId:v?`${v}-recalc`:void 0,children:[(0,o.jsx)(c.RefreshCw,{className:t.cn(`w-4 h-4 mr-2`,x&&`animate-spin`)}),`Recalculate`]})]}),(0,o.jsx)(r.ScrollArea,{className:`flex-1`,children:(0,o.jsx)(`div`,{"data-slot":`priority-queue-list`,className:t.cn(`p-4 space-y-3`,b&&`p-2 space-y-2`),children:C.length===0?(0,o.jsxs)(`div`,{"data-slot":`priority-queue-empty`,className:`flex flex-col items-center justify-center py-12 text-muted-foreground`,children:[(0,o.jsx)(c.Target,{className:`w-12 h-12 mb-4 opacity-30`}),(0,o.jsx)(`p`,{className:`text-sm`,children:`No tasks to focus on`}),(0,o.jsx)(`p`,{className:`text-xs`,children:`Great job! 🎉`})]}):C.map((e,t)=>(0,o.jsx)(a.PriorityCard,{task:e,rank:t+1,testId:v?`${v}-task-${e.id}`:void 0,onClick:()=>d?.(e),onComplete:()=>f?.(e.id),onSnooze:t=>p?.(e.id,t),onFactorsUpdate:m?t=>m(e.id,t):void 0,snoozeOptions:g,readOnly:y},e.id))})})]})}l.displayName=`PriorityQueue`,exports.PriorityQueue=l;
 //# sourceMappingURL=PriorityQueue.cjs.map

package/dist/tools/components/priority-queue/PriorityQueue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"PriorityQueue.cjs","names":["React","DEFAULT_SNOOZE_OPTIONS","calculatePriorityScore","cn","Target","Button","RefreshCw","ScrollArea","PriorityCard","require_runtime","require_ui_lib_utils","require_ui_components_ui_button_components","require_ui_components_ui_scroll_area","require_tools_components_priority_queue_types","require_tools_components_priority_queue_PriorityCard","react_jsx_runtime","react","lucide_react","PriorityQueue","rawTasks","isRecalculating","setIsRecalculating","sortedTasks","withScore","t","b","a","maxItems","testId","className","onRecalculate","compact","index","task","onTaskClick","onTaskComplete","onTaskSnooze","minutes","onFactorsUpdate","factors"],"sources":["../../../../src/tools/components/priority-queue/PriorityQueue.tsx"],"sourcesContent":["/**\n * Priority Queue Component\n *\n * Focus Mode 用の優先度キューリスト\n *\n * @example\n * ```tsx\n * import { PriorityQueue, calculatePriorityScore } from '@alneas/appkit-react/tools/priority-queue';\n *\n * const tasks = rawTasks.map(t => ({\n *   ...t,\n *   score: calculatePriorityScore(t),\n * }));\n *\n * <PriorityQueue\n *   tasks={tasks}\n *   onTaskClick={(task) => openDetail(task.id)}\n *   onTaskComplete={(taskId) => markDone(taskId)}\n *   onFactorsUpdate={(taskId, factors) => updateFactors(taskId, factors)}\n *   onRecalculate={() => recalcAll()}\n *   testId=\"focus-queue\"\n * />\n * ```\n */\n\nimport * as React from 'react';\nimport { RefreshCw, Target } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\nimport { Button } from '../ui/button';\nimport { ScrollArea } from '../ui/scroll-area';\nimport { PriorityCard } from './PriorityCard';\nimport type { PriorityQueueProps } from './types';\nimport { calculatePriorityScore, DEFAULT_SNOOZE_OPTIONS } from './types';\n\n/**\n * 優先度キュー\n */\nexport const PriorityQueue = React.forwardRef<HTMLDivElement, PriorityQueueProps>(\n  (\n    {\n      tasks: rawTasks,\n      maxItems,\n      onTaskClick,\n      onTaskComplete,\n      onTaskSnooze,\n      onFactorsUpdate,\n      onRecalculate,\n      snoozeOptions = DEFAULT_SNOOZE_OPTIONS,\n      className,\n      testId,\n      readOnly = false,\n      compact = false,\n    },\n    ref,\n  ) => {\n    const [isRecalculating, setIsRecalculating] = React.useState(false);\n\n    // スコアでソート\n    const sortedTasks = React.useMemo(() => {\n      const withScore = rawTasks.map((t) => ({\n        ...t,\n        score: t.score ?? calculatePriorityScore(t),\n      }));\n      withScore.sort((a, b) => (b.score ?? 0) - (a.score ?? 0));\n      return maxItems ? withScore.slice(0, maxItems) : withScore;\n    }, [rawTasks, maxItems]);\n\n    const handleRecalculate = async () => {\n      if (!onRecalculate) return;\n      setIsRecalculating(true);\n      try {\n        await onRecalculate();\n      } finally {\n        setIsRecalculating(false);\n      }\n    };\n\n    return (\n      <div\n        ref={ref}\n        data-slot='priority-queue'\n        data-testid={testId}\n        className={cn('flex flex-col h-full', className)}\n      >\n        {/* ヘッダー */}\n        <div\n          data-slot='priority-queue-header'\n          className='flex items-center justify-between px-4 py-3 border-b'\n        >\n          <div className='flex items-center gap-2'>\n            <Target className='w-5 h-5 text-primary' />\n            <h2 className='text-lg font-semibold'>Focus Mode</h2>\n            <span className='text-sm text-muted-foreground'>{sortedTasks.length} tasks</span>\n          </div>\n\n          {onRecalculate && (\n            <Button\n              variant='outline'\n              size='sm'\n              onClick={handleRecalculate}\n              disabled={isRecalculating}\n              testId={testId ? `${testId}-recalc` : undefined}\n            >\n              <RefreshCw className={cn('w-4 h-4 mr-2', isRecalculating && 'animate-spin')} />\n              Recalculate\n            </Button>\n          )}\n        </div>\n\n        {/* タスクリスト */}\n        <ScrollArea className='flex-1'>\n          <div\n            data-slot='priority-queue-list'\n            className={cn('p-4 space-y-3', compact && 'p-2 space-y-2')}\n          >\n            {sortedTasks.length === 0 ? (\n              <div\n                data-slot='priority-queue-empty'\n                className='flex flex-col items-center justify-center py-12 text-muted-foreground'\n              >\n                <Target className='w-12 h-12 mb-4 opacity-30' />\n                <p className='text-sm'>No tasks to focus on</p>\n                <p className='text-xs'>Great job! 🎉</p>\n              </div>\n            ) : (\n              sortedTasks.map((task, index) => (\n                <PriorityCard\n                  key={task.id}\n                  task={task}\n                  rank={index + 1}\n                  testId={testId ? `${testId}-task-${task.id}` : undefined}\n                  onClick={() => onTaskClick?.(task)}\n                  onComplete={() => onTaskComplete?.(task.id)}\n                  onSnooze={(minutes) => onTaskSnooze?.(task.id, minutes)}\n                  onFactorsUpdate={\n                    onFactorsUpdate ? (factors) => onFactorsUpdate(task.id, factors) : undefined\n                  }\n                  snoozeOptions={snoozeOptions}\n                  readOnly={readOnly}\n                />\n              ))\n            )}\n          </div>\n        </ScrollArea>\n      </div>\n    );\n  },\n);\n\nPriorityQueue.displayName = 'PriorityQueue';\n"],"mappings":"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"}
+{"version":3,"file":"PriorityQueue.cjs","names":["DEFAULT_SNOOZE_OPTIONS","React","calculatePriorityScore","cn","Target","Button","RefreshCw","ScrollArea","PriorityCard","require_runtime","require_ui_lib_utils","require_ui_components_ui_button_components","require_ui_components_ui_scroll_area","require_tools_components_priority_queue_types","require_tools_components_priority_queue_PriorityCard","react_jsx_runtime","react","lucide_react","PriorityQueue","rawTasks","isRecalculating","setIsRecalculating","sortedTasks","withScore","t","b","a","maxItems","testId","className","onRecalculate","compact","index","task","onTaskClick","onTaskComplete","onTaskSnooze","minutes","onFactorsUpdate","factors"],"sources":["../../../../src/tools/components/priority-queue/PriorityQueue.tsx"],"sourcesContent":["/**\n * Priority Queue Component\n *\n * Focus Mode 用の優先度キューリスト\n *\n * @example\n * ```tsx\n * import { PriorityQueue, calculatePriorityScore } from '@alneas/appkit-react/tools/priority-queue';\n *\n * const tasks = rawTasks.map(t => ({\n *   ...t,\n *   score: calculatePriorityScore(t),\n * }));\n *\n * <PriorityQueue\n *   tasks={tasks}\n *   onTaskClick={(task) => openDetail(task.id)}\n *   onTaskComplete={(taskId) => markDone(taskId)}\n *   onFactorsUpdate={(taskId, factors) => updateFactors(taskId, factors)}\n *   onRecalculate={() => recalcAll()}\n *   testId=\"focus-queue\"\n * />\n * ```\n */\n\nimport * as React from 'react';\nimport { RefreshCw, Target } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\nimport { Button } from '../ui/button';\nimport { ScrollArea } from '../ui/scroll-area';\nimport { PriorityCard } from './PriorityCard';\nimport type { PriorityQueueProps } from './types';\nimport { calculatePriorityScore, DEFAULT_SNOOZE_OPTIONS } from './types';\n\n/**\n * 優先度キュー\n */\nexport function PriorityQueue({\n  ref,\n  tasks: rawTasks,\n  maxItems,\n  onTaskClick,\n  onTaskComplete,\n  onTaskSnooze,\n  onFactorsUpdate,\n  onRecalculate,\n  snoozeOptions = DEFAULT_SNOOZE_OPTIONS,\n  className,\n  testId,\n  readOnly = false,\n  compact = false,\n}: React.PropsWithoutRef<PriorityQueueProps> & React.RefAttributes<HTMLDivElement>) {\n  const [isRecalculating, setIsRecalculating] = React.useState(false);\n\n  // スコアでソート\n  const sortedTasks = React.useMemo(() => {\n    const withScore = rawTasks.map((t) => ({\n      ...t,\n      score: t.score ?? calculatePriorityScore(t),\n    }));\n    withScore.sort((a, b) => (b.score ?? 0) - (a.score ?? 0));\n    return maxItems ? withScore.slice(0, maxItems) : withScore;\n  }, [rawTasks, maxItems]);\n\n  const handleRecalculate = async () => {\n    if (!onRecalculate) return;\n    setIsRecalculating(true);\n    try {\n      await onRecalculate();\n    } finally {\n      setIsRecalculating(false);\n    }\n  };\n\n  return (\n    <div\n      ref={ref}\n      data-slot='priority-queue'\n      data-testid={testId}\n      className={cn('flex flex-col h-full', className)}\n    >\n      {/* ヘッダー */}\n      <div\n        data-slot='priority-queue-header'\n        className='flex items-center justify-between px-4 py-3 border-b'\n      >\n        <div className='flex items-center gap-2'>\n          <Target className='w-5 h-5 text-primary' />\n          <h2 className='text-lg font-semibold'>Focus Mode</h2>\n          <span className='text-sm text-muted-foreground'>{sortedTasks.length} tasks</span>\n        </div>\n\n        {onRecalculate && (\n          <Button\n            variant='outline'\n            size='sm'\n            onClick={handleRecalculate}\n            disabled={isRecalculating}\n            testId={testId ? `${testId}-recalc` : undefined}\n          >\n            <RefreshCw className={cn('w-4 h-4 mr-2', isRecalculating && 'animate-spin')} />\n            Recalculate\n          </Button>\n        )}\n      </div>\n\n      {/* タスクリスト */}\n      <ScrollArea className='flex-1'>\n        <div\n          data-slot='priority-queue-list'\n          className={cn('p-4 space-y-3', compact && 'p-2 space-y-2')}\n        >\n          {sortedTasks.length === 0 ? (\n            <div\n              data-slot='priority-queue-empty'\n              className='flex flex-col items-center justify-center py-12 text-muted-foreground'\n            >\n              <Target className='w-12 h-12 mb-4 opacity-30' />\n              <p className='text-sm'>No tasks to focus on</p>\n              <p className='text-xs'>Great job! 🎉</p>\n            </div>\n          ) : (\n            sortedTasks.map((task, index) => (\n              <PriorityCard\n                key={task.id}\n                task={task}\n                rank={index + 1}\n                testId={testId ? `${testId}-task-${task.id}` : undefined}\n                onClick={() => onTaskClick?.(task)}\n                onComplete={() => onTaskComplete?.(task.id)}\n                onSnooze={(minutes) => onTaskSnooze?.(task.id, minutes)}\n                onFactorsUpdate={\n                  onFactorsUpdate ? (factors) => onFactorsUpdate(task.id, factors) : undefined\n                }\n                snoozeOptions={snoozeOptions}\n                readOnly={readOnly}\n              />\n            ))\n          )}\n        </div>\n      </ScrollArea>\n    </div>\n  );\n}\n\nPriorityQueue.displayName = 'PriorityQueue';\n"],"mappings":"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"}

package/dist/tools/components/priority-queue/PriorityQueue.d.cts

@@ -27,4 +27,7 @@ import * as React from 'react';
 /**
  * 優先度キュー
  */
-export declare const PriorityQueue: React.ForwardRefExoticComponent<PriorityQueueProps & React.RefAttributes<HTMLDivElement>>;
+export declare function PriorityQueue({ ref, tasks: rawTasks, maxItems, onTaskClick, onTaskComplete, onTaskSnooze, onFactorsUpdate, onRecalculate, snoozeOptions, className, testId, readOnly, compact, }: React.PropsWithoutRef<PriorityQueueProps> & React.RefAttributes<HTMLDivElement>): React.JSX.Element;
+export declare namespace PriorityQueue {
+    var displayName: string;
+}

package/dist/tools/components/priority-queue/PriorityQueue.d.ts

@@ -27,4 +27,7 @@ import * as React from 'react';
 /**
  * 優先度キュー
  */
-export declare const PriorityQueue: React.ForwardRefExoticComponent<PriorityQueueProps & React.RefAttributes<HTMLDivElement>>;
+export declare function PriorityQueue({ ref, tasks: rawTasks, maxItems, onTaskClick, onTaskComplete, onTaskSnooze, onFactorsUpdate, onRecalculate, snoozeOptions, className, testId, readOnly, compact, }: React.PropsWithoutRef<PriorityQueueProps> & React.RefAttributes<HTMLDivElement>): React.JSX.Element;
+export declare namespace PriorityQueue {
+    var displayName: string;
+}

package/dist/tools/components/priority-queue/PriorityQueue.js

@@ -8,19 +8,19 @@ import { jsx as o, jsxs as s } from "react/jsx-runtime";
 import * as c from "react";
 import { RefreshCw as l, Target as u } from "lucide-react";
 //#region src/tools/components/priority-queue/PriorityQueue.tsx
-var d = c.forwardRef(({ tasks: d, maxItems: f, onTaskClick: p, onTaskComplete: m, onTaskSnooze: h, onFactorsUpdate: g, onRecalculate: _, snoozeOptions: v = r, className: y, testId: b, readOnly: x = !1, compact: S = !1 }, C) => {
+function d({ ref: d, tasks: f, maxItems: p, onTaskClick: m, onTaskComplete: h, onTaskSnooze: g, onFactorsUpdate: _, onRecalculate: v, snoozeOptions: y = r, className: b, testId: x, readOnly: S = !1, compact: C = !1 }) {
 	let [w, T] = c.useState(!1), E = c.useMemo(() => {
-		let e = d.map((e) => ({
+		let e = f.map((e) => ({
 			...e,
 			score: e.score ?? i(e)
 		}));
-		return e.sort((e, t) => (t.score ?? 0) - (e.score ?? 0)), f ? e.slice(0, f) : e;
-	}, [d, f]);
+		return e.sort((e, t) => (t.score ?? 0) - (e.score ?? 0)), p ? e.slice(0, p) : e;
+	}, [f, p]);
 	return /* @__PURE__ */ s("div", {
-		ref: C,
+		ref: d,
 		"data-slot": "priority-queue",
-		"data-testid": b,
-		className: e("flex flex-col h-full", y),
+		"data-testid": x,
+		className: e("flex flex-col h-full", b),
 		children: [/* @__PURE__ */ s("div", {
 			"data-slot": "priority-queue-header",
 			className: "flex items-center justify-between px-4 py-3 border-b",
@@ -37,28 +37,28 @@ var d = c.forwardRef(({ tasks: d, maxItems: f, onTaskClick: p, onTaskComplete: m
 						children: [E.length, " tasks"]
 					})
 				]
-			}), _ && /* @__PURE__ */ s(t, {
+			}), v && /* @__PURE__ */ s(t, {
 				variant: "outline",
 				size: "sm",
 				onClick: async () => {
-					if (_) {
+					if (v) {
 						T(!0);
 						try {
-							await _();
+							await v();
 						} finally {
 							T(!1);
 						}
 					}
 				},
 				disabled: w,
-				testId: b ? `${b}-recalc` : void 0,
+				testId: x ? `${x}-recalc` : void 0,
 				children: [/* @__PURE__ */ o(l, { className: e("w-4 h-4 mr-2", w && "animate-spin") }), "Recalculate"]
 			})]
 		}), /* @__PURE__ */ o(n, {
 			className: "flex-1",
 			children: /* @__PURE__ */ o("div", {
 				"data-slot": "priority-queue-list",
-				className: e("p-4 space-y-3", S && "p-2 space-y-2"),
+				className: e("p-4 space-y-3", C && "p-2 space-y-2"),
 				children: E.length === 0 ? /* @__PURE__ */ s("div", {
 					"data-slot": "priority-queue-empty",
 					className: "flex flex-col items-center justify-center py-12 text-muted-foreground",
@@ -76,18 +76,18 @@ var d = c.forwardRef(({ tasks: d, maxItems: f, onTaskClick: p, onTaskComplete: m
 				}) : E.map((e, t) => /* @__PURE__ */ o(a, {
 					task: e,
 					rank: t + 1,
-					testId: b ? `${b}-task-${e.id}` : void 0,
-					onClick: () => p?.(e),
-					onComplete: () => m?.(e.id),
-					onSnooze: (t) => h?.(e.id, t),
-					onFactorsUpdate: g ? (t) => g(e.id, t) : void 0,
-					snoozeOptions: v,
-					readOnly: x
+					testId: x ? `${x}-task-${e.id}` : void 0,
+					onClick: () => m?.(e),
+					onComplete: () => h?.(e.id),
+					onSnooze: (t) => g?.(e.id, t),
+					onFactorsUpdate: _ ? (t) => _(e.id, t) : void 0,
+					snoozeOptions: y,
+					readOnly: S
 				}, e.id))
 			})
 		})]
 	});
-});
+}
 d.displayName = "PriorityQueue";
 //#endregion
 export { d as PriorityQueue };

package/dist/tools/components/priority-queue/PriorityQueue.js.map

@@ -1 +1 @@
-{"version":3,"file":"PriorityQueue.js","names":["React","React$1","PriorityQueue","rawTasks","DEFAULT_SNOOZE_OPTIONS","isRecalculating","setIsRecalculating","sortedTasks","withScore","t","calculatePriorityScore","b","a","maxItems","testId","cn","className","Target","onRecalculate","Button","RefreshCw","ScrollArea","compact","PriorityCard","index","task","onTaskClick","onTaskComplete","onTaskSnooze","minutes","onFactorsUpdate","factors"],"sources":["../../../../src/tools/components/priority-queue/PriorityQueue.tsx"],"sourcesContent":["/**\n * Priority Queue Component\n *\n * Focus Mode 用の優先度キューリスト\n *\n * @example\n * ```tsx\n * import { PriorityQueue, calculatePriorityScore } from '@alneas/appkit-react/tools/priority-queue';\n *\n * const tasks = rawTasks.map(t => ({\n *   ...t,\n *   score: calculatePriorityScore(t),\n * }));\n *\n * <PriorityQueue\n *   tasks={tasks}\n *   onTaskClick={(task) => openDetail(task.id)}\n *   onTaskComplete={(taskId) => markDone(taskId)}\n *   onFactorsUpdate={(taskId, factors) => updateFactors(taskId, factors)}\n *   onRecalculate={() => recalcAll()}\n *   testId=\"focus-queue\"\n * />\n * ```\n */\n\nimport * as React from 'react';\nimport { RefreshCw, Target } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\nimport { Button } from '../ui/button';\nimport { ScrollArea } from '../ui/scroll-area';\nimport { PriorityCard } from './PriorityCard';\nimport type { PriorityQueueProps } from './types';\nimport { calculatePriorityScore, DEFAULT_SNOOZE_OPTIONS } from './types';\n\n/**\n * 優先度キュー\n */\nexport const PriorityQueue = React.forwardRef<HTMLDivElement, PriorityQueueProps>(\n  (\n    {\n      tasks: rawTasks,\n      maxItems,\n      onTaskClick,\n      onTaskComplete,\n      onTaskSnooze,\n      onFactorsUpdate,\n      onRecalculate,\n      snoozeOptions = DEFAULT_SNOOZE_OPTIONS,\n      className,\n      testId,\n      readOnly = false,\n      compact = false,\n    },\n    ref,\n  ) => {\n    const [isRecalculating, setIsRecalculating] = React.useState(false);\n\n    // スコアでソート\n    const sortedTasks = React.useMemo(() => {\n      const withScore = rawTasks.map((t) => ({\n        ...t,\n        score: t.score ?? calculatePriorityScore(t),\n      }));\n      withScore.sort((a, b) => (b.score ?? 0) - (a.score ?? 0));\n      return maxItems ? withScore.slice(0, maxItems) : withScore;\n    }, [rawTasks, maxItems]);\n\n    const handleRecalculate = async () => {\n      if (!onRecalculate) return;\n      setIsRecalculating(true);\n      try {\n        await onRecalculate();\n      } finally {\n        setIsRecalculating(false);\n      }\n    };\n\n    return (\n      <div\n        ref={ref}\n        data-slot='priority-queue'\n        data-testid={testId}\n        className={cn('flex flex-col h-full', className)}\n      >\n        {/* ヘッダー */}\n        <div\n          data-slot='priority-queue-header'\n          className='flex items-center justify-between px-4 py-3 border-b'\n        >\n          <div className='flex items-center gap-2'>\n            <Target className='w-5 h-5 text-primary' />\n            <h2 className='text-lg font-semibold'>Focus Mode</h2>\n            <span className='text-sm text-muted-foreground'>{sortedTasks.length} tasks</span>\n          </div>\n\n          {onRecalculate && (\n            <Button\n              variant='outline'\n              size='sm'\n              onClick={handleRecalculate}\n              disabled={isRecalculating}\n              testId={testId ? `${testId}-recalc` : undefined}\n            >\n              <RefreshCw className={cn('w-4 h-4 mr-2', isRecalculating && 'animate-spin')} />\n              Recalculate\n            </Button>\n          )}\n        </div>\n\n        {/* タスクリスト */}\n        <ScrollArea className='flex-1'>\n          <div\n            data-slot='priority-queue-list'\n            className={cn('p-4 space-y-3', compact && 'p-2 space-y-2')}\n          >\n            {sortedTasks.length === 0 ? (\n              <div\n                data-slot='priority-queue-empty'\n                className='flex flex-col items-center justify-center py-12 text-muted-foreground'\n              >\n                <Target className='w-12 h-12 mb-4 opacity-30' />\n                <p className='text-sm'>No tasks to focus on</p>\n                <p className='text-xs'>Great job! 🎉</p>\n              </div>\n            ) : (\n              sortedTasks.map((task, index) => (\n                <PriorityCard\n                  key={task.id}\n                  task={task}\n                  rank={index + 1}\n                  testId={testId ? `${testId}-task-${task.id}` : undefined}\n                  onClick={() => onTaskClick?.(task)}\n                  onComplete={() => onTaskComplete?.(task.id)}\n                  onSnooze={(minutes) => onTaskSnooze?.(task.id, minutes)}\n                  onFactorsUpdate={\n                    onFactorsUpdate ? (factors) => onFactorsUpdate(task.id, factors) : undefined\n                  }\n                  snoozeOptions={snoozeOptions}\n                  readOnly={readOnly}\n                />\n              ))\n            )}\n          </div>\n        </ScrollArea>\n      </div>\n    );\n  },\n);\n\nPriorityQueue.displayName = 'PriorityQueue';\n"],"mappings":";;;;;;;;;;AAsCA,IAAaE,IAAgBF,EAAM,YAE/B,EACE,OAAOG,GACP,aACA,gBACA,mBACA,iBACA,oBACA,kBACA,mBAAgBC,GAChB,cACA,WACA,cAAW,IACX,aAAU,MAEZ,MACG;CACH,IAAM,CAACC,GAAiBC,KAAsBN,EAAM,SAAS,EAAK,GAG5DO,IAAcP,EAAM,cAAc;EACtC,IAAMQ,IAAYL,EAAS,KAAK,OAAO;GACrC,GAAGM;GACH,OAAOA,EAAE,SAASC,EAAuBD,CAAC;EAC5C,EAAE;EAEF,OADAD,EAAU,MAAM,GAAG,OAAOG,EAAE,SAAS,MAAMC,EAAE,SAAS,EAAE,GACjDC,IAAWL,EAAU,MAAM,GAAGK,CAAQ,IAAIL;CACnD,GAAG,CAACL,GAAUU,CAAQ,CAAC;CAYvB,OACE,kBAAC,OAAD;EACO;EACL,aAAU;EACV,eAAaC;EACb,WAAWC,EAAG,wBAAwBC,CAAS;EAJjD,UAAA,CAOE,kBAAC,OAAD;GACE,aAAU;GACV,WAAU;GAFZ,UAAA,CAIE,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACE,kBAACC,GAAD,EAAQ,WAAU,uBAAwB,CAAA;KAC1C,kBAAC,MAAD;MAAI,WAAU;MAAwB,UAAA;KAAc,CAAA;KACpD,kBAAC,QAAD;MAAM,WAAU;MAAhB,UAAA,CAAiDV,EAAY,QAAO,QAAY;;IAC7E;GAEJ,CAAA,GAAAW,KACC,kBAACC,GAAD;IACE,SAAQ;IACR,MAAK;IACL,SAAS,YAhCmB;KACpC,IAAKD,GACL;QAAmB,EAAI;MACvB,IAAI;OACF,MAAMA,EAAc;MACtB,UAAU;OACR,EAAmB,EAAK;MAC1B;KALuB;IAMzB;IAyBU,UAAUb;IACV,QAAQS,IAAS,GAAGA,EAAO,WAAW,KAAA;IALxC,UAAA,CAOE,kBAACM,GAAD,EAAW,WAAWL,EAAG,gBAAgBV,KAAmB,cAAc,EAAI,CAAA,GAAC,aAEzE;GAEP,CAAA,CAAA;EAGL,CAAA,GAAA,kBAACgB,GAAD;GAAY,WAAU;GACpB,UAAA,kBAAC,OAAD;IACE,aAAU;IACV,WAAWN,EAAG,iBAAiBO,KAAW,eAAe;IAExD,UAAAf,EAAY,WAAW,IACtB,kBAAC,OAAD;KACE,aAAU;KACV,WAAU;KAFZ,UAAA;MAIE,kBAACU,GAAD,EAAQ,WAAU,4BAA6B,CAAA;MAC/C,kBAAC,KAAD;OAAG,WAAU;OAAU,UAAA;MAAuB,CAAA;MAC9C,kBAAC,KAAD;OAAG,WAAU;OAAU,UAAA;MAAgB,CAAA;KACpC;IAEL,CAAA,IAAAV,EAAY,KAAK,GAAM,MACrB,kBAACgB,GAAD;KAEQ;KACN,MAAMC,IAAQ;KACd,QAAQV,IAAS,GAAGA,EAAO,QAAQW,EAAK,OAAO,KAAA;KAC/C,eAAeC,IAAcD,CAAI;KACjC,kBAAkBE,IAAiBF,EAAK,EAAE;KAC1C,WAAW,MAAYG,IAAeH,EAAK,IAAII,CAAO;KACtD,iBACEC,KAAmB,MAAYA,EAAgBL,EAAK,IAAIM,CAAO,IAAI,KAAA;KAEtD;KACL;IACX,GAZMN,EAAK,EAYX,CACF;GAEA,CAAA;EACK,CAAA,CACT;;AAET,CACF;AAEA,EAAc,cAAc"}
+{"version":3,"file":"PriorityQueue.js","names":["React","React$1","PriorityQueue","rawTasks","DEFAULT_SNOOZE_OPTIONS","isRecalculating","setIsRecalculating","sortedTasks","withScore","t","calculatePriorityScore","b","a","maxItems","testId","cn","className","Target","onRecalculate","Button","RefreshCw","ScrollArea","compact","PriorityCard","index","task","onTaskClick","onTaskComplete","onTaskSnooze","minutes","onFactorsUpdate","factors"],"sources":["../../../../src/tools/components/priority-queue/PriorityQueue.tsx"],"sourcesContent":["/**\n * Priority Queue Component\n *\n * Focus Mode 用の優先度キューリスト\n *\n * @example\n * ```tsx\n * import { PriorityQueue, calculatePriorityScore } from '@alneas/appkit-react/tools/priority-queue';\n *\n * const tasks = rawTasks.map(t => ({\n *   ...t,\n *   score: calculatePriorityScore(t),\n * }));\n *\n * <PriorityQueue\n *   tasks={tasks}\n *   onTaskClick={(task) => openDetail(task.id)}\n *   onTaskComplete={(taskId) => markDone(taskId)}\n *   onFactorsUpdate={(taskId, factors) => updateFactors(taskId, factors)}\n *   onRecalculate={() => recalcAll()}\n *   testId=\"focus-queue\"\n * />\n * ```\n */\n\nimport * as React from 'react';\nimport { RefreshCw, Target } from 'lucide-react';\n\nimport { cn } from '../../lib/utils';\nimport { Button } from '../ui/button';\nimport { ScrollArea } from '../ui/scroll-area';\nimport { PriorityCard } from './PriorityCard';\nimport type { PriorityQueueProps } from './types';\nimport { calculatePriorityScore, DEFAULT_SNOOZE_OPTIONS } from './types';\n\n/**\n * 優先度キュー\n */\nexport function PriorityQueue({\n  ref,\n  tasks: rawTasks,\n  maxItems,\n  onTaskClick,\n  onTaskComplete,\n  onTaskSnooze,\n  onFactorsUpdate,\n  onRecalculate,\n  snoozeOptions = DEFAULT_SNOOZE_OPTIONS,\n  className,\n  testId,\n  readOnly = false,\n  compact = false,\n}: React.PropsWithoutRef<PriorityQueueProps> & React.RefAttributes<HTMLDivElement>) {\n  const [isRecalculating, setIsRecalculating] = React.useState(false);\n\n  // スコアでソート\n  const sortedTasks = React.useMemo(() => {\n    const withScore = rawTasks.map((t) => ({\n      ...t,\n      score: t.score ?? calculatePriorityScore(t),\n    }));\n    withScore.sort((a, b) => (b.score ?? 0) - (a.score ?? 0));\n    return maxItems ? withScore.slice(0, maxItems) : withScore;\n  }, [rawTasks, maxItems]);\n\n  const handleRecalculate = async () => {\n    if (!onRecalculate) return;\n    setIsRecalculating(true);\n    try {\n      await onRecalculate();\n    } finally {\n      setIsRecalculating(false);\n    }\n  };\n\n  return (\n    <div\n      ref={ref}\n      data-slot='priority-queue'\n      data-testid={testId}\n      className={cn('flex flex-col h-full', className)}\n    >\n      {/* ヘッダー */}\n      <div\n        data-slot='priority-queue-header'\n        className='flex items-center justify-between px-4 py-3 border-b'\n      >\n        <div className='flex items-center gap-2'>\n          <Target className='w-5 h-5 text-primary' />\n          <h2 className='text-lg font-semibold'>Focus Mode</h2>\n          <span className='text-sm text-muted-foreground'>{sortedTasks.length} tasks</span>\n        </div>\n\n        {onRecalculate && (\n          <Button\n            variant='outline'\n            size='sm'\n            onClick={handleRecalculate}\n            disabled={isRecalculating}\n            testId={testId ? `${testId}-recalc` : undefined}\n          >\n            <RefreshCw className={cn('w-4 h-4 mr-2', isRecalculating && 'animate-spin')} />\n            Recalculate\n          </Button>\n        )}\n      </div>\n\n      {/* タスクリスト */}\n      <ScrollArea className='flex-1'>\n        <div\n          data-slot='priority-queue-list'\n          className={cn('p-4 space-y-3', compact && 'p-2 space-y-2')}\n        >\n          {sortedTasks.length === 0 ? (\n            <div\n              data-slot='priority-queue-empty'\n              className='flex flex-col items-center justify-center py-12 text-muted-foreground'\n            >\n              <Target className='w-12 h-12 mb-4 opacity-30' />\n              <p className='text-sm'>No tasks to focus on</p>\n              <p className='text-xs'>Great job! 🎉</p>\n            </div>\n          ) : (\n            sortedTasks.map((task, index) => (\n              <PriorityCard\n                key={task.id}\n                task={task}\n                rank={index + 1}\n                testId={testId ? `${testId}-task-${task.id}` : undefined}\n                onClick={() => onTaskClick?.(task)}\n                onComplete={() => onTaskComplete?.(task.id)}\n                onSnooze={(minutes) => onTaskSnooze?.(task.id, minutes)}\n                onFactorsUpdate={\n                  onFactorsUpdate ? (factors) => onFactorsUpdate(task.id, factors) : undefined\n                }\n                snoozeOptions={snoozeOptions}\n                readOnly={readOnly}\n              />\n            ))\n          )}\n        </div>\n      </ScrollArea>\n    </div>\n  );\n}\n\nPriorityQueue.displayName = 'PriorityQueue';\n"],"mappings":";;;;;;;;;;AAsCA,SAAgBE,EAAc,EAC5B,QACA,OAAOC,GACP,aACA,gBACA,mBACA,iBACA,oBACA,kBACA,mBAAgBC,GAChB,cACA,WACA,cAAW,IACX,aAAU,MACwE;CAClF,IAAM,CAACC,GAAiBC,KAAsBN,EAAM,SAAS,EAAK,GAG5DO,IAAcP,EAAM,cAAc;EACtC,IAAMQ,IAAYL,EAAS,KAAK,OAAO;GACrC,GAAGM;GACH,OAAOA,EAAE,SAASC,EAAuBD,CAAC;EAC5C,EAAE;EAEF,OADAD,EAAU,MAAM,GAAG,OAAOG,EAAE,SAAS,MAAMC,EAAE,SAAS,EAAE,GACjDC,IAAWL,EAAU,MAAM,GAAGK,CAAQ,IAAIL;CACnD,GAAG,CAACL,GAAUU,CAAQ,CAAC;CAYvB,OACE,kBAAC,OAAD;EACO;EACL,aAAU;EACV,eAAaC;EACb,WAAWC,EAAG,wBAAwBC,CAAS;EAJjD,UAAA,CAOE,kBAAC,OAAD;GACE,aAAU;GACV,WAAU;GAFZ,UAAA,CAIE,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACE,kBAACC,GAAD,EAAQ,WAAU,uBAAwB,CAAA;KAC1C,kBAAC,MAAD;MAAI,WAAU;MAAwB,UAAA;KAAc,CAAA;KACpD,kBAAC,QAAD;MAAM,WAAU;MAAhB,UAAA,CAAiDV,EAAY,QAAO,QAAY;;IAC7E;GAEJ,CAAA,GAAAW,KACC,kBAACC,GAAD;IACE,SAAQ;IACR,MAAK;IACL,SAAS,YAhCmB;KACpC,IAAKD,GACL;QAAmB,EAAI;MACvB,IAAI;OACF,MAAMA,EAAc;MACtB,UAAU;OACR,EAAmB,EAAK;MAC1B;KALuB;IAMzB;IAyBU,UAAUb;IACV,QAAQS,IAAS,GAAGA,EAAO,WAAW,KAAA;IALxC,UAAA,CAOE,kBAACM,GAAD,EAAW,WAAWL,EAAG,gBAAgBV,KAAmB,cAAc,EAAI,CAAA,GAAC,aAEzE;GAEP,CAAA,CAAA;EAGL,CAAA,GAAA,kBAACgB,GAAD;GAAY,WAAU;GACpB,UAAA,kBAAC,OAAD;IACE,aAAU;IACV,WAAWN,EAAG,iBAAiBO,KAAW,eAAe;IAExD,UAAAf,EAAY,WAAW,IACtB,kBAAC,OAAD;KACE,aAAU;KACV,WAAU;KAFZ,UAAA;MAIE,kBAACU,GAAD,EAAQ,WAAU,4BAA6B,CAAA;MAC/C,kBAAC,KAAD;OAAG,WAAU;OAAU,UAAA;MAAuB,CAAA;MAC9C,kBAAC,KAAD;OAAG,WAAU;OAAU,UAAA;MAAgB,CAAA;KACpC;IAEL,CAAA,IAAAV,EAAY,KAAK,GAAM,MACrB,kBAACgB,GAAD;KAEQ;KACN,MAAMC,IAAQ;KACd,QAAQV,IAAS,GAAGA,EAAO,QAAQW,EAAK,OAAO,KAAA;KAC/C,eAAeC,IAAcD,CAAI;KACjC,kBAAkBE,IAAiBF,EAAK,EAAE;KAC1C,WAAW,MAAYG,IAAeH,EAAK,IAAII,CAAO;KACtD,iBACEC,KAAmB,MAAYA,EAAgBL,EAAK,IAAIM,CAAO,IAAI,KAAA;KAEtD;KACL;IACX,GAZMN,EAAK,EAYX,CACF;GAEA,CAAA;EACK,CAAA,CACT;;AAET;AAEA,EAAc,cAAc"}

package/dist/tools/components/sidebar/SmartSidebar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SmartSidebar.cjs","names":["useTheme","TooltipProvider","cn","Button","PanelLeft","ScrollArea","React","Separator","Tooltip","TooltipTrigger","buttonVariants","TooltipContent","require_runtime","require_ui_lib_utils","require_ui_components_ui_button_variants","require_ui_components_ui_button_components","require_ui_components_ui_separator","require_ui_components_ui_scroll_area","require_ui_components_ui_tooltip","require_ui_components_theme_theme_context","react_jsx_runtime","react","lucide_react","sidebarDensity","SmartSidebar","density","spacingTheme","handleNavigate","onNavigate","path","collapsed","className","header","onToggleCollapse","groups","SidebarGroupSection","index","footerItems","SidebarItemRow","activePath","item","sidebarFooter","groupCollapsed","setGroupCollapsed","group","isGroupCollapsible","toggleGroup","prev","visibleItems","isActive","itemHeight"],"sources":["../../../../src/tools/components/sidebar/SmartSidebar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from \"../../lib/utils\";\nimport { Button, buttonVariants } from '../ui/button';\nimport { ScrollArea } from '../ui/scroll-area';\nimport { Separator } from '../ui/separator';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../ui/tooltip';\nimport { PanelLeft } from 'lucide-react';\nimport { useTheme, type SpacingTheme } from '../theme/theme-context';\n\nconst sidebarDensity: Record<SpacingTheme, {\n  groupGap: string;\n  itemGap: string;\n  itemHeight: string;\n}> = {\n  compact: { groupGap: 'gap-1', itemGap: 'gap-0', itemHeight: 'h-8' },\n  normal: { groupGap: 'gap-2', itemGap: 'gap-1', itemHeight: 'h-9' },\n  comfortable: { groupGap: 'gap-4', itemGap: 'gap-2', itemHeight: 'h-11' },\n};\n\n/**\n * サイドバーのアイテム\n */\nexport interface SmartSidebarItem {\n  /** ラベル */\n  label: string;\n  /** アイコン */\n  icon: React.ReactNode;\n  /** パス */\n  path: string;\n  /** 無効化 */\n  disabled?: boolean;\n  /** バッジ等の追加コンテンツ */\n  extra?: React.ReactNode;\n}\n\n/**\n * サイドバーのグループ\n */\nexport interface SmartSidebarGroup {\n  /** グループタイトル */\n  title?: string;\n  /** アイテム */\n  items: SmartSidebarItem[];\n  /** 折りたたみ可能か */\n  collapsible?: boolean;\n  /** 初期状態で折りたたまれているか */\n  defaultCollapsed?: boolean;\n}\n\n/**\n * サイドバーのプロップス\n */\nexport interface SidebarProps {\n  /** 追加CSS */\n  className?: string;\n  /** ナビゲーショングループ */\n  groups: SmartSidebarGroup[];\n  /** フッターアイテム */\n  footerItems?: SmartSidebarItem[];\n  /** 現在のパス */\n  activePath?: string;\n  /** ナビゲーション発火 */\n  onNavigate?: (path: string) => void;\n  /** 折りたたみ状態 */\n  collapsed?: boolean;\n  /** 折りたたみトグル */\n  onToggleCollapse?: () => void;\n  /** カスタムヘッダー */\n  header?: (collapsed: boolean) => React.ReactNode;\n  /** カスタムフッター */\n  sidebarFooter?: (collapsed: boolean) => React.ReactNode;\n}\n\n/**\n * サイドバーコンポーネント\n *\n * 折りたたみ可能なナビゲーションサイドバー。\n * グループ化されたアイテム、アイコン、ツールチップに対応。\n *\n * @example\n * ```tsx\n * import { Sidebar } from '@alneas/appkit-react/tools/sidebar';\n * import { Home, Settings } from 'lucide-react';\n *\n * const groups = [\n *   {\n *     title: 'メイン',\n *     items: [\n *       { label: 'ホーム', icon: <Home />, path: '/' },\n *       { label: '設定', icon: <Settings />, path: '/settings' },\n *     ],\n *   },\n * ];\n *\n * <Sidebar\n *   groups={groups}\n *   activePath={location.pathname}\n *   onNavigate={(path) => navigate(path)}\n *   collapsed={isCollapsed}\n *   onToggleCollapse={() => setIsCollapsed(!isCollapsed)}\n * />\n * ```\n */\nexport function SmartSidebar({\n  className,\n  groups,\n  footerItems,\n  activePath,\n  onNavigate,\n  collapsed = false,\n  onToggleCollapse,\n  header,\n  sidebarFooter,\n}: SidebarProps) {\n  const { spacingTheme } = useTheme();\n  const density = sidebarDensity[spacingTheme];\n  const handleNavigate = (path: string) => {\n    if (onNavigate) {\n      onNavigate(path);\n    }\n  };\n\n  // Determine width based on collapsed state\n  // w-64 (16rem) -> expanded\n  // w-16 (4rem) -> collapsed\n  // You can adjust these values or make them configurable if needed\n  const widthClass = collapsed\n    ? 'w-[var(--sidebar-collapsed-width,4rem)]'\n    : 'w-[var(--sidebar-width,16rem)]';\n\n  return (\n    <TooltipProvider>\n      <div\n        className={cn(\n          'flex flex-col h-full bg-muted/20 border-r border-border transition-all duration-300 ease-in-out',\n          widthClass,\n          className,\n        )}\n      >\n        {/* Combined Header and Toggle Section */}\n        <div\n          className={cn(\n            'flex-none flex items-center h-14 px-3 gap-2',\n            collapsed ? 'justify-center' : 'justify-between',\n          )}\n        >\n          {/* Custom Header Content */}\n          {header && (\n            <div\n              className={cn(\n                'overflow-hidden whitespace-nowrap transition-all duration-300 ease-in-out',\n                collapsed && onToggleCollapse\n                  ? 'max-w-0 opacity-0 flex-none'\n                  : 'max-w-full flex-1 opacity-100',\n              )}\n            >\n              {header(collapsed)}\n            </div>\n          )}\n\n          {/* Toggle Button */}\n          {onToggleCollapse && (\n            <Button\n              variant='ghost'\n              size='icon'\n              className='h-8 w-8 shrink-0'\n              onClick={onToggleCollapse}\n            >\n              <PanelLeft size={16} />\n            </Button>\n          )}\n        </div>\n\n        <ScrollArea className='flex-1 py-2 min-h-0'>\n          <nav className={cn('flex flex-col px-2', density.groupGap)}>\n            {groups.map((group, index) => (\n              <SidebarGroupSection\n                key={index}\n                group={group}\n                collapsed={collapsed}\n                activePath={activePath}\n                onNavigate={handleNavigate}\n                density={density}\n              />\n            ))}\n          </nav>\n        </ScrollArea>\n\n        {/* Footer Items Section (Sticky Bottom) */}\n        {footerItems && footerItems.length > 0 && (\n          <div className='flex-none mt-auto p-2 border-t border-border bg-background/50 backdrop-blur-sm'>\n            <ul className={cn('flex flex-col', density.itemGap)}>\n              {footerItems.map((item, index) => (\n                <SidebarItemRow\n                  key={index}\n                  item={item}\n                  collapsed={collapsed}\n                  isActive={activePath === item.path}\n                  onNavigate={handleNavigate}\n                  itemHeight={density.itemHeight}\n                />\n              ))}\n            </ul>\n          </div>\n        )}\n\n        {/* Custom Footer Section */}\n        {sidebarFooter && (\n          <div\n            className={cn(\n              'flex-none p-4 border-t border-border bg-background/50 backdrop-blur-sm',\n              collapsed ? 'flex justify-center' : '',\n            )}\n          >\n            {sidebarFooter(collapsed)}\n          </div>\n        )}\n      </div>\n    </TooltipProvider>\n  );\n}\n\nfunction SidebarGroupSection({\n  group,\n  collapsed,\n  activePath,\n  onNavigate,\n  density,\n}: {\n  group: SmartSidebarGroup;\n  collapsed: boolean;\n  activePath?: string;\n  onNavigate: (path: string) => void;\n  density: (typeof sidebarDensity)[SpacingTheme];\n}) {\n  const [groupCollapsed, setGroupCollapsed] = React.useState(\n    group.defaultCollapsed ?? false\n  );\n\n  const isGroupCollapsible = group.collapsible && !collapsed;\n\n  const toggleGroup = React.useCallback(() => {\n    if (isGroupCollapsible) setGroupCollapsed(prev => !prev);\n  }, [isGroupCollapsible]);\n\n  // If no items, don't render group\n  if (!group.items?.length) return null;\n\n  const visibleItems = isGroupCollapsible && groupCollapsed\n    ? group.items.slice(0, 2)\n    : group.items;\n\n  return (\n    <div className={cn('flex flex-col', density.itemGap)}>\n      {/* Group Title Area - Fixed Height for smooth transition */}\n      {group.title && (\n        <div\n          className={cn(\n            'h-7 flex items-center relative px-2',\n            isGroupCollapsible && 'cursor-pointer hover:text-primary transition-colors',\n          )}\n          onClick={toggleGroup}\n        >\n          {/* Title Text */}\n          <h4\n            className={cn(\n              'text-sm font-semibold text-primary/80 uppercase tracking-wider overflow-hidden text-ellipsis whitespace-nowrap absolute left-2 right-2 transition-all duration-300 ease-in-out',\n              collapsed ? 'opacity-0 translate-x-[-10px]' : 'opacity-100 translate-x-0',\n            )}\n          >\n            {group.title}\n            {isGroupCollapsible && (\n              <span className='ml-1.5 text-xs opacity-60'>\n                {groupCollapsed ? '▸' : '▾'}\n              </span>\n            )}\n          </h4>\n\n          {/* Collapsed Separator */}\n          <div\n            className={cn(\n              'absolute left-0 right-0 top-1/2 -translate-y-1/2 flex justify-center transition-all duration-300',\n              collapsed ? 'opacity-100' : 'opacity-0',\n            )}\n          >\n            <Separator className='w-8 opacity-50' />\n          </div>\n        </div>\n      )}\n\n      <ul className={cn('flex flex-col', density.itemGap)}>\n        {visibleItems.map((item, index) => (\n          <SidebarItemRow\n            key={index}\n            item={item}\n            collapsed={collapsed}\n            isActive={activePath === item.path}\n            onNavigate={onNavigate}\n            itemHeight={density.itemHeight}\n          />\n        ))}\n        {isGroupCollapsible && groupCollapsed && group.items.length > 2 && (\n          <li>\n            <button\n              onClick={(e) => { e.stopPropagation(); setGroupCollapsed(false); }}\n              className='flex w-full items-center justify-center h-8 text-xs text-muted-foreground hover:text-primary transition-colors'\n            >\n              +{group.items.length - 2} more\n            </button>\n          </li>\n        )}\n      </ul>\n    </div>\n  );\n}\n\nfunction SidebarItemRow({\n  item,\n  collapsed,\n  isActive,\n  onNavigate,\n  itemHeight,\n}: {\n  item: SmartSidebarItem;\n  collapsed: boolean;\n  isActive: boolean;\n  onNavigate: (path: string) => void;\n  itemHeight: string;\n}) {\n  return (\n    <li>\n      <Tooltip>\n        <TooltipTrigger\n          className={cn(\n            buttonVariants({ variant: isActive ? 'secondary' : 'ghost' }),\n            'flex w-full items-center transition-all duration-300',\n            itemHeight,\n            collapsed ? 'justify-center px-1' : 'justify-start px-3',\n            isActive && 'bg-primary/10 text-primary font-medium hover:bg-primary/20',\n            !isActive && 'text-muted-foreground hover:text-foreground font-normal',\n          )}\n          onClick={() => onNavigate(item.path)}\n          disabled={item.disabled}\n        >\n          {/* Icon Wrapper */}\n          <span\n            className={cn(\n              'flex items-center justify-center shrink-0 transition-all duration-300',\n              isActive ? 'text-primary' : 'opacity-70',\n            )}\n          >\n            {React.isValidElement(item.icon)\n              ? // @ts-expect-error - cloning strictly for size prop if supported\n                React.cloneElement(item.icon, { size: 18 })\n              : item.icon}\n          </span>\n\n          {/* Label & Extra Wrapper for smooth transition */}\n          <span\n            className={cn(\n              'flex flex-1 items-center overflow-hidden transition-all duration-300 ease-in-out',\n              collapsed ? 'max-w-0 opacity-0' : 'max-w-[200px] opacity-100 ml-3',\n            )}\n          >\n            <span className='truncate flex-1 text-left text-sm'>{item.label}</span>\n            {item.extra && (\n              <span className='shrink-0 text-xs text-muted-foreground ml-2'>{item.extra}</span>\n            )}\n          </span>\n        </TooltipTrigger>\n        {collapsed && (\n          <TooltipContent side='right' className='flex items-center gap-2'>\n            {item.label}\n            {item.extra && <span className='opacity-70'>{item.extra}</span>}\n          </TooltipContent>\n        )}\n      </Tooltip>\n    </li>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"SmartSidebar.cjs","names":["useTheme","TooltipProvider","cn","Button","PanelLeft","ScrollArea","React","Separator","Tooltip","TooltipTrigger","buttonVariants","TooltipContent","require_runtime","require_ui_lib_utils","require_ui_components_ui_button_variants","require_ui_components_ui_button_components","require_ui_components_ui_separator","require_ui_components_ui_scroll_area","require_ui_components_ui_tooltip","require_ui_components_theme_theme_context","react_jsx_runtime","react","lucide_react","sidebarDensity","SmartSidebar","density","spacingTheme","handleNavigate","onNavigate","path","collapsed","className","header","onToggleCollapse","groups","SidebarGroupSection","index","footerItems","SidebarItemRow","activePath","item","sidebarFooter","groupCollapsed","setGroupCollapsed","group","isGroupCollapsible","toggleGroup","prev","visibleItems","isActive","itemHeight"],"sources":["../../../../src/tools/components/sidebar/SmartSidebar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from \"../../lib/utils\";\nimport { Button, buttonVariants } from '../ui/button';\nimport { ScrollArea } from '../ui/scroll-area';\nimport { Separator } from '../ui/separator';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../ui/tooltip';\nimport { PanelLeft } from 'lucide-react';\nimport { useTheme, type SpacingTheme } from '../theme/theme-context';\n\nconst sidebarDensity: Record<SpacingTheme, {\n  groupGap: string;\n  itemGap: string;\n  itemHeight: string;\n}> = {\n  compact: { groupGap: 'gap-1', itemGap: 'gap-0', itemHeight: 'h-8' },\n  normal: { groupGap: 'gap-2', itemGap: 'gap-1', itemHeight: 'h-9' },\n  comfortable: { groupGap: 'gap-4', itemGap: 'gap-2', itemHeight: 'h-11' },\n};\n\n/**\n * A navigation item rendered by {@link SmartSidebar}.\n * @see SmartSidebar\n */\nexport interface SmartSidebarItem {\n  /** Visible item label; also used in collapsed tooltips. */\n  label: string;\n  /** Icon rendered in expanded and collapsed layouts. */\n  icon: React.ReactNode;\n  /** Opaque destination passed to onNavigate; compared exactly with activePath. */\n  path: string;\n  /** Disables item activation when true; omitted means enabled. */\n  disabled?: boolean;\n  /** Additional content shown beside the expanded item label. */\n  extra?: React.ReactNode;\n}\n\n/**\n * サイドバーのグループ\n */\nexport interface SmartSidebarGroup {\n  /** Optional heading; omitted headings render no group title. */\n  title?: string;\n  /** Items in display order. */\n  items: SmartSidebarItem[];\n  /** Allows the expanded sidebar heading to toggle between all items and a two-item preview. */\n  collapsible?: boolean;\n  /** Initial two-item group preview state; defaults to false. Later prop changes do not reset local state. */\n  defaultCollapsed?: boolean;\n}\n\n/**\n * サイドバーのプロップス\n */\nexport interface SidebarProps {\n  /** Additional classes for the sidebar root. */\n  className?: string;\n  /** Groups in display order. */\n  groups: SmartSidebarGroup[];\n  /** Optional navigation items pinned below the scrollable groups. */\n  footerItems?: SmartSidebarItem[];\n  /** Exact path used to highlight active items; no item is active when omitted. */\n  activePath?: string;\n  /** Called with the activated item path; the host performs routing. */\n  onNavigate?: (path: string) => void;\n  /** Controlled whole-sidebar collapse state; defaults to false. */\n  collapsed?: boolean;\n  /** Called by the toggle button; the host must update collapsed. Omitted hides the button. */\n  onToggleCollapse?: () => void;\n  /** Renders header content with the current collapsed state. */\n  header?: (collapsed: boolean) => React.ReactNode;\n  /** Renders footer content with the current collapsed state. */\n  sidebarFooter?: (collapsed: boolean) => React.ReactNode;\n}\n\n/**\n * Renders grouped navigation with controlled sidebar collapse and local group collapse.\n * @param props - Navigation items, controlled selection/collapse and render callbacks; see {@link SidebarProps}.\n * @returns The sidebar element, including its own tooltip provider.\n * @remarks Import Appkit CSS. ThemeProvider enables reactive spacing density; without one,\n * the theme context uses normal spacing. The host owns routing\n * and updates activePath/collapsed. Sidebar from the same entry is a compound namespace;\n * use SmartSidebar for this groups-based API. CSS variables --sidebar-width and\n * --sidebar-collapsed-width fall back to 16rem and 4rem respectively.\n * @example\n * ```tsx\n * import { useState } from 'react';\n * import { SmartSidebar } from '@alneas/appkit-react/tools/sidebar';\n * import { ThemeProvider } from '@alneas/appkit-react/ui/theme';\n * import '@alneas/appkit-react/styles';\n *\n * export function Navigation() {\n *   const [path, setPath] = useState('/');\n *   const [collapsed, setCollapsed] = useState(false);\n *   return <ThemeProvider><SmartSidebar\n *     groups={[{ title: 'Main', items: [{ label: 'Home', icon: <span>H</span>, path: '/' }] }]}\n *     activePath={path} onNavigate={setPath} collapsed={collapsed}\n *     onToggleCollapse={() => setCollapsed(value => !value)}\n *   /></ThemeProvider>;\n * }\n * ```\n */\nexport function SmartSidebar({\n  className,\n  groups,\n  footerItems,\n  activePath,\n  onNavigate,\n  collapsed = false,\n  onToggleCollapse,\n  header,\n  sidebarFooter,\n}: SidebarProps) {\n  const { spacingTheme } = useTheme();\n  const density = sidebarDensity[spacingTheme];\n  const handleNavigate = (path: string) => {\n    if (onNavigate) {\n      onNavigate(path);\n    }\n  };\n\n  // Determine width based on collapsed state\n  // w-64 (16rem) -> expanded\n  // w-16 (4rem) -> collapsed\n  // You can adjust these values or make them configurable if needed\n  const widthClass = collapsed\n    ? 'w-[var(--sidebar-collapsed-width,4rem)]'\n    : 'w-[var(--sidebar-width,16rem)]';\n\n  return (\n    <TooltipProvider>\n      <div\n        className={cn(\n          'flex flex-col h-full bg-muted/20 border-r border-border transition-all duration-300 ease-in-out',\n          widthClass,\n          className,\n        )}\n      >\n        {/* Combined Header and Toggle Section */}\n        <div\n          className={cn(\n            'flex-none flex items-center h-14 px-3 gap-2',\n            collapsed ? 'justify-center' : 'justify-between',\n          )}\n        >\n          {/* Custom Header Content */}\n          {header && (\n            <div\n              className={cn(\n                'overflow-hidden whitespace-nowrap transition-all duration-300 ease-in-out',\n                collapsed && onToggleCollapse\n                  ? 'max-w-0 opacity-0 flex-none'\n                  : 'max-w-full flex-1 opacity-100',\n              )}\n            >\n              {header(collapsed)}\n            </div>\n          )}\n\n          {/* Toggle Button */}\n          {onToggleCollapse && (\n            <Button\n              variant='ghost'\n              size='icon'\n              className='h-8 w-8 shrink-0'\n              onClick={onToggleCollapse}\n            >\n              <PanelLeft size={16} />\n            </Button>\n          )}\n        </div>\n\n        <ScrollArea className='flex-1 py-2 min-h-0'>\n          <nav className={cn('flex flex-col px-2', density.groupGap)}>\n            {groups.map((group, index) => (\n              <SidebarGroupSection\n                key={index}\n                group={group}\n                collapsed={collapsed}\n                activePath={activePath}\n                onNavigate={handleNavigate}\n                density={density}\n              />\n            ))}\n          </nav>\n        </ScrollArea>\n\n        {/* Footer Items Section (Sticky Bottom) */}\n        {footerItems && footerItems.length > 0 && (\n          <div className='flex-none mt-auto p-2 border-t border-border bg-background/50 backdrop-blur-sm'>\n            <ul className={cn('flex flex-col', density.itemGap)}>\n              {footerItems.map((item, index) => (\n                <SidebarItemRow\n                  key={index}\n                  item={item}\n                  collapsed={collapsed}\n                  isActive={activePath === item.path}\n                  onNavigate={handleNavigate}\n                  itemHeight={density.itemHeight}\n                />\n              ))}\n            </ul>\n          </div>\n        )}\n\n        {/* Custom Footer Section */}\n        {sidebarFooter && (\n          <div\n            className={cn(\n              'flex-none p-4 border-t border-border bg-background/50 backdrop-blur-sm',\n              collapsed ? 'flex justify-center' : '',\n            )}\n          >\n            {sidebarFooter(collapsed)}\n          </div>\n        )}\n      </div>\n    </TooltipProvider>\n  );\n}\n\nfunction SidebarGroupSection({\n  group,\n  collapsed,\n  activePath,\n  onNavigate,\n  density,\n}: {\n  group: SmartSidebarGroup;\n  collapsed: boolean;\n  activePath?: string;\n  onNavigate: (path: string) => void;\n  density: (typeof sidebarDensity)[SpacingTheme];\n}) {\n  const [groupCollapsed, setGroupCollapsed] = React.useState(\n    group.defaultCollapsed ?? false\n  );\n\n  const isGroupCollapsible = group.collapsible && !collapsed;\n\n  const toggleGroup = React.useCallback(() => {\n    if (isGroupCollapsible) setGroupCollapsed(prev => !prev);\n  }, [isGroupCollapsible]);\n\n  // If no items, don't render group\n  if (!group.items?.length) return null;\n\n  const visibleItems = isGroupCollapsible && groupCollapsed\n    ? group.items.slice(0, 2)\n    : group.items;\n\n  return (\n    <div className={cn('flex flex-col', density.itemGap)}>\n      {/* Group Title Area - Fixed Height for smooth transition */}\n      {group.title && (\n        <div\n          className={cn(\n            'h-7 flex items-center relative px-2',\n            isGroupCollapsible && 'cursor-pointer hover:text-primary transition-colors',\n          )}\n          onClick={toggleGroup}\n        >\n          {/* Title Text */}\n          <h4\n            className={cn(\n              'text-sm font-semibold text-primary/80 uppercase tracking-wider overflow-hidden text-ellipsis whitespace-nowrap absolute left-2 right-2 transition-all duration-300 ease-in-out',\n              collapsed ? 'opacity-0 translate-x-[-10px]' : 'opacity-100 translate-x-0',\n            )}\n          >\n            {group.title}\n            {isGroupCollapsible && (\n              <span className='ml-1.5 text-xs opacity-60'>\n                {groupCollapsed ? '▸' : '▾'}\n              </span>\n            )}\n          </h4>\n\n          {/* Collapsed Separator */}\n          <div\n            className={cn(\n              'absolute left-0 right-0 top-1/2 -translate-y-1/2 flex justify-center transition-all duration-300',\n              collapsed ? 'opacity-100' : 'opacity-0',\n            )}\n          >\n            <Separator className='w-8 opacity-50' />\n          </div>\n        </div>\n      )}\n\n      <ul className={cn('flex flex-col', density.itemGap)}>\n        {visibleItems.map((item, index) => (\n          <SidebarItemRow\n            key={index}\n            item={item}\n            collapsed={collapsed}\n            isActive={activePath === item.path}\n            onNavigate={onNavigate}\n            itemHeight={density.itemHeight}\n          />\n        ))}\n        {isGroupCollapsible && groupCollapsed && group.items.length > 2 && (\n          <li>\n            <button\n              onClick={(e) => { e.stopPropagation(); setGroupCollapsed(false); }}\n              className='flex w-full items-center justify-center h-8 text-xs text-muted-foreground hover:text-primary transition-colors'\n            >\n              +{group.items.length - 2} more\n            </button>\n          </li>\n        )}\n      </ul>\n    </div>\n  );\n}\n\nfunction SidebarItemRow({\n  item,\n  collapsed,\n  isActive,\n  onNavigate,\n  itemHeight,\n}: {\n  item: SmartSidebarItem;\n  collapsed: boolean;\n  isActive: boolean;\n  onNavigate: (path: string) => void;\n  itemHeight: string;\n}) {\n  return (\n    <li>\n      <Tooltip>\n        <TooltipTrigger\n          className={cn(\n            buttonVariants({ variant: isActive ? 'secondary' : 'ghost' }),\n            'flex w-full items-center transition-all duration-300',\n            itemHeight,\n            collapsed ? 'justify-center px-1' : 'justify-start px-3',\n            isActive && 'bg-primary/10 text-primary font-medium hover:bg-primary/20',\n            !isActive && 'text-muted-foreground hover:text-foreground font-normal',\n          )}\n          onClick={() => onNavigate(item.path)}\n          disabled={item.disabled}\n        >\n          {/* Icon Wrapper */}\n          <span\n            className={cn(\n              'flex items-center justify-center shrink-0 transition-all duration-300',\n              isActive ? 'text-primary' : 'opacity-70',\n            )}\n          >\n            {React.isValidElement(item.icon)\n              ? // @ts-expect-error - cloning strictly for size prop if supported\n                React.cloneElement(item.icon, { size: 18 })\n              : item.icon}\n          </span>\n\n          {/* Label & Extra Wrapper for smooth transition */}\n          <span\n            className={cn(\n              'flex flex-1 items-center overflow-hidden transition-all duration-300 ease-in-out',\n              collapsed ? 'max-w-0 opacity-0' : 'max-w-[200px] opacity-100 ml-3',\n            )}\n          >\n            <span className='truncate flex-1 text-left text-sm'>{item.label}</span>\n            {item.extra && (\n              <span className='shrink-0 text-xs text-muted-foreground ml-2'>{item.extra}</span>\n            )}\n          </span>\n        </TooltipTrigger>\n        {collapsed && (\n          <TooltipContent side='right' className='flex items-center gap-2'>\n            {item.label}\n            {item.extra && <span className='opacity-70'>{item.extra}</span>}\n          </TooltipContent>\n        )}\n      </Tooltip>\n    </li>\n  );\n}\n"],"mappings":"A,0mBASA,IAAMuB,EAID,CACH,QAAS,CAAE,SAAU,QAAS,QAAS,QAAS,WAAY,KAAM,EAClE,OAAQ,CAAE,SAAU,QAAS,QAAS,QAAS,WAAY,KAAM,EACjE,YAAa,CAAE,SAAU,QAAS,QAAS,QAAS,WAAY,MAAO,CACzE,EAoFA,SAAgBC,EAAa,CAC3B,YACA,SACA,cACA,aACA,aACA,YAAY,GACZ,mBACA,SACA,iBACe,CACf,GAAM,CAAE,gBAAiBxB,EAAAA,SAAS,EAC5ByB,EAAUF,EAAeG,GACzBC,EAAkB,GAAiB,CACnCC,GACFA,EAAWC,CAAI,CAEnB,EAUA,OACE,EAAAT,EAAA,IAAA,CAACnB,EAAAA,gBAAD,CAAA,UACE,EAAAmB,EAAA,KAAA,CAAC,MAAD,CACE,UAAWlB,EAAAA,GACT,kGARW4B,EACf,0CACA,iCAQIC,CACF,EALF,SAAA,EAQE,EAAAX,EAAA,KAAA,CAAC,MAAD,CACE,UAAWlB,EAAAA,GACT,8CACA4B,EAAY,iBAAmB,iBACjC,EAJF,SAAA,CAOGE,IACC,EAAAZ,EAAA,IAAA,CAAC,MAAD,CACE,UAAWlB,EAAAA,GACT,4EACA4B,GAAaG,EACT,8BACA,+BACN,EAEC,SAAAD,EAAOF,CAAS,CACd,CAAA,EAING,IACC,EAAAb,EAAA,IAAA,CAACjB,EAAAA,OAAD,CACE,QAAQ,QACR,KAAK,OACL,UAAU,mBACV,QAAS8B,EAET,UAAA,EAAAb,EAAA,IAAA,CAAChB,EAAAA,UAAD,CAAW,KAAM,EAAK,CAAA,CAChB,CAAA,CAEP,C,IAEL,EAAAgB,EAAA,IAAA,CAACf,EAAAA,WAAD,CAAY,UAAU,sBACpB,UAAA,EAAAe,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWlB,EAAAA,GAAG,qBAAsBuB,EAAQ,QAAQ,EACtD,SAAAS,EAAO,KAAK,EAAO,KAClB,EAAAd,EAAA,IAAA,CAACe,EAAD,CAES,QACI,YACC,aACZ,WAAYR,EACH,SACV,EANMS,CAMN,CACF,CACE,CAAA,CACK,CAAA,EAGXC,GAAeA,EAAY,OAAS,IACnC,EAAAjB,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,iFACb,UAAA,EAAAA,EAAA,IAAA,CAAC,KAAD,CAAI,UAAWlB,EAAAA,GAAG,gBAAiBuB,EAAQ,OAAO,EAC/C,SAAAY,EAAY,KAAK,EAAM,KACtB,EAAAjB,EAAA,IAAA,CAACkB,EAAD,CAEQ,OACK,YACX,SAAUC,IAAeC,EAAK,KAC9B,WAAYb,EACZ,WAAYF,EAAQ,UACrB,EANMW,CAMN,CACF,CACC,CAAA,CACD,CAAA,EAINK,IACC,EAAArB,EAAA,IAAA,CAAC,MAAD,CACE,UAAWlB,EAAAA,GACT,yEACA4B,EAAY,sBAAwB,EACtC,EAEC,SAAAW,EAAcX,CAAS,CACrB,CAAA,CAEJ,CACU,CAAA,CAAA,CAAA,CAErB,CAEA,SAASK,EAAoB,CAC3B,QACA,YACA,aACA,aACA,WAOC,CACD,GAAM,CAACO,EAAgBC,GAAqBrC,EAAM,SAChDsC,EAAM,kBAAoB,EAC5B,EAEMC,EAAqBD,EAAM,aAAe,CAACd,EAE3CgB,EAAcxC,EAAM,gBAAkB,CACtCuC,GAAoBF,EAAkB,GAAQ,CAACI,CAAI,CACzD,EAAG,CAACF,CAAkB,CAAC,EAGvB,GAAI,CAACD,EAAM,OAAO,OAAQ,OAAO,KAEjC,IAAMI,EAAeH,GAAsBH,EACvCE,EAAM,MAAM,MAAM,EAAG,CAAC,EACtBA,EAAM,MAEV,OACE,EAAAxB,EAAA,KAAA,CAAC,MAAD,CAAK,UAAWlB,EAAAA,GAAG,gBAAiBuB,EAAQ,OAAO,EAAnD,SAAA,CAEGmB,EAAM,QACL,EAAAxB,EAAA,KAAA,CAAC,MAAD,CACE,UAAWlB,EAAAA,GACT,sCACA2C,GAAsB,qDACxB,EACA,QAASC,EALX,SAAA,EAQE,EAAA1B,EAAA,KAAA,CAAC,KAAD,CACE,UAAWlB,EAAAA,GACT,iLACA4B,EAAY,gCAAkC,2BAChD,EAJF,SAAA,CAMGc,EAAM,MACNC,IACC,EAAAzB,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,4BACb,SAAAsB,EAAiB,IAAM,GACpB,CAAA,CAEN,CAGJ,CAAA,GAAA,EAAAtB,EAAA,IAAA,CAAC,MAAD,CACE,UAAWlB,EAAAA,GACT,mGACA4B,EAAY,cAAgB,WAC9B,EAEA,UAAA,EAAAV,EAAA,IAAA,CAACb,EAAAA,UAAD,CAAW,UAAU,gBAAkB,CAAA,CACpC,CAAA,CACF,CAGP,CAAA,GAAA,EAAAa,EAAA,KAAA,CAAC,KAAD,CAAI,UAAWlB,EAAAA,GAAG,gBAAiBuB,EAAQ,OAAO,EAAlD,SAAA,CACGuB,EAAa,KAAK,EAAM,KACvB,EAAA5B,EAAA,IAAA,CAACkB,EAAD,CAEQ,OACK,YACX,SAAUC,IAAeC,EAAK,KAClB,aACZ,WAAYf,EAAQ,UACrB,EANMW,CAMN,CACF,EACAS,GAAsBH,GAAkBE,EAAM,MAAM,OAAS,IAC5D,EAAAxB,EAAA,IAAA,CAAC,KAAD,CAAA,UACE,EAAAA,EAAA,KAAA,CAAC,SAAD,CACE,QAAU,GAAM,CAAE,EAAE,gBAAgB,EAAGuB,EAAkB,EAAK,CAAG,EACjE,UAAU,iHAFZ,SAAA,CAGC,IACGC,EAAM,MAAM,OAAS,EAAE,OACnB,CACN,CAAA,CAAA,CAAA,CAEJ,CACD,CAAA,CAAA,C,EAET,CAEA,SAASN,EAAe,CACtB,OACA,YACA,WACA,aACA,cAOC,CACD,OACE,EAAAlB,EAAA,IAAA,CAAC,KAAD,CAAA,UACE,EAAAA,EAAA,KAAA,CAACZ,EAAAA,QAAD,CAAA,SAAA,EACE,EAAAY,EAAA,KAAA,CAACX,EAAAA,eAAD,CACE,UAAWP,EAAAA,GACTQ,EAAAA,eAAe,CAAE,QAASuC,EAAW,YAAc,OAAQ,CAAC,EAC5D,uDACAC,EACApB,EAAY,sBAAwB,qBACpCmB,GAAY,6DACZ,CAACA,GAAY,yDACf,EACA,YAAerB,EAAWY,EAAK,IAAI,EACnC,SAAUA,EAAK,SAVjB,SAAA,EAaE,EAAApB,EAAA,IAAA,CAAC,OAAD,CACE,UAAWlB,EAAAA,GACT,wEACA+C,EAAW,eAAiB,YAC9B,EAEC,SAAA3C,EAAM,eAAekC,EAAK,IAAI,EAE3BlC,EAAM,aAAakC,EAAK,KAAM,CAAE,KAAM,EAAG,CAAC,EAC1CA,EAAK,IACL,CAAA,GAGN,EAAApB,EAAA,KAAA,CAAC,OAAD,CACE,UAAWlB,EAAAA,GACT,mFACA4B,EAAY,oBAAsB,gCACpC,EAJF,SAAA,EAME,EAAAV,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,oCAAqC,SAAAoB,EAAK,KAAY,CAAA,EACrEA,EAAK,QACJ,EAAApB,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,8CAA+C,SAAAoB,EAAK,KAAY,CAAA,CAE9E,CACQ,CAAA,CAAA,CACf,CAAA,EAAAV,IACC,EAAAV,EAAA,KAAA,CAACT,EAAAA,eAAD,CAAgB,KAAK,QAAQ,UAAU,0BAAvC,SAAA,CACG6B,EAAK,MACLA,EAAK,QAAS,EAAApB,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,aAAc,SAAAoB,EAAK,KAAY,CAAA,CAChD,CAEX,CAAA,CAAA,CAAA,CAAA,CACP,CAAA,CAER,C"}

package/dist/tools/components/sidebar/SmartSidebar.d.cts

@@ -1,83 +1,81 @@
 import * as React from 'react';
 /**
- * サイドバーのアイテム
+ * A navigation item rendered by {@link SmartSidebar}.
+ * @see SmartSidebar
  */
 export interface SmartSidebarItem {
-    /** ラベル */
+    /** Visible item label; also used in collapsed tooltips. */
     label: string;
-    /** アイコン */
+    /** Icon rendered in expanded and collapsed layouts. */
     icon: React.ReactNode;
-    /** パス */
+    /** Opaque destination passed to onNavigate; compared exactly with activePath. */
     path: string;
-    /** 無効化 */
+    /** Disables item activation when true; omitted means enabled. */
     disabled?: boolean;
-    /** バッジ等の追加コンテンツ */
+    /** Additional content shown beside the expanded item label. */
     extra?: React.ReactNode;
 }
 /**
  * サイドバーのグループ
  */
 export interface SmartSidebarGroup {
-    /** グループタイトル */
+    /** Optional heading; omitted headings render no group title. */
     title?: string;
-    /** アイテム */
+    /** Items in display order. */
     items: SmartSidebarItem[];
-    /** 折りたたみ可能か */
+    /** Allows the expanded sidebar heading to toggle between all items and a two-item preview. */
     collapsible?: boolean;
-    /** 初期状態で折りたたまれているか */
+    /** Initial two-item group preview state; defaults to false. Later prop changes do not reset local state. */
     defaultCollapsed?: boolean;
 }
 /**
  * サイドバーのプロップス
  */
 export interface SidebarProps {
-    /** 追加CSS */
+    /** Additional classes for the sidebar root. */
     className?: string;
-    /** ナビゲーショングループ */
+    /** Groups in display order. */
     groups: SmartSidebarGroup[];
-    /** フッターアイテム */
+    /** Optional navigation items pinned below the scrollable groups. */
     footerItems?: SmartSidebarItem[];
-    /** 現在のパス */
+    /** Exact path used to highlight active items; no item is active when omitted. */
     activePath?: string;
-    /** ナビゲーション発火 */
+    /** Called with the activated item path; the host performs routing. */
     onNavigate?: (path: string) => void;
-    /** 折りたたみ状態 */
+    /** Controlled whole-sidebar collapse state; defaults to false. */
     collapsed?: boolean;
-    /** 折りたたみトグル */
+    /** Called by the toggle button; the host must update collapsed. Omitted hides the button. */
     onToggleCollapse?: () => void;
-    /** カスタムヘッダー */
+    /** Renders header content with the current collapsed state. */
     header?: (collapsed: boolean) => React.ReactNode;
-    /** カスタムフッター */
+    /** Renders footer content with the current collapsed state. */
     sidebarFooter?: (collapsed: boolean) => React.ReactNode;
 }
 /**
- * サイドバーコンポーネント
- *
- * 折りたたみ可能なナビゲーションサイドバー。
- * グループ化されたアイテム、アイコン、ツールチップに対応。
- *
+ * Renders grouped navigation with controlled sidebar collapse and local group collapse.
+ * @param props - Navigation items, controlled selection/collapse and render callbacks; see {@link SidebarProps}.
+ * @returns The sidebar element, including its own tooltip provider.
+ * @remarks Import Appkit CSS. ThemeProvider enables reactive spacing density; without one,
+ * the theme context uses normal spacing. The host owns routing
+ * and updates activePath/collapsed. Sidebar from the same entry is a compound namespace;
+ * use SmartSidebar for this groups-based API. CSS variables --sidebar-width and
+ * --sidebar-collapsed-width fall back to 16rem and 4rem respectively.
  * @example
  * ```tsx
- * import { Sidebar } from '@alneas/appkit-react/tools/sidebar';
- * import { Home, Settings } from 'lucide-react';
- *
- * const groups = [
- *   {
- *     title: 'メイン',
- *     items: [
- *       { label: 'ホーム', icon: <Home />, path: '/' },
- *       { label: '設定', icon: <Settings />, path: '/settings' },
- *     ],
- *   },
- * ];
+ * import { useState } from 'react';
+ * import { SmartSidebar } from '@alneas/appkit-react/tools/sidebar';
+ * import { ThemeProvider } from '@alneas/appkit-react/ui/theme';
+ * import '@alneas/appkit-react/styles';
  *
- * <Sidebar
- *   groups={groups}
- *   activePath={location.pathname}
- *   onNavigate={(path) => navigate(path)}
- *   collapsed={isCollapsed}
- *   onToggleCollapse={() => setIsCollapsed(!isCollapsed)}
- * />
+ * export function Navigation() {
+ *   const [path, setPath] = useState('/');
+ *   const [collapsed, setCollapsed] = useState(false);
+ *   return <ThemeProvider><SmartSidebar
+ *     groups={[{ title: 'Main', items: [{ label: 'Home', icon: <span>H</span>, path: '/' }] }]}
+ *     activePath={path} onNavigate={setPath} collapsed={collapsed}
+ *     onToggleCollapse={() => setCollapsed(value => !value)}
+ *   /></ThemeProvider>;
+ * }
  * ```
  */
 export declare function SmartSidebar({ className, groups, footerItems, activePath, onNavigate, collapsed, onToggleCollapse, header, sidebarFooter, }: SidebarProps): React.JSX.Element;