@burdenoff/microfe-files 2026.527.1 → 2026.527.3

package/dist/files/components/ShareDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"ShareDialog.js","names":[],"sources":["../../../src/files/components/ShareDialog.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport {\n  X,\n  Link,\n  Mail,\n  Calendar,\n  Download,\n  Lock,\n  Copy,\n  Check,\n  Loader2,\n} from \"lucide-react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport type { FileItem, FolderItem } from \"../types\";\nimport { tWithFallback } from \"../utils/i18n\";\n\nexport interface ShareDialogInput {\n  fileId?: string;\n  folderId?: string;\n  shareType: \"PUBLIC_LINK\" | \"EMAIL_INVITE\";\n  accessLevel: \"VIEW\" | \"DOWNLOAD\" | \"EDIT\";\n  expiresAt?: string;\n  maxDownloads?: number;\n  password?: string;\n  invitedEmail?: string;\n}\n\ninterface ShareDialogProps {\n  item: FileItem | FolderItem;\n  itemType: \"file\" | \"folder\";\n  onClose: () => void;\n  onCreateShare: (\n    input: ShareDialogInput,\n  ) => Promise<{ publicUrl: string; token: string }>;\n  isLoading?: boolean;\n}\n\nexport function ShareDialog({\n  item,\n  itemType,\n  onClose,\n  onCreateShare,\n  isLoading,\n}: ShareDialogProps) {\n  const { t } = useI18n();\n  const [shareUrl, setShareUrl] = useState<string | null>(null);\n  const [shareType, setShareType] = useState<\n    \"PUBLIC_LINK\" | \"EMAIL_INVITE\" | null\n  >(null);\n  const [copied, setCopied] = useState(false);\n  const [expiryDays, setExpiryDays] = useState<number>(7);\n  const [maxDownloads, setMaxDownloads] = useState<number>(0);\n  const [hasPassword, setHasPassword] = useState(false);\n  const [password, setPassword] = useState(\"\");\n  const [invitedEmail, setInvitedEmail] = useState(\"\");\n  const [errorMessage, setErrorMessage] = useState<string | null>(null);\n  const titleId = `share-dialog-title-${item.id}`;\n\n  useEffect(() => {\n    const handleEscape = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        onClose();\n      }\n    };\n\n    document.addEventListener(\"keydown\", handleEscape);\n    return () => document.removeEventListener(\"keydown\", handleEscape);\n  }, [onClose]);\n\n  const handleCreateShare = async () => {\n    try {\n      setErrorMessage(null);\n      const expiresAt =\n        expiryDays > 0\n          ? new Date(\n              Date.now() + expiryDays * 24 * 60 * 60 * 1000,\n            ).toISOString()\n          : undefined;\n\n      const type: ShareDialogInput[\"shareType\"] = invitedEmail\n        ? \"EMAIL_INVITE\"\n        : \"PUBLIC_LINK\";\n\n      const shareInput: ShareDialogInput = {\n        ...(itemType === \"file\" ? { fileId: item.id } : { folderId: item.id }),\n        shareType: type,\n        accessLevel: \"DOWNLOAD\",\n        expiresAt,\n        maxDownloads: maxDownloads > 0 ? maxDownloads : undefined,\n        password: hasPassword && password ? password : undefined,\n        invitedEmail: invitedEmail || undefined,\n      };\n\n      const result = await onCreateShare(shareInput);\n\n      setShareType(type);\n      setShareUrl(result.publicUrl || \"\");\n    } catch (error) {\n      setErrorMessage(\n        error instanceof Error ? error.message : \"Failed to create share\",\n      );\n    }\n  };\n\n  const handleCopyLink = async () => {\n    if (shareUrl) {\n      await navigator.clipboard.writeText(shareUrl);\n      setCopied(true);\n    }\n  };\n\n  // Cleanup timeout on unmount to prevent React state update warning\n  useEffect(() => {\n    if (copied) {\n      const timer = setTimeout(() => setCopied(false), 2000);\n      return () => clearTimeout(timer);\n    }\n    return undefined;\n  }, [copied]);\n\n  return (\n    <div\n      className=\"fixed inset-0 bg-bg-overlay flex items-center justify-center z-[100] animate-in fade-in duration-200\"\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-labelledby={titleId}\n    >\n      <div className=\"bg-bg-surface rounded-lg shadow-xl p-6 w-full max-w-md mx-4 animate-in zoom-in-95 duration-200\">\n        <div className=\"flex items-center justify-between mb-4\">\n          <h2 id={titleId} className=\"text-lg font-semibold text-text-primary\">\n            {tWithFallback(\n              t,\n              \"files.shareDialog.title\",\n              'Share {{itemType}} \"{{name}}\"',\n              {\n                itemType: tWithFallback(\n                  t,\n                  itemType === \"folder\"\n                    ? \"files.shareDialog.itemType.folder\"\n                    : \"files.shareDialog.itemType.file\",\n                  itemType === \"folder\" ? \"folder\" : \"file\",\n                ),\n                name: item.name,\n              },\n            )}\n          </h2>\n          <button\n            type=\"button\"\n            onClick={onClose}\n            className=\"text-text-tertiary hover:text-text-secondary transition-colors duration-200\"\n            aria-label={tWithFallback(\n              t,\n              \"files.shareDialog.actions.close\",\n              \"Close share dialog\",\n            )}\n          >\n            <X className=\"size-5\" />\n          </button>\n        </div>\n\n        {shareType === null ? (\n          <>\n            {errorMessage && (\n              <div className=\"mb-4 rounded-lg border border-status-error-border bg-status-error-bg-subtle px-3 py-2 text-sm text-status-error-text\">\n                {errorMessage}\n              </div>\n            )}\n\n            {/* Share Settings */}\n            <div className=\"space-y-4\">\n              {/* Expiry */}\n              <div>\n                <label className=\"flex items-center gap-2 text-sm font-medium text-text-primary mb-2\">\n                  <Calendar className=\"size-4\" />\n                  {tWithFallback(\n                    t,\n                    \"files.shareDialog.expiry.label\",\n                    \"Link expires in\",\n                  )}\n                </label>\n                <select\n                  value={expiryDays}\n                  onChange={(e) => setExpiryDays(Number(e.target.value))}\n                  className=\"w-full px-3 py-2 border border-border-default rounded-lg focus:outline-none focus:border-action-primary-border text-sm transition-colors duration-200\"\n                >\n                  <option value={0}>\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.expiry.options.never\",\n                      \"Never\",\n                    )}\n                  </option>\n                  <option value={1}>\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.expiry.options.oneDay\",\n                      \"1 day\",\n                    )}\n                  </option>\n                  <option value={7}>\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.expiry.options.sevenDays\",\n                      \"7 days\",\n                    )}\n                  </option>\n                  <option value={30}>\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.expiry.options.thirtyDays\",\n                      \"30 days\",\n                    )}\n                  </option>\n                  <option value={90}>\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.expiry.options.ninetyDays\",\n                      \"90 days\",\n                    )}\n                  </option>\n                </select>\n              </div>\n\n              {/* Max Downloads */}\n              <div>\n                <label className=\"flex items-center gap-2 text-sm font-medium text-text-primary mb-2\">\n                  <Download className=\"size-4\" />\n                  {tWithFallback(\n                    t,\n                    \"files.shareDialog.downloads.label\",\n                    \"Maximum downloads\",\n                  )}\n                </label>\n                <input\n                  type=\"number\"\n                  min=\"0\"\n                  value={maxDownloads}\n                  onChange={(e) => setMaxDownloads(Number(e.target.value))}\n                  placeholder={tWithFallback(\n                    t,\n                    \"files.shareDialog.downloads.placeholder\",\n                    \"Unlimited\",\n                  )}\n                  className=\"w-full px-3 py-2 border border-border-default rounded-lg focus:outline-none focus:border-action-primary-border text-sm transition-colors duration-200\"\n                />\n              </div>\n\n              {/* Password Protection */}\n              <div>\n                <label className=\"flex items-center gap-2 text-sm font-medium text-text-primary mb-2\">\n                  <Lock className=\"size-4\" />\n                  {tWithFallback(\n                    t,\n                    \"files.shareDialog.password.label\",\n                    \"Password protection\",\n                  )}\n                </label>\n                <div className=\"flex items-center gap-2\">\n                  <input\n                    type=\"checkbox\"\n                    checked={hasPassword}\n                    onChange={(e) => setHasPassword(e.target.checked)}\n                    className=\"rounded transition-colors duration-200\"\n                  />\n                  <span className=\"text-sm text-text-secondary\">\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.password.require\",\n                      \"Require password\",\n                    )}\n                  </span>\n                </div>\n                {hasPassword && (\n                  <>\n                    <input\n                      type=\"password\"\n                      value={password}\n                      onChange={(e) => setPassword(e.target.value)}\n                      placeholder={tWithFallback(\n                        t,\n                        \"files.shareDialog.password.placeholder\",\n                        \"Enter password\",\n                      )}\n                      className=\"w-full mt-2 px-3 py-2 border border-border-default rounded-lg focus:outline-none focus:border-action-primary-border text-sm transition-colors duration-200\"\n                    />\n                    <p className=\"mt-1 text-xs text-text-tertiary\">\n                      {tWithFallback(\n                        t,\n                        \"files.shareDialog.password.help\",\n                        \"Password must be at least 8 characters and contain uppercase, lowercase, and number\",\n                      )}\n                    </p>\n                  </>\n                )}\n              </div>\n\n              {/* Invited Email */}\n              <div>\n                <label className=\"flex items-center gap-2 text-sm font-medium text-text-primary mb-2\">\n                  <Mail className=\"size-4\" />\n                  {tWithFallback(\n                    t,\n                    \"files.shareDialog.invite.label\",\n                    \"Invite specific person (optional)\",\n                  )}\n                </label>\n                <input\n                  type=\"email\"\n                  value={invitedEmail}\n                  onChange={(e) => setInvitedEmail(e.target.value)}\n                  placeholder=\"user@example.com\"\n                  className=\"w-full px-3 py-2 border border-border-default rounded-lg focus:outline-none focus:border-action-primary-border text-sm transition-colors duration-200\"\n                />\n                <p className=\"mt-1 text-xs text-text-secondary\">\n                  {tWithFallback(\n                    t,\n                    \"files.shareDialog.invite.help\",\n                    \"Leave empty for public link\",\n                  )}\n                </p>\n              </div>\n            </div>\n\n            {/* Create Button */}\n            <div className=\"flex justify-end gap-2 mt-6\">\n              <button\n                type=\"button\"\n                onClick={onClose}\n                className=\"px-4 py-2 text-sm font-medium text-text-primary hover:bg-action-ghost-bg-hover rounded-lg transition-colors duration-200\"\n              >\n                {tWithFallback(t, \"files.common.actions.cancel\", \"Cancel\")}\n              </button>\n              <button\n                type=\"button\"\n                onClick={handleCreateShare}\n                disabled={isLoading || (hasPassword && !password)}\n                className=\"flex items-center gap-2 px-4 py-2 text-sm font-medium text-text-inverse bg-action-primary-bg rounded-lg hover:bg-action-primary-bg-hover disabled:bg-bg-muted disabled:text-text-tertiary disabled:cursor-not-allowed transition-colors duration-200\"\n              >\n                {isLoading ? (\n                  <>\n                    <Loader2 className=\"size-4 animate-spin\" />\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.actions.creating\",\n                      \"Creating...\",\n                    )}\n                  </>\n                ) : (\n                  <>\n                    <Link className=\"size-4\" />\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.actions.createLink\",\n                      \"Create share link\",\n                    )}\n                  </>\n                )}\n              </button>\n            </div>\n          </>\n        ) : (\n          <>\n            {/* Share Created Success */}\n            <div className=\"space-y-4\">\n              <div className=\"bg-status-success-bg-subtle border border-status-success-border rounded-lg p-4\">\n                {shareType === \"EMAIL_INVITE\" ? (\n                  <>\n                    <p className=\"text-sm font-medium text-status-success-text mb-2\">\n                      {tWithFallback(\n                        t,\n                        \"files.shareDialog.success.invitationSent\",\n                        \"Invitation sent successfully!\",\n                      )}\n                    </p>\n                    <p className=\"text-sm text-text-secondary\">\n                      {tWithFallback(\n                        t,\n                        \"files.shareDialog.success.invitationSentTo\",\n                        \"An invitation has been sent to {{email}}\",\n                        { email: invitedEmail },\n                      )}\n                    </p>\n                  </>\n                ) : (\n                  <>\n                    <p className=\"text-sm font-medium text-status-success-text mb-2\">\n                      {tWithFallback(\n                        t,\n                        \"files.shareDialog.success.linkCreated\",\n                        \"Share link created successfully!\",\n                      )}\n                    </p>\n                    <div className=\"flex items-center gap-2\">\n                      <input\n                        type=\"text\"\n                        value={shareUrl || \"\"}\n                        readOnly\n                        className=\"flex-1 px-3 py-2 bg-bg-surface border border-status-success-border rounded-lg text-sm\"\n                      />\n                      <button\n                        type=\"button\"\n                        onClick={handleCopyLink}\n                        className=\"flex items-center gap-2 px-4 py-2 text-sm font-medium text-text-inverse bg-action-primary-bg rounded-lg hover:bg-action-primary-bg-hover transition-colors duration-200\"\n                      >\n                        {copied ? (\n                          <>\n                            <Check className=\"size-4\" />\n                            {tWithFallback(\n                              t,\n                              \"files.shareDialog.actions.copied\",\n                              \"Copied!\",\n                            )}\n                          </>\n                        ) : (\n                          <>\n                            <Copy className=\"size-4\" />\n                            {tWithFallback(\n                              t,\n                              \"files.common.actions.copy\",\n                              \"Copy\",\n                            )}\n                          </>\n                        )}\n                      </button>\n                    </div>\n                  </>\n                )}\n              </div>\n\n              <button\n                type=\"button\"\n                onClick={onClose}\n                className=\"w-full px-4 py-2 text-sm font-medium text-text-inverse bg-action-primary-bg rounded-lg hover:bg-action-primary-bg-hover transition-colors duration-200\"\n              >\n                {tWithFallback(t, \"files.common.actions.done\", \"Done\")}\n              </button>\n            </div>\n          </>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ShareDialog.js","names":[],"sources":["../../../src/files/components/ShareDialog.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport {\n  X,\n  Link,\n  Mail,\n  Calendar,\n  Download,\n  Lock,\n  Copy,\n  Check,\n  Loader2,\n} from \"lucide-react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport type { FileItem, FolderItem } from \"../types\";\nimport { tWithFallback } from \"../utils/i18n\";\n\nexport interface ShareDialogInput {\n  fileId?: string;\n  folderId?: string;\n  shareType: \"PUBLIC_LINK\" | \"EMAIL_INVITE\";\n  accessLevel: \"VIEW\" | \"DOWNLOAD\" | \"EDIT\";\n  expiresAt?: string;\n  maxDownloads?: number;\n  password?: string;\n  invitedEmail?: string;\n}\n\ninterface ShareDialogProps {\n  item: FileItem | FolderItem;\n  itemType: \"file\" | \"folder\";\n  onClose: () => void;\n  onCreateShare: (\n    input: ShareDialogInput,\n  ) => Promise<{ publicUrl: string; token: string }>;\n  isLoading?: boolean;\n}\n\nexport function ShareDialog({\n  item,\n  itemType,\n  onClose,\n  onCreateShare,\n  isLoading,\n}: ShareDialogProps) {\n  const { t } = useI18n();\n  const [shareUrl, setShareUrl] = useState<string | null>(null);\n  const [shareType, setShareType] = useState<\n    \"PUBLIC_LINK\" | \"EMAIL_INVITE\" | null\n  >(null);\n  const [copied, setCopied] = useState(false);\n  const [expiryDays, setExpiryDays] = useState<number>(7);\n  const [maxDownloads, setMaxDownloads] = useState<number>(0);\n  const [hasPassword, setHasPassword] = useState(false);\n  const [password, setPassword] = useState(\"\");\n  const [invitedEmail, setInvitedEmail] = useState(\"\");\n  const [errorMessage, setErrorMessage] = useState<string | null>(null);\n  const titleId = `share-dialog-title-${item.id}`;\n\n  useEffect(() => {\n    const handleEscape = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        onClose();\n      }\n    };\n\n    document.addEventListener(\"keydown\", handleEscape);\n    return () => document.removeEventListener(\"keydown\", handleEscape);\n  }, [onClose]);\n\n  const handleCreateShare = async () => {\n    try {\n      setErrorMessage(null);\n      const expiresAt =\n        expiryDays > 0\n          ? new Date(\n              Date.now() + expiryDays * 24 * 60 * 60 * 1000,\n            ).toISOString()\n          : undefined;\n\n      const type: ShareDialogInput[\"shareType\"] = invitedEmail\n        ? \"EMAIL_INVITE\"\n        : \"PUBLIC_LINK\";\n\n      const shareInput: ShareDialogInput = {\n        ...(itemType === \"file\" ? { fileId: item.id } : { folderId: item.id }),\n        shareType: type,\n        accessLevel: \"DOWNLOAD\",\n        expiresAt,\n        maxDownloads: maxDownloads > 0 ? maxDownloads : undefined,\n        password: hasPassword && password ? password : undefined,\n        invitedEmail: invitedEmail || undefined,\n      };\n\n      const result = await onCreateShare(shareInput);\n\n      setShareType(type);\n      setShareUrl(result.publicUrl || \"\");\n    } catch (error) {\n      setErrorMessage(\n        error instanceof Error ? error.message : \"Failed to create share\",\n      );\n    }\n  };\n\n  const handleCopyLink = async () => {\n    if (shareUrl) {\n      await navigator.clipboard.writeText(shareUrl);\n      setCopied(true);\n    }\n  };\n\n  // Cleanup timeout on unmount to prevent React state update warning\n  useEffect(() => {\n    if (copied) {\n      const timer = setTimeout(() => setCopied(false), 2000);\n      return () => clearTimeout(timer);\n    }\n    return undefined;\n  }, [copied]);\n\n  return (\n    <div\n      className=\"fixed inset-0 bg-bg-overlay flex items-center justify-center z-[100] animate-in fade-in duration-200\"\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-labelledby={titleId}\n    >\n      <div className=\"bg-bg-surface rounded-lg shadow-xl p-6 w-full max-w-md mx-4 animate-in zoom-in-95 duration-200\">\n        <div className=\"flex items-center justify-between mb-4\">\n          <h2 id={titleId} className=\"text-lg font-semibold text-text-primary\">\n            {tWithFallback(\n              t,\n              \"files.shareDialog.title\",\n              'Share {{itemType}} \"{{name}}\"',\n              {\n                itemType: tWithFallback(\n                  t,\n                  itemType === \"folder\"\n                    ? \"files.shareDialog.itemType.folder\"\n                    : \"files.shareDialog.itemType.file\",\n                  itemType === \"folder\" ? \"folder\" : \"file\",\n                ),\n                name: item.name,\n              },\n            )}\n          </h2>\n          <button\n            type=\"button\"\n            onClick={onClose}\n            className=\"text-text-tertiary hover:text-text-secondary transition-colors duration-200\"\n            aria-label={tWithFallback(\n              t,\n              \"files.shareDialog.actions.close\",\n              \"Close share dialog\",\n            )}\n          >\n            <X className=\"size-5\" />\n          </button>\n        </div>\n\n        {shareType === null ? (\n          <>\n            {errorMessage && (\n              <div className=\"mb-4 rounded-lg border border-status-error-border bg-status-error-bg-subtle px-3 py-2 text-sm text-status-error-text\">\n                {errorMessage}\n              </div>\n            )}\n\n            {/* Share Settings */}\n            <div className=\"space-y-4\">\n              {/* Expiry */}\n              <div>\n                <label className=\"flex items-center gap-2 text-sm font-medium text-text-primary mb-2\">\n                  <Calendar className=\"size-4\" />\n                  {tWithFallback(\n                    t,\n                    \"files.shareDialog.expiry.label\",\n                    \"Link expires in\",\n                  )}\n                </label>\n                <select\n                  value={expiryDays}\n                  onChange={(e) => setExpiryDays(Number(e.target.value))}\n                  className=\"w-full px-3 py-2 border border-border-default rounded-lg focus:outline-none focus:border-action-primary-border text-sm transition-colors duration-200\"\n                >\n                  <option value={0}>\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.expiry.options.never\",\n                      \"Never\",\n                    )}\n                  </option>\n                  <option value={1}>\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.expiry.options.oneDay\",\n                      \"1 day\",\n                    )}\n                  </option>\n                  <option value={7}>\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.expiry.options.sevenDays\",\n                      \"7 days\",\n                    )}\n                  </option>\n                  <option value={30}>\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.expiry.options.thirtyDays\",\n                      \"30 days\",\n                    )}\n                  </option>\n                  <option value={90}>\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.expiry.options.ninetyDays\",\n                      \"90 days\",\n                    )}\n                  </option>\n                </select>\n              </div>\n\n              {/* Max Downloads */}\n              <div>\n                <label className=\"flex items-center gap-2 text-sm font-medium text-text-primary mb-2\">\n                  <Download className=\"size-4\" />\n                  {tWithFallback(\n                    t,\n                    \"files.shareDialog.downloads.label\",\n                    \"Maximum downloads\",\n                  )}\n                </label>\n                <input\n                  type=\"number\"\n                  min=\"0\"\n                  value={maxDownloads}\n                  onChange={(e) => setMaxDownloads(Number(e.target.value))}\n                  aria-label={tWithFallback(\n                    t,\n                    \"files.shareDialog.downloads.label\",\n                    \"Maximum downloads\",\n                  )}\n                  placeholder={tWithFallback(\n                    t,\n                    \"files.shareDialog.downloads.placeholder\",\n                    \"Unlimited\",\n                  )}\n                  className=\"w-full px-3 py-2 border border-border-default rounded-lg focus:outline-none focus:border-action-primary-border text-sm transition-colors duration-200\"\n                />\n              </div>\n\n              {/* Password Protection */}\n              <div>\n                <label className=\"flex items-center gap-2 text-sm font-medium text-text-primary mb-2\">\n                  <Lock className=\"size-4\" />\n                  {tWithFallback(\n                    t,\n                    \"files.shareDialog.password.label\",\n                    \"Password protection\",\n                  )}\n                </label>\n                <div className=\"flex items-center gap-2\">\n                  <input\n                    type=\"checkbox\"\n                    checked={hasPassword}\n                    onChange={(e) => setHasPassword(e.target.checked)}\n                    aria-label={tWithFallback(\n                      t,\n                      \"files.shareDialog.password.require\",\n                      \"Require password\",\n                    )}\n                    className=\"rounded transition-colors duration-200\"\n                  />\n                  <span className=\"text-sm text-text-secondary\">\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.password.require\",\n                      \"Require password\",\n                    )}\n                  </span>\n                </div>\n                {hasPassword && (\n                  <>\n                    <input\n                      type=\"password\"\n                      value={password}\n                      onChange={(e) => setPassword(e.target.value)}\n                      aria-label={tWithFallback(\n                        t,\n                        \"files.shareDialog.password.label\",\n                        \"Password protection\",\n                      )}\n                      placeholder={tWithFallback(\n                        t,\n                        \"files.shareDialog.password.placeholder\",\n                        \"Enter password\",\n                      )}\n                      className=\"w-full mt-2 px-3 py-2 border border-border-default rounded-lg focus:outline-none focus:border-action-primary-border text-sm transition-colors duration-200\"\n                    />\n                    <p className=\"mt-1 text-xs text-text-tertiary\">\n                      {tWithFallback(\n                        t,\n                        \"files.shareDialog.password.help\",\n                        \"Password must be at least 8 characters and contain uppercase, lowercase, and number\",\n                      )}\n                    </p>\n                  </>\n                )}\n              </div>\n\n              {/* Invited Email */}\n              <div>\n                <label className=\"flex items-center gap-2 text-sm font-medium text-text-primary mb-2\">\n                  <Mail className=\"size-4\" />\n                  {tWithFallback(\n                    t,\n                    \"files.shareDialog.invite.label\",\n                    \"Invite specific person (optional)\",\n                  )}\n                </label>\n                <input\n                  type=\"email\"\n                  value={invitedEmail}\n                  onChange={(e) => setInvitedEmail(e.target.value)}\n                  aria-label={tWithFallback(\n                    t,\n                    \"files.shareDialog.invite.label\",\n                    \"Invite specific person (optional)\",\n                  )}\n                  placeholder=\"user@example.com\"\n                  className=\"w-full px-3 py-2 border border-border-default rounded-lg focus:outline-none focus:border-action-primary-border text-sm transition-colors duration-200\"\n                />\n                <p className=\"mt-1 text-xs text-text-secondary\">\n                  {tWithFallback(\n                    t,\n                    \"files.shareDialog.invite.help\",\n                    \"Leave empty for public link\",\n                  )}\n                </p>\n              </div>\n            </div>\n\n            {/* Create Button */}\n            <div className=\"flex justify-end gap-2 mt-6\">\n              <button\n                type=\"button\"\n                onClick={onClose}\n                className=\"px-4 py-2 text-sm font-medium text-text-primary hover:bg-action-ghost-bg-hover rounded-lg transition-colors duration-200\"\n              >\n                {tWithFallback(t, \"files.common.actions.cancel\", \"Cancel\")}\n              </button>\n              <button\n                type=\"button\"\n                onClick={handleCreateShare}\n                disabled={isLoading || (hasPassword && !password)}\n                className=\"flex items-center gap-2 px-4 py-2 text-sm font-medium text-text-inverse bg-action-primary-bg rounded-lg hover:bg-action-primary-bg-hover disabled:bg-bg-muted disabled:text-text-tertiary disabled:cursor-not-allowed transition-colors duration-200\"\n              >\n                {isLoading ? (\n                  <>\n                    <Loader2 className=\"size-4 animate-spin\" />\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.actions.creating\",\n                      \"Creating...\",\n                    )}\n                  </>\n                ) : (\n                  <>\n                    <Link className=\"size-4\" />\n                    {tWithFallback(\n                      t,\n                      \"files.shareDialog.actions.createLink\",\n                      \"Create share link\",\n                    )}\n                  </>\n                )}\n              </button>\n            </div>\n          </>\n        ) : (\n          <>\n            {/* Share Created Success */}\n            <div className=\"space-y-4\">\n              <div className=\"bg-status-success-bg-subtle border border-status-success-border rounded-lg p-4\">\n                {shareType === \"EMAIL_INVITE\" ? (\n                  <>\n                    <p className=\"text-sm font-medium text-status-success-text mb-2\">\n                      {tWithFallback(\n                        t,\n                        \"files.shareDialog.success.invitationSent\",\n                        \"Invitation sent successfully!\",\n                      )}\n                    </p>\n                    <p className=\"text-sm text-text-secondary\">\n                      {tWithFallback(\n                        t,\n                        \"files.shareDialog.success.invitationSentTo\",\n                        \"An invitation has been sent to {{email}}\",\n                        { email: invitedEmail },\n                      )}\n                    </p>\n                  </>\n                ) : (\n                  <>\n                    <p className=\"text-sm font-medium text-status-success-text mb-2\">\n                      {tWithFallback(\n                        t,\n                        \"files.shareDialog.success.linkCreated\",\n                        \"Share link created successfully!\",\n                      )}\n                    </p>\n                    <div className=\"flex items-center gap-2\">\n                      <input\n                        type=\"text\"\n                        value={shareUrl || \"\"}\n                        readOnly\n                        aria-label={tWithFallback(\n                          t,\n                          \"files.shareDialog.success.linkCreated\",\n                          \"Share link\",\n                        )}\n                        className=\"flex-1 px-3 py-2 bg-bg-surface border border-status-success-border rounded-lg text-sm\"\n                      />\n                      <button\n                        type=\"button\"\n                        onClick={handleCopyLink}\n                        className=\"flex items-center gap-2 px-4 py-2 text-sm font-medium text-text-inverse bg-action-primary-bg rounded-lg hover:bg-action-primary-bg-hover transition-colors duration-200\"\n                      >\n                        {copied ? (\n                          <>\n                            <Check className=\"size-4\" />\n                            {tWithFallback(\n                              t,\n                              \"files.shareDialog.actions.copied\",\n                              \"Copied!\",\n                            )}\n                          </>\n                        ) : (\n                          <>\n                            <Copy className=\"size-4\" />\n                            {tWithFallback(\n                              t,\n                              \"files.common.actions.copy\",\n                              \"Copy\",\n                            )}\n                          </>\n                        )}\n                      </button>\n                    </div>\n                  </>\n                )}\n              </div>\n\n              <button\n                type=\"button\"\n                onClick={onClose}\n                className=\"w-full px-4 py-2 text-sm font-medium text-text-inverse bg-action-primary-bg rounded-lg hover:bg-action-primary-bg-hover transition-colors duration-200\"\n              >\n                {tWithFallback(t, \"files.common.actions.done\", \"Done\")}\n              </button>\n            </div>\n          </>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAqCA,SAAgB,EAAY,EAC1B,SACA,aACA,YACA,kBACA,gBACmB;CACnB,IAAM,EAAE,SAAM,GAAS,EACjB,CAAC,GAAU,KAAe,EAAwB,KAAK,EACvD,CAAC,GAAW,KAAgB,EAEhC,KAAK,EACD,CAAC,GAAQ,KAAa,EAAS,GAAM,EACrC,CAAC,GAAY,KAAiB,EAAiB,EAAE,EACjD,CAAC,GAAc,KAAmB,EAAiB,EAAE,EACrD,CAAC,GAAa,KAAkB,EAAS,GAAM,EAC/C,CAAC,GAAU,KAAe,EAAS,GAAG,EACtC,CAAC,GAAc,KAAmB,EAAS,GAAG,EAC9C,CAAC,GAAc,KAAmB,EAAwB,KAAK,EAC/D,IAAU,sBAAsB,EAAK;AAgE3C,QA9DA,QAAgB;EACd,IAAM,KAAgB,MAAyB;AAC7C,GAAI,EAAM,QAAQ,YAChB,GAAS;;AAKb,SADA,SAAS,iBAAiB,WAAW,EAAa,QACrC,SAAS,oBAAoB,WAAW,EAAa;IACjE,CAAC,EAAQ,CAAC,EA6Cb,QAAgB;AACd,MAAI,GAAQ;GACV,IAAM,IAAQ,iBAAiB,EAAU,GAAM,EAAE,IAAK;AACtD,gBAAa,aAAa,EAAM;;IAGjC,CAAC,EAAO,CAAC,EAGV,kBAAC,OAAD;EACE,WAAU;EACV,MAAK;EACL,cAAW;EACX,mBAAiB;YAEjB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,MAAD;KAAI,IAAI;KAAS,WAAU;eACxB,EACC,GACA,2BACA,mCACA;MACE,UAAU,EACR,GACA,MAAa,WACT,sCACA,mCACJ,MAAa,WAAW,WAAW,OACpC;MACD,MAAM,EAAK;MACZ,CACF;KACE,CAAA,EACL,kBAAC,UAAD;KACE,MAAK;KACL,SAAS;KACT,WAAU;KACV,cAAY,EACV,GACA,mCACA,qBACD;eAED,kBAAC,GAAD,EAAG,WAAU,UAAW,CAAA;KACjB,CAAA,CACL;OAEL,MAAc,OACb,kBAAA,GAAA,EAAA,UAAA;IACG,KACC,kBAAC,OAAD;KAAK,WAAU;eACZ;KACG,CAAA;IAIR,kBAAC,OAAD;KAAK,WAAU;eAAf;MAEE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,SAAD;OAAO,WAAU;iBAAjB,CACE,kBAAC,GAAD,EAAU,WAAU,UAAW,CAAA,EAC9B,EACC,GACA,kCACA,kBACD,CACK;UACR,kBAAC,UAAD;OACE,OAAO;OACP,WAAW,MAAM,EAAc,OAAO,EAAE,OAAO,MAAM,CAAC;OACtD,WAAU;iBAHZ;QAKE,kBAAC,UAAD;SAAQ,OAAO;mBACZ,EACC,GACA,0CACA,QACD;SACM,CAAA;QACT,kBAAC,UAAD;SAAQ,OAAO;mBACZ,EACC,GACA,2CACA,QACD;SACM,CAAA;QACT,kBAAC,UAAD;SAAQ,OAAO;mBACZ,EACC,GACA,8CACA,SACD;SACM,CAAA;QACT,kBAAC,UAAD;SAAQ,OAAO;mBACZ,EACC,GACA,+CACA,UACD;SACM,CAAA;QACT,kBAAC,UAAD;SAAQ,OAAO;mBACZ,EACC,GACA,+CACA,UACD;SACM,CAAA;QACF;SACL,EAAA,CAAA;MAGN,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,SAAD;OAAO,WAAU;iBAAjB,CACE,kBAAC,GAAD,EAAU,WAAU,UAAW,CAAA,EAC9B,EACC,GACA,qCACA,oBACD,CACK;UACR,kBAAC,SAAD;OACE,MAAK;OACL,KAAI;OACJ,OAAO;OACP,WAAW,MAAM,EAAgB,OAAO,EAAE,OAAO,MAAM,CAAC;OACxD,cAAY,EACV,GACA,qCACA,oBACD;OACD,aAAa,EACX,GACA,2CACA,YACD;OACD,WAAU;OACV,CAAA,CACE,EAAA,CAAA;MAGN,kBAAC,OAAD,EAAA,UAAA;OACE,kBAAC,SAAD;QAAO,WAAU;kBAAjB,CACE,kBAAC,GAAD,EAAM,WAAU,UAAW,CAAA,EAC1B,EACC,GACA,oCACA,sBACD,CACK;;OACR,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,SAAD;SACE,MAAK;SACL,SAAS;SACT,WAAW,MAAM,EAAe,EAAE,OAAO,QAAQ;SACjD,cAAY,EACV,GACA,sCACA,mBACD;SACD,WAAU;SACV,CAAA,EACF,kBAAC,QAAD;SAAM,WAAU;mBACb,EACC,GACA,sCACA,mBACD;SACI,CAAA,CACH;;OACL,KACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,SAAD;QACE,MAAK;QACL,OAAO;QACP,WAAW,MAAM,EAAY,EAAE,OAAO,MAAM;QAC5C,cAAY,EACV,GACA,oCACA,sBACD;QACD,aAAa,EACX,GACA,0CACA,iBACD;QACD,WAAU;QACV,CAAA,EACF,kBAAC,KAAD;QAAG,WAAU;kBACV,EACC,GACA,mCACA,sFACD;QACC,CAAA,CACH,EAAA,CAAA;OAED,EAAA,CAAA;MAGN,kBAAC,OAAD,EAAA,UAAA;OACE,kBAAC,SAAD;QAAO,WAAU;kBAAjB,CACE,kBAAC,GAAD,EAAM,WAAU,UAAW,CAAA,EAC1B,EACC,GACA,kCACA,oCACD,CACK;;OACR,kBAAC,SAAD;QACE,MAAK;QACL,OAAO;QACP,WAAW,MAAM,EAAgB,EAAE,OAAO,MAAM;QAChD,cAAY,EACV,GACA,kCACA,oCACD;QACD,aAAY;QACZ,WAAU;QACV,CAAA;OACF,kBAAC,KAAD;QAAG,WAAU;kBACV,EACC,GACA,iCACA,8BACD;QACC,CAAA;OACA,EAAA,CAAA;MACF;;IAGN,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,UAAD;MACE,MAAK;MACL,SAAS;MACT,WAAU;gBAET,EAAc,GAAG,+BAA+B,SAAS;MACnD,CAAA,EACT,kBAAC,UAAD;MACE,MAAK;MACL,SA7RY,YAAY;AACpC,WAAI;AACF,UAAgB,KAAK;QACrB,IAAM,IACJ,IAAa,IACT,IAAI,KACF,KAAK,KAAK,GAAG,IAAa,KAAK,KAAK,KAAK,IAC1C,CAAC,aAAa,GACf,KAAA,GAEA,IAAsC,IACxC,iBACA,eAYE,IAAS,MAAM,EAVgB;SACnC,GAAI,MAAa,SAAS,EAAE,QAAQ,EAAK,IAAI,GAAG,EAAE,UAAU,EAAK,IAAI;SACrE,WAAW;SACX,aAAa;SACb;SACA,cAAc,IAAe,IAAI,IAAe,KAAA;SAChD,UAAU,KAAe,IAAW,IAAW,KAAA;SAC/C,cAAc,KAAgB,KAAA;SAC/B,CAE6C;AAG9C,QADA,EAAa,EAAK,EAClB,EAAY,EAAO,aAAa,GAAG;gBAC5B,GAAO;AACd,UACE,aAAiB,QAAQ,EAAM,UAAU,yBAC1C;;;MA+PS,UAAU,KAAc,KAAe,CAAC;MACxC,WAAU;gBAET,IACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD,EAAS,WAAU,uBAAwB,CAAA,EAC1C,EACC,GACA,sCACA,cACD,CACA,EAAA,CAAA,GAEH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD,EAAM,WAAU,UAAW,CAAA,EAC1B,EACC,GACA,wCACA,oBACD,CACA,EAAA,CAAA;MAEE,CAAA,CACL;;IACL,EAAA,CAAA,GAEH,kBAAA,GAAA,EAAA,UAEE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eACZ,MAAc,iBACb,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,KAAD;MAAG,WAAU;gBACV,EACC,GACA,4CACA,gCACD;MACC,CAAA,EACJ,kBAAC,KAAD;MAAG,WAAU;gBACV,EACC,GACA,8CACA,4CACA,EAAE,OAAO,GAAc,CACxB;MACC,CAAA,CACH,EAAA,CAAA,GAEH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,KAAD;MAAG,WAAU;gBACV,EACC,GACA,yCACA,mCACD;MACC,CAAA,EACJ,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,SAAD;OACE,MAAK;OACL,OAAO,KAAY;OACnB,UAAA;OACA,cAAY,EACV,GACA,yCACA,aACD;OACD,WAAU;OACV,CAAA,EACF,kBAAC,UAAD;OACE,MAAK;OACL,SAlUC,YAAY;AACjC,QAAI,MACF,MAAM,UAAU,UAAU,UAAU,EAAS,EAC7C,EAAU,GAAK;;OAgUG,WAAU;iBAET,IACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD,EAAO,WAAU,UAAW,CAAA,EAC3B,EACC,GACA,oCACA,UACD,CACA,EAAA,CAAA,GAEH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD,EAAM,WAAU,UAAW,CAAA,EAC1B,EACC,GACA,6BACA,OACD,CACA,EAAA,CAAA;OAEE,CAAA,CACL;QACL,EAAA,CAAA;KAED,CAAA,EAEN,kBAAC,UAAD;KACE,MAAK;KACL,SAAS;KACT,WAAU;eAET,EAAc,GAAG,6BAA6B,OAAO;KAC/C,CAAA,CACL;OACL,CAAA,CAED;;EACF,CAAA"}

package/dist/files/components/Toast.js

@@ -1,52 +1,55 @@
-import { useEffect as e } from "react";
-import { AlertCircle as t, CheckCircle as n, Info as r, X as i, XCircle as a } from "lucide-react";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { useEffect as e, useEffectEvent as t } from "react";
+import { AlertCircle as n, CheckCircle as r, Info as i, X as a, XCircle as o } from "lucide-react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/files/components/Toast.tsx
-function c({ toast: c, onClose: l }) {
+function l({ toast: l, onClose: u }) {
+	let d = t(() => {
+		u(l.id);
+	});
 	e(() => {
-		let e = c.duration || 5e3, t = setTimeout(() => {
-			l(c.id);
+		let e = l.duration || 5e3, t = setTimeout(() => {
+			d();
 		}, e);
 		return () => clearTimeout(t);
-	}, [c, l]);
-	let u = {
-		success: /* @__PURE__ */ o(n, { className: "size-5 text-status-success-bg" }),
-		error: /* @__PURE__ */ o(a, { className: "size-5 text-status-error-bg" }),
-		warning: /* @__PURE__ */ o(t, { className: "size-5 text-status-warning-bg" }),
-		info: /* @__PURE__ */ o(r, { className: "size-5 text-status-info-bg" })
+	}, [l.duration]);
+	let f = {
+		success: /* @__PURE__ */ s(r, { className: "size-5 text-status-success-bg" }),
+		error: /* @__PURE__ */ s(o, { className: "size-5 text-status-error-bg" }),
+		warning: /* @__PURE__ */ s(n, { className: "size-5 text-status-warning-bg" }),
+		info: /* @__PURE__ */ s(i, { className: "size-5 text-status-info-bg" })
 	};
-	return /* @__PURE__ */ s("div", {
+	return /* @__PURE__ */ c("div", {
 		className: `flex items-center gap-3 p-4 rounded-lg shadow-lg border ${{
 			success: "bg-status-success-bg-subtle border-status-success-border",
 			error: "bg-status-error-bg-subtle border-status-error-border",
 			warning: "bg-status-warning-bg-subtle border-status-warning-border",
 			info: "bg-status-info-bg-subtle border-status-info-border"
-		}[c.type]} w-80 max-w-[90vw] md:max-w-md animate-in slide-in-from-right duration-300`,
+		}[l.type]} w-80 max-w-[90vw] md:max-w-md animate-in slide-in-from-right duration-300`,
 		children: [
-			u[c.type],
-			/* @__PURE__ */ o("p", {
+			f[l.type],
+			/* @__PURE__ */ s("p", {
 				className: "flex-1 text-sm font-medium text-text-primary",
-				children: c.message
+				children: l.message
 			}),
-			/* @__PURE__ */ o("button", {
+			/* @__PURE__ */ s("button", {
 				type: "button",
-				onClick: () => l(c.id),
+				onClick: () => u(l.id),
 				className: "text-text-muted hover:text-text-secondary transition-colors",
-				children: /* @__PURE__ */ o(i, { className: "size-4" })
+				children: /* @__PURE__ */ s(a, { className: "size-4" })
 			})
 		]
 	});
 }
-function l({ toasts: e, onClose: t }) {
-	return /* @__PURE__ */ o("div", {
+function u({ toasts: e, onClose: t }) {
+	return /* @__PURE__ */ s("div", {
 		className: "fixed bottom-4 right-4 z-50 flex flex-col gap-2",
-		children: e.map((e) => /* @__PURE__ */ o(c, {
+		children: e.map((e) => /* @__PURE__ */ s(l, {
 			toast: e,
 			onClose: t
 		}, e.id))
 	});
 }
 //#endregion
-export { l as ToastContainer };
+export { u as ToastContainer };
 
 //# sourceMappingURL=Toast.js.map

package/dist/files/components/Toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.js","names":[],"sources":["../../../src/files/components/Toast.tsx"],"sourcesContent":["import { useEffect } from \"react\";\nimport { X, CheckCircle, XCircle, AlertCircle, Info } from \"lucide-react\";\n\nexport type ToastType = \"success\" | \"error\" | \"warning\" | \"info\";\n\nexport interface Toast {\n  id: string;\n  type: ToastType;\n  message: string;\n  duration?: number;\n}\n\ninterface ToastItemProps {\n  toast: Toast;\n  onClose: (id: string) => void;\n}\n\nfunction ToastItem({ toast, onClose }: ToastItemProps) {\n  useEffect(() => {\n    const duration = toast.duration || 5000;\n    const timer = setTimeout(() => {\n      onClose(toast.id);\n    }, duration);\n\n    return () => clearTimeout(timer);\n  }, [toast, onClose]);\n\n  const icons = {\n    success: <CheckCircle className=\"size-5 text-status-success-bg\" />,\n    error: <XCircle className=\"size-5 text-status-error-bg\" />,\n    warning: <AlertCircle className=\"size-5 text-status-warning-bg\" />,\n    info: <Info className=\"size-5 text-status-info-bg\" />,\n  };\n\n  const colors = {\n    success: \"bg-status-success-bg-subtle border-status-success-border\",\n    error: \"bg-status-error-bg-subtle border-status-error-border\",\n    warning: \"bg-status-warning-bg-subtle border-status-warning-border\",\n    info: \"bg-status-info-bg-subtle border-status-info-border\",\n  };\n\n  return (\n    <div\n      className={`flex items-center gap-3 p-4 rounded-lg shadow-lg border ${colors[toast.type]} w-80 max-w-[90vw] md:max-w-md animate-in slide-in-from-right duration-300`}\n    >\n      {icons[toast.type]}\n      <p className=\"flex-1 text-sm font-medium text-text-primary\">\n        {toast.message}\n      </p>\n      <button\n        type=\"button\"\n        onClick={() => onClose(toast.id)}\n        className=\"text-text-muted hover:text-text-secondary transition-colors\"\n      >\n        <X className=\"size-4\" />\n      </button>\n    </div>\n  );\n}\n\ninterface ToastContainerProps {\n  toasts: Toast[];\n  onClose: (id: string) => void;\n}\n\nexport function ToastContainer({ toasts, onClose }: ToastContainerProps) {\n  return (\n    <div className=\"fixed bottom-4 right-4 z-50 flex flex-col gap-2\">\n      {toasts.map((toast) => (\n        <ToastItem key={toast.id} toast={toast} onClose={onClose} />\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;AAiBA,SAAS,EAAU,EAAE,UAAO,cAA2B;AACrD,SAAgB;EACd,IAAM,IAAW,EAAM,YAAY,KAC7B,IAAQ,iBAAiB;AAC7B,KAAQ,EAAM,GAAG;KAChB,EAAS;AAEZ,eAAa,aAAa,EAAM;IAC/B,CAAC,GAAO,EAAQ,CAAC;CAEpB,IAAM,IAAQ;EACZ,SAAS,kBAAC,GAAD,EAAa,WAAU,iCAAkC,CAAA;EAClE,OAAO,kBAAC,GAAD,EAAS,WAAU,+BAAgC,CAAA;EAC1D,SAAS,kBAAC,GAAD,EAAa,WAAU,iCAAkC,CAAA;EAClE,MAAM,kBAAC,GAAD,EAAM,WAAU,8BAA+B,CAAA;EACtD;AASD,QACE,kBAAC,OAAD;EACE,WAAW,2DATA;GACb,SAAS;GACT,OAAO;GACP,SAAS;GACT,MAAM;GACP,CAIgF,EAAM,MAAM;YAD3F;GAGG,EAAM,EAAM;GACb,kBAAC,KAAD;IAAG,WAAU;cACV,EAAM;IACL,CAAA;GACJ,kBAAC,UAAD;IACE,MAAK;IACL,eAAe,EAAQ,EAAM,GAAG;IAChC,WAAU;cAEV,kBAAC,GAAD,EAAG,WAAU,UAAW,CAAA;IACjB,CAAA;GACL;;;AASV,SAAgB,EAAe,EAAE,WAAQ,cAAgC;AACvE,QACE,kBAAC,OAAD;EAAK,WAAU;YACZ,EAAO,KAAK,MACX,kBAAC,GAAD;GAAiC;GAAgB;GAAW,EAA5C,EAAM,GAAsC,CAC5D;EACE,CAAA"}
+{"version":3,"file":"Toast.js","names":[],"sources":["../../../src/files/components/Toast.tsx"],"sourcesContent":["import { useEffect, useEffectEvent } from \"react\";\nimport { X, CheckCircle, XCircle, AlertCircle, Info } from \"lucide-react\";\n\nexport type ToastType = \"success\" | \"error\" | \"warning\" | \"info\";\n\nexport interface Toast {\n  id: string;\n  type: ToastType;\n  message: string;\n  duration?: number;\n}\n\ninterface ToastItemProps {\n  toast: Toast;\n  onClose: (id: string) => void;\n}\n\nfunction ToastItem({ toast, onClose }: ToastItemProps) {\n  const closeToast = useEffectEvent(() => {\n    onClose(toast.id);\n  });\n\n  useEffect(() => {\n    const duration = toast.duration || 5000;\n    const timer = setTimeout(() => {\n      closeToast();\n    }, duration);\n\n    return () => clearTimeout(timer);\n  }, [toast.duration]);\n\n  const icons = {\n    success: <CheckCircle className=\"size-5 text-status-success-bg\" />,\n    error: <XCircle className=\"size-5 text-status-error-bg\" />,\n    warning: <AlertCircle className=\"size-5 text-status-warning-bg\" />,\n    info: <Info className=\"size-5 text-status-info-bg\" />,\n  };\n\n  const colors = {\n    success: \"bg-status-success-bg-subtle border-status-success-border\",\n    error: \"bg-status-error-bg-subtle border-status-error-border\",\n    warning: \"bg-status-warning-bg-subtle border-status-warning-border\",\n    info: \"bg-status-info-bg-subtle border-status-info-border\",\n  };\n\n  return (\n    <div\n      className={`flex items-center gap-3 p-4 rounded-lg shadow-lg border ${colors[toast.type]} w-80 max-w-[90vw] md:max-w-md animate-in slide-in-from-right duration-300`}\n    >\n      {icons[toast.type]}\n      <p className=\"flex-1 text-sm font-medium text-text-primary\">\n        {toast.message}\n      </p>\n      <button\n        type=\"button\"\n        onClick={() => onClose(toast.id)}\n        className=\"text-text-muted hover:text-text-secondary transition-colors\"\n      >\n        <X className=\"size-4\" />\n      </button>\n    </div>\n  );\n}\n\ninterface ToastContainerProps {\n  toasts: Toast[];\n  onClose: (id: string) => void;\n}\n\nexport function ToastContainer({ toasts, onClose }: ToastContainerProps) {\n  return (\n    <div className=\"fixed bottom-4 right-4 z-50 flex flex-col gap-2\">\n      {toasts.map((toast) => (\n        <ToastItem key={toast.id} toast={toast} onClose={onClose} />\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;AAiBA,SAAS,EAAU,EAAE,UAAO,cAA2B;CACrD,IAAM,IAAa,QAAqB;AACtC,IAAQ,EAAM,GAAG;GACjB;AAEF,SAAgB;EACd,IAAM,IAAW,EAAM,YAAY,KAC7B,IAAQ,iBAAiB;AAC7B,MAAY;KACX,EAAS;AAEZ,eAAa,aAAa,EAAM;IAC/B,CAAC,EAAM,SAAS,CAAC;CAEpB,IAAM,IAAQ;EACZ,SAAS,kBAAC,GAAD,EAAa,WAAU,iCAAkC,CAAA;EAClE,OAAO,kBAAC,GAAD,EAAS,WAAU,+BAAgC,CAAA;EAC1D,SAAS,kBAAC,GAAD,EAAa,WAAU,iCAAkC,CAAA;EAClE,MAAM,kBAAC,GAAD,EAAM,WAAU,8BAA+B,CAAA;EACtD;AASD,QACE,kBAAC,OAAD;EACE,WAAW,2DATA;GACb,SAAS;GACT,OAAO;GACP,SAAS;GACT,MAAM;GACP,CAIgF,EAAM,MAAM;YAD3F;GAGG,EAAM,EAAM;GACb,kBAAC,KAAD;IAAG,WAAU;cACV,EAAM;IACL,CAAA;GACJ,kBAAC,UAAD;IACE,MAAK;IACL,eAAe,EAAQ,EAAM,GAAG;IAChC,WAAU;cAEV,kBAAC,GAAD,EAAG,WAAU,UAAW,CAAA;IACjB,CAAA;GACL;;;AASV,SAAgB,EAAe,EAAE,WAAQ,cAAgC;AACvE,QACE,kBAAC,OAAD;EAAK,WAAU;YACZ,EAAO,KAAK,MACX,kBAAC,GAAD;GAAiC;GAAgB;GAAW,EAA5C,EAAM,GAAsC,CAC5D;EACE,CAAA"}

package/dist/files/components/UploadQueue.js

@@ -16,7 +16,7 @@ function f({ item: f, onPause: p, onResume: m, onRetry: h, onCancel: g }) {
 			className: "flex items-center gap-3",
 			children: [
 				/* @__PURE__ */ l("div", {
-					className: "flex-shrink-0 w-10 h-10 bg-bg-muted rounded flex items-center justify-center overflow-hidden",
+					className: "flex-shrink-0 size-10 bg-bg-muted rounded flex items-center justify-center overflow-hidden",
 					children: f.thumbnailUrl ? /* @__PURE__ */ l("img", {
 						src: f.thumbnailUrl,
 						alt: f.file.name,

package/dist/files/components/UploadQueue.js.map

@@ -1 +1 @@
-{"version":3,"file":"UploadQueue.js","names":[],"sources":["../../../src/files/components/UploadQueue.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport {\n  Pause,\n  Play,\n  RotateCcw,\n  X,\n  CheckCircle,\n  AlertCircle,\n  Loader2,\n  Image as ImageIcon,\n} from \"lucide-react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport type { UploadItem } from \"../types\";\nimport { isImageType } from \"../utils\";\nimport { tWithFallback } from \"../utils/i18n\";\n\ninterface UploadProgressBarProps {\n  item: UploadItem;\n  onPause: (id: string) => void;\n  onResume: (id: string) => void;\n  onRetry: (id: string) => void;\n  onCancel: (id: string) => void;\n}\n\nfunction UploadProgressBar({\n  item,\n  onPause,\n  onResume,\n  onRetry,\n  onCancel,\n}: UploadProgressBarProps) {\n  const { t } = useI18n();\n  const progressRef = useRef<HTMLDivElement>(null);\n  const isImage = isImageType(item.file.type);\n\n  useEffect(() => {\n    if (progressRef.current) {\n      progressRef.current.style.width = `${item.progress}%`;\n    }\n  }, [item.progress]);\n\n  const getStatusIcon = () => {\n    switch (item.status) {\n      case \"uploading\":\n        return (\n          <Loader2 className=\"size-4 animate-spin text-action-primary-bg\" />\n        );\n      case \"paused\":\n        return <Pause className=\"size-4 text-status-warning-text\" />;\n      case \"completed\":\n        return <CheckCircle className=\"size-4 text-status-success-text\" />;\n      case \"failed\":\n        return <AlertCircle className=\"size-4 text-status-error-text\" />;\n      default:\n        return <Loader2 className=\"size-4 animate-spin text-text-tertiary\" />;\n    }\n  };\n\n  const getStatusColor = () => {\n    switch (item.status) {\n      case \"uploading\":\n        return \"bg-action-primary-bg\";\n      case \"paused\":\n        return \"bg-status-warning-bg\";\n      case \"completed\":\n        return \"bg-status-success-bg\";\n      case \"failed\":\n        return \"bg-status-error-bg\";\n      default:\n        return \"bg-text-tertiary\";\n    }\n  };\n\n  const formatFileSize = (bytes: number) => {\n    if (bytes === 0) return \"0 B\";\n    const k = 1024;\n    const sizes = [\"B\", \"KB\", \"MB\", \"GB\"];\n    const i = Math.floor(Math.log(bytes) / Math.log(k));\n    return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;\n  };\n\n  return (\n    <div className=\"bg-bg-elevated border border-border-default rounded-lg p-3\">\n      <div className=\"flex items-center gap-3\">\n        <div className=\"flex-shrink-0 w-10 h-10 bg-bg-muted rounded flex items-center justify-center overflow-hidden\">\n          {item.thumbnailUrl ? (\n            <img\n              src={item.thumbnailUrl}\n              alt={item.file.name}\n              className=\"w-full h-full object-cover\"\n            />\n          ) : isImage ? (\n            <ImageIcon className=\"size-5 text-text-tertiary\" />\n          ) : (\n            <div className=\"w-full h-full bg-bg-accent\" />\n          )}\n        </div>\n\n        <div className=\"flex-1 min-w-0\">\n          <div className=\"flex items-center justify-between gap-2 mb-1.5\">\n            <span className=\"text-sm font-medium text-text-primary truncate\">\n              {item.file.name}\n            </span>\n            <span className=\"text-xs text-text-secondary whitespace-nowrap\">\n              {formatFileSize(item.file.size)}\n            </span>\n          </div>\n\n          <div className=\"relative h-1.5 bg-bg-muted rounded-full overflow-hidden\">\n            <div\n              ref={progressRef}\n              className={`absolute inset-y-0 left-0 ${getStatusColor()} transition-all duration-300 ease-out rounded-full`}\n              style={{ width: `${item.progress}%` }}\n            />\n          </div>\n\n          <div className=\"flex items-center justify-between mt-1.5\">\n            <span className=\"text-xs text-text-secondary\">\n              {item.status === \"paused\" &&\n                tWithFallback(t, \"files.upload.paused\", \"Paused\")}\n              {item.status === \"uploading\" && `${item.progress}%`}\n              {item.status === \"completed\" &&\n                tWithFallback(t, \"files.upload.completed\", \"Completed\")}\n              {item.status === \"failed\" &&\n                (item.error ||\n                  tWithFallback(t, \"files.upload.failed\", \"Failed\"))}\n              {item.status === \"pending\" &&\n                tWithFallback(t, \"files.upload.pending\", \"Pending...\")}\n            </span>\n          </div>\n        </div>\n\n        <div className=\"flex items-center gap-1 flex-shrink-0\">\n          {item.status === \"uploading\" && (\n            <button\n              type=\"button\"\n              onClick={() => onPause(item.id)}\n              className=\"p-1.5 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors\"\n              title={tWithFallback(t, \"files.upload.pause\", \"Pause\")}\n            >\n              <Pause className=\"size-4\" />\n            </button>\n          )}\n\n          {item.status === \"paused\" && (\n            <button\n              type=\"button\"\n              onClick={() => onResume(item.id)}\n              className=\"p-1.5 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors\"\n              title={tWithFallback(t, \"files.upload.resume\", \"Resume\")}\n            >\n              <Play className=\"size-4\" />\n            </button>\n          )}\n\n          {item.status === \"failed\" && (\n            <button\n              type=\"button\"\n              onClick={() => onRetry(item.id)}\n              className=\"p-1.5 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors\"\n              title={tWithFallback(t, \"files.upload.retry\", \"Retry\")}\n            >\n              <RotateCcw className=\"size-4\" />\n            </button>\n          )}\n\n          {(item.status === \"pending\" ||\n            item.status === \"paused\" ||\n            item.status === \"failed\") && (\n            <button\n              type=\"button\"\n              onClick={() => onCancel(item.id)}\n              className=\"p-1.5 text-text-secondary hover:text-status-error-text hover:bg-status-error-bg-subtle rounded transition-colors\"\n              title={tWithFallback(t, \"files.upload.cancel\", \"Cancel\")}\n            >\n              <X className=\"size-4\" />\n            </button>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n}\n\ninterface UploadQueueProps {\n  items: UploadItem[];\n  isOpen: boolean;\n  onClose: () => void;\n  onPause: (id: string) => void;\n  onResume: (id: string) => void;\n  onRetry: (id: string) => void;\n  onCancel: (id: string) => void;\n}\n\nexport function UploadQueue({\n  items,\n  isOpen,\n  onClose,\n  onPause,\n  onResume,\n  onRetry,\n  onCancel,\n}: UploadQueueProps) {\n  const { t } = useI18n();\n  if (!isOpen) return null;\n\n  const completedCount = items.filter((i) => i.status === \"completed\").length;\n  const failedCount = items.filter((i) => i.status === \"failed\").length;\n  const activeCount = items.filter(\n    (i) => i.status === \"uploading\" || i.status === \"pending\",\n  ).length;\n\n  return (\n    <div className=\"fixed bottom-4 right-4 w-80 md:w-96 max-w-[90vw] bg-bg-elevated border border-border-default rounded-lg shadow-xl z-50\">\n      <div className=\"flex items-center justify-between p-3 border-b border-border-default\">\n        <div>\n          <h3 className=\"text-sm font-semibold text-text-primary\">\n            {tWithFallback(t, \"files.upload.uploads\", \"Uploads\")} ({activeCount}{\" \"}\n            {tWithFallback(t, \"files.upload.active\", \"active\")})\n          </h3>\n          {completedCount > 0 && (\n            <p className=\"text-xs text-status-success-text\">\n              {completedCount}{\" \"}\n              {tWithFallback(t, \"files.upload.completed\", \"completed\")}\n            </p>\n          )}\n          {failedCount > 0 && (\n            <p className=\"text-xs text-status-error-text\">\n              {failedCount} {tWithFallback(t, \"files.upload.failed\", \"failed\")}\n            </p>\n          )}\n        </div>\n        <button\n          type=\"button\"\n          onClick={onClose}\n          className=\"p-1 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors\"\n        >\n          <X className=\"size-4\" />\n        </button>\n      </div>\n\n      <div className=\"max-h-64 overflow-y-auto p-2 space-y-2\">\n        {items.length === 0 ? (\n          <p className=\"text-sm text-text-secondary text-center py-4\">\n            {tWithFallback(t, \"files.upload.noUploads\", \"No uploads\")}\n          </p>\n        ) : (\n          items.map((item) => (\n            <UploadProgressBar\n              key={item.id}\n              item={item}\n              onPause={onPause}\n              onResume={onResume}\n              onRetry={onRetry}\n              onCancel={onCancel}\n            />\n          ))\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"UploadQueue.js","names":[],"sources":["../../../src/files/components/UploadQueue.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport {\n  Pause,\n  Play,\n  RotateCcw,\n  X,\n  CheckCircle,\n  AlertCircle,\n  Loader2,\n  Image as ImageIcon,\n} from \"lucide-react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport type { UploadItem } from \"../types\";\nimport { isImageType } from \"../utils\";\nimport { tWithFallback } from \"../utils/i18n\";\n\ninterface UploadProgressBarProps {\n  item: UploadItem;\n  onPause: (id: string) => void;\n  onResume: (id: string) => void;\n  onRetry: (id: string) => void;\n  onCancel: (id: string) => void;\n}\n\nfunction UploadProgressBar({\n  item,\n  onPause,\n  onResume,\n  onRetry,\n  onCancel,\n}: UploadProgressBarProps) {\n  const { t } = useI18n();\n  const progressRef = useRef<HTMLDivElement>(null);\n  const isImage = isImageType(item.file.type);\n\n  useEffect(() => {\n    if (progressRef.current) {\n      progressRef.current.style.width = `${item.progress}%`;\n    }\n  }, [item.progress]);\n\n  const getStatusIcon = () => {\n    switch (item.status) {\n      case \"uploading\":\n        return (\n          <Loader2 className=\"size-4 animate-spin text-action-primary-bg\" />\n        );\n      case \"paused\":\n        return <Pause className=\"size-4 text-status-warning-text\" />;\n      case \"completed\":\n        return <CheckCircle className=\"size-4 text-status-success-text\" />;\n      case \"failed\":\n        return <AlertCircle className=\"size-4 text-status-error-text\" />;\n      default:\n        return <Loader2 className=\"size-4 animate-spin text-text-tertiary\" />;\n    }\n  };\n\n  const getStatusColor = () => {\n    switch (item.status) {\n      case \"uploading\":\n        return \"bg-action-primary-bg\";\n      case \"paused\":\n        return \"bg-status-warning-bg\";\n      case \"completed\":\n        return \"bg-status-success-bg\";\n      case \"failed\":\n        return \"bg-status-error-bg\";\n      default:\n        return \"bg-text-tertiary\";\n    }\n  };\n\n  const formatFileSize = (bytes: number) => {\n    if (bytes === 0) return \"0 B\";\n    const k = 1024;\n    const sizes = [\"B\", \"KB\", \"MB\", \"GB\"];\n    const i = Math.floor(Math.log(bytes) / Math.log(k));\n    return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;\n  };\n\n  return (\n    <div className=\"bg-bg-elevated border border-border-default rounded-lg p-3\">\n      <div className=\"flex items-center gap-3\">\n        <div className=\"flex-shrink-0 size-10 bg-bg-muted rounded flex items-center justify-center overflow-hidden\">\n          {item.thumbnailUrl ? (\n            <img\n              src={item.thumbnailUrl}\n              alt={item.file.name}\n              className=\"w-full h-full object-cover\"\n            />\n          ) : isImage ? (\n            <ImageIcon className=\"size-5 text-text-tertiary\" />\n          ) : (\n            <div className=\"w-full h-full bg-bg-accent\" />\n          )}\n        </div>\n\n        <div className=\"flex-1 min-w-0\">\n          <div className=\"flex items-center justify-between gap-2 mb-1.5\">\n            <span className=\"text-sm font-medium text-text-primary truncate\">\n              {item.file.name}\n            </span>\n            <span className=\"text-xs text-text-secondary whitespace-nowrap\">\n              {formatFileSize(item.file.size)}\n            </span>\n          </div>\n\n          <div className=\"relative h-1.5 bg-bg-muted rounded-full overflow-hidden\">\n            <div\n              ref={progressRef}\n              className={`absolute inset-y-0 left-0 ${getStatusColor()} transition-all duration-300 ease-out rounded-full`}\n              style={{ width: `${item.progress}%` }}\n            />\n          </div>\n\n          <div className=\"flex items-center justify-between mt-1.5\">\n            <span className=\"text-xs text-text-secondary\">\n              {item.status === \"paused\" &&\n                tWithFallback(t, \"files.upload.paused\", \"Paused\")}\n              {item.status === \"uploading\" && `${item.progress}%`}\n              {item.status === \"completed\" &&\n                tWithFallback(t, \"files.upload.completed\", \"Completed\")}\n              {item.status === \"failed\" &&\n                (item.error ||\n                  tWithFallback(t, \"files.upload.failed\", \"Failed\"))}\n              {item.status === \"pending\" &&\n                tWithFallback(t, \"files.upload.pending\", \"Pending...\")}\n            </span>\n          </div>\n        </div>\n\n        <div className=\"flex items-center gap-1 flex-shrink-0\">\n          {item.status === \"uploading\" && (\n            <button\n              type=\"button\"\n              onClick={() => onPause(item.id)}\n              className=\"p-1.5 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors\"\n              title={tWithFallback(t, \"files.upload.pause\", \"Pause\")}\n            >\n              <Pause className=\"size-4\" />\n            </button>\n          )}\n\n          {item.status === \"paused\" && (\n            <button\n              type=\"button\"\n              onClick={() => onResume(item.id)}\n              className=\"p-1.5 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors\"\n              title={tWithFallback(t, \"files.upload.resume\", \"Resume\")}\n            >\n              <Play className=\"size-4\" />\n            </button>\n          )}\n\n          {item.status === \"failed\" && (\n            <button\n              type=\"button\"\n              onClick={() => onRetry(item.id)}\n              className=\"p-1.5 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors\"\n              title={tWithFallback(t, \"files.upload.retry\", \"Retry\")}\n            >\n              <RotateCcw className=\"size-4\" />\n            </button>\n          )}\n\n          {(item.status === \"pending\" ||\n            item.status === \"paused\" ||\n            item.status === \"failed\") && (\n            <button\n              type=\"button\"\n              onClick={() => onCancel(item.id)}\n              className=\"p-1.5 text-text-secondary hover:text-status-error-text hover:bg-status-error-bg-subtle rounded transition-colors\"\n              title={tWithFallback(t, \"files.upload.cancel\", \"Cancel\")}\n            >\n              <X className=\"size-4\" />\n            </button>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n}\n\ninterface UploadQueueProps {\n  items: UploadItem[];\n  isOpen: boolean;\n  onClose: () => void;\n  onPause: (id: string) => void;\n  onResume: (id: string) => void;\n  onRetry: (id: string) => void;\n  onCancel: (id: string) => void;\n}\n\nexport function UploadQueue({\n  items,\n  isOpen,\n  onClose,\n  onPause,\n  onResume,\n  onRetry,\n  onCancel,\n}: UploadQueueProps) {\n  const { t } = useI18n();\n  if (!isOpen) return null;\n\n  const completedCount = items.filter((i) => i.status === \"completed\").length;\n  const failedCount = items.filter((i) => i.status === \"failed\").length;\n  const activeCount = items.filter(\n    (i) => i.status === \"uploading\" || i.status === \"pending\",\n  ).length;\n\n  return (\n    <div className=\"fixed bottom-4 right-4 w-80 md:w-96 max-w-[90vw] bg-bg-elevated border border-border-default rounded-lg shadow-xl z-50\">\n      <div className=\"flex items-center justify-between p-3 border-b border-border-default\">\n        <div>\n          <h3 className=\"text-sm font-semibold text-text-primary\">\n            {tWithFallback(t, \"files.upload.uploads\", \"Uploads\")} ({activeCount}{\" \"}\n            {tWithFallback(t, \"files.upload.active\", \"active\")})\n          </h3>\n          {completedCount > 0 && (\n            <p className=\"text-xs text-status-success-text\">\n              {completedCount}{\" \"}\n              {tWithFallback(t, \"files.upload.completed\", \"completed\")}\n            </p>\n          )}\n          {failedCount > 0 && (\n            <p className=\"text-xs text-status-error-text\">\n              {failedCount} {tWithFallback(t, \"files.upload.failed\", \"failed\")}\n            </p>\n          )}\n        </div>\n        <button\n          type=\"button\"\n          onClick={onClose}\n          className=\"p-1 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors\"\n        >\n          <X className=\"size-4\" />\n        </button>\n      </div>\n\n      <div className=\"max-h-64 overflow-y-auto p-2 space-y-2\">\n        {items.length === 0 ? (\n          <p className=\"text-sm text-text-secondary text-center py-4\">\n            {tWithFallback(t, \"files.upload.noUploads\", \"No uploads\")}\n          </p>\n        ) : (\n          items.map((item) => (\n            <UploadProgressBar\n              key={item.id}\n              item={item}\n              onPause={onPause}\n              onResume={onResume}\n              onRetry={onRetry}\n              onCancel={onCancel}\n            />\n          ))\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/files/components/viewers/AudioPlayer.js

@@ -30,6 +30,7 @@ function u({ file: u, url: d }) {
 			/* @__PURE__ */ c("audio", {
 				ref: f,
 				src: d,
+				"aria-label": u.name,
 				children: /* @__PURE__ */ c("track", { kind: "captions" })
 			}),
 			/* @__PURE__ */ l("div", {
@@ -63,6 +64,7 @@ function u({ file: u, url: d }) {
 						max: _ || 0,
 						value: h,
 						onChange: (e) => w(Number(e.target.value)),
+						"aria-label": "Seek",
 						className: "w-full h-2 bg-bg-muted rounded-lg appearance-none cursor-pointer accent-action-primary-bg"
 					}), /* @__PURE__ */ l("div", {
 						className: "flex justify-between mt-2 text-sm text-text-secondary",
@@ -91,6 +93,7 @@ function u({ file: u, url: d }) {
 							step: .1,
 							value: y,
 							onChange: (e) => T(Number(e.target.value)),
+							"aria-label": "Volume",
 							className: "w-24 h-1 bg-bg-muted rounded-lg appearance-none cursor-pointer accent-action-primary-bg"
 						})]
 					})]

package/dist/files/components/viewers/AudioPlayer.js.map

@@ -1 +1 @@
-{"version":3,"file":"AudioPlayer.js","names":[],"sources":["../../../../src/files/components/viewers/AudioPlayer.tsx"],"sourcesContent":["import { useState, useRef, useEffect } from \"react\";\nimport { Play, Pause, Volume2, VolumeX, Music } from \"lucide-react\";\nimport type { FileItem } from \"../../types\";\n\ninterface AudioPlayerProps {\n  file: FileItem;\n  url: string;\n}\n\nexport function AudioPlayer({ file, url }: AudioPlayerProps) {\n  const audioRef = useRef<HTMLAudioElement>(null);\n  const [isPlaying, setIsPlaying] = useState(false);\n  const [currentTime, setCurrentTime] = useState(0);\n  const [duration, setDuration] = useState(0);\n  const [volume, setVolume] = useState(1);\n  const [isMuted, setIsMuted] = useState(false);\n\n  useEffect(() => {\n    const audio = audioRef.current;\n    if (!audio) return;\n\n    const handleTimeUpdate = () => setCurrentTime(audio.currentTime);\n    const handleLoadedMetadata = () => setDuration(audio.duration);\n    const handleEnded = () => setIsPlaying(false);\n\n    audio.addEventListener(\"timeupdate\", handleTimeUpdate);\n    audio.addEventListener(\"loadedmetadata\", handleLoadedMetadata);\n    audio.addEventListener(\"ended\", handleEnded);\n\n    return () => {\n      audio.removeEventListener(\"timeupdate\", handleTimeUpdate);\n      audio.removeEventListener(\"loadedmetadata\", handleLoadedMetadata);\n      audio.removeEventListener(\"ended\", handleEnded);\n    };\n  }, []);\n\n  const togglePlay = () => {\n    if (audioRef.current) {\n      if (isPlaying) {\n        audioRef.current.pause();\n      } else {\n        audioRef.current.play();\n      }\n      setIsPlaying(!isPlaying);\n    }\n  };\n\n  const handleSeek = (time: number) => {\n    if (audioRef.current) {\n      audioRef.current.currentTime = time;\n      setCurrentTime(time);\n    }\n  };\n\n  const handleVolumeChange = (newVolume: number) => {\n    setVolume(newVolume);\n    setIsMuted(newVolume === 0);\n    if (audioRef.current) {\n      audioRef.current.volume = newVolume;\n    }\n  };\n\n  const toggleMute = () => {\n    if (audioRef.current) {\n      const newMuted = !isMuted;\n      setIsMuted(newMuted);\n      audioRef.current.muted = newMuted;\n    }\n  };\n\n  const formatTime = (seconds: number): string => {\n    const mins = Math.floor(seconds / 60);\n    const secs = Math.floor(seconds % 60);\n    return `${mins}:${secs.toString().padStart(2, \"0\")}`;\n  };\n\n  return (\n    <div className=\"flex flex-col h-full bg-bg-canvas\">\n      <audio ref={audioRef} src={url}>\n        <track kind=\"captions\" />\n      </audio>\n\n      {/* Album Art Placeholder */}\n      <div className=\"flex-1 flex flex-col items-center justify-center p-8\">\n        <div className=\"size-64 rounded-lg bg-bg-muted flex items-center justify-center mb-8 shadow-lg\">\n          <Music className=\"size-32 text-text-tertiary\" />\n        </div>\n\n        {/* Track Info */}\n        <h2 className=\"text-xl font-semibold text-text-primary mb-2\">\n          {file.name}\n        </h2>\n        <p className=\"text-sm text-text-secondary mb-1\">\n          {(file.size / 1024 / 1024).toFixed(2)} MB\n        </p>\n        <p className=\"text-sm text-text-secondary\">{formatTime(duration)}</p>\n      </div>\n\n      {/* Controls */}\n      <div className=\"bg-bg-surface border-t border-border-default p-6\">\n        {/* Progress Bar */}\n        <div className=\"mb-4\">\n          <input\n            type=\"range\"\n            min={0}\n            max={duration || 0}\n            value={currentTime}\n            onChange={(e) => handleSeek(Number(e.target.value))}\n            className=\"w-full h-2 bg-bg-muted rounded-lg appearance-none cursor-pointer accent-action-primary-bg\"\n          />\n          <div className=\"flex justify-between mt-2 text-sm text-text-secondary\">\n            <span>{formatTime(currentTime)}</span>\n            <span>{formatTime(duration)}</span>\n          </div>\n        </div>\n\n        {/* Control Buttons */}\n        <div className=\"flex items-center justify-center gap-4\">\n          {/* Play/Pause */}\n          <button\n            type=\"button\"\n            onClick={togglePlay}\n            className=\"p-4 text-text-inverse bg-action-primary-bg hover:bg-action-primary-bg-hover rounded-full transition-colors duration-200\"\n            title={isPlaying ? \"Pause\" : \"Play\"}\n          >\n            {isPlaying ? (\n              <Pause className=\"size-6\" />\n            ) : (\n              <Play className=\"size-6\" />\n            )}\n          </button>\n\n          {/* Volume Controls */}\n          <div className=\"flex items-center gap-2 ml-4\">\n            <button\n              type=\"button\"\n              onClick={toggleMute}\n              className=\"p-2 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors duration-200\"\n              title={isMuted ? \"Unmute\" : \"Mute\"}\n            >\n              {isMuted ? (\n                <VolumeX className=\"size-5\" />\n              ) : (\n                <Volume2 className=\"size-5\" />\n              )}\n            </button>\n            <input\n              type=\"range\"\n              min={0}\n              max={1}\n              step={0.1}\n              value={volume}\n              onChange={(e) => handleVolumeChange(Number(e.target.value))}\n              className=\"w-24 h-1 bg-bg-muted rounded-lg appearance-none cursor-pointer accent-action-primary-bg\"\n            />\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"AudioPlayer.js","names":[],"sources":["../../../../src/files/components/viewers/AudioPlayer.tsx"],"sourcesContent":["import { useState, useRef, useEffect } from \"react\";\nimport { Play, Pause, Volume2, VolumeX, Music } from \"lucide-react\";\nimport type { FileItem } from \"../../types\";\n\ninterface AudioPlayerProps {\n  file: FileItem;\n  url: string;\n}\n\nexport function AudioPlayer({ file, url }: AudioPlayerProps) {\n  const audioRef = useRef<HTMLAudioElement>(null);\n  const [isPlaying, setIsPlaying] = useState(false);\n  const [currentTime, setCurrentTime] = useState(0);\n  const [duration, setDuration] = useState(0);\n  const [volume, setVolume] = useState(1);\n  const [isMuted, setIsMuted] = useState(false);\n\n  useEffect(() => {\n    const audio = audioRef.current;\n    if (!audio) return;\n\n    const handleTimeUpdate = () => setCurrentTime(audio.currentTime);\n    const handleLoadedMetadata = () => setDuration(audio.duration);\n    const handleEnded = () => setIsPlaying(false);\n\n    audio.addEventListener(\"timeupdate\", handleTimeUpdate);\n    audio.addEventListener(\"loadedmetadata\", handleLoadedMetadata);\n    audio.addEventListener(\"ended\", handleEnded);\n\n    return () => {\n      audio.removeEventListener(\"timeupdate\", handleTimeUpdate);\n      audio.removeEventListener(\"loadedmetadata\", handleLoadedMetadata);\n      audio.removeEventListener(\"ended\", handleEnded);\n    };\n  }, []);\n\n  const togglePlay = () => {\n    if (audioRef.current) {\n      if (isPlaying) {\n        audioRef.current.pause();\n      } else {\n        audioRef.current.play();\n      }\n      setIsPlaying(!isPlaying);\n    }\n  };\n\n  const handleSeek = (time: number) => {\n    if (audioRef.current) {\n      audioRef.current.currentTime = time;\n      setCurrentTime(time);\n    }\n  };\n\n  const handleVolumeChange = (newVolume: number) => {\n    setVolume(newVolume);\n    setIsMuted(newVolume === 0);\n    if (audioRef.current) {\n      audioRef.current.volume = newVolume;\n    }\n  };\n\n  const toggleMute = () => {\n    if (audioRef.current) {\n      const newMuted = !isMuted;\n      setIsMuted(newMuted);\n      audioRef.current.muted = newMuted;\n    }\n  };\n\n  const formatTime = (seconds: number): string => {\n    const mins = Math.floor(seconds / 60);\n    const secs = Math.floor(seconds % 60);\n    return `${mins}:${secs.toString().padStart(2, \"0\")}`;\n  };\n\n  return (\n    <div className=\"flex flex-col h-full bg-bg-canvas\">\n      <audio ref={audioRef} src={url} aria-label={file.name}>\n        <track kind=\"captions\" />\n      </audio>\n\n      {/* Album Art Placeholder */}\n      <div className=\"flex-1 flex flex-col items-center justify-center p-8\">\n        <div className=\"size-64 rounded-lg bg-bg-muted flex items-center justify-center mb-8 shadow-lg\">\n          <Music className=\"size-32 text-text-tertiary\" />\n        </div>\n\n        {/* Track Info */}\n        <h2 className=\"text-xl font-semibold text-text-primary mb-2\">\n          {file.name}\n        </h2>\n        <p className=\"text-sm text-text-secondary mb-1\">\n          {(file.size / 1024 / 1024).toFixed(2)} MB\n        </p>\n        <p className=\"text-sm text-text-secondary\">{formatTime(duration)}</p>\n      </div>\n\n      {/* Controls */}\n      <div className=\"bg-bg-surface border-t border-border-default p-6\">\n        {/* Progress Bar */}\n        <div className=\"mb-4\">\n          <input\n            type=\"range\"\n            min={0}\n            max={duration || 0}\n            value={currentTime}\n            onChange={(e) => handleSeek(Number(e.target.value))}\n            aria-label=\"Seek\"\n            className=\"w-full h-2 bg-bg-muted rounded-lg appearance-none cursor-pointer accent-action-primary-bg\"\n          />\n          <div className=\"flex justify-between mt-2 text-sm text-text-secondary\">\n            <span>{formatTime(currentTime)}</span>\n            <span>{formatTime(duration)}</span>\n          </div>\n        </div>\n\n        {/* Control Buttons */}\n        <div className=\"flex items-center justify-center gap-4\">\n          {/* Play/Pause */}\n          <button\n            type=\"button\"\n            onClick={togglePlay}\n            className=\"p-4 text-text-inverse bg-action-primary-bg hover:bg-action-primary-bg-hover rounded-full transition-colors duration-200\"\n            title={isPlaying ? \"Pause\" : \"Play\"}\n          >\n            {isPlaying ? (\n              <Pause className=\"size-6\" />\n            ) : (\n              <Play className=\"size-6\" />\n            )}\n          </button>\n\n          {/* Volume Controls */}\n          <div className=\"flex items-center gap-2 ml-4\">\n            <button\n              type=\"button\"\n              onClick={toggleMute}\n              className=\"p-2 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors duration-200\"\n              title={isMuted ? \"Unmute\" : \"Mute\"}\n            >\n              {isMuted ? (\n                <VolumeX className=\"size-5\" />\n              ) : (\n                <Volume2 className=\"size-5\" />\n              )}\n            </button>\n            <input\n              type=\"range\"\n              min={0}\n              max={1}\n              step={0.1}\n              value={volume}\n              onChange={(e) => handleVolumeChange(Number(e.target.value))}\n              aria-label=\"Volume\"\n              className=\"w-24 h-1 bg-bg-muted rounded-lg appearance-none cursor-pointer accent-action-primary-bg\"\n            />\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/files/components/viewers/TextViewer.js

@@ -68,6 +68,7 @@ function d({ file: d, url: f }) {
 									value: y,
 									onChange: (e) => b(e.target.value),
 									placeholder: "Search...",
+									"aria-label": "Search text",
 									className: "w-40 bg-transparent text-sm text-text-primary placeholder:text-text-tertiary focus:outline-none"
 								}),
 								D > 0 && /* @__PURE__ */ l("span", {

package/dist/files/components/viewers/TextViewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextViewer.js","names":[],"sources":["../../../../src/files/components/viewers/TextViewer.tsx"],"sourcesContent":["import { useState, useEffect, useMemo } from \"react\";\nimport { Copy, Check, WrapText, Search } from \"lucide-react\";\nimport type { FileItem } from \"../../types\";\n\ninterface TextViewerProps {\n  file: FileItem;\n  url: string;\n}\n\nfunction escapeRegExp(value: string): string {\n  return value.replace(/[.*+?^${}()|[\\]\\\\]/g, \"\\\\$&\");\n}\n\nexport function TextViewer({ file, url }: TextViewerProps) {\n  const [content, setContent] = useState(\"\");\n  const [loading, setLoading] = useState(true);\n  const [wordWrap, setWordWrap] = useState(true);\n  const [searchTerm, setSearchTerm] = useState(\"\");\n  const [showSearch, setShowSearch] = useState(false);\n  const [copied, setCopied] = useState(false);\n\n  useEffect(() => {\n    fetch(url)\n      .then((res) => res.text())\n      .then((text) => {\n        setContent(text);\n        setLoading(false);\n      })\n      .catch(() => {\n        setLoading(false);\n      });\n  }, [url]);\n\n  const handleCopy = () => {\n    navigator.clipboard.writeText(content);\n    setCopied(true);\n  };\n\n  // Cleanup timeout on unmount to prevent React state update warning\n  useEffect(() => {\n    if (copied) {\n      const timer = setTimeout(() => setCopied(false), 2000);\n      return () => clearTimeout(timer);\n    }\n    return undefined;\n  }, [copied]);\n\n  // Highlight search matches\n  const highlightedLines = useMemo(() => {\n    const lines = content.split(\"\\n\");\n\n    if (!searchTerm.trim()) {\n      return lines.map((line) => [{ text: line, isMatch: false }]);\n    }\n\n    const matcher = new RegExp(`(${escapeRegExp(searchTerm)})`, \"gi\");\n    return lines.map((line) =>\n      line.split(matcher).map((part) => ({\n        text: part,\n        isMatch: part.toLowerCase() === searchTerm.toLowerCase(),\n      })),\n    );\n  }, [content, searchTerm]);\n\n  const matchCount = useMemo(() => {\n    if (!searchTerm.trim()) return 0;\n    const regex = new RegExp(searchTerm, \"gi\");\n    return (content.match(regex) || []).length;\n  }, [content, searchTerm]);\n\n  if (loading) {\n    return (\n      <div className=\"flex items-center justify-center h-full bg-bg-canvas\">\n        <span className=\"text-text-secondary\">Loading text...</span>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"flex flex-col h-full bg-bg-canvas\">\n      {/* Toolbar */}\n      <div className=\"flex items-center justify-between p-3 bg-bg-surface border-b border-border-default\">\n        <div className=\"flex items-center gap-2\">\n          <span className=\"text-sm text-text-secondary\">{file.name}</span>\n        </div>\n\n        <div className=\"flex items-center gap-2\">\n          {showSearch && (\n            <div className=\"flex items-center gap-2 px-2 py-1 border border-border-default rounded\">\n              <Search className=\"size-4 text-text-secondary\" />\n              <input\n                type=\"text\"\n                value={searchTerm}\n                onChange={(e) => setSearchTerm(e.target.value)}\n                placeholder=\"Search...\"\n                className=\"w-40 bg-transparent text-sm text-text-primary placeholder:text-text-tertiary focus:outline-none\"\n              />\n              {matchCount > 0 && (\n                <span className=\"text-xs text-text-secondary\">\n                  {matchCount} match{matchCount > 1 ? \"es\" : \"\"}\n                </span>\n              )}\n            </div>\n          )}\n\n          <button\n            type=\"button\"\n            onClick={() => setShowSearch(!showSearch)}\n            className={`p-2 rounded transition-colors duration-200 ${\n              showSearch\n                ? \"text-text-link bg-bg-accent\"\n                : \"text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover\"\n            }`}\n            title=\"Search\"\n            aria-label=\"Search within text file\"\n          >\n            <Search className=\"size-4\" />\n          </button>\n\n          <button\n            type=\"button\"\n            onClick={() => setWordWrap(!wordWrap)}\n            className={`p-2 rounded transition-colors duration-200 ${\n              wordWrap\n                ? \"text-text-link bg-bg-accent\"\n                : \"text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover\"\n            }`}\n            title={wordWrap ? \"Disable word wrap\" : \"Enable word wrap\"}\n            aria-label={wordWrap ? \"Disable word wrap\" : \"Enable word wrap\"}\n          >\n            <WrapText className=\"size-4\" />\n          </button>\n\n          <button\n            type=\"button\"\n            onClick={handleCopy}\n            className=\"flex items-center gap-1.5 rounded px-3 py-1.5 text-sm font-medium text-text-inverse bg-action-primary-bg transition-colors duration-200 hover:bg-action-primary-bg-hover\"\n            title=\"Copy text\"\n            aria-label=\"Copy text content\"\n          >\n            {copied ? (\n              <>\n                <Check className=\"size-4\" />\n                Copied!\n              </>\n            ) : (\n              <>\n                <Copy className=\"size-4\" />\n                Copy\n              </>\n            )}\n          </button>\n        </div>\n      </div>\n\n      {/* Text Content */}\n      <div className=\"flex-1 overflow-auto\">\n        <pre\n          className={`p-4 text-sm font-mono leading-relaxed text-text-primary ${\n            wordWrap ? \"whitespace-pre-wrap\" : \"whitespace-pre\"\n          }`}\n        >\n          {highlightedLines.map((segments, lineIndex) => (\n            <div key={lineIndex}>\n              {segments.length === 0\n                ? \" \"\n                : segments.map((segment, partIndex) =>\n                    segment.isMatch ? (\n                      <mark\n                        key={`${lineIndex}-${partIndex}`}\n                        className=\"bg-status-warning-bg text-text-primary\"\n                      >\n                        {segment.text}\n                      </mark>\n                    ) : (\n                      <span key={`${lineIndex}-${partIndex}`}>\n                        {segment.text || \" \"}\n                      </span>\n                    ),\n                  )}\n            </div>\n          ))}\n        </pre>\n      </div>\n\n      {/* Footer */}\n      <div className=\"flex items-center justify-between p-3 bg-bg-surface border-t border-border-default text-xs text-text-secondary\">\n        <span>{content.split(\"\\n\").length} lines</span>\n        <span>{(file.size / 1024).toFixed(2)} KB</span>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"TextViewer.js","names":[],"sources":["../../../../src/files/components/viewers/TextViewer.tsx"],"sourcesContent":["import { useState, useEffect, useMemo } from \"react\";\nimport { Copy, Check, WrapText, Search } from \"lucide-react\";\nimport type { FileItem } from \"../../types\";\n\ninterface TextViewerProps {\n  file: FileItem;\n  url: string;\n}\n\nfunction escapeRegExp(value: string): string {\n  return value.replace(/[.*+?^${}()|[\\]\\\\]/g, \"\\\\$&\");\n}\n\nexport function TextViewer({ file, url }: TextViewerProps) {\n  const [content, setContent] = useState(\"\");\n  const [loading, setLoading] = useState(true);\n  const [wordWrap, setWordWrap] = useState(true);\n  const [searchTerm, setSearchTerm] = useState(\"\");\n  const [showSearch, setShowSearch] = useState(false);\n  const [copied, setCopied] = useState(false);\n\n  useEffect(() => {\n    fetch(url)\n      .then((res) => res.text())\n      .then((text) => {\n        setContent(text);\n        setLoading(false);\n      })\n      .catch(() => {\n        setLoading(false);\n      });\n  }, [url]);\n\n  const handleCopy = () => {\n    navigator.clipboard.writeText(content);\n    setCopied(true);\n  };\n\n  // Cleanup timeout on unmount to prevent React state update warning\n  useEffect(() => {\n    if (copied) {\n      const timer = setTimeout(() => setCopied(false), 2000);\n      return () => clearTimeout(timer);\n    }\n    return undefined;\n  }, [copied]);\n\n  // Highlight search matches\n  const highlightedLines = useMemo(() => {\n    const lines = content.split(\"\\n\");\n\n    if (!searchTerm.trim()) {\n      return lines.map((line) => [{ text: line, isMatch: false }]);\n    }\n\n    const matcher = new RegExp(`(${escapeRegExp(searchTerm)})`, \"gi\");\n    return lines.map((line) =>\n      line.split(matcher).map((part) => ({\n        text: part,\n        isMatch: part.toLowerCase() === searchTerm.toLowerCase(),\n      })),\n    );\n  }, [content, searchTerm]);\n\n  const matchCount = useMemo(() => {\n    if (!searchTerm.trim()) return 0;\n    const regex = new RegExp(searchTerm, \"gi\");\n    return (content.match(regex) || []).length;\n  }, [content, searchTerm]);\n\n  if (loading) {\n    return (\n      <div className=\"flex items-center justify-center h-full bg-bg-canvas\">\n        <span className=\"text-text-secondary\">Loading text...</span>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"flex flex-col h-full bg-bg-canvas\">\n      {/* Toolbar */}\n      <div className=\"flex items-center justify-between p-3 bg-bg-surface border-b border-border-default\">\n        <div className=\"flex items-center gap-2\">\n          <span className=\"text-sm text-text-secondary\">{file.name}</span>\n        </div>\n\n        <div className=\"flex items-center gap-2\">\n          {showSearch && (\n            <div className=\"flex items-center gap-2 px-2 py-1 border border-border-default rounded\">\n              <Search className=\"size-4 text-text-secondary\" />\n              <input\n                type=\"text\"\n                value={searchTerm}\n                onChange={(e) => setSearchTerm(e.target.value)}\n                placeholder=\"Search...\"\n                aria-label=\"Search text\"\n                className=\"w-40 bg-transparent text-sm text-text-primary placeholder:text-text-tertiary focus:outline-none\"\n              />\n              {matchCount > 0 && (\n                <span className=\"text-xs text-text-secondary\">\n                  {matchCount} match{matchCount > 1 ? \"es\" : \"\"}\n                </span>\n              )}\n            </div>\n          )}\n\n          <button\n            type=\"button\"\n            onClick={() => setShowSearch(!showSearch)}\n            className={`p-2 rounded transition-colors duration-200 ${\n              showSearch\n                ? \"text-text-link bg-bg-accent\"\n                : \"text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover\"\n            }`}\n            title=\"Search\"\n            aria-label=\"Search within text file\"\n          >\n            <Search className=\"size-4\" />\n          </button>\n\n          <button\n            type=\"button\"\n            onClick={() => setWordWrap(!wordWrap)}\n            className={`p-2 rounded transition-colors duration-200 ${\n              wordWrap\n                ? \"text-text-link bg-bg-accent\"\n                : \"text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover\"\n            }`}\n            title={wordWrap ? \"Disable word wrap\" : \"Enable word wrap\"}\n            aria-label={wordWrap ? \"Disable word wrap\" : \"Enable word wrap\"}\n          >\n            <WrapText className=\"size-4\" />\n          </button>\n\n          <button\n            type=\"button\"\n            onClick={handleCopy}\n            className=\"flex items-center gap-1.5 rounded px-3 py-1.5 text-sm font-medium text-text-inverse bg-action-primary-bg transition-colors duration-200 hover:bg-action-primary-bg-hover\"\n            title=\"Copy text\"\n            aria-label=\"Copy text content\"\n          >\n            {copied ? (\n              <>\n                <Check className=\"size-4\" />\n                Copied!\n              </>\n            ) : (\n              <>\n                <Copy className=\"size-4\" />\n                Copy\n              </>\n            )}\n          </button>\n        </div>\n      </div>\n\n      {/* Text Content */}\n      <div className=\"flex-1 overflow-auto\">\n        <pre\n          className={`p-4 text-sm font-mono leading-relaxed text-text-primary ${\n            wordWrap ? \"whitespace-pre-wrap\" : \"whitespace-pre\"\n          }`}\n        >\n          {highlightedLines.map((segments, lineIndex) => (\n            <div key={lineIndex}>\n              {segments.length === 0\n                ? \" \"\n                : segments.map((segment, partIndex) =>\n                    segment.isMatch ? (\n                      <mark\n                        key={`${lineIndex}-${partIndex}`}\n                        className=\"bg-status-warning-bg text-text-primary\"\n                      >\n                        {segment.text}\n                      </mark>\n                    ) : (\n                      <span key={`${lineIndex}-${partIndex}`}>\n                        {segment.text || \" \"}\n                      </span>\n                    ),\n                  )}\n            </div>\n          ))}\n        </pre>\n      </div>\n\n      {/* Footer */}\n      <div className=\"flex items-center justify-between p-3 bg-bg-surface border-t border-border-default text-xs text-text-secondary\">\n        <span>{content.split(\"\\n\").length} lines</span>\n        <span>{(file.size / 1024).toFixed(2)} KB</span>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/files/components/viewers/VideoPlayer.js

@@ -35,6 +35,7 @@ function u({ file: u, url: d }) {
 			children: /* @__PURE__ */ c("video", {
 				ref: f,
 				src: d,
+				"aria-label": u.name,
 				className: "max-w-full max-h-full",
 				onClick: T,
 				children: /* @__PURE__ */ c("track", { kind: "captions" })
@@ -49,6 +50,7 @@ function u({ file: u, url: d }) {
 					max: _ || 0,
 					value: h,
 					onChange: (e) => E(Number(e.target.value)),
+					"aria-label": "Seek",
 					className: "w-full h-1 bg-bg-muted rounded-lg appearance-none cursor-pointer accent-action-primary-bg"
 				}), /* @__PURE__ */ l("div", {
 					className: "flex justify-between mt-1 text-xs text-text-secondary",
@@ -83,6 +85,7 @@ function u({ file: u, url: d }) {
 								step: .1,
 								value: y,
 								onChange: (e) => D(Number(e.target.value)),
+								"aria-label": "Volume",
 								className: "w-20 h-1 bg-bg-muted rounded-lg appearance-none cursor-pointer accent-action-primary-bg"
 							})]
 						}),

package/dist/files/components/viewers/VideoPlayer.js.map

@@ -1 +1 @@
-{"version":3,"file":"VideoPlayer.js","names":[],"sources":["../../../../src/files/components/viewers/VideoPlayer.tsx"],"sourcesContent":["import { useState, useRef, useEffect } from \"react\";\nimport { Play, Pause, Volume2, VolumeX, Maximize } from \"lucide-react\";\nimport type { FileItem } from \"../../types\";\n\ninterface VideoPlayerProps {\n  file: FileItem;\n  url: string;\n}\n\nexport function VideoPlayer({ file, url }: VideoPlayerProps) {\n  const videoRef = useRef<HTMLVideoElement>(null);\n  const [isPlaying, setIsPlaying] = useState(false);\n  const [currentTime, setCurrentTime] = useState(0);\n  const [duration, setDuration] = useState(0);\n  const [volume, setVolume] = useState(1);\n  const [isMuted, setIsMuted] = useState(false);\n  const [playbackRate, setPlaybackRate] = useState(1);\n\n  useEffect(() => {\n    const video = videoRef.current;\n    if (!video) return;\n\n    const handleTimeUpdate = () => setCurrentTime(video.currentTime);\n    const handleLoadedMetadata = () => setDuration(video.duration);\n    const handleEnded = () => setIsPlaying(false);\n\n    video.addEventListener(\"timeupdate\", handleTimeUpdate);\n    video.addEventListener(\"loadedmetadata\", handleLoadedMetadata);\n    video.addEventListener(\"ended\", handleEnded);\n\n    return () => {\n      video.removeEventListener(\"timeupdate\", handleTimeUpdate);\n      video.removeEventListener(\"loadedmetadata\", handleLoadedMetadata);\n      video.removeEventListener(\"ended\", handleEnded);\n    };\n  }, []);\n\n  const togglePlay = () => {\n    if (videoRef.current) {\n      if (isPlaying) {\n        videoRef.current.pause();\n      } else {\n        videoRef.current.play();\n      }\n      setIsPlaying(!isPlaying);\n    }\n  };\n\n  const handleSeek = (time: number) => {\n    if (videoRef.current) {\n      videoRef.current.currentTime = time;\n      setCurrentTime(time);\n    }\n  };\n\n  const handleVolumeChange = (newVolume: number) => {\n    setVolume(newVolume);\n    setIsMuted(newVolume === 0);\n    if (videoRef.current) {\n      videoRef.current.volume = newVolume;\n    }\n  };\n\n  const toggleMute = () => {\n    if (videoRef.current) {\n      const newMuted = !isMuted;\n      setIsMuted(newMuted);\n      videoRef.current.muted = newMuted;\n    }\n  };\n\n  const handlePlaybackRateChange = (rate: number) => {\n    setPlaybackRate(rate);\n    if (videoRef.current) {\n      videoRef.current.playbackRate = rate;\n    }\n  };\n\n  const handleFullscreen = () => {\n    if (videoRef.current) {\n      videoRef.current.requestFullscreen();\n    }\n  };\n\n  const formatTime = (seconds: number): string => {\n    const mins = Math.floor(seconds / 60);\n    const secs = Math.floor(seconds % 60);\n    return `${mins}:${secs.toString().padStart(2, \"0\")}`;\n  };\n\n  return (\n    <div className=\"flex h-full flex-col bg-bg-canvas\">\n      {/* Video */}\n      <div className=\"flex-1 flex items-center justify-center\">\n        <video\n          ref={videoRef}\n          src={url}\n          className=\"max-w-full max-h-full\"\n          onClick={togglePlay}\n        >\n          <track kind=\"captions\" />\n        </video>\n      </div>\n\n      {/* Controls */}\n      <div className=\"bg-bg-surface border-t border-border-default p-4\">\n        {/* Progress Bar */}\n        <div className=\"mb-4\">\n          <input\n            type=\"range\"\n            min={0}\n            max={duration || 0}\n            value={currentTime}\n            onChange={(e) => handleSeek(Number(e.target.value))}\n            className=\"w-full h-1 bg-bg-muted rounded-lg appearance-none cursor-pointer accent-action-primary-bg\"\n          />\n          <div className=\"flex justify-between mt-1 text-xs text-text-secondary\">\n            <span>{formatTime(currentTime)}</span>\n            <span>{formatTime(duration)}</span>\n          </div>\n        </div>\n\n        {/* Control Buttons */}\n        <div className=\"flex items-center justify-between\">\n          <div className=\"flex items-center gap-2\">\n            {/* Play/Pause */}\n            <button\n              type=\"button\"\n              onClick={togglePlay}\n              className=\"p-2 text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors duration-200\"\n              title={isPlaying ? \"Pause\" : \"Play\"}\n              aria-label={isPlaying ? \"Pause video\" : \"Play video\"}\n            >\n              {isPlaying ? (\n                <Pause className=\"size-5\" />\n              ) : (\n                <Play className=\"size-5\" />\n              )}\n            </button>\n\n            {/* Volume */}\n            <div className=\"flex items-center gap-2\">\n              <button\n                type=\"button\"\n                onClick={toggleMute}\n                className=\"p-2 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors duration-200\"\n                title={isMuted ? \"Unmute\" : \"Mute\"}\n                aria-label={isMuted ? \"Unmute video\" : \"Mute video\"}\n              >\n                {isMuted ? (\n                  <VolumeX className=\"size-5\" />\n                ) : (\n                  <Volume2 className=\"size-5\" />\n                )}\n              </button>\n              <input\n                type=\"range\"\n                min={0}\n                max={1}\n                step={0.1}\n                value={volume}\n                onChange={(e) => handleVolumeChange(Number(e.target.value))}\n                className=\"w-20 h-1 bg-bg-muted rounded-lg appearance-none cursor-pointer accent-action-primary-bg\"\n              />\n            </div>\n\n            {/* Playback Speed */}\n            <select\n              value={playbackRate}\n              onChange={(e) => handlePlaybackRateChange(Number(e.target.value))}\n              className=\"px-2 py-1 text-sm bg-bg-surface border border-border-default rounded text-text-primary cursor-pointer\"\n            >\n              <option value=\"0.5\">0.5x</option>\n              <option value=\"0.75\">0.75x</option>\n              <option value=\"1\">1x</option>\n              <option value=\"1.25\">1.25x</option>\n              <option value=\"1.5\">1.5x</option>\n              <option value=\"2\">2x</option>\n            </select>\n          </div>\n\n          <div className=\"flex items-center gap-2\">\n            <span className=\"text-sm text-text-secondary\">{file.name}</span>\n            <button\n              type=\"button\"\n              onClick={handleFullscreen}\n              className=\"p-2 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors duration-200\"\n              title=\"Fullscreen\"\n              aria-label=\"Open fullscreen\"\n            >\n              <Maximize className=\"size-5\" />\n            </button>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"VideoPlayer.js","names":[],"sources":["../../../../src/files/components/viewers/VideoPlayer.tsx"],"sourcesContent":["import { useState, useRef, useEffect } from \"react\";\nimport { Play, Pause, Volume2, VolumeX, Maximize } from \"lucide-react\";\nimport type { FileItem } from \"../../types\";\n\ninterface VideoPlayerProps {\n  file: FileItem;\n  url: string;\n}\n\nexport function VideoPlayer({ file, url }: VideoPlayerProps) {\n  const videoRef = useRef<HTMLVideoElement>(null);\n  const [isPlaying, setIsPlaying] = useState(false);\n  const [currentTime, setCurrentTime] = useState(0);\n  const [duration, setDuration] = useState(0);\n  const [volume, setVolume] = useState(1);\n  const [isMuted, setIsMuted] = useState(false);\n  const [playbackRate, setPlaybackRate] = useState(1);\n\n  useEffect(() => {\n    const video = videoRef.current;\n    if (!video) return;\n\n    const handleTimeUpdate = () => setCurrentTime(video.currentTime);\n    const handleLoadedMetadata = () => setDuration(video.duration);\n    const handleEnded = () => setIsPlaying(false);\n\n    video.addEventListener(\"timeupdate\", handleTimeUpdate);\n    video.addEventListener(\"loadedmetadata\", handleLoadedMetadata);\n    video.addEventListener(\"ended\", handleEnded);\n\n    return () => {\n      video.removeEventListener(\"timeupdate\", handleTimeUpdate);\n      video.removeEventListener(\"loadedmetadata\", handleLoadedMetadata);\n      video.removeEventListener(\"ended\", handleEnded);\n    };\n  }, []);\n\n  const togglePlay = () => {\n    if (videoRef.current) {\n      if (isPlaying) {\n        videoRef.current.pause();\n      } else {\n        videoRef.current.play();\n      }\n      setIsPlaying(!isPlaying);\n    }\n  };\n\n  const handleSeek = (time: number) => {\n    if (videoRef.current) {\n      videoRef.current.currentTime = time;\n      setCurrentTime(time);\n    }\n  };\n\n  const handleVolumeChange = (newVolume: number) => {\n    setVolume(newVolume);\n    setIsMuted(newVolume === 0);\n    if (videoRef.current) {\n      videoRef.current.volume = newVolume;\n    }\n  };\n\n  const toggleMute = () => {\n    if (videoRef.current) {\n      const newMuted = !isMuted;\n      setIsMuted(newMuted);\n      videoRef.current.muted = newMuted;\n    }\n  };\n\n  const handlePlaybackRateChange = (rate: number) => {\n    setPlaybackRate(rate);\n    if (videoRef.current) {\n      videoRef.current.playbackRate = rate;\n    }\n  };\n\n  const handleFullscreen = () => {\n    if (videoRef.current) {\n      videoRef.current.requestFullscreen();\n    }\n  };\n\n  const formatTime = (seconds: number): string => {\n    const mins = Math.floor(seconds / 60);\n    const secs = Math.floor(seconds % 60);\n    return `${mins}:${secs.toString().padStart(2, \"0\")}`;\n  };\n\n  return (\n    <div className=\"flex h-full flex-col bg-bg-canvas\">\n      {/* Video */}\n      <div className=\"flex-1 flex items-center justify-center\">\n        <video\n          ref={videoRef}\n          src={url}\n          aria-label={file.name}\n          className=\"max-w-full max-h-full\"\n          onClick={togglePlay}\n        >\n          <track kind=\"captions\" />\n        </video>\n      </div>\n\n      {/* Controls */}\n      <div className=\"bg-bg-surface border-t border-border-default p-4\">\n        {/* Progress Bar */}\n        <div className=\"mb-4\">\n          <input\n            type=\"range\"\n            min={0}\n            max={duration || 0}\n            value={currentTime}\n            onChange={(e) => handleSeek(Number(e.target.value))}\n            aria-label=\"Seek\"\n            className=\"w-full h-1 bg-bg-muted rounded-lg appearance-none cursor-pointer accent-action-primary-bg\"\n          />\n          <div className=\"flex justify-between mt-1 text-xs text-text-secondary\">\n            <span>{formatTime(currentTime)}</span>\n            <span>{formatTime(duration)}</span>\n          </div>\n        </div>\n\n        {/* Control Buttons */}\n        <div className=\"flex items-center justify-between\">\n          <div className=\"flex items-center gap-2\">\n            {/* Play/Pause */}\n            <button\n              type=\"button\"\n              onClick={togglePlay}\n              className=\"p-2 text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors duration-200\"\n              title={isPlaying ? \"Pause\" : \"Play\"}\n              aria-label={isPlaying ? \"Pause video\" : \"Play video\"}\n            >\n              {isPlaying ? (\n                <Pause className=\"size-5\" />\n              ) : (\n                <Play className=\"size-5\" />\n              )}\n            </button>\n\n            {/* Volume */}\n            <div className=\"flex items-center gap-2\">\n              <button\n                type=\"button\"\n                onClick={toggleMute}\n                className=\"p-2 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors duration-200\"\n                title={isMuted ? \"Unmute\" : \"Mute\"}\n                aria-label={isMuted ? \"Unmute video\" : \"Mute video\"}\n              >\n                {isMuted ? (\n                  <VolumeX className=\"size-5\" />\n                ) : (\n                  <Volume2 className=\"size-5\" />\n                )}\n              </button>\n              <input\n                type=\"range\"\n                min={0}\n                max={1}\n                step={0.1}\n                value={volume}\n                onChange={(e) => handleVolumeChange(Number(e.target.value))}\n                aria-label=\"Volume\"\n                className=\"w-20 h-1 bg-bg-muted rounded-lg appearance-none cursor-pointer accent-action-primary-bg\"\n              />\n            </div>\n\n            {/* Playback Speed */}\n            <select\n              value={playbackRate}\n              onChange={(e) => handlePlaybackRateChange(Number(e.target.value))}\n              className=\"px-2 py-1 text-sm bg-bg-surface border border-border-default rounded text-text-primary cursor-pointer\"\n            >\n              <option value=\"0.5\">0.5x</option>\n              <option value=\"0.75\">0.75x</option>\n              <option value=\"1\">1x</option>\n              <option value=\"1.25\">1.25x</option>\n              <option value=\"1.5\">1.5x</option>\n              <option value=\"2\">2x</option>\n            </select>\n          </div>\n\n          <div className=\"flex items-center gap-2\">\n            <span className=\"text-sm text-text-secondary\">{file.name}</span>\n            <button\n              type=\"button\"\n              onClick={handleFullscreen}\n              className=\"p-2 text-text-secondary hover:text-text-primary hover:bg-action-ghost-bg-hover rounded transition-colors duration-200\"\n              title=\"Fullscreen\"\n              aria-label=\"Open fullscreen\"\n            >\n              <Maximize className=\"size-5\" />\n            </button>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/files/hooks/useCreateFolder.js

@@ -1,14 +1,22 @@
 import { useCreateFolderMutation as e } from "../../generated/wspace-operations.js";
 //#region src/files/hooks/useCreateFolder.ts
 var t = () => {
-	let [t, { loading: n, error: r }] = e({ refetchQueries: [
-		"GetFilesRootBrowsePage",
-		"GetFilesFolderBrowsePage",
-		"GetFilesRecentPage",
-		"GetFiles"
-	] });
+	let [t, { loading: n, error: r }] = e({
+		refetchQueries: [
+			"GetFilesRootBrowsePage",
+			"GetFilesFolderBrowsePage",
+			"GetFilesRecentPage"
+		],
+		awaitRefetchQueries: !0
+	});
 	return {
-		mutateAsync: async (e) => (await t({ variables: { input: e } })).data?.createFolder,
+		mutateAsync: async (e) => {
+			let n = await t({ variables: { input: e } });
+			return {
+				data: n.data?.createFolder ?? null,
+				error: n.error ?? null
+			};
+		},
 		isPending: n,
 		error: r
 	};

package/dist/files/hooks/useCreateFolder.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCreateFolder.js","names":[],"sources":["../../../src/files/hooks/useCreateFolder.ts"],"sourcesContent":["import { useCreateFolderMutation } from \"../../generated/wspace-operations\";\n\nexport interface CreateFolderInput {\n  name: string;\n  description?: string;\n  parentFolderId?: string;\n  visibility?: string;\n  color?: string;\n  icon?: string;\n}\n\nexport const useCreateFolder = () => {\n  const [createFolderMutation, { loading, error }] = useCreateFolderMutation({\n    refetchQueries: [\n      \"GetFilesRootBrowsePage\",\n      \"GetFilesFolderBrowsePage\",\n      \"GetFilesRecentPage\",\n      \"GetFiles\",\n    ],\n  });\n\n  return {\n    mutateAsync: async (input: CreateFolderInput) => {\n      const result = await createFolderMutation({\n        variables: { input },\n      });\n\n      return result.data?.createFolder;\n    },\n    isPending: loading,\n    error,\n  };\n};\n"],"mappings":";;AAWA,IAAa,UAAwB;CACnC,IAAM,CAAC,GAAsB,EAAE,YAAS,cAAW,EAAwB,EACzE,gBAAgB;EACd;EACA;EACA;EACA;EACD,EACF,CAAC;AAEF,QAAO;EACL,aAAa,OAAO,OACH,MAAM,EAAqB,EACxC,WAAW,EAAE,UAAO,EACrB,CAAC,EAEY,MAAM;EAEtB,WAAW;EACX;EACD"}
+{"version":3,"file":"useCreateFolder.js","names":[],"sources":["../../../src/files/hooks/useCreateFolder.ts"],"sourcesContent":["import { useCreateFolderMutation } from \"../../generated/wspace-operations\";\n\nexport interface CreateFolderInput {\n  name: string;\n  description?: string;\n  parentFolderId?: string;\n  visibility?: string;\n  color?: string;\n  icon?: string;\n}\n\nexport const useCreateFolder = () => {\n  const [createFolderMutation, { loading, error }] = useCreateFolderMutation({\n    refetchQueries: [\n      \"GetFilesRootBrowsePage\",\n      \"GetFilesFolderBrowsePage\",\n      \"GetFilesRecentPage\",\n    ],\n    awaitRefetchQueries: true,\n  });\n\n  return {\n    mutateAsync: async (input: CreateFolderInput) => {\n      const result = await createFolderMutation({\n        variables: { input },\n      });\n      return {\n        data: result.data?.createFolder ?? null,\n        error: result.error ?? null,\n      };\n    },\n    isPending: loading,\n    error,\n  };\n};\n"],"mappings":";;AAWA,IAAa,UAAwB;CACnC,IAAM,CAAC,GAAsB,EAAE,YAAS,cAAW,EAAwB;EACzE,gBAAgB;GACd;GACA;GACA;GACD;EACD,qBAAqB;EACtB,CAAC;AAEF,QAAO;EACL,aAAa,OAAO,MAA6B;GAC/C,IAAM,IAAS,MAAM,EAAqB,EACxC,WAAW,EAAE,UAAO,EACrB,CAAC;AACF,UAAO;IACL,MAAM,EAAO,MAAM,gBAAgB;IACnC,OAAO,EAAO,SAAS;IACxB;;EAEH,WAAW;EACX;EACD"}