@uxf/form
Advanced tools
Comparing version 11.31.2 to 11.32.0
@@ -6,3 +6,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.AvatarFileInput = void 0; | ||
exports.AvatarFileInput = AvatarFileInput; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const avatar_file_input_1 = require("@uxf/ui/avatar-file-input"); | ||
@@ -13,3 +14,3 @@ const react_1 = __importDefault(require("react")); | ||
function AvatarFileInput(props) { | ||
var _a, _b, _c, _d; | ||
var _a, _b, _c; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -22,3 +23,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -37,5 +38,4 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(avatar_file_input_1.AvatarFileInput, { accept: props.accept, "aria-describedby": props["aria-describedby"], className: props.className, customControls: props.customControls, form: props.form, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, icon: props.icon, id: id, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, maxFileSize: props.maxFileSize, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, onUploadError: props.onUploadError, onUploadFile: props.onUploadFile, ref: field.ref, removeFileLabel: props.removeFileLabel, selectFileLabel: props.selectFileLabel, value: field.value, variant: props.variant })); | ||
return (react_1.default.createElement(avatar_file_input_1.AvatarFileInput, { accept: props.accept, "aria-describedby": props["aria-describedby"], className: props.className, customControls: props.customControls, form: props.form, helperText: (_c = (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message) !== null && _c !== void 0 ? _c : props.helperText, hiddenLabel: props.hiddenLabel, icon: props.icon, id: id, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, maxFileSize: props.maxFileSize, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, onUploadError: props.onUploadError, onUploadFile: props.onUploadFile, ref: field.ref, removeFileLabel: props.removeFileLabel, selectFileLabel: props.selectFileLabel, value: field.value, variant: props.variant })); | ||
} | ||
exports.AvatarFileInput = AvatarFileInput; | ||
AvatarFileInput.displayName = "UxfFormAvatarFileInput"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -25,2 +25,1 @@ const upload_file_mock_1 = require("@uxf/ui/utils/mocks/upload-file.mock"); | ||
} | ||
exports.Default = Default; |
@@ -6,3 +6,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.CheckboxButton = void 0; | ||
exports.CheckboxButton = CheckboxButton; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const checkbox_button_1 = require("@uxf/ui/checkbox-button"); | ||
@@ -13,3 +14,3 @@ const react_1 = __importDefault(require("react")); | ||
function CheckboxButton(props) { | ||
var _a, _b, _c; | ||
var _a, _b; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -22,3 +23,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -37,5 +38,4 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(checkbox_button_1.CheckboxButton, { className: props.className, id: id, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, ref: field.ref, style: props.style, value: (_c = field.value) !== null && _c !== void 0 ? _c : (!props.nullable ? false : undefined) })); | ||
return (react_1.default.createElement(checkbox_button_1.CheckboxButton, { className: props.className, id: id, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, ref: field.ref, style: props.style, value: (_b = field.value) !== null && _b !== void 0 ? _b : (!props.nullable ? false : undefined) })); | ||
} | ||
exports.CheckboxButton = CheckboxButton; | ||
CheckboxButton.displayName = "UxfFormCheckboxButton"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -18,6 +18,6 @@ const react_1 = __importDefault(require("react")); | ||
const storyFormCheckboxes = (control) => (react_1.default.createElement("div", { className: "flex flex-col space-y-2" }, | ||
react_1.default.createElement(checkbox_button_1.CheckboxButton, { label: "CheckboxButton form", name: "checkbox-button1", control: control }), | ||
react_1.default.createElement(checkbox_button_1.CheckboxButton, { label: "CheckboxButton form required", name: "checkbox-button-required", control: control, isRequired: true }), | ||
react_1.default.createElement(checkbox_button_1.CheckboxButton, { label: "CheckboxButton form disabled", name: "checkbox-button-disabled", control: control, isDisabled: true }), | ||
react_1.default.createElement(checkbox_button_1.CheckboxButton, { label: "CheckboxButton form readOnly", name: "checkbox-button-read-only", control: control, isReadOnly: true }), | ||
react_1.default.createElement(checkbox_button_1.CheckboxButton, { control: control, label: "CheckboxButton form", name: "checkbox-button1" }), | ||
react_1.default.createElement(checkbox_button_1.CheckboxButton, { control: control, isRequired: true, label: "CheckboxButton form required", name: "checkbox-button-required" }), | ||
react_1.default.createElement(checkbox_button_1.CheckboxButton, { control: control, isDisabled: true, label: "CheckboxButton form disabled", name: "checkbox-button-disabled" }), | ||
react_1.default.createElement(checkbox_button_1.CheckboxButton, { control: control, isReadOnly: true, label: "CheckboxButton form readOnly", name: "checkbox-button-read-only" }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))); | ||
@@ -27,2 +27,1 @@ return (react_1.default.createElement(storybook_form_1.StorybookForm, null, ({ control }) => (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
} | ||
exports.Default = Default; |
@@ -6,3 +6,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.CheckboxInput = void 0; | ||
exports.CheckboxInput = CheckboxInput; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const checkbox_input_1 = require("@uxf/ui/checkbox-input"); | ||
@@ -13,3 +14,3 @@ const react_1 = __importDefault(require("react")); | ||
function CheckboxInput(props) { | ||
var _a, _b, _c, _d, _e; | ||
var _a, _b, _c, _d; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -22,3 +23,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -37,5 +38,4 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(checkbox_input_1.CheckboxInput, { className: props.className, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, ref: field.ref, size: props.size, style: props.style, value: (_e = field.value) !== null && _e !== void 0 ? _e : (!props.nullable ? false : undefined) })); | ||
return (react_1.default.createElement(checkbox_input_1.CheckboxInput, { className: props.className, helperText: (_c = (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message) !== null && _c !== void 0 ? _c : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, ref: field.ref, size: props.size, style: props.style, value: (_d = field.value) !== null && _d !== void 0 ? _d : (!props.nullable ? false : undefined) })); | ||
} | ||
exports.CheckboxInput = CheckboxInput; | ||
CheckboxInput.displayName = "UxfFormCheckboxInput"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -18,6 +18,6 @@ const react_1 = __importDefault(require("react")); | ||
const storyFormCheckboxes = (control) => (react_1.default.createElement("div", { className: "space-y-2" }, | ||
react_1.default.createElement(checkbox_input_1.CheckboxInput, { label: "CheckboxInput form", name: "checkbox1", control: control }), | ||
react_1.default.createElement(checkbox_input_1.CheckboxInput, { label: "CheckboxInput form required", name: "checkbox-required", control: control, isRequired: true }), | ||
react_1.default.createElement(checkbox_input_1.CheckboxInput, { label: "CheckboxInput form disabled", name: "checkbox-disabled", control: control, isDisabled: true }), | ||
react_1.default.createElement(checkbox_input_1.CheckboxInput, { label: "CheckboxInput form readOnly", name: "checkbox-readonly", control: control, isReadOnly: true }), | ||
react_1.default.createElement(checkbox_input_1.CheckboxInput, { control: control, label: "CheckboxInput form", name: "checkbox1" }), | ||
react_1.default.createElement(checkbox_input_1.CheckboxInput, { control: control, isRequired: true, label: "CheckboxInput form required", name: "checkbox-required" }), | ||
react_1.default.createElement(checkbox_input_1.CheckboxInput, { control: control, isDisabled: true, label: "CheckboxInput form disabled", name: "checkbox-disabled" }), | ||
react_1.default.createElement(checkbox_input_1.CheckboxInput, { control: control, isReadOnly: true, label: "CheckboxInput form readOnly", name: "checkbox-readonly" }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))); | ||
@@ -27,2 +27,1 @@ return (react_1.default.createElement(storybook_form_1.StorybookForm, null, ({ control }) => (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
} | ||
exports.Default = Default; |
@@ -6,3 +6,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.ColorRadioGroup = void 0; | ||
exports.ColorRadioGroup = ColorRadioGroup; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const color_radio_group_1 = require("@uxf/ui/color-radio-group"); | ||
@@ -13,3 +14,3 @@ const react_1 = __importDefault(require("react")); | ||
function ColorRadioGroup(props) { | ||
var _a, _b, _c, _d, _e; | ||
var _a, _b, _c, _d; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -22,3 +23,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -37,5 +38,4 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(color_radio_group_1.ColorRadioGroup, { className: props.className, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isDisabled: props.options.length === 0 || props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, options: props.options, ref: field.ref, style: props.style, value: (_e = field.value) !== null && _e !== void 0 ? _e : null })); | ||
return (react_1.default.createElement(color_radio_group_1.ColorRadioGroup, { className: props.className, helperText: (_c = (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message) !== null && _c !== void 0 ? _c : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isDisabled: props.options.length === 0 || props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, options: props.options, ref: field.ref, style: props.style, value: (_d = field.value) !== null && _d !== void 0 ? _d : null })); | ||
} | ||
exports.ColorRadioGroup = ColorRadioGroup; | ||
ColorRadioGroup.displayName = "UxfFormColorRadioGroup"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -64,2 +64,1 @@ const react_1 = __importDefault(require("react")); | ||
} | ||
exports.Default = Default; |
@@ -6,5 +6,7 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Combobox = void 0; | ||
exports.Combobox = Combobox; | ||
const empty_array_1 = require("@uxf/core/constants/empty-array"); | ||
const is_empty_1 = require("@uxf/core/utils/is-empty"); | ||
const is_nil_1 = require("@uxf/core/utils/is-nil"); | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const combobox_1 = require("@uxf/ui/combobox"); | ||
@@ -15,3 +17,3 @@ const react_1 = __importDefault(require("react")); | ||
function Combobox(props) { | ||
var _a, _b, _c, _d, _e, _f; | ||
var _a, _b, _c, _d, _e; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -24,3 +26,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -39,5 +41,5 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(combobox_1.Combobox, { className: props.className, dropdownClassName: props.dropdownClassName, dropdownMatchesInputWidth: props.dropdownMatchesInputWidth, dropdownMaxHeight: props.dropdownMaxHeight, dropdownPlacement: props.dropdownPlacement, dropdownStrategy: props.dropdownStrategy, form: props.form, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, iconName: props.iconName, id: id, inputArrow: props.inputArrow, inputRef: field.ref, isClearable: props.isClearable, isDisabled: ((0, is_nil_1.isNil)(props.loadOptions) && (0, is_empty_1.isEmpty)((_e = props.options) !== null && _e !== void 0 ? _e : [])) || props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, keyExtractor: props.keyExtractor, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, loadOptions: props.loadOptions, name: field.name, noOptionsMessage: props.noOptionsMessage, noQueryMessage: props.noQueryMessage, notFoundMessage: props.notFoundMessage, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, options: props.options, placeholder: props.placeholder, renderOption: props.renderOption, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, value: (_f = field.value) !== null && _f !== void 0 ? _f : null, variant: props.variant })); | ||
const isDisabled = ((0, is_nil_1.isNil)(props.loadOptions) && (0, is_empty_1.isEmpty)((_b = props.options) !== null && _b !== void 0 ? _b : empty_array_1.EMPTY_ARRAY)) || props.isDisabled; | ||
return (react_1.default.createElement(combobox_1.Combobox, { className: props.className, dropdownClassName: props.dropdownClassName, dropdownMatchesInputWidth: props.dropdownMatchesInputWidth, dropdownMaxHeight: props.dropdownMaxHeight, dropdownPlacement: props.dropdownPlacement, dropdownStrategy: props.dropdownStrategy, form: props.form, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, iconName: props.iconName, id: id, inputArrow: props.inputArrow, inputRef: field.ref, isClearable: props.isClearable, isDisabled: isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, keyExtractor: props.keyExtractor, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, loadOptions: props.loadOptions, name: field.name, noOptionsMessage: props.noOptionsMessage, noQueryMessage: props.noQueryMessage, notFoundMessage: props.notFoundMessage, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, options: props.options, placeholder: props.placeholder, renderOption: props.renderOption, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, value: (_e = field.value) !== null && _e !== void 0 ? _e : null, variant: props.variant })); | ||
} | ||
exports.Combobox = Combobox; | ||
Combobox.displayName = "UxfFormCombobox"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -23,7 +23,7 @@ const react_1 = __importDefault(require("react")); | ||
const storyFormComboboxes = (control) => (react_1.default.createElement("div", { className: "space-y-8" }, | ||
react_1.default.createElement(combobox_1.Combobox, { label: "Combobox form", name: "firstname", control: control, placeholder: "Placeholder", options: options, id: "form-combobox", helperText: "Za\u010Dn\u011Bte ps\u00E1t pro vyhled\u00E1v\u00E1n\u00ED..." }), | ||
react_1.default.createElement(combobox_1.Combobox, { label: "Combobox form required", name: "combobox-required", control: control, placeholder: "Placeholder", options: options, id: "form-combobox", isRequired: true, helperText: "Za\u010Dn\u011Bte ps\u00E1t pro vyhled\u00E1v\u00E1n\u00ED..." }), | ||
react_1.default.createElement(combobox_1.Combobox, { label: "Combobox form disabled", name: "combobox-disabled", control: control, placeholder: "Placeholder", options: options, id: "form-combobox", isDisabled: true }), | ||
react_1.default.createElement(combobox_1.Combobox, { label: "Combobox form with dropdown top", dropdownPlacement: "top", name: "select-dropdown-top", control: control, placeholder: "Placeholder", options: options, id: "form-combobox" }), | ||
react_1.default.createElement(combobox_1.Combobox, { label: "Combobox async", dropdownPlacement: "top", name: "select-dropdown-async", control: control, placeholder: "Placeholder", loadOptions: (query) => Promise.resolve(options.filter((option) => !query || option.label.toLowerCase().includes(query.toLowerCase()))), id: "form-combobox", isClearable: true }), | ||
react_1.default.createElement(combobox_1.Combobox, { control: control, helperText: "Za\u010Dn\u011Bte ps\u00E1t pro vyhled\u00E1v\u00E1n\u00ED...", id: "form-combobox", label: "Combobox form", name: "firstname", options: options, placeholder: "Placeholder" }), | ||
react_1.default.createElement(combobox_1.Combobox, { control: control, helperText: "Za\u010Dn\u011Bte ps\u00E1t pro vyhled\u00E1v\u00E1n\u00ED...", id: "form-combobox", isRequired: true, label: "Combobox form required", name: "combobox-required", options: options, placeholder: "Placeholder" }), | ||
react_1.default.createElement(combobox_1.Combobox, { control: control, id: "form-combobox", isDisabled: true, label: "Combobox form disabled", name: "combobox-disabled", options: options, placeholder: "Placeholder" }), | ||
react_1.default.createElement(combobox_1.Combobox, { control: control, dropdownPlacement: "top", id: "form-combobox", label: "Combobox form with dropdown top", name: "select-dropdown-top", options: options, placeholder: "Placeholder" }), | ||
react_1.default.createElement(combobox_1.Combobox, { control: control, dropdownPlacement: "top", id: "form-combobox", isClearable: true, label: "Combobox async", loadOptions: (query) => Promise.resolve(options.filter((option) => !query || option.label.toLowerCase().includes(query.toLowerCase()))), name: "select-dropdown-async", placeholder: "Placeholder" }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))); | ||
@@ -33,2 +33,1 @@ return (react_1.default.createElement(storybook_form_1.StorybookForm, { defaultValues: { "select-dropdown-async": { id: "one", label: "Option one" } } }, ({ control }) => (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
} | ||
exports.Default = Default; |
@@ -29,3 +29,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.DatePickerInput = void 0; | ||
exports.DatePickerInput = DatePickerInput; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const date_picker_input_1 = require("@uxf/ui/date-picker-input"); | ||
@@ -39,3 +40,3 @@ const dayjs_1 = __importStar(require("dayjs")); | ||
function DatePickerInput(props) { | ||
var _a, _b, _c, _d, _e, _f, _g, _h; | ||
var _a, _b, _c, _d, _e, _f; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -49,3 +50,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_c = props.rules) !== null && _c !== void 0 ? _c : {}), | ||
...props.rules, | ||
validate: { | ||
@@ -71,5 +72,5 @@ validDate: (value) => { | ||
}, | ||
...(typeof ((_d = props.rules) === null || _d === void 0 ? void 0 : _d.validate) === "function" | ||
...(typeof ((_c = props.rules) === null || _c === void 0 ? void 0 : _c.validate) === "function" | ||
? { custom: props.rules.validate } | ||
: (_f = (_e = props.rules) === null || _e === void 0 ? void 0 : _e.validate) !== null && _f !== void 0 ? _f : {}), | ||
: (_d = props.rules) === null || _d === void 0 ? void 0 : _d.validate), | ||
}, | ||
@@ -89,5 +90,4 @@ }, | ||
}; | ||
return (react_1.default.createElement(date_picker_input_1.DatePickerInput, { allowedDateFormats: props.allowedDateFormats, autoFocus: props.autoFocus, bottomContent: props.bottomContent, className: props.className, datesConfig: props.datesConfig, displayDateFormat: props.displayDateFormat, form: props.form, helperText: (_h = (_g = fieldState.error) === null || _g === void 0 ? void 0 : _g.message) !== null && _h !== void 0 ? _h : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isClearable: props.isClearable, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, maxDate: props.maxDate, minDate: props.minDate, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, placeholder: props.placeholder, popoverPlacement: props.popoverPlacement, popoverStrategy: props.popoverStrategy, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, triggerElement: props.triggerElement, unavailableDates: props.unavailableDates, value: field.value, variant: props.variant })); | ||
return (react_1.default.createElement(date_picker_input_1.DatePickerInput, { allowedDateFormats: props.allowedDateFormats, autoFocus: props.autoFocus, bottomContent: props.bottomContent, className: props.className, datesConfig: props.datesConfig, displayDateFormat: props.displayDateFormat, form: props.form, helperText: (_f = (_e = fieldState.error) === null || _e === void 0 ? void 0 : _e.message) !== null && _f !== void 0 ? _f : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isClearable: props.isClearable, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, maxDate: props.maxDate, minDate: props.minDate, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, placeholder: props.placeholder, popoverPlacement: props.popoverPlacement, popoverStrategy: props.popoverStrategy, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, triggerElement: props.triggerElement, unavailableDates: props.unavailableDates, value: field.value, variant: props.variant })); | ||
} | ||
exports.DatePickerInput = DatePickerInput; | ||
DatePickerInput.displayName = "UxfFormDatePickerInput"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -22,3 +22,3 @@ const date_picker_input_1 = require("@uxf/ui/date-picker-input"); | ||
react_1.default.createElement(date_picker_input_2.DatePickerInput, { control: control, isClearable: true, isRequired: true, label: "Default date picker with default value", name: "withDefaultValue" }), | ||
react_1.default.createElement(date_picker_input_2.DatePickerInput, { control: control, isClearable: true, isRequired: true, minDate: (0, dayjs_1.default)().format(date_picker_input_1.OUTPUT_DATE_FORMAT), maxDate: (0, dayjs_1.default)().add(6, "days").format(date_picker_input_1.OUTPUT_DATE_FORMAT), label: "Date picker with input min/max validation - only next 7 days", name: "withMinMaxValidation" }), | ||
react_1.default.createElement(date_picker_input_2.DatePickerInput, { control: control, isClearable: true, isRequired: true, label: "Date picker with input min/max validation - only next 7 days", maxDate: (0, dayjs_1.default)().add(6, "days").format(date_picker_input_1.OUTPUT_DATE_FORMAT), minDate: (0, dayjs_1.default)().format(date_picker_input_1.OUTPUT_DATE_FORMAT), name: "withMinMaxValidation" }), | ||
react_1.default.createElement(date_picker_input_2.DatePickerInput, { allowedDateFormats: ["MM/DD/YYYY", "M/D/YYYY"], control: control, displayDateFormat: "MM/DD/YYYY", id: "date-custom-format", isClearable: true, label: "Datum s vlastn\u00EDm form\u00E1tem (US)", name: "date" }), | ||
@@ -34,2 +34,1 @@ react_1.default.createElement(date_picker_input_2.DatePickerInput, { bottomContent: react_1.default.createElement("div", null, | ||
} | ||
exports.Default = Default; |
@@ -29,3 +29,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.DateRangePickerInput = void 0; | ||
exports.DateRangePickerInput = DateRangePickerInput; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const date_range_picker_input_1 = require("@uxf/ui/date-range-picker-input"); | ||
@@ -40,3 +41,3 @@ const date_range_picker_input_2 = require("@uxf/ui/date-range-picker-input/date-range-picker-input"); | ||
function DateRangePickerInput(props) { | ||
var _a, _b, _c, _d, _e, _f; | ||
var _a, _b, _c, _d; | ||
const { field, fieldState } = (0, react_hook_form_1.useController)({ | ||
@@ -47,3 +48,3 @@ control: props.control, | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_a = props.rules) !== null && _a !== void 0 ? _a : {}), | ||
...props.rules, | ||
validate: { | ||
@@ -64,5 +65,5 @@ validDate: (value) => { | ||
}, | ||
...(typeof ((_b = props.rules) === null || _b === void 0 ? void 0 : _b.validate) === "function" | ||
...(typeof ((_a = props.rules) === null || _a === void 0 ? void 0 : _a.validate) === "function" | ||
? { custom: props.rules.validate } | ||
: (_d = (_c = props.rules) === null || _c === void 0 ? void 0 : _c.validate) !== null && _d !== void 0 ? _d : {}), | ||
: (_b = props.rules) === null || _b === void 0 ? void 0 : _b.validate), | ||
}, | ||
@@ -104,5 +105,4 @@ }, | ||
: null; | ||
return (react_1.default.createElement(date_range_picker_input_1.DateRangePickerInput, { autoFocus: props.autoFocus, bottomContent: props.bottomContent, className: props.className, datesConfig: props.datesConfig, form: props.form, helperText: (_f = (_e = fieldState.error) === null || _e === void 0 ? void 0 : _e.message) !== null && _f !== void 0 ? _f : props.helperText, hiddenLabel: props.hiddenLabel, id: props.id, isClearable: props.isClearable, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, name: field.name, numberOfMonths: props.numberOfMonths, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, placeholder: props.placeholder, popoverPlacement: props.popoverPlacement, popoverStrategy: props.popoverStrategy, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, triggerElement: props.triggerElement, unavailableDates: props.unavailableDates, value: value, variant: props.variant })); | ||
return (react_1.default.createElement(date_range_picker_input_1.DateRangePickerInput, { autoFocus: props.autoFocus, bottomContent: props.bottomContent, className: props.className, datesConfig: props.datesConfig, form: props.form, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, id: props.id, isClearable: props.isClearable, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, name: field.name, numberOfMonths: props.numberOfMonths, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, placeholder: props.placeholder, popoverPlacement: props.popoverPlacement, popoverStrategy: props.popoverStrategy, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, triggerElement: props.triggerElement, unavailableDates: props.unavailableDates, value: value, variant: props.variant })); | ||
} | ||
exports.DateRangePickerInput = DateRangePickerInput; | ||
DateRangePickerInput.displayName = "UxfFormDateRangePickerInput"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -18,7 +18,7 @@ const react_1 = __importDefault(require("react")); | ||
const storyFormDatePickers = (control) => (react_1.default.createElement("div", { className: "space-y-4" }, | ||
react_1.default.createElement(date_range_picker_input_1.DateRangePickerInput, { label: "Default date range picker", name: "default", control: control, isClearable: true, isRequired: true }), | ||
react_1.default.createElement(date_range_picker_input_1.DateRangePickerInput, { label: "Date range picker with two months", name: "twomonths", numberOfMonths: 2, control: control, isClearable: true, isRequired: true }), | ||
react_1.default.createElement(date_range_picker_input_1.DateRangePickerInput, { control: control, isClearable: true, isRequired: true, label: "Default date range picker", name: "default" }), | ||
react_1.default.createElement(date_range_picker_input_1.DateRangePickerInput, { control: control, isClearable: true, isRequired: true, label: "Date range picker with two months", name: "twomonths", numberOfMonths: 2 }), | ||
react_1.default.createElement(date_range_picker_input_1.DateRangePickerInput, { bottomContent: react_1.default.createElement("div", null, | ||
"Bottom content", | ||
react_1.default.createElement("p", null, "Here can goes anything")), label: "With bottom content", name: "default", control: control, isClearable: true, isRequired: true }), | ||
react_1.default.createElement("p", null, "Here can goes anything")), control: control, isClearable: true, isRequired: true, label: "With bottom content", name: "default" }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))); | ||
@@ -28,2 +28,1 @@ return (react_1.default.createElement(storybook_form_1.StorybookForm, null, ({ control }) => (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
} | ||
exports.Default = Default; |
@@ -29,3 +29,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.DatetimePickerInput = void 0; | ||
exports.DatetimePickerInput = DatetimePickerInput; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const date_picker_input_1 = require("@uxf/ui/date-picker-input"); | ||
@@ -41,3 +42,3 @@ const datetime_picker_1 = require("@uxf/ui/datetime-picker"); | ||
function DatetimePickerInput(props) { | ||
var _a, _b, _c, _d, _e, _f, _g; | ||
var _a, _b, _c, _d, _e; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -50,3 +51,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
validate: { | ||
@@ -72,5 +73,5 @@ validDate: (value) => { | ||
}, | ||
...(typeof ((_c = props.rules) === null || _c === void 0 ? void 0 : _c.validate) === "function" | ||
...(typeof ((_b = props.rules) === null || _b === void 0 ? void 0 : _b.validate) === "function" | ||
? { custom: props.rules.validate } | ||
: (_e = (_d = props.rules) === null || _d === void 0 ? void 0 : _d.validate) !== null && _e !== void 0 ? _e : {}), | ||
: (_c = props.rules) === null || _c === void 0 ? void 0 : _c.validate), | ||
}, | ||
@@ -90,5 +91,4 @@ }, | ||
}; | ||
return (react_1.default.createElement(datetime_picker_input_1.DatetimePickerInput, { autoFocus: props.autoFocus, bottomContent: props.bottomContent, className: props.className, form: props.form, helperText: (_g = (_f = fieldState.error) === null || _f === void 0 ? void 0 : _f.message) !== null && _g !== void 0 ? _g : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isClearable: props.isClearable, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, maxDate: props.maxDate, minDate: props.minDate, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, placeholder: props.placeholder, popoverPlacement: props.popoverPlacement, popoverStrategy: props.popoverStrategy, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, triggerElement: props.triggerElement, unavailableDates: props.unavailableDates, value: field.value, variant: props.variant, CustomDatetimePicker: props.CustomDatetimePicker })); | ||
return (react_1.default.createElement(datetime_picker_input_1.DatetimePickerInput, { CustomDatetimePicker: props.CustomDatetimePicker, autoFocus: props.autoFocus, bottomContent: props.bottomContent, className: props.className, form: props.form, helperText: (_e = (_d = fieldState.error) === null || _d === void 0 ? void 0 : _d.message) !== null && _e !== void 0 ? _e : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isClearable: props.isClearable, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, maxDate: props.maxDate, minDate: props.minDate, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, placeholder: props.placeholder, popoverPlacement: props.popoverPlacement, popoverStrategy: props.popoverStrategy, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, triggerElement: props.triggerElement, unavailableDates: props.unavailableDates, value: field.value, variant: props.variant })); | ||
} | ||
exports.DatetimePickerInput = DatetimePickerInput; | ||
DatetimePickerInput.displayName = "UxfFormDatePickerInput"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -15,10 +15,10 @@ const date_picker_input_1 = require("@uxf/ui/date-picker-input"); | ||
function Default() { | ||
return (react_1.default.createElement(storybook_form_1.StorybookForm, { defaultValues: { withDefaultValue: (0, dayjs_1.default)("2023-10-20T14:32:10.511").toISOString() }, className: "space-y-4 p-4" }, ({ control }) => (react_1.default.createElement(react_1.default.Fragment, null, | ||
return (react_1.default.createElement(storybook_form_1.StorybookForm, { className: "space-y-4 p-4", defaultValues: { withDefaultValue: (0, dayjs_1.default)("2023-10-20T14:32:10.511").toISOString() } }, ({ control }) => (react_1.default.createElement(react_1.default.Fragment, null, | ||
react_1.default.createElement(datetime_picker_input_1.DatetimePickerInput, { control: control, isClearable: true, isRequired: true, label: "Default datetime picker", name: "default" }), | ||
react_1.default.createElement(datetime_picker_input_1.DatetimePickerInput, { control: control, isClearable: true, isRequired: true, label: "Default datetime picker with default value", name: "withDefaultValue" }), | ||
react_1.default.createElement(datetime_picker_input_1.DatetimePickerInput, { control: control, isClearable: true, isRequired: true, minDate: (0, dayjs_1.default)().format(date_picker_input_1.OUTPUT_DATE_FORMAT), maxDate: (0, dayjs_1.default)().add(6, "days").format(date_picker_input_1.OUTPUT_DATE_FORMAT), label: "Date time picker with input min/max validation - only next 7 days", name: "withMinMaxValidation" }), | ||
react_1.default.createElement(datetime_picker_input_1.DatetimePickerInput, { control: control, isClearable: true, isRequired: true, label: "Date time picker with input min/max validation - only next 7 days", maxDate: (0, dayjs_1.default)().add(6, "days").format(date_picker_input_1.OUTPUT_DATE_FORMAT), minDate: (0, dayjs_1.default)().format(date_picker_input_1.OUTPUT_DATE_FORMAT), name: "withMinMaxValidation" }), | ||
react_1.default.createElement(datetime_picker_input_1.DatetimePickerInput, { bottomContent: react_1.default.createElement("div", null, | ||
"Bottom content", | ||
react_1.default.createElement("p", null, "Here can goes anything")), control: control, isClearable: true, isRequired: true, label: "With bottom content", name: "default" }), | ||
react_1.default.createElement(datetime_picker_input_1.DatetimePickerInput, { control: control, name: "withCustomDatetimePicker", label: "With custom datetime picker", CustomDatetimePicker: (props) => (react_1.default.createElement(button_1.Button, { onClick: () => { | ||
react_1.default.createElement(datetime_picker_input_1.DatetimePickerInput, { CustomDatetimePicker: (props) => (react_1.default.createElement(button_1.Button, { onClick: () => { | ||
props.onChange((0, dayjs_1.default)() | ||
@@ -29,4 +29,3 @@ .add(1, "day") | ||
props.onClose(); | ||
} }, "Z\u00EDtra")), isClearable: true }))))); | ||
} }, "Z\u00EDtra")), control: control, isClearable: true, label: "With custom datetime picker", name: "withCustomDatetimePicker" }))))); | ||
} | ||
exports.Default = Default; |
@@ -6,3 +6,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.DropzoneInput = void 0; | ||
exports.DropzoneInput = DropzoneInput; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const dropzone_1 = require("@uxf/ui/dropzone"); | ||
@@ -13,3 +14,3 @@ const react_1 = __importDefault(require("react")); | ||
function DropzoneInput(props) { | ||
var _a, _b, _c, _d; | ||
var _a, _b, _c; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -22,3 +23,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
rules: { | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
validate: { | ||
@@ -44,3 +45,3 @@ default: (value) => { | ||
}, | ||
...(((_c = props.rules) === null || _c === void 0 ? void 0 : _c.validate) | ||
...(((_b = props.rules) === null || _b === void 0 ? void 0 : _b.validate) | ||
? typeof props.rules.validate === "function" | ||
@@ -59,5 +60,4 @@ ? { custom: props.rules.validate } | ||
}; | ||
return (react_1.default.createElement(dropzone_1.Dropzone, { accept: props.accept, className: props.className, helperText: ((_d = fieldState.error) === null || _d === void 0 ? void 0 : _d.message) || props.helperText, icon: props.icon, id: id, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, maxFileSize: props.maxFileSize, maxFilesCount: props.maxFilesCount, minFileSize: props.minFileSize, name: props.name, noClick: props.noClick, noDrag: props.noDrag, onChange: onChange, onUploadError: props.onUploadError, onUploadFile: props.onUploadFile, ref: field.ref, style: props.style, value: field.value })); | ||
return (react_1.default.createElement(dropzone_1.Dropzone, { accept: props.accept, className: props.className, helperText: ((_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) || props.helperText, icon: props.icon, id: id, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, maxFileSize: props.maxFileSize, maxFilesCount: props.maxFilesCount, minFileSize: props.minFileSize, name: props.name, noClick: props.noClick, noDrag: props.noDrag, onChange: onChange, onUploadError: props.onUploadError, onUploadFile: props.onUploadFile, ref: field.ref, style: props.style, value: field.value })); | ||
} | ||
exports.DropzoneInput = DropzoneInput; | ||
DropzoneInput.displayName = "UxfFormDropzoneInput"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.DropzoneList = void 0; | ||
exports.DropzoneList = DropzoneList; | ||
const dropzone_1 = require("@uxf/ui/dropzone"); | ||
@@ -21,5 +21,4 @@ const react_1 = __importDefault(require("react")); | ||
}; | ||
return (react_1.default.createElement(dropzone_1.Dropzone.List, { className: props.className, errorText: props.errorText, isDownloadableOnClick: props.isDownloadableOnClick, onChange: onChange, onRemoveConfirm: props.onRemoveConfirm, renderItem: props.renderItem, style: props.style, value: field.value, name: props.name })); | ||
return (react_1.default.createElement(dropzone_1.Dropzone.List, { className: props.className, errorText: props.errorText, isDownloadableOnClick: props.isDownloadableOnClick, name: props.name, onChange: onChange, onRemoveConfirm: props.onRemoveConfirm, renderItem: props.renderItem, style: props.style, value: field.value })); | ||
} | ||
exports.DropzoneList = DropzoneList; | ||
DropzoneList.displayName = "UxfFormDropzoneList"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -61,13 +61,11 @@ const message_1 = require("@uxf/ui/message"); | ||
const { status } = (0, get_dropzone_state_1.getDropzoneState)(watch("dropzone")); | ||
return (react_1.default.createElement(react_1.default.Fragment, null, | ||
react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
react_1.default.createElement("div", { className: "space-y-2 p-20 lg:w-1/2" }, | ||
react_1.default.createElement("div", { className: "space-y-8" }, | ||
react_1.default.createElement(index_1.Dropzone, { accept: { | ||
"image/png": [".png"], | ||
}, control: control, helperText: "Allow multiple files, 1MB max file size, only .png", isDisabled: status === "UPLOADING", isRequired: true, label: "Use drag and drop or click to upload", name: "dropzone", onUploadError: onUploadError, onUploadFile: upload_file_mock_1.uploadFile, maxFileSize: 1024 * 1024 }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"), | ||
react_1.default.createElement(index_1.Dropzone.List, { control: control, errorText: "Oops, n\u011Bco se pokazilo", name: "dropzone", onRemoveConfirm: onRemoveConfirm })))))); | ||
return (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
react_1.default.createElement("div", { className: "space-y-2 p-20 lg:w-1/2" }, | ||
react_1.default.createElement("div", { className: "space-y-8" }, | ||
react_1.default.createElement(index_1.Dropzone, { accept: { | ||
"image/png": [".png"], | ||
}, control: control, helperText: "Allow multiple files, 1MB max file size, only .png", isDisabled: status === "UPLOADING", isRequired: true, label: "Use drag and drop or click to upload", maxFileSize: 1024 * 1024, name: "dropzone", onUploadError: onUploadError, onUploadFile: upload_file_mock_1.uploadFile }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"), | ||
react_1.default.createElement(index_1.Dropzone.List, { control: control, errorText: "Oops, n\u011Bco se pokazilo", name: "dropzone", onRemoveConfirm: onRemoveConfirm }))))); | ||
})); | ||
} | ||
exports.Default = Default; |
@@ -6,3 +6,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.FileInput = void 0; | ||
exports.FileInput = FileInput; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const file_input_1 = require("@uxf/ui/file-input"); | ||
@@ -13,3 +14,3 @@ const react_1 = __importDefault(require("react")); | ||
function FileInput(props) { | ||
var _a, _b, _c, _d; | ||
var _a, _b, _c; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -22,3 +23,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -37,5 +38,4 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(file_input_1.FileInput, { accept: props.accept, className: props.className, form: props.form, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, id: id, isClearable: props.isClearable, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, hiddenLabel: props.hiddenLabel, name: field.name, maxFileSize: props.maxFileSize, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, onUploadError: props.onUploadError, onUploadFile: props.onUploadFile, placeholder: props.placeholder, ref: field.ref, size: props.size, value: field.value, variant: props.variant, uploadButtonLabel: props.uploadButtonLabel })); | ||
return (react_1.default.createElement(file_input_1.FileInput, { accept: props.accept, className: props.className, form: props.form, helperText: (_c = (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message) !== null && _c !== void 0 ? _c : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isClearable: props.isClearable, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, maxFileSize: props.maxFileSize, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, onUploadError: props.onUploadError, onUploadFile: props.onUploadFile, placeholder: props.placeholder, ref: field.ref, size: props.size, uploadButtonLabel: props.uploadButtonLabel, value: field.value, variant: props.variant })); | ||
} | ||
exports.FileInput = FileInput; | ||
FileInput.displayName = "FileInput"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -26,5 +26,5 @@ const upload_file_mock_1 = require("@uxf/ui/utils/mocks/upload-file.mock"); | ||
const storyFormFileInputs = (control, mode) => (react_1.default.createElement("div", { className: "space-y-4" }, | ||
react_1.default.createElement(file_input_1.FileInput, { control: control, label: "Default file input", name: `default-${mode}`, onUploadFile: upload_file_mock_1.uploadFile, isClearable: true, placeholder: "Nahraj soubor" }), | ||
react_1.default.createElement(file_input_1.FileInput, { control: control, isClearable: true, label: "Default file input", name: `default-${mode}`, onUploadFile: upload_file_mock_1.uploadFile, placeholder: "Nahraj soubor" }), | ||
react_1.default.createElement(file_input_1.FileInput, { control: control, id: `required-${mode}`, isRequired: true, label: "Required file input", name: `required-${mode}`, onUploadFile: upload_file_mock_1.uploadFile }), | ||
react_1.default.createElement(file_input_1.FileInput, { control: control, label: "Custom button label", name: `default-${mode}`, onUploadFile: upload_file_mock_1.uploadFile, isClearable: true, placeholder: "Nahrajte soubor", uploadButtonLabel: "Nahrajte dokument" }), | ||
react_1.default.createElement(file_input_1.FileInput, { control: control, isClearable: true, label: "Custom button label", name: `default-${mode}`, onUploadFile: upload_file_mock_1.uploadFile, placeholder: "Nahrajte soubor", uploadButtonLabel: "Nahrajte dokument" }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))); | ||
@@ -34,2 +34,1 @@ return (react_1.default.createElement(storybook_form_1.StorybookForm, { defaultValues: { "default-light": DUMMY_FILE } }, ({ control }) => (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
} | ||
exports.Default = Default; |
@@ -1,3 +0,2 @@ | ||
/// <reference types="react" /> | ||
export declare const FormIdContextProvider: import("react").Provider<string | null>; | ||
export declare const useFormIdContext: () => string | null; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Form = void 0; | ||
exports.Form = Form; | ||
const sr_only_1 = require("@uxf/styles/mixins/sr-only"); | ||
@@ -20,3 +20,2 @@ const react_1 = __importDefault(require("react")); | ||
} | ||
exports.Form = Form; | ||
Form.displayName = "UxfForm"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -22,7 +22,5 @@ const react_1 = __importDefault(require("react")); | ||
react_1.default.createElement(form_1.Form, { formApi: formApi, id: "form", onSubmit: console.log }, | ||
react_1.default.createElement(react_1.default.Fragment, null, | ||
react_1.default.createElement("div", { className: "mb-4 space-y-4 p-4" }, | ||
react_1.default.createElement(text_input_1.TextInput, { label: "Default input", name: "default", control: formApi.control, isRequired: true }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))))); | ||
react_1.default.createElement("div", { className: "mb-4 space-y-4 p-4" }, | ||
react_1.default.createElement(text_input_1.TextInput, { control: formApi.control, isRequired: true, label: "Default input", name: "default" }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit")))); | ||
} | ||
exports.Default = Default; |
@@ -29,3 +29,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.GpsInput = void 0; | ||
exports.GpsInput = GpsInput; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const text_input_1 = require("@uxf/ui/text-input"); | ||
@@ -90,3 +91,3 @@ const tooltip_1 = require("@uxf/ui/tooltip"); | ||
function GpsInput(props) { | ||
var _a, _b, _c, _d; | ||
var _a, _b; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -100,9 +101,9 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
rules: { | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
validate: { | ||
...((_d = (_c = props.rules) === null || _c === void 0 ? void 0 : _c.validate) !== null && _d !== void 0 ? _d : {}), | ||
...(_b = props.rules) === null || _b === void 0 ? void 0 : _b.validate, | ||
req: (value) => { | ||
var _a; | ||
return props.isRequired && value === undefined | ||
? (_a = props.requiredMessage) !== null && _a !== void 0 ? _a : "Toto pole je povinné" | ||
? ((_a = props.requiredMessage) !== null && _a !== void 0 ? _a : "Toto pole je povinné") | ||
: undefined; | ||
@@ -135,2 +136,3 @@ }, | ||
(_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, value, event); | ||
// eslint-disable-next-line @typescript-eslint/no-unused-vars | ||
} | ||
@@ -153,5 +155,4 @@ catch (e) { | ||
SUPPORTED_FORMATS_TOOLTIP)); | ||
return (react_1.default.createElement(text_input_1.TextInput, { autoComplete: props.autoComplete, autoFocus: props.autoFocus, className: props.className, enterKeyHint: props.enterKeyHint, form: props.form, helperText: composedHelperText, hiddenLabel: props.hiddenLabel, id: id, inputMode: props.inputMode, isDisabled: props.isDisabled, isInvalid: (!!fieldState.error && !field.value) || coordsFormatError, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, maxLength: props.maxLength, minLength: props.minLength, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, onKeyDown: props.onKeyDown, placeholder: props.placeholder, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, type: "text", value: visualValue, variant: props.variant })); | ||
return (react_1.default.createElement(text_input_1.TextInput, { autoComplete: props.autoComplete, autoFocus: props.autoFocus, className: props.className, enterKeyHint: props.enterKeyHint, form: props.form, helperText: composedHelperText, hiddenLabel: props.hiddenLabel, id: id, inputMode: props.inputMode, isDisabled: props.isDisabled, isInvalid: ((0, is_not_nil_1.isNotNil)(fieldState.error) && !field.value) || coordsFormatError, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, maxLength: props.maxLength, minLength: props.minLength, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, onKeyDown: props.onKeyDown, placeholder: props.placeholder, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, type: "text", value: visualValue, variant: props.variant })); | ||
} | ||
exports.GpsInput = GpsInput; | ||
GpsInput.displayName = "UxfFormGpsInput"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -18,4 +18,4 @@ const react_1 = __importDefault(require("react")); | ||
const storyFormGpsInputs = (control) => (react_1.default.createElement("div", { className: "space-y-4" }, | ||
react_1.default.createElement(gps_input_1.GpsInput, { placeholder: "Zadejte sou\u0159adnice...", label: "GPS", name: "gps", control: control }), | ||
react_1.default.createElement(gps_input_1.GpsInput, { placeholder: "Zadejte sou\u0159adnice...", label: "GPS", name: "gps-required", control: control, isRequired: true }), | ||
react_1.default.createElement(gps_input_1.GpsInput, { control: control, label: "GPS", name: "gps", placeholder: "Zadejte sou\u0159adnice..." }), | ||
react_1.default.createElement(gps_input_1.GpsInput, { control: control, isRequired: true, label: "GPS", name: "gps-required", placeholder: "Zadejte sou\u0159adnice..." }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))); | ||
@@ -25,2 +25,1 @@ return (react_1.default.createElement(storybook_form_1.StorybookForm, null, ({ control }) => (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
} | ||
exports.Default = Default; |
@@ -6,5 +6,7 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.MultiCombobox = void 0; | ||
exports.MultiCombobox = MultiCombobox; | ||
const empty_array_1 = require("@uxf/core/constants/empty-array"); | ||
const is_empty_1 = require("@uxf/core/utils/is-empty"); | ||
const is_nil_1 = require("@uxf/core/utils/is-nil"); | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const multi_combobox_1 = require("@uxf/ui/multi-combobox"); | ||
@@ -15,3 +17,3 @@ const react_1 = __importDefault(require("react")); | ||
function MultiCombobox(props) { | ||
var _a, _b, _c, _d, _e; | ||
var _a, _b, _c, _d; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -24,3 +26,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -39,5 +41,5 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(multi_combobox_1.MultiCombobox, { allOptionsSelectedMessage: props.allOptionsSelectedMessage, className: props.className, dropdownClassName: props.dropdownClassName, dropdownMatchesInputWidth: props.dropdownMatchesInputWidth, dropdownMaxHeight: props.dropdownMaxHeight, dropdownPlacement: props.dropdownPlacement, dropdownStrategy: props.dropdownStrategy, form: props.form, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, iconName: props.iconName, id: id, inputArrow: props.inputArrow, isDisabled: ((0, is_nil_1.isNil)(props.loadOptions) && (0, is_empty_1.isEmpty)((_e = props.options) !== null && _e !== void 0 ? _e : [])) || props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, loadOptions: props.loadOptions, name: field.name, noOptionsMessage: props.noOptionsMessage, noQueryMessage: props.noQueryMessage, notFoundMessage: props.notFoundMessage, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, options: props.options, placeholder: props.placeholder, ref: field.ref, renderOption: props.renderOption, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, value: field.value, variant: props.variant, withCheckboxes: props.withCheckboxes })); | ||
const isDisabled = ((0, is_nil_1.isNil)(props.loadOptions) && (0, is_empty_1.isEmpty)((_b = props.options) !== null && _b !== void 0 ? _b : empty_array_1.EMPTY_ARRAY)) || props.isDisabled; | ||
return (react_1.default.createElement(multi_combobox_1.MultiCombobox, { allOptionsSelectedMessage: props.allOptionsSelectedMessage, className: props.className, dropdownClassName: props.dropdownClassName, dropdownMatchesInputWidth: props.dropdownMatchesInputWidth, dropdownMaxHeight: props.dropdownMaxHeight, dropdownPlacement: props.dropdownPlacement, dropdownStrategy: props.dropdownStrategy, form: props.form, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, iconName: props.iconName, id: id, inputArrow: props.inputArrow, isDisabled: isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, loadOptions: props.loadOptions, name: field.name, noOptionsMessage: props.noOptionsMessage, noQueryMessage: props.noQueryMessage, notFoundMessage: props.notFoundMessage, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, options: props.options, placeholder: props.placeholder, ref: field.ref, renderOption: props.renderOption, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, value: field.value, variant: props.variant, withCheckboxes: props.withCheckboxes })); | ||
} | ||
exports.MultiCombobox = MultiCombobox; | ||
MultiCombobox.displayName = "UxfFormMultiCombobox"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -37,4 +37,4 @@ const react_1 = __importDefault(require("react")); | ||
react_1.default.createElement(multi_combobox_1.MultiCombobox, { control: control, dropdownPlacement: "top", id: "form-combobox", label: "Combobox form with dropdown top", name: "select-dropdown-top", options: options, placeholder: "Vyberte..." }), | ||
react_1.default.createElement(multi_combobox_1.MultiCombobox, { control: control, dropdownPlacement: "top", id: "form-combobox", label: "Combobox async", name: "select-dropdown-async", loadOptions: (query) => Promise.resolve(options.filter((option) => !query || option.label.toLowerCase().includes(query.toLowerCase()))), placeholder: "Vyberte..." }), | ||
react_1.default.createElement(multi_combobox_1.MultiCombobox, { control: control, dropdownPlacement: "top", id: "form-combobox", label: "Combobox async with default values", name: "select-dropdown-async-default", loadOptions: (query) => Promise.resolve(options.filter((option) => !query || option.label.toLowerCase().includes(query.toLowerCase()))), placeholder: "Vyberte..." }), | ||
react_1.default.createElement(multi_combobox_1.MultiCombobox, { control: control, dropdownPlacement: "top", id: "form-combobox", label: "Combobox async", loadOptions: (query) => Promise.resolve(options.filter((option) => !query || option.label.toLowerCase().includes(query.toLowerCase()))), name: "select-dropdown-async", placeholder: "Vyberte..." }), | ||
react_1.default.createElement(multi_combobox_1.MultiCombobox, { control: control, dropdownPlacement: "top", id: "form-combobox", label: "Combobox async with default values", loadOptions: (query) => Promise.resolve(options.filter((option) => !query || option.label.toLowerCase().includes(query.toLowerCase()))), name: "select-dropdown-async-default", placeholder: "Vyberte..." }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))); | ||
@@ -57,2 +57,1 @@ return (react_1.default.createElement(storybook_form_1.StorybookForm, { defaultValues: { | ||
} | ||
exports.Default = Default; |
@@ -6,4 +6,5 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.MultiSelect = void 0; | ||
exports.MultiSelect = MultiSelect; | ||
const is_empty_1 = require("@uxf/core/utils/is-empty"); | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const multi_select_1 = require("@uxf/ui/multi-select"); | ||
@@ -14,3 +15,3 @@ const react_1 = __importDefault(require("react")); | ||
function MultiSelect(props) { | ||
var _a, _b, _c, _d; | ||
var _a, _b, _c; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -23,3 +24,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -38,5 +39,4 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(multi_select_1.MultiSelect, { allOptionsSelectedMessage: props.allOptionsSelectedMessage, className: props.className, dropdownClassName: props.dropdownClassName, dropdownMatchesInputWidth: props.dropdownMatchesInputWidth, dropdownMaxHeight: props.dropdownMaxHeight, dropdownPlacement: props.dropdownPlacement, dropdownStrategy: props.dropdownStrategy, form: props.form, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, iconName: props.iconName, id: id, inputArrow: props.inputArrow, isDisabled: (0, is_empty_1.isEmpty)(props.options) || props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, name: field.name, noOptionsMessage: props.noOptionsMessage, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, options: props.options, placeholder: props.placeholder, ref: field.ref, renderOption: props.renderOption, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, value: field.value, variant: props.variant, withCheckboxes: props.withCheckboxes })); | ||
return (react_1.default.createElement(multi_select_1.MultiSelect, { allOptionsSelectedMessage: props.allOptionsSelectedMessage, className: props.className, dropdownClassName: props.dropdownClassName, dropdownMatchesInputWidth: props.dropdownMatchesInputWidth, dropdownMaxHeight: props.dropdownMaxHeight, dropdownPlacement: props.dropdownPlacement, dropdownStrategy: props.dropdownStrategy, form: props.form, helperText: (_c = (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message) !== null && _c !== void 0 ? _c : props.helperText, hiddenLabel: props.hiddenLabel, iconName: props.iconName, id: id, inputArrow: props.inputArrow, isDisabled: (0, is_empty_1.isEmpty)(props.options) || props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, name: field.name, noOptionsMessage: props.noOptionsMessage, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, options: props.options, placeholder: props.placeholder, ref: field.ref, renderOption: props.renderOption, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, value: field.value, variant: props.variant, withCheckboxes: props.withCheckboxes })); | ||
} | ||
exports.MultiSelect = MultiSelect; | ||
MultiSelect.displayName = "UxfFormMultiSelect"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -32,3 +32,3 @@ const react_1 = __importDefault(require("react")); | ||
const storyFormMultiSelect = (control) => (react_1.default.createElement("div", { className: "space-y-8" }, | ||
react_1.default.createElement(multi_select_1.MultiSelect, { control: control, dropdownMaxHeight: 350, helperText: "Vyberte pros\u00EDm jednu nebo v\u00EDce mo\u017Enost\u00ED", id: "form-multi-select", label: "MultiSelect with disabled option", name: "multi-select-with-disabled", isRequired: true, options: options, placeholder: "Vyberte..." }), | ||
react_1.default.createElement(multi_select_1.MultiSelect, { control: control, dropdownMaxHeight: 350, helperText: "Vyberte pros\u00EDm jednu nebo v\u00EDce mo\u017Enost\u00ED", id: "form-multi-select", isRequired: true, label: "MultiSelect with disabled option", name: "multi-select-with-disabled", options: options, placeholder: "Vyberte..." }), | ||
react_1.default.createElement(multi_select_1.MultiSelect, { control: control, id: "form-multi-select", label: "MultiSelect", name: "multi-select", options: options, placeholder: "Vyberte..." }), | ||
@@ -50,2 +50,1 @@ react_1.default.createElement(multi_select_1.MultiSelect, { control: control, id: "form-multi-select-required", label: "MultiSelect required", name: "multi-select-required", options: options, placeholder: "Vyberte..." }), | ||
} | ||
exports.Default = Default; |
@@ -6,3 +6,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.NumberInput = void 0; | ||
exports.NumberInput = NumberInput; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const text_input_1 = require("@uxf/ui/text-input"); | ||
@@ -13,3 +14,3 @@ const react_1 = __importDefault(require("react")); | ||
function NumberInput(props) { | ||
var _a, _b, _c, _d, _e, _f, _g; | ||
var _a, _b, _c, _d, _e, _f; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -34,3 +35,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_d = props.rules) !== null && _d !== void 0 ? _d : {}), | ||
...props.rules, | ||
}, | ||
@@ -69,5 +70,4 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(text_input_1.TextInput, { autoComplete: props.autoComplete, autoFocus: props.autoFocus, className: props.className, enterKeyHint: props.enterKeyHint, form: props.form, helperText: (_f = (_e = fieldState.error) === null || _e === void 0 ? void 0 : _e.message) !== null && _f !== void 0 ? _f : props.helperText, hiddenLabel: props.hiddenLabel, id: id, inputMode: props.decimalPlaces ? "decimal" : "numeric", isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, max: props.max, min: props.min, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, onKeyDown: onKeyDown, pattern: props.pattern, placeholder: props.placeholder, step: props.decimalPlaces ? Number(0).toFixed(props.decimalPlaces - 1) + "1" : props.step, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, type: "number", value: (_g = field.value) !== null && _g !== void 0 ? _g : "", variant: props.variant })); | ||
return (react_1.default.createElement(text_input_1.TextInput, { autoComplete: props.autoComplete, autoFocus: props.autoFocus, className: props.className, enterKeyHint: props.enterKeyHint, form: props.form, helperText: (_e = (_d = fieldState.error) === null || _d === void 0 ? void 0 : _d.message) !== null && _e !== void 0 ? _e : props.helperText, hiddenLabel: props.hiddenLabel, id: id, inputMode: props.decimalPlaces ? "decimal" : "numeric", isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, max: props.max, min: props.min, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, onKeyDown: onKeyDown, pattern: props.pattern, placeholder: props.placeholder, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, step: props.decimalPlaces ? Number(0).toFixed(props.decimalPlaces - 1) + "1" : props.step, style: props.style, type: "number", value: (_f = field.value) !== null && _f !== void 0 ? _f : "", variant: props.variant })); | ||
} | ||
exports.NumberInput = NumberInput; | ||
NumberInput.displayName = "UxfFormNumberInput"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -18,6 +18,6 @@ const react_1 = __importDefault(require("react")); | ||
const storyFormNumberInputs = (control) => (react_1.default.createElement("div", { className: "light mb-4 space-y-4 p-4" }, | ||
react_1.default.createElement(number_input_1.NumberInput, { label: "Default input", name: "default", control: control }), | ||
react_1.default.createElement(number_input_1.NumberInput, { label: "Required input", name: "required", control: control, isRequired: true }), | ||
react_1.default.createElement(number_input_1.NumberInput, { label: "Dec\u00EDmal input", name: "decimal", decimalPlaces: 3, control: control }), | ||
react_1.default.createElement(number_input_1.NumberInput, { label: "max50 input", name: "max50", max: 50, control: control }), | ||
react_1.default.createElement(number_input_1.NumberInput, { control: control, label: "Default input", name: "default" }), | ||
react_1.default.createElement(number_input_1.NumberInput, { control: control, isRequired: true, label: "Required input", name: "required" }), | ||
react_1.default.createElement(number_input_1.NumberInput, { control: control, decimalPlaces: 3, label: "Dec\u00EDmal input", name: "decimal" }), | ||
react_1.default.createElement(number_input_1.NumberInput, { control: control, label: "max50 input", max: 50, name: "max50" }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))); | ||
@@ -27,2 +27,1 @@ return (react_1.default.createElement(storybook_form_1.StorybookForm, null, ({ control }) => (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
} | ||
exports.Default = Default; |
{ | ||
"name": "@uxf/form", | ||
"version": "11.31.2", | ||
"version": "11.32.0", | ||
"description": "", | ||
@@ -18,6 +18,6 @@ "publishConfig": { | ||
"dependencies": { | ||
"@uxf/ui": "11.31.0", | ||
"@uxf/ui": "11.32.0", | ||
"coordinate-parser": "1.0.7", | ||
"dayjs": "1.11.10", | ||
"react-hook-form": "7.51.0" | ||
"dayjs": "1.11.13", | ||
"react-hook-form": "7.53.0" | ||
}, | ||
@@ -29,7 +29,7 @@ "peerDependencies": { | ||
"devDependencies": { | ||
"@types/react": "18.2.63", | ||
"@types/react-dom": "18.2.19", | ||
"react": "18.2.0", | ||
"react-dom": "18.2.0" | ||
"@types/react": "18.3.5", | ||
"@types/react-dom": "18.3.0", | ||
"react": "18.3.1", | ||
"react-dom": "18.3.1" | ||
} | ||
} |
@@ -26,6 +26,7 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.PasswordInput = void 0; | ||
exports.PasswordInput = PasswordInput; | ||
const use_on_unmount_1 = require("@uxf/core-react/hooks/use-on-unmount"); | ||
const compose_refs_1 = require("@uxf/core-react/utils/compose-refs"); | ||
const is_nil_1 = require("@uxf/core/utils/is-nil"); | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -59,3 +60,3 @@ const icon_1 = require("@uxf/ui/icon"); | ||
function PasswordInput(props) { | ||
var _a, _b, _c, _d, _e, _f, _g; | ||
var _a, _b, _c, _d, _e, _f; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -76,3 +77,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -92,6 +93,5 @@ }); | ||
}; | ||
return (react_1.default.createElement(text_input_1.TextInput, { autoComplete: props.autoComplete, autoFocus: props.autoFocus, className: props.className, enterKeyHint: props.enterKeyHint, form: props.form, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, id: id, inputMode: props.inputMode, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, maxLength: props.maxLength, minLength: props.minLength, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, onKeyDown: props.onKeyDown, pattern: props.pattern, placeholder: props.placeholder, ref: inputRef, rightAddon: props.rightAddon, rightElement: (_f = (_e = props.renderVisibilitySetter) === null || _e === void 0 ? void 0 : _e.call(props, passwordVisibility.isVisible, passwordVisibility.onToggle)) !== null && _f !== void 0 ? _f : (react_1.default.createElement(button_1.Button, { onClick: passwordVisibility.onToggle, size: "sm", variant: "text" }, | ||
react_1.default.createElement(icon_1.Icon, { size: 20, name: passwordVisibility.isVisible ? "eye-slash" : "eye" }))), size: props.size, style: props.style, type: passwordVisibility.isVisible ? "text" : "password", value: (_g = field.value) !== null && _g !== void 0 ? _g : "", variant: props.variant })); | ||
return (react_1.default.createElement(text_input_1.TextInput, { autoComplete: props.autoComplete, autoFocus: props.autoFocus, className: props.className, enterKeyHint: props.enterKeyHint, form: props.form, helperText: (_c = (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message) !== null && _c !== void 0 ? _c : props.helperText, hiddenLabel: props.hiddenLabel, id: id, inputMode: props.inputMode, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, maxLength: props.maxLength, minLength: props.minLength, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, onKeyDown: props.onKeyDown, pattern: props.pattern, placeholder: props.placeholder, ref: inputRef, rightAddon: props.rightAddon, rightElement: (_e = (_d = props.renderVisibilitySetter) === null || _d === void 0 ? void 0 : _d.call(props, passwordVisibility.isVisible, passwordVisibility.onToggle)) !== null && _e !== void 0 ? _e : (react_1.default.createElement(button_1.Button, { onClick: passwordVisibility.onToggle, size: "sm", variant: "text" }, | ||
react_1.default.createElement(icon_1.Icon, { name: passwordVisibility.isVisible ? "eye-slash" : "eye", size: 20 }))), size: props.size, style: props.style, type: passwordVisibility.isVisible ? "text" : "password", value: (_f = field.value) !== null && _f !== void 0 ? _f : "", variant: props.variant })); | ||
} | ||
exports.PasswordInput = PasswordInput; | ||
PasswordInput.displayName = "UxfFormPasswordInput"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -19,4 +19,4 @@ const react_1 = __importDefault(require("react")); | ||
react_1.default.createElement(password_input_1.PasswordInput, { control: control, label: "Default input", name: "default" }), | ||
react_1.default.createElement(password_input_1.PasswordInput, { control: control, label: "Min length 8", minLength: 12, name: "minLength", isRequired: true }), | ||
react_1.default.createElement(password_input_1.PasswordInput, { control: control, label: "Required input", name: "required", isRequired: true }), | ||
react_1.default.createElement(password_input_1.PasswordInput, { control: control, isRequired: true, label: "Min length 8", minLength: 12, name: "minLength" }), | ||
react_1.default.createElement(password_input_1.PasswordInput, { control: control, isRequired: true, label: "Required input", name: "required" }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))); | ||
@@ -26,2 +26,1 @@ return (react_1.default.createElement(storybook_form_1.StorybookForm, null, ({ control }) => (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
} | ||
exports.Default = Default; |
@@ -6,3 +6,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.RadioGroup = void 0; | ||
exports.RadioGroup = RadioGroup; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const radio_group_1 = require("@uxf/ui/radio-group"); | ||
@@ -13,3 +14,3 @@ const react_1 = __importDefault(require("react")); | ||
function RadioGroup(props) { | ||
var _a, _b, _c, _d, _e; | ||
var _a, _b, _c, _d; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -22,3 +23,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -37,5 +38,4 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(radio_group_1.RadioGroup, { className: props.className, forceColumn: props.forceColumn, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isDisabled: props.options.length === 0 || props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, options: props.options, radioSize: props.radioSize, ref: field.ref, style: props.style, value: (_e = field.value) !== null && _e !== void 0 ? _e : null, variant: props.variant })); | ||
return (react_1.default.createElement(radio_group_1.RadioGroup, { className: props.className, forceColumn: props.forceColumn, helperText: (_c = (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message) !== null && _c !== void 0 ? _c : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isDisabled: props.options.length === 0 || props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, options: props.options, radioSize: props.radioSize, ref: field.ref, style: props.style, value: (_d = field.value) !== null && _d !== void 0 ? _d : null, variant: props.variant })); | ||
} | ||
exports.RadioGroup = RadioGroup; | ||
RadioGroup.displayName = "UxfFormRadioGroup"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -40,2 +40,1 @@ const react_1 = __importDefault(require("react")); | ||
} | ||
exports.Default = Default; |
@@ -1,2 +0,1 @@ | ||
/// <reference types="mdx" /> | ||
import avatarFileInputReadme from "./avatar-file-input/README.md"; | ||
@@ -3,0 +2,0 @@ export declare const readmes: { |
@@ -6,4 +6,5 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Select = void 0; | ||
exports.Select = Select; | ||
const is_empty_1 = require("@uxf/core/utils/is-empty"); | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const select_1 = require("@uxf/ui/select"); | ||
@@ -14,3 +15,3 @@ const react_1 = __importDefault(require("react")); | ||
function Select(props) { | ||
var _a, _b, _c, _d; | ||
var _a, _b, _c; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -23,3 +24,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -38,5 +39,4 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(select_1.Select, { className: props.className, dropdownClassName: props.dropdownClassName, dropdownMatchesInputWidth: props.dropdownMatchesInputWidth, dropdownMaxHeight: props.dropdownMaxHeight, dropdownPlacement: props.dropdownPlacement, dropdownStrategy: props.dropdownStrategy, form: props.form, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, iconName: props.iconName, id: id, inputArrow: props.inputArrow, inputRef: field.ref, isClearable: props.isClearable, isDisabled: (0, is_empty_1.isEmpty)(props.options) || props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, keyExtractor: props.keyExtractor, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, name: field.name, noOptionsMessage: props.noOptionsMessage, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, options: props.options, placeholder: props.placeholder, renderOption: props.renderOption, renderSelectedOption: props.renderSelectedOption, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, value: field.value, variant: props.variant })); | ||
return (react_1.default.createElement(select_1.Select, { className: props.className, dropdownClassName: props.dropdownClassName, dropdownMatchesInputWidth: props.dropdownMatchesInputWidth, dropdownMaxHeight: props.dropdownMaxHeight, dropdownPlacement: props.dropdownPlacement, dropdownStrategy: props.dropdownStrategy, form: props.form, helperText: (_c = (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message) !== null && _c !== void 0 ? _c : props.helperText, hiddenLabel: props.hiddenLabel, iconName: props.iconName, id: id, inputArrow: props.inputArrow, inputRef: field.ref, isClearable: props.isClearable, isDisabled: (0, is_empty_1.isEmpty)(props.options) || props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, keyExtractor: props.keyExtractor, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, name: field.name, noOptionsMessage: props.noOptionsMessage, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, options: props.options, placeholder: props.placeholder, renderOption: props.renderOption, renderSelectedOption: props.renderSelectedOption, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, value: field.value, variant: props.variant })); | ||
} | ||
exports.Select = Select; | ||
Select.displayName = "UxfFormSelect"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -35,5 +35,5 @@ const react_1 = __importDefault(require("react")); | ||
const storyFormSelects = (control) => (react_1.default.createElement("div", { className: "space-y-4" }, | ||
react_1.default.createElement(select_1.Select, { dropdownMaxHeight: 350, label: "Select form", name: "select", control: control, placeholder: "placeholder", options: options, id: "form-select", isClearable: true }), | ||
react_1.default.createElement(select_1.Select, { label: "Select form disabled", name: "select-disabled", control: control, placeholder: "placeholder", options: options, id: "form-select", isDisabled: true }), | ||
react_1.default.createElement(select_1.Select, { label: "Select form with helper text", name: "select-helper-text", control: control, placeholder: "placeholder", options: options, id: "form-select", helperText: "Choose one option" }), | ||
react_1.default.createElement(select_1.Select, { control: control, dropdownMaxHeight: 350, id: "form-select", isClearable: true, label: "Select form", name: "select", options: options, placeholder: "placeholder" }), | ||
react_1.default.createElement(select_1.Select, { control: control, id: "form-select", isDisabled: true, label: "Select form disabled", name: "select-disabled", options: options, placeholder: "placeholder" }), | ||
react_1.default.createElement(select_1.Select, { control: control, helperText: "Choose one option", id: "form-select", label: "Select form with helper text", name: "select-helper-text", options: options, placeholder: "placeholder" }), | ||
react_1.default.createElement(select_1.Select, { control: control, helperText: "Choose one option", id: "form-select", isRequired: true, label: "Select form required", name: "select-required", options: options, placeholder: "placeholder" }), | ||
@@ -47,2 +47,1 @@ react_1.default.createElement(select_1.Select, { control: control, dropdownPlacement: "top", id: "form-select", label: "Select form with dropdown top", name: "select-dropdown-top", options: options, placeholder: "placeholder" }), | ||
} | ||
exports.Default = Default; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.FormDataPrinter = void 0; | ||
exports.FormDataPrinter = FormDataPrinter; | ||
const react_1 = __importDefault(require("react")); | ||
@@ -14,2 +14,1 @@ const react_hook_form_1 = require("react-hook-form"); | ||
} | ||
exports.FormDataPrinter = FormDataPrinter; |
@@ -26,3 +26,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.StorybookForm = void 0; | ||
exports.StorybookForm = StorybookForm; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -38,3 +38,3 @@ const react_1 = __importStar(require("react")); | ||
// eslint-disable-next-line no-console | ||
react_1.default.createElement(form_1.Form, { formApi: form, id: formId, onSubmit: console.log, className: props.className }, | ||
react_1.default.createElement(form_1.Form, { className: props.className, formApi: form, id: formId, onSubmit: console.log }, | ||
props.children(form), | ||
@@ -45,2 +45,1 @@ react_1.default.createElement("div", { className: "my-4" }, | ||
} | ||
exports.StorybookForm = StorybookForm; |
@@ -6,3 +6,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.TextInput = void 0; | ||
exports.TextInput = TextInput; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const text_input_1 = require("@uxf/ui/text-input"); | ||
@@ -15,3 +16,3 @@ const react_1 = __importDefault(require("react")); | ||
function TextInput(props) { | ||
var _a, _b, _c, _d, _e, _f, _g; | ||
var _a, _b, _c, _d, _e, _f; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -35,3 +36,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
: undefined, | ||
...((_d = props.rules) !== null && _d !== void 0 ? _d : {}), | ||
...props.rules, | ||
}, | ||
@@ -50,5 +51,4 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(text_input_1.TextInput, { autoComplete: props.autoComplete, autoFocus: props.autoFocus, className: props.className, enterKeyHint: props.enterKeyHint, form: props.form, helperText: (_f = (_e = fieldState.error) === null || _e === void 0 ? void 0 : _e.message) !== null && _f !== void 0 ? _f : props.helperText, hiddenLabel: props.hiddenLabel, id: id, inputMode: props.inputMode, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, maxLength: props.maxLength, minLength: props.minLength, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, onKeyDown: props.onKeyDown, placeholder: props.placeholder, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, type: props.type, value: (_g = field.value) !== null && _g !== void 0 ? _g : "", variant: props.variant })); | ||
return (react_1.default.createElement(text_input_1.TextInput, { autoComplete: props.autoComplete, autoFocus: props.autoFocus, className: props.className, enterKeyHint: props.enterKeyHint, form: props.form, helperText: (_e = (_d = fieldState.error) === null || _d === void 0 ? void 0 : _d.message) !== null && _e !== void 0 ? _e : props.helperText, hiddenLabel: props.hiddenLabel, id: id, inputMode: props.inputMode, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, maxLength: props.maxLength, minLength: props.minLength, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, onKeyDown: props.onKeyDown, placeholder: props.placeholder, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, style: props.style, type: props.type, value: (_f = field.value) !== null && _f !== void 0 ? _f : "", variant: props.variant })); | ||
} | ||
exports.TextInput = TextInput; | ||
TextInput.displayName = "UxfFormTextInput"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -18,7 +18,7 @@ const react_1 = __importDefault(require("react")); | ||
const storyFormTextInputs = (control) => (react_1.default.createElement("div", { className: "space-y-4" }, | ||
react_1.default.createElement(text_input_1.TextInput, { placeholder: "Zadejte...", label: "Default input", name: "default", autoComplete: "off", control: control }), | ||
react_1.default.createElement(text_input_1.TextInput, { placeholder: "Zadejte...", label: "Required input", name: "required", control: control, isRequired: true }), | ||
react_1.default.createElement(text_input_1.TextInput, { placeholder: "Zadejte...", label: "E-mail required input", name: "email", type: "email", control: control, isRequired: true }), | ||
react_1.default.createElement(text_input_1.TextInput, { placeholder: "Zadejte...", label: "Phone required input", name: "phone", type: "tel", control: control, isRequired: true }), | ||
react_1.default.createElement(text_input_1.TextInput, { placeholder: "Zadejte...", label: "Password input", name: "password", type: "password", control: control }), | ||
react_1.default.createElement(text_input_1.TextInput, { autoComplete: "off", control: control, label: "Default input", name: "default", placeholder: "Zadejte..." }), | ||
react_1.default.createElement(text_input_1.TextInput, { control: control, isRequired: true, label: "Required input", name: "required", placeholder: "Zadejte..." }), | ||
react_1.default.createElement(text_input_1.TextInput, { control: control, isRequired: true, label: "E-mail required input", name: "email", placeholder: "Zadejte...", type: "email" }), | ||
react_1.default.createElement(text_input_1.TextInput, { control: control, isRequired: true, label: "Phone required input", name: "phone", placeholder: "Zadejte...", type: "tel" }), | ||
react_1.default.createElement(text_input_1.TextInput, { control: control, label: "Password input", name: "password", placeholder: "Zadejte...", type: "password" }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))); | ||
@@ -28,2 +28,1 @@ return (react_1.default.createElement(storybook_form_1.StorybookForm, null, ({ control }) => (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
} | ||
exports.Default = Default; |
@@ -26,3 +26,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Textarea = void 0; | ||
exports.Textarea = Textarea; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const textarea_1 = require("@uxf/ui/textarea"); | ||
@@ -33,3 +34,3 @@ const react_1 = __importStar(require("react")); | ||
function Textarea(props) { | ||
var _a, _b, _c, _d; | ||
var _a, _b, _c; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -42,3 +43,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -57,5 +58,4 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(textarea_1.Textarea, { autoComplete: props.autoComplete, className: props.className, disableAutoHeight: props.disableAutoHeight, form: props.form, helperText: (_d = (_c = fieldState.error) === null || _c === void 0 ? void 0 : _c.message) !== null && _d !== void 0 ? _d : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, maxLength: props.maxLength, minLength: props.minLength, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, placeholder: props.placeholder, ref: field.ref, rows: props.rows, style: props.style, value: field.value || "" })); | ||
return (react_1.default.createElement(textarea_1.Textarea, { autoComplete: props.autoComplete, className: props.className, disableAutoHeight: props.disableAutoHeight, form: props.form, helperText: (_c = (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message) !== null && _c !== void 0 ? _c : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, maxLength: props.maxLength, minLength: props.minLength, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, placeholder: props.placeholder, ref: field.ref, rows: props.rows, style: props.style, value: field.value || "" })); | ||
} | ||
exports.Textarea = Textarea; | ||
Textarea.displayName = "UxfFormTextarea"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -18,4 +18,4 @@ const react_1 = __importDefault(require("react")); | ||
const storyFormTextAreas = (control) => (react_1.default.createElement("div", { className: "space-y-4" }, | ||
react_1.default.createElement(textarea_1.Textarea, { label: "Textarea", name: "textarea", control: control, placeholder: "placeholder", form: "form-textarea" }), | ||
react_1.default.createElement(textarea_1.Textarea, { label: "Textarea required", name: "textarea-required", control: control, placeholder: "placeholder", form: "form-textarea", isRequired: true }), | ||
react_1.default.createElement(textarea_1.Textarea, { control: control, form: "form-textarea", label: "Textarea", name: "textarea", placeholder: "placeholder" }), | ||
react_1.default.createElement(textarea_1.Textarea, { control: control, form: "form-textarea", isRequired: true, label: "Textarea required", name: "textarea-required", placeholder: "placeholder" }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))); | ||
@@ -25,2 +25,1 @@ return (react_1.default.createElement(storybook_form_1.StorybookForm, null, ({ control }) => (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
} | ||
exports.Default = Default; |
@@ -29,3 +29,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.TimePickerInput = void 0; | ||
exports.TimePickerInput = TimePickerInput; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const time_picker_input_1 = require("@uxf/ui/time-picker-input"); | ||
@@ -39,3 +40,3 @@ const dayjs_1 = __importStar(require("dayjs")); | ||
function TimePickerInput(props) { | ||
var _a, _b, _c, _d, _e, _f, _g; | ||
var _a, _b, _c, _d, _e; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -48,3 +49,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
validate: { | ||
@@ -59,5 +60,5 @@ validTime: (value) => { | ||
}, | ||
...(typeof ((_c = props.rules) === null || _c === void 0 ? void 0 : _c.validate) === "function" | ||
...(typeof ((_b = props.rules) === null || _b === void 0 ? void 0 : _b.validate) === "function" | ||
? { custom: props.rules.validate } | ||
: (_e = (_d = props.rules) === null || _d === void 0 ? void 0 : _d.validate) !== null && _e !== void 0 ? _e : {}), | ||
: (_c = props.rules) === null || _c === void 0 ? void 0 : _c.validate), | ||
}, | ||
@@ -77,5 +78,4 @@ }, | ||
}; | ||
return (react_1.default.createElement(time_picker_input_1.TimePickerInput, { autoFocus: props.autoFocus, className: props.className, form: props.form, helperText: (_g = (_f = fieldState.error) === null || _f === void 0 ? void 0 : _f.message) !== null && _g !== void 0 ? _g : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isClearable: props.isClearable, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, placeholder: props.placeholder, popoverPlacement: props.popoverPlacement, popoverStrategy: props.popoverStrategy, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, triggerElement: props.triggerElement, value: field.value, variant: props.variant, CustomTimePicker: props.CustomTimePicker })); | ||
return (react_1.default.createElement(time_picker_input_1.TimePickerInput, { CustomTimePicker: props.CustomTimePicker, autoFocus: props.autoFocus, className: props.className, form: props.form, helperText: (_e = (_d = fieldState.error) === null || _d === void 0 ? void 0 : _d.message) !== null && _e !== void 0 ? _e : props.helperText, hiddenLabel: props.hiddenLabel, id: id, isClearable: props.isClearable, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, leftAddon: props.leftAddon, leftElement: props.leftElement, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, placeholder: props.placeholder, popoverPlacement: props.popoverPlacement, popoverStrategy: props.popoverStrategy, ref: field.ref, rightAddon: props.rightAddon, rightElement: props.rightElement, size: props.size, triggerElement: props.triggerElement, value: field.value, variant: props.variant })); | ||
} | ||
exports.TimePickerInput = TimePickerInput; | ||
TimePickerInput.displayName = "UxfFormTimePickerInput"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -27,2 +27,1 @@ const dayjs_1 = __importDefault(require("dayjs")); | ||
} | ||
exports.Default = Default; |
@@ -6,3 +6,4 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Toggle = void 0; | ||
exports.Toggle = Toggle; | ||
const is_not_nil_1 = require("@uxf/core/utils/is-not-nil"); | ||
const toggle_1 = require("@uxf/ui/toggle"); | ||
@@ -13,3 +14,3 @@ const react_1 = __importDefault(require("react")); | ||
function Toggle(props) { | ||
var _a, _b, _c; | ||
var _a, _b; | ||
const formId = (0, form_id_context_1.useFormIdContext)(); | ||
@@ -22,3 +23,3 @@ const id = (_a = props.id) !== null && _a !== void 0 ? _a : `${formId}__${props.name}`; | ||
required: props.isRequired ? props.requiredMessage || "Toto pole je povinné" : undefined, | ||
...((_b = props.rules) !== null && _b !== void 0 ? _b : {}), | ||
...props.rules, | ||
}, | ||
@@ -37,5 +38,4 @@ shouldUnregister: props.shouldUnregister, | ||
}; | ||
return (react_1.default.createElement(toggle_1.Toggle, { className: props.className, hiddenLabel: props.hiddenLabel, id: id, isDisabled: props.isDisabled, isInvalid: !!fieldState.error, isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, ref: field.ref, style: props.style, value: (_c = field.value) !== null && _c !== void 0 ? _c : (!props.nullable ? false : undefined), variant: props.variant })); | ||
return (react_1.default.createElement(toggle_1.Toggle, { className: props.className, hiddenLabel: props.hiddenLabel, id: id, isDisabled: props.isDisabled, isInvalid: (0, is_not_nil_1.isNotNil)(fieldState.error), isReadOnly: props.isReadOnly, isRequired: props.isRequired, label: props.label, name: field.name, onBlur: onBlur, onChange: onChange, onFocus: props.onFocus, ref: field.ref, style: props.style, value: (_b = field.value) !== null && _b !== void 0 ? _b : (!props.nullable ? false : undefined), variant: props.variant })); | ||
} | ||
exports.Toggle = Toggle; | ||
Toggle.displayName = "UxfFormToggle"; |
@@ -6,3 +6,3 @@ "use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Default = void 0; | ||
exports.Default = Default; | ||
const button_1 = require("@uxf/ui/button"); | ||
@@ -18,5 +18,5 @@ const react_1 = __importDefault(require("react")); | ||
const storyFormToggles = (control) => (react_1.default.createElement("div", { className: "space-y-2" }, | ||
react_1.default.createElement(toggle_1.Toggle, { label: "Toggle form", name: "toggle1", control: control }), | ||
react_1.default.createElement(toggle_1.Toggle, { label: "Toggle form required", name: "toggle-required", control: control, isRequired: true }), | ||
react_1.default.createElement(toggle_1.Toggle, { label: "Toggle form disabled", name: "toggle-disabled", control: control, isDisabled: true }), | ||
react_1.default.createElement(toggle_1.Toggle, { control: control, label: "Toggle form", name: "toggle1" }), | ||
react_1.default.createElement(toggle_1.Toggle, { control: control, isRequired: true, label: "Toggle form required", name: "toggle-required" }), | ||
react_1.default.createElement(toggle_1.Toggle, { control: control, isDisabled: true, label: "Toggle form disabled", name: "toggle-disabled" }), | ||
react_1.default.createElement(button_1.Button, { type: "submit" }, "Submit"))); | ||
@@ -26,2 +26,1 @@ return (react_1.default.createElement(storybook_form_1.StorybookForm, null, ({ control }) => (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" }, | ||
} | ||
exports.Default = Default; |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
193706
3556
+ Added@floating-ui/react@0.26.23(transitive)
+ Added@uxf/core@11.32.0(transitive)
+ Added@uxf/core-react@11.32.0(transitive)
+ Added@uxf/datepicker@11.32.0(transitive)
+ Added@uxf/styles@11.32.0(transitive)
+ Added@uxf/ui@11.32.0(transitive)
+ Addeddayjs@1.11.13(transitive)
+ Addedreact-hook-form@7.53.0(transitive)
- Removed@floating-ui/react@0.26.9(transitive)
- Removed@uxf/core@11.31.0(transitive)
- Removed@uxf/core-react@11.31.0(transitive)
- Removed@uxf/datepicker@11.25.0(transitive)
- Removed@uxf/styles@11.31.0(transitive)
- Removed@uxf/ui@11.31.0(transitive)
- Removeddayjs@1.11.10(transitive)
- Removedreact-hook-form@7.51.0(transitive)
Updated@uxf/ui@11.32.0
Updateddayjs@1.11.13
Updatedreact-hook-form@7.53.0