@hed-hog/core 0.0.350 → 0.0.353

package/hedhog/frontend/app/ai_agent/page.tsx.ejs

@@ -35,9 +35,9 @@ import {
   SelectTrigger,
   SelectValue,
 } from '@/components/ui/select';
+import { ResizableSheetContent } from '@/components/ui/resizable-sheet-content';
 import {
   Sheet,
-  SheetContent,
   SheetDescription,
   SheetFooter,
   SheetHeader,
@@ -451,7 +451,14 @@ export default function AiAgentPage() {
           }
         }}
       >
-        <SheetContent side="right" className="sm:max-w-xl overflow-y-auto">
+        <ResizableSheetContent
+          sheetId="core-ai-agent-form-sheet"
+          defaultWidth={640}
+          minWidth={460}
+          maxWidth={980}
+          side="right"
+          className="sm:max-w-xl overflow-y-auto"
+        >
           <SheetHeader>
             <SheetTitle>
               {editingAgent ? t('editTitle') : t('createTitle')}
@@ -562,7 +569,7 @@ export default function AiAgentPage() {
               </SheetFooter>
             </form>
           </Form>
-        </SheetContent>
+        </ResizableSheetContent>
       </Sheet>
 
       <AlertDialog

package/hedhog/frontend/app/dashboard/dashboard-home-tabs.tsx.ejs

@@ -32,11 +32,11 @@ import { Input } from '@/components/ui/input';
 import { ScrollArea } from '@/components/ui/scroll-area';
 import {
   Sheet,
-  SheetContent,
   SheetDescription,
   SheetHeader,
   SheetTitle,
 } from '@/components/ui/sheet';
+import { ResizableSheetContent } from '@/components/ui/resizable-sheet-content';
 import { Skeleton } from '@/components/ui/skeleton';
 import { Tabs, TabsList, TabsTrigger } from '@/components/ui/tabs';
 import { useDebounce } from '@/hooks/use-debounce';
@@ -1009,9 +1009,9 @@ export function DashboardHomeTabs() {
                             className="h-7 w-40"
                           />
                         ) : (
-                          <span className="block min-w-0 max-w-45 truncate">
-                            {getDashboardName(dashboard)}
-                          </span>
+                          <span className="block min-w-0 max-w-45 truncate">
+                            {getDashboardName(dashboard)}
+                          </span>
                         )}
                       </>
                     );
@@ -1025,7 +1025,7 @@ export function DashboardHomeTabs() {
                               onDrop={(event) =>
                                 void handleTabDrop(event, dashboard.slug)
                               }
-                              className="-mb-px flex min-h-9 shrink-0 items-center gap-2 rounded-b-none rounded-t-lg border border-b-0 border-border bg-background px-3 py-2 text-foreground shadow-none"
+                              className="-mb-px flex min-h-9 shrink-0 items-center gap-2 rounded-b-none rounded-t-lg border border-b-0 border-border bg-background px-3 py-2 text-foreground shadow-none"
                             >
                               {tabContent}
                             </div>
@@ -1042,7 +1042,7 @@ export function DashboardHomeTabs() {
                               }
                               onDragEnd={handleTabDragEnd}
                               className={cn(
-                                'dashboard-tab-trigger -mb-px mt-1 inline-flex h-9 shrink-0 cursor-pointer items-center justify-center gap-2 overflow-hidden rounded-b-none rounded-t-lg border-none px-3 py-2 shadow-none data-[state=active]:shadow-none',
+                                'dashboard-tab-trigger -mb-px mt-1 inline-flex h-9 shrink-0 cursor-pointer items-center justify-center gap-2 overflow-hidden rounded-b-none rounded-t-lg border-none px-3 py-2 shadow-none data-[state=active]:shadow-none',
                                 draggingDashboardSlug === dashboard.slug &&
                                   'opacity-70'
                               )}
@@ -1178,7 +1178,14 @@ export function DashboardHomeTabs() {
           }
         }}
       >
-        <SheetContent side="right" className="w-full sm:max-w-xl">
+        <ResizableSheetContent
+          sheetId="core-dashboard-home-create-sheet"
+          defaultWidth={640}
+          minWidth={460}
+          maxWidth={980}
+          side="right"
+          className="w-full sm:max-w-xl"
+        >
           <div className="flex h-full flex-col">
             <SheetHeader className="px-6 py-5 text-left">
               <SheetTitle>{t('newDashboardTitle')}</SheetTitle>
@@ -1378,7 +1385,7 @@ export function DashboardHomeTabs() {
               </Button>
             </div>
           </div>
-        </SheetContent>
+        </ResizableSheetContent>
       </Sheet>
 
       <Sheet
@@ -1391,7 +1398,14 @@ export function DashboardHomeTabs() {
           }
         }}
       >
-        <SheetContent side="right" className="w-full sm:max-w-xl">
+        <ResizableSheetContent
+          sheetId="core-dashboard-home-icon-sheet"
+          defaultWidth={640}
+          minWidth={460}
+          maxWidth={980}
+          side="right"
+          className="w-full sm:max-w-xl"
+        >
           <div className="flex h-full flex-col">
             <SheetHeader className="px-6 py-5 text-left">
               <SheetTitle>{t('changeDashboardIconTitle')}</SheetTitle>
@@ -1488,7 +1502,7 @@ export function DashboardHomeTabs() {
               </Button>
             </div>
           </div>
-        </SheetContent>
+        </ResizableSheetContent>
       </Sheet>
 
       <Sheet
@@ -1502,7 +1516,13 @@ export function DashboardHomeTabs() {
           }
         }}
       >
