@raxium/vue 0.1.0 → 0.1.1

package/dist/components/date-picker/DatePickerContent.js

@@ -0,0 +1,93 @@
+import { computed, createBlock, createPropsRestProxy, createVNode, defineComponent, mergeProps, normalizeClass, openBlock, provide, renderSlot, unref, useSlots, withCtx } from "vue";
+import { DatePicker } from "@ark-ui/vue";
+import { ark } from "@ark-ui/vue/factory";
+import { useForwardProps } from "@ark-ui/vue/utils";
+import { clsx } from "@raxium/themes/utils";
+import { useTheme } from "../../composables/useTheme.js";
+import { findVNodeByName, findVNodesByName } from "../../utils/vnode.js";
+import { compact, isNil } from "es-toolkit";
+import { DATE_PICKER_CONTENT_PROVIDE_KEY } from "./index.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+    __name: "DatePickerContent",
+    props: {
+        class: {
+            type: [
+                Boolean,
+                null,
+                String,
+                Object,
+                Array
+            ]
+        },
+        asChild: {
+            type: Boolean
+        },
+        theme: {}
+    },
+    setup (__props) {
+        const props = createPropsRestProxy(__props, [
+            "class",
+            "theme"
+        ]);
+        const forwarded = useForwardProps(props);
+        const slots = useSlots();
+        const defaultSlots = computed(()=>slots.default?.());
+        const viewsState = computed(()=>{
+            const state = {
+                count: 0,
+                hasDayView: false,
+                hasMonthView: false,
+                hasYearView: false
+            };
+            state.count = compact([
+                "DatePickerDayView",
+                "DatePickerMonthView",
+                "DatePickerYearView"
+            ].map((name)=>findVNodesByName(defaultSlots.value, name).length > 0)).length;
+            state.hasDayView = !isNil(findVNodeByName(defaultSlots.value, "DatePickerDayView"));
+            state.hasMonthView = !isNil(findVNodeByName(defaultSlots.value, "DatePickerMonthView"));
+            state.hasYearView = !isNil(findVNodeByName(defaultSlots.value, "DatePickerYearView"));
+            return state;
+        });
+        const theme = useTheme(()=>__props.theme);
+        const crafts = computed(()=>theme.value.crafts.tvDatePicker());
+        provide(DATE_PICKER_CONTENT_PROVIDE_KEY, {
+            viewsState
+        });
+        return (_ctx, _cache)=>(openBlock(), createBlock(unref(DatePicker).Positioner, null, {
+                default: withCtx(()=>[
+                        createVNode(unref(DatePicker).Content, mergeProps(unref(forwarded), {
+                            class: crafts.value.content({
+                                class: unref(clsx)(__props.class),
+                                ...unref(theme)
+                            })
+                        }), {
+                            default: withCtx(()=>[
+                                    renderSlot(_ctx.$slots, "prefix"),
+                                    createVNode(unref(ark).div, {
+                                        class: normalizeClass(crafts.value.contentInner({
+                                            ...unref(theme)
+                                        })),
+                                        "data-scope": "date-picker",
+                                        "data-part": "content-inner"
+                                    }, {
+                                        default: withCtx(()=>[
+                                                renderSlot(_ctx.$slots, "default")
+                                            ]),
+                                        _: 3
+                                    }, 8, [
+                                        "class"
+                                    ]),
+                                    renderSlot(_ctx.$slots, "suffix")
+                                ]),
+                            _: 3
+                        }, 16, [
+                            "class"
+                        ])
+                    ]),
+                _: 3
+            }));
+    }
+});
+const DatePickerContent = _sfc_main;
+export default DatePickerContent;

package/dist/components/date-picker/DatePickerContent.vue.d.ts

