@alneas/appkit-react 0.1.0 → 0.2.0

package/dist/tools/components/error/ErrorDialog.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorDialog.cjs","names":["Info","AlertTriangle","X","AlertCircle","useErrorStore","AppError","Dialog","DialogContent","DialogHeader","cn","DialogTitle","DialogDescription","DialogFooter","Button","require_runtime","require_ui_lib_utils","require_ui_components_ui_button_components","require_ui_components_ui_dialog","require_common_actions_ok","require_errors_code","require_errors_dialogtitle1","require_tools_lib_error_AppError","require_tools_lib_state_error_store","react_jsx_runtime","react","lucide_react","severityConfig","ErrorDialog","propError","propOpen","dialogErrors","getErrorsByMode","storeError","displayError","isOpen","handleClose","removeError","onClose","handlePrimaryAction","onPrimaryAction","handleSecondaryAction","onSecondaryAction","severity","config","Icon","open","secondaryActionLabel","testId","primaryActionLabel"],"sources":["../../../../src/tools/components/error/ErrorDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { AlertCircle, X, AlertTriangle, Info } from 'lucide-react';\nimport * as m from '../../paraglide/messages.js';\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n} from '../ui/dialog';\nimport { Button } from '../ui/button';\nimport { cn } from \"../../lib/utils\";\nimport { AppError, ErrorSeverity } from \"../../lib/error\";\nimport { useErrorStore } from \"../../lib/state/error-store\";\n\n/**\n * ErrorDialogProps\n * エラーダイアログのプロップス\n *\n * ## AI/Automation Features\n * - `testId`: Stable selector on dialog and buttons\n * - Pattern: `{testId}`, `{testId}-primary`, `{testId}-secondary`\n * - `data-severity`: error, warning, info, critical\n */\nexport interface ErrorDialogProps {\n  /** AI/E2E Test用の安定ID / Stable test identifier */\n  testId?: string;\n  /** 直接表示するエラー (制御モード) */\n  error?: AppError | null;\n  /** 開閉状態 (制御モード) */\n  open?: boolean;\n  /** 閉じるときのコールバック */\n  onClose?: () => void;\n  /** 主要アクションのラベル。デフォルト: 'OK' */\n  primaryActionLabel?: string;\n  /** 主要アクションのコールバック */\n  onPrimaryAction?: () => void;\n  /** セカンダリアクションのラベル */\n  secondaryActionLabel?: string;\n  /** セカンダリアクションのコールバック */\n  onSecondaryAction?: () => void;\n}\n\nconst severityConfig: Record<\n  ErrorSeverity,\n  {\n    icon: React.ElementType;\n    iconBgClass: string;\n    iconClass: string;\n    titleClass: string;\n  }\n> = {\n  info: {\n    icon: Info,\n    iconBgClass: 'bg-blue-500',\n    iconClass: 'text-white',\n    titleClass: 'text-blue-600 dark:text-blue-400',\n  },\n  warning: {\n    icon: AlertTriangle,\n    iconBgClass: 'bg-amber-500',\n    iconClass: 'text-white',\n    titleClass: 'text-amber-600 dark:text-amber-400',\n  },\n  error: {\n    icon: X,\n    iconBgClass: 'bg-red-500',\n    iconClass: 'text-white',\n    titleClass: 'text-red-600 dark:text-red-400',\n  },\n  critical: {\n    icon: AlertCircle,\n    iconBgClass: 'bg-red-600',\n    iconClass: 'text-white',\n    titleClass: 'text-red-600 dark:text-red-400',\n  },\n};\n\n/**\n * ErrorDialog Component\n * エラーダイアログコンポーネント\n *\n * Modal dialog for important errors.\n * 重要なエラーをモーダルで表示します。\n *\n * ## AI/Automation Features\n * - `data-testid`: Container and action buttons\n * - `data-severity`: Error severity level\n *\n * @example With testId\n * ```tsx\n * <ErrorDialog\n *     testId=\"api-error\"\n *     error={error}\n *     open={isOpen}\n *     onClose={() => setIsOpen(false)}\n *     primaryActionLabel=\"再試行\"\n *     onPrimaryAction={handleRetry}\n * />\n * // Container: data-testid=\"api-error\"\n * // Primary button: data-testid=\"api-error-primary\"\n * ```\n */\nexport function ErrorDialog({\n  testId,\n  error: propError,\n  open: propOpen,\n  onClose,\n  primaryActionLabel,\n  onPrimaryAction,\n  secondaryActionLabel,\n  onSecondaryAction,\n}: ErrorDialogProps) {\n  const { removeError, getErrorsByMode } = useErrorStore();\n\n  // Store からダイアログモードのエラーを取得 (制御モードでない場合)\n  const dialogErrors = getErrorsByMode('dialog');\n  const storeError = dialogErrors.length > 0 ? dialogErrors[0] : null;\n\n  // 制御モードか Store モードかで表示するエラーを決定\n  const displayError = propError ?? storeError?.error ?? null;\n  const isOpen = propOpen ?? storeError !== null;\n\n  const handleClose = () => {\n    if (storeError) {\n      removeError(storeError.id);\n    }\n    onClose?.();\n  };\n\n  const handlePrimaryAction = () => {\n    onPrimaryAction?.();\n    handleClose();\n  };\n\n  const handleSecondaryAction = () => {\n    onSecondaryAction?.();\n    handleClose();\n  };\n\n  if (!displayError) {\n    return null;\n  }\n\n  const severity = displayError instanceof AppError ? displayError.severity : 'error';\n  const config = severityConfig[severity];\n  const Icon = config.icon;\n\n  return (\n    <Dialog open={isOpen} onOpenChange={(open) => !open && handleClose()}>\n      <DialogContent testId={testId} data-severity={severity} className='sm:max-w-md'>\n        <DialogHeader>\n          <div className='flex items-center gap-3'>\n            <div className={cn('rounded-full p-1.5', config.iconBgClass)}>\n              <Icon className={cn('h-4 w-4', config.iconClass)} aria-hidden='true' />\n            </div>\n            <DialogTitle className={config.titleClass}>\n              {m.errors_dialogTitle({ defaultValue: 'エラー' })}\n            </DialogTitle>\n          </div>\n        </DialogHeader>\n        <DialogDescription className='text-foreground'>{displayError.message}</DialogDescription>\n        {displayError instanceof AppError &&\n          displayError.code &&\n          displayError.code !== 'error/unknown' && (\n            <p className='text-xs text-muted-foreground mt-2'>\n              {m.errors_code({ defaultValue: 'コード' })}: {displayError.code}\n            </p>\n          )}\n        <DialogFooter className='gap-2 sm:gap-0'>\n          {secondaryActionLabel && (\n            <Button\n              testId={testId ? `${testId}-secondary` : undefined}\n              variant='outline'\n              onClick={handleSecondaryAction}\n            >\n              {secondaryActionLabel}\n            </Button>\n          )}\n          <Button testId={testId ? `${testId}-primary` : undefined} onClick={handlePrimaryAction}>\n            {primaryActionLabel ?? m.common_actions_ok({ defaultValue: 'OK' })}\n          </Button>\n        </DialogFooter>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"A,6oBA4CA,IAAM0B,EAQF,CACF,KAAM,CACJ,KAAM1B,EAAAA,KACN,YAAa,cACb,UAAW,aACX,WAAY,kCACd,EACA,QAAS,CACP,KAAMC,EAAAA,cACN,YAAa,eACb,UAAW,aACX,WAAY,oCACd,EACA,MAAO,CACL,KAAMC,EAAAA,EACN,YAAa,aACb,UAAW,aACX,WAAY,gCACd,EACA,SAAU,CACR,KAAMC,EAAAA,YACN,YAAa,aACb,UAAW,aACX,WAAY,gCACd,CACF,EA2BA,SAAgBwB,EAAY,CAC1B,SACA,MAAOC,EACP,KAAMC,EACN,UACA,qBACA,kBACA,uBACA,qBACmB,CACnB,GAAM,CAAE,cAAa,mBAAoBzB,EAAAA,cAAc,EAGjD0B,EAAeC,EAAgB,QAAQ,EACvCC,EAAaF,EAAa,OAAS,EAAIA,EAAa,GAAK,KAGzDG,EAAeL,GAAaI,GAAY,OAAS,KACjDE,EAASL,GAAYG,IAAe,KAEpCG,MAAoB,CACpBH,GACFI,EAAYJ,EAAW,EAAE,EAE3BK,IAAU,CACZ,EAEMC,MAA4B,CAChCC,IAAkB,EAClBJ,EAAY,CACd,EAEMK,MAA8B,CAClCC,IAAoB,EACpBN,EAAY,CACd,EAEA,GAAI,CAACF,EACH,OAAO,KAGT,IAAMS,EAAWT,aAAwB5B,EAAAA,SAAW4B,EAAa,SAAW,QACtEU,EAASjB,EAAegB,GACxBE,EAAOD,EAAO,KAEpB,OACE,EAAApB,EAAA,IAAA,CAACjB,EAAAA,OAAD,CAAQ,KAAM4B,EAAQ,aAAe,GAAS,CAACW,GAAQV,EAAY,EACjE,UAAA,EAAAZ,EAAA,KAAA,CAAChB,EAAAA,cAAD,CAAuB,SAAQ,gBAAemC,EAAU,UAAU,cAAlE,SAAA,EACE,EAAAnB,EAAA,IAAA,CAACf,EAAAA,aAAD,CAAA,UACE,EAAAe,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,0BAAf,SAAA,EACE,EAAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWd,EAAAA,GAAG,qBAAsBkC,EAAO,WAAW,EACzD,UAAA,EAAApB,EAAA,IAAA,CAACqB,EAAD,CAAM,UAAWnC,EAAAA,GAAG,UAAWkC,EAAO,SAAS,EAAG,cAAY,MAAQ,CAAA,CACnE,CAAA,GACL,EAAApB,EAAA,IAAA,CAACb,EAAAA,YAAD,CAAa,UAAWiC,EAAO,WAC5B,SAAAvB,EAAA,mBAAqB,CAAE,aAAc,KAAM,CAAC,CAClC,CAAA,CACV,CACO,CAAA,CAAA,CAAA,GACd,EAAAG,EAAA,IAAA,CAACZ,EAAAA,kBAAD,CAAmB,UAAU,kBAAmB,SAAAsB,EAAa,OAA2B,CAAA,EACvFA,aAAwB5B,EAAAA,UACvB4B,EAAa,MACbA,EAAa,OAAS,kBACpB,EAAAV,EAAA,KAAA,CAAC,IAAD,CAAG,UAAU,qCAAb,SAAA,CACiBJ,EAAA,YAAA,CAAE,aAAc,KAAM,CAAC,EAAE,KAAGc,EAAa,IACvD,C,IAEP,EAAAV,EAAA,KAAA,CAACX,EAAAA,aAAD,CAAc,UAAU,iBAAxB,SAAA,CACGkC,IACC,EAAAvB,EAAA,IAAA,CAACV,EAAAA,OAAD,CACE,OAAQkC,EAAS,GAAGA,EAAO,YAAc,IAAA,GACzC,QAAQ,UACR,QAASP,EAER,SAAAM,CACK,CAAA,GAEV,EAAAvB,EAAA,IAAA,CAACV,EAAAA,OAAD,CAAQ,OAAQkC,EAAS,GAAGA,EAAO,UAAY,IAAA,GAAW,QAAST,EAChE,SAAAU,GAAA9B,EAAA,kBAA0C,CAAE,aAAc,IAAK,CAAC,CAC3D,CAAA,CACI,C,EACD,C,EACT,CAAA,CAEZ,C"}
+{"version":3,"file":"ErrorDialog.cjs","names":["Info","AlertTriangle","X","AlertCircle","useErrorStore","AppError","Dialog","DialogContent","DialogHeader","cn","DialogTitle","DialogDescription","DialogFooter","Button","require_runtime","require_ui_lib_utils","require_ui_components_ui_button_components","require_ui_components_ui_dialog","require_common_actions_ok","require_errors_code","require_errors_dialogtitle1","require_tools_lib_error_AppError","require_tools_lib_state_error_store","react_jsx_runtime","react","lucide_react","severityConfig","ErrorDialog","propError","propOpen","dialogErrors","getErrorsByMode","storeError","displayError","isOpen","handleClose","removeError","onClose","handlePrimaryAction","onPrimaryAction","handleSecondaryAction","onSecondaryAction","severity","config","Icon","open","secondaryActionLabel","testId","primaryActionLabel"],"sources":["../../../../src/tools/components/error/ErrorDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { AlertCircle, X, AlertTriangle, Info } from 'lucide-react';\nimport * as m from '../../paraglide/messages.js';\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n} from '../ui/dialog';\nimport { Button } from '../ui/button';\nimport { cn } from \"../../lib/utils\";\nimport { AppError, ErrorSeverity } from \"../../lib/error\";\nimport { useErrorStore } from \"../../lib/state/error-store\";\n\n/**\n * ErrorDialogProps\n * エラーダイアログのプロップス\n *\n * ## AI/Automation Features\n * - `testId`: Stable selector on dialog and buttons\n * - Pattern: `{testId}`, `{testId}-primary`, `{testId}-secondary`\n * - `data-severity`: error, warning, info, critical\n */\nexport interface ErrorDialogProps {\n  /** AI/E2E Test用の安定ID / Stable test identifier */\n  testId?: string;\n  /** 直接表示するエラー (制御モード) */\n  error?: AppError | null;\n  /** 開閉状態 (制御モード) */\n  open?: boolean;\n  /** 閉じるときのコールバック */\n  onClose?: () => void;\n  /** 主要アクションのラベル。デフォルト: 'OK' */\n  primaryActionLabel?: string;\n  /** 主要アクションのコールバック */\n  onPrimaryAction?: () => void;\n  /** セカンダリアクションのラベル */\n  secondaryActionLabel?: string;\n  /** セカンダリアクションのコールバック */\n  onSecondaryAction?: () => void;\n}\n\nconst severityConfig: Record<\n  ErrorSeverity,\n  {\n    icon: React.ElementType;\n    iconBgClass: string;\n    iconClass: string;\n    titleClass: string;\n  }\n> = {\n  info: {\n    icon: Info,\n    iconBgClass: 'bg-blue-500',\n    iconClass: 'text-white',\n    titleClass: 'text-blue-600 dark:text-blue-400',\n  },\n  warning: {\n    icon: AlertTriangle,\n    iconBgClass: 'bg-amber-500',\n    iconClass: 'text-white',\n    titleClass: 'text-amber-800 dark:text-amber-400',\n  },\n  error: {\n    icon: X,\n    iconBgClass: 'bg-red-500',\n    iconClass: 'text-white',\n    titleClass: 'text-red-600 dark:text-red-400',\n  },\n  critical: {\n    icon: AlertCircle,\n    iconBgClass: 'bg-red-600',\n    iconClass: 'text-white',\n    titleClass: 'text-red-600 dark:text-red-400',\n  },\n};\n\n/**\n * ErrorDialog Component\n * エラーダイアログコンポーネント\n *\n * Modal dialog for important errors.\n * 重要なエラーをモーダルで表示します。\n *\n * ## AI/Automation Features\n * - `data-testid`: Container and action buttons\n * - `data-severity`: Error severity level\n *\n * @example With testId\n * ```tsx\n * <ErrorDialog\n *     testId=\"api-error\"\n *     error={error}\n *     open={isOpen}\n *     onClose={() => setIsOpen(false)}\n *     primaryActionLabel=\"再試行\"\n *     onPrimaryAction={handleRetry}\n * />\n * // Container: data-testid=\"api-error\"\n * // Primary button: data-testid=\"api-error-primary\"\n * ```\n */\nexport function ErrorDialog({\n  testId,\n  error: propError,\n  open: propOpen,\n  onClose,\n  primaryActionLabel,\n  onPrimaryAction,\n  secondaryActionLabel,\n  onSecondaryAction,\n}: ErrorDialogProps) {\n  const { removeError, getErrorsByMode } = useErrorStore();\n\n  // Store からダイアログモードのエラーを取得 (制御モードでない場合)\n  const dialogErrors = getErrorsByMode('dialog');\n  const storeError = dialogErrors.length > 0 ? dialogErrors[0] : null;\n\n  // 制御モードか Store モードかで表示するエラーを決定\n  const displayError = propError ?? storeError?.error ?? null;\n  const isOpen = propOpen ?? storeError !== null;\n\n  const handleClose = () => {\n    if (storeError) {\n      removeError(storeError.id);\n    }\n    onClose?.();\n  };\n\n  const handlePrimaryAction = () => {\n    onPrimaryAction?.();\n    handleClose();\n  };\n\n  const handleSecondaryAction = () => {\n    onSecondaryAction?.();\n    handleClose();\n  };\n\n  if (!displayError) {\n    return null;\n  }\n\n  const severity = displayError instanceof AppError ? displayError.severity : 'error';\n  const config = severityConfig[severity];\n  const Icon = config.icon;\n\n  return (\n    <Dialog open={isOpen} onOpenChange={(open) => !open && handleClose()}>\n      <DialogContent testId={testId} data-severity={severity} className='sm:max-w-md'>\n        <DialogHeader>\n          <div className='flex items-center gap-3'>\n            <div className={cn('rounded-full p-1.5', config.iconBgClass)}>\n              <Icon className={cn('h-4 w-4', config.iconClass)} aria-hidden='true' />\n            </div>\n            <DialogTitle className={config.titleClass}>\n              {m.errors_dialogTitle({ defaultValue: 'エラー' })}\n            </DialogTitle>\n          </div>\n        </DialogHeader>\n        <DialogDescription className='text-foreground'>{displayError.message}</DialogDescription>\n        {displayError instanceof AppError &&\n          displayError.code &&\n          displayError.code !== 'error/unknown' && (\n            <p className='text-xs text-muted-foreground mt-2'>\n              {m.errors_code({ defaultValue: 'コード' })}: {displayError.code}\n            </p>\n          )}\n        <DialogFooter className='gap-2 sm:gap-0'>\n          {secondaryActionLabel && (\n            <Button\n              testId={testId ? `${testId}-secondary` : undefined}\n              variant='outline'\n              onClick={handleSecondaryAction}\n            >\n              {secondaryActionLabel}\n            </Button>\n          )}\n          <Button testId={testId ? `${testId}-primary` : undefined} onClick={handlePrimaryAction}>\n            {primaryActionLabel ?? m.common_actions_ok({ defaultValue: 'OK' })}\n          </Button>\n        </DialogFooter>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"A,6oBA4CA,IAAM0B,EAQF,CACF,KAAM,CACJ,KAAM1B,EAAAA,KACN,YAAa,cACb,UAAW,aACX,WAAY,kCACd,EACA,QAAS,CACP,KAAMC,EAAAA,cACN,YAAa,eACb,UAAW,aACX,WAAY,oCACd,EACA,MAAO,CACL,KAAMC,EAAAA,EACN,YAAa,aACb,UAAW,aACX,WAAY,gCACd,EACA,SAAU,CACR,KAAMC,EAAAA,YACN,YAAa,aACb,UAAW,aACX,WAAY,gCACd,CACF,EA2BA,SAAgBwB,EAAY,CAC1B,SACA,MAAOC,EACP,KAAMC,EACN,UACA,qBACA,kBACA,uBACA,qBACmB,CACnB,GAAM,CAAE,cAAa,mBAAoBzB,EAAAA,cAAc,EAGjD0B,EAAeC,EAAgB,QAAQ,EACvCC,EAAaF,EAAa,OAAS,EAAIA,EAAa,GAAK,KAGzDG,EAAeL,GAAaI,GAAY,OAAS,KACjDE,EAASL,GAAYG,IAAe,KAEpCG,MAAoB,CACpBH,GACFI,EAAYJ,EAAW,EAAE,EAE3BK,IAAU,CACZ,EAEMC,MAA4B,CAChCC,IAAkB,EAClBJ,EAAY,CACd,EAEMK,MAA8B,CAClCC,IAAoB,EACpBN,EAAY,CACd,EAEA,GAAI,CAACF,EACH,OAAO,KAGT,IAAMS,EAAWT,aAAwB5B,EAAAA,SAAW4B,EAAa,SAAW,QACtEU,EAASjB,EAAegB,GACxBE,EAAOD,EAAO,KAEpB,OACE,EAAApB,EAAA,IAAA,CAACjB,EAAAA,OAAD,CAAQ,KAAM4B,EAAQ,aAAe,GAAS,CAACW,GAAQV,EAAY,EACjE,UAAA,EAAAZ,EAAA,KAAA,CAAChB,EAAAA,cAAD,CAAuB,SAAQ,gBAAemC,EAAU,UAAU,cAAlE,SAAA,EACE,EAAAnB,EAAA,IAAA,CAACf,EAAAA,aAAD,CAAA,UACE,EAAAe,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,0BAAf,SAAA,EACE,EAAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWd,EAAAA,GAAG,qBAAsBkC,EAAO,WAAW,EACzD,UAAA,EAAApB,EAAA,IAAA,CAACqB,EAAD,CAAM,UAAWnC,EAAAA,GAAG,UAAWkC,EAAO,SAAS,EAAG,cAAY,MAAQ,CAAA,CACnE,CAAA,GACL,EAAApB,EAAA,IAAA,CAACb,EAAAA,YAAD,CAAa,UAAWiC,EAAO,WAC5B,SAAAvB,EAAA,mBAAqB,CAAE,aAAc,KAAM,CAAC,CAClC,CAAA,CACV,CACO,CAAA,CAAA,CAAA,GACd,EAAAG,EAAA,IAAA,CAACZ,EAAAA,kBAAD,CAAmB,UAAU,kBAAmB,SAAAsB,EAAa,OAA2B,CAAA,EACvFA,aAAwB5B,EAAAA,UACvB4B,EAAa,MACbA,EAAa,OAAS,kBACpB,EAAAV,EAAA,KAAA,CAAC,IAAD,CAAG,UAAU,qCAAb,SAAA,CACiBJ,EAAA,YAAA,CAAE,aAAc,KAAM,CAAC,EAAE,KAAGc,EAAa,IACvD,C,IAEP,EAAAV,EAAA,KAAA,CAACX,EAAAA,aAAD,CAAc,UAAU,iBAAxB,SAAA,CACGkC,IACC,EAAAvB,EAAA,IAAA,CAACV,EAAAA,OAAD,CACE,OAAQkC,EAAS,GAAGA,EAAO,YAAc,IAAA,GACzC,QAAQ,UACR,QAASP,EAER,SAAAM,CACK,CAAA,GAEV,EAAAvB,EAAA,IAAA,CAACV,EAAAA,OAAD,CAAQ,OAAQkC,EAAS,GAAGA,EAAO,UAAY,IAAA,GAAW,QAAST,EAChE,SAAAU,GAAA9B,EAAA,kBAA0C,CAAE,aAAc,IAAK,CAAC,CAC3D,CAAA,CACI,C,EACD,C,EACT,CAAA,CAEZ,C"}

package/dist/tools/components/error/ErrorDialog.js

@@ -22,7 +22,7 @@ var y = {
 		icon: g,
 		iconBgClass: "bg-amber-500",
 		iconClass: "text-white",
-		titleClass: "text-amber-600 dark:text-amber-400"
+		titleClass: "text-amber-800 dark:text-amber-400"
 	},
 	error: {
 		icon: v,

package/dist/tools/components/error/ErrorDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorDialog.js","names":["m.errors_dialogTitle","m.errors_code","m.common_actions_ok","errors_dialogtitle1","severityConfig","Info","AlertTriangle","X","AlertCircle","ErrorDialog","propError","propOpen","useErrorStore","dialogErrors","getErrorsByMode","storeError","displayError","isOpen","handleClose","removeError","onClose","handlePrimaryAction","onPrimaryAction","handleSecondaryAction","onSecondaryAction","severity","AppError","config","Icon","Dialog","open","DialogContent","DialogHeader","cn","DialogTitle","DialogDescription","errors_code","DialogFooter","secondaryActionLabel","Button","testId","primaryActionLabel","common_actions_ok"],"sources":["../../../../src/tools/components/error/ErrorDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { AlertCircle, X, AlertTriangle, Info } from 'lucide-react';\nimport * as m from '../../paraglide/messages.js';\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n} from '../ui/dialog';\nimport { Button } from '../ui/button';\nimport { cn } from \"../../lib/utils\";\nimport { AppError, ErrorSeverity } from \"../../lib/error\";\nimport { useErrorStore } from \"../../lib/state/error-store\";\n\n/**\n * ErrorDialogProps\n * エラーダイアログのプロップス\n *\n * ## AI/Automation Features\n * - `testId`: Stable selector on dialog and buttons\n * - Pattern: `{testId}`, `{testId}-primary`, `{testId}-secondary`\n * - `data-severity`: error, warning, info, critical\n */\nexport interface ErrorDialogProps {\n  /** AI/E2E Test用の安定ID / Stable test identifier */\n  testId?: string;\n  /** 直接表示するエラー (制御モード) */\n  error?: AppError | null;\n  /** 開閉状態 (制御モード) */\n  open?: boolean;\n  /** 閉じるときのコールバック */\n  onClose?: () => void;\n  /** 主要アクションのラベル。デフォルト: 'OK' */\n  primaryActionLabel?: string;\n  /** 主要アクションのコールバック */\n  onPrimaryAction?: () => void;\n  /** セカンダリアクションのラベル */\n  secondaryActionLabel?: string;\n  /** セカンダリアクションのコールバック */\n  onSecondaryAction?: () => void;\n}\n\nconst severityConfig: Record<\n  ErrorSeverity,\n  {\n    icon: React.ElementType;\n    iconBgClass: string;\n    iconClass: string;\n    titleClass: string;\n  }\n> = {\n  info: {\n    icon: Info,\n    iconBgClass: 'bg-blue-500',\n    iconClass: 'text-white',\n    titleClass: 'text-blue-600 dark:text-blue-400',\n  },\n  warning: {\n    icon: AlertTriangle,\n    iconBgClass: 'bg-amber-500',\n    iconClass: 'text-white',\n    titleClass: 'text-amber-600 dark:text-amber-400',\n  },\n  error: {\n    icon: X,\n    iconBgClass: 'bg-red-500',\n    iconClass: 'text-white',\n    titleClass: 'text-red-600 dark:text-red-400',\n  },\n  critical: {\n    icon: AlertCircle,\n    iconBgClass: 'bg-red-600',\n    iconClass: 'text-white',\n    titleClass: 'text-red-600 dark:text-red-400',\n  },\n};\n\n/**\n * ErrorDialog Component\n * エラーダイアログコンポーネント\n *\n * Modal dialog for important errors.\n * 重要なエラーをモーダルで表示します。\n *\n * ## AI/Automation Features\n * - `data-testid`: Container and action buttons\n * - `data-severity`: Error severity level\n *\n * @example With testId\n * ```tsx\n * <ErrorDialog\n *     testId=\"api-error\"\n *     error={error}\n *     open={isOpen}\n *     onClose={() => setIsOpen(false)}\n *     primaryActionLabel=\"再試行\"\n *     onPrimaryAction={handleRetry}\n * />\n * // Container: data-testid=\"api-error\"\n * // Primary button: data-testid=\"api-error-primary\"\n * ```\n */\nexport function ErrorDialog({\n  testId,\n  error: propError,\n  open: propOpen,\n  onClose,\n  primaryActionLabel,\n  onPrimaryAction,\n  secondaryActionLabel,\n  onSecondaryAction,\n}: ErrorDialogProps) {\n  const { removeError, getErrorsByMode } = useErrorStore();\n\n  // Store からダイアログモードのエラーを取得 (制御モードでない場合)\n  const dialogErrors = getErrorsByMode('dialog');\n  const storeError = dialogErrors.length > 0 ? dialogErrors[0] : null;\n\n  // 制御モードか Store モードかで表示するエラーを決定\n  const displayError = propError ?? storeError?.error ?? null;\n  const isOpen = propOpen ?? storeError !== null;\n\n  const handleClose = () => {\n    if (storeError) {\n      removeError(storeError.id);\n    }\n    onClose?.();\n  };\n\n  const handlePrimaryAction = () => {\n    onPrimaryAction?.();\n    handleClose();\n  };\n\n  const handleSecondaryAction = () => {\n    onSecondaryAction?.();\n    handleClose();\n  };\n\n  if (!displayError) {\n    return null;\n  }\n\n  const severity = displayError instanceof AppError ? displayError.severity : 'error';\n  const config = severityConfig[severity];\n  const Icon = config.icon;\n\n  return (\n    <Dialog open={isOpen} onOpenChange={(open) => !open && handleClose()}>\n      <DialogContent testId={testId} data-severity={severity} className='sm:max-w-md'>\n        <DialogHeader>\n          <div className='flex items-center gap-3'>\n            <div className={cn('rounded-full p-1.5', config.iconBgClass)}>\n              <Icon className={cn('h-4 w-4', config.iconClass)} aria-hidden='true' />\n            </div>\n            <DialogTitle className={config.titleClass}>\n              {m.errors_dialogTitle({ defaultValue: 'エラー' })}\n            </DialogTitle>\n          </div>\n        </DialogHeader>\n        <DialogDescription className='text-foreground'>{displayError.message}</DialogDescription>\n        {displayError instanceof AppError &&\n          displayError.code &&\n          displayError.code !== 'error/unknown' && (\n            <p className='text-xs text-muted-foreground mt-2'>\n              {m.errors_code({ defaultValue: 'コード' })}: {displayError.code}\n            </p>\n          )}\n        <DialogFooter className='gap-2 sm:gap-0'>\n          {secondaryActionLabel && (\n            <Button\n              testId={testId ? `${testId}-secondary` : undefined}\n              variant='outline'\n              onClick={handleSecondaryAction}\n            >\n              {secondaryActionLabel}\n            </Button>\n          )}\n          <Button testId={testId ? `${testId}-primary` : undefined} onClick={handlePrimaryAction}>\n            {primaryActionLabel ?? m.common_actions_ok({ defaultValue: 'OK' })}\n          </Button>\n        </DialogFooter>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;AA4CA,IAAMI,IAQF;CACF,MAAM;EACJ,MAAMC;EACN,aAAa;EACb,WAAW;EACX,YAAY;CACd;CACA,SAAS;EACP,MAAMC;EACN,aAAa;EACb,WAAW;EACX,YAAY;CACd;CACA,OAAO;EACL,MAAMC;EACN,aAAa;EACb,WAAW;EACX,YAAY;CACd;CACA,UAAU;EACR,MAAMC;EACN,aAAa;EACb,WAAW;EACX,YAAY;CACd;AACF;AA2BA,SAAgBC,EAAY,EAC1B,WACA,OAAOC,GACP,MAAMC,GACN,YACA,uBACA,oBACA,yBACA,wBACmB;CACnB,IAAM,EAAE,gBAAa,uBAAoBC,EAAc,GAGjDC,IAAeC,EAAgB,QAAQ,GACvCC,IAAaF,EAAa,SAAS,IAAIA,EAAa,KAAK,MAGzDG,IAAeN,KAAaK,GAAY,SAAS,MACjDE,IAASN,KAAYI,MAAe,MAEpCG,UAAoB;EAIxB,AAHIH,KACFI,EAAYJ,EAAW,EAAE,GAE3BK,IAAU;CACZ,GAEMC,UAA4B;EAEhC,AADAC,IAAkB,GAClBJ,EAAY;CACd,GAEMK,UAA8B;EAElC,AADAC,IAAoB,GACpBN,EAAY;CACd;CAEA,IAAI,CAACF,GACH,OAAO;CAGT,IAAMS,IAAWT,aAAwBU,IAAWV,EAAa,WAAW,SACtEW,IAASvB,EAAeqB,IACxBG,IAAOD,EAAO;CAEpB,OACE,kBAACE,GAAD;EAAQ,MAAMZ;EAAQ,eAAe,MAAS,CAACa,KAAQZ,EAAY;EACjE,UAAA,kBAACa,GAAD;GAAuB;GAAQ,iBAAeN;GAAU,WAAU;GAAlE,UAAA;IACE,kBAACO,GAAD,EAAA,UACE,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACE,kBAAC,OAAD;MAAK,WAAWC,EAAG,sBAAsBN,EAAO,WAAW;MACzD,UAAA,kBAACC,GAAD;OAAM,WAAWK,EAAG,WAAWN,EAAO,SAAS;OAAG,eAAY;MAAQ,CAAA;KACnE,CAAA,GACL,kBAACO,GAAD;MAAa,WAAWP,EAAO;MAC5B,UAAA3B,EAAqB,EAAE,cAAc,MAAM,CAAC;KAClC,CAAA,CACV;IACO,CAAA,EAAA,CAAA;IACd,kBAACmC,GAAD;KAAmB,WAAU;KAAmB,UAAAnB,EAAa;IAA2B,CAAA;IACvFA,aAAwBU,KACvBV,EAAa,QACbA,EAAa,SAAS,mBACpB,kBAAC,KAAD;KAAG,WAAU;KAAb,UAAA;MACGf,EAAc,EAAE,cAAc,MAAM,CAAC;MAAE;MAAGe,EAAa;KACvD;;IAEP,kBAACqB,GAAD;KAAc,WAAU;KAAxB,UAAA,CACGC,KACC,kBAACC,GAAD;MACE,QAAQC,IAAS,GAAGA,EAAO,cAAc,KAAA;MACzC,SAAQ;MACR,SAASjB;MAER,UAAAe;KACK,CAAA,GAEV,kBAACC,GAAD;MAAQ,QAAQC,IAAS,GAAGA,EAAO,YAAY,KAAA;MAAW,SAASnB;MAChE,UAAAoB,KAAsBvC,EAAoB,EAAE,cAAc,KAAK,CAAC;KAC3D,CAAA,CACI;;GACD;;CACT,CAAA;AAEZ"}
+{"version":3,"file":"ErrorDialog.js","names":["m.errors_dialogTitle","m.errors_code","m.common_actions_ok","errors_dialogtitle1","severityConfig","Info","AlertTriangle","X","AlertCircle","ErrorDialog","propError","propOpen","useErrorStore","dialogErrors","getErrorsByMode","storeError","displayError","isOpen","handleClose","removeError","onClose","handlePrimaryAction","onPrimaryAction","handleSecondaryAction","onSecondaryAction","severity","AppError","config","Icon","Dialog","open","DialogContent","DialogHeader","cn","DialogTitle","DialogDescription","errors_code","DialogFooter","secondaryActionLabel","Button","testId","primaryActionLabel","common_actions_ok"],"sources":["../../../../src/tools/components/error/ErrorDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { AlertCircle, X, AlertTriangle, Info } from 'lucide-react';\nimport * as m from '../../paraglide/messages.js';\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n} from '../ui/dialog';\nimport { Button } from '../ui/button';\nimport { cn } from \"../../lib/utils\";\nimport { AppError, ErrorSeverity } from \"../../lib/error\";\nimport { useErrorStore } from \"../../lib/state/error-store\";\n\n/**\n * ErrorDialogProps\n * エラーダイアログのプロップス\n *\n * ## AI/Automation Features\n * - `testId`: Stable selector on dialog and buttons\n * - Pattern: `{testId}`, `{testId}-primary`, `{testId}-secondary`\n * - `data-severity`: error, warning, info, critical\n */\nexport interface ErrorDialogProps {\n  /** AI/E2E Test用の安定ID / Stable test identifier */\n  testId?: string;\n  /** 直接表示するエラー (制御モード) */\n  error?: AppError | null;\n  /** 開閉状態 (制御モード) */\n  open?: boolean;\n  /** 閉じるときのコールバック */\n  onClose?: () => void;\n  /** 主要アクションのラベル。デフォルト: 'OK' */\n  primaryActionLabel?: string;\n  /** 主要アクションのコールバック */\n  onPrimaryAction?: () => void;\n  /** セカンダリアクションのラベル */\n  secondaryActionLabel?: string;\n  /** セカンダリアクションのコールバック */\n  onSecondaryAction?: () => void;\n}\n\nconst severityConfig: Record<\n  ErrorSeverity,\n  {\n    icon: React.ElementType;\n    iconBgClass: string;\n    iconClass: string;\n    titleClass: string;\n  }\n> = {\n  info: {\n    icon: Info,\n    iconBgClass: 'bg-blue-500',\n    iconClass: 'text-white',\n    titleClass: 'text-blue-600 dark:text-blue-400',\n  },\n  warning: {\n    icon: AlertTriangle,\n    iconBgClass: 'bg-amber-500',\n    iconClass: 'text-white',\n    titleClass: 'text-amber-800 dark:text-amber-400',\n  },\n  error: {\n    icon: X,\n    iconBgClass: 'bg-red-500',\n    iconClass: 'text-white',\n    titleClass: 'text-red-600 dark:text-red-400',\n  },\n  critical: {\n    icon: AlertCircle,\n    iconBgClass: 'bg-red-600',\n    iconClass: 'text-white',\n    titleClass: 'text-red-600 dark:text-red-400',\n  },\n};\n\n/**\n * ErrorDialog Component\n * エラーダイアログコンポーネント\n *\n * Modal dialog for important errors.\n * 重要なエラーをモーダルで表示します。\n *\n * ## AI/Automation Features\n * - `data-testid`: Container and action buttons\n * - `data-severity`: Error severity level\n *\n * @example With testId\n * ```tsx\n * <ErrorDialog\n *     testId=\"api-error\"\n *     error={error}\n *     open={isOpen}\n *     onClose={() => setIsOpen(false)}\n *     primaryActionLabel=\"再試行\"\n *     onPrimaryAction={handleRetry}\n * />\n * // Container: data-testid=\"api-error\"\n * // Primary button: data-testid=\"api-error-primary\"\n * ```\n */\nexport function ErrorDialog({\n  testId,\n  error: propError,\n  open: propOpen,\n  onClose,\n  primaryActionLabel,\n  onPrimaryAction,\n  secondaryActionLabel,\n  onSecondaryAction,\n}: ErrorDialogProps) {\n  const { removeError, getErrorsByMode } = useErrorStore();\n\n  // Store からダイアログモードのエラーを取得 (制御モードでない場合)\n  const dialogErrors = getErrorsByMode('dialog');\n  const storeError = dialogErrors.length > 0 ? dialogErrors[0] : null;\n\n  // 制御モードか Store モードかで表示するエラーを決定\n  const displayError = propError ?? storeError?.error ?? null;\n  const isOpen = propOpen ?? storeError !== null;\n\n  const handleClose = () => {\n    if (storeError) {\n      removeError(storeError.id);\n    }\n    onClose?.();\n  };\n\n  const handlePrimaryAction = () => {\n    onPrimaryAction?.();\n    handleClose();\n  };\n\n  const handleSecondaryAction = () => {\n    onSecondaryAction?.();\n    handleClose();\n  };\n\n  if (!displayError) {\n    return null;\n  }\n\n  const severity = displayError instanceof AppError ? displayError.severity : 'error';\n  const config = severityConfig[severity];\n  const Icon = config.icon;\n\n  return (\n    <Dialog open={isOpen} onOpenChange={(open) => !open && handleClose()}>\n      <DialogContent testId={testId} data-severity={severity} className='sm:max-w-md'>\n        <DialogHeader>\n          <div className='flex items-center gap-3'>\n            <div className={cn('rounded-full p-1.5', config.iconBgClass)}>\n              <Icon className={cn('h-4 w-4', config.iconClass)} aria-hidden='true' />\n            </div>\n            <DialogTitle className={config.titleClass}>\n              {m.errors_dialogTitle({ defaultValue: 'エラー' })}\n            </DialogTitle>\n          </div>\n        </DialogHeader>\n        <DialogDescription className='text-foreground'>{displayError.message}</DialogDescription>\n        {displayError instanceof AppError &&\n          displayError.code &&\n          displayError.code !== 'error/unknown' && (\n            <p className='text-xs text-muted-foreground mt-2'>\n              {m.errors_code({ defaultValue: 'コード' })}: {displayError.code}\n            </p>\n          )}\n        <DialogFooter className='gap-2 sm:gap-0'>\n          {secondaryActionLabel && (\n            <Button\n              testId={testId ? `${testId}-secondary` : undefined}\n              variant='outline'\n              onClick={handleSecondaryAction}\n            >\n              {secondaryActionLabel}\n            </Button>\n          )}\n          <Button testId={testId ? `${testId}-primary` : undefined} onClick={handlePrimaryAction}>\n            {primaryActionLabel ?? m.common_actions_ok({ defaultValue: 'OK' })}\n          </Button>\n        </DialogFooter>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;AA4CA,IAAMI,IAQF;CACF,MAAM;EACJ,MAAMC;EACN,aAAa;EACb,WAAW;EACX,YAAY;CACd;CACA,SAAS;EACP,MAAMC;EACN,aAAa;EACb,WAAW;EACX,YAAY;CACd;CACA,OAAO;EACL,MAAMC;EACN,aAAa;EACb,WAAW;EACX,YAAY;CACd;CACA,UAAU;EACR,MAAMC;EACN,aAAa;EACb,WAAW;EACX,YAAY;CACd;AACF;AA2BA,SAAgBC,EAAY,EAC1B,WACA,OAAOC,GACP,MAAMC,GACN,YACA,uBACA,oBACA,yBACA,wBACmB;CACnB,IAAM,EAAE,gBAAa,uBAAoBC,EAAc,GAGjDC,IAAeC,EAAgB,QAAQ,GACvCC,IAAaF,EAAa,SAAS,IAAIA,EAAa,KAAK,MAGzDG,IAAeN,KAAaK,GAAY,SAAS,MACjDE,IAASN,KAAYI,MAAe,MAEpCG,UAAoB;EAIxB,AAHIH,KACFI,EAAYJ,EAAW,EAAE,GAE3BK,IAAU;CACZ,GAEMC,UAA4B;EAEhC,AADAC,IAAkB,GAClBJ,EAAY;CACd,GAEMK,UAA8B;EAElC,AADAC,IAAoB,GACpBN,EAAY;CACd;CAEA,IAAI,CAACF,GACH,OAAO;CAGT,IAAMS,IAAWT,aAAwBU,IAAWV,EAAa,WAAW,SACtEW,IAASvB,EAAeqB,IACxBG,IAAOD,EAAO;CAEpB,OACE,kBAACE,GAAD;EAAQ,MAAMZ;EAAQ,eAAe,MAAS,CAACa,KAAQZ,EAAY;EACjE,UAAA,kBAACa,GAAD;GAAuB;GAAQ,iBAAeN;GAAU,WAAU;GAAlE,UAAA;IACE,kBAACO,GAAD,EAAA,UACE,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACE,kBAAC,OAAD;MAAK,WAAWC,EAAG,sBAAsBN,EAAO,WAAW;MACzD,UAAA,kBAACC,GAAD;OAAM,WAAWK,EAAG,WAAWN,EAAO,SAAS;OAAG,eAAY;MAAQ,CAAA;KACnE,CAAA,GACL,kBAACO,GAAD;MAAa,WAAWP,EAAO;MAC5B,UAAA3B,EAAqB,EAAE,cAAc,MAAM,CAAC;KAClC,CAAA,CACV;IACO,CAAA,EAAA,CAAA;IACd,kBAACmC,GAAD;KAAmB,WAAU;KAAmB,UAAAnB,EAAa;IAA2B,CAAA;IACvFA,aAAwBU,KACvBV,EAAa,QACbA,EAAa,SAAS,mBACpB,kBAAC,KAAD;KAAG,WAAU;KAAb,UAAA;MACGf,EAAc,EAAE,cAAc,MAAM,CAAC;MAAE;MAAGe,EAAa;KACvD;;IAEP,kBAACqB,GAAD;KAAc,WAAU;KAAxB,UAAA,CACGC,KACC,kBAACC,GAAD;MACE,QAAQC,IAAS,GAAGA,EAAO,cAAc,KAAA;MACzC,SAAQ;MACR,SAASjB;MAER,UAAAe;KACK,CAAA,GAEV,kBAACC,GAAD;MAAQ,QAAQC,IAAS,GAAGA,EAAO,YAAY,KAAA;MAAW,SAASnB;MAChE,UAAAoB,KAAsBvC,EAAoB,EAAE,cAAc,KAAK,CAAC;KAC3D,CAAA,CACI;;GACD;;CACT,CAAA;AAEZ"}

package/dist/tools/components/error/ErrorInline.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("../../lib/error/AppError.cjs");let r=require("react/jsx-runtime"),i=require("react");i=e.__toESM(i,1);let a=require("lucide-react");var o={info:{icon:a.Info,className:`text-blue-600 dark:text-blue-400`},warning:{icon:a.AlertTriangle,className:`text-amber-600 dark:text-amber-400`},error:{icon:a.XCircle,className:`text-destructive`},critical:{icon:a.AlertCircle,className:`text-destructive`}};function s({testId:e,error:i,code:a,message:s,className:c,severity:l=`error`,hideIcon:u=!1}){let d=null,f=l;if(i?i instanceof n.AppError?(d=i.message,f=i.severity):d=i.message:a?d=a:s&&(d=s),!d)return null;let p=o[f],m=p.icon;return(0,r.jsxs)(`div`,{"data-testid":e,"data-severity":f,className:t.cn(`flex items-center gap-2 text-sm`,p.className,c),role:`alert`,children:[!u&&(0,r.jsx)(m,{className:`h-4 w-4 flex-shrink-0`,"aria-hidden":`true`}),(0,r.jsx)(`span`,{children:d})]})}exports.ErrorInline=s;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../ui/lib/utils.cjs"),n=require("../../lib/error/AppError.cjs");let r=require("react/jsx-runtime"),i=require("react");i=e.__toESM(i,1);let a=require("lucide-react");var o={info:{icon:a.Info,className:`text-blue-600 dark:text-blue-400`},warning:{icon:a.AlertTriangle,className:`text-amber-800 dark:text-amber-400`},error:{icon:a.XCircle,className:`text-destructive`},critical:{icon:a.AlertCircle,className:`text-destructive`}};function s({testId:e,error:i,code:a,message:s,className:c,severity:l=`error`,hideIcon:u=!1}){let d=null,f=l;if(i?i instanceof n.AppError?(d=i.message,f=i.severity):d=i.message:a?d=a:s&&(d=s),!d)return null;let p=o[f],m=p.icon;return(0,r.jsxs)(`div`,{"data-testid":e,"data-severity":f,className:t.cn(`flex items-center gap-2 text-sm`,p.className,c),role:`alert`,children:[!u&&(0,r.jsx)(m,{className:`h-4 w-4 flex-shrink-0`,"aria-hidden":`true`}),(0,r.jsx)(`span`,{children:d})]})}exports.ErrorInline=s;
 //# sourceMappingURL=ErrorInline.cjs.map

package/dist/tools/components/error/ErrorInline.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorInline.cjs","names":["Info","AlertTriangle","XCircle","AlertCircle","AppError","cn","require_runtime","require_ui_lib_utils","require_tools_lib_error_AppError","react_jsx_runtime","react","lucide_react","severityConfig","ErrorInline","displayMessage","displaySeverity","severity","error","code","message","config","Icon","testId","className","hideIcon"],"sources":["../../../../src/tools/components/error/ErrorInline.tsx"],"sourcesContent":["import React from 'react';\nimport { AlertCircle, XCircle, AlertTriangle, Info } from 'lucide-react';\nimport { cn } from \"../../lib/utils\";\nimport { AppError, ErrorSeverity } from \"../../lib/error\";\n\n/**\n * ErrorInlineProps\n * インラインエラーのプロップス\n *\n * ## AI/Automation Features\n * - `testId`: Stable selector on container\n * - `data-severity`: error, warning, info, critical\n */\nexport interface ErrorInlineProps {\n  /** AI/E2E Test用の安定ID / Stable test identifier */\n  testId?: string;\n  /** 表示するエラー */\n  error?: AppError | Error | null;\n  /** またはエラーコード (i18n から取得) */\n  code?: string;\n  /** エラーメッセージ (直接指定する場合) */\n  message?: string;\n  /** 追加の CSS クラス */\n  className?: string;\n  /** 重要度 (アイコンと色を決定) */\n  severity?: ErrorSeverity;\n  /** アイコンを非表示にする */\n  hideIcon?: boolean;\n}\n\nconst severityConfig: Record<ErrorSeverity, { icon: React.ElementType; className: string }> = {\n  info: { icon: Info, className: 'text-blue-600 dark:text-blue-400' },\n  warning: { icon: AlertTriangle, className: 'text-amber-600 dark:text-amber-400' },\n  error: { icon: XCircle, className: 'text-destructive' },\n  critical: { icon: AlertCircle, className: 'text-destructive' },\n};\n\n/**\n * ErrorInline Component\n * インラインエラー表示コンポーネント\n *\n * Inline error display near form fields or submit buttons.\n * フォームのフィールド近くや送信ボタン周辺に表示します。\n *\n * ## AI/Automation Features\n * - `data-testid`: Container element\n * - `data-severity`: Error severity level\n *\n * @example With testId\n * ```tsx\n * <ErrorInline testId=\"form-error\" error={formError} />\n * ```\n */\nexport function ErrorInline({\n  testId,\n  error,\n  code,\n  message,\n  className,\n  severity = 'error',\n  hideIcon = false,\n}: ErrorInlineProps) {\n  // 表示するメッセージを決定\n  let displayMessage: string | null = null;\n  let displaySeverity = severity;\n\n  if (error) {\n    if (error instanceof AppError) {\n      displayMessage = error.message;\n      displaySeverity = error.severity;\n    } else {\n      displayMessage = error.message;\n    }\n  } else if (code) {\n    // Use the code directly as message - dynamic i18n key lookup not supported in Paraglide\n    displayMessage = code;\n  } else if (message) {\n    displayMessage = message;\n  }\n\n  // 表示するものがなければ何も表示しない\n  if (!displayMessage) {\n    return null;\n  }\n\n  const config = severityConfig[displaySeverity];\n  const Icon = config.icon;\n\n  return (\n    <div\n      data-testid={testId}\n      data-severity={displaySeverity}\n      className={cn('flex items-center gap-2 text-sm', config.className, className)}\n      role='alert'\n    >\n      {!hideIcon && <Icon className='h-4 w-4 flex-shrink-0' aria-hidden='true' />}\n      <span>{displayMessage}</span>\n    </div>\n  );\n}\n"],"mappings":"A,iUA8BA,IAAMY,EAAwF,CAC5F,KAAM,CAAE,KAAMZ,EAAAA,KAAM,UAAW,kCAAmC,EAClE,QAAS,CAAE,KAAMC,EAAAA,cAAe,UAAW,oCAAqC,EAChF,MAAO,CAAE,KAAMC,EAAAA,QAAS,UAAW,kBAAmB,EACtD,SAAU,CAAE,KAAMC,EAAAA,YAAa,UAAW,kBAAmB,CAC/D,EAkBA,SAAgBU,EAAY,CAC1B,SACA,QACA,OACA,UACA,YACA,WAAW,QACX,WAAW,IACQ,CAEnB,IAAIC,EAAgC,KAChCC,EAAkBC,EAiBtB,GAfIC,EACEA,aAAiBb,EAAAA,UACnB,EAAiBa,EAAM,QACvB,EAAkBA,EAAM,UAExB,EAAiBA,EAAM,QAEhBC,EAET,EAAiBA,EACRC,IACT,EAAiBA,GAIf,CAACL,EACH,OAAO,KAGT,IAAMM,EAASR,EAAeG,GACxBM,EAAOD,EAAO,KAEpB,OACE,EAAAX,EAAA,KAAA,CAAC,MAAD,CACE,cAAaa,EACb,gBAAeP,EACf,UAAWV,EAAAA,GAAG,kCAAmCe,EAAO,UAAWG,CAAS,EAC5E,KAAK,QAJP,SAAA,CAMG,CAACC,IAAY,EAAAf,EAAA,IAAA,CAACY,EAAD,CAAM,UAAU,wBAAwB,cAAY,MAAQ,CAAA,GAC1E,EAAAZ,EAAA,IAAA,CAAC,OAAD,CAAA,SAAOK,CAAqB,CAAA,CACzB,C,EAET,C"}
+{"version":3,"file":"ErrorInline.cjs","names":["Info","AlertTriangle","XCircle","AlertCircle","AppError","cn","require_runtime","require_ui_lib_utils","require_tools_lib_error_AppError","react_jsx_runtime","react","lucide_react","severityConfig","ErrorInline","displayMessage","displaySeverity","severity","error","code","message","config","Icon","testId","className","hideIcon"],"sources":["../../../../src/tools/components/error/ErrorInline.tsx"],"sourcesContent":["import React from 'react';\nimport { AlertCircle, XCircle, AlertTriangle, Info } from 'lucide-react';\nimport { cn } from \"../../lib/utils\";\nimport { AppError, ErrorSeverity } from \"../../lib/error\";\n\n/**\n * ErrorInlineProps\n * インラインエラーのプロップス\n *\n * ## AI/Automation Features\n * - `testId`: Stable selector on container\n * - `data-severity`: error, warning, info, critical\n */\nexport interface ErrorInlineProps {\n  /** AI/E2E Test用の安定ID / Stable test identifier */\n  testId?: string;\n  /** 表示するエラー */\n  error?: AppError | Error | null;\n  /** またはエラーコード (i18n から取得) */\n  code?: string;\n  /** エラーメッセージ (直接指定する場合) */\n  message?: string;\n  /** 追加の CSS クラス */\n  className?: string;\n  /** 重要度 (アイコンと色を決定) */\n  severity?: ErrorSeverity;\n  /** アイコンを非表示にする */\n  hideIcon?: boolean;\n}\n\nconst severityConfig: Record<ErrorSeverity, { icon: React.ElementType; className: string }> = {\n  info: { icon: Info, className: 'text-blue-600 dark:text-blue-400' },\n  warning: { icon: AlertTriangle, className: 'text-amber-800 dark:text-amber-400' },\n  error: { icon: XCircle, className: 'text-destructive' },\n  critical: { icon: AlertCircle, className: 'text-destructive' },\n};\n\n/**\n * ErrorInline Component\n * インラインエラー表示コンポーネント\n *\n * Inline error display near form fields or submit buttons.\n * フォームのフィールド近くや送信ボタン周辺に表示します。\n *\n * ## AI/Automation Features\n * - `data-testid`: Container element\n * - `data-severity`: Error severity level\n *\n * @example With testId\n * ```tsx\n * <ErrorInline testId=\"form-error\" error={formError} />\n * ```\n */\nexport function ErrorInline({\n  testId,\n  error,\n  code,\n  message,\n  className,\n  severity = 'error',\n  hideIcon = false,\n}: ErrorInlineProps) {\n  // 表示するメッセージを決定\n  let displayMessage: string | null = null;\n  let displaySeverity = severity;\n\n  if (error) {\n    if (error instanceof AppError) {\n      displayMessage = error.message;\n      displaySeverity = error.severity;\n    } else {\n      displayMessage = error.message;\n    }\n  } else if (code) {\n    // Use the code directly as message - dynamic i18n key lookup not supported in Paraglide\n    displayMessage = code;\n  } else if (message) {\n    displayMessage = message;\n  }\n\n  // 表示するものがなければ何も表示しない\n  if (!displayMessage) {\n    return null;\n  }\n\n  const config = severityConfig[displaySeverity];\n  const Icon = config.icon;\n\n  return (\n    <div\n      data-testid={testId}\n      data-severity={displaySeverity}\n      className={cn('flex items-center gap-2 text-sm', config.className, className)}\n      role='alert'\n    >\n      {!hideIcon && <Icon className='h-4 w-4 flex-shrink-0' aria-hidden='true' />}\n      <span>{displayMessage}</span>\n    </div>\n  );\n}\n"],"mappings":"A,iUA8BA,IAAMY,EAAwF,CAC5F,KAAM,CAAE,KAAMZ,EAAAA,KAAM,UAAW,kCAAmC,EAClE,QAAS,CAAE,KAAMC,EAAAA,cAAe,UAAW,oCAAqC,EAChF,MAAO,CAAE,KAAMC,EAAAA,QAAS,UAAW,kBAAmB,EACtD,SAAU,CAAE,KAAMC,EAAAA,YAAa,UAAW,kBAAmB,CAC/D,EAkBA,SAAgBU,EAAY,CAC1B,SACA,QACA,OACA,UACA,YACA,WAAW,QACX,WAAW,IACQ,CAEnB,IAAIC,EAAgC,KAChCC,EAAkBC,EAiBtB,GAfIC,EACEA,aAAiBb,EAAAA,UACnB,EAAiBa,EAAM,QACvB,EAAkBA,EAAM,UAExB,EAAiBA,EAAM,QAEhBC,EAET,EAAiBA,EACRC,IACT,EAAiBA,GAIf,CAACL,EACH,OAAO,KAGT,IAAMM,EAASR,EAAeG,GACxBM,EAAOD,EAAO,KAEpB,OACE,EAAAX,EAAA,KAAA,CAAC,MAAD,CACE,cAAaa,EACb,gBAAeP,EACf,UAAWV,EAAAA,GAAG,kCAAmCe,EAAO,UAAWG,CAAS,EAC5E,KAAK,QAJP,SAAA,CAMG,CAACC,IAAY,EAAAf,EAAA,IAAA,CAACY,EAAD,CAAM,UAAU,wBAAwB,cAAY,MAAQ,CAAA,GAC1E,EAAAZ,EAAA,IAAA,CAAC,OAAD,CAAA,SAAOK,CAAqB,CAAA,CACzB,C,EAET,C"}

