react-restyle-components 0.4.22 → 0.4.24

package/lib/src/core-components/src/components/AlertBanner/AlertBanner.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { AlertBannerProps } from './types';
+export declare const AlertBanner: React.ForwardRefExoticComponent<AlertBannerProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=AlertBanner.d.ts.map

package/lib/src/core-components/src/components/AlertBanner/AlertBanner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlertBanner.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/AlertBanner/AlertBanner.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAahE,OAAO,EAAC,gBAAgB,EAAkB,MAAM,SAAS,CAAC;AAwD1D,eAAO,MAAM,WAAW,yFA6FvB,CAAC"}

package/lib/src/core-components/src/components/AlertBanner/AlertBanner.js

@@ -0,0 +1,45 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useEffect, useCallback } from 'react';
+import { AlertBannerContainer, IconWrapper, ContentWrapper, Title, Message, ActionsWrapper, ActionButton, DismissButton, } from './elements';
+// Default icons for each type
+const InfoIcon = () => (_jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [_jsx("circle", { cx: "12", cy: "12", r: "10" }), _jsx("line", { x1: "12", y1: "16", x2: "12", y2: "12" }), _jsx("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })] }));
+const SuccessIcon = () => (_jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [_jsx("path", { d: "M22 11.08V12a10 10 0 1 1-5.93-9.14" }), _jsx("polyline", { points: "22 4 12 14.01 9 11.01" })] }));
+const WarningIcon = () => (_jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [_jsx("path", { d: "M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" }), _jsx("line", { x1: "12", y1: "9", x2: "12", y2: "13" }), _jsx("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })] }));
+const ErrorIcon = () => (_jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [_jsx("circle", { cx: "12", cy: "12", r: "10" }), _jsx("line", { x1: "15", y1: "9", x2: "9", y2: "15" }), _jsx("line", { x1: "9", y1: "9", x2: "15", y2: "15" })] }));
+const CloseIcon = () => (_jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [_jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), _jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })] }));
+const getDefaultIcon = (type) => {
+    switch (type) {
+        case 'info':
+            return _jsx(InfoIcon, {});
+        case 'success':
+            return _jsx(SuccessIcon, {});
+        case 'warning':
+            return _jsx(WarningIcon, {});
+        case 'error':
+            return _jsx(ErrorIcon, {});
+        default:
+            return _jsx(InfoIcon, {});
+    }
+};
+export const AlertBanner = forwardRef(function AlertBannerComponent(props, ref) {
+    const { children, type = 'info', variant = 'inline', size = 'medium', isOpen = true, onClose, hideDismissButton = false, icon, showIcon = true, action, title, autoDismiss, animated = true, className, ...rest } = props;
+    // Auto dismiss
+    useEffect(() => {
+        if (autoDismiss && isOpen && onClose) {
+            const timer = setTimeout(() => {
+                onClose();
+            }, autoDismiss);
+            return () => clearTimeout(timer);
+        }
+    }, [autoDismiss, isOpen, onClose]);
+    const handleClose = useCallback((e) => {
+        onClose?.(e);
+    }, [onClose]);
+    const handleAction = useCallback(() => {
+        action?.onClick?.();
+    }, [action]);
+    const displayIcon = icon || (showIcon ? getDefaultIcon(type) : null);
+    return (_jsxs(AlertBannerContainer, { ref: ref, "$type": type, "$variant": variant, "$size": size, "$isOpen": isOpen, "$animated": animated, role: "alert", "aria-live": "polite", "data-aui": "alert-banner", className: className, ...rest, children: [displayIcon && (_jsx(IconWrapper, { "$type": type, "$size": size, "aria-hidden": "true", children: displayIcon })), _jsxs(ContentWrapper, { children: [title && _jsx(Title, { "$size": size, children: title }), _jsx(Message, { children: children })] }), _jsxs(ActionsWrapper, { children: [action && (_jsx(ActionButton, { "$type": type, onClick: handleAction, "aria-label": action.ariaLabel || action.text, children: action.text })), !hideDismissButton && onClose && (_jsx(DismissButton, { "$type": type, "$size": size, onClick: handleClose, "aria-label": "Dismiss alert", children: _jsx(CloseIcon, {}) }))] })] }));
+});
+AlertBanner.displayName = 'AlertBanner';

