@ultraviolet/ui 3.8.2 → 3.10.0

package/dist/components/Popover/index.d.ts

@@ -1,6 +1,4 @@
-import type { ComponentProps, ReactNode, Ref } from 'react';
-import { Popup } from '../Popup';
-import type { SIZES_WIDTH } from './constant';
+import type { ReactNode, Ref } from 'react';
 type SentimentType = 'neutral' | 'primary';
 /**
  * Popover component is used to display additional information or actions on top of the main content of the page.
@@ -10,53 +8,53 @@ export declare const Popover: import("react").ForwardRefExoticComponent<{
     children: ReactNode;
     content: ReactNode;
     title: string;
-    sentiment?: SentimentType;
-    visible?: boolean;
-    size?: keyof typeof SIZES_WIDTH;
-    onClose?: () => void;
-    className?: string;
-    'data-testid'?: string;
-    maxWidth?: string;
-    maxHeight?: string;
+    sentiment?: SentimentType | undefined;
+    visible?: boolean | undefined;
+    size?: "large" | "medium" | "small" | undefined;
+    onClose?: (() => void) | undefined;
+    className?: string | undefined;
+    'data-testid'?: string | undefined;
+    maxWidth?: string | undefined;
+    maxHeight?: string | undefined;
     /**
      * By default, the portal target is children container or document.body if children is a function. You can override this
      * behavior by setting a portalTarget prop.
      */
-    portalTarget?: HTMLElement;
-    placement?: Exclude<ComponentProps<typeof Popup>["placement"], "nested-menu">;
+    portalTarget?: HTMLElement | undefined;
+    placement?: "bottom" | "left" | "right" | "top" | ("auto" | "auto-bottom" | "auto-left" | "auto-right" | "auto-top") | undefined;
 } & Pick<{
-    id?: string;
-    children: ReactNode | ((renderProps: {
-        className?: string;
+    id?: string | undefined;
+    children: ((renderProps: {
+        className?: string | undefined;
         onBlur: () => void;
         onFocus: () => void;
         onPointerEnter: () => void;
         onPointerLeave: () => void;
         ref: import("react").RefObject<HTMLDivElement | null>;
-    }) => ReactNode);
-    maxWidth?: number | string;
-    placement?: import("../Popup/helpers").PopupPlacement;
-    align?: import("../Popup/helpers").PopupAlign;
+    }) => ReactNode) | ReactNode;
+    maxWidth?: string | number | undefined;
+    placement?: import("../Popup/helpers").PopupPlacement | undefined;
+    align?: import("../Popup/helpers").PopupAlign | undefined;
     text?: ReactNode;
-    className?: string;
-    containerFullWidth?: boolean;
-    containerFullHeight?: boolean;
-    visible?: boolean;
-    innerRef?: Ref<HTMLDivElement | null>;
-    role?: "tooltip" | "dialog" | "popup";
-    'data-testid'?: string;
-    hasArrow?: boolean;
-    onClose?: () => void;
-    tabIndex?: number;
-    onKeyDown?: import("react").KeyboardEventHandler;
-    'aria-haspopup'?: import("react").HTMLAttributes<HTMLDivElement>["aria-haspopup"];
-    hideOnClickOutside?: boolean;
-    debounceDelay?: number;
-    maxHeight?: string | number;
-    disableAnimation?: boolean;
-    portalTarget?: HTMLElement;
-    dynamicDomRendering?: boolean;
-    style?: import("react").CSSProperties;
-} & import("react").RefAttributes<HTMLDivElement>, "style" | "align" | "dynamicDomRendering"> & import("react").RefAttributes<HTMLDivElement>>;
+    className?: string | undefined;
+    containerFullWidth?: boolean | undefined;
+    containerFullHeight?: boolean | undefined;
+    visible?: boolean | undefined;
+    innerRef?: Ref<HTMLDivElement | null> | undefined;
+    role?: ("dialog" | "popup" | "tooltip") | undefined;
+    'data-testid'?: string | undefined;
+    hasArrow?: boolean | undefined;
+    onClose?: (() => void) | undefined;
+    tabIndex?: number | undefined;
+    onKeyDown?: import("react").KeyboardEventHandler | undefined;
+    'aria-haspopup'?: "dialog" | "false" | "grid" | "listbox" | "menu" | "tree" | "true" | boolean | undefined;
+    hideOnClickOutside?: boolean | undefined;
+    debounceDelay?: number | undefined;
+    maxHeight?: string | number | undefined;
+    disableAnimation?: boolean | undefined;
+    portalTarget?: HTMLElement | undefined;
+    dynamicDomRendering?: boolean | undefined;
+    style?: import("react").CSSProperties | undefined;
+} & import("react").RefAttributes<HTMLDivElement>, "align" | "dynamicDomRendering" | "style"> & import("react").RefAttributes<HTMLDivElement>>;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Popover/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAY3D,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAGhC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAG7C,KAAK,aAAa,GAAG,SAAS,GAAG,SAAS,CAAA;AAuE1C;;;GAGG;AACH,eAAO,MAAM,OAAO;cA1BR,SAAS;aACV,SAAS;WACX,MAAM;gBACD,aAAa;cACf,OAAO;WACV,MAAM,OAAO,WAAW;cACrB,MAAM,IAAI;gBACR,MAAM;oBACF,MAAM;eACX,MAAM;gBACL,MAAM;IAClB;;;OAGG;mBACY,WAAW;gBACd,OAAO,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,CAAC,WAAW,CAAC,EAAE,aAAa,CAAC;;;;iBAjB/E,CADA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;8IA6GC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAkB,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAkB3D,KAAK,aAAa,GAAG,SAAS,GAAG,SAAS,CAAA;AAuE1C;;;GAGG;AACH,eAAO,MAAM,OAAO;;;;;;;;;;;;IAflB;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;8IA6FJ,CAAA"}