@@ -0,0 +1,18 @@
+import type { DatePickerContentProps } from '.';
+declare var __VLS_14: {}, __VLS_22: {}, __VLS_24: {};
+type __VLS_Slots = {} & {
+    prefix?: (props: typeof __VLS_14) => any;
+} & {
+    default?: (props: typeof __VLS_22) => any;
+} & {
+    suffix?: (props: typeof __VLS_24) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<DatePickerContentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DatePickerContentProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/date-picker/DatePickerControl.js

@@ -0,0 +1,47 @@
+import { computed, createBlock, createPropsRestProxy, defineComponent, mergeProps, openBlock, renderSlot, unref, withCtx } from "vue";
+import { DatePicker } from "@ark-ui/vue";
+import { useForwardProps } from "@ark-ui/vue/utils";
+import { clsx } from "@raxium/themes/utils";
+import { useTheme } from "../../composables/useTheme.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+    __name: "DatePickerControl",
+    props: {
+        class: {
+            type: [
+                Boolean,
+                null,
+                String,
+                Object,
+                Array
+            ]
+        },
+        asChild: {
+            type: Boolean
+        },
+        theme: {}
+    },
+    setup (__props) {
+        const props = createPropsRestProxy(__props, [
+            "class",
+            "theme"
+        ]);
+        const forwarded = useForwardProps(props);
+        const theme = useTheme(()=>__props.theme);
+        const crafts = computed(()=>theme.value.crafts.tvDatePicker());
+        return (_ctx, _cache)=>(openBlock(), createBlock(unref(DatePicker).Control, mergeProps(unref(forwarded), {
+                class: crafts.value.control({
+                    class: unref(clsx)(__props.class),
+                    ...unref(theme)
+                })
+            }), {
+                default: withCtx(()=>[
+                        renderSlot(_ctx.$slots, "default")
+                    ]),
+                _: 3
+            }, 16, [
+                "class"
+            ]));
+    }
+});
+const DatePickerControl = _sfc_main;
+export default DatePickerControl;

package/dist/components/date-picker/DatePickerControl.vue.d.ts

@@ -0,0 +1,14 @@
+import type { DatePickerControlProps } from '.';
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<DatePickerControlProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DatePickerControlProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/date-picker/DatePickerDayView.js

@@ -0,0 +1,178 @@
+import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, mergeProps, normalizeClass, openBlock, renderList, toDisplayString, unref, withCtx } from "vue";
+import { DatePicker, useDatePickerContext } from "@ark-ui/vue";
+import { clsx } from "@raxium/themes/utils";
+import { useTheme } from "../../composables/useTheme.js";
+import { flatten } from "es-toolkit";
+import { ChevronLeft, ChevronRight } from "lucide-vue-next";
+import { DATE_PICKER_CONTENT_PROVIDE_KEY } from "./index.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+    __name: "DatePickerDayView",
+    props: {
+        class: {
+            type: [
+                Boolean,
+                null,
+                String,
+                Object,
+                Array
+            ]
+        },
+        weekDayType: {
+            default: "short"
+        },
+        theme: {}
+    },
+    setup (__props) {
+        const { viewsState } = inject(DATE_PICKER_CONTENT_PROVIDE_KEY, {
+            viewsState: computed(()=>({
+                    count: 1,
+                    hasDayView: true,
+                    hasMonthView: false,
+                    hasYearView: false
+                }))
+        });
+        const context = useDatePickerContext();
+        const theme = useTheme(()=>Object.assign({}, __props.theme, {
+                view: "day",
+                weekDayType: __props.weekDayType
+            }));
+        const crafts = computed(()=>theme.value.crafts.tvDatePickerView());
+        return (_ctx, _cache)=>(openBlock(), createBlock(unref(DatePicker).View, {
+                view: "day",
+                class: normalizeClass(crafts.value.view({
+                    class: unref(clsx)(__props.class),
+                    ...unref(theme)
+                }))
+            }, {
+                default: withCtx(()=>[
+                        createVNode(unref(DatePicker).ViewControl, {
+                            class: normalizeClass(crafts.value.viewControl({
+                                ...unref(theme)
+                            }))
+                        }, {
+                            default: withCtx(()=>[
+                                    createVNode(unref(DatePicker).PrevTrigger, {
+                                        "as-child": "",
+                                        class: normalizeClass(crafts.value.viewControlTrigger({
+                                            ...unref(theme)
+                                        }))
+                                    }, {
+                                        default: withCtx(()=>[
+                                                createVNode(unref(ChevronLeft), {
+                                                    style: {
+                                                        width: "1lh",
+                                                        height: "1lh"
+                                                    }
+                                                })
+                                            ]),
+                                        _: 1
+                                    }, 8, [
+                                        "class"
+                                    ]),
+                                    unref(viewsState).count > 1 && unref(viewsState).hasMonthView ? (openBlock(), createBlock(unref(DatePicker).ViewTrigger, {
+                                        key: 0,
+                                        class: normalizeClass(crafts.value.viewTrigger({
+                                            ...unref(theme)
+                                        }))
+                                    }, {
+                                        default: withCtx(()=>[
+                                                createVNode(unref(DatePicker).RangeText)
+                                            ]),
+                                        _: 1
+                                    }, 8, [
+                                        "class"
+                                    ])) : (openBlock(), createBlock(unref(DatePicker).RangeText, {
+                                        key: 1
+                                    })),
+                                    createVNode(unref(DatePicker).NextTrigger, {
+                                        "as-child": "",
+                                        class: normalizeClass(crafts.value.viewControlTrigger({
+                                            ...unref(theme)
+                                        }))
+                                    }, {
+                                        default: withCtx(()=>[
+                                                createVNode(unref(ChevronRight), {
+                                                    style: {
+                                                        width: "1lh",
+                                                        height: "1lh"
+                                                    }
+                                                })
+                                            ]),
+                                        _: 1
+                                    }, 8, [
+                                        "class"
+                                    ])
+                                ]),
+                            _: 1
+                        }, 8, [
+                            "class"
+                        ]),
+                        createVNode(unref(DatePicker).Table, {
+                            class: normalizeClass(crafts.value.table({
+                                ...unref(theme)
+                            }))
+                        }, {
+                            default: withCtx(()=>[
+                                    createElementVNode("div", mergeProps(unref(context).getTableHeadProps(), {
+                                        class: crafts.value.tableHead({
+                                            ...unref(theme)
+                                        })
+                                    }), [
+                                        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(context).weekDays, (weekDay, id)=>(openBlock(), createElementBlock("div", mergeProps({
+                                                ref_for: true
+                                            }, unref(context).getTableHeaderProps(), {
+                                                key: id,
+                                                class: crafts.value.tableHeader({
+                                                    ...unref(theme)
+                                                })
+                                            }), toDisplayString(weekDay[__props.weekDayType]), 17))), 128))
+                                    ], 16),
+                                    createElementVNode("div", mergeProps(unref(context).getTableBodyProps(), {
+                                        class: crafts.value.tableBody({
+                                            ...unref(theme)
+                                        })
+                                    }), [
+                                        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(flatten)(unref(context).weeks), (day, did)=>(openBlock(), createBlock(unref(DatePicker).TableCell, {
+                                                key: did,
+                                                value: day,
+                                                class: normalizeClass(crafts.value.tableCell({
+                                                    ...unref(theme)
+                                                }))
+                                            }, {
+                                                default: withCtx(()=>[
+                                                        createVNode(unref(DatePicker).TableCellTrigger, {
+                                                            class: normalizeClass(crafts.value.tableCellTrigger({
+                                                                ...unref(context).getDayTableCellState({
+                                                                    value: day
+                                                                }),
+                                                                ...unref(theme)
+                                                            }))
+                                                        }, {
+                                                            default: withCtx(()=>[
+                                                                    createTextVNode(toDisplayString(day.day), 1)
+                                                                ]),
+                                                            _: 2
+                                                        }, 1032, [
+                                                            "class"
+                                                        ])
+                                                    ]),
+                                                _: 2
+                                            }, 1032, [
+                                                "value",
+                                                "class"
+                                            ]))), 128))
+                                    ], 16)
+                                ]),
+                            _: 1
+                        }, 8, [
+                            "class"
+                        ])
+                    ]),
+                _: 1
+            }, 8, [
+                "class"
+            ]));
+    }
+});
+const DatePickerDayView = _sfc_main;
+export default DatePickerDayView;

