@vef-framework/starter 1.0.134 → 2.0.1

package/dist/es/components/layout/components/tabs/tabs-container.js

@@ -0,0 +1,81 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+import { jsx } from '@emotion/react/jsx-runtime';
+import { css } from '@emotion/react';
+import { globalCssVars, ScrollArea } from '@vef-framework/components';
+import { clsx } from '@vef-framework/core';
+import { useIsomorphicEffect } from '@vef-framework/hooks';
+import { useRef, useState, useCallback } from 'react';
+import { TabList } from './tab-list.js';
+
+const tabsWrapperStyle = /* @__PURE__ */ css({
+  flex: "auto",
+  "&.shadow-right::after": {
+    content: "''",
+    position: "absolute",
+    top: 0,
+    bottom: 0,
+    right: 0,
+    width: "10px",
+    boxShadow: "inset -10px 0 8px -8px var(--vef-color-split)",
+    transition: `box-shadow ${globalCssVars.motionDurationMid} ease`,
+    pointerEvents: "none"
+  },
+  "&.shadow-left::before": {
+    content: "''",
+    position: "absolute",
+    top: 0,
+    bottom: 0,
+    left: 0,
+    width: "10px",
+    boxShadow: "inset 10px 0 8px -8px var(--vef-color-split)",
+    transition: `box-shadow ${globalCssVars.motionDurationMid} ease`,
+    pointerEvents: "none"
+  }
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RhYnMvdGFicy1jb250YWluZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVd5QiIsImZpbGUiOiIvVXNlcnMvdmVudXMvVkVGL3ZlZi1mcmFtZXdvcmstcmVhY3QvcGFja2FnZXMvc3RhcnRlci9zcmMvY29tcG9uZW50cy9sYXlvdXQvY29tcG9uZW50cy90YWJzL3RhYnMtY29udGFpbmVyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB0eXBlIHsgUG9zaXRpb24gfSBmcm9tIFwiQHZlZi1mcmFtZXdvcmsvY29tcG9uZW50c1wiO1xuaW1wb3J0IHR5cGUgeyBNYXliZVVuZGVmaW5lZCB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9zaGFyZWRcIjtcblxuaW1wb3J0IHsgY3NzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgeyBnbG9iYWxDc3NWYXJzLCBTY3JvbGxBcmVhIH0gZnJvbSBcIkB2ZWYtZnJhbWV3b3JrL2NvbXBvbmVudHNcIjtcbmltcG9ydCB7IGNsc3ggfSBmcm9tIFwiQHZlZi1mcmFtZXdvcmsvY29yZVwiO1xuaW1wb3J0IHsgdXNlSXNvbW9ycGhpY0VmZmVjdCB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9ob29rc1wiO1xuaW1wb3J0IHsgdXNlQ2FsbGJhY2ssIHVzZVJlZiwgdXNlU3RhdGUgfSBmcm9tIFwicmVhY3RcIjtcblxuaW1wb3J0IHsgVGFiTGlzdCB9IGZyb20gXCIuL3RhYi1saXN0XCI7XG5cbmNvbnN0IHRhYnNXcmFwcGVyU3R5bGUgPSBjc3Moe1xuICBmbGV4OiBcImF1dG9cIixcbiAgXCImLnNoYWRvdy1yaWdodDo6YWZ0ZXJcIjoge1xuICAgIGNvbnRlbnQ6IFwiJydcIixcbiAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgIHRvcDogMCxcbiAgICBib3R0b206IDAsXG4gICAgcmlnaHQ6IDAsXG4gICAgd2lkdGg6IFwiMTBweFwiLFxuICAgIGJveFNoYWRvdzogXCJpbnNldCAtMTBweCAwIDhweCAtOHB4IHZhcigtLXZlZi1jb2xvci1zcGxpdClcIixcbiAgICB0cmFuc2l0aW9uOiBgYm94LXNoYWRvdyAke2dsb2JhbENzc1ZhcnMubW90aW9uRHVyYXRpb25NaWR9IGVhc2VgLFxuICAgIHBvaW50ZXJFdmVudHM6IFwibm9uZVwiXG4gIH0sXG4gIFwiJi5zaGFkb3ctbGVmdDo6YmVmb3JlXCI6IHtcbiAgICBjb250ZW50OiBcIicnXCIsXG4gICAgcG9zaXRpb246IFwiYWJzb2x1dGVcIixcbiAgICB0b3A6IDAsXG4gICAgYm90dG9tOiAwLFxuICAgIGxlZnQ6IDAsXG4gICAgd2lkdGg6IFwiMTBweFwiLFxuICAgIGJveFNoYWRvdzogXCJpbnNldCAxMHB4IDAgOHB4IC04cHggdmFyKC0tdmVmLWNvbG9yLXNwbGl0KVwiLFxuICAgIHRyYW5zaXRpb246IGBib3gtc2hhZG93ICR7Z2xvYmFsQ3NzVmFycy5tb3Rpb25EdXJhdGlvbk1pZH0gZWFzZWAsXG4gICAgcG9pbnRlckV2ZW50czogXCJub25lXCJcbiAgfVxufSk7XG5cbmV4cG9ydCBmdW5jdGlvbiBUYWJzQ29udGFpbmVyKCkge1xuICBjb25zdCB0YWJzQ29udGFpbmVyUmVmID0gdXNlUmVmPEhUTUxEaXZFbGVtZW50PihudWxsKTtcbiAgY29uc3QgaXNPdmVyZmxvd1JlZiA9IHVzZVJlZihmYWxzZSk7XG4gIGNvbnN0IG92ZXJmbG93V2lkdGhSZWYgPSB1c2VSZWYoMCk7XG4gIGNvbnN0IFtyb290Q2xhc3NOYW1lLCBzZXRSb290Q2xhc3NOYW1lXSA9IHVzZVN0YXRlPE1heWJlVW5kZWZpbmVkPHN0cmluZz4+KCk7XG5cbiAgLy8gVXBkYXRlIG92ZXJmbG93IHN0YXRlIGFuZCBzaGFkb3cgY2xhc3Nlc1xuICBjb25zdCB1cGRhdGVPdmVyZmxvd1N0YXRlID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgIGlmICh0YWJzQ29udGFpbmVyUmVmLmN1cnJlbnQpIHtcbiAgICAgIGNvbnN0IGNvbnRhaW5lckVsID0gdGFic0NvbnRhaW5lclJlZi5jdXJyZW50O1xuICAgICAgb3ZlcmZsb3dXaWR0aFJlZi5jdXJyZW50ID0gY29udGFpbmVyRWwuc2Nyb2xsV2lkdGggLSBjb250YWluZXJFbC5jbGllbnRXaWR0aDtcbiAgICAgIGlzT3ZlcmZsb3dSZWYuY3VycmVudCA9IG92ZXJmbG93V2lkdGhSZWYuY3VycmVudCA+IDA7XG4gICAgICBjb25zdCB7IHNjcm9sbExlZnQgfSA9IGNvbnRhaW5lckVsO1xuXG4gICAgICBzZXRSb290Q2xhc3NOYW1lKGNsc3goe1xuICAgICAgICBcInNoYWRvdy1sZWZ0XCI6IHNjcm9sbExlZnQgPiAwLFxuICAgICAgICBcInNoYWRvdy1yaWdodFwiOiBzY3JvbGxMZWZ0IDwgb3ZlcmZsb3dXaWR0aFJlZi5jdXJyZW50XG4gICAgICB9KSk7XG4gICAgfVxuICB9LCBbXSk7XG5cbiAgdXNlSXNvbW9ycGhpY0VmZmVjdCgoKSA9PiB7XG4gICAgY29uc3QgY29udGFpbmVyRWwgPSB0YWJzQ29udGFpbmVyUmVmLmN1cnJlbnQ7XG5cbiAgICBpZiAoIWNvbnRhaW5lckVsKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgLy8gSW5pdGlhbCBjYWxjdWxhdGlvblxuICAgIHVwZGF0ZU92ZXJmbG93U3RhdGUoKTtcblxuICAgIC8vIENyZWF0ZSBSZXNpemVPYnNlcnZlciB0byB3YXRjaCBmb3IgY29udGFpbmVyIHNpemUgY2hhbmdlc1xuICAgIGNvbnN0IHJlc2l6ZU9ic2VydmVyID0gbmV3IFJlc2l6ZU9ic2VydmVyKCgpID0+IHtcbiAgICAgIHVwZGF0ZU92ZXJmbG93U3RhdGUoKTtcbiAgICB9KTtcblxuICAgIHJlc2l6ZU9ic2VydmVyLm9ic2VydmUoY29udGFpbmVyRWwpO1xuXG4gICAgcmV0dXJuICgpID0+IHtcbiAgICAgIHJlc2l6ZU9ic2VydmVyLmRpc2Nvbm5lY3QoKTtcbiAgICB9O1xuICB9LCBbdXBkYXRlT3ZlcmZsb3dTdGF0ZV0pO1xuXG4gIGNvbnN0IGhhbmRsZVNjcm9sbFBvc2l0aW9uQ2hhbmdlID0gdXNlQ2FsbGJhY2soKHsgeCB9OiBQb3NpdGlvbikgPT4ge1xuICAgIGlmIChpc092ZXJmbG93UmVmLmN1cnJlbnQpIHtcbiAgICAgIHNldFJvb3RDbGFzc05hbWUoY2xzeCh7XG4gICAgICAgIFwic2hhZG93LWxlZnRcIjogeCA+IDAsXG4gICAgICAgIFwic2hhZG93LXJpZ2h0XCI6IHggPCBvdmVyZmxvd1dpZHRoUmVmLmN1cnJlbnRcbiAgICAgIH0pKTtcbiAgICB9XG4gIH0sIFtdKTtcblxuICByZXR1cm4gKFxuICAgIDxTY3JvbGxBcmVhXG4gICAgICBjbGFzc05hbWU9e3Jvb3RDbGFzc05hbWV9XG4gICAgICBjc3M9e3RhYnNXcmFwcGVyU3R5bGV9XG4gICAgICBzY3JvbGxiYXJQYWRkaW5nPXsxfVxuICAgICAgc2Nyb2xsYmFyU2l6ZT17NX1cbiAgICAgIHR5cGU9XCJzY3JvbGxcIlxuICAgICAgdmlld3BvcnRSZWY9e3RhYnNDb250YWluZXJSZWZ9XG4gICAgICBvblNjcm9sbFBvc2l0aW9uQ2hhbmdlPXtoYW5kbGVTY3JvbGxQb3NpdGlvbkNoYW5nZX1cbiAgICA+XG4gICAgICA8VGFiTGlzdCAvPlxuICAgIDwvU2Nyb2xsQXJlYT5cbiAgKTtcbn1cbiJdfQ== */");
+function TabsContainer() {
+  const tabsContainerRef = useRef(null);
+  const isOverflowRef = useRef(false);
+  const overflowWidthRef = useRef(0);
+  const [rootClassName, setRootClassName] = useState();
+  const updateOverflowState = useCallback(() => {
+    if (tabsContainerRef.current) {
+      const containerEl = tabsContainerRef.current;
+      overflowWidthRef.current = containerEl.scrollWidth - containerEl.clientWidth;
+      isOverflowRef.current = overflowWidthRef.current > 0;
+      const {
+        scrollLeft
+      } = containerEl;
+      setRootClassName(clsx({
+        "shadow-left": scrollLeft > 0,
+        "shadow-right": scrollLeft < overflowWidthRef.current
+      }));
+    }
+  }, []);
+  useIsomorphicEffect(() => {
+    const containerEl = tabsContainerRef.current;
+    if (!containerEl) {
+      return;
+    }
+    updateOverflowState();
+    const resizeObserver = new ResizeObserver(() => {
+      updateOverflowState();
+    });
+    resizeObserver.observe(containerEl);
+    return () => {
+      resizeObserver.disconnect();
+    };
+  }, [updateOverflowState]);
+  const handleScrollPositionChange = useCallback(({
+    x
+  }) => {
+    if (isOverflowRef.current) {
+      setRootClassName(clsx({
+        "shadow-left": x > 0,
+        "shadow-right": x < overflowWidthRef.current
+      }));
+    }
+  }, []);
+  return /* @__PURE__ */ jsx(ScrollArea, { className: rootClassName, css: tabsWrapperStyle, scrollbarPadding: 1, scrollbarSize: 5, type: "scroll", viewportRef: tabsContainerRef, onScrollPositionChange: handleScrollPositionChange, children: /* @__PURE__ */ jsx(TabList, {}) });
+}
+
+export { TabsContainer };

package/dist/es/components/layout/components/theme-config/color-scheme-switcher.js

@@ -0,0 +1,45 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+import { jsx } from '@emotion/react/jsx-runtime';
+import { css } from '@emotion/react';
+import { globalCssVars, Center, Icon, Segmented } from '@vef-framework/components';
+import { SunIcon, MoonIcon, SunMoon } from 'lucide-react';
+import { useRef } from 'react';
+import '../../../../stores/index.js';
+import '../../hooks/index.js';
+import { useThemeStore } from '../../../../stores/theme.js';
+import { useColorSchemeUpdater } from '../../hooks/use-color-scheme-updater.js';
+
+const itemStyle = /* @__PURE__ */ css({
+  height: `calc(${globalCssVars.controlHeight} - var(--vef-segmented-track-padding) * 2)`,
+  width: "64px"
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9jb2xvci1zY2hlbWUtc3dpdGNoZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVlrQiIsImZpbGUiOiIvVXNlcnMvdmVudXMvVkVGL3ZlZi1mcmFtZXdvcmstcmVhY3QvcGFja2FnZXMvc3RhcnRlci9zcmMvY29tcG9uZW50cy9sYXlvdXQvY29tcG9uZW50cy90aGVtZS1jb25maWcvY29sb3Itc2NoZW1lLXN3aXRjaGVyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB0eXBlIHsgUG9zaXRpb24sIFNlZ21lbnRlZE9wdGlvbiB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5cbmltcG9ydCB0eXBlIHsgQ29sb3JTY2hlbWUgfSBmcm9tIFwiLi4vLi4vLi4vLi4vc3RvcmVzXCI7XG5cbmltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHsgQ2VudGVyLCBnbG9iYWxDc3NWYXJzLCBJY29uLCBTZWdtZW50ZWQgfSBmcm9tIFwiQHZlZi1mcmFtZXdvcmsvY29tcG9uZW50c1wiO1xuaW1wb3J0IHsgTW9vbkljb24sIFN1bkljb24sIFN1bk1vb24gfSBmcm9tIFwibHVjaWRlLXJlYWN0XCI7XG5pbXBvcnQgeyB1c2VSZWYgfSBmcm9tIFwicmVhY3RcIjtcblxuaW1wb3J0IHsgdXNlVGhlbWVTdG9yZSB9IGZyb20gXCIuLi8uLi8uLi8uLi9zdG9yZXNcIjtcbmltcG9ydCB7IHVzZUNvbG9yU2NoZW1lVXBkYXRlciB9IGZyb20gXCIuLi8uLi9ob29rc1wiO1xuXG5jb25zdCBpdGVtU3R5bGUgPSBjc3Moe1xuICBoZWlnaHQ6IGBjYWxjKCR7Z2xvYmFsQ3NzVmFycy5jb250cm9sSGVpZ2h0fSAtIHZhcigtLXZlZi1zZWdtZW50ZWQtdHJhY2stcGFkZGluZykgKiAyKWAsXG4gIHdpZHRoOiBcIjY0cHhcIlxufSk7XG5cbmNvbnN0IG9wdGlvbnM6IFNlZ21lbnRlZE9wdGlvbltdID0gW1xuICB7XG4gICAgbGFiZWw6IChcbiAgICAgIDxDZW50ZXIgY3NzPXtpdGVtU3R5bGV9PlxuICAgICAgICA8SWNvbiBjb21wb25lbnQ9e1N1bkljb259IC8+XG4gICAgICA8L0NlbnRlcj5cbiAgICApLFxuICAgIHZhbHVlOiBcImxpZ2h0XCJcbiAgfSxcbiAge1xuICAgIGxhYmVsOiAoXG4gICAgICA8Q2VudGVyIGNzcz17aXRlbVN0eWxlfT5cbiAgICAgICAgPEljb24gY29tcG9uZW50PXtNb29uSWNvbn0gLz5cbiAgICAgIDwvQ2VudGVyPlxuICAgICksXG4gICAgdmFsdWU6IFwiZGFya1wiXG4gIH0sXG4gIHtcbiAgICBsYWJlbDogKFxuICAgICAgPENlbnRlciBjc3M9e2l0ZW1TdHlsZX0+XG4gICAgICAgIDxJY29uIGNvbXBvbmVudD17U3VuTW9vbn0gLz5cbiAgICAgIDwvQ2VudGVyPlxuICAgICksXG4gICAgdmFsdWU6IFwic3lzdGVtXCJcbiAgfVxuXTtcblxuZXhwb3J0IGZ1bmN0aW9uIENvbG9yU2NoZW1lU3dpdGNoZXIoKSB7XG4gIGNvbnN0IGNvbG9yU2NoZW1lID0gdXNlVGhlbWVTdG9yZShzdGF0ZSA9PiBzdGF0ZS5jb2xvclNjaGVtZSk7XG4gIGNvbnN0IHsgdXBkYXRlQ29sb3JTY2hlbWUgfSA9IHVzZUNvbG9yU2NoZW1lVXBkYXRlcigpO1xuICBjb25zdCBwb3NpdGlvblJlZiA9IHVzZVJlZjxQb3NpdGlvbj4oe1xuICAgIHg6IHdpbmRvdy5pbm5lcldpZHRoIC8gMixcbiAgICB5OiB3aW5kb3cuaW5uZXJIZWlnaHQgLyAyXG4gIH0pO1xuXG4gIHJldHVybiAoXG4gICAgPFNlZ21lbnRlZFxuICAgICAgb3B0aW9ucz17b3B0aW9uc31cbiAgICAgIHZhbHVlPXtjb2xvclNjaGVtZX1cbiAgICAgIG9uQ2hhbmdlPXt2YWx1ZSA9PiB7XG4gICAgICAgIHVwZGF0ZUNvbG9yU2NoZW1lKHZhbHVlIGFzIENvbG9yU2NoZW1lLCBwb3NpdGlvblJlZi5jdXJyZW50KTtcbiAgICAgIH19XG4gICAgICBvbkNsaWNrPXtldmVudCA9PiB7XG4gICAgICAgIHBvc2l0aW9uUmVmLmN1cnJlbnQgPSB7XG4gICAgICAgICAgeDogZXZlbnQuY2xpZW50WCxcbiAgICAgICAgICB5OiBldmVudC5jbGllbnRZXG4gICAgICAgIH07XG4gICAgICB9fVxuICAgIC8+XG4gICk7XG59XG4iXX0= */");
+const options = [{
+  label: /* @__PURE__ */ jsx(Center, { css: itemStyle, children: /* @__PURE__ */ jsx(Icon, { component: SunIcon }) }),
+  value: "light"
+}, {
+  label: /* @__PURE__ */ jsx(Center, { css: itemStyle, children: /* @__PURE__ */ jsx(Icon, { component: MoonIcon }) }),
+  value: "dark"
+}, {
+  label: /* @__PURE__ */ jsx(Center, { css: itemStyle, children: /* @__PURE__ */ jsx(Icon, { component: SunMoon }) }),
+  value: "system"
+}];
+function ColorSchemeSwitcher() {
+  const colorScheme = useThemeStore((state) => state.colorScheme);
+  const {
+    updateColorScheme
+  } = useColorSchemeUpdater();
+  const positionRef = useRef({
+    x: window.innerWidth / 2,
+    y: window.innerHeight / 2
+  });
+  return /* @__PURE__ */ jsx(Segmented, { options, value: colorScheme, onChange: (value) => {
+    updateColorScheme(value, positionRef.current);
+  }, onClick: (event) => {
+    positionRef.current = {
+      x: event.clientX,
+      y: event.clientY
+    };
+  } });
+}
+
+export { ColorSchemeSwitcher };

package/dist/es/components/layout/components/theme-config/color-scheme.js

@@ -0,0 +1,53 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+import { jsxs, jsx } from '@emotion/react/jsx-runtime';
+import { css } from '@emotion/react';
+import { globalCssVars, Center, Switch } from '@vef-framework/components';
+import { useShallow } from '@vef-framework/core';
+import '../../../../stores/index.js';
+import { ColorSchemeSwitcher } from './color-scheme-switcher.js';
+import { ConfigItem } from './config-item.js';
+import { useThemeStore } from '../../../../stores/theme.js';
+
+const wrapperStyle = /* @__PURE__ */ css({
+  display: "flex",
+  flexDirection: "column",
+  gap: globalCssVars.spacingMd
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9jb2xvci1zY2hlbWUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVFxQiIsImZpbGUiOiIvVXNlcnMvdmVudXMvVkVGL3ZlZi1mcmFtZXdvcmstcmVhY3QvcGFja2FnZXMvc3RhcnRlci9zcmMvY29tcG9uZW50cy9sYXlvdXQvY29tcG9uZW50cy90aGVtZS1jb25maWcvY29sb3Itc2NoZW1lLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHsgQ2VudGVyLCBnbG9iYWxDc3NWYXJzLCBTd2l0Y2ggfSBmcm9tIFwiQHZlZi1mcmFtZXdvcmsvY29tcG9uZW50c1wiO1xuaW1wb3J0IHsgdXNlU2hhbGxvdyB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb3JlXCI7XG5cbmltcG9ydCB7IHVzZVRoZW1lU3RvcmUgfSBmcm9tIFwiLi4vLi4vLi4vLi4vc3RvcmVzXCI7XG5pbXBvcnQgeyBDb2xvclNjaGVtZVN3aXRjaGVyIH0gZnJvbSBcIi4vY29sb3Itc2NoZW1lLXN3aXRjaGVyXCI7XG5pbXBvcnQgeyBDb25maWdJdGVtIH0gZnJvbSBcIi4vY29uZmlnLWl0ZW1cIjtcblxuY29uc3Qgd3JhcHBlclN0eWxlID0gY3NzKHtcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGZsZXhEaXJlY3Rpb246IFwiY29sdW1uXCIsXG4gIGdhcDogZ2xvYmFsQ3NzVmFycy5zcGFjaW5nTWRcbn0pO1xuXG5leHBvcnQgZnVuY3Rpb24gQ29sb3JTY2hlbWUoKSB7XG4gIGNvbnN0IHtcbiAgICBpc0dyYXlzY2FsZU1vZGUsXG4gICAgaXNDb2xvckJsaW5kTW9kZSxcbiAgICBpc01lbnVBY2NvcmRpb25Nb2RlXG4gIH0gPSB1c2VUaGVtZVN0b3JlKFxuICAgIHVzZVNoYWxsb3coXG4gICAgICBzdGF0ZSA9PiB7XG4gICAgICAgIGNvbnN0IHtcbiAgICAgICAgICBpc0dyYXlzY2FsZU1vZGUsXG4gICAgICAgICAgaXNDb2xvckJsaW5kTW9kZSxcbiAgICAgICAgICBpc01lbnVBY2NvcmRpb25Nb2RlXG4gICAgICAgIH0gPSBzdGF0ZTtcblxuICAgICAgICByZXR1cm4ge1xuICAgICAgICAgIGlzR3JheXNjYWxlTW9kZSxcbiAgICAgICAgICBpc0NvbG9yQmxpbmRNb2RlLFxuICAgICAgICAgIGlzTWVudUFjY29yZGlvbk1vZGVcbiAgICAgICAgfTtcbiAgICAgIH1cbiAgICApXG4gICk7XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2IGNzcz17d3JhcHBlclN0eWxlfT5cbiAgICAgIDxDZW50ZXI+XG4gICAgICAgIDxDb2xvclNjaGVtZVN3aXRjaGVyIC8+XG4gICAgICA8L0NlbnRlcj5cblxuICAgICAgPENvbmZpZ0l0ZW0gbGFiZWw9XCLngbDluqbmqKHlvI9cIj5cbiAgICAgICAgPFN3aXRjaFxuICAgICAgICAgIGNoZWNrZWQ9e2lzR3JheXNjYWxlTW9kZX1cbiAgICAgICAgICBvbkNoYW5nZT17XG4gICAgICAgICAgICB2YWx1ZSA9PiB7XG4gICAgICAgICAgICAgIHVzZVRoZW1lU3RvcmUuc2V0U3RhdGUoc3RhdGUgPT4ge1xuICAgICAgICAgICAgICAgIHN0YXRlLmlzR3JheXNjYWxlTW9kZSA9IHZhbHVlO1xuICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICB9XG4gICAgICAgIC8+XG4gICAgICA8L0NvbmZpZ0l0ZW0+XG5cbiAgICAgIDxDb25maWdJdGVtIGxhYmVsPVwi6Imy5byx5qih5byPXCI+XG4gICAgICAgIDxTd2l0Y2hcbiAgICAgICAgICBjaGVja2VkPXtpc0NvbG9yQmxpbmRNb2RlfVxuICAgICAgICAgIG9uQ2hhbmdlPXtcbiAgICAgICAgICAgIHZhbHVlID0+IHtcbiAgICAgICAgICAgICAgdXNlVGhlbWVTdG9yZS5zZXRTdGF0ZShzdGF0ZSA9PiB7XG4gICAgICAgICAgICAgICAgc3RhdGUuaXNDb2xvckJsaW5kTW9kZSA9IHZhbHVlO1xuICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICB9XG4gICAgICAgIC8+XG4gICAgICA8L0NvbmZpZ0l0ZW0+XG5cbiAgICAgIDxDb25maWdJdGVtIGxhYmVsPVwi6I+c5Y2V5omL6aOO55C05qih5byPXCI+XG4gICAgICAgIDxTd2l0Y2hcbiAgICAgICAgICBjaGVja2VkPXtpc01lbnVBY2NvcmRpb25Nb2RlfVxuICAgICAgICAgIG9uQ2hhbmdlPXtcbiAgICAgICAgICAgIHZhbHVlID0+IHtcbiAgICAgICAgICAgICAgdXNlVGhlbWVTdG9yZS5zZXRTdGF0ZShzdGF0ZSA9PiB7XG4gICAgICAgICAgICAgICAgc3RhdGUuaXNNZW51QWNjb3JkaW9uTW9kZSA9IHZhbHVlO1xuICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICB9XG4gICAgICAgIC8+XG4gICAgICA8L0NvbmZpZ0l0ZW0+XG4gICAgPC9kaXY+XG4gICk7XG59XG4iXX0= */");
+function ColorScheme() {
+  const {
+    isGrayscaleMode,
+    isColorBlindMode,
+    isMenuAccordionMode
+  } = useThemeStore(useShallow((state) => {
+    const {
+      isGrayscaleMode: isGrayscaleMode2,
+      isColorBlindMode: isColorBlindMode2,
+      isMenuAccordionMode: isMenuAccordionMode2
+    } = state;
+    return {
+      isGrayscaleMode: isGrayscaleMode2,
+      isColorBlindMode: isColorBlindMode2,
+      isMenuAccordionMode: isMenuAccordionMode2
+    };
+  }));
+  return /* @__PURE__ */ jsxs("div", { css: wrapperStyle, children: [
+    /* @__PURE__ */ jsx(Center, { children: /* @__PURE__ */ jsx(ColorSchemeSwitcher, {}) }),
+    /* @__PURE__ */ jsx(ConfigItem, { label: "灰度模式", children: /* @__PURE__ */ jsx(Switch, { checked: isGrayscaleMode, onChange: (value) => {
+      useThemeStore.setState((state) => {
+        state.isGrayscaleMode = value;
+      });
+    } }) }),
+    /* @__PURE__ */ jsx(ConfigItem, { label: "色弱模式", children: /* @__PURE__ */ jsx(Switch, { checked: isColorBlindMode, onChange: (value) => {
+      useThemeStore.setState((state) => {
+        state.isColorBlindMode = value;
+      });
+    } }) }),
+    /* @__PURE__ */ jsx(ConfigItem, { label: "菜单手风琴模式", children: /* @__PURE__ */ jsx(Switch, { checked: isMenuAccordionMode, onChange: (value) => {
+      useThemeStore.setState((state) => {
+        state.isMenuAccordionMode = value;
+      });
+    } }) })
+  ] });
+}
+
+export { ColorScheme };

package/dist/es/components/layout/components/theme-config/config-item.js

@@ -0,0 +1,23 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+import { jsxs, jsx } from '@emotion/react/jsx-runtime';
+import { css } from '@emotion/react';
+import { globalCssVars } from '@vef-framework/components';
+
+const itemStyle = /* @__PURE__ */ css({
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "space-between",
+  columnGap: globalCssVars.spacingXs
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9jb25maWctaXRlbS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBVWtCIiwiZmlsZSI6Ii9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9jb25maWctaXRlbS50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IFByb3BzV2l0aENoaWxkcmVuLCBSZWFjdE5vZGUgfSBmcm9tIFwicmVhY3RcIjtcblxuaW1wb3J0IHsgY3NzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgeyBnbG9iYWxDc3NWYXJzIH0gZnJvbSBcIkB2ZWYtZnJhbWV3b3JrL2NvbXBvbmVudHNcIjtcblxuaW50ZXJmYWNlIENvbmZpZ0l0ZW1Qcm9wcyBleHRlbmRzIFByb3BzV2l0aENoaWxkcmVuIHtcbiAgY2xhc3NOYW1lPzogc3RyaW5nO1xuICBsYWJlbDogUmVhY3ROb2RlO1xufVxuXG5jb25zdCBpdGVtU3R5bGUgPSBjc3Moe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAganVzdGlmeUNvbnRlbnQ6IFwic3BhY2UtYmV0d2VlblwiLFxuICBjb2x1bW5HYXA6IGdsb2JhbENzc1ZhcnMuc3BhY2luZ1hzXG59KTtcblxuZXhwb3J0IGZ1bmN0aW9uIENvbmZpZ0l0ZW0oe1xuICBjbGFzc05hbWUsXG4gIGxhYmVsLFxuICBjaGlsZHJlblxufTogQ29uZmlnSXRlbVByb3BzKSB7XG4gIHJldHVybiAoXG4gICAgPGRpdiBjbGFzc05hbWU9e2NsYXNzTmFtZX0gY3NzPXtpdGVtU3R5bGV9PlxuICAgICAgPHNwYW4+XG4gICAgICAgIHtsYWJlbH1cbiAgICAgIDwvc3Bhbj5cblxuICAgICAge2NoaWxkcmVufVxuICAgIDwvZGl2PlxuICApO1xufVxuIl19 */");
+function ConfigItem({
+  className,
+  label,
+  children
+}) {
+  return /* @__PURE__ */ jsxs("div", { className, css: itemStyle, children: [
+    /* @__PURE__ */ jsx("span", { children: label }),
+    children
+  ] });
+}
+
+export { ConfigItem };

package/dist/es/components/layout/components/theme-config/index.js

@@ -0,0 +1,55 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+import { jsx, jsxs } from '@emotion/react/jsx-runtime';
+import { css, ClassNames } from '@emotion/react';
+import { globalCssVars, Drawer, ScrollArea, Divider } from '@vef-framework/components';
+import '../../../../stores/index.js';
+import { ColorScheme } from './color-scheme.js';
+import { MenuLayout } from './menu-layout.js';
+import { Operations } from './operations.js';
+import { ThemeColors } from './theme-colors.js';
+import { useThemeStore } from '../../../../stores/theme.js';
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() {
+  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
+}
+const drawerBodyStyle = process.env.NODE_ENV === "production" ? {
+  name: "1hcx8jb",
+  styles: "padding:0"
+} : {
+  name: "1hcx8jb",
+  styles: "padding:0/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBU3dCIiwiZmlsZSI6Ii9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDbGFzc05hbWVzLCBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IERpdmlkZXIsIERyYXdlciwgZ2xvYmFsQ3NzVmFycywgU2Nyb2xsQXJlYSB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5cbmltcG9ydCB7IHVzZVRoZW1lU3RvcmUgfSBmcm9tIFwiLi4vLi4vLi4vLi4vc3RvcmVzXCI7XG5pbXBvcnQgeyBDb2xvclNjaGVtZSB9IGZyb20gXCIuL2NvbG9yLXNjaGVtZVwiO1xuaW1wb3J0IHsgTWVudUxheW91dCB9IGZyb20gXCIuL21lbnUtbGF5b3V0XCI7XG5pbXBvcnQgeyBPcGVyYXRpb25zIH0gZnJvbSBcIi4vb3BlcmF0aW9uc1wiO1xuaW1wb3J0IHsgVGhlbWVDb2xvcnMgfSBmcm9tIFwiLi90aGVtZS1jb2xvcnNcIjtcblxuY29uc3QgZHJhd2VyQm9keVN0eWxlID0gY3NzKHtcbiAgcGFkZGluZzogMFxufSk7XG5jb25zdCBjb250ZW50U3R5bGUgPSBjc3Moe1xuICBoZWlnaHQ6IFwiMTAwJVwiLFxuICBwYWRkaW5nSW5saW5lOiBnbG9iYWxDc3NWYXJzLnNwYWNpbmdTbSxcbiAgcGFkZGluZ0Jsb2NrU3RhcnQ6IGdsb2JhbENzc1ZhcnMuc3BhY2luZ1hzLFxuICBwYWRkaW5nQmxvY2tFbmQ6IGdsb2JhbENzc1ZhcnMuc3BhY2luZ0xnXG59KTtcblxuY29uc3QgY29udGFpbmVyU3R5bGUgPSBjc3Moe1xuICBwYWRkaW5nSW5saW5lOiBnbG9iYWxDc3NWYXJzLnNwYWNpbmdYc1xufSk7XG5cbmV4cG9ydCBmdW5jdGlvbiBUaGVtZUNvbmZpZygpIHtcbiAgY29uc3QgaXNUaGVtZUNvbmZpZ1Zpc2libGUgPSB1c2VUaGVtZVN0b3JlKHN0YXRlID0+IHN0YXRlLmlzVGhlbWVDb25maWdWaXNpYmxlKTtcblxuICBjb25zdCBoYW5kbGVDbG9zZSA9ICgpID0+IHtcbiAgICB1c2VUaGVtZVN0b3JlLnNldFN0YXRlKHN0YXRlID0+IHtcbiAgICAgIHN0YXRlLmlzVGhlbWVDb25maWdWaXNpYmxlID0gZmFsc2U7XG4gICAgfSk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8Q2xhc3NOYW1lcz5cbiAgICAgIHsoeyBjc3MgfSkgPT4gKFxuICAgICAgICA8RHJhd2VyXG4gICAgICAgICAgY2xvc2FibGU9e3sgcGxhY2VtZW50OiBcImVuZFwiIH19XG4gICAgICAgICAgb3Blbj17aXNUaGVtZUNvbmZpZ1Zpc2libGV9XG4gICAgICAgICAgdGl0bGU9XCLkuLvpopjphY3nva5cIlxuICAgICAgICAgIGNsYXNzTmFtZXM9e3tcbiAgICAgICAgICAgIGJvZHk6IGNzcyhkcmF3ZXJCb2R5U3R5bGUpXG4gICAgICAgICAgfX1cbiAgICAgICAgICBmb290ZXI9e1xuICAgICAgICAgICAgPE9wZXJhdGlvbnMgLz5cbiAgICAgICAgICB9XG4gICAgICAgICAgb25DbG9zZT17aGFuZGxlQ2xvc2V9XG4gICAgICAgID5cbiAgICAgICAgICA8U2Nyb2xsQXJlYVxuICAgICAgICAgICAgY2xhc3NOYW1lPXtjc3MoY29udGVudFN0eWxlKX1cbiAgICAgICAgICAgIHZpZXdwb3J0Q2xhc3NOYW1lPXtjc3MoY29udGFpbmVyU3R5bGUpfVxuICAgICAgICAgID5cbiAgICAgICAgICAgIDxEaXZpZGVyPuS4u+mimOaooeW8jzwvRGl2aWRlcj5cbiAgICAgICAgICAgIDxDb2xvclNjaGVtZSAvPlxuICAgICAgICAgICAgPERpdmlkZXI+6I+c5Y2V5biD5bGAPC9EaXZpZGVyPlxuICAgICAgICAgICAgPE1lbnVMYXlvdXQgLz5cbiAgICAgICAgICAgIDxEaXZpZGVyPuS4u+mimOminOiJsjwvRGl2aWRlcj5cbiAgICAgICAgICAgIDxUaGVtZUNvbG9ycyAvPlxuICAgICAgICAgIDwvU2Nyb2xsQXJlYT5cbiAgICAgICAgPC9EcmF3ZXI+XG4gICAgICApfVxuICAgIDwvQ2xhc3NOYW1lcz5cbiAgKTtcbn1cbiJdfQ== */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+const contentStyle = /* @__PURE__ */ css({
+  height: "100%",
+  paddingInline: globalCssVars.spacingSm,
+  paddingBlockStart: globalCssVars.spacingXs,
+  paddingBlockEnd: globalCssVars.spacingLg
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBWXFCIiwiZmlsZSI6Ii9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDbGFzc05hbWVzLCBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IERpdmlkZXIsIERyYXdlciwgZ2xvYmFsQ3NzVmFycywgU2Nyb2xsQXJlYSB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5cbmltcG9ydCB7IHVzZVRoZW1lU3RvcmUgfSBmcm9tIFwiLi4vLi4vLi4vLi4vc3RvcmVzXCI7XG5pbXBvcnQgeyBDb2xvclNjaGVtZSB9IGZyb20gXCIuL2NvbG9yLXNjaGVtZVwiO1xuaW1wb3J0IHsgTWVudUxheW91dCB9IGZyb20gXCIuL21lbnUtbGF5b3V0XCI7XG5pbXBvcnQgeyBPcGVyYXRpb25zIH0gZnJvbSBcIi4vb3BlcmF0aW9uc1wiO1xuaW1wb3J0IHsgVGhlbWVDb2xvcnMgfSBmcm9tIFwiLi90aGVtZS1jb2xvcnNcIjtcblxuY29uc3QgZHJhd2VyQm9keVN0eWxlID0gY3NzKHtcbiAgcGFkZGluZzogMFxufSk7XG5jb25zdCBjb250ZW50U3R5bGUgPSBjc3Moe1xuICBoZWlnaHQ6IFwiMTAwJVwiLFxuICBwYWRkaW5nSW5saW5lOiBnbG9iYWxDc3NWYXJzLnNwYWNpbmdTbSxcbiAgcGFkZGluZ0Jsb2NrU3RhcnQ6IGdsb2JhbENzc1ZhcnMuc3BhY2luZ1hzLFxuICBwYWRkaW5nQmxvY2tFbmQ6IGdsb2JhbENzc1ZhcnMuc3BhY2luZ0xnXG59KTtcblxuY29uc3QgY29udGFpbmVyU3R5bGUgPSBjc3Moe1xuICBwYWRkaW5nSW5saW5lOiBnbG9iYWxDc3NWYXJzLnNwYWNpbmdYc1xufSk7XG5cbmV4cG9ydCBmdW5jdGlvbiBUaGVtZUNvbmZpZygpIHtcbiAgY29uc3QgaXNUaGVtZUNvbmZpZ1Zpc2libGUgPSB1c2VUaGVtZVN0b3JlKHN0YXRlID0+IHN0YXRlLmlzVGhlbWVDb25maWdWaXNpYmxlKTtcblxuICBjb25zdCBoYW5kbGVDbG9zZSA9ICgpID0+IHtcbiAgICB1c2VUaGVtZVN0b3JlLnNldFN0YXRlKHN0YXRlID0+IHtcbiAgICAgIHN0YXRlLmlzVGhlbWVDb25maWdWaXNpYmxlID0gZmFsc2U7XG4gICAgfSk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8Q2xhc3NOYW1lcz5cbiAgICAgIHsoeyBjc3MgfSkgPT4gKFxuICAgICAgICA8RHJhd2VyXG4gICAgICAgICAgY2xvc2FibGU9e3sgcGxhY2VtZW50OiBcImVuZFwiIH19XG4gICAgICAgICAgb3Blbj17aXNUaGVtZUNvbmZpZ1Zpc2libGV9XG4gICAgICAgICAgdGl0bGU9XCLkuLvpopjphY3nva5cIlxuICAgICAgICAgIGNsYXNzTmFtZXM9e3tcbiAgICAgICAgICAgIGJvZHk6IGNzcyhkcmF3ZXJCb2R5U3R5bGUpXG4gICAgICAgICAgfX1cbiAgICAgICAgICBmb290ZXI9e1xuICAgICAgICAgICAgPE9wZXJhdGlvbnMgLz5cbiAgICAgICAgICB9XG4gICAgICAgICAgb25DbG9zZT17aGFuZGxlQ2xvc2V9XG4gICAgICAgID5cbiAgICAgICAgICA8U2Nyb2xsQXJlYVxuICAgICAgICAgICAgY2xhc3NOYW1lPXtjc3MoY29udGVudFN0eWxlKX1cbiAgICAgICAgICAgIHZpZXdwb3J0Q2xhc3NOYW1lPXtjc3MoY29udGFpbmVyU3R5bGUpfVxuICAgICAgICAgID5cbiAgICAgICAgICAgIDxEaXZpZGVyPuS4u+mimOaooeW8jzwvRGl2aWRlcj5cbiAgICAgICAgICAgIDxDb2xvclNjaGVtZSAvPlxuICAgICAgICAgICAgPERpdmlkZXI+6I+c5Y2V5biD5bGAPC9EaXZpZGVyPlxuICAgICAgICAgICAgPE1lbnVMYXlvdXQgLz5cbiAgICAgICAgICAgIDxEaXZpZGVyPuS4u+mimOminOiJsjwvRGl2aWRlcj5cbiAgICAgICAgICAgIDxUaGVtZUNvbG9ycyAvPlxuICAgICAgICAgIDwvU2Nyb2xsQXJlYT5cbiAgICAgICAgPC9EcmF3ZXI+XG4gICAgICApfVxuICAgIDwvQ2xhc3NOYW1lcz5cbiAgKTtcbn1cbiJdfQ== */");
+const containerStyle = /* @__PURE__ */ css({
+  paddingInline: globalCssVars.spacingXs
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBbUJ1QiIsImZpbGUiOiIvVXNlcnMvdmVudXMvVkVGL3ZlZi1mcmFtZXdvcmstcmVhY3QvcGFja2FnZXMvc3RhcnRlci9zcmMvY29tcG9uZW50cy9sYXlvdXQvY29tcG9uZW50cy90aGVtZS1jb25maWcvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2xhc3NOYW1lcywgY3NzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgeyBEaXZpZGVyLCBEcmF3ZXIsIGdsb2JhbENzc1ZhcnMsIFNjcm9sbEFyZWEgfSBmcm9tIFwiQHZlZi1mcmFtZXdvcmsvY29tcG9uZW50c1wiO1xuXG5pbXBvcnQgeyB1c2VUaGVtZVN0b3JlIH0gZnJvbSBcIi4uLy4uLy4uLy4uL3N0b3Jlc1wiO1xuaW1wb3J0IHsgQ29sb3JTY2hlbWUgfSBmcm9tIFwiLi9jb2xvci1zY2hlbWVcIjtcbmltcG9ydCB7IE1lbnVMYXlvdXQgfSBmcm9tIFwiLi9tZW51LWxheW91dFwiO1xuaW1wb3J0IHsgT3BlcmF0aW9ucyB9IGZyb20gXCIuL29wZXJhdGlvbnNcIjtcbmltcG9ydCB7IFRoZW1lQ29sb3JzIH0gZnJvbSBcIi4vdGhlbWUtY29sb3JzXCI7XG5cbmNvbnN0IGRyYXdlckJvZHlTdHlsZSA9IGNzcyh7XG4gIHBhZGRpbmc6IDBcbn0pO1xuY29uc3QgY29udGVudFN0eWxlID0gY3NzKHtcbiAgaGVpZ2h0OiBcIjEwMCVcIixcbiAgcGFkZGluZ0lubGluZTogZ2xvYmFsQ3NzVmFycy5zcGFjaW5nU20sXG4gIHBhZGRpbmdCbG9ja1N0YXJ0OiBnbG9iYWxDc3NWYXJzLnNwYWNpbmdYcyxcbiAgcGFkZGluZ0Jsb2NrRW5kOiBnbG9iYWxDc3NWYXJzLnNwYWNpbmdMZ1xufSk7XG5cbmNvbnN0IGNvbnRhaW5lclN0eWxlID0gY3NzKHtcbiAgcGFkZGluZ0lubGluZTogZ2xvYmFsQ3NzVmFycy5zcGFjaW5nWHNcbn0pO1xuXG5leHBvcnQgZnVuY3Rpb24gVGhlbWVDb25maWcoKSB7XG4gIGNvbnN0IGlzVGhlbWVDb25maWdWaXNpYmxlID0gdXNlVGhlbWVTdG9yZShzdGF0ZSA9PiBzdGF0ZS5pc1RoZW1lQ29uZmlnVmlzaWJsZSk7XG5cbiAgY29uc3QgaGFuZGxlQ2xvc2UgPSAoKSA9PiB7XG4gICAgdXNlVGhlbWVTdG9yZS5zZXRTdGF0ZShzdGF0ZSA9PiB7XG4gICAgICBzdGF0ZS5pc1RoZW1lQ29uZmlnVmlzaWJsZSA9IGZhbHNlO1xuICAgIH0pO1xuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPENsYXNzTmFtZXM+XG4gICAgICB7KHsgY3NzIH0pID0+IChcbiAgICAgICAgPERyYXdlclxuICAgICAgICAgIGNsb3NhYmxlPXt7IHBsYWNlbWVudDogXCJlbmRcIiB9fVxuICAgICAgICAgIG9wZW49e2lzVGhlbWVDb25maWdWaXNpYmxlfVxuICAgICAgICAgIHRpdGxlPVwi5Li76aKY6YWN572uXCJcbiAgICAgICAgICBjbGFzc05hbWVzPXt7XG4gICAgICAgICAgICBib2R5OiBjc3MoZHJhd2VyQm9keVN0eWxlKVxuICAgICAgICAgIH19XG4gICAgICAgICAgZm9vdGVyPXtcbiAgICAgICAgICAgIDxPcGVyYXRpb25zIC8+XG4gICAgICAgICAgfVxuICAgICAgICAgIG9uQ2xvc2U9e2hhbmRsZUNsb3NlfVxuICAgICAgICA+XG4gICAgICAgICAgPFNjcm9sbEFyZWFcbiAgICAgICAgICAgIGNsYXNzTmFtZT17Y3NzKGNvbnRlbnRTdHlsZSl9XG4gICAgICAgICAgICB2aWV3cG9ydENsYXNzTmFtZT17Y3NzKGNvbnRhaW5lclN0eWxlKX1cbiAgICAgICAgICA+XG4gICAgICAgICAgICA8RGl2aWRlcj7kuLvpopjmqKHlvI88L0RpdmlkZXI+XG4gICAgICAgICAgICA8Q29sb3JTY2hlbWUgLz5cbiAgICAgICAgICAgIDxEaXZpZGVyPuiPnOWNleW4g+WxgDwvRGl2aWRlcj5cbiAgICAgICAgICAgIDxNZW51TGF5b3V0IC8+XG4gICAgICAgICAgICA8RGl2aWRlcj7kuLvpopjpopzoibI8L0RpdmlkZXI+XG4gICAgICAgICAgICA8VGhlbWVDb2xvcnMgLz5cbiAgICAgICAgICA8L1Njcm9sbEFyZWE+XG4gICAgICAgIDwvRHJhd2VyPlxuICAgICAgKX1cbiAgICA8L0NsYXNzTmFtZXM+XG4gICk7XG59XG4iXX0= */");
+function ThemeConfig() {
+  const isThemeConfigVisible = useThemeStore((state) => state.isThemeConfigVisible);
+  const handleClose = () => {
+    useThemeStore.setState((state) => {
+      state.isThemeConfigVisible = false;
+    });
+  };
+  return /* @__PURE__ */ jsx(ClassNames, { children: ({
+    css: css2
+  }) => /* @__PURE__ */ jsx(Drawer, { closable: {
+    placement: "end"
+  }, open: isThemeConfigVisible, title: "主题配置", classNames: {
+    body: css2(drawerBodyStyle)
+  }, footer: /* @__PURE__ */ jsx(Operations, {}), onClose: handleClose, children: /* @__PURE__ */ jsxs(ScrollArea, { className: css2(contentStyle), viewportClassName: css2(containerStyle), children: [
+    /* @__PURE__ */ jsx(Divider, { children: "主题模式" }),
+    /* @__PURE__ */ jsx(ColorScheme, {}),
+    /* @__PURE__ */ jsx(Divider, { children: "菜单布局" }),
+    /* @__PURE__ */ jsx(MenuLayout, {}),
+    /* @__PURE__ */ jsx(Divider, { children: "主题颜色" }),
+    /* @__PURE__ */ jsx(ThemeColors, {})
+  ] }) }) });
+}
+
+export { ThemeConfig };

package/dist/es/components/layout/components/theme-config/menu-layout-card.js

@@ -0,0 +1,71 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+import { jsxs, jsx, Fragment } from '@emotion/react/jsx-runtime';
+import { css } from '@emotion/react';
+import { globalCssVars } from '@vef-framework/components';
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() {
+  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
+}
+const cardStyle = /* @__PURE__ */ css({
+  cursor: "pointer",
+  display: "flex",
+  height: "68px",
+  width: "96px",
+  gap: "6px",
+  padding: "6px",
+  border: `2px solid transparent`,
+  borderRadius: globalCssVars.borderRadius,
+  boxShadow: globalCssVars.shadowSm,
+  transition: `border-color ${globalCssVars.motionDurationMid} ease`,
+  "&:hover": {
+    borderColor: globalCssVars.colorPrimary
+  },
+  "&.selected": {
+    borderColor: globalCssVars.colorPrimary
+  },
+  ".dark &": {
+    boxShadow: "0 1px 3px 0 rgb(255 255 255 / 0.3), 0 1px 2px -1px rgb(255 255 255 / 0.3)"
+  }
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9tZW51LWxheW91dC1jYXJkLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVa0IiLCJmaWxlIjoiL1VzZXJzL3ZlbnVzL1ZFRi92ZWYtZnJhbWV3b3JrLXJlYWN0L3BhY2thZ2VzL3N0YXJ0ZXIvc3JjL2NvbXBvbmVudHMvbGF5b3V0L2NvbXBvbmVudHMvdGhlbWUtY29uZmlnL21lbnUtbGF5b3V0LWNhcmQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHR5cGUgeyBPcmllbnRhdGlvbiB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5pbXBvcnQgdHlwZSB7IENvbXBvbmVudFByb3BzIH0gZnJvbSBcInJlYWN0XCI7XG5cbmltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHsgZ2xvYmFsQ3NzVmFycyB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5cbmludGVyZmFjZSBNZW51TGF5b3V0Q2FyZFByb3BzIGV4dGVuZHMgQ29tcG9uZW50UHJvcHM8XCJkaXZcIj4ge1xuICBtb2RlOiBPcmllbnRhdGlvbjtcbn1cblxuY29uc3QgY2FyZFN0eWxlID0gY3NzKHtcbiAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGhlaWdodDogXCI2OHB4XCIsXG4gIHdpZHRoOiBcIjk2cHhcIixcbiAgZ2FwOiBcIjZweFwiLFxuICBwYWRkaW5nOiBcIjZweFwiLFxuICBib3JkZXI6IGAycHggc29saWQgdHJhbnNwYXJlbnRgLFxuICBib3JkZXJSYWRpdXM6IGdsb2JhbENzc1ZhcnMuYm9yZGVyUmFkaXVzLFxuICBib3hTaGFkb3c6IGdsb2JhbENzc1ZhcnMuc2hhZG93U20sXG4gIHRyYW5zaXRpb246IGBib3JkZXItY29sb3IgJHtnbG9iYWxDc3NWYXJzLm1vdGlvbkR1cmF0aW9uTWlkfSBlYXNlYCxcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBib3JkZXJDb2xvcjogZ2xvYmFsQ3NzVmFycy5jb2xvclByaW1hcnlcbiAgfSxcbiAgXCImLnNlbGVjdGVkXCI6IHtcbiAgICBib3JkZXJDb2xvcjogZ2xvYmFsQ3NzVmFycy5jb2xvclByaW1hcnlcbiAgfSxcbiAgXCIuZGFyayAmXCI6IHtcbiAgICBib3hTaGFkb3c6IFwiMCAxcHggM3B4IDAgcmdiKDI1NSAyNTUgMjU1IC8gMC4zKSwgMCAxcHggMnB4IC0xcHggcmdiKDI1NSAyNTUgMjU1IC8gMC4zKVwiXG4gIH1cbn0pO1xuXG5jb25zdCBsYXlvdXRTdHlsZSA9IHtcbiAgaGVhZGVyOiBjc3Moe1xuICAgIGZsZXg6IFwibm9uZVwiLFxuICAgIGhlaWdodDogXCIxNnB4XCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeSxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSksXG4gIG1haW46IGNzcyh7XG4gICAgZmxleDogXCJhdXRvXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeTIwMCxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSksXG4gIHdyYXBwZXI6IGNzcyh7XG4gICAgZmxleDogXCJhdXRvXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgICBnYXA6IFwiNnB4XCJcbiAgfSksXG4gIHNpZGViYXI6IGNzcyh7XG4gICAgd2lkdGg6IFwiMThweFwiLFxuICAgIGhlaWdodDogXCIxMDAlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeTMwMCxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSlcbn07XG5cbmV4cG9ydCBmdW5jdGlvbiBNZW51TGF5b3V0Q2FyZCh7IG1vZGUsIC4uLnByb3BzIH06IE1lbnVMYXlvdXRDYXJkUHJvcHMpIHtcbiAgY29uc3QgYm9keSA9IChcbiAgICA8ZGl2IGNzcz17bGF5b3V0U3R5bGUud3JhcHBlcn0+XG4gICAgICA8ZGl2IGNzcz17bGF5b3V0U3R5bGUuaGVhZGVyfSAvPlxuICAgICAgPGRpdiBjc3M9e2xheW91dFN0eWxlLm1haW59IC8+XG4gICAgPC9kaXY+XG4gICk7XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2IGNzcz17Y2FyZFN0eWxlfSB7Li4ucHJvcHN9PlxuICAgICAge1xuICAgICAgICBtb2RlID09PSBcImhvcml6b250YWxcIlxuICAgICAgICAgID8gYm9keVxuICAgICAgICAgIDogKFxuICAgICAgICAgICAgICA8PlxuICAgICAgICAgICAgICAgIDxkaXYgY3NzPXtsYXlvdXRTdHlsZS5zaWRlYmFyfSAvPlxuICAgICAgICAgICAgICAgIHtib2R5fVxuICAgICAgICAgICAgICA8Lz5cbiAgICAgICAgICAgIClcbiAgICAgIH1cbiAgICA8L2Rpdj5cbiAgKTtcbn1cbiJdfQ== */");
+const layoutStyle = {
+  header: /* @__PURE__ */ css({
+    flex: "none",
+    height: "16px",
+    backgroundColor: globalCssVars.colorPrimary,
+    borderRadius: "4px"
+  }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9tZW51LWxheW91dC1jYXJkLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQ1UiLCJmaWxlIjoiL1VzZXJzL3ZlbnVzL1ZFRi92ZWYtZnJhbWV3b3JrLXJlYWN0L3BhY2thZ2VzL3N0YXJ0ZXIvc3JjL2NvbXBvbmVudHMvbGF5b3V0L2NvbXBvbmVudHMvdGhlbWUtY29uZmlnL21lbnUtbGF5b3V0LWNhcmQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHR5cGUgeyBPcmllbnRhdGlvbiB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5pbXBvcnQgdHlwZSB7IENvbXBvbmVudFByb3BzIH0gZnJvbSBcInJlYWN0XCI7XG5cbmltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHsgZ2xvYmFsQ3NzVmFycyB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5cbmludGVyZmFjZSBNZW51TGF5b3V0Q2FyZFByb3BzIGV4dGVuZHMgQ29tcG9uZW50UHJvcHM8XCJkaXZcIj4ge1xuICBtb2RlOiBPcmllbnRhdGlvbjtcbn1cblxuY29uc3QgY2FyZFN0eWxlID0gY3NzKHtcbiAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGhlaWdodDogXCI2OHB4XCIsXG4gIHdpZHRoOiBcIjk2cHhcIixcbiAgZ2FwOiBcIjZweFwiLFxuICBwYWRkaW5nOiBcIjZweFwiLFxuICBib3JkZXI6IGAycHggc29saWQgdHJhbnNwYXJlbnRgLFxuICBib3JkZXJSYWRpdXM6IGdsb2JhbENzc1ZhcnMuYm9yZGVyUmFkaXVzLFxuICBib3hTaGFkb3c6IGdsb2JhbENzc1ZhcnMuc2hhZG93U20sXG4gIHRyYW5zaXRpb246IGBib3JkZXItY29sb3IgJHtnbG9iYWxDc3NWYXJzLm1vdGlvbkR1cmF0aW9uTWlkfSBlYXNlYCxcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBib3JkZXJDb2xvcjogZ2xvYmFsQ3NzVmFycy5jb2xvclByaW1hcnlcbiAgfSxcbiAgXCImLnNlbGVjdGVkXCI6IHtcbiAgICBib3JkZXJDb2xvcjogZ2xvYmFsQ3NzVmFycy5jb2xvclByaW1hcnlcbiAgfSxcbiAgXCIuZGFyayAmXCI6IHtcbiAgICBib3hTaGFkb3c6IFwiMCAxcHggM3B4IDAgcmdiKDI1NSAyNTUgMjU1IC8gMC4zKSwgMCAxcHggMnB4IC0xcHggcmdiKDI1NSAyNTUgMjU1IC8gMC4zKVwiXG4gIH1cbn0pO1xuXG5jb25zdCBsYXlvdXRTdHlsZSA9IHtcbiAgaGVhZGVyOiBjc3Moe1xuICAgIGZsZXg6IFwibm9uZVwiLFxuICAgIGhlaWdodDogXCIxNnB4XCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeSxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSksXG4gIG1haW46IGNzcyh7XG4gICAgZmxleDogXCJhdXRvXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeTIwMCxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSksXG4gIHdyYXBwZXI6IGNzcyh7XG4gICAgZmxleDogXCJhdXRvXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgICBnYXA6IFwiNnB4XCJcbiAgfSksXG4gIHNpZGViYXI6IGNzcyh7XG4gICAgd2lkdGg6IFwiMThweFwiLFxuICAgIGhlaWdodDogXCIxMDAlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeTMwMCxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSlcbn07XG5cbmV4cG9ydCBmdW5jdGlvbiBNZW51TGF5b3V0Q2FyZCh7IG1vZGUsIC4uLnByb3BzIH06IE1lbnVMYXlvdXRDYXJkUHJvcHMpIHtcbiAgY29uc3QgYm9keSA9IChcbiAgICA8ZGl2IGNzcz17bGF5b3V0U3R5bGUud3JhcHBlcn0+XG4gICAgICA8ZGl2IGNzcz17bGF5b3V0U3R5bGUuaGVhZGVyfSAvPlxuICAgICAgPGRpdiBjc3M9e2xheW91dFN0eWxlLm1haW59IC8+XG4gICAgPC9kaXY+XG4gICk7XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2IGNzcz17Y2FyZFN0eWxlfSB7Li4ucHJvcHN9PlxuICAgICAge1xuICAgICAgICBtb2RlID09PSBcImhvcml6b250YWxcIlxuICAgICAgICAgID8gYm9keVxuICAgICAgICAgIDogKFxuICAgICAgICAgICAgICA8PlxuICAgICAgICAgICAgICAgIDxkaXYgY3NzPXtsYXlvdXRTdHlsZS5zaWRlYmFyfSAvPlxuICAgICAgICAgICAgICAgIHtib2R5fVxuICAgICAgICAgICAgICA8Lz5cbiAgICAgICAgICAgIClcbiAgICAgIH1cbiAgICA8L2Rpdj5cbiAgKTtcbn1cbiJdfQ== */"),
+  main: /* @__PURE__ */ css({
+    flex: "auto",
+    backgroundColor: globalCssVars.colorPrimary200,
+    borderRadius: "4px"
+  }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9tZW51LWxheW91dC1jYXJkLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1Q1EiLCJmaWxlIjoiL1VzZXJzL3ZlbnVzL1ZFRi92ZWYtZnJhbWV3b3JrLXJlYWN0L3BhY2thZ2VzL3N0YXJ0ZXIvc3JjL2NvbXBvbmVudHMvbGF5b3V0L2NvbXBvbmVudHMvdGhlbWUtY29uZmlnL21lbnUtbGF5b3V0LWNhcmQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHR5cGUgeyBPcmllbnRhdGlvbiB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5pbXBvcnQgdHlwZSB7IENvbXBvbmVudFByb3BzIH0gZnJvbSBcInJlYWN0XCI7XG5cbmltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHsgZ2xvYmFsQ3NzVmFycyB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5cbmludGVyZmFjZSBNZW51TGF5b3V0Q2FyZFByb3BzIGV4dGVuZHMgQ29tcG9uZW50UHJvcHM8XCJkaXZcIj4ge1xuICBtb2RlOiBPcmllbnRhdGlvbjtcbn1cblxuY29uc3QgY2FyZFN0eWxlID0gY3NzKHtcbiAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGhlaWdodDogXCI2OHB4XCIsXG4gIHdpZHRoOiBcIjk2cHhcIixcbiAgZ2FwOiBcIjZweFwiLFxuICBwYWRkaW5nOiBcIjZweFwiLFxuICBib3JkZXI6IGAycHggc29saWQgdHJhbnNwYXJlbnRgLFxuICBib3JkZXJSYWRpdXM6IGdsb2JhbENzc1ZhcnMuYm9yZGVyUmFkaXVzLFxuICBib3hTaGFkb3c6IGdsb2JhbENzc1ZhcnMuc2hhZG93U20sXG4gIHRyYW5zaXRpb246IGBib3JkZXItY29sb3IgJHtnbG9iYWxDc3NWYXJzLm1vdGlvbkR1cmF0aW9uTWlkfSBlYXNlYCxcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBib3JkZXJDb2xvcjogZ2xvYmFsQ3NzVmFycy5jb2xvclByaW1hcnlcbiAgfSxcbiAgXCImLnNlbGVjdGVkXCI6IHtcbiAgICBib3JkZXJDb2xvcjogZ2xvYmFsQ3NzVmFycy5jb2xvclByaW1hcnlcbiAgfSxcbiAgXCIuZGFyayAmXCI6IHtcbiAgICBib3hTaGFkb3c6IFwiMCAxcHggM3B4IDAgcmdiKDI1NSAyNTUgMjU1IC8gMC4zKSwgMCAxcHggMnB4IC0xcHggcmdiKDI1NSAyNTUgMjU1IC8gMC4zKVwiXG4gIH1cbn0pO1xuXG5jb25zdCBsYXlvdXRTdHlsZSA9IHtcbiAgaGVhZGVyOiBjc3Moe1xuICAgIGZsZXg6IFwibm9uZVwiLFxuICAgIGhlaWdodDogXCIxNnB4XCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeSxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSksXG4gIG1haW46IGNzcyh7XG4gICAgZmxleDogXCJhdXRvXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeTIwMCxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSksXG4gIHdyYXBwZXI6IGNzcyh7XG4gICAgZmxleDogXCJhdXRvXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgICBnYXA6IFwiNnB4XCJcbiAgfSksXG4gIHNpZGViYXI6IGNzcyh7XG4gICAgd2lkdGg6IFwiMThweFwiLFxuICAgIGhlaWdodDogXCIxMDAlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeTMwMCxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSlcbn07XG5cbmV4cG9ydCBmdW5jdGlvbiBNZW51TGF5b3V0Q2FyZCh7IG1vZGUsIC4uLnByb3BzIH06IE1lbnVMYXlvdXRDYXJkUHJvcHMpIHtcbiAgY29uc3QgYm9keSA9IChcbiAgICA8ZGl2IGNzcz17bGF5b3V0U3R5bGUud3JhcHBlcn0+XG4gICAgICA8ZGl2IGNzcz17bGF5b3V0U3R5bGUuaGVhZGVyfSAvPlxuICAgICAgPGRpdiBjc3M9e2xheW91dFN0eWxlLm1haW59IC8+XG4gICAgPC9kaXY+XG4gICk7XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2IGNzcz17Y2FyZFN0eWxlfSB7Li4ucHJvcHN9PlxuICAgICAge1xuICAgICAgICBtb2RlID09PSBcImhvcml6b250YWxcIlxuICAgICAgICAgID8gYm9keVxuICAgICAgICAgIDogKFxuICAgICAgICAgICAgICA8PlxuICAgICAgICAgICAgICAgIDxkaXYgY3NzPXtsYXlvdXRTdHlsZS5zaWRlYmFyfSAvPlxuICAgICAgICAgICAgICAgIHtib2R5fVxuICAgICAgICAgICAgICA8Lz5cbiAgICAgICAgICAgIClcbiAgICAgIH1cbiAgICA8L2Rpdj5cbiAgKTtcbn1cbiJdfQ== */"),
+  wrapper: process.env.NODE_ENV === "production" ? {
+    name: "8xclx9",
+    styles: "flex:auto;display:flex;flex-direction:column;gap:6px"
+  } : {
+    name: "8xclx9",
+    styles: "flex:auto;display:flex;flex-direction:column;gap:6px/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9tZW51LWxheW91dC1jYXJkLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0Q1ciLCJmaWxlIjoiL1VzZXJzL3ZlbnVzL1ZFRi92ZWYtZnJhbWV3b3JrLXJlYWN0L3BhY2thZ2VzL3N0YXJ0ZXIvc3JjL2NvbXBvbmVudHMvbGF5b3V0L2NvbXBvbmVudHMvdGhlbWUtY29uZmlnL21lbnUtbGF5b3V0LWNhcmQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHR5cGUgeyBPcmllbnRhdGlvbiB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5pbXBvcnQgdHlwZSB7IENvbXBvbmVudFByb3BzIH0gZnJvbSBcInJlYWN0XCI7XG5cbmltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHsgZ2xvYmFsQ3NzVmFycyB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5cbmludGVyZmFjZSBNZW51TGF5b3V0Q2FyZFByb3BzIGV4dGVuZHMgQ29tcG9uZW50UHJvcHM8XCJkaXZcIj4ge1xuICBtb2RlOiBPcmllbnRhdGlvbjtcbn1cblxuY29uc3QgY2FyZFN0eWxlID0gY3NzKHtcbiAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGhlaWdodDogXCI2OHB4XCIsXG4gIHdpZHRoOiBcIjk2cHhcIixcbiAgZ2FwOiBcIjZweFwiLFxuICBwYWRkaW5nOiBcIjZweFwiLFxuICBib3JkZXI6IGAycHggc29saWQgdHJhbnNwYXJlbnRgLFxuICBib3JkZXJSYWRpdXM6IGdsb2JhbENzc1ZhcnMuYm9yZGVyUmFkaXVzLFxuICBib3hTaGFkb3c6IGdsb2JhbENzc1ZhcnMuc2hhZG93U20sXG4gIHRyYW5zaXRpb246IGBib3JkZXItY29sb3IgJHtnbG9iYWxDc3NWYXJzLm1vdGlvbkR1cmF0aW9uTWlkfSBlYXNlYCxcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBib3JkZXJDb2xvcjogZ2xvYmFsQ3NzVmFycy5jb2xvclByaW1hcnlcbiAgfSxcbiAgXCImLnNlbGVjdGVkXCI6IHtcbiAgICBib3JkZXJDb2xvcjogZ2xvYmFsQ3NzVmFycy5jb2xvclByaW1hcnlcbiAgfSxcbiAgXCIuZGFyayAmXCI6IHtcbiAgICBib3hTaGFkb3c6IFwiMCAxcHggM3B4IDAgcmdiKDI1NSAyNTUgMjU1IC8gMC4zKSwgMCAxcHggMnB4IC0xcHggcmdiKDI1NSAyNTUgMjU1IC8gMC4zKVwiXG4gIH1cbn0pO1xuXG5jb25zdCBsYXlvdXRTdHlsZSA9IHtcbiAgaGVhZGVyOiBjc3Moe1xuICAgIGZsZXg6IFwibm9uZVwiLFxuICAgIGhlaWdodDogXCIxNnB4XCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeSxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSksXG4gIG1haW46IGNzcyh7XG4gICAgZmxleDogXCJhdXRvXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeTIwMCxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSksXG4gIHdyYXBwZXI6IGNzcyh7XG4gICAgZmxleDogXCJhdXRvXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgICBnYXA6IFwiNnB4XCJcbiAgfSksXG4gIHNpZGViYXI6IGNzcyh7XG4gICAgd2lkdGg6IFwiMThweFwiLFxuICAgIGhlaWdodDogXCIxMDAlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeTMwMCxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSlcbn07XG5cbmV4cG9ydCBmdW5jdGlvbiBNZW51TGF5b3V0Q2FyZCh7IG1vZGUsIC4uLnByb3BzIH06IE1lbnVMYXlvdXRDYXJkUHJvcHMpIHtcbiAgY29uc3QgYm9keSA9IChcbiAgICA8ZGl2IGNzcz17bGF5b3V0U3R5bGUud3JhcHBlcn0+XG4gICAgICA8ZGl2IGNzcz17bGF5b3V0U3R5bGUuaGVhZGVyfSAvPlxuICAgICAgPGRpdiBjc3M9e2xheW91dFN0eWxlLm1haW59IC8+XG4gICAgPC9kaXY+XG4gICk7XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2IGNzcz17Y2FyZFN0eWxlfSB7Li4ucHJvcHN9PlxuICAgICAge1xuICAgICAgICBtb2RlID09PSBcImhvcml6b250YWxcIlxuICAgICAgICAgID8gYm9keVxuICAgICAgICAgIDogKFxuICAgICAgICAgICAgICA8PlxuICAgICAgICAgICAgICAgIDxkaXYgY3NzPXtsYXlvdXRTdHlsZS5zaWRlYmFyfSAvPlxuICAgICAgICAgICAgICAgIHtib2R5fVxuICAgICAgICAgICAgICA8Lz5cbiAgICAgICAgICAgIClcbiAgICAgIH1cbiAgICA8L2Rpdj5cbiAgKTtcbn1cbiJdfQ== */",
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+  },
+  sidebar: /* @__PURE__ */ css({
+    width: "18px",
+    height: "100%",
+    backgroundColor: globalCssVars.colorPrimary300,
+    borderRadius: "4px"
+  }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy9tZW51LWxheW91dC1jYXJkLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrRFciLCJmaWxlIjoiL1VzZXJzL3ZlbnVzL1ZFRi92ZWYtZnJhbWV3b3JrLXJlYWN0L3BhY2thZ2VzL3N0YXJ0ZXIvc3JjL2NvbXBvbmVudHMvbGF5b3V0L2NvbXBvbmVudHMvdGhlbWUtY29uZmlnL21lbnUtbGF5b3V0LWNhcmQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHR5cGUgeyBPcmllbnRhdGlvbiB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5pbXBvcnQgdHlwZSB7IENvbXBvbmVudFByb3BzIH0gZnJvbSBcInJlYWN0XCI7XG5cbmltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHsgZ2xvYmFsQ3NzVmFycyB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5cbmludGVyZmFjZSBNZW51TGF5b3V0Q2FyZFByb3BzIGV4dGVuZHMgQ29tcG9uZW50UHJvcHM8XCJkaXZcIj4ge1xuICBtb2RlOiBPcmllbnRhdGlvbjtcbn1cblxuY29uc3QgY2FyZFN0eWxlID0gY3NzKHtcbiAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGhlaWdodDogXCI2OHB4XCIsXG4gIHdpZHRoOiBcIjk2cHhcIixcbiAgZ2FwOiBcIjZweFwiLFxuICBwYWRkaW5nOiBcIjZweFwiLFxuICBib3JkZXI6IGAycHggc29saWQgdHJhbnNwYXJlbnRgLFxuICBib3JkZXJSYWRpdXM6IGdsb2JhbENzc1ZhcnMuYm9yZGVyUmFkaXVzLFxuICBib3hTaGFkb3c6IGdsb2JhbENzc1ZhcnMuc2hhZG93U20sXG4gIHRyYW5zaXRpb246IGBib3JkZXItY29sb3IgJHtnbG9iYWxDc3NWYXJzLm1vdGlvbkR1cmF0aW9uTWlkfSBlYXNlYCxcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBib3JkZXJDb2xvcjogZ2xvYmFsQ3NzVmFycy5jb2xvclByaW1hcnlcbiAgfSxcbiAgXCImLnNlbGVjdGVkXCI6IHtcbiAgICBib3JkZXJDb2xvcjogZ2xvYmFsQ3NzVmFycy5jb2xvclByaW1hcnlcbiAgfSxcbiAgXCIuZGFyayAmXCI6IHtcbiAgICBib3hTaGFkb3c6IFwiMCAxcHggM3B4IDAgcmdiKDI1NSAyNTUgMjU1IC8gMC4zKSwgMCAxcHggMnB4IC0xcHggcmdiKDI1NSAyNTUgMjU1IC8gMC4zKVwiXG4gIH1cbn0pO1xuXG5jb25zdCBsYXlvdXRTdHlsZSA9IHtcbiAgaGVhZGVyOiBjc3Moe1xuICAgIGZsZXg6IFwibm9uZVwiLFxuICAgIGhlaWdodDogXCIxNnB4XCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeSxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSksXG4gIG1haW46IGNzcyh7XG4gICAgZmxleDogXCJhdXRvXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeTIwMCxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSksXG4gIHdyYXBwZXI6IGNzcyh7XG4gICAgZmxleDogXCJhdXRvXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgICBnYXA6IFwiNnB4XCJcbiAgfSksXG4gIHNpZGViYXI6IGNzcyh7XG4gICAgd2lkdGg6IFwiMThweFwiLFxuICAgIGhlaWdodDogXCIxMDAlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBnbG9iYWxDc3NWYXJzLmNvbG9yUHJpbWFyeTMwMCxcbiAgICBib3JkZXJSYWRpdXM6IFwiNHB4XCJcbiAgfSlcbn07XG5cbmV4cG9ydCBmdW5jdGlvbiBNZW51TGF5b3V0Q2FyZCh7IG1vZGUsIC4uLnByb3BzIH06IE1lbnVMYXlvdXRDYXJkUHJvcHMpIHtcbiAgY29uc3QgYm9keSA9IChcbiAgICA8ZGl2IGNzcz17bGF5b3V0U3R5bGUud3JhcHBlcn0+XG4gICAgICA8ZGl2IGNzcz17bGF5b3V0U3R5bGUuaGVhZGVyfSAvPlxuICAgICAgPGRpdiBjc3M9e2xheW91dFN0eWxlLm1haW59IC8+XG4gICAgPC9kaXY+XG4gICk7XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2IGNzcz17Y2FyZFN0eWxlfSB7Li4ucHJvcHN9PlxuICAgICAge1xuICAgICAgICBtb2RlID09PSBcImhvcml6b250YWxcIlxuICAgICAgICAgID8gYm9keVxuICAgICAgICAgIDogKFxuICAgICAgICAgICAgICA8PlxuICAgICAgICAgICAgICAgIDxkaXYgY3NzPXtsYXlvdXRTdHlsZS5zaWRlYmFyfSAvPlxuICAgICAgICAgICAgICAgIHtib2R5fVxuICAgICAgICAgICAgICA8Lz5cbiAgICAgICAgICAgIClcbiAgICAgIH1cbiAgICA8L2Rpdj5cbiAgKTtcbn1cbiJdfQ== */")
+};
+function MenuLayoutCard({
+  mode,
+  ...props
+}) {
+  const body = /* @__PURE__ */ jsxs("div", { css: layoutStyle.wrapper, children: [
+    /* @__PURE__ */ jsx("div", { css: layoutStyle.header }),
+    /* @__PURE__ */ jsx("div", { css: layoutStyle.main })
+  ] });
+  return /* @__PURE__ */ jsx("div", { css: cardStyle, ...props, children: mode === "horizontal" ? body : /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { css: layoutStyle.sidebar }),
+    body
+  ] }) });
+}
+
+export { MenuLayoutCard };

package/dist/es/components/layout/components/theme-config/menu-layout.js

@@ -0,0 +1,29 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+import { jsxs, jsx } from '@emotion/react/jsx-runtime';
+import { Center, Tooltip } from '@vef-framework/components';
+import { clsx } from '@vef-framework/core';
+import '../../../../stores/index.js';
+import { MenuLayoutCard } from './menu-layout-card.js';
+import { useThemeStore } from '../../../../stores/theme.js';
+
+function MenuLayout() {
+  const menuLayout = useThemeStore((state) => state.menuLayout);
+  return /* @__PURE__ */ jsxs(Center, { gap: "large", children: [
+    /* @__PURE__ */ jsx(Tooltip, { placement: "bottom", title: "垂直菜单模式", children: /* @__PURE__ */ jsx(MenuLayoutCard, { mode: "vertical", className: clsx({
+      selected: menuLayout === "vertical"
+    }), onClick: () => {
+      useThemeStore.setState((state) => {
+        state.menuLayout = "vertical";
+      });
+    } }) }),
+    /* @__PURE__ */ jsx(Tooltip, { placement: "bottom", title: "水平菜单模式", children: /* @__PURE__ */ jsx(MenuLayoutCard, { mode: "horizontal", className: clsx({
+      selected: menuLayout === "horizontal"
+    }), onClick: () => {
+      useThemeStore.setState((state) => {
+        state.menuLayout = "horizontal";
+      });
+    } }) })
+  ] });
+}
+
+export { MenuLayout };

package/dist/es/components/layout/components/theme-config/operations.js

@@ -0,0 +1,18 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+import { jsx } from '@emotion/react/jsx-runtime';
+import { Button, showSuccessMessage, Icon } from '@vef-framework/components';
+import { RefreshCwIcon } from 'lucide-react';
+import '../../../../stores/index.js';
+import { useThemeStore } from '../../../../stores/theme.js';
+
+function Operations() {
+  return /* @__PURE__ */ jsx(Button, { block: true, danger: true, icon: /* @__PURE__ */ jsx(Icon, { component: RefreshCwIcon }), onClick: () => {
+    useThemeStore.setState({
+      ...useThemeStore.getInitialState(),
+      isThemeConfigVisible: true
+    }, true);
+    showSuccessMessage("主题配置已重置成功");
+  }, children: "重置配置" });
+}
+
+export { Operations };

package/dist/es/components/layout/components/theme-config/theme-color-picker.js

@@ -0,0 +1,29 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+import { jsx } from '@emotion/react/jsx-runtime';
+import { ColorPicker } from '@vef-framework/components';
+import { useDidUpdate } from '@vef-framework/hooks';
+import { useState, useTransition } from 'react';
+import '../../../../stores/index.js';
+import { useThemeStore } from '../../../../stores/theme.js';
+
+function ThemeColorPicker({
+  color
+}) {
+  const currentValue = useThemeStore((state) => state.colors[color]);
+  const [localValue, setLocalValue] = useState(currentValue);
+  useDidUpdate(() => {
+    setLocalValue(currentValue);
+  }, [currentValue]);
+  const [_, startTransition] = useTransition();
+  return /* @__PURE__ */ jsx(ColorPicker, { arrow: false, format: "hex", value: localValue, onChange: (value) => {
+    setLocalValue(value.toHexString());
+  }, onChangeComplete: (value) => {
+    startTransition(() => {
+      useThemeStore.setState((state) => {
+        state.colors[color] = value.toHexString();
+      });
+    });
+  } });
+}
+
+export { ThemeColorPicker };

package/dist/es/components/layout/components/theme-config/theme-colors.js

@@ -0,0 +1,25 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+import { jsx } from '@emotion/react/jsx-runtime';
+import { css } from '@emotion/react';
+import { globalCssVars, semanticColors } from '@vef-framework/components';
+import { ConfigItem } from './config-item.js';
+import { ThemeColorPicker } from './theme-color-picker.js';
+
+const wrapperStyle = /* @__PURE__ */ css({
+  display: "flex",
+  flexDirection: "column",
+  gap: globalCssVars.spacingSm
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy92ZW51cy9WRUYvdmVmLWZyYW1ld29yay1yZWFjdC9wYWNrYWdlcy9zdGFydGVyL3NyYy9jb21wb25lbnRzL2xheW91dC9jb21wb25lbnRzL3RoZW1lLWNvbmZpZy90aGVtZS1jb2xvcnMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVFxQiIsImZpbGUiOiIvVXNlcnMvdmVudXMvVkVGL3ZlZi1mcmFtZXdvcmstcmVhY3QvcGFja2FnZXMvc3RhcnRlci9zcmMvY29tcG9uZW50cy9sYXlvdXQvY29tcG9uZW50cy90aGVtZS1jb25maWcvdGhlbWUtY29sb3JzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB0eXBlIHsgU2VtYW50aWNDb2xvciB9IGZyb20gXCJAdmVmLWZyYW1ld29yay9jb21wb25lbnRzXCI7XG5cbmltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHsgZ2xvYmFsQ3NzVmFycywgc2VtYW50aWNDb2xvcnMgfSBmcm9tIFwiQHZlZi1mcmFtZXdvcmsvY29tcG9uZW50c1wiO1xuXG5pbXBvcnQgeyBDb25maWdJdGVtIH0gZnJvbSBcIi4vY29uZmlnLWl0ZW1cIjtcbmltcG9ydCB7IFRoZW1lQ29sb3JQaWNrZXIgfSBmcm9tIFwiLi90aGVtZS1jb2xvci1waWNrZXJcIjtcblxuY29uc3Qgd3JhcHBlclN0eWxlID0gY3NzKHtcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGZsZXhEaXJlY3Rpb246IFwiY29sdW1uXCIsXG4gIGdhcDogZ2xvYmFsQ3NzVmFycy5zcGFjaW5nU21cbn0pO1xuXG5jb25zdCBzZW1hbnRpY0NvbG9yTGFiZWxzOiBSZWNvcmQ8U2VtYW50aWNDb2xvciwgc3RyaW5nPiA9IHtcbiAgcHJpbWFyeTogXCLkuLvoibJcIixcbiAgaW5mbzogXCLkv6Hmga/oibJcIixcbiAgc3VjY2VzczogXCLmiJDlip/oibJcIixcbiAgd2FybmluZzogXCLorablkYroibJcIixcbiAgZXJyb3I6IFwi6ZSZ6K+v6ImyXCJcbn07XG5cbmV4cG9ydCBmdW5jdGlvbiBUaGVtZUNvbG9ycygpIHtcbiAgY29uc3QgaXRlbXMgPSBzZW1hbnRpY0NvbG9ycy5tYXAoY29sb3IgPT4gKFxuICAgIDxDb25maWdJdGVtXG4gICAgICBrZXk9e2NvbG9yfVxuICAgICAgbGFiZWw9e3NlbWFudGljQ29sb3JMYWJlbHNbY29sb3JdfVxuICAgID5cbiAgICAgIDxUaGVtZUNvbG9yUGlja2VyIGNvbG9yPXtjb2xvcn0gLz5cbiAgICA8L0NvbmZpZ0l0ZW0+XG4gICkpO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdiBjc3M9e3dyYXBwZXJTdHlsZX0+XG4gICAgICB7aXRlbXN9XG4gICAgPC9kaXY+XG4gICk7XG59XG4iXX0= */");
+const semanticColorLabels = {
+  primary: "主色",
+  info: "信息色",
+  success: "成功色",
+  warning: "警告色",
+  error: "错误色"
+};
+function ThemeColors() {
+  const items = semanticColors.map((color) => /* @__PURE__ */ jsx(ConfigItem, { label: semanticColorLabels[color], children: /* @__PURE__ */ jsx(ThemeColorPicker, { color }) }, color));
+  return /* @__PURE__ */ jsx("div", { css: wrapperStyle, children: items });
+}
+
+export { ThemeColors };

package/dist/es/components/layout/hooks/index.js

@@ -0,0 +1,4 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+export { useColorSchemeUpdater } from './use-color-scheme-updater.js';
+export { useMenuNavigate } from './use-menu-navigate.js';
+export { useTabNavigate } from './use-tab-navigate.js';

package/dist/es/components/layout/hooks/use-color-scheme-updater.js

@@ -0,0 +1,68 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+import { useReducedMotion, useColorScheme } from '@vef-framework/hooks';
+import '../../../stores/index.js';
+import { useThemeStore } from '../../../stores/theme.js';
+
+function getNextColorScheme(colorScheme) {
+  return colorScheme === "system" ? "light" : colorScheme === "light" ? "dark" : "system";
+}
+function removeColorSchemeTransitionClass() {
+  document.documentElement.classList.remove("color-scheme-transition");
+}
+function useColorSchemeUpdater() {
+  const currentColorScheme = useThemeStore((state) => state.colorScheme);
+  const reducedMotion = useReducedMotion(false, {
+    getInitialValueInEffect: false
+  });
+  const systemColorScheme = useColorScheme("light", {
+    getInitialValueInEffect: false
+  });
+  function updateColorSchemeInternal(colorScheme) {
+    useThemeStore.setState((state) => {
+      state.colorScheme = colorScheme;
+    });
+  }
+  function updateColorScheme(nextColorScheme, position, isLoop = false) {
+    if (reducedMotion) {
+      updateColorSchemeInternal(nextColorScheme);
+      return;
+    }
+    if (isLoop && (currentColorScheme === "system" && systemColorScheme === "light" || currentColorScheme === "dark" && systemColorScheme === "dark")) {
+      updateColorSchemeInternal(nextColorScheme);
+      return;
+    }
+    if (!isLoop && (nextColorScheme === "system" && currentColorScheme === systemColorScheme || currentColorScheme === "system" && nextColorScheme === systemColorScheme)) {
+      updateColorSchemeInternal(nextColorScheme);
+      return;
+    }
+    document.documentElement.classList.add("color-scheme-transition");
+    const transition = document.startViewTransition(() => {
+      updateColorSchemeInternal(nextColorScheme);
+    });
+    const {
+      x,
+      y
+    } = position;
+    const radius = Math.hypot(Math.max(x, window.innerWidth - x), Math.max(y, window.innerHeight - y));
+    const isDarken = nextColorScheme === "dark" || nextColorScheme === "system" && systemColorScheme === "dark";
+    transition.ready.then(() => {
+      const animation = document.documentElement.animate({
+        clipPath: [`circle(0px at ${x}px ${y}px)`, `circle(${radius}px at ${x}px ${y}px)`]
+      }, {
+        duration: 800,
+        easing: "ease-out",
+        direction: isDarken ? "normal" : "reverse",
+        pseudoElement: isDarken ? "::view-transition-new(root)" : "::view-transition-old(root)"
+      });
+      animation.addEventListener("cancel", removeColorSchemeTransitionClass);
+      animation.addEventListener("remove", removeColorSchemeTransitionClass);
+    });
+    transition.finished.then(removeColorSchemeTransitionClass);
+  }
+  return {
+    getNextColorScheme,
+    updateColorScheme
+  };
+}
+
+export { useColorSchemeUpdater };

package/dist/es/components/layout/hooks/use-menu-navigate.js

@@ -0,0 +1,25 @@
+/*! @vef-framework/starter v2.0.0 made with ❤️ by Venus | 2025-11-25T10:06:38.668Z */
+import { useNavigate } from '@tanstack/react-router';
+import { isPlainObject } from '@vef-framework/shared';
+import { useCallback } from 'react';
+
+function useMenuNavigate() {
+  const navigate = useNavigate();
+  return useCallback(({
+    path,
+    meta
+  }) => {
+    const {
+      params,
+      search
+    } = meta ?? {};
+    return navigate({
+      to: path,
+      params: isPlainObject(params) ? params : void 0,
+      search: isPlainObject(search) ? search : void 0,
+      viewTransition: false
+    });
+  }, [navigate]);
+}
+
+export { useMenuNavigate };