@beweco/aurora-ui 0.1.65 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/css/styles.css +1 -1
- package/dist/index.cjs.js +529 -11
- package/dist/index.esm.js +528 -14
- package/dist/types/components/input/Input.d.ts.map +1 -1
- package/dist/types/components/segmentation-builder/SegmentationBuilder.constants.d.ts +8 -0
- package/dist/types/components/segmentation-builder/SegmentationBuilder.constants.d.ts.map +1 -0
- package/dist/types/components/segmentation-builder/SegmentationBuilder.d.ts +4 -0
- package/dist/types/components/segmentation-builder/SegmentationBuilder.d.ts.map +1 -0
- package/dist/types/components/segmentation-builder/SegmentationBuilder.types.d.ts +123 -0
- package/dist/types/components/segmentation-builder/SegmentationBuilder.types.d.ts.map +1 -0
- package/dist/types/components/segmentation-builder/index.d.ts +5 -0
- package/dist/types/components/segmentation-builder/index.d.ts.map +1 -0
- package/dist/types/index.d.ts +2 -0
- package/dist/types/index.d.ts.map +1 -1
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { Skeleton, Button as Button$1, Chip as Chip$1, Accordion, AccordionItem, Pagination as Pagination$1, DatePicker as DatePicker$1, DateRangePicker as DateRangePicker$1, Input as Input$1, RadioGroup, Radio, cn, Card as Card$1, Spacer, Tabs, Tab, Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, Autocomplete, Breadcrumbs, BreadcrumbItem, DropdownSection, Badge, Spinner, ListboxItem, Popover, PopoverTrigger, Tooltip as Tooltip$1, PopoverContent, Listbox, ListboxSection, Avatar, Link, Switch as Switch$1, TimeInput as TimeInput$1, Select as Select$1, Image as Image$1, Table, TableHeader, TableColumn, TableBody, TableRow, TableCell, Textarea as Textarea$1, Alert, Modal as Modal$1, ModalContent as ModalContent$1, ModalHeader as ModalHeader$1, ModalBody as ModalBody$1, Slider, ModalFooter as ModalFooter$1, CardBody, SelectItem, Drawer, DrawerContent, DrawerBody, AutocompleteItem, Divider } from '@heroui/react';
|
|
1
|
+
import { Skeleton, Button as Button$1, Chip as Chip$1, Accordion, AccordionItem, Pagination as Pagination$1, DatePicker as DatePicker$1, DateRangePicker as DateRangePicker$1, Input as Input$1, RadioGroup, Radio, cn, Card as Card$1, Spacer, Tabs, Tab, Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, Autocomplete, Breadcrumbs, BreadcrumbItem, DropdownSection, Badge, Spinner, ListboxItem, Popover, PopoverTrigger, Tooltip as Tooltip$1, PopoverContent, Listbox, ListboxSection, Avatar, Link, Switch as Switch$1, TimeInput as TimeInput$1, Select as Select$1, Image as Image$1, Table, TableHeader, TableColumn, TableBody, TableRow, TableCell, Textarea as Textarea$1, Alert, Modal as Modal$1, ModalContent as ModalContent$1, ModalHeader as ModalHeader$1, ModalBody as ModalBody$1, Slider, ModalFooter as ModalFooter$1, CardBody, SelectItem, Drawer, DrawerContent, DrawerBody, SelectSection, Checkbox, AutocompleteItem, Divider } from '@heroui/react';
|
|
2
2
|
export * from '@heroui/react';
|
|
3
3
|
export { Slider } from '@heroui/react';
|
|
4
4
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
5
5
|
import { Icon } from '@iconify/react';
|
|
6
6
|
export { loadIcons } from '@iconify/react';
|
|
7
|
-
import React, { useId, useState, useCallback, useMemo, useEffect, createContext, useContext, memo, useRef, createElement, useLayoutEffect } from 'react';
|
|
7
|
+
import React, { useId, useState, useCallback, useMemo, useEffect, createContext, useContext, memo, useRef, createElement, useLayoutEffect, forwardRef, useImperativeHandle } from 'react';
|
|
8
8
|
import { ResponsiveContainer, AreaChart, CartesianGrid, XAxis, Tooltip, Area, LineChart, YAxis, Line } from 'recharts';
|
|
9
9
|
import { LazyMotion, domAnimation, m, motion, AnimatePresence } from 'framer-motion';
|
|
10
10
|
import { createPortal } from 'react-dom';
|
|
@@ -338,6 +338,7 @@ var Input = function (_a) {
|
|
|
338
338
|
label: "text-default-600 text-tiny group-data-[filled=true]:text-default-600",
|
|
339
339
|
inputWrapper: "focus-within:!border-primary-500",
|
|
340
340
|
errorMessage: "text-left",
|
|
341
|
+
description: "text-left"
|
|
341
342
|
} })));
|
|
342
343
|
};
|
|
343
344
|
|
|
@@ -1734,12 +1735,12 @@ var NotificationButton = function (_a) {
|
|
|
1734
1735
|
};
|
|
1735
1736
|
NotificationButton.displayName = "NotificationButton";
|
|
1736
1737
|
|
|
1737
|
-
var DEFAULT_TRANSLATIONS$
|
|
1738
|
+
var DEFAULT_TRANSLATIONS$6 = {
|
|
1738
1739
|
logout: "Cerrar sesión",
|
|
1739
1740
|
};
|
|
1740
1741
|
var HeaderComponent = function (_a) {
|
|
1741
1742
|
var notificationCount = _a.notificationCount, options = _a.options, onMenuClick = _a.onMenuClick, onLogout = _a.onLogout, _b = _a.translations, translations = _b === void 0 ? {} : _b, breadcrumbs = _a.breadcrumbs, onNotificationClick = _a.onNotificationClick, onOptionSelect = _a.onOptionSelect, onBreadcrumbClick = _a.onBreadcrumbClick;
|
|
1742
|
-
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
1743
|
+
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$6), translations);
|
|
1743
1744
|
return (jsx("header", { className: "header__container", children: jsxs("div", { className: "flex items-center justify-between w-full", children: [jsxs("div", { className: "flex items-center gap-4", children: [jsx(Button$1, { className: "sm:hidden", isIconOnly: true, variant: "light", startContent: jsx(IconComponent, { icon: "solar:hamburger-menu-linear" }), onPress: onMenuClick }), breadcrumbs && breadcrumbs.length > 0 && (jsx(BreadcrumbsComponent, { items: breadcrumbs, onItemClick: onBreadcrumbClick }))] }), jsxs("div", { className: "flex items-center gap-4", children: [jsx(NotificationButton, { notificationCount: notificationCount, onPress: onNotificationClick }), jsx(ConfigMenu, { options: options, onLogout: onLogout, onOptionSelect: onOptionSelect, translations: t })] })] }) }));
|
|
1744
1745
|
};
|
|
1745
1746
|
HeaderComponent.displayName = "Header";
|
|
@@ -1863,7 +1864,7 @@ KanbanColumn.displayName = "KanbanColumn";
|
|
|
1863
1864
|
* Traducciones por defecto en español.
|
|
1864
1865
|
* Se mezclan con las traducciones proporcionadas por el usuario.
|
|
1865
1866
|
*/
|
|
1866
|
-
var DEFAULT_TRANSLATIONS$
|
|
1867
|
+
var DEFAULT_TRANSLATIONS$5 = {
|
|
1867
1868
|
dropHere: "Soltar aquí",
|
|
1868
1869
|
emptyMessage: "No hay elementos",
|
|
1869
1870
|
};
|
|
@@ -1897,7 +1898,7 @@ var columnGapClasses = {
|
|
|
1897
1898
|
var KanbanComponent = function (_a) {
|
|
1898
1899
|
var columns = _a.columns, renderItem = _a.renderItem, onCardClick = _a.onCardClick, onItemMove = _a.onItemMove, isDraggable = _a.isDraggable, cardClassName = _a.cardClassName, isCardClickable = _a.isCardClickable, className = _a.className, _b = _a.columnWidth, columnWidth = _b === void 0 ? "280px" : _b, _c = _a.columnGap, columnGap = _c === void 0 ? "md" : _c, _d = _a.horizontalScroll, horizontalScroll = _d === void 0 ? true : _d, columnMaxHeight = _a.columnMaxHeight, renderColumnHeader = _a.renderColumnHeader, renderEmptyState = _a.renderEmptyState, _e = _a.translations, translations = _e === void 0 ? {} : _e, onLoadMore = _a.onLoadMore;
|
|
1899
1900
|
// Mezclar traducciones del usuario con las por defecto
|
|
1900
|
-
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
1901
|
+
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$5), translations);
|
|
1901
1902
|
// Determinar si drag está habilitado
|
|
1902
1903
|
var dragEnabled = isDraggable !== null && isDraggable !== void 0 ? isDraggable : !!onItemMove;
|
|
1903
1904
|
// Estado del drag actual
|
|
@@ -2215,7 +2216,7 @@ var MenuNavList = React.forwardRef(function (_a, ref) {
|
|
|
2215
2216
|
});
|
|
2216
2217
|
MenuNavList.displayName = "MenuNavList";
|
|
2217
2218
|
|
|
2218
|
-
var DEFAULT_TRANSLATIONS$
|
|
2219
|
+
var DEFAULT_TRANSLATIONS$4 = {
|
|
2219
2220
|
menuLabel: "Menú",
|
|
2220
2221
|
closeSidebarAriaLabel: "Cerrar menú lateral",
|
|
2221
2222
|
mobileNavAriaLabel: "Navegación móvil",
|
|
@@ -2233,7 +2234,7 @@ var MenuComponent = React.memo(function Menu(_a) {
|
|
|
2233
2234
|
var commerceInfo = _a.commerceInfo, userInfo = _a.userInfo, helpButton = _a.helpButton, isOpenSidebar = _a.isOpenSidebar, onOpenSidebarChange = _a.onOpenSidebarChange, menuItems = _a.menuItems, mobileBottomBarGroupKey = _a.mobileBottomBarGroupKey, _d = _a.showNativeMenu, showNativeMenu = _d === void 0 ? true : _d, _e = _a.translations, translations = _e === void 0 ? {} : _e;
|
|
2234
2235
|
var _f = React.useState(false), isCollapsed = _f[0], setIsCollapsed = _f[1];
|
|
2235
2236
|
var _g = React.useState(false), logoError = _g[0], setLogoError = _g[1];
|
|
2236
|
-
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
2237
|
+
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$4), translations);
|
|
2237
2238
|
var selectedKey = React.useMemo(function () {
|
|
2238
2239
|
var _a, _b, _c;
|
|
2239
2240
|
if (menuItems.selectedPath) {
|
|
@@ -2609,7 +2610,7 @@ var MultiStepSidebar = React.forwardRef(function (_a, ref) {
|
|
|
2609
2610
|
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
2610
2611
|
}
|
|
2611
2612
|
};
|
|
2612
|
-
return (jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-content3/50 backdrop-blur-sm", onClick: handleOverlayClick, children: jsxs("div", __assign({ ref: ref, className: cn("flex h-full w-full max-w-4xl overflow-hidden rounded-lg bg-background shadow-lg lg:h-
|
|
2613
|
+
return (jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-content3/50 backdrop-blur-sm", onClick: handleOverlayClick, children: jsxs("div", __assign({ ref: ref, className: cn("flex h-full w-full max-w-4xl overflow-hidden rounded-lg bg-background shadow-lg lg:h-auto lg:max-h-[85vh]", className) }, props, { children: [jsx("div", { className: cn("hidden h-full w-1/3 flex-col gap-y-8 overflow-y-auto p-8 md:flex [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]", steps.length < 5 ? "justify-center" : "items-start"), children: jsx(VerticalSteps, { className: stepperClasses, color: "primary", currentStep: currentPage, steps: steps, onStepChange: onChangePage, hideInactiveDescriptions: hideInactiveDescriptions }) }), jsxs("div", { className: "relative flex h-full w-full flex-col items-center justify-between gap-4 md:p-4 lg:w-2/3", children: [jsx(Button, { isIconOnly: true, className: "absolute right-4 top-4", size: "sm", variant: "light", color: "default", onPress: onClose, startContent: jsx(IconComponent, { className: "text-foreground", icon: "material-symbols:close-rounded", size: "lg" }) }), jsx("div", { className: "pt-9 w-10/12 md:hidden", children: jsx("div", { className: "flex w-full justify-center", children: jsx(StepIndicator, { className: cn(stepperClasses), currentStep: currentPage + 1, totalSteps: steps.length }) }) }), jsx("div", { className: "flex flex-col h-full w-full justify-between p-4 sm:max-w-md md:max-w-lg overflow-y-auto [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]", children: children })] })] })) }));
|
|
2613
2614
|
});
|
|
2614
2615
|
MultiStepSidebar.displayName = "MultiStepSidebar";
|
|
2615
2616
|
|
|
@@ -4284,7 +4285,7 @@ var AURORAS = [
|
|
|
4284
4285
|
duration: 55,
|
|
4285
4286
|
},
|
|
4286
4287
|
];
|
|
4287
|
-
var DEFAULT_TRANSLATIONS$
|
|
4288
|
+
var DEFAULT_TRANSLATIONS$3 = {
|
|
4288
4289
|
backButtonLabel: "Atras",
|
|
4289
4290
|
};
|
|
4290
4291
|
var BackButton = function (_a) {
|
|
@@ -4320,7 +4321,7 @@ var TwoColumnLayoutAgent = function (_a) {
|
|
|
4320
4321
|
var _b = _a.assistantState, assistantState = _b === void 0 ? "happy" : _b, assistantSpeech = _a.assistantSpeech, _c = _a.assistantSize, assistantSize = _c === void 0 ? "xl" : _c, assistantHint = _a.assistantHint, _d = _a.enableSequence, enableSequence = _d === void 0 ? true : _d, children = _a.children, _e = _a.showBackButton, showBackButton = _e === void 0 ? false : _e, onBack = _a.onBack, _f = _a.translations, translations = _f === void 0 ? {} : _f, _g = _a.className, className = _g === void 0 ? "" : _g;
|
|
4321
4322
|
var _h = useState(!enableSequence), showRightContent = _h[0], setShowRightContent = _h[1];
|
|
4322
4323
|
var isDesktop = useMediaQuery("(min-width: ".concat(DESKTOP_BREAKPOINT_PX, "px)"));
|
|
4323
|
-
var t = useMemo(function () { return (__assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
4324
|
+
var t = useMemo(function () { return (__assign(__assign({}, DEFAULT_TRANSLATIONS$3), translations)); }, [translations]);
|
|
4324
4325
|
var handleBackPress = onBack !== null && onBack !== void 0 ? onBack : (function () { return undefined; });
|
|
4325
4326
|
useEffect(function () {
|
|
4326
4327
|
if (enableSequence && !showRightContent) {
|
|
@@ -4875,7 +4876,7 @@ var UploadFile = function (_a) {
|
|
|
4875
4876
|
};
|
|
4876
4877
|
UploadFile.displayName = "UploadFile";
|
|
4877
4878
|
|
|
4878
|
-
var DEFAULT_TRANSLATIONS$
|
|
4879
|
+
var DEFAULT_TRANSLATIONS$2 = {
|
|
4879
4880
|
businessName: "Tu Negocio",
|
|
4880
4881
|
businessInitials: "TN",
|
|
4881
4882
|
onlineStatus: "en linea",
|
|
@@ -4900,7 +4901,7 @@ var DEFAULT_TRANSLATIONS$1 = {
|
|
|
4900
4901
|
*/
|
|
4901
4902
|
var WhatsAppPreview = function (_a) {
|
|
4902
4903
|
var imageUrl = _a.imageUrl, caption = _a.caption, _b = _a.variant, variant = _b === void 0 ? "compact" : _b, _c = _a.showHeader, showHeader = _c === void 0 ? false : _c, maxCaptionLength = _a.maxCaptionLength, onToggleCaption = _a.onToggleCaption, _d = _a.showFullCaption, showFullCaption = _d === void 0 ? false : _d, ctaType = _a.ctaType, ctaLabel = _a.ctaLabel, ctaValue = _a.ctaValue, _e = _a.campaignView, campaignView = _e === void 0 ? false : _e, _f = _a.translations, translations = _f === void 0 ? {} : _f, _g = _a.className, className = _g === void 0 ? "" : _g, _h = _a.timeLocale, timeLocale = _h === void 0 ? "es-ES" : _h;
|
|
4903
|
-
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
4904
|
+
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$2), translations);
|
|
4904
4905
|
var shouldTruncate = maxCaptionLength && caption.length > maxCaptionLength;
|
|
4905
4906
|
var displayCaption = campaignView
|
|
4906
4907
|
? caption
|
|
@@ -5769,6 +5770,519 @@ var SimpleLineChart = function (_a) {
|
|
|
5769
5770
|
})] }) })] }));
|
|
5770
5771
|
};
|
|
5771
5772
|
|
|
5773
|
+
var DEFAULT_OPERATOR_LABELS = {
|
|
5774
|
+
equals: "es",
|
|
5775
|
+
notEquals: "no es",
|
|
5776
|
+
contains: "contiene",
|
|
5777
|
+
notContains: "no contiene",
|
|
5778
|
+
startsWith: "empieza con",
|
|
5779
|
+
endsWith: "termina con",
|
|
5780
|
+
greaterThan: "mayor que",
|
|
5781
|
+
lessThan: "menor que",
|
|
5782
|
+
between: "esta entre",
|
|
5783
|
+
before: "antes de",
|
|
5784
|
+
after: "despues de",
|
|
5785
|
+
in: "es uno de",
|
|
5786
|
+
notIn: "no es ninguno de",
|
|
5787
|
+
isNull: "esta vacio",
|
|
5788
|
+
isNotNull: "tiene valor",
|
|
5789
|
+
withinLastDays: "en los ultimos (dias)",
|
|
5790
|
+
beforeDays: "hace mas de (dias)",
|
|
5791
|
+
};
|
|
5792
|
+
var DEFAULT_TRANSLATIONS$1 = {
|
|
5793
|
+
includeItemsText: "Incluir los que cumplan",
|
|
5794
|
+
allConditionsLabel: "Y todas",
|
|
5795
|
+
anyConditionLabel: "O alguna",
|
|
5796
|
+
theseConditionsText: "estas condiciones:",
|
|
5797
|
+
thisConditionText: "esta condición:",
|
|
5798
|
+
nestedConditionsPrefix: "Cumplan",
|
|
5799
|
+
nestedConditionsSuffix: "de estas condiciones:",
|
|
5800
|
+
addConditionLabel: "+ Condicion",
|
|
5801
|
+
addGroupLabel: "+ Grupo de condiciones",
|
|
5802
|
+
selectPlaceholder: "Seleccionar...",
|
|
5803
|
+
selectTagPlaceholder: "Seleccionar etiqueta...",
|
|
5804
|
+
selectTagsPlaceholder: "Seleccionar etiquetas...",
|
|
5805
|
+
selectValuesPlaceholder: "Seleccionar valores...",
|
|
5806
|
+
searchPlaceholder: "Buscar...",
|
|
5807
|
+
selectedCountSingular: "seleccionado",
|
|
5808
|
+
selectedCountPlural: "seleccionados",
|
|
5809
|
+
deleteConditionTitle: "Eliminar condicion",
|
|
5810
|
+
deleteGroupTitle: "Eliminar grupo",
|
|
5811
|
+
automaticLabel: "(automatico)",
|
|
5812
|
+
fromPlaceholder: "Desde",
|
|
5813
|
+
toPlaceholder: "Hasta",
|
|
5814
|
+
betweenSeparator: "y",
|
|
5815
|
+
daysPlaceholder: "Cantidad de dias",
|
|
5816
|
+
valuePlaceholder: "Valor",
|
|
5817
|
+
textValuePlaceholder: "Escribe un valor...",
|
|
5818
|
+
maxDepthWarning: "Maximo {max} niveles de anidacion permitidos",
|
|
5819
|
+
filterSummaryTitle: "Resumen del filtro",
|
|
5820
|
+
filterSummaryPrefix: "Donde:",
|
|
5821
|
+
noConditionsText: "Sin condiciones definidas",
|
|
5822
|
+
andConnectorLabel: "Y",
|
|
5823
|
+
orConnectorLabel: "O",
|
|
5824
|
+
showJsonLabel: "Ver JSON",
|
|
5825
|
+
hideJsonLabel: "Ocultar JSON",
|
|
5826
|
+
operatorLabels: DEFAULT_OPERATOR_LABELS,
|
|
5827
|
+
};
|
|
5828
|
+
var NO_VALUE_OPERATORS = ["isNull", "isNotNull"];
|
|
5829
|
+
var MULTI_VALUE_OPERATORS = ["in", "notIn"];
|
|
5830
|
+
var BETWEEN_OPERATOR = "between";
|
|
5831
|
+
var DAYS_OPERATORS = [
|
|
5832
|
+
"withinLastDays",
|
|
5833
|
+
"beforeDays",
|
|
5834
|
+
];
|
|
5835
|
+
|
|
5836
|
+
// ─── Field Configuration ───────────────────────────────────────────
|
|
5837
|
+
// ─── Helper to check if item is a group ────────────────────────────
|
|
5838
|
+
function isGroupState(item) {
|
|
5839
|
+
return item.type === "group";
|
|
5840
|
+
}
|
|
5841
|
+
function isSegmentationGroup(item) {
|
|
5842
|
+
return "rules" in item && Array.isArray(item.rules);
|
|
5843
|
+
}
|
|
5844
|
+
|
|
5845
|
+
// ─── Helpers ───────────────────────────────────────────────────────
|
|
5846
|
+
var _idCounter = 0;
|
|
5847
|
+
function uid() {
|
|
5848
|
+
_idCounter += 1;
|
|
5849
|
+
return "seg_".concat(_idCounter, "_").concat(Date.now());
|
|
5850
|
+
}
|
|
5851
|
+
function buildFieldMap(fields) {
|
|
5852
|
+
var map = new Map();
|
|
5853
|
+
for (var _i = 0, fields_1 = fields; _i < fields_1.length; _i++) {
|
|
5854
|
+
var f = fields_1[_i];
|
|
5855
|
+
map.set(f.value, f);
|
|
5856
|
+
}
|
|
5857
|
+
return map;
|
|
5858
|
+
}
|
|
5859
|
+
function buildTagMap(tags) {
|
|
5860
|
+
var map = new Map();
|
|
5861
|
+
for (var _i = 0, tags_1 = tags; _i < tags_1.length; _i++) {
|
|
5862
|
+
var t = tags_1[_i];
|
|
5863
|
+
map.set(t.id, t.title);
|
|
5864
|
+
}
|
|
5865
|
+
return map;
|
|
5866
|
+
}
|
|
5867
|
+
// ─── Convert between internal state and JSON ───────────────────────
|
|
5868
|
+
function stateToGroup(state) {
|
|
5869
|
+
return {
|
|
5870
|
+
operator: state.operator,
|
|
5871
|
+
rules: state.rules.map(function (item) {
|
|
5872
|
+
if (isGroupState(item))
|
|
5873
|
+
return stateToGroup(item);
|
|
5874
|
+
var rule = {
|
|
5875
|
+
field: item.field,
|
|
5876
|
+
operator: item.operator,
|
|
5877
|
+
};
|
|
5878
|
+
if (item.value !== undefined)
|
|
5879
|
+
rule.value = item.value;
|
|
5880
|
+
return rule;
|
|
5881
|
+
}),
|
|
5882
|
+
};
|
|
5883
|
+
}
|
|
5884
|
+
function groupToState(group) {
|
|
5885
|
+
return {
|
|
5886
|
+
id: uid(),
|
|
5887
|
+
type: "group",
|
|
5888
|
+
operator: group.operator,
|
|
5889
|
+
rules: group.rules.map(function (item) {
|
|
5890
|
+
if (isSegmentationGroup(item))
|
|
5891
|
+
return groupToState(item);
|
|
5892
|
+
var rule = {
|
|
5893
|
+
id: uid(),
|
|
5894
|
+
type: "rule",
|
|
5895
|
+
field: item.field,
|
|
5896
|
+
operator: item.operator,
|
|
5897
|
+
};
|
|
5898
|
+
if (item.value !== undefined)
|
|
5899
|
+
rule.value = item.value;
|
|
5900
|
+
return rule;
|
|
5901
|
+
}),
|
|
5902
|
+
};
|
|
5903
|
+
}
|
|
5904
|
+
function createEmptyRule(fields) {
|
|
5905
|
+
var _a, _b;
|
|
5906
|
+
var first = fields[0];
|
|
5907
|
+
return {
|
|
5908
|
+
id: uid(),
|
|
5909
|
+
type: "rule",
|
|
5910
|
+
field: (_a = first === null || first === void 0 ? void 0 : first.value) !== null && _a !== void 0 ? _a : "",
|
|
5911
|
+
operator: (_b = first === null || first === void 0 ? void 0 : first.operators[0]) !== null && _b !== void 0 ? _b : "equals",
|
|
5912
|
+
value: undefined,
|
|
5913
|
+
};
|
|
5914
|
+
}
|
|
5915
|
+
function createEmptyGroup(fields) {
|
|
5916
|
+
return {
|
|
5917
|
+
id: uid(),
|
|
5918
|
+
type: "group",
|
|
5919
|
+
operator: "OR",
|
|
5920
|
+
rules: [createEmptyRule(fields)],
|
|
5921
|
+
};
|
|
5922
|
+
}
|
|
5923
|
+
var ChipMultiSelect = function (_a) {
|
|
5924
|
+
var options = _a.options, value = _a.value, onChange = _a.onChange, _b = _a.placeholder, placeholder = _b === void 0 ? "Seleccionar..." : _b, _c = _a.searchPlaceholder, searchPlaceholder = _c === void 0 ? "Buscar..." : _c, _d = _a.selectedCountSingular, selectedCountSingular = _d === void 0 ? "seleccionado" : _d, _e = _a.selectedCountPlural, selectedCountPlural = _e === void 0 ? "seleccionados" : _e, _f = _a.isDisabled, isDisabled = _f === void 0 ? false : _f;
|
|
5925
|
+
var _g = useState(false), isOpen = _g[0], setIsOpen = _g[1];
|
|
5926
|
+
var _h = useState(""), search = _h[0], setSearch = _h[1];
|
|
5927
|
+
var wrapperRef = useRef(null);
|
|
5928
|
+
useEffect(function () {
|
|
5929
|
+
var handler = function (e) {
|
|
5930
|
+
if (wrapperRef.current &&
|
|
5931
|
+
!wrapperRef.current.contains(e.target)) {
|
|
5932
|
+
setIsOpen(false);
|
|
5933
|
+
}
|
|
5934
|
+
};
|
|
5935
|
+
document.addEventListener("click", handler);
|
|
5936
|
+
return function () { return document.removeEventListener("click", handler); };
|
|
5937
|
+
}, []);
|
|
5938
|
+
var filteredOptions = useMemo(function () {
|
|
5939
|
+
return search
|
|
5940
|
+
? options.filter(function (o) {
|
|
5941
|
+
return o.l.toLowerCase().includes(search.toLowerCase());
|
|
5942
|
+
})
|
|
5943
|
+
: options;
|
|
5944
|
+
}, [options, search]);
|
|
5945
|
+
var toggleValue = function (v) {
|
|
5946
|
+
if (value.includes(v))
|
|
5947
|
+
onChange(value.filter(function (x) { return x !== v; }));
|
|
5948
|
+
else
|
|
5949
|
+
onChange(__spreadArray(__spreadArray([], value, true), [v], false));
|
|
5950
|
+
};
|
|
5951
|
+
var removeChip = function (v) {
|
|
5952
|
+
onChange(value.filter(function (x) { return x !== v; }));
|
|
5953
|
+
};
|
|
5954
|
+
return (jsxs("div", { ref: wrapperRef, className: "seg-chip-select relative flex-1", children: [jsx("div", { className: "flex flex-wrap items-center gap-1 h-9 min-h-9 px-3 py-1.5 border rounded-lg cursor-pointer transition-colors ".concat(isOpen
|
|
5955
|
+
? "border-primary-500 bg-default-50"
|
|
5956
|
+
: "border-default-100 hover:border-default-200", " ").concat(isDisabled ? "opacity-50 pointer-events-none" : ""), onClick: function () { return !isDisabled && setIsOpen(!isOpen); }, onKeyDown: function (e) {
|
|
5957
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
5958
|
+
e.preventDefault();
|
|
5959
|
+
if (!isDisabled)
|
|
5960
|
+
setIsOpen(!isOpen);
|
|
5961
|
+
}
|
|
5962
|
+
}, role: "combobox", "aria-expanded": isOpen, tabIndex: isDisabled ? -1 : 0, children: value.length === 0 ? (jsx("span", { className: "text-default-400 text-sm", children: placeholder })) : (value.map(function (v) {
|
|
5963
|
+
var _a;
|
|
5964
|
+
var opt = options.find(function (o) { return o.v === v; });
|
|
5965
|
+
return (jsx(Chip$1, { size: "sm", variant: "flat", color: "primary", onClose: function () { return removeChip(v); }, children: (_a = opt === null || opt === void 0 ? void 0 : opt.l) !== null && _a !== void 0 ? _a : v }, v));
|
|
5966
|
+
})) }), isOpen && (jsxs("div", { className: "flex items-center w-full min-h-[56px] transition-colors shadow-sm border-medium border-default-200 rounded-xl focus-within:border-primary-500 border-default-200", children: [options.length > 5 && (jsx("div", { className: "p-2 border-b border-default-100", children: jsx(Input$1, { size: "sm", variant: "faded", placeholder: searchPlaceholder, value: search, onValueChange: setSearch, onClick: function (e) { return e.stopPropagation(); }, classNames: {
|
|
5967
|
+
inputWrapper: "h-8 min-h-8",
|
|
5968
|
+
} }) })), jsx("div", { className: "overflow-y-auto flex-1 py-1", children: filteredOptions.map(function (opt) { return (jsx("div", { className: "flex items-center px-3 py-1.5 cursor-pointer hover:bg-default-50 transition-colors ".concat(value.includes(opt.v) ? "bg-primary-50" : ""), onClick: function (e) {
|
|
5969
|
+
e.stopPropagation();
|
|
5970
|
+
toggleValue(opt.v);
|
|
5971
|
+
}, onKeyDown: function (e) {
|
|
5972
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
5973
|
+
e.preventDefault();
|
|
5974
|
+
toggleValue(opt.v);
|
|
5975
|
+
}
|
|
5976
|
+
}, role: "option", "aria-selected": value.includes(opt.v), tabIndex: 0, children: jsx(Checkbox, { size: "sm", isSelected: value.includes(opt.v), onValueChange: function () { return toggleValue(opt.v); }, classNames: { label: "text-sm" }, children: opt.l }) }, opt.v)); }) }), jsxs("div", { className: "px-3 py-1.5 text-xs text-default-400 border-t border-default-100", children: [value.length, " ", value.length === 1
|
|
5977
|
+
? selectedCountSingular
|
|
5978
|
+
: selectedCountPlural] })] }))] }));
|
|
5979
|
+
};
|
|
5980
|
+
var ValueInput = function (_a) {
|
|
5981
|
+
var _b, _c, _d, _e;
|
|
5982
|
+
var field = _a.field, operator = _a.operator, value = _a.value, tags = _a.tags, onChange = _a.onChange, t = _a.translations, _f = _a.isDisabled, isDisabled = _f === void 0 ? false : _f;
|
|
5983
|
+
if (!field)
|
|
5984
|
+
return null;
|
|
5985
|
+
// No value operators
|
|
5986
|
+
if (NO_VALUE_OPERATORS.includes(operator)) {
|
|
5987
|
+
return (jsx(Chip$1, { size: "sm", variant: "flat", color: "default", children: t.automaticLabel }));
|
|
5988
|
+
}
|
|
5989
|
+
// Enum field — multi-select (in / notIn)
|
|
5990
|
+
if (field.type === "enum" && MULTI_VALUE_OPERATORS.includes(operator)) {
|
|
5991
|
+
return (jsx(ChipMultiSelect, { options: (_b = field.enumValues) !== null && _b !== void 0 ? _b : [], value: Array.isArray(value) ? value : [], onChange: onChange, placeholder: t.selectValuesPlaceholder, searchPlaceholder: t.searchPlaceholder, selectedCountSingular: t.selectedCountSingular, selectedCountPlural: t.selectedCountPlural, isDisabled: isDisabled }));
|
|
5992
|
+
}
|
|
5993
|
+
// Enum field — single select
|
|
5994
|
+
if (field.type === "enum") {
|
|
5995
|
+
return (jsx(Select$1, { size: "sm", variant: "faded", placeholder: t.selectPlaceholder, selectedKeys: value ? [String(value)] : [], onSelectionChange: function (keys) {
|
|
5996
|
+
var selected = Array.from(keys)[0];
|
|
5997
|
+
onChange(selected || undefined);
|
|
5998
|
+
}, isDisabled: isDisabled, className: "flex-1 min-w-[160px] h-9", classNames: {
|
|
5999
|
+
trigger: "h-9 min-h-9 border border-default-100 rounded-lg data-[hover=true]:border-default-200 data-[focus=true]:border-primary-500",
|
|
6000
|
+
}, "aria-label": field.label, children: ((_c = field.enumValues) !== null && _c !== void 0 ? _c : []).map(function (ev) { return (jsx(SelectItem, { children: ev.l }, ev.v)); }) }));
|
|
6001
|
+
}
|
|
6002
|
+
// Tag single
|
|
6003
|
+
if (field.type === "tag-single") {
|
|
6004
|
+
return (jsx(Select$1, { size: "sm", variant: "faded", placeholder: t.selectTagPlaceholder, selectedKeys: value ? [String(value)] : [], onSelectionChange: function (keys) {
|
|
6005
|
+
var selected = Array.from(keys)[0];
|
|
6006
|
+
onChange(selected || undefined);
|
|
6007
|
+
}, isDisabled: isDisabled, className: "flex-1 min-w-[160px] h-9", classNames: {
|
|
6008
|
+
trigger: "h-9 min-h-9 border border-default-100 rounded-lg data-[hover=true]:border-default-200 data-[focus=true]:border-primary-500",
|
|
6009
|
+
}, "aria-label": field.label, children: tags.map(function (tag) { return (jsx(SelectItem, { children: tag.title }, tag.id)); }) }));
|
|
6010
|
+
}
|
|
6011
|
+
// Tag multi
|
|
6012
|
+
if (field.type === "tag-multi") {
|
|
6013
|
+
var tagOpts = tags.map(function (tag) { return ({ v: tag.id, l: tag.title }); });
|
|
6014
|
+
return (jsx(ChipMultiSelect, { options: tagOpts, value: Array.isArray(value) ? value : [], onChange: onChange, placeholder: t.selectTagsPlaceholder, searchPlaceholder: t.searchPlaceholder, selectedCountSingular: t.selectedCountSingular, selectedCountPlural: t.selectedCountPlural, isDisabled: isDisabled }));
|
|
6015
|
+
}
|
|
6016
|
+
// Between operator
|
|
6017
|
+
if (operator === BETWEEN_OPERATOR) {
|
|
6018
|
+
var isDate_1 = field.type === "date";
|
|
6019
|
+
var arr_1 = Array.isArray(value) ? value : [undefined, undefined];
|
|
6020
|
+
return (jsxs("div", { className: "flex items-center gap-2 flex-1", children: [jsx(Input$1, { size: "sm", variant: "faded", type: isDate_1 ? "date" : "number", placeholder: isDate_1 ? "" : t.fromPlaceholder, value: arr_1[0] !== undefined ? String(arr_1[0]) : "", onValueChange: function (v) {
|
|
6021
|
+
var _a;
|
|
6022
|
+
var parsed = isDate_1
|
|
6023
|
+
? v
|
|
6024
|
+
: v !== ""
|
|
6025
|
+
? Number(v)
|
|
6026
|
+
: undefined;
|
|
6027
|
+
onChange([
|
|
6028
|
+
parsed,
|
|
6029
|
+
(_a = arr_1[1]) !== null && _a !== void 0 ? _a : "",
|
|
6030
|
+
]);
|
|
6031
|
+
}, isDisabled: isDisabled, className: "flex-1", "aria-label": t.fromPlaceholder, classNames: {
|
|
6032
|
+
inputWrapper: "h-9 min-h-9",
|
|
6033
|
+
input: "text-center",
|
|
6034
|
+
} }), jsx("span", { className: "text-default-400 text-sm shrink-0", children: t.betweenSeparator }), jsx(Input$1, { size: "sm", variant: "faded", type: isDate_1 ? "date" : "number", placeholder: isDate_1 ? "" : t.toPlaceholder, value: arr_1[1] !== undefined ? String(arr_1[1]) : "", onValueChange: function (v) {
|
|
6035
|
+
var _a;
|
|
6036
|
+
var parsed = isDate_1
|
|
6037
|
+
? v
|
|
6038
|
+
: v !== ""
|
|
6039
|
+
? Number(v)
|
|
6040
|
+
: undefined;
|
|
6041
|
+
onChange([
|
|
6042
|
+
(_a = arr_1[0]) !== null && _a !== void 0 ? _a : "",
|
|
6043
|
+
parsed,
|
|
6044
|
+
]);
|
|
6045
|
+
}, isDisabled: isDisabled, className: "flex-1", "aria-label": t.toPlaceholder, classNames: {
|
|
6046
|
+
inputWrapper: "h-9 min-h-9",
|
|
6047
|
+
input: "text-center",
|
|
6048
|
+
} })] }));
|
|
6049
|
+
}
|
|
6050
|
+
// Days operators
|
|
6051
|
+
if (DAYS_OPERATORS.includes(operator)) {
|
|
6052
|
+
return (jsx(Input$1, { size: "sm", variant: "faded", type: "number", min: 0, placeholder: t.daysPlaceholder, value: value !== undefined ? String(value) : "", onValueChange: function (v) {
|
|
6053
|
+
return onChange(v !== "" ? Number(v) : undefined);
|
|
6054
|
+
}, isDisabled: isDisabled, className: "flex-1 min-w-[140px]", classNames: { inputWrapper: "h-9 min-h-9" }, "aria-label": t.daysPlaceholder }));
|
|
6055
|
+
}
|
|
6056
|
+
// Number field
|
|
6057
|
+
if (field.type === "number") {
|
|
6058
|
+
return (jsx(Input$1, { size: "sm", variant: "faded", type: "number", min: 0, placeholder: t.valuePlaceholder, value: value !== undefined ? String(value) : "", onValueChange: function (v) {
|
|
6059
|
+
return onChange(v !== "" ? Number(v) : undefined);
|
|
6060
|
+
}, isDisabled: isDisabled, className: "flex-1 min-w-[120px]", classNames: { inputWrapper: "h-9 min-h-9" }, "aria-label": t.valuePlaceholder }));
|
|
6061
|
+
}
|
|
6062
|
+
// Date field
|
|
6063
|
+
if (field.type === "date") {
|
|
6064
|
+
return (jsx(Input$1, { size: "sm", variant: "faded", type: "date", value: (_d = value) !== null && _d !== void 0 ? _d : "", onValueChange: function (v) { return onChange(v || undefined); }, isDisabled: isDisabled, className: "flex-1 min-w-[160px]", classNames: { inputWrapper: "h-9 min-h-9" }, "aria-label": field.label }));
|
|
6065
|
+
}
|
|
6066
|
+
// Text field (default)
|
|
6067
|
+
return (jsx(Input$1, { size: "sm", variant: "faded", type: "text", placeholder: t.textValuePlaceholder, value: (_e = value) !== null && _e !== void 0 ? _e : "", onValueChange: function (v) { return onChange(v || undefined); }, isDisabled: isDisabled, className: "flex-1 min-w-[160px]", classNames: { inputWrapper: "h-9 min-h-9" }, "aria-label": field.label }));
|
|
6068
|
+
};
|
|
6069
|
+
// ─── ConnectorPill Sub-component (compact: text only) ─────────────────
|
|
6070
|
+
var ConnectorPill = function (_a) {
|
|
6071
|
+
var isAnd = _a.isAnd, label = _a.label;
|
|
6072
|
+
return (jsxs("div", { className: "flex items-center gap-2 py-1", children: [jsx("div", { className: "flex-1 h-px bg-default-200" }), jsx(Chip$1, { size: "sm", variant: "flat", color: isAnd ? "secondary" : "success", children: label }), jsx("div", { className: "flex-1 h-px bg-default-200" })] }));
|
|
6073
|
+
};
|
|
6074
|
+
var RuleRow = function (_a) {
|
|
6075
|
+
var _b;
|
|
6076
|
+
var rule = _a.rule, fields = _a.fields, fieldMap = _a.fieldMap, tags = _a.tags, onUpdate = _a.onUpdate, onDelete = _a.onDelete, t = _a.translations, _c = _a.isDisabled, isDisabled = _c === void 0 ? false : _c;
|
|
6077
|
+
var meta = fieldMap.get(rule.field);
|
|
6078
|
+
var operators = (_b = meta === null || meta === void 0 ? void 0 : meta.operators) !== null && _b !== void 0 ? _b : [];
|
|
6079
|
+
var opLabels = __assign(__assign({}, DEFAULT_OPERATOR_LABELS), t.operatorLabels);
|
|
6080
|
+
// Group fields by category
|
|
6081
|
+
var categories = useMemo(function () {
|
|
6082
|
+
var cats = [];
|
|
6083
|
+
var last = "";
|
|
6084
|
+
for (var _i = 0, fields_2 = fields; _i < fields_2.length; _i++) {
|
|
6085
|
+
var f = fields_2[_i];
|
|
6086
|
+
if (f.category !== last) {
|
|
6087
|
+
cats.push({ category: f.category, fields: [f] });
|
|
6088
|
+
last = f.category;
|
|
6089
|
+
}
|
|
6090
|
+
else {
|
|
6091
|
+
cats[cats.length - 1].fields.push(f);
|
|
6092
|
+
}
|
|
6093
|
+
}
|
|
6094
|
+
return cats;
|
|
6095
|
+
}, [fields]);
|
|
6096
|
+
var handleFieldChange = function (newField) {
|
|
6097
|
+
var _a;
|
|
6098
|
+
var newMeta = fieldMap.get(newField);
|
|
6099
|
+
var newOp = (_a = newMeta === null || newMeta === void 0 ? void 0 : newMeta.operators[0]) !== null && _a !== void 0 ? _a : "equals";
|
|
6100
|
+
onUpdate(__assign(__assign({}, rule), { field: newField, operator: newOp, value: undefined }));
|
|
6101
|
+
};
|
|
6102
|
+
var handleOperatorChange = function (newOp) {
|
|
6103
|
+
onUpdate(__assign(__assign({}, rule), { operator: newOp, value: undefined }));
|
|
6104
|
+
};
|
|
6105
|
+
var handleValueChange = function (newValue) {
|
|
6106
|
+
onUpdate(__assign(__assign({}, rule), { value: newValue }));
|
|
6107
|
+
};
|
|
6108
|
+
return (jsxs("div", { className: "seg-rule-row flex flex-col gap-2 p-3 border border-default-100 rounded-xl min-h-[52px] w-full sm:flex-row sm:items-center sm:gap-2 sm:w-auto", children: [jsx(Select$1, { size: "sm", variant: "faded", selectedKeys: [rule.field], onSelectionChange: function (keys) {
|
|
6109
|
+
var selected = Array.from(keys)[0];
|
|
6110
|
+
if (selected)
|
|
6111
|
+
handleFieldChange(selected);
|
|
6112
|
+
}, isDisabled: isDisabled, className: "w-full sm:min-w-[170px] sm:max-w-[200px] sm:shrink-0", classNames: {
|
|
6113
|
+
trigger: "h-9 min-h-9 border border-default-100 rounded-lg data-[hover=true]:border-default-200 data-[focus=true]:border-primary-500",
|
|
6114
|
+
}, "aria-label": "Campo", children: categories.map(function (cat) { return (jsx(SelectSection, { title: cat.category, children: cat.fields.map(function (f) { return (jsx(SelectItem, { children: f.label }, f.value)); }) }, cat.category)); }) }), jsx(Select$1, { size: "sm", variant: "faded", selectedKeys: [rule.operator], onSelectionChange: function (keys) {
|
|
6115
|
+
var selected = Array.from(keys)[0];
|
|
6116
|
+
if (selected)
|
|
6117
|
+
handleOperatorChange(selected);
|
|
6118
|
+
}, isDisabled: isDisabled, className: "w-full sm:min-w-[140px] sm:max-w-[180px] sm:shrink-0", classNames: {
|
|
6119
|
+
trigger: "h-9 min-h-9 border border-default-100 rounded-lg data-[hover=true]:border-default-200 data-[focus=true]:border-primary-500",
|
|
6120
|
+
}, "aria-label": "Operador", children: operators.map(function (op) {
|
|
6121
|
+
var _a;
|
|
6122
|
+
return (jsx(SelectItem, { children: (_a = opLabels[op]) !== null && _a !== void 0 ? _a : op }, op));
|
|
6123
|
+
}) }), jsx("div", { className: "w-full sm:flex-1 sm:min-w-0 flex items-center", children: jsx(ValueInput, { field: meta, operator: rule.operator, value: rule.value, tags: tags, onChange: handleValueChange, translations: t, isDisabled: isDisabled }) }), jsx(Button$1, { isIconOnly: true, size: "sm", variant: "light", color: "danger", onPress: onDelete, isDisabled: isDisabled, "aria-label": t.deleteConditionTitle, className: "shrink-0 self-end sm:self-center", children: "\u2715" })] }));
|
|
6124
|
+
};
|
|
6125
|
+
var FilterGroup = function (_a) {
|
|
6126
|
+
var group = _a.group, fields = _a.fields, fieldMap = _a.fieldMap, tags = _a.tags, depth = _a.depth, maxDepth = _a.maxDepth, onUpdate = _a.onUpdate, t = _a.translations, _b = _a.isDisabled, isDisabled = _b === void 0 ? false : _b;
|
|
6127
|
+
var isAnd = group.operator === "AND";
|
|
6128
|
+
var connectorLabel = isAnd ? t.andConnectorLabel : t.orConnectorLabel;
|
|
6129
|
+
var toggleOperator = function (op) {
|
|
6130
|
+
onUpdate(__assign(__assign({}, group), { operator: op }));
|
|
6131
|
+
};
|
|
6132
|
+
var updateRule = function (index, updated) {
|
|
6133
|
+
var newRules = __spreadArray([], group.rules, true);
|
|
6134
|
+
newRules[index] = updated;
|
|
6135
|
+
onUpdate(__assign(__assign({}, group), { rules: newRules }));
|
|
6136
|
+
};
|
|
6137
|
+
var deleteRule = function (index) {
|
|
6138
|
+
var newRules = group.rules.filter(function (_, i) { return i !== index; });
|
|
6139
|
+
onUpdate(__assign(__assign({}, group), { rules: newRules }));
|
|
6140
|
+
};
|
|
6141
|
+
var addRule = function () {
|
|
6142
|
+
onUpdate(__assign(__assign({}, group), { rules: __spreadArray(__spreadArray([], group.rules, true), [createEmptyRule(fields)], false) }));
|
|
6143
|
+
};
|
|
6144
|
+
var addGroup = function () {
|
|
6145
|
+
if (depth >= maxDepth)
|
|
6146
|
+
return;
|
|
6147
|
+
onUpdate(__assign(__assign({}, group), { rules: __spreadArray(__spreadArray([], group.rules, true), [createEmptyGroup(fields)], false) }));
|
|
6148
|
+
};
|
|
6149
|
+
return (jsxs("div", { className: "seg-filter-group w-full min-w-0", children: [jsxs("div", { className: "flex flex-wrap items-center gap-2 mb-3 text-sm text-default-700", children: [jsx("span", { children: depth === 1
|
|
6150
|
+
? t.includeItemsText
|
|
6151
|
+
: t.nestedConditionsPrefix }), jsxs("span", { className: "inline-flex rounded-md overflow-hidden border border-default-200", children: [jsx(Button$1, { size: "sm", radius: "none", variant: isAnd ? "solid" : "light", color: isAnd ? "secondary" : "default", className: "min-w-0 px-2.5 text-xs ".concat(isAnd
|
|
6152
|
+
? "font-semibold"
|
|
6153
|
+
: "text-default-500 font-semibold"), onPress: function () { return toggleOperator("AND"); }, isDisabled: isDisabled, "aria-label": t.allConditionsLabel, children: t.andConnectorLabel }), jsx(Button$1, { size: "sm", radius: "none", variant: !isAnd ? "solid" : "light", color: !isAnd ? "success" : "default", className: "min-w-0 px-2.5 text-xs ".concat(!isAnd
|
|
6154
|
+
? "font-semibold"
|
|
6155
|
+
: "text-default-500 font-semibold"), onPress: function () { return toggleOperator("OR"); }, isDisabled: isDisabled, "aria-label": t.anyConditionLabel, children: t.orConnectorLabel })] }), jsx("span", { children: depth === 1
|
|
6156
|
+
? group.rules.length >= 2
|
|
6157
|
+
? t.theseConditionsText
|
|
6158
|
+
: t.thisConditionText
|
|
6159
|
+
: t.nestedConditionsSuffix })] }), jsx("div", { className: "seg-rules-list flex flex-col gap-0", children: group.rules.map(function (item, index) { return (jsxs("div", { children: [index > 0 && (jsx(ConnectorPill, { isAnd: isAnd, label: connectorLabel })), isGroupState(item) ? (jsxs("div", { className: "seg-nested-wrap relative border-2 rounded-xl p-4 ".concat(item.operator === "AND"
|
|
6160
|
+
? "border-secondary/30 bg-secondary-50"
|
|
6161
|
+
: "border-success/30 bg-success-50"), children: [jsx(Button$1, { isIconOnly: true, size: "sm", variant: "light", color: "danger", className: "absolute top-2 right-2", onPress: function () { return deleteRule(index); }, isDisabled: isDisabled, "aria-label": t.deleteGroupTitle, children: "\u2715" }), jsx(FilterGroup, { group: item, fields: fields, fieldMap: fieldMap, tags: tags, depth: depth + 1, maxDepth: maxDepth, onUpdate: function (updated) {
|
|
6162
|
+
return updateRule(index, updated);
|
|
6163
|
+
}, translations: t, isDisabled: isDisabled })] })) : (jsx(RuleRow, { rule: item, fields: fields, fieldMap: fieldMap, tags: tags, onUpdate: function (updated) {
|
|
6164
|
+
return updateRule(index, updated);
|
|
6165
|
+
}, onDelete: function () { return deleteRule(index); }, translations: t, isDisabled: isDisabled }))] }, item.id)); }) }), jsxs("div", { className: "seg-add-actions flex flex-wrap gap-2 mt-3", children: [jsx(Button$1, { variant: "bordered", size: "sm", className: "border-dashed text-default-500", onPress: addRule, isDisabled: isDisabled, children: t.addConditionLabel }), depth < maxDepth && (jsx(Button$1, { variant: "bordered", size: "sm", className: "border-dashed text-default-500", onPress: addGroup, isDisabled: isDisabled, children: t.addGroupLabel }))] })] }));
|
|
6166
|
+
};
|
|
6167
|
+
var FilterSummary = function (_a) {
|
|
6168
|
+
var group = _a.group, fieldMap = _a.fieldMap, tagMap = _a.tagMap, t = _a.translations;
|
|
6169
|
+
var opLabels = __assign(__assign({}, DEFAULT_OPERATOR_LABELS), t.operatorLabels);
|
|
6170
|
+
var humanValue = function (field, operator, value) {
|
|
6171
|
+
var _a, _b;
|
|
6172
|
+
if (operator === "isNull" || operator === "isNotNull")
|
|
6173
|
+
return "";
|
|
6174
|
+
if (value === undefined || value === null)
|
|
6175
|
+
return "(sin valor)";
|
|
6176
|
+
var meta = fieldMap.get(field);
|
|
6177
|
+
if (!meta)
|
|
6178
|
+
return String(value);
|
|
6179
|
+
if (meta.type === "tag-single")
|
|
6180
|
+
return (_a = tagMap.get(value)) !== null && _a !== void 0 ? _a : String(value);
|
|
6181
|
+
if (meta.type === "tag-multi" && Array.isArray(value)) {
|
|
6182
|
+
return value
|
|
6183
|
+
.map(function (v) { var _a; return (_a = tagMap.get(v)) !== null && _a !== void 0 ? _a : String(v); })
|
|
6184
|
+
.join(", ");
|
|
6185
|
+
}
|
|
6186
|
+
if (meta.type === "enum" && meta.enumValues) {
|
|
6187
|
+
var enumMap_1 = new Map(meta.enumValues.map(function (ev) { return [ev.v, ev.l]; }));
|
|
6188
|
+
if (Array.isArray(value))
|
|
6189
|
+
return value
|
|
6190
|
+
.map(function (v) { var _a; return (_a = enumMap_1.get(v)) !== null && _a !== void 0 ? _a : v; })
|
|
6191
|
+
.join(", ");
|
|
6192
|
+
return (_b = enumMap_1.get(value)) !== null && _b !== void 0 ? _b : String(value);
|
|
6193
|
+
}
|
|
6194
|
+
if (operator === "between" && Array.isArray(value))
|
|
6195
|
+
return "".concat(value[0], " ").concat(t.betweenSeparator, " ").concat(value[1]);
|
|
6196
|
+
if (operator === "withinLastDays" || operator === "beforeDays")
|
|
6197
|
+
return "".concat(value, " dias");
|
|
6198
|
+
if (Array.isArray(value))
|
|
6199
|
+
return value.join(", ");
|
|
6200
|
+
return String(value);
|
|
6201
|
+
};
|
|
6202
|
+
var translateRule = function (rule) {
|
|
6203
|
+
var _a, _b;
|
|
6204
|
+
var meta = fieldMap.get(rule.field);
|
|
6205
|
+
var fieldLabel = (_a = meta === null || meta === void 0 ? void 0 : meta.label) !== null && _a !== void 0 ? _a : rule.field;
|
|
6206
|
+
var opLabel = (_b = opLabels[rule.operator]) !== null && _b !== void 0 ? _b : rule.operator;
|
|
6207
|
+
var val = humanValue(rule.field, rule.operator, rule.value);
|
|
6208
|
+
return "".concat(fieldLabel, " ").concat(opLabel).concat(val ? " ".concat(val) : "");
|
|
6209
|
+
};
|
|
6210
|
+
var translateGroup = function (grp, d) {
|
|
6211
|
+
var conn = grp.operator === "AND"
|
|
6212
|
+
? " ".concat(t.andConnectorLabel, " ")
|
|
6213
|
+
: " ".concat(t.orConnectorLabel, " ");
|
|
6214
|
+
var parts = grp.rules.map(function (item) {
|
|
6215
|
+
if (isSegmentationGroup(item))
|
|
6216
|
+
return "(".concat(translateGroup(item), ")");
|
|
6217
|
+
return translateRule(item);
|
|
6218
|
+
});
|
|
6219
|
+
if (!parts.length)
|
|
6220
|
+
return t.noConditionsText;
|
|
6221
|
+
return parts.join(conn);
|
|
6222
|
+
};
|
|
6223
|
+
if (!group.rules.length)
|
|
6224
|
+
return null;
|
|
6225
|
+
return (jsxs("div", { className: "seg-summary mt-4 p-4 bg-success-50 border border-success/20 rounded-xl", children: [jsx("div", { className: "text-sm font-semibold text-success-600 mb-1", children: t.filterSummaryTitle }), jsxs("div", { className: "text-sm text-default-700", children: [t.filterSummaryPrefix, " ", translateGroup(group)] })] }));
|
|
6226
|
+
};
|
|
6227
|
+
// ─── Main Component ────────────────────────────────────────────────
|
|
6228
|
+
var SegmentationBuilder = forwardRef(function (_a, ref) {
|
|
6229
|
+
var fields = _a.fields, _b = _a.tags, tags = _b === void 0 ? [] : _b, value = _a.value, onChange = _a.onChange, _c = _a.maxDepth, maxDepth = _c === void 0 ? 5 : _c, _d = _a.showSummary, showSummary = _d === void 0 ? true : _d, _e = _a.showJsonPreview, showJsonPreview = _e === void 0 ? false : _e, translations = _a.translations, _f = _a.className, className = _f === void 0 ? "" : _f, _g = _a.isDisabled, isDisabled = _g === void 0 ? false : _g;
|
|
6230
|
+
var t = useMemo(function () { return (__assign(__assign(__assign({}, DEFAULT_TRANSLATIONS$1), translations), { operatorLabels: __assign(__assign({}, DEFAULT_OPERATOR_LABELS), translations === null || translations === void 0 ? void 0 : translations.operatorLabels) })); }, [translations]);
|
|
6231
|
+
var fMap = useMemo(function () { return buildFieldMap(fields); }, [fields]);
|
|
6232
|
+
var tMap = useMemo(function () { return buildTagMap(tags); }, [tags]);
|
|
6233
|
+
// Internal state
|
|
6234
|
+
var _h = useState(function () {
|
|
6235
|
+
if (value)
|
|
6236
|
+
return groupToState(value);
|
|
6237
|
+
return {
|
|
6238
|
+
id: uid(),
|
|
6239
|
+
type: "group",
|
|
6240
|
+
operator: "AND",
|
|
6241
|
+
rules: [createEmptyRule(fields)],
|
|
6242
|
+
};
|
|
6243
|
+
}), internalState = _h[0], setInternalState = _h[1];
|
|
6244
|
+
var _j = useState(false), isJsonVisible = _j[0], setIsJsonVisible = _j[1];
|
|
6245
|
+
// Sync from controlled value
|
|
6246
|
+
var isControlled = value !== undefined;
|
|
6247
|
+
var prevValueRef = useRef(value);
|
|
6248
|
+
useEffect(function () {
|
|
6249
|
+
if (isControlled && value && value !== prevValueRef.current) {
|
|
6250
|
+
setInternalState(groupToState(value));
|
|
6251
|
+
prevValueRef.current = value;
|
|
6252
|
+
}
|
|
6253
|
+
}, [value, isControlled]);
|
|
6254
|
+
// Build the output filter
|
|
6255
|
+
var currentFilter = useMemo(function () { return stateToGroup(internalState); }, [internalState]);
|
|
6256
|
+
// Notify onChange on state change
|
|
6257
|
+
var isFirstRender = useRef(true);
|
|
6258
|
+
useEffect(function () {
|
|
6259
|
+
if (isFirstRender.current) {
|
|
6260
|
+
isFirstRender.current = false;
|
|
6261
|
+
return;
|
|
6262
|
+
}
|
|
6263
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(currentFilter);
|
|
6264
|
+
}, [currentFilter, onChange]);
|
|
6265
|
+
// Expose imperative handle
|
|
6266
|
+
useImperativeHandle(ref, function () { return ({
|
|
6267
|
+
getFilter: function () { return stateToGroup(internalState); },
|
|
6268
|
+
getPayload: function () { return ({ filter: stateToGroup(internalState) }); },
|
|
6269
|
+
reset: function () {
|
|
6270
|
+
var newState = {
|
|
6271
|
+
id: uid(),
|
|
6272
|
+
type: "group",
|
|
6273
|
+
operator: "AND",
|
|
6274
|
+
rules: [createEmptyRule(fields)],
|
|
6275
|
+
};
|
|
6276
|
+
setInternalState(newState);
|
|
6277
|
+
},
|
|
6278
|
+
}); }, [internalState, fields]);
|
|
6279
|
+
var handleGroupUpdate = useCallback(function (updated) {
|
|
6280
|
+
setInternalState(updated);
|
|
6281
|
+
}, []);
|
|
6282
|
+
return (jsxs("div", { className: "seg-builder relative w-full min-w-0 ".concat(showJsonPreview ? "pr-10" : "", " ").concat(className), children: [showJsonPreview && (jsx(Button$1, { isIconOnly: true, size: "sm", variant: "light", className: "absolute top-0 right-0 z-10 text-default-500 hover:text-default-700", onPress: function () { return setIsJsonVisible(function (v) { return !v; }); }, "aria-expanded": isJsonVisible, "aria-label": isJsonVisible ? t.hideJsonLabel : t.showJsonLabel, title: isJsonVisible ? t.hideJsonLabel : t.showJsonLabel, children: isJsonVisible ? (jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [jsx("path", { d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" }), jsx("line", { x1: "1", y1: "1", x2: "23", y2: "23" })] })) : (jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }), jsx("circle", { cx: "12", cy: "12", r: "3" })] })) })), jsx(FilterGroup, { group: internalState, fields: fields, fieldMap: fMap, tags: tags, depth: 1, maxDepth: maxDepth, onUpdate: handleGroupUpdate, translations: t, isDisabled: isDisabled }), showSummary && (jsx(FilterSummary, { group: currentFilter, fieldMap: fMap, tagMap: tMap, translations: t })), showJsonPreview && isJsonVisible && (jsx("div", { className: "seg-json-preview mt-4", children: jsx("pre", { className: "p-4 bg-default-900 text-default-100 rounded-xl text-xs overflow-x-auto max-h-[300px] border border-default-700 [color-scheme:dark]", children: JSON.stringify({ filter: currentFilter }, null, 2) }) }))] }));
|
|
6283
|
+
});
|
|
6284
|
+
SegmentationBuilder.displayName = "SegmentationBuilder";
|
|
6285
|
+
|
|
5772
6286
|
var DEFAULT_TRANSLATIONS = {
|
|
5773
6287
|
placeholder: "Nombre de la etiqueta",
|
|
5774
6288
|
labelSelect: "Selecciona etiqueta",
|
|
@@ -6229,4 +6743,4 @@ var NavigationLoadingProvider = function (_a) {
|
|
|
6229
6743
|
return (jsxs(NavigationLoadingContext.Provider, { value: value, children: [children, jsx(NavigationLoadingOverlay, { isVisible: isVisible })] }));
|
|
6230
6744
|
};
|
|
6231
6745
|
|
|
6232
|
-
export { AccordionList, AddHolidayForm, AnalyticsCard, AreaLineChart, AuraAutocomplete, AuraTable, AuraToastProvider, BreadcrumbsComponent, Button, Card, Chip, ColorPicker, ColorSelector, ContentCarousel, DEFAULT_PREDEFINED_COLORS, DatePicker, DateRangePicker, DateSelector, DrawerFilters, EnumMenuNavListItem, GlobalToast, H1, H2, H3, H4, HeaderComponent, HolidayType, IconComponent, ImagePreview, Input, InputPassword, Kanban, KanbanCard, KanbanColumn, MenuComponent, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, MultiStepWizard, NavigationLoadingContext, NavigationLoadingOverlay, NavigationLoadingProvider, P, Pagination, Phone, PromotionalBanner, RangeFilter, RowSteps, ScheduleRow, SearchInput, Select, SimpleLineChart, SocialMediaBar, SocialMediaCarousel, SocialMediaPreview, StepIndicator, Switch as SwitchComponent, THEME_COLOR_HEX_MAP, TagsFilter, Textarea, ThemeContext, ThemePicker, ThemeProvider, TimeInput as TimeInputComponent, ToastContext, TwoColumnLayoutAgent, UploadFile, VerticalSteps, WhatsAppPreview, Wizard, WizardNavigation, WizardSidebar, applyCustomPrimaryColor, uniqueCountries as defaultCountries, defaultTranslations$4 as defaultTranslations, generateThemeColorScale, getContrastForeground, getSelectedKeyFromPath, hexToThemeColor, hslToCssValue, isExactThemeColor, isHexColor, removeCustomPrimaryColor, sizeMap, themeColors, useAuraToast, useMediaQuery, useNavigationLoading, useThemeContext };
|
|
6746
|
+
export { AccordionList, AddHolidayForm, AnalyticsCard, AreaLineChart, AuraAutocomplete, AuraTable, AuraToastProvider, BreadcrumbsComponent, Button, Card, Chip, ColorPicker, ColorSelector, ContentCarousel, DEFAULT_PREDEFINED_COLORS, DatePicker, DateRangePicker, DateSelector, DrawerFilters, EnumMenuNavListItem, GlobalToast, H1, H2, H3, H4, HeaderComponent, HolidayType, IconComponent, ImagePreview, Input, InputPassword, Kanban, KanbanCard, KanbanColumn, MenuComponent, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, MultiStepWizard, NavigationLoadingContext, NavigationLoadingOverlay, NavigationLoadingProvider, P, Pagination, Phone, PromotionalBanner, RangeFilter, RowSteps, DEFAULT_TRANSLATIONS$1 as SEGMENTATION_DEFAULT_TRANSLATIONS, ScheduleRow, SearchInput, SegmentationBuilder, Select, SimpleLineChart, SocialMediaBar, SocialMediaCarousel, SocialMediaPreview, StepIndicator, Switch as SwitchComponent, THEME_COLOR_HEX_MAP, TagsFilter, Textarea, ThemeContext, ThemePicker, ThemeProvider, TimeInput as TimeInputComponent, ToastContext, TwoColumnLayoutAgent, UploadFile, VerticalSteps, WhatsAppPreview, Wizard, WizardNavigation, WizardSidebar, applyCustomPrimaryColor, uniqueCountries as defaultCountries, defaultTranslations$4 as defaultTranslations, generateThemeColorScale, getContrastForeground, getSelectedKeyFromPath, hexToThemeColor, hslToCssValue, isExactThemeColor, isGroupState, isHexColor, isSegmentationGroup, removeCustomPrimaryColor, sizeMap, themeColors, useAuraToast, useMediaQuery, useNavigationLoading, useThemeContext };
|