@schedule-x/date-picker - npm Package Compare versions

Comparing version 1.52.0 to 1.53.0

dist/core.cjs.d.ts

@@ -40,2 +40,3 @@ import { Signal } from "@preact/signals";
     name?: string;
+    disabled?: boolean;
 }
@@ -74,2 +75,3 @@ interface DatePickerConfigExternal extends Partial<Omit<DatePickerConfigInternal, "placement">> {
     isOpen: Signal<boolean>;
+    isDisabled: Signal<boolean>;
     selectedDate: Signal<string>;
@@ -107,2 +109,4 @@ inputDisplayedValue: Signal<string>;
     set value(value: string);
+    get disabled(): boolean;
+    set disabled(value: boolean);
     setTheme(theme: "light" | "dark"): void;
@@ -109,0 +113,0 @@ getTheme(): "light" | "dark";

dist/core.d.ts

@@ -40,2 +40,3 @@ import { Signal } from "@preact/signals";
     name?: string;
+    disabled?: boolean;
 }
@@ -74,2 +75,3 @@ interface DatePickerConfigExternal extends Partial<Omit<DatePickerConfigInternal, "placement">> {
     isOpen: Signal<boolean>;
+    isDisabled: Signal<boolean>;
     selectedDate: Signal<string>;
@@ -107,2 +109,4 @@ inputDisplayedValue: Signal<string>;
     set value(value: string);
+    get disabled(): boolean;
+    set disabled(value: boolean);
     setTheme(theme: "light" | "dark"): void;
@@ -109,0 +113,0 @@ getTheme(): "light" | "dark";

dist/core.js

@@ -140,3 +140,3 @@ import { createContext, render, createElement } from 'preact';
     };
-    return (jsx(Fragment, { children: jsxs("div", { className: wrapperClasses.join(' '), id: inputWrapperId, children: [jsx("label", { for: datePickerInputId, id: datePickerLabelId, className: "sx__date-input-label", children: $app.config.label || $app.translate('Date') }), jsx("input", { id: datePickerInputId, name: $app.config.name || 'date', "aria-describedby": datePickerLabelId, value: $app.datePickerState.inputDisplayedValue.value, "data-testid": "date-picker-input", className: "sx__date-input", onClick: handleClick, onKeyUp: handleKeyUp, type: "text" }), jsx("button", { "aria-label": $app.translate('Choose Date'), onKeyDown: handleButtonKeyDown, onClick: () => $app.datePickerState.open(), className: "sx__date-input-chevron-wrapper", children: jsx("img", { className: "sx__date-input-chevron", src: img, alt: "" }) })] }) }));
+    return (jsx(Fragment, { children: jsxs("div", { className: wrapperClasses.join(' '), id: inputWrapperId, children: [jsx("label", { for: datePickerInputId, id: datePickerLabelId, className: "sx__date-input-label", children: $app.config.label || $app.translate('Date') }), jsx("input", { id: datePickerInputId, tabIndex: $app.datePickerState.isDisabled.value ? -1 : 0, name: $app.config.name || 'date', "aria-describedby": datePickerLabelId, value: $app.datePickerState.inputDisplayedValue.value, "data-testid": "date-picker-input", className: "sx__date-input", onClick: handleClick, onKeyUp: handleKeyUp, type: "text" }), jsx("button", { tabIndex: $app.datePickerState.isDisabled.value ? -1 : 0, "aria-label": $app.translate('Choose Date'), onKeyDown: handleButtonKeyDown, onClick: () => $app.datePickerState.open(), className: "sx__date-input-chevron-wrapper", children: jsx("img", { className: "sx__date-input-chevron", src: img, alt: "" }) })] }) }));
 }
@@ -499,8 +499,11 @@
         var _a;
-        setClassList([
-            ...initialClassList,
-            $app.datePickerState.isDark.value ? 'is-dark' : '',
-            ((_a = $app.config.style) === null || _a === void 0 ? void 0 : _a.fullWidth) ? 'has-full-width' : '',
-        ]);
-    }, [$app.datePickerState.isDark.value]);
+        const list = [...initialClassList];
+        if ($app.datePickerState.isDark.value)
+            list.push('is-dark');
+        if ((_a = $app.config.style) === null || _a === void 0 ? void 0 : _a.fullWidth)
+            list.push('has-full-width');
+        if ($app.datePickerState.isDisabled.value)
+            list.push('is-disabled');
+        setClassList(list);
+    }, [$app.datePickerState.isDark.value, $app.datePickerState.isDisabled.value]);
     let appPopupJSX = jsx(AppPopup, {});