package/lib/src/core-components/src/components/AlertBanner/elements.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+import { AlertBannerType, AlertBannerVariant, AlertBannerSize } from './types';
+export declare const AlertBannerContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $type: AlertBannerType;
+    $variant: AlertBannerVariant;
+    $size: AlertBannerSize;
+    $isOpen: boolean;
+    $animated: boolean;
+}>> & string;
+export declare const IconWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+    $type: AlertBannerType;
+    $size: AlertBannerSize;
+}>> & string;
+export declare const ContentWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Title: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {
+    $size: AlertBannerSize;
+}>> & string;
+export declare const Message: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ActionsWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ActionButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+    $type: AlertBannerType;
+}>> & string;
+export declare const DismissButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+    $type: AlertBannerType;
+    $size: AlertBannerSize;
+}>> & string;
+//# sourceMappingURL=elements.d.ts.map

package/lib/src/core-components/src/components/AlertBanner/elements.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"elements.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/AlertBanner/elements.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAC,eAAe,EAAE,kBAAkB,EAAE,eAAe,EAAC,MAAM,SAAS,CAAC;AAoF7E,eAAO,MAAM,oBAAoB;WACxB,eAAe;cACZ,kBAAkB;WACrB,eAAe;aACb,OAAO;eACL,OAAO;YA6DnB,CAAC;AAEF,eAAO,MAAM,WAAW;WACf,eAAe;WACf,eAAe;YAcvB,CAAC;AAEF,eAAO,MAAM,cAAc,6NAM1B,CAAC;AAEF,eAAO,MAAM,KAAK;WACT,eAAe;YAOvB,CAAC;AAEF,eAAO,MAAM,OAAO,6NAEnB,CAAC;AAEF,eAAO,MAAM,cAAc,6NAY1B,CAAC;AAEF,eAAO,MAAM,YAAY;WAChB,eAAe;YAqBvB,CAAC;AAEF,eAAO,MAAM,aAAa;WACjB,eAAe;WACf,eAAe;YA+BvB,CAAC"}

package/lib/src/core-components/src/components/AlertBanner/elements.js

