@vunk/form 0.0.0-alpha.3 → 0.0.0-alpha.7

package/components/ground/src/index.vue.d.ts

@@ -1,4 +1,4 @@
-import { PropType, Ref } from 'vue';
+import { PropType } from 'vue';
 import { SetDataEvent } from '@vunk/form/shared/types';
 import { FormItemRendererSource } from '@vunk/form/shared/types';
 import { VkfInputSource } from '@vunk/form/shared/types/form-item';
@@ -7,10 +7,17 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<any[]>;
         default: undefined;
     };
+    source: {
+        type: PropType<any[]>;
+        default: () => never[];
+    };
+    data: {
+        type: PropType<Record<string, any>>;
+        default: () => {};
+    };
 }, {
-    propToFormItem: import("vue").ComputedRef<Record<string, FormItemRendererSource<string>>>;
-    formItems: Ref<FormItemRendererSource<string>[]>;
-    editProp: Ref<string>;
+    propToFormItem: import("vue").ComputedRef<any>;
+    editProp: import("vue").Ref<string>;
     setData: (obj: any, e: {
         k: any;
         v: any;
@@ -21,19 +28,37 @@ declare const _default: import("vue").DefineComponent<{
         n?: number | undefined;
     }) => void;
     setFormItem: (props: FormItemRendererSource, e: SetDataEvent<keyof VkfInputSource>) => void;
-    configPropDisabled: Ref<boolean>;
+    configPropDisabled: import("vue").Ref<boolean>;
     formItemClip: import("@vueuse/core").ClipboardReturn<true>;
     inputJson: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    'update:source': null;
+    'setData:source': (e: SetDataEvent) => SetDataEvent<any>;
+    'unsetData:source': null;
+    setData: (e: SetDataEvent) => SetDataEvent<any>;
     'update:componentLibCollapseExpanded': null;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     componentLibCollapseExpanded: {
         type: PropType<any[]>;
         default: undefined;
     };
+    source: {
+        type: PropType<any[]>;
+        default: () => never[];
+    };
+    data: {
+        type: PropType<Record<string, any>>;
+        default: () => {};
+    };
 }>> & {
+    onSetData?: ((e: SetDataEvent<any>) => any) | undefined;
+    "onSetData:source"?: ((e: SetDataEvent<any>) => any) | undefined;
     "onUpdate:componentLibCollapseExpanded"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:source"?: ((...args: any[]) => any) | undefined;
+    "onUnsetData:source"?: ((...args: any[]) => any) | undefined;
 }, {
+    data: Record<string, any>;
+    source: any[];
     componentLibCollapseExpanded: any[];
 }>;
 export default _default;

package/components/select/index.js

@@ -1,6 +1,6 @@
 import { _VkfFormItemCtx, VkfFormItem } from '@vunk/form/components/form-item';
 import { selectProps, selectEmits } from '@vunk/form/shared/element-plus/instances/select';
-import { defineComponent, resolveComponent, openBlock, createBlock, normalizeProps, guardReactiveProps, withCtx, createVNode, mergeProps, toHandlers, createElementBlock, Fragment, renderList } from 'vue';
+import { defineComponent, resolveComponent, openBlock, createBlock, normalizeProps, guardReactiveProps, withCtx, createVNode, mergeProps, toHandlers, createSlots, createElementBlock, Fragment, renderList, renderSlot, resolveDynamicComponent } from 'vue';
 import { createSelectBindProps, createSelectOnEmits } from '@vunk/form/shared/element-plus/ctx';
 import { ElSelect, ElOption } from 'element-plus';
 import { isPlainObject } from 'vunk/shared/utils-object';
@@ -11,6 +11,10 @@ const props = {
   options: {
     type: Array,
     default: () => []
+  },
+  selectSlots: {
+    type: Object,
+    default: void 0
   }
 };
 const emits = {
@@ -46,18 +50,28 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_VkfFormItem = resolveComponent("VkfFormItem");
   return openBlock(), createBlock(_component_VkfFormItem, normalizeProps(guardReactiveProps(_ctx.formItemBindProps)), {
     default: withCtx(() => [
-      createVNode(_component_ElSelect, mergeProps(_ctx.selectBindProps, toHandlers(_ctx.selectOnEmits)), {
+      createVNode(_component_ElSelect, mergeProps(_ctx.selectBindProps, toHandlers(_ctx.selectOnEmits)), createSlots({
         default: withCtx(() => [
           (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.options, (item) => {
             return openBlock(), createBlock(_component_ElOption, mergeProps({
               key: _ctx.getKey(item)
             }, item), null, 16);
-          }), 128))
+          }), 128)),
+          renderSlot(_ctx.$slots, "default")
         ]),
-        _: 1
-      }, 16)
+        _: 2
+      }, [
+        renderList(_ctx.selectSlots, (item, key) => {
+          return {
+            name: key,
+            fn: withCtx((e) => [
+              (openBlock(), createBlock(resolveDynamicComponent(item?.(e))))
+            ])
+          };
+        })
+      ]), 1040)
     ]),
