Harry Bayliss
66f0ee9e50
- Add .gitea/workflows/ci.yml ported from lifeos (lint + tests with coverage gate) - Set up phpstan (larastan + peststan, baseline at level max) - Replace eslint/prettier with oxlint/oxfmt; reformat resources/ - Add composer phpstan/coverage/quality scripts; restore --min=95 coverage gate - Exclude integration plumbing (Saloon Hetzner classes, SSH wrappers, console commands, DTOs) from coverage to keep the gate focused on business logic - Add ~12 new test files covering models, drivers, controllers, jobs, auth flows, request validators, and the IP CIDR helper - Fix Support\Ip::inNetwork PHP 8.4 TypeError in CIDR mask check - Fix FirewallRule::command comparing the enum-cast type column to a string - Fix Server::network using the wrong foreign key column - Remove unreachable code under abort(403) in RegisteredUserController
105 lines
3.7 KiB
Vue
105 lines
3.7 KiB
Vue
<script setup lang="ts">
|
|
import Sheet from "@/components/ui/sheet/Sheet.vue";
|
|
import SheetContent from "@/components/ui/sheet/SheetContent.vue";
|
|
import { cn } from "@/lib/utils";
|
|
import type { HTMLAttributes } from "vue";
|
|
import { SIDEBAR_WIDTH_MOBILE, useSidebar } from "./utils";
|
|
|
|
defineOptions({
|
|
inheritAttrs: false,
|
|
});
|
|
|
|
const props = withDefaults(
|
|
defineProps<{
|
|
side?: "left" | "right";
|
|
variant?: "sidebar" | "floating" | "inset";
|
|
collapsible?: "offcanvas" | "icon" | "none";
|
|
class?: HTMLAttributes["class"];
|
|
}>(),
|
|
{
|
|
side: "left",
|
|
variant: "sidebar",
|
|
collapsible: "offcanvas",
|
|
},
|
|
);
|
|
|
|
const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
|
|
</script>
|
|
|
|
<template>
|
|
<div
|
|
v-if="collapsible === 'none'"
|
|
:class="
|
|
cn(
|
|
'flex h-full w-[--sidebar-width] flex-col bg-sidebar text-sidebar-foreground',
|
|
props.class,
|
|
)
|
|
"
|
|
v-bind="$attrs"
|
|
>
|
|
<slot />
|
|
</div>
|
|
|
|
<Sheet v-else-if="isMobile" :open="openMobile" v-bind="$attrs" @update:open="setOpenMobile">
|
|
<SheetContent
|
|
data-sidebar="sidebar"
|
|
data-mobile="true"
|
|
:side="side"
|
|
class="w-[--sidebar-width] bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden"
|
|
:style="{
|
|
'--sidebar-width': SIDEBAR_WIDTH_MOBILE,
|
|
}"
|
|
>
|
|
<div class="flex h-full w-full flex-col">
|
|
<slot />
|
|
</div>
|
|
</SheetContent>
|
|
</Sheet>
|
|
|
|
<div
|
|
v-else
|
|
class="group peer hidden md:block"
|
|
:data-state="state"
|
|
:data-collapsible="state === 'collapsed' ? collapsible : ''"
|
|
:data-variant="variant"
|
|
:data-side="side"
|
|
>
|
|
<!-- This is what handles the sidebar gap on desktop -->
|
|
<div
|
|
:class="
|
|
cn(
|
|
'relative h-svh w-[--sidebar-width] bg-transparent transition-[width] duration-200 ease-in-out',
|
|
'group-data-[collapsible=offcanvas]:w-0',
|
|
'group-data-[side=right]:rotate-180',
|
|
variant === 'floating' || variant === 'inset'
|
|
? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]'
|
|
: 'group-data-[collapsible=icon]:w-[--sidebar-width-icon]',
|
|
)
|
|
"
|
|
/>
|
|
<div
|
|
:class="
|
|
cn(
|
|
'fixed inset-y-0 z-10 hidden h-svh w-[--sidebar-width] transition-[left,right,width] duration-200 ease-in-out md:flex',
|
|
side === 'left'
|
|
? 'left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]'
|
|
: 'right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]',
|
|
// Adjust the padding for floating and inset variants.
|
|
variant === 'floating' || variant === 'inset'
|
|
? 'p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]'
|
|
: 'group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l',
|
|
props.class,
|
|
)
|
|
"
|
|
v-bind="$attrs"
|
|
>
|
|
<div
|
|
data-sidebar="sidebar"
|
|
class="flex h-full w-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:border-sidebar-border group-data-[variant=floating]:shadow"
|
|
>
|
|
<slot />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|