@uxf/ui 11.74.0 → 11.74.2

package/modal/modal-provider.js

@@ -0,0 +1,57 @@
+"use strict";
+"use client";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ModalProvider = void 0;
+const react_1 = __importStar(require("react"));
+const dialog_1 = require("../dialog/dialog");
+exports.ModalProvider = (0, react_1.forwardRef)((props, ref) => {
+    var _a, _b;
+    const [content, setContent] = (0, react_1.useState)();
+    const { openDialog, DialogProvider, closeDialog } = (0, dialog_1.useDialog)({
+        onDialogClose: content === null || content === void 0 ? void 0 : content.onClose,
+        isBackdropCloseDisabled: content === null || content === void 0 ? void 0 : content.isBackdropCloseDisabled,
+    });
+    const openModalHandler = (modal) => {
+        openDialog(modal.children);
+        setContent(modal);
+    };
+    const closeModalHandler = () => {
+        if (content === null || content === void 0 ? void 0 : content.onClose) {
+            content.onClose();
+        }
+        closeDialog();
+    };
+    const innerRef = (0, react_1.useRef)({
+        close: closeModalHandler,
+        open: openModalHandler,
+    });
+    (0, react_1.useImperativeHandle)(ref, () => ({
+        close: innerRef.current.close,
+        open: innerRef.current.open,
+    }), []);
+    return (react_1.default.createElement(DialogProvider, { className: `uxf-modal uxf-modal--variant-${(_a = content === null || content === void 0 ? void 0 : content.variant) !== null && _a !== void 0 ? _a : "default"} ${(_b = content === null || content === void 0 ? void 0 : content.className) !== null && _b !== void 0 ? _b : ""}`, variant: content === null || content === void 0 ? void 0 : content.variant }));
+});
+exports.ModalProvider.displayName = "UxfUiModalProvider";

package/modal/modal-service.d.ts

@@ -0,0 +1,4 @@
+import { ModalProviderProps, ModalRef } from "./types";
+export declare function getModalRef(): import("react").RefObject<ModalRef>;
+export declare function openModal(modal: ModalProviderProps): void;
+export declare function closeModal(): void;

package/modal/modal-service.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getModalRef = getModalRef;
+exports.openModal = openModal;
+exports.closeModal = closeModal;
+const react_1 = require("react");
+const modalRef = (0, react_1.createRef)();
+function getModalRef() {
+    return modalRef;
+}
+function openModal(modal) {
+    if (modalRef.current) {
+        modalRef.current.open(modal);
+    }
+}
+function closeModal() {
+    if (modalRef.current) {
+        modalRef.current.close();
+    }
+}

package/modal/modal.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { ModalProps } from "./types";
+export declare function Modal(props: ModalProps): React.JSX.Element;

package/modal/modal.js

@@ -0,0 +1,27 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Modal = Modal;
+const react_1 = require("@floating-ui/react");
+const use_latest_1 = require("@uxf/core-react/hooks/use-latest");
+const dialog_1 = require("@uxf/ui/dialog");
+const react_2 = __importDefault(require("react"));
+function Modal(props) {
+    var _a, _b;
+    const { refs, context } = (0, react_1.useFloating)({
+        open: props.isOpen,
+        onOpenChange(nextOpen, event, reason) {
+            if (!props.isBackdropCloseDisabled && (reason === "escape-key" || reason === "outside-press")) {
+                props.close();
+            }
+        },
+    });
+    const click = (0, react_1.useClick)(context);
+    const role = (0, react_1.useRole)(context);
+    const dismiss = (0, react_1.useDismiss)(context, { outsidePressEvent: "mousedown", escapeKey: true });
+    const { getFloatingProps } = (0, react_1.useInteractions)([click, role, dismiss]);
+    const latestContext = (0, use_latest_1.useLatest)(context);
+    return (react_2.default.createElement(dialog_1.Dialog, { className: `uxf-modal uxf-modal--variant-${(_a = props.variant) !== null && _a !== void 0 ? _a : "default"} ${(_b = props.className) !== null && _b !== void 0 ? _b : ""}`, context: latestContext.current, forwardedRef: refs.setFloating, getFloatingProps: getFloatingProps, isOpen: props.isOpen, variant: props.variant }, props.children));
+}

