Tracking de l'application VApp (IHM du jeu)

This commit is contained in:
2025-05-11 18:04:12 +02:00
commit 89e9db9b62
17763 changed files with 3718499 additions and 0 deletions

View File

@ -0,0 +1,57 @@
.v-btn-group {
display: inline-flex;
flex-wrap: nowrap;
max-width: 100%;
min-width: 0;
overflow: hidden;
vertical-align: middle;
border-color: rgba(var(--v-border-color), var(--v-border-opacity));
border-style: solid;
border-width: 0;
box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
border-radius: 4px;
background: transparent;
color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
}
.v-btn-group--border {
border-width: thin;
box-shadow: none;
}
.v-btn-group--density-default.v-btn-group {
height: 48px;
}
.v-btn-group--density-comfortable.v-btn-group {
height: 40px;
}
.v-btn-group--density-compact.v-btn-group {
height: 36px;
}
.v-btn-group .v-btn {
border-radius: 0;
border-color: inherit;
}
.v-btn-group .v-btn:not(:last-child) {
border-inline-end: none;
}
.v-btn-group .v-btn:not(:first-child) {
border-inline-start: none;
}
.v-btn-group .v-btn:first-child {
border-start-start-radius: inherit;
border-end-start-radius: inherit;
}
.v-btn-group .v-btn:last-child {
border-start-end-radius: inherit;
border-end-end-radius: inherit;
}
.v-btn-group--divided .v-btn:not(:last-child) {
border-inline-end-width: thin;
border-inline-end-style: solid;
border-inline-end-color: rgba(var(--v-border-color), var(--v-border-opacity));
}
.v-btn-group--tile {
border-radius: 0;
}

View File

@ -0,0 +1,69 @@
import { createVNode as _createVNode, resolveDirective as _resolveDirective } from "vue";
// Styles
import "./VBtnGroup.css";
// Composables
import { makeBorderProps, useBorder } from "../../composables/border.mjs";
import { makeComponentProps } from "../../composables/component.mjs";
import { provideDefaults } from "../../composables/defaults.mjs";
import { makeDensityProps, useDensity } from "../../composables/density.mjs";
import { makeElevationProps, useElevation } from "../../composables/elevation.mjs";
import { makeRoundedProps, useRounded } from "../../composables/rounded.mjs";
import { makeTagProps } from "../../composables/tag.mjs";
import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
import { makeVariantProps } from "../../composables/variant.mjs"; // Utilities
import { toRef } from 'vue';
import { genericComponent, propsFactory, useRender } from "../../util/index.mjs";
export const makeVBtnGroupProps = propsFactory({
divided: Boolean,
...makeBorderProps(),
...makeComponentProps(),
...makeDensityProps(),
...makeElevationProps(),
...makeRoundedProps(),
...makeTagProps(),
...makeThemeProps(),
...makeVariantProps()
}, 'VBtnGroup');
export const VBtnGroup = genericComponent()({
name: 'VBtnGroup',
props: makeVBtnGroupProps(),
setup(props, _ref) {
let {
slots
} = _ref;
const {
themeClasses
} = provideTheme(props);
const {
densityClasses
} = useDensity(props);
const {
borderClasses
} = useBorder(props);
const {
elevationClasses
} = useElevation(props);
const {
roundedClasses
} = useRounded(props);
provideDefaults({
VBtn: {
height: 'auto',
color: toRef(props, 'color'),
density: toRef(props, 'density'),
flat: true,
variant: toRef(props, 'variant')
}
});
useRender(() => {
return _createVNode(props.tag, {
"class": ['v-btn-group', {
'v-btn-group--divided': props.divided
}, themeClasses.value, borderClasses.value, densityClasses.value, elevationClasses.value, roundedClasses.value, props.class],
"style": props.style
}, slots);
});
}
});
//# sourceMappingURL=VBtnGroup.mjs.map

View File

