@ecolovo/uniapp-components 2.0.1 → 2.0.3

package/index.js

@@ -1 +1,6 @@
+export * from './globals.d';
 export { default as init } from './init';
+export { default as componentEasyCom } from './easyCom';
+export * from './components';
+export * from './composable/message-box';
+export * from './components/message-box/message-box';

package/index.ts

@@ -1 +1,6 @@
+export * from './globals.d';
 export { default as init } from './init';
+export { default as componentEasyCom } from './easyCom';
+
+export * from './composable/message-box';
+export * from './components/message-box/message-box';

package/package.json

@@ -1,28 +1,31 @@
 {
 	"name": "@ecolovo/uniapp-components",
-	"version": "2.0.1",
+	"version": "2.0.3",
 	"description": "Ecolovo UniApp Vue3 组件库",
 	"scripts": {
 		"lint": "eslint",
 		"lint:fix": "eslint --fix",
-		"build": "tsc"
+		"build": "vue-tsc --noEmit && tsc",
+		"postbuild": "eslint --fix"
 	},
 	"keywords": [
 		"uniapp",
 		"components"
 	],
+	"types": "./index.d.ts",
 	"author": "Yang",
 	"license": "ISC",
 	"dependencies": {
-		"@ecolovo/utils": "^1.0.7",
+		"@ecolovo/utils": "^1.0.10",
 		"case-anything": "3.1.2",
 		"lodash-es": "4.17.21",
-		"vue": "^3.4.21"
+		"vue": "3.4.21"
 	},
 	"devDependencies": {
 		"@dcloudio/types": "^3.4.30",
 		"@eslint/js": "^10.0.1",
 		"@types/lodash-es": "^4.17.12",
+		"@vitejs/plugin-vue": "^6.0.7",
 		"@vue/eslint-config-prettier": "^10.2.0",
 		"@vue/eslint-config-typescript": "^14.8.0",
 		"@vue/tsconfig": "^0.1.3",
@@ -31,9 +34,14 @@
 		"eslint-plugin-prettier": "^5.5.5",
 		"eslint-plugin-vue": "^10.8.0",
 		"globals": "^17.4.0",
+		"jiti": "^2.7.0",
 		"miniprogram-api-typings": "^5.2.1",
 		"prettier": "^2.8.8",
-		"typescript": "^4.9.4",
-		"vue-eslint-parser": "^10.4.0"
+		"sass-embedded": "^1.100.0",
+		"typescript": "^5.9.3",
+		"vite": "^8.1.3",
+		"vite-plugin-dts": "^5.0.3",
+		"vue-eslint-parser": "^10.4.0",
+		"vue-tsc": "^3.3.6"
 	}
 }

package/styles/global.scss

@@ -1,15 +1,26 @@
 @use 'sass:color';
 @use './var' as *;
 @use './utils' as *;
+@use './reset' as *;
 
+// 定义全局变量
 page {
+	@each $name, $value in $z-indexes {
+		#{DO_NOT_USE__global-var-name(z-index, $name)}: #{$value};
+	}
 	@each $name, $value in $themes {
 		@for $i from 9 through 1 {
-			#{DO_NOT_USE__global-var-name(theme, $name + '-dark' + $i)}: #{color.scale($value, $blackness: $i * 10%)};
+			#{DO_NOT_USE__global-var-name(theme, '#{$name}-dark#{$i}')}: #{color.scale(
+					$value,
+					$blackness: $i * 10%
+				)};
 		}
 		#{DO_NOT_USE__global-var-name(theme, $name)}: #{$value};
 		@for $i from 1 through 9 {
-			#{DO_NOT_USE__global-var-name(theme, $name + '-light' + $i)}: #{color.scale($value, $whiteness: $i * 10%)};
+			#{DO_NOT_USE__global-var-name(theme, '#{$name}-light#{$i}')}: #{color.scale(
+					$value,
+					$whiteness: $i * 10%
+				)};
 		}
 	}
 	@each $name, $value in $colors {
@@ -22,3 +33,113 @@ page {
 		#{DO_NOT_USE__global-var-name(other, $name)}: #{$value};
 	}
 }
