@keyblade/pro-components 1.13.8-alpha.2 → 1.13.8-alpha.20

package/es/components.d.ts

@@ -8,6 +8,11 @@ declare module 'vue' {
         KbProMenu: typeof import('./index')['ProMenu'];
         KbProPageContainer: typeof import('./index')['ProPageContainer'];
         KbProReuseTabs: typeof import('./index')['ProReuseTabs'];
+        KbProFooterBar: typeof import('./index')['ProFooterBar'];
+        KbProTextarea: typeof import('./index')['ProTextarea'];
+        KbProTable: typeof import('./index')['ProTable'];
+        KbProFormGroup: typeof import('./index')['ProFormGroup'];
+        KbProCalendar: typeof import('./index')['ProCalendar'];
     }
 }
 export {};

package/es/global-props.d.ts

@@ -0,0 +1,13 @@
+import { ProFooterBarProps } from './pro-footer-bar/inerface';
+import { ProTableProps } from './pro-table/interface';
+import { ProTextareaProps } from './pro-textarea';
+import { ProDateRangePickerProps } from './pro-date-range-picker/inerface';
+import { ProCalendarProps } from './pro-calendar';
+export interface GlobalProps {
+    footerBar?: ProFooterBarProps;
+    dateRangePicker?: ProDateRangePickerProps;
+    textarea?: ProTextareaProps;
+    table?: ProTableProps;
+    calendar?: ProCalendarProps;
+}
+export declare const globalProps: GlobalProps;

package/es/global-props.js

@@ -0,0 +1,4 @@
+const o = {};
+export {
+  o as globalProps
+};

package/es/index.d.ts

@@ -1,11 +1,13 @@
 import { App } from 'vue';
+import { GlobalProps } from './global-props';
 declare const _default: {
-    install(app: App): void;
+    install(app: App, options?: GlobalProps): void;
 };
 export default _default;
 export { default as ProPageHeader } from './pro-page-header';
 export { default as ProKeepAliveRouterView } from './pro-keep-alive-router-view';
 export { default as ProLayout } from './pro-layout';
+export { default as ProFooterBar } from './pro-footer-bar';
 export { default as ProMenu } from './pro-menu';
 export type { IProMenuItem } from './pro-menu';
 export { default as ProPageContainer } from './pro-page-container';
@@ -14,5 +16,9 @@ export type { IProTab } from './pro-reuse-tabs';
 export { default as ProImageUpload } from './pro-image-upload';
 export * from './pro-image-upload';
 export { default as ProDateRangePicker } from './pro-date-range-picker';
+export { default as ProTextarea } from './pro-textarea';
 export { default as ProTable } from './pro-table';
+export { default as ProFormGroup } from './pro-form-group';
+export { default as ProCalendar } from './pro-calendar';
 export type {} from './components';
+export * from './inerface';

package/es/index.js

@@ -1,30 +1,39 @@
 import { ProPageHeader as e } from "./pro-page-header/index.js";
-import { ProKeepAliveRouterView as r } from "./pro-keep-alive-router-view/index.js";
-import { ProLayout as m } from "./pro-layout/index.js";
-import { ProMenu as t } from "./pro-menu/index.js";
-import { ProPageContainer as i } from "./pro-page-container/index.js";
-import { ProReuseTabs as s } from "./pro-reuse-tabs/index.js";
-import { ProImageUpload as u } from "./pro-image-upload/index.js";
-import { ProDateRangePicker as f } from "./pro-date-range-picker/index.js";
+import { ProKeepAliveRouterView as m } from "./pro-keep-alive-router-view/index.js";
+import { ProLayout as t } from "./pro-layout/index.js";
+import { ProMenu as i } from "./pro-menu/index.js";
+import { ProPageContainer as s } from "./pro-page-container/index.js";
+import { ProReuseTabs as u } from "./pro-reuse-tabs/index.js";
+import { ProImageUpload as f } from "./pro-image-upload/index.js";
+import { ProDateRangePicker as P } from "./pro-date-range-picker/index.js";
 import { ProTable as a } from "./pro-table/index.js";
