cosey 0.7.16 → 0.8.0

package/components/week-range-picker/index.js

@@ -0,0 +1,7 @@
+import { withInstall } from '../utils.js';
+import stdin_default$1 from './week-range-picker.js';
+
+const _WeekRangePicker = withInstall(stdin_default$1);
+var stdin_default = _WeekRangePicker;
+
+export { _WeekRangePicker as WeekRangePicker, stdin_default as default };

package/components/week-range-picker/panel-week-range.api.d.ts

@@ -0,0 +1,32 @@
+import type { ExtractPropTypes, PropType, SlotsType } from 'vue';
+import { type Dayjs } from 'dayjs';
+export declare const panelWeekRangeProps: {
+    visible: {
+        type: BooleanConstructor;
+    };
+    parsedValue: {
+        type: PropType<Date[]>;
+    };
+};
+export type WeekRangePickerProps = ExtractPropTypes<typeof panelWeekRangeProps>;
+export interface WeekRangePickerSlots {
+    'range-separator': {};
+    default: {};
+}
+export declare const panelWeekRangeSlots: SlotsType<WeekRangePickerSlots>;
+export declare const panelWeekRangeEmits: {
+    pick: (value: Dayjs[] | null) => value is Dayjs[];
+    'set-picker-option': (value: any[]) => boolean;
+};
+export type WeekRangePickerEmits = typeof panelWeekRangeEmits;
+export interface WeekRangePickerExpose {
+}
+export interface WeekInfo {
+    id: number;
+    week: number;
+    weekStr: string;
+    startDate: Dayjs;
+    endDate: Dayjs;
+    startStr: string;
+    endStr: string;
+}

package/components/week-range-picker/panel-week-range.api.js

@@ -0,0 +1,15 @@
+const panelWeekRangeProps = {
+  visible: {
+    type: Boolean
+  },
+  parsedValue: {
+    type: Array
+  }
+};
+const panelWeekRangeSlots = {};
+const panelWeekRangeEmits = {
+  pick: (value) => Array.isArray(value),
+  "set-picker-option": (value) => Array.isArray(value)
+};
+
+export { panelWeekRangeEmits, panelWeekRangeProps, panelWeekRangeSlots };

package/components/week-range-picker/panel-week-range.d.ts

@@ -0,0 +1,25 @@
+import dayjs, { Dayjs } from 'dayjs';
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+    };
+    parsedValue: {
+        type: import("vue").PropType<Date[]>;
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    pick: (value: Dayjs[] | null) => value is dayjs.Dayjs[];
+    'set-picker-option': (value: any[]) => boolean;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    visible: {
+        type: BooleanConstructor;
+    };
+    parsedValue: {
+        type: import("vue").PropType<Date[]>;
+    };
+}>> & Readonly<{
+    onPick?: ((value: dayjs.Dayjs[] | null) => any) | undefined;
+    "onSet-picker-option"?: ((value: any[]) => any) | undefined;
+}>, {
+    visible: boolean;
+}, import("vue").SlotsType<import("./panel-week-range.api").WeekRangePickerSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/components/week-range-picker/panel-week-range.js

