Reorganized components

src/App.vue

@@ -11,11 +11,11 @@
 
 <script setup lang="ts">
 import { computed, toRef, unref } from "vue";
-import Game from "./components/system/Game.vue";
-import GameOverScreen from "./components/system/GameOverScreen.vue";
-import NaNScreen from "./components/system/NaNScreen.vue";
-import Nav from "./components/system/Nav.vue";
-import TPS from "./components/system/TPS.vue";
+import Game from "./components/Game.vue";
+import GameOverScreen from "./components/GameOverScreen.vue";
+import NaNScreen from "./components/NaNScreen.vue";
+import Nav from "./components/Nav.vue";
+import TPS from "./components/TPS.vue";
 import modInfo from "./data/modInfo.json";
 import themes from "./data/themes";
 import settings from "./game/settings";

src/components/GameOverScreen.vue

@@ -36,7 +36,7 @@
 </template>
 
 <script setup lang="ts">
-import Modal from "@/components/system/Modal.vue";
+import Modal from "@/components/Modal.vue";
 import { hasWon } from "@/data/mod";
 import modInfo from "@/data/modInfo.json";
 import player from "@/game/player";

src/components/Info.vue

@@ -48,13 +48,12 @@
 </template>
 
 <script setup lang="ts">
-import Modal from "@/components/system/Modal.vue";
+import Modal from "@/components/Modal.vue";
 import type Changelog from "@/data/Changelog.vue";
 import modInfo from "@/data/modInfo.json";
 import player from "@/game/player";
 import { formatTime } from "@/util/bignum";
 import { computed, ref, toRefs, unref } from "vue";
-import Profectus from "./Profectus.vue";
 
 const { title, logo, author, discordName, discordLink, versionNumber, versionTitle } = modInfo;
 

src/components/Layer.vue

@@ -21,7 +21,7 @@
 </template>
 
 <script lang="ts">
-import Links from "@/components/system/Links.vue";
+import Links from "@/components/links/Links.vue";
 import modInfo from "@/data/modInfo.json";
 import { CoercableComponent, PersistentRef, StyleValue } from "@/features/feature";
 import { Link } from "@/features/links";

src/components/Modal.vue

@@ -42,7 +42,7 @@
 <script setup lang="ts">
 import { Link } from "@/features/links";
 import { computed, ref, toRefs } from "vue";
