@uxf/ui 11.28.1 → 11.28.4

package/avatar-file-input/avatar-file-input.js

@@ -63,7 +63,7 @@ exports.AvatarFileInput = (0, react_1.forwardRef)((props, ref) => {
                 onSelectFile,
                 onRemoveFile,
             })) : (react_1.default.createElement("div", { className: "uxf-avatar-file-input__controls-buttons" },
-                react_1.default.createElement(button_1.Button, { className: "uxf-avatar-file-input__controls-button uxf-avatar-file-input__controls-button--select", disabled: props.isDisabled, onClick: onSelectFile, size: "sm", variant: "secondary" }, (_e = props.selectFileLabel) !== null && _e !== void 0 ? _e : "Upload image"),
-                !!props.value && !props.isDisabled && (react_1.default.createElement(button_1.Button, { className: "uxf-avatar-file-input__controls-button uxf-avatar-file-input__controls-button--remove", color: "negative", disabled: props.isDisabled, onClick: onRemoveFile, size: "sm", variant: "secondary" }, (_f = props.removeFileLabel) !== null && _f !== void 0 ? _f : "Remove avatar"))))))));
+                react_1.default.createElement(button_1.Button, { className: "uxf-avatar-file-input__controls-button uxf-avatar-file-input__controls-button--select", isDisabled: props.isDisabled, onClick: onSelectFile, size: "sm", variant: "secondary" }, (_e = props.selectFileLabel) !== null && _e !== void 0 ? _e : "Upload image"),
+                !!props.value && !props.isDisabled && (react_1.default.createElement(button_1.Button, { className: "uxf-avatar-file-input__controls-button uxf-avatar-file-input__controls-button--remove", color: "negative", isDisabled: props.isDisabled, onClick: onRemoveFile, size: "sm", variant: "secondary" }, (_f = props.removeFileLabel) !== null && _f !== void 0 ? _f : "Remove avatar"))))))));
 });
 exports.AvatarFileInput.displayName = "UxfUiAvatarFileInput";

package/button/button.d.ts

@@ -12,11 +12,7 @@ export interface ButtonProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement
     isIconButton?: boolean;
     size?: ButtonSize;
     variant?: ButtonVariant;
-    /** @deprecated use isLoading */
-    loading?: boolean;
     isLoading?: boolean;
-    /** @deprecated use isDisabled */
-    disabled?: boolean;
     isDisabled?: boolean;
 }
 export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLAnchorElement>>;

package/button/button.js