package/dist/tools/components/error/ErrorInline.js

@@ -12,7 +12,7 @@ var c = {
 	},
 	warning: {
 		icon: a,
-		className: "text-amber-600 dark:text-amber-400"
+		className: "text-amber-800 dark:text-amber-400"
 	},
 	error: {
 		icon: s,

package/dist/tools/components/error/ErrorInline.js.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorInline.js","names":["severityConfig","Info","AlertTriangle","XCircle","AlertCircle","ErrorInline","displayMessage","displaySeverity","severity","error","AppError","code","message","config","Icon","testId","cn","className","hideIcon"],"sources":["../../../../src/tools/components/error/ErrorInline.tsx"],"sourcesContent":["import React from 'react';\nimport { AlertCircle, XCircle, AlertTriangle, Info } from 'lucide-react';\nimport { cn } from \"../../lib/utils\";\nimport { AppError, ErrorSeverity } from \"../../lib/error\";\n\n/**\n * ErrorInlineProps\n * インラインエラーのプロップス\n *\n * ## AI/Automation Features\n * - `testId`: Stable selector on container\n * - `data-severity`: error, warning, info, critical\n */\nexport interface ErrorInlineProps {\n  /** AI/E2E Test用の安定ID / Stable test identifier */\n  testId?: string;\n  /** 表示するエラー */\n  error?: AppError | Error | null;\n  /** またはエラーコード (i18n から取得) */\n  code?: string;\n  /** エラーメッセージ (直接指定する場合) */\n  message?: string;\n  /** 追加の CSS クラス */\n  className?: string;\n  /** 重要度 (アイコンと色を決定) */\n  severity?: ErrorSeverity;\n  /** アイコンを非表示にする */\n  hideIcon?: boolean;\n}\n\nconst severityConfig: Record<ErrorSeverity, { icon: React.ElementType; className: string }> = {\n  info: { icon: Info, className: 'text-blue-600 dark:text-blue-400' },\n  warning: { icon: AlertTriangle, className: 'text-amber-600 dark:text-amber-400' },\n  error: { icon: XCircle, className: 'text-destructive' },\n  critical: { icon: AlertCircle, className: 'text-destructive' },\n};\n\n/**\n * ErrorInline Component\n * インラインエラー表示コンポーネント\n *\n * Inline error display near form fields or submit buttons.\n * フォームのフィールド近くや送信ボタン周辺に表示します。\n *\n * ## AI/Automation Features\n * - `data-testid`: Container element\n * - `data-severity`: Error severity level\n *\n * @example With testId\n * ```tsx\n * <ErrorInline testId=\"form-error\" error={formError} />\n * ```\n */\nexport function ErrorInline({\n  testId,\n  error,\n  code,\n  message,\n  className,\n  severity = 'error',\n  hideIcon = false,\n}: ErrorInlineProps) {\n  // 表示するメッセージを決定\n  let displayMessage: string | null = null;\n  let displaySeverity = severity;\n\n  if (error) {\n    if (error instanceof AppError) {\n      displayMessage = error.message;\n      displaySeverity = error.severity;\n    } else {\n      displayMessage = error.message;\n    }\n  } else if (code) {\n    // Use the code directly as message - dynamic i18n key lookup not supported in Paraglide\n    displayMessage = code;\n  } else if (message) {\n    displayMessage = message;\n  }\n\n  // 表示するものがなければ何も表示しない\n  if (!displayMessage) {\n    return null;\n  }\n\n  const config = severityConfig[displaySeverity];\n  const Icon = config.icon;\n\n  return (\n    <div\n      data-testid={testId}\n      data-severity={displaySeverity}\n      className={cn('flex items-center gap-2 text-sm', config.className, className)}\n      role='alert'\n    >\n      {!hideIcon && <Icon className='h-4 w-4 flex-shrink-0' aria-hidden='true' />}\n      <span>{displayMessage}</span>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AA8BA,IAAMA,IAAwF;CAC5F,MAAM;EAAE,MAAMC;EAAM,WAAW;CAAmC;CAClE,SAAS;EAAE,MAAMC;EAAe,WAAW;CAAqC;CAChF,OAAO;EAAE,MAAMC;EAAS,WAAW;CAAmB;CACtD,UAAU;EAAE,MAAMC;EAAa,WAAW;CAAmB;AAC/D;AAkBA,SAAgBC,EAAY,EAC1B,WACA,UACA,SACA,YACA,cACA,cAAW,SACX,cAAW,MACQ;CAEnB,IAAIC,IAAgC,MAChCC,IAAkBC;CAiBtB,IAfIC,IACEA,aAAiBC,KACnB,IAAiBD,EAAM,SACvB,IAAkBA,EAAM,YAExB,IAAiBA,EAAM,UAEhBE,IAET,IAAiBA,IACRC,MACT,IAAiBA,IAIf,CAACN,GACH,OAAO;CAGT,IAAMO,IAASb,EAAeO,IACxBO,IAAOD,EAAO;CAEpB,OACE,kBAAC,OAAD;EACE,eAAaE;EACb,iBAAeR;EACf,WAAWS,EAAG,mCAAmCH,EAAO,WAAWI,CAAS;EAC5E,MAAK;EAJP,UAAA,CAMG,CAACC,KAAY,kBAACJ,GAAD;GAAM,WAAU;GAAwB,eAAY;EAAQ,CAAA,GAC1E,kBAAC,QAAD,EAAA,UAAOR,EAAqB,CAAA,CACzB;;AAET"}
+{"version":3,"file":"ErrorInline.js","names":["severityConfig","Info","AlertTriangle","XCircle","AlertCircle","ErrorInline","displayMessage","displaySeverity","severity","error","AppError","code","message","config","Icon","testId","cn","className","hideIcon"],"sources":["../../../../src/tools/components/error/ErrorInline.tsx"],"sourcesContent":["import React from 'react';\nimport { AlertCircle, XCircle, AlertTriangle, Info } from 'lucide-react';\nimport { cn } from \"../../lib/utils\";\nimport { AppError, ErrorSeverity } from \"../../lib/error\";\n\n/**\n * ErrorInlineProps\n * インラインエラーのプロップス\n *\n * ## AI/Automation Features\n * - `testId`: Stable selector on container\n * - `data-severity`: error, warning, info, critical\n */\nexport interface ErrorInlineProps {\n  /** AI/E2E Test用の安定ID / Stable test identifier */\n  testId?: string;\n  /** 表示するエラー */\n  error?: AppError | Error | null;\n  /** またはエラーコード (i18n から取得) */\n  code?: string;\n  /** エラーメッセージ (直接指定する場合) */\n  message?: string;\n  /** 追加の CSS クラス */\n  className?: string;\n  /** 重要度 (アイコンと色を決定) */\n  severity?: ErrorSeverity;\n  /** アイコンを非表示にする */\n  hideIcon?: boolean;\n}\n\nconst severityConfig: Record<ErrorSeverity, { icon: React.ElementType; className: string }> = {\n  info: { icon: Info, className: 'text-blue-600 dark:text-blue-400' },\n  warning: { icon: AlertTriangle, className: 'text-amber-800 dark:text-amber-400' },\n  error: { icon: XCircle, className: 'text-destructive' },\n  critical: { icon: AlertCircle, className: 'text-destructive' },\n};\n\n/**\n * ErrorInline Component\n * インラインエラー表示コンポーネント\n *\n * Inline error display near form fields or submit buttons.\n * フォームのフィールド近くや送信ボタン周辺に表示します。\n *\n * ## AI/Automation Features\n * - `data-testid`: Container element\n * - `data-severity`: Error severity level\n *\n * @example With testId\n * ```tsx\n * <ErrorInline testId=\"form-error\" error={formError} />\n * ```\n */\nexport function ErrorInline({\n  testId,\n  error,\n  code,\n  message,\n  className,\n  severity = 'error',\n  hideIcon = false,\n}: ErrorInlineProps) {\n  // 表示するメッセージを決定\n  let displayMessage: string | null = null;\n  let displaySeverity = severity;\n\n  if (error) {\n    if (error instanceof AppError) {\n      displayMessage = error.message;\n      displaySeverity = error.severity;\n    } else {\n      displayMessage = error.message;\n    }\n  } else if (code) {\n    // Use the code directly as message - dynamic i18n key lookup not supported in Paraglide\n    displayMessage = code;\n  } else if (message) {\n    displayMessage = message;\n  }\n\n  // 表示するものがなければ何も表示しない\n  if (!displayMessage) {\n    return null;\n  }\n\n  const config = severityConfig[displaySeverity];\n  const Icon = config.icon;\n\n  return (\n    <div\n      data-testid={testId}\n      data-severity={displaySeverity}\n      className={cn('flex items-center gap-2 text-sm', config.className, className)}\n      role='alert'\n    >\n      {!hideIcon && <Icon className='h-4 w-4 flex-shrink-0' aria-hidden='true' />}\n      <span>{displayMessage}</span>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AA8BA,IAAMA,IAAwF;CAC5F,MAAM;EAAE,MAAMC;EAAM,WAAW;CAAmC;CAClE,SAAS;EAAE,MAAMC;EAAe,WAAW;CAAqC;CAChF,OAAO;EAAE,MAAMC;EAAS,WAAW;CAAmB;CACtD,UAAU;EAAE,MAAMC;EAAa,WAAW;CAAmB;AAC/D;AAkBA,SAAgBC,EAAY,EAC1B,WACA,UACA,SACA,YACA,cACA,cAAW,SACX,cAAW,MACQ;CAEnB,IAAIC,IAAgC,MAChCC,IAAkBC;CAiBtB,IAfIC,IACEA,aAAiBC,KACnB,IAAiBD,EAAM,SACvB,IAAkBA,EAAM,YAExB,IAAiBA,EAAM,UAEhBE,IAET,IAAiBA,IACRC,MACT,IAAiBA,IAIf,CAACN,GACH,OAAO;CAGT,IAAMO,IAASb,EAAeO,IACxBO,IAAOD,EAAO;CAEpB,OACE,kBAAC,OAAD;EACE,eAAaE;EACb,iBAAeR;EACf,WAAWS,EAAG,mCAAmCH,EAAO,WAAWI,CAAS;EAC5E,MAAK;EAJP,UAAA,CAMG,CAACC,KAAY,kBAACJ,GAAD;GAAM,WAAU;GAAwB,eAAY;EAAQ,CAAA,GAC1E,kBAAC,QAAD,EAAA,UAAOR,EAAqB,CAAA,CACzB;;AAET"}

package/dist/tools/components/error/ErrorNotification.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("../../lib/state/error-store.cjs");let r=require("react/jsx-runtime"),i=require("react");i=e.__toESM(i,1);let a=require("lucide-react");var o={info:{icon:a.Info,bgClass:`bg-blue-50`,borderClass:`border-blue-200`,iconBgClass:`bg-blue-500`,iconClass:`text-white`},warning:{icon:a.AlertTriangle,bgClass:`bg-amber-50`,borderClass:`border-amber-200`,iconBgClass:`bg-amber-500`,iconClass:`text-white`},error:{icon:a.X,bgClass:`bg-red-50`,borderClass:`border-red-200`,iconBgClass:`bg-red-500`,iconClass:`text-white`},critical:{icon:a.AlertCircle,bgClass:`bg-red-100`,borderClass:`border-red-300`,iconBgClass:`bg-red-600`,iconClass:`text-white`},success:{icon:a.CheckCircle,bgClass:`bg-green-50`,borderClass:`border-green-200`,iconBgClass:`bg-green-500`,iconClass:`text-white`}},s={"top-left":`top-4 left-4`,"top-center":`top-4 left-1/2 -translate-x-1/2`,"top-right":`top-4 right-4`,"bottom-left":`bottom-4 left-4`,"bottom-center":`bottom-4 left-1/2 -translate-x-1/2`,"bottom-right":`bottom-4 right-4`};function c({className:e,maxVisible:i=5,position:a=`top-right`}){let{removeError:o,getErrorsByMode:c}=n.useErrorStore(),u=c(`notification`).slice(-i);return u.length===0?null:(0,r.jsx)(`div`,{className:t.cn(`fixed z-[100] flex flex-col gap-2 w-full max-w-md pointer-events-none`,s[a],e),children:u.map(e=>(0,r.jsx)(l,{item:e,onDismiss:()=>o(e.id)},e.id))})}function l({item:e,onDismiss:n}){let i=o[e.severity],s=i.icon;return(0,r.jsxs)(`div`,{className:t.cn(`pointer-events-auto flex items-start gap-3 rounded-lg border p-4 shadow-lg`,`animate-in slide-in-from-right-full fade-in duration-300`,i.bgClass,i.borderClass),role:`alert`,children:[(0,r.jsx)(`div`,{className:t.cn(`rounded-full p-1.5 flex-shrink-0`,i.iconBgClass),children:(0,r.jsx)(s,{className:t.cn(`h-4 w-4`,i.iconClass)})}),(0,r.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,r.jsx)(`p`,{className:`text-sm font-medium text-foreground`,children:e.error.message}),e.error.code&&e.error.code!==`error/unknown`&&(0,r.jsx)(`p`,{className:`mt-1 text-xs text-muted-foreground`,children:e.error.code})]}),(0,r.jsx)(`button`,{onClick:n,className:`flex-shrink-0 rounded-md p-1 text-muted-foreground hover:text-foreground hover:bg-black/5 dark:hover:bg-white/10 transition-colors`,"aria-label":`Close`,children:(0,r.jsx)(a.X,{className:`h-4 w-4`})})]})}exports.ErrorNotification=c;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../ui/lib/utils.cjs"),n=require("../../lib/state/error-store.cjs");let r=require("react/jsx-runtime"),i=require("react");i=e.__toESM(i,1);let a=require("lucide-react");var o={info:{icon:a.Info,bgClass:`bg-blue-50 dark:bg-blue-950`,borderClass:`border-blue-200 dark:border-blue-800`,iconBgClass:`bg-blue-500`,iconClass:`text-white`},warning:{icon:a.AlertTriangle,bgClass:`bg-amber-50 dark:bg-amber-950`,borderClass:`border-amber-200 dark:border-amber-800`,iconBgClass:`bg-amber-500`,iconClass:`text-white`},error:{icon:a.X,bgClass:`bg-red-50 dark:bg-red-950`,borderClass:`border-red-200 dark:border-red-800`,iconBgClass:`bg-red-500`,iconClass:`text-white`},critical:{icon:a.AlertCircle,bgClass:`bg-red-100 dark:bg-red-950`,borderClass:`border-red-300 dark:border-red-800`,iconBgClass:`bg-red-600`,iconClass:`text-white`},success:{icon:a.CheckCircle,bgClass:`bg-green-50 dark:bg-green-950`,borderClass:`border-green-200 dark:border-green-800`,iconBgClass:`bg-green-500`,iconClass:`text-white`}},s={"top-left":`top-4 left-4`,"top-center":`top-4 left-1/2 -translate-x-1/2`,"top-right":`top-4 right-4`,"bottom-left":`bottom-4 left-4`,"bottom-center":`bottom-4 left-1/2 -translate-x-1/2`,"bottom-right":`bottom-4 right-4`};function c({className:e,maxVisible:i=5,position:a=`top-right`}){let{removeError:o,getErrorsByMode:c}=n.useErrorStore(),u=c(`notification`).slice(-i);return u.length===0?null:(0,r.jsx)(`div`,{className:t.cn(`fixed z-[100] flex flex-col gap-2 w-full max-w-md pointer-events-none`,s[a],e),children:u.map(e=>(0,r.jsx)(l,{item:e,onDismiss:()=>o(e.id)},e.id))})}function l({item:e,onDismiss:n}){let i=o[e.severity],s=i.icon;return(0,r.jsxs)(`div`,{className:t.cn(`pointer-events-auto flex items-start gap-3 rounded-lg border p-4 shadow-lg`,`animate-in slide-in-from-right-full fade-in duration-300`,i.bgClass,i.borderClass),role:`alert`,children:[(0,r.jsx)(`div`,{className:t.cn(`rounded-full p-1.5 flex-shrink-0`,i.iconBgClass),children:(0,r.jsx)(s,{className:t.cn(`h-4 w-4`,i.iconClass)})}),(0,r.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,r.jsx)(`p`,{className:`text-sm font-medium text-foreground`,children:e.error.message}),e.error.code&&e.error.code!==`error/unknown`&&(0,r.jsx)(`p`,{className:`mt-1 text-xs text-muted-foreground`,children:e.error.code})]}),(0,r.jsx)(`button`,{onClick:n,className:`flex-shrink-0 rounded-md p-1 text-muted-foreground hover:text-foreground hover:bg-black/5 dark:hover:bg-white/10 transition-colors`,"aria-label":`Close`,children:(0,r.jsx)(a.X,{className:`h-4 w-4`})})]})}exports.ErrorNotification=c;
 //# sourceMappingURL=ErrorNotification.cjs.map