-import { EImageUploadInnerBeforeUploadStep as T } from "./pro-image-upload/types.js";
-import { defaultImageUploadOptions as v } from "./pro-image-upload/constant.js";
-const R = {
-  install(o) {
-    o.use(e), o.use(r), o.use(m), o.use(t), o.use(i), o.use(s), o.use(u), o.use(f), o.use(a);
+import { ProTextarea as l } from "./pro-textarea/index.js";
+import { ProFooterBar as n } from "./pro-footer-bar/index.js";
+import { ProFormGroup as d } from "./pro-form-group/index.js";
+import g from "./pro-calendar/index.js";
+import { globalProps as x } from "./global-props.js";
+import { EImageUploadInnerBeforeUploadStep as D } from "./pro-image-upload/types.js";
+import { defaultImageUploadOptions as G } from "./pro-image-upload/constant.js";
+const w = {
+  install(o, r) {
+    Object.assign(x, r || {}), o.use(e), o.use(m), o.use(t), o.use(n), o.use(i), o.use(s), o.use(u), o.use(f), o.use(P), o.use(l), o.use(a), o.use(d), o.use(g);
   }
 };
 export {
-  T as EImageUploadInnerBeforeUploadStep,
-  f as ProDateRangePicker,
-  u as ProImageUpload,
-  r as ProKeepAliveRouterView,
-  m as ProLayout,
-  t as ProMenu,
-  i as ProPageContainer,
+  D as EImageUploadInnerBeforeUploadStep,
+  g as ProCalendar,
+  P as ProDateRangePicker,
+  n as ProFooterBar,
+  d as ProFormGroup,
+  f as ProImageUpload,
+  m as ProKeepAliveRouterView,
+  t as ProLayout,
+  i as ProMenu,
+  s as ProPageContainer,
   e as ProPageHeader,
-  s as ProReuseTabs,
+  u as ProReuseTabs,
   a as ProTable,
-  R as default,
-  v as defaultImageUploadOptions
+  l as ProTextarea,
+  w as default,
+  G as defaultImageUploadOptions
 };

package/es/inerface.d.ts

@@ -0,0 +1,2 @@
+export * from './pro-footer-bar/inerface';
+export * from './pro-date-range-picker/inerface';

package/es/pro-calendar/calendar.vue.d.ts

@@ -0,0 +1,75 @@
+import { IProCalendarProps } from './inerface';
+import { EMode } from './enum';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        default?: (props: {
+            year: string;
+            month: string;
+            date?: string;
+            value: {
+                year: number;
+                month: number;
+                date?: number;
+            };
+        }) => any;
+        header?: (props: {
+            year: string;
+            month: string;
+            value: {
+                year: number;
+                month: number;
+            };
+        }) => any;
+    }> & {
+        default?: (props: {
+            year: string;
+            month: string;
+            date?: string;
+            value: {
+                year: number;
+                month: number;
+                date?: number;
+            };
+        }) => any;
+        header?: (props: {
+            year: string;
+            month: string;
+            value: {
+                year: number;
+                month: number;
+            };
+        }) => any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<IProCalendarProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    change: (date: Date) => any;
+    "update:modelValue": (date: Date) => any;
+    panelChange: (date: Date) => any;
+}, string, import('vue').PublicProps, Readonly<IProCalendarProps> & Readonly<{
+    onChange?: ((date: Date) => any) | undefined;
+    "onUpdate:modelValue"?: ((date: Date) => any) | undefined;
+    onPanelChange?: ((date: Date) => any) | undefined;
+}>, {
+    header: boolean | {
+        hideLeft?: boolean;
+        hideRight?: boolean;
+    };
+    dayStartOfWeek: 0 | 1;
+    modes: (EMode.month | EMode.year)[];
+    defaultMode: EMode.month | EMode.year;
+    allowSelect: boolean;
+    panelTodayBtn: boolean;
+    isWeek: boolean;
+    panel: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/es/pro-calendar/calendar.vue.js

@@ -0,0 +1,158 @@
+import { defineComponent as Q, useSlots as R, ref as k, computed as r, watch as U, createElementBlock as i, openBlock as m, mergeProps as v, createVNode as X, createCommentVNode as S, createSlots as b, withCtx as O, unref as u, renderSlot as P, normalizeClass as w, createBlock as x, toDisplayString as Z } from "vue";
+import "dayjs";
+import ee from "./month.vue.js";
+import ae from "./year.vue.js";
+import te from "./header.vue.js";
+import { getDayjsValue as A, getNow as oe, pickDataAttributes as le, methods as h } from "@arco-design/web-vue/es/_utils/date";
+import { getPrefixCls as ne } from "@arco-design/web-vue/es/_utils/global-config";
+import { useI18n as re } from "@arco-design/web-vue/es/locale";
+import { getAllDaysByTime as ue } from "./month.js";
+import { EMode as l } from "./enum.js";
+import { conclude as de } from "vue-global-config";
+import { globalProps as C } from "../global-props.js";
+const we = /* @__PURE__ */ Q({
+  __name: "calendar",
+  props: {
+    modelValue: {},
+    defaultValue: {},
+    mode: {},
+    defaultMode: { default: l.month },
+    modes: { default: () => [l.month, l.year] },
+    header: { type: [Boolean, Object], default: !0 },
+    allowSelect: { type: Boolean, default: !0 },
+    panelWidth: {},
+    panelTodayBtn: { type: Boolean, default: !1 },
+    dayStartOfWeek: { default: 0 },
+    isWeek: { type: Boolean, default: !1 },
+    panel: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "change", "panelChange"],
+  setup(N, { emit: T }) {
+    function j(e, o) {
+      return e === l.month || e === l.year && !o ? "YYYY-MM-DD" : "YYYY-MM";
+    }
+    const t = N, s = T, D = R(), d = ne("calendar"), { t: g } = re(), V = k(t.defaultMode), n = r(() => t.mode ? t.mode : V.value), W = r(() => j(n.value, t.panel)), M = k(A(t.defaultValue || Date.now(), W.value)), p = r(() => t.modelValue ? A(t.modelValue, W.value) : M.value), a = k(p.value || oe());
+    U(p, (e) => {
+      a.value = e;
+    });
+    const B = r(() => ue(a.value, {
+      dayStartOfWeek: t.dayStartOfWeek,
+      isWeek: t.isWeek
+    }));
+    function E(e) {
+      a.value = e, s("panelChange", e.toDate());
+    }
+    function Y(e) {
+      M.value = e, s("change", e.toDate()), s("update:modelValue", e.toDate()), E(e);
+    }
+    function _(e, o = !1) {
+      o || Y(e);
+    }
+    const F = r(() => n.value === l.month ? g("calendar.formatMonth") : n.value === l.year ? g("calendar.formatYear") : "");
+    function z(e, o) {
+      e.includes("prev") && (a.value = h.subtract(a.value, 1, o)), e.includes("next") && (a.value = h.add(a.value, 1, o)), s("panelChange", a.value.toDate());
+    }
+    function H(e) {
+      const o = h.set(a.value, l.year, e);
+      a.value = o, s("panelChange", o.toDate());
+    }
+    function I(e) {
+      const o = h.set(a.value, l.month, e - 1);
+      a.value = o, s("panelChange", o.toDate());
+    }
+    function q(e) {
+      V.value = e;
+    }
+    const G = r(() => [
+      d,
+      n.value === l.month ? `${d}-mode-month` : `${d}-mode-year`,
+      {
+        [`${d}-panel`]: t.panel && (n.value === l.month || n.value === l.year)
+      }
+    ]), J = r(() => t.panel ? { width: t.panelWidth } : {}), K = r(() => le(t)), L = r(() => {
+      var e;
+      return de([t.header, ((e = C.calendar) == null ? void 0 : e.header) || {}]);
+    }), y = r(() => {
+      var e, o;
+      return {
+        dayStartOfWeek: ((e = C.calendar) == null ? void 0 : e.dayStartOfWeek) || t.dayStartOfWeek,
+        isWeek: ((o = C.calendar) == null ? void 0 : o.isWeek) || t.isWeek
+      };
+    });
+    return (e, o) => (m(), i("div", v({
+      class: G.value,
+      style: J.value
+    }, K.value), [
+      X(te, v(y.value, {
+        header: L.value,
+        move: Y,
+        "header-value-format": F.value,
+        modes: e.modes,
+        mode: n.value,
+        "page-show-date": a.value,
+        onModeChange: q,
+        onYearChange: H,
+        onMonthChange: I,
+        onChangePageShowDate: z
+      }), b({ _: 2 }, [
+        u(D).header ? {
+          name: "default",
+          fn: O(({ year: c, month: f }) => [
+            P(e.$slots, "header", {
+              value: { year: c, month: f },
+              year: c.toString(),
+              month: f.toString().padStart(2, "0")
+            })
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1040, ["header", "header-value-format", "modes", "mode", "page-show-date"]),
+      n.value === u(l).month ? (m(), i("div", {
+        key: 0,
+        class: w(`${u(d)}-body`)
+      }, [
+        (m(), x(ee, v(y.value, {
+          key: a.value.month(),
+          "page-data": B.value,
+          value: p.value,
+          mode: n.value,
+          "select-handler": _,
+          "page-show-date": a.value
+        }), b({ _: 2 }, [
+          u(D).default ? {
+            name: "default",
+            fn: O(({ year: c, month: f, date: $ }) => [
+              P(e.$slots, "default", {
+                year: c.toString(),
+                month: f.toString().padStart(2, "0"),
+                date: $.toString().padStart(2, "0"),
+                value: { year: c, month: f, date: $ }
+              })
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1040, ["page-data", "value", "mode", "page-show-date"]))
+      ], 2)) : S("", !0),
+      n.value === u(l).year ? (m(), i("div", {
+        key: 1,
+        class: w(`${u(d)}-body`)
+      }, [
+        (m(), x(ae, v(y.value, {
+          key: a.value.year(),
+          "page-data": B.value,
+          "page-show-date": a.value,
+          mode: n.value,
+          value: p.value,
+          "select-handler": _
+        }), null, 16, ["page-data", "page-show-date", "mode", "value"]))
+      ], 2)) : S("", !0),
+      e.panel && e.panelTodayBtn ? (m(), i("div", {
+        key: 2,
+        class: w(`${u(d)}-footer-btn-wrapper`)
+      }, Z(u(g)("today")), 3)) : S("", !0)
+    ], 16));
+  }
+});
+export {
+  we as default
+};

package/es/pro-calendar/calendar.vue3.js

@@ -0,0 +1,5 @@
+import o from "./calendar.vue.js";
+/* empty css              */
+export {
+  o as default
+};

package/es/pro-calendar/enum.d.ts

@@ -0,0 +1,6 @@
+export declare enum EMode {
+    day = "day",
+    week = "week",
+    month = "month",
+    year = "year"
+}

package/es/pro-calendar/enum.js

@@ -0,0 +1,4 @@
+var a = /* @__PURE__ */ ((r) => (r.day = "day", r.week = "week", r.month = "month", r.year = "year", r))(a || {});
+export {
+  a as EMode
+};

package/es/pro-calendar/header.vue.d.ts

@@ -0,0 +1,27 @@
+import { IProCalendarHeader } from './inerface';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {
+            year: number;
+            month: number;
+        }): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<IProCalendarHeader, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    yearChange: (year: number) => any;
+    monthChange: (month: number) => any;
+}, string, import('vue').PublicProps, Readonly<IProCalendarHeader> & Readonly<{
+    onYearChange?: ((year: number) => any) | undefined;
+    onMonthChange?: ((month: number) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/es/pro-calendar/header.vue.js

@@ -0,0 +1,135 @@
+import { defineComponent as P, useSlots as V, computed as s, withDirectives as h, createElementBlock as m, openBlock as i, normalizeClass as n, unref as o, createElementVNode as p, createVNode as d, Fragment as g, createBlock as z, createCommentVNode as T, renderSlot as Y, createTextVNode as k, toDisplayString as w, withCtx as E, vShow as f } from "vue";
+import $ from "@arco-design/web-vue/es/select";
+import I from "@arco-design/web-vue/es/button";
+import O from "@arco-design/web-vue/es/radio";
+import R from "@arco-design/web-vue/es/icon/icon-left";
+import L from "@arco-design/web-vue/es/icon/icon-right";
+import { getNow as W } from "@arco-design/web-vue/es/_utils/date";
+import { isArray as j } from "@arco-design/web-vue/es/_utils/is";
+import { getPrefixCls as A } from "@arco-design/web-vue/es/_utils/global-config";
+import { useI18n as G } from "@arco-design/web-vue/es/locale";
+import { EMode as v } from "./enum.js";
+const oe = /* @__PURE__ */ P({
+  __name: "header",
+  props: {
+    mode: {},
+    modes: {},
+    headerType: {},
+    pageShowDate: {},
+    move: { type: Function },
+    onYearChange: { type: Function },
+    onMonthChange: { type: Function },
+    onChangePageShowDate: { type: Function },
+    onModeChange: { type: Function },
+    headerValueFormat: {},
+    header: { type: [Boolean, Object] },
+    dayStartOfWeek: {},
+    isWeek: { type: Boolean },
+    panel: { type: Boolean }
+  },
+  emits: ["yearChange", "monthChange"],
+  setup(D) {
+    const r = D, b = V(), t = A("calendar"), { t: c } = G(), F = s(() => j(r.modes) ? r.modes.map((e) => ({
+      label: c(`datePicker.view.${e}`),
+      value: e
+    })) : []), B = s(() => r.headerType === "select"), l = s(() => r.pageShowDate.year()), y = s(() => r.pageShowDate.month() + 1), M = s(() => {
+      const e = [l.value];
+      for (let a = 1; a <= 10; a++)
+        e.unshift(l.value - a);
+      for (let a = 1; a < 10; a++)
+        e.push(l.value + a);
+      return e;
+    }), N = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
+    return (e, a) => {
+      var C, S;
+      return h((i(), m("div", {
+        class: n(`${o(t)}-header`)
+      }, [
+        h(p("div", {
+          class: n(`${o(t)}-header-left`)
+        }, [
+          B.value ? (i(), m(g, { key: 0 }, [
+            d(o($), {
+              size: "small",
+              class: n(`${o(t)}-header-value-year`),
+              "default-value": l.value,
+              options: M.value,
+              onChange: a[0] || (a[0] = (u) => {
+                console.log("change"), e.onYearChange(Number(u));
+              }),
+              "popup-container": `${o(t)}-header`
+            }, null, 8, ["class", "default-value", "options", "popup-container"]),
+            e.mode === o(v).month ? (i(), z(o($), {
+              key: 0,
+              size: "small",
+              class: n(`${o(t)}-header-value-month`),
+              "default-value": y.value,
+              options: N,
+              onChange: a[1] || (a[1] = (u) => {
+                console.log("change"), e.onMonthChange(Number(u));
+              }),
+              "popup-container": `${o(t)}-header`
+            }, null, 8, ["class", "default-value", "popup-container"])) : T("", !0)
+          ], 64)) : (i(), m(g, { key: 1 }, [
+            p("div", {
+              class: n(`${o(t)}-header-icon`),
+              role: "button",
+              tabindex: "0",
+              onClick: a[2] || (a[2] = () => e.onChangePageShowDate("prev", e.mode || o(v).month))
+            }, [
+              d(o(R))
+            ], 2),
+            p("div", {
+              class: n(`${o(t)}-header-value`)
+            }, [
+              o(b).default ? Y(e.$slots, "default", {
+                key: 0,
+                year: l.value,
+                month: y.value
+              }) : (i(), m(g, { key: 1 }, [
+                k(w(e.pageShowDate.format(e.headerValueFormat)), 1)
+              ], 64))
+            ], 2),
+            p("div", {
+              role: "button",
+              tabindex: "0",
+              class: n(`${o(t)}-header-icon`),
+              onClick: a[3] || (a[3] = () => e.onChangePageShowDate("next", e.mode || o(v).month))
+            }, [
+              d(o(L))
+            ], 2)
+          ], 64)),
+          d(o(I), {
+            size: "small",
+            onClick: a[4] || (a[4] = () => e.move(o(W)()))
+          }, {
+            default: E(() => [
+              k(w(o(c)("datePicker.today")), 1)
+            ]),
+            _: 1
+          })
+        ], 2), [
+          [f, !((C = e.header) != null && C.hideLeft)]
+        ]),
+        h(p("div", {
+          class: n(`${o(t)}-header-right`)
+        }, [
+          d(o(O).Group, {
+            size: "small",
+            type: "button",
+            options: F.value,
+            onChange: e.onModeChange,
+            "model-value": e.mode
+          }, null, 8, ["options", "onChange", "model-value"])
+        ], 2), [
+          [f, !((S = e.header) != null && S.hideRight)]
+        ])
+      ], 2)), [
+        [f, e.header]
+      ]);
+    };
+  }
+});
+export {
+  oe as default
+};

package/es/pro-calendar/header.vue2.js

@@ -0,0 +1,4 @@
+import f from "./header.vue.js";
+export {
+  f as default
+};

package/es/pro-calendar/hooks/useCellClassName.d.ts

@@ -0,0 +1,12 @@
+declare const useClassName: ({ prefixCls, mergedValue, rangeValues, hoverRangeValues, panel, isSameTime, innerMode, }: {
+    prefixCls: any;
+    mergedValue: any;
+    rangeValues: any;
+    hoverRangeValues: any;
+    panel: any;
+    isSameTime: any;
+    innerMode: any;
+}) => (cellDateObj: any, disabled: any) => (string | {
+    [x: string]: any;
+})[];
+export default useClassName;

package/es/pro-calendar/hooks/useCellClassName.js

@@ -0,0 +1,41 @@
+import "dayjs";
+import { isArray as w } from "@arco-design/web-vue/es/_utils/is";
+import { getNow as u } from "@arco-design/web-vue/es/_utils/date";
+import { EMode as A } from "../enum.js";
+function o(n, r) {
+  if (n && w(n))
+    return n[r];
+}
+const f = ({
+  prefixCls: n,
+  mergedValue: r,
+  rangeValues: a,
+  hoverRangeValues: c,
+  panel: E,
+  isSameTime: i,
+  innerMode: R
+}) => function(t, h) {
+  const s = o(a, 0), g = o(a, 1), d = o(c, 0), l = o(c, 1), $ = !t.isPrev && !t.isNext, e = $ && E, N = e, v = e;
+  d && s && d.isBefore(s);
+  const y = g && l && l.isAfter(g) && v;
+  let m = i(t.time, u());
+  return R === A.year && (m = u().isSame(t.time, "date")), [
+    `${n}-cell`,
+    {
+      [`${n}-cell-in-view`]: $,
+      [`${n}-cell-today`]: m,
+      [`${n}-cell-selected`]: r && i(t.time, r),
+      [`${n}-cell-range-start`]: N,
+      [`${n}-cell-range-end`]: v,
+      [`${n}-cell-in-range`]: e,
+      [`${n}-cell-in-range-near-hover`]: y,
+      [`${n}-cell-hover-range-start`]: e,
+      [`${n}-cell-hover-range-end`]: e,
+      [`${n}-cell-hover-in-range`]: e,
+      [`${n}-cell-disabled`]: h
+    }
+  ];
+};
+export {
+  f as default
+};