@antdv-vue/pro-layout 0.0.0-stage → 2.0.3

package/dist/components/SettingDrawer/RegionalChange.js

@@ -0,0 +1,35 @@
+import { renderLayoutSettingItem } from "./LayoutChange.js";
+import { createVNode } from "vue";
+import { classNames } from "@v-c/util";
+import { Listy, Switch } from "antdv-next";
+//#region src/components/SettingDrawer/RegionalChange.tsx
+const RegionalSetting = ({ settings = {}, prefixCls, changeSetting, formatMessage, cssVarCls, hashId }) => {
+	return createVNode(Listy, {
+		"class": classNames(`${prefixCls}-list`, hashId, cssVarCls),
+		"itemRender": (item) => renderLayoutSettingItem(item),
+		"rowKey": (item) => item.title,
+		"styles": { item: {
+			borderBottom: 0,
+			paddingInlineStart: 0,
+			paddingInlineEnd: 0
+		} },
+		"items": [
+			"header",
+			"footer",
+			"siderMenu",
+			"menuHeader"
+		].map((key) => {
+			return {
+				title: formatMessage({ id: `app.setting.regionalsettings.${key}` }),
+				action: createVNode(Switch, {
+					"size": "small",
+					"class": classNames(`regional-${key}`, hashId, cssVarCls),
+					"checked": (settings[`${key}Render`] || settings[`${key}Render`]) === void 0,
+					"onChange": (checked) => changeSetting(`${key}Render`, checked === true ? void 0 : false)
+				}, null)
+			};
+		})
+	}, null);
+};
+//#endregion
+export { RegionalSetting as default };

package/dist/components/SettingDrawer/ThemeColor.d.ts

@@ -0,0 +1,28 @@
+import { FunctionalComponent } from "vue";
+
+//#region src/components/SettingDrawer/ThemeColor.d.ts
+interface TagProps {
+  color: string;
+  check: boolean;
+  class?: string;
+  onClick?: () => void;
+}
+interface ThemeColorProps {
+  colorList?: {
+    key: string;
+    color: string;
+    title?: string;
+  }[];
+  prefixCls: string;
+  value: string;
+  onChange: (color: string) => void;
+  formatMessage: (data: {
+    id: string;
+    defaultMessage?: string;
+  }) => string | undefined;
+  hashId: string;
+  cssVarCls: string;
+}
+declare const ThemeColor: FunctionalComponent<ThemeColorProps>;
+//#endregion
+export { TagProps, ThemeColorProps, ThemeColor as default };

package/dist/components/SettingDrawer/ThemeColor.js

@@ -0,0 +1,30 @@
+import { createVNode, mergeProps } from "vue";
+import { classNames } from "@v-c/util";
+import { Tooltip } from "antdv-next";
+import { CheckOutlined } from "@antdv-next/icons";
+import Wave from "antdv-next/dist/_util/wave/index";
+//#region src/components/SettingDrawer/ThemeColor.tsx
+const Tag = ({ color, check, ...rest }) => {
+	return createVNode("div", mergeProps(rest, { "style": { backgroundColor: color } }), [check ? createVNode(CheckOutlined, null, null) : ""]);
+};
+const ThemeColor = ({ value, colorList, onChange, prefixCls, formatMessage, hashId, cssVarCls }) => {
+	if (!colorList || colorList?.length < 1) return null;
+	const baseClassName = `${prefixCls}-theme-color`;
+	return createVNode("div", { "class": classNames(`${baseClassName}`, hashId, cssVarCls) }, [colorList?.map(({ key, color, title }) => {
+		if (!key) return null;
+		return createVNode(Tooltip, {
+			"key": color,
+			"title": title ?? formatMessage({ id: `app.setting.themecolor.${key}` })
+		}, { default: () => [createVNode(Wave, {
+			"component": "Tag",
+			"disabled": (value.startsWith("#") ? value.toUpperCase() : value) === color
+		}, { default: () => [createVNode(Tag, {
+			"class": classNames(`${baseClassName}-block`, hashId, cssVarCls),
+			"color": color,
+			"check": (value.startsWith("#") ? value.toUpperCase() : value) === color,
+			"onClick": () => onChange && onChange(color)
+		}, null)] })] });
+	})]);
+};
+//#endregion
+export { ThemeColor as default };