@@ -0,0 +1,233 @@
+import { styled, css, keyframes } from 'styled-components';
+import { tokens } from '../../utils/designTokens';
+import { breakpoints } from '../../utils/abstracts';
+// Animations
+const slideIn = keyframes `
+  from {
+    opacity: 0;
+    transform: translateY(-100%);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+`;
+const slideOut = keyframes `
+  from {
+    opacity: 1;
+    transform: translateY(0);
+  }
+  to {
+    opacity: 0;
+    transform: translateY(-100%);
+  }
+`;
+// Type colors
+const typeStyles = {
+    info: {
+        bg: '#e7f3ff',
+        border: '#3b82f6',
+        text: '#1e40af',
+        icon: '#3b82f6',
+    },
+    success: {
+        bg: '#ecfdf5',
+        border: '#10b981',
+        text: '#065f46',
+        icon: '#10b981',
+    },
+    warning: {
+        bg: '#fffbeb',
+        border: '#f59e0b',
+        text: '#92400e',
+        icon: '#f59e0b',
+    },
+    error: {
+        bg: '#fef2f2',
+        border: '#ef4444',
+        text: '#991b1b',
+        icon: '#ef4444',
+    },
+    default: {
+        bg: tokens.surface || '#f8f9fa',
+        border: tokens.outline || '#e9ecef',
+        text: tokens.onSurface || '#1a1a2e',
+        icon: tokens.primary || '#454cbf',
+    },
+    dark: {
+        bg: '#1f2937',
+        border: '#374151',
+        text: '#f9fafb',
+        icon: '#9ca3af',
+    },
+};
+// Size styles
+const sizeStyles = {
+    small: {
+        padding: '0.5rem 0.75rem',
+        fontSize: '0.8125rem',
+        iconSize: '16px',
+    },
+    medium: {
+        padding: '0.75rem 1rem',
+        fontSize: '0.875rem',
+        iconSize: '20px',
+    },
+    large: {
+        padding: '1rem 1.25rem',
+        fontSize: '1rem',
+        iconSize: '24px',
+    },
+};
+export const AlertBannerContainer = styled.div `
+  display: ${({ $isOpen }) => ($isOpen ? 'flex' : 'none')};
+  align-items: flex-start;
+  gap: ${tokens.spacing100 || '0.5rem'};
+  width: 100%;
+  box-sizing: border-box;
+  
+  /* Type colors */
+  background: ${({ $type }) => typeStyles[$type].bg};
+  border: 1px solid ${({ $type }) => typeStyles[$type].border};
+  color: ${({ $type }) => typeStyles[$type].text};
+  
+  /* Size styles */
+  padding: ${({ $size }) => sizeStyles[$size].padding};
+  font-size: ${({ $size }) => sizeStyles[$size].fontSize};
+  
+  /* Variant styles */
+  ${({ $variant }) => $variant === 'banner' &&
+    css `
+      border-radius: 0;
+      border-left: none;
+      border-right: none;
+    `}
+  
+  ${({ $variant }) => $variant === 'inline' &&
+    css `
+      border-radius: ${tokens.borderRadius100 || '8px'};
+    `}
+  
+  ${({ $variant }) => $variant === 'floating' &&
+    css `
+      border-radius: ${tokens.borderRadius100 || '8px'};
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+      position: fixed;
+      top: 1rem;
+      left: 50%;
+      transform: translateX(-50%);
+      max-width: calc(100% - 2rem);
+      z-index: 1000;
+      
+      ${breakpoints.md} {
+        max-width: 600px;
+      }
+    `}
+  
+  /* Animation */
+  ${({ $animated, $isOpen }) => $animated &&
+    css `
+      animation: ${$isOpen ? slideIn : slideOut} 0.3s ease-out;
+    `}
+  
+  /* Responsive */
+  ${breakpoints.xs} {
+    flex-direction: column;
+    align-items: stretch;
+  }
+`;
+export const IconWrapper = styled.span `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: ${({ $type }) => typeStyles[$type].icon};
+  width: ${({ $size }) => sizeStyles[$size].iconSize};
+  height: ${({ $size }) => sizeStyles[$size].iconSize};
+  
+  svg {
+    width: 100%;
+    height: 100%;
+  }
+`;
+export const ContentWrapper = styled.div `
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: ${tokens.spacing050 || '0.25rem'};
+  min-width: 0;
+`;
+export const Title = styled.strong `
+  font-weight: 600;
+  font-size: ${({ $size }) => $size === 'small' ? '0.875rem' :
+    $size === 'large' ? '1.125rem' : '1rem'};
+  line-height: 1.4;
+`;
+export const Message = styled.div `
+  line-height: 1.5;
+`;
+export const ActionsWrapper = styled.div `
+  display: flex;
+  align-items: center;
+  gap: ${tokens.spacing100 || '0.5rem'};
+  flex-shrink: 0;
+  margin-left: auto;
+  
+  ${breakpoints.xs} {
+    margin-left: 0;
+    margin-top: ${tokens.spacing100 || '0.5rem'};
+    justify-content: flex-end;
+  }
+`;
+export const ActionButton = styled.button `
+  background: transparent;
+  border: 1px solid ${({ $type }) => typeStyles[$type].border};
+  color: ${({ $type }) => typeStyles[$type].text};
+  padding: 0.375rem 0.75rem;
+  border-radius: ${tokens.borderRadius050 || '4px'};
+  font-size: 0.8125rem;
+  font-weight: 500;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  white-space: nowrap;
+  
+  &:hover {
+    background: ${({ $type }) => typeStyles[$type].border}20;
+  }
+  
+  &:focus-visible {
+    outline: 2px solid ${({ $type }) => typeStyles[$type].border};
+    outline-offset: 2px;
+  }
+`;
+export const DismissButton = styled.button `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: transparent;
+  border: none;
+  color: ${({ $type }) => typeStyles[$type].text};
+  padding: 0.25rem;
+  border-radius: ${tokens.borderRadius050 || '4px'};
+  cursor: pointer;
+  transition: all 0.2s ease;
+  opacity: 0.7;
+  flex-shrink: 0;
+  width: ${({ $size }) => sizeStyles[$size].iconSize};
+  height: ${({ $size }) => sizeStyles[$size].iconSize};
+  
+  &:hover {
+    opacity: 1;
+    background: ${({ $type }) => typeStyles[$type].border}20;
+  }
+  
+  &:focus-visible {
+    outline: 2px solid ${({ $type }) => typeStyles[$type].border};
+    outline-offset: 2px;
+  }
+  
+  svg {
+    width: 100%;
+    height: 100%;
+  }
+`;

