@uxf/ui - npm Package Compare versions

Comparing version 11.27.1 to 11.28.0

button/button.stories.js

@@ -36,3 +36,3 @@ "use strict";
     const gridColumnsCount = config.variants.length * config.sizes.length + 1;
-    const gridTemplateColumns = `repeat(${gridColumnsCount}, 100px)`;
+    const gridTemplateColumns = `repeat(${gridColumnsCount}, 180px)`;
     return (react_1.default.createElement("div", { className: "p-4" },
@@ -53,4 +53,6 @@ react_1.default.createElement("div", { className: "grid gap-3 p-4", style: { gridTemplateColumns } },
                     color),
-                config.variants.map((variant) => (react_1.default.createElement(react_1.Fragment, { key: variant }, config.sizes.map((size) => (react_1.default.createElement("div", { key: `${size}${color}${variant}`, className: "flex items-center justify-center" },
-                    react_1.default.createElement(button_1.Button, { color: color, onClick: onClick, size: size, variant: variant }, "Button")))))))))))));
+                config.variants.map((variant) => (react_1.default.createElement(react_1.Fragment, { key: variant }, config.sizes.map((size) => (react_1.default.createElement("div", { key: `${size}${color}${variant}`, className: "flex items-center justify-center gap-2" },
+                    react_1.default.createElement(button_1.Button, { color: color, onClick: onClick, size: size, variant: variant, isLoading: true }, "Button"),
+                    react_1.default.createElement(button_1.Button, { color: color, onClick: onClick, size: size, variant: variant, isIconButton: true },
+                        react_1.default.createElement(icon_1.Icon, { name: "triangle-exclamation" }))))))))))))));
 }
@@ -57,0 +59,0 @@ exports.Basic = Basic;

components.d.ts

@@ -39,2 +39,3 @@ import * as alertBubbleStories from "./alert-bubble/alert-bubble.stories";
 import * as modalStories from "./modal/modal.stories";
+import * as modalDialogStories from "./modal-dialog/modal-dialog.stories";
 import * as multiComboboxStories from "./multi-combobox/multi-combobox.stories";
@@ -210,2 +211,6 @@ import * as multiSelectStories from "./multi-select/multi-select.stories";
     };
+    readonly "modal-dialog": {
+        readonly title: "ModalDialog";
+        readonly stories: typeof modalDialogStories;
+    };
     readonly "multi-combobox": {
@@ -212,0 +217,0 @@ readonly title: "MultiCombobox";

components.js

@@ -66,2 +66,3 @@ "use strict";
 const modalStories = __importStar(require("./modal/modal.stories"));
+const modalDialogStories = __importStar(require("./modal-dialog/modal-dialog.stories"));
 const multiComboboxStories = __importStar(require("./multi-combobox/multi-combobox.stories"));
@@ -237,2 +238,6 @@ const multiSelectStories = __importStar(require("./multi-select/multi-select.stories"));
     },
+    "modal-dialog": {
+        title: "ModalDialog",
+        stories: modalDialogStories
+    },
     "multi-combobox": {
@@ -239,0 +244,0 @@ title: "MultiCombobox",

icon/icon.d.ts

 import React, { CSSProperties } from "react";
+import { IconColor } from "./theme";
 import { IconName } from "./types";
@@ -16,4 +17,5 @@ type NameOrComponentType = {
     style?: CSSProperties;
+    color?: IconColor;
 } & NameOrComponentType;
 export declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

icon/icon.js

@@ -35,3 +35,3 @@ "use strict";
     const CustomComponent = props.Component;
-    const className = (0, cx_1.cx)("uxf-icon", props.className);
+    const className = (0, cx_1.cx)("uxf-icon", props.color && `uxf-icon--color-${props.color}`, props.className);
     const preserveAspectRatio = `xMidYMid ${(_a = props.mode) !== null && _a !== void 0 ? _a : "meet"}`;
@@ -38,0 +38,0 @@ const style = props.size

icon/theme.d.ts

 export interface IconsSet extends Record<string, boolean> {
 }
+export interface IconColors {
+    default: true;
+    positive: true;
+    negative: true;
+    warning: true;
+    info: true;
+}
+export type IconColor = keyof IconColors;

icons-config.js

@@ -13,2 +13,7 @@ /** @type {import('@uxf/icons-generator/types').Config['icons']} */
     },
+    "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: {
@@ -79,2 +84,7 @@ width: 448,
     },
+    "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: {
@@ -115,2 +125,7 @@ width: 512,
     },
+    "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: {
@@ -131,2 +146,7 @@ width: 448,
     },
+    "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: {
@@ -133,0 +153,0 @@ width: 448,

message/message-content.d.ts

@@ -19,2 +19,3 @@ import { FC, ReactNode } from "react";
 }
+/** @deprecated use ModalDialog */
 export declare const MessageContent: FC<ConfirmProps>;

message/message-content.js

@@ -16,2 +16,3 @@ "use strict";
 };
