Tracking de l'application VApp (IHM du jeu)

VApp/node_modules/vuetify/lib/components/VTabs/VTab.css

@@ -0,0 +1,30 @@
+.v-tab.v-tab.v-btn {
+  height: var(--v-tabs-height);
+  border-radius: 0;
+  min-width: 90px;
+}
+.v-slide-group--horizontal .v-tab {
+  max-width: 360px;
+}
+.v-slide-group--vertical .v-tab {
+  justify-content: start;
+}
+
+.v-tab__slider {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  height: 2px;
+  width: 100%;
+  background: currentColor;
+  pointer-events: none;
+  opacity: 0;
+}
+.v-tab--selected .v-tab__slider {
+  opacity: 1;
+}
+.v-slide-group--vertical .v-tab__slider {
+  top: 0;
+  height: 100%;
+  width: 2px;
+}

VApp/node_modules/vuetify/lib/components/VTabs/VTab.mjs

@@ -0,0 +1,101 @@
+import { mergeProps as _mergeProps, createVNode as _createVNode, Fragment as _Fragment } from "vue";
+// Styles
+import "./VTab.css";
+
+// Components
+import { makeVBtnProps, VBtn } from "../VBtn/VBtn.mjs"; // Composables
+import { useTextColor } from "../../composables/color.mjs";
+import { forwardRefs } from "../../composables/forwardRefs.mjs"; // Utilities
+import { computed, ref } from 'vue';
+import { VTabsSymbol } from "./shared.mjs";
+import { animate, genericComponent, omit, propsFactory, standardEasing, useRender } from "../../util/index.mjs"; // Types
+export const makeVTabProps = propsFactory({
+  fixed: Boolean,
+  sliderColor: String,
+  hideSlider: Boolean,
+  direction: {
+    type: String,
+    default: 'horizontal'
+  },
+  ...omit(makeVBtnProps({
+    selectedClass: 'v-tab--selected',
+    variant: 'text'
+  }), ['active', 'block', 'flat', 'location', 'position', 'symbol'])
+}, 'VTab');
+export const VTab = genericComponent()({
+  name: 'VTab',
+  props: makeVTabProps(),
+  setup(props, _ref) {
+    let {
+      slots,
+      attrs
+    } = _ref;
+    const {
+      textColorClasses: sliderColorClasses,
+      textColorStyles: sliderColorStyles
+    } = useTextColor(props, 'sliderColor');
+    const rootEl = ref();
+    const sliderEl = ref();
+    const isHorizontal = computed(() => props.direction === 'horizontal');
+    const isSelected = computed(() => rootEl.value?.group?.isSelected.value ?? false);
+    function updateSlider(_ref2) {
+      let {
+        value
+      } = _ref2;
+      if (value) {
+        const prevEl = rootEl.value?.$el.parentElement?.querySelector('.v-tab--selected .v-tab__slider');
+        const nextEl = sliderEl.value;
+        if (!prevEl || !nextEl) return;
+        const color = getComputedStyle(prevEl).color;
+        const prevBox = prevEl.getBoundingClientRect();
+        const nextBox = nextEl.getBoundingClientRect();
+        const xy = isHorizontal.value ? 'x' : 'y';
+        const XY = isHorizontal.value ? 'X' : 'Y';
+        const rightBottom = isHorizontal.value ? 'right' : 'bottom';
+        const widthHeight = isHorizontal.value ? 'width' : 'height';
+        const prevPos = prevBox[xy];
+        const nextPos = nextBox[xy];
+        const delta = prevPos > nextPos ? prevBox[rightBottom] - nextBox[rightBottom] : prevBox[xy] - nextBox[xy];
+        const origin = Math.sign(delta) > 0 ? isHorizontal.value ? 'right' : 'bottom' : Math.sign(delta) < 0 ? isHorizontal.value ? 'left' : 'top' : 'center';
+        const size = Math.abs(delta) + (Math.sign(delta) < 0 ? prevBox[widthHeight] : nextBox[widthHeight]);
+        const scale = size / Math.max(prevBox[widthHeight], nextBox[widthHeight]) || 0;
+        const initialScale = prevBox[widthHeight] / nextBox[widthHeight] || 0;
+        const sigma = 1.5;
+        animate(nextEl, {
+          backgroundColor: [color, 'currentcolor'],
+          transform: [`translate${XY}(${delta}px) scale${XY}(${initialScale})`, `translate${XY}(${delta / sigma}px) scale${XY}(${(scale - 1) / sigma + 1})`, 'none'],
+          transformOrigin: Array(3).fill(origin)
+        }, {
+          duration: 225,
+          easing: standardEasing
+        });
+      }
+    }
+    useRender(() => {
+      const btnProps = VBtn.filterProps(props);
+      return _createVNode(VBtn, _mergeProps({
+        "symbol": VTabsSymbol,
+        "ref": rootEl,
+        "class": ['v-tab', props.class],
+        "style": props.style,
+        "tabindex": isSelected.value ? 0 : -1,
+        "role": "tab",
+        "aria-selected": String(isSelected.value),
+        "active": false
+      }, btnProps, attrs, {
+        "block": props.fixed,
+        "maxWidth": props.fixed ? 300 : undefined,
+        "onGroup:selected": updateSlider
+      }), {
+        ...slots,
+        default: () => _createVNode(_Fragment, null, [slots.default?.() ?? props.text, !props.hideSlider && _createVNode("div", {
+          "ref": sliderEl,
+          "class": ['v-tab__slider', sliderColorClasses.value],
+          "style": sliderColorStyles.value
+        }, null)])
+      });
+    });
+    return forwardRefs({}, rootEl);
+  }
+});
+//# sourceMappingURL=VTab.mjs.map