package/lib/src/core-components/src/components/AlertBanner/index.d.ts

@@ -0,0 +1,3 @@
+export { AlertBanner } from './AlertBanner';
+export * from './types';
+//# sourceMappingURL=index.d.ts.map

package/lib/src/core-components/src/components/AlertBanner/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/AlertBanner/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,cAAc,SAAS,CAAC"}

package/lib/src/core-components/src/components/AlertBanner/index.js

@@ -0,0 +1,2 @@
+export { AlertBanner } from './AlertBanner';
+export * from './types';

package/lib/src/core-components/src/components/AlertBanner/types.d.ts

@@ -0,0 +1,46 @@
+import React from 'react';
+export declare const ALERT_BANNER_TYPES: readonly ["info", "success", "warning", "error", "default", "dark"];
+export type AlertBannerType = (typeof ALERT_BANNER_TYPES)[number];
+export declare const ALERT_BANNER_VARIANTS: readonly ["banner", "inline", "floating"];
+export type AlertBannerVariant = (typeof ALERT_BANNER_VARIANTS)[number];
+export declare const ALERT_BANNER_SIZES: readonly ["small", "medium", "large"];
+export type AlertBannerSize = (typeof ALERT_BANNER_SIZES)[number];
+export interface AlertBannerActionProps {
+    /** Action button text */
+    text: string;
+    /** Action button click handler */
+    onClick?: () => void;
+    /** ARIA label for the action button */
+    ariaLabel?: string;
+}
+export interface AlertBannerProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Children content */
+    children?: React.ReactNode;
+    /** Alert type determines colors and default icon */
+    type?: AlertBannerType;
+    /** Display variant */
+    variant?: AlertBannerVariant;
+    /** Size of the alert */
+    size?: AlertBannerSize;
+    /** Whether the alert is visible */
+    isOpen?: boolean;
+    /** Dismiss button click handler */
+    onClose?: (e?: React.MouseEvent<HTMLButtonElement>) => void;
+    /** Hide the dismiss button */
+    hideDismissButton?: boolean;
+    /** Custom icon element */
+    icon?: React.ReactNode;
+    /** Show default icon based on type */
+    showIcon?: boolean;
+    /** Action button configuration */
+    action?: AlertBannerActionProps;
+    /** Title text */
+    title?: string;
+    /** Auto dismiss after duration (ms) */
+    autoDismiss?: number;
+    /** Animation on enter/exit */
+    animated?: boolean;
+    /** Additional class names */
+    className?: string;
+}
+//# sourceMappingURL=types.d.ts.map

package/lib/src/core-components/src/components/AlertBanner/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/components/AlertBanner/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,kBAAkB,qEAOrB,CAAC;AACX,MAAM,MAAM,eAAe,GAAG,CAAC,OAAO,kBAAkB,CAAC,CAAC,MAAM,CAAC,CAAC;AAElE,eAAO,MAAM,qBAAqB,2CAA4C,CAAC;AAC/E,MAAM,MAAM,kBAAkB,GAAG,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC;AAExE,eAAO,MAAM,kBAAkB,uCAAwC,CAAC;AACxE,MAAM,MAAM,eAAe,GAAG,CAAC,OAAO,kBAAkB,CAAC,CAAC,MAAM,CAAC,CAAC;AAElE,MAAM,WAAW,sBAAsB;IACrC,yBAAyB;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,kCAAkC;IAClC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,uCAAuC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,gBAAiB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC5E,uBAAuB;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,oDAAoD;IACpD,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,sBAAsB;IACtB,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,wBAAwB;IACxB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,mCAAmC;IACnC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,mCAAmC;IACnC,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC5D,8BAA8B;IAC9B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,0BAA0B;IAC1B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kCAAkC;IAClC,MAAM,CAAC,EAAE,sBAAsB,CAAC;IAChC,iBAAiB;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uCAAuC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB"}

package/lib/src/core-components/src/components/AlertBanner/types.js

