twcpt 0.0.2 → 0.0.3

package/dist/components/j-tw-date-picker/types.d.ts

@@ -0,0 +1,147 @@
+import { DefineComponent } from 'vue';
+/**
+ * @description JTWDatePicker 日期范围选择器组件
+ * 基于 Element Plus DatePicker 封装，采用 Quasar 风格的属性设计
+ */
+export interface JTWDatePickerProps {
+    /**
+     * 绑定值（日期范围数组）
+     * @default undefined
+     */
+    modelValue?: [Date, Date] | [string, string] | [number, number];
+    /**
+     * 日期格式
+     * @default 'YYYY-MM-DD'
+     */
+    format?: string;
+    /**
+     * 值的格式（传给 v-model 的格式）
+     * @default 'YYYY-MM-DD'
+     */
+    valueFormat?: string;
+    /**
+     * 占位符文本
+     * @default '选择日期范围'
+     */
+    placeholder?: string;
+    /**
+     * 开始日期占位符
+     * @default '开始日期'
+     */
+    startPlaceholder?: string;
+    /**
+     * 结束日期占位符
+     * @default '结束日期'
+     */
+    endPlaceholder?: string;
+    /**
+     * 是否禁用
+     * @default false
+     */
+    disable?: boolean;
+    /**
+     * 是否只读
+     * @default false
+     */
+    readonly?: boolean;
+    /**
+     * 是否可清空
+     * @default true
+     */
+    clearable?: boolean;
+    /**
+     * 禁用的日期（函数返回 true 表示禁用该日期）
+     */
+    disabledDate?: (date: Date) => boolean;
+    /**
+     * 可选的最小日期
+     */
+    minDate?: Date | string | number;
+    /**
+     * 可选的最大日期
+     */
+    maxDate?: Date | string | number;
+    /**
+     * 默认显示的日期
+     */
+    defaultValue?: Date | [Date, Date];
+    /**
+     * 范围分隔符
+     * @default '—'
+     */
+    rangeSeparator?: string;
+    /**
+     * 是否显示清除按钮
+     * @default true
+     */
+    showClearButton?: boolean;
+    /**
+     * 弹出面板的位置
+     * @default 'bottom-start'
+     */
+    placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
+    /**
+     * 自定义类名
+     */
+    customClass?: string;
+    /**
+     * 弹出面板的自定义类名
+     */
+    popperClass?: string;
+    /**
+     * 快捷选项
+     */
+    shortcuts?: Array<{
+        text: string;
+        value: [Date, Date] | (() => [Date, Date]);
+    }>;
+}
+/** JTWDatePicker Emits 接口 */
+export interface JTWDatePickerEmits {
+    (e: 'update:modelValue', value: [Date, Date] | [string, string] | [number, number] | undefined): void;
+    (e: 'change', value: [Date, Date] | [string, string] | [number, number] | undefined): void;
+    (e: 'blur', event: FocusEvent): void;
+    (e: 'focus', event: FocusEvent): void;
+    (e: 'clear'): void;
+    (e: 'visible-change', visible: boolean): void;
+}
+/** JTWDatePicker Slots 接口 */
+export interface JTWDatePickerSlots {
+    /** 自定义日历图标 */
+    'prefix-icon'?: () => any;
+    /** 自定义范围分隔符 */
+    'range-separator'?: () => any;
+}
+/** JTWDatePicker 暴露的方法 */
+export interface JTWDatePickerExpose {
+    /** 根元素 */
+    $el: HTMLElement | undefined;
+    /** 聚焦输入框 */
+    focus: () => void;
+    /** 失焦输入框 */
+    blur: () => void;
+}
+/** Emits 配置对象格式 */
+export type JTWDatePickerEmitsOptions = {
+    'update:modelValue': (value: [Date, Date] | [string, string] | [number, number] | undefined) => true;
+    change: (value: [Date, Date] | [string, string] | [number, number] | undefined) => true;
+    blur: (event: FocusEvent) => true;
+    focus: (event: FocusEvent) => true;
+    clear: () => true;
+    'visible-change': (visible: boolean) => true;
+};
+/** JTWDatePicker 组件类型定义 */
+export type JTWDatePickerComponent = DefineComponent<JTWDatePickerProps, JTWDatePickerExpose, {}, {}, {}, {}, {}, JTWDatePickerEmitsOptions>;
+/** JTWDatePicker 实例类型 */
+export type JTWDatePickerInstance = InstanceType<JTWDatePickerComponent> & JTWDatePickerExpose;
+/** JTWDatePicker 模板 Props（用于全局类型声明） */
+export interface JTWDatePickerTemplateProps extends JTWDatePickerProps {
+    'onUpdate:modelValue'?: (value: [Date, Date] | [string, string] | [number, number] | undefined) => void;
+    onChange?: (value: [Date, Date] | [string, string] | [number, number] | undefined) => void;
+    onBlur?: (event: FocusEvent) => void;
+    onFocus?: (event: FocusEvent) => void;
+    onClear?: () => void;
+    'onVisible-change'?: (visible: boolean) => void;
+    class?: string | Record<string, boolean> | Array<string | Record<string, boolean>>;
+    style?: string | Record<string, string>;
+}