package/dist/tools/components/error/ErrorNotification.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorNotification.cjs","names":["Info","AlertTriangle","X","AlertCircle","CheckCircle","useErrorStore","cn","require_runtime","require_ui_lib_utils","require_tools_lib_state_error_store","react_jsx_runtime","react","lucide_react","severityConfig","positionClasses","ErrorNotification","notificationErrors","getErrorsByMode","maxVisible","position","className","NotificationItem","removeError","item","config","Icon","onDismiss"],"sources":["../../../../src/tools/components/error/ErrorNotification.tsx"],"sourcesContent":["import React from 'react';\nimport { X, AlertCircle, AlertTriangle, Info, CheckCircle } from 'lucide-react';\nimport { cn } from \"../../lib/utils\";\nimport { ErrorSeverity } from \"../../lib/error\";\nimport { useErrorStore, ErrorItem } from \"../../lib/state/error-store\";\n\nexport interface ErrorNotificationProps {\n  /** 追加の CSS クラス */\n  className?: string;\n  /** 通知の最大表示数。デフォルト: 5 */\n  maxVisible?: number;\n  /** 表示位置。デフォルト: 'top-right' */\n  position?:\n    | 'top-left'\n    | 'top-center'\n    | 'top-right'\n    | 'bottom-left'\n    | 'bottom-center'\n    | 'bottom-right';\n}\n\nconst severityConfig: Record<\n  ErrorSeverity | 'success',\n  {\n    icon: React.ElementType;\n    bgClass: string;\n    borderClass: string;\n    iconBgClass: string;\n    iconClass: string;\n  }\n> = {\n  info: {\n    icon: Info,\n    bgClass: 'bg-blue-50',\n    borderClass: 'border-blue-200',\n    iconBgClass: 'bg-blue-500',\n    iconClass: 'text-white',\n  },\n  warning: {\n    icon: AlertTriangle,\n    bgClass: 'bg-amber-50',\n    borderClass: 'border-amber-200',\n    iconBgClass: 'bg-amber-500',\n    iconClass: 'text-white',\n  },\n  error: {\n    icon: X,\n    bgClass: 'bg-red-50',\n    borderClass: 'border-red-200',\n    iconBgClass: 'bg-red-500',\n    iconClass: 'text-white',\n  },\n  critical: {\n    icon: AlertCircle,\n    bgClass: 'bg-red-100',\n    borderClass: 'border-red-300',\n    iconBgClass: 'bg-red-600',\n    iconClass: 'text-white',\n  },\n  success: {\n    icon: CheckCircle,\n    bgClass: 'bg-green-50',\n    borderClass: 'border-green-200',\n    iconBgClass: 'bg-green-500',\n    iconClass: 'text-white',\n  },\n};\n\nconst positionClasses: Record<NonNullable<ErrorNotificationProps['position']>, string> = {\n  'top-left': 'top-4 left-4',\n  'top-center': 'top-4 left-1/2 -translate-x-1/2',\n  'top-right': 'top-4 right-4',\n  'bottom-left': 'bottom-4 left-4',\n  'bottom-center': 'bottom-4 left-1/2 -translate-x-1/2',\n  'bottom-right': 'bottom-4 right-4',\n};\n\n/**\n * 通知バナー表示コンポーネント\n * 画面の角に通知を表示します。\n *\n * @example\n * ```tsx\n * // ErrorProvider 内で自動的に使用されます\n * <ErrorNotification position=\"top-right\" maxVisible={3} />\n * ```\n */\nexport function ErrorNotification({\n  className,\n  maxVisible = 5,\n  position = 'top-right',\n}: ErrorNotificationProps) {\n  const { removeError, getErrorsByMode } = useErrorStore();\n\n  // notification モードのエラーのみ表示\n  const notificationErrors = getErrorsByMode('notification').slice(-maxVisible);\n\n  if (notificationErrors.length === 0) {\n    return null;\n  }\n\n  return (\n    <div\n      className={cn(\n        'fixed z-[100] flex flex-col gap-2 w-full max-w-md pointer-events-none',\n        positionClasses[position],\n        className,\n      )}\n    >\n      {notificationErrors.map((item) => (\n        <NotificationItem key={item.id} item={item} onDismiss={() => removeError(item.id)} />\n      ))}\n    </div>\n  );\n}\n\ninterface NotificationItemProps {\n  item: ErrorItem;\n  onDismiss: () => void;\n}\n\nfunction NotificationItem({ item, onDismiss }: NotificationItemProps) {\n  const config = severityConfig[item.severity];\n  const Icon = config.icon;\n\n  return (\n    <div\n      className={cn(\n        'pointer-events-auto flex items-start gap-3 rounded-lg border p-4 shadow-lg',\n        'animate-in slide-in-from-right-full fade-in duration-300',\n        config.bgClass,\n        config.borderClass,\n      )}\n      role='alert'\n    >\n      <div className={cn('rounded-full p-1.5 flex-shrink-0', config.iconBgClass)}>\n        <Icon className={cn('h-4 w-4', config.iconClass)} />\n      </div>\n      <div className='flex-1 min-w-0'>\n        <p className='text-sm font-medium text-foreground'>{item.error.message}</p>\n        {item.error.code && item.error.code !== 'error/unknown' && (\n          <p className='mt-1 text-xs text-muted-foreground'>{item.error.code}</p>\n        )}\n      </div>\n      <button\n        onClick={onDismiss}\n        className='flex-shrink-0 rounded-md p-1 text-muted-foreground hover:text-foreground hover:bg-black/5 dark:hover:bg-white/10 transition-colors'\n        aria-label='Close'\n      >\n        <X className='h-4 w-4' />\n      </button>\n    </div>\n  );\n}\n"],"mappings":"A,oUAqBA,IAAMa,EASF,CACF,KAAM,CACJ,KAAMb,EAAAA,KACN,QAAS,aACT,YAAa,kBACb,YAAa,cACb,UAAW,YACb,EACA,QAAS,CACP,KAAMC,EAAAA,cACN,QAAS,cACT,YAAa,mBACb,YAAa,eACb,UAAW,YACb,EACA,MAAO,CACL,KAAMC,EAAAA,EACN,QAAS,YACT,YAAa,iBACb,YAAa,aACb,UAAW,YACb,EACA,SAAU,CACR,KAAMC,EAAAA,YACN,QAAS,aACT,YAAa,iBACb,YAAa,aACb,UAAW,YACb,EACA,QAAS,CACP,KAAMC,EAAAA,YACN,QAAS,cACT,YAAa,mBACb,YAAa,eACb,UAAW,YACb,CACF,EAEMU,EAAmF,CACvF,WAAY,eACZ,aAAc,kCACd,YAAa,gBACb,cAAe,kBACf,gBAAiB,qCACjB,eAAgB,kBAClB,EAYA,SAAgBC,EAAkB,CAChC,YACA,aAAa,EACb,WAAW,aACc,CACzB,GAAM,CAAE,cAAa,mBAAoBV,EAAAA,cAAc,EAGjDW,EAAqBC,EAAgB,cAAc,CAAC,CAAC,MAAM,CAACC,CAAU,EAM5E,OAJIF,EAAmB,SAAW,EACzB,MAIP,EAAAN,EAAA,IAAA,CAAC,MAAD,CACE,UAAWJ,EAAAA,GACT,wEACAQ,EAAgBK,GAChBC,CACF,EAEC,SAAAJ,EAAmB,IAAK,IACvB,EAAAN,EAAA,IAAA,CAACW,EAAD,CAAsC,OAAM,cAAiBC,EAAYC,EAAK,EAAE,CAAI,EAA7DA,EAAK,EAAwD,CACrF,CACE,CAAA,CAET,CAOA,SAASF,EAAiB,CAAE,OAAM,aAAoC,CACpE,IAAMG,EAASX,EAAeU,EAAK,UAC7BE,EAAOD,EAAO,KAEpB,OACE,EAAAd,EAAA,KAAA,CAAC,MAAD,CACE,UAAWJ,EAAAA,GACT,6EACA,2DACAkB,EAAO,QACPA,EAAO,WACT,EACA,KAAK,QAPP,SAAA,EASE,EAAAd,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWJ,EAAAA,GAAG,mCAAoCkB,EAAO,WAAW,EACvE,UAAA,EAAAd,EAAA,IAAA,CAACe,EAAD,CAAM,UAAWnB,EAAAA,GAAG,UAAWkB,EAAO,SAAS,CAAI,CAAA,CAChD,CAAA,GACL,EAAAd,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iBAAf,SAAA,EACE,EAAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAU,sCAAuC,SAAAa,EAAK,MAAM,OAAW,CAAA,EACzEA,EAAK,MAAM,MAAQA,EAAK,MAAM,OAAS,kBACtC,EAAAb,EAAA,IAAA,CAAC,IAAD,CAAG,UAAU,qCAAsC,SAAAa,EAAK,MAAM,IAAQ,CAAA,CAErE,C,IACL,EAAAb,EAAA,IAAA,CAAC,SAAD,CACE,QAASgB,EACT,UAAU,qIACV,aAAW,QAEX,UAAA,EAAAhB,EAAA,IAAA,CAACR,EAAAA,EAAD,CAAG,UAAU,SAAW,CAAA,CAClB,CAAA,CACL,C,EAET,C"}
+{"version":3,"file":"ErrorNotification.cjs","names":["Info","AlertTriangle","X","AlertCircle","CheckCircle","useErrorStore","cn","require_runtime","require_ui_lib_utils","require_tools_lib_state_error_store","react_jsx_runtime","react","lucide_react","severityConfig","positionClasses","ErrorNotification","notificationErrors","getErrorsByMode","maxVisible","position","className","NotificationItem","removeError","item","config","Icon","onDismiss"],"sources":["../../../../src/tools/components/error/ErrorNotification.tsx"],"sourcesContent":["import React from 'react';\nimport { X, AlertCircle, AlertTriangle, Info, CheckCircle } from 'lucide-react';\nimport { cn } from \"../../lib/utils\";\nimport { ErrorSeverity } from \"../../lib/error\";\nimport { useErrorStore, ErrorItem } from \"../../lib/state/error-store\";\n\nexport interface ErrorNotificationProps {\n  /** 追加の CSS クラス */\n  className?: string;\n  /** 通知の最大表示数。デフォルト: 5 */\n  maxVisible?: number;\n  /** 表示位置。デフォルト: 'top-right' */\n  position?:\n    | 'top-left'\n    | 'top-center'\n    | 'top-right'\n    | 'bottom-left'\n    | 'bottom-center'\n    | 'bottom-right';\n}\n\nconst severityConfig: Record<\n  ErrorSeverity | 'success',\n  {\n    icon: React.ElementType;\n    bgClass: string;\n    borderClass: string;\n    iconBgClass: string;\n    iconClass: string;\n  }\n> = {\n  info: {\n    icon: Info,\n    bgClass: 'bg-blue-50 dark:bg-blue-950',\n    borderClass: 'border-blue-200 dark:border-blue-800',\n    iconBgClass: 'bg-blue-500',\n    iconClass: 'text-white',\n  },\n  warning: {\n    icon: AlertTriangle,\n    bgClass: 'bg-amber-50 dark:bg-amber-950',\n    borderClass: 'border-amber-200 dark:border-amber-800',\n    iconBgClass: 'bg-amber-500',\n    iconClass: 'text-white',\n  },\n  error: {\n    icon: X,\n    bgClass: 'bg-red-50 dark:bg-red-950',\n    borderClass: 'border-red-200 dark:border-red-800',\n    iconBgClass: 'bg-red-500',\n    iconClass: 'text-white',\n  },\n  critical: {\n    icon: AlertCircle,\n    bgClass: 'bg-red-100 dark:bg-red-950',\n    borderClass: 'border-red-300 dark:border-red-800',\n    iconBgClass: 'bg-red-600',\n    iconClass: 'text-white',\n  },\n  success: {\n    icon: CheckCircle,\n    bgClass: 'bg-green-50 dark:bg-green-950',\n    borderClass: 'border-green-200 dark:border-green-800',\n    iconBgClass: 'bg-green-500',\n    iconClass: 'text-white',\n  },\n};\n\nconst positionClasses: Record<NonNullable<ErrorNotificationProps['position']>, string> = {\n  'top-left': 'top-4 left-4',\n  'top-center': 'top-4 left-1/2 -translate-x-1/2',\n  'top-right': 'top-4 right-4',\n  'bottom-left': 'bottom-4 left-4',\n  'bottom-center': 'bottom-4 left-1/2 -translate-x-1/2',\n  'bottom-right': 'bottom-4 right-4',\n};\n\n/**\n * 通知バナー表示コンポーネント\n * 画面の角に通知を表示します。\n *\n * @example\n * ```tsx\n * // ErrorProvider 内で自動的に使用されます\n * <ErrorNotification position=\"top-right\" maxVisible={3} />\n * ```\n */\nexport function ErrorNotification({\n  className,\n  maxVisible = 5,\n  position = 'top-right',\n}: ErrorNotificationProps) {\n  const { removeError, getErrorsByMode } = useErrorStore();\n\n  // notification モードのエラーのみ表示\n  const notificationErrors = getErrorsByMode('notification').slice(-maxVisible);\n\n  if (notificationErrors.length === 0) {\n    return null;\n  }\n\n  return (\n    <div\n      className={cn(\n        'fixed z-[100] flex flex-col gap-2 w-full max-w-md pointer-events-none',\n        positionClasses[position],\n        className,\n      )}\n    >\n      {notificationErrors.map((item) => (\n        <NotificationItem key={item.id} item={item} onDismiss={() => removeError(item.id)} />\n      ))}\n    </div>\n  );\n}\n\ninterface NotificationItemProps {\n  item: ErrorItem;\n  onDismiss: () => void;\n}\n\nfunction NotificationItem({ item, onDismiss }: NotificationItemProps) {\n  const config = severityConfig[item.severity];\n  const Icon = config.icon;\n\n  return (\n    <div\n      className={cn(\n        'pointer-events-auto flex items-start gap-3 rounded-lg border p-4 shadow-lg',\n        'animate-in slide-in-from-right-full fade-in duration-300',\n        config.bgClass,\n        config.borderClass,\n      )}\n      role='alert'\n    >\n      <div className={cn('rounded-full p-1.5 flex-shrink-0', config.iconBgClass)}>\n        <Icon className={cn('h-4 w-4', config.iconClass)} />\n      </div>\n      <div className='flex-1 min-w-0'>\n        <p className='text-sm font-medium text-foreground'>{item.error.message}</p>\n        {item.error.code && item.error.code !== 'error/unknown' && (\n          <p className='mt-1 text-xs text-muted-foreground'>{item.error.code}</p>\n        )}\n      </div>\n      <button\n        onClick={onDismiss}\n        className='flex-shrink-0 rounded-md p-1 text-muted-foreground hover:text-foreground hover:bg-black/5 dark:hover:bg-white/10 transition-colors'\n        aria-label='Close'\n      >\n        <X className='h-4 w-4' />\n      </button>\n    </div>\n  );\n}\n"],"mappings":"A,oUAqBA,IAAMa,EASF,CACF,KAAM,CACJ,KAAMb,EAAAA,KACN,QAAS,8BACT,YAAa,uCACb,YAAa,cACb,UAAW,YACb,EACA,QAAS,CACP,KAAMC,EAAAA,cACN,QAAS,gCACT,YAAa,yCACb,YAAa,eACb,UAAW,YACb,EACA,MAAO,CACL,KAAMC,EAAAA,EACN,QAAS,4BACT,YAAa,qCACb,YAAa,aACb,UAAW,YACb,EACA,SAAU,CACR,KAAMC,EAAAA,YACN,QAAS,6BACT,YAAa,qCACb,YAAa,aACb,UAAW,YACb,EACA,QAAS,CACP,KAAMC,EAAAA,YACN,QAAS,gCACT,YAAa,yCACb,YAAa,eACb,UAAW,YACb,CACF,EAEMU,EAAmF,CACvF,WAAY,eACZ,aAAc,kCACd,YAAa,gBACb,cAAe,kBACf,gBAAiB,qCACjB,eAAgB,kBAClB,EAYA,SAAgBC,EAAkB,CAChC,YACA,aAAa,EACb,WAAW,aACc,CACzB,GAAM,CAAE,cAAa,mBAAoBV,EAAAA,cAAc,EAGjDW,EAAqBC,EAAgB,cAAc,CAAC,CAAC,MAAM,CAACC,CAAU,EAM5E,OAJIF,EAAmB,SAAW,EACzB,MAIP,EAAAN,EAAA,IAAA,CAAC,MAAD,CACE,UAAWJ,EAAAA,GACT,wEACAQ,EAAgBK,GAChBC,CACF,EAEC,SAAAJ,EAAmB,IAAK,IACvB,EAAAN,EAAA,IAAA,CAACW,EAAD,CAAsC,OAAM,cAAiBC,EAAYC,EAAK,EAAE,CAAI,EAA7DA,EAAK,EAAwD,CACrF,CACE,CAAA,CAET,CAOA,SAASF,EAAiB,CAAE,OAAM,aAAoC,CACpE,IAAMG,EAASX,EAAeU,EAAK,UAC7BE,EAAOD,EAAO,KAEpB,OACE,EAAAd,EAAA,KAAA,CAAC,MAAD,CACE,UAAWJ,EAAAA,GACT,6EACA,2DACAkB,EAAO,QACPA,EAAO,WACT,EACA,KAAK,QAPP,SAAA,EASE,EAAAd,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWJ,EAAAA,GAAG,mCAAoCkB,EAAO,WAAW,EACvE,UAAA,EAAAd,EAAA,IAAA,CAACe,EAAD,CAAM,UAAWnB,EAAAA,GAAG,UAAWkB,EAAO,SAAS,CAAI,CAAA,CAChD,CAAA,GACL,EAAAd,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iBAAf,SAAA,EACE,EAAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAU,sCAAuC,SAAAa,EAAK,MAAM,OAAW,CAAA,EACzEA,EAAK,MAAM,MAAQA,EAAK,MAAM,OAAS,kBACtC,EAAAb,EAAA,IAAA,CAAC,IAAD,CAAG,UAAU,qCAAsC,SAAAa,EAAK,MAAM,IAAQ,CAAA,CAErE,C,IACL,EAAAb,EAAA,IAAA,CAAC,SAAD,CACE,QAASgB,EACT,UAAU,qIACV,aAAW,QAEX,UAAA,EAAAhB,EAAA,IAAA,CAACR,EAAAA,EAAD,CAAG,UAAU,SAAW,CAAA,CAClB,CAAA,CACL,C,EAET,C"}