@@ -0,0 +1,10 @@
+export const ALERT_BANNER_TYPES = [
+    'info',
+    'success',
+    'warning',
+    'error',
+    'default',
+    'dark',
+];
+export const ALERT_BANNER_VARIANTS = ['banner', 'inline', 'floating'];
+export const ALERT_BANNER_SIZES = ['small', 'medium', 'large'];

package/lib/src/core-components/src/components/AutoComplete/auto-complete-filter-multi-select-selected-top-display/auto-complete-filter-multi-select-selected-top-display.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"auto-complete-filter-multi-select-selected-top-display.component.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/AutoComplete/auto-complete-filter-multi-select-selected-top-display/auto-complete-filter-multi-select-selected-top-display.component.tsx"],"names":[],"mappings":"AAQA,MAAM,WAAW,oDAAoD;IACnE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,GAAG,CAAC;IACV,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC;IACxC,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IAC/B,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,+CAA+C,gKAezD,oDAAoD,4CAsftD,CAAC"}
+{"version":3,"file":"auto-complete-filter-multi-select-selected-top-display.component.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/AutoComplete/auto-complete-filter-multi-select-selected-top-display/auto-complete-filter-multi-select-selected-top-display.component.tsx"],"names":[],"mappings":"AAQA,MAAM,WAAW,oDAAoD;IACnE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,GAAG,CAAC;IACV,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC;IACxC,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IAC/B,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,+CAA+C,gKAezD,oDAAoD,4CA2iBtD,CAAC"}

package/lib/src/core-components/src/components/AutoComplete/auto-complete-filter-multi-select-selected-top-display/auto-complete-filter-multi-select-selected-top-display.component.js

