@oiij/naive-ui 0.0.68 → 0.0.70

package/dist/composables/use-naive-theme.d.ts

@@ -0,0 +1,52 @@
+import { Colors } from "./_helper.js";
+import { ComputedRef, Ref } from "vue";
+import { GlobalThemeOverrides, NDateLocale, zhCN } from "naive-ui";
+import * as naive_ui_es_themes_interface0 from "naive-ui/es/themes/interface";
+
+//#region src/composables/use-naive-theme.d.ts
+type Locales<T extends string = string> = Record<T, {
+  name: string;
+  dateLocale: NDateLocale;
+  locale: typeof zhCN;
+}>;
+type NaiveThemeOptions<T extends string> = {
+  language?: T | Ref<T>;
+  darkMode?: boolean | Ref<boolean>;
+  colors?: Colors;
+  globalThemeOverrides?: GlobalThemeOverrides;
+  locales?: Partial<Locales<T>>;
+};
+declare function useNaiveTheme<T extends string>(options?: NaiveThemeOptions<T>): {
+  language: Ref<T, T>;
+  darkMode: Ref<boolean | undefined, boolean | undefined>;
+  theme: ComputedRef<naive_ui_es_themes_interface0.BuiltInGlobalTheme | undefined>;
+  colors: Ref<{
+    primary?: string | undefined;
+    info?: string | undefined;
+    success?: string | undefined;
+    warning?: string | undefined;
+    error?: string | undefined;
+  }, Colors | {
+    primary?: string | undefined;
+    info?: string | undefined;
+    success?: string | undefined;
+    warning?: string | undefined;
+    error?: string | undefined;
+  }>;
+  themeColors: ComputedRef<{
+    primary?: string | undefined;
+    info?: string | undefined;
+    success?: string | undefined;
+    warning?: string | undefined;
+    error?: string | undefined;
+  } | {
+    [k: string]: string | undefined;
+  }>;
+  themeOverrides: ComputedRef<GlobalThemeOverrides>;
+  locales: Locales<T>;
+  locale: ComputedRef<Locales<T>[T]>;
+  setColor: (v: Partial<Colors>) => void;
+};
+type NaiveThemeReturns = ReturnType<typeof useNaiveTheme>;
+//#endregion
+export { NaiveThemeOptions, NaiveThemeReturns, useNaiveTheme };

package/dist/composables/use-naive-theme.js

@@ -0,0 +1,89 @@
+import { getColors, getDarkColor } from "./_helper.js";
+import { computed, ref, toValue, watchEffect } from "vue";
+import { darkTheme, dateEnUS, dateZhCN, enUS, zhCN } from "naive-ui";
+
+//#region src/composables/use-naive-theme.ts
+const naiveLocaleMap = {
+	"zh-CN": {
+		name: "简体中文",
+		dateLocale: dateZhCN,
+		locale: zhCN
+	},
+	"en-US": {
+		name: "English",
+		dateLocale: dateEnUS,
+		locale: enUS
+	}
+};
+function useNaiveTheme(options) {
+	const { language = "zh-CN", darkMode, colors, globalThemeOverrides, locales } = options ?? {};
+	const languageRef = ref(toValue(language));
+	watchEffect(() => {
+		languageRef.value = toValue(language);
+	});
+	const darkModeRef = ref(toValue(darkMode));
+	watchEffect(() => {
+		darkModeRef.value = toValue(darkMode);
+	});
+	const { common, ...extra } = globalThemeOverrides ?? {};
+	const colorsRef = ref({ ...colors });
+	const themeColorsRef = computed(() => {
+		return darkModeRef.value ? Object.fromEntries(Object.entries(colorsRef.value).map(([k, v]) => [k, getDarkColor(v)])) : colorsRef.value;
+	});
+	function setColor(v) {
+		colorsRef.value = {
+			...colorsRef.value,
+			...v
+		};
+	}
+	const theme = computed(() => {
+		return darkModeRef?.value ? darkTheme : void 0;
+	});
+	const themeOverrides = computed(() => {
+		const { primary, info, success, warning, error } = getColors(themeColorsRef.value);
+		return {
+			common: {
+				primaryColor: primary?.color,
+				primaryColorHover: primary?.hover,
+				primaryColorPressed: primary?.pressed,
+				primaryColorSuppl: primary?.suppl,
+				infoColor: info?.color,
+				infoColorHover: info?.hover,
+				infoColorPressed: info?.pressed,
+				infoColorSuppl: info?.suppl,
+				successColor: success?.color,
+				successColorHover: success?.hover,
+				successColorPressed: success?.pressed,
+				successColorSuppl: success?.suppl,
+				warningColor: warning?.color,
+				warningColorHover: warning?.hover,
+				warningColorPressed: warning?.pressed,
+				warningColorSuppl: warning?.suppl,
+				errorColor: error?.color,
+				errorColorHover: error?.hover,
+				errorColorPressed: error?.pressed,
+				errorColorSuppl: error?.suppl,
+				...common
+			},
+			...extra
+		};
+	});
+	const _locales = {
+		...naiveLocaleMap,
+		...locales
+	};
+	return {
+		language: languageRef,
+		darkMode: darkModeRef,
+		theme,
+		colors: colorsRef,
+		themeColors: themeColorsRef,
+		themeOverrides,
+		locales: _locales,
+		locale: computed(() => _locales[languageRef.value] ?? naiveLocaleMap["zh-CN"]),
+		setColor
+	};
+}
+
+//#endregion
+export { useNaiveTheme };