+/** @deprecated use ModalDialog */
 const MessageContent = (props) => {
@@ -18,0 +19,0 @@ var _a, _b, _c;

message/message-service.d.ts

@@ -7,2 +7,3 @@ /// <reference types="react" />
 declare function close(): void;
+/** @deprecated use openModal with ModalDialog component */
 export declare const MessageService: {
@@ -9,0 +10,0 @@ getMessageRef: typeof getMessageRef;

message/message-service.js

@@ -24,2 +24,3 @@ "use strict";
 }
+/** @deprecated use openModal with ModalDialog component */
 exports.MessageService = {
@@ -26,0 +27,0 @@ getMessageRef,

message/README.md

@@ -1,3 +0,5 @@
-# Message
+# Message !!! DEPRECATED !!!
 
+Use component [ModalDialog](/docs/ui/modal-dialog) and method [openModal()](/docs/ui/modal).
+
 ## CSS dependencies
@@ -4,0 +6,0 @@

package.json

 {
   "name": "@uxf/ui",
-  "version": "11.27.1",
+  "version": "11.28.0",
   "description": "",
@@ -5,0 +5,0 @@ "publishConfig": {

readmes.d.ts

@@ -42,2 +42,3 @@ /// <reference types="mdx" />
     readonly modal: typeof alertBubbleReadme;
+    readonly "modal-dialog": typeof alertBubbleReadme;
     readonly "multi-combobox": typeof alertBubbleReadme;
@@ -44,0 +45,0 @@ readonly "multi-select": typeof alertBubbleReadme;

readmes.js

@@ -46,19 +46,20 @@ "use strict";
 const README_md_38 = __importDefault(require("./modal/README.md"));
-const README_md_39 = __importDefault(require("./multi-combobox/README.md"));
-const README_md_40 = __importDefault(require("./multi-select/README.md"));
-const README_md_41 = __importDefault(require("./pagination/README.md"));
-const README_md_42 = __importDefault(require("./paper/README.md"));
-const README_md_43 = __importDefault(require("./radio/README.md"));
-const README_md_44 = __importDefault(require("./radio-group/README.md"));
-const README_md_45 = __importDefault(require("./raster-image/README.md"));
-const README_md_46 = __importDefault(require("./select/README.md"));
-const README_md_47 = __importDefault(require("./tabs/README.md"));
-const README_md_48 = __importDefault(require("./text-input/README.md"));
-const README_md_49 = __importDefault(require("./text-link/README.md"));
-const README_md_50 = __importDefault(require("./textarea/README.md"));
-const README_md_51 = __importDefault(require("./time-picker/README.md"));
-const README_md_52 = __importDefault(require("./time-picker-input/README.md"));
-const README_md_53 = __importDefault(require("./toggle/README.md"));
-const README_md_54 = __importDefault(require("./tooltip/README.md"));
-const README_md_55 = __importDefault(require("./typography/README.md"));
+const README_md_39 = __importDefault(require("./modal-dialog/README.md"));
+const README_md_40 = __importDefault(require("./multi-combobox/README.md"));
+const README_md_41 = __importDefault(require("./multi-select/README.md"));
+const README_md_42 = __importDefault(require("./pagination/README.md"));
+const README_md_43 = __importDefault(require("./paper/README.md"));
+const README_md_44 = __importDefault(require("./radio/README.md"));
+const README_md_45 = __importDefault(require("./radio-group/README.md"));
+const README_md_46 = __importDefault(require("./raster-image/README.md"));
+const README_md_47 = __importDefault(require("./select/README.md"));
+const README_md_48 = __importDefault(require("./tabs/README.md"));
+const README_md_49 = __importDefault(require("./text-input/README.md"));
+const README_md_50 = __importDefault(require("./text-link/README.md"));
+const README_md_51 = __importDefault(require("./textarea/README.md"));
+const README_md_52 = __importDefault(require("./time-picker/README.md"));
+const README_md_53 = __importDefault(require("./time-picker-input/README.md"));
+const README_md_54 = __importDefault(require("./toggle/README.md"));
+const README_md_55 = __importDefault(require("./tooltip/README.md"));
+const README_md_56 = __importDefault(require("./typography/README.md"));
 exports.readmes = {
@@ -103,19 +104,20 @@ "alert-bubble": README_md_1.default,
     "modal": README_md_38.default,
-    "multi-combobox": README_md_39.default,
-    "multi-select": README_md_40.default,
-    "pagination": README_md_41.default,
-    "paper": README_md_42.default,
-    "radio": README_md_43.default,
-    "radio-group": README_md_44.default,
-    "raster-image": README_md_45.default,
-    "select": README_md_46.default,
-    "tabs": README_md_47.default,
-    "text-input": README_md_48.default,
-    "text-link": README_md_49.default,
-    "textarea": README_md_50.default,
-    "time-picker": README_md_51.default,
-    "time-picker-input": README_md_52.default,
-    "toggle": README_md_53.default,
-    "tooltip": README_md_54.default,
-    "typography": README_md_55.default,
+    "modal-dialog": README_md_39.default,
+    "multi-combobox": README_md_40.default,
+    "multi-select": README_md_41.default,
+    "pagination": README_md_42.default,
+    "paper": README_md_43.default,
+    "radio": README_md_44.default,
+    "radio-group": README_md_45.default,
+    "raster-image": README_md_46.default,
+    "select": README_md_47.default,
+    "tabs": README_md_48.default,
+    "text-input": README_md_49.default,
+    "text-link": README_md_50.default,
+    "textarea": README_md_51.default,
+    "time-picker": README_md_52.default,
+    "time-picker-input": README_md_53.default,
+    "toggle": README_md_54.default,
+    "tooltip": README_md_55.default,
+    "typography": README_md_56.default,
 };

New alerts

License Policy Violation

License

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

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

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

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

843375

increased by1.22%

Number of package files

805

increased by0.75%

Lines of code

17593

increased by0.94%

No dependency changes