package/dist/tools/components/error/ErrorNotification.js

@@ -8,36 +8,36 @@ import { AlertCircle as i, AlertTriangle as a, CheckCircle as o, Info as s, X as
 var l = {
 	info: {
 		icon: s,
-		bgClass: "bg-blue-50",
-		borderClass: "border-blue-200",
+		bgClass: "bg-blue-50 dark:bg-blue-950",
+		borderClass: "border-blue-200 dark:border-blue-800",
 		iconBgClass: "bg-blue-500",
 		iconClass: "text-white"
 	},
 	warning: {
 		icon: a,
-		bgClass: "bg-amber-50",
-		borderClass: "border-amber-200",
+		bgClass: "bg-amber-50 dark:bg-amber-950",
+		borderClass: "border-amber-200 dark:border-amber-800",
 		iconBgClass: "bg-amber-500",
 		iconClass: "text-white"
 	},
 	error: {
 		icon: c,
-		bgClass: "bg-red-50",
-		borderClass: "border-red-200",
+		bgClass: "bg-red-50 dark:bg-red-950",
+		borderClass: "border-red-200 dark:border-red-800",
 		iconBgClass: "bg-red-500",
 		iconClass: "text-white"
 	},
 	critical: {
 		icon: i,
-		bgClass: "bg-red-100",
-		borderClass: "border-red-300",
+		bgClass: "bg-red-100 dark:bg-red-950",
+		borderClass: "border-red-300 dark:border-red-800",
 		iconBgClass: "bg-red-600",
 		iconClass: "text-white"
 	},
 	success: {
 		icon: o,
-		bgClass: "bg-green-50",
-		borderClass: "border-green-200",
+		bgClass: "bg-green-50 dark:bg-green-950",
+		borderClass: "border-green-200 dark:border-green-800",
 		iconBgClass: "bg-green-500",
 		iconClass: "text-white"
 	}

package/dist/tools/components/error/ErrorNotification.js.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorNotification.js","names":["severityConfig","Info","AlertTriangle","X","AlertCircle","CheckCircle","positionClasses","ErrorNotification","useErrorStore","notificationErrors","getErrorsByMode","maxVisible","cn","position","className","NotificationItem","removeError","item","config","Icon","onDismiss"],"sources":["../../../../src/tools/components/error/ErrorNotification.tsx"],"sourcesContent":["import React from 'react';\nimport { X, AlertCircle, AlertTriangle, Info, CheckCircle } from 'lucide-react';\nimport { cn } from \"../../lib/utils\";\nimport { ErrorSeverity } from \"../../lib/error\";\nimport { useErrorStore, ErrorItem } from \"../../lib/state/error-store\";\n\nexport interface ErrorNotificationProps {\n  /** 追加の CSS クラス */\n  className?: string;\n  /** 通知の最大表示数。デフォルト: 5 */\n  maxVisible?: number;\n  /** 表示位置。デフォルト: 'top-right' */\n  position?:\n    | 'top-left'\n    | 'top-center'\n    | 'top-right'\n    | 'bottom-left'\n    | 'bottom-center'\n    | 'bottom-right';\n}\n\nconst severityConfig: Record<\n  ErrorSeverity | 'success',\n  {\n    icon: React.ElementType;\n    bgClass: string;\n    borderClass: string;\n    iconBgClass: string;\n    iconClass: string;\n  }\n> = {\n  info: {\n    icon: Info,\n    bgClass: 'bg-blue-50',\n    borderClass: 'border-blue-200',\n    iconBgClass: 'bg-blue-500',\n    iconClass: 'text-white',\n  },\n  warning: {\n    icon: AlertTriangle,\n    bgClass: 'bg-amber-50',\n    borderClass: 'border-amber-200',\n    iconBgClass: 'bg-amber-500',\n    iconClass: 'text-white',\n  },\n  error: {\n    icon: X,\n    bgClass: 'bg-red-50',\n    borderClass: 'border-red-200',\n    iconBgClass: 'bg-red-500',\n    iconClass: 'text-white',\n  },\n  critical: {\n    icon: AlertCircle,\n    bgClass: 'bg-red-100',\n    borderClass: 'border-red-300',\n    iconBgClass: 'bg-red-600',\n    iconClass: 'text-white',\n  },\n  success: {\n    icon: CheckCircle,\n    bgClass: 'bg-green-50',\n    borderClass: 'border-green-200',\n    iconBgClass: 'bg-green-500',\n    iconClass: 'text-white',\n  },\n};\n\nconst positionClasses: Record<NonNullable<ErrorNotificationProps['position']>, string> = {\n  'top-left': 'top-4 left-4',\n  'top-center': 'top-4 left-1/2 -translate-x-1/2',\n  'top-right': 'top-4 right-4',\n  'bottom-left': 'bottom-4 left-4',\n  'bottom-center': 'bottom-4 left-1/2 -translate-x-1/2',\n  'bottom-right': 'bottom-4 right-4',\n};\n\n/**\n * 通知バナー表示コンポーネント\n * 画面の角に通知を表示します。\n *\n * @example\n * ```tsx\n * // ErrorProvider 内で自動的に使用されます\n * <ErrorNotification position=\"top-right\" maxVisible={3} />\n * ```\n */\nexport function ErrorNotification({\n  className,\n  maxVisible = 5,\n  position = 'top-right',\n}: ErrorNotificationProps) {\n  const { removeError, getErrorsByMode } = useErrorStore();\n\n  // notification モードのエラーのみ表示\n  const notificationErrors = getErrorsByMode('notification').slice(-maxVisible);\n\n  if (notificationErrors.length === 0) {\n    return null;\n  }\n\n  return (\n    <div\n      className={cn(\n        'fixed z-[100] flex flex-col gap-2 w-full max-w-md pointer-events-none',\n        positionClasses[position],\n        className,\n      )}\n    >\n      {notificationErrors.map((item) => (\n        <NotificationItem key={item.id} item={item} onDismiss={() => removeError(item.id)} />\n      ))}\n    </div>\n  );\n}\n\ninterface NotificationItemProps {\n  item: ErrorItem;\n  onDismiss: () => void;\n}\n\nfunction NotificationItem({ item, onDismiss }: NotificationItemProps) {\n  const config = severityConfig[item.severity];\n  const Icon = config.icon;\n\n  return (\n    <div\n      className={cn(\n        'pointer-events-auto flex items-start gap-3 rounded-lg border p-4 shadow-lg',\n        'animate-in slide-in-from-right-full fade-in duration-300',\n        config.bgClass,\n        config.borderClass,\n      )}\n      role='alert'\n    >\n      <div className={cn('rounded-full p-1.5 flex-shrink-0', config.iconBgClass)}>\n        <Icon className={cn('h-4 w-4', config.iconClass)} />\n      </div>\n      <div className='flex-1 min-w-0'>\n        <p className='text-sm font-medium text-foreground'>{item.error.message}</p>\n        {item.error.code && item.error.code !== 'error/unknown' && (\n          <p className='mt-1 text-xs text-muted-foreground'>{item.error.code}</p>\n        )}\n      </div>\n      <button\n        onClick={onDismiss}\n        className='flex-shrink-0 rounded-md p-1 text-muted-foreground hover:text-foreground hover:bg-black/5 dark:hover:bg-white/10 transition-colors'\n        aria-label='Close'\n      >\n        <X className='h-4 w-4' />\n      </button>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAqBA,IAAMA,IASF;CACF,MAAM;EACJ,MAAMC;EACN,SAAS;EACT,aAAa;EACb,aAAa;EACb,WAAW;CACb;CACA,SAAS;EACP,MAAMC;EACN,SAAS;EACT,aAAa;EACb,aAAa;EACb,WAAW;CACb;CACA,OAAO;EACL,MAAMC;EACN,SAAS;EACT,aAAa;EACb,aAAa;EACb,WAAW;CACb;CACA,UAAU;EACR,MAAMC;EACN,SAAS;EACT,aAAa;EACb,aAAa;EACb,WAAW;CACb;CACA,SAAS;EACP,MAAMC;EACN,SAAS;EACT,aAAa;EACb,aAAa;EACb,WAAW;CACb;AACF,GAEMC,IAAmF;CACvF,YAAY;CACZ,cAAc;CACd,aAAa;CACb,eAAe;CACf,iBAAiB;CACjB,gBAAgB;AAClB;AAYA,SAAgBC,EAAkB,EAChC,cACA,gBAAa,GACb,cAAW,eACc;CACzB,IAAM,EAAE,gBAAa,uBAAoBC,EAAc,GAGjDC,IAAqBC,EAAgB,cAAc,CAAC,CAAC,MAAM,CAACC,CAAU;CAM5E,OAJIF,EAAmB,WAAW,IACzB,OAIP,kBAAC,OAAD;EACE,WAAWG,EACT,yEACAN,EAAgBO,IAChBC,CACF;EAEC,UAAAL,EAAmB,KAAK,MACvB,kBAACM,GAAD;GAAsC;GAAM,iBAAiBC,EAAYC,EAAK,EAAE;EAAI,GAA7DA,EAAK,EAAwD,CACrF;CACE,CAAA;AAET;AAOA,SAASF,EAAiB,EAAE,SAAM,gBAAoC;CACpE,IAAMG,IAASlB,EAAeiB,EAAK,WAC7BE,IAAOD,EAAO;CAEpB,OACE,kBAAC,OAAD;EACE,WAAWN,EACT,8EACA,4DACAM,EAAO,SACPA,EAAO,WACT;EACA,MAAK;EAPP,UAAA;GASE,kBAAC,OAAD;IAAK,WAAWN,EAAG,oCAAoCM,EAAO,WAAW;IACvE,UAAA,kBAACC,GAAD,EAAM,WAAWP,EAAG,WAAWM,EAAO,SAAS,EAAI,CAAA;GAChD,CAAA;GACL,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,kBAAC,KAAD;KAAG,WAAU;KAAuC,UAAAD,EAAK,MAAM;IAAW,CAAA,GACzEA,EAAK,MAAM,QAAQA,EAAK,MAAM,SAAS,mBACtC,kBAAC,KAAD;KAAG,WAAU;KAAsC,UAAAA,EAAK,MAAM;IAAQ,CAAA,CAErE;;GACL,kBAAC,UAAD;IACE,SAASG;IACT,WAAU;IACV,cAAW;IAEX,UAAA,kBAACjB,GAAD,EAAG,WAAU,UAAW,CAAA;GAClB,CAAA;EACL;;AAET"}
+{"version":3,"file":"ErrorNotification.js","names":["severityConfig","Info","AlertTriangle","X","AlertCircle","CheckCircle","positionClasses","ErrorNotification","useErrorStore","notificationErrors","getErrorsByMode","maxVisible","cn","position","className","NotificationItem","removeError","item","config","Icon","onDismiss"],"sources":["../../../../src/tools/components/error/ErrorNotification.tsx"],"sourcesContent":["import React from 'react';\nimport { X, AlertCircle, AlertTriangle, Info, CheckCircle } from 'lucide-react';\nimport { cn } from \"../../lib/utils\";\nimport { ErrorSeverity } from \"../../lib/error\";\nimport { useErrorStore, ErrorItem } from \"../../lib/state/error-store\";\n\nexport interface ErrorNotificationProps {\n  /** 追加の CSS クラス */\n  className?: string;\n  /** 通知の最大表示数。デフォルト: 5 */\n  maxVisible?: number;\n  /** 表示位置。デフォルト: 'top-right' */\n  position?:\n    | 'top-left'\n    | 'top-center'\n    | 'top-right'\n    | 'bottom-left'\n    | 'bottom-center'\n    | 'bottom-right';\n}\n\nconst severityConfig: Record<\n  ErrorSeverity | 'success',\n  {\n    icon: React.ElementType;\n    bgClass: string;\n    borderClass: string;\n    iconBgClass: string;\n    iconClass: string;\n  }\n> = {\n  info: {\n    icon: Info,\n    bgClass: 'bg-blue-50 dark:bg-blue-950',\n    borderClass: 'border-blue-200 dark:border-blue-800',\n    iconBgClass: 'bg-blue-500',\n    iconClass: 'text-white',\n  },\n  warning: {\n    icon: AlertTriangle,\n    bgClass: 'bg-amber-50 dark:bg-amber-950',\n    borderClass: 'border-amber-200 dark:border-amber-800',\n    iconBgClass: 'bg-amber-500',\n    iconClass: 'text-white',\n  },\n  error: {\n    icon: X,\n    bgClass: 'bg-red-50 dark:bg-red-950',\n    borderClass: 'border-red-200 dark:border-red-800',\n    iconBgClass: 'bg-red-500',\n    iconClass: 'text-white',\n  },\n  critical: {\n    icon: AlertCircle,\n    bgClass: 'bg-red-100 dark:bg-red-950',\n    borderClass: 'border-red-300 dark:border-red-800',\n    iconBgClass: 'bg-red-600',\n    iconClass: 'text-white',\n  },\n  success: {\n    icon: CheckCircle,\n    bgClass: 'bg-green-50 dark:bg-green-950',\n    borderClass: 'border-green-200 dark:border-green-800',\n    iconBgClass: 'bg-green-500',\n    iconClass: 'text-white',\n  },\n};\n\nconst positionClasses: Record<NonNullable<ErrorNotificationProps['position']>, string> = {\n  'top-left': 'top-4 left-4',\n  'top-center': 'top-4 left-1/2 -translate-x-1/2',\n  'top-right': 'top-4 right-4',\n  'bottom-left': 'bottom-4 left-4',\n  'bottom-center': 'bottom-4 left-1/2 -translate-x-1/2',\n  'bottom-right': 'bottom-4 right-4',\n};\n\n/**\n * 通知バナー表示コンポーネント\n * 画面の角に通知を表示します。\n *\n * @example\n * ```tsx\n * // ErrorProvider 内で自動的に使用されます\n * <ErrorNotification position=\"top-right\" maxVisible={3} />\n * ```\n */\nexport function ErrorNotification({\n  className,\n  maxVisible = 5,\n  position = 'top-right',\n}: ErrorNotificationProps) {\n  const { removeError, getErrorsByMode } = useErrorStore();\n\n  // notification モードのエラーのみ表示\n  const notificationErrors = getErrorsByMode('notification').slice(-maxVisible);\n\n  if (notificationErrors.length === 0) {\n    return null;\n  }\n\n  return (\n    <div\n      className={cn(\n        'fixed z-[100] flex flex-col gap-2 w-full max-w-md pointer-events-none',\n        positionClasses[position],\n        className,\n      )}\n    >\n      {notificationErrors.map((item) => (\n        <NotificationItem key={item.id} item={item} onDismiss={() => removeError(item.id)} />\n      ))}\n    </div>\n  );\n}\n\ninterface NotificationItemProps {\n  item: ErrorItem;\n  onDismiss: () => void;\n}\n\nfunction NotificationItem({ item, onDismiss }: NotificationItemProps) {\n  const config = severityConfig[item.severity];\n  const Icon = config.icon;\n\n  return (\n    <div\n      className={cn(\n        'pointer-events-auto flex items-start gap-3 rounded-lg border p-4 shadow-lg',\n        'animate-in slide-in-from-right-full fade-in duration-300',\n        config.bgClass,\n        config.borderClass,\n      )}\n      role='alert'\n    >\n      <div className={cn('rounded-full p-1.5 flex-shrink-0', config.iconBgClass)}>\n        <Icon className={cn('h-4 w-4', config.iconClass)} />\n      </div>\n      <div className='flex-1 min-w-0'>\n        <p className='text-sm font-medium text-foreground'>{item.error.message}</p>\n        {item.error.code && item.error.code !== 'error/unknown' && (\n          <p className='mt-1 text-xs text-muted-foreground'>{item.error.code}</p>\n        )}\n      </div>\n      <button\n        onClick={onDismiss}\n        className='flex-shrink-0 rounded-md p-1 text-muted-foreground hover:text-foreground hover:bg-black/5 dark:hover:bg-white/10 transition-colors'\n        aria-label='Close'\n      >\n        <X className='h-4 w-4' />\n      </button>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAqBA,IAAMA,IASF;CACF,MAAM;EACJ,MAAMC;EACN,SAAS;EACT,aAAa;EACb,aAAa;EACb,WAAW;CACb;CACA,SAAS;EACP,MAAMC;EACN,SAAS;EACT,aAAa;EACb,aAAa;EACb,WAAW;CACb;CACA,OAAO;EACL,MAAMC;EACN,SAAS;EACT,aAAa;EACb,aAAa;EACb,WAAW;CACb;CACA,UAAU;EACR,MAAMC;EACN,SAAS;EACT,aAAa;EACb,aAAa;EACb,WAAW;CACb;CACA,SAAS;EACP,MAAMC;EACN,SAAS;EACT,aAAa;EACb,aAAa;EACb,WAAW;CACb;AACF,GAEMC,IAAmF;CACvF,YAAY;CACZ,cAAc;CACd,aAAa;CACb,eAAe;CACf,iBAAiB;CACjB,gBAAgB;AAClB;AAYA,SAAgBC,EAAkB,EAChC,cACA,gBAAa,GACb,cAAW,eACc;CACzB,IAAM,EAAE,gBAAa,uBAAoBC,EAAc,GAGjDC,IAAqBC,EAAgB,cAAc,CAAC,CAAC,MAAM,CAACC,CAAU;CAM5E,OAJIF,EAAmB,WAAW,IACzB,OAIP,kBAAC,OAAD;EACE,WAAWG,EACT,yEACAN,EAAgBO,IAChBC,CACF;EAEC,UAAAL,EAAmB,KAAK,MACvB,kBAACM,GAAD;GAAsC;GAAM,iBAAiBC,EAAYC,EAAK,EAAE;EAAI,GAA7DA,EAAK,EAAwD,CACrF;CACE,CAAA;AAET;AAOA,SAASF,EAAiB,EAAE,SAAM,gBAAoC;CACpE,IAAMG,IAASlB,EAAeiB,EAAK,WAC7BE,IAAOD,EAAO;CAEpB,OACE,kBAAC,OAAD;EACE,WAAWN,EACT,8EACA,4DACAM,EAAO,SACPA,EAAO,WACT;EACA,MAAK;EAPP,UAAA;GASE,kBAAC,OAAD;IAAK,WAAWN,EAAG,oCAAoCM,EAAO,WAAW;IACvE,UAAA,kBAACC,GAAD,EAAM,WAAWP,EAAG,WAAWM,EAAO,SAAS,EAAI,CAAA;GAChD,CAAA;GACL,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,kBAAC,KAAD;KAAG,WAAU;KAAuC,UAAAD,EAAK,MAAM;IAAW,CAAA,GACzEA,EAAK,MAAM,QAAQA,EAAK,MAAM,SAAS,mBACtC,kBAAC,KAAD;KAAG,WAAU;KAAsC,UAAAA,EAAK,MAAM;IAAQ,CAAA,CAErE;;GACL,kBAAC,UAAD;IACE,SAASG;IACT,WAAU;IACV,cAAW;IAEX,UAAA,kBAACjB,GAAD,EAAG,WAAU,UAAW,CAAA;GAClB,CAAA;EACL;;AAET"}

package/dist/tools/components/file-browser/FilePreview.cjs

@@ -1,2 +1,2 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../ui/components/ui/button-components.cjs"),t=require("../../../ui/components/ui/dialog.cjs"),n=require("../../../ui/components/ui/file-icon.cjs");let r=require("react/jsx-runtime"),i=require("react"),a=require("lucide-react");function o({node:o,url:s,onClose:c}){let[l,u]=(0,i.useState)(!0),[d,f]=(0,i.useState)(null),p=!!o&&!!s,m=o?.contentType?.toLowerCase()||``,h=m.includes(`image/`),g=m.includes(`pdf`),_=m.includes(`text/`)||m.includes(`json`)||m.includes(`javascript`)||m.includes(`typescript`);return(0,i.useEffect)(()=>{p&&_&&s?(queueMicrotask(()=>{u(!0)}),fetch(s).then(e=>e.text()).then(e=>{f(e),u(!1)}).catch(()=>{f(`Failed to load text content.`),u(!1)})):queueMicrotask(()=>{u(!1),f(null)})},[p,_,s]),o?(0,r.jsx)(t.Dialog,{open:p,onOpenChange:e=>!e&&c(),children:(0,r.jsxs)(t.DialogContent,{className:`max-w-4xl w-[90vw] h-[85vh] flex flex-col p-0 overflow-hidden gap-0`,children:[(0,r.jsxs)(t.DialogHeader,{className:`p-4 border-b flex-row items-center justify-between space-y-0`,children:[(0,r.jsxs)(`div`,{className:`flex items-center gap-3 pr-8`,children:[(0,r.jsx)(n.FileIcon,{kind:o.kind,contentType:o.contentType,className:`h-5 w-5`}),(0,r.jsx)(t.DialogTitle,{className:`text-base font-semibold truncate`,children:o.name})]}),(0,r.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,r.jsxs)(e.Button,{variant:`outline`,size:`sm`,className:`h-8 gap-2`,nativeButton:!1,render:(0,r.jsx)(`a`,{href:s||`#`,download:o.name}),children:[(0,r.jsx)(a.Download,{className:`h-3.5 w-3.5`}),(0,r.jsx)(`span`,{children:`Download`})]}),(0,r.jsx)(e.Button,{variant:`ghost`,size:`sm`,className:`h-8`,nativeButton:!1,render:(0,r.jsx)(`a`,{href:s||`#`,target:`_blank`,rel:`noreferrer`,"aria-label":`Open in new tab`}),children:(0,r.jsx)(a.ExternalLink,{className:`h-3.5 w-3.5`})})]})]}),(0,r.jsxs)(`div`,{className:`flex-1 bg-muted/20 relative overflow-auto flex items-center justify-center`,children:[l&&(0,r.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center bg-background/50 z-10`,children:(0,r.jsx)(a.Loader2,{className:`h-8 w-8 animate-spin text-muted-foreground`})}),h&&s&&(0,r.jsx)(`img`,{src:s,alt:o.name,className:`max-w-full max-h-full object-contain shadow-lg`,onLoad:()=>u(!1)}),g&&s&&(0,r.jsx)(`iframe`,{src:`${s}#toolbar=0`,title:o.name,className:`w-full h-full border-none`,onLoad:()=>u(!1)}),_&&d!==null&&(0,r.jsx)(`pre`,{className:`w-full h-full p-6 font-mono text-xs overflow-auto bg-background whitespace-pre-wrap`,children:d}),!h&&!g&&!_&&(0,r.jsxs)(`div`,{className:`text-center p-12`,children:[(0,r.jsx)(n.FileIcon,{kind:o.kind,contentType:o.contentType,className:`h-16 w-16 mx-auto mb-4 opacity-20`}),(0,r.jsx)(`p`,{className:`text-muted-foreground`,children:`Preview not available for this file type.`}),(0,r.jsx)(`p`,{className:`text-xs mt-2`,children:`Please download the file to view it.`})]})]})]})}):null}exports.FilePreview=o;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../ui/components/ui/button-variants.cjs"),t=require("../../../ui/components/ui/dialog.cjs"),n=require("../../../ui/components/ui/file-icon.cjs");let r=require("react/jsx-runtime"),i=require("react"),a=require("lucide-react");function o({node:o,url:s,onClose:c}){let[l,u]=(0,i.useState)(!0),[d,f]=(0,i.useState)(null),p=!!o&&!!s,m=o?.contentType?.toLowerCase()||``,h=m.includes(`image/`),g=m.includes(`pdf`),_=m.includes(`text/`)||m.includes(`json`)||m.includes(`javascript`)||m.includes(`typescript`);return(0,i.useEffect)(()=>{let e=new AbortController;return p&&_&&s?(queueMicrotask(()=>{e.signal.aborted||(u(!0),f(null))}),fetch(s,{signal:e.signal}).then(e=>{if(!e.ok)throw Error(`Failed to load text content.`);return e.text()}).then(t=>{e.signal.aborted||(f(t),u(!1))}).catch(()=>{e.signal.aborted||(f(`Failed to load text content.`),u(!1))})):queueMicrotask(()=>{e.signal.aborted||(u(!1),f(null))}),()=>e.abort()},[p,_,s]),o?(0,r.jsx)(t.Dialog,{open:p,onOpenChange:e=>!e&&c(),children:(0,r.jsxs)(t.DialogContent,{className:`max-w-4xl w-[90vw] h-[85vh] flex flex-col p-0 overflow-hidden gap-0`,children:[(0,r.jsxs)(t.DialogHeader,{className:`p-4 border-b flex-row items-center justify-between space-y-0`,children:[(0,r.jsxs)(`div`,{className:`flex items-center gap-3 pr-8`,children:[(0,r.jsx)(n.FileIcon,{kind:o.kind,contentType:o.contentType,className:`h-5 w-5`}),(0,r.jsx)(t.DialogTitle,{className:`text-base font-semibold truncate`,children:o.name})]}),(0,r.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,r.jsxs)(`a`,{className:e.buttonVariants({variant:`outline`,size:`sm`,className:`h-8 gap-2`}),href:s||`#`,download:o.name,children:[(0,r.jsx)(a.Download,{className:`h-3.5 w-3.5`}),(0,r.jsx)(`span`,{children:`Download`})]}),(0,r.jsx)(`a`,{className:e.buttonVariants({variant:`ghost`,size:`sm`,className:`h-8`}),href:s||`#`,target:`_blank`,rel:`noreferrer`,"aria-label":`Open in new tab`,children:(0,r.jsx)(a.ExternalLink,{className:`h-3.5 w-3.5`})})]})]}),(0,r.jsxs)(`div`,{className:`flex-1 bg-muted/20 relative overflow-auto flex items-center justify-center`,children:[l&&(0,r.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center bg-background/50 z-10`,children:(0,r.jsx)(a.Loader2,{className:`h-8 w-8 animate-spin text-muted-foreground`})}),h&&s&&(0,r.jsx)(`img`,{src:s,alt:o.name,className:`max-w-full max-h-full object-contain shadow-lg`,onLoad:()=>u(!1)}),g&&s&&(0,r.jsx)(`iframe`,{src:`${s}#toolbar=0`,title:o.name,className:`w-full h-full border-none`,onLoad:()=>u(!1)}),_&&d!==null&&(0,r.jsx)(`pre`,{className:`w-full h-full p-6 font-mono text-xs overflow-auto bg-background whitespace-pre-wrap`,children:d}),!h&&!g&&!_&&(0,r.jsxs)(`div`,{className:`text-center p-12`,children:[(0,r.jsx)(n.FileIcon,{kind:o.kind,contentType:o.contentType,className:`h-16 w-16 mx-auto mb-4 opacity-20`}),(0,r.jsx)(`p`,{className:`text-muted-foreground`,children:`Preview not available for this file type.`}),(0,r.jsx)(`p`,{className:`text-xs mt-2`,children:`Please download the file to view it.`})]})]})]})}):null}exports.FilePreview=o;
 //# sourceMappingURL=FilePreview.cjs.map

package/dist/tools/components/file-browser/FilePreview.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FilePreview.cjs","names":["useState","Dialog","DialogContent","DialogHeader","FileIcon","DialogTitle","Button","Download","ExternalLink","Loader2","require_ui_components_ui_button_components","require_ui_components_ui_dialog","require_ui_components_ui_file_icon","react_jsx_runtime","react","lucide_react","FilePreview","loading","setLoading","textContent","setTextContent","isOpen","node","url","mime","isImage","isPdf","isText","res","text","open","onClose"],"sources":["../../../../src/tools/components/file-browser/FilePreview.tsx"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../ui/dialog';\nimport type { FileNode } from './types';\nimport { FileIcon } from '../ui/file-icon';\nimport { Loader2, Download, ExternalLink } from 'lucide-react';\nimport { Button } from '../ui/button';\n\nexport interface FilePreviewProps {\n  /** プレビュー対象のノード */\n  node: FileNode | null;\n  /** 署名付きURL */\n  url: string | null;\n  /** モーダルを閉じる時のコールバック */\n  onClose: () => void;\n}\n\n/**\n * ファイルのプレビューを表示するモーダルコンポーネント\n */\nexport function FilePreview({ node, url, onClose }: FilePreviewProps) {\n  const [loading, setLoading] = useState(true);\n  const [textContent, setTextContent] = useState<string | null>(null);\n\n  const isOpen = !!node && !!url;\n  const mime = node?.contentType?.toLowerCase() || '';\n  const isImage = mime.includes('image/');\n  const isPdf = mime.includes('pdf');\n  const isText =\n    mime.includes('text/') ||\n    mime.includes('json') ||\n    mime.includes('javascript') ||\n    mime.includes('typescript');\n\n  useEffect(() => {\n    if (isOpen && isText && url) {\n      queueMicrotask(() => {\n        setLoading(true);\n      });\n      fetch(url)\n        .then((res) => res.text())\n        .then((text) => {\n          setTextContent(text);\n          setLoading(false);\n        })\n        .catch(() => {\n          setTextContent('Failed to load text content.');\n          setLoading(false);\n        });\n    } else {\n      queueMicrotask(() => {\n        setLoading(false);\n        setTextContent(null);\n      });\n    }\n  }, [isOpen, isText, url]);\n\n  if (!node) return null;\n\n  return (\n    <Dialog open={isOpen} onOpenChange={(open) => !open && onClose()}>\n      <DialogContent className='max-w-4xl w-[90vw] h-[85vh] flex flex-col p-0 overflow-hidden gap-0'>\n        <DialogHeader className='p-4 border-b flex-row items-center justify-between space-y-0'>\n          <div className='flex items-center gap-3 pr-8'>\n            <FileIcon kind={node.kind} contentType={node.contentType} className='h-5 w-5' />\n            <DialogTitle className='text-base font-semibold truncate'>{node.name}</DialogTitle>\n          </div>\n          <div className='flex items-center gap-2'>\n            <Button variant='outline' size='sm' className='h-8 gap-2' nativeButton={false} render={<a href={url || '#'} download={node.name} />}>\n                <Download className='h-3.5 w-3.5' />\n                <span>Download</span>\n            </Button>\n            <Button variant='ghost' size='sm' className='h-8' nativeButton={false} render={<a href={url || '#'} target='_blank' rel='noreferrer' aria-label='Open in new tab' />}>\n                <ExternalLink className='h-3.5 w-3.5' />\n            </Button>\n          </div>\n        </DialogHeader>\n\n        <div className='flex-1 bg-muted/20 relative overflow-auto flex items-center justify-center'>\n          {loading && (\n            <div className='absolute inset-0 flex items-center justify-center bg-background/50 z-10'>\n              <Loader2 className='h-8 w-8 animate-spin text-muted-foreground' />\n            </div>\n          )}\n\n          {isImage && url && (\n            <img\n              src={url}\n              alt={node.name}\n              className='max-w-full max-h-full object-contain shadow-lg'\n              onLoad={() => setLoading(false)}\n            />\n          )}\n\n          {isPdf && url && (\n            <iframe\n              src={`${url}#toolbar=0`}\n              title={node.name}\n              className='w-full h-full border-none'\n              onLoad={() => setLoading(false)}\n            />\n          )}\n\n          {isText && textContent !== null && (\n            <pre className='w-full h-full p-6 font-mono text-xs overflow-auto bg-background whitespace-pre-wrap'>\n              {textContent}\n            </pre>\n          )}\n\n          {!isImage && !isPdf && !isText && (\n            <div className='text-center p-12'>\n              <FileIcon\n                kind={node.kind}\n                contentType={node.contentType}\n                className='h-16 w-16 mx-auto mb-4 opacity-20'\n              />\n              <p className='text-muted-foreground'>Preview not available for this file type.</p>\n              <p className='text-xs mt-2'>Please download the file to view it.</p>\n            </div>\n          )}\n        </div>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"FilePreview.cjs","names":["useState","Dialog","DialogContent","DialogHeader","FileIcon","DialogTitle","buttonVariants","Download","ExternalLink","Loader2","require_ui_components_ui_button_variants","require_ui_components_ui_dialog","require_ui_components_ui_file_icon","react_jsx_runtime","react","lucide_react","FilePreview","loading","setLoading","textContent","setTextContent","isOpen","node","url","mime","isImage","isPdf","isText","controller","res","text","open","onClose"],"sources":["../../../../src/tools/components/file-browser/FilePreview.tsx"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../ui/dialog';\nimport type { FileNode } from './types';\nimport { FileIcon } from '../ui/file-icon';\nimport { Loader2, Download, ExternalLink } from 'lucide-react';\nimport { buttonVariants } from '../ui/button';\n\nexport interface FilePreviewProps {\n  /** プレビュー対象のノード */\n  node: FileNode | null;\n  /** 署名付きURL */\n  url: string | null;\n  /** モーダルを閉じる時のコールバック */\n  onClose: () => void;\n}\n\n/**\n * ファイルのプレビューを表示するモーダルコンポーネント\n */\nexport function FilePreview({ node, url, onClose }: FilePreviewProps) {\n  const [loading, setLoading] = useState(true);\n  const [textContent, setTextContent] = useState<string | null>(null);\n\n  const isOpen = !!node && !!url;\n  const mime = node?.contentType?.toLowerCase() || '';\n  const isImage = mime.includes('image/');\n  const isPdf = mime.includes('pdf');\n  const isText =\n    mime.includes('text/') ||\n    mime.includes('json') ||\n    mime.includes('javascript') ||\n    mime.includes('typescript');\n\n  useEffect(() => {\n    const controller = new AbortController();\n    if (isOpen && isText && url) {\n      queueMicrotask(() => {\n        if (controller.signal.aborted) return;\n        setLoading(true);\n        setTextContent(null);\n      });\n      fetch(url, { signal: controller.signal })\n        .then((res) => {\n          if (!res.ok) throw new Error('Failed to load text content.');\n          return res.text();\n        })\n        .then((text) => {\n          if (controller.signal.aborted) return;\n          setTextContent(text);\n          setLoading(false);\n        })\n        .catch(() => {\n          if (controller.signal.aborted) return;\n          setTextContent('Failed to load text content.');\n          setLoading(false);\n        });\n    } else {\n      queueMicrotask(() => {\n        if (controller.signal.aborted) return;\n        setLoading(false);\n        setTextContent(null);\n      });\n    }\n    return () => controller.abort();\n  }, [isOpen, isText, url]);\n\n  if (!node) return null;\n\n  return (\n    <Dialog open={isOpen} onOpenChange={(open) => !open && onClose()}>\n      <DialogContent className='max-w-4xl w-[90vw] h-[85vh] flex flex-col p-0 overflow-hidden gap-0'>\n        <DialogHeader className='p-4 border-b flex-row items-center justify-between space-y-0'>\n          <div className='flex items-center gap-3 pr-8'>\n            <FileIcon kind={node.kind} contentType={node.contentType} className='h-5 w-5' />\n            <DialogTitle className='text-base font-semibold truncate'>{node.name}</DialogTitle>\n          </div>\n          <div className='flex items-center gap-2'>\n            <a className={buttonVariants({ variant: 'outline', size: 'sm', className: 'h-8 gap-2' })} href={url || '#'} download={node.name}>\n                <Download className='h-3.5 w-3.5' />\n                <span>Download</span>\n            </a>\n            <a className={buttonVariants({ variant: 'ghost', size: 'sm', className: 'h-8' })} href={url || '#'} target='_blank' rel='noreferrer' aria-label='Open in new tab'>\n                <ExternalLink className='h-3.5 w-3.5' />\n            </a>\n          </div>\n        </DialogHeader>\n\n        <div className='flex-1 bg-muted/20 relative overflow-auto flex items-center justify-center'>\n          {loading && (\n            <div className='absolute inset-0 flex items-center justify-center bg-background/50 z-10'>\n              <Loader2 className='h-8 w-8 animate-spin text-muted-foreground' />\n            </div>\n          )}\n\n          {isImage && url && (\n            <img\n              src={url}\n              alt={node.name}\n              className='max-w-full max-h-full object-contain shadow-lg'\n              onLoad={() => setLoading(false)}\n            />\n          )}\n\n          {isPdf && url && (\n            <iframe\n              src={`${url}#toolbar=0`}\n              title={node.name}\n              className='w-full h-full border-none'\n              onLoad={() => setLoading(false)}\n            />\n          )}\n\n          {isText && textContent !== null && (\n            <pre className='w-full h-full p-6 font-mono text-xs overflow-auto bg-background whitespace-pre-wrap'>\n              {textContent}\n            </pre>\n          )}\n\n          {!isImage && !isPdf && !isText && (\n            <div className='text-center p-12'>\n              <FileIcon\n                kind={node.kind}\n                contentType={node.contentType}\n                className='h-16 w-16 mx-auto mb-4 opacity-20'\n              />\n              <p className='text-muted-foreground'>Preview not available for this file type.</p>\n              <p className='text-xs mt-2'>Please download the file to view it.</p>\n            </div>\n          )}\n        </div>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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"}

package/dist/tools/components/file-browser/FilePreview.js

@@ -1,5 +1,5 @@
 "use client";
-import { Button as e } from "../../../ui/components/ui/button-components.js";
+import { buttonVariants as e } from "../../../ui/components/ui/button-variants.js";
 import { Dialog as t, DialogContent as n, DialogHeader as r, DialogTitle as i } from "../../../ui/components/ui/dialog.js";
 import { FileIcon as a } from "../../../ui/components/ui/file-icon.js";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
@@ -9,15 +9,19 @@ import { Download as u, ExternalLink as d, Loader2 as f } from "lucide-react";
 function p({ node: p, url: m, onClose: h }) {
 	let [g, _] = l(!0), [v, y] = l(null), b = !!p && !!m, x = p?.contentType?.toLowerCase() || "", S = x.includes("image/"), C = x.includes("pdf"), w = x.includes("text/") || x.includes("json") || x.includes("javascript") || x.includes("typescript");
 	return c(() => {
-		b && w && m ? (queueMicrotask(() => {
-			_(!0);
-		}), fetch(m).then((e) => e.text()).then((e) => {
-			y(e), _(!1);
+		let e = new AbortController();
+		return b && w && m ? (queueMicrotask(() => {
+			e.signal.aborted || (_(!0), y(null));
+		}), fetch(m, { signal: e.signal }).then((e) => {
+			if (!e.ok) throw Error("Failed to load text content.");
+			return e.text();
+		}).then((t) => {
+			e.signal.aborted || (y(t), _(!1));
 		}).catch(() => {
-			y("Failed to load text content."), _(!1);
+			e.signal.aborted || (y("Failed to load text content."), _(!1));
 		})) : queueMicrotask(() => {
-			_(!1), y(null);
-		});
+			e.signal.aborted || (_(!1), y(null));
+		}), () => e.abort();
 	}, [
 		b,
 		w,
@@ -41,27 +45,25 @@ function p({ node: p, url: m, onClose: h }) {
 					})]
 				}), /* @__PURE__ */ s("div", {
 					className: "flex items-center gap-2",
-					children: [/* @__PURE__ */ s(e, {
-						variant: "outline",
-						size: "sm",
-						className: "h-8 gap-2",
-						nativeButton: !1,
-						render: /* @__PURE__ */ o("a", {
-							href: m || "#",
-							download: p.name
+					children: [/* @__PURE__ */ s("a", {
+						className: e({
+							variant: "outline",
+							size: "sm",
+							className: "h-8 gap-2"
 						}),
+						href: m || "#",
+						download: p.name,
 						children: [/* @__PURE__ */ o(u, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ o("span", { children: "Download" })]
-					}), /* @__PURE__ */ o(e, {
-						variant: "ghost",
-						size: "sm",
-						className: "h-8",
-						nativeButton: !1,
-						render: /* @__PURE__ */ o("a", {
-							href: m || "#",
-							target: "_blank",
-							rel: "noreferrer",
-							"aria-label": "Open in new tab"
+					}), /* @__PURE__ */ o("a", {
+						className: e({
+							variant: "ghost",
+							size: "sm",
+							className: "h-8"
 						}),
+						href: m || "#",
+						target: "_blank",
+						rel: "noreferrer",
+						"aria-label": "Open in new tab",
 						children: /* @__PURE__ */ o(d, { className: "h-3.5 w-3.5" })
 					})]
 				})]

package/dist/tools/components/file-browser/FilePreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilePreview.js","names":["FileIcon","FileIcon$1","FilePreview","loading","setLoading","useState","textContent","setTextContent","isOpen","node","url","mime","isImage","isPdf","isText","useEffect","res","text","Dialog","open","onClose","DialogContent","DialogHeader","DialogTitle","Button","Download","ExternalLink","Loader2"],"sources":["../../../../src/tools/components/file-browser/FilePreview.tsx"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../ui/dialog';\nimport type { FileNode } from './types';\nimport { FileIcon } from '../ui/file-icon';\nimport { Loader2, Download, ExternalLink } from 'lucide-react';\nimport { Button } from '../ui/button';\n\nexport interface FilePreviewProps {\n  /** プレビュー対象のノード */\n  node: FileNode | null;\n  /** 署名付きURL */\n  url: string | null;\n  /** モーダルを閉じる時のコールバック */\n  onClose: () => void;\n}\n\n/**\n * ファイルのプレビューを表示するモーダルコンポーネント\n */\nexport function FilePreview({ node, url, onClose }: FilePreviewProps) {\n  const [loading, setLoading] = useState(true);\n  const [textContent, setTextContent] = useState<string | null>(null);\n\n  const isOpen = !!node && !!url;\n  const mime = node?.contentType?.toLowerCase() || '';\n  const isImage = mime.includes('image/');\n  const isPdf = mime.includes('pdf');\n  const isText =\n    mime.includes('text/') ||\n    mime.includes('json') ||\n    mime.includes('javascript') ||\n    mime.includes('typescript');\n\n  useEffect(() => {\n    if (isOpen && isText && url) {\n      queueMicrotask(() => {\n        setLoading(true);\n      });\n      fetch(url)\n        .then((res) => res.text())\n        .then((text) => {\n          setTextContent(text);\n          setLoading(false);\n        })\n        .catch(() => {\n          setTextContent('Failed to load text content.');\n          setLoading(false);\n        });\n    } else {\n      queueMicrotask(() => {\n        setLoading(false);\n        setTextContent(null);\n      });\n    }\n  }, [isOpen, isText, url]);\n\n  if (!node) return null;\n\n  return (\n    <Dialog open={isOpen} onOpenChange={(open) => !open && onClose()}>\n      <DialogContent className='max-w-4xl w-[90vw] h-[85vh] flex flex-col p-0 overflow-hidden gap-0'>\n        <DialogHeader className='p-4 border-b flex-row items-center justify-between space-y-0'>\n          <div className='flex items-center gap-3 pr-8'>\n            <FileIcon kind={node.kind} contentType={node.contentType} className='h-5 w-5' />\n            <DialogTitle className='text-base font-semibold truncate'>{node.name}</DialogTitle>\n          </div>\n          <div className='flex items-center gap-2'>\n            <Button variant='outline' size='sm' className='h-8 gap-2' nativeButton={false} render={<a href={url || '#'} download={node.name} />}>\n                <Download className='h-3.5 w-3.5' />\n                <span>Download</span>\n            </Button>\n            <Button variant='ghost' size='sm' className='h-8' nativeButton={false} render={<a href={url || '#'} target='_blank' rel='noreferrer' aria-label='Open in new tab' />}>\n                <ExternalLink className='h-3.5 w-3.5' />\n            </Button>\n          </div>\n        </DialogHeader>\n\n        <div className='flex-1 bg-muted/20 relative overflow-auto flex items-center justify-center'>\n          {loading && (\n            <div className='absolute inset-0 flex items-center justify-center bg-background/50 z-10'>\n              <Loader2 className='h-8 w-8 animate-spin text-muted-foreground' />\n            </div>\n          )}\n\n          {isImage && url && (\n            <img\n              src={url}\n              alt={node.name}\n              className='max-w-full max-h-full object-contain shadow-lg'\n              onLoad={() => setLoading(false)}\n            />\n          )}\n\n          {isPdf && url && (\n            <iframe\n              src={`${url}#toolbar=0`}\n              title={node.name}\n              className='w-full h-full border-none'\n              onLoad={() => setLoading(false)}\n            />\n          )}\n\n          {isText && textContent !== null && (\n            <pre className='w-full h-full p-6 font-mono text-xs overflow-auto bg-background whitespace-pre-wrap'>\n              {textContent}\n            </pre>\n          )}\n\n          {!isImage && !isPdf && !isText && (\n            <div className='text-center p-12'>\n              <FileIcon\n                kind={node.kind}\n                contentType={node.contentType}\n                className='h-16 w-16 mx-auto mb-4 opacity-20'\n              />\n              <p className='text-muted-foreground'>Preview not available for this file type.</p>\n              <p className='text-xs mt-2'>Please download the file to view it.</p>\n            </div>\n          )}\n        </div>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"FilePreview.js","names":["FileIcon","FileIcon$1","FilePreview","loading","setLoading","useState","textContent","setTextContent","isOpen","node","url","mime","isImage","isPdf","isText","useEffect","controller","res","text","Dialog","open","onClose","DialogContent","DialogHeader","DialogTitle","buttonVariants","Download","ExternalLink","Loader2"],"sources":["../../../../src/tools/components/file-browser/FilePreview.tsx"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../ui/dialog';\nimport type { FileNode } from './types';\nimport { FileIcon } from '../ui/file-icon';\nimport { Loader2, Download, ExternalLink } from 'lucide-react';\nimport { buttonVariants } from '../ui/button';\n\nexport interface FilePreviewProps {\n  /** プレビュー対象のノード */\n  node: FileNode | null;\n  /** 署名付きURL */\n  url: string | null;\n  /** モーダルを閉じる時のコールバック */\n  onClose: () => void;\n}\n\n/**\n * ファイルのプレビューを表示するモーダルコンポーネント\n */\nexport function FilePreview({ node, url, onClose }: FilePreviewProps) {\n  const [loading, setLoading] = useState(true);\n  const [textContent, setTextContent] = useState<string | null>(null);\n\n  const isOpen = !!node && !!url;\n  const mime = node?.contentType?.toLowerCase() || '';\n  const isImage = mime.includes('image/');\n  const isPdf = mime.includes('pdf');\n  const isText =\n    mime.includes('text/') ||\n    mime.includes('json') ||\n    mime.includes('javascript') ||\n    mime.includes('typescript');\n\n  useEffect(() => {\n    const controller = new AbortController();\n    if (isOpen && isText && url) {\n      queueMicrotask(() => {\n        if (controller.signal.aborted) return;\n        setLoading(true);\n        setTextContent(null);\n      });\n      fetch(url, { signal: controller.signal })\n        .then((res) => {\n          if (!res.ok) throw new Error('Failed to load text content.');\n          return res.text();\n        })\n        .then((text) => {\n          if (controller.signal.aborted) return;\n          setTextContent(text);\n          setLoading(false);\n        })\n        .catch(() => {\n          if (controller.signal.aborted) return;\n          setTextContent('Failed to load text content.');\n          setLoading(false);\n        });\n    } else {\n      queueMicrotask(() => {\n        if (controller.signal.aborted) return;\n        setLoading(false);\n        setTextContent(null);\n      });\n    }\n    return () => controller.abort();\n  }, [isOpen, isText, url]);\n\n  if (!node) return null;\n\n  return (\n    <Dialog open={isOpen} onOpenChange={(open) => !open && onClose()}>\n      <DialogContent className='max-w-4xl w-[90vw] h-[85vh] flex flex-col p-0 overflow-hidden gap-0'>\n        <DialogHeader className='p-4 border-b flex-row items-center justify-between space-y-0'>\n          <div className='flex items-center gap-3 pr-8'>\n            <FileIcon kind={node.kind} contentType={node.contentType} className='h-5 w-5' />\n            <DialogTitle className='text-base font-semibold truncate'>{node.name}</DialogTitle>\n          </div>\n          <div className='flex items-center gap-2'>\n            <a className={buttonVariants({ variant: 'outline', size: 'sm', className: 'h-8 gap-2' })} href={url || '#'} download={node.name}>\n                <Download className='h-3.5 w-3.5' />\n                <span>Download</span>\n            </a>\n            <a className={buttonVariants({ variant: 'ghost', size: 'sm', className: 'h-8' })} href={url || '#'} target='_blank' rel='noreferrer' aria-label='Open in new tab'>\n                <ExternalLink className='h-3.5 w-3.5' />\n            </a>\n          </div>\n        </DialogHeader>\n\n        <div className='flex-1 bg-muted/20 relative overflow-auto flex items-center justify-center'>\n          {loading && (\n            <div className='absolute inset-0 flex items-center justify-center bg-background/50 z-10'>\n              <Loader2 className='h-8 w-8 animate-spin text-muted-foreground' />\n            </div>\n          )}\n\n          {isImage && url && (\n            <img\n              src={url}\n              alt={node.name}\n              className='max-w-full max-h-full object-contain shadow-lg'\n              onLoad={() => setLoading(false)}\n            />\n          )}\n\n          {isPdf && url && (\n            <iframe\n              src={`${url}#toolbar=0`}\n              title={node.name}\n              className='w-full h-full border-none'\n              onLoad={() => setLoading(false)}\n            />\n          )}\n\n          {isText && textContent !== null && (\n            <pre className='w-full h-full p-6 font-mono text-xs overflow-auto bg-background whitespace-pre-wrap'>\n              {textContent}\n            </pre>\n          )}\n\n          {!isImage && !isPdf && !isText && (\n            <div className='text-center p-12'>\n              <FileIcon\n                kind={node.kind}\n                contentType={node.contentType}\n                className='h-16 w-16 mx-auto mb-4 opacity-20'\n              />\n              <p className='text-muted-foreground'>Preview not available for this file type.</p>\n              <p className='text-xs mt-2'>Please download the file to view it.</p>\n            </div>\n          )}\n        </div>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;;;;AAmBA,SAAgBE,EAAY,EAAE,SAAM,QAAK,cAA6B;CACpE,IAAM,CAACC,GAASC,KAAcC,EAAS,EAAI,GACrC,CAACC,GAAaC,KAAkBF,EAAwB,IAAI,GAE5DG,IAAS,CAAC,CAACC,KAAQ,CAAC,CAACC,GACrBC,IAAOF,GAAM,aAAa,YAAY,KAAK,IAC3CG,IAAUD,EAAK,SAAS,QAAQ,GAChCE,IAAQF,EAAK,SAAS,KAAK,GAC3BG,IACJH,EAAK,SAAS,OAAO,KACrBA,EAAK,SAAS,MAAM,KACpBA,EAAK,SAAS,YAAY,KAC1BA,EAAK,SAAS,YAAY;CAqC5B,OAnCAI,QAAgB;EACd,IAAMC,IAAa,IAAI,gBAAgB;EA6BvC,OA5BIR,KAAUM,KAAUJ,KACtB,qBAAqB;GACnB,AAAIM,EAAW,OAAO,YACtBZ,EAAW,EAAI,GACfG,EAAe,IAAI;EACrB,CAAC,GACD,MAAMG,GAAK,EAAE,QAAQM,EAAW,OAAO,CAAC,CAAC,CACtC,MAAM,MAAQ;GACb,IAAI,CAACC,EAAI,IAAI,MAAU,MAAM,8BAA8B;GAC3D,OAAOA,EAAI,KAAK;EAClB,CAAC,CAAC,CACD,MAAM,MAAS;GACd,AAAID,EAAW,OAAO,YACtBT,EAAeW,CAAI,GACnBd,EAAW,EAAK;EAClB,CAAC,CAAC,CACD,YAAY;GACX,AAAIY,EAAW,OAAO,YACtBT,EAAe,8BAA8B,GAC7CH,EAAW,EAAK;EAClB,CAAC,KAEH,qBAAqB;GACnB,AAAIY,EAAW,OAAO,YACtBZ,EAAW,EAAK,GAChBG,EAAe,IAAI;EACrB,CAAC,SAEUS,EAAW,MAAM;CAChC,GAAG;EAACR;EAAQM;EAAQJ;CAAG,CAAC,GAEnBD,IAGH,kBAACU,GAAD;EAAQ,MAAMX;EAAQ,eAAe,MAAS,CAACY,KAAQC,EAAQ;EAC7D,UAAA,kBAACC,GAAD;GAAe,WAAU;GAAzB,UAAA,CACE,kBAACC,GAAD;IAAc,WAAU;IAAxB,UAAA,CACE,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACE,kBAACvB,GAAD;MAAU,MAAMS,EAAK;MAAM,aAAaA,EAAK;MAAa,WAAU;KAAW,CAAA,GAC/E,kBAACe,GAAD;MAAa,WAAU;MAAoC,UAAAf,EAAK;KAAkB,CAAA,CAC/E;IACL,CAAA,GAAA,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACE,kBAAC,KAAD;MAAG,WAAWgB,EAAe;OAAE,SAAS;OAAW,MAAM;OAAM,WAAW;MAAY,CAAC;MAAG,MAAMf,KAAO;MAAK,UAAUD,EAAK;MAA3H,UAAA,CACI,kBAACiB,GAAD,EAAU,WAAU,cAAe,CAAA,GACnC,kBAAC,QAAD,EAAA,UAAM,WAAc,CAAA,CACrB;KACH,CAAA,GAAA,kBAAC,KAAD;MAAG,WAAWD,EAAe;OAAE,SAAS;OAAS,MAAM;OAAM,WAAW;MAAM,CAAC;MAAG,MAAMf,KAAO;MAAK,QAAO;MAAS,KAAI;MAAa,cAAW;MAC5I,UAAA,kBAACiB,GAAD,EAAc,WAAU,cAAe,CAAA;KACxC,CAAA,CACA;IACO,CAAA,CAAA;GAEd,CAAA,GAAA,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACGxB,KACC,kBAAC,OAAD;MAAK,WAAU;MACb,UAAA,kBAACyB,GAAD,EAAS,WAAU,6CAA8C,CAAA;KAC9D,CAAA;KAGNhB,KAAWF,KACV,kBAAC,OAAD;MACE,KAAKA;MACL,KAAKD,EAAK;MACV,WAAU;MACV,cAAcL,EAAW,EAAK;KAC/B,CAAA;KAGFS,KAASH,KACR,kBAAC,UAAD;MACE,KAAK,GAAGA,EAAI;MACZ,OAAOD,EAAK;MACZ,WAAU;MACV,cAAcL,EAAW,EAAK;KAC/B,CAAA;KAGFU,KAAUR,MAAgB,QACzB,kBAAC,OAAD;MAAK,WAAU;MACZ,UAAAA;KACE,CAAA;KAGN,CAACM,KAAW,CAACC,KAAS,CAACC,KACtB,kBAAC,OAAD;MAAK,WAAU;MAAf,UAAA;OACE,kBAACd,GAAD;QACE,MAAMS,EAAK;QACX,aAAaA,EAAK;QAClB,WAAU;OACX,CAAA;OACD,kBAAC,KAAD;QAAG,WAAU;QAAwB,UAAA;OAA4C,CAAA;OACjF,kBAAC,KAAD;QAAG,WAAU;QAAe,UAAA;OAAuC,CAAA;MAChE;;IAEJ;GACQ,CAAA,CAAA;;CACT,CAAA,IAjEQ;AAmEpB"}

package/dist/tools/components/filter/filter.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"filter.cjs","names":["useFilter","cn","FieldFactory","FilterInput","Button","require_ui_lib_utils","require_ui_components_ui_button_components","require_tools_components_ui_field","require_filter_apply","require_filter_reset","require_tools_components_filter_use_filter","require_tools_components_filter_filter_inputs","react_jsx_runtime","SchemaFilter","fieldSpecs","globalLabelPosition","globalLabelWidth","globalOverlappingLabel","globalShowPlaceholderOnAll","globalInputClassName","autoApply","onChange","displayApplyLabel","applyLabel","displayResetLabel","resetLabel","handleApply","filter","handleReset","reset","testId","className","fields","field","values","setField","value","debounceMs","isEmpty"],"sources":["../../../../src/tools/components/filter/filter.tsx"],"sourcesContent":["/**\n * @fileoverview フィルターUIコンポーネント\n *\n * スキーマベースのフィルターUIを提供します。\n * useFilterフックと各種フィルター入力を組み合わせて、\n * 完全なフィルタリングUIを構築します。\n *\n * @module filter/filter\n */\n\n'use client';\n\nimport * as m from '../../paraglide/messages.js';\nimport { cn } from \"../../lib/utils\";\nimport { Button } from '../ui/button';\nimport { FilterInput } from './filter-inputs';\nimport { useFilter } from './use-filter';\nimport { FilterProps, FilterResult } from './filter-types';\nimport { FieldFactory } from '../ui/field';\n\n// =============================================================================\n// Filter Component\n// =============================================================================\n\n/**\n * Filter Component\n * フィルターUIコンポーネント\n *\n * Schema-based filter UI with type inference.\n * スキーマからフィールド型を推論し、適切なフィルター入力を自動選択します。\n * MongoDBスタイルのフィルターオブジェクトを生成し、useFindと連携できます。\n *\n * ## AI/Automation Features\n * - `data-testid`: Container, apply/reset buttons\n * - Pattern: `{testId}`, `{testId}-apply`, `{testId}-reset`\n * - Filter inputs auto-generate testId from field name\n *\n * @example Basic usage with testId\n * ```tsx\n * <Filter\n *   testId=\"user-filter\"\n *   schema={userSchema}\n *   fields={['name', 'age', 'status']}\n *   showPlaceholderOnAll={true}\n *   onChange={(filter) => setQueryFilter(filter)}\n * />\n * // Container: data-testid=\"user-filter\"\n * // Apply button: data-testid=\"user-filter-apply\"\n * // Reset button: data-testid=\"user-filter-reset\"\n * // Filter inputs auto-generate testId from field name\n *\n * @example Customizing filter widths\n * ```tsx\n * <Filter\n *   schema={userSchema}\n *   fields={[\n *     { field: 'name', className: 'min-w-[300px]' }, // Specific field\n *     'status'\n *   ]}\n *   inputClassName=\"min-w-[200px]\" // Global default for this instance\n * />\n * ```\n */\nexport function SchemaFilter({\n  testId,\n  schema,\n  fields: fieldSpecs,\n  defaultValues,\n  onChange,\n  autoApply = true,\n  applyLabel = '適用',\n  resetLabel,\n  className,\n  labelPosition: globalLabelPosition,\n  labelWidth: globalLabelWidth,\n  overlappingLabel: globalOverlappingLabel,\n  showPlaceholderOnAll: globalShowPlaceholderOnAll,\n  inputClassName: globalInputClassName,\n  locale, // Add locale to destructured props\n  debounceMs,\n}: FilterProps) {\n  const { values, filter, fields, setField, reset, isEmpty } = useFilter({\n    schema,\n    fields: fieldSpecs,\n    defaultValues,\n    onChange: autoApply ? onChange : undefined,\n    debounceMs,\n  });\n\n  const displayApplyLabel = applyLabel || m.filter_apply();\n  const displayResetLabel = resetLabel || m.filter_reset();\n\n  /**\n   * 適用ボタンのハンドラー\n   */\n  const handleApply = () => {\n    onChange?.(filter);\n  };\n\n  /**\n   * リセットボタンのハンドラー\n   */\n  const handleReset = () => {\n    reset();\n    if (!autoApply) {\n      onChange?.({});\n    }\n  };\n\n  return (\n    <div\n      data-testid={testId}\n      className={cn(\n        'w-full',\n        'grid gap-x-4 gap-y-2',\n        // Responsive grid: 1 column on small screens, 2 columns on sm+\n        'grid-cols-1 sm:grid-cols-2',\n        className,\n      )}\n    >\n      {fields.map((field) => (\n        <FieldFactory\n          key={field.field}\n          data-testid={testId ? `${testId}-${field.field}` : undefined}\n          label={field.label}\n          labelPosition={field.labelPosition || globalLabelPosition || 'responsive'}\n          labelWidth={field.labelWidth || globalLabelWidth}\n          overlappingLabel={\n            field.overlappingLabel !== undefined ? field.overlappingLabel : globalOverlappingLabel\n          }\n          showPlaceholderOnAll={\n            field.showPlaceholderOnAll !== undefined\n              ? field.showPlaceholderOnAll\n              : globalShowPlaceholderOnAll\n          }\n        >\n          <FilterInput\n            field={field}\n            value={values[field.field]}\n            onChange={(value) => setField(field.field, value)}\n            showPlaceholderOnAll={\n              field.showPlaceholderOnAll !== undefined\n                ? field.showPlaceholderOnAll\n                : globalShowPlaceholderOnAll\n            }\n            className={field.className || globalInputClassName}\n            locale={locale} // Pass locale down\n            debounceMs={field.debounceMs !== undefined ? field.debounceMs : debounceMs}\n          />\n        </FieldFactory>\n      ))}\n\n      {/* ボタン（autoApply=falseの場合のみ表示） */}\n      {!autoApply && (\n        <div className='flex items-end gap-2'>\n          <Button\n            testId={testId ? `${testId}-apply` : undefined}\n            onClick={handleApply}\n            variant='default'\n          >\n            {displayApplyLabel}\n          </Button>\n          <Button\n            testId={testId ? `${testId}-reset` : undefined}\n            onClick={handleReset}\n            variant='outline'\n            disabled={isEmpty}\n          >\n            {displayResetLabel}\n          </Button>\n        </div>\n      )}\n\n      {/* autoApply時のリセットボタン */}\n      {autoApply && !isEmpty && (\n        <div className='flex items-end'>\n          <Button\n            testId={testId ? `${testId}-reset` : undefined}\n            onClick={handleReset}\n            variant='ghost'\n            size='sm'\n          >\n            {displayResetLabel}\n          </Button>\n        </div>\n      )}\n    </div>\n  );\n}\nSchemaFilter.displayName = 'SchemaFilter';\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nexport type { FilterProps, FilterResult };\n"],"mappings":"A,obA+DA,SAAgBa,EAAa,CAC3B,SACA,SACA,OAAQC,EACR,gBACA,WACA,YAAY,GACZ,aAAa,KACb,aACA,YACA,cAAeC,EACf,WAAYC,EACZ,iBAAkBC,EAClB,qBAAsBC,EACtB,eAAgBC,EAChB,SACA,cACc,CACd,GAAM,CAAE,SAAQ,SAAQ,SAAQ,WAAU,QAAO,WAAYnB,EAAAA,UAAU,CACrE,SACA,OAAQc,EACR,gBACA,SAAUM,EAAYC,EAAW,IAAA,GACjC,YACF,CAAC,EAEKC,EAAoBC,GAAAf,EAAA,aAA6B,EACjDgB,EAAoBC,GAAAhB,EAAA,aAA6B,EAKjDiB,MAAoB,CACxBL,IAAWM,CAAM,CACnB,EAKMC,MAAoB,CACxBC,EAAM,EACDT,GACHC,IAAW,CAAC,CAAC,CAEjB,EAEA,OACE,EAAAT,EAAA,KAAA,CAAC,MAAD,CACE,cAAakB,EACb,UAAW7B,EAAAA,GACT,SACA,uBAEA,6BACA8B,CACF,EARF,SAAA,CAUGC,EAAO,IAAK,IACX,EAAApB,EAAA,IAAA,CAACV,EAAAA,aAAD,CAEE,cAAa4B,EAAS,GAAGA,EAAO,GAAGG,EAAM,QAAU,IAAA,GACnD,MAAOA,EAAM,MACb,cAAeA,EAAM,eAAiBlB,GAAuB,aAC7D,WAAYkB,EAAM,YAAcjB,EAChC,iBACEiB,EAAM,mBAAqB,IAAA,GAAqChB,EAAzBgB,EAAM,iBAE/C,qBACEA,EAAM,uBAAyB,IAAA,GAE3Bf,EADAe,EAAM,qBAIZ,UAAA,EAAArB,EAAA,IAAA,CAACT,EAAAA,YAAD,CACS,QACP,MAAO+B,EAAOD,EAAM,OACpB,SAAW,GAAUE,EAASF,EAAM,MAAOG,CAAK,EAChD,qBACEH,EAAM,uBAAyB,IAAA,GAE3Bf,EADAe,EAAM,qBAGZ,UAAWA,EAAM,WAAad,EACtB,SACR,WAAYc,EAAM,aAAe,IAAA,GAA+BI,EAAnBJ,EAAM,UACpD,CAAA,CACW,EA3BPA,EAAM,KA2BC,CACf,EAGA,CAACb,IACA,EAAAR,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,uBAAf,SAAA,EACE,EAAAA,EAAA,IAAA,CAACR,EAAAA,OAAD,CACE,OAAQ0B,EAAS,GAAGA,EAAO,QAAU,IAAA,GACrC,QAASJ,EACT,QAAQ,UAEP,SAAAJ,CACK,CAAA,GACR,EAAAV,EAAA,IAAA,CAACR,EAAAA,OAAD,CACE,OAAQ0B,EAAS,GAAGA,EAAO,QAAU,IAAA,GACrC,QAASF,EACT,QAAQ,UACR,SAAUU,EAET,SAAAd,CACK,CAAA,CACL,C,GAINJ,GAAa,CAACkB,IACb,EAAA1B,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,iBACb,UAAA,EAAAA,EAAA,IAAA,CAACR,EAAAA,OAAD,CACE,OAAQ0B,EAAS,GAAGA,EAAO,QAAU,IAAA,GACrC,QAASF,EACT,QAAQ,QACR,KAAK,KAEJ,SAAAJ,CACK,CAAA,CACL,CAAA,CAEJ,C,EAET,CACA,EAAa,YAAc,e"}
+{"version":3,"file":"filter.cjs","names":["useFilter","cn","FieldFactory","FilterInput","Button","require_ui_lib_utils","require_ui_components_ui_button_components","require_tools_components_ui_field","require_filter_apply","require_filter_reset","require_tools_components_filter_use_filter","require_tools_components_filter_filter_inputs","react_jsx_runtime","SchemaFilter","fieldSpecs","globalLabelPosition","globalLabelWidth","globalOverlappingLabel","globalShowPlaceholderOnAll","globalInputClassName","autoApply","onChange","displayApplyLabel","applyLabel","displayResetLabel","resetLabel","handleApply","filter","handleReset","reset","testId","className","fields","field","values","setField","value","debounceMs","isEmpty"],"sources":["../../../../src/tools/components/filter/filter.tsx"],"sourcesContent":["/**\n * @fileoverview フィルターUIコンポーネント\n *\n * スキーマベースのフィルターUIを提供します。\n * useFilterフックと各種フィルター入力を組み合わせて、\n * 完全なフィルタリングUIを構築します。\n *\n * @module filter/filter\n */\n\n'use client';\n\nimport * as m from '../../paraglide/messages.js';\nimport { cn } from \"../../lib/utils\";\nimport { Button } from '../ui/button';\nimport { FilterInput } from './filter-inputs';\nimport { useFilter } from './use-filter';\nimport { FilterProps, FilterResult } from './filter-types';\nimport { FieldFactory } from '../ui/field';\n\n// =============================================================================\n// Filter Component\n// =============================================================================\n\n/**\n * Renders schema-derived filter inputs and emits a MongoDB-style filter object.\n * @param props - Field specifications, optional collection schema, labels and change callback; see {@link FilterProps}.\n * @returns A responsive filter grid with apply/reset buttons when autoApply is false.\n * @remarks Import Appkit CSS. This component creates local filter state; the host must apply the\n * emitted filter to its own data query. autoApply defaults to true; false defers onChange\n * until Apply or Reset. Reset emits an empty filter in manual mode. layout is currently ignored.\n * With testId, the root uses data-testid=testId and field wrappers use `${testId}-${field}`.\n * Manual apply/reset buttons use `${testId}-apply` and `${testId}-reset`; they are absent in auto mode.\n * @example\n * ```tsx\n * import { useState } from 'react';\n * import { SchemaFilter, type CollectionSchema, type FilterResult } from '@alneas/appkit-react/tools/filter';\n * import '@alneas/appkit-react/styles';\n *\n * const schema: CollectionSchema = {\n *   name: { type: 'string', label: 'Name' },\n *   status: { type: 'enum', enum: ['active', 'inactive'], label: 'Status' },\n * };\n * export function UserFilter() {\n *   const [filter, setFilter] = useState<FilterResult>({});\n *   return <><SchemaFilter testId=\"user-filter\" schema={schema} autoApply={false}\n *     fields={[{ field: 'name', className: 'min-w-[300px]' }, 'status']}\n *     inputClassName=\"min-w-[200px]\" onChange={setFilter} />\n *     <pre>{JSON.stringify(filter)}</pre></>;\n * }\n * ```\n */\nexport function SchemaFilter({\n  testId,\n  schema,\n  fields: fieldSpecs,\n  defaultValues,\n  onChange,\n  autoApply = true,\n  applyLabel = '適用',\n  resetLabel,\n  className,\n  labelPosition: globalLabelPosition,\n  labelWidth: globalLabelWidth,\n  overlappingLabel: globalOverlappingLabel,\n  showPlaceholderOnAll: globalShowPlaceholderOnAll,\n  inputClassName: globalInputClassName,\n  locale, // Add locale to destructured props\n  debounceMs,\n}: FilterProps) {\n  const { values, filter, fields, setField, reset, isEmpty } = useFilter({\n    schema,\n    fields: fieldSpecs,\n    defaultValues,\n    onChange: autoApply ? onChange : undefined,\n    debounceMs,\n  });\n\n  const displayApplyLabel = applyLabel || m.filter_apply();\n  const displayResetLabel = resetLabel || m.filter_reset();\n\n  /**\n   * 適用ボタンのハンドラー\n   */\n  const handleApply = () => {\n    onChange?.(filter);\n  };\n\n  /**\n   * リセットボタンのハンドラー\n   */\n  const handleReset = () => {\n    reset();\n    if (!autoApply) {\n      onChange?.({});\n    }\n  };\n\n  return (\n    <div\n      data-testid={testId}\n      className={cn(\n        'w-full',\n        'grid gap-x-4 gap-y-2',\n        // Responsive grid: 1 column on small screens, 2 columns on sm+\n        'grid-cols-1 sm:grid-cols-2',\n        className,\n      )}\n    >\n      {fields.map((field) => (\n        <FieldFactory\n          key={field.field}\n          data-testid={testId ? `${testId}-${field.field}` : undefined}\n          label={field.label}\n          labelPosition={field.labelPosition || globalLabelPosition || 'responsive'}\n          labelWidth={field.labelWidth || globalLabelWidth}\n          overlappingLabel={\n            field.overlappingLabel !== undefined ? field.overlappingLabel : globalOverlappingLabel\n          }\n          showPlaceholderOnAll={\n            field.showPlaceholderOnAll !== undefined\n              ? field.showPlaceholderOnAll\n              : globalShowPlaceholderOnAll\n          }\n        >\n          <FilterInput\n            field={field}\n            value={values[field.field]}\n            onChange={(value) => setField(field.field, value)}\n            showPlaceholderOnAll={\n              field.showPlaceholderOnAll !== undefined\n                ? field.showPlaceholderOnAll\n                : globalShowPlaceholderOnAll\n            }\n            className={field.className || globalInputClassName}\n            locale={locale} // Pass locale down\n            debounceMs={field.debounceMs !== undefined ? field.debounceMs : debounceMs}\n          />\n        </FieldFactory>\n      ))}\n\n      {/* ボタン（autoApply=falseの場合のみ表示） */}\n      {!autoApply && (\n        <div className='flex items-end gap-2'>\n          <Button\n            testId={testId ? `${testId}-apply` : undefined}\n            onClick={handleApply}\n            variant='default'\n          >\n            {displayApplyLabel}\n          </Button>\n          <Button\n            testId={testId ? `${testId}-reset` : undefined}\n            onClick={handleReset}\n            variant='outline'\n            disabled={isEmpty}\n          >\n            {displayResetLabel}\n          </Button>\n        </div>\n      )}\n\n      {/* autoApply時のリセットボタン */}\n      {autoApply && !isEmpty && (\n        <div className='flex items-end'>\n          <Button\n            testId={testId ? `${testId}-reset` : undefined}\n            onClick={handleReset}\n            variant='ghost'\n            size='sm'\n          >\n            {displayResetLabel}\n          </Button>\n        </div>\n      )}\n    </div>\n  );\n}\nSchemaFilter.displayName = 'SchemaFilter';\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nexport type { FilterProps, FilterResult };\n"],"mappings":"A,obAoDA,SAAgBa,EAAa,CAC3B,SACA,SACA,OAAQC,EACR,gBACA,WACA,YAAY,GACZ,aAAa,KACb,aACA,YACA,cAAeC,EACf,WAAYC,EACZ,iBAAkBC,EAClB,qBAAsBC,EACtB,eAAgBC,EAChB,SACA,cACc,CACd,GAAM,CAAE,SAAQ,SAAQ,SAAQ,WAAU,QAAO,WAAYnB,EAAAA,UAAU,CACrE,SACA,OAAQc,EACR,gBACA,SAAUM,EAAYC,EAAW,IAAA,GACjC,YACF,CAAC,EAEKC,EAAoBC,GAAAf,EAAA,aAA6B,EACjDgB,EAAoBC,GAAAhB,EAAA,aAA6B,EAKjDiB,MAAoB,CACxBL,IAAWM,CAAM,CACnB,EAKMC,MAAoB,CACxBC,EAAM,EACDT,GACHC,IAAW,CAAC,CAAC,CAEjB,EAEA,OACE,EAAAT,EAAA,KAAA,CAAC,MAAD,CACE,cAAakB,EACb,UAAW7B,EAAAA,GACT,SACA,uBAEA,6BACA8B,CACF,EARF,SAAA,CAUGC,EAAO,IAAK,IACX,EAAApB,EAAA,IAAA,CAACV,EAAAA,aAAD,CAEE,cAAa4B,EAAS,GAAGA,EAAO,GAAGG,EAAM,QAAU,IAAA,GACnD,MAAOA,EAAM,MACb,cAAeA,EAAM,eAAiBlB,GAAuB,aAC7D,WAAYkB,EAAM,YAAcjB,EAChC,iBACEiB,EAAM,mBAAqB,IAAA,GAAqChB,EAAzBgB,EAAM,iBAE/C,qBACEA,EAAM,uBAAyB,IAAA,GAE3Bf,EADAe,EAAM,qBAIZ,UAAA,EAAArB,EAAA,IAAA,CAACT,EAAAA,YAAD,CACS,QACP,MAAO+B,EAAOD,EAAM,OACpB,SAAW,GAAUE,EAASF,EAAM,MAAOG,CAAK,EAChD,qBACEH,EAAM,uBAAyB,IAAA,GAE3Bf,EADAe,EAAM,qBAGZ,UAAWA,EAAM,WAAad,EACtB,SACR,WAAYc,EAAM,aAAe,IAAA,GAA+BI,EAAnBJ,EAAM,UACpD,CAAA,CACW,EA3BPA,EAAM,KA2BC,CACf,EAGA,CAACb,IACA,EAAAR,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,uBAAf,SAAA,EACE,EAAAA,EAAA,IAAA,CAACR,EAAAA,OAAD,CACE,OAAQ0B,EAAS,GAAGA,EAAO,QAAU,IAAA,GACrC,QAASJ,EACT,QAAQ,UAEP,SAAAJ,CACK,CAAA,GACR,EAAAV,EAAA,IAAA,CAACR,EAAAA,OAAD,CACE,OAAQ0B,EAAS,GAAGA,EAAO,QAAU,IAAA,GACrC,QAASF,EACT,QAAQ,UACR,SAAUU,EAET,SAAAd,CACK,CAAA,CACL,C,GAINJ,GAAa,CAACkB,IACb,EAAA1B,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,iBACb,UAAA,EAAAA,EAAA,IAAA,CAACR,EAAAA,OAAD,CACE,OAAQ0B,EAAS,GAAGA,EAAO,QAAU,IAAA,GACrC,QAASF,EACT,QAAQ,QACR,KAAK,KAEJ,SAAAJ,CACK,CAAA,CACL,CAAA,CAEJ,C,EAET,CACA,EAAa,YAAc,e"}