@@ -0,0 +1,207 @@
+import { defineComponent, shallowRef, computed, ref, watch, createVNode } from 'vue';
+import stdin_default$1 from './panel-week-range.style.js';
+import { ElIcon } from 'element-plus';
+import { DArrowLeft, DArrowRight } from '@element-plus/icons-vue';
+import dayjs from 'dayjs';
+import weekYear from 'dayjs/plugin/weekYear.js';
+import weekOfYear from 'dayjs/plugin/weekOfYear.js';
+import isoWeeksInYear from 'dayjs/plugin/isoWeeksInYear.js';
+import isLeapYear from 'dayjs/plugin/isLeapYear.js';
+import { panelWeekRangeEmits, panelWeekRangeSlots, panelWeekRangeProps } from './panel-week-range.api.js';
+import { isValidRange } from 'element-plus/es/components/date-picker-panel/src/utils.mjs';
+import { useLocale } from '../../hooks/useLocale.js';
+import { useComponentConfig } from '../config-provider/config-provider.api.js';
+
+dayjs.extend(weekYear);
+dayjs.extend(weekOfYear);
+dayjs.extend(isoWeeksInYear);
+dayjs.extend(isLeapYear);
+function parseDates(dates) {
+  if (!dates || dates.length < 2) return [];
+  const d = dates.map(dayjs).sort((a, b) => a.isBefore(b) ? -1 : 1);
+  return [d[0].startOf("date"), d[1].endOf("week")];
+}
+function isSame(d1, d2) {
+  return d1.every((d, i) => d.isSame(d2[i]));
+}
+var stdin_default = defineComponent({
+  name: "CoPanelWeekRange",
+  props: panelWeekRangeProps,
+  slots: panelWeekRangeSlots,
+  emits: panelWeekRangeEmits,
+  setup(props, {
+    emit
+  }) {
+    const {
+      t
+    } = useLocale();
+    const {
+      prefixCls
+    } = useComponentConfig("panel-week-range", props);
+    const {
+      hashId
+    } = stdin_default$1(prefixCls);
+    const currentYearDate = shallowRef(dayjs());
+    const yearLabel = computed(() => currentYearDate.value.year());
+    const weeks = computed(() => {
+      const currentD = currentYearDate.value;
+      const weeks2 = currentD.isoWeeksInYear();
+      const result = [];
+      for (let i = 0; i < weeks2; i++) {
+        const rowIndex = Math.floor(i / 8);
+        const row = result[rowIndex] ??= [];
+        const week = i + 1;
+        const d = currentD.week(week);
+        const startDate = d.startOf("date");
+        const endDate = d.endOf("week");
+        const startStr = startDate.format("MM-DD");
+        const endStr = endDate.format("MM-DD");
+        const weekStr = t("co.form.week", {
+          w: week
+        });
+        row.push({
+          id: currentD.year() * 100 + week,
+          week,
+          weekStr,
+          startDate,
+          endDate,
+          startStr,
+          endStr
+        });
+      }
+      return result;
+    });
+    const pickedDates = ref([]);
+    const innerValue = ref(parseDates(props.parsedValue));
+    watch(() => props.parsedValue, () => {
+      const dates = parseDates(props.parsedValue);
+      if (dates.length !== innerValue.value.length || dates.length > 0 && !isSame(dates, innerValue.value)) {
+        innerValue.value = dates;
+        selectedDates.value = innerValue.value.map(item => item.year() * 100 + item.week()).sort();
+      }
+    }, {
+      immediate: true
+    });
+    const isSelecting = computed(() => pickedDates.value.length === 1);
+    const selectedDates = ref([]);
+    const onPrevYear = () => {
+      currentYearDate.value = dayjs(currentYearDate.value).subtract(1, "year");
+    };
+    const onNextYear = () => {
+      currentYearDate.value = dayjs(currentYearDate.value).add(1, "year");
+    };
+    const getWeekInfo = event => {
+      const target = event.target.closest("td");
+      if (!target) return;
+      const rowIndex = target.parentNode.rowIndex;
+      const cellIndex = target.cellIndex;
+      const weekInfo = weeks.value[rowIndex][cellIndex];
+      return weekInfo;
+    };
+    const onPickWeek = event => {
+      const weekInfo = getWeekInfo(event);
+      if (!weekInfo) return;
+      if (pickedDates.value.length === 2) {
+        pickedDates.value = [];
+      }
+      pickedDates.value.push(weekInfo);
+      selectedDates.value = pickedDates.value.map(item => item.id).sort();
+      if (selectedDates.value.length === 1) {
+        const d = selectedDates.value[0];
+        selectedDates.value = [d, d];
+      }
+      if (pickedDates.value.length === 2) {
+        const [start, end] = pickedDates.value;
+        emit("pick", [start.startDate, end.endDate]);
+      }
+    };
+    const onMouseMove = event => {
+      if (!isSelecting.value) return;
+      const weekInfo = getWeekInfo(event);
+      if (!weekInfo) return;
+      selectedDates.value = [pickedDates.value[0].id, weekInfo.id].sort();
+    };
+    const onMouseDown = () => {};
+    const onMouseUp = () => {};
+    const resetCurrentYear = year => {
+      const currentYear = currentYearDate.value.year();
+      if (year !== currentYear) {
+        currentYearDate.value = dayjs(innerValue.value[0]);
+      }
+    };
+    watch(() => props.visible, () => {
+      if (props.visible) {
+        if (isSelecting.value) {
+          selectedDates.value = innerValue.value.length ? innerValue.value.map(item => item.year() * 100 + item.week()).sort() : [];
+          pickedDates.value = [];
+        }
+        resetCurrentYear(innerValue.value.length ? innerValue.value[0].year() : dayjs().year());
+      }
+    });
+    const isValidValue = date => {
+      return isValidRange(date);
+    };
+    const formatToString = value => {
+      return Array.isArray(value) ? value.map(d => d.format("gggg[w]ww")) : value.format("gggg[w]ww");
+    };
+    const handleClear = () => {
+      innerValue.value = [];
+      selectedDates.value = [];
+      emit("pick", null);
+    };
+    emit("set-picker-option", ["isValidValue", isValidValue]);
+    emit("set-picker-option", ["formatToString", formatToString]);
+    emit("set-picker-option", ["handleClear", handleClear]);
+    return () => {
+      return createVNode("div", {
+        "class": [hashId.value, prefixCls.value]
+      }, [createVNode("div", {
+        "class": `${prefixCls.value}-header`
+      }, [createVNode("div", {
+        "class": `${prefixCls.value}-prev-btn`
+      }, [createVNode("button", {
+        "class": `${prefixCls.value}-icon-btn`,
+        "onClick": onPrevYear
+      }, [createVNode(ElIcon, null, {
+        default: () => [createVNode(DArrowLeft, null, null)]
+      })])]), createVNode("span", {
+        "role": "button",
+        "class": `${prefixCls.value}-header-label`
+      }, [yearLabel.value]), createVNode("div", {
+        "class": `${prefixCls.value}-next-btn`
+      }, [createVNode("button", {
+        "class": `${prefixCls.value}-icon-btn`,
+        "onClick": onNextYear
+      }, [createVNode(ElIcon, null, {
+        default: () => [createVNode(DArrowRight, null, null)]
+      })])])]), createVNode("div", {
+        "class": `${prefixCls.value}-content`
+      }, [createVNode("table", {
+        "onClick": onPickWeek,
+        "onMousemove": onMouseMove,
+        "onMousedown": onMouseDown,
+        "onMouseup": onMouseUp
+      }, [createVNode("tbody", null, [weeks.value.map((row, i) => {
+        return createVNode("tr", {
+          "key": i
+        }, [row.map((weekInfo, j) => {
+          const [start, end] = selectedDates.value;
+          return createVNode("td", {
+            "key": j,
+            "class": {
+              "is-start": start === weekInfo.id,
+              "is-end": end === weekInfo.id,
+              "in-range": start <= weekInfo.id && weekInfo.id <= end
+            }
+          }, [createVNode("div", {
+            "class": `${prefixCls.value}-cell`
+          }, [createVNode("div", {
+            "class": `${prefixCls.value}-cell-text`
+          }, [createVNode("div", null, [weekInfo.weekStr]), createVNode("div", null, [`${weekInfo.startStr}~${weekInfo.endStr}`])])])]);
+        })]);
+      })])])])]);
+    };
+  }
+});
+
+export { stdin_default as default };