VApp/node_modules/vuetify/lib/components/VTabs/VTab.sass

@@ -0,0 +1,32 @@
+@use './variables' as *
+
+.v-tab
+  // override v-btn size specificity
+  &.v-tab.v-btn
+    height: var(--v-tabs-height)
+    border-radius: $tab-border-radius
+    min-width: $tab-min-width
+
+  .v-slide-group--horizontal &
+    max-width: $tab-max-width
+
+  .v-slide-group--vertical &
+    justify-content: start
+
+.v-tab__slider
+  position: absolute
+  bottom: 0
+  left: 0
+  height: $tab-slider-size
+  width: 100%
+  background: currentColor
+  pointer-events: none
+  opacity: 0
+
+  .v-tab--selected &
+    opacity: 1
+
+  .v-slide-group--vertical &
+    top: 0
+    height: 100%
+    width: $tab-slider-size

VApp/node_modules/vuetify/lib/components/VTabs/VTabs.css

@@ -0,0 +1,67 @@
+.v-tabs {
+  display: flex;
+  height: var(--v-tabs-height);
+}
+.v-tabs--density-default {
+  --v-tabs-height: 48px;
+}
+.v-tabs--density-default.v-tabs--stacked {
+  --v-tabs-height: 72px;
+}
+
+.v-tabs--density-comfortable {
+  --v-tabs-height: 44px;
+}
+.v-tabs--density-comfortable.v-tabs--stacked {
+  --v-tabs-height: 68px;
+}
+
+.v-tabs--density-compact {
+  --v-tabs-height: 36px;
+}
+.v-tabs--density-compact.v-tabs--stacked {
+  --v-tabs-height: 60px;
+}
+
+.v-tabs.v-slide-group--vertical {
+  height: auto;
+  flex: none;
+  --v-tabs-height: 48px;
+}
+
+.v-tabs--align-tabs-title:not(.v-slide-group--has-affixes) .v-tab:first-child {
+  margin-inline-start: 42px;
+}
+
+.v-tabs--fixed-tabs .v-slide-group__content > *:last-child,
+.v-tabs--align-tabs-center .v-slide-group__content > *:last-child {
+  margin-inline-end: auto;
+}
+.v-tabs--fixed-tabs .v-slide-group__content > *:first-child,
+.v-tabs--align-tabs-center .v-slide-group__content > *:first-child {
+  margin-inline-start: auto;
+}
+
+.v-tabs--grow {
+  flex-grow: 1;
+}
+.v-tabs--grow .v-tab {
+  flex: 1 0 auto;
+  max-width: none;
+}
+
+.v-tabs--align-tabs-end .v-tab:first-child {
+  margin-inline-start: auto;
+}
+.v-tabs--align-tabs-end .v-tab:last-child {
+  margin-inline-end: 0;
+}
+
+@media (max-width: 1279.98px) {
+  .v-tabs.v-slide-group--is-overflowing.v-slide-group--horizontal:not(.v-slide-group--has-affixes) .v-tab:first-child {
+    margin-inline-start: 52px;
+  }
+  .v-tabs.v-slide-group--is-overflowing.v-slide-group--horizontal:not(.v-slide-group--has-affixes) .v-tab:last-child {
+    margin-inline-end: 52px;
+  }
+}

