@canlooks/can-ui 0.0.188 → 0.0.190

package/dist/cjs/components/calendar/panelMonth.d.ts

@@ -1,2 +1,2 @@
 import { PanelProps } from './calendar';
-export declare const PanelMonth: import("react").MemoExoticComponent<({ innerD, setInnerD, onSelected, min, max }: PanelProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
+export declare const PanelMonth: import("react").MemoExoticComponent<({ innerD, setInnerD, onSelected }: PanelProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/dist/cjs/components/calendar/panelMonth.js

@@ -5,23 +5,17 @@ const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const react_1 = require("react");
 const calendar_style_1 = require("./calendar.style");
 const button_1 = require("../button");
-exports.PanelMonth = (0, react_1.memo)(({ innerD, setInnerD, onSelected, min, max }) => {
+exports.PanelMonth = (0, react_1.memo)(({ innerD, setInnerD, onSelected }) => {
     const currentMonth = innerD.month();
     const clickHandler = (d, i) => {
         currentMonth !== i && setInnerD(d);
         onSelected(d);
     };
-    const isDisabled = (d) => {
-        if (min && min.isAfter(d)) {
-            return true;
-        }
-        return max && max.isBefore(d);
-    };
     const renderButtons = () => {
         const ret = [];
         for (let i = 0; i < 12; i++) {
             const d = innerD.month(i);
-            ret.push((0, jsx_runtime_1.jsxs)(button_1.Button, { className: calendar_style_1.classes.monthItem, variant: currentMonth === i ? 'filled' : 'text', size: "large", color: currentMonth === i ? 'primary' : 'text', disabled: isDisabled(d), onClick: () => clickHandler(d, i), children: [i + 1, "\u6708"] }, i));
+            ret.push((0, jsx_runtime_1.jsxs)(button_1.Button, { className: calendar_style_1.classes.monthItem, variant: currentMonth === i ? 'filled' : 'text', size: "large", color: currentMonth === i ? 'primary' : 'text', onClick: () => clickHandler(d, i), children: [i + 1, "\u6708"] }, i));
         }
         return ret;
     };

package/dist/cjs/components/calendar/panelYear.d.ts

@@ -1,2 +1,2 @@
 import { PanelProps } from './calendar';
-export declare const PanelYear: import("react").MemoExoticComponent<({ innerD, setInnerD, onSelected, min, max }: PanelProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
+export declare const PanelYear: import("react").MemoExoticComponent<({ innerD, setInnerD, onSelected }: PanelProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/dist/cjs/components/calendar/panelYear.js

@@ -9,7 +9,7 @@ const tooltip_1 = require("../tooltip");
 const icon_1 = require("../icon");
 const faAngleLeft_1 = require("@fortawesome/free-solid-svg-icons/faAngleLeft");
 const faAngleRight_1 = require("@fortawesome/free-solid-svg-icons/faAngleRight");
-exports.PanelYear = (0, react_1.memo)(({ innerD, setInnerD, onSelected, min, max }) => {
+exports.PanelYear = (0, react_1.memo)(({ innerD, setInnerD, onSelected }) => {
     const currentYear = innerD.year();
     const clickHandler = (d, yearNum) => {
         currentYear !== yearNum && setInnerD(d);
@@ -17,18 +17,12 @@ exports.PanelYear = (0, react_1.memo)(({ innerD, setInnerD, onSelected, min, max
     };
     const [page, setPage] = (0, react_1.useState)(() => Math.floor(currentYear / 12));
     const renderHeadControl = (icon, title, onClick) => ((0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: title, children: (0, jsx_runtime_1.jsx)(button_1.Button, { className: calendar_style_1.classes.headControl, variant: "text", size: "small", color: "text.secondary", onClick: onClick, children: icon }) }));
-    const isDisabled = (d) => {
-        if (min && min.isAfter(d)) {
-            return true;
-        }
-        return max && max.isBefore(d);
-    };
     const renderButtons = () => {
         const ret = [];
         for (let i = 0; i < 12; i++) {
             const yearNum = page * 12 + i + 1;
             const d = innerD.year(yearNum);
-            ret.push((0, jsx_runtime_1.jsx)(button_1.Button, { className: calendar_style_1.classes.monthItem, variant: currentYear === yearNum ? 'filled' : 'text', size: "large", color: currentYear === yearNum ? 'primary' : 'text', disabled: isDisabled(d), onClick: () => clickHandler(d, yearNum), children: yearNum }, i));
+            ret.push((0, jsx_runtime_1.jsx)(button_1.Button, { className: calendar_style_1.classes.monthItem, variant: currentYear === yearNum ? 'filled' : 'text', size: "large", color: currentYear === yearNum ? 'primary' : 'text', onClick: () => clickHandler(d, yearNum), children: yearNum }, i));
         }
         return ret;
     };

package/dist/cjs/components/dataGrid/dataGrid.style.js

@@ -103,6 +103,16 @@ exports.style = (0, utils_1.defineCss)(({ spacing, mode, gray, text, colors, eas
                     .${exports.classes.children} {
                         padding: ${spacing[4]}px ${spacing[5]}px;
                         border-bottom: 1px solid ${gray(mode === 'light' ? .12 : .32)};
+
+                        thead, tfoot {
+                            z-index: 3;
+                        }
+
+                        th, td {
+                            &[data-sticky=left], &[data-sticky=right] {
+                                z-index: 2;
+                            }
+                        }
                     }
                 }
             }
@@ -139,12 +149,6 @@ exports.style = (0, utils_1.defineCss)(({ spacing, mode, gray, text, colors, eas
                 }
             }
 
-            .${exports.classes.empty} {
-                height: auto;
-                position: sticky;
-                left: 0;
-            }
-
             .${exports.classes.resizeHandle} {
                 width: 8px;
                 height: 100%;
@@ -168,6 +172,12 @@ exports.style = (0, utils_1.defineCss)(({ spacing, mode, gray, text, colors, eas
             }
         }
 
+        .${exports.classes.empty} {
+            height: auto;
+            position: sticky;
+            left: 0;
+        }
+
         &[data-column-resizable=true] .${table_style_1.classes.root} {
             width: max-content;
             table-layout: fixed;

package/dist/cjs/components/table/table.style.js

@@ -20,7 +20,7 @@ exports.style = (0, utils_1.defineCss)(({ mode, spacing, gray, divider, backgrou
 
             thead, tfoot {
                 position: sticky;
-                z-index: 3;
+                z-index: 5;
 
                 th, td {
                     background-color: ${headerBg};

package/dist/cjs/components/table/tableSticky.style.js

@@ -11,7 +11,7 @@ exports.style = (0, utils_1.defineCss)(({ easing }) => (0, react_1.css) `
             &[data-sticky=left], &[data-sticky=right] {
                 overflow: visible;
                 position: sticky;
-                z-index: 2;
+                z-index: 4;
 
                 &::after {
                     content: '';

package/dist/esm/components/calendar/panelMonth.d.ts

@@ -1,2 +1,2 @@
 import { PanelProps } from './calendar.js';
-export declare const PanelMonth: import("react").MemoExoticComponent<({ innerD, setInnerD, onSelected, min, max }: PanelProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
+export declare const PanelMonth: import("react").MemoExoticComponent<({ innerD, setInnerD, onSelected }: PanelProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/dist/esm/components/calendar/panelMonth.js

@@ -2,23 +2,17 @@ import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "@emotion/reac
 import { memo } from 'react';
 import { classes } from './calendar.style.js';
 import { Button } from '../button/index.js';
-export const PanelMonth = memo(({ innerD, setInnerD, onSelected, min, max }) => {
+export const PanelMonth = memo(({ innerD, setInnerD, onSelected }) => {
     const currentMonth = innerD.month();
     const clickHandler = (d, i) => {
         currentMonth !== i && setInnerD(d);
         onSelected(d);
     };
-    const isDisabled = (d) => {
-        if (min && min.isAfter(d)) {
-            return true;
-        }
-        return max && max.isBefore(d);
-    };
     const renderButtons = () => {
         const ret = [];
         for (let i = 0; i < 12; i++) {
             const d = innerD.month(i);
-            ret.push(_jsxs(Button, { className: classes.monthItem, variant: currentMonth === i ? 'filled' : 'text', size: "large", color: currentMonth === i ? 'primary' : 'text', disabled: isDisabled(d), onClick: () => clickHandler(d, i), children: [i + 1, "\u6708"] }, i));
+            ret.push(_jsxs(Button, { className: classes.monthItem, variant: currentMonth === i ? 'filled' : 'text', size: "large", color: currentMonth === i ? 'primary' : 'text', onClick: () => clickHandler(d, i), children: [i + 1, "\u6708"] }, i));
         }
         return ret;
     };

package/dist/esm/components/calendar/panelYear.d.ts

@@ -1,2 +1,2 @@
 import { PanelProps } from './calendar.js';
-export declare const PanelYear: import("react").MemoExoticComponent<({ innerD, setInnerD, onSelected, min, max }: PanelProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
+export declare const PanelYear: import("react").MemoExoticComponent<({ innerD, setInnerD, onSelected }: PanelProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/dist/esm/components/calendar/panelYear.js

@@ -6,7 +6,7 @@ import { Tooltip } from '../tooltip/index.js';
 import { Icon } from '../icon/index.js';
 import { faAngleLeft } from '@fortawesome/free-solid-svg-icons/faAngleLeft';
 import { faAngleRight } from '@fortawesome/free-solid-svg-icons/faAngleRight';
-export const PanelYear = memo(({ innerD, setInnerD, onSelected, min, max }) => {
+export const PanelYear = memo(({ innerD, setInnerD, onSelected }) => {
     const currentYear = innerD.year();
     const clickHandler = (d, yearNum) => {
         currentYear !== yearNum && setInnerD(d);
@@ -14,18 +14,12 @@ export const PanelYear = memo(({ innerD, setInnerD, onSelected, min, max }) => {
     };
     const [page, setPage] = useState(() => Math.floor(currentYear / 12));
     const renderHeadControl = (icon, title, onClick) => (_jsx(Tooltip, { title: title, children: _jsx(Button, { className: classes.headControl, variant: "text", size: "small", color: "text.secondary", onClick: onClick, children: icon }) }));
-    const isDisabled = (d) => {
-        if (min && min.isAfter(d)) {
-            return true;
-        }
-        return max && max.isBefore(d);
-    };
     const renderButtons = () => {
         const ret = [];
         for (let i = 0; i < 12; i++) {
             const yearNum = page * 12 + i + 1;
             const d = innerD.year(yearNum);
-            ret.push(_jsx(Button, { className: classes.monthItem, variant: currentYear === yearNum ? 'filled' : 'text', size: "large", color: currentYear === yearNum ? 'primary' : 'text', disabled: isDisabled(d), onClick: () => clickHandler(d, yearNum), children: yearNum }, i));
+            ret.push(_jsx(Button, { className: classes.monthItem, variant: currentYear === yearNum ? 'filled' : 'text', size: "large", color: currentYear === yearNum ? 'primary' : 'text', onClick: () => clickHandler(d, yearNum), children: yearNum }, i));
         }
         return ret;
     };

package/dist/esm/components/dataGrid/dataGrid.style.js

@@ -100,6 +100,16 @@ export const style = defineCss(({ spacing, mode, gray, text, colors, easing }) =
                     .${classes.children} {
                         padding: ${spacing[4]}px ${spacing[5]}px;
                         border-bottom: 1px solid ${gray(mode === 'light' ? .12 : .32)};
+
+                        thead, tfoot {
+                            z-index: 3;
+                        }
+
+                        th, td {
+                            &[data-sticky=left], &[data-sticky=right] {
+                                z-index: 2;
+                            }
+                        }
                     }
                 }
             }
@@ -136,12 +146,6 @@ export const style = defineCss(({ spacing, mode, gray, text, colors, easing }) =
                 }
             }
 
-            .${classes.empty} {
-                height: auto;
-                position: sticky;
-                left: 0;
-            }
-
             .${classes.resizeHandle} {
                 width: 8px;
                 height: 100%;
@@ -165,6 +169,12 @@ export const style = defineCss(({ spacing, mode, gray, text, colors, easing }) =
             }
         }
 
+        .${classes.empty} {
+            height: auto;
+            position: sticky;
+            left: 0;
+        }
+
         &[data-column-resizable=true] .${tableClasses.root} {
             width: max-content;
             table-layout: fixed;

package/dist/esm/components/table/table.style.js

@@ -16,7 +16,7 @@ export const style = defineCss(({ mode, spacing, gray, divider, background, easi
 
             thead, tfoot {
                 position: sticky;
-                z-index: 3;
+                z-index: 5;
 
                 th, td {
                     background-color: ${headerBg};

package/dist/esm/components/table/tableSticky.style.js

@@ -8,7 +8,7 @@ export const style = defineCss(({ easing }) => css `
             &[data-sticky=left], &[data-sticky=right] {
                 overflow: visible;
                 position: sticky;
-                z-index: 2;
+                z-index: 4;
 
                 &::after {
                     content: '';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@canlooks/can-ui",
-  "version": "0.0.188",
+  "version": "0.0.190",
   "author": "C.CanLiang <canlooks@gmail.com>",
   "description": "My ui framework",
   "license": "MIT",