package/dist/index.d.ts

@@ -1,6 +1,6 @@
-import { DataObject, DataRequestFields, UseDataRequestOptions, UseDataRequestPagination, UseDataRequestReturns, useDataRequest } from "./composables/useDataRequest.js";
-import { useLoading } from "./composables/useLoading.js";
-import { NaiveFormClearRules, NaiveFormOptions, NaiveFormReturns, NaiveFormRules, useNaiveForm } from "./composables/useNaiveForm.js";
-import { NaiveThemeReturns, useNaiveTheme } from "./composables/useNaiveTheme.js";
+import { DataObject, DataRequestFields, UseDataRequestOptions, UseDataRequestPagination, UseDataRequestReturns, useDataRequest } from "./composables/use-data-request.js";
+import { useLoading } from "./composables/use-loading.js";
+import { NaiveFormClearRules, NaiveFormOptions, NaiveFormReturns, NaiveFormRules, useNaiveForm } from "./composables/use-naive-form.js";
+import { NaiveThemeOptions, NaiveThemeReturns, useNaiveTheme } from "./composables/use-naive-theme.js";
 import "./composables/index.js";
-export { DataObject, DataRequestFields, NaiveFormClearRules, NaiveFormOptions, NaiveFormReturns, NaiveFormRules, NaiveThemeReturns, UseDataRequestOptions, UseDataRequestPagination, UseDataRequestReturns, useDataRequest, useLoading, useNaiveForm, useNaiveTheme };
+export { DataObject, DataRequestFields, NaiveFormClearRules, NaiveFormOptions, NaiveFormReturns, NaiveFormRules, NaiveThemeOptions, NaiveThemeReturns, UseDataRequestOptions, UseDataRequestPagination, UseDataRequestReturns, useDataRequest, useLoading, useNaiveForm, useNaiveTheme };

package/dist/index.js

@@ -1,7 +1,7 @@
-import { useDataRequest } from "./composables/useDataRequest.js";
-import { useLoading } from "./composables/useLoading.js";
-import { useNaiveForm } from "./composables/useNaiveForm.js";
-import { useNaiveTheme } from "./composables/useNaiveTheme.js";
+import { useDataRequest } from "./composables/use-data-request.js";
+import { useLoading } from "./composables/use-loading.js";
+import { useNaiveForm } from "./composables/use-naive-form.js";
+import { useNaiveTheme } from "./composables/use-naive-theme.js";
 import "./composables/index.js";
 
 export { useDataRequest, useLoading, useNaiveForm, useNaiveTheme };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@oiij/naive-ui",
   "type": "module",
-  "version": "0.0.68",
+  "version": "0.0.70",
   "description": "Some Composable Functions And Components for Vue 3",
   "author": "oiij",
   "license": "MIT",
@@ -45,9 +45,9 @@
     "vue": "^3.5.26",
     "vue-component-type-helpers": "^3.2.1",
     "vue-hooks-plus": "^2.4.1",