VApp/node_modules/vuetify/lib/components/VTabs/VTabs.mjs

@@ -0,0 +1,105 @@
+import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
+// Styles
+import "./VTabs.css";
+
+// Components
+import { VTab } from "./VTab.mjs";
+import { makeVSlideGroupProps, VSlideGroup } from "../VSlideGroup/VSlideGroup.mjs"; // Composables
+import { useBackgroundColor } from "../../composables/color.mjs";
+import { provideDefaults } from "../../composables/defaults.mjs";
+import { makeDensityProps, useDensity } from "../../composables/density.mjs";
+import { useProxiedModel } from "../../composables/proxiedModel.mjs";
+import { makeTagProps } from "../../composables/tag.mjs"; // Utilities
+import { computed, toRef } from 'vue';
+import { convertToUnit, genericComponent, isObject, propsFactory, useRender } from "../../util/index.mjs"; // Types
+import { VTabsSymbol } from "./shared.mjs";
+function parseItems(items) {
+  if (!items) return [];
+  return items.map(item => {
+    if (!isObject(item)) return {
+      text: item,
+      value: item
+    };
+    return item;
+  });
+}
+export const makeVTabsProps = propsFactory({
+  alignTabs: {
+    type: String,
+    default: 'start'
+  },
+  color: String,
+  fixedTabs: Boolean,
+  items: {
+    type: Array,
+    default: () => []
+  },
+  stacked: Boolean,
+  bgColor: String,
+  grow: Boolean,
+  height: {
+    type: [Number, String],
+    default: undefined
+  },
+  hideSlider: Boolean,
+  sliderColor: String,
+  ...makeVSlideGroupProps({
+    mandatory: 'force'
+  }),
+  ...makeDensityProps(),
+  ...makeTagProps()
+}, 'VTabs');
+export const VTabs = genericComponent()({
+  name: 'VTabs',
+  props: makeVTabsProps(),
+  emits: {
+    'update:modelValue': v => true
+  },
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const model = useProxiedModel(props, 'modelValue');
+    const parsedItems = computed(() => parseItems(props.items));
+    const {
+      densityClasses
+    } = useDensity(props);
+    const {
+      backgroundColorClasses,
+      backgroundColorStyles
+    } = useBackgroundColor(toRef(props, 'bgColor'));
+    provideDefaults({
+      VTab: {
+        color: toRef(props, 'color'),
+        direction: toRef(props, 'direction'),
+        stacked: toRef(props, 'stacked'),
+        fixed: toRef(props, 'fixedTabs'),
+        sliderColor: toRef(props, 'sliderColor'),
+        hideSlider: toRef(props, 'hideSlider')
+      }
+    });
+    useRender(() => {
+      const slideGroupProps = VSlideGroup.filterProps(props);
+      return _createVNode(VSlideGroup, _mergeProps(slideGroupProps, {
+        "modelValue": model.value,
+        "onUpdate:modelValue": $event => model.value = $event,
+        "class": ['v-tabs', `v-tabs--${props.direction}`, `v-tabs--align-tabs-${props.alignTabs}`, {
+          'v-tabs--fixed-tabs': props.fixedTabs,
+          'v-tabs--grow': props.grow,
+          'v-tabs--stacked': props.stacked
+        }, densityClasses.value, backgroundColorClasses.value, props.class],
+        "style": [{
+          '--v-tabs-height': convertToUnit(props.height)
+        }, backgroundColorStyles.value, props.style],
+        "role": "tablist",
+        "symbol": VTabsSymbol
+      }), {
+        default: () => [slots.default ? slots.default() : parsedItems.value.map(item => _createVNode(VTab, _mergeProps(item, {
+          "key": item.text
+        }), null))]
+      });
+    });
+    return {};
+  }
+});
+//# sourceMappingURL=VTabs.mjs.map