package/components/week-range-picker/panel-week-range.style.d.ts

@@ -0,0 +1,4 @@
+declare const _default: (_prefixCls?: import("vue").ComputedRef<string> | string, themeManager?: import("../theme/theme-context").ThemeManager) => {
+    hashId: import("vue").Ref<string, string>;
+};
+export default _default;

package/components/week-range-picker/panel-week-range.style.js

@@ -0,0 +1,94 @@
+import { getSimpleStyleHook } from '../theme/getSimpleStyleHook.js';
+
+var stdin_default = getSimpleStyleHook("CoPanelWeekRange", (token) => {
+  const { componentCls } = token;
+  return {
+    [`${componentCls}`]: {
+      width: 860,
+      [`${componentCls}-header`]: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "space-between",
+        padding: 12,
+        borderBottom: `1px solid ${token.colorBorderSecondary}`
+      },
+      [`${componentCls}-header-label`]: {
+        fontSize: token.fontSizeLG,
+        fontWeight: 500,
+        paddingInline: 5,
+        color: token.colorText
+      },
+      [`${componentCls}-icon-btn`]: {
+        paddingBlock: 1,
+        paddingInline: 6,
+        border: 0,
+        fontSize: token.fontSizeSM,
+        lineHeight: 1,
+        color: token.colorText,
+        background: "transparent",
+        cursor: "pointer",
+        outline: "none",
+        "&:hover": {
+          color: token.colorPrimary
+        }
+      },
+      [`${componentCls}-content`]: {
+        marginInline: 15,
+        marginBlockEnd: 15
+      },
+      table: {
+        tableLayout: "fixed",
+        width: "100%",
+        fontSize: token.fontSizeSM,
+        borderCollapse: "collapse"
+      },
+      td: {
+        paddingBlock: 3,
+        textAlign: "center",
+        cursor: "pointer",
+        "&.is-start": {
+          [`${componentCls}-cell`]: {
+            borderStartStartRadius: 9999,
+            borderEndStartRadius: 9999
+          }
+        },
+        "&.is-end": {
+          [`${componentCls}-cell`]: {
+            borderStartEndRadius: 9999,
+            borderEndEndRadius: 9999
+          }
+        },
+        "&.is-start, &.is-end": {
+          [`${componentCls}-cell-text`]: {
+            color: token.colorWhite,
+            background: token.colorPrimary
+          }
+        },
+        "&.in-range": {
+          [`${componentCls}-cell`]: {
+            background: token.colorBorderSecondary
+          }
+        }
+      },
+      [`${componentCls}-cell`]: {
+        paddingBlock: 6
+      },
+      [`${componentCls}-cell-text`]: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        height: 36,
+        marginInline: 6,
+        borderRadius: 9999,
+        lineHeight: 1.15,
+        color: token.colorText,
+        "&:hover": {
+          color: token.colorPrimary
+        }
+      }
+    }
+  };
+});
+
+export { stdin_default as default };

