@burdenoff/microfe-workspaces 2026.623.1 → 2026.624.1

package/dist/pages/WorkspacesListPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"WorkspacesListPage.js","names":[],"sources":["../../src/pages/WorkspacesListPage.tsx"],"sourcesContent":["import { Plus, Grid3X3, List as ListIcon, Search, Mail, UserPlus } from 'lucide-react';\nimport { Badge, Button, Input, Skeleton } from '@burdenoff/fe-libs/ui';\nimport { useNavigate } from 'react-router-dom';\nimport { useWorkspacesStore } from '../store/workspacesStore';\nimport { useMyWorkspaces } from '../hooks/useWorkspaces';\nimport { useMyPendingInvitations } from '../hooks/usePendingInvitations';\nimport { WorkspaceCard } from '../components/WorkspaceCard';\nimport { useWorkspacesContext } from '../providers/WorkspacesProvider';\nimport { useDebounce } from '@burdenoff/fe-libs/shared/hooks';\nimport { PermissionButton } from '@burdenoff/fe-libs/shared/components';\nimport { WORKSPACE_PERMISSIONS } from '../constants/permissions';\nimport { useState, useEffect } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { tWithFallback } from '../utils/i18n';\nimport { useScopedNavigation } from '../hooks/useScopedNavigation';\nimport { useWorkspacesPageView } from '../hooks/useWorkspacesPageView';\n\nexport function WorkspacesListPage() {\n  useWorkspacesPageView('workspaces.list');\n  const { t } = useI18n();\n\n  const navigate = useNavigate();\n  const { basePath = '/', currentUser, workspaceId: currentWorkspaceId } = useWorkspacesContext();\n  const { withCurrentSearch } = useScopedNavigation();\n  const { viewMode, setViewMode, workspaceFilters, setWorkspaceFilters } = useWorkspacesStore();\n\n  // Navigate to unified workspace creation page\n  const handleCreateWorkspace = () => {\n    navigate(withCurrentSearch(`${basePath}/new`));\n  };\n\n  const [searchValue, setSearchValue] = useState(workspaceFilters.search || '');\n  const debouncedSearch = useDebounce(searchValue, 500);\n\n  // Update filters when debounced search changes\n  useEffect(() => {\n    if (debouncedSearch !== workspaceFilters.search) {\n      setWorkspaceFilters({ search: debouncedSearch });\n    }\n  }, [debouncedSearch, workspaceFilters.search, setWorkspaceFilters]);\n\n  const { data: rawData, isLoading, error } = useMyWorkspaces();\n  const { data: pendingInvitations = [] } = useMyPendingInvitations(currentUser?.email);\n  const pendingInvitesCount = pendingInvitations.length;\n\n  const handleOpenPendingInvites = () => {\n    navigate(withCurrentSearch(`${basePath}/invites`));\n  };\n\n  const handleInviteMember = () => {\n    if (!currentWorkspaceId) {\n      return;\n    }\n\n    navigate(withCurrentSearch(`${basePath}/${currentWorkspaceId}/invite`));\n  };\n\n  // Client-side search filtering (myWorkspaces doesn't accept filter args)\n  const data = rawData\n    ? {\n        ...rawData,\n        items: debouncedSearch\n          ? rawData.items.filter((ws) =>\n              ws.name.toLowerCase().includes(debouncedSearch.toLowerCase())\n            )\n          : rawData.items,\n        total: debouncedSearch\n          ? rawData.items.filter((ws) =>\n              ws.name.toLowerCase().includes(debouncedSearch.toLowerCase())\n            ).length\n          : rawData.total,\n      }\n    : undefined;\n\n  const handleSearchChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    setSearchValue(e.target.value);\n  };\n\n  if (error) {\n    return (\n      <div className=\"space-y-4 sm:space-y-6 p-3 sm:p-6\">\n        <div className=\"flex flex-col items-center justify-center py-12\">\n          <p className=\"text-destructive text-lg font-semibold\">\n            {tWithFallback(t, 'workspacesList.loadError', 'Error loading workspaces')}\n          </p>\n          <p className=\"text-muted-foreground text-sm mt-2\">\n            {error instanceof Error\n              ? error.message\n              : tWithFallback(t, 'workspacesList.unknownError', 'Unknown error')}\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"space-y-4 sm:space-y-6 p-3 sm:p-6\">\n      {/* Header with title + actions */}\n      <div\n        className=\"flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3\"\n        data-tour=\"workspaces-list-header\"\n      >\n        <div>\n          <h1 className=\"text-2xl sm:text-3xl font-bold\">\n            {tWithFallback(t, 'workspacesList.title', 'Workspaces')}\n          </h1>\n          <p className=\"text-sm sm:text-base text-muted-foreground\">\n            {tWithFallback(t, 'workspacesList.description', 'Manage and organize your workspaces')}\n          </p>\n        </div>\n        <div className=\"flex items-center gap-2\" data-tour=\"workspaces-list-actions\">\n          {/* View mode toggle */}\n          <Button\n            variant={viewMode === 'grid' ? 'default' : 'outline'}\n            size=\"icon\"\n            onClick={() => setViewMode('grid')}\n            className=\"hidden sm:flex\"\n            aria-label={tWithFallback(\n              t,\n              'workspacesList.gridViewAriaLabel',\n              'Show workspaces in grid view'\n            )}\n            title={tWithFallback(t, 'workspacesList.gridViewTitle', 'Grid view')}\n          >\n            <Grid3X3 size={20} />\n          </Button>\n          <Button\n            variant={viewMode === 'list' ? 'default' : 'outline'}\n            size=\"icon\"\n            onClick={() => setViewMode('list')}\n            className=\"hidden sm:flex\"\n            aria-label={tWithFallback(\n              t,\n              'workspacesList.listViewAriaLabel',\n              'Show workspaces in list view'\n            )}\n            title={tWithFallback(t, 'workspacesList.listViewTitle', 'List view')}\n          >\n            <ListIcon size={20} />\n          </Button>\n          <PermissionButton\n            permission={WORKSPACE_PERMISSIONS.MEMBER_CREATE}\n            deniedBehavior=\"disable\"\n            deniedTooltip={tWithFallback(\n              t,\n              'workspacesList.inviteDeniedTooltip',\n              \"You don't have permission to invite members into the current workspace\"\n            )}\n          >\n            <Button\n              variant=\"outline\"\n              onClick={handleInviteMember}\n              className=\"gap-2\"\n              disabled={!currentWorkspaceId}\n              title={\n                currentWorkspaceId\n                  ? tWithFallback(\n                      t,\n                      'workspacesList.inviteMemberTitle',\n                      'Invite members into the current workspace'\n                    )\n                  : tWithFallback(\n                      t,\n                      'workspacesList.inviteMemberNoWorkspaceTitle',\n                      'Select a current workspace first'\n                    )\n              }\n            >\n              <UserPlus size={18} />\n              <span>{tWithFallback(t, 'workspacesList.inviteMemberButton', 'Invite Member')}</span>\n            </Button>\n          </PermissionButton>\n          <Button variant=\"outline\" onClick={handleOpenPendingInvites} className=\"gap-2\">\n            <Mail size={18} />\n            <span>\n              {tWithFallback(t, 'workspacesList.pendingInvitesButton', 'Pending Invites')}\n            </span>\n            {pendingInvitesCount > 0 ? (\n              <Badge variant=\"secondary\">{pendingInvitesCount}</Badge>\n            ) : null}\n          </Button>\n          <PermissionButton\n            permission={WORKSPACE_PERMISSIONS.WORKSPACE_CREATE}\n            deniedBehavior=\"disable\"\n            deniedTooltip={tWithFallback(\n              t,\n              'workspacesList.createDeniedTooltip',\n              \"You don't have permission to create workspaces\"\n            )}\n          >\n            <Button\n              onClick={handleCreateWorkspace}\n              className=\"gap-2\"\n              data-tour=\"workspaces-create-button\"\n            >\n              <Plus size={20} />\n              <span className=\"hidden sm:inline\">\n                {tWithFallback(t, 'workspacesList.createButton', 'Create Workspace')}\n              </span>\n              <span className=\"sm:hidden\">\n                {tWithFallback(t, 'workspacesList.createButtonShort', 'Create')}\n              </span>\n            </Button>\n          </PermissionButton>\n        </div>\n      </div>\n\n      {/* Search */}\n      <div className=\"relative\" data-tour=\"workspaces-search-input\">\n        <Search\n          className=\"absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground\"\n          size={20}\n        />\n        <Input\n          placeholder={tWithFallback(t, 'workspacesList.searchPlaceholder', 'Search workspaces...')}\n          value={searchValue}\n          onChange={handleSearchChange}\n          className=\"pl-[3.25rem]\"\n        />\n      </div>\n\n      {/* Content */}\n      <div className=\"space-y-4 sm:space-y-6\" data-tour=\"workspaces-view-container\">\n        {isLoading ? (\n          <div className=\"grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4\">\n            {Array.from({ length: 6 }).map((_, i) => (\n              <div key={i} className=\"space-y-3 p-6 border rounded-lg\">\n                <div className=\"flex items-center gap-3\">\n                  <Skeleton className=\"size-12 rounded-lg\" />\n                  <div className=\"space-y-2 flex-1\">\n                    <Skeleton className=\"h-4 w-3/4\" />\n                    <Skeleton className=\"h-3 w-1/2\" />\n                  </div>\n                </div>\n                <Skeleton className=\"h-3 w-1/3\" />\n              </div>\n            ))}\n          </div>\n        ) : data?.items.length === 0 ? (\n          <div className=\"flex flex-col items-center justify-center py-12 text-center\">\n            <div className=\"rounded-full bg-muted p-6 mb-4\">\n              <Grid3X3 size={48} className=\"text-muted-foreground\" />\n            </div>\n            <h3 className=\"text-lg font-semibold mb-2\">\n              {tWithFallback(t, 'workspacesList.emptyTitle', 'No workspaces found')}\n            </h3>\n            <p className=\"text-muted-foreground mb-4 max-w-sm\">\n              {workspaceFilters.search\n                ? tWithFallback(\n                    t,\n                    'workspacesList.emptySearchHint',\n                    'Try adjusting your search criteria'\n                  )\n                : tWithFallback(\n                    t,\n                    'workspacesList.emptyCreateHint',\n                    'Get started by creating your first workspace'\n                  )}\n            </p>\n            {!workspaceFilters.search && (\n              <PermissionButton\n                permission={WORKSPACE_PERMISSIONS.WORKSPACE_CREATE}\n                deniedBehavior=\"disable\"\n                deniedTooltip={tWithFallback(\n                  t,\n                  'workspacesList.createDeniedTooltip',\n                  \"You don't have permission to create workspaces\"\n                )}\n              >\n                <Button onClick={handleCreateWorkspace} className=\"gap-2\">\n                  <Plus size={20} />\n                  {tWithFallback(\n                    t,\n                    'workspacesList.createFirstButton',\n                    'Create Your First Workspace'\n                  )}\n                </Button>\n              </PermissionButton>\n            )}\n          </div>\n        ) : (\n          <>\n            {/* View */}\n            {viewMode === 'list' ? (\n              <div className=\"space-y-3\">\n                {data?.items.map((workspace) => (\n                  <WorkspaceCard key={workspace.id} workspace={workspace} />\n                ))}\n              </div>\n            ) : (\n              <div className=\"grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4\">\n                {data?.items.map((workspace) => (\n                  <WorkspaceCard key={workspace.id} workspace={workspace} />\n                ))}\n              </div>\n            )}\n\n            {/* Pagination info */}\n            {data && data.total > 0 && (\n              <div className=\"flex items-center justify-between text-sm text-muted-foreground\">\n                <p>\n                  {tWithFallback(t, 'workspacesList.showing', 'Showing')} {data.items.length}{' '}\n                  {tWithFallback(t, 'workspacesList.of', 'of')} {data.total}{' '}\n                  {data.total !== 1\n                    ? tWithFallback(t, 'workspacesList.workspaces', 'workspaces')\n                    : tWithFallback(t, 'workspacesList.workspace', 'workspace')}\n                </p>\n                {data.hasMore && (\n                  <p className=\"text-xs\">\n                    {tWithFallback(\n                      t,\n                      'workspacesList.moreAvailable',\n                      'More workspaces available - pagination coming soon'\n                    )}\n                  </p>\n                )}\n              </div>\n            )}\n          </>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"WorkspacesListPage.js","names":[],"sources":["../../src/pages/WorkspacesListPage.tsx"],"sourcesContent":["import { Plus, Grid3X3, List as ListIcon, Search, Mail, UserPlus } from 'lucide-react';\nimport { Badge, Button, Input, Skeleton } from '@burdenoff/fe-libs/ui';\nimport { useNavigate } from 'react-router-dom';\nimport { useWorkspacesStore } from '../store/workspacesStore';\nimport { useMyWorkspaces } from '../hooks/useWorkspaces';\nimport { useMyPendingInvitations } from '../hooks/usePendingInvitations';\nimport { WorkspaceCard } from '../components/WorkspaceCard';\nimport { useWorkspacesContext } from '../providers/WorkspacesProvider';\nimport { useDebounce } from '@burdenoff/fe-libs/shared/hooks';\nimport { PermissionButton } from '@burdenoff/fe-libs/shared/components';\nimport { WORKSPACE_PERMISSIONS } from '../constants/permissions';\nimport { useState, useEffect } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { tWithFallback } from '../utils/i18n';\nimport { useScopedNavigation } from '../hooks/useScopedNavigation';\nimport { useWorkspacesPageView } from '../hooks/useWorkspacesPageView';\n\nexport function WorkspacesListPage() {\n  useWorkspacesPageView('workspaces.list');\n  const { t } = useI18n();\n\n  const navigate = useNavigate();\n  const { basePath = '/', currentUser, workspaceId: currentWorkspaceId } = useWorkspacesContext();\n  const { withCurrentSearch } = useScopedNavigation();\n  const { viewMode, setViewMode, workspaceFilters, setWorkspaceFilters } = useWorkspacesStore();\n\n  // Navigate to unified workspace creation page\n  const handleCreateWorkspace = () => {\n    navigate(withCurrentSearch(`${basePath}/new`));\n  };\n\n  const [searchValue, setSearchValue] = useState(workspaceFilters.search || '');\n  const debouncedSearch = useDebounce(searchValue, 500);\n\n  // Update filters when debounced search changes\n  useEffect(() => {\n    if (debouncedSearch !== workspaceFilters.search) {\n      setWorkspaceFilters({ search: debouncedSearch });\n    }\n  }, [debouncedSearch, workspaceFilters.search, setWorkspaceFilters]);\n\n  const { data: rawData, isLoading, error } = useMyWorkspaces();\n  const { data: pendingInvitations = [] } = useMyPendingInvitations(currentUser?.email);\n  const pendingInvitesCount = pendingInvitations.length;\n\n  const handleOpenPendingInvites = () => {\n    navigate(withCurrentSearch(`${basePath}/invites`));\n  };\n\n  const handleInviteMember = () => {\n    if (!currentWorkspaceId) {\n      return;\n    }\n\n    navigate(withCurrentSearch(`${basePath}/${currentWorkspaceId}/invite`));\n  };\n\n  // Client-side search filtering (myWorkspaces doesn't accept filter args)\n  const data = rawData\n    ? {\n        ...rawData,\n        items: debouncedSearch\n          ? rawData.items.filter((ws) =>\n              ws.name.toLowerCase().includes(debouncedSearch.toLowerCase())\n            )\n          : rawData.items,\n        total: debouncedSearch\n          ? rawData.items.filter((ws) =>\n              ws.name.toLowerCase().includes(debouncedSearch.toLowerCase())\n            ).length\n          : rawData.total,\n      }\n    : undefined;\n\n  const handleSearchChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    setSearchValue(e.target.value);\n  };\n\n  if (error) {\n    return (\n      <div className=\"space-y-4 sm:space-y-6 p-3 sm:p-6\">\n        <div className=\"flex flex-col items-center justify-center py-12\">\n          <p className=\"text-status-error-text text-lg font-semibold\">\n            {tWithFallback(t, 'workspacesList.loadError', 'Error loading workspaces')}\n          </p>\n          <p className=\"text-text-secondary text-sm mt-2\">\n            {error instanceof Error\n              ? error.message\n              : tWithFallback(t, 'workspacesList.unknownError', 'Unknown error')}\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"space-y-4 sm:space-y-6 p-3 sm:p-6\">\n      {/* Header with title + actions */}\n      <div\n        className=\"flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3\"\n        data-tour=\"workspaces-list-header\"\n      >\n        <div>\n          <h1 className=\"text-2xl sm:text-3xl font-bold\">\n            {tWithFallback(t, 'workspacesList.title', 'Workspaces')}\n          </h1>\n          <p className=\"text-sm sm:text-base text-text-secondary\">\n            {tWithFallback(t, 'workspacesList.description', 'Manage and organize your workspaces')}\n          </p>\n        </div>\n        <div className=\"flex items-center gap-2\" data-tour=\"workspaces-list-actions\">\n          {/* View mode toggle */}\n          <Button\n            variant={viewMode === 'grid' ? 'default' : 'outline'}\n            size=\"icon\"\n            onClick={() => setViewMode('grid')}\n            className=\"hidden sm:flex\"\n            aria-label={tWithFallback(\n              t,\n              'workspacesList.gridViewAriaLabel',\n              'Show workspaces in grid view'\n            )}\n            title={tWithFallback(t, 'workspacesList.gridViewTitle', 'Grid view')}\n          >\n            <Grid3X3 size={20} />\n          </Button>\n          <Button\n            variant={viewMode === 'list' ? 'default' : 'outline'}\n            size=\"icon\"\n            onClick={() => setViewMode('list')}\n            className=\"hidden sm:flex\"\n            aria-label={tWithFallback(\n              t,\n              'workspacesList.listViewAriaLabel',\n              'Show workspaces in list view'\n            )}\n            title={tWithFallback(t, 'workspacesList.listViewTitle', 'List view')}\n          >\n            <ListIcon size={20} />\n          </Button>\n          <PermissionButton\n            permission={WORKSPACE_PERMISSIONS.MEMBER_CREATE}\n            deniedBehavior=\"disable\"\n            deniedTooltip={tWithFallback(\n              t,\n              'workspacesList.inviteDeniedTooltip',\n              \"You don't have permission to invite members into the current workspace\"\n            )}\n          >\n            <Button\n              variant=\"outline\"\n              onClick={handleInviteMember}\n              className=\"gap-2\"\n              disabled={!currentWorkspaceId}\n              title={\n                currentWorkspaceId\n                  ? tWithFallback(\n                      t,\n                      'workspacesList.inviteMemberTitle',\n                      'Invite members into the current workspace'\n                    )\n                  : tWithFallback(\n                      t,\n                      'workspacesList.inviteMemberNoWorkspaceTitle',\n                      'Select a current workspace first'\n                    )\n              }\n            >\n              <UserPlus size={18} />\n              <span>{tWithFallback(t, 'workspacesList.inviteMemberButton', 'Invite Member')}</span>\n            </Button>\n          </PermissionButton>\n          <Button variant=\"outline\" onClick={handleOpenPendingInvites} className=\"gap-2\">\n            <Mail size={18} />\n            <span>\n              {tWithFallback(t, 'workspacesList.pendingInvitesButton', 'Pending Invites')}\n            </span>\n            {pendingInvitesCount > 0 ? (\n              <Badge variant=\"secondary\">{pendingInvitesCount}</Badge>\n            ) : null}\n          </Button>\n          <PermissionButton\n            permission={WORKSPACE_PERMISSIONS.WORKSPACE_CREATE}\n            deniedBehavior=\"disable\"\n            deniedTooltip={tWithFallback(\n              t,\n              'workspacesList.createDeniedTooltip',\n              \"You don't have permission to create workspaces\"\n            )}\n          >\n            <Button\n              onClick={handleCreateWorkspace}\n              className=\"gap-2\"\n              data-tour=\"workspaces-create-button\"\n            >\n              <Plus size={20} />\n              <span className=\"hidden sm:inline\">\n                {tWithFallback(t, 'workspacesList.createButton', 'Create Workspace')}\n              </span>\n              <span className=\"sm:hidden\">\n                {tWithFallback(t, 'workspacesList.createButtonShort', 'Create')}\n              </span>\n            </Button>\n          </PermissionButton>\n        </div>\n      </div>\n\n      {/* Search */}\n      <div className=\"relative\" data-tour=\"workspaces-search-input\">\n        <Search\n          className=\"absolute left-3 top-1/2 -translate-y-1/2 text-text-secondary\"\n          size={20}\n        />\n        <Input\n          placeholder={tWithFallback(t, 'workspacesList.searchPlaceholder', 'Search workspaces...')}\n          value={searchValue}\n          onChange={handleSearchChange}\n          className=\"pl-[3.25rem]\"\n        />\n      </div>\n\n      {/* Content */}\n      <div className=\"space-y-4 sm:space-y-6\" data-tour=\"workspaces-view-container\">\n        {isLoading ? (\n          <div className=\"grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4\">\n            {Array.from({ length: 6 }).map((_, i) => (\n              <div key={i} className=\"space-y-3 p-6 border rounded-lg\">\n                <div className=\"flex items-center gap-3\">\n                  <Skeleton className=\"size-12 rounded-lg\" />\n                  <div className=\"space-y-2 flex-1\">\n                    <Skeleton className=\"h-4 w-3/4\" />\n                    <Skeleton className=\"h-3 w-1/2\" />\n                  </div>\n                </div>\n                <Skeleton className=\"h-3 w-1/3\" />\n              </div>\n            ))}\n          </div>\n        ) : data?.items.length === 0 ? (\n          <div className=\"flex flex-col items-center justify-center py-12 text-center\">\n            <div className=\"rounded-full bg-bg-sunken p-6 mb-4\">\n              <Grid3X3 size={48} className=\"text-text-secondary\" />\n            </div>\n            <h3 className=\"text-lg font-semibold mb-2\">\n              {tWithFallback(t, 'workspacesList.emptyTitle', 'No workspaces found')}\n            </h3>\n            <p className=\"text-text-secondary mb-4 max-w-sm\">\n              {workspaceFilters.search\n                ? tWithFallback(\n                    t,\n                    'workspacesList.emptySearchHint',\n                    'Try adjusting your search criteria'\n                  )\n                : tWithFallback(\n                    t,\n                    'workspacesList.emptyCreateHint',\n                    'Get started by creating your first workspace'\n                  )}\n            </p>\n            {!workspaceFilters.search && (\n              <PermissionButton\n                permission={WORKSPACE_PERMISSIONS.WORKSPACE_CREATE}\n                deniedBehavior=\"disable\"\n                deniedTooltip={tWithFallback(\n                  t,\n                  'workspacesList.createDeniedTooltip',\n                  \"You don't have permission to create workspaces\"\n                )}\n              >\n                <Button onClick={handleCreateWorkspace} className=\"gap-2\">\n                  <Plus size={20} />\n                  {tWithFallback(\n                    t,\n                    'workspacesList.createFirstButton',\n                    'Create Your First Workspace'\n                  )}\n                </Button>\n              </PermissionButton>\n            )}\n          </div>\n        ) : (\n          <>\n            {/* View */}\n            {viewMode === 'list' ? (\n              <div className=\"space-y-3\">\n                {data?.items.map((workspace) => (\n                  <WorkspaceCard key={workspace.id} workspace={workspace} />\n                ))}\n              </div>\n            ) : (\n              <div className=\"grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4\">\n                {data?.items.map((workspace) => (\n                  <WorkspaceCard key={workspace.id} workspace={workspace} />\n                ))}\n              </div>\n            )}\n\n            {/* Pagination info */}\n            {data && data.total > 0 && (\n              <div className=\"flex items-center justify-between text-sm text-text-secondary\">\n                <p>\n                  {tWithFallback(t, 'workspacesList.showing', 'Showing')} {data.items.length}{' '}\n                  {tWithFallback(t, 'workspacesList.of', 'of')} {data.total}{' '}\n                  {data.total !== 1\n                    ? tWithFallback(t, 'workspacesList.workspaces', 'workspaces')\n                    : tWithFallback(t, 'workspacesList.workspace', 'workspace')}\n                </p>\n                {data.hasMore && (\n                  <p className=\"text-xs\">\n                    {tWithFallback(\n                      t,\n                      'workspacesList.moreAvailable',\n                      'More workspaces available - pagination coming soon'\n                    )}\n                  </p>\n                )}\n              </div>\n            )}\n          </>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/pages/dashboard/DashboardCustomizer.js

@@ -54,9 +54,9 @@ function O({ open: O, onOpenChange: k, widgets: A, onSave: j, isSaving: M, produ
 					children: U.map((e, t) => {
 						let n = r[e.widgetId];
 						return !n || !i(n, N) ? null : /* @__PURE__ */ g("div", {
-							className: `flex items-center gap-3 p-3 rounded-lg border transition-colors ${e.enabled ? "border-border-default bg-bg-surface" : "border-transparent bg-muted/30 opacity-60"}`,
+							className: `flex items-center gap-3 p-3 rounded-lg border transition-colors ${e.enabled ? "border-border-default bg-bg-surface" : "border-transparent bg-bg-sunken/30 opacity-60"}`,
 							children: [
-								/* @__PURE__ */ h(d, { className: "size-4 text-muted-foreground shrink-0" }),
+								/* @__PURE__ */ h(d, { className: "size-4 text-text-secondary shrink-0" }),
 								/* @__PURE__ */ g("div", {
 									className: "flex-1 min-w-0",
 									children: [/* @__PURE__ */ g("div", {
@@ -70,7 +70,7 @@ function O({ open: O, onOpenChange: k, widgets: A, onSave: j, isSaving: M, produ
 											children: n.defaultSize
 										})]
 									}), /* @__PURE__ */ h("p", {
-										className: "text-xs text-muted-foreground truncate",
+										className: "text-xs text-text-secondary truncate",
 										children: n.description
 									})]
 								}),

package/dist/pages/dashboard/DashboardCustomizer.js.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardCustomizer.js","names":[],"sources":["../../../src/pages/dashboard/DashboardCustomizer.tsx"],"sourcesContent":["/**\n * DashboardCustomizer — Sheet overlay for customizing dashboard widgets.\n *\n * Allows users to toggle widgets on/off, reorder them, and save their layout.\n */\nimport { useState, useCallback, useEffect } from 'react';\nimport {\n  Sheet,\n  SheetContent,\n  SheetHeader,\n  SheetTitle,\n  SheetDescription,\n  SheetFooter,\n  Button,\n  Switch,\n  Badge,\n  Separator,\n} from '@burdenoff/fe-libs/ui';\nimport { ArrowUp, ArrowDown, RotateCcw, Save, Loader2, GripVertical } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { tWithFallback } from '../../utils/i18n';\nimport type { WidgetConfig } from './types';\nimport {\n  WIDGET_DEFINITIONS,\n  DEFAULT_DASHBOARD_WIDGETS_BY_PRODUCT,\n  DEFAULT_DASHBOARD_WIDGETS,\n  isWidgetAvailable,\n} from './config';\nimport { nativeImpact } from '../../utils/nativeBridge';\n\ninterface DashboardCustomizerProps {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  widgets: WidgetConfig[];\n  onSave: (widgets: WidgetConfig[]) => Promise<void>;\n  isSaving: boolean;\n  productId?: string;\n}\n\nexport function DashboardCustomizer({\n  open,\n  onOpenChange,\n  widgets,\n  onSave,\n  isSaving,\n  productId = 'workspaces',\n}: DashboardCustomizerProps) {\n  const { t } = useI18n();\n\n  const [localWidgets, setLocalWidgets] = useState<WidgetConfig[]>(widgets);\n  const [hasChanges, setHasChanges] = useState(false);\n\n  // Sync local state when sheet opens or widgets prop changes while open\n  useEffect(() => {\n    if (open) {\n      setLocalWidgets([...widgets]);\n      setHasChanges(false);\n    }\n  }, [open, widgets]);\n\n  const toggleWidget = useCallback((widgetId: string) => {\n    setLocalWidgets((prev) =>\n      prev.map((w) => (w.widgetId === widgetId ? { ...w, enabled: !w.enabled } : w))\n    );\n    setHasChanges(true);\n  }, []);\n\n  const moveWidget = useCallback((widgetId: string, direction: 'up' | 'down') => {\n    setLocalWidgets((prev) => {\n      const sorted = [...prev].sort((a, b) => a.order - b.order);\n      const idx = sorted.findIndex((w) => w.widgetId === widgetId);\n      if (idx < 0) return prev;\n\n      const swapIdx = direction === 'up' ? idx - 1 : idx + 1;\n      if (swapIdx < 0 || swapIdx >= sorted.length) return prev;\n\n      // Swap orders\n      const tempOrder = sorted[idx].order;\n      sorted[idx] = { ...sorted[idx], order: sorted[swapIdx].order };\n      sorted[swapIdx] = { ...sorted[swapIdx], order: tempOrder };\n\n      return sorted;\n    });\n    setHasChanges(true);\n  }, []);\n\n  const resetToDefaults = useCallback(() => {\n    const defaults = DEFAULT_DASHBOARD_WIDGETS_BY_PRODUCT[productId] ?? DEFAULT_DASHBOARD_WIDGETS;\n    setLocalWidgets([...defaults]);\n    setHasChanges(true);\n  }, [productId]);\n\n  const handleSave = useCallback(async () => {\n    await onSave(localWidgets);\n    setHasChanges(false);\n    onOpenChange(false);\n  }, [localWidgets, onSave, onOpenChange]);\n\n  const sorted = [...localWidgets].sort((a, b) => a.order - b.order);\n\n  return (\n    <Sheet open={open} onOpenChange={onOpenChange}>\n      <SheetContent className=\"w-full sm:max-w-md overflow-y-auto\" side=\"right\">\n        <SheetHeader>\n          <SheetTitle>\n            {tWithFallback(t, 'dashboardCustomizer.title', 'Customize Dashboard')}\n          </SheetTitle>\n          <SheetDescription>\n            {tWithFallback(\n              t,\n              'dashboardCustomizer.description',\n              'Toggle widgets on or off and reorder them to personalize your dashboard.'\n            )}\n          </SheetDescription>\n        </SheetHeader>\n\n        <div className=\"py-4 space-y-1\">\n          {sorted.map((widget, idx) => {\n            const definition = WIDGET_DEFINITIONS[widget.widgetId];\n            if (!definition) return null;\n            if (!isWidgetAvailable(definition, productId)) return null;\n\n            return (\n              <div\n                key={widget.widgetId}\n                className={`flex items-center gap-3 p-3 rounded-lg border transition-colors ${\n                  widget.enabled\n                    ? 'border-border-default bg-bg-surface'\n                    : 'border-transparent bg-muted/30 opacity-60'\n                }`}\n              >\n                <GripVertical className=\"size-4 text-muted-foreground shrink-0\" />\n\n                <div className=\"flex-1 min-w-0\">\n                  <div className=\"flex items-center gap-2\">\n                    <span className=\"text-sm font-medium text-text-primary\">\n                      {definition.title}\n                    </span>\n                    <Badge variant=\"outline\" className=\"text-[10px]\">\n                      {definition.defaultSize}\n                    </Badge>\n                  </div>\n                  <p className=\"text-xs text-muted-foreground truncate\">{definition.description}</p>\n                </div>\n\n                <div className=\"flex items-center gap-1 shrink-0\">\n                  <Button\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    className=\"size-7 p-0\"\n                    disabled={idx === 0}\n                    onClick={() => moveWidget(widget.widgetId, 'up')}\n                  >\n                    <ArrowUp className=\"size-3\" />\n                  </Button>\n                  <Button\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    className=\"size-7 p-0\"\n                    disabled={idx === sorted.length - 1}\n                    onClick={() => moveWidget(widget.widgetId, 'down')}\n                  >\n                    <ArrowDown className=\"size-3\" />\n                  </Button>\n                  <Switch\n                    checked={widget.enabled}\n                    onCheckedChange={() => {\n                      void nativeImpact('medium');\n                      toggleWidget(widget.widgetId);\n                    }}\n                    disabled={!definition.removable}\n                    className=\"ml-1\"\n                  />\n                </div>\n              </div>\n            );\n          })}\n        </div>\n\n        <Separator />\n\n        <SheetFooter className=\"flex-row gap-2 pt-4\">\n          <Button variant=\"outline\" size=\"sm\" onClick={resetToDefaults} className=\"flex-1\">\n            <RotateCcw className=\"size-3 mr-1.5\" />\n            {tWithFallback(t, 'dashboardCustomizer.resetToDefaults', 'Reset to defaults')}\n          </Button>\n          <Button\n            size=\"sm\"\n            onClick={handleSave}\n            disabled={!hasChanges || isSaving}\n            className=\"flex-1\"\n          >\n            {isSaving ? (\n              <Loader2 className=\"size-3 mr-1.5 animate-spin\" />\n            ) : (\n              <Save className=\"size-3 mr-1.5\" />\n            )}\n            {tWithFallback(t, 'dashboardCustomizer.saveLayout', 'Save layout')}\n          </Button>\n        </SheetFooter>\n      </SheetContent>\n    </Sheet>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"DashboardCustomizer.js","names":[],"sources":["../../../src/pages/dashboard/DashboardCustomizer.tsx"],"sourcesContent":["/**\n * DashboardCustomizer — Sheet overlay for customizing dashboard widgets.\n *\n * Allows users to toggle widgets on/off, reorder them, and save their layout.\n */\nimport { useState, useCallback, useEffect } from 'react';\nimport {\n  Sheet,\n  SheetContent,\n  SheetHeader,\n  SheetTitle,\n  SheetDescription,\n  SheetFooter,\n  Button,\n  Switch,\n  Badge,\n  Separator,\n} from '@burdenoff/fe-libs/ui';\nimport { ArrowUp, ArrowDown, RotateCcw, Save, Loader2, GripVertical } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { tWithFallback } from '../../utils/i18n';\nimport type { WidgetConfig } from './types';\nimport {\n  WIDGET_DEFINITIONS,\n  DEFAULT_DASHBOARD_WIDGETS_BY_PRODUCT,\n  DEFAULT_DASHBOARD_WIDGETS,\n  isWidgetAvailable,\n} from './config';\nimport { nativeImpact } from '../../utils/nativeBridge';\n\ninterface DashboardCustomizerProps {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  widgets: WidgetConfig[];\n  onSave: (widgets: WidgetConfig[]) => Promise<void>;\n  isSaving: boolean;\n  productId?: string;\n}\n\nexport function DashboardCustomizer({\n  open,\n  onOpenChange,\n  widgets,\n  onSave,\n  isSaving,\n  productId = 'workspaces',\n}: DashboardCustomizerProps) {\n  const { t } = useI18n();\n\n  const [localWidgets, setLocalWidgets] = useState<WidgetConfig[]>(widgets);\n  const [hasChanges, setHasChanges] = useState(false);\n\n  // Sync local state when sheet opens or widgets prop changes while open\n  useEffect(() => {\n    if (open) {\n      setLocalWidgets([...widgets]);\n      setHasChanges(false);\n    }\n  }, [open, widgets]);\n\n  const toggleWidget = useCallback((widgetId: string) => {\n    setLocalWidgets((prev) =>\n      prev.map((w) => (w.widgetId === widgetId ? { ...w, enabled: !w.enabled } : w))\n    );\n    setHasChanges(true);\n  }, []);\n\n  const moveWidget = useCallback((widgetId: string, direction: 'up' | 'down') => {\n    setLocalWidgets((prev) => {\n      const sorted = [...prev].sort((a, b) => a.order - b.order);\n      const idx = sorted.findIndex((w) => w.widgetId === widgetId);\n      if (idx < 0) return prev;\n\n      const swapIdx = direction === 'up' ? idx - 1 : idx + 1;\n      if (swapIdx < 0 || swapIdx >= sorted.length) return prev;\n\n      // Swap orders\n      const tempOrder = sorted[idx].order;\n      sorted[idx] = { ...sorted[idx], order: sorted[swapIdx].order };\n      sorted[swapIdx] = { ...sorted[swapIdx], order: tempOrder };\n\n      return sorted;\n    });\n    setHasChanges(true);\n  }, []);\n\n  const resetToDefaults = useCallback(() => {\n    const defaults = DEFAULT_DASHBOARD_WIDGETS_BY_PRODUCT[productId] ?? DEFAULT_DASHBOARD_WIDGETS;\n    setLocalWidgets([...defaults]);\n    setHasChanges(true);\n  }, [productId]);\n\n  const handleSave = useCallback(async () => {\n    await onSave(localWidgets);\n    setHasChanges(false);\n    onOpenChange(false);\n  }, [localWidgets, onSave, onOpenChange]);\n\n  const sorted = [...localWidgets].sort((a, b) => a.order - b.order);\n\n  return (\n    <Sheet open={open} onOpenChange={onOpenChange}>\n      <SheetContent className=\"w-full sm:max-w-md overflow-y-auto\" side=\"right\">\n        <SheetHeader>\n          <SheetTitle>\n            {tWithFallback(t, 'dashboardCustomizer.title', 'Customize Dashboard')}\n          </SheetTitle>\n          <SheetDescription>\n            {tWithFallback(\n              t,\n              'dashboardCustomizer.description',\n              'Toggle widgets on or off and reorder them to personalize your dashboard.'\n            )}\n          </SheetDescription>\n        </SheetHeader>\n\n        <div className=\"py-4 space-y-1\">\n          {sorted.map((widget, idx) => {\n            const definition = WIDGET_DEFINITIONS[widget.widgetId];\n            if (!definition) return null;\n            if (!isWidgetAvailable(definition, productId)) return null;\n\n            return (\n              <div\n                key={widget.widgetId}\n                className={`flex items-center gap-3 p-3 rounded-lg border transition-colors ${\n                  widget.enabled\n                    ? 'border-border-default bg-bg-surface'\n                    : 'border-transparent bg-bg-sunken/30 opacity-60'\n                }`}\n              >\n                <GripVertical className=\"size-4 text-text-secondary shrink-0\" />\n\n                <div className=\"flex-1 min-w-0\">\n                  <div className=\"flex items-center gap-2\">\n                    <span className=\"text-sm font-medium text-text-primary\">\n                      {definition.title}\n                    </span>\n                    <Badge variant=\"outline\" className=\"text-[10px]\">\n                      {definition.defaultSize}\n                    </Badge>\n                  </div>\n                  <p className=\"text-xs text-text-secondary truncate\">{definition.description}</p>\n                </div>\n\n                <div className=\"flex items-center gap-1 shrink-0\">\n                  <Button\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    className=\"size-7 p-0\"\n                    disabled={idx === 0}\n                    onClick={() => moveWidget(widget.widgetId, 'up')}\n                  >\n                    <ArrowUp className=\"size-3\" />\n                  </Button>\n                  <Button\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    className=\"size-7 p-0\"\n                    disabled={idx === sorted.length - 1}\n                    onClick={() => moveWidget(widget.widgetId, 'down')}\n                  >\n                    <ArrowDown className=\"size-3\" />\n                  </Button>\n                  <Switch\n                    checked={widget.enabled}\n                    onCheckedChange={() => {\n                      void nativeImpact('medium');\n                      toggleWidget(widget.widgetId);\n                    }}\n                    disabled={!definition.removable}\n                    className=\"ml-1\"\n                  />\n                </div>\n              </div>\n            );\n          })}\n        </div>\n\n        <Separator />\n\n        <SheetFooter className=\"flex-row gap-2 pt-4\">\n          <Button variant=\"outline\" size=\"sm\" onClick={resetToDefaults} className=\"flex-1\">\n            <RotateCcw className=\"size-3 mr-1.5\" />\n            {tWithFallback(t, 'dashboardCustomizer.resetToDefaults', 'Reset to defaults')}\n          </Button>\n          <Button\n            size=\"sm\"\n            onClick={handleSave}\n            disabled={!hasChanges || isSaving}\n            className=\"flex-1\"\n          >\n            {isSaving ? (\n              <Loader2 className=\"size-3 mr-1.5 animate-spin\" />\n            ) : (\n              <Save className=\"size-3 mr-1.5\" />\n            )}\n            {tWithFallback(t, 'dashboardCustomizer.saveLayout', 'Save layout')}\n          </Button>\n        </SheetFooter>\n      </SheetContent>\n    </Sheet>\n  );\n}\n"],"mappings":";;;;;;;;;AAuCA,SAAgB,EAAoB,EAClC,SACA,iBACA,YACA,WACA,aACA,eAAY,gBACe;CAC3B,IAAM,EAAE,SAAM,GAAS,EAEjB,CAAC,GAAc,KAAmB,EAAyB,EAAQ,EACnE,CAAC,GAAY,KAAiB,EAAS,GAAM;AAGnD,SAAgB;AACd,EAAI,MACF,EAAgB,CAAC,GAAG,EAAQ,CAAC,EAC7B,EAAc,GAAM;IAErB,CAAC,GAAM,EAAQ,CAAC;CAEnB,IAAM,IAAe,GAAa,MAAqB;AAIrD,EAHA,GAAiB,MACf,EAAK,KAAK,MAAO,EAAE,aAAa,IAAW;GAAE,GAAG;GAAG,SAAS,CAAC,EAAE;GAAS,GAAG,EAAG,CAC/E,EACD,EAAc,GAAK;IAClB,EAAE,CAAC,EAEA,IAAa,GAAa,GAAkB,MAA6B;AAgB7E,EAfA,GAAiB,MAAS;GACxB,IAAM,IAAS,CAAC,GAAG,EAAK,CAAC,MAAM,GAAG,MAAM,EAAE,QAAQ,EAAE,MAAM,EACpD,IAAM,EAAO,WAAW,MAAM,EAAE,aAAa,EAAS;AAC5D,OAAI,IAAM,EAAG,QAAO;GAEpB,IAAM,IAAU,MAAc,OAAO,IAAM,IAAI,IAAM;AACrD,OAAI,IAAU,KAAK,KAAW,EAAO,OAAQ,QAAO;GAGpD,IAAM,IAAY,EAAO,GAAK;AAI9B,UAHA,EAAO,KAAO;IAAE,GAAG,EAAO;IAAM,OAAO,EAAO,GAAS;IAAO,EAC9D,EAAO,KAAW;IAAE,GAAG,EAAO;IAAU,OAAO;IAAW,EAEnD;IACP,EACF,EAAc,GAAK;IAClB,EAAE,CAAC,EAEA,IAAkB,QAAkB;AAGxC,EADA,EAAgB,CAAC,GADA,EAAqC,MAAc,EACvC,CAAC,EAC9B,EAAc,GAAK;IAClB,CAAC,EAAU,CAAC,EAET,IAAa,EAAY,YAAY;AAGzC,EAFA,MAAM,EAAO,EAAa,EAC1B,EAAc,GAAM,EACpB,EAAa,GAAM;IAClB;EAAC;EAAc;EAAQ;EAAa,CAAC,EAElC,IAAS,CAAC,GAAG,EAAa,CAAC,MAAM,GAAG,MAAM,EAAE,QAAQ,EAAE,MAAM;AAElE,QACE,kBAAC,GAAD;EAAa;EAAoB;YAC/B,kBAAC,GAAD;GAAc,WAAU;GAAqC,MAAK;aAAlE;IACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD,EAAA,UACG,EAAc,GAAG,6BAA6B,sBAAsB,EAC1D,CAAA,EACb,kBAAC,GAAD,EAAA,UACG,EACC,GACA,mCACA,2EACD,EACgB,CAAA,CACP,EAAA,CAAA;IAEd,kBAAC,OAAD;KAAK,WAAU;eACZ,EAAO,KAAK,GAAQ,MAAQ;MAC3B,IAAM,IAAa,EAAmB,EAAO;AAI7C,aAHI,CAAC,KACD,CAAC,EAAkB,GAAY,EAAU,GAAS,OAGpD,kBAAC,OAAD;OAEE,WAAW,mEACT,EAAO,UACH,wCACA;iBALR;QAQE,kBAAC,GAAD,EAAc,WAAU,uCAAwC,CAAA;QAEhE,kBAAC,OAAD;SAAK,WAAU;mBAAf,CACE,kBAAC,OAAD;UAAK,WAAU;oBAAf,CACE,kBAAC,QAAD;WAAM,WAAU;qBACb,EAAW;WACP,CAAA,EACP,kBAAC,GAAD;WAAO,SAAQ;WAAU,WAAU;qBAChC,EAAW;WACN,CAAA,CACJ;aACN,kBAAC,KAAD;UAAG,WAAU;oBAAwC,EAAW;UAAgB,CAAA,CAC5E;;QAEN,kBAAC,OAAD;SAAK,WAAU;mBAAf;UACE,kBAAC,GAAD;WACE,SAAQ;WACR,MAAK;WACL,WAAU;WACV,UAAU,MAAQ;WAClB,eAAe,EAAW,EAAO,UAAU,KAAK;qBAEhD,kBAAC,GAAD,EAAS,WAAU,UAAW,CAAA;WACvB,CAAA;UACT,kBAAC,GAAD;WACE,SAAQ;WACR,MAAK;WACL,WAAU;WACV,UAAU,MAAQ,EAAO,SAAS;WAClC,eAAe,EAAW,EAAO,UAAU,OAAO;qBAElD,kBAAC,GAAD,EAAW,WAAU,UAAW,CAAA;WACzB,CAAA;UACT,kBAAC,GAAD;WACE,SAAS,EAAO;WAChB,uBAAuB;AAErB,YADK,EAAa,SAAS,EAC3B,EAAa,EAAO,SAAS;;WAE/B,UAAU,CAAC,EAAW;WACtB,WAAU;WACV,CAAA;UACE;;QACF;SAlDC,EAAO,SAkDR;OAER;KACE,CAAA;IAEN,kBAAC,GAAD,EAAa,CAAA;IAEb,kBAAC,GAAD;KAAa,WAAU;eAAvB,CACE,kBAAC,GAAD;MAAQ,SAAQ;MAAU,MAAK;MAAK,SAAS;MAAiB,WAAU;gBAAxE,CACE,kBAAC,GAAD,EAAW,WAAU,iBAAkB,CAAA,EACtC,EAAc,GAAG,uCAAuC,oBAAoB,CACtE;SACT,kBAAC,GAAD;MACE,MAAK;MACL,SAAS;MACT,UAAU,CAAC,KAAc;MACzB,WAAU;gBAJZ,CAMG,IACC,kBAAC,GAAD,EAAS,WAAU,8BAA+B,CAAA,GAElD,kBAAC,GAAD,EAAM,WAAU,iBAAkB,CAAA,EAEnC,EAAc,GAAG,kCAAkC,cAAc,CAC3D;QACG;;IACD;;EACT,CAAA"}

package/dist/pages/dashboard/DashboardGrid.js

@@ -43,10 +43,10 @@ function S({ widgets: r, productId: i, ...a }) {
 	return s.length === 0 ? /* @__PURE__ */ y("div", {
 		className: "text-center py-12",
 		children: [/* @__PURE__ */ v("p", {
-			className: "text-lg text-muted-foreground",
+			className: "text-lg text-text-secondary",
 			children: e(o, "dashboardGrid.noWidgetsEnabled", "No widgets enabled")
 		}), /* @__PURE__ */ v("p", {
-			className: "text-sm text-muted-foreground mt-1",
+			className: "text-sm text-text-secondary mt-1",
 			children: e(o, "dashboardGrid.noWidgetsHint", "Click \"Customize\" to add widgets to your dashboard")
 		})]
 	}) : /* @__PURE__ */ v("div", {

package/dist/pages/dashboard/DashboardGrid.js.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardGrid.js","names":[],"sources":["../../../src/pages/dashboard/DashboardGrid.tsx"],"sourcesContent":["/**\n * DashboardGrid — Renders the configured widgets in a responsive grid.\n */\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { tWithFallback } from '../../utils/i18n';\nimport type { WidgetConfig, WidgetProps } from './types';\nimport { isWidgetAvailable, WIDGET_DEFINITIONS } from './config';\n\n// Widget components\nimport { WelcomeWidget } from './widgets/WelcomeWidget';\nimport { QuickActionsWidget } from './widgets/QuickActionsWidget';\nimport { WorkspacesWidget } from './widgets/WorkspacesWidget';\nimport { ProjectsWidget } from './widgets/ProjectsWidget';\nimport { RecentActivityWidget } from './widgets/RecentActivityWidget';\nimport { UpcomingEventsWidget } from './widgets/UpcomingEventsWidget';\nimport { WorkflowStatsWidget } from './widgets/WorkflowStatsWidget';\nimport { TagCloudWidget } from './widgets/TagCloudWidget';\nimport { StorageWidget } from './widgets/StorageWidget';\nimport { GroupsWidget } from './widgets/GroupsWidget';\nimport { MembersWidget } from './widgets/MembersWidget';\nimport { TipsWidget } from './widgets/TipsWidget';\nimport { VibesWidget } from './widgets/VibesWidget';\nimport { SessionsWidget } from './widgets/SessionsWidget';\nimport { AgentsWidget } from './widgets/AgentsWidget';\n\n// Widget component registry\nconst WIDGET_COMPONENTS: Record<string, React.FC<WidgetProps>> = {\n  welcome: WelcomeWidget,\n  quickActions: QuickActionsWidget,\n  workspaces: WorkspacesWidget,\n  projects: ProjectsWidget,\n  activity: RecentActivityWidget,\n  calendar: UpcomingEventsWidget,\n  workflows: WorkflowStatsWidget,\n  tags: TagCloudWidget,\n  storage: StorageWidget,\n  groups: GroupsWidget,\n  members: MembersWidget,\n  tips: TipsWidget,\n  vibes: VibesWidget,\n  sessions: SessionsWidget,\n  agents: AgentsWidget,\n};\n\ninterface DashboardGridProps extends WidgetProps {\n  widgets: WidgetConfig[];\n}\n\nexport function DashboardGrid({ widgets, productId, ...widgetProps }: DashboardGridProps) {\n  const { t } = useI18n();\n\n  const enabledWidgets = widgets\n    .filter((w) => w.enabled)\n    .filter((w) => {\n      const def = WIDGET_DEFINITIONS[w.widgetId];\n      if (!def) return false;\n      return isWidgetAvailable(def, productId);\n    })\n    .sort((a, b) => a.order - b.order);\n\n  if (enabledWidgets.length === 0) {\n    return (\n      <div className=\"text-center py-12\">\n        <p className=\"text-lg text-muted-foreground\">\n          {tWithFallback(t, 'dashboardGrid.noWidgetsEnabled', 'No widgets enabled')}\n        </p>\n        <p className=\"text-sm text-muted-foreground mt-1\">\n          {tWithFallback(\n            t,\n            'dashboardGrid.noWidgetsHint',\n            'Click \"Customize\" to add widgets to your dashboard'\n          )}\n        </p>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\">\n      {enabledWidgets.map((widgetConfig) => {\n        const Component = WIDGET_COMPONENTS[widgetConfig.widgetId];\n        if (!Component) return null;\n\n        return <Component key={widgetConfig.widgetId} productId={productId} {...widgetProps} />;\n      })}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA0BA,IAAM,IAA2D;CAC/D,SAAS;CACT,cAAc;CACd,YAAY;CACZ,UAAU;CACV,UAAU;CACV,UAAU;CACV,WAAW;CACX,MAAM;CACN,SAAS;CACT,QAAQ;CACR,SAAS;CACT,MAAM;CACN,OAAO;CACP,UAAU;CACV,QAAQ;CACT;AAMD,SAAgB,EAAc,EAAE,YAAS,cAAW,GAAG,KAAmC;CACxF,IAAM,EAAE,SAAM,GAAS,EAEjB,IAAiB,EACpB,QAAQ,MAAM,EAAE,QAAQ,CACxB,QAAQ,MAAM;EACb,IAAM,IAAM,EAAmB,EAAE;AAEjC,SADK,IACE,EAAkB,GAAK,EAAU,GADvB;GAEjB,CACD,MAAM,GAAG,MAAM,EAAE,QAAQ,EAAE,MAAM;AAmBpC,QAjBI,EAAe,WAAW,IAE1B,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,KAAD;GAAG,WAAU;aACV,EAAc,GAAG,kCAAkC,qBAAqB;GACvE,CAAA,EACJ,kBAAC,KAAD;GAAG,WAAU;aACV,EACC,GACA,+BACA,uDACD;GACC,CAAA,CACA;MAKR,kBAAC,OAAD;EAAK,WAAU;YACZ,EAAe,KAAK,MAAiB;GACpC,IAAM,IAAY,EAAkB,EAAa;AAGjD,UAFK,IAEE,kBAAC,GAAD;IAAkD;IAAW,GAAI;IAAe,EAAhE,EAAa,SAAmD,GAFhE;IAGvB;EACE,CAAA"}
+{"version":3,"file":"DashboardGrid.js","names":[],"sources":["../../../src/pages/dashboard/DashboardGrid.tsx"],"sourcesContent":["/**\n * DashboardGrid — Renders the configured widgets in a responsive grid.\n */\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { tWithFallback } from '../../utils/i18n';\nimport type { WidgetConfig, WidgetProps } from './types';\nimport { isWidgetAvailable, WIDGET_DEFINITIONS } from './config';\n\n// Widget components\nimport { WelcomeWidget } from './widgets/WelcomeWidget';\nimport { QuickActionsWidget } from './widgets/QuickActionsWidget';\nimport { WorkspacesWidget } from './widgets/WorkspacesWidget';\nimport { ProjectsWidget } from './widgets/ProjectsWidget';\nimport { RecentActivityWidget } from './widgets/RecentActivityWidget';\nimport { UpcomingEventsWidget } from './widgets/UpcomingEventsWidget';\nimport { WorkflowStatsWidget } from './widgets/WorkflowStatsWidget';\nimport { TagCloudWidget } from './widgets/TagCloudWidget';\nimport { StorageWidget } from './widgets/StorageWidget';\nimport { GroupsWidget } from './widgets/GroupsWidget';\nimport { MembersWidget } from './widgets/MembersWidget';\nimport { TipsWidget } from './widgets/TipsWidget';\nimport { VibesWidget } from './widgets/VibesWidget';\nimport { SessionsWidget } from './widgets/SessionsWidget';\nimport { AgentsWidget } from './widgets/AgentsWidget';\n\n// Widget component registry\nconst WIDGET_COMPONENTS: Record<string, React.FC<WidgetProps>> = {\n  welcome: WelcomeWidget,\n  quickActions: QuickActionsWidget,\n  workspaces: WorkspacesWidget,\n  projects: ProjectsWidget,\n  activity: RecentActivityWidget,\n  calendar: UpcomingEventsWidget,\n  workflows: WorkflowStatsWidget,\n  tags: TagCloudWidget,\n  storage: StorageWidget,\n  groups: GroupsWidget,\n  members: MembersWidget,\n  tips: TipsWidget,\n  vibes: VibesWidget,\n  sessions: SessionsWidget,\n  agents: AgentsWidget,\n};\n\ninterface DashboardGridProps extends WidgetProps {\n  widgets: WidgetConfig[];\n}\n\nexport function DashboardGrid({ widgets, productId, ...widgetProps }: DashboardGridProps) {\n  const { t } = useI18n();\n\n  const enabledWidgets = widgets\n    .filter((w) => w.enabled)\n    .filter((w) => {\n      const def = WIDGET_DEFINITIONS[w.widgetId];\n      if (!def) return false;\n      return isWidgetAvailable(def, productId);\n    })\n    .sort((a, b) => a.order - b.order);\n\n  if (enabledWidgets.length === 0) {\n    return (\n      <div className=\"text-center py-12\">\n        <p className=\"text-lg text-text-secondary\">\n          {tWithFallback(t, 'dashboardGrid.noWidgetsEnabled', 'No widgets enabled')}\n        </p>\n        <p className=\"text-sm text-text-secondary mt-1\">\n          {tWithFallback(\n            t,\n            'dashboardGrid.noWidgetsHint',\n            'Click \"Customize\" to add widgets to your dashboard'\n          )}\n        </p>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\">\n      {enabledWidgets.map((widgetConfig) => {\n        const Component = WIDGET_COMPONENTS[widgetConfig.widgetId];\n        if (!Component) return null;\n\n        return <Component key={widgetConfig.widgetId} productId={productId} {...widgetProps} />;\n      })}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA0BA,IAAM,IAA2D;CAC/D,SAAS;CACT,cAAc;CACd,YAAY;CACZ,UAAU;CACV,UAAU;CACV,UAAU;CACV,WAAW;CACX,MAAM;CACN,SAAS;CACT,QAAQ;CACR,SAAS;CACT,MAAM;CACN,OAAO;CACP,UAAU;CACV,QAAQ;CACT;AAMD,SAAgB,EAAc,EAAE,YAAS,cAAW,GAAG,KAAmC;CACxF,IAAM,EAAE,SAAM,GAAS,EAEjB,IAAiB,EACpB,QAAQ,MAAM,EAAE,QAAQ,CACxB,QAAQ,MAAM;EACb,IAAM,IAAM,EAAmB,EAAE;AAEjC,SADK,IACE,EAAkB,GAAK,EAAU,GADvB;GAEjB,CACD,MAAM,GAAG,MAAM,EAAE,QAAQ,EAAE,MAAM;AAmBpC,QAjBI,EAAe,WAAW,IAE1B,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,KAAD;GAAG,WAAU;aACV,EAAc,GAAG,kCAAkC,qBAAqB;GACvE,CAAA,EACJ,kBAAC,KAAD;GAAG,WAAU;aACV,EACC,GACA,+BACA,uDACD;GACC,CAAA,CACA;MAKR,kBAAC,OAAD;EAAK,WAAU;YACZ,EAAe,KAAK,MAAiB;GACpC,IAAM,IAAY,EAAkB,EAAa;AAGjD,UAFK,IAEE,kBAAC,GAAD;IAAkD;IAAW,GAAI;IAAe,EAAhE,EAAa,SAAmD,GAFhE;IAGvB;EACE,CAAA"}

package/dist/pages/dashboard/DashboardPage.js

@@ -75,7 +75,7 @@ function b({ navigate: b, authToken: x, currentUser: S, productId: C = "workspac
 					className: "text-xl font-bold text-text-primary",
 					children: T("dashboard.title", "Dashboard")
 				}), /* @__PURE__ */ g("p", {
-					className: "text-sm text-muted-foreground mt-0.5",
+					className: "text-sm text-text-secondary mt-0.5",
 					children: T("dashboard.subtitle", "Your workspace overview at a glance")
 				})] }), /* @__PURE__ */ _("div", {
 					className: "flex flex-wrap items-center gap-2",
@@ -103,9 +103,9 @@ function b({ navigate: b, authToken: x, currentUser: S, productId: C = "workspac
 				})]
 			}),
 			X && /* @__PURE__ */ _("div", {
-				className: "mb-4 p-3 bg-destructive/10 border border-destructive/20 rounded-lg flex items-center gap-2",
-				children: [/* @__PURE__ */ g(f, { className: "size-4 text-destructive shrink-0" }), /* @__PURE__ */ _("p", {
-					className: "text-sm text-destructive",
+				className: "mb-4 p-3 bg-status-error-bg/10 border border-status-error-border/20 rounded-lg flex items-center gap-2",
+				children: [/* @__PURE__ */ g(f, { className: "size-4 text-status-error-text shrink-0" }), /* @__PURE__ */ _("p", {
+					className: "text-sm text-status-error-text",
 					children: [
 						T("dashboard.error.partialData", "Some data may be unavailable."),
 						" ",
@@ -115,7 +115,7 @@ function b({ navigate: b, authToken: x, currentUser: S, productId: C = "workspac
 						" ",
 						/* @__PURE__ */ g("button", {
 							type: "button",
-							className: "underline font-medium hover:text-destructive/80",
+							className: "underline font-medium hover:text-status-error-text/80",
 							onClick: J,
 							children: T("dashboard.error.tryRefreshing", "Try refreshing")
 						})

package/dist/pages/dashboard/DashboardPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardPage.js","names":[],"sources":["../../../src/pages/dashboard/DashboardPage.tsx"],"sourcesContent":["/**\n * DashboardPage — Comprehensive workspace dashboard.\n *\n * This is the main dashboard component exported from microfe-workspaces.\n * It fetches data from both workspace and global gateways, manages widget\n * layout preferences, and renders a customizable grid of widgets.\n *\n * Props:\n * - navigate: Shell navigation function\n * - authToken: Current user's auth token\n * - currentUser: Basic user info from shell\n *\n * Data Flow:\n * 1. Two parallel queries: workspace gateway + global gateway\n * 2. Global query returns user preferences (dashboard layout)\n * 3. Widget layout falls back to defaults if no preferences saved\n * 4. Data is passed as props to individual widgets\n */\nimport { useState, useMemo, useCallback } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Settings2, RefreshCw, Loader2, AlertCircle } from 'lucide-react';\nimport {\n  useWorkspaceDashboardData,\n  useGlobalDashboardData,\n  useProjectsDashboardData,\n  useVibecontrolsDashboardData,\n} from './hooks/useDashboardData';\nimport { useUpdateDashboardPreferences } from './hooks/useDashboardPreferences';\nimport { DashboardGrid } from './DashboardGrid';\nimport { DashboardCustomizer } from './DashboardCustomizer';\nimport { getEffectiveWidgets } from './config';\nimport type { WidgetConfig } from './types';\nimport { useWorkspacesPageView } from '../../hooks/useWorkspacesPageView';\n\ninterface DashboardPageProps {\n  navigate: (path: string) => void;\n  authToken?: string | null;\n  currentUser?: {\n    id: string;\n    email: string;\n    firstName?: string;\n    lastName?: string;\n    name?: string;\n  } | null;\n  /**\n   * Host product identifier ('workspaces', 'vibecontrols', etc.). Drives\n   * which widgets appear in the registry + default layout. Defaults to\n   * 'workspaces' for legacy callers.\n   */\n  productId?: string;\n}\n\nexport function DashboardPage({\n  navigate,\n  authToken,\n  currentUser: _currentUser,\n  productId = 'workspaces',\n}: DashboardPageProps) {\n  useWorkspacesPageView('workspaces.dashboard');\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const v = t(key);\n    return v === key ? fallback : v;\n  };\n  const [customizerOpen, setCustomizerOpen] = useState(false);\n\n  // ─── Data Fetching ────────────────────────────────────────────────────────\n  const {\n    data: workspaceData,\n    isLoading: wsLoading,\n    error: wsError,\n    refetch: refetchWs,\n  } = useWorkspaceDashboardData(authToken);\n\n  const {\n    data: globalData,\n    isLoading: globalLoading,\n    error: globalError,\n    refetch: refetchGlobal,\n  } = useGlobalDashboardData(authToken);\n\n  const {\n    data: projectsData,\n    isLoading: projectsLoading,\n    refetch: refetchProjects,\n  } = useProjectsDashboardData(authToken);\n\n  const isVibecontrols = productId === 'vibecontrols';\n  const {\n    data: vibecontrolsData,\n    isLoading: vibecontrolsLoading,\n    refetch: refetchVibecontrols,\n  } = useVibecontrolsDashboardData(authToken, isVibecontrols);\n\n  const updatePrefs = useUpdateDashboardPreferences(authToken);\n\n  const isLoading = wsLoading || globalLoading || projectsLoading || vibecontrolsLoading;\n\n  // ─── Merge data ───────────────────────────────────────────────────────────\n  // Workspace/org stats come from the global tenant service (globalData),\n  // while workspace-scoped features (activity, calendar, tags, etc.) come\n  // from the workspace gateway (workspaceData). Merge them so widgets\n  // reading workspaceData.workspaces see the real tenant data.\n  const mergedWorkspaceData = useMemo(() => {\n    if (!workspaceData && !globalData && !projectsData && !vibecontrolsData) return null;\n    return {\n      ...(workspaceData ?? {\n        workspaces: { items: [], total: 0 },\n        projects: { items: [], total: 0 },\n        recentActivities: [],\n        upcomingEvents: [],\n        tags: { items: [], total: 0 },\n        groups: { items: [], totalCount: 0 },\n        workflowStats: null,\n        storageUsage: null,\n      }),\n      // Override with real workspace/org data from the global gateway\n      workspaces: globalData?.workspaces ?? { items: [], total: 0 },\n      // Override with real project data from the separate projects query\n      // (fetched independently to avoid being poisoned by other subgraph errors)\n      projects: projectsData ?? { items: [], total: 0 },\n      // VibeControls-only data; undefined for other products\n      recentVibes: vibecontrolsData?.recentVibes,\n      activeSessions: vibecontrolsData?.activeSessions,\n      agentFleet: vibecontrolsData?.agentFleet ?? null,\n    };\n  }, [workspaceData, globalData, projectsData, vibecontrolsData]);\n\n  // ─── Widget Configuration ─────────────────────────────────────────────────\n  const savedPrefs = globalData?.dashboardPreferences;\n  const widgets = useMemo(\n    () => getEffectiveWidgets(savedPrefs?.widgets ?? null, productId),\n    [savedPrefs, productId]\n  );\n\n  // ─── Handlers ─────────────────────────────────────────────────────────────\n  const handleRefresh = useCallback(() => {\n    refetchWs();\n    refetchGlobal();\n    refetchProjects();\n    if (isVibecontrols) refetchVibecontrols();\n  }, [refetchWs, refetchGlobal, refetchProjects, refetchVibecontrols, isVibecontrols]);\n\n  const handleSaveWidgets = useCallback(\n    async (newWidgets: WidgetConfig[]) => {\n      await updatePrefs.mutateAsync(newWidgets);\n    },\n    [updatePrefs]\n  );\n\n  // ─── Error Banner ─────────────────────────────────────────────────────────\n  const hasError = wsError || globalError;\n\n  return (\n    <div className=\"min-h-[calc(100vh-8rem)] p-4 md:p-6 bg-bg-canvas\" data-tour=\"main-content\">\n      {/* Header */}\n      <div className=\"flex flex-wrap items-center justify-between gap-4 mb-6\">\n        <div>\n          <h1 className=\"text-xl font-bold text-text-primary\">\n            {tr('dashboard.title', 'Dashboard')}\n          </h1>\n          <p className=\"text-sm text-muted-foreground mt-0.5\">\n            {tr('dashboard.subtitle', 'Your workspace overview at a glance')}\n          </p>\n        </div>\n        <div className=\"flex flex-wrap items-center gap-2\" data-tour=\"quick-actions\">\n          <Button\n            variant=\"outline\"\n            size=\"sm\"\n            onClick={handleRefresh}\n            disabled={isLoading}\n            className=\"text-xs\"\n          >\n            {isLoading ? (\n              <Loader2 className=\"size-3.5 sm:mr-1.5 animate-spin\" />\n            ) : (\n              <RefreshCw className=\"size-3.5 sm:mr-1.5\" />\n            )}\n            <span className=\"hidden sm:inline\">{tr('dashboard.refresh', 'Refresh')}</span>\n          </Button>\n          <Button\n            variant=\"outline\"\n            size=\"sm\"\n            onClick={() => setCustomizerOpen(true)}\n            className=\"text-xs\"\n          >\n            <Settings2 className=\"size-3.5 sm:mr-1.5\" />\n            <span className=\"hidden sm:inline\">{tr('dashboard.customize', 'Customize')}</span>\n          </Button>\n        </div>\n      </div>\n\n      {/* Error Banner */}\n      {hasError && (\n        <div className=\"mb-4 p-3 bg-destructive/10 border border-destructive/20 rounded-lg flex items-center gap-2\">\n          <AlertCircle className=\"size-4 text-destructive shrink-0\" />\n          <p className=\"text-sm text-destructive\">\n            {tr('dashboard.error.partialData', 'Some data may be unavailable.')}{' '}\n            {wsError ? tr('dashboard.error.workspaceDown', 'Workspace services may be down.') : ''}{' '}\n            {globalError ? tr('dashboard.error.globalDown', 'Global services may be down.') : ''}{' '}\n            <button\n              type=\"button\"\n              className=\"underline font-medium hover:text-destructive/80\"\n              onClick={handleRefresh}\n            >\n              {tr('dashboard.error.tryRefreshing', 'Try refreshing')}\n            </button>\n          </p>\n        </div>\n      )}\n\n      {/* Widget Grid */}\n      {/* Merge workspace/org data from the global query into workspaceData\n          so widgets that read workspaceData.workspaces see the real data\n          from the global tenant service. */}\n      <DashboardGrid\n        widgets={widgets}\n        workspaceData={mergedWorkspaceData}\n        globalData={globalData ?? null}\n        isLoading={isLoading}\n        navigate={navigate}\n        productId={productId}\n      />\n\n      {/* Customizer */}\n      <DashboardCustomizer\n        open={customizerOpen}\n        onOpenChange={setCustomizerOpen}\n        widgets={widgets}\n        onSave={handleSaveWidgets}\n        isSaving={updatePrefs.isPending}\n        productId={productId}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"DashboardPage.js","names":[],"sources":["../../../src/pages/dashboard/DashboardPage.tsx"],"sourcesContent":["/**\n * DashboardPage — Comprehensive workspace dashboard.\n *\n * This is the main dashboard component exported from microfe-workspaces.\n * It fetches data from both workspace and global gateways, manages widget\n * layout preferences, and renders a customizable grid of widgets.\n *\n * Props:\n * - navigate: Shell navigation function\n * - authToken: Current user's auth token\n * - currentUser: Basic user info from shell\n *\n * Data Flow:\n * 1. Two parallel queries: workspace gateway + global gateway\n * 2. Global query returns user preferences (dashboard layout)\n * 3. Widget layout falls back to defaults if no preferences saved\n * 4. Data is passed as props to individual widgets\n */\nimport { useState, useMemo, useCallback } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Settings2, RefreshCw, Loader2, AlertCircle } from 'lucide-react';\nimport {\n  useWorkspaceDashboardData,\n  useGlobalDashboardData,\n  useProjectsDashboardData,\n  useVibecontrolsDashboardData,\n} from './hooks/useDashboardData';\nimport { useUpdateDashboardPreferences } from './hooks/useDashboardPreferences';\nimport { DashboardGrid } from './DashboardGrid';\nimport { DashboardCustomizer } from './DashboardCustomizer';\nimport { getEffectiveWidgets } from './config';\nimport type { WidgetConfig } from './types';\nimport { useWorkspacesPageView } from '../../hooks/useWorkspacesPageView';\n\ninterface DashboardPageProps {\n  navigate: (path: string) => void;\n  authToken?: string | null;\n  currentUser?: {\n    id: string;\n    email: string;\n    firstName?: string;\n    lastName?: string;\n    name?: string;\n  } | null;\n  /**\n   * Host product identifier ('workspaces', 'vibecontrols', etc.). Drives\n   * which widgets appear in the registry + default layout. Defaults to\n   * 'workspaces' for legacy callers.\n   */\n  productId?: string;\n}\n\nexport function DashboardPage({\n  navigate,\n  authToken,\n  currentUser: _currentUser,\n  productId = 'workspaces',\n}: DashboardPageProps) {\n  useWorkspacesPageView('workspaces.dashboard');\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const v = t(key);\n    return v === key ? fallback : v;\n  };\n  const [customizerOpen, setCustomizerOpen] = useState(false);\n\n  // ─── Data Fetching ────────────────────────────────────────────────────────\n  const {\n    data: workspaceData,\n    isLoading: wsLoading,\n    error: wsError,\n    refetch: refetchWs,\n  } = useWorkspaceDashboardData(authToken);\n\n  const {\n    data: globalData,\n    isLoading: globalLoading,\n    error: globalError,\n    refetch: refetchGlobal,\n  } = useGlobalDashboardData(authToken);\n\n  const {\n    data: projectsData,\n    isLoading: projectsLoading,\n    refetch: refetchProjects,\n  } = useProjectsDashboardData(authToken);\n\n  const isVibecontrols = productId === 'vibecontrols';\n  const {\n    data: vibecontrolsData,\n    isLoading: vibecontrolsLoading,\n    refetch: refetchVibecontrols,\n  } = useVibecontrolsDashboardData(authToken, isVibecontrols);\n\n  const updatePrefs = useUpdateDashboardPreferences(authToken);\n\n  const isLoading = wsLoading || globalLoading || projectsLoading || vibecontrolsLoading;\n\n  // ─── Merge data ───────────────────────────────────────────────────────────\n  // Workspace/org stats come from the global tenant service (globalData),\n  // while workspace-scoped features (activity, calendar, tags, etc.) come\n  // from the workspace gateway (workspaceData). Merge them so widgets\n  // reading workspaceData.workspaces see the real tenant data.\n  const mergedWorkspaceData = useMemo(() => {\n    if (!workspaceData && !globalData && !projectsData && !vibecontrolsData) return null;\n    return {\n      ...(workspaceData ?? {\n        workspaces: { items: [], total: 0 },\n        projects: { items: [], total: 0 },\n        recentActivities: [],\n        upcomingEvents: [],\n        tags: { items: [], total: 0 },\n        groups: { items: [], totalCount: 0 },\n        workflowStats: null,\n        storageUsage: null,\n      }),\n      // Override with real workspace/org data from the global gateway\n      workspaces: globalData?.workspaces ?? { items: [], total: 0 },\n      // Override with real project data from the separate projects query\n      // (fetched independently to avoid being poisoned by other subgraph errors)\n      projects: projectsData ?? { items: [], total: 0 },\n      // VibeControls-only data; undefined for other products\n      recentVibes: vibecontrolsData?.recentVibes,\n      activeSessions: vibecontrolsData?.activeSessions,\n      agentFleet: vibecontrolsData?.agentFleet ?? null,\n    };\n  }, [workspaceData, globalData, projectsData, vibecontrolsData]);\n\n  // ─── Widget Configuration ─────────────────────────────────────────────────\n  const savedPrefs = globalData?.dashboardPreferences;\n  const widgets = useMemo(\n    () => getEffectiveWidgets(savedPrefs?.widgets ?? null, productId),\n    [savedPrefs, productId]\n  );\n\n  // ─── Handlers ─────────────────────────────────────────────────────────────\n  const handleRefresh = useCallback(() => {\n    refetchWs();\n    refetchGlobal();\n    refetchProjects();\n    if (isVibecontrols) refetchVibecontrols();\n  }, [refetchWs, refetchGlobal, refetchProjects, refetchVibecontrols, isVibecontrols]);\n\n  const handleSaveWidgets = useCallback(\n    async (newWidgets: WidgetConfig[]) => {\n      await updatePrefs.mutateAsync(newWidgets);\n    },\n    [updatePrefs]\n  );\n\n  // ─── Error Banner ─────────────────────────────────────────────────────────\n  const hasError = wsError || globalError;\n\n  return (\n    <div className=\"min-h-[calc(100vh-8rem)] p-4 md:p-6 bg-bg-canvas\" data-tour=\"main-content\">\n      {/* Header */}\n      <div className=\"flex flex-wrap items-center justify-between gap-4 mb-6\">\n        <div>\n          <h1 className=\"text-xl font-bold text-text-primary\">\n            {tr('dashboard.title', 'Dashboard')}\n          </h1>\n          <p className=\"text-sm text-text-secondary mt-0.5\">\n            {tr('dashboard.subtitle', 'Your workspace overview at a glance')}\n          </p>\n        </div>\n        <div className=\"flex flex-wrap items-center gap-2\" data-tour=\"quick-actions\">\n          <Button\n            variant=\"outline\"\n            size=\"sm\"\n            onClick={handleRefresh}\n            disabled={isLoading}\n            className=\"text-xs\"\n          >\n            {isLoading ? (\n              <Loader2 className=\"size-3.5 sm:mr-1.5 animate-spin\" />\n            ) : (\n              <RefreshCw className=\"size-3.5 sm:mr-1.5\" />\n            )}\n            <span className=\"hidden sm:inline\">{tr('dashboard.refresh', 'Refresh')}</span>\n          </Button>\n          <Button\n            variant=\"outline\"\n            size=\"sm\"\n            onClick={() => setCustomizerOpen(true)}\n            className=\"text-xs\"\n          >\n            <Settings2 className=\"size-3.5 sm:mr-1.5\" />\n            <span className=\"hidden sm:inline\">{tr('dashboard.customize', 'Customize')}</span>\n          </Button>\n        </div>\n      </div>\n\n      {/* Error Banner */}\n      {hasError && (\n        <div className=\"mb-4 p-3 bg-status-error-bg/10 border border-status-error-border/20 rounded-lg flex items-center gap-2\">\n          <AlertCircle className=\"size-4 text-status-error-text shrink-0\" />\n          <p className=\"text-sm text-status-error-text\">\n            {tr('dashboard.error.partialData', 'Some data may be unavailable.')}{' '}\n            {wsError ? tr('dashboard.error.workspaceDown', 'Workspace services may be down.') : ''}{' '}\n            {globalError ? tr('dashboard.error.globalDown', 'Global services may be down.') : ''}{' '}\n            <button\n              type=\"button\"\n              className=\"underline font-medium hover:text-status-error-text/80\"\n              onClick={handleRefresh}\n            >\n              {tr('dashboard.error.tryRefreshing', 'Try refreshing')}\n            </button>\n          </p>\n        </div>\n      )}\n\n      {/* Widget Grid */}\n      {/* Merge workspace/org data from the global query into workspaceData\n          so widgets that read workspaceData.workspaces see the real data\n          from the global tenant service. */}\n      <DashboardGrid\n        widgets={widgets}\n        workspaceData={mergedWorkspaceData}\n        globalData={globalData ?? null}\n        isLoading={isLoading}\n        navigate={navigate}\n        productId={productId}\n      />\n\n      {/* Customizer */}\n      <DashboardCustomizer\n        open={customizerOpen}\n        onOpenChange={setCustomizerOpen}\n        widgets={widgets}\n        onSave={handleSaveWidgets}\n        isSaving={updatePrefs.isPending}\n        productId={productId}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/pages/dashboard/WidgetWrapper.js

@@ -27,10 +27,10 @@ function p({ message: e }) {
 	return /* @__PURE__ */ i("div", {
 		className: "flex flex-col items-center justify-center py-6 text-center",
 		children: [/* @__PURE__ */ r("div", {
-			className: "rounded-full bg-destructive/10 p-2 mb-2",
-			children: /* @__PURE__ */ r(t, { className: "size-5 text-destructive" })
+			className: "rounded-full bg-status-error-bg/10 p-2 mb-2",
+			children: /* @__PURE__ */ r(t, { className: "size-5 text-status-error-text" })
 		}), /* @__PURE__ */ r("p", {
-			className: "text-sm text-muted-foreground",
+			className: "text-sm text-text-secondary",
 			children: e
 		})]
 	});
@@ -40,10 +40,10 @@ function m() {
 	return /* @__PURE__ */ i("div", {
 		className: "flex flex-col items-center justify-center py-6 text-center",
 		children: [/* @__PURE__ */ r("div", {
-			className: "rounded-full bg-muted p-2 mb-2",
-			children: /* @__PURE__ */ r(n, { className: "size-5 text-muted-foreground" })
+			className: "rounded-full bg-bg-sunken p-2 mb-2",
+			children: /* @__PURE__ */ r(n, { className: "size-5 text-text-secondary" })
 		}), /* @__PURE__ */ r("p", {
-			className: "text-sm text-muted-foreground",
+			className: "text-sm text-text-secondary",
 			children: e(t, "widgetWrapper.serviceUnavailable", "Service unavailable")
 		})]
 	});

package/dist/pages/dashboard/WidgetWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"WidgetWrapper.js","names":[],"sources":["../../../src/pages/dashboard/WidgetWrapper.tsx"],"sourcesContent":["/**\n * WidgetWrapper — Common wrapper for all dashboard widgets.\n *\n * Provides consistent card styling, loading skeleton, error state,\n * and unavailable state.\n */\nimport { type ReactNode } from 'react';\nimport { Card, CardContent, CardHeader, CardTitle } from '@burdenoff/fe-libs/ui';\nimport { Skeleton } from '@burdenoff/fe-libs/ui';\nimport { AlertCircle, WifiOff } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { tWithFallback } from '../../utils/i18n';\nimport type { WidgetSize } from './types';\n\ninterface WidgetWrapperProps {\n  title: string;\n  icon?: ReactNode;\n  size: WidgetSize;\n  isLoading?: boolean;\n  error?: string | null;\n  unavailable?: boolean;\n  headerAction?: ReactNode;\n  children: ReactNode;\n  className?: string;\n}\n\nfunction getColSpan(size: WidgetSize): string {\n  switch (size) {\n    case 'large':\n      return 'col-span-1 sm:col-span-2 lg:col-span-3';\n    case 'medium':\n      return 'col-span-1 sm:col-span-2 lg:col-span-2 xl:col-span-2 2xl:col-span-1';\n    case 'small':\n      return 'col-span-1';\n    default:\n      return 'col-span-1';\n  }\n}\n\nfunction LoadingSkeleton() {\n  return (\n    <div className=\"space-y-3 p-1\">\n      <Skeleton className=\"h-4 w-3/4\" />\n      <Skeleton className=\"h-4 w-1/2\" />\n      <Skeleton className=\"h-20 w-full\" />\n      <Skeleton className=\"h-4 w-2/3\" />\n    </div>\n  );\n}\n\nfunction ErrorState({ message }: { message: string }) {\n  return (\n    <div className=\"flex flex-col items-center justify-center py-6 text-center\">\n      <div className=\"rounded-full bg-destructive/10 p-2 mb-2\">\n        <AlertCircle className=\"size-5 text-destructive\" />\n      </div>\n      <p className=\"text-sm text-muted-foreground\">{message}</p>\n    </div>\n  );\n}\n\nfunction UnavailableState() {\n  const { t } = useI18n();\n\n  return (\n    <div className=\"flex flex-col items-center justify-center py-6 text-center\">\n      <div className=\"rounded-full bg-muted p-2 mb-2\">\n        <WifiOff className=\"size-5 text-muted-foreground\" />\n      </div>\n      <p className=\"text-sm text-muted-foreground\">\n        {tWithFallback(t, 'widgetWrapper.serviceUnavailable', 'Service unavailable')}\n      </p>\n    </div>\n  );\n}\n\nexport function WidgetWrapper({\n  title,\n  icon,\n  size,\n  isLoading,\n  error,\n  unavailable,\n  headerAction,\n  children,\n  className = '',\n}: WidgetWrapperProps) {\n  const colSpan = getColSpan(size);\n\n  return (\n    <Card\n      className={`${colSpan} transition-all duration-200 hover:shadow-md border border-border-default bg-bg-surface ${className}`}\n    >\n      <CardHeader className=\"flex flex-row items-center justify-between pb-2 gap-y-0\">\n        <CardTitle className=\"text-sm font-semibold text-text-primary flex items-center gap-2\">\n          {icon}\n          {title}\n        </CardTitle>\n        {headerAction}\n      </CardHeader>\n      <CardContent className=\"pt-0\">\n        {isLoading ? (\n          <LoadingSkeleton />\n        ) : error ? (\n          <ErrorState message={error} />\n        ) : unavailable ? (\n          <UnavailableState />\n        ) : (\n          children\n        )}\n      </CardContent>\n    </Card>\n  );\n}\n"],"mappings":";;;;;;AA0BA,SAAS,EAAW,GAA0B;AAC5C,SAAQ,GAAR;EACE,KAAK,QACH,QAAO;EACT,KAAK,SACH,QAAO;EACT,KAAK,QACH,QAAO;EACT,QACE,QAAO;;;AAIb,SAAS,IAAkB;AACzB,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf;GACE,kBAAC,GAAD,EAAU,WAAU,aAAc,CAAA;GAClC,kBAAC,GAAD,EAAU,WAAU,aAAc,CAAA;GAClC,kBAAC,GAAD,EAAU,WAAU,eAAgB,CAAA;GACpC,kBAAC,GAAD,EAAU,WAAU,aAAc,CAAA;GAC9B;;;AAIV,SAAS,EAAW,EAAE,cAAgC;AACpD,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,GAAD,EAAa,WAAU,2BAA4B,CAAA;GAC/C,CAAA,EACN,kBAAC,KAAD;GAAG,WAAU;aAAiC;GAAY,CAAA,CACtD;;;AAIV,SAAS,IAAmB;CAC1B,IAAM,EAAE,MAAM,GAAS;AAEvB,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,GAAD,EAAS,WAAU,gCAAiC,CAAA;GAChD,CAAA,EACN,kBAAC,KAAD;GAAG,WAAU;aACV,EAAc,GAAG,oCAAoC,sBAAsB;GAC1E,CAAA,CACA;;;AAIV,SAAgB,EAAc,EAC5B,UACA,SACA,SACA,cACA,UACA,gBACA,iBACA,aACA,eAAY,MACS;AAGrB,QACE,kBAAC,GAAD;EACE,WAAW,GAJC,EAAW,EAAK,CAIN,0FAA0F;YADlH,CAGE,kBAAC,GAAD;GAAY,WAAU;aAAtB,CACE,kBAAC,GAAD;IAAW,WAAU;cAArB,CACG,GACA,EACS;OACX,EACU;MACb,kBAAC,GAAD;GAAa,WAAU;aACpB,IACC,kBAAC,GAAD,EAAmB,CAAA,GACjB,IACF,kBAAC,GAAD,EAAY,SAAS,GAAS,CAAA,GAC5B,IACF,kBAAC,GAAD,EAAoB,CAAA,GAEpB;GAEU,CAAA,CACT"}
+{"version":3,"file":"WidgetWrapper.js","names":[],"sources":["../../../src/pages/dashboard/WidgetWrapper.tsx"],"sourcesContent":["/**\n * WidgetWrapper — Common wrapper for all dashboard widgets.\n *\n * Provides consistent card styling, loading skeleton, error state,\n * and unavailable state.\n */\nimport { type ReactNode } from 'react';\nimport { Card, CardContent, CardHeader, CardTitle } from '@burdenoff/fe-libs/ui';\nimport { Skeleton } from '@burdenoff/fe-libs/ui';\nimport { AlertCircle, WifiOff } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { tWithFallback } from '../../utils/i18n';\nimport type { WidgetSize } from './types';\n\ninterface WidgetWrapperProps {\n  title: string;\n  icon?: ReactNode;\n  size: WidgetSize;\n  isLoading?: boolean;\n  error?: string | null;\n  unavailable?: boolean;\n  headerAction?: ReactNode;\n  children: ReactNode;\n  className?: string;\n}\n\nfunction getColSpan(size: WidgetSize): string {\n  switch (size) {\n    case 'large':\n      return 'col-span-1 sm:col-span-2 lg:col-span-3';\n    case 'medium':\n      return 'col-span-1 sm:col-span-2 lg:col-span-2 xl:col-span-2 2xl:col-span-1';\n    case 'small':\n      return 'col-span-1';\n    default:\n      return 'col-span-1';\n  }\n}\n\nfunction LoadingSkeleton() {\n  return (\n    <div className=\"space-y-3 p-1\">\n      <Skeleton className=\"h-4 w-3/4\" />\n      <Skeleton className=\"h-4 w-1/2\" />\n      <Skeleton className=\"h-20 w-full\" />\n      <Skeleton className=\"h-4 w-2/3\" />\n    </div>\n  );\n}\n\nfunction ErrorState({ message }: { message: string }) {\n  return (\n    <div className=\"flex flex-col items-center justify-center py-6 text-center\">\n      <div className=\"rounded-full bg-status-error-bg/10 p-2 mb-2\">\n        <AlertCircle className=\"size-5 text-status-error-text\" />\n      </div>\n      <p className=\"text-sm text-text-secondary\">{message}</p>\n    </div>\n  );\n}\n\nfunction UnavailableState() {\n  const { t } = useI18n();\n\n  return (\n    <div className=\"flex flex-col items-center justify-center py-6 text-center\">\n      <div className=\"rounded-full bg-bg-sunken p-2 mb-2\">\n        <WifiOff className=\"size-5 text-text-secondary\" />\n      </div>\n      <p className=\"text-sm text-text-secondary\">\n        {tWithFallback(t, 'widgetWrapper.serviceUnavailable', 'Service unavailable')}\n      </p>\n    </div>\n  );\n}\n\nexport function WidgetWrapper({\n  title,\n  icon,\n  size,\n  isLoading,\n  error,\n  unavailable,\n  headerAction,\n  children,\n  className = '',\n}: WidgetWrapperProps) {\n  const colSpan = getColSpan(size);\n\n  return (\n    <Card\n      className={`${colSpan} transition-all duration-200 hover:shadow-md border border-border-default bg-bg-surface ${className}`}\n    >\n      <CardHeader className=\"flex flex-row items-center justify-between pb-2 gap-y-0\">\n        <CardTitle className=\"text-sm font-semibold text-text-primary flex items-center gap-2\">\n          {icon}\n          {title}\n        </CardTitle>\n        {headerAction}\n      </CardHeader>\n      <CardContent className=\"pt-0\">\n        {isLoading ? (\n          <LoadingSkeleton />\n        ) : error ? (\n          <ErrorState message={error} />\n        ) : unavailable ? (\n          <UnavailableState />\n        ) : (\n          children\n        )}\n      </CardContent>\n    </Card>\n  );\n}\n"],"mappings":";;;;;;AA0BA,SAAS,EAAW,GAA0B;AAC5C,SAAQ,GAAR;EACE,KAAK,QACH,QAAO;EACT,KAAK,SACH,QAAO;EACT,KAAK,QACH,QAAO;EACT,QACE,QAAO;;;AAIb,SAAS,IAAkB;AACzB,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf;GACE,kBAAC,GAAD,EAAU,WAAU,aAAc,CAAA;GAClC,kBAAC,GAAD,EAAU,WAAU,aAAc,CAAA;GAClC,kBAAC,GAAD,EAAU,WAAU,eAAgB,CAAA;GACpC,kBAAC,GAAD,EAAU,WAAU,aAAc,CAAA;GAC9B;;;AAIV,SAAS,EAAW,EAAE,cAAgC;AACpD,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,GAAD,EAAa,WAAU,iCAAkC,CAAA;GACrD,CAAA,EACN,kBAAC,KAAD;GAAG,WAAU;aAA+B;GAAY,CAAA,CACpD;;;AAIV,SAAS,IAAmB;CAC1B,IAAM,EAAE,MAAM,GAAS;AAEvB,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,GAAD,EAAS,WAAU,8BAA+B,CAAA;GAC9C,CAAA,EACN,kBAAC,KAAD;GAAG,WAAU;aACV,EAAc,GAAG,oCAAoC,sBAAsB;GAC1E,CAAA,CACA;;;AAIV,SAAgB,EAAc,EAC5B,UACA,SACA,SACA,cACA,UACA,gBACA,iBACA,aACA,eAAY,MACS;AAGrB,QACE,kBAAC,GAAD;EACE,WAAW,GAJC,EAAW,EAAK,CAIN,0FAA0F;YADlH,CAGE,kBAAC,GAAD;GAAY,WAAU;aAAtB,CACE,kBAAC,GAAD;IAAW,WAAU;cAArB,CACG,GACA,EACS;OACX,EACU;MACb,kBAAC,GAAD;GAAa,WAAU;aACpB,IACC,kBAAC,GAAD,EAAmB,CAAA,GACjB,IACF,kBAAC,GAAD,EAAY,SAAS,GAAS,CAAA,GAC5B,IACF,kBAAC,GAAD,EAAoB,CAAA,GAEpB;GAEU,CAAA,CACT"}

package/dist/pages/dashboard/widgets/AgentsWidget.js

@@ -21,7 +21,7 @@ function l({ workspaceData: l, isLoading: u, navigate: d }) {
 		children: !f || p === 0 ? /* @__PURE__ */ s("div", {
 			className: "text-center py-3",
 			children: [/* @__PURE__ */ o("p", {
-				className: "text-sm text-muted-foreground mb-2",
+				className: "text-sm text-text-secondary mb-2",
 				children: "No agents connected"
 			}), /* @__PURE__ */ o(c, {
 				variant: "outline",
@@ -35,7 +35,7 @@ function l({ workspaceData: l, isLoading: u, navigate: d }) {
 				/* @__PURE__ */ s("p", {
 					className: "text-2xl font-semibold text-text-primary",
 					children: [p, /* @__PURE__ */ o("span", {
-						className: "ml-1 text-xs font-normal text-muted-foreground",
+						className: "ml-1 text-xs font-normal text-text-secondary",
 						children: "total"
 					})]
 				}),
@@ -51,7 +51,7 @@ function l({ workspaceData: l, isLoading: u, navigate: d }) {
 									children: f.online
 								}),
 								/* @__PURE__ */ o("p", {
-									className: "text-[10px] text-muted-foreground",
+									className: "text-[10px] text-text-secondary",
 									children: "online"
 								})
 							]
@@ -65,7 +65,7 @@ function l({ workspaceData: l, isLoading: u, navigate: d }) {
 									children: f.degraded
 								}),
 								/* @__PURE__ */ o("p", {
-									className: "text-[10px] text-muted-foreground",
+									className: "text-[10px] text-text-secondary",
 									children: "degraded"
 								})
 							]
@@ -79,7 +79,7 @@ function l({ workspaceData: l, isLoading: u, navigate: d }) {
 									children: f.offline
 								}),
 								/* @__PURE__ */ o("p", {
-									className: "text-[10px] text-muted-foreground",
+									className: "text-[10px] text-text-secondary",
 									children: "offline"
 								})
 							]
@@ -87,7 +87,7 @@ function l({ workspaceData: l, isLoading: u, navigate: d }) {
 					]
 				}),
 				f.lastSeenAt ? /* @__PURE__ */ s("p", {
-					className: "text-[11px] text-muted-foreground text-center",
+					className: "text-[11px] text-text-secondary text-center",
 					children: [
 						"Last seen",
 						" ",

package/dist/pages/dashboard/widgets/AgentsWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"AgentsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/AgentsWidget.tsx"],"sourcesContent":["import { Bot, ArrowRight, Wifi, WifiOff, AlertTriangle } from 'lucide-react';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nexport function AgentsWidget({ workspaceData, isLoading, navigate }: WidgetProps) {\n  const fleet = workspaceData?.agentFleet ?? null;\n  const total = fleet?.total ?? 0;\n\n  return (\n    <WidgetWrapper\n      title=\"Agent Fleet\"\n      icon={<Bot className=\"size-4\" />}\n      size=\"small\"\n      isLoading={isLoading}\n      unavailable={!workspaceData}\n      headerAction={\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          className=\"text-xs\"\n          onClick={() => navigate('/vibecontrols/agents')}\n        >\n          Open <ArrowRight className=\"ml-1 size-3\" />\n        </Button>\n      }\n    >\n      {!fleet || total === 0 ? (\n        <div className=\"text-center py-3\">\n          <p className=\"text-sm text-muted-foreground mb-2\">No agents connected</p>\n          <Button variant=\"outline\" size=\"sm\" onClick={() => navigate('/vibecontrols/agents/new')}>\n            Connect agent\n          </Button>\n        </div>\n      ) : (\n        <div className=\"space-y-3\">\n          <p className=\"text-2xl font-semibold text-text-primary\">\n            {total}\n            <span className=\"ml-1 text-xs font-normal text-muted-foreground\">total</span>\n          </p>\n          <div className=\"grid grid-cols-3 gap-2 text-center\">\n            <div className=\"rounded-md bg-status-success-bg/30 p-2\">\n              <Wifi className=\"mx-auto size-4 text-status-success-text\" />\n              <p className=\"mt-1 text-sm font-semibold text-text-primary\">{fleet.online}</p>\n              <p className=\"text-[10px] text-muted-foreground\">online</p>\n            </div>\n            <div className=\"rounded-md bg-status-warning-bg/30 p-2\">\n              <AlertTriangle className=\"mx-auto size-4 text-status-warning-text\" />\n              <p className=\"mt-1 text-sm font-semibold text-text-primary\">{fleet.degraded}</p>\n              <p className=\"text-[10px] text-muted-foreground\">degraded</p>\n            </div>\n            <div className=\"rounded-md bg-text-tertiary/10 p-2\">\n              <WifiOff className=\"mx-auto size-4 text-text-tertiary\" />\n              <p className=\"mt-1 text-sm font-semibold text-text-primary\">{fleet.offline}</p>\n              <p className=\"text-[10px] text-muted-foreground\">offline</p>\n            </div>\n          </div>\n          {fleet.lastSeenAt ? (\n            <p className=\"text-[11px] text-muted-foreground text-center\">\n              Last seen{' '}\n              {new Date(fleet.lastSeenAt).toLocaleString(undefined, {\n                hour: '2-digit',\n                minute: '2-digit',\n                month: 'short',\n                day: 'numeric',\n              })}\n            </p>\n          ) : null}\n        </div>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAgB,EAAa,EAAE,kBAAe,cAAW,eAAyB;CAChF,IAAM,IAAQ,GAAe,cAAc,MACrC,IAAQ,GAAO,SAAS;AAE9B,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAK,WAAU,UAAW,CAAA;EAChC,MAAK;EACM;EACX,aAAa,CAAC;EACd,cACE,kBAAC,GAAD;GACE,SAAQ;GACR,MAAK;GACL,WAAU;GACV,eAAe,EAAS,uBAAuB;aAJjD,CAKC,SACM,kBAAC,GAAD,EAAY,WAAU,eAAgB,CAAA,CACpC;;YAGV,CAAC,KAAS,MAAU,IACnB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,KAAD;IAAG,WAAU;cAAqC;IAAuB,CAAA,EACzE,kBAAC,GAAD;IAAQ,SAAQ;IAAU,MAAK;IAAK,eAAe,EAAS,2BAA2B;cAAE;IAEhF,CAAA,CACL;OAEN,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,KAAD;KAAG,WAAU;eAAb,CACG,GACD,kBAAC,QAAD;MAAM,WAAU;gBAAiD;MAAY,CAAA,CAC3E;;IACJ,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,kBAAC,GAAD,EAAM,WAAU,2CAA4C,CAAA;QAC5D,kBAAC,KAAD;SAAG,WAAU;mBAAgD,EAAM;SAAW,CAAA;QAC9E,kBAAC,KAAD;SAAG,WAAU;mBAAoC;SAAU,CAAA;QACvD;;MACN,kBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,kBAAC,GAAD,EAAe,WAAU,2CAA4C,CAAA;QACrE,kBAAC,KAAD;SAAG,WAAU;mBAAgD,EAAM;SAAa,CAAA;QAChF,kBAAC,KAAD;SAAG,WAAU;mBAAoC;SAAY,CAAA;QACzD;;MACN,kBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,kBAAC,GAAD,EAAS,WAAU,qCAAsC,CAAA;QACzD,kBAAC,KAAD;SAAG,WAAU;mBAAgD,EAAM;SAAY,CAAA;QAC/E,kBAAC,KAAD;SAAG,WAAU;mBAAoC;SAAW,CAAA;QACxD;;MACF;;IACL,EAAM,aACL,kBAAC,KAAD;KAAG,WAAU;eAAb;MAA6D;MACjD;MACT,IAAI,KAAK,EAAM,WAAW,CAAC,eAAe,KAAA,GAAW;OACpD,MAAM;OACN,QAAQ;OACR,OAAO;OACP,KAAK;OACN,CAAC;MACA;SACF;IACA;;EAEM,CAAA"}
+{"version":3,"file":"AgentsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/AgentsWidget.tsx"],"sourcesContent":["import { Bot, ArrowRight, Wifi, WifiOff, AlertTriangle } from 'lucide-react';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nexport function AgentsWidget({ workspaceData, isLoading, navigate }: WidgetProps) {\n  const fleet = workspaceData?.agentFleet ?? null;\n  const total = fleet?.total ?? 0;\n\n  return (\n    <WidgetWrapper\n      title=\"Agent Fleet\"\n      icon={<Bot className=\"size-4\" />}\n      size=\"small\"\n      isLoading={isLoading}\n      unavailable={!workspaceData}\n      headerAction={\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          className=\"text-xs\"\n          onClick={() => navigate('/vibecontrols/agents')}\n        >\n          Open <ArrowRight className=\"ml-1 size-3\" />\n        </Button>\n      }\n    >\n      {!fleet || total === 0 ? (\n        <div className=\"text-center py-3\">\n          <p className=\"text-sm text-text-secondary mb-2\">No agents connected</p>\n          <Button variant=\"outline\" size=\"sm\" onClick={() => navigate('/vibecontrols/agents/new')}>\n            Connect agent\n          </Button>\n        </div>\n      ) : (\n        <div className=\"space-y-3\">\n          <p className=\"text-2xl font-semibold text-text-primary\">\n            {total}\n            <span className=\"ml-1 text-xs font-normal text-text-secondary\">total</span>\n          </p>\n          <div className=\"grid grid-cols-3 gap-2 text-center\">\n            <div className=\"rounded-md bg-status-success-bg/30 p-2\">\n              <Wifi className=\"mx-auto size-4 text-status-success-text\" />\n              <p className=\"mt-1 text-sm font-semibold text-text-primary\">{fleet.online}</p>\n              <p className=\"text-[10px] text-text-secondary\">online</p>\n            </div>\n            <div className=\"rounded-md bg-status-warning-bg/30 p-2\">\n              <AlertTriangle className=\"mx-auto size-4 text-status-warning-text\" />\n              <p className=\"mt-1 text-sm font-semibold text-text-primary\">{fleet.degraded}</p>\n              <p className=\"text-[10px] text-text-secondary\">degraded</p>\n            </div>\n            <div className=\"rounded-md bg-text-tertiary/10 p-2\">\n              <WifiOff className=\"mx-auto size-4 text-text-tertiary\" />\n              <p className=\"mt-1 text-sm font-semibold text-text-primary\">{fleet.offline}</p>\n              <p className=\"text-[10px] text-text-secondary\">offline</p>\n            </div>\n          </div>\n          {fleet.lastSeenAt ? (\n            <p className=\"text-[11px] text-text-secondary text-center\">\n              Last seen{' '}\n              {new Date(fleet.lastSeenAt).toLocaleString(undefined, {\n                hour: '2-digit',\n                minute: '2-digit',\n                month: 'short',\n                day: 'numeric',\n              })}\n            </p>\n          ) : null}\n        </div>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAgB,EAAa,EAAE,kBAAe,cAAW,eAAyB;CAChF,IAAM,IAAQ,GAAe,cAAc,MACrC,IAAQ,GAAO,SAAS;AAE9B,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAK,WAAU,UAAW,CAAA;EAChC,MAAK;EACM;EACX,aAAa,CAAC;EACd,cACE,kBAAC,GAAD;GACE,SAAQ;GACR,MAAK;GACL,WAAU;GACV,eAAe,EAAS,uBAAuB;aAJjD,CAKC,SACM,kBAAC,GAAD,EAAY,WAAU,eAAgB,CAAA,CACpC;;YAGV,CAAC,KAAS,MAAU,IACnB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,KAAD;IAAG,WAAU;cAAmC;IAAuB,CAAA,EACvE,kBAAC,GAAD;IAAQ,SAAQ;IAAU,MAAK;IAAK,eAAe,EAAS,2BAA2B;cAAE;IAEhF,CAAA,CACL;OAEN,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,KAAD;KAAG,WAAU;eAAb,CACG,GACD,kBAAC,QAAD;MAAM,WAAU;gBAA+C;MAAY,CAAA,CACzE;;IACJ,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,kBAAC,GAAD,EAAM,WAAU,2CAA4C,CAAA;QAC5D,kBAAC,KAAD;SAAG,WAAU;mBAAgD,EAAM;SAAW,CAAA;QAC9E,kBAAC,KAAD;SAAG,WAAU;mBAAkC;SAAU,CAAA;QACrD;;MACN,kBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,kBAAC,GAAD,EAAe,WAAU,2CAA4C,CAAA;QACrE,kBAAC,KAAD;SAAG,WAAU;mBAAgD,EAAM;SAAa,CAAA;QAChF,kBAAC,KAAD;SAAG,WAAU;mBAAkC;SAAY,CAAA;QACvD;;MACN,kBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,kBAAC,GAAD,EAAS,WAAU,qCAAsC,CAAA;QACzD,kBAAC,KAAD;SAAG,WAAU;mBAAgD,EAAM;SAAY,CAAA;QAC/E,kBAAC,KAAD;SAAG,WAAU;mBAAkC;SAAW,CAAA;QACtD;;MACF;;IACL,EAAM,aACL,kBAAC,KAAD;KAAG,WAAU;eAAb;MAA2D;MAC/C;MACT,IAAI,KAAK,EAAM,WAAW,CAAC,eAAe,KAAA,GAAW;OACpD,MAAM;OACN,QAAQ;OACR,OAAO;OACP,KAAK;OACN,CAAC;MACA;SACF;IACA;;EAEM,CAAA"}

package/dist/pages/dashboard/widgets/GroupsWidget.js

@@ -21,7 +21,7 @@ function o({ workspaceData: o, isLoading: s, navigate: c }) {
 		children: l.length === 0 ? /* @__PURE__ */ r("div", {
 			className: "text-center py-3",
 			children: /* @__PURE__ */ r("p", {
-				className: "text-xs text-muted-foreground",
+				className: "text-xs text-text-secondary",
 				children: "No groups yet"
 			})
 		}) : /* @__PURE__ */ i("div", {
@@ -39,12 +39,12 @@ function o({ workspaceData: o, isLoading: s, navigate: c }) {
 						className: "text-sm font-medium text-text-primary truncate",
 						children: e.name
 					}), e.description && /* @__PURE__ */ r("p", {
-						className: "text-[11px] text-muted-foreground truncate",
+						className: "text-[11px] text-text-secondary truncate",
 						children: e.description
 					})]
 				})]
 			}, e.id)), u > 4 && /* @__PURE__ */ i("p", {
-				className: "text-[11px] text-muted-foreground text-center",
+				className: "text-[11px] text-text-secondary text-center",
 				children: [
 					"+",
 					u - 4,

package/dist/pages/dashboard/widgets/GroupsWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/GroupsWidget.tsx"],"sourcesContent":["import { Users, ArrowRight } from 'lucide-react';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nexport function GroupsWidget({ workspaceData, isLoading, navigate }: WidgetProps) {\n  const groups = workspaceData?.groups.items ?? [];\n  const total = workspaceData?.groups.totalCount ?? 0;\n\n  return (\n    <WidgetWrapper\n      title=\"Groups\"\n      icon={<Users className=\"size-4\" />}\n      size=\"small\"\n      isLoading={isLoading}\n      unavailable={!workspaceData}\n      headerAction={\n        <Button variant=\"ghost\" size=\"sm\" className=\"text-xs\" onClick={() => navigate('/groups')}>\n          <ArrowRight className=\"size-3\" />\n        </Button>\n      }\n    >\n      {groups.length === 0 ? (\n        <div className=\"text-center py-3\">\n          <p className=\"text-xs text-muted-foreground\">No groups yet</p>\n        </div>\n      ) : (\n        <div className=\"space-y-1.5\">\n          {groups.slice(0, 4).map((group) => (\n            <button\n              key={group.id}\n              type=\"button\"\n              className=\"w-full flex items-center gap-2 p-1.5 rounded hover:bg-accent/5 cursor-pointer transition-colors text-left\"\n              onClick={() => navigate('/groups')}\n            >\n              <div className=\"size-7 rounded-full bg-accent-purple-subtle text-accent-purple flex items-center justify-center text-xs font-bold shrink-0\">\n                {group.name.charAt(0).toUpperCase()}\n              </div>\n              <div className=\"min-w-0\">\n                <p className=\"text-sm font-medium text-text-primary truncate\">{group.name}</p>\n                {group.description && (\n                  <p className=\"text-[11px] text-muted-foreground truncate\">{group.description}</p>\n                )}\n              </div>\n            </button>\n          ))}\n          {total > 4 && (\n            <p className=\"text-[11px] text-muted-foreground text-center\">\n              +{total - 4} more groups\n            </p>\n          )}\n        </div>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAgB,EAAa,EAAE,kBAAe,cAAW,eAAyB;CAChF,IAAM,IAAS,GAAe,OAAO,SAAS,EAAE,EAC1C,IAAQ,GAAe,OAAO,cAAc;AAElD,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAO,WAAU,UAAW,CAAA;EAClC,MAAK;EACM;EACX,aAAa,CAAC;EACd,cACE,kBAAC,GAAD;GAAQ,SAAQ;GAAQ,MAAK;GAAK,WAAU;GAAU,eAAe,EAAS,UAAU;aACtF,kBAAC,GAAD,EAAY,WAAU,UAAW,CAAA;GAC1B,CAAA;YAGV,EAAO,WAAW,IACjB,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,KAAD;IAAG,WAAU;cAAgC;IAAiB,CAAA;GAC1D,CAAA,GAEN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACG,EAAO,MAAM,GAAG,EAAE,CAAC,KAAK,MACvB,kBAAC,UAAD;IAEE,MAAK;IACL,WAAU;IACV,eAAe,EAAS,UAAU;cAJpC,CAME,kBAAC,OAAD;KAAK,WAAU;eACZ,EAAM,KAAK,OAAO,EAAE,CAAC,aAAa;KAC/B,CAAA,EACN,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,KAAD;MAAG,WAAU;gBAAkD,EAAM;MAAS,CAAA,EAC7E,EAAM,eACL,kBAAC,KAAD;MAAG,WAAU;gBAA8C,EAAM;MAAgB,CAAA,CAE/E;OACC;MAdF,EAAM,GAcJ,CACT,EACD,IAAQ,KACP,kBAAC,KAAD;IAAG,WAAU;cAAb;KAA6D;KACzD,IAAQ;KAAE;KACV;MAEF;;EAEM,CAAA"}
+{"version":3,"file":"GroupsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/GroupsWidget.tsx"],"sourcesContent":["import { Users, ArrowRight } from 'lucide-react';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nexport function GroupsWidget({ workspaceData, isLoading, navigate }: WidgetProps) {\n  const groups = workspaceData?.groups.items ?? [];\n  const total = workspaceData?.groups.totalCount ?? 0;\n\n  return (\n    <WidgetWrapper\n      title=\"Groups\"\n      icon={<Users className=\"size-4\" />}\n      size=\"small\"\n      isLoading={isLoading}\n      unavailable={!workspaceData}\n      headerAction={\n        <Button variant=\"ghost\" size=\"sm\" className=\"text-xs\" onClick={() => navigate('/groups')}>\n          <ArrowRight className=\"size-3\" />\n        </Button>\n      }\n    >\n      {groups.length === 0 ? (\n        <div className=\"text-center py-3\">\n          <p className=\"text-xs text-text-secondary\">No groups yet</p>\n        </div>\n      ) : (\n        <div className=\"space-y-1.5\">\n          {groups.slice(0, 4).map((group) => (\n            <button\n              key={group.id}\n              type=\"button\"\n              className=\"w-full flex items-center gap-2 p-1.5 rounded hover:bg-accent/5 cursor-pointer transition-colors text-left\"\n              onClick={() => navigate('/groups')}\n            >\n              <div className=\"size-7 rounded-full bg-accent-purple-subtle text-accent-purple flex items-center justify-center text-xs font-bold shrink-0\">\n                {group.name.charAt(0).toUpperCase()}\n              </div>\n              <div className=\"min-w-0\">\n                <p className=\"text-sm font-medium text-text-primary truncate\">{group.name}</p>\n                {group.description && (\n                  <p className=\"text-[11px] text-text-secondary truncate\">{group.description}</p>\n                )}\n              </div>\n            </button>\n          ))}\n          {total > 4 && (\n            <p className=\"text-[11px] text-text-secondary text-center\">\n              +{total - 4} more groups\n            </p>\n          )}\n        </div>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAgB,EAAa,EAAE,kBAAe,cAAW,eAAyB;CAChF,IAAM,IAAS,GAAe,OAAO,SAAS,EAAE,EAC1C,IAAQ,GAAe,OAAO,cAAc;AAElD,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAO,WAAU,UAAW,CAAA;EAClC,MAAK;EACM;EACX,aAAa,CAAC;EACd,cACE,kBAAC,GAAD;GAAQ,SAAQ;GAAQ,MAAK;GAAK,WAAU;GAAU,eAAe,EAAS,UAAU;aACtF,kBAAC,GAAD,EAAY,WAAU,UAAW,CAAA;GAC1B,CAAA;YAGV,EAAO,WAAW,IACjB,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,KAAD;IAAG,WAAU;cAA8B;IAAiB,CAAA;GACxD,CAAA,GAEN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACG,EAAO,MAAM,GAAG,EAAE,CAAC,KAAK,MACvB,kBAAC,UAAD;IAEE,MAAK;IACL,WAAU;IACV,eAAe,EAAS,UAAU;cAJpC,CAME,kBAAC,OAAD;KAAK,WAAU;eACZ,EAAM,KAAK,OAAO,EAAE,CAAC,aAAa;KAC/B,CAAA,EACN,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,KAAD;MAAG,WAAU;gBAAkD,EAAM;MAAS,CAAA,EAC7E,EAAM,eACL,kBAAC,KAAD;MAAG,WAAU;gBAA4C,EAAM;MAAgB,CAAA,CAE7E;OACC;MAdF,EAAM,GAcJ,CACT,EACD,IAAQ,KACP,kBAAC,KAAD;IAAG,WAAU;cAAb;KAA2D;KACvD,IAAQ;KAAE;KACV;MAEF;;EAEM,CAAA"}

package/dist/pages/dashboard/widgets/MembersWidget.js

@@ -27,7 +27,7 @@ function s({ workspaceData: s, globalData: c, isLoading: l, navigate: u }) {
 						className: "text-3xl font-bold text-text-primary",
 						children: f
 					}), /* @__PURE__ */ a("p", {
-						className: "text-xs text-muted-foreground",
+						className: "text-xs text-text-secondary",
 						children: [
 							f === 1 ? "Member" : "Members",
 							" across ",
@@ -47,11 +47,11 @@ function s({ workspaceData: s, globalData: c, isLoading: l, navigate: u }) {
 				d.length > 0 && /* @__PURE__ */ a("div", {
 					className: "flex -space-x-2 justify-center",
 					children: [d.slice(0, 5).map((e) => /* @__PURE__ */ i("div", {
-						className: "size-8 rounded-full bg-primary/10 text-primary flex items-center justify-center text-xs font-bold border-2 border-bg-surface",
+						className: "size-8 rounded-full bg-action-primary-bg/10 text-primary flex items-center justify-center text-xs font-bold border-2 border-bg-surface",
 						title: e.name,
 						children: e.name.charAt(0).toUpperCase()
 					}, e.id)), p > 5 && /* @__PURE__ */ a("div", {
-						className: "size-8 rounded-full bg-muted text-muted-foreground flex items-center justify-center text-xs font-bold border-2 border-bg-surface",
+						className: "size-8 rounded-full bg-bg-sunken text-text-secondary flex items-center justify-center text-xs font-bold border-2 border-bg-surface",
 						children: ["+", p - 5]
 					})]
 				})

package/dist/pages/dashboard/widgets/MembersWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"MembersWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/MembersWidget.tsx"],"sourcesContent":["import { Users, UserPlus, ArrowRight } from 'lucide-react';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nexport function MembersWidget({ workspaceData, globalData, isLoading, navigate }: WidgetProps) {\n  // Member count comes from globalData.workspaces (each workspace has memberCount)\n  const workspaces = globalData?.workspaces?.items ?? workspaceData?.workspaces.items ?? [];\n  const totalMembers = workspaces.reduce(\n    (sum, ws) => sum + ((ws as { memberCount?: number }).memberCount ?? 0),\n    0\n  );\n  const totalWorkspaces = globalData?.workspaces?.total ?? workspaceData?.workspaces.total ?? 0;\n\n  return (\n    <WidgetWrapper\n      title=\"Members\"\n      icon={<Users className=\"size-4\" />}\n      size=\"small\"\n      isLoading={isLoading}\n      unavailable={!workspaceData && !globalData}\n      headerAction={\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          className=\"text-xs\"\n          onClick={() => navigate('/workspaces/members')}\n        >\n          <ArrowRight className=\"size-3\" />\n        </Button>\n      }\n    >\n      <div className=\"space-y-3\">\n        <div className=\"text-center\">\n          <p className=\"text-3xl font-bold text-text-primary\">{totalMembers}</p>\n          <p className=\"text-xs text-muted-foreground\">\n            {totalMembers === 1 ? 'Member' : 'Members'} across {totalWorkspaces}{' '}\n            {totalWorkspaces === 1 ? 'workspace' : 'workspaces'}\n          </p>\n        </div>\n        <Button\n          variant=\"outline\"\n          size=\"sm\"\n          className=\"w-full text-xs\"\n          onClick={() => navigate('/workspaces/members?invite=true')}\n        >\n          <UserPlus className=\"size-3 mr-1.5\" />\n          Invite a member\n        </Button>\n        {workspaces.length > 0 && (\n          <div className=\"flex -space-x-2 justify-center\">\n            {workspaces.slice(0, 5).map((ws) => (\n              <div\n                key={ws.id}\n                className=\"size-8 rounded-full bg-primary/10 text-primary flex items-center justify-center text-xs font-bold border-2 border-bg-surface\"\n                title={ws.name}\n              >\n                {ws.name.charAt(0).toUpperCase()}\n              </div>\n            ))}\n            {totalWorkspaces > 5 && (\n              <div className=\"size-8 rounded-full bg-muted text-muted-foreground flex items-center justify-center text-xs font-bold border-2 border-bg-surface\">\n                +{totalWorkspaces - 5}\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAgB,EAAc,EAAE,kBAAe,eAAY,cAAW,eAAyB;CAE7F,IAAM,IAAa,GAAY,YAAY,SAAS,GAAe,WAAW,SAAS,EAAE,EACnF,IAAe,EAAW,QAC7B,GAAK,MAAO,KAAQ,EAAgC,eAAe,IACpE,EACD,EACK,IAAkB,GAAY,YAAY,SAAS,GAAe,WAAW,SAAS;AAE5F,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAO,WAAU,UAAW,CAAA;EAClC,MAAK;EACM;EACX,aAAa,CAAC,KAAiB,CAAC;EAChC,cACE,kBAAC,GAAD;GACE,SAAQ;GACR,MAAK;GACL,WAAU;GACV,eAAe,EAAS,sBAAsB;aAE9C,kBAAC,GAAD,EAAY,WAAU,UAAW,CAAA;GAC1B,CAAA;YAGX,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,KAAD;MAAG,WAAU;gBAAwC;MAAiB,CAAA,EACtE,kBAAC,KAAD;MAAG,WAAU;gBAAb;OACG,MAAiB,IAAI,WAAW;OAAU;OAAS;OAAiB;OACpE,MAAoB,IAAI,cAAc;OACrC;QACA;;IACN,kBAAC,GAAD;KACE,SAAQ;KACR,MAAK;KACL,WAAU;KACV,eAAe,EAAS,kCAAkC;eAJ5D,CAME,kBAAC,GAAD,EAAU,WAAU,iBAAkB,CAAA,EAAA,kBAE/B;;IACR,EAAW,SAAS,KACnB,kBAAC,OAAD;KAAK,WAAU;eAAf,CACG,EAAW,MAAM,GAAG,EAAE,CAAC,KAAK,MAC3B,kBAAC,OAAD;MAEE,WAAU;MACV,OAAO,EAAG;gBAET,EAAG,KAAK,OAAO,EAAE,CAAC,aAAa;MAC5B,EALC,EAAG,GAKJ,CACN,EACD,IAAkB,KACjB,kBAAC,OAAD;MAAK,WAAU;gBAAf,CAAkJ,KAC9I,IAAkB,EAChB;QAEJ;;IAEJ;;EACQ,CAAA"}
+{"version":3,"file":"MembersWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/MembersWidget.tsx"],"sourcesContent":["import { Users, UserPlus, ArrowRight } from 'lucide-react';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nexport function MembersWidget({ workspaceData, globalData, isLoading, navigate }: WidgetProps) {\n  // Member count comes from globalData.workspaces (each workspace has memberCount)\n  const workspaces = globalData?.workspaces?.items ?? workspaceData?.workspaces.items ?? [];\n  const totalMembers = workspaces.reduce(\n    (sum, ws) => sum + ((ws as { memberCount?: number }).memberCount ?? 0),\n    0\n  );\n  const totalWorkspaces = globalData?.workspaces?.total ?? workspaceData?.workspaces.total ?? 0;\n\n  return (\n    <WidgetWrapper\n      title=\"Members\"\n      icon={<Users className=\"size-4\" />}\n      size=\"small\"\n      isLoading={isLoading}\n      unavailable={!workspaceData && !globalData}\n      headerAction={\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          className=\"text-xs\"\n          onClick={() => navigate('/workspaces/members')}\n        >\n          <ArrowRight className=\"size-3\" />\n        </Button>\n      }\n    >\n      <div className=\"space-y-3\">\n        <div className=\"text-center\">\n          <p className=\"text-3xl font-bold text-text-primary\">{totalMembers}</p>\n          <p className=\"text-xs text-text-secondary\">\n            {totalMembers === 1 ? 'Member' : 'Members'} across {totalWorkspaces}{' '}\n            {totalWorkspaces === 1 ? 'workspace' : 'workspaces'}\n          </p>\n        </div>\n        <Button\n          variant=\"outline\"\n          size=\"sm\"\n          className=\"w-full text-xs\"\n          onClick={() => navigate('/workspaces/members?invite=true')}\n        >\n          <UserPlus className=\"size-3 mr-1.5\" />\n          Invite a member\n        </Button>\n        {workspaces.length > 0 && (\n          <div className=\"flex -space-x-2 justify-center\">\n            {workspaces.slice(0, 5).map((ws) => (\n              <div\n                key={ws.id}\n                className=\"size-8 rounded-full bg-action-primary-bg/10 text-primary flex items-center justify-center text-xs font-bold border-2 border-bg-surface\"\n                title={ws.name}\n              >\n                {ws.name.charAt(0).toUpperCase()}\n              </div>\n            ))}\n            {totalWorkspaces > 5 && (\n              <div className=\"size-8 rounded-full bg-bg-sunken text-text-secondary flex items-center justify-center text-xs font-bold border-2 border-bg-surface\">\n                +{totalWorkspaces - 5}\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAgB,EAAc,EAAE,kBAAe,eAAY,cAAW,eAAyB;CAE7F,IAAM,IAAa,GAAY,YAAY,SAAS,GAAe,WAAW,SAAS,EAAE,EACnF,IAAe,EAAW,QAC7B,GAAK,MAAO,KAAQ,EAAgC,eAAe,IACpE,EACD,EACK,IAAkB,GAAY,YAAY,SAAS,GAAe,WAAW,SAAS;AAE5F,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAO,WAAU,UAAW,CAAA;EAClC,MAAK;EACM;EACX,aAAa,CAAC,KAAiB,CAAC;EAChC,cACE,kBAAC,GAAD;GACE,SAAQ;GACR,MAAK;GACL,WAAU;GACV,eAAe,EAAS,sBAAsB;aAE9C,kBAAC,GAAD,EAAY,WAAU,UAAW,CAAA;GAC1B,CAAA;YAGX,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,KAAD;MAAG,WAAU;gBAAwC;MAAiB,CAAA,EACtE,kBAAC,KAAD;MAAG,WAAU;gBAAb;OACG,MAAiB,IAAI,WAAW;OAAU;OAAS;OAAiB;OACpE,MAAoB,IAAI,cAAc;OACrC;QACA;;IACN,kBAAC,GAAD;KACE,SAAQ;KACR,MAAK;KACL,WAAU;KACV,eAAe,EAAS,kCAAkC;eAJ5D,CAME,kBAAC,GAAD,EAAU,WAAU,iBAAkB,CAAA,EAAA,kBAE/B;;IACR,EAAW,SAAS,KACnB,kBAAC,OAAD;KAAK,WAAU;eAAf,CACG,EAAW,MAAM,GAAG,EAAE,CAAC,KAAK,MAC3B,kBAAC,OAAD;MAEE,WAAU;MACV,OAAO,EAAG;gBAET,EAAG,KAAK,OAAO,EAAE,CAAC,aAAa;MAC5B,EALC,EAAG,GAKJ,CACN,EACD,IAAkB,KACjB,kBAAC,OAAD;MAAK,WAAU;gBAAf,CAAoJ,KAChJ,IAAkB,EAChB;QAEJ;;IAEJ;;EACQ,CAAA"}

package/dist/pages/dashboard/widgets/ProjectsWidget.js

@@ -30,7 +30,7 @@ function u({ workspaceData: u, isLoading: d, navigate: f }) {
 		children: p.length === 0 ? /* @__PURE__ */ a("div", {
 			className: "text-center py-4",
 			children: [/* @__PURE__ */ i("p", {
-				className: "text-sm text-muted-foreground mb-2",
+				className: "text-sm text-text-secondary mb-2",
 				children: "No projects yet"
 			}), /* @__PURE__ */ i(s, {
 				variant: "outline",
@@ -41,7 +41,7 @@ function u({ workspaceData: u, isLoading: d, navigate: f }) {
 		}) : /* @__PURE__ */ a("div", {
 			className: "space-y-3",
 			children: [m > 0 && /* @__PURE__ */ a("div", {
-				className: "flex items-center gap-3 text-xs text-muted-foreground",
+				className: "flex items-center gap-3 text-xs text-text-secondary",
 				children: [
 					/* @__PURE__ */ a("span", {
 						className: "flex items-center gap-1",

package/dist/pages/dashboard/widgets/ProjectsWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProjectsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/ProjectsWidget.tsx"],"sourcesContent":["import { FolderKanban, ArrowRight, Circle } from 'lucide-react';\nimport { Badge, Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nconst statusColors: Record<string, string> = {\n  ACTIVE: 'bg-status-success-bg',\n  INACTIVE: 'bg-text-tertiary',\n  ARCHIVED: 'bg-status-warning-bg',\n};\n\nconst statusVariant: Record<string, 'default' | 'secondary' | 'outline'> = {\n  ACTIVE: 'default',\n  INACTIVE: 'secondary',\n  ARCHIVED: 'outline',\n};\n\nexport function ProjectsWidget({ workspaceData, isLoading, navigate }: WidgetProps) {\n  const projects = workspaceData?.projects.items ?? [];\n  const total = workspaceData?.projects.total ?? 0;\n\n  // Status breakdown\n  const activeCount = projects.filter((p) => p.status === 'ACTIVE').length;\n  const inactiveCount = projects.filter((p) => p.status === 'INACTIVE').length;\n\n  return (\n    <WidgetWrapper\n      title=\"Projects\"\n      icon={<FolderKanban className=\"size-4\" />}\n      size=\"medium\"\n      isLoading={isLoading}\n      unavailable={!workspaceData}\n      headerAction={\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          className=\"text-xs\"\n          onClick={() => navigate('/workspaces/projects')}\n        >\n          View all <ArrowRight className=\"ml-1 size-3\" />\n        </Button>\n      }\n    >\n      {projects.length === 0 ? (\n        <div className=\"text-center py-4\">\n          <p className=\"text-sm text-muted-foreground mb-2\">No projects yet</p>\n          <Button variant=\"outline\" size=\"sm\" onClick={() => navigate('/workspaces/projects')}>\n            Create a project\n          </Button>\n        </div>\n      ) : (\n        <div className=\"space-y-3\">\n          {total > 0 && (\n            <div className=\"flex items-center gap-3 text-xs text-muted-foreground\">\n              <span className=\"flex items-center gap-1\">\n                <Circle className=\"size-2 fill-status-success-bg text-status-success-bg\" />\n                {activeCount} active\n              </span>\n              {inactiveCount > 0 && (\n                <span className=\"flex items-center gap-1\">\n                  <Circle className=\"size-2 fill-text-tertiary text-text-tertiary\" />\n                  {inactiveCount} inactive\n                </span>\n              )}\n              <span className=\"ml-auto font-medium\">{total} total</span>\n            </div>\n          )}\n          <div className=\"space-y-2\">\n            {projects.slice(0, 4).map((proj) => (\n              <button\n                key={proj.id}\n                type=\"button\"\n                className=\"w-full flex items-center justify-between p-2 rounded-md hover:bg-accent/5 cursor-pointer transition-colors text-left\"\n                onClick={() => navigate(`/workspaces/${proj.workspaceId}/projects`)}\n              >\n                <div className=\"flex items-center gap-2 min-w-0\">\n                  <Circle\n                    className={`size-2 ${statusColors[proj.status] || 'bg-text-tertiary'} fill-current`}\n                  />\n                  <span className=\"text-sm font-medium text-text-primary truncate\">\n                    {proj.name}\n                  </span>\n                </div>\n                <Badge\n                  variant={statusVariant[proj.status] || 'outline'}\n                  className=\"text-[10px] shrink-0\"\n                >\n                  {proj.key}\n                </Badge>\n              </button>\n            ))}\n          </div>\n        </div>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,IAAM,IAAuC;CAC3C,QAAQ;CACR,UAAU;CACV,UAAU;CACX,EAEK,IAAqE;CACzE,QAAQ;CACR,UAAU;CACV,UAAU;CACX;AAED,SAAgB,EAAe,EAAE,kBAAe,cAAW,eAAyB;CAClF,IAAM,IAAW,GAAe,SAAS,SAAS,EAAE,EAC9C,IAAQ,GAAe,SAAS,SAAS,GAGzC,IAAc,EAAS,QAAQ,MAAM,EAAE,WAAW,SAAS,CAAC,QAC5D,IAAgB,EAAS,QAAQ,MAAM,EAAE,WAAW,WAAW,CAAC;AAEtE,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAc,WAAU,UAAW,CAAA;EACzC,MAAK;EACM;EACX,aAAa,CAAC;EACd,cACE,kBAAC,GAAD;GACE,SAAQ;GACR,MAAK;GACL,WAAU;GACV,eAAe,EAAS,uBAAuB;aAJjD,CAKC,aACU,kBAAC,GAAD,EAAY,WAAU,eAAgB,CAAA,CACxC;;YAGV,EAAS,WAAW,IACnB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,KAAD;IAAG,WAAU;cAAqC;IAAmB,CAAA,EACrE,kBAAC,GAAD;IAAQ,SAAQ;IAAU,MAAK;IAAK,eAAe,EAAS,uBAAuB;cAAE;IAE5E,CAAA,CACL;OAEN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACG,IAAQ,KACP,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,QAAD;MAAM,WAAU;gBAAhB;OACE,kBAAC,GAAD,EAAQ,WAAU,wDAAyD,CAAA;OAC1E;OAAY;OACR;;KACN,IAAgB,KACf,kBAAC,QAAD;MAAM,WAAU;gBAAhB;OACE,kBAAC,GAAD,EAAQ,WAAU,gDAAiD,CAAA;OAClE;OAAc;OACV;;KAET,kBAAC,QAAD;MAAM,WAAU;gBAAhB,CAAuC,GAAM,SAAa;;KACtD;OAER,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAS,MAAM,GAAG,EAAE,CAAC,KAAK,MACzB,kBAAC,UAAD;KAEE,MAAK;KACL,WAAU;KACV,eAAe,EAAS,eAAe,EAAK,YAAY,WAAW;eAJrE,CAME,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,GAAD,EACE,WAAW,UAAU,EAAa,EAAK,WAAW,mBAAmB,gBACrE,CAAA,EACF,kBAAC,QAAD;OAAM,WAAU;iBACb,EAAK;OACD,CAAA,CACH;SACN,kBAAC,GAAD;MACE,SAAS,EAAc,EAAK,WAAW;MACvC,WAAU;gBAET,EAAK;MACA,CAAA,CACD;OAnBF,EAAK,GAmBH,CACT;IACE,CAAA,CACF;;EAEM,CAAA"}
+{"version":3,"file":"ProjectsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/ProjectsWidget.tsx"],"sourcesContent":["import { FolderKanban, ArrowRight, Circle } from 'lucide-react';\nimport { Badge, Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nconst statusColors: Record<string, string> = {\n  ACTIVE: 'bg-status-success-bg',\n  INACTIVE: 'bg-text-tertiary',\n  ARCHIVED: 'bg-status-warning-bg',\n};\n\nconst statusVariant: Record<string, 'default' | 'secondary' | 'outline'> = {\n  ACTIVE: 'default',\n  INACTIVE: 'secondary',\n  ARCHIVED: 'outline',\n};\n\nexport function ProjectsWidget({ workspaceData, isLoading, navigate }: WidgetProps) {\n  const projects = workspaceData?.projects.items ?? [];\n  const total = workspaceData?.projects.total ?? 0;\n\n  // Status breakdown\n  const activeCount = projects.filter((p) => p.status === 'ACTIVE').length;\n  const inactiveCount = projects.filter((p) => p.status === 'INACTIVE').length;\n\n  return (\n    <WidgetWrapper\n      title=\"Projects\"\n      icon={<FolderKanban className=\"size-4\" />}\n      size=\"medium\"\n      isLoading={isLoading}\n      unavailable={!workspaceData}\n      headerAction={\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          className=\"text-xs\"\n          onClick={() => navigate('/workspaces/projects')}\n        >\n          View all <ArrowRight className=\"ml-1 size-3\" />\n        </Button>\n      }\n    >\n      {projects.length === 0 ? (\n        <div className=\"text-center py-4\">\n          <p className=\"text-sm text-text-secondary mb-2\">No projects yet</p>\n          <Button variant=\"outline\" size=\"sm\" onClick={() => navigate('/workspaces/projects')}>\n            Create a project\n          </Button>\n        </div>\n      ) : (\n        <div className=\"space-y-3\">\n          {total > 0 && (\n            <div className=\"flex items-center gap-3 text-xs text-text-secondary\">\n              <span className=\"flex items-center gap-1\">\n                <Circle className=\"size-2 fill-status-success-bg text-status-success-bg\" />\n                {activeCount} active\n              </span>\n              {inactiveCount > 0 && (\n                <span className=\"flex items-center gap-1\">\n                  <Circle className=\"size-2 fill-text-tertiary text-text-tertiary\" />\n                  {inactiveCount} inactive\n                </span>\n              )}\n              <span className=\"ml-auto font-medium\">{total} total</span>\n            </div>\n          )}\n          <div className=\"space-y-2\">\n            {projects.slice(0, 4).map((proj) => (\n              <button\n                key={proj.id}\n                type=\"button\"\n                className=\"w-full flex items-center justify-between p-2 rounded-md hover:bg-accent/5 cursor-pointer transition-colors text-left\"\n                onClick={() => navigate(`/workspaces/${proj.workspaceId}/projects`)}\n              >\n                <div className=\"flex items-center gap-2 min-w-0\">\n                  <Circle\n                    className={`size-2 ${statusColors[proj.status] || 'bg-text-tertiary'} fill-current`}\n                  />\n                  <span className=\"text-sm font-medium text-text-primary truncate\">\n                    {proj.name}\n                  </span>\n                </div>\n                <Badge\n                  variant={statusVariant[proj.status] || 'outline'}\n                  className=\"text-[10px] shrink-0\"\n                >\n                  {proj.key}\n                </Badge>\n              </button>\n            ))}\n          </div>\n        </div>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,IAAM,IAAuC;CAC3C,QAAQ;CACR,UAAU;CACV,UAAU;CACX,EAEK,IAAqE;CACzE,QAAQ;CACR,UAAU;CACV,UAAU;CACX;AAED,SAAgB,EAAe,EAAE,kBAAe,cAAW,eAAyB;CAClF,IAAM,IAAW,GAAe,SAAS,SAAS,EAAE,EAC9C,IAAQ,GAAe,SAAS,SAAS,GAGzC,IAAc,EAAS,QAAQ,MAAM,EAAE,WAAW,SAAS,CAAC,QAC5D,IAAgB,EAAS,QAAQ,MAAM,EAAE,WAAW,WAAW,CAAC;AAEtE,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAc,WAAU,UAAW,CAAA;EACzC,MAAK;EACM;EACX,aAAa,CAAC;EACd,cACE,kBAAC,GAAD;GACE,SAAQ;GACR,MAAK;GACL,WAAU;GACV,eAAe,EAAS,uBAAuB;aAJjD,CAKC,aACU,kBAAC,GAAD,EAAY,WAAU,eAAgB,CAAA,CACxC;;YAGV,EAAS,WAAW,IACnB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,KAAD;IAAG,WAAU;cAAmC;IAAmB,CAAA,EACnE,kBAAC,GAAD;IAAQ,SAAQ;IAAU,MAAK;IAAK,eAAe,EAAS,uBAAuB;cAAE;IAE5E,CAAA,CACL;OAEN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACG,IAAQ,KACP,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,QAAD;MAAM,WAAU;gBAAhB;OACE,kBAAC,GAAD,EAAQ,WAAU,wDAAyD,CAAA;OAC1E;OAAY;OACR;;KACN,IAAgB,KACf,kBAAC,QAAD;MAAM,WAAU;gBAAhB;OACE,kBAAC,GAAD,EAAQ,WAAU,gDAAiD,CAAA;OAClE;OAAc;OACV;;KAET,kBAAC,QAAD;MAAM,WAAU;gBAAhB,CAAuC,GAAM,SAAa;;KACtD;OAER,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAS,MAAM,GAAG,EAAE,CAAC,KAAK,MACzB,kBAAC,UAAD;KAEE,MAAK;KACL,WAAU;KACV,eAAe,EAAS,eAAe,EAAK,YAAY,WAAW;eAJrE,CAME,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,GAAD,EACE,WAAW,UAAU,EAAa,EAAK,WAAW,mBAAmB,gBACrE,CAAA,EACF,kBAAC,QAAD;OAAM,WAAU;iBACb,EAAK;OACD,CAAA,CACH;SACN,kBAAC,GAAD;MACE,SAAS,EAAc,EAAK,WAAW;MACvC,WAAU;gBAET,EAAK;MACA,CAAA,CACD;OAnBF,EAAK,GAmBH,CACT;IACE,CAAA,CACF;;EAEM,CAAA"}