@infonomic/uikit 5.44.0 → 6.0.1

package/dist/components/forms/select.module.css

@@ -7,13 +7,13 @@ infonomic-components;
 
 @layer infonomic-components {
 
-  .content,
-  :global(.infonomic-select-content) {
+  .positioner,
+  :global(.infonomic-select-positioner) {
     z-index: 50;
   }
 
-  .viewport,
-  :global(.infonomic-select-viewport) {
+  .popup,
+  :global(.infonomic-select-popup) {
     z-index: 50;
     margin-top: 2px;
     border: 1px solid var(--surface-panel-border);
@@ -23,33 +23,33 @@ infonomic-components;
     padding: 6px;
   }
 
-  .viewport-xs {
+  .popup-xs {
     padding: 4px;
   }
 
-  .viewport-sm {
+  .popup-sm {
     padding: 4px;
   }
 
-  .viewport-md {
+  .popup-md {
     padding: 6px;
   }
 
-  .viewport-lg {
+  .popup-lg {
     padding: 6px;
   }
 
-  .viewport-xl {
+  .popup-xl {
     padding: 8px;
   }
 
-  .group,
-  :global(.infonomic-select-group) {
+  .list,
+  :global(.infonomic-select-list) {
     z-index: 50;
   }
 
-  .scroll-button,
-  :global(.infonomic-select-scroll-button) {
+  .scroll-arrow,
+  :global(.infonomic-select-scroll-arrow) {
     display: flex;
     align-items: center;
     justify-content: center;
@@ -101,7 +101,7 @@ infonomic-components;
   }
 
   /* size variants — treat current values as 'md' */
-  .viewport-xs .select-item {
+  .popup-xs .select-item {
     font-size: 0.75rem;
     height: 24px;
     padding-right: 28px;
@@ -109,11 +109,11 @@ infonomic-components;
     border-radius: 4px;
   }
 
-  .viewport-xs .select-item-indicator {
+  .popup-xs .select-item-indicator {
     width: 20px;
   }
 
-  .viewport-sm .select-item {
+  .popup-sm .select-item {
     font-size: 0.875rem;
     height: 28px;
     padding-right: 30px;
@@ -121,13 +121,13 @@ infonomic-components;
     border-radius: 5px;
   }
 
-  .viewport-sm .select-item-indicator {
+  .popup-sm .select-item-indicator {
     width: 22px;
   }
 
-  /* .viewport-md — inherits base .select-item values */
+  /* .popup-md — inherits base .select-item values */
 
-  .viewport-lg .select-item {
+  .popup-lg .select-item {
     font-size: 1.125rem;
     height: 34px;
     padding-right: 32px;
@@ -135,11 +135,11 @@ infonomic-components;
     border-radius: 6px;
   }
 
-  .viewport-lg .select-item-indicator {
+  .popup-lg .select-item-indicator {
     width: 24px;
   }
 
-  .viewport-xl .select-item {
+  .popup-xl .select-item {
     font-size: 1.25rem;
     height: 40px;
     padding-right: 36px;
@@ -147,7 +147,7 @@ infonomic-components;
     border-radius: 8px;
   }
 
-  .viewport-xl .select-item-indicator {
+  .popup-xl .select-item-indicator {
     width: 28px;
   }
 }

package/dist/components/forms/select.module.js

@@ -1,20 +1,20 @@
 import "./select_module.css";
 const select_module = {
-    content: "content-Dr272c",
-    viewport: "viewport-avysx0",
-    "viewport-xs": "viewport-xs-ddEB1m",
-    viewportXs: "viewport-xs-ddEB1m",
-    "viewport-sm": "viewport-sm-fUHdZh",
-    viewportSm: "viewport-sm-fUHdZh",
-    "viewport-md": "viewport-md-GHDx8O",
-    viewportMd: "viewport-md-GHDx8O",
-    "viewport-lg": "viewport-lg-joLSnL",
-    viewportLg: "viewport-lg-joLSnL",
-    "viewport-xl": "viewport-xl-RoyZD9",
-    viewportXl: "viewport-xl-RoyZD9",
-    group: "group-MyzEdB",
-    "scroll-button": "scroll-button-JaxK2W",
-    scrollButton: "scroll-button-JaxK2W",
+    positioner: "positioner-iHUR0P",
+    popup: "popup-vKPzXR",
+    "popup-xs": "popup-xs-MqixM9",
+    popupXs: "popup-xs-MqixM9",
+    "popup-sm": "popup-sm-SgOWFs",
+    popupSm: "popup-sm-SgOWFs",
+    "popup-md": "popup-md-TQK5CQ",
+    popupMd: "popup-md-TQK5CQ",
+    "popup-lg": "popup-lg-Y2cTTg",
+    popupLg: "popup-lg-Y2cTTg",
+    "popup-xl": "popup-xl-FuZi4o",
+    popupXl: "popup-xl-FuZi4o",
+    list: "list-fhD9vn",
+    "scroll-arrow": "scroll-arrow-KHl0WA",
+    scrollArrow: "scroll-arrow-KHl0WA",
     "select-item": "select-item-HiANA0",
     selectItem: "select-item-HiANA0",
     "select-item-indicator": "select-item-indicator-nXFGV7",

package/dist/components/forms/select_module.css

@@ -1,11 +1,11 @@
 @layer infonomic-base, infonomic-functional, infonomic-utilities, infonomic-theme, infonomic-typography;
 
 @layer infonomic-components {
-  :is(.content-Dr272c, .infonomic-select-content) {
+  :is(.positioner-iHUR0P, .infonomic-select-positioner) {
     z-index: 50;
   }
 
-  :is(.viewport-avysx0, .infonomic-select-viewport) {
+  :is(.popup-vKPzXR, .infonomic-select-popup) {
     z-index: 50;
     border: 1px solid var(--surface-panel-border);
     box-shadow: var(--shadow-md);
@@ -15,23 +15,23 @@
     padding: 6px;
   }
 
-  .viewport-xs-ddEB1m, .viewport-sm-fUHdZh {
+  .popup-xs-MqixM9, .popup-sm-SgOWFs {
     padding: 4px;
   }
 
-  .viewport-md-GHDx8O, .viewport-lg-joLSnL {
+  .popup-md-TQK5CQ, .popup-lg-Y2cTTg {
     padding: 6px;
   }
 
-  .viewport-xl-RoyZD9 {
+  .popup-xl-FuZi4o {
     padding: 8px;
   }
 
-  :is(.group-MyzEdB, .infonomic-select-group) {
+  :is(.list-fhD9vn, .infonomic-select-list) {
     z-index: 50;
   }
 
-  :is(.scroll-button-JaxK2W, .infonomic-select-scroll-button) {
+  :is(.scroll-arrow-KHl0WA, .infonomic-select-scroll-arrow) {
     color: var(--surface-item-text);
     border: 1px solid var(--surface-panel-border);
     box-shadow: var(--shadow-md);
@@ -90,7 +90,7 @@
     left: 0;
   }
 
-  .viewport-xs-ddEB1m .select-item-HiANA0 {
+  .popup-xs-MqixM9 .select-item-HiANA0 {
     border-radius: 4px;
     height: 24px;
     padding-left: 20px;
@@ -98,11 +98,11 @@
     font-size: .75rem;
   }
 
-  .viewport-xs-ddEB1m .select-item-indicator-nXFGV7 {
+  .popup-xs-MqixM9 .select-item-indicator-nXFGV7 {
     width: 20px;
   }
 
-  .viewport-sm-fUHdZh .select-item-HiANA0 {
+  .popup-sm-SgOWFs .select-item-HiANA0 {
     border-radius: 5px;
     height: 28px;
     padding-left: 22px;
@@ -110,11 +110,11 @@
     font-size: .875rem;
   }
 
-  .viewport-sm-fUHdZh .select-item-indicator-nXFGV7 {
+  .popup-sm-SgOWFs .select-item-indicator-nXFGV7 {
     width: 22px;
   }
 
-  .viewport-lg-joLSnL .select-item-HiANA0 {
+  .popup-lg-Y2cTTg .select-item-HiANA0 {
     border-radius: 6px;
     height: 34px;
     padding-left: 24px;
@@ -122,11 +122,11 @@
     font-size: 1.125rem;
   }
 
-  .viewport-lg-joLSnL .select-item-indicator-nXFGV7 {
+  .popup-lg-Y2cTTg .select-item-indicator-nXFGV7 {
     width: 24px;
   }
 
-  .viewport-xl-RoyZD9 .select-item-HiANA0 {
+  .popup-xl-FuZi4o .select-item-HiANA0 {
     border-radius: 8px;
     height: 40px;
     padding-left: 28px;
@@ -134,7 +134,7 @@
     font-size: 1.25rem;
   }
 
-  .viewport-xl-RoyZD9 .select-item-indicator-nXFGV7 {
+  .popup-xl-FuZi4o .select-item-indicator-nXFGV7 {
     width: 28px;
   }
 }

package/dist/components/notifications/@types/toast.d.ts

@@ -19,14 +19,14 @@ import type { Icons as i, Position as p, Intent as t } from '../../@types/shared
  */
 export type Intent = 'primary' | t;
 /**
- * Screen corner position for the toast container.
+ * Screen corner position for the toast viewport.
  *
  * - `top-left`     — top-left corner of the viewport
  * - `top-right`    — top-right corner of the viewport (default)
  * - `bottom-left`  — bottom-left corner of the viewport
  * - `bottom-right` — bottom-right corner of the viewport
  *
- * @default 'top-right'
+ * @default 'bottom-right'
  */
 export type Position = 'top-right' | p;
 /**
@@ -35,10 +35,12 @@ export type Position = 'top-right' | p;
  */
 export type IconType = 'success' | i;
 /**
- * Callback fired when the toast's open/visible state changes.
- * Use this to sync dismissal with external state.
- *
- * @param open - `true` when the toast becomes visible, `false` when dismissed
+ * Custom data passed to each toast via the toast manager's `add()` method.
  */
-export type OnOpenChange = (open: boolean) => void;
+export interface ToastData {
+    intent?: Intent;
+    iconType?: IconType;
+    icon?: boolean;
+    close?: boolean;
+}
 //# sourceMappingURL=toast.d.ts.map

package/dist/components/notifications/@types/toast.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../../src/components/notifications/@types/toast.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,IAAI,CAAC,EAAE,QAAQ,IAAI,CAAC,EAAE,MAAM,IAAI,CAAC,EAAE,MAAM,wBAAwB,CAAA;AAEpF;;GAEG;AAIH;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,MAAM,GAAG,SAAS,GAAG,CAAC,CAAA;AAElC;;;;;;;;;GASG;AACH,MAAM,MAAM,QAAQ,GAAG,WAAW,GAAG,CAAC,CAAA;AAEtC;;;GAGG;AACH,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,CAAC,CAAA;AAEpC;;;;;GAKG;AACH,MAAM,MAAM,YAAY,GAAG,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA"}
+{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../../src/components/notifications/@types/toast.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,IAAI,CAAC,EAAE,QAAQ,IAAI,CAAC,EAAE,MAAM,IAAI,CAAC,EAAE,MAAM,wBAAwB,CAAA;AAEpF;;GAEG;AAIH;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,MAAM,GAAG,SAAS,GAAG,CAAC,CAAA;AAElC;;;;;;;;;GASG;AACH,MAAM,MAAM,QAAQ,GAAG,WAAW,GAAG,CAAC,CAAA;AAEtC;;;GAGG;AACH,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,CAAC,CAAA;AAEpC;;GAEG;AACH,MAAM,WAAW,SAAS;IACxB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB"}

package/dist/components/notifications/toast.d.ts

@@ -1,21 +1,17 @@
 import React from 'react';
-import { Toast as ToastPrimitive } from 'radix-ui';
-import type { IconType, Intent, OnOpenChange, Position } from './@types/toast.js';
-export interface ToastProps extends React.InputHTMLAttributes<HTMLLIElement> {
-    intent?: Intent;
+import type { Position, ToastData } from './@types/toast.js';
+export declare const useToastManager: () => import("@base-ui/react").UseToastManagerReturnValue<ToastData>;
+export declare const createToastManager: () => import("@base-ui/react").ToastManager<ToastData>;
+export interface ToastProviderProps {
+    children: React.ReactNode;
+    timeout?: number;
+    limit?: number;
+    toastManager?: ReturnType<typeof createToastManager>;
+}
+export declare function ToastProvider({ children, timeout, limit, toastManager, }: ToastProviderProps): React.JSX.Element;
+export interface ToastViewportProps {
     position?: Position;
-    title: string;
-    message: string;
-    icon?: boolean;
-    iconType?: IconType;
-    close?: boolean;
-    open: boolean;
-    onOpenChange: OnOpenChange;
     className?: string;
 }
-export declare const ToastProvider: React.FC<ToastPrimitive.ToastProviderProps>;
-export declare const ToastViewport: React.ForwardRefExoticComponent<ToastPrimitive.ToastViewportProps & React.RefAttributes<HTMLOListElement>>;
-export declare const Toast: ({ ref, intent, position, title, message, icon, iconType, close, open, onOpenChange, className, }: ToastProps & {
-    ref?: React.RefObject<HTMLLIElement>;
-}) => React.JSX.Element;
+export declare function ToastViewport({ position, className }: ToastViewportProps): React.JSX.Element;
 //# sourceMappingURL=toast.d.ts.map

package/dist/components/notifications/toast.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../src/components/notifications/toast.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,EAAE,KAAK,IAAI,cAAc,EAAE,MAAM,UAAU,CAAA;AASlD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AASjF,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,mBAAmB,CAAC,aAAa,CAAC;IAC1E,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,YAAY,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,eAAO,MAAM,aAAa,6CAA0B,CAAA;AACpD,eAAO,MAAM,aAAa,4GAA0B,CAAA;AAIpD,eAAO,MAAM,KAAK,GAAkB,kGAYjC,UAAU,GAAG;IACd,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,CAAA;CACrC,sBAqEA,CAAA"}
+{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../src/components/notifications/toast.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAYzB,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAA;AAU5D,eAAO,MAAM,eAAe,sEAA4C,CAAA;AACxE,eAAO,MAAM,kBAAkB,wDAA+C,CAAA;AAE9E,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAA;CACrD;AAED,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,OAAc,EACd,KAAS,EACT,YAAY,GACb,EAAE,kBAAkB,qBAMpB;AAED,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,aAAa,CAAC,EAAE,QAAyB,EAAE,SAAS,EAAE,EAAE,kBAAkB,qBAazF"}

package/dist/components/notifications/toast.js

@@ -1,9 +1,8 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import react from "react";
-import { useFocusTrap, useMergedRef } from "@mantine/hooks";
+import { Toast } from "@base-ui/react/toast";
 import classnames from "classnames";
-import { Toast as external_radix_ui_Toast } from "radix-ui";
 import { CloseIcon } from "../../icons/close-icon.js";
 import { DangerIcon } from "../../icons/danger-icon.js";
 import { InfoIcon } from "../../icons/info-icon.js";
@@ -17,66 +16,83 @@ const toastIcons = {
     warning: WarningIcon,
     danger: DangerIcon
 };
-const ToastProvider = external_radix_ui_Toast.Provider;
-const ToastViewport = external_radix_ui_Toast.Viewport;
-const toast_Toast = function({ ref, intent = 'success', position = 'bottom-right', title, message, icon = true, iconType = 'success', close = true, open, onOpenChange, className }) {
+const useToastManager = Toast.useToastManager;
+const createToastManager = Toast.createToastManager;
+function ToastProvider({ children, timeout = 5000, limit = 3, toastManager }) {
+    return /*#__PURE__*/ jsx(Toast.Provider, {
+        timeout: timeout,
+        limit: limit,
+        toastManager: toastManager,
+        children: children
+    });
+}
+function ToastViewport({ position = 'bottom-right', className }) {
+    const { toasts } = Toast.useToastManager();
+    return /*#__PURE__*/ jsx(Toast.Portal, {
+        children: /*#__PURE__*/ jsx(Toast.Viewport, {
+            className: classnames('infonomic-toast-viewport', toast_module.viewport, toast_module[position], className),
+            children: toasts.map((toast)=>/*#__PURE__*/ jsx(ToastItem, {
+                    toast: toast
+                }, toast.id))
+        })
+    });
+}
+function ToastItem({ toast }) {
+    const { intent = 'success', iconType = 'success', icon = true, close = true } = toast.data ?? {};
     const eventDateRef = react.useRef(new Date());
-    react.useRef(0);
-    const focusTrapRef = useFocusTrap();
-    const mergedRef = useMergedRef(ref, focusTrapRef);
     const Icon = toastIcons[iconType];
-    const handleOnClose = ()=>{
-        if (null != onOpenChange) onOpenChange(false);
-    };
-    return /*#__PURE__*/ jsxs(external_radix_ui_Toast.Root, {
-        ref: mergedRef,
-        className: classnames('infonomic-toast', toast_module.root, toast_module[position]),
-        open: open,
-        onOpenChange: onOpenChange,
-        children: [
-            /*#__PURE__*/ jsxs("div", {
-                className: classnames('infonomic-toast-header', toast_module.header),
-                children: [
-                    /*#__PURE__*/ jsx("time", {
-                        dateTime: eventDateRef.current.toISOString(),
-                        className: "text-sm",
-                        children: new Intl.DateTimeFormat('default', {
-                            hour12: true,
-                            hour: 'numeric',
-                            minute: 'numeric'
-                        }).format(eventDateRef.current)
-                    }),
-                    true === close && /*#__PURE__*/ jsx(external_radix_ui_Toast.Close, {
-                        "aria-label": "Close",
-                        asChild: true,
-                        children: /*#__PURE__*/ jsx(Button, {
-                            intent: intent,
-                            tabIndex: 0,
-                            variant: "filled",
-                            "aria-label": "Close",
-                            className: classnames('infonomic-toast-close', toast_module.close),
-                            type: "button",
-                            onClick: handleOnClose,
+    const swipeDirection = react.useMemo(()=>[
+            'down',
+            'right'
+        ], []);
+    return /*#__PURE__*/ jsx(Toast.Root, {
+        toast: toast,
+        swipeDirection: swipeDirection,
+        className: classnames('infonomic-toast', toast_module.root),
+        children: /*#__PURE__*/ jsxs(Toast.Content, {
+            className: classnames('infonomic-toast-content', toast_module.content),
+            children: [
+                /*#__PURE__*/ jsxs("div", {
+                    className: classnames('infonomic-toast-header', toast_module.header),
+                    children: [
+                        /*#__PURE__*/ jsx("time", {
+                            dateTime: eventDateRef.current.toISOString(),
+                            className: "text-sm",
+                            children: new Intl.DateTimeFormat('default', {
+                                hour12: true,
+                                hour: 'numeric',
+                                minute: 'numeric'
+                            }).format(eventDateRef.current)
+                        }),
+                        close && /*#__PURE__*/ jsx(Toast.Close, {
+                            render: /*#__PURE__*/ jsx(Button, {
+                                intent: intent,
+                                tabIndex: 0,
+                                variant: "filled",
+                                "aria-label": "Close",
+                                className: classnames('infonomic-toast-close', toast_module.close),
+                                type: "button"
+                            }),
                             children: /*#__PURE__*/ jsx(CloseIcon, {
                                 height: "12px",
                                 width: "12px"
                             })
                         })
-                    })
-                ]
-            }),
-            /*#__PURE__*/ jsxs(external_radix_ui_Toast.Title, {
-                className: classnames('infonomic-toast-title', toast_module.title),
-                children: [
-                    null != icon && /*#__PURE__*/ jsx(Icon, {}),
-                    title
-                ]
-            }),
-            /*#__PURE__*/ jsx(external_radix_ui_Toast.Description, {
-                className: classnames("infonomic-toast-description", toast_module.description),
-                children: message
-            })
-        ]
+                    ]
+                }),
+                /*#__PURE__*/ jsxs(Toast.Title, {
+                    className: classnames('infonomic-toast-title', toast_module.title),
+                    children: [
+                        icon && Icon && /*#__PURE__*/ jsx(Icon, {}),
+                        toast.title
+                    ]
+                }),
+                /*#__PURE__*/ jsx(Toast.Description, {
+                    className: classnames("infonomic-toast-description", toast_module.description),
+                    children: toast.description
+                })
+            ]
+        })
     });
-};
-export { ToastProvider, ToastViewport, toast_Toast as Toast };
+}
+export { ToastProvider, ToastViewport, createToastManager, useToastManager };