@@ -532,2 +535,8 @@ if ($app.config.teleportTo)
     }
+    get disabled() {
+        return this.$app.datePickerState.isDisabled.value;
+    }
+    set disabled(value) {
+        this.$app.datePickerState.isDisabled.value = value;
+    }
     setTheme(theme) {
@@ -760,2 +769,3 @@ this.$app.datePickerState.isDark.value = theme === 'dark';
     const isOpen = signal(false);
+    const isDisabled = signal(config.disabled || false);
     const datePickerView = signal(DatePickerView.MONTH_DAYS);
@@ -796,2 +806,3 @@ const selectedDate = signal(initialSelectedDate);
         isOpen,
+        isDisabled,
         datePickerView,
@@ -895,3 +906,3 @@ selectedDate,
 class ConfigImpl {
-    constructor(locale = DEFAULT_LOCALE, firstDayOfWeek = DEFAULT_FIRST_DAY_OF_WEEK, min = toDateString$1(new Date(1970, 0, 1)), max = toDateString$1(new Date(new Date().getFullYear() + 1, 11, 31)), placement = Placement.BOTTOM_START, listeners = {}, style = {}, teleportTo, label, name) {
+    constructor(locale = DEFAULT_LOCALE, firstDayOfWeek = DEFAULT_FIRST_DAY_OF_WEEK, min = toDateString$1(new Date(1970, 0, 1)), max = toDateString$1(new Date(new Date().getFullYear() + 1, 11, 31)), placement = Placement.BOTTOM_START, listeners = {}, style = {}, teleportTo, label, name, disabled) {
         Object.defineProperty(this, "locale", {
@@ -957,2 +968,8 @@ enumerable: true,
         });
+        Object.defineProperty(this, "disabled", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: disabled
+        });
     }
@@ -1023,5 +1040,11 @@ }
         });
+        Object.defineProperty(this, "disabled", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
     }
     build() {
-        return new ConfigImpl(this.locale, this.firstDayOfWeek, this.min, this.max, this.placement, this.listeners, this.style, this.teleportTo, this.label, this.name);
+        return new ConfigImpl(this.locale, this.firstDayOfWeek, this.min, this.max, this.placement, this.listeners, this.style, this.teleportTo, this.label, this.name, this.disabled);
     }
@@ -1068,2 +1091,6 @@ withLocale(locale) {
     }
+    withDisabled(disabled) {
+        this.disabled = disabled;
+        return this;
+    }
 }
@@ -1760,2 +1787,3 @@
         .withName(config.name)
+        .withDisabled(config.disabled)
         .build();
@@ -1762,0 +1790,0 @@ const timeUnitsImpl = new TimeUnitsBuilder()

dist/core.umd.d.ts

@@ -40,2 +40,3 @@ import { Signal } from "@preact/signals";
     name?: string;
+    disabled?: boolean;
 }
@@ -74,2 +75,3 @@ interface DatePickerConfigExternal extends Partial<Omit<DatePickerConfigInternal, "placement">> {
     isOpen: Signal<boolean>;
+    isDisabled: Signal<boolean>;
     selectedDate: Signal<string>;
@@ -107,2 +109,4 @@ inputDisplayedValue: Signal<string>;
     set value(value: string);
+    get disabled(): boolean;
+    set disabled(value: boolean);
     setTheme(theme: "light" | "dark"): void;
@@ -109,0 +113,0 @@ getTheme(): "light" | "dark";

package.json

 {
   "name": "@schedule-x/date-picker",
-  "version": "1.52.0",
+  "version": "1.53.0",
   "description": "Schedule-X date picker component",
@@ -34,3 +34,3 @@ "author": {
   "homepage": "https://schedule-x.dev",
-  "gitHead": "59a6626bab061537162fd661b98ed7b460da699b"
+  "gitHead": "48822a600851ce3ac1123b9f764e9d3b709f8541"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

272768

increased by1.73%

Lines of code

7136

increased by1.84%

No dependency changes