package/dist/components/SettingDrawer/icon/group.d.ts

@@ -0,0 +1,10 @@
+import * as _$vue_jsx_runtime0 from "vue/jsx-runtime";
+
+//#region src/components/SettingDrawer/icon/group.d.ts
+declare function GroupIcon({
+  dark
+}: {
+  dark: boolean;
+}): _$vue_jsx_runtime0.JSX.Element;
+//#endregion
+export { GroupIcon };

package/dist/components/SettingDrawer/icon/group.js

@@ -0,0 +1,190 @@
+import { createVNode } from "vue";
+//#region src/components/SettingDrawer/icon/group.tsx
+function GroupIcon({ dark }) {
+	const color = dark ? {
+		bg: "rgb(36, 37, 37)",
+		sider: "rgb(42, 44, 44)",
+		header: "rgb(42, 44, 44)",
+		content: "rgb(42, 44, 44)",
+		firstLineOpacity: "0.2",
+		secendLineOpacity: "0.2"
+	} : {
+		bg: "#F0F2F5",
+		sider: "#E6EAF0",
+		header: "#E6EAF0",
+		content: "#FFF",
+		firstLineOpacity: "1",
+		secendLineOpacity: "1"
+	};
+	return createVNode("svg", {
+		"xmlns": "http://www.w3.org/2000/svg",
+		"xmlnsXlink": "http://www.w3.org/1999/xlink",
+		"width": "1em",
+		"height": "1em",
+		"viewBox": "0 0 104 104"
+	}, [createVNode("defs", null, [createVNode("rect", {
+		"id": "path-1",
+		"width": "90",
+		"height": "72",
+		"x": "0",
+		"y": "0",
+		"rx": "10"
+	}, null), createVNode("filter", {
+		"id": "filter-2",
+		"width": "152.2%",
+		"height": "165.3%",
+		"x": "-26.1%",
+		"y": "-27.1%",
+		"filterUnits": "objectBoundingBox"
+	}, [
+		createVNode("feMorphology", {
+			"in": "SourceAlpha",
+			"radius": "0.25",
+			"result": "shadowSpreadOuter1"
+		}, null),
+		createVNode("feOffset", {
+			"dy": "1",
+			"in": "shadowSpreadOuter1",
+			"result": "shadowOffsetOuter1"
+		}, null),
+		createVNode("feGaussianBlur", {
+			"in": "shadowOffsetOuter1",
+			"result": "shadowBlurOuter1",
+			"stdDeviation": "1"
+		}, null),
+		createVNode("feColorMatrix", {
+			"in": "shadowBlurOuter1",
+			"result": "shadowMatrixOuter1",
+			"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.08 0"
+		}, null),
+		createVNode("feMorphology", {
+			"in": "SourceAlpha",
+			"radius": "1",
+			"result": "shadowSpreadOuter2"
+		}, null),
+		createVNode("feOffset", {
+			"dy": "2",
+			"in": "shadowSpreadOuter2",
+			"result": "shadowOffsetOuter2"
+		}, null),
+		createVNode("feGaussianBlur", {
+			"in": "shadowOffsetOuter2",
+			"result": "shadowBlurOuter2",
+			"stdDeviation": "4"
+		}, null),
+		createVNode("feColorMatrix", {
+			"in": "shadowBlurOuter2",
+			"result": "shadowMatrixOuter2",
+			"values": "0 0 0 0 0.098466735 0 0 0 0 0.0599695403 0 0 0 0 0.0599695403 0 0 0 0.07 0"
+		}, null),
+		createVNode("feMorphology", {
+			"in": "SourceAlpha",
+			"radius": "2",
+			"result": "shadowSpreadOuter3"
+		}, null),
+		createVNode("feOffset", {
+			"dy": "4",
+			"in": "shadowSpreadOuter3",
+			"result": "shadowOffsetOuter3"
+		}, null),
+		createVNode("feGaussianBlur", {
+			"in": "shadowOffsetOuter3",
+			"result": "shadowBlurOuter3",
+			"stdDeviation": "8"
+		}, null),
+		createVNode("feColorMatrix", {
+			"in": "shadowBlurOuter3",
+			"result": "shadowMatrixOuter3",
+			"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0"
+		}, null),
+		createVNode("feMerge", null, [
+			createVNode("feMergeNode", { "in": "shadowMatrixOuter1" }, null),
+			createVNode("feMergeNode", { "in": "shadowMatrixOuter2" }, null),
+			createVNode("feMergeNode", { "in": "shadowMatrixOuter3" }, null)
+		])
+	])]), createVNode("g", {
+		"fill": "none",
+		"fill-rule": "evenodd",
+		"stroke": "none",
+		"stroke-width": "1"
+	}, [
+		createVNode("g", null, [createVNode("use", {
+			"fill": "#000",
+			"filter": "url(#filter-2)",
+			"xlink:href": "#path-1"
+		}, null), createVNode("use", {
+			"fill": color.sider,
+			"xlink:href": "#path-1"
+		}, null)]),
+		createVNode("path", {
+			"fill": color.bg,
+			"d": "M25 15h65v47c0 5.523-4.477 10-10 10H25V15z"
+		}, null),
+		createVNode("path", {
+			"stroke": color.header,
+			"stroke-linecap": "square",
+			"d": "M0.5 15.5L90.5 15.5"
+		}, null),
+		createVNode("rect", {
+			"width": "14",
+			"height": "3",
+			"x": "4",
+			"y": "26",
+			"fill": "#D7DDE6",
+			"rx": "1.5",
+			"opacity": color.firstLineOpacity
+		}, null),
+		createVNode("rect", {
+			"width": "9",
+			"height": "3",
+			"x": "4",
+			"y": "32",
+			"fill": "#D7DDE6",
+			"rx": "1.5",
+			"opacity": color.firstLineOpacity
+		}, null),
+		createVNode("rect", {
+			"width": "9",
+			"height": "3",
+			"x": "4",
+			"y": "42",
+			"fill": "#E6EAF0",
+			"rx": "1.5",
+			"opacity": color.secendLineOpacity
+		}, null),
+		createVNode("rect", {
+			"width": "9",
+			"height": "3",
+			"x": "4",
+			"y": "21",
+			"fill": "#E6EAF0",
+			"rx": "1.5",
+			"opacity": color.secendLineOpacity
+		}, null),
+		createVNode("rect", {
+			"width": "9",
+			"height": "3",
+			"x": "4",
+			"y": "53",
+			"fill": "#D7DDE6",
+			"rx": "1.5",
+			"opacity": color.firstLineOpacity
+		}, null),
+		createVNode("rect", {
+			"width": "14",
+			"height": "3",
+			"x": "4",
+			"y": "47",
+			"fill": "#D7DDE6",
+			"rx": "1.5",
+			"opacity": color.firstLineOpacity
+		}, null),
+		createVNode("path", {
+			"stroke": color.sider,
+			"stroke-linecap": "square",
+			"d": "M25.5 15.5L25.5 72.5"
+		}, null)
+	])]);
+}
+//#endregion
+export { GroupIcon };