@ -0,0 +1 @@
{"version":3,"file":"VBtnGroup.mjs","names":["makeBorderProps","useBorder","makeComponentProps","provideDefaults","makeDensityProps","useDensity","makeElevationProps","useElevation","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","makeVariantProps","toRef","genericComponent","propsFactory","useRender","makeVBtnGroupProps","divided","Boolean","VBtnGroup","name","props","setup","_ref","slots","themeClasses","densityClasses","borderClasses","elevationClasses","roundedClasses","VBtn","height","color","density","flat","variant","_createVNode","tag","value","class","style"],"sources":["../../../src/components/VBtnGroup/VBtnGroup.tsx"],"sourcesContent":["// Styles\nimport './VBtnGroup.sass'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeComponentProps } from '@/composables/component'\nimport { provideDefaults } from '@/composables/defaults'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { makeVariantProps } from '@/composables/variant'\n\n// Utilities\nimport { toRef } from 'vue'\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\nexport const makeVBtnGroupProps = propsFactory({\n divided: Boolean,\n\n ...makeBorderProps(),\n ...makeComponentProps(),\n ...makeDensityProps(),\n ...makeElevationProps(),\n ...makeRoundedProps(),\n ...makeTagProps(),\n ...makeThemeProps(),\n ...makeVariantProps(),\n}, 'VBtnGroup')\n\nexport const VBtnGroup = genericComponent()({\n name: 'VBtnGroup',\n\n props: makeVBtnGroupProps(),\n\n setup (props, { slots }) {\n const { themeClasses } = provideTheme(props)\n const { densityClasses } = useDensity(props)\n const { borderClasses } = useBorder(props)\n const { elevationClasses } = useElevation(props)\n const { roundedClasses } = useRounded(props)\n\n provideDefaults({\n VBtn: {\n height: 'auto',\n color: toRef(props, 'color'),\n density: toRef(props, 'density'),\n flat: true,\n variant: toRef(props, 'variant'),\n },\n })\n\n useRender(() => {\n return (\n <props.tag\n class={[\n 'v-btn-group',\n {\n 'v-btn-group--divided': props.divided,\n },\n themeClasses.value,\n borderClasses.value,\n densityClasses.value,\n elevationClasses.value,\n roundedClasses.value,\n props.class,\n ]}\n style={ props.style }\n v-slots={ slots }\n />\n )\n })\n },\n})\n\nexport type VBtnGroup = InstanceType<typeof VBtnGroup>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,eAAe,EAAEC,SAAS;AAAA,SAC1BC,kBAAkB;AAAA,SAClBC,eAAe;AAAA,SACfC,gBAAgB,EAAEC,UAAU;AAAA,SAC5BC,kBAAkB,EAAEC,YAAY;AAAA,SAChCC,gBAAgB,EAAEC,UAAU;AAAA,SAC5BC,YAAY;AAAA,SACZC,cAAc,EAAEC,YAAY;AAAA,SAC5BC,gBAAgB,yCAEzB;AACA,SAASC,KAAK,QAAQ,KAAK;AAAA,SAClBC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS;AAElD,OAAO,MAAMC,kBAAkB,GAAGF,YAAY,CAAC;EAC7CG,OAAO,EAAEC,OAAO;EAEhB,GAAGpB,eAAe,CAAC,CAAC;EACpB,GAAGE,kBAAkB,CAAC,CAAC;EACvB,GAAGE,gBAAgB,CAAC,CAAC;EACrB,GAAGE,kBAAkB,CAAC,CAAC;EACvB,GAAGE,gBAAgB,CAAC,CAAC;EACrB,GAAGE,YAAY,CAAC,CAAC;EACjB,GAAGC,cAAc,CAAC,CAAC;EACnB,GAAGE,gBAAgB,CAAC;AACtB,CAAC,EAAE,WAAW,CAAC;AAEf,OAAO,MAAMQ,SAAS,GAAGN,gBAAgB,CAAC,CAAC,CAAC;EAC1CO,IAAI,EAAE,WAAW;EAEjBC,KAAK,EAAEL,kBAAkB,CAAC,CAAC;EAE3BM,KAAKA,CAAED,KAAK,EAAAE,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAM;MAAEE;IAAa,CAAC,GAAGf,YAAY,CAACW,KAAK,CAAC;IAC5C,MAAM;MAAEK;IAAe,CAAC,GAAGvB,UAAU,CAACkB,KAAK,CAAC;IAC5C,MAAM;MAAEM;IAAc,CAAC,GAAG5B,SAAS,CAACsB,KAAK,CAAC;IAC1C,MAAM;MAAEO;IAAiB,CAAC,GAAGvB,YAAY,CAACgB,KAAK,CAAC;IAChD,MAAM;MAAEQ;IAAe,CAAC,GAAGtB,UAAU,CAACc,KAAK,CAAC;IAE5CpB,eAAe,CAAC;MACd6B,IAAI,EAAE;QACJC,MAAM,EAAE,MAAM;QACdC,KAAK,EAAEpB,KAAK,CAACS,KAAK,EAAE,OAAO,CAAC;QAC5BY,OAAO,EAAErB,KAAK,CAACS,KAAK,EAAE,SAAS,CAAC;QAChCa,IAAI,EAAE,IAAI;QACVC,OAAO,EAAEvB,KAAK,CAACS,KAAK,EAAE,SAAS;MACjC;IACF,CAAC,CAAC;IAEFN,SAAS,CAAC,MAAM;MACd,OAAAqB,YAAA,CAAAf,KAAA,CAAAgB,GAAA;QAAA,SAEW,CACL,aAAa,EACb;UACE,sBAAsB,EAAEhB,KAAK,CAACJ;QAChC,CAAC,EACDQ,YAAY,CAACa,KAAK,EAClBX,aAAa,CAACW,KAAK,EACnBZ,cAAc,CAACY,KAAK,EACpBV,gBAAgB,CAACU,KAAK,EACtBT,cAAc,CAACS,KAAK,EACpBjB,KAAK,CAACkB,KAAK,CACZ;QAAA,SACOlB,KAAK,CAACmB;MAAK,GACThB,KAAK;IAGrB,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}

View File

@ -0,0 +1,51 @@
@use 'sass:selector'
@use '../../styles/tools'
@use '../VBtn/variables' as *
@use './variables' as *
.v-btn-group
$root: &
display: inline-flex
flex-wrap: nowrap
max-width: 100%
min-width: 0
overflow: hidden
vertical-align: middle
@include tools.border($btn-group-border...)
@include tools.elevation($btn-group-elevation)
@include tools.rounded($btn-group-border-radius)
@include tools.theme($btn-group-theme...)
@at-root
@include tools.density('v-btn-group', $button-density) using ($modifier)
@at-root #{selector.append(&, $root)}
height: $btn-group-height + $modifier
.v-btn
border-radius: 0
border-color: inherit
&:not(:last-child)
border-inline-end: none
&:not(:first-child)
border-inline-start: none
&:first-child
border-start-start-radius: inherit
border-end-start-radius: inherit
&:last-child
border-start-end-radius: inherit
border-end-end-radius: inherit
&--divided
.v-btn:not(:last-child)
border-inline-end-width: $btn-group-border-thin-width
border-inline-end-style: $btn-group-border-style
border-inline-end-color: $btn-group-border-color
&--tile
@include tools.rounded($btn-group-tile-border-radius)

View File

@ -0,0 +1,27 @@
@use '../../styles/settings';
@use '../../styles/tools';
// VBtnGroup
$btn-group-background: transparent !default;
$btn-group-border-color: settings.$border-color-root !default;
$btn-group-border-radius: settings.$border-radius-root !default;
$btn-group-border-style: settings.$border-style-root !default;
$btn-group-border-thin-width: thin !default;
$btn-group-border-width: 0 !default;
$btn-group-color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !default;
$btn-group-height: 48px !default;
$btn-group-elevation: 0 !default;
$btn-group-tile-border-radius: 0 !default;
// Lists
$btn-group-border: (
$btn-group-border-color,
$btn-group-border-style,
$btn-group-border-width,
$btn-group-border-thin-width
) !default;
$btn-group-theme: (
$btn-group-background,
$btn-group-color
) !default;

View File

@ -0,0 +1,206 @@
import * as vue from 'vue';
import { ComponentPropsOptions, ExtractPropTypes } from 'vue';
interface FilterPropsOptions<PropsOptions extends Readonly<ComponentPropsOptions>, Props = ExtractPropTypes<PropsOptions>> {
filterProps<T extends Partial<Props>, U extends Exclude<keyof Props, Exclude<keyof Props, keyof T>>>(props: T): Partial<Pick<T, U>>;
}
type Density = null | 'default' | 'comfortable' | 'compact';
declare const VBtnGroup: {
new (...args: any[]): vue.CreateComponentPublicInstance<{
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
style: vue.StyleValue;
tag: string;
density: Density;
divided: boolean;
} & {
border?: string | number | boolean | undefined;
color?: string | undefined;
class?: any;
elevation?: string | number | undefined;
theme?: string | undefined;
rounded?: string | number | boolean | undefined;
} & {
$children?: vue.VNodeChild | (() => vue.VNodeChild) | {
default?: (() => vue.VNodeChild) | undefined;
};
'v-slots'?: {
default?: false | (() => vue.VNodeChild) | undefined;
} | undefined;
} & {
"v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
}, void, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
style: vue.StyleValue;
tag: string;
density: Density;
divided: boolean;
} & {
border?: string | number | boolean | undefined;
color?: string | undefined;
class?: any;
elevation?: string | number | undefined;
theme?: string | undefined;
rounded?: string | number | boolean | undefined;
} & {
$children?: vue.VNodeChild | (() => vue.VNodeChild) | {
default?: (() => vue.VNodeChild) | undefined;
};
'v-slots'?: {
default?: false | (() => vue.VNodeChild) | undefined;
} | undefined;
} & {
"v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
}, {
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
style: vue.StyleValue;
tag: string;
rounded: string | number | boolean;
density: Density;
divided: boolean;
}, true, {}, vue.SlotsType<Partial<{
default: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}>>, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, {
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
style: vue.StyleValue;
tag: string;
density: Density;
divided: boolean;
} & {
border?: string | number | boolean | undefined;
color?: string | undefined;
class?: any;
elevation?: string | number | undefined;
theme?: string | undefined;
rounded?: string | number | boolean | undefined;
} & {
$children?: vue.VNodeChild | (() => vue.VNodeChild) | {
default?: (() => vue.VNodeChild) | undefined;
};
'v-slots'?: {
default?: false | (() => vue.VNodeChild) | undefined;
} | undefined;
} & {
"v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
}, {}, {}, {}, {}, {
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
style: vue.StyleValue;
tag: string;
rounded: string | number | boolean;
density: Density;
divided: boolean;
}>;
__isFragment?: undefined;
__isTeleport?: undefined;
__isSuspense?: undefined;
} & vue.ComponentOptionsBase<{
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
style: vue.StyleValue;
tag: string;
density: Density;
divided: boolean;
} & {
border?: string | number | boolean | undefined;
color?: string | undefined;
class?: any;
elevation?: string | number | undefined;
theme?: string | undefined;
rounded?: string | number | boolean | undefined;
} & {
$children?: vue.VNodeChild | (() => vue.VNodeChild) | {
default?: (() => vue.VNodeChild) | undefined;
};
'v-slots'?: {
default?: false | (() => vue.VNodeChild) | undefined;
} | undefined;
} & {
"v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
}, void, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
style: vue.StyleValue;
tag: string;
rounded: string | number | boolean;
density: Density;
divided: boolean;
}, {}, string, vue.SlotsType<Partial<{
default: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
color: StringConstructor;
variant: {
type: vue.PropType<"flat" | "text" | "elevated" | "tonal" | "outlined" | "plain">;
default: string;
validator: (v: any) => boolean;
};
theme: StringConstructor;
tag: {
type: StringConstructor;
default: string;
};
rounded: {
type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
default: undefined;
};
elevation: {
type: (StringConstructor | NumberConstructor)[];
validator(v: any): boolean;
};
density: {
type: vue.PropType<Density>;
default: string;
validator: (v: any) => boolean;
};
class: vue.PropType<any>;
style: {
type: vue.PropType<vue.StyleValue>;
default: null;
};
border: (StringConstructor | BooleanConstructor | NumberConstructor)[];
divided: BooleanConstructor;
}, vue.ExtractPropTypes<{
color: StringConstructor;
variant: {
type: vue.PropType<"flat" | "text" | "elevated" | "tonal" | "outlined" | "plain">;
default: string;
validator: (v: any) => boolean;
};
theme: StringConstructor;
tag: {
type: StringConstructor;
default: string;
};
rounded: {
type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
default: undefined;
};
elevation: {
type: (StringConstructor | NumberConstructor)[];
validator(v: any): boolean;
};
density: {
type: vue.PropType<Density>;
default: string;
validator: (v: any) => boolean;
};
class: vue.PropType<any>;
style: {
type: vue.PropType<vue.StyleValue>;
default: null;
};
border: (StringConstructor | BooleanConstructor | NumberConstructor)[];
divided: BooleanConstructor;
}>>;
type VBtnGroup = InstanceType<typeof VBtnGroup>;
export { VBtnGroup };

View File

@ -0,0 +1,2 @@
export { VBtnGroup } from "./VBtnGroup.mjs";
//# sourceMappingURL=index.mjs.map

View File

@ -0,0 +1 @@
{"version":3,"file":"index.mjs","names":["VBtnGroup"],"sources":["../../../src/components/VBtnGroup/index.ts"],"sourcesContent":["export { VBtnGroup } from './VBtnGroup'\n"],"mappings":"SAASA,SAAS"}