@@ -29,10 +29,8 @@ const cx_1 = require("@uxf/core/utils/cx");
 const react_1 = __importStar(require("react"));
 exports.Button = (0, react_1.forwardRef)((props, ref) => {
     // eslint-disable-next-line react/destructuring-assignment
-    const { as = "a", color, isIconButton, isFullWidth, size, variant, className, ...restProps } = props;
+    const { as = "a", color, isIconButton, isFullWidth, size, variant, className, isDisabled, isLoading, ...restProps } = props;
     const Component = as;
-    const isDisabled = props.isDisabled || props.disabled;
-    const isLoading = props.isLoading || props.loading;
     const anchorProps = (0, use_anchor_props_1.useAnchorProps)({
         ...restProps,
         disabled: isDisabled,

package/button/button.stories.js

@@ -71,11 +71,11 @@ function Default() {
             react_1.default.createElement("span", { className: "font-semibold" }, size)),
         react_1.default.createElement("div", { className: "flex flex-row items-start gap-2" },
             react_1.default.createElement(button_1.Button, { color: color, onClick: onClick, size: size, variant: variant }, "Default"),
-            react_1.default.createElement(button_1.Button, { color: color, loading: true, onClick: onClick, size: size, variant: variant }, "Loading"),
-            react_1.default.createElement(button_1.Button, { color: color, disabled: true, onClick: onClick, size: size, variant: variant }, "Disabled"),
+            react_1.default.createElement(button_1.Button, { color: color, isLoading: true, onClick: onClick, size: size, variant: variant }, "Loading"),
+            react_1.default.createElement(button_1.Button, { color: color, isDisabled: true, onClick: onClick, size: size, variant: variant }, "Disabled"),
             react_1.default.createElement(button_1.Button, { color: color, isIconButton: true, onClick: onClick, size: size, variant: variant },
                 react_1.default.createElement(icon_1.Icon, { name: "check" })),
-            react_1.default.createElement(button_1.Button, { color: color, isIconButton: true, onClick: onClick, size: size, variant: variant, loading: true },
+            react_1.default.createElement(button_1.Button, { color: color, isIconButton: true, onClick: onClick, size: size, variant: variant, isLoading: true },
                 react_1.default.createElement(icon_1.Icon, { name: "check" })),
             react_1.default.createElement(button_1.Button, { className: "w-[200px]", color: color, onClick: onClick, size: size, variant: variant }, "Custom width")),
         react_1.default.createElement(button_1.Button, { color: color, isFullWidth: true, onClick: onClick, size: size, variant: variant }, "Full width"),

package/button-list/button-list.stories.js

@@ -16,7 +16,7 @@ const Default = () => {
                 { label: "First item" },
                 { label: "Second item" },
                 { label: "Third item" },
-                { label: "Fourth item", disabled: true },
+                { label: "Fourth item", isDisabled: true },
                 { label: "Fifth item" },
                 { label: "Sixth item" },
                 { label: "Seventh item" },

package/date-picker/date-picker-month.js

@@ -60,11 +60,11 @@ exports.DatePickerMonth = (0, react_1.memo)((props) => {
     }, [setViewMode]);
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(calendar_1.CalendarNavigation, { prevButtonProps: {
-                disabled: !canGoToPrevMonth,
+                isDisabled: !canGoToPrevMonth,
                 onClick: canGoToPrevMonth ? handleGoToPrevMonth : undefined,
                 title: "Předchozí měsíc",
             }, nextButtonProps: {
-                disabled: !canGoToNextMonth,
+                isDisabled: !canGoToNextMonth,
                 onClick: canGoToNextMonth ? handleGoToNextMonth : undefined,
                 title: "Nadcházející měsíc",
             }, selectButtonProps: {

package/date-picker/date-picker-year.js

@@ -62,11 +62,11 @@ exports.DatePickerYear = (0, react_1.memo)((props) => {
     }, [canGoToMonth, props]);
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(calendar_1.CalendarNavigation, { prevButtonProps: {
-                disabled: !canGoToPrevYear,
+                isDisabled: !canGoToPrevYear,
                 onClick: canGoToPrevYear ? handleGoToPrevYear : undefined,
                 title: "Předchozí rok",
             }, nextButtonProps: {
-                disabled: !canGoToNextYear,
+                isDisabled: !canGoToNextYear,
                 onClick: canGoToNextYear ? handleGoToNextYear : undefined,
                 title: "Nadcházející rok",
             }, selectButtonProps: {

package/date-range-picker/date-range-picker-month.js

@@ -52,11 +52,11 @@ exports.DateRangePickerMonth = (0, react_1.memo)((props) => {
     }, [props]);
     return (react_1.default.createElement("div", { className: "uxf-date-range-picker__month" },
         react_1.default.createElement(calendar_1.CalendarNavigation, { prevButtonProps: {
-                disabled: !canGoToPrevMonth,
+                isDisabled: !canGoToPrevMonth,
                 onClick: canGoToPrevMonth ? handleGoToPrevMonth : undefined,
                 title: "Předchozí měsíc",
             }, nextButtonProps: {
-                disabled: !canGoToNextMonth,
+                isDisabled: !canGoToNextMonth,
                 onClick: canGoToNextMonth ? handleGoToNextMonth : undefined,
                 title: "Nadcházející měsíc",
             }, selectButtonProps: {

package/date-range-picker/date-range-picker-year.js

@@ -63,11 +63,11 @@ exports.DateRangePickerYear = (0, react_1.memo)((props) => {
     }, [canGoToMonth, props]);
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(calendar_1.CalendarNavigation, { prevButtonProps: {
-                disabled: !canGoToPrevYear,
+                isDisabled: !canGoToPrevYear,
                 onClick: canGoToPrevYear ? handleGoToPrevYear : undefined,
                 title: "Předchozí rok",
             }, nextButtonProps: {
-                disabled: !canGoToNextYear,
+                isDisabled: !canGoToNextYear,
                 onClick: canGoToNextYear ? handleGoToNextYear : undefined,
                 title: "Nadcházející rok",
             }, selectButtonProps: {

package/icons-config.js

@@ -10,11 +10,6 @@ module.exports = {
         height: 512,
         data: `<path fill="currentColor" d="M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z"/>`,
     },
-    "badge-check-solid": {
-        width: 512,
-        height: 512,
-        data: `<path fill="currentColor" d="M256 0c36.8 0 68.8 20.7 84.9 51.1C373.8 41 411 49 437 75s34 63.3 23.9 96.1C491.3 187.2 512 219.2 512 256s-20.7 68.8-51.1 84.9C471 373.8 463 411 437 437s-63.3 34-96.1 23.9C324.8 491.3 292.8 512 256 512s-68.8-20.7-84.9-51.1C138.2 471 101 463 75 437s-34-63.3-23.9-96.1C20.7 324.8 0 292.8 0 256s20.7-68.8 51.1-84.9C41 138.2 49 101 75 75s63.3-34 96.1-23.9C187.2 20.7 219.2 0 256 0zM369 209c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-111 111-47-47c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l64 64c9.4 9.4 24.6 9.4 33.9 0L369 209z"/>`,
-    },
     calendar: {
         width: 448,
         height: 512,
@@ -80,11 +75,6 @@ module.exports = {
         height: 512,
         data: `<path d="M144 480C64.5 480 0 415.5 0 336c0-62.8 40.2-116.2 96.2-135.9-.1-2.7-.2-5.4-.2-8.1 0-88.4 71.6-160 160-160 59.3 0 111 32.2 138.7 80.2C409.9 102 428.3 96 448 96c53 0 96 43 96 96 0 12.2-2.3 23.8-6.4 34.6C596 238.4 640 290.1 640 352c0 70.7-57.3 128-128 128H144zm79-217c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l39-39V392c0 13.3 10.7 24 24 24s24-10.7 24-24V257.9l39 39c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-80-80c-9.4-9.4-24.6-9.4-33.9 0l-80 80z" fill="currentColor"/>`,
     },
-    "circle-info-solid": {
-        width: 512,
-        height: 512,
-        data: `<path fill="currentColor" d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z"/>`,
-    },
     copy: {
         width: 512,
         height: 512,
@@ -120,11 +110,6 @@ module.exports = {
         height: 512,
         data: `<path fill="currentColor" d="M248.4 84.3c1.6-2.7 4.5-4.3 7.6-4.3s6 1.6 7.6 4.3L461.9 410c1.4 2.3 2.1 4.9 2.1 7.5c0 8-6.5 14.5-14.5 14.5H62.5c-8 0-14.5-6.5-14.5-14.5c0-2.7 .7-5.3 2.1-7.5L248.4 84.3zm-41-25L9.1 385c-6 9.8-9.1 21-9.1 32.5C0 452 28 480 62.5 480h387c34.5 0 62.5-28 62.5-62.5c0-11.5-3.2-22.7-9.1-32.5L304.6 59.3C294.3 42.4 275.9 32 256 32s-38.3 10.4-48.6 27.3zM288 368a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zm-8-184c0-13.3-10.7-24-24-24s-24 10.7-24 24v96c0 13.3 10.7 24 24 24s24-10.7 24-24V184z"/>`,
     },
-    "triangle-exclamation-solid": {
-        width: 512,
-        height: 512,
-        data: `<path d="M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480L40 480c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24l0 112c0 13.3 10.7 24 24 24s24-10.7 24-24l0-112c0-13.3-10.7-24-24-24zm32 224a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z" fill="currentColor"/>`,
-    },
     user: {
         width: 448,
         height: 512,
@@ -140,11 +125,6 @@ module.exports = {
         height: 512,
         data: `<path fill="currentColor" d="M345 137c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-119 119L73 103c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l119 119L39 375c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l119-119L311 409c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-119-119L345 137z"/>`,
     },
-    "xmark-octagon-solid": {
-        width: 512,
-        height: 512,
-        data: `<path fill="currentColor" d="M140.6 21.2C154.1 7.7 172.4 .1 191.5 .1l129 0c19.1 0 37.4 7.6 50.9 21.1L490.8 140.6c13.5 13.5 21.1 31.8 21.1 50.9l0 129c0 19.1-7.6 37.4-21.1 50.9L371.4 490.8c-13.5 13.5-31.8 21.1-50.9 21.1l-129 0c-19.1 0-37.4-7.6-50.9-21.1L21.2 371.4C7.7 357.9 .1 339.6 .1 320.5l0-129c0-19.1 7.6-37.4 21.1-50.9L140.6 21.2zM175 175c-9.4 9.4-9.4 24.6 0 33.9l47 47-47 47c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l47-47 47 47c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-47-47 47-47c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-47 47-47-47c-9.4-9.4-24.6-9.4-33.9 0z"/>`,
-    },
     xmarkLarge: {
         width: 448,
         height: 512,

package/modal-dialog/modal-dialog.stories.js

@@ -13,16 +13,16 @@ function Default() {
         react_1.default.createElement(modal_dialog_1.ModalDialog, { title: "Default dialog", footer: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(button_1.Button, { variant: "text" }, "Close"),
                 react_1.default.createElement(button_1.Button, null, "Button")) }, "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam erat volutpat. Praesent dapibus. Vestibulum fermentum tortor id mi."),
-        react_1.default.createElement(modal_dialog_1.ModalDialog, { title: "Warning dialog", icon: react_1.default.createElement(icon_1.Icon, { name: "triangle-exclamation-solid", color: "warning" }), footer: react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(modal_dialog_1.ModalDialog, { title: "Warning dialog", icon: react_1.default.createElement(icon_1.Icon, { name: "triangle-exclamation", color: "warning" }), footer: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(button_1.Button, { variant: "text" }, "Close"),
                 react_1.default.createElement(button_1.Button, { color: "warning" }, "Button")) }, "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam erat volutpat. Praesent dapibus. Vestibulum fermentum tortor id mi."),
-        react_1.default.createElement(modal_dialog_1.ModalDialog, { title: "Positive dialog asda ksdjahs kjdhakj shdk jahksdjh kajsdh k", icon: react_1.default.createElement(icon_1.Icon, { name: "badge-check-solid", color: "positive" }), footer: react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(modal_dialog_1.ModalDialog, { title: "Positive dialog asda ksdjahs kjdhakj shdk jahksdjh kajsdh k", icon: react_1.default.createElement(icon_1.Icon, { name: "youtube", color: "positive" }), footer: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(button_1.Button, { variant: "text" }, "Cancel"),
                 react_1.default.createElement(button_1.Button, { color: "positive" }, "Save")) }, "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam erat volutpat. Praesent dapibus. Vestibulum fermentum tortor id mi."),
-        react_1.default.createElement(modal_dialog_1.ModalDialog, { title: "Negative dialog", icon: react_1.default.createElement(icon_1.Icon, { name: "xmark-octagon-solid", color: "negative" }), footer: react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(modal_dialog_1.ModalDialog, { title: "Negative dialog", icon: react_1.default.createElement(icon_1.Icon, { name: "xmark", color: "negative" }), footer: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(button_1.Button, { variant: "text" }, "Cancel"),
                 react_1.default.createElement(button_1.Button, { color: "negative" }, "Save")) }, "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam erat volutpat. Praesent dapibus. Vestibulum fermentum tortor id mi."),
-        react_1.default.createElement(modal_dialog_1.ModalDialog, { title: "Info dialog", icon: react_1.default.createElement(icon_1.Icon, { name: "circle-info-solid", color: "info" }), footer: react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(modal_dialog_1.ModalDialog, { title: "Info dialog", icon: react_1.default.createElement(icon_1.Icon, { name: "circle-info", color: "info" }), footer: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(button_1.Button, { variant: "text" }, "Cancel"),
                 react_1.default.createElement(button_1.Button, { color: "info" }, "Save")) }, "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam erat volutpat. Praesent dapibus. Vestibulum fermentum tortor id mi.")));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/ui",
-  "version": "11.28.1",
+  "version": "11.28.4",
   "description": "",
   "publishConfig": {
     "access": "public"

package/text-input/text-input.stories.js

@@ -53,7 +53,7 @@ function Default() {
         react_1.default.createElement(text_input_1.TextInput, { name: "readOnly", label: "Read only input", value: value, onChange: onChange, helperText: "Error helper text", leftAddon: "https://", rightAddon: ".cz", leftElement: "\uD83C\uDF37", rightElement: "\uD83D\uDD14", placeholder: "Some beautiful placeholder...", isReadOnly: true }),
         react_1.default.createElement(text_input_1.TextInput, { name: "disabled", label: "Disabled input", value: value, onChange: onChange, helperText: "Error helper text", leftAddon: "https://", rightAddon: ".cz", leftElement: "\uD83C\uDF37", rightElement: "\uD83D\uDD14", placeholder: "Some beautiful placeholder...", isDisabled: true }),
         react_1.default.createElement(text_input_1.TextInput, { name: "defaultHtmlTime", label: "Default html time input", value: timeValue, onChange: onTimeChange, placeholder: "Some beautiful placeholder...", type: "time" }),
-        react_1.default.createElement(text_input_1.TextInput, { name: "copyToClipboard", label: "Copy to clipboard input", leftAddon: "I can be copied!", onChange: onChange, placeholder: "Some beautiful placeholder...", rightAddon: react_1.default.createElement(button_1.Button, { className: "size-full rounded-l-none border-none", disabled: value === "", onClick: onCopy, variant: "secondary" },
+        react_1.default.createElement(text_input_1.TextInput, { name: "copyToClipboard", label: "Copy to clipboard input", leftAddon: "I can be copied!", onChange: onChange, placeholder: "Some beautiful placeholder...", rightAddon: react_1.default.createElement(button_1.Button, { className: "size-full rounded-l-none border-none", isDisabled: value === "", onClick: onCopy, variant: "secondary" },
                 react_1.default.createElement(icon_1.Icon, { className: "w-4", name: "copy" })), value: value })));
 }
 exports.Default = Default;