-    "@oiij/markdown-it": "0.0.10",
-    "@oiij/css-render": "0.0.8",
-    "@oiij/use": "0.0.30"
+    "@oiij/css-render": "0.0.9",
+    "@oiij/use": "0.0.37",
+    "@oiij/markdown-it": "0.0.10"
   },
   "devDependencies": {
     "@types/prismjs": "^1.26.5",
@@ -60,9 +60,9 @@
     "vue": "^3.5.26",
     "vue-component-type-helpers": "^3.2.1",
     "vue-hooks-plus": "^2.4.1",
-    "@oiij/markdown-it": "0.0.10",
-    "@oiij/css-render": "0.0.8",
-    "@oiij/use": "0.0.30"
+    "@oiij/css-render": "0.0.9",
+    "@oiij/use": "0.0.37",
+    "@oiij/markdown-it": "0.0.10"
   },
   "publishConfig": {
     "access": "public"

package/dist/composables/useLoading.d.ts

@@ -1,10 +0,0 @@
-//#region src/composables/useLoading.d.ts
-declare function useLoading(): {
-  show: (options?: {
-    text?: string;
-    duration?: number;
-  }) => void;
-  hide: () => void;
-} | undefined;
-//#endregion
-export { useLoading };

package/dist/composables/useNaiveTheme.d.ts

@@ -1,171 +0,0 @@
-import { Colors } from "./_helper.js";
-import { ComputedRef, Ref } from "vue";
-import { GlobalThemeOverrides, NDateLocale } from "naive-ui";
-import * as naive_ui_es_themes_interface0 from "naive-ui/es/themes/interface";
-
-//#region src/composables/useNaiveTheme.d.ts
-interface NaiveThemeOptions {
-  language?: string | Ref<string>;
-  darkMode?: boolean | Ref<boolean>;
-  colors?: Colors;
-  globalThemeOverrides?: GlobalThemeOverrides;
-}
-declare function useNaiveTheme(options?: NaiveThemeOptions): {
-  language: Ref<string | undefined, string | undefined>;
-  darkMode: Ref<boolean | undefined, boolean | undefined>;
-  theme: ComputedRef<naive_ui_es_themes_interface0.BuiltInGlobalTheme | undefined>;
-  themeOverrides: ComputedRef<GlobalThemeOverrides>;
-  locale: ComputedRef<{
-    name: string;
-    global: {
-      undo: string;
-      redo: string;
-      confirm: string;
-      clear: string;
-    };
-    Popconfirm: {
-      positiveText: string;
-      negativeText: string;
-    };
-    Cascader: {
-      placeholder: string;
-      loading: string;
-      loadingRequiredMessage: (label: string) => string;
-    };
-    Time: {
-      dateFormat: string;
-      dateTimeFormat: string;
-    };
-    DatePicker: {
-      yearFormat: string;
-      monthFormat: string;
-      dayFormat: string;
-      yearTypeFormat: string;
-      monthTypeFormat: string;
-      dateFormat: string;
-      dateTimeFormat: string;
-      quarterFormat: string;
-      weekFormat: string;
-      clear: string;
-      now: string;
-      confirm: string;
-      selectTime: string;
-      selectDate: string;
-      datePlaceholder: string;
-      datetimePlaceholder: string;
-      monthPlaceholder: string;
-      yearPlaceholder: string;
-      quarterPlaceholder: string;
-      weekPlaceholder: string;
-      startDatePlaceholder: string;
-      endDatePlaceholder: string;
-      startDatetimePlaceholder: string;
-      endDatetimePlaceholder: string;
-      startMonthPlaceholder: string;
-      endMonthPlaceholder: string;
-      monthBeforeYear: boolean;
-      firstDayOfWeek: 0 | 1 | 2 | 3 | 4 | 5 | 6;
-      today: string;
-    };
-    DataTable: {
-      checkTableAll: string;
-      uncheckTableAll: string;
-      confirm: string;
-      clear: string;
-    };
-    LegacyTransfer: {
-      sourceTitle: string;
-      targetTitle: string;
-    };
-    Transfer: {
-      selectAll: string;
-      unselectAll: string;
-      clearAll: string;
-      total: (num: number) => string;
-      selected: (num: number) => string;
-    };
-    Empty: {
-      description: string;
-    };
-    Select: {
-      placeholder: string;
-    };
-    TimePicker: {
-      placeholder: string;
-      positiveText: string;
-      negativeText: string;
-      now: string;
-      clear: string;
-    };
-    Pagination: {
-      goto: string;
-      selectionSuffix: string;
-    };
-    DynamicTags: {
-      add: string;
-    };
-    Log: {
-      loading: string;
-    };
-    Input: {
-      placeholder: string;
-    };
-    InputNumber: {
-      placeholder: string;
-    };
-    DynamicInput: {
-      create: string;
-    };
-    ThemeEditor: {
-      title: string;
-      clearAllVars: string;
-      clearSearch: string;
-      filterCompName: string;
-      filterVarName: string;
-      import: string;
-      export: string;
-      restore: string;
-    };
-    Image: {
-      tipPrevious: string;
-      tipNext: string;
-      tipCounterclockwise: string;
-      tipClockwise: string;
-      tipZoomOut: string;
-      tipZoomIn: string;
-      tipDownload: string;
-      tipClose: string;
-      tipOriginalSize: string;
-    };
-    Heatmap: {
-      less: string;
-      more: string;
-      monthFormat: string;
-      weekdayFormat: string;
-    };
-  }>;
-  dateLocale: ComputedRef<NDateLocale>;
-  color: Ref<{
-    primary?: string | undefined;
-    info?: string | undefined;
-    success?: string | undefined;
-    warning?: string | undefined;
-    error?: string | undefined;
-  }, {
-    primary?: string;
-    info?: string;
-    success?: string;
-    warning?: string;
-    error?: string;
-  } | {
-    primary?: string | undefined;
-    info?: string | undefined;
-    success?: string | undefined;
-    warning?: string | undefined;
-    error?: string | undefined;
-  }>;
-  setColor: (v: Partial<Colors>) => void;
-};
-type NaiveThemeReturns = ReturnType<typeof useNaiveTheme>;
-//#endregion
-export { NaiveThemeReturns, useNaiveTheme };

package/dist/composables/useNaiveTheme.js

@@ -1,86 +0,0 @@
-import { getColors } from "./_helper.js";
-import { computed, ref, toValue, watchEffect } from "vue";
-import { darkTheme, dateEnUS, dateZhCN, enUS, zhCN } from "naive-ui";
-
-//#region src/composables/useNaiveTheme.ts
-const naiveLocaleMap = {
-	"zh-CN": {
-		name: "简体中文",
-		dateLocale: dateZhCN,
-		locale: zhCN
-	},
-	"en-US": {
-		name: "English",
-		dateLocale: dateEnUS,
-		locale: enUS
-	}
-};
-function useNaiveTheme(options) {
-	const { language, darkMode, colors, globalThemeOverrides } = options ?? {};
-	const languageRef = ref(toValue(language));
-	watchEffect(() => {
-		languageRef.value = toValue(language);
-	});
-	const darkModeRef = ref(toValue(darkMode));
-	watchEffect(() => {
-		darkModeRef.value = toValue(darkMode);
-	});
-	const { common, ...extra } = globalThemeOverrides ?? {};
-	const colorRef = ref({ ...colors });
-	function setColor(v) {
-		colorRef.value = {
-			...colorRef.value,
-			...v
-		};
-	}
-	return {
-		language: languageRef,
-		darkMode: darkModeRef,
-		theme: computed(() => {
-			return darkModeRef?.value ? darkTheme : void 0;
-		}),
-		themeOverrides: computed(() => {
-			const { primary, info, success, warning, error } = getColors(colorRef.value);
-			return {
-				common: {
-					bodyColor: darkModeRef?.value ? "#1f1f1f" : "#f5f5f5",
-					primaryColor: primary?.color,
-					primaryColorHover: primary?.hover,
-					primaryColorPressed: primary?.pressed,
-					primaryColorSuppl: primary?.suppl,
-					infoColor: info?.color,
-					infoColorHover: info?.hover,
-					infoColorPressed: info?.pressed,
-					infoColorSuppl: info?.suppl,
-					successColor: success?.color,
-					successColorHover: success?.hover,
-					successColorPressed: success?.pressed,
-					successColorSuppl: success?.suppl,
-					warningColor: warning?.color,
-					warningColorHover: warning?.hover,
-					warningColorPressed: warning?.pressed,
-					warningColorSuppl: warning?.suppl,
-					errorColor: error?.color,
-					errorColorHover: error?.hover,
-					errorColorPressed: error?.pressed,
-					errorColorSuppl: error?.suppl,
-					...common
-				},
-				...extra
-			};
-		}),
-		locale: computed(() => {
-			if (!languageRef?.value || !naiveLocaleMap[languageRef.value]) return naiveLocaleMap["zh-CN"].locale;
-			return naiveLocaleMap[languageRef.value].locale;
-		}),
-		dateLocale: computed(() => {
-			if (!languageRef?.value || !naiveLocaleMap[languageRef.value]) return naiveLocaleMap["zh-CN"].dateLocale;
-			return naiveLocaleMap[languageRef.value].dateLocale;
-		}),
-		color: colorRef,
-		setColor
-	};
-}
-
-//#endregion
-export { useNaiveTheme };