package/modal/modal.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/modal/modal.spec.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const snap_test_1 = require("../utils/snap-test");
+const modal_stories_1 = require("./modal.stories");
+(0, snap_test_1.snapTest)("render stories", react_1.default.createElement(modal_stories_1.Default, null));

package/modal/modal.stories.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+export declare function Default(): React.JSX.Element;
+export declare function ModalProvider(): React.JSX.Element;

package/modal/modal.stories.js

@@ -0,0 +1,109 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Default = Default;
+exports.ModalProvider = ModalProvider;
+const button_1 = require("@uxf/ui/button");
+const dialog_1 = require("@uxf/ui/dialog");
+const react_1 = __importStar(require("react"));
+const modal_1 = require("./modal");
+const modal_service_1 = require("./modal-service");
+function Default() {
+    const [isOpenXs, setIsOpenXs] = (0, react_1.useState)(false);
+    const [isOpenRightDrawer, setIsOpenRightDrawer] = (0, react_1.useState)(false);
+    const [isOpenDisableBackdrop, setIsOpenDisableBackdrop] = (0, react_1.useState)(false);
+    return (react_1.default.createElement("div", { className: "space-y-2 p-20 lg:w-1/2" },
+        react_1.default.createElement("div", null,
+            react_1.default.createElement(button_1.Button, { onClick: () => setIsOpenXs(true) }, "Click to open modal xs"),
+            react_1.default.createElement(modal_1.Modal, { close: () => setIsOpenXs(false), isOpen: isOpenXs },
+                react_1.default.createElement(dialog_1.DialogPanel, { width: "xs" }, "Whatever content inside Modal xs"))),
+        react_1.default.createElement("div", null,
+            react_1.default.createElement(button_1.Button, { onClick: () => setIsOpenRightDrawer(true) }, "Click to open modal drawer-right"),
+            react_1.default.createElement(modal_1.Modal, { close: () => setIsOpenRightDrawer(false), isOpen: isOpenRightDrawer, variant: "drawer-right" },
+                react_1.default.createElement(dialog_1.DialogPanel, null, "Whatever content inside Modal drawer-right"))),
+        react_1.default.createElement("div", null,
+            react_1.default.createElement(button_1.Button, { onClick: () => setIsOpenDisableBackdrop(true) }, "Click to open modal DisableBackdrop"),
+            react_1.default.createElement(modal_1.Modal, { close: () => setIsOpenDisableBackdrop(false), isBackdropCloseDisabled: true, isOpen: isOpenDisableBackdrop },
+                react_1.default.createElement(dialog_1.DialogPanel, null,
+                    react_1.default.createElement("div", { className: "p-4" },
+                        react_1.default.createElement("p", null, "Whatever content inside DisableBackdrop:"),
+                        react_1.default.createElement(button_1.Button, { className: "mt-2", onClick: () => setIsOpenDisableBackdrop(false) }, "Close")))))));
+}
+function ModalProvider() {
+    return (react_1.default.createElement("div", { className: "space-y-2 p-20 lg:w-1/2" },
+        react_1.default.createElement("div", { className: "light inline-flex flex-col space-y-4" },
+            react_1.default.createElement(button_1.Button, { onClick: () => (0, modal_service_1.openModal)({
+                    children: (react_1.default.createElement(dialog_1.DialogPanel, null,
+                        react_1.default.createElement("div", { className: "p-4" },
+                            react_1.default.createElement("p", { className: "mb-3 text-lg font-bold" }, "Modal - default size"),
+                            react_1.default.createElement(button_1.Button, { isFullWidth: true, onClick: modal_service_1.closeModal }, "Close modal")))),
+                    onClose: () => console.log("modal closed"),
+                }) }, "Click to open modal - default"),
+            react_1.default.createElement(button_1.Button, { onClick: () => (0, modal_service_1.openModal)({
+                    children: (react_1.default.createElement(dialog_1.DialogPanel, { width: "xs" },
+                        react_1.default.createElement("div", { className: "p-4" },
+                            react_1.default.createElement("p", { className: "mb-3 text-lg font-bold" }, "Modal - xs size"),
+                            react_1.default.createElement(button_1.Button, { isFullWidth: true, onClick: modal_service_1.closeModal }, "Close modal")))),
+                }) }, "Click to open modal - xs"),
+            react_1.default.createElement(button_1.Button, { onClick: () => (0, modal_service_1.openModal)({
+                    children: (react_1.default.createElement(dialog_1.DialogPanel, { width: "sm" },
+                        react_1.default.createElement("div", { className: "p-4" },
+                            react_1.default.createElement("p", { className: "mb-3 text-lg font-bold" }, "Modal - sm size"),
+                            react_1.default.createElement(button_1.Button, { isFullWidth: true, onClick: modal_service_1.closeModal }, "Close modal")))),
+                }) }, "Click to open modal - sm"),
+            react_1.default.createElement(button_1.Button, { onClick: () => (0, modal_service_1.openModal)({
+                    children: (react_1.default.createElement(dialog_1.DialogPanel, { width: "lg" },
+                        react_1.default.createElement("div", { className: "p-4" },
+                            react_1.default.createElement("p", { className: "mb-3 text-lg font-bold" }, "Modal - lg size"),
+                            react_1.default.createElement(button_1.Button, { isFullWidth: true, onClick: modal_service_1.closeModal }, "Close modal")))),
+                }) }, "Click to open modal - lg"),
+            react_1.default.createElement(button_1.Button, { onClick: () => (0, modal_service_1.openModal)({
+                    children: (react_1.default.createElement(dialog_1.DialogPanel, { width: "xl" },
+                        react_1.default.createElement("div", { className: "p-4" },
+                            react_1.default.createElement("p", { className: "mb-3 text-lg font-bold" }, "Modal - xl size"),
+                            react_1.default.createElement(button_1.Button, { isFullWidth: true, onClick: modal_service_1.closeModal }, "Close modal")))),
+                }) }, "Click to open modal - xl"),
+            react_1.default.createElement(button_1.Button, { onClick: () => (0, modal_service_1.openModal)({
+                    children: (react_1.default.createElement(dialog_1.DialogPanel, null,
+                        react_1.default.createElement("div", { className: "p-4" },
+                            react_1.default.createElement("p", { className: "mb-3 text-lg font-bold" }, "Modal - dark"),
+                            react_1.default.createElement(button_1.Button, { isFullWidth: true, onClick: modal_service_1.closeModal }, "Close modal")))),
+                    className: "dark",
+                }) }, "Click to open modal - dark"),
+            react_1.default.createElement(button_1.Button, { onClick: () => (0, modal_service_1.openModal)({
+                    children: (react_1.default.createElement(dialog_1.DialogPanel, null,
+                        react_1.default.createElement("div", { className: "p-4" },
+                            react_1.default.createElement("p", { className: "mb-3 text-lg font-bold" }, "Modal - disable backdrop close"),
+                            react_1.default.createElement(button_1.Button, { isFullWidth: true, onClick: modal_service_1.closeModal }, "Close modal")))),
+                    isBackdropCloseDisabled: true,
+                }) }, "Click to open modal - disable backdrop close"),
+            react_1.default.createElement(button_1.Button, { onClick: () => (0, modal_service_1.openModal)({
+                    children: (react_1.default.createElement(dialog_1.DialogPanel, null,
+                        react_1.default.createElement("div", { className: "p-4" },
+                            react_1.default.createElement("p", { className: "mb-3 text-lg font-bold" }, "Modal - variant right drawer"),
+                            react_1.default.createElement(button_1.Button, { isFullWidth: true, onClick: modal_service_1.closeModal }, "Close modal")))),
+                    variant: "drawer-right",
+                }) }, "Click to open modal - variant right drawer"))));
+}

