@mtn-ui/components 0.0.3 → 0.0.6

package/dist/index/style.css

@@ -1 +1 @@
-.mtn-action-group-wrapper[data-v-6a4e52d6]{width:100%;position:relative;display:inline-block}.mtn-action-group-measure[data-v-6a4e52d6]{position:absolute;top:0;left:0;visibility:hidden;pointer-events:none;display:flex;white-space:nowrap}.measure-item[data-v-6a4e52d6]{padding:0 16px;font-size:14px}.mtn-action-group-container[data-v-6a4e52d6]{display:flex;align-items:center}
+@source "./**/*.{vue,ts,js,tsx,jsx}";.mtn-action-group-wrapper[data-v-6a4e52d6]{width:100%;position:relative;display:inline-block}.mtn-action-group-measure[data-v-6a4e52d6]{position:absolute;top:0;left:0;visibility:hidden;pointer-events:none;display:flex;white-space:nowrap}.measure-item[data-v-6a4e52d6]{padding:0 16px;font-size:14px}.mtn-action-group-container[data-v-6a4e52d6]{display:flex;align-items:center}.mtn-color-picker[data-v-95fc5ac1]{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}.mtn-color-picker__trigger[data-v-95fc5ac1]{position:relative;display:inline-block;border-radius:4px;overflow:hidden;border:1px solid var(--color-border-base, #dcdfe6);cursor:pointer}.mtn-color-picker--small .mtn-color-picker__trigger[data-v-95fc5ac1]{width:24px;height:24px}.mtn-color-picker--middle .mtn-color-picker__trigger[data-v-95fc5ac1]{width:32px;height:32px}.mtn-color-picker--large .mtn-color-picker__trigger[data-v-95fc5ac1]{width:40px;height:40px}.mtn-color-picker__native[data-v-95fc5ac1]{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;border:none;padding:0}.mtn-color-picker__native[data-v-95fc5ac1]:disabled{cursor:not-allowed}.mtn-color-picker__swatch[data-v-95fc5ac1]{display:block;width:100%;height:100%;border-radius:2px}.mtn-color-picker__hex[data-v-95fc5ac1]{width:90px;padding:4px 8px;font-size:12px;font-family:ui-monospace,monospace;border:1px solid var(--color-border-base, #dcdfe6);border-radius:4px;outline:none}.mtn-color-picker__hex[data-v-95fc5ac1]:focus{border-color:var(--color-primary, #409eff);box-shadow:0 0 0 2px #409eff33}.mtn-color-picker__hex[data-v-95fc5ac1]:disabled{background:var(--color-bg-base, #f5f7fa);cursor:not-allowed}.mtn-color-picker--small .mtn-color-picker__hex[data-v-95fc5ac1]{padding:2px 6px;font-size:11px;width:72px}.mtn-color-picker--large .mtn-color-picker__hex[data-v-95fc5ac1]{padding:6px 10px;font-size:14px;width:100px}.mtn-color-picker__apply[data-v-95fc5ac1]{padding:4px 12px;font-size:12px;color:var(--color-primary, #409eff);background:transparent;border:1px solid var(--color-primary, #409eff);border-radius:4px;cursor:pointer;transition:all .2s}.mtn-color-picker__apply[data-v-95fc5ac1]:hover:not(:disabled){color:#fff;background:var(--color-primary, #409eff)}.mtn-color-picker__apply[data-v-95fc5ac1]:disabled{opacity:.5;cursor:not-allowed}.mtn-color-picker--small .mtn-color-picker__apply[data-v-95fc5ac1]{padding:2px 8px;font-size:11px}.mtn-color-picker--large .mtn-color-picker__apply[data-v-95fc5ac1]{padding:6px 16px;font-size:14px}

package/dist/types/color-picker/ColorPicker.d.ts

@@ -0,0 +1,48 @@
+import { ColorPickerProps } from './types';
+
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ColorPickerProps>, {
+    modelValue: string;
+    disabled: boolean;
+    showHexInput: boolean;
+    showThemeApply: boolean;
+    size: string;
+    debounceMs: number;
+}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => void;
+    change: (value: string) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ColorPickerProps>, {
+    modelValue: string;
+    disabled: boolean;
+    showHexInput: boolean;
+    showThemeApply: boolean;
+    size: string;
+    debounceMs: number;
+}>>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onChange?: ((value: string) => any) | undefined;
+}>, {
+    size: "small" | "middle" | "large";
+    disabled: boolean;
+    debounceMs: number;
+    modelValue: string;
+    showHexInput: boolean;
+    showThemeApply: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/types/color-picker/index.d.ts

@@ -0,0 +1,2 @@
+export { default as ColorPicker } from './ColorPicker';
+export type { ColorPickerProps } from './types';

package/dist/types/color-picker/types.d.ts

@@ -0,0 +1,33 @@
+/**
+ * 择色器组件属性
+ */
+export interface ColorPickerProps {
+    /**
+     * 当前颜色（受控，hex 如 #409eff）
+     */
+    modelValue?: string;
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 是否显示十六进制输入框
+     * @default true
+     */
+    showHexInput?: boolean;
+    /**
+     * 是否显示「应用到主题」按钮（需配合 @mtn-ui/utils 的 setThemePrimary）
+     * @default false
+     */
+    showThemeApply?: boolean;
+    /**
+     * 尺寸
+     * @default 'middle'
+     */
+    size?: 'small' | 'middle' | 'large';
+    /**
+     * 原生选色条/取色盘变更时的防抖延迟（毫秒），仅对拖拽选色生效，hex 输入框不受影响
+     * @default 150
+     */
+    debounceMs?: number;
+}

package/dist/types/index.d.ts

@@ -8,6 +8,8 @@ export * from './confirm-button';
 export type * from './confirm-button/types';
 export * from './delete-button';
 export type * from './delete-button/types';
+export * from './color-picker';
+export type * from './color-picker/types';
 export type * from './button/types';
 /**
  * MTN UI Vue Plugin

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mtn-ui/components",
-  "version": "0.0.3",
+  "version": "0.0.6",
   "description": "MTN UI Components",
   "type": "module",
   "main": "./dist/index/index.js",
@@ -77,7 +77,10 @@
     "vue-tsc": "^2.0.0"
   },
   "dependencies": {
-    "@mtn-ui/utils": "0.0.3"
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "tailwind-merge": "^3.4.0",
+    "@mtn-ui/utils": "0.0.5"
   },
   "scripts": {
     "build": "vite build",