package/components/week-range-picker/week-range-picker.api.d.ts

@@ -0,0 +1,269 @@
+import type { ExtractPropTypes, PropType, SlotsType } from 'vue';
+export declare const weekRangePickerProps: {
+    modelValue: {
+        type: PropType<Date[]>;
+    };
+    showNow: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: true;
+    };
+    showConfirm: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: true;
+    };
+    showFooter: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: true;
+    };
+    showWeekNumber: BooleanConstructor;
+    ariaLabel: StringConstructor;
+    emptyValues: ArrayConstructor;
+    valueOnClear: {
+        readonly type: PropType<string | number | boolean | Function | null>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: undefined;
+    };
+    disabledDate: {
+        readonly type: PropType<Function>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    cellClassName: {
+        readonly type: PropType<Function>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    shortcuts: {
+        readonly type: PropType<unknown[]>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: () => never[];
+    };
+    arrowControl: BooleanConstructor;
+    tabindex: {
+        readonly type: PropType<string | number>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: 0;
+    };
+    validateEvent: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: true;
+    };
+    unlinkPanels: BooleanConstructor;
+    placement: {
+        readonly type: PropType<any>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: "bottom";
+    };
+    fallbackPlacements: {
+        readonly type: PropType<Placement[]>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: readonly ["bottom", "top", "right", "left"];
+    };
+    disabledHours: {
+        readonly type: PropType<import("element-plus").GetDisabledHours>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    disabledMinutes: {
+        readonly type: PropType<import("element-plus").GetDisabledMinutes>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    disabledSeconds: {
+        readonly type: PropType<import("element-plus").GetDisabledSeconds>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    automaticDropdown: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: true;
+    };
+    id: {
+        readonly type: PropType<import("element-plus").SingleOrRange<string>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    name: {
+        readonly type: PropType<import("element-plus").SingleOrRange<string>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    popperClass: {
+        readonly type: PropType<string | {
+            [x: string]: boolean;
+        } | (string | {
+            [x: string]: boolean;
+        } | (string | {
+            [x: string]: boolean;
+        } | (string | {
+            [x: string]: boolean;
+        } | (string | {
+            [x: string]: boolean;
+        } | (string | {
+            [x: string]: boolean;
+        } | (string | {
+            [x: string]: boolean;
+        } | (string | {
+            [x: string]: boolean;
+        } | (string | {
+            [x: string]: boolean;
+        } | (string | {
+            [x: string]: boolean;
+        } | (string | any[] | {
+            [x: string]: boolean;
+        })[])[])[])[])[])[])[])[])[])[]>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    popperStyle: {
+        readonly type: PropType<import("vue").StyleValue>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    format: StringConstructor;
+    valueFormat: StringConstructor;
+    dateFormat: StringConstructor;
+    timeFormat: StringConstructor;
+    type: {
+        readonly type: PropType<string>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: "";
+    };
+    clearable: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: true;
+    };
+    clearIcon: {
+        readonly type: PropType<string | import("vue").Component>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    editable: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: true;
+    };
+    prefixIcon: {
+        readonly type: PropType<string | import("vue").Component>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: "";
+    };
+    size: {
+        readonly type: PropType<"" | "default" | "large" | "small">;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly: BooleanConstructor;
+    disabled: BooleanConstructor;
+    placeholder: {
+        readonly type: PropType<string>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: "";
+    };
+    popperOptions: {
+        readonly type: PropType<any>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: () => {};
+    };
+    rangeSeparator: {
+        readonly type: PropType<string>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: "-";
+    };
+    startPlaceholder: StringConstructor;
+    endPlaceholder: StringConstructor;
+    defaultValue: {
+        readonly type: PropType<import("element-plus").SingleOrRange<Date>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    defaultTime: {
+        readonly type: PropType<import("element-plus").SingleOrRange<Date>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    isRange: BooleanConstructor;
+};
+export type WeekRangePickerProps = ExtractPropTypes<typeof weekRangePickerProps>;
+export interface WeekRangePickerSlots {
+    'range-separator': {};
+    default: {};
+}
+export declare const weekRangePickerSlots: SlotsType<WeekRangePickerSlots>;
+export declare const weekRangePickerEmits: {
+    'update:modelValue': (value: Date[] | undefined | null) => boolean;
+    change: (value: Date[] | undefined | null) => boolean;
+};
+export type WeekRangePickerEmits = typeof weekRangePickerEmits;
+export interface WeekRangePickerExpose {
+}

package/components/week-range-picker/week-range-picker.api.js

@@ -0,0 +1,16 @@
+import { timePickerDefaultProps } from 'element-plus';
+import { isNullish } from '../../utils/is.js';
+
+const weekRangePickerProps = {
+  ...timePickerDefaultProps,
+  modelValue: {
+    type: Array
+  }
+};
+const weekRangePickerSlots = {};
+const weekRangePickerEmits = {
+  "update:modelValue": (value) => Array.isArray(value) || isNullish(value),
+  change: (value) => Array.isArray(value) || isNullish(value)
+};
+
+export { weekRangePickerEmits, weekRangePickerProps, weekRangePickerSlots };