+
+// theme
+@each $name, $value in $themes {
+	@for $i from 9 through 1 {
+		#{'.color-#{$name}-dark#{$i}'} {
+			color: UTILS__GLOBAL_VAR('theme', '#{$name}-dark#{$i}');
+		}
+	}
+	#{'.color-#{$name}'} {
+		color: UTILS__GLOBAL_VAR('theme', $name);
+	}
+	@for $i from 1 through 9 {
+		#{'.color-#{$name}-light#{$i}'} {
+			color: UTILS__GLOBAL_VAR('theme', '#{$name}-light#{$i}');
+		}
+	}
+	@for $i from 9 through 1 {
+		#{'.bg-#{$name}-dark#{$i}'} {
+			background-color: UTILS__GLOBAL_VAR('theme', '#{$name}-dark#{$i}');
+		}
+	}
+	#{'.bg-#{$name}'} {
+		background-color: UTILS__GLOBAL_VAR('theme', $name);
+	}
+	@for $i from 1 through 9 {
+		#{'.bg-#{$name}-light#{$i}'} {
+			background-color: UTILS__GLOBAL_VAR('theme', '#{$name}-light#{$i}');
+		}
+	}
+}
+@each $name, $value in $colors {
+	#{'.color-#{$name}'} {
+		color: UTILS__GLOBAL_VAR('color', $name);
+	}
+	#{'.bg-#{$name}'} {
+		background-color: UTILS__GLOBAL_VAR('color', $name);
+	}
+}
+
+// font
+@each $name, $value in $font-sizes {
+	#{'.font-#{$name}'} {
+		font-size: UTILS__GLOBAL_VAR('font-size', $name);
+	}
+}
+.font-bold {
+	font-weight: 600;
+}
+
+// size
+.w100,
+.w-100 {
+	width: 100%;
+}
+.h100,
+.h-100 {
+	height: 100%;
+}
+.w100vw,
+.w-100vw {
+	width: 100vw;
+}
+.h100vw,
+.h-100vw {
+	height: 100vw;
+}
+
+// flex
+.flex-1 {
+	flex: 1;
+}
+.flex-0 {
+	flex: 0;
+}
+.flex-none {
+	flex: none;
+}
+.flex-auto {
+	flex: auto;
+}
+.flex-grow {
+	flex: 1 0 auto;
+}
+.flex-shrink {
+	flex: 0 1 auto;
+}
+
+// box-sizing
+.box-border {
+	box-sizing: border-box;
+}
+.box-content {
+	box-sizing: content-box;
+}
+
+// other
+.ellipsis {
+	@include UTILS__ELLIPSIS;
+}
+@for $i from 2 through 5 {
+	#{'.ellipsis-#{$i}'} {
+		@include UTILS__ELLIPSIS($i);
+	}
+}
+.overflow-hidden {
+	overflow: hidden;
+}
+.events-none {
+	pointer-events: none;
+}

package/styles/reset.scss

@@ -0,0 +1,5 @@
+@use './utils' as *;
+
+page {
+	font-size: UTILS__GLOBAL_VAR('font-size', 'normal');
+}

package/styles/utils/css-var.scss

@@ -5,29 +5,29 @@
 @use '../var/theme' as *;
 
 // 返回组件外部变量名