package/dist/components/SettingDrawer/icon/sub.d.ts

@@ -0,0 +1,10 @@
+import * as _$vue_jsx_runtime0 from "vue/jsx-runtime";
+
+//#region src/components/SettingDrawer/icon/sub.d.ts
+declare function SubIcon({
+  dark
+}: {
+  dark: boolean;
+}): _$vue_jsx_runtime0.JSX.Element;
+//#endregion
+export { SubIcon };

package/dist/components/SettingDrawer/icon/sub.js

@@ -0,0 +1,187 @@
+import { createVNode } from "vue";
+//#region src/components/SettingDrawer/icon/sub.tsx
+function SubIcon({ dark }) {
+	const color = dark ? {
+		bg: "rgb(42, 44, 44)",
+		side: "#0f1c29",
+		header: "rgb(36, 37, 37)"
+	} : {
+		bg: "#F0F2F5",
+		side: "#001529",
+		header: "#fff"
+	};
+	return createVNode("svg", {
+		"xmlns": "http://www.w3.org/2000/svg",
+		"xmlnsXlink": "http://www.w3.org/1999/xlink",
+		"width": "1em",
+		"height": "1em",
+		"viewBox": "0 0 104 104"
+	}, [createVNode("defs", null, [createVNode("rect", {
+		"id": "path-1",
+		"width": "90",
+		"height": "72",
+		"x": "0",
+		"y": "0",
+		"rx": "10"
+	}, null), createVNode("filter", {
+		"id": "filter-2",
+		"width": "152.2%",
+		"height": "165.3%",
+		"x": "-26.1%",
+		"y": "-27.1%",
+		"filterUnits": "objectBoundingBox"
+	}, [
+		createVNode("feMorphology", {
+			"in": "SourceAlpha",
+			"radius": "0.25",
+			"result": "shadowSpreadOuter1"
+		}, null),
+		createVNode("feOffset", {
+			"dy": "1",
+			"in": "shadowSpreadOuter1",
+			"result": "shadowOffsetOuter1"
+		}, null),
+		createVNode("feGaussianBlur", {
+			"in": "shadowOffsetOuter1",
+			"result": "shadowBlurOuter1",
+			"stdDeviation": "1"
+		}, null),
+		createVNode("feColorMatrix", {
+			"in": "shadowBlurOuter1",
+			"result": "shadowMatrixOuter1",
+			"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.08 0"
+		}, null),
+		createVNode("feMorphology", {
+			"in": "SourceAlpha",
+			"radius": "1",
+			"result": "shadowSpreadOuter2"
+		}, null),
+		createVNode("feOffset", {
+			"dy": "2",
+			"in": "shadowSpreadOuter2",
+			"result": "shadowOffsetOuter2"
+		}, null),
+		createVNode("feGaussianBlur", {
+			"in": "shadowOffsetOuter2",
+			"result": "shadowBlurOuter2",
+			"stdDeviation": "4"
+		}, null),
+		createVNode("feColorMatrix", {
+			"in": "shadowBlurOuter2",
+			"result": "shadowMatrixOuter2",
+			"values": "0 0 0 0 0.098466735 0 0 0 0 0.0599695403 0 0 0 0 0.0599695403 0 0 0 0.07 0"
+		}, null),
+		createVNode("feMorphology", {
+			"in": "SourceAlpha",
+			"radius": "2",
+			"result": "shadowSpreadOuter3"
+		}, null),
+		createVNode("feOffset", {
+			"dy": "4",
+			"in": "shadowSpreadOuter3",
+			"result": "shadowOffsetOuter3"
+		}, null),
+		createVNode("feGaussianBlur", {
+			"in": "shadowOffsetOuter3",
+			"result": "shadowBlurOuter3",
+			"stdDeviation": "8"
+		}, null),
+		createVNode("feColorMatrix", {
+			"in": "shadowBlurOuter3",
+			"result": "shadowMatrixOuter3",
+			"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0"
+		}, null),
+		createVNode("feMerge", null, [
+			createVNode("feMergeNode", { "in": "shadowMatrixOuter1" }, null),
+			createVNode("feMergeNode", { "in": "shadowMatrixOuter2" }, null),
+			createVNode("feMergeNode", { "in": "shadowMatrixOuter3" }, null)
+		])
+	])]), createVNode("g", {
+		"fill": "none",
+		"fill-rule": "evenodd",
+		"stroke": "none",
+		"stroke-width": "1"
+	}, [
+		createVNode("g", null, [createVNode("use", {
+			"fill": "#000",
+			"filter": "url(#filter-2)",
+			"xlink:href": "#path-1"
+		}, null), createVNode("use", {
+			"fill": color.bg,
+			"xlink:href": "#path-1"
+		}, null)]),
+		createVNode("path", {
+			"fill": color.header,
+			"d": "M26 0h55c5.523 0 10 4.477 10 10v8H26V0z"
+		}, null),
+		createVNode("path", {
+			"fill": color.side,
+			"d": "M10 0h19v72H10C4.477 72 0 67.523 0 62V10C0 4.477 4.477 0 10 0z"
+		}, null),
+		createVNode("rect", {
+			"width": "14",
+			"height": "3",
+			"x": "5",
+			"y": "18",
+			"fill": "#D7DDE6",
+			"opacity": "0.2",
+			"rx": "1.5"
+		}, null),
+		createVNode("rect", {
+			"width": "14",
+			"height": "3",
+			"x": "5",
+			"y": "42",
+			"fill": "#D7DDE6",
+			"opacity": "0.2",
+			"rx": "1.5"
+		}, null),
+		createVNode("rect", {
+			"width": "9",
+			"height": "3",
+			"x": "9",
+			"y": "24",
+			"fill": "#D7DDE6",
+			"opacity": "0.2",
+			"rx": "1.5"
+		}, null),
+		createVNode("rect", {
+			"width": "9",
+			"height": "3",
+			"x": "9",
+			"y": "48",
+			"fill": "#D7DDE6",
+			"opacity": "0.2",
+			"rx": "1.5"
+		}, null),
+		createVNode("rect", {
+			"width": "9",
+			"height": "3",
+			"x": "9",
+			"y": "36",
+			"fill": "#D7DDE6",
+			"opacity": "0.2",
+			"rx": "1.5"
+		}, null),
+		createVNode("rect", {
+			"width": "14",
+			"height": "3",
+			"x": "9",
+			"y": "30",
+			"fill": "#D7DDE6",
+			"opacity": "0.2",
+			"rx": "1.5"
+		}, null),
+		createVNode("rect", {
+			"width": "14",
+			"height": "3",
+			"x": "9",
+			"y": "54",
+			"fill": "#D7DDE6",
+			"opacity": "0.2",
+			"rx": "1.5"
+		}, null)
+	])]);
+}
+//#endregion
+export { SubIcon };

