routie dev init since i didn't adhere to any proper guidance up until now

This commit is contained in:
2026-04-29 22:27:29 -06:00
commit e1dabb71e2
15301 changed files with 3562618 additions and 0 deletions
+40
View File
@@ -0,0 +1,40 @@
@layer vuetify-components {
.v-footer {
align-items: center;
display: flex;
flex: 1 1 auto;
padding: 8px 16px;
position: relative;
transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
transition-property: height, width, transform, max-width, left, right, top, bottom;
}
.v-footer {
border-color: rgba(var(--v-border-color), var(--v-border-opacity));
border-style: solid;
border-width: 0;
}
.v-footer--border {
border-width: thin;
box-shadow: none;
}
.v-footer {
box-shadow: 0px 0px 0px 0px rgba(var(--v-shadow-color), var(--v-shadow-key-opacity, 0.3)), 0px 0px 0px 0px rgba(var(--v-shadow-color), var(--v-shadow-ambient-opacity, 0.15));
--v-elevation-overlay: color-mix(in srgb, var(--v-elevation-overlay-color) 0%, transparent);
}
.v-footer--absolute {
position: absolute;
}
.v-footer--fixed {
position: fixed;
}
.v-footer {
border-radius: 0;
}
.v-footer {
background: rgb(var(--v-theme-surface));
color: color-mix(in srgb, rgb(var(--v-theme-on-surface)) calc(var(--v-high-emphasis-opacity) * 100%), transparent);
}
.v-footer--rounded {
border-radius: 4px;
}
}
+326
View File
@@ -0,0 +1,326 @@
export declare const makeVFooterProps: <Defaults extends {
theme?: unknown;
class?: unknown;
style?: unknown;
name?: unknown;
order?: unknown;
absolute?: unknown;
border?: unknown;
elevation?: unknown;
rounded?: unknown;
tile?: unknown;
tag?: unknown;
app?: unknown;
color?: unknown;
height?: unknown;
} = {}>(defaults?: Defaults | undefined) => {
theme: unknown extends Defaults["theme"] ? StringConstructor : {
type: import("vue").PropType<unknown extends Defaults["theme"] ? string : string | Defaults["theme"]>;
default: unknown extends Defaults["theme"] ? string : string | Defaults["theme"];
};
class: unknown extends Defaults["class"] ? import("vue").PropType<any> : {
type: import("vue").PropType<unknown extends Defaults["class"] ? any : any>;
default: unknown extends Defaults["class"] ? any : any;
};
style: unknown extends Defaults["style"] ? {
type: import("vue").PropType<import("vue").StyleValue>;
default: null;
} : Omit<{
type: import("vue").PropType<import("vue").StyleValue>;
default: null;
}, "default" | "type"> & {
type: import("vue").PropType<unknown extends Defaults["style"] ? import("vue").StyleValue : Defaults["style"] | import("vue").StyleValue>;
default: unknown extends Defaults["style"] ? import("vue").StyleValue : Defaults["style"] | NonNullable<import("vue").StyleValue>;
};
name: unknown extends Defaults["name"] ? {
type: StringConstructor;
} : Omit<{
type: StringConstructor;
}, "default" | "type"> & {
type: import("vue").PropType<unknown extends Defaults["name"] ? string : string | Defaults["name"]>;
default: unknown extends Defaults["name"] ? string : string | Defaults["name"];
};
order: unknown extends Defaults["order"] ? {
type: (NumberConstructor | StringConstructor)[];
default: number;
} : Omit<{
type: (NumberConstructor | StringConstructor)[];
default: number;
}, "default" | "type"> & {
type: import("vue").PropType<unknown extends Defaults["order"] ? string | number : string | number | Defaults["order"]>;
default: unknown extends Defaults["order"] ? string | number : Defaults["order"] | NonNullable<string | number>;
};
absolute: unknown extends Defaults["absolute"] ? BooleanConstructor : {
type: import("vue").PropType<unknown extends Defaults["absolute"] ? boolean : boolean | Defaults["absolute"]>;
default: unknown extends Defaults["absolute"] ? boolean : boolean | Defaults["absolute"];
};
border: unknown extends Defaults["border"] ? (BooleanConstructor | NumberConstructor | StringConstructor)[] : {
type: import("vue").PropType<unknown extends Defaults["border"] ? string | number | boolean : string | number | boolean | Defaults["border"]>;
default: unknown extends Defaults["border"] ? string | number | boolean : Defaults["border"] | NonNullable<string | number | boolean>;
};
elevation: unknown extends Defaults["elevation"] ? {
type: (NumberConstructor | StringConstructor)[];
validator: (value: string | number) => boolean;
} : Omit<{
type: (NumberConstructor | StringConstructor)[];
validator: (value: string | number) => boolean;
}, "default" | "type"> & {
type: import("vue").PropType<unknown extends Defaults["elevation"] ? string | number : string | number | Defaults["elevation"]>;
default: unknown extends Defaults["elevation"] ? string | number : Defaults["elevation"] | NonNullable<string | number>;
};
rounded: unknown extends Defaults["rounded"] ? {
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
default: undefined;
} : Omit<{
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
default: undefined;
}, "default" | "type"> & {
type: import("vue").PropType<unknown extends Defaults["rounded"] ? string | number | boolean : string | number | boolean | Defaults["rounded"]>;
default: unknown extends Defaults["rounded"] ? string | number | boolean : Defaults["rounded"] | NonNullable<string | number | boolean>;
};
tile: unknown extends Defaults["tile"] ? BooleanConstructor : {
type: import("vue").PropType<unknown extends Defaults["tile"] ? boolean : boolean | Defaults["tile"]>;
default: unknown extends Defaults["tile"] ? boolean : boolean | Defaults["tile"];
};
tag: unknown extends Defaults["tag"] ? Omit<{
type: import("vue").PropType<string | import("../../util/index.js").JSXComponent>;
default: string;
}, "default" | "type"> & {
type: import("vue").PropType<string | import("../../util/index.js").JSXComponent>;
default: NonNullable<string | import("../../util/index.js").JSXComponent>;
} : Omit<Omit<{
type: import("vue").PropType<string | import("../../util/index.js").JSXComponent>;
default: string;
}, "default" | "type"> & {
type: import("vue").PropType<string | import("../../util/index.js").JSXComponent>;
default: NonNullable<string | import("../../util/index.js").JSXComponent>;
}, "default" | "type"> & {
type: import("vue").PropType<unknown extends Defaults["tag"] ? string | import("../../util/index.js").JSXComponent : string | Defaults["tag"] | import("../../util/index.js").JSXComponent>;
default: unknown extends Defaults["tag"] ? string | import("../../util/index.js").JSXComponent : Defaults["tag"] | NonNullable<string | import("../../util/index.js").JSXComponent>;
};
app: unknown extends Defaults["app"] ? BooleanConstructor : {
type: import("vue").PropType<unknown extends Defaults["app"] ? boolean : boolean | Defaults["app"]>;
default: unknown extends Defaults["app"] ? boolean : boolean | Defaults["app"];
};
color: unknown extends Defaults["color"] ? StringConstructor : {
type: import("vue").PropType<unknown extends Defaults["color"] ? string : string | Defaults["color"]>;
default: unknown extends Defaults["color"] ? string : string | Defaults["color"];
};
height: unknown extends Defaults["height"] ? {
type: (NumberConstructor | StringConstructor)[];
default: string;
} : Omit<{
type: (NumberConstructor | StringConstructor)[];
default: string;
}, "default" | "type"> & {
type: import("vue").PropType<unknown extends Defaults["height"] ? string | number : string | number | Defaults["height"]>;
default: unknown extends Defaults["height"] ? string | number : Defaults["height"] | NonNullable<string | number>;
};
};
export declare const VFooter: {
new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<{
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
order: string | number;
absolute: boolean;
tile: boolean;
tag: string | import("../../util/index.js").JSXComponent;
app: boolean;
height: string | number;
} & {
theme?: string | undefined;
class?: any;
name?: string | undefined;
border?: string | number | boolean | undefined;
elevation?: string | number | undefined;
rounded?: string | number | boolean | undefined;
color?: string | undefined;
} & {
$children?: {
default?: (() => import("vue").VNodeChild) | undefined;
} | {
$stable?: boolean;
} | (() => import("vue").VNodeChild) | import("vue").VNodeChild;
'v-slots'?: {
default?: false | (() => import("vue").VNodeChild) | undefined;
} | undefined;
} & {
"v-slot:default"?: false | (() => import("vue").VNodeChild) | undefined;
}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, {
style: import("vue").StyleValue;
order: string | number;
absolute: boolean;
rounded: string | number | boolean;
tile: boolean;
tag: string | import("../../util/index.js").JSXComponent;
app: boolean;
height: string | number;
}, true, {}, import("vue").SlotsType<Partial<{
default: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
[key: string]: any;
}>[];
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, {
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
order: string | number;
absolute: boolean;
tile: boolean;
tag: string | import("../../util/index.js").JSXComponent;
app: boolean;
height: string | number;
} & {
theme?: string | undefined;
class?: any;
name?: string | undefined;
border?: string | number | boolean | undefined;
elevation?: string | number | undefined;
rounded?: string | number | boolean | undefined;
color?: string | undefined;
} & {
$children?: {
default?: (() => import("vue").VNodeChild) | undefined;
} | {
$stable?: boolean;
} | (() => import("vue").VNodeChild) | import("vue").VNodeChild;
'v-slots'?: {
default?: false | (() => import("vue").VNodeChild) | undefined;
} | undefined;
} & {
"v-slot:default"?: false | (() => import("vue").VNodeChild) | undefined;
}, {}, {}, {}, {}, {
style: import("vue").StyleValue;
order: string | number;
absolute: boolean;
rounded: string | number | boolean;
tile: boolean;
tag: string | import("../../util/index.js").JSXComponent;
app: boolean;
height: string | number;
}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & import("vue").ComponentOptionsBase<{
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
order: string | number;
absolute: boolean;
tile: boolean;
tag: string | import("../../util/index.js").JSXComponent;
app: boolean;
height: string | number;
} & {
theme?: string | undefined;
class?: any;
name?: string | undefined;
border?: string | number | boolean | undefined;
elevation?: string | number | undefined;
rounded?: string | number | boolean | undefined;
color?: string | undefined;
} & {
$children?: {
default?: (() => import("vue").VNodeChild) | undefined;
} | {
$stable?: boolean;
} | (() => import("vue").VNodeChild) | import("vue").VNodeChild;
'v-slots'?: {
default?: false | (() => import("vue").VNodeChild) | undefined;
} | undefined;
} & {
"v-slot:default"?: false | (() => import("vue").VNodeChild) | undefined;
}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {
style: import("vue").StyleValue;
order: string | number;
absolute: boolean;
rounded: string | number | boolean;
tile: boolean;
tag: string | import("../../util/index.js").JSXComponent;
app: boolean;
height: string | number;
}, {}, string, import("vue").SlotsType<Partial<{
default: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
[key: string]: any;
}>[];
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("../../util/index.js").FilterPropsOptions<{
theme: StringConstructor;
class: import("vue").PropType<any>;
style: {
type: import("vue").PropType<import("vue").StyleValue>;
default: null;
};
name: {
type: StringConstructor;
};
order: {
type: (NumberConstructor | StringConstructor)[];
default: number;
};
absolute: BooleanConstructor;
border: (BooleanConstructor | NumberConstructor | StringConstructor)[];
elevation: {
type: (NumberConstructor | StringConstructor)[];
validator: (value: string | number) => boolean;
};
rounded: {
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
default: undefined;
};
tile: BooleanConstructor;
tag: Omit<{
type: import("vue").PropType<string | import("../../util/index.js").JSXComponent>;
default: string;
}, "default" | "type"> & {
type: import("vue").PropType<string | import("../../util/index.js").JSXComponent>;
default: NonNullable<string | import("../../util/index.js").JSXComponent>;
};
app: BooleanConstructor;
color: StringConstructor;
height: {
type: (NumberConstructor | StringConstructor)[];
default: string;
};
}, import("vue").ExtractPropTypes<{
theme: StringConstructor;
class: import("vue").PropType<any>;
style: {
type: import("vue").PropType<import("vue").StyleValue>;
default: null;
};
name: {
type: StringConstructor;
};
order: {
type: (NumberConstructor | StringConstructor)[];
default: number;
};
absolute: BooleanConstructor;
border: (BooleanConstructor | NumberConstructor | StringConstructor)[];
elevation: {
type: (NumberConstructor | StringConstructor)[];
validator: (value: string | number) => boolean;
};
rounded: {
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
default: undefined;
};
tile: BooleanConstructor;
tag: Omit<{
type: import("vue").PropType<string | import("../../util/index.js").JSXComponent>;
default: string;
}, "default" | "type"> & {
type: import("vue").PropType<string | import("../../util/index.js").JSXComponent>;
default: NonNullable<string | import("../../util/index.js").JSXComponent>;
};
app: BooleanConstructor;
color: StringConstructor;
height: {
type: (NumberConstructor | StringConstructor)[];
default: string;
};
}>>;
export type VFooter = InstanceType<typeof VFooter>;
+90
View File
@@ -0,0 +1,90 @@
import { normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, createVNode as _createVNode } from "vue";
// Styles
import "./VFooter.css";
// Composables
import { makeBorderProps, useBorder } from "../../composables/border.js";
import { useBackgroundColor } from "../../composables/color.js";
import { makeComponentProps } from "../../composables/component.js";
import { makeElevationProps, useElevation } from "../../composables/elevation.js";
import { makeLayoutItemProps, useLayoutItem } from "../../composables/layout.js";
import { useResizeObserver } from "../../composables/resizeObserver.js";
import { makeRoundedProps, useRounded } from "../../composables/rounded.js";
import { makeTagProps } from "../../composables/tag.js";
import { makeThemeProps, provideTheme } from "../../composables/theme.js";
import { useToggleScope } from "../../composables/toggleScope.js"; // Utilities
import { computed, ref, shallowRef, toRef, watchEffect } from 'vue';
import { convertToUnit, genericComponent, propsFactory, useRender } from "../../util/index.js";
export const makeVFooterProps = propsFactory({
app: Boolean,
color: String,
height: {
type: [Number, String],
default: 'auto'
},
...makeBorderProps(),
...makeComponentProps(),
...makeElevationProps(),
...makeLayoutItemProps(),
...makeRoundedProps(),
...makeTagProps({
tag: 'footer'
}),
...makeThemeProps()
}, 'VFooter');
export const VFooter = genericComponent()({
name: 'VFooter',
props: makeVFooterProps(),
setup(props, {
slots
}) {
const layoutItemStyles = ref();
const {
themeClasses
} = provideTheme(props);
const {
backgroundColorClasses,
backgroundColorStyles
} = useBackgroundColor(() => props.color);
const {
borderClasses
} = useBorder(props);
const {
elevationClasses
} = useElevation(props);
const {
roundedClasses
} = useRounded(props);
const autoHeight = shallowRef(32);
const {
resizeRef
} = useResizeObserver(entries => {
if (!entries.length) return;
autoHeight.value = entries[0].target.clientHeight;
});
const height = computed(() => props.height === 'auto' ? autoHeight.value : parseInt(props.height, 10));
useToggleScope(() => props.app, () => {
const layout = useLayoutItem({
id: props.name,
order: computed(() => parseInt(props.order, 10)),
position: toRef(() => 'bottom'),
layoutSize: height,
elementSize: computed(() => props.height === 'auto' ? undefined : height.value),
active: toRef(() => props.app),
absolute: toRef(() => props.absolute)
});
watchEffect(() => {
layoutItemStyles.value = layout.layoutItemStyles.value;
});
});
useRender(() => _createVNode(props.tag, {
"ref": resizeRef,
"class": _normalizeClass(['v-footer', themeClasses.value, backgroundColorClasses.value, borderClasses.value, elevationClasses.value, roundedClasses.value, props.class]),
"style": _normalizeStyle([backgroundColorStyles.value, props.app ? layoutItemStyles.value : {
height: convertToUnit(props.height)
}, props.style])
}, slots));
return {};
}
});
//# sourceMappingURL=VFooter.js.map
File diff suppressed because one or more lines are too long
+22
View File
@@ -0,0 +1,22 @@
@use '../../styles/tools'
@use './variables' as *
@include tools.layer('components')
.v-footer
align-items: center
display: flex
flex: $footer-flex
padding: $footer-padding
position: relative
transition: $footer-transition
transition-property: height, width, transform, max-width, left, right, top, bottom
// missing from variables
@include tools.border($footer-border...)
@include tools.elevation($footer-elevation)
@include tools.position($footer-positions)
@include tools.rounded($footer-border-radius)
@include tools.theme($footer-theme...)
&--rounded
@include tools.rounded($footer-rounded-border-radius)
+32
View File
@@ -0,0 +1,32 @@
@use 'sass:map';
@use '../../styles/settings';
@use '../../styles/tools';
// VFooter
$footer-background: rgb(var(--v-theme-surface)) !default;
$footer-border-color: settings.$border-color-root !default;
$footer-border-style: settings.$border-style-root !default;
$footer-border-thin-width: thin !default;
$footer-border-width: 0 !default;
$footer-border-radius: map.get(settings.$rounded, 0) !default;
$footer-color: tools.theme-color('on-surface', var(--v-high-emphasis-opacity)) !default;
$footer-flex: 1 1 auto !default;
$footer-font-size: 14px !default;
$footer-elevation: 0 !default;
$footer-padding: 8px 16px !default;
$footer-positions: absolute fixed !default;
$footer-rounded-border-radius: settings.$border-radius-root !default;
$footer-transition: .2s settings.$standard-easing !default;
// Lists
$footer-border: (
$footer-border-color,
$footer-border-style,
$footer-border-width,
$footer-border-thin-width
) !default;
$footer-theme: (
$footer-background,
$footer-color
) !default;
+1
View File
@@ -0,0 +1 @@
export { VFooter } from './VFooter.js';
+2
View File
@@ -0,0 +1,2 @@
export { VFooter } from "./VFooter.js";
//# sourceMappingURL=index.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"index.js","names":["VFooter"],"sources":["../../../src/components/VFooter/index.ts"],"sourcesContent":["export { VFooter } from './VFooter'\n"],"mappings":"SAASA,OAAO","ignoreList":[]}