package/dist/components/date-picker/DatePickerDayView.vue.d.ts

@@ -0,0 +1,4 @@
+import type { DatePickerDayViewProps } from '.';
+declare const __VLS_export: import("vue").DefineComponent<DatePickerDayViewProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DatePickerDayViewProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/date-picker/DatePickerMonthView.js

@@ -0,0 +1,165 @@
+import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, mergeProps, normalizeClass, openBlock, renderList, toDisplayString, unref, withCtx } from "vue";
+import { DatePicker, useDatePickerContext } from "@ark-ui/vue";
+import { clsx } from "@raxium/themes/utils";
+import { useTheme } from "../../composables/useTheme.js";
+import { ChevronLeft, ChevronRight } from "lucide-vue-next";
+import { DATE_PICKER_CONTENT_PROVIDE_KEY } from "./index.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+    __name: "DatePickerMonthView",
+    props: {
+        class: {
+            type: [
+                Boolean,
+                null,
+                String,
+                Object,
+                Array
+            ]
+        },
+        monthType: {
+            default: "short"
+        },
+        theme: {}
+    },
+    setup (__props) {
+        const { viewsState } = inject(DATE_PICKER_CONTENT_PROVIDE_KEY, {
+            viewsState: computed(()=>({
+                    count: 1,
+                    hasDayView: false,
+                    hasMonthView: true,
+                    hasYearView: false
+                }))
+        });
+        const context = useDatePickerContext();
+        const theme = useTheme(()=>Object.assign({}, __props.theme, {
+                view: "month",
+                monthType: __props.monthType
+            }));
+        const crafts = computed(()=>theme.value.crafts.tvDatePickerView());
+        return (_ctx, _cache)=>(openBlock(), createBlock(unref(DatePicker).View, {
+                view: "month",
+                class: normalizeClass(crafts.value.view({
+                    class: unref(clsx)(__props.class),
+                    ...unref(theme)
+                }))
+            }, {
+                default: withCtx(()=>[
+                        createVNode(unref(DatePicker).ViewControl, {
+                            class: normalizeClass(crafts.value.viewControl({
+                                ...unref(theme)
+                            }))
+                        }, {
+                            default: withCtx(()=>[
+                                    createVNode(unref(DatePicker).PrevTrigger, {
+                                        "as-child": "",
+                                        class: normalizeClass(crafts.value.viewControlTrigger({
+                                            ...unref(theme)
+                                        }))
+                                    }, {
+                                        default: withCtx(()=>[
+                                                createVNode(unref(ChevronLeft), {
+                                                    style: {
+                                                        width: "1lh",
+                                                        height: "1lh"
+                                                    }
+                                                })
+                                            ]),
+                                        _: 1
+                                    }, 8, [
+                                        "class"
+                                    ]),
+                                    unref(viewsState).count > 1 && unref(viewsState).hasYearView ? (openBlock(), createBlock(unref(DatePicker).ViewTrigger, {
+                                        key: 0,
+                                        class: normalizeClass(crafts.value.viewTrigger({
+                                            ...unref(theme)
+                                        }))
+                                    }, {
+                                        default: withCtx(()=>[
+                                                createVNode(unref(DatePicker).RangeText)
+                                            ]),
+                                        _: 1
+                                    }, 8, [
+                                        "class"
+                                    ])) : (openBlock(), createBlock(unref(DatePicker).RangeText, {
+                                        key: 1
+                                    })),
+                                    createVNode(unref(DatePicker).NextTrigger, {
+                                        "as-child": "",
+                                        class: normalizeClass(crafts.value.viewControlTrigger({
+                                            ...unref(theme)
+                                        }))
+                                    }, {
+                                        default: withCtx(()=>[
+                                                createVNode(unref(ChevronRight), {
+                                                    style: {
+                                                        width: "1lh",
+                                                        height: "1lh"
+                                                    }
+                                                })
+                                            ]),
+                                        _: 1
+                                    }, 8, [
+                                        "class"
+                                    ])
+                                ]),
+                            _: 1
+                        }, 8, [
+                            "class"
+                        ]),
+                        createVNode(unref(DatePicker).Table, {
+                            class: normalizeClass(crafts.value.table({
+                                ...unref(theme)
+                            }))
+                        }, {
+                            default: withCtx(()=>[
+                                    createElementVNode("div", mergeProps(unref(context).getTableBodyProps(), {
+                                        class: crafts.value.tableBody({
+                                            ...unref(theme)
+                                        })
+                                    }), [
+                                        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(context).getMonths({
+                                            format: __props.monthType
+                                        }), (month, mid)=>(openBlock(), createBlock(unref(DatePicker).TableCell, {
+                                                key: mid,
+                                                value: month.value,
+                                                class: normalizeClass(crafts.value.tableCell({
+                                                    ...unref(theme)
+                                                }))
+                                            }, {
+                                                default: withCtx(()=>[
+                                                        createVNode(unref(DatePicker).TableCellTrigger, {
+                                                            class: normalizeClass(crafts.value.tableCellTrigger({
+                                                                ...unref(context).getMonthTableCellState({
+                                                                    value: month.value
+                                                                }),
+                                                                ...unref(theme)
+                                                            }))
+                                                        }, {
+                                                            default: withCtx(()=>[
+                                                                    createTextVNode(toDisplayString(month.label), 1)
+                                                                ]),
+                                                            _: 2
+                                                        }, 1032, [
+                                                            "class"
+                                                        ])
+                                                    ]),
+                                                _: 2
+                                            }, 1032, [
+                                                "value",
+                                                "class"
+                                            ]))), 128))
+                                    ], 16)
+                                ]),
+                            _: 1
+                        }, 8, [
+                            "class"
+                        ])
+                    ]),
+                _: 1
+            }, 8, [
+                "class"
+            ]));
+    }
+});
+const DatePickerMonthView = _sfc_main;
+export default DatePickerMonthView;

package/dist/components/date-picker/DatePickerMonthView.vue.d.ts

@@ -0,0 +1,4 @@
+import type { DatePickerMonthViewProps } from '.';
+declare const __VLS_export: import("vue").DefineComponent<DatePickerMonthViewProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DatePickerMonthViewProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;