package/dist/components/SettingDrawer/index.d.ts

@@ -0,0 +1,42 @@
+import { ProSettings } from "../../defaultSettings.js";
+import { SettingItemProps } from "./LayoutChange.js";
+import * as _$vue from "vue";
+
+//#region src/components/SettingDrawer/index.d.ts
+type MergerSettingsType<T> = Partial<T> & {
+  colorPrimary?: string;
+  colorWeak?: boolean;
+  [key: string]: any;
+};
+interface SettingDrawerProps {
+  settings?: MergerSettingsType<ProSettings>;
+  prefixCls?: string;
+  collapsed?: boolean;
+  colorList?: {
+    key: string;
+    color: string;
+    title?: string;
+  }[] | false;
+  hideHintAlert?: boolean;
+  hideCopyButton?: boolean;
+  onSettingChange?: (config: MergerSettingsType<ProSettings>) => void;
+  onCollapse?: (collapsed: boolean) => void;
+  'onUpdate:collapsed'?: (collapsed: boolean) => void;
+  otherSettingsRender?: (({
+    items,
+    settings,
+    changeSetting
+  }: {
+    settings: MergerSettingsType<ProSettings>;
+    changeSetting: (key: string, value: any) => void;
+    items: SettingItemProps[];
+  }) => SettingItemProps[]) | false;
+}
+/**
+ * 可视化配置组件
+ *
+ * @param props
+ */
+declare const SettingDrawer: _$vue.DefineSetupFnComponent<SettingDrawerProps, {}, {}, SettingDrawerProps & {}, _$vue.PublicProps>;
+//#endregion
+export { SettingDrawerProps, SettingDrawer as default };