-        <SheetContent className="w-full sm:max-w-4xl">
+        <ResizableSheetContent
+          sheetId="core-dashboard-home-share-sheet"
+          defaultWidth={960}
+          minWidth={700}
+          maxWidth={1400}
+          className="w-full sm:max-w-4xl"
+        >
           <SheetHeader>
             <SheetTitle>
               {t('shareDashboardTitle', {
@@ -1519,7 +1539,7 @@ export function DashboardHomeTabs() {
               {t('shareRoleNotice')}
             </div>
 
-            <div className="grid flex-1 gap-4 overflow-hidden lg:grid-cols-2">
+            <div className="grid min-h-0 flex-1 gap-4 lg:grid-cols-2">
               <div className="flex min-h-0 flex-col rounded-lg border">
                 <div className="flex items-center justify-between border-b px-3 py-2">
                   <div>
@@ -1783,7 +1803,7 @@ export function DashboardHomeTabs() {
               </div>
             </div>
           </div>
-        </SheetContent>
+        </ResizableSheetContent>
       </Sheet>
 
       <AlertDialog open={deleteOpen} onOpenChange={setDeleteOpen}>

package/hedhog/frontend/app/dashboard/management/tabs/components-tab.tsx.ejs

@@ -33,12 +33,12 @@ import {
 } from '@/components/ui/select';
 import {
   Sheet,
-  SheetContent,
   SheetDescription,
   SheetFooter,
   SheetHeader,
   SheetTitle,
 } from '@/components/ui/sheet';
+import { ResizableSheetContent } from '@/components/ui/resizable-sheet-content';
 import {
   Table,
   TableBody,
@@ -464,7 +464,7 @@ export function ComponentsTab() {
                       value={selectedLocale}
                       onValueChange={setSelectedLocale}
                     >
-                      <SelectTrigger className="w-[200px]">
+                      <SelectTrigger style={{ width: 200 }}>
                         <SelectValue />
                       </SelectTrigger>
                       <SelectContent>
@@ -725,7 +725,7 @@ export function ComponentsTab() {
               <TableHead>{t('size')}</TableHead>
               <TableHead>{t('resizable')}</TableHead>
               <TableHead>{t('role')}</TableHead>
-              <TableHead className="w-[100px]">{t('actions')}</TableHead>
+              <TableHead style={{ width: 100 }}>{t('actions')}</TableHead>
             </TableRow>
           </TableHeader>
           <TableBody>
@@ -1019,7 +1019,14 @@ export function ComponentsTab() {
           }
         }}
       >
-        <SheetContent side="right" className="sm:max-w-lg overflow-y-auto">
+        <ResizableSheetContent
+          sheetId="core-dashboard-components-role-sheet"
+          defaultWidth={560}
+          minWidth={420}
+          maxWidth={920}
+          side="right"
+          className="sm:max-w-lg overflow-y-auto"
+        >
           <SheetHeader>
             <SheetTitle>{t('addRole')}</SheetTitle>
             <SheetDescription>
@@ -1090,7 +1097,7 @@ export function ComponentsTab() {
             </Button>
             <Button onClick={handleAddRolesToComponent}>{t('save')}</Button>
           </SheetFooter>
-        </SheetContent>
+        </ResizableSheetContent>
       </Sheet>
     </div>
   );

package/hedhog/frontend/app/dashboard/management/tabs/dashboards-tab.tsx.ejs

@@ -33,12 +33,12 @@ import {
 } from '@/components/ui/select';
 import {
   Sheet,
-  SheetContent,
   SheetDescription,
   SheetFooter,
   SheetHeader,
   SheetTitle,
 } from '@/components/ui/sheet';
+import { ResizableSheetContent } from '@/components/ui/resizable-sheet-content';
 import {
   Table,
   TableBody,
@@ -407,7 +407,7 @@ export function DashboardsTab() {
                       value={selectedLocale}
                       onValueChange={setSelectedLocale}
                     >
-                      <SelectTrigger className="w-[200px]">
+                      <SelectTrigger className="w-50">
                         <SelectValue />
                       </SelectTrigger>
                       <SelectContent>
@@ -485,7 +485,7 @@ export function DashboardsTab() {
               <TableHead>{t('slug')}</TableHead>
               <TableHead>{t('name')}</TableHead>
               <TableHead>{t('role')}</TableHead>
-              <TableHead className="w-[100px]">{t('actions')}</TableHead>
+              <TableHead className="w-25">{t('actions')}</TableHead>
             </TableRow>
           </TableHeader>
           <TableBody>
@@ -764,7 +764,14 @@ export function DashboardsTab() {
           }
         }}
       >
-        <SheetContent side="right" className="sm:max-w-lg overflow-y-auto">
+        <ResizableSheetContent
+          sheetId="core-dashboard-dashboards-role-sheet"
+          defaultWidth={560}
+          minWidth={420}
+          maxWidth={920}
+          side="right"
+          className="sm:max-w-lg overflow-y-auto"
+        >
           <SheetHeader>
             <SheetTitle>{t('addRole')}</SheetTitle>
             <SheetDescription>
@@ -843,7 +850,7 @@ export function DashboardsTab() {
             </Button>
             <Button onClick={handleAddRolesToDashboard}>{t('save')}</Button>
           </SheetFooter>
-        </SheetContent>
+        </ResizableSheetContent>
       </Sheet>
     </div>
   );