-@function UTILS__VAR_NAME($name, $component) {
+@function UTILS__VAR_NAME($component, $name) {
 	@return string.unquote('--#{$component-prefix}-#{$component}--#{$name}');
 }
 
 // 设置组件单个外部变量值
 @mixin UTILS__SET_VAR($component, $name, $value) {
-	#{UTILS__VAR_NAME($name, $component)}: $value;
+	#{UTILS__VAR_NAME($component, $name)}: $value;
 }
 
 // 设置组件一组外部变量值
 @mixin UTILS__SET_VAR_LIST($component, $values) {
 	@each $name, $value in $values {
-		#{UTILS__VAR_NAME($name, $component)}: $value;
+		#{UTILS__VAR_NAME($component, $name)}: $value;
 	}
 }
 
 // 返回组件外部变量值
-@function UTILS__VAR($name, $component, $default: null) {
+@function UTILS__VAR($component, $name, $default: null) {
 	@if $default != null {
-		@return var(UTILS__VAR_NAME($name, $component), $default);
+		@return var(UTILS__VAR_NAME($component, $name), $default);
 	}
 
-	@return var(UTILS__VAR_NAME($name, $component));
+	@return var(UTILS__VAR_NAME($component, $name));
 }
 
 // 返回组件内部变量值
@@ -40,9 +40,9 @@
 }
 
 // 定义组件变量
-@mixin UTILS__DEFINE_COMPONENT_VARS($vars, $name) {
-	@if not $name {
-		@error "请传入 $name";
+@mixin UTILS__DEFINE_COMPONENT_VARS($component, $vars) {
+	@if not $component {
+		@error "请传入 $component";
 	}
 
 	@if (not $vars) or (meta.type-of($vars) != 'map') {
@@ -50,7 +50,7 @@
 	}
 
 	@each $key, $value in $vars {
-		@include __DO_NOT_USE__define-component-var($name, $key, $value);
+		@include __DO_NOT_USE__define-component-var($component, $key, $value);
 	}
 }
 
@@ -75,7 +75,7 @@
 		$default: true;
 	}
 
-	$var-name: UTILS__VAR_NAME($name, $component);
+	$var-name: UTILS__VAR_NAME($component, $name);
 	$local-name: __DO_NOT_USE__local-var-name($name);
 
 	@if $default {

package/styles/utils/index.scss

@@ -2,4 +2,3 @@
 @forward './ellipsis';
 @forward './global-var';
 @forward './selector';
-@forward './z-index';

package/styles/var/component.scss

@@ -1,21 +1,24 @@
-// @forward '../../components/badge/badge.scss';
+@forward '../../components/badge/badge.scss';
 @forward '../../components/button/button.scss';
-// @forward '../../components/checkbox/checkbox.scss';
-// @forward '../../components/data-list/data-list.scss';
-// @forward '../../components/dialog/dialog.scss';
-// @forward '../../components/empty/empty.scss';
-// @forward '../../components/form-item/form-item.scss';
-// @forward '../../components/load-more/load-more.scss';
-// @forward '../../components/number-dialog/number-dialog.scss';
-// @forward '../../components/number-input/number-input.scss';
-// @forward '../../components/numpad/numpad.scss';
-// @forward '../../components/page/page.scss';
-// @forward '../../components/page/page-header.scss';
-// @forward '../../components/page/page-body.scss';
-// @forward '../../components/page/page-footer.scss';
-// @forward '../../components/popover/popover.scss';
-// @forward '../../components/popup/popup.scss';
-// @forward '../../components/price/price.scss';
-// @forward '../../components/search/search.scss';
-// @forward '../../components/switch/switch.scss';
-// @forward '../../components/tab/tab.scss';
+@forward '../../components/checkbox/checkbox.scss';
+@forward '../../components/data-list/data-list.scss';
+@forward '../../components/dialog/dialog.scss';
+@forward '../../components/dropdown/dropdown.scss';
+@forward '../../components/empty/empty.scss';
+@forward '../../components/form-item/form-item.scss';
+@forward '../../components/icon/icon.scss';
+@forward '../../components/load-more/load-more.scss';
+@forward '../../components/number-dialog/number-dialog.scss';
+@forward '../../components/number-input/number-input.scss';
+@forward '../../components/numpad/numpad.scss';
+@forward '../../components/page/page-body.scss';
+@forward '../../components/page/page-footer.scss';
+@forward '../../components/page/page-header.scss';
+@forward '../../components/page/page.scss';
+@forward '../../components/popover/popover.scss';
+@forward '../../components/popup/popup.scss';
+@forward '../../components/price/price.scss';
+@forward '../../components/search/search.scss';
+@forward '../../components/searching/searching.scss';
+@forward '../../components/switch/switch.scss';
+@forward '../../components/tab/tab.scss';

package/styles/var/theme.scss

@@ -2,8 +2,8 @@
 
 $component-prefix: 'app' !default;
 
-$z-index-maps: () !default;
-$z-index-maps-default: (
+$z-indexes: () !default;
+$z-indexes-default: (
 	loading: 9999,
 	dialog: 4000,
 	dropdown: 3000,
@@ -11,7 +11,7 @@ $z-index-maps-default: (
 	page-header: 2000,
 	page-footer: 2000,
 );
-$z-index-maps: map.merge($z-index-maps-default, $z-index-maps);
+$z-indexes: map.merge($z-indexes-default, $z-indexes);
 
 $themes: () !default;
 $themes-default: (

package/utils/date.d.ts

@@ -4,7 +4,9 @@ type ValidDateValue = Date | number | string;
  * @param   dateValue Date 对象、时间戳或时间格式字符串
  * @returns Date 对象
  */
-export declare function toDate(dateValue: ValidDateValue | null | undefined): Date | null;
+export declare function toDate(
+	dateValue: ValidDateValue | null | undefined
+): Date | null;
 type FormatFn = {
 	(date: Date | null | undefined, format?: string): string;
 	DATE: string;
@@ -43,5 +45,8 @@ export declare const formatDate: FormatFn;
  * @param   day2 时间2
  * @returns 天数差，负数: day1 < day2
  */
-export declare function daysDiff(day1: ValidDateValue, day2: ValidDateValue): number;
+export declare function daysDiff(
+	day1: ValidDateValue,
+	day2: ValidDateValue
+): number;
 export {};

package/utils/date.js

@@ -4,13 +4,23 @@
  * @returns Date 对象
  */
 export function toDate(dateValue) {
-	if (dateValue instanceof Date) return new Date(dateValue);
-	if (typeof dateValue === 'number') return new Date(dateValue);
-	if (!dateValue) return null;
-	if (typeof dateValue !== 'string') throw new Error("dateValue's type is invalid");
+	if (dateValue instanceof Date) {
+		return new Date(dateValue);
+	}
+	if (typeof dateValue === 'number') {
+		return new Date(dateValue);
+	}
+	if (!dateValue) {
+		return null;
+	}
+	if (typeof dateValue !== 'string') {
+		throw new Error("dateValue's type is invalid");
+	}
 	// 兼容 iOS 日期格式
 	const result = new Date(dateValue.replace(/-/g, '/'));
-	if (isNaN(result.getTime())) throw new Error('dateValue cannot be parsed to Date object');
+	if (isNaN(result.getTime())) {
+		throw new Error('dateValue cannot be parsed to Date object');
+	}
 	return result;
 }
 /**
@@ -31,7 +41,9 @@ export function toDate(dateValue) {
  * @returns 格式化后的日期
  */
 export const formatDate = (date, format = formatDate.DATE_WITH_YEAR) => {
-	if (!date) return '';
+	if (!date) {
+		return '';
+	}
 	const fullYear = date.getFullYear().toString();
 	const year = fullYear.substring(fullYear.length - 2);
 	const month = (date.getMonth() + 1).toString();
@@ -115,9 +127,15 @@ const TIMEZONE_OFFSET = new Date().getTimezoneOffset() * 60 * 1000;
  * @returns 毫秒数
  */
 function toDayTimestamp(date) {
-	if (typeof date === 'number') return date - TIMEZONE_OFFSET;
-	if (typeof date === 'string') return toDate(date).getTime() - TIMEZONE_OFFSET;
-	if (date instanceof Date) return date.getTime() - TIMEZONE_OFFSET;
+	if (typeof date === 'number') {
+		return date - TIMEZONE_OFFSET;
+	}
+	if (typeof date === 'string') {
+		return toDate(date).getTime() - TIMEZONE_OFFSET;
+	}
+	if (date instanceof Date) {
+		return date.getTime() - TIMEZONE_OFFSET;
+	}
 	return Date.now() - TIMEZONE_OFFSET;
 }
 /**
@@ -127,5 +145,8 @@ function toDayTimestamp(date) {
  * @returns 天数差，负数: day1 < day2
  */
 export function daysDiff(day1, day2) {
-	return Math.floor(toDayTimestamp(day1) / 8.64e7) - Math.floor(toDayTimestamp(day2) / 8.64e7);
+	return (
+		Math.floor(toDayTimestamp(day1) / 8.64e7) -
+		Math.floor(toDayTimestamp(day2) / 8.64e7)
+	);
 }

package/utils/date.ts

@@ -5,15 +5,21 @@ type ValidDateValue = Date | number | string;
  * @param   dateValue Date 对象、时间戳或时间格式字符串
  * @returns Date 对象
  */
-export function toDate(dateValue: ValidDateValue | null | undefined): Date | null {
+export function toDate(
+	dateValue: ValidDateValue | null | undefined
+): Date | null {
 	if (dateValue instanceof Date) return new Date(dateValue);
 	if (typeof dateValue === 'number') return new Date(dateValue);
 	if (!dateValue) return null;
-	if (typeof dateValue !== 'string') throw new Error("dateValue's type is invalid");
+	if (typeof dateValue !== 'string') {
+		throw new Error("dateValue's type is invalid");
+	}
 
 	// 兼容 iOS 日期格式
 	const result = new Date(dateValue.replace(/-/g, '/'));
-	if (isNaN(result.getTime())) throw new Error('dateValue cannot be parsed to Date object');
+	if (isNaN(result.getTime())) {
+		throw new Error('dateValue cannot be parsed to Date object');
+	}
 	return result;
 }
 
@@ -48,7 +54,10 @@ type FormatFn = {
  * @param   format 格式化参数 默认值 YYYY-MM-DD
  * @returns 格式化后的日期
  */
-export const formatDate: FormatFn = (date, format = formatDate.DATE_WITH_YEAR) => {
+export const formatDate: FormatFn = (
+	date,
+	format = formatDate.DATE_WITH_YEAR
+) => {
 	if (!date) return '';
 	const fullYear = date.getFullYear().toString();
 	const year = fullYear.substring(fullYear.length - 2);
@@ -137,7 +146,9 @@ const TIMEZONE_OFFSET = new Date().getTimezoneOffset() * 60 * 1000;
  */
 function toDayTimestamp(date: ValidDateValue): number {
 	if (typeof date === 'number') return date - TIMEZONE_OFFSET;
-	if (typeof date === 'string') return toDate(date)!.getTime() - TIMEZONE_OFFSET;
+	if (typeof date === 'string') {
+		return toDate(date)!.getTime() - TIMEZONE_OFFSET;
+	}
 	if (date instanceof Date) return date.getTime() - TIMEZONE_OFFSET;
 	return Date.now() - TIMEZONE_OFFSET;
 }
@@ -149,5 +160,8 @@ function toDayTimestamp(date: ValidDateValue): number {
  * @returns 天数差，负数: day1 < day2
  */
 export function daysDiff(day1: ValidDateValue, day2: ValidDateValue): number {
-	return Math.floor(toDayTimestamp(day1) / 8.64e7) - Math.floor(toDayTimestamp(day2) / 8.64e7);
+	return (
+		Math.floor(toDayTimestamp(day1) / 8.64e7) -
+		Math.floor(toDayTimestamp(day2) / 8.64e7)
+	);
 }

package/utils/price.d.ts

@@ -20,5 +20,8 @@ interface FormatPriceResult {
  * 格式化价格
  * @param price 价格
  */
-export declare function formatPrice(price: number | string, option?: FormatPriceOption): FormatPriceResult;
+export declare function formatPrice(
+	price: number | string,
+	option?: FormatPriceOption
+): FormatPriceResult;
 export {};

package/utils/price.js

@@ -19,20 +19,25 @@ export function formatPrice(price, option) {
 		price = -price;
 	}
 	const integer = Math.floor(price).toString();
-	const decimalNum = Math.round(Number(price + 'e' + (option?.precision ?? 2))) % 100;
+	const decimalNum =
+		Math.round(Number(price + 'e' + (option?.precision ?? 2))) % 100;
 	let decimal;
 	if (option?.padDecimal ?? true) {
-		decimal = '.' + decimalNum.toString().padStart(option?.precision ?? 2, '0');
+		decimal =
+			'.' + decimalNum.toString().padStart(option?.precision ?? 2, '0');
 	} else {
-		if (decimalNum === 0) decimal = '';
-		else decimal = decimalNum.toString().slice(1);
+		if (decimalNum === 0) {
+			decimal = '';
+		} else {
+			decimal = decimalNum.toString().slice(1);
+		}
 	}
 	const formattedPrice = `${negative ? '-' : ''}${integer}.${decimal}`;
 	return {
-		price: formattedPrice,
+		price: formattedPrice, // 价格字符串
 		negative,
-		integer,
-		decimal,
+		integer, // 整数部分
+		decimal, // 小数部分
 		number: Number(formattedPrice),
 	};
 }

package/utils/price.ts

@@ -21,7 +21,10 @@ interface FormatPriceResult {
  * 格式化价格
  * @param price 价格
  */
-export function formatPrice(price: number | string, option?: FormatPriceOption): FormatPriceResult {
+export function formatPrice(
+	price: number | string,
+	option?: FormatPriceOption
+): FormatPriceResult {
 	if (isNaN(Number(price))) {
 		return {
 			price: '',
@@ -38,10 +41,12 @@ export function formatPrice(price: number | string, option?: FormatPriceOption):
 		price = -price;
 	}
 	const integer = Math.floor(price).toString();
-	const decimalNum = Math.round(Number(price + 'e' + (option?.precision ?? 2))) % 100;
+	const decimalNum =
+		Math.round(Number(price + 'e' + (option?.precision ?? 2))) % 100;
 	let decimal: string;
 	if (option?.padDecimal ?? true) {
-		decimal = '.' + decimalNum.toString().padStart(option?.precision ?? 2, '0');
+		decimal =
+			'.' + decimalNum.toString().padStart(option?.precision ?? 2, '0');
 	} else {
 		if (decimalNum === 0) decimal = '';
 		else decimal = decimalNum.toString().slice(1);

package/utils/round.js

@@ -1,7 +1,10 @@
 export function round(val, precision = 0) {
 	if (val.toString().indexOf('e') >= 0) {
 		const exponential = val.toString().split('e');
-		return Math.round(+`${exponential[0]}e${+exponential[1] + precision}`) / 10 ** precision;
+		return (
+			Math.round(+`${exponential[0]}e${+exponential[1] + precision}`) /
+			10 ** precision
+		);
 	}
 	return Math.round(+`${val}e${precision}`) / 10 ** precision;
 }

package/utils/round.ts

@@ -1,7 +1,10 @@
 export function round(val: number, precision = 0): number {
 	if (val.toString().indexOf('e') >= 0) {
 		const exponential = val.toString().split('e');
-		return Math.round(+`${exponential[0]}e${+exponential[1]! + precision}`) / 10 ** precision;
+		return (
+			Math.round(+`${exponential[0]}e${+exponential[1]! + precision}`) /
+			10 ** precision
+		);
 	}
 	return Math.round(+`${val}e${precision}`) / 10 ** precision;
 }

package/utils/windowInfo.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="@dcloudio/types" />
 /** 胶囊按钮位置信息 */
 declare let menuButton: UniApp.GetMenuButtonBoundingClientRectRes | null;
 /** 胶囊按钮宽度，仅在 css 中使用，当有胶囊按钮时，表示胶囊按钮左边缘到屏幕右侧的宽度，否则为 `0px` */

package/styles/utils/z-index.scss

@@ -1,10 +0,0 @@
-@use 'sass:list';
-@use 'sass:map';
-@use 'sass:meta';
-@use 'sass:string';
-@use '../var/theme' as *;
-@use './css-var' as *;
-
-@function UTILS__z-index($key) {
-	@return map.get($z-index-maps, $key);
-}