package/dist/components/j-tw-dropdown-btn/index.d.ts

@@ -0,0 +1,3 @@
+import { default as JTWDropdownBtn } from './index';
+export default JTWDropdownBtn;
+export * from './types';

package/dist/components/j-tw-dropdown-btn/types.d.ts

@@ -0,0 +1,69 @@
+import { DefineComponent } from 'vue';
+import { JTWBtnProps } from '../j-tw-btn/types';
+/** 下拉选项 */
+export interface JTWDropdownOption {
+    /** 选项唯一标识 */
+    value: string | number;
+    /** 选项显示文本 */
+    label: string;
+    /** 是否禁用 */
+    disabled?: boolean;
+}
+/**
+ * @description JTWDropdownBtn 下拉按钮组件
+ * 只支持 primary 颜色，不支持 color 属性
+ */
+export interface JTWDropdownBtnProps extends Omit<JTWBtnProps, 'color'> {
+    /**
+     * 下拉选项列表
+     */
+    options?: JTWDropdownOption[];
+    /**
+     * 当前选中的值
+     */
+    modelValue?: string | number;
+}
+/** JTWDropdownBtn Emits 接口 */
+export interface JTWDropdownBtnEmits {
+    (e: 'click', event: MouseEvent): void;
+    (e: 'update:modelValue', value: string | number): void;
+    (e: 'select', option: JTWDropdownOption): void;
+}
+/** JTWDropdownBtn Slots 接口 */
+export interface JTWDropdownBtnSlots {
+    /** 默认插槽，按钮文本内容 */
+    default?: () => any;
+    /** 图标插槽 */
+    icon?: () => any;
+    /** 自定义加载图标插槽 */
+    loading?: () => any;
+}
+/** JTWDropdownBtn 暴露的方法 */
+export interface JTWDropdownBtnExpose {
+    /** 按钮根元素 */
+    $el: HTMLElement | undefined;
+    /** 触发点击 */
+    click: () => void;
+    /** 打开下拉菜单 */
+    openDropdown: () => void;
+    /** 关闭下拉菜单 */
+    closeDropdown: () => void;
+}
+/** Emits 配置对象格式 */
+export type JTWDropdownBtnEmitsOptions = {
+    click: (e: MouseEvent) => true;
+    'update:modelValue': (value: string | number) => true;
+    select: (option: JTWDropdownOption) => true;
+};
+/** JTWDropdownBtn 组件类型定义 */
+export type JTWDropdownBtnComponent = DefineComponent<JTWDropdownBtnProps, JTWDropdownBtnExpose, {}, {}, {}, {}, {}, JTWDropdownBtnEmitsOptions>;
+/** JTWDropdownBtn 实例类型 */
+export type JTWDropdownBtnInstance = InstanceType<JTWDropdownBtnComponent> & JTWDropdownBtnExpose;
+/** JTWDropdownBtn 模板 Props（用于全局类型声明） */
+export interface JTWDropdownBtnTemplateProps extends JTWDropdownBtnProps {
+    onClick?: (event: MouseEvent) => void;
+    'onUpdate:modelValue'?: (value: string | number) => void;
+    onSelect?: (option: JTWDropdownOption) => void;
+    class?: string | Record<string, boolean> | Array<string | Record<string, boolean>>;
+    style?: string | Record<string, string>;
+}