package/modal/theme.d.ts

@@ -0,0 +1,4 @@
+export interface ModalVariants {
+    default: true;
+    "drawer-right": true;
+}

package/modal/theme.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/modal/types.d.ts

@@ -0,0 +1,23 @@
+import { ModalVariants } from "@uxf/ui/modal/theme";
+import { ReactNode } from "react";
+import type { DialogProps } from "../dialog";
+export type ModalVariant = keyof ModalVariants;
+export interface ModalProviderProps {
+    children: ReactNode;
+    className?: DialogProps["className"];
+    isBackdropCloseDisabled?: DialogProps["isBackdropCloseDisabled"];
+    onClose?: () => void;
+    variant?: ModalVariant;
+}
+export interface ModalRef {
+    close: () => void;
+    open: (modal: ModalProviderProps) => void;
+}
+export interface ModalProps {
+    children: ReactNode;
+    className?: DialogProps["className"];
+    close: () => void;
+    isBackdropCloseDisabled?: boolean;
+    isOpen: boolean;
+    variant?: ModalVariant;
+}

package/modal/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/modal-dialog/modal-dialog.d.ts

@@ -0,0 +1,13 @@
+import React, { ReactNode } from "react";
+import { DialogPanelWidth } from "../dialog";
+interface ModalDialogProps {
+    children?: ReactNode;
+    className?: string;
+    footer?: ReactNode;
+    icon?: ReactNode;
+    title: string;
+    width?: DialogPanelWidth;
+    isDialogPanelHidden?: boolean;
+}
+export declare function ModalDialog(props: ModalDialogProps): React.JSX.Element;
+export {};

