@uxf/ui - npm Package Compare versions

Comparing version 11.30.1 to 11.31.0

package.json

 {
   "name": "@uxf/ui",
-  "version": "11.30.1",
+  "version": "11.31.0",
   "description": "",
@@ -20,6 +20,6 @@ "publishConfig": {
     "@headlessui/react": "1.7.14",
-    "@uxf/core": "11.29.0",
-    "@uxf/core-react": "11.29.0",
+    "@uxf/core": "11.31.0",
+    "@uxf/core-react": "11.31.0",
     "@uxf/datepicker": "11.25.0",
-    "@uxf/styles": "11.29.0",
+    "@uxf/styles": "11.31.0",
     "color2k": "2.0.3",
@@ -26,0 +26,0 @@ "dayjs": "1.11.10",

time-picker-input/time-picker-input.d.ts

@@ -0,10 +1,17 @@
+import { TimeString } from "@uxf/core/date";
 import React, { ReactNode } from "react";
 import { InputWithPopoverProps } from "../_input-with-popover";
+import { ControlProps } from "../types";
 export declare const ALLOWED_TIME_FORMAT: string[];
 export declare const DISPLAY_TIME_FORMAT = "H:mm";
 export declare const OUTPUT_TIME_FORMAT = "HH:mm:ss";
+interface CustomTimePickerProps extends ControlProps<TimeString | null> {
+    onClose: () => void;
+}
 export interface TimePickerInputProps extends Omit<InputWithPopoverProps<string | null>, "children" | "placeholder" | "triggerElement"> {
     placeholder?: string;
     triggerElement?: ReactNode;
+    CustomTimePicker?: (props: CustomTimePickerProps) => ReactNode;
 }
 export declare const TimePickerInput: React.ForwardRefExoticComponent<TimePickerInputProps & React.RefAttributes<HTMLInputElement>>;
+export {};

time-picker-input/time-picker-input.js

@@ -30,3 +30,5 @@ "use strict";
 exports.TimePickerInput = exports.OUTPUT_TIME_FORMAT = exports.DISPLAY_TIME_FORMAT = exports.ALLOWED_TIME_FORMAT = void 0;
+const is_time_string_1 = require("@uxf/core/date/is-time-string");
 const cx_1 = require("@uxf/core/utils/cx");
+const is_not_nil_1 = require("@uxf/core/utils/is-not-nil");
 const dayjs_1 = __importStar(require("dayjs"));
@@ -79,4 +81,4 @@ const customParseFormat_1 = __importDefault(require("dayjs/plugin/customParseFormat"));
     const selectedTime = getSelectedTime(props.value);
-    return (react_1.default.createElement(_input_with_popover_1._InputWithPopover, { ...props, className: className, onChange: onInputChange, placeholder: (_a = props.placeholder) !== null && _a !== void 0 ? _a : (0, dayjs_1.default)().format(exports.DISPLAY_TIME_FORMAT), ref: ref, value: value, triggerElement: (_b = props.triggerElement) !== null && _b !== void 0 ? _b : react_1.default.createElement(icon_1.Icon, { name: "clock", size: 20 }) }, ({ close }) => (react_1.default.createElement(time_picker_1.TimePicker, { closePopoverHandler: close, onChange: onTimePickerChange, preventScroll: true, selectedTime: selectedTime }))));
+    return (react_1.default.createElement(_input_with_popover_1._InputWithPopover, { ...props, className: className, onChange: onInputChange, placeholder: (_a = props.placeholder) !== null && _a !== void 0 ? _a : (0, dayjs_1.default)().format(exports.DISPLAY_TIME_FORMAT), ref: ref, value: value, triggerElement: (_b = props.triggerElement) !== null && _b !== void 0 ? _b : react_1.default.createElement(icon_1.Icon, { name: "clock", size: 20 }) }, ({ close }) => (0, is_not_nil_1.isNotNil)(props.CustomTimePicker) ? (react_1.default.createElement(props.CustomTimePicker, { value: (0, is_time_string_1.isTimeString)(props.value) ? props.value : null, onChange: props.onChange, onClose: close })) : (react_1.default.createElement(time_picker_1.TimePicker, { closePopoverHandler: close, onChange: onTimePickerChange, preventScroll: true, selectedTime: selectedTime }))));
 });
 exports.TimePickerInput.displayName = "UxfUiTimePickerInput";

