@uxf/data-grid 11.0.0-beta.12 → 11.0.0-beta.13

package/_story-utils/grid-type.d.ts

@@ -12,6 +12,7 @@ export type GridType = {
     filters: {
         text: "text";
         bool: "boolean";
+        date: "date";
         ival: "interval";
         tel: "string";
         mail: "string";

package/_story-utils/schema.js

@@ -18,6 +18,7 @@ exports.schema = {
         { name: "bool", type: "boolean", label: "Boolean" },
         { name: "ival", type: "interval", label: "Super interval" },
         { name: "mail", type: "string", label: "E-mail" },
+        { name: "date", type: "date", label: "Date" },
         { name: "tel", type: "string", label: "Phone" },
         { name: "link", type: "string", label: "Link" },
         {

package/filter-handler/date.d.ts

@@ -0,0 +1,3 @@
+import { FilterHandler } from "./types";
+declare const date: FilterHandler;
+export default date;

package/filter-handler/date.js

@@ -0,0 +1,43 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const filter_nullish_1 = require("@uxf/core/utils/filter-nullish");
+const is_nil_1 = require("@uxf/core/utils/is-nil");
+const chip_1 = require("@uxf/ui/chip");
+const date_picker_input_1 = require("@uxf/ui/date-picker-input");
+const dayjs_1 = __importDefault(require("dayjs"));
+const react_1 = __importDefault(require("react"));
+const date = {
+    input: function (props) {
+        var _a, _b;
+        const initializedValue = typeof ((_a = props.value.value) === null || _a === void 0 ? void 0 : _a.from) !== "undefined" && typeof ((_b = props.value.value) === null || _b === void 0 ? void 0 : _b.to) !== "undefined"
+            ? props.value
+            : { name: props.filter.name, value: { from: null, to: null } };
+        return (react_1.default.createElement("div", { className: "uxf-data-grid__filter uxf-data-grid__filter--date" },
+            react_1.default.createElement(date_picker_input_1.DatePickerInput, { value: initializedValue.value.from, onChange: (changedValue) => props.onFilter({
+                    ...initializedValue,
+                    value: { ...initializedValue.value, from: changedValue },
+                }), label: `${props.filter.label} (od)` }),
+            react_1.default.createElement(date_picker_input_1.DatePickerInput, { value: initializedValue.value.to, onChange: (changedValue) => props.onFilter({ ...initializedValue, value: { ...initializedValue.value, to: changedValue } }), label: `${props.filter.label} (do)` })));
+    },
+    listItem: function (props) {
+        if ((0, is_nil_1.isNil)(props.value.value)) {
+            return null;
+        }
+        const value = props.value.value;
+        if ((0, is_nil_1.isNil)(value.from) && (0, is_nil_1.isNil)(value.to)) {
+            return null;
+        }
+        const formatDate = [
+            value.from ? "od " + (0, dayjs_1.default)(value.from).format("l") : "",
+            value.to ? "do " + (0, dayjs_1.default)(value.to).format("l") : "",
+        ];
+        return (react_1.default.createElement(chip_1.Chip, { onClose: () => props.onFilter({ ...props.value, value: undefined }) },
+            props.filter.label,
+            " ",
+            (0, filter_nullish_1.filterNullish)(formatDate).join(" ")));
+    },
+};
+exports.default = date;

package/filter-handler/index.js

@@ -20,6 +20,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.defaultFilterHandlers = void 0;
 const bool_filter_1 = __importDefault(require("./bool-filter"));
 const boolean_filter_1 = __importDefault(require("./boolean-filter"));
+const date_1 = __importDefault(require("./date"));
 const interval_filter_1 = __importDefault(require("./interval-filter"));
 const select_filter_1 = __importDefault(require("./select-filter"));
 const text_filter_1 = __importDefault(require("./text-filter"));
@@ -27,6 +28,7 @@ __exportStar(require("./types"), exports);
 exports.defaultFilterHandlers = {
     text: text_filter_1.default,
     string: text_filter_1.default,
+    date: date_1.default,
     bool: bool_filter_1.default,
     boolean: boolean_filter_1.default,
     checkbox: boolean_filter_1.default,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/data-grid",
-  "version": "11.0.0-beta.12",
+  "version": "11.0.0-beta.13",
   "description": "UXF DataGrid",
   "homepage": "https://gitlab.com/uxf-npm/data-grid#readme",
   "main": "index.js",

package/styles.css

@@ -165,6 +165,12 @@
     }
 
     &__filter {
+        &--date {
+            display: grid;
+            gap: theme("spacing.4");
+            grid-template-columns: repeat(2, 1fr);
+        }
+
         &--interval {
             display: grid;
             gap: theme("spacing.4");