VApp/node_modules/vuetify/lib/components/VTabs/VTabs.sass

@@ -0,0 +1,54 @@
+@use 'sass:math'
+@use 'sass:map'
+@use '../../styles/settings'
+@use '../../styles/tools'
+@use './variables' as *
+
+.v-tabs
+  display: flex
+  height: var(--v-tabs-height)
+
+  @at-root
+    @include tools.density('v-tabs', $tabs-density) using ($modifier)
+      --v-tabs-height: #{$tabs-height + $modifier}
+
+      &.v-tabs--stacked
+        --v-tabs-height: #{$tabs-stacked-height + $modifier}
+
+  &.v-slide-group--vertical
+    height: auto
+    flex: none
+    --v-tabs-height: #{$tabs-height}
+
+.v-tabs--align-tabs-title:not(.v-slide-group--has-affixes)
+  .v-tab:first-child
+    margin-inline-start: $tab-align-tabs-title-margin
+
+.v-tabs--fixed-tabs,
+.v-tabs--align-tabs-center
+  .v-slide-group__content > *:last-child
+    margin-inline-end: auto
+
+  .v-slide-group__content > *:first-child
+    margin-inline-start: auto
+
+.v-tabs--grow
+  flex-grow: 1
+
+  .v-tab
+    flex: 1 0 auto
+    max-width: none
+
+.v-tabs--align-tabs-end
+  .v-tab:first-child
+    margin-inline-start: auto
+
+  .v-tab:last-child
+    margin-inline-end: 0
+
+@media #{map-get(settings.$display-breakpoints, 'md-and-down')}
+  .v-tabs.v-slide-group--is-overflowing.v-slide-group--horizontal:not(.v-slide-group--has-affixes)
+    .v-tab:first-child
+      margin-inline-start: 52px
+    .v-tab:last-child
+      margin-inline-end: 52px

VApp/node_modules/vuetify/lib/components/VTabs/_variables.scss

@@ -0,0 +1,14 @@
+@use 'sass:math';
+@use 'sass:map';
+
+// VTabs
+$tabs-density: ( 'default': 0, 'comfortable' : -1, 'compact': -3) !default;
+$tabs-height: 48px !default;
+$tabs-stacked-height: 72px !default;
+
+// VTab
+$tab-align-tabs-title-margin: 42px !default;
+$tab-border-radius: 0 !default;
+$tab-max-width: 360px !default;
+$tab-min-width: 90px !default;
+$tab-slider-size: 2px !default;

VApp/node_modules/vuetify/lib/components/VTabs/index.mjs

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

VApp/node_modules/vuetify/lib/components/VTabs/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["VTabs","VTab"],"sources":["../../../src/components/VTabs/index.ts"],"sourcesContent":["export { VTabs } from './VTabs'\nexport { VTab } from './VTab'\n"],"mappings":"SAASA,KAAK;AAAA,SACLC,IAAI"}

VApp/node_modules/vuetify/lib/components/VTabs/shared.mjs

@@ -0,0 +1,4 @@
+// Types
+
+export const VTabsSymbol = Symbol.for('vuetify:v-tabs');
+//# sourceMappingURL=shared.mjs.map

VApp/node_modules/vuetify/lib/components/VTabs/shared.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"shared.mjs","names":["VTabsSymbol","Symbol","for"],"sources":["../../../src/components/VTabs/shared.ts"],"sourcesContent":["// Types\nimport type { InjectionKey } from 'vue'\nimport type { GroupProvide } from '@/composables/group'\n\nexport const VTabsSymbol: InjectionKey<GroupProvide> = Symbol.for('vuetify:v-tabs')\n"],"mappings":"AAAA;;AAIA,OAAO,MAAMA,WAAuC,GAAGC,MAAM,CAACC,GAAG,CAAC,gBAAgB,CAAC"}