package/dist/components/Popover/index.js

@@ -1,126 +1,95 @@
-"use client";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { CloseIcon } from "@ultraviolet/icons/CloseIcon";
-import { cn } from "@ultraviolet/utils";
-import { forwardRef, useRef, useContext, useState, useEffect, useCallback, useMemo } from "react";
-import { Button } from "../Button/index.js";
-import { ModalContext } from "../Modal/ModalProvider.js";
-import { Popup } from "../Popup/index.js";
+'use client';
+import { __name } from "../../_virtual/_rolldown/runtime.js";
 import { Stack } from "../Stack/index.js";
+import { Popup } from "../Popup/index.js";
 import { Text } from "../Text/index.js";
+import { Button } from "../Button/index.js";
+import { ModalContext } from "../Modal/ModalProvider.js";
 import { popover, stackPopover } from "./styles.css.js";
-const ContentWrapper = ({
-  title,
-  onClose,
-  children,
-  sentiment
-}) => /* @__PURE__ */ jsxs(Stack, { className: stackPopover, gap: 1, children: [
-  /* @__PURE__ */ jsxs(Stack, { direction: "row", justifyContent: "space-between", children: [
-    /* @__PURE__ */ jsx(
-      Text,
-      {
-        as: "h3",
-        prominence: sentiment === "neutral" ? "strong" : "stronger",
-        sentiment: sentiment === "neutral" ? "neutral" : "white",
-        variant: "bodyStrong",
-        children: title
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      Button,
-      {
-        "aria-label": "close",
-        onClick: onClose,
-        sentiment: sentiment === "neutral" ? "neutral" : "primary",
-        size: "small",
-        variant: sentiment === "neutral" ? "ghost" : "filled",
-        children: /* @__PURE__ */ jsx(CloseIcon, {})
-      }
-    )
-  ] }),
-  typeof children === "string" ? /* @__PURE__ */ jsx(
-    Text,
-    {
-      as: "p",
-      prominence: sentiment === "neutral" ? "strong" : "stronger",
-      sentiment: sentiment === "neutral" ? "neutral" : "white",
-      variant: "bodySmall",
-      children
-    }
-  ) : children
-] });
-const Popover = forwardRef(
-  ({
-    visible = false,
-    children,
-    placement,
-    content,
-    title,
-    sentiment = "neutral",
-    size = "medium",
-    onClose,
-    className,
-    maxWidth,
-    maxHeight,
-    "data-testid": dataTestId,
-    portalTarget,
-    dynamicDomRendering,
-    align,
-    style
-  }, ref) => {
-    const innerRef = useRef(null);
-    const isInsideModal = useContext(ModalContext);
-    const [localVisible, setLocalVisible] = useState(visible);
-    useEffect(() => {
-      setLocalVisible(visible);
-    }, [visible]);
-    const localOnClose = useCallback(() => {
-      setLocalVisible(false);
-      onClose?.();
-    }, [onClose]);
-    const smartPortalTarget = useMemo(() => {
-      if (!portalTarget && isInsideModal) {
-        return void 0;
-      }
-      if (!(portalTarget || isInsideModal)) {
-        return document.body;
-      }
-      return portalTarget;
-    }, [isInsideModal, portalTarget]);
-    return /* @__PURE__ */ jsx(
-      Popup,
-      {
-        align,
-        className: cn(className, popover({ sentiment, size })),
-        "data-testid": dataTestId,
-        debounceDelay: 0,
-        dynamicDomRendering,
-        hideOnClickOutside: true,
-        innerRef,
-        maxHeight,
-        maxWidth,
-        onClose: localOnClose,
-        placement,
-        portalTarget: smartPortalTarget,
-        ref,
-        role: "dialog",
-        style,
-        tabIndex: -1,
-        text: /* @__PURE__ */ jsx(
-          ContentWrapper,
-          {
-            onClose: localOnClose,
-            sentiment,
-            title,
-            children: content
-          }
-        ),
-        visible: localVisible,
-        children
-      }
-    );
-  }
-);
-export {
-  Popover
-};
+import { cn } from "@ultraviolet/utils";
+import { forwardRef, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { CloseIcon } from "@ultraviolet/icons/CloseIcon";
+
+//#region src/components/Popover/index.tsx
+const ContentWrapper = ({ title, onClose, children, sentiment }) => /* @__PURE__ */ jsxs(Stack, {
+	className: stackPopover,
+	gap: 1,
+	children: [/* @__PURE__ */ jsxs(Stack, {
+		direction: "row",
+		justifyContent: "space-between",
+		children: [/* @__PURE__ */ jsx(Text, {
+			as: "h3",
+			prominence: sentiment === "neutral" ? "strong" : "stronger",
+			sentiment: sentiment === "neutral" ? "neutral" : "white",
+			variant: "bodyStrong",
+			children: title
+		}), /* @__PURE__ */ jsx(Button, {
+			"aria-label": "close",
+			onClick: onClose,
+			sentiment: sentiment === "neutral" ? "neutral" : "primary",
+			size: "small",
+			variant: sentiment === "neutral" ? "ghost" : "filled",
+			children: /* @__PURE__ */ jsx(CloseIcon, {})
+		})]
+	}), typeof children === "string" ? /* @__PURE__ */ jsx(Text, {
+		as: "p",
+		prominence: sentiment === "neutral" ? "strong" : "stronger",
+		sentiment: sentiment === "neutral" ? "neutral" : "white",
+		variant: "bodySmall",
+		children
+	}) : children]
+});
+/**
+* Popover component is used to display additional information or actions on top of the main content of the page.
+* It is usually triggered by clicking on a button. It includes a title, a close button and a content area.
+*/
+const Popover = forwardRef(({ visible = false, children, placement, content, title, sentiment = "neutral", size = "medium", onClose, className, maxWidth, maxHeight, "data-testid": dataTestId, portalTarget, dynamicDomRendering, align, style }, ref) => {
+	const innerRef = useRef(null);
+	const isInsideModal = useContext(ModalContext);
+	const [localVisible, setLocalVisible] = useState(visible);
+	useEffect(() => {
+		setLocalVisible(visible);
+	}, [visible]);
+	const localOnClose = useCallback(() => {
+		setLocalVisible(false);
+		onClose === null || onClose === void 0 || onClose();
+	}, [onClose]);
+	const smartPortalTarget = useMemo(() => {
+		if (!portalTarget && isInsideModal) return;
+		if (!(portalTarget || isInsideModal)) return document.body;
+		return portalTarget;
+	}, [isInsideModal, portalTarget]);
+	return /* @__PURE__ */ jsx(Popup, {
+		align,
+		className: cn(className, popover({
+			sentiment,
+			size
+		})),
+		"data-testid": dataTestId,
+		debounceDelay: 0,
+		dynamicDomRendering,
+		hideOnClickOutside: true,
+		innerRef,
+		maxHeight,
+		maxWidth,
+		onClose: localOnClose,
+		placement,
+		portalTarget: smartPortalTarget,
+		ref,
+		role: "dialog",
+		style,
+		tabIndex: -1,
+		text: /* @__PURE__ */ jsx(ContentWrapper, {
+			onClose: localOnClose,
+			sentiment,
+			title,
+			children: content
+		}),
+		visible: localVisible,
+		children
+	});
+});
+
+//#endregion
+export { Popover };

package/dist/components/Popover/styles.css.js

@@ -1,8 +1,24 @@
-/* empty css                          */
+/* empty css                      */
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
-var popover = createRuntimeFn({ defaultClassName: "uv_1awdzfa0", variantClassNames: { sentiment: { neutral: "uv_1awdzfa1", primary: "uv_1awdzfa2" }, size: { large: "uv_1awdzfa3", medium: "uv_1awdzfa4", small: "uv_1awdzfa5" } }, defaultVariants: {}, compoundVariants: [] });
+
+//#region src/components/Popover/styles.css.ts
+var popover = createRuntimeFn({
+	defaultClassName: "uv_1awdzfa0",
+	variantClassNames: {
+		sentiment: {
+			neutral: "uv_1awdzfa1",
+			primary: "uv_1awdzfa2"
+		},
+		size: {
+			large: "uv_1awdzfa3",
+			medium: "uv_1awdzfa4",
+			small: "uv_1awdzfa5"
+		}
+	},
+	defaultVariants: {},
+	compoundVariants: []
+});
 var stackPopover = "uv_1awdzfa6";
-export {
-  popover,
-  stackPopover
-};
+
+//#endregion
+export { popover, stackPopover };

package/dist/components/Popup/helpers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/components/Popup/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,QAAA,MAAM,UAAU,4DAA6D,CAAA;AAE7E,KAAK,UAAU,GAAG,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,CAAC,CAAA;AAE7C,KAAK,gBAAgB,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,MAAM,IAAI,CAAC,SAAS,MAAM,GACxE,GAAG,CAAC,GAAG,CAAC,EAAE,GACV,KAAK,CAAA;AAET,KAAK,cAAc,GACf,gBAAgB,CAAC,OAAO,CAAC,UAAU,EAAE,aAAa,CAAC,EAAE,OAAO,CAAC,GAC7D,MAAM,CAAA;AAEV,MAAM,MAAM,cAAc,GAAG,cAAc,GAAG,UAAU,CAAA;AACxD,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,CAAA;AAM3C,eAAO,MAAM,mBAAmB,IAAI,CAAA;AAGpC,eAAO,MAAM,iBAAiB;;;;;;;;CAQ7B,CAAA;AAuND,KAAK,qBAAqB,GAAG;IAC3B,SAAS,EAAE,cAAc,CAAA;IACzB,WAAW,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IAC7C,QAAQ,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IAC1C,iBAAiB,EAAE,WAAW,CAAA;IAC9B,QAAQ,EAAE,OAAO,CAAA;IACjB,KAAK,EAAE,UAAU,CAAA;CAClB,CAAA;AAED;;GAEG;AAEH,eAAO,MAAM,gBAAgB,GAAI,2EAO9B,qBAAqB;;;;;;;;CAqPvB,CAAA"}
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/components/Popup/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,QAAA,MAAM,UAAU,4DAA6D,CAAA;AAE7E,KAAK,UAAU,GAAG,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,CAAC,CAAA;AAE7C,KAAK,gBAAgB,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,MAAM,IAAI,CAAC,SAAS,MAAM,GACxE,GAAG,CAAC,GAAG,CAAC,EAAE,GACV,KAAK,CAAA;AAET,KAAK,cAAc,GACf,gBAAgB,CAAC,OAAO,CAAC,UAAU,EAAE,aAAa,CAAC,EAAE,OAAO,CAAC,GAC7D,MAAM,CAAA;AAEV,MAAM,MAAM,cAAc,GAAG,cAAc,GAAG,UAAU,CAAA;AACxD,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,CAAA;AAM3C,eAAO,MAAM,mBAAmB,IAAI,CAAA;AAGpC,eAAO,MAAM,iBAAiB;;;;;;;;CAQ7B,CAAA;AAuND,KAAK,qBAAqB,GAAG;IAC3B,SAAS,EAAE,cAAc,CAAA;IACzB,WAAW,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IAC7C,QAAQ,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IAC1C,iBAAiB,EAAE,WAAW,CAAA;IAC9B,QAAQ,EAAE,OAAO,CAAA;IACjB,KAAK,EAAE,UAAU,CAAA;CAClB,CAAA;AAED;;GAEG;AAEH,eAAO,MAAM,gBAAgB;;;;;;;;CA2R5B,CAAA"}