@@ -16,7 +16,26 @@ export const AutoCompleteFilterMultiSelectSelectedTopDisplay = ({ uniqueField =
                 if (ref.current && !ref.current.contains(event.target) && isListOpen) {
                     if (originalOptions && options) {
                         if (isListOpen) {
-                            onUpdate && onUpdate(options.filter((item) => item.selected));
+                            const newSelectedItems = options.filter((item) => item.selected);
+                            // Merge: combine new selected with existing selected that are not in current options
+                            const existingSelected = data.selected || [];
+                            const mergedMap = new Map();
+                            // Add new selected items from options
+                            newSelectedItems.forEach((item) => {
+                                mergedMap.set(item[uniqueField], item);
+                            });
+                            // Add existing selected items that are NOT in the current options list
+                            // (these are filtered out items that should remain selected)
+                            existingSelected.forEach((item) => {
+                                const existsInOptions = options.some((opt) => opt[uniqueField] === item[uniqueField]);
+                                // Only keep if this item is not in the current options
+                                // (if it's in options, user already decided whether to select/unselect it)
+                                if (!existsInOptions) {
+                                    mergedMap.set(item[uniqueField], item);
+                                }
+                            });
+                            const finalSelectedItems = Array.from(mergedMap.values());
+                            onUpdate && onUpdate(finalSelectedItems);
                         }
                     }
                     setIsListOpen(false);
@@ -111,8 +130,26 @@ export const AutoCompleteFilterMultiSelectSelectedTopDisplay = ({ uniqueField =
                                 size: 16,
                                 color: '#000000',
                             } }))] }), isListOpen && (_jsxs("div", { className: cn(s['mt-1'], s['absolute'], s['rounded-md'], s['bg-white'], s['border'], s['border-gray-300'], s['shadow-lg'], s['z-50'], s['w-full'], s['max-h-96'], s['overflow-hidden']), style: { zIndex: 1000 }, children: [_jsx("div", { className: cn(s['p-3'], s['border-b'], s['border-gray-200'], s['bg-gray-50'], s['text-sm'], s['font-medium'], s['text-gray-700']), children: _jsxs("div", { className: cn(s['flex'], s['justify-between'], s['items-center']), children: [_jsxs("span", { children: ["Total Items: ", getTotalItemsCount()] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("span", { className: cn(s['text-blue-600']), children: [getSelectedCount(), " Selected"] }), _jsx("div", { className: cn(s['flex'], s['gap-2']), children: _jsx("button", { type: "button", className: cn(s['text-xs'], s['px-3'], s['py-1'], s['bg-blue-600'], s['text-white'], s['rounded'], s['hover:bg-blue-700'], s['transition-colors']), onClick: () => {
-                                                        onUpdate &&
-                                                            onUpdate(options.filter((item) => item.selected));
+                                                        const newSelectedItems = options.filter((item) => item.selected);
+                                                        // Merge: combine new selected with existing selected that are not in current options
+                                                        const existingSelected = data.selected || [];
+                                                        const mergedMap = new Map();
+                                                        // Add new selected items from options
+                                                        newSelectedItems.forEach((item) => {
+                                                            mergedMap.set(item[uniqueField], item);
+                                                        });
+                                                        // Add existing selected items that are NOT in the current options list
+                                                        // (these are filtered out items that should remain selected)
+                                                        existingSelected.forEach((item) => {
+                                                            const existsInOptions = options.some((opt) => opt[uniqueField] === item[uniqueField]);
+                                                            // Only keep if this item is not in the current options
+                                                            // (if it's in options, user already decided whether to select/unselect it)
+                                                            if (!existsInOptions) {
+                                                                mergedMap.set(item[uniqueField], item);
+                                                            }
+                                                        });
+                                                        const finalSelectedItems = Array.from(mergedMap.values());
+                                                        onUpdate && onUpdate(finalSelectedItems);
                                                         setIsListOpen(false);
                                                         setValue('');
                                                     }, children: "OK" }) })] })] }) }), showSelectAllSection && (_jsxs("div", { className: cn(s['p-3'], s['border-b'], s['border-gray-200'], s['bg-gray-50'], s['flex'], s['justify-between'], s['items-center']), children: [_jsx("span", { className: cn(s['text-sm'], s['font-medium'], s['text-gray-700']), children: "Quick Actions" }), _jsxs("div", { className: cn(s['flex'], s['gap-2']), children: [_jsx("button", { type: "button", onClick: () => handleSelect(true), className: cn(s['text-xs'], s['px-3'], s['py-1'], s['bg-green-500'], s['text-white'], s['rounded'], s['hover:bg-green-600'], s['transition-colors'], getAvailableItemsCount() === 0 && s['opacity-50'], getAvailableItemsCount() === 0 && s['cursor-not-allowed']), disabled: getAvailableItemsCount() === 0, title: "Select all available items", children: "Select All" }), _jsx("button", { type: "button", onClick: () => handleSelect(false), className: cn(s['text-xs'], s['px-3'], s['py-1'], s['bg-gray-500'], s['text-white'], s['rounded'], s['hover:bg-gray-600'], s['transition-colors'], getSelectedCount() === 0 && s['opacity-50'], getSelectedCount() === 0 && s['cursor-not-allowed']), disabled: getSelectedCount() === 0, title: "Deselect all selected items", children: "Clear All" })] })] })), _jsxs("div", { className: cn(s['max-h-80'], s['overflow-y-auto']), children: [data.selected && data.selected.length > 0 && (_jsxs("div", { className: cn(s['border-b'], s['border-gray-200']), children: [_jsx("div", { className: cn(s['p-3'], s['bg-blue-50'], s['border-b'], s['border-blue-200'], s['font-semibold'], s['text-sm'], s['text-blue-700']), children: _jsxs("div", { className: cn(s['flex'], s['items-center'], s['gap-2']), children: [_jsx(Icon, { nameIcon: "FaCheck", propsIcon: {

package/lib/src/core-components/src/components/AutoComplete/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.component.d.ts

@@ -70,7 +70,7 @@ export interface AutoCompleteFilterMultipleSelectMultipleFieldsDisplayProps {
     /** Maximum height for dropdown (e.g., '200px', '300px'). Shows scrollbar when content exceeds this height */
     maxHeight?: string;
     onFilter?: (value: string) => void;
-    onUpdate: (item: any) => void;
+    onUpdate: (selectedItems: any[]) => void;
     onSelect: (item: any) => any;
     onBlur?: (e: any) => void;
 }

package/lib/src/core-components/src/components/AutoComplete/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"auto-complete-filter-multiple-select-multiple-fields-display.component.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/AutoComplete/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.component.tsx"],"names":[],"mappings":"AACA,OAAc,EAA8B,aAAa,EAAC,MAAM,OAAO,CAAC;AAMxE,MAAM,WAAW,+DAA+D;IAC9E,8CAA8C;IAC9C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,2CAA2C;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0DAA0D;IAC1D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wCAAwC;IACxC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qDAAqD;IACrD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gDAAgD;IAChD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,4CAA4C;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,2DAA2D;IAC1E,0CAA0C;IAC1C,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,iEAAiE;IACjE,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,uCAAuC;IACvC,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,sDAAsD;IACtD,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,yCAAyC;IACzC,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,iDAAiD;IACjD,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B,4CAA4C;IAC5C,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,gDAAgD;IAChD,WAAW,CAAC,EAAE,aAAa,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,0DAA0D;IACzE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,GAAG,CAAC;IACV,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4CAA4C;IAC5C,UAAU,CAAC,EAAE,+DAA+D,CAAC;IAC7E,+CAA+C;IAC/C,MAAM,CAAC,EAAE,2DAA2D,CAAC;IACrE,6GAA6G;IAC7G,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,QAAQ,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B,QAAQ,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,GAAG,CAAC;IAC7B,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;CAC3B;AAED,eAAO,MAAM,qDAAqD,kLAiB/D,0DAA0D,4CA0P5D,CAAC"}
+{"version":3,"file":"auto-complete-filter-multiple-select-multiple-fields-display.component.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/AutoComplete/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.component.tsx"],"names":[],"mappings":"AACA,OAAc,EAA8B,aAAa,EAAC,MAAM,OAAO,CAAC;AAMxE,MAAM,WAAW,+DAA+D;IAC9E,8CAA8C;IAC9C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,2CAA2C;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0DAA0D;IAC1D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wCAAwC;IACxC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qDAAqD;IACrD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gDAAgD;IAChD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,4CAA4C;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,2DAA2D;IAC1E,0CAA0C;IAC1C,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,iEAAiE;IACjE,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,uCAAuC;IACvC,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,sDAAsD;IACtD,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,yCAAyC;IACzC,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,iDAAiD;IACjD,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B,4CAA4C;IAC5C,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,gDAAgD;IAChD,WAAW,CAAC,EAAE,aAAa,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,0DAA0D;IACzE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,GAAG,CAAC;IACV,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4CAA4C;IAC5C,UAAU,CAAC,EAAE,+DAA+D,CAAC;IAC7E,+CAA+C;IAC/C,MAAM,CAAC,EAAE,2DAA2D,CAAC;IACrE,6GAA6G;IAC7G,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,QAAQ,EAAE,CAAC,aAAa,EAAE,GAAG,EAAE,KAAK,IAAI,CAAC;IACzC,QAAQ,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,GAAG,CAAC;IAC7B,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;CAC3B;AAED,eAAO,MAAM,qDAAqD,kLAiB/D,0DAA0D,4CAoR5D,CAAC"}

package/lib/src/core-components/src/components/AutoComplete/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.component.js

@@ -16,7 +16,32 @@ export const AutoCompleteFilterMultipleSelectMultipleFieldsDisplay = ({ uniqueFi
                 if (ref.current && !ref.current.contains(event.target) && isListOpen) {
                     if (originalOptions && options) {
                         if (isListOpen) {
-                            onUpdate && onUpdate(data.selected);
+                            const newSelectedItems = options.filter((item) => item.selected);
+                            // Merge: combine new selected with existing selected that are not in current options
+                            const existingSelected = data.selected || [];
+                            const mergedMap = new Map();
+                            // Add new selected items from options
+                            newSelectedItems.forEach((item) => {
+                                mergedMap.set(item[uniqueField], item);
+                            });
+                            // Add existing selected items that are NOT in the current options list
+                            // (these are filtered out items that should remain selected)
+                            existingSelected.forEach((item) => {
+                                const key = isSelectedStringArray ? item : item[uniqueField];
+                                const existsInOptions = options.some((opt) => {
+                                    if (isSelectedStringArray) {
+                                        return opt[uniqueField] === item;
+                                    }
+                                    return opt[uniqueField] === item[uniqueField];
+                                });
+                                // Only keep if this item is not in the current options
+                                // (if it's in options, user already decided whether to select/unselect it)
+                                if (!existsInOptions) {
+                                    mergedMap.set(key, item);
+                                }
+                            });
+                            const finalSelectedItems = Array.from(mergedMap.values());
+                            onUpdate && onUpdate(finalSelectedItems);
                         }
                     }
                     setIsListOpen(false);