@beweco/aurora-ui 0.1.65 → 0.1.66
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.cjs.js
CHANGED
|
@@ -337,6 +337,7 @@ var Input = function (_a) {
|
|
|
337
337
|
label: "text-default-600 text-tiny group-data-[filled=true]:text-default-600",
|
|
338
338
|
inputWrapper: "focus-within:!border-primary-500",
|
|
339
339
|
errorMessage: "text-left",
|
|
340
|
+
description: "text-left"
|
|
340
341
|
} })));
|
|
341
342
|
};
|
|
342
343
|
|
|
@@ -1733,12 +1734,12 @@ var NotificationButton = function (_a) {
|
|
|
1733
1734
|
};
|
|
1734
1735
|
NotificationButton.displayName = "NotificationButton";
|
|
1735
1736
|
|
|
1736
|
-
var DEFAULT_TRANSLATIONS$
|
|
1737
|
+
var DEFAULT_TRANSLATIONS$6 = {
|
|
1737
1738
|
logout: "Cerrar sesión",
|
|
1738
1739
|
};
|
|
1739
1740
|
var HeaderComponent = function (_a) {
|
|
1740
1741
|
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;
|
|
1741
|
-
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
1742
|
+
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$6), translations);
|
|
1742
1743
|
return (jsxRuntime.jsx("header", { className: "header__container", children: jsxRuntime.jsxs("div", { className: "flex items-center justify-between w-full", children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [jsxRuntime.jsx(react.Button, { className: "sm:hidden", isIconOnly: true, variant: "light", startContent: jsxRuntime.jsx(IconComponent, { icon: "solar:hamburger-menu-linear" }), onPress: onMenuClick }), breadcrumbs && breadcrumbs.length > 0 && (jsxRuntime.jsx(BreadcrumbsComponent, { items: breadcrumbs, onItemClick: onBreadcrumbClick }))] }), jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [jsxRuntime.jsx(NotificationButton, { notificationCount: notificationCount, onPress: onNotificationClick }), jsxRuntime.jsx(ConfigMenu, { options: options, onLogout: onLogout, onOptionSelect: onOptionSelect, translations: t })] })] }) }));
|
|
1743
1744
|
};
|
|
1744
1745
|
HeaderComponent.displayName = "Header";
|
|
@@ -1862,7 +1863,7 @@ KanbanColumn.displayName = "KanbanColumn";
|
|
|
1862
1863
|
* Traducciones por defecto en español.
|
|
1863
1864
|
* Se mezclan con las traducciones proporcionadas por el usuario.
|
|
1864
1865
|
*/
|
|
1865
|
-
var DEFAULT_TRANSLATIONS$
|
|
1866
|
+
var DEFAULT_TRANSLATIONS$5 = {
|
|
1866
1867
|
dropHere: "Soltar aquí",
|
|
1867
1868
|
emptyMessage: "No hay elementos",
|
|
1868
1869
|
};
|
|
@@ -1896,7 +1897,7 @@ var columnGapClasses = {
|
|
|
1896
1897
|
var KanbanComponent = function (_a) {
|
|
1897
1898
|
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;
|
|
1898
1899
|
// Mezclar traducciones del usuario con las por defecto
|
|
1899
|
-
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
1900
|
+
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$5), translations);
|
|
1900
1901
|
// Determinar si drag está habilitado
|
|
1901
1902
|
var dragEnabled = isDraggable !== null && isDraggable !== void 0 ? isDraggable : !!onItemMove;
|
|
1902
1903
|
// Estado del drag actual
|
|
@@ -2214,7 +2215,7 @@ var MenuNavList = React.forwardRef(function (_a, ref) {
|
|
|
2214
2215
|
});
|
|
2215
2216
|
MenuNavList.displayName = "MenuNavList";
|
|
2216
2217
|
|
|
2217
|
-
var DEFAULT_TRANSLATIONS$
|
|
2218
|
+
var DEFAULT_TRANSLATIONS$4 = {
|
|
2218
2219
|
menuLabel: "Menú",
|
|
2219
2220
|
closeSidebarAriaLabel: "Cerrar menú lateral",
|
|
2220
2221
|
mobileNavAriaLabel: "Navegación móvil",
|
|
@@ -2232,7 +2233,7 @@ var MenuComponent = React.memo(function Menu(_a) {
|
|
|
2232
2233
|
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;
|
|
2233
2234
|
var _f = React.useState(false), isCollapsed = _f[0], setIsCollapsed = _f[1];
|
|
2234
2235
|
var _g = React.useState(false), logoError = _g[0], setLogoError = _g[1];
|
|
2235
|
-
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
2236
|
+
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$4), translations);
|
|
2236
2237
|
var selectedKey = React.useMemo(function () {
|
|
2237
2238
|
var _a, _b, _c;
|
|
2238
2239
|
if (menuItems.selectedPath) {
|
|
@@ -2608,7 +2609,7 @@ var MultiStepSidebar = React.forwardRef(function (_a, ref) {
|
|
|
2608
2609
|
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
2609
2610
|
}
|
|
2610
2611
|
};
|
|
2611
|
-
return (jsxRuntime.jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-content3/50 backdrop-blur-sm", onClick: handleOverlayClick, children: jsxRuntime.jsxs("div", __assign({ ref: ref, className: react.cn("flex h-full w-full max-w-4xl overflow-hidden rounded-lg bg-background shadow-lg lg:h-
|
|
2612
|
+
return (jsxRuntime.jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-content3/50 backdrop-blur-sm", onClick: handleOverlayClick, children: jsxRuntime.jsxs("div", __assign({ ref: ref, className: react.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: [jsxRuntime.jsx("div", { className: react.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: jsxRuntime.jsx(VerticalSteps, { className: stepperClasses, color: "primary", currentStep: currentPage, steps: steps, onStepChange: onChangePage, hideInactiveDescriptions: hideInactiveDescriptions }) }), jsxRuntime.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: [jsxRuntime.jsx(Button, { isIconOnly: true, className: "absolute right-4 top-4", size: "sm", variant: "light", color: "default", onPress: onClose, startContent: jsxRuntime.jsx(IconComponent, { className: "text-foreground", icon: "material-symbols:close-rounded", size: "lg" }) }), jsxRuntime.jsx("div", { className: "pt-9 w-10/12 md:hidden", children: jsxRuntime.jsx("div", { className: "flex w-full justify-center", children: jsxRuntime.jsx(StepIndicator, { className: react.cn(stepperClasses), currentStep: currentPage + 1, totalSteps: steps.length }) }) }), jsxRuntime.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 })] })] })) }));
|
|
2612
2613
|
});
|
|
2613
2614
|
MultiStepSidebar.displayName = "MultiStepSidebar";
|
|
2614
2615
|
|
|
@@ -4283,7 +4284,7 @@ var AURORAS = [
|
|
|
4283
4284
|
duration: 55,
|
|
4284
4285
|
},
|
|
4285
4286
|
];
|
|
4286
|
-
var DEFAULT_TRANSLATIONS$
|
|
4287
|
+
var DEFAULT_TRANSLATIONS$3 = {
|
|
4287
4288
|
backButtonLabel: "Atras",
|
|
4288
4289
|
};
|
|
4289
4290
|
var BackButton = function (_a) {
|
|
@@ -4319,7 +4320,7 @@ var TwoColumnLayoutAgent = function (_a) {
|
|
|
4319
4320
|
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;
|
|
4320
4321
|
var _h = React.useState(!enableSequence), showRightContent = _h[0], setShowRightContent = _h[1];
|
|
4321
4322
|
var isDesktop = useMediaQuery("(min-width: ".concat(DESKTOP_BREAKPOINT_PX, "px)"));
|
|
4322
|
-
var t = React.useMemo(function () { return (__assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
4323
|
+
var t = React.useMemo(function () { return (__assign(__assign({}, DEFAULT_TRANSLATIONS$3), translations)); }, [translations]);
|
|
4323
4324
|
var handleBackPress = onBack !== null && onBack !== void 0 ? onBack : (function () { return undefined; });
|
|
4324
4325
|
React.useEffect(function () {
|
|
4325
4326
|
if (enableSequence && !showRightContent) {
|
|
@@ -4874,7 +4875,7 @@ var UploadFile = function (_a) {
|
|
|
4874
4875
|
};
|
|
4875
4876
|
UploadFile.displayName = "UploadFile";
|
|
4876
4877
|
|
|
4877
|
-
var DEFAULT_TRANSLATIONS$
|
|
4878
|
+
var DEFAULT_TRANSLATIONS$2 = {
|
|
4878
4879
|
businessName: "Tu Negocio",
|
|
4879
4880
|
businessInitials: "TN",
|
|
4880
4881
|
onlineStatus: "en linea",
|
|
@@ -4899,7 +4900,7 @@ var DEFAULT_TRANSLATIONS$1 = {
|
|
|
4899
4900
|
*/
|
|
4900
4901
|
var WhatsAppPreview = function (_a) {
|
|
4901
4902
|
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;
|
|
4902
|
-
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
4903
|
+
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$2), translations);
|
|
4903
4904
|
var shouldTruncate = maxCaptionLength && caption.length > maxCaptionLength;
|
|
4904
4905
|
var displayCaption = campaignView
|
|
4905
4906
|
? caption
|
|
@@ -5768,6 +5769,519 @@ var SimpleLineChart = function (_a) {
|
|
|
5768
5769
|
})] }) })] }));
|
|
5769
5770
|
};
|
|
5770
5771
|
|
|
5772
|
+
var DEFAULT_OPERATOR_LABELS = {
|
|
5773
|
+
equals: "es",
|
|
5774
|
+
notEquals: "no es",
|
|
5775
|
+
contains: "contiene",
|
|
5776
|
+
notContains: "no contiene",
|
|
5777
|
+
startsWith: "empieza con",
|
|
5778
|
+
endsWith: "termina con",
|
|
5779
|
+
greaterThan: "mayor que",
|
|
5780
|
+
lessThan: "menor que",
|
|
5781
|
+
between: "esta entre",
|
|
5782
|
+
before: "antes de",
|
|
5783
|
+
after: "despues de",
|
|
5784
|
+
in: "es uno de",
|
|
5785
|
+
notIn: "no es ninguno de",
|
|
5786
|
+
isNull: "esta vacio",
|
|
5787
|
+
isNotNull: "tiene valor",
|
|
5788
|
+
withinLastDays: "en los ultimos (dias)",
|
|
5789
|
+
beforeDays: "hace mas de (dias)",
|
|
5790
|
+
};
|
|
5791
|
+
var DEFAULT_TRANSLATIONS$1 = {
|
|
5792
|
+
includeItemsText: "Incluir los que cumplan",
|
|
5793
|
+
allConditionsLabel: "Y todas",
|
|
5794
|
+
anyConditionLabel: "O alguna",
|
|
5795
|
+
theseConditionsText: "estas condiciones:",
|
|
5796
|
+
thisConditionText: "esta condición:",
|
|
5797
|
+
nestedConditionsPrefix: "Cumplan",
|
|
5798
|
+
nestedConditionsSuffix: "de estas condiciones:",
|
|
5799
|
+
addConditionLabel: "+ Condicion",
|
|
5800
|
+
addGroupLabel: "+ Grupo de condiciones",
|
|
5801
|
+
selectPlaceholder: "Seleccionar...",
|
|
5802
|
+
selectTagPlaceholder: "Seleccionar etiqueta...",
|
|
5803
|
+
selectTagsPlaceholder: "Seleccionar etiquetas...",
|
|
5804
|
+
selectValuesPlaceholder: "Seleccionar valores...",
|
|
5805
|
+
searchPlaceholder: "Buscar...",
|
|
5806
|
+
selectedCountSingular: "seleccionado",
|
|
5807
|
+
selectedCountPlural: "seleccionados",
|
|
5808
|
+
deleteConditionTitle: "Eliminar condicion",
|
|
5809
|
+
deleteGroupTitle: "Eliminar grupo",
|
|
5810
|
+
automaticLabel: "(automatico)",
|
|
5811
|
+
fromPlaceholder: "Desde",
|
|
5812
|
+
toPlaceholder: "Hasta",
|
|
5813
|
+
betweenSeparator: "y",
|
|
5814
|
+
daysPlaceholder: "Cantidad de dias",
|
|
5815
|
+
valuePlaceholder: "Valor",
|
|
5816
|
+
textValuePlaceholder: "Escribe un valor...",
|
|
5817
|
+
maxDepthWarning: "Maximo {max} niveles de anidacion permitidos",
|
|
5818
|
+
filterSummaryTitle: "Resumen del filtro",
|
|
5819
|
+
filterSummaryPrefix: "Donde:",
|
|
5820
|
+
noConditionsText: "Sin condiciones definidas",
|
|
5821
|
+
andConnectorLabel: "Y",
|
|
5822
|
+
orConnectorLabel: "O",
|
|
5823
|
+
showJsonLabel: "Ver JSON",
|
|
5824
|
+
hideJsonLabel: "Ocultar JSON",
|
|
5825
|
+
operatorLabels: DEFAULT_OPERATOR_LABELS,
|
|
5826
|
+
};
|
|
5827
|
+
var NO_VALUE_OPERATORS = ["isNull", "isNotNull"];
|
|
5828
|
+
var MULTI_VALUE_OPERATORS = ["in", "notIn"];
|
|
5829
|
+
var BETWEEN_OPERATOR = "between";
|
|
5830
|
+
var DAYS_OPERATORS = [
|
|
5831
|
+
"withinLastDays",
|
|
5832
|
+
"beforeDays",
|
|
5833
|
+
];
|
|
5834
|
+
|
|
5835
|
+
// ─── Field Configuration ───────────────────────────────────────────
|
|
5836
|
+
// ─── Helper to check if item is a group ────────────────────────────
|
|
5837
|
+
function isGroupState(item) {
|
|
5838
|
+
return item.type === "group";
|
|
5839
|
+
}
|
|
5840
|
+
function isSegmentationGroup(item) {
|
|
5841
|
+
return "rules" in item && Array.isArray(item.rules);
|
|
5842
|
+
}
|
|
5843
|
+
|
|
5844
|
+
// ─── Helpers ───────────────────────────────────────────────────────
|
|
5845
|
+
var _idCounter = 0;
|
|
5846
|
+
function uid() {
|
|
5847
|
+
_idCounter += 1;
|
|
5848
|
+
return "seg_".concat(_idCounter, "_").concat(Date.now());
|
|
5849
|
+
}
|
|
5850
|
+
function buildFieldMap(fields) {
|
|
5851
|
+
var map = new Map();
|
|
5852
|
+
for (var _i = 0, fields_1 = fields; _i < fields_1.length; _i++) {
|
|
5853
|
+
var f = fields_1[_i];
|
|
5854
|
+
map.set(f.value, f);
|
|
5855
|
+
}
|
|
5856
|
+
return map;
|
|
5857
|
+
}
|
|
5858
|
+
function buildTagMap(tags) {
|
|
5859
|
+
var map = new Map();
|
|
5860
|
+
for (var _i = 0, tags_1 = tags; _i < tags_1.length; _i++) {
|
|
5861
|
+
var t = tags_1[_i];
|
|
5862
|
+
map.set(t.id, t.title);
|
|
5863
|
+
}
|
|
5864
|
+
return map;
|
|
5865
|
+
}
|
|
5866
|
+
// ─── Convert between internal state and JSON ───────────────────────
|
|
5867
|
+
function stateToGroup(state) {
|
|
5868
|
+
return {
|
|
5869
|
+
operator: state.operator,
|
|
5870
|
+
rules: state.rules.map(function (item) {
|
|
5871
|
+
if (isGroupState(item))
|
|
5872
|
+
return stateToGroup(item);
|
|
5873
|
+
var rule = {
|
|
5874
|
+
field: item.field,
|
|
5875
|
+
operator: item.operator,
|
|
5876
|
+
};
|
|
5877
|
+
if (item.value !== undefined)
|
|
5878
|
+
rule.value = item.value;
|
|
5879
|
+
return rule;
|
|
5880
|
+
}),
|
|
5881
|
+
};
|
|
5882
|
+
}
|
|
5883
|
+
function groupToState(group) {
|
|
5884
|
+
return {
|
|
5885
|
+
id: uid(),
|
|
5886
|
+
type: "group",
|
|
5887
|
+
operator: group.operator,
|
|
5888
|
+
rules: group.rules.map(function (item) {
|
|
5889
|
+
if (isSegmentationGroup(item))
|
|
5890
|
+
return groupToState(item);
|
|
5891
|
+
var rule = {
|
|
5892
|
+
id: uid(),
|
|
5893
|
+
type: "rule",
|
|
5894
|
+
field: item.field,
|
|
5895
|
+
operator: item.operator,
|
|
5896
|
+
};
|
|
5897
|
+
if (item.value !== undefined)
|
|
5898
|
+
rule.value = item.value;
|
|
5899
|
+
return rule;
|
|
5900
|
+
}),
|
|
5901
|
+
};
|
|
5902
|
+
}
|
|
5903
|
+
function createEmptyRule(fields) {
|
|
5904
|
+
var _a, _b;
|
|
5905
|
+
var first = fields[0];
|
|
5906
|
+
return {
|
|
5907
|
+
id: uid(),
|
|
5908
|
+
type: "rule",
|
|
5909
|
+
field: (_a = first === null || first === void 0 ? void 0 : first.value) !== null && _a !== void 0 ? _a : "",
|
|
5910
|
+
operator: (_b = first === null || first === void 0 ? void 0 : first.operators[0]) !== null && _b !== void 0 ? _b : "equals",
|
|
5911
|
+
value: undefined,
|
|
5912
|
+
};
|
|
5913
|
+
}
|
|
5914
|
+
function createEmptyGroup(fields) {
|
|
5915
|
+
return {
|
|
5916
|
+
id: uid(),
|
|
5917
|
+
type: "group",
|
|
5918
|
+
operator: "OR",
|
|
5919
|
+
rules: [createEmptyRule(fields)],
|
|
5920
|
+
};
|
|
5921
|
+
}
|
|
5922
|
+
var ChipMultiSelect = function (_a) {
|
|
5923
|
+
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;
|
|
5924
|
+
var _g = React.useState(false), isOpen = _g[0], setIsOpen = _g[1];
|
|
5925
|
+
var _h = React.useState(""), search = _h[0], setSearch = _h[1];
|
|
5926
|
+
var wrapperRef = React.useRef(null);
|
|
5927
|
+
React.useEffect(function () {
|
|
5928
|
+
var handler = function (e) {
|
|
5929
|
+
if (wrapperRef.current &&
|
|
5930
|
+
!wrapperRef.current.contains(e.target)) {
|
|
5931
|
+
setIsOpen(false);
|
|
5932
|
+
}
|
|
5933
|
+
};
|
|
5934
|
+
document.addEventListener("click", handler);
|
|
5935
|
+
return function () { return document.removeEventListener("click", handler); };
|
|
5936
|
+
}, []);
|
|
5937
|
+
var filteredOptions = React.useMemo(function () {
|
|
5938
|
+
return search
|
|
5939
|
+
? options.filter(function (o) {
|
|
5940
|
+
return o.l.toLowerCase().includes(search.toLowerCase());
|
|
5941
|
+
})
|
|
5942
|
+
: options;
|
|
5943
|
+
}, [options, search]);
|
|
5944
|
+
var toggleValue = function (v) {
|
|
5945
|
+
if (value.includes(v))
|
|
5946
|
+
onChange(value.filter(function (x) { return x !== v; }));
|
|
5947
|
+
else
|
|
5948
|
+
onChange(__spreadArray(__spreadArray([], value, true), [v], false));
|
|
5949
|
+
};
|
|
5950
|
+
var removeChip = function (v) {
|
|
5951
|
+
onChange(value.filter(function (x) { return x !== v; }));
|
|
5952
|
+
};
|
|
5953
|
+
return (jsxRuntime.jsxs("div", { ref: wrapperRef, className: "seg-chip-select relative flex-1", children: [jsxRuntime.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
|
|
5954
|
+
? "border-primary-500 bg-default-50"
|
|
5955
|
+
: "border-default-100 hover:border-default-200", " ").concat(isDisabled ? "opacity-50 pointer-events-none" : ""), onClick: function () { return !isDisabled && setIsOpen(!isOpen); }, onKeyDown: function (e) {
|
|
5956
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
5957
|
+
e.preventDefault();
|
|
5958
|
+
if (!isDisabled)
|
|
5959
|
+
setIsOpen(!isOpen);
|
|
5960
|
+
}
|
|
5961
|
+
}, role: "combobox", "aria-expanded": isOpen, tabIndex: isDisabled ? -1 : 0, children: value.length === 0 ? (jsxRuntime.jsx("span", { className: "text-default-400 text-sm", children: placeholder })) : (value.map(function (v) {
|
|
5962
|
+
var _a;
|
|
5963
|
+
var opt = options.find(function (o) { return o.v === v; });
|
|
5964
|
+
return (jsxRuntime.jsx(react.Chip, { 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));
|
|
5965
|
+
})) }), isOpen && (jsxRuntime.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 && (jsxRuntime.jsx("div", { className: "p-2 border-b border-default-100", children: jsxRuntime.jsx(react.Input, { size: "sm", variant: "faded", placeholder: searchPlaceholder, value: search, onValueChange: setSearch, onClick: function (e) { return e.stopPropagation(); }, classNames: {
|
|
5966
|
+
inputWrapper: "h-8 min-h-8",
|
|
5967
|
+
} }) })), jsxRuntime.jsx("div", { className: "overflow-y-auto flex-1 py-1", children: filteredOptions.map(function (opt) { return (jsxRuntime.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) {
|
|
5968
|
+
e.stopPropagation();
|
|
5969
|
+
toggleValue(opt.v);
|
|
5970
|
+
}, onKeyDown: function (e) {
|
|
5971
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
5972
|
+
e.preventDefault();
|
|
5973
|
+
toggleValue(opt.v);
|
|
5974
|
+
}
|
|
5975
|
+
}, role: "option", "aria-selected": value.includes(opt.v), tabIndex: 0, children: jsxRuntime.jsx(react.Checkbox, { size: "sm", isSelected: value.includes(opt.v), onValueChange: function () { return toggleValue(opt.v); }, classNames: { label: "text-sm" }, children: opt.l }) }, opt.v)); }) }), jsxRuntime.jsxs("div", { className: "px-3 py-1.5 text-xs text-default-400 border-t border-default-100", children: [value.length, " ", value.length === 1
|
|
5976
|
+
? selectedCountSingular
|
|
5977
|
+
: selectedCountPlural] })] }))] }));
|
|
5978
|
+
};
|
|
5979
|
+
var ValueInput = function (_a) {
|
|
5980
|
+
var _b, _c, _d, _e;
|
|
5981
|
+
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;
|
|
5982
|
+
if (!field)
|
|
5983
|
+
return null;
|
|
5984
|
+
// No value operators
|
|
5985
|
+
if (NO_VALUE_OPERATORS.includes(operator)) {
|
|
5986
|
+
return (jsxRuntime.jsx(react.Chip, { size: "sm", variant: "flat", color: "default", children: t.automaticLabel }));
|
|
5987
|
+
}
|
|
5988
|
+
// Enum field — multi-select (in / notIn)
|
|
5989
|
+
if (field.type === "enum" && MULTI_VALUE_OPERATORS.includes(operator)) {
|
|
5990
|
+
return (jsxRuntime.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 }));
|
|
5991
|
+
}
|
|
5992
|
+
// Enum field — single select
|
|
5993
|
+
if (field.type === "enum") {
|
|
5994
|
+
return (jsxRuntime.jsx(react.Select, { size: "sm", variant: "faded", placeholder: t.selectPlaceholder, selectedKeys: value ? [String(value)] : [], onSelectionChange: function (keys) {
|
|
5995
|
+
var selected = Array.from(keys)[0];
|
|
5996
|
+
onChange(selected || undefined);
|
|
5997
|
+
}, isDisabled: isDisabled, className: "flex-1 min-w-[160px] h-9", classNames: {
|
|
5998
|
+
trigger: "h-9 min-h-9 border border-default-100 rounded-lg data-[hover=true]:border-default-200 data-[focus=true]:border-primary-500",
|
|
5999
|
+
}, "aria-label": field.label, children: ((_c = field.enumValues) !== null && _c !== void 0 ? _c : []).map(function (ev) { return (jsxRuntime.jsx(react.SelectItem, { children: ev.l }, ev.v)); }) }));
|
|
6000
|
+
}
|
|
6001
|
+
// Tag single
|
|
6002
|
+
if (field.type === "tag-single") {
|
|
6003
|
+
return (jsxRuntime.jsx(react.Select, { size: "sm", variant: "faded", placeholder: t.selectTagPlaceholder, selectedKeys: value ? [String(value)] : [], onSelectionChange: function (keys) {
|
|
6004
|
+
var selected = Array.from(keys)[0];
|
|
6005
|
+
onChange(selected || undefined);
|
|
6006
|
+
}, isDisabled: isDisabled, className: "flex-1 min-w-[160px] h-9", classNames: {
|
|
6007
|
+
trigger: "h-9 min-h-9 border border-default-100 rounded-lg data-[hover=true]:border-default-200 data-[focus=true]:border-primary-500",
|
|
6008
|
+
}, "aria-label": field.label, children: tags.map(function (tag) { return (jsxRuntime.jsx(react.SelectItem, { children: tag.title }, tag.id)); }) }));
|
|
6009
|
+
}
|
|
6010
|
+
// Tag multi
|
|
6011
|
+
if (field.type === "tag-multi") {
|
|
6012
|
+
var tagOpts = tags.map(function (tag) { return ({ v: tag.id, l: tag.title }); });
|
|
6013
|
+
return (jsxRuntime.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 }));
|
|
6014
|
+
}
|
|
6015
|
+
// Between operator
|
|
6016
|
+
if (operator === BETWEEN_OPERATOR) {
|
|
6017
|
+
var isDate_1 = field.type === "date";
|
|
6018
|
+
var arr_1 = Array.isArray(value) ? value : [undefined, undefined];
|
|
6019
|
+
return (jsxRuntime.jsxs("div", { className: "flex items-center gap-2 flex-1", children: [jsxRuntime.jsx(react.Input, { 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) {
|
|
6020
|
+
var _a;
|
|
6021
|
+
var parsed = isDate_1
|
|
6022
|
+
? v
|
|
6023
|
+
: v !== ""
|
|
6024
|
+
? Number(v)
|
|
6025
|
+
: undefined;
|
|
6026
|
+
onChange([
|
|
6027
|
+
parsed,
|
|
6028
|
+
(_a = arr_1[1]) !== null && _a !== void 0 ? _a : "",
|
|
6029
|
+
]);
|
|
6030
|
+
}, isDisabled: isDisabled, className: "flex-1", "aria-label": t.fromPlaceholder, classNames: {
|
|
6031
|
+
inputWrapper: "h-9 min-h-9",
|
|
6032
|
+
input: "text-center",
|
|
6033
|
+
} }), jsxRuntime.jsx("span", { className: "text-default-400 text-sm shrink-0", children: t.betweenSeparator }), jsxRuntime.jsx(react.Input, { 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) {
|
|
6034
|
+
var _a;
|
|
6035
|
+
var parsed = isDate_1
|
|
6036
|
+
? v
|
|
6037
|
+
: v !== ""
|
|
6038
|
+
? Number(v)
|
|
6039
|
+
: undefined;
|
|
6040
|
+
onChange([
|
|
6041
|
+
(_a = arr_1[0]) !== null && _a !== void 0 ? _a : "",
|
|
6042
|
+
parsed,
|
|
6043
|
+
]);
|
|
6044
|
+
}, isDisabled: isDisabled, className: "flex-1", "aria-label": t.toPlaceholder, classNames: {
|
|
6045
|
+
inputWrapper: "h-9 min-h-9",
|
|
6046
|
+
input: "text-center",
|
|
6047
|
+
} })] }));
|
|
6048
|
+
}
|
|
6049
|
+
// Days operators
|
|
6050
|
+
if (DAYS_OPERATORS.includes(operator)) {
|
|
6051
|
+
return (jsxRuntime.jsx(react.Input, { size: "sm", variant: "faded", type: "number", min: 0, placeholder: t.daysPlaceholder, value: value !== undefined ? String(value) : "", onValueChange: function (v) {
|
|
6052
|
+
return onChange(v !== "" ? Number(v) : undefined);
|
|
6053
|
+
}, isDisabled: isDisabled, className: "flex-1 min-w-[140px]", classNames: { inputWrapper: "h-9 min-h-9" }, "aria-label": t.daysPlaceholder }));
|
|
6054
|
+
}
|
|
6055
|
+
// Number field
|
|
6056
|
+
if (field.type === "number") {
|
|
6057
|
+
return (jsxRuntime.jsx(react.Input, { size: "sm", variant: "faded", type: "number", min: 0, placeholder: t.valuePlaceholder, value: value !== undefined ? String(value) : "", onValueChange: function (v) {
|
|
6058
|
+
return onChange(v !== "" ? Number(v) : undefined);
|
|
6059
|
+
}, isDisabled: isDisabled, className: "flex-1 min-w-[120px]", classNames: { inputWrapper: "h-9 min-h-9" }, "aria-label": t.valuePlaceholder }));
|
|
6060
|
+
}
|
|
6061
|
+
// Date field
|
|
6062
|
+
if (field.type === "date") {
|
|
6063
|
+
return (jsxRuntime.jsx(react.Input, { 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 }));
|
|
6064
|
+
}
|
|
6065
|
+
// Text field (default)
|
|
6066
|
+
return (jsxRuntime.jsx(react.Input, { 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 }));
|
|
6067
|
+
};
|
|
6068
|
+
// ─── ConnectorPill Sub-component (compact: text only) ─────────────────
|
|
6069
|
+
var ConnectorPill = function (_a) {
|
|
6070
|
+
var isAnd = _a.isAnd, label = _a.label;
|
|
6071
|
+
return (jsxRuntime.jsxs("div", { className: "flex items-center gap-2 py-1", children: [jsxRuntime.jsx("div", { className: "flex-1 h-px bg-default-200" }), jsxRuntime.jsx(react.Chip, { size: "sm", variant: "flat", color: isAnd ? "secondary" : "success", children: label }), jsxRuntime.jsx("div", { className: "flex-1 h-px bg-default-200" })] }));
|
|
6072
|
+
};
|
|
6073
|
+
var RuleRow = function (_a) {
|
|
6074
|
+
var _b;
|
|
6075
|
+
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;
|
|
6076
|
+
var meta = fieldMap.get(rule.field);
|
|
6077
|
+
var operators = (_b = meta === null || meta === void 0 ? void 0 : meta.operators) !== null && _b !== void 0 ? _b : [];
|
|
6078
|
+
var opLabels = __assign(__assign({}, DEFAULT_OPERATOR_LABELS), t.operatorLabels);
|
|
6079
|
+
// Group fields by category
|
|
6080
|
+
var categories = React.useMemo(function () {
|
|
6081
|
+
var cats = [];
|
|
6082
|
+
var last = "";
|
|
6083
|
+
for (var _i = 0, fields_2 = fields; _i < fields_2.length; _i++) {
|
|
6084
|
+
var f = fields_2[_i];
|
|
6085
|
+
if (f.category !== last) {
|
|
6086
|
+
cats.push({ category: f.category, fields: [f] });
|
|
6087
|
+
last = f.category;
|
|
6088
|
+
}
|
|
6089
|
+
else {
|
|
6090
|
+
cats[cats.length - 1].fields.push(f);
|
|
6091
|
+
}
|
|
6092
|
+
}
|
|
6093
|
+
return cats;
|
|
6094
|
+
}, [fields]);
|
|
6095
|
+
var handleFieldChange = function (newField) {
|
|
6096
|
+
var _a;
|
|
6097
|
+
var newMeta = fieldMap.get(newField);
|
|
6098
|
+
var newOp = (_a = newMeta === null || newMeta === void 0 ? void 0 : newMeta.operators[0]) !== null && _a !== void 0 ? _a : "equals";
|
|
6099
|
+
onUpdate(__assign(__assign({}, rule), { field: newField, operator: newOp, value: undefined }));
|
|
6100
|
+
};
|
|
6101
|
+
var handleOperatorChange = function (newOp) {
|
|
6102
|
+
onUpdate(__assign(__assign({}, rule), { operator: newOp, value: undefined }));
|
|
6103
|
+
};
|
|
6104
|
+
var handleValueChange = function (newValue) {
|
|
6105
|
+
onUpdate(__assign(__assign({}, rule), { value: newValue }));
|
|
6106
|
+
};
|
|
6107
|
+
return (jsxRuntime.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: [jsxRuntime.jsx(react.Select, { size: "sm", variant: "faded", selectedKeys: [rule.field], onSelectionChange: function (keys) {
|
|
6108
|
+
var selected = Array.from(keys)[0];
|
|
6109
|
+
if (selected)
|
|
6110
|
+
handleFieldChange(selected);
|
|
6111
|
+
}, isDisabled: isDisabled, className: "w-full sm:min-w-[170px] sm:max-w-[200px] sm:shrink-0", classNames: {
|
|
6112
|
+
trigger: "h-9 min-h-9 border border-default-100 rounded-lg data-[hover=true]:border-default-200 data-[focus=true]:border-primary-500",
|
|
6113
|
+
}, "aria-label": "Campo", children: categories.map(function (cat) { return (jsxRuntime.jsx(react.SelectSection, { title: cat.category, children: cat.fields.map(function (f) { return (jsxRuntime.jsx(react.SelectItem, { children: f.label }, f.value)); }) }, cat.category)); }) }), jsxRuntime.jsx(react.Select, { size: "sm", variant: "faded", selectedKeys: [rule.operator], onSelectionChange: function (keys) {
|
|
6114
|
+
var selected = Array.from(keys)[0];
|
|
6115
|
+
if (selected)
|
|
6116
|
+
handleOperatorChange(selected);
|
|
6117
|
+
}, isDisabled: isDisabled, className: "w-full sm:min-w-[140px] sm:max-w-[180px] sm:shrink-0", classNames: {
|
|
6118
|
+
trigger: "h-9 min-h-9 border border-default-100 rounded-lg data-[hover=true]:border-default-200 data-[focus=true]:border-primary-500",
|
|
6119
|
+
}, "aria-label": "Operador", children: operators.map(function (op) {
|
|
6120
|
+
var _a;
|
|
6121
|
+
return (jsxRuntime.jsx(react.SelectItem, { children: (_a = opLabels[op]) !== null && _a !== void 0 ? _a : op }, op));
|
|
6122
|
+
}) }), jsxRuntime.jsx("div", { className: "w-full sm:flex-1 sm:min-w-0 flex items-center", children: jsxRuntime.jsx(ValueInput, { field: meta, operator: rule.operator, value: rule.value, tags: tags, onChange: handleValueChange, translations: t, isDisabled: isDisabled }) }), jsxRuntime.jsx(react.Button, { 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" })] }));
|
|
6123
|
+
};
|
|
6124
|
+
var FilterGroup = function (_a) {
|
|
6125
|
+
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;
|
|
6126
|
+
var isAnd = group.operator === "AND";
|
|
6127
|
+
var connectorLabel = isAnd ? t.andConnectorLabel : t.orConnectorLabel;
|
|
6128
|
+
var toggleOperator = function (op) {
|
|
6129
|
+
onUpdate(__assign(__assign({}, group), { operator: op }));
|
|
6130
|
+
};
|
|
6131
|
+
var updateRule = function (index, updated) {
|
|
6132
|
+
var newRules = __spreadArray([], group.rules, true);
|
|
6133
|
+
newRules[index] = updated;
|
|
6134
|
+
onUpdate(__assign(__assign({}, group), { rules: newRules }));
|
|
6135
|
+
};
|
|
6136
|
+
var deleteRule = function (index) {
|
|
6137
|
+
var newRules = group.rules.filter(function (_, i) { return i !== index; });
|
|
6138
|
+
onUpdate(__assign(__assign({}, group), { rules: newRules }));
|
|
6139
|
+
};
|
|
6140
|
+
var addRule = function () {
|
|
6141
|
+
onUpdate(__assign(__assign({}, group), { rules: __spreadArray(__spreadArray([], group.rules, true), [createEmptyRule(fields)], false) }));
|
|
6142
|
+
};
|
|
6143
|
+
var addGroup = function () {
|
|
6144
|
+
if (depth >= maxDepth)
|
|
6145
|
+
return;
|
|
6146
|
+
onUpdate(__assign(__assign({}, group), { rules: __spreadArray(__spreadArray([], group.rules, true), [createEmptyGroup(fields)], false) }));
|
|
6147
|
+
};
|
|
6148
|
+
return (jsxRuntime.jsxs("div", { className: "seg-filter-group w-full min-w-0", children: [jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-2 mb-3 text-sm text-default-700", children: [jsxRuntime.jsx("span", { children: depth === 1
|
|
6149
|
+
? t.includeItemsText
|
|
6150
|
+
: t.nestedConditionsPrefix }), jsxRuntime.jsxs("span", { className: "inline-flex rounded-md overflow-hidden border border-default-200", children: [jsxRuntime.jsx(react.Button, { size: "sm", radius: "none", variant: isAnd ? "solid" : "light", color: isAnd ? "secondary" : "default", className: "min-w-0 px-2.5 text-xs ".concat(isAnd
|
|
6151
|
+
? "font-semibold"
|
|
6152
|
+
: "text-default-500 font-semibold"), onPress: function () { return toggleOperator("AND"); }, isDisabled: isDisabled, "aria-label": t.allConditionsLabel, children: t.andConnectorLabel }), jsxRuntime.jsx(react.Button, { size: "sm", radius: "none", variant: !isAnd ? "solid" : "light", color: !isAnd ? "success" : "default", className: "min-w-0 px-2.5 text-xs ".concat(!isAnd
|
|
6153
|
+
? "font-semibold"
|
|
6154
|
+
: "text-default-500 font-semibold"), onPress: function () { return toggleOperator("OR"); }, isDisabled: isDisabled, "aria-label": t.anyConditionLabel, children: t.orConnectorLabel })] }), jsxRuntime.jsx("span", { children: depth === 1
|
|
6155
|
+
? group.rules.length >= 2
|
|
6156
|
+
? t.theseConditionsText
|
|
6157
|
+
: t.thisConditionText
|
|
6158
|
+
: t.nestedConditionsSuffix })] }), jsxRuntime.jsx("div", { className: "seg-rules-list flex flex-col gap-0", children: group.rules.map(function (item, index) { return (jsxRuntime.jsxs("div", { children: [index > 0 && (jsxRuntime.jsx(ConnectorPill, { isAnd: isAnd, label: connectorLabel })), isGroupState(item) ? (jsxRuntime.jsxs("div", { className: "seg-nested-wrap relative border-2 rounded-xl p-4 ".concat(item.operator === "AND"
|
|
6159
|
+
? "border-secondary/30 bg-secondary-50"
|
|
6160
|
+
: "border-success/30 bg-success-50"), children: [jsxRuntime.jsx(react.Button, { 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" }), jsxRuntime.jsx(FilterGroup, { group: item, fields: fields, fieldMap: fieldMap, tags: tags, depth: depth + 1, maxDepth: maxDepth, onUpdate: function (updated) {
|
|
6161
|
+
return updateRule(index, updated);
|
|
6162
|
+
}, translations: t, isDisabled: isDisabled })] })) : (jsxRuntime.jsx(RuleRow, { rule: item, fields: fields, fieldMap: fieldMap, tags: tags, onUpdate: function (updated) {
|
|
6163
|
+
return updateRule(index, updated);
|
|
6164
|
+
}, onDelete: function () { return deleteRule(index); }, translations: t, isDisabled: isDisabled }))] }, item.id)); }) }), jsxRuntime.jsxs("div", { className: "seg-add-actions flex flex-wrap gap-2 mt-3", children: [jsxRuntime.jsx(react.Button, { variant: "bordered", size: "sm", className: "border-dashed text-default-500", onPress: addRule, isDisabled: isDisabled, children: t.addConditionLabel }), depth < maxDepth && (jsxRuntime.jsx(react.Button, { variant: "bordered", size: "sm", className: "border-dashed text-default-500", onPress: addGroup, isDisabled: isDisabled, children: t.addGroupLabel }))] })] }));
|
|
6165
|
+
};
|
|
6166
|
+
var FilterSummary = function (_a) {
|
|
6167
|
+
var group = _a.group, fieldMap = _a.fieldMap, tagMap = _a.tagMap, t = _a.translations;
|
|
6168
|
+
var opLabels = __assign(__assign({}, DEFAULT_OPERATOR_LABELS), t.operatorLabels);
|
|
6169
|
+
var humanValue = function (field, operator, value) {
|
|
6170
|
+
var _a, _b;
|
|
6171
|
+
if (operator === "isNull" || operator === "isNotNull")
|
|
6172
|
+
return "";
|
|
6173
|
+
if (value === undefined || value === null)
|
|
6174
|
+
return "(sin valor)";
|
|
6175
|
+
var meta = fieldMap.get(field);
|
|
6176
|
+
if (!meta)
|
|
6177
|
+
return String(value);
|
|
6178
|
+
if (meta.type === "tag-single")
|
|
6179
|
+
return (_a = tagMap.get(value)) !== null && _a !== void 0 ? _a : String(value);
|
|
6180
|
+
if (meta.type === "tag-multi" && Array.isArray(value)) {
|
|
6181
|
+
return value
|
|
6182
|
+
.map(function (v) { var _a; return (_a = tagMap.get(v)) !== null && _a !== void 0 ? _a : String(v); })
|
|
6183
|
+
.join(", ");
|
|
6184
|
+
}
|
|
6185
|
+
if (meta.type === "enum" && meta.enumValues) {
|
|
6186
|
+
var enumMap_1 = new Map(meta.enumValues.map(function (ev) { return [ev.v, ev.l]; }));
|
|
6187
|
+
if (Array.isArray(value))
|
|
6188
|
+
return value
|
|
6189
|
+
.map(function (v) { var _a; return (_a = enumMap_1.get(v)) !== null && _a !== void 0 ? _a : v; })
|
|
6190
|
+
.join(", ");
|
|
6191
|
+
return (_b = enumMap_1.get(value)) !== null && _b !== void 0 ? _b : String(value);
|
|
6192
|
+
}
|
|
6193
|
+
if (operator === "between" && Array.isArray(value))
|
|
6194
|
+
return "".concat(value[0], " ").concat(t.betweenSeparator, " ").concat(value[1]);
|
|
6195
|
+
if (operator === "withinLastDays" || operator === "beforeDays")
|
|
6196
|
+
return "".concat(value, " dias");
|
|
6197
|
+
if (Array.isArray(value))
|
|
6198
|
+
return value.join(", ");
|
|
6199
|
+
return String(value);
|
|
6200
|
+
};
|
|
6201
|
+
var translateRule = function (rule) {
|
|
6202
|
+
var _a, _b;
|
|
6203
|
+
var meta = fieldMap.get(rule.field);
|
|
6204
|
+
var fieldLabel = (_a = meta === null || meta === void 0 ? void 0 : meta.label) !== null && _a !== void 0 ? _a : rule.field;
|
|
6205
|
+
var opLabel = (_b = opLabels[rule.operator]) !== null && _b !== void 0 ? _b : rule.operator;
|
|
6206
|
+
var val = humanValue(rule.field, rule.operator, rule.value);
|
|
6207
|
+
return "".concat(fieldLabel, " ").concat(opLabel).concat(val ? " ".concat(val) : "");
|
|
6208
|
+
};
|
|
6209
|
+
var translateGroup = function (grp, d) {
|
|
6210
|
+
var conn = grp.operator === "AND"
|
|
6211
|
+
? " ".concat(t.andConnectorLabel, " ")
|
|
6212
|
+
: " ".concat(t.orConnectorLabel, " ");
|
|
6213
|
+
var parts = grp.rules.map(function (item) {
|
|
6214
|
+
if (isSegmentationGroup(item))
|
|
6215
|
+
return "(".concat(translateGroup(item), ")");
|
|
6216
|
+
return translateRule(item);
|
|
6217
|
+
});
|
|
6218
|
+
if (!parts.length)
|
|
6219
|
+
return t.noConditionsText;
|
|
6220
|
+
return parts.join(conn);
|
|
6221
|
+
};
|
|
6222
|
+
if (!group.rules.length)
|
|
6223
|
+
return null;
|
|
6224
|
+
return (jsxRuntime.jsxs("div", { className: "seg-summary mt-4 p-4 bg-success-50 border border-success/20 rounded-xl", children: [jsxRuntime.jsx("div", { className: "text-sm font-semibold text-success-600 mb-1", children: t.filterSummaryTitle }), jsxRuntime.jsxs("div", { className: "text-sm text-default-700", children: [t.filterSummaryPrefix, " ", translateGroup(group)] })] }));
|
|
6225
|
+
};
|
|
6226
|
+
// ─── Main Component ────────────────────────────────────────────────
|
|
6227
|
+
var SegmentationBuilder = React.forwardRef(function (_a, ref) {
|
|
6228
|
+
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;
|
|
6229
|
+
var t = React.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]);
|
|
6230
|
+
var fMap = React.useMemo(function () { return buildFieldMap(fields); }, [fields]);
|
|
6231
|
+
var tMap = React.useMemo(function () { return buildTagMap(tags); }, [tags]);
|
|
6232
|
+
// Internal state
|
|
6233
|
+
var _h = React.useState(function () {
|
|
6234
|
+
if (value)
|
|
6235
|
+
return groupToState(value);
|
|
6236
|
+
return {
|
|
6237
|
+
id: uid(),
|
|
6238
|
+
type: "group",
|
|
6239
|
+
operator: "AND",
|
|
6240
|
+
rules: [createEmptyRule(fields)],
|
|
6241
|
+
};
|
|
6242
|
+
}), internalState = _h[0], setInternalState = _h[1];
|
|
6243
|
+
var _j = React.useState(false), isJsonVisible = _j[0], setIsJsonVisible = _j[1];
|
|
6244
|
+
// Sync from controlled value
|
|
6245
|
+
var isControlled = value !== undefined;
|
|
6246
|
+
var prevValueRef = React.useRef(value);
|
|
6247
|
+
React.useEffect(function () {
|
|
6248
|
+
if (isControlled && value && value !== prevValueRef.current) {
|
|
6249
|
+
setInternalState(groupToState(value));
|
|
6250
|
+
prevValueRef.current = value;
|
|
6251
|
+
}
|
|
6252
|
+
}, [value, isControlled]);
|
|
6253
|
+
// Build the output filter
|
|
6254
|
+
var currentFilter = React.useMemo(function () { return stateToGroup(internalState); }, [internalState]);
|
|
6255
|
+
// Notify onChange on state change
|
|
6256
|
+
var isFirstRender = React.useRef(true);
|
|
6257
|
+
React.useEffect(function () {
|
|
6258
|
+
if (isFirstRender.current) {
|
|
6259
|
+
isFirstRender.current = false;
|
|
6260
|
+
return;
|
|
6261
|
+
}
|
|
6262
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(currentFilter);
|
|
6263
|
+
}, [currentFilter, onChange]);
|
|
6264
|
+
// Expose imperative handle
|
|
6265
|
+
React.useImperativeHandle(ref, function () { return ({
|
|
6266
|
+
getFilter: function () { return stateToGroup(internalState); },
|
|
6267
|
+
getPayload: function () { return ({ filter: stateToGroup(internalState) }); },
|
|
6268
|
+
reset: function () {
|
|
6269
|
+
var newState = {
|
|
6270
|
+
id: uid(),
|
|
6271
|
+
type: "group",
|
|
6272
|
+
operator: "AND",
|
|
6273
|
+
rules: [createEmptyRule(fields)],
|
|
6274
|
+
};
|
|
6275
|
+
setInternalState(newState);
|
|
6276
|
+
},
|
|
6277
|
+
}); }, [internalState, fields]);
|
|
6278
|
+
var handleGroupUpdate = React.useCallback(function (updated) {
|
|
6279
|
+
setInternalState(updated);
|
|
6280
|
+
}, []);
|
|
6281
|
+
return (jsxRuntime.jsxs("div", { className: "seg-builder relative w-full min-w-0 ".concat(showJsonPreview ? "pr-10" : "", " ").concat(className), children: [showJsonPreview && (jsxRuntime.jsx(react.Button, { 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 ? (jsxRuntime.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: [jsxRuntime.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" }), jsxRuntime.jsx("line", { x1: "1", y1: "1", x2: "23", y2: "23" })] })) : (jsxRuntime.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: [jsxRuntime.jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3" })] })) })), jsxRuntime.jsx(FilterGroup, { group: internalState, fields: fields, fieldMap: fMap, tags: tags, depth: 1, maxDepth: maxDepth, onUpdate: handleGroupUpdate, translations: t, isDisabled: isDisabled }), showSummary && (jsxRuntime.jsx(FilterSummary, { group: currentFilter, fieldMap: fMap, tagMap: tMap, translations: t })), showJsonPreview && isJsonVisible && (jsxRuntime.jsx("div", { className: "seg-json-preview mt-4", children: jsxRuntime.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) }) }))] }));
|
|
6282
|
+
});
|
|
6283
|
+
SegmentationBuilder.displayName = "SegmentationBuilder";
|
|
6284
|
+
|
|
5771
6285
|
var DEFAULT_TRANSLATIONS = {
|
|
5772
6286
|
placeholder: "Nombre de la etiqueta",
|
|
5773
6287
|
labelSelect: "Selecciona etiqueta",
|
|
@@ -6284,8 +6798,10 @@ exports.Phone = Phone;
|
|
|
6284
6798
|
exports.PromotionalBanner = PromotionalBanner;
|
|
6285
6799
|
exports.RangeFilter = RangeFilter;
|
|
6286
6800
|
exports.RowSteps = RowSteps;
|
|
6801
|
+
exports.SEGMENTATION_DEFAULT_TRANSLATIONS = DEFAULT_TRANSLATIONS$1;
|
|
6287
6802
|
exports.ScheduleRow = ScheduleRow;
|
|
6288
6803
|
exports.SearchInput = SearchInput;
|
|
6804
|
+
exports.SegmentationBuilder = SegmentationBuilder;
|
|
6289
6805
|
exports.Select = Select;
|
|
6290
6806
|
exports.SimpleLineChart = SimpleLineChart;
|
|
6291
6807
|
exports.SocialMediaBar = SocialMediaBar;
|
|
@@ -6317,7 +6833,9 @@ exports.getSelectedKeyFromPath = getSelectedKeyFromPath;
|
|
|
6317
6833
|
exports.hexToThemeColor = hexToThemeColor;
|
|
6318
6834
|
exports.hslToCssValue = hslToCssValue;
|
|
6319
6835
|
exports.isExactThemeColor = isExactThemeColor;
|
|
6836
|
+
exports.isGroupState = isGroupState;
|
|
6320
6837
|
exports.isHexColor = isHexColor;
|
|
6838
|
+
exports.isSegmentationGroup = isSegmentationGroup;
|
|
6321
6839
|
exports.removeCustomPrimaryColor = removeCustomPrimaryColor;
|
|
6322
6840
|
exports.sizeMap = sizeMap;
|
|
6323
6841
|
exports.themeColors = themeColors;
|