-    _: 1
+    _: 3
   }, 16);
 }
 

package/components/select/src/ctx.d.ts

@@ -1,5 +1,6 @@
 import { VueComponentPropsType } from 'vunk/shared/types';
 import { PropType } from 'vue';
+import { SelectSlots } from './types';
 export declare const props: {
     options: {
         type: PropType<VueComponentPropsType<import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
@@ -64,6 +65,10 @@ export declare const props: {
         }>>>[]>;
         default: () => never[];
     };
+    selectSlots: {
+        type: PropType<SelectSlots>;
+        default: undefined;
+    };
     name: StringConstructor;
     id: StringConstructor;
     modelValue: {

package/components/select/src/index.vue.d.ts

@@ -62,6 +62,10 @@ declare const _default: import("vue").DefineComponent<{
         }>>>[]>;
         default: () => never[];
     };
+    selectSlots: {
+        type: import("vue").PropType<import("./types").SelectSlots>;
+        default: undefined;
+    };
     name: StringConstructor;
     id: StringConstructor;
     modelValue: {
@@ -365,6 +369,10 @@ declare const _default: import("vue").DefineComponent<{
         }>>>[]>;
         default: () => never[];
     };
+    selectSlots: {
+        type: import("vue").PropType<import("./types").SelectSlots>;
+        default: undefined;
+    };
     name: StringConstructor;
     id: StringConstructor;
     modelValue: {
@@ -576,5 +584,6 @@ declare const _default: import("vue").DefineComponent<{
         disabled: boolean;
         created: boolean;
     }>>>[];
+    selectSlots: import("./types").SelectSlots;
 }>;
 export default _default;

package/components/select/src/types.d.ts

@@ -1,3 +1,5 @@
-import { ReturnVoid } from 'vunk/shared/types';
-export declare type LoadEvent = {};
-export declare type OnLoad = (e: LoadEvent) => ReturnVoid;
+import { Func } from '@vunk/form/shared/types';
+export declare type SelectSlots = {
+    prefix?: Func;
+    empty?: Func;
+};

package/full-entry/main.d.ts

@@ -1,5 +1,4 @@
 export * from '@vunk-form/components/input';
-export * from '@vunk-form/components/ground';
 export * from '@vunk-form/components/form-item-renderer';
 export * from '@vunk-form/components/form-item-renderer-template';
 export * from '@vunk-form/components/drag-wrapper';
@@ -15,3 +14,4 @@ export * from '@vunk-form/components/switch';
 export * from '@vunk-form/components/form-item';
 export * from '@vunk-form/components/select';
 export * from '@vunk-form/components/select-config';
+export * from '@vunk-form/components/date-picker';

package/index.css

@@ -21,15 +21,18 @@
 .vkf-ground-main-x {
   flex: 3;
 }
-.vkf-ground-main-x .vkf-ground-main-card{
+
+.vkf-ground-main-x .vkf-ground-main-card {
   height: 100%;
 }
-.vkf-ground-main-card > .vk-card-title{
+
+.vkf-ground-main-card>.vk-card-title {
   display: flex;
   justify-content: end;
   margin-bottom: var(--gap-xxs);
 }
-.vkf-ground-main-card > .vk-card-body{
+
+.vkf-ground-main-card>.vk-card-body {
   height: 100%;
   border: 2px var(--el-border-color) dashed;
   overflow: auto;

package/index.d.ts

@@ -1,7 +1,7 @@
 
 export * from '@vunk/form/components/input'
 
-export * from '@vunk/form/components/ground'
+// export * from '@vunk/form/components/ground'
 
 export * from '@vunk/form/components/form-item-renderer'
 
@@ -24,11 +24,13 @@ export * from '@vunk/form/components/confirm-input'
 export * from '@vunk/form/components/form'
 
 export * from '@vunk/form/components/rules-config'
-
-export * from '@vunk/form/components/switch'
-
-export * from '@vunk/form/components/form-item'
-
-export * from '@vunk/form/components/select'
-
-export * from '@vunk/form/components/select-config'
+
+export * from '@vunk/form/components/switch'
+
+export * from '@vunk/form/components/form-item'
+
+export * from '@vunk/form/components/select'
+
+export * from '@vunk/form/components/select-config'
+
+export * from '@vunk/form/components/date-picker'

package/index.esm.js

@@ -1,5 +1,4 @@
 export * from '@vunk/form/components/input';
-export * from '@vunk/form/components/ground';
 export * from '@vunk/form/components/form-item-renderer';
 export * from '@vunk/form/components/form-item-renderer-template';
 export * from '@vunk/form/components/drag-wrapper';
@@ -15,3 +14,4 @@ export * from '@vunk/form/components/switch';
 export * from '@vunk/form/components/form-item';
 export * from '@vunk/form/components/select';
 export * from '@vunk/form/components/select-config';
+export * from '@vunk/form/components/date-picker';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vunk/form",
-  "version": "0.0.0-alpha.3",
+  "version": "0.0.0-alpha.7",
   "description": "",
   "module": "index.esm.js",
   "scripts": {

package/shared/element-plus/ctx/index.d.ts

@@ -7,3 +7,5 @@ export declare const createSwitchBindProps: <T2 extends Record<string, any>, EX
 export declare const createSwitchOnEmits: <T2 extends (...args: any) => any, EX extends ("update:modelValue" | "input" | "change")[], K extends "update:modelValue" | "input" | "change">(emit: T2, excludes?: EX | undefined) => { [k in K]: T2; };
 export declare const createSelectBindProps: <T2 extends Record<string, any>, EX extends ("size" | "id" | "disabled" | "modelValue" | "autocomplete" | "placeholder" | "clearable" | "suffixIcon" | "name" | "loading" | "automaticDropdown" | "effect" | "filterable" | "allowCreate" | "popperClass" | "remote" | "loadingText" | "noMatchText" | "noDataText" | "remoteMethod" | "filterMethod" | "multiple" | "multipleLimit" | "defaultFirstOption" | "reserveKeyword" | "valueKey" | "collapseTags" | "collapseTagsTooltip" | "teleported" | "persistent" | "clearIcon" | "fitInputWidth" | "tagType")[] | undefined, K extends Extract<EX extends (infer V)[] ? Exclude<keyof T2, V> : keyof T2, "size" | "id" | "disabled" | "modelValue" | "autocomplete" | "placeholder" | "clearable" | "suffixIcon" | "name" | "loading" | "automaticDropdown" | "effect" | "filterable" | "allowCreate" | "popperClass" | "remote" | "loadingText" | "noMatchText" | "noDataText" | "remoteMethod" | "filterMethod" | "multiple" | "multipleLimit" | "defaultFirstOption" | "reserveKeyword" | "valueKey" | "collapseTags" | "collapseTagsTooltip" | "teleported" | "persistent" | "clearIcon" | "fitInputWidth" | "tagType">>(propsArg: T2, excludes?: EX | undefined) => import("vue").ComputedRef<{ [k in K]: T2[k]; }>;
 export declare const createSelectOnEmits: <T2 extends (...args: any) => any, EX extends ("update:modelValue" | "change" | "focus" | "blur" | "clear" | "remove-tag" | "visible-change")[], K extends "update:modelValue" | "change" | "focus" | "blur" | "clear" | "remove-tag" | "visible-change">(emit: T2, excludes?: EX | undefined) => { [k in K]: T2; };
+export declare const createDatePickerBindProps: <T2 extends Record<string, any>, EX extends ("type" | "size" | "label" | "id" | "disabled" | "modelValue" | "placeholder" | "readonly" | "clearable" | "prefixIcon" | "tabindex" | "validateEvent" | "name" | "popperClass" | "clearIcon" | "format" | "valueFormat" | "editable" | "popperOptions" | "rangeSeparator" | "startPlaceholder" | "endPlaceholder" | "defaultValue" | "defaultTime" | "isRange" | "disabledHours" | "disabledMinutes" | "disabledSeconds" | "disabledDate" | "cellClassName" | "shortcuts" | "arrowControl" | "unlinkPanels")[] | undefined, K extends Extract<EX extends (infer V)[] ? Exclude<keyof T2, V> : keyof T2, "type" | "size" | "label" | "id" | "disabled" | "modelValue" | "placeholder" | "readonly" | "clearable" | "prefixIcon" | "tabindex" | "validateEvent" | "name" | "popperClass" | "clearIcon" | "format" | "valueFormat" | "editable" | "popperOptions" | "rangeSeparator" | "startPlaceholder" | "endPlaceholder" | "defaultValue" | "defaultTime" | "isRange" | "disabledHours" | "disabledMinutes" | "disabledSeconds" | "disabledDate" | "cellClassName" | "shortcuts" | "arrowControl" | "unlinkPanels">>(propsArg: T2, excludes?: EX | undefined) => import("vue").ComputedRef<{ [k in K]: T2[k]; }>;
+export declare const createDatePickerOnEmits: <T2 extends (...args: any) => any, EX extends ("update:modelValue" | "change" | "focus" | "blur" | "keydown" | "visible-change" | "calendar-change" | "panel-change")[], K extends "update:modelValue" | "change" | "focus" | "blur" | "keydown" | "visible-change" | "calendar-change" | "panel-change">(emit: T2, excludes?: EX | undefined) => { [k in K]: T2; };

package/shared/element-plus/ctx/index.js

@@ -1,4 +1,4 @@
-import { useTooltipContentProps, tagProps, inputProps, inputEmits, formProps, formEmits, formItemProps, switchProps, switchEmits } from 'element-plus';
+import { useTooltipContentProps, tagProps, timePickerDefaultProps, inputProps, inputEmits, formProps, formEmits, formItemProps, switchProps, switchEmits } from 'element-plus';
 import { bindPropsFactory, onEmitsFactory } from 'vunk/shared/utils-vue';
 import { defineComponent, openBlock, createElementBlock, createElementVNode } from 'vue';
 
@@ -1262,6 +1262,24 @@ const selectEmits = {
   "blur": null
 };
 
+const datePickerProps = {
+  ...timePickerDefaultProps,
+  type: {
+    type: String,
+    default: "date"
+  }
+};
+const datePickerEmits = {
+  "update:modelValue": null,
+  "change": null,
+  "focus": null,
+  "blur": null,
+  "calendar-change": null,
+  "panel-change": null,
+  "visible-change": null,
+  "keydown": null
+};
+
 const createInputBindProps = bindPropsFactory(inputProps);
 const createInputOnEmits = onEmitsFactory(inputEmits);
 const createFormBindProps = bindPropsFactory(formProps);
@@ -1271,5 +1289,7 @@ const createSwitchBindProps = bindPropsFactory(switchProps);
 const createSwitchOnEmits = onEmitsFactory(switchEmits);
 const createSelectBindProps = bindPropsFactory(selectProps);
 const createSelectOnEmits = onEmitsFactory(selectEmits);
+const createDatePickerBindProps = bindPropsFactory(datePickerProps);
+const createDatePickerOnEmits = onEmitsFactory(datePickerEmits);
 
-export { createFormBindProps, createFormItemBindProps, createFormOnEmits, createInputBindProps, createInputOnEmits, createSelectBindProps, createSelectOnEmits, createSwitchBindProps, createSwitchOnEmits };
+export { createDatePickerBindProps, createDatePickerOnEmits, createFormBindProps, createFormItemBindProps, createFormOnEmits, createInputBindProps, createInputOnEmits, createSelectBindProps, createSelectOnEmits, createSwitchBindProps, createSwitchOnEmits };

package/shared/element-plus/instances/date-picker.d.ts

@@ -0,0 +1,126 @@
+import { PropType } from 'vue';
+export declare const datePickerProps: {
+    type: {
+        type: PropType<"year" | "month" | "date" | "dates" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange">;
+        default: string;
+    };
+    id: {
+        type: (StringConstructor | ArrayConstructor)[];
+    };
+    name: {
+        type: (StringConstructor | ArrayConstructor)[];
+        default: string;
+    };
+    popperClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    format: {
+        type: StringConstructor;
+    };
+    valueFormat: {
+        type: PropType<string>;
+    };
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    clearIcon: {
+        type: PropType<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>;
+        default: import("vue").DefineComponent<{}, {}, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+    };
+    editable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    prefixIcon: {
+        type: PropType<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>;
+        default: string;
+    };
+    size: {
+        type: PropType<"" | "default" | "small" | "large">;
+        validator: (val: string) => val is "" | "default" | "small" | "large";
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    popperOptions: {
+        type: PropType<Partial<import("element-plus").Options>>;
+        default: () => {};
+    };
+    modelValue: {
+        type: PropType<string | number | Date | (string | number | Date)[]>;
+        default: string;
+    };
+    rangeSeparator: {
+        type: StringConstructor;
+        default: string;
+    };
+    startPlaceholder: StringConstructor;
+    endPlaceholder: StringConstructor;
+    defaultValue: {
+        type: PropType<Date | Date[]>;
+    };
+    defaultTime: {
+        type: PropType<Date | Date[]>;
+    };
+    isRange: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabledHours: {
+        type: FunctionConstructor;
+    };
+    disabledMinutes: {
+        type: FunctionConstructor;
+    };
+    disabledSeconds: {
+        type: FunctionConstructor;
+    };
+    disabledDate: {
+        type: FunctionConstructor;
+    };
+    cellClassName: {
+        type: FunctionConstructor;
+    };
+    shortcuts: {
+        type: ArrayConstructor;
+        default: () => never[];
+    };
+    arrowControl: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    label: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    tabindex: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
+    validateEvent: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    unlinkPanels: BooleanConstructor;
+};
+export declare const datePickerEmits: {
+    'update:modelValue': null;
+    change: null;
+    focus: null;
+    blur: null;
+    'calendar-change': null;
+    'panel-change': null;
+    'visible-change': null;
+    keydown: null;
+};

package/shared/element-plus/instances/date-picker.js

@@ -0,0 +1,21 @@
+import { timePickerDefaultProps } from 'element-plus';
+
+const datePickerProps = {
+  ...timePickerDefaultProps,
+  type: {
+    type: String,
+    default: "date"
+  }
+};
+const datePickerEmits = {
+  "update:modelValue": null,
+  "change": null,
+  "focus": null,
+  "blur": null,
+  "calendar-change": null,
+  "panel-change": null,
+  "visible-change": null,
+  "keydown": null
+};
+
+export { datePickerEmits, datePickerProps };

package/shared/types/form-item/date-picker.d.ts

@@ -0,0 +1,8 @@
+import { VkfDatePicker } from '@vunk/form/components/date-picker';
+import { VueComponentPropsType } from 'vunk/shared/types';
+import { Replace } from '../shared';
+export declare type VkfDatePickerProps<T = undefined> = Replace<VueComponentPropsType<typeof VkfDatePicker>, T>;
+export declare type VkfDatePickerSource<P = string> = VkfDatePickerProps<{
+    prop: P;
+    templateType: 'VkfDatePicker';
+}>;

package/shared/types/form-item/date-picker.js

@@ -0,0 +1 @@
+

package/shared/types/form-item/index.d.ts

@@ -1,3 +1,4 @@
 export * from './input';
 export * from './switch';
 export * from './select';
+export * from './date-picker';

package/shared/types/index.d.ts

@@ -1,3 +1,3 @@
-import { VkfInputSource, VkfSwitchSource, VkfSelectSource } from './form-item';
+import { VkfInputSource, VkfSwitchSource, VkfSelectSource, VkfDatePickerSource } from './form-item';
 export * from './shared';
-export declare type FormItemRendererSource<P = string> = VkfInputSource<P> | VkfSwitchSource<P> | VkfSelectSource<P>;
+export declare type FormItemRendererSource<P = string> = VkfInputSource<P> | VkfSwitchSource<P> | VkfSelectSource<P> | VkfDatePickerSource<P>;

package/shared/types/shared/index.d.ts

@@ -5,3 +5,7 @@ export declare type SetDataEvent<K = any> = {
     v: any;
     insert?: boolean;
 };
+export declare type UnsetDataEvent<K = any> = {
+    k: K;
+    n?: number;
+};

package/types/components/date-picker/index.d.ts

@@ -0,0 +1,4 @@
+import VkfDatePicker from './src/index.vue';
+export * as __VkfDatePicker from './src/types';
+export { VkfDatePicker, };
+export default VkfDatePicker;