time-picker-input/time-picker-input.stories.d.ts

 import React from "react";
-declare const _default: {
-    title: string;
-    component: React.ForwardRefExoticComponent<import("./time-picker-input").TimePickerInputProps & React.RefAttributes<HTMLInputElement>>;
-};
-export default _default;
 export declare function Default(): React.JSX.Element;

time-picker-input/time-picker-input.stories.js

@@ -29,12 +29,9 @@ "use strict";
 const react_1 = __importStar(require("react"));
+const button_1 = require("../button");
 const action_1 = require("../utils/action");
 const time_picker_input_1 = require("./time-picker-input");
-exports.default = {
-    title: "UI/TimePickerInput",
-    component: time_picker_input_1.TimePickerInput,
-};
 function Default() {
     const [value, setValue] = (0, react_1.useState)(null);
     const onChange = (0, action_1.action)("onChange", setValue);
-    const testTimePickers = (react_1.default.createElement(react_1.default.Fragment, null,
+    return (react_1.default.createElement("div", { className: "max-w-[640px] space-y-4 rounded p-8" },
         react_1.default.createElement(time_picker_input_1.TimePickerInput, { id: "time-test", label: "\u010Cas \u010Dehokoliv", name: "time", onChange: onChange, placeholder: "Zadejte \u010Das...", value: value }),
@@ -44,6 +41,8 @@ react_1.default.createElement(time_picker_input_1.TimePickerInput, { id: "time-test", isClearable: true, label: "\u010Cas \u010Dehokoliv vlastn\u00ED ikona", name: "time", onChange: onChange, triggerElement: react_1.default.createElement(icon_1.Icon, { name: "camera", size: 20 }), value: value }),
         react_1.default.createElement(time_picker_input_1.TimePickerInput, { id: "time-test-readonly", isReadOnly: true, label: "\u010Cas readonly", name: "time-readonly", onChange: onChange, value: value }),
-        react_1.default.createElement(time_picker_input_1.TimePickerInput, { id: "time-test-invalid", isClearable: true, isInvalid: true, label: "\u010Cas invalid", name: "time-invalid", onChange: onChange, value: value })));
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement("div", { className: "max-w-[640px] space-y-4 rounded p-8" }, testTimePickers)));
+        react_1.default.createElement(time_picker_input_1.TimePickerInput, { id: "time-test-invalid", isClearable: true, isInvalid: true, label: "\u010Cas invalid", name: "time-invalid", onChange: onChange, value: value }),
+        react_1.default.createElement(time_picker_input_1.TimePickerInput, { id: "custom-picker", label: "Custom picker", name: "custom-picker", onChange: onChange, value: value, CustomTimePicker: (props) => (react_1.default.createElement(button_1.Button, { onClick: () => {
+                    props.onChange("15:00:00");
+                    props.onClose();
+                } }, "15:00")) })));
 }
 exports.Default = Default;

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

856236

increased by0.07%

Lines of code

17867

increased by0.02%

Dependency changes

• + Added@uxf/core@11.31.0(transitive)

• + Added@uxf/core-react@11.31.0(transitive)

• + Added@uxf/styles@11.31.0(transitive)

• - Removed@uxf/core@11.29.0(transitive)

• - Removed@uxf/core-react@11.29.0(transitive)

• - Removed@uxf/styles@11.29.0(transitive)

• Updated@uxf/core@11.31.0

• Updated@uxf/core-react@11.31.0

• Updated@uxf/styles@11.31.0