-import Links from "./Links.vue";
+import Links from "./links/Links.vue";
 
 const _props = defineProps<{
     modelValue: boolean;

src/components/NaNScreen.vue

@@ -43,13 +43,13 @@
 </template>
 
 <script setup lang="ts">
-import Modal from "@/components/system/Modal.vue";
+import Modal from "@/components/Modal.vue";
 import modInfo from "@/data/modInfo.json";
 import player from "@/game/player";
 import state from "@/game/state";
 import Decimal, { DecimalSource, format } from "@/util/bignum";
 import { ComponentPublicInstance, computed, ref, toRef } from "vue";
-import Toggle from "../fields/Toggle.vue";
+import Toggle from "./fields/Toggle.vue";
 import SavesManager from "./SavesManager.vue";
 
 const { discordName, discordLink } = modInfo;

src/components/Options.vue

@@ -19,15 +19,15 @@
 </template>
 
 <script setup lang="tsx">
-import Modal from "@/components/system/Modal.vue";
+import Modal from "@/components/Modal.vue";
 import rawThemes from "@/data/themes";
-import { MilestoneDisplay } from "@/features/milestone";
+import { MilestoneDisplay } from "@/features/milestones/milestone";
 import player from "@/game/player";
 import settings from "@/game/settings";
 import { camelToTitle } from "@/util/common";
 import { computed, ref, toRefs } from "vue";
-import Toggle from "../fields/Toggle.vue";
-import Select from "../fields/Select.vue";
+import Toggle from "./fields/Toggle.vue";
+import Select from "./fields/Select.vue";
 import Tooltip from "./Tooltip.vue";
 import { jsx } from "@/features/feature";
 

src/components/Save.vue

@@ -51,16 +51,18 @@
         <div class="details" v-else-if="save.error == undefined && isEditing">
             <Text v-model="newName" class="editname" @submit="changeName" />
         </div>
-        <div v-else class="details error">Error: Failed to load save with id {{ save.id }}<br/>{{ save.error }}</div>
+        <div v-else class="details error">
+            Error: Failed to load save with id {{ save.id }}<br />{{ save.error }}
+        </div>
     </div>
 </template>
 
 <script setup lang="ts">
 import player from "@/game/player";
 import { computed, ref, toRefs, watch } from "vue";
-import DangerButton from "../fields/DangerButton.vue";
-import FeedbackButton from "../fields/FeedbackButton.vue";
-import Text from "../fields/Text.vue";
+import DangerButton from "./fields/DangerButton.vue";
+import FeedbackButton from "./fields/FeedbackButton.vue";
+import Text from "./fields/Text.vue";
 import { LoadablePlayerData } from "./SavesManager.vue";
 
 const _props = defineProps<{

src/components/SavesManager.vue

@@ -57,7 +57,7 @@
 </template>
 
 <script setup lang="ts">
-import Modal from "@/components/system/Modal.vue";
+import Modal from "@/components/Modal.vue";
 import player, { PlayerData } from "@/game/player";
 import settings from "@/game/settings";
 import { getUniqueID, loadSave, save, newSave } from "@/util/save";
@@ -70,8 +70,8 @@ import {
     unref,
     watch
 } from "vue";
-import Select from "../fields/Select.vue";
-import Text from "../fields/Text.vue";
+import Select from "./fields/Select.vue";
+import Text from "./fields/Text.vue";
 import Save from "./Save.vue";
 import Draggable from "vuedraggable";
 
@@ -117,7 +117,7 @@ watch(saveToImport, save => {
     }
 });
 
-let bankContext = require.context("raw-loader!../../../saves", true, /\.txt$/);
+let bankContext = require.context("raw-loader!../../saves", true, /\.txt$/);
 let bank = ref(
     bankContext.keys().reduce((acc: Array<{ label: string; value: string }>, curr) => {
         // .slice(2, -4) strips the leading ./ and the trailing .txt

src/components/fields/Slider.vue

@@ -9,7 +9,7 @@
 
 <script setup lang="ts">
 import { computed, toRefs, unref } from "vue";
-import Tooltip from "../system/Tooltip.vue";
+import Tooltip from "../Tooltip.vue";
 import "@/components/common/fields.css";
 
 const _props = defineProps<{

src/data/Changelog.vue

@@ -19,7 +19,7 @@
 </template>
 
 <script setup lang="ts">
-import Modal from "@/components/system/Modal.vue";
+import Modal from "@/components/Modal.vue";
 import { ref } from "vue";
 
 const isOpen = ref(false);

src/data/common.tsx

@@ -3,17 +3,17 @@ import {
     ClickableOptions,
     createClickable,
     GenericClickable
-} from "@/features/clickable";
+} from "@/features/clickables/clickable";
 import { GenericConversion } from "@/features/conversion";
 import { CoercableComponent, jsx, Replace, setDefault } from "@/features/feature";
-import { displayResource } from "@/features/resource";
+import { displayResource } from "@/features/resources/resource";
 import {
     createTreeNode,
     GenericTree,
     GenericTreeNode,
     TreeNode,
     TreeNodeOptions
-} from "@/features/tree";
+} from "@/features/trees/tree";
 import player from "@/game/player";
 import Decimal from "@/util/bignum";
 import {

src/data/layers/aca/a.tsx

@@ -1,11 +1,11 @@
-import Row from "@/components/system/Row.vue";
-import Tooltip from "@/components/system/Tooltip.vue";
+import Row from "@/components/layout/Row.vue";
+import Tooltip from "@/components/Tooltip.vue";
 import { main } from "@/data/mod";
-import { createAchievement } from "@/features/achievement";
+import { createAchievement } from "@/features/achievements/achievement";
 import { jsx } from "@/features/feature";
-import { createGrid } from "@/features/grid";
-import { createResource } from "@/features/resource";
-import { createTreeNode } from "@/features/tree";
+import { createGrid } from "@/features/grids/grid";
+import { createResource } from "@/features/resources/resource";
+import { createTreeNode } from "@/features/trees/tree";
 import { createLayer } from "@/game/layers";
 import { DecimalSource } from "@/lib/break_eternity";
 import Decimal from "@/util/bignum";

src/data/layers/aca/c.tsx

@@ -1,21 +1,19 @@
-import MainDisplay from "@/components/features/MainDisplay.vue";
 import Slider from "@/components/fields/Slider.vue";
 import Text from "@/components/fields/Text.vue";
 import Toggle from "@/components/fields/Toggle.vue";
-import Column from "@/components/system/Column.vue";
-import Modal from "@/components/system/Modal.vue";
-import Resource from "@/components/system/Resource.vue";
-import Row from "@/components/system/Row.vue";
-import Spacer from "@/components/system/Spacer.vue";
-import Sticky from "@/components/system/Sticky.vue";
-import VerticalRule from "@/components/system/VerticalRule.vue";
+import Column from "@/components/layout/Column.vue";
+import Row from "@/components/layout/Row.vue";
+import Spacer from "@/components/layout/Spacer.vue";
+import Sticky from "@/components/layout/Sticky.vue";
+import VerticalRule from "@/components/layout/VerticalRule.vue";
+import Modal from "@/components/Modal.vue";
 import { createLayerTreeNode, createResetButton } from "@/data/common";
 import { main } from "@/data/mod";
 import themes from "@/data/themes";
-import { createBar, Direction } from "@/features/bar";
+import { createBar, Direction } from "@/features/bars/bar";
 import { createBuyable } from "@/features/buyable";
-import { createChallenge } from "@/features/challenge";
-import { createClickable } from "@/features/clickable";
+import { createChallenge } from "@/features/challenges/challenge";
+import { createClickable } from "@/features/clickables/clickable";
 import {
     addSoftcap,
     createCumulativeConversion,
@@ -23,14 +21,16 @@ import {
 } from "@/features/conversion";
 import { jsx, persistent, showIf, Visibility } from "@/features/feature";
 import { createHotkey } from "@/features/hotkey";
-import { createInfobox } from "@/features/infobox";
-import { createMilestone } from "@/features/milestone";
+import { createInfobox } from "@/features/infoboxes/infobox";
+import { createMilestone } from "@/features/milestones/milestone";
 import { createReset } from "@/features/reset";
-import { createResource, displayResource, trackBest } from "@/features/resource";
-import { createTab } from "@/features/tab";
-import { createTabButton, createTabFamily } from "@/features/tabFamily";
-import { createTree, createTreeNode, GenericTreeNode, TreeBranch } from "@/features/tree";
-import { createUpgrade } from "@/features/upgrade";
+import MainDisplay from "@/features/resources/MainDisplay.vue";
+import { createResource, displayResource, trackBest } from "@/features/resources/resource";
+import Resource from "@/features/resources/Resource.vue";
+import { createTab } from "@/features/tabs/tab";
+import { createTabButton, createTabFamily } from "@/features/tabs/tabFamily";
+import { createTree, createTreeNode, GenericTreeNode, TreeBranch } from "@/features/trees/tree";
+import { createUpgrade } from "@/features/upgrades/upgrade";
 import { createLayer } from "@/game/layers";
 import settings from "@/game/settings";
 import { DecimalSource } from "@/lib/break_eternity";
@@ -121,12 +121,14 @@ const layer = createLayer(() => {
             return showIf(Decimal.gt(best.value, 0));
         },
         goal: 20,
-        reset,
         resource: main.points,
         onComplete() {
             console.log("hiii");
         },
         onEnter() {
+            main.points.value = 0;
+            main.best.value = main.points.value;
+            main.total.value = main.points.value;
             console.log("So challenging");
         },
         onExit() {

src/data/layers/aca/f.tsx

@@ -1,12 +1,12 @@
-import MainDisplay from "@/components/features/MainDisplay.vue";
 import { createLayerTreeNode, createResetButton } from "@/data/common";
 import { main } from "@/data/mod";
-import { createClickable } from "@/features/clickable";
+import { createClickable } from "@/features/clickables/clickable";
 import { createExponentialScaling, createIndependentConversion } from "@/features/conversion";
 import { jsx, persistent } from "@/features/feature";
-import { createInfobox } from "@/features/infobox";
+import { createInfobox } from "@/features/infoboxes/infobox";
 import { createReset } from "@/features/reset";
-import { createResource, displayResource } from "@/features/resource";
+import MainDisplay from "@/features/resources/MainDisplay.vue";
+import { createResource, displayResource } from "@/features/resources/resource";
 import { createLayer } from "@/game/layers";
 import Decimal, { DecimalSource, formatWhole } from "@/util/bignum";
 import { render } from "@/util/vue";

src/data/mod.tsx

@@ -1,9 +1,9 @@
-import Modal from "@/components/system/Modal.vue";
-import Profectus from "@/components/system/Profectus.vue";
-import Spacer from "@/components/system/Spacer.vue";
+import Modal from "@/components/Modal.vue";
+import Profectus from "@/components/Profectus.vue";
+import Spacer from "@/components/layout/Spacer.vue";
 import { jsx } from "@/features/feature";
-import { createResource, trackBest, trackOOMPS, trackTotal } from "@/features/resource";
-import { branchedResetPropagation, createTree, GenericTree } from "@/features/tree";
+import { createResource, trackBest, trackOOMPS, trackTotal } from "@/features/resources/resource";
+import { branchedResetPropagation, createTree, GenericTree } from "@/features/trees/tree";
 import { globalBus } from "@/game/events";
 import { createLayer, GenericLayer } from "@/game/layers";
 import player, { PlayerData } from "@/game/player";

src/features/achievements/Achievement.vue

@@ -26,9 +26,9 @@
 import { CoercableComponent, Visibility } from "@/features/feature";
 import { computeOptionalComponent, processedPropType } from "@/util/vue";
 import { defineComponent, StyleValue, toRefs, unref } from "vue";
-import Tooltip from "@/components/system/Tooltip.vue";
-import LinkNode from "../system/LinkNode.vue";
-import MarkNode from "./MarkNode.vue";
+import Tooltip from "@/components/Tooltip.vue";
+import LinkNode from "@/components/links/LinkNode.vue";
+import MarkNode from "@/components/MarkNode.vue";
 import "@/components/common/features.css";
 
 export default defineComponent({

src/features/achievements/achievement.tsx

@@ -1,4 +1,4 @@
-import AchievementComponent from "@/components/features/Achievement.vue";
+import AchievementComponent from "@/features/achievements/Achievement.vue";
 import {
     CoercableComponent,
     Component,

src/features/bars/Bar.vue

@@ -45,13 +45,13 @@
 </template>
 
 <script lang="ts">
-import { Direction } from "@/features/bar";
+import { Direction } from "./bar";
 import { CoercableComponent, Visibility } from "@/features/feature";
 import Decimal, { DecimalSource } from "@/util/bignum";
 import { computeOptionalComponent, processedPropType, unwrapRef } from "@/util/vue";
 import { computed, CSSProperties, defineComponent, StyleValue, toRefs, unref } from "vue";
-import LinkNode from "../system/LinkNode.vue";
-import MarkNode from "./MarkNode.vue";
+import LinkNode from "@/components/links/LinkNode.vue";
+import MarkNode from "@/components/MarkNode.vue";
 
 export default defineComponent({
     props: {

src/features/bars/bar.ts

@@ -1,4 +1,4 @@
-import BarComponent from "@/components/features/Bar.vue";
+import BarComponent from "@/features/bars/Bar.vue";
 import {
     CoercableComponent,
     Component,

src/features/boards/Board.vue

@@ -51,7 +51,7 @@
 </template>
 
 <script setup lang="ts">
-import { BoardNode, GenericBoard, getNodeProperty } from "@/features/board";
+import { BoardNode, GenericBoard, getNodeProperty } from "@/features/boards/board";
 import { FeatureComponent, PersistentState, Visibility } from "@/features/feature";
 import { computed, ref, toRefs } from "vue";
 import panZoom from "vue-panzoom";

src/features/boards/BoardLink.vue

@@ -11,7 +11,7 @@
 </template>
 
 <script setup lang="ts">
-import { BoardNodeLink } from "@/features/board";
+import { BoardNodeLink } from "@/features/boards/board";
 import { computed, toRefs, unref } from "vue";
 
 const _props = defineProps<{

src/features/boards/BoardNode.vue

@@ -175,7 +175,7 @@ import {
     getNodeProperty,
     ProgressDisplay,
     Shape
-} from "@/features/board";
+} from "@/features/boards/board";
 import { Visibility } from "@/features/feature";
 import settings from "@/game/settings";
 import { computed, ref, toRefs, unref, watch } from "vue";

src/features/boards/board.ts

@@ -1,4 +1,4 @@
-import BoardComponent from "@/components/features/board/Board.vue";
+import BoardComponent from "@/features/boards/Board.vue";
 import {
     Component,
     findFeatures,
@@ -26,7 +26,7 @@ import {
 import { createLazyProxy } from "@/util/proxies";
 import { Unsubscribe } from "nanoevents";
 import { computed, Ref, unref } from "vue";
-import { Link } from "./links";
+import { Link } from "../links";
 
 export const BoardType = Symbol("Board");
 

src/features/buyable.tsx

@@ -1,5 +1,5 @@
-import ClickableComponent from "@/components/features/Clickable.vue";
-import { Resource } from "@/features/resource";
+import ClickableComponent from "@/features/clickables/Clickable.vue";
+import { Resource } from "@/features/resources/resource";
 import Decimal, { DecimalSource, format, formatWhole } from "@/util/bignum";
 import {
     Computable,

src/features/challenges/Challenge.vue

@@ -28,7 +28,7 @@
 
 <script lang="tsx">
 import "@/components/common/features.css";
-import { GenericChallenge } from "@/features/challenge";
+import { GenericChallenge } from "@/features/challenges/challenge";
 import { jsx, StyleValue, Visibility } from "@/features/feature";
 import { getHighNotifyStyle, getNotifyStyle } from "@/game/notifications";
 import { coerceComponent, isCoercableComponent, processedPropType, unwrapRef } from "@/util/vue";
@@ -43,8 +43,8 @@ import {
     UnwrapRef,
     watchEffect
 } from "vue";
-import LinkNode from "../system/LinkNode.vue";
-import MarkNode from "./MarkNode.vue";
+import LinkNode from "@/components/links/LinkNode.vue";
+import MarkNode from "@/components/MarkNode.vue";
 
 export default defineComponent({
     props: {

src/features/challenges/challenge.ts

@@ -1,4 +1,4 @@
-import ChallengeComponent from "@/components/features/Challenge.vue";
+import ChallengeComponent from "@/features/challenges/Challenge.vue";
 import {
     CoercableComponent,
     Component,
@@ -11,7 +11,8 @@ import {
     StyleValue,
     Visibility
 } from "@/features/feature";
-import { Resource } from "@/features/resource";
+import { GenericReset } from "@/features/reset";
+import { Resource } from "@/features/resources/resource";
 import { globalBus } from "@/game/events";
 import settings from "@/game/settings";
 import Decimal, { DecimalSource } from "@/util/bignum";
@@ -24,7 +25,6 @@ import {
 } from "@/util/computed";
 import { createLazyProxy } from "@/util/proxies";
 import { computed, Ref, unref } from "vue";
-import { GenericReset } from "./reset";
 
 export const ChallengeType = Symbol("ChallengeType");
 

src/features/clickables/Clickable.vue

@@ -30,7 +30,10 @@
 </template>
 
 <script lang="tsx">
-import { GenericClickable } from "@/features/clickable";
+import "@/components/common/features.css";
+import LinkNode from "@/components/links/LinkNode.vue";
+import MarkNode from "@/components/MarkNode.vue";
+import { GenericClickable } from "@/features/clickables/clickable";
 import { jsx, StyleValue, Visibility } from "@/features/feature";
 import {
     coerceComponent,
@@ -49,9 +52,6 @@ import {
     UnwrapRef,
     watchEffect
 } from "vue";
-import LinkNode from "../system/LinkNode.vue";
-import MarkNode from "./MarkNode.vue";
-import "@/components/common/features.css";
 
 export default defineComponent({
     props: {

src/features/clickables/clickable.ts

@@ -1,4 +1,4 @@
-import ClickableComponent from "@/components/features/Clickable.vue";
+import ClickableComponent from "@/features/clickables/Clickable.vue";
 import {
     CoercableComponent,
     Component,

src/features/conversion.ts

@@ -9,7 +9,7 @@ import {
 import { createLazyProxy } from "@/util/proxies";
 import { computed, isRef, Ref, unref } from "vue";
 import { Replace, setDefault } from "./feature";
-import { Resource } from "./resource";
+import { Resource } from "./resources/resource";
 
 export interface ConversionOptions {
     scaling: ScalingFunction;

src/features/grids/Grid.vue

@@ -17,14 +17,14 @@
 </template>
 
 <script lang="ts">
+import "@/components/common/table.css";
+import themes from "@/data/themes";
 import { Visibility } from "@/features/feature";
-import { GridCell } from "@/features/grid";
+import { GridCell } from "@/features/grids/grid";
+import settings from "@/game/settings";
 import { processedPropType } from "@/util/vue";
 import { computed, defineComponent, unref } from "vue";
 import GridCellVue from "./GridCell.vue";
-import "@/components/common/table.css";
-import settings from "@/game/settings";
-import themes from "@/data/themes";
 
 export default defineComponent({
     props: {

src/features/grids/GridCell.vue

@@ -24,6 +24,8 @@
 </template>
 
 <script lang="ts">
+import "@/components/common/features.css";
+import LinkNode from "@/components/links/LinkNode.vue";
 import { CoercableComponent, StyleValue, Visibility } from "@/features/feature";
 import {
     computeComponent,
@@ -32,8 +34,6 @@ import {
     setupHoldToClick
 } from "@/util/vue";
 import { defineComponent, PropType, toRefs, unref } from "vue";
-import LinkNode from "../system/LinkNode.vue";
-import "@/components/common/features.css";
 
 export default defineComponent({
     props: {

src/features/grids/grid.ts

@@ -1,4 +1,4 @@
-import GridComponent from "@/components/features/Grid.vue";
+import GridComponent from "@/features/grids/Grid.vue";
 import {
     CoercableComponent,
     Component,

src/features/infoboxes/Infobox.vue

@@ -29,13 +29,13 @@
 </template>
 
 <script lang="ts">
+import LinkNode from "@/components/links/LinkNode.vue";
 import themes from "@/data/themes";
 import { CoercableComponent, Visibility } from "@/features/feature";
 import settings from "@/game/settings";
 import { computeComponent, processedPropType } from "@/util/vue";
 import CollapseTransition from "@ivanv/vue-collapse-transition/src/CollapseTransition.vue";
 import { computed, defineComponent, PropType, Ref, StyleValue, toRefs, unref } from "vue";
-import LinkNode from "../system/LinkNode.vue";
 
 export default defineComponent({
     props: {

src/features/infoboxes/infobox.ts

@@ -1,4 +1,4 @@
-import InfoboxComponent from "@/components/features/Infobox.vue";
+import InfoboxComponent from "@/features/infoboxes/Infobox.vue";
 import {
     CoercableComponent,
     Component,

src/features/milestones/Milestone.vue

@@ -15,12 +15,12 @@
 </template>
 
 <script lang="tsx">
+import "@/components/common/features.css";
 import { jsx, StyleValue, Visibility } from "@/features/feature";
-import { GenericMilestone } from "@/features/milestone";
+import { GenericMilestone } from "@/features/milestones/milestone";
 import { coerceComponent, isCoercableComponent, processedPropType, unwrapRef } from "@/util/vue";
 import { Component, defineComponent, shallowRef, toRefs, unref, UnwrapRef, watchEffect } from "vue";
-import LinkNode from "../system/LinkNode.vue";
-import "@/components/common/features.css";
+import LinkNode from "../../components/links/LinkNode.vue";
 
 export default defineComponent({
     props: {

src/features/milestones/milestone.tsx

@@ -1,4 +1,4 @@
-import MilestoneComponent from "@/components/features/Milestone.vue";
+import MilestoneComponent from "@/features/milestones/Milestone.vue";
 import {
     CoercableComponent,
     Component,

src/features/resources/MainDisplay.vue

@@ -11,11 +11,11 @@
 
 <script setup lang="ts">
 import { CoercableComponent } from "@/features/feature";
-import { Resource } from "@/features/resource";
+import { Resource } from "@/features/resources/resource";
 import Decimal from "@/util/bignum";
 import { computeOptionalComponent } from "@/util/vue";
 import { computed, Ref, StyleValue, toRefs } from "vue";
-import ResourceVue from "../system/Resource.vue";
+import ResourceVue from "@/features/resources/Resource.vue";
 
 const _props = defineProps<{
     resource: Resource;

src/features/resources/Resource.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script setup lang="ts">
-import { displayResource, Resource } from "@/features/resource";
+import { displayResource, Resource } from "@/features/resources/resource";
 import { computed } from "vue";
 
 const props = defineProps<{

src/features/tabs/TabFamily.vue

@@ -30,10 +30,12 @@
 </template>
 
 <script lang="ts">
+import Sticky from "@/components/layout/Sticky.vue";
 import themes from "@/data/themes";
 import { CoercableComponent, StyleValue, Visibility } from "@/features/feature";
-import { GenericTab } from "@/features/tab";
-import { GenericTabButton } from "@/features/tabFamily";
+import { GenericTab } from "@/features/tabs/tab";
+import TabButton from "@/features/tabs/TabButton.vue";
+import { GenericTabButton } from "@/features/tabs/tabFamily";
 import settings from "@/game/settings";
 import { coerceComponent, isCoercableComponent, processedPropType, unwrapRef } from "@/util/vue";
 import {
@@ -47,8 +49,6 @@ import {
     unref,
     watchEffect
 } from "vue";
-import Sticky from "../system/Sticky.vue";
-import TabButton from "./TabButton.vue";
 
 export default defineComponent({
     props: {

src/features/tabs/tab.ts

@@ -1,6 +1,3 @@
-import TabComponent from "@/components/features/Tab.vue";
-import { Computable, GetComputableType } from "@/util/computed";
-import { createLazyProxy } from "@/util/proxies";
 import {
     CoercableComponent,
     Component,
@@ -8,7 +5,10 @@ import {
     getUniqueID,
     Replace,
     StyleValue
-} from "./feature";
+} from "@/features/feature";
+import TabComponent from "@/features/tabs/Tab.vue";
+import { Computable, GetComputableType } from "@/util/computed";
+import { createLazyProxy } from "@/util/proxies";
 
 export const TabType = Symbol("Tab");
 

src/features/tabs/tabFamily.ts

@@ -1,14 +1,3 @@
-import TabButtonComponent from "@/components/features/TabButton.vue";
-import TabFamilyComponent from "@/components/features/TabFamily.vue";
-import {
-    Computable,
-    GetComputableType,
-    GetComputableTypeWithDefault,
-    processComputable,
-    ProcessedComputable
-} from "@/util/computed";
-import { createLazyProxy } from "@/util/proxies";
-import { computed, Ref, unref } from "vue";
 import {
     CoercableComponent,
     Component,
@@ -21,7 +10,18 @@ import {
     setDefault,
     StyleValue,
     Visibility
-} from "./feature";
+} from "@/features/feature";
+import TabButtonComponent from "@/features/tabs/TabButton.vue";
+import TabFamilyComponent from "@/features/tabs/TabFamily.vue";
+import {
+    Computable,
+    GetComputableType,
+    GetComputableTypeWithDefault,
+    processComputable,
+    ProcessedComputable
+} from "@/util/computed";
+import { createLazyProxy } from "@/util/proxies";
+import { computed, Ref, unref } from "vue";
 import { GenericTab } from "./tab";
 
 export const TabButtonType = Symbol("TabButton");

src/features/trees/Tree.vue

@@ -29,7 +29,7 @@
 
 <script lang="ts">
 import "@/components/common/table.css";
-import { GenericTreeNode } from "@/features/tree";
+import { GenericTreeNode } from "@/features/trees/tree";
 import { processedPropType } from "@/util/vue";
 import { defineComponent, unref } from "vue";
 import TreeNode from "./TreeNode.vue";

src/features/trees/TreeNode.vue

@@ -39,7 +39,9 @@
 </template>
 
 <script lang="ts">
-import TooltipVue from "@/components/system/Tooltip.vue";
+import LinkNode from "@/components/links/LinkNode.vue";
+import MarkNode from "@/components/MarkNode.vue";
+import TooltipVue from "@/components/Tooltip.vue";
 import { CoercableComponent, StyleValue, Visibility } from "@/features/feature";
 import { gatherTooltipProps, Tooltip } from "@/features/tooltip";
 import { ProcessedComputable } from "@/util/computed";
@@ -60,8 +62,6 @@ import {
     unref,
     watchEffect
 } from "vue";
-import LinkNode from "../../system/LinkNode.vue";
-import MarkNode from "../MarkNode.vue";
 
 export default defineComponent({
     props: {

src/features/trees/tree.ts

@@ -1,4 +1,3 @@
-import TreeComponent from "@/components/features/tree/Tree.vue";
 import {
     CoercableComponent,
     Component,
@@ -10,7 +9,11 @@ import {
     StyleValue,
     Visibility
 } from "@/features/feature";
-import { displayResource, Resource } from "@/features/resource";
+import { Link } from "@/features/links";
+import { GenericReset } from "@/features/reset";
+import { displayResource, Resource } from "@/features/resources/resource";
+import { Tooltip } from "@/features/tooltip";
+import TreeComponent from "@/features/trees/Tree.vue";
 import { DecimalSource, format } from "@/util/bignum";
 import Decimal, { formatWhole } from "@/util/break_eternity";
 import {
@@ -23,9 +26,6 @@ import {
 } from "@/util/computed";
 import { createLazyProxy } from "@/util/proxies";
 import { computed, ref, Ref, unref } from "vue";
-import { Link } from "./links";
-import { GenericReset } from "./reset";
-import { Tooltip } from "./tooltip";
 
 export const TreeNodeType = Symbol("TreeNode");
 export const TreeType = Symbol("Tree");

src/features/upgrades/Upgrade.vue

@@ -25,9 +25,12 @@
 </template>
 
 <script lang="tsx">
+import "@/components/common/features.css";
+import LinkNode from "@/components/links/LinkNode.vue";
+import MarkNode from "@/components/MarkNode.vue";
 import { jsx, StyleValue, Visibility } from "@/features/feature";
-import { displayResource, Resource } from "@/features/resource";
-import { GenericUpgrade } from "@/features/upgrade";
+import { displayResource, Resource } from "@/features/resources/resource";
+import { GenericUpgrade } from "@/features/upgrades/upgrade";
 import { DecimalSource } from "@/lib/break_eternity";
 import { coerceComponent, isCoercableComponent, processedPropType, unwrapRef } from "@/util/vue";
 import {
@@ -40,9 +43,6 @@ import {
     UnwrapRef,
     watchEffect
 } from "vue";
-import LinkNode from "../system/LinkNode.vue";
-import MarkNode from "./MarkNode.vue";
-import "@/components/common/features.css";
 
 export default defineComponent({
     props: {

src/features/upgrades/upgrade.ts

@@ -1,4 +1,4 @@
-import UpgradeComponent from "@/components/features/Upgrade.vue";
+import UpgradeComponent from "@/features/upgrades/Upgrade.vue";
 import {
     CoercableComponent,
     Component,
@@ -13,7 +13,7 @@ import {
     StyleValue,
     Visibility
 } from "@/features/feature";
-import { Resource } from "@/features/resource";
+import { Resource } from "@/features/resources/resource";
 import { GenericLayer } from "@/game/layers";
 import Decimal, { DecimalSource } from "@/util/bignum";
 import { isFunction } from "@/util/common";

src/util/vue.tsx

@@ -1,5 +1,5 @@
-import Col from "@/components/system/Column.vue";
-import Row from "@/components/system/Row.vue";
+import Col from "@/components/layout/Column.vue";
+import Row from "@/components/layout/Row.vue";
 import {
     CoercableComponent,
     Component as ComponentKey,