package/modal-dialog/modal-dialog.js

@@ -0,0 +1,18 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ModalDialog = ModalDialog;
+const react_1 = __importDefault(require("react"));
+const dialog_1 = require("../dialog");
+function ModalDialog(props) {
+    var _a, _b;
+    const Content = (react_1.default.createElement("div", { className: `uxf-modal-dialog ${(_a = props.className) !== null && _a !== void 0 ? _a : ""}` },
+        react_1.default.createElement("div", { className: "uxf-modal-dialog__header" },
+            props.icon,
+            react_1.default.createElement("div", { className: "uxf-modal-dialog__title" }, props.title)),
+        props.children && react_1.default.createElement("div", { className: "uxf-modal-dialog__text" }, props.children),
+        props.footer && react_1.default.createElement("div", { className: "uxf-modal-dialog__footer" }, props.footer)));
+    return props.isDialogPanelHidden ? Content : react_1.default.createElement(dialog_1.DialogPanel, { width: (_b = props.width) !== null && _b !== void 0 ? _b : "xs" }, Content);
+}

package/modal-dialog/modal-dialog.stories.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare function Default(): React.JSX.Element;

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

@@ -0,0 +1,28 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Default = Default;
+const button_1 = require("@uxf/ui/button");
+const react_1 = __importDefault(require("react"));
+const icon_1 = require("../icon");
+const modal_dialog_1 = require("./modal-dialog");
+function Default() {
+    return (react_1.default.createElement("div", { className: "space-y-6 bg-neutral-200 p-6" },
+        react_1.default.createElement(modal_dialog_1.ModalDialog, { 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")), title: "Default dialog" }, "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, { 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")), icon: react_1.default.createElement(icon_1.Icon, { color: "warning", name: "triangle-exclamation" }), title: "Warning dialog" }, "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, { 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")), icon: react_1.default.createElement(icon_1.Icon, { color: "positive", name: "youtube" }), title: "Positive dialog asda ksdjahs kjdhakj shdk jahksdjh kajsdh k" }, "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, { 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")), icon: react_1.default.createElement(icon_1.Icon, { color: "negative", name: "xmark", size: 48 }), title: "Negative dialog" }, "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, { 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")), icon: react_1.default.createElement(icon_1.Icon, { color: "info", name: "circle-info" }), title: "Info dialog", width: "lg" }, "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam erat volutpat. Praesent dapibus. Vestibulum fermentum tortor id mi.")));
+}

package/modal-header/index.d.ts

@@ -0,0 +1,2 @@
+export { ModalHeader } from "./modal-header";
+export type { ModalHeaderProps } from "./modal-header";

package/modal-header/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ModalHeader = void 0;
+var modal_header_1 = require("./modal-header");
+Object.defineProperty(exports, "ModalHeader", { enumerable: true, get: function () { return modal_header_1.ModalHeader; } });

package/modal-header/modal-header.d.ts

@@ -0,0 +1,10 @@
+import React, { ReactNode } from "react";
+export interface ModalHeaderProps {
+    className?: string;
+    onGoBack?: () => void;
+    onClose?: () => void;
+    actionsComponent?: ReactNode;
+    title: ReactNode;
+    description?: ReactNode;
+}
+export declare function ModalHeader(props: ModalHeaderProps): React.JSX.Element;

package/modal-header/modal-header.js

@@ -0,0 +1,27 @@
+"use strict";
+"use client";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ModalHeader = ModalHeader;
+const show_1 = require("@uxf/core-react/components/show");
+const cx_1 = require("@uxf/core/utils/cx");
+const is_not_nil_1 = require("@uxf/core/utils/is-not-nil");
+const react_1 = __importDefault(require("react"));
+const button_1 = require("../button");
+const icon_1 = require("../icon");
+function ModalHeader(props) {
+    return (react_1.default.createElement("header", { className: (0, cx_1.cx)("uxf-modal-header", props.onGoBack && "uxf-modal-header--has-go-back", props.className) },
+        react_1.default.createElement(show_1.Show, { when: (0, is_not_nil_1.isNotNil)(props.onGoBack) },
+            react_1.default.createElement(button_1.Button, { isIconButton: true, onClick: props.onGoBack, size: "sm", variant: "text" },
+                react_1.default.createElement(icon_1.Icon, { name: "angle-left" }))),
+        react_1.default.createElement("div", { className: "uxf-modal-header__text-wrapper" },
+            react_1.default.createElement("div", { className: "uxf-modal-header__title" }, props.title),
+            react_1.default.createElement(show_1.Show, { when: (0, is_not_nil_1.isNotNil)(props.description) },
+                react_1.default.createElement("div", { className: "uxf-modal-header__description" }, props.description))),
+        props.actionsComponent,
+        react_1.default.createElement(show_1.Show, { when: (0, is_not_nil_1.isNotNil)(props.onClose) },
+            react_1.default.createElement(button_1.Button, { isIconButton: true, onClick: props.onClose, size: "sm", variant: "text" },
+                react_1.default.createElement(icon_1.Icon, { name: "xmark" })))));
+}

package/modal-header/modal-header.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/modal-header/modal-header.spec.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const snap_test_1 = require("../utils/snap-test");
+const modal_header_stories_1 = require("./modal-header.stories");
+(0, snap_test_1.snapTest)("render stories", react_1.default.createElement(modal_header_stories_1.Default, null));

package/modal-header/modal-header.stories.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare function Default(): React.JSX.Element;

package/modal-header/modal-header.stories.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Default = Default;
+const noop_1 = require("@uxf/core/utils/noop");
+const react_1 = __importDefault(require("react"));
+const button_1 = require("../button");
+const icon_1 = require("../icon");
+const modal_header_1 = require("./modal-header");
+function Default() {
+    return (react_1.default.createElement("div", { className: "flex max-w-[480px] flex-col gap-4 p-8" },
+        react_1.default.createElement(modal_header_1.ModalHeader, { onClose: noop_1.noop, title: "Time of details" }),
+        react_1.default.createElement(modal_header_1.ModalHeader, { description: "View and manage your time off", title: "Time of details" }),
+        react_1.default.createElement(modal_header_1.ModalHeader, { description: "View and manage your time off", onClose: noop_1.noop, onGoBack: () => alert("going back!"), title: "Time of details" }),
+        react_1.default.createElement(modal_header_1.ModalHeader, { actionsComponent: react_1.default.createElement(button_1.Button, { isIconButton: true, onClick: () => alert("action!"), size: "sm", variant: "text" },
+                react_1.default.createElement(icon_1.Icon, { name: "ellipsis-vertical" })), description: "View and manage your time off", onClose: noop_1.noop, onGoBack: () => alert("going back!"), title: "Time of details" })));
+}

package/multi-combobox/index.d.ts

@@ -0,0 +1,2 @@
+export { MultiCombobox } from "./multi-combobox";
+export type { MultiComboboxOption, MultiComboboxProps, MultiComboboxRef, MultiComboboxValue, MultiComboboxValueId, } from "./types";

package/multi-combobox/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MultiCombobox = void 0;
+var multi_combobox_1 = require("./multi-combobox");
+Object.defineProperty(exports, "MultiCombobox", { enumerable: true, get: function () { return multi_combobox_1.MultiCombobox; } });

package/multi-combobox/multi-combobox.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { MultiComboboxOption, MultiComboboxProps, MultiComboboxValueId } from "./types";
+export declare const MultiCombobox: React.ForwardRefExoticComponent<MultiComboboxProps<MultiComboboxValueId, MultiComboboxOption<MultiComboboxValueId>> & React.RefAttributes<HTMLInputElement>>;