@bigbinary/neeto-filters-frontend 3.1.2 → 3.2.0-beta.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/README.md +3 -0
- package/app/javascript/src/translations/en.json +10 -6
- package/package.json +8 -8
- package/types.d.ts +42 -26
- package/dist/index.cjs.js +0 -3860
- package/dist/index.cjs.js.map +0 -1
- package/dist/index.js +0 -3816
- package/dist/index.js.map +0 -1
package/dist/index.js
DELETED
|
@@ -1,3816 +0,0 @@
|
|
|
1
|
-
import React, { useState, useRef, useEffect, useTransition, useMemo } from 'react';
|
|
2
|
-
import classnames from 'classnames';
|
|
3
|
-
import i18next, { t as t$1 } from 'i18next';
|
|
4
|
-
import { findBy, isNotEmpty, capitalize, removeBy, humanize, hyphenate, noop as noop$1, toLabelAndValue, replaceBy, isPresent, existsBy, isNotPresent, filterBy } from '@bigbinary/neeto-cist';
|
|
5
|
-
import { useMutationWithInvalidation, useQueryParams, useDebounce, withT } from '@bigbinary/neeto-commons-frontend/react-utils';
|
|
6
|
-
import { getQueryParams, dateFormat, buildUrl } from '@bigbinary/neeto-commons-frontend/utils';
|
|
7
|
-
import { Tooltip, Typography, Dropdown as Dropdown$2, Button, Pane as Pane$1, Alert, Select, DatePicker, TimePicker, Input as Input$1, Accordion, Spinner } from '@bigbinary/neetoui';
|
|
8
|
-
import { groupBy, anyPass, isNil, isEmpty, any, concat, omit, toLower, mergeLeft, identity, mergeRight, toPairs, not, pluck, either, has, equals, pick, modify, prop, isNotNil, append, last, mergeDeepRight } from 'ramda';
|
|
9
|
-
import { useTranslation, Trans } from 'react-i18next';
|
|
10
|
-
import { useHistory, useLocation } from 'react-router-dom';
|
|
11
|
-
import useHotkeys from '@bigbinary/neeto-hotkeys';
|
|
12
|
-
import { Help, Close, MenuHorizontal, Down, Settings } from '@bigbinary/neeto-icons';
|
|
13
|
-
import { Form, Input, ActionBlock } from '@bigbinary/neetoui/formik';
|
|
14
|
-
import { useQuery } from 'react-query';
|
|
15
|
-
import axios from 'axios';
|
|
16
|
-
import * as yup from 'yup';
|
|
17
|
-
import Search from '@bigbinary/neeto-molecules/Search';
|
|
18
|
-
import ReactDOM, { createPortal } from 'react-dom';
|
|
19
|
-
import MenuBar from '@bigbinary/neeto-molecules/MenuBar';
|
|
20
|
-
import { FormikInlineInput } from '@bigbinary/neeto-molecules/InlineInput';
|
|
21
|
-
|
|
22
|
-
function _arrayLikeToArray(arr, len) {
|
|
23
|
-
if (len == null || len > arr.length) len = arr.length;
|
|
24
|
-
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
|
|
25
|
-
return arr2;
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
function _arrayWithoutHoles(arr) {
|
|
29
|
-
if (Array.isArray(arr)) return _arrayLikeToArray(arr);
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
function _iterableToArray(iter) {
|
|
33
|
-
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
function _unsupportedIterableToArray(o, minLen) {
|
|
37
|
-
if (!o) return;
|
|
38
|
-
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
|
|
39
|
-
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
40
|
-
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
41
|
-
if (n === "Map" || n === "Set") return Array.from(o);
|
|
42
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
function _nonIterableSpread() {
|
|
46
|
-
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
function _toConsumableArray(arr) {
|
|
50
|
-
return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
function _typeof(o) {
|
|
54
|
-
"@babel/helpers - typeof";
|
|
55
|
-
|
|
56
|
-
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
|
|
57
|
-
return typeof o;
|
|
58
|
-
} : function (o) {
|
|
59
|
-
return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
|
|
60
|
-
}, _typeof(o);
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
function _toPrimitive(input, hint) {
|
|
64
|
-
if (_typeof(input) !== "object" || input === null) return input;
|
|
65
|
-
var prim = input[Symbol.toPrimitive];
|
|
66
|
-
if (prim !== undefined) {
|
|
67
|
-
var res = prim.call(input, hint || "default");
|
|
68
|
-
if (_typeof(res) !== "object") return res;
|
|
69
|
-
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
70
|
-
}
|
|
71
|
-
return (hint === "string" ? String : Number)(input);
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
function _toPropertyKey(arg) {
|
|
75
|
-
var key = _toPrimitive(arg, "string");
|
|
76
|
-
return _typeof(key) === "symbol" ? key : String(key);
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
function _defineProperty(obj, key, value) {
|
|
80
|
-
key = _toPropertyKey(key);
|
|
81
|
-
if (key in obj) {
|
|
82
|
-
Object.defineProperty(obj, key, {
|
|
83
|
-
value: value,
|
|
84
|
-
enumerable: true,
|
|
85
|
-
configurable: true,
|
|
86
|
-
writable: true
|
|
87
|
-
});
|
|
88
|
-
} else {
|
|
89
|
-
obj[key] = value;
|
|
90
|
-
}
|
|
91
|
-
return obj;
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
var SEGMENTS_BASE_URL = "/neeto_filters/segments";
|
|
95
|
-
var DATE_OPTIONS = [{
|
|
96
|
-
label: "Today",
|
|
97
|
-
value: "today"
|
|
98
|
-
}, {
|
|
99
|
-
label: "Yesterday",
|
|
100
|
-
value: "yesterday"
|
|
101
|
-
}, {
|
|
102
|
-
label: "This week",
|
|
103
|
-
value: "this-week"
|
|
104
|
-
}, {
|
|
105
|
-
label: "Last week",
|
|
106
|
-
value: "last-week"
|
|
107
|
-
}, {
|
|
108
|
-
label: "This month",
|
|
109
|
-
value: "this-month"
|
|
110
|
-
}, {
|
|
111
|
-
label: "Last month",
|
|
112
|
-
value: "last-month"
|
|
113
|
-
}, {
|
|
114
|
-
label: "This year",
|
|
115
|
-
value: "this-year"
|
|
116
|
-
}, {
|
|
117
|
-
label: "Last year",
|
|
118
|
-
value: "last-year"
|
|
119
|
-
}, {
|
|
120
|
-
label: "All time",
|
|
121
|
-
value: "all-time"
|
|
122
|
-
}, {
|
|
123
|
-
label: "After",
|
|
124
|
-
value: "after"
|
|
125
|
-
}, {
|
|
126
|
-
label: "Before",
|
|
127
|
-
value: "before"
|
|
128
|
-
}, {
|
|
129
|
-
label: "Custom date range",
|
|
130
|
-
value: "custom-date-range"
|
|
131
|
-
}];
|
|
132
|
-
var SINGLE_DATE_OPTIONS = [{
|
|
133
|
-
label: "On",
|
|
134
|
-
value: "on"
|
|
135
|
-
}, {
|
|
136
|
-
label: "After",
|
|
137
|
-
value: "after"
|
|
138
|
-
}, {
|
|
139
|
-
label: "Before",
|
|
140
|
-
value: "before"
|
|
141
|
-
}, {
|
|
142
|
-
label: "Between",
|
|
143
|
-
value: "between"
|
|
144
|
-
}];
|
|
145
|
-
var SINGLE_TIME_OPTIONS = [{
|
|
146
|
-
label: "At",
|
|
147
|
-
value: "at"
|
|
148
|
-
}, {
|
|
149
|
-
label: "After",
|
|
150
|
-
value: "after"
|
|
151
|
-
}, {
|
|
152
|
-
label: "Before",
|
|
153
|
-
value: "before"
|
|
154
|
-
}, {
|
|
155
|
-
label: "Between",
|
|
156
|
-
value: "between"
|
|
157
|
-
}];
|
|
158
|
-
var TIME_OPTIONS = [{
|
|
159
|
-
label: "This hour",
|
|
160
|
-
value: "this-hour"
|
|
161
|
-
}, {
|
|
162
|
-
label: "Last hour",
|
|
163
|
-
value: "last-hour"
|
|
164
|
-
}, {
|
|
165
|
-
label: "Custom time range",
|
|
166
|
-
value: "custom-time-range"
|
|
167
|
-
}];
|
|
168
|
-
var DATE_RULES = {
|
|
169
|
-
today: "on",
|
|
170
|
-
yesterday: "on",
|
|
171
|
-
"all-time": "before"
|
|
172
|
-
};
|
|
173
|
-
var SEARCH_TERM_KEY = "search_term";
|
|
174
|
-
var SEGMENT_ID_KEY = "segment_id";
|
|
175
|
-
|
|
176
|
-
var SHORTCUTS = {
|
|
177
|
-
closePane: {
|
|
178
|
-
sequence: "escape",
|
|
179
|
-
description: t$1("neetoFilters.shortcuts.closePane")
|
|
180
|
-
},
|
|
181
|
-
deleteBlock: {
|
|
182
|
-
sequence: "backspace",
|
|
183
|
-
description: t$1("neetoFilters.shortcuts.deleteBlock")
|
|
184
|
-
},
|
|
185
|
-
openFilterPane: {
|
|
186
|
-
sequence: "enter",
|
|
187
|
-
description: t$1("neetoFilters.shortcuts.openFilterPane")
|
|
188
|
-
}
|
|
189
|
-
};
|
|
190
|
-
|
|
191
|
-
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
192
|
-
|
|
193
|
-
function getDefaultExportFromCjs (x) {
|
|
194
|
-
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
|
|
195
|
-
}
|
|
196
|
-
|
|
197
|
-
var dayjs_min = {exports: {}};
|
|
198
|
-
|
|
199
|
-
dayjs_min.exports;
|
|
200
|
-
|
|
201
|
-
(function (module, exports) {
|
|
202
|
-
!function(t,e){module.exports=e();}(commonjsGlobal,(function(){var t=1e3,e=6e4,n=36e5,r="millisecond",i="second",s="minute",u="hour",a="day",o="week",c="month",f="quarter",h="year",d="date",l="Invalid Date",$=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,y=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,M={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(t){var e=["th","st","nd","rd"],n=t%100;return "["+t+(e[(n-20)%10]||e[n]||e[0])+"]"}},m=function(t,e,n){var r=String(t);return !r||r.length>=e?t:""+Array(e+1-r.length).join(n)+t},v={s:m,z:function(t){var e=-t.utcOffset(),n=Math.abs(e),r=Math.floor(n/60),i=n%60;return (e<=0?"+":"-")+m(r,2,"0")+":"+m(i,2,"0")},m:function t(e,n){if(e.date()<n.date())return -t(n,e);var r=12*(n.year()-e.year())+(n.month()-e.month()),i=e.clone().add(r,c),s=n-i<0,u=e.clone().add(r+(s?-1:1),c);return +(-(r+(n-i)/(s?i-u:u-i))||0)},a:function(t){return t<0?Math.ceil(t)||0:Math.floor(t)},p:function(t){return {M:c,y:h,w:o,d:a,D:d,h:u,m:s,s:i,ms:r,Q:f}[t]||String(t||"").toLowerCase().replace(/s$/,"")},u:function(t){return void 0===t}},g="en",D={};D[g]=M;var p="$isDayjsObject",S=function(t){return t instanceof _||!(!t||!t[p])},w=function t(e,n,r){var i;if(!e)return g;if("string"==typeof e){var s=e.toLowerCase();D[s]&&(i=s),n&&(D[s]=n,i=s);var u=e.split("-");if(!i&&u.length>1)return t(u[0])}else {var a=e.name;D[a]=e,i=a;}return !r&&i&&(g=i),i||!r&&g},O=function(t,e){if(S(t))return t.clone();var n="object"==typeof e?e:{};return n.date=t,n.args=arguments,new _(n)},b=v;b.l=w,b.i=S,b.w=function(t,e){return O(t,{locale:e.$L,utc:e.$u,x:e.$x,$offset:e.$offset})};var _=function(){function M(t){this.$L=w(t.locale,null,!0),this.parse(t),this.$x=this.$x||t.x||{},this[p]=!0;}var m=M.prototype;return m.parse=function(t){this.$d=function(t){var e=t.date,n=t.utc;if(null===e)return new Date(NaN);if(b.u(e))return new Date;if(e instanceof Date)return new Date(e);if("string"==typeof e&&!/Z$/i.test(e)){var r=e.match($);if(r){var i=r[2]-1||0,s=(r[7]||"0").substring(0,3);return n?new Date(Date.UTC(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)):new Date(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)}}return new Date(e)}(t),this.init();},m.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds();},m.$utils=function(){return b},m.isValid=function(){return !(this.$d.toString()===l)},m.isSame=function(t,e){var n=O(t);return this.startOf(e)<=n&&n<=this.endOf(e)},m.isAfter=function(t,e){return O(t)<this.startOf(e)},m.isBefore=function(t,e){return this.endOf(e)<O(t)},m.$g=function(t,e,n){return b.u(t)?this[e]:this.set(n,t)},m.unix=function(){return Math.floor(this.valueOf()/1e3)},m.valueOf=function(){return this.$d.getTime()},m.startOf=function(t,e){var n=this,r=!!b.u(e)||e,f=b.p(t),l=function(t,e){var i=b.w(n.$u?Date.UTC(n.$y,e,t):new Date(n.$y,e,t),n);return r?i:i.endOf(a)},$=function(t,e){return b.w(n.toDate()[t].apply(n.toDate("s"),(r?[0,0,0,0]:[23,59,59,999]).slice(e)),n)},y=this.$W,M=this.$M,m=this.$D,v="set"+(this.$u?"UTC":"");switch(f){case h:return r?l(1,0):l(31,11);case c:return r?l(1,M):l(0,M+1);case o:var g=this.$locale().weekStart||0,D=(y<g?y+7:y)-g;return l(r?m-D:m+(6-D),M);case a:case d:return $(v+"Hours",0);case u:return $(v+"Minutes",1);case s:return $(v+"Seconds",2);case i:return $(v+"Milliseconds",3);default:return this.clone()}},m.endOf=function(t){return this.startOf(t,!1)},m.$set=function(t,e){var n,o=b.p(t),f="set"+(this.$u?"UTC":""),l=(n={},n[a]=f+"Date",n[d]=f+"Date",n[c]=f+"Month",n[h]=f+"FullYear",n[u]=f+"Hours",n[s]=f+"Minutes",n[i]=f+"Seconds",n[r]=f+"Milliseconds",n)[o],$=o===a?this.$D+(e-this.$W):e;if(o===c||o===h){var y=this.clone().set(d,1);y.$d[l]($),y.init(),this.$d=y.set(d,Math.min(this.$D,y.daysInMonth())).$d;}else l&&this.$d[l]($);return this.init(),this},m.set=function(t,e){return this.clone().$set(t,e)},m.get=function(t){return this[b.p(t)]()},m.add=function(r,f){var d,l=this;r=Number(r);var $=b.p(f),y=function(t){var e=O(l);return b.w(e.date(e.date()+Math.round(t*r)),l)};if($===c)return this.set(c,this.$M+r);if($===h)return this.set(h,this.$y+r);if($===a)return y(1);if($===o)return y(7);var M=(d={},d[s]=e,d[u]=n,d[i]=t,d)[$]||1,m=this.$d.getTime()+r*M;return b.w(m,this)},m.subtract=function(t,e){return this.add(-1*t,e)},m.format=function(t){var e=this,n=this.$locale();if(!this.isValid())return n.invalidDate||l;var r=t||"YYYY-MM-DDTHH:mm:ssZ",i=b.z(this),s=this.$H,u=this.$m,a=this.$M,o=n.weekdays,c=n.months,f=n.meridiem,h=function(t,n,i,s){return t&&(t[n]||t(e,r))||i[n].slice(0,s)},d=function(t){return b.s(s%12||12,t,"0")},$=f||function(t,e,n){var r=t<12?"AM":"PM";return n?r.toLowerCase():r};return r.replace(y,(function(t,r){return r||function(t){switch(t){case"YY":return String(e.$y).slice(-2);case"YYYY":return b.s(e.$y,4,"0");case"M":return a+1;case"MM":return b.s(a+1,2,"0");case"MMM":return h(n.monthsShort,a,c,3);case"MMMM":return h(c,a);case"D":return e.$D;case"DD":return b.s(e.$D,2,"0");case"d":return String(e.$W);case"dd":return h(n.weekdaysMin,e.$W,o,2);case"ddd":return h(n.weekdaysShort,e.$W,o,3);case"dddd":return o[e.$W];case"H":return String(s);case"HH":return b.s(s,2,"0");case"h":return d(1);case"hh":return d(2);case"a":return $(s,u,!0);case"A":return $(s,u,!1);case"m":return String(u);case"mm":return b.s(u,2,"0");case"s":return String(e.$s);case"ss":return b.s(e.$s,2,"0");case"SSS":return b.s(e.$ms,3,"0");case"Z":return i}return null}(t)||i.replace(":","")}))},m.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},m.diff=function(r,d,l){var $,y=this,M=b.p(d),m=O(r),v=(m.utcOffset()-this.utcOffset())*e,g=this-m,D=function(){return b.m(y,m)};switch(M){case h:$=D()/12;break;case c:$=D();break;case f:$=D()/3;break;case o:$=(g-v)/6048e5;break;case a:$=(g-v)/864e5;break;case u:$=g/n;break;case s:$=g/e;break;case i:$=g/t;break;default:$=g;}return l?$:b.a($)},m.daysInMonth=function(){return this.endOf(c).$D},m.$locale=function(){return D[this.$L]},m.locale=function(t,e){if(!t)return this.$L;var n=this.clone(),r=w(t,e,!0);return r&&(n.$L=r),n},m.clone=function(){return b.w(this.$d,this)},m.toDate=function(){return new Date(this.valueOf())},m.toJSON=function(){return this.isValid()?this.toISOString():null},m.toISOString=function(){return this.$d.toISOString()},m.toString=function(){return this.$d.toUTCString()},M}(),k=_.prototype;return O.prototype=k,[["$ms",r],["$s",i],["$m",s],["$H",u],["$W",a],["$M",c],["$y",h],["$D",d]].forEach((function(t){k[t[1]]=function(e){return this.$g(e,t[0],t[1])};})),O.extend=function(t,e){return t.$i||(t(e,_,O),t.$i=!0),O},O.locale=w,O.isDayjs=S,O.unix=function(t){return O(1e3*t)},O.en=D[g],O.Ls=D,O.p={},O}));
|
|
203
|
-
} (dayjs_min, dayjs_min.exports));
|
|
204
|
-
|
|
205
|
-
var dayjs_minExports = dayjs_min.exports;
|
|
206
|
-
var dayjs = /*@__PURE__*/getDefaultExportFromCjs(dayjs_minExports);
|
|
207
|
-
|
|
208
|
-
var NUMBER_RULES = [{
|
|
209
|
-
label: t$1("neetoFilters.rules.is"),
|
|
210
|
-
value: "is"
|
|
211
|
-
}, {
|
|
212
|
-
label: t$1("neetoFilters.rules.isNot"),
|
|
213
|
-
value: "is_not"
|
|
214
|
-
}, {
|
|
215
|
-
label: t$1("neetoFilters.rules.greaterThan"),
|
|
216
|
-
value: "greater_than"
|
|
217
|
-
}, {
|
|
218
|
-
label: t$1("neetoFilters.rules.lessThan"),
|
|
219
|
-
value: "less_than"
|
|
220
|
-
}];
|
|
221
|
-
var TEXT_RULES = [{
|
|
222
|
-
label: t$1("neetoFilters.rules.contains"),
|
|
223
|
-
value: "contains"
|
|
224
|
-
}, {
|
|
225
|
-
label: t$1("neetoFilters.rules.doesNotContain"),
|
|
226
|
-
value: "does_not_contain"
|
|
227
|
-
}, {
|
|
228
|
-
label: t$1("neetoFilters.rules.is"),
|
|
229
|
-
value: "is"
|
|
230
|
-
}, {
|
|
231
|
-
label: t$1("neetoFilters.rules.isNot"),
|
|
232
|
-
value: "is_not"
|
|
233
|
-
}, {
|
|
234
|
-
label: t$1("neetoFilters.rules.startsWith"),
|
|
235
|
-
value: "starts_with"
|
|
236
|
-
}, {
|
|
237
|
-
label: t$1("neetoFilters.rules.doesNotStartWith"),
|
|
238
|
-
value: "does_not_start_with"
|
|
239
|
-
}, {
|
|
240
|
-
label: t$1("neetoFilters.rules.endsWith"),
|
|
241
|
-
value: "ends_with"
|
|
242
|
-
}, {
|
|
243
|
-
label: t$1("neetoFilters.rules.doesNotEndWith"),
|
|
244
|
-
value: "does_not_end_with"
|
|
245
|
-
}];
|
|
246
|
-
var DEFAULT_BOOLEAN_OPTIONS = [{
|
|
247
|
-
label: t$1("neetoFilters.common.yes"),
|
|
248
|
-
value: "true"
|
|
249
|
-
}, {
|
|
250
|
-
label: t$1("neetoFilters.common.no"),
|
|
251
|
-
value: "false"
|
|
252
|
-
}];
|
|
253
|
-
var DEFAULT_HELP_ICON_PROPS = {
|
|
254
|
-
icon: Help,
|
|
255
|
-
tooltipProps: {
|
|
256
|
-
position: "right"
|
|
257
|
-
}
|
|
258
|
-
};
|
|
259
|
-
|
|
260
|
-
function _arrayWithHoles(arr) {
|
|
261
|
-
if (Array.isArray(arr)) return arr;
|
|
262
|
-
}
|
|
263
|
-
|
|
264
|
-
function _iterableToArrayLimit(r, l) {
|
|
265
|
-
var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
|
|
266
|
-
if (null != t) {
|
|
267
|
-
var e,
|
|
268
|
-
n,
|
|
269
|
-
i,
|
|
270
|
-
u,
|
|
271
|
-
a = [],
|
|
272
|
-
f = !0,
|
|
273
|
-
o = !1;
|
|
274
|
-
try {
|
|
275
|
-
if (i = (t = t.call(r)).next, 0 === l) {
|
|
276
|
-
if (Object(t) !== t) return;
|
|
277
|
-
f = !1;
|
|
278
|
-
} else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
|
|
279
|
-
} catch (r) {
|
|
280
|
-
o = !0, n = r;
|
|
281
|
-
} finally {
|
|
282
|
-
try {
|
|
283
|
-
if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return;
|
|
284
|
-
} finally {
|
|
285
|
-
if (o) throw n;
|
|
286
|
-
}
|
|
287
|
-
}
|
|
288
|
-
return a;
|
|
289
|
-
}
|
|
290
|
-
}
|
|
291
|
-
|
|
292
|
-
function _nonIterableRest() {
|
|
293
|
-
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
294
|
-
}
|
|
295
|
-
|
|
296
|
-
function _slicedToArray(arr, i) {
|
|
297
|
-
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
|
|
298
|
-
}
|
|
299
|
-
|
|
300
|
-
var timezone$1 = {exports: {}};
|
|
301
|
-
|
|
302
|
-
timezone$1.exports;
|
|
303
|
-
|
|
304
|
-
(function (module, exports) {
|
|
305
|
-
!function(t,e){module.exports=e();}(commonjsGlobal,(function(){var t={year:0,month:1,day:2,hour:3,minute:4,second:5},e={};return function(n,i,o){var r,a=function(t,n,i){void 0===i&&(i={});var o=new Date(t),r=function(t,n){void 0===n&&(n={});var i=n.timeZoneName||"short",o=t+"|"+i,r=e[o];return r||(r=new Intl.DateTimeFormat("en-US",{hour12:!1,timeZone:t,year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit",timeZoneName:i}),e[o]=r),r}(n,i);return r.formatToParts(o)},u=function(e,n){for(var i=a(e,n),r=[],u=0;u<i.length;u+=1){var f=i[u],s=f.type,m=f.value,c=t[s];c>=0&&(r[c]=parseInt(m,10));}var d=r[3],l=24===d?0:d,h=r[0]+"-"+r[1]+"-"+r[2]+" "+l+":"+r[4]+":"+r[5]+":000",v=+e;return (o.utc(h).valueOf()-(v-=v%1e3))/6e4},f=i.prototype;f.tz=function(t,e){void 0===t&&(t=r);var n=this.utcOffset(),i=this.toDate(),a=i.toLocaleString("en-US",{timeZone:t}),u=Math.round((i-new Date(a))/1e3/60),f=o(a,{locale:this.$L}).$set("millisecond",this.$ms).utcOffset(15*-Math.round(i.getTimezoneOffset()/15)-u,!0);if(e){var s=f.utcOffset();f=f.add(n-s,"minute");}return f.$x.$timezone=t,f},f.offsetName=function(t){var e=this.$x.$timezone||o.tz.guess(),n=a(this.valueOf(),e,{timeZoneName:t}).find((function(t){return "timezonename"===t.type.toLowerCase()}));return n&&n.value};var s=f.startOf;f.startOf=function(t,e){if(!this.$x||!this.$x.$timezone)return s.call(this,t,e);var n=o(this.format("YYYY-MM-DD HH:mm:ss:SSS"),{locale:this.$L});return s.call(n,t,e).tz(this.$x.$timezone,!0)},o.tz=function(t,e,n){var i=n&&e,a=n||e||r,f=u(+o(),a);if("string"!=typeof t)return o(t).tz(a);var s=function(t,e,n){var i=t-60*e*1e3,o=u(i,n);if(e===o)return [i,e];var r=u(i-=60*(o-e)*1e3,n);return o===r?[i,o]:[t-60*Math.min(o,r)*1e3,Math.max(o,r)]}(o.utc(t,i).valueOf(),f,a),m=s[0],c=s[1],d=o(m).utcOffset(c);return d.$x.$timezone=a,d},o.tz.guess=function(){return Intl.DateTimeFormat().resolvedOptions().timeZone},o.tz.setDefault=function(t){r=t;};}}));
|
|
306
|
-
} (timezone$1, timezone$1.exports));
|
|
307
|
-
|
|
308
|
-
var timezoneExports = timezone$1.exports;
|
|
309
|
-
var timezone = /*@__PURE__*/getDefaultExportFromCjs(timezoneExports);
|
|
310
|
-
|
|
311
|
-
var utc$1 = {exports: {}};
|
|
312
|
-
|
|
313
|
-
utc$1.exports;
|
|
314
|
-
|
|
315
|
-
(function (module, exports) {
|
|
316
|
-
!function(t,i){module.exports=i();}(commonjsGlobal,(function(){var t="minute",i=/[+-]\d\d(?::?\d\d)?/g,e=/([+-]|\d\d)/g;return function(s,f,n){var u=f.prototype;n.utc=function(t){var i={date:t,utc:!0,args:arguments};return new f(i)},u.utc=function(i){var e=n(this.toDate(),{locale:this.$L,utc:!0});return i?e.add(this.utcOffset(),t):e},u.local=function(){return n(this.toDate(),{locale:this.$L,utc:!1})};var o=u.parse;u.parse=function(t){t.utc&&(this.$u=!0),this.$utils().u(t.$offset)||(this.$offset=t.$offset),o.call(this,t);};var r=u.init;u.init=function(){if(this.$u){var t=this.$d;this.$y=t.getUTCFullYear(),this.$M=t.getUTCMonth(),this.$D=t.getUTCDate(),this.$W=t.getUTCDay(),this.$H=t.getUTCHours(),this.$m=t.getUTCMinutes(),this.$s=t.getUTCSeconds(),this.$ms=t.getUTCMilliseconds();}else r.call(this);};var a=u.utcOffset;u.utcOffset=function(s,f){var n=this.$utils().u;if(n(s))return this.$u?0:n(this.$offset)?a.call(this):this.$offset;if("string"==typeof s&&(s=function(t){void 0===t&&(t="");var s=t.match(i);if(!s)return null;var f=(""+s[0]).match(e)||["-",0,0],n=f[0],u=60*+f[1]+ +f[2];return 0===u?0:"+"===n?u:-u}(s),null===s))return this;var u=Math.abs(s)<=16?60*s:s,o=this;if(f)return o.$offset=u,o.$u=0===s,o;if(0!==s){var r=this.$u?this.toDate().getTimezoneOffset():-1*this.utcOffset();(o=this.local().add(u+r,t)).$offset=u,o.$x.$localOffset=r;}else o=this.utc();return o};var h=u.format;u.format=function(t){var i=t||(this.$u?"YYYY-MM-DDTHH:mm:ss[Z]":"");return h.call(this,i)},u.valueOf=function(){var t=this.$utils().u(this.$offset)?0:this.$offset+(this.$x.$localOffset||this.$d.getTimezoneOffset());return this.$d.valueOf()-6e4*t},u.isUTC=function(){return !!this.$u},u.toISOString=function(){return this.toDate().toISOString()},u.toString=function(){return this.toDate().toUTCString()};var l=u.toDate;u.toDate=function(t){return "s"===t&&this.$offset?n(this.format("YYYY-MM-DD HH:mm:ss:SSS")).toDate():l.call(this)};var c=u.diff;u.diff=function(t,i,e){if(t&&this.$u===t.$u)return c.call(this,t,i,e);var s=this.local(),f=n(t).local();return c.call(s,f,i,e)};}}));
|
|
317
|
-
} (utc$1, utc$1.exports));
|
|
318
|
-
|
|
319
|
-
var utcExports = utc$1.exports;
|
|
320
|
-
var utc = /*@__PURE__*/getDefaultExportFromCjs(utcExports);
|
|
321
|
-
|
|
322
|
-
var weekday$1 = {exports: {}};
|
|
323
|
-
|
|
324
|
-
weekday$1.exports;
|
|
325
|
-
|
|
326
|
-
(function (module, exports) {
|
|
327
|
-
!function(e,t){module.exports=t();}(commonjsGlobal,(function(){return function(e,t){t.prototype.weekday=function(e){var t=this.$locale().weekStart||0,i=this.$W,n=(i<t?i+7:i)-t;return this.$utils().u(e)?n:this.subtract(n,"day").add(e,"day")};}}));
|
|
328
|
-
} (weekday$1, weekday$1.exports));
|
|
329
|
-
|
|
330
|
-
var weekdayExports = weekday$1.exports;
|
|
331
|
-
var weekday = /*@__PURE__*/getDefaultExportFromCjs(weekdayExports);
|
|
332
|
-
|
|
333
|
-
dayjs.extend(utc);
|
|
334
|
-
dayjs.extend(timezone);
|
|
335
|
-
dayjs.extend(weekday);
|
|
336
|
-
dayjs.Ls.en.weekStart = 1;
|
|
337
|
-
|
|
338
|
-
function ownKeys$4(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
339
|
-
function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
340
|
-
var groupByGroup = groupBy(function (_ref) {
|
|
341
|
-
var group = _ref.group;
|
|
342
|
-
return group || "individual";
|
|
343
|
-
});
|
|
344
|
-
var standardizeColumnType = function standardizeColumnType(kind) {
|
|
345
|
-
// neeto-fields-nano supports `monetary` and `number` as type of fields, which will be acting as `decimal` in action.
|
|
346
|
-
if (["custom.monetary", "custom.number"].includes(kind)) {
|
|
347
|
-
return "custom.decimal";
|
|
348
|
-
}
|
|
349
|
-
return kind;
|
|
350
|
-
};
|
|
351
|
-
var getSnakeCasedQueryParams = function getSnakeCasedQueryParams() {
|
|
352
|
-
return getQueryParams({
|
|
353
|
-
toCamelCase: false
|
|
354
|
-
});
|
|
355
|
-
};
|
|
356
|
-
var isBoolean = function isBoolean(type) {
|
|
357
|
-
return type === "boolean" || type === "custom.boolean";
|
|
358
|
-
};
|
|
359
|
-
var isCheckbox = function isCheckbox(type) {
|
|
360
|
-
return type === "checkbox" || type === "custom.checkbox";
|
|
361
|
-
};
|
|
362
|
-
var isDate = function isDate(type) {
|
|
363
|
-
return type === "date" || type === "custom.date" || type === "custom.datetime";
|
|
364
|
-
};
|
|
365
|
-
var isSingleDate = function isSingleDate(type) {
|
|
366
|
-
return type === "single_date" || type === "custom.single_date";
|
|
367
|
-
};
|
|
368
|
-
var isSingleTime = function isSingleTime(type) {
|
|
369
|
-
return type === "single_time" || type === "custom.single_time";
|
|
370
|
-
};
|
|
371
|
-
var isTime = function isTime(type) {
|
|
372
|
-
return type === "time" || type === "custom.time";
|
|
373
|
-
};
|
|
374
|
-
var isMulti = function isMulti(type) {
|
|
375
|
-
return type === "multi_option" || type === "custom.multi_option";
|
|
376
|
-
};
|
|
377
|
-
var isText = function isText(type) {
|
|
378
|
-
return type === "text" || type === "custom.text";
|
|
379
|
-
};
|
|
380
|
-
var isDigit = function isDigit(type) {
|
|
381
|
-
return ["number", "decimal", "custom.decimal", "custom.number"].includes(type);
|
|
382
|
-
};
|
|
383
|
-
var isCustomDateRange = function isCustomDateRange(value) {
|
|
384
|
-
return !pluck("value", DATE_OPTIONS).includes(value);
|
|
385
|
-
};
|
|
386
|
-
var isCustomTimeRange = function isCustomTimeRange(value) {
|
|
387
|
-
return !pluck("value", TIME_OPTIONS).includes(value);
|
|
388
|
-
};
|
|
389
|
-
var isMultiModelFilter = function isMultiModelFilter(_ref2) {
|
|
390
|
-
var _ref2$model = _ref2.model,
|
|
391
|
-
model = _ref2$model === void 0 ? "" : _ref2$model;
|
|
392
|
-
return model.split(",").length > 1;
|
|
393
|
-
};
|
|
394
|
-
var getTimezone = function getTimezone() {
|
|
395
|
-
return dayjs.tz.guess();
|
|
396
|
-
};
|
|
397
|
-
var getLabelFromBool = function getLabelFromBool(_ref3) {
|
|
398
|
-
var value = _ref3.value,
|
|
399
|
-
values = _ref3.values;
|
|
400
|
-
return findBy({
|
|
401
|
-
value: value
|
|
402
|
-
}, either(isEmpty, isNil)(values) ? DEFAULT_BOOLEAN_OPTIONS : values).label;
|
|
403
|
-
};
|
|
404
|
-
var getBoolFromLabel = function getBoolFromLabel(_ref4) {
|
|
405
|
-
var label = _ref4.label,
|
|
406
|
-
values = _ref4.values;
|
|
407
|
-
return findBy({
|
|
408
|
-
label: label
|
|
409
|
-
}, either(isEmpty, isNil)(values) ? DEFAULT_BOOLEAN_OPTIONS : values).value;
|
|
410
|
-
};
|
|
411
|
-
var buildRuleOptions = function buildRuleOptions(_ref5) {
|
|
412
|
-
var defaultType = _ref5.defaultType;
|
|
413
|
-
if (isText(defaultType)) return TEXT_RULES;else if (isDigit(defaultType)) return NUMBER_RULES;
|
|
414
|
-
return [];
|
|
415
|
-
};
|
|
416
|
-
var getDefaultRuleValue = function getDefaultRuleValue(defaultType) {
|
|
417
|
-
var _buildRuleOptions;
|
|
418
|
-
return ((_buildRuleOptions = buildRuleOptions({
|
|
419
|
-
defaultType: defaultType
|
|
420
|
-
})) === null || _buildRuleOptions === void 0 || (_buildRuleOptions = _buildRuleOptions[0]) === null || _buildRuleOptions === void 0 ? void 0 : _buildRuleOptions.value) || "";
|
|
421
|
-
};
|
|
422
|
-
var isUndefinedOrEmpty = anyPass([isNil, isEmpty, any(isNil)]);
|
|
423
|
-
|
|
424
|
-
// Following function split node on comma followed by non-comma characters and a dot
|
|
425
|
-
var splitNode = function splitNode(joinedNodes) {
|
|
426
|
-
return joinedNodes.split(/,(?=[^,]*\.)/);
|
|
427
|
-
};
|
|
428
|
-
var splitFilter = function splitFilter(multiColumnFilter) {
|
|
429
|
-
var splittedNodes = splitNode(multiColumnFilter.node);
|
|
430
|
-
var splittedModels = multiColumnFilter.model.split(",");
|
|
431
|
-
return splittedNodes.map(function (node, index) {
|
|
432
|
-
return mergeLeft({
|
|
433
|
-
node: node,
|
|
434
|
-
model: splittedModels[index],
|
|
435
|
-
conditions_join_type: index < splittedNodes.length - 1 ? "or" : "and"
|
|
436
|
-
}, omit(["key", "label", "values", "setValue"], multiColumnFilter));
|
|
437
|
-
});
|
|
438
|
-
};
|
|
439
|
-
var buildDateValue = function buildDateValue(_ref6) {
|
|
440
|
-
var value = _ref6.value;
|
|
441
|
-
var rule = DATE_RULES[value] || "between";
|
|
442
|
-
var dateValue = ["before", "after", "custom-date-range"].includes(value) ? "" : value;
|
|
443
|
-
return {
|
|
444
|
-
value: dateValue,
|
|
445
|
-
rule: rule,
|
|
446
|
-
timezone: getTimezone()
|
|
447
|
-
};
|
|
448
|
-
};
|
|
449
|
-
var buildTimeValue = function buildTimeValue(_ref7) {
|
|
450
|
-
var value = _ref7.value;
|
|
451
|
-
var dateValue = value === "custom-time-range" ? "" : value;
|
|
452
|
-
return {
|
|
453
|
-
value: dateValue,
|
|
454
|
-
rule: "between"
|
|
455
|
-
};
|
|
456
|
-
};
|
|
457
|
-
var buildUpdatedFilter = function buildUpdatedFilter(_ref8) {
|
|
458
|
-
var column = _ref8.column,
|
|
459
|
-
defaultType = _ref8.defaultType,
|
|
460
|
-
option = _ref8.option,
|
|
461
|
-
_ref8$rule = _ref8.rule,
|
|
462
|
-
rule = _ref8$rule === void 0 ? "" : _ref8$rule,
|
|
463
|
-
_ref8$value = _ref8.value,
|
|
464
|
-
value = _ref8$value === void 0 ? "" : _ref8$value;
|
|
465
|
-
var filter = omit(["values", "preprocessor"], column);
|
|
466
|
-
if (isMulti(defaultType)) {
|
|
467
|
-
return mergeLeft(filter, {
|
|
468
|
-
value: pluck("value", option),
|
|
469
|
-
rule: "in"
|
|
470
|
-
});
|
|
471
|
-
} else if (isDate(defaultType)) {
|
|
472
|
-
return mergeLeft(filter, buildDateValue(option));
|
|
473
|
-
} else if (isSingleDate(defaultType)) {
|
|
474
|
-
return mergeLeft(filter, {
|
|
475
|
-
value: value,
|
|
476
|
-
rule: rule,
|
|
477
|
-
timezone: getTimezone()
|
|
478
|
-
});
|
|
479
|
-
} else if (isText(defaultType) || isDigit(defaultType)) {
|
|
480
|
-
var _column$preprocessor;
|
|
481
|
-
return mergeLeft(filter, {
|
|
482
|
-
rule: rule,
|
|
483
|
-
value: (column === null || column === void 0 || (_column$preprocessor = column.preprocessor) === null || _column$preprocessor === void 0 ? void 0 : _column$preprocessor.call(column, value)) || value
|
|
484
|
-
});
|
|
485
|
-
} else if (isSingleTime(defaultType)) {
|
|
486
|
-
return mergeLeft(filter, {
|
|
487
|
-
value: value,
|
|
488
|
-
rule: rule
|
|
489
|
-
});
|
|
490
|
-
} else if (isTime(defaultType)) {
|
|
491
|
-
return mergeLeft(filter, buildTimeValue(option));
|
|
492
|
-
}
|
|
493
|
-
return mergeLeft(filter, {
|
|
494
|
-
value: option.value,
|
|
495
|
-
rule: "is"
|
|
496
|
-
});
|
|
497
|
-
};
|
|
498
|
-
var buildFiltersFromSearchParams = function buildFiltersFromSearchParams(columns) {
|
|
499
|
-
var skipEmpty = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
500
|
-
var searchParams = getSnakeCasedQueryParams();
|
|
501
|
-
return columns.map(function (column) {
|
|
502
|
-
var value = searchParams[column.key];
|
|
503
|
-
var defaultType = column.defaultType || column.type;
|
|
504
|
-
if (!skipEmpty && value === "") {
|
|
505
|
-
return mergeLeft({
|
|
506
|
-
value: ""
|
|
507
|
-
}, column);
|
|
508
|
-
} else if (isNil(value) || value === "" || column.key === "keyword") {
|
|
509
|
-
return null;
|
|
510
|
-
} else if (column.key === SEARCH_TERM_KEY) {
|
|
511
|
-
if (isNil(column.node)) return null;
|
|
512
|
-
return mergeLeft({
|
|
513
|
-
value: value,
|
|
514
|
-
type: "text",
|
|
515
|
-
rule: "contains"
|
|
516
|
-
}, column);
|
|
517
|
-
} else if (isDate(defaultType) && isCustomDateRange(value)) {
|
|
518
|
-
return mergeLeft({
|
|
519
|
-
value: value.split(",")
|
|
520
|
-
}, column);
|
|
521
|
-
} else if (isMulti(defaultType)) {
|
|
522
|
-
return mergeLeft({
|
|
523
|
-
rule: "in",
|
|
524
|
-
value: value.split("|")
|
|
525
|
-
}, column);
|
|
526
|
-
} else if (isDigit(defaultType) || isText(defaultType)) {
|
|
527
|
-
var _value$split = value.split("+rule-"),
|
|
528
|
-
_value$split2 = _slicedToArray(_value$split, 2),
|
|
529
|
-
filterValue = _value$split2[0],
|
|
530
|
-
rule = _value$split2[1];
|
|
531
|
-
return mergeLeft({
|
|
532
|
-
rule: rule,
|
|
533
|
-
value: filterValue
|
|
534
|
-
}, column);
|
|
535
|
-
} else if (isTime(defaultType) && isCustomTimeRange(value)) {
|
|
536
|
-
return mergeLeft({
|
|
537
|
-
value: value.split(",")
|
|
538
|
-
}, column);
|
|
539
|
-
} else if (isSingleDate(defaultType)) {
|
|
540
|
-
var _value$split3 = value.split("+rule-"),
|
|
541
|
-
_value$split4 = _slicedToArray(_value$split3, 2),
|
|
542
|
-
_filterValue = _value$split4[0],
|
|
543
|
-
_rule = _value$split4[1];
|
|
544
|
-
return mergeLeft({
|
|
545
|
-
rule: _rule,
|
|
546
|
-
value: _rule === "between" ? _filterValue.split(",") : _filterValue
|
|
547
|
-
}, column);
|
|
548
|
-
} else if (isSingleTime(defaultType)) {
|
|
549
|
-
var _value$split5 = value.split("+rule-"),
|
|
550
|
-
_value$split6 = _slicedToArray(_value$split5, 2),
|
|
551
|
-
_filterValue2 = _value$split6[0],
|
|
552
|
-
_rule2 = _value$split6[1];
|
|
553
|
-
return mergeLeft({
|
|
554
|
-
rule: _rule2,
|
|
555
|
-
value: _rule2 === "between" ? _filterValue2.split(",") : _filterValue2
|
|
556
|
-
}, column);
|
|
557
|
-
} else if (isBoolean(defaultType)) {
|
|
558
|
-
return mergeLeft({
|
|
559
|
-
rule: "is",
|
|
560
|
-
value: getBoolFromLabel({
|
|
561
|
-
label: value,
|
|
562
|
-
values: column.values
|
|
563
|
-
})
|
|
564
|
-
}, column);
|
|
565
|
-
}
|
|
566
|
-
return mergeLeft({
|
|
567
|
-
rule: "is",
|
|
568
|
-
value: value
|
|
569
|
-
}, column);
|
|
570
|
-
}).filter(identity);
|
|
571
|
-
};
|
|
572
|
-
var buildTimePayload = function buildTimePayload(value) {
|
|
573
|
-
var timeValue = {
|
|
574
|
-
"this-hour": [dayjs().startOf("hour"), dayjs().endOf("hour")],
|
|
575
|
-
"last-hour": [dayjs().add(-1, "hour").startOf("hour"), dayjs().add(-1, "hour").endOf("hour")],
|
|
576
|
-
"next-hour": [dayjs().add(1, "hour").startOf("hour"), dayjs().add(1, "hour").endOf("hour")]
|
|
577
|
-
};
|
|
578
|
-
if (isCustomTimeRange(value)) {
|
|
579
|
-
return {
|
|
580
|
-
value: value ? value.join(",") : "",
|
|
581
|
-
rule: "between"
|
|
582
|
-
};
|
|
583
|
-
}
|
|
584
|
-
return {
|
|
585
|
-
value: timeValue[value].map(function (time) {
|
|
586
|
-
return time.toISOString();
|
|
587
|
-
}).join(","),
|
|
588
|
-
rule: "between"
|
|
589
|
-
};
|
|
590
|
-
};
|
|
591
|
-
var buildDatePayload = function buildDatePayload(value) {
|
|
592
|
-
var dateValue = {
|
|
593
|
-
"this-week": [dayjs().startOf("week"), dayjs().endOf("week")],
|
|
594
|
-
"last-week": [dayjs().add(-1, "week").startOf("week"), dayjs().add(-1, "week").endOf("week")],
|
|
595
|
-
"this-month": [dayjs().startOf("month"), dayjs().endOf("month")],
|
|
596
|
-
"last-month": [dayjs().add(-1, "month").startOf("month"), dayjs().add(-1, "month").endOf("month")],
|
|
597
|
-
"this-year": [dayjs().startOf("year"), dayjs().endOf("year")],
|
|
598
|
-
"last-year": [dayjs().add(-1, "year").startOf("year"), dayjs().add(-1, "year").endOf("year")]
|
|
599
|
-
};
|
|
600
|
-
if (value === "today") {
|
|
601
|
-
return {
|
|
602
|
-
value: dayjs().toISOString(),
|
|
603
|
-
rule: "on",
|
|
604
|
-
timezone: getTimezone()
|
|
605
|
-
};
|
|
606
|
-
} else if (value === "yesterday") {
|
|
607
|
-
return {
|
|
608
|
-
value: dayjs().add(-1, "day").toISOString(),
|
|
609
|
-
rule: "on",
|
|
610
|
-
timezone: getTimezone()
|
|
611
|
-
};
|
|
612
|
-
} else if (value === "all-time") {
|
|
613
|
-
return {
|
|
614
|
-
value: dayjs().toISOString(),
|
|
615
|
-
rule: "before",
|
|
616
|
-
timezone: getTimezone(),
|
|
617
|
-
type: "datetime"
|
|
618
|
-
};
|
|
619
|
-
} else if (isCustomDateRange(value)) {
|
|
620
|
-
//custom-date-range
|
|
621
|
-
return {
|
|
622
|
-
value: value ? value.join(",") : "",
|
|
623
|
-
rule: "between",
|
|
624
|
-
timezone: getTimezone()
|
|
625
|
-
};
|
|
626
|
-
}
|
|
627
|
-
return {
|
|
628
|
-
value: dateValue[value].map(function (date) {
|
|
629
|
-
return date.toISOString();
|
|
630
|
-
}).join(","),
|
|
631
|
-
rule: "between",
|
|
632
|
-
timezone: getTimezone()
|
|
633
|
-
};
|
|
634
|
-
};
|
|
635
|
-
var buildSingleDatePayload = function buildSingleDatePayload(filter) {
|
|
636
|
-
var value = filter.value;
|
|
637
|
-
var filterValue = Array.isArray(value) ? value.join(",") : value;
|
|
638
|
-
return _objectSpread$4(_objectSpread$4({}, filter), {}, {
|
|
639
|
-
value: filterValue,
|
|
640
|
-
type: "date"
|
|
641
|
-
});
|
|
642
|
-
};
|
|
643
|
-
var buildSingleTimePayload = function buildSingleTimePayload(filter) {
|
|
644
|
-
var value = filter.value;
|
|
645
|
-
var filterValue = Array.isArray(value) ? value.join(",") : value;
|
|
646
|
-
return _objectSpread$4(_objectSpread$4({}, filter), {}, {
|
|
647
|
-
value: filterValue,
|
|
648
|
-
type: "time"
|
|
649
|
-
});
|
|
650
|
-
};
|
|
651
|
-
var flattenPayload = function flattenPayload(payload) {
|
|
652
|
-
var flattenedPayload = [];
|
|
653
|
-
payload.forEach(function (item) {
|
|
654
|
-
return Array.isArray(item) ? flattenedPayload.unshift.apply(flattenedPayload, _toConsumableArray(item)) : flattenedPayload.push(item);
|
|
655
|
-
}, []);
|
|
656
|
-
return flattenedPayload;
|
|
657
|
-
};
|
|
658
|
-
var buildMultiOptionPayload = function buildMultiOptionPayload(values) {
|
|
659
|
-
return values.map(function (value) {
|
|
660
|
-
return value.toString();
|
|
661
|
-
}).join("|");
|
|
662
|
-
};
|
|
663
|
-
var buildFiltersPayload = function buildFiltersPayload(filters) {
|
|
664
|
-
var payload = removeBy({
|
|
665
|
-
value: ""
|
|
666
|
-
}, filters).map(function (filter) {
|
|
667
|
-
if (filter.key === SEARCH_TERM_KEY && isMultiModelFilter(filter)) {
|
|
668
|
-
return splitFilter(filter);
|
|
669
|
-
}
|
|
670
|
-
var filterPayload = omit(["key", "label", "values", "setValue"], filter);
|
|
671
|
-
var _filterPayload$defaul = filterPayload.defaultType,
|
|
672
|
-
defaultType = _filterPayload$defaul === void 0 ? filterPayload.type : _filterPayload$defaul,
|
|
673
|
-
value = filterPayload.value;
|
|
674
|
-
if (isMultiModelFilter(filterPayload)) {
|
|
675
|
-
throw i18next.t("neetoFilters.errors.cannotPassMultipleModels");
|
|
676
|
-
}
|
|
677
|
-
if (isDate(defaultType)) {
|
|
678
|
-
return mergeRight(filterPayload, buildDatePayload(value));
|
|
679
|
-
} else if (isMulti(defaultType)) {
|
|
680
|
-
return mergeRight(filterPayload, {
|
|
681
|
-
value: buildMultiOptionPayload(value)
|
|
682
|
-
});
|
|
683
|
-
} else if (isSingleDate(defaultType)) {
|
|
684
|
-
return mergeRight(filterPayload, buildSingleDatePayload(filterPayload));
|
|
685
|
-
} else if (isSingleTime(defaultType)) {
|
|
686
|
-
return mergeRight(filterPayload, buildSingleTimePayload(filterPayload));
|
|
687
|
-
} else if (isTime(defaultType)) {
|
|
688
|
-
return mergeRight(filterPayload, buildTimePayload(value));
|
|
689
|
-
}
|
|
690
|
-
return filterPayload;
|
|
691
|
-
});
|
|
692
|
-
return isEmpty(payload) ? [] : [{
|
|
693
|
-
conditions: flattenPayload(payload)
|
|
694
|
-
}];
|
|
695
|
-
};
|
|
696
|
-
var buildSegmentsPayload = function buildSegmentsPayload(filters) {
|
|
697
|
-
var childrenKeys = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
698
|
-
var payload = removeBy({
|
|
699
|
-
value: ""
|
|
700
|
-
}, filters).map(function (filter) {
|
|
701
|
-
if (filter.key === SEARCH_TERM_KEY) {
|
|
702
|
-
return false;
|
|
703
|
-
}
|
|
704
|
-
var filterPayload = omit(["label", "values", "setValue", "defaultValue"], filter);
|
|
705
|
-
var _filterPayload$defaul2 = filterPayload.defaultType,
|
|
706
|
-
defaultType = _filterPayload$defaul2 === void 0 ? filterPayload.type : _filterPayload$defaul2,
|
|
707
|
-
value = filterPayload.value;
|
|
708
|
-
if (filter.key !== SEARCH_TERM_KEY && isMultiModelFilter(filterPayload)) {
|
|
709
|
-
throw i18next.t("neetoFilters.errors.cannotPassMultipleModels");
|
|
710
|
-
}
|
|
711
|
-
if (isMulti(defaultType)) {
|
|
712
|
-
return mergeRight(filterPayload, {
|
|
713
|
-
value: buildMultiOptionPayload(value)
|
|
714
|
-
});
|
|
715
|
-
}
|
|
716
|
-
return filterPayload;
|
|
717
|
-
});
|
|
718
|
-
var searchParams = getSnakeCasedQueryParams();
|
|
719
|
-
var modifiedPayload = childrenKeys.reduce(function (acc, key) {
|
|
720
|
-
if (has(key, searchParams)) {
|
|
721
|
-
var filterPayload = {
|
|
722
|
-
key: key,
|
|
723
|
-
node: "children",
|
|
724
|
-
value: searchParams[key]
|
|
725
|
-
};
|
|
726
|
-
return acc.concat(filterPayload);
|
|
727
|
-
}
|
|
728
|
-
return acc;
|
|
729
|
-
}, payload);
|
|
730
|
-
return isEmpty(modifiedPayload) ? [] : [{
|
|
731
|
-
conditions: flattenPayload(modifiedPayload)
|
|
732
|
-
}];
|
|
733
|
-
};
|
|
734
|
-
var buildFiltersFromURL = function buildFiltersFromURL(columns) {
|
|
735
|
-
return buildFiltersPayload(buildFiltersFromSearchParams(columns.filter(function (column) {
|
|
736
|
-
return !isNil(column.node);
|
|
737
|
-
})));
|
|
738
|
-
};
|
|
739
|
-
var buildSelectorsFromURL = function buildSelectorsFromURL(columns) {
|
|
740
|
-
var searchParams = getSnakeCasedQueryParams();
|
|
741
|
-
var selectors = {};
|
|
742
|
-
columns.filter(function (_ref9) {
|
|
743
|
-
var node = _ref9.node;
|
|
744
|
-
return !node;
|
|
745
|
-
}).forEach(function (_ref10) {
|
|
746
|
-
var key = _ref10.key,
|
|
747
|
-
defaultType = _ref10.defaultType,
|
|
748
|
-
type = _ref10.type;
|
|
749
|
-
var value = searchParams[key];
|
|
750
|
-
if (value) {
|
|
751
|
-
selectors[key] = isMulti(defaultType || type) ? value.split("|") : value;
|
|
752
|
-
}
|
|
753
|
-
});
|
|
754
|
-
return selectors;
|
|
755
|
-
};
|
|
756
|
-
var compareFilters = function compareFilters(oldFilters, newFilters) {
|
|
757
|
-
var formatFilters = function formatFilters(filters) {
|
|
758
|
-
return removeBy({
|
|
759
|
-
value: ""
|
|
760
|
-
}, filters).map(pick(["key", "rule", "value"]));
|
|
761
|
-
};
|
|
762
|
-
return equals(formatFilters(oldFilters), formatFilters(newFilters));
|
|
763
|
-
};
|
|
764
|
-
var buildFilteredColumns = function buildFilteredColumns(_ref11) {
|
|
765
|
-
var _ref11$searchTerm = _ref11.searchTerm,
|
|
766
|
-
searchTerm = _ref11$searchTerm === void 0 ? "" : _ref11$searchTerm,
|
|
767
|
-
columns = _ref11.columns;
|
|
768
|
-
var groupedColumsObject = groupByGroup(columns.filter(function (_ref12) {
|
|
769
|
-
var label = _ref12.label,
|
|
770
|
-
_ref12$hidden = _ref12.hidden,
|
|
771
|
-
hidden = _ref12$hidden === void 0 ? false : _ref12$hidden;
|
|
772
|
-
return label.toLocaleLowerCase().includes(searchTerm.trim().toLocaleLowerCase()) && !hidden;
|
|
773
|
-
}));
|
|
774
|
-
return {
|
|
775
|
-
groupedColumns: toPairs(omit(["individual"], groupedColumsObject)).map(function (_ref13) {
|
|
776
|
-
var _ref14 = _slicedToArray(_ref13, 2),
|
|
777
|
-
group = _ref14[0],
|
|
778
|
-
columns = _ref14[1];
|
|
779
|
-
return {
|
|
780
|
-
group: group,
|
|
781
|
-
columns: columns
|
|
782
|
-
};
|
|
783
|
-
}),
|
|
784
|
-
ungroupedColumns: groupedColumsObject.individual
|
|
785
|
-
};
|
|
786
|
-
};
|
|
787
|
-
var buildDefaultFilters = function buildDefaultFilters(columns, filters) {
|
|
788
|
-
return columns.filter(function (column) {
|
|
789
|
-
return !isUndefinedOrEmpty(column.defaultValue) && !findBy({
|
|
790
|
-
key: column.key
|
|
791
|
-
}, filters);
|
|
792
|
-
}).map(function (column) {
|
|
793
|
-
var defaultType = column.defaultType || column.type;
|
|
794
|
-
return buildUpdatedFilter({
|
|
795
|
-
column: column,
|
|
796
|
-
defaultType: defaultType,
|
|
797
|
-
rule: getDefaultRuleValue(defaultType),
|
|
798
|
-
option: column.defaultValue,
|
|
799
|
-
value: column.defaultValue
|
|
800
|
-
});
|
|
801
|
-
});
|
|
802
|
-
};
|
|
803
|
-
var createUrlParamString = function createUrlParamString(_ref15) {
|
|
804
|
-
var filter = _ref15.filter,
|
|
805
|
-
columns = _ref15.columns;
|
|
806
|
-
var key = filter.key,
|
|
807
|
-
value = filter.value,
|
|
808
|
-
_filter$defaultType = filter.defaultType,
|
|
809
|
-
defaultType = _filter$defaultType === void 0 ? filter.type : _filter$defaultType,
|
|
810
|
-
rule = filter.rule;
|
|
811
|
-
if (key === SEARCH_TERM_KEY) {
|
|
812
|
-
return value;
|
|
813
|
-
} else if (isDigit(defaultType) || isText(defaultType)) {
|
|
814
|
-
return "".concat(value, "+rule-").concat(rule);
|
|
815
|
-
} else if (isSingleDate(defaultType) || isSingleTime(defaultType)) {
|
|
816
|
-
return value && "".concat(value, "+rule-").concat(rule) || value;
|
|
817
|
-
} else if (isMulti(defaultType)) {
|
|
818
|
-
return value.join("|");
|
|
819
|
-
} else if (isBoolean(defaultType)) {
|
|
820
|
-
return getLabelFromBool({
|
|
821
|
-
value: value,
|
|
822
|
-
values: findBy({
|
|
823
|
-
key: key
|
|
824
|
-
}, columns).values
|
|
825
|
-
});
|
|
826
|
-
}
|
|
827
|
-
return value;
|
|
828
|
-
};
|
|
829
|
-
var buildUrlFromFilters = function buildUrlFromFilters(_ref16) {
|
|
830
|
-
var columns = _ref16.columns,
|
|
831
|
-
filters = _ref16.filters,
|
|
832
|
-
_ref16$isClearAll = _ref16.isClearAll,
|
|
833
|
-
isClearAll = _ref16$isClearAll === void 0 ? false : _ref16$isClearAll,
|
|
834
|
-
_ref16$childrenKeys = _ref16.childrenKeys,
|
|
835
|
-
childrenKeys = _ref16$childrenKeys === void 0 ? [] : _ref16$childrenKeys;
|
|
836
|
-
var searchParams = getSnakeCasedQueryParams();
|
|
837
|
-
var isKeywordFilterPresent = findBy({
|
|
838
|
-
key: SEARCH_TERM_KEY
|
|
839
|
-
}, filters);
|
|
840
|
-
columns.forEach(function (_ref17) {
|
|
841
|
-
var key = _ref17.key,
|
|
842
|
-
defaultValue = _ref17.defaultValue;
|
|
843
|
-
return !defaultValue && delete searchParams[key];
|
|
844
|
-
});
|
|
845
|
-
if (isClearAll) {
|
|
846
|
-
childrenKeys.forEach(function (key) {
|
|
847
|
-
return delete searchParams[key];
|
|
848
|
-
});
|
|
849
|
-
delete searchParams[SEGMENT_ID_KEY];
|
|
850
|
-
}
|
|
851
|
-
var defaultFilters = buildDefaultFilters(columns, filters);
|
|
852
|
-
isKeywordFilterPresent && delete searchParams[SEARCH_TERM_KEY];
|
|
853
|
-
concat(filters, defaultFilters).forEach(function (filter) {
|
|
854
|
-
searchParams[filter.key] = createUrlParamString({
|
|
855
|
-
filter: filter,
|
|
856
|
-
columns: columns
|
|
857
|
-
});
|
|
858
|
-
});
|
|
859
|
-
if (isEmpty(omit([SEGMENT_ID_KEY], searchParams))) {
|
|
860
|
-
delete searchParams[SEGMENT_ID_KEY];
|
|
861
|
-
}
|
|
862
|
-
return new URLSearchParams(searchParams).toString();
|
|
863
|
-
};
|
|
864
|
-
var createUrlParamStringForSegments = function createUrlParamStringForSegments(_ref18) {
|
|
865
|
-
var filter = _ref18.filter,
|
|
866
|
-
columns = _ref18.columns;
|
|
867
|
-
var value = filter.value,
|
|
868
|
-
_filter$defaultType2 = filter.defaultType,
|
|
869
|
-
defaultType = _filter$defaultType2 === void 0 ? filter.type : _filter$defaultType2;
|
|
870
|
-
if (isMulti(defaultType)) {
|
|
871
|
-
return value;
|
|
872
|
-
}
|
|
873
|
-
return createUrlParamString({
|
|
874
|
-
filter: filter,
|
|
875
|
-
columns: columns
|
|
876
|
-
});
|
|
877
|
-
};
|
|
878
|
-
var buildUrlFromSegment = function buildUrlFromSegment(_ref19) {
|
|
879
|
-
var columns = _ref19.columns,
|
|
880
|
-
filters = _ref19.filters,
|
|
881
|
-
id = _ref19.id;
|
|
882
|
-
var searchParams = getSnakeCasedQueryParams();
|
|
883
|
-
columns.forEach(function (_ref20) {
|
|
884
|
-
var key = _ref20.key,
|
|
885
|
-
defaultValue = _ref20.defaultValue;
|
|
886
|
-
return !defaultValue && delete searchParams[key];
|
|
887
|
-
});
|
|
888
|
-
delete searchParams[SEARCH_TERM_KEY];
|
|
889
|
-
var defaultFilters = buildDefaultFilters(columns, filters);
|
|
890
|
-
var newSearchParams = concat(filters, defaultFilters).reduce(function (acc, filter) {
|
|
891
|
-
acc[filter.key] = createUrlParamStringForSegments({
|
|
892
|
-
filter: filter,
|
|
893
|
-
columns: columns
|
|
894
|
-
});
|
|
895
|
-
return acc;
|
|
896
|
-
}, isNotEmpty(id) ? _defineProperty({}, SEGMENT_ID_KEY, id) : {});
|
|
897
|
-
return new URLSearchParams(_objectSpread$4(_objectSpread$4({}, searchParams), newSearchParams)).toString();
|
|
898
|
-
};
|
|
899
|
-
var getSearchTermFromUrl = function getSearchTermFromUrl() {
|
|
900
|
-
return getQueryParams().searchTerm || "";
|
|
901
|
-
};
|
|
902
|
-
var buildFilterColumnsFromFields = function buildFilterColumnsFromFields(_ref22) {
|
|
903
|
-
var fields = _ref22.fields,
|
|
904
|
-
_ref22$selectedFields = _ref22.selectedFields,
|
|
905
|
-
selectedFields = _ref22$selectedFields === void 0 ? [] : _ref22$selectedFields,
|
|
906
|
-
_ref22$showRuleSelect = _ref22.showRuleSelector,
|
|
907
|
-
showRuleSelector = _ref22$showRuleSelect === void 0 ? false : _ref22$showRuleSelect,
|
|
908
|
-
groupName = _ref22.groupName;
|
|
909
|
-
return fields.reduce(function (columns, field) {
|
|
910
|
-
if (isEmpty(selectedFields) || selectedFields.includes(field.name)) {
|
|
911
|
-
var id = field.id,
|
|
912
|
-
name = field.name,
|
|
913
|
-
kind = field.kind;
|
|
914
|
-
var column = _objectSpread$4({
|
|
915
|
-
key: toLower(name),
|
|
916
|
-
node: "".concat(name, ":").concat(id),
|
|
917
|
-
label: capitalize(name),
|
|
918
|
-
type: "custom.".concat(kind),
|
|
919
|
-
showRuleSelector: showRuleSelector
|
|
920
|
-
}, groupName && {
|
|
921
|
-
group: groupName
|
|
922
|
-
});
|
|
923
|
-
if (kind === "single_option" || kind === "multi_option") {
|
|
924
|
-
column.values = field.data.map(function (item) {
|
|
925
|
-
return {
|
|
926
|
-
label: capitalize(item.label),
|
|
927
|
-
value: item.id
|
|
928
|
-
};
|
|
929
|
-
});
|
|
930
|
-
}
|
|
931
|
-
columns.push(column);
|
|
932
|
-
}
|
|
933
|
-
return columns;
|
|
934
|
-
}, []);
|
|
935
|
-
};
|
|
936
|
-
var getColumnsWithStandardizedType = function getColumnsWithStandardizedType(columns) {
|
|
937
|
-
return columns.map(function (column) {
|
|
938
|
-
return _objectSpread$4(_objectSpread$4({}, column), {}, {
|
|
939
|
-
type: standardizeColumnType(column.type)
|
|
940
|
-
});
|
|
941
|
-
});
|
|
942
|
-
};
|
|
943
|
-
var isKeywordFilterPresent = function isKeywordFilterPresent(keyworFilter) {
|
|
944
|
-
return not(isEmpty(keyworFilter.node));
|
|
945
|
-
};
|
|
946
|
-
|
|
947
|
-
var buildCustomDateValue = function buildCustomDateValue(value) {
|
|
948
|
-
var isBeforeOrAfter = Math.abs(dayjs(value[1]).diff(dayjs(value[0]), "year")) >= 90;
|
|
949
|
-
if (isBeforeOrAfter) {
|
|
950
|
-
var currentMoment = dayjs();
|
|
951
|
-
var diffWithStart = Math.abs(currentMoment.diff(dayjs(value[0]), "year"));
|
|
952
|
-
var diffWithEnd = Math.abs(currentMoment.diff(dayjs(value[1]), "year"));
|
|
953
|
-
return diffWithStart < diffWithEnd ? "after-".concat(dateFormat.date(dayjs(value[0]).subtract(1, "day"))) : "before-".concat(dateFormat.date(dayjs(value[1]).add(1, "day")));
|
|
954
|
-
}
|
|
955
|
-
return value.map(dateFormat.date).join(" - ");
|
|
956
|
-
};
|
|
957
|
-
var buildFilterValue = function buildFilterValue(filter) {
|
|
958
|
-
var _findBy2;
|
|
959
|
-
var _filter$defaultType = filter.defaultType,
|
|
960
|
-
defaultType = _filter$defaultType === void 0 ? filter.type : _filter$defaultType,
|
|
961
|
-
value = filter.value,
|
|
962
|
-
rule = filter.rule,
|
|
963
|
-
_filter$values = filter.values,
|
|
964
|
-
initialValues = _filter$values === void 0 ? [] : _filter$values;
|
|
965
|
-
var values = initialValues.map(modify("value", function (value) {
|
|
966
|
-
return value.toString();
|
|
967
|
-
}));
|
|
968
|
-
if (isDate(defaultType) && isCustomDateRange(value)) {
|
|
969
|
-
return buildCustomDateValue(value);
|
|
970
|
-
} else if (isTime(defaultType) && isCustomTimeRange(value)) {
|
|
971
|
-
return value.map(dateFormat.time).join(" - ");
|
|
972
|
-
} else if (isDate(defaultType) || isTime(defaultType)) {
|
|
973
|
-
return humanize(value);
|
|
974
|
-
} else if (isMulti(defaultType)) {
|
|
975
|
-
return value.map(function (value) {
|
|
976
|
-
var _findBy;
|
|
977
|
-
return ((_findBy = findBy({
|
|
978
|
-
value: value
|
|
979
|
-
}, values)) === null || _findBy === void 0 ? void 0 : _findBy.label) || value;
|
|
980
|
-
}).join(", ");
|
|
981
|
-
} else if (isSingleDate(defaultType)) {
|
|
982
|
-
return rule === "between" ? value.map(dateFormat.date).join(" - ") : dateFormat.date(value);
|
|
983
|
-
} else if (isSingleTime(defaultType)) {
|
|
984
|
-
return rule === "between" ? value.map(dateFormat.time).join(" - ") : dateFormat.time(value);
|
|
985
|
-
} else if (isBoolean(defaultType)) {
|
|
986
|
-
return getLabelFromBool({
|
|
987
|
-
value: value,
|
|
988
|
-
values: values
|
|
989
|
-
});
|
|
990
|
-
}
|
|
991
|
-
return ((_findBy2 = findBy({
|
|
992
|
-
value: value
|
|
993
|
-
}, values)) === null || _findBy2 === void 0 ? void 0 : _findBy2.label) || value;
|
|
994
|
-
};
|
|
995
|
-
var buildRuleValue = function buildRuleValue(_ref) {
|
|
996
|
-
var rule = _ref.rule,
|
|
997
|
-
defaultType = _ref.defaultType;
|
|
998
|
-
if (isText(defaultType)) {
|
|
999
|
-
return findBy({
|
|
1000
|
-
value: rule
|
|
1001
|
-
}, TEXT_RULES).label;
|
|
1002
|
-
} else if (isDigit(defaultType)) {
|
|
1003
|
-
return findBy({
|
|
1004
|
-
value: rule
|
|
1005
|
-
}, NUMBER_RULES).label;
|
|
1006
|
-
} else if (isSingleDate(defaultType)) {
|
|
1007
|
-
return findBy({
|
|
1008
|
-
value: rule
|
|
1009
|
-
}, SINGLE_DATE_OPTIONS).label;
|
|
1010
|
-
} else if (isSingleTime(defaultType)) {
|
|
1011
|
-
return findBy({
|
|
1012
|
-
value: rule
|
|
1013
|
-
}, SINGLE_TIME_OPTIONS).label;
|
|
1014
|
-
}
|
|
1015
|
-
return "";
|
|
1016
|
-
};
|
|
1017
|
-
var hasOnlyKeywordFilter = function hasOnlyKeywordFilter(filters) {
|
|
1018
|
-
return filters.length === 1 && filters[0].key === SEARCH_TERM_KEY;
|
|
1019
|
-
};
|
|
1020
|
-
|
|
1021
|
-
var Block = function Block(_ref) {
|
|
1022
|
-
var filter = _ref.filter,
|
|
1023
|
-
handleDelete = _ref.handleDelete,
|
|
1024
|
-
setIsPaneOpen = _ref.setIsPaneOpen;
|
|
1025
|
-
var key = filter.key,
|
|
1026
|
-
_filter$defaultType = filter.defaultType,
|
|
1027
|
-
defaultType = _filter$defaultType === void 0 ? filter.type : _filter$defaultType,
|
|
1028
|
-
label = filter.label,
|
|
1029
|
-
rule = filter.rule,
|
|
1030
|
-
defaultValue = filter.defaultValue;
|
|
1031
|
-
var filterValue = buildFilterValue(filter);
|
|
1032
|
-
var ruleContent = buildRuleValue({
|
|
1033
|
-
rule: rule,
|
|
1034
|
-
defaultType: defaultType
|
|
1035
|
-
});
|
|
1036
|
-
var blockLength = label.length + ruleContent.length + filterValue.length;
|
|
1037
|
-
var toolTipDisabled = blockLength <= 50;
|
|
1038
|
-
var blockContent = !toolTipDisabled ? "".concat(filterValue.slice(0, 50 - blockLength), "...") : filterValue;
|
|
1039
|
-
var deleteBlockHotKeyRef = useHotkeys(SHORTCUTS.deleteBlock.sequence, function () {
|
|
1040
|
-
return handleDelete(key);
|
|
1041
|
-
}, {
|
|
1042
|
-
mode: "scoped"
|
|
1043
|
-
});
|
|
1044
|
-
var openFilterPaneHotKeyRef = useHotkeys(SHORTCUTS.openFilterPane.sequence, function () {
|
|
1045
|
-
return setIsPaneOpen(key);
|
|
1046
|
-
}, {
|
|
1047
|
-
mode: "scoped"
|
|
1048
|
-
});
|
|
1049
|
-
return /*#__PURE__*/React.createElement(Tooltip, {
|
|
1050
|
-
content: filterValue,
|
|
1051
|
-
disabled: toolTipDisabled,
|
|
1052
|
-
position: "bottom",
|
|
1053
|
-
theme: "light"
|
|
1054
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
1055
|
-
className: "neeto-filters-bar__block",
|
|
1056
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-block"),
|
|
1057
|
-
tabIndex: 0,
|
|
1058
|
-
ref: function ref(node) {
|
|
1059
|
-
deleteBlockHotKeyRef.current = node;
|
|
1060
|
-
openFilterPaneHotKeyRef.current = node;
|
|
1061
|
-
},
|
|
1062
|
-
onClick: function onClick() {
|
|
1063
|
-
return setIsPaneOpen(key);
|
|
1064
|
-
}
|
|
1065
|
-
}, /*#__PURE__*/React.createElement(Typography, {
|
|
1066
|
-
style: "body2"
|
|
1067
|
-
}, label, ":"), /*#__PURE__*/React.createElement(Typography, {
|
|
1068
|
-
className: "neeto-ui-text-gray-500",
|
|
1069
|
-
style: "body2"
|
|
1070
|
-
}, ruleContent), /*#__PURE__*/React.createElement(Typography, {
|
|
1071
|
-
style: "body2"
|
|
1072
|
-
}, blockContent), !defaultValue && /*#__PURE__*/React.createElement("div", {
|
|
1073
|
-
className: "neeto-filters-bar__block-close"
|
|
1074
|
-
}, /*#__PURE__*/React.createElement(Close, {
|
|
1075
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-block-close-btn"),
|
|
1076
|
-
size: 16,
|
|
1077
|
-
strokeWidth: 2,
|
|
1078
|
-
onClick: function onClick(event) {
|
|
1079
|
-
event.stopPropagation();
|
|
1080
|
-
handleDelete(key);
|
|
1081
|
-
}
|
|
1082
|
-
}))));
|
|
1083
|
-
};
|
|
1084
|
-
|
|
1085
|
-
var ChildBlock = function ChildBlock(_ref) {
|
|
1086
|
-
var childKey = _ref.childKey,
|
|
1087
|
-
setIsPaneOpen = _ref.setIsPaneOpen,
|
|
1088
|
-
handleDelete = _ref.handleDelete;
|
|
1089
|
-
var deleteBlockHotKeyRef = useHotkeys(SHORTCUTS.deleteBlock.sequence, function () {
|
|
1090
|
-
return handleDelete(childKey);
|
|
1091
|
-
}, {
|
|
1092
|
-
mode: "scoped"
|
|
1093
|
-
});
|
|
1094
|
-
var openFilterPaneHotKeyRef = useHotkeys(SHORTCUTS.openFilterPane.sequence, function () {
|
|
1095
|
-
return setIsPaneOpen(childKey);
|
|
1096
|
-
}, {
|
|
1097
|
-
mode: "scoped"
|
|
1098
|
-
});
|
|
1099
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
1100
|
-
className: "neeto-filters-bar__block",
|
|
1101
|
-
"data-cy": "neeto-filters-".concat(hyphenate(childKey), "-block"),
|
|
1102
|
-
tabIndex: 0,
|
|
1103
|
-
ref: function ref(node) {
|
|
1104
|
-
deleteBlockHotKeyRef.current = node;
|
|
1105
|
-
openFilterPaneHotKeyRef.current = node;
|
|
1106
|
-
},
|
|
1107
|
-
onClick: function onClick() {
|
|
1108
|
-
return setIsPaneOpen(childKey);
|
|
1109
|
-
}
|
|
1110
|
-
}, /*#__PURE__*/React.createElement(Typography, {
|
|
1111
|
-
style: "body2",
|
|
1112
|
-
weight: "medium"
|
|
1113
|
-
}, childKey), /*#__PURE__*/React.createElement("div", {
|
|
1114
|
-
className: "neeto-filters-bar__block-close"
|
|
1115
|
-
}, /*#__PURE__*/React.createElement(Close, {
|
|
1116
|
-
"data-cy": "neeto-filters-".concat(hyphenate(childKey), "-block-close-btn"),
|
|
1117
|
-
size: 16,
|
|
1118
|
-
strokeWidth: 2,
|
|
1119
|
-
onClick: function onClick(event) {
|
|
1120
|
-
event.stopPropagation();
|
|
1121
|
-
handleDelete(childKey);
|
|
1122
|
-
}
|
|
1123
|
-
})));
|
|
1124
|
-
};
|
|
1125
|
-
|
|
1126
|
-
var fetch = function fetch(params) {
|
|
1127
|
-
return axios.get(SEGMENTS_BASE_URL, {
|
|
1128
|
-
params: params
|
|
1129
|
-
});
|
|
1130
|
-
};
|
|
1131
|
-
var show = function show(id) {
|
|
1132
|
-
return axios.get("".concat(SEGMENTS_BASE_URL, "/").concat(id), {
|
|
1133
|
-
transformResponseCase: false
|
|
1134
|
-
});
|
|
1135
|
-
};
|
|
1136
|
-
var create = function create(payload) {
|
|
1137
|
-
return axios.post(SEGMENTS_BASE_URL, {
|
|
1138
|
-
segment: payload
|
|
1139
|
-
});
|
|
1140
|
-
};
|
|
1141
|
-
var update = function update(_ref) {
|
|
1142
|
-
var id = _ref.id,
|
|
1143
|
-
payload = _ref.payload,
|
|
1144
|
-
_ref$showToastr = _ref.showToastr,
|
|
1145
|
-
showToastr = _ref$showToastr === void 0 ? true : _ref$showToastr;
|
|
1146
|
-
return axios.put("".concat(SEGMENTS_BASE_URL, "/").concat(id), payload, {
|
|
1147
|
-
showToastr: showToastr
|
|
1148
|
-
});
|
|
1149
|
-
};
|
|
1150
|
-
var destroy = function destroy(id) {
|
|
1151
|
-
return axios["delete"]("".concat(SEGMENTS_BASE_URL, "/").concat(id));
|
|
1152
|
-
};
|
|
1153
|
-
var segmentsApi = {
|
|
1154
|
-
fetch: fetch,
|
|
1155
|
-
show: show,
|
|
1156
|
-
create: create,
|
|
1157
|
-
update: update,
|
|
1158
|
-
destroy: destroy
|
|
1159
|
-
};
|
|
1160
|
-
|
|
1161
|
-
var QUERY_KEYS = {
|
|
1162
|
-
SEGMENTS_LIST: "segments-list"
|
|
1163
|
-
};
|
|
1164
|
-
var SEGMENTS_STALE_TIME = 900000; // 15 mins
|
|
1165
|
-
|
|
1166
|
-
function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
1167
|
-
function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
1168
|
-
var SEGMENTS_LIST = QUERY_KEYS.SEGMENTS_LIST;
|
|
1169
|
-
var useFetchSegments = function useFetchSegments(_ref) {
|
|
1170
|
-
var entity = _ref.entity,
|
|
1171
|
-
_ref$searchTerm = _ref.searchTerm,
|
|
1172
|
-
searchTerm = _ref$searchTerm === void 0 ? "" : _ref$searchTerm;
|
|
1173
|
-
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
1174
|
-
return useQuery([SEGMENTS_LIST, entity, searchTerm], function () {
|
|
1175
|
-
return segmentsApi.fetch({
|
|
1176
|
-
entity: entity,
|
|
1177
|
-
searchTerm: searchTerm
|
|
1178
|
-
});
|
|
1179
|
-
}, mergeRight({
|
|
1180
|
-
staleTime: SEGMENTS_STALE_TIME,
|
|
1181
|
-
select: prop("segments")
|
|
1182
|
-
}, options));
|
|
1183
|
-
};
|
|
1184
|
-
var useShowSegment = function useShowSegment(id) {
|
|
1185
|
-
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
1186
|
-
return useQuery([SEGMENTS_LIST, id], function () {
|
|
1187
|
-
return segmentsApi.show(id);
|
|
1188
|
-
}, mergeRight({
|
|
1189
|
-
staleTime: SEGMENTS_STALE_TIME,
|
|
1190
|
-
select: prop("segment")
|
|
1191
|
-
}, options));
|
|
1192
|
-
};
|
|
1193
|
-
var useCreateSegment = function useCreateSegment(options) {
|
|
1194
|
-
return useMutationWithInvalidation(segmentsApi.create, _objectSpread$3({
|
|
1195
|
-
keysToInvalidate: [SEGMENTS_LIST]
|
|
1196
|
-
}, options));
|
|
1197
|
-
};
|
|
1198
|
-
var useUpdateSegment = function useUpdateSegment(options) {
|
|
1199
|
-
return useMutationWithInvalidation(segmentsApi.update, _objectSpread$3({
|
|
1200
|
-
keysToInvalidate: [SEGMENTS_LIST]
|
|
1201
|
-
}, options));
|
|
1202
|
-
};
|
|
1203
|
-
var useDestroySegment = function useDestroySegment(options) {
|
|
1204
|
-
return useMutationWithInvalidation(segmentsApi.destroy, _objectSpread$3({
|
|
1205
|
-
keysToInvalidate: [SEGMENTS_LIST]
|
|
1206
|
-
}, options));
|
|
1207
|
-
};
|
|
1208
|
-
|
|
1209
|
-
var buildSegmentsValidationSchema = function buildSegmentsValidationSchema(defaultSegmentName) {
|
|
1210
|
-
return yup.object({
|
|
1211
|
-
name: yup.string().trim().required().test({
|
|
1212
|
-
name: "not-default-segment-name",
|
|
1213
|
-
test: function test(value) {
|
|
1214
|
-
return (value === null || value === void 0 ? void 0 : value.toLocaleLowerCase()) !== defaultSegmentName.toLocaleLowerCase();
|
|
1215
|
-
},
|
|
1216
|
-
message: t$1("neetoFilters.segments.reservedNameErrorMessage")
|
|
1217
|
-
})
|
|
1218
|
-
});
|
|
1219
|
-
};
|
|
1220
|
-
|
|
1221
|
-
var Menu = Dropdown$2.Menu,
|
|
1222
|
-
MenuItem = Dropdown$2.MenuItem;
|
|
1223
|
-
var Segment = function Segment(_ref) {
|
|
1224
|
-
var entity = _ref.entity,
|
|
1225
|
-
filters = _ref.filters,
|
|
1226
|
-
columns = _ref.columns,
|
|
1227
|
-
childrenKeys = _ref.childrenKeys,
|
|
1228
|
-
setIsFilterPaneOpen = _ref.setIsFilterPaneOpen,
|
|
1229
|
-
defaultSegmentName = _ref.defaultSegmentName;
|
|
1230
|
-
var _useState = useState(false),
|
|
1231
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
1232
|
-
isSavePaneOpen = _useState2[0],
|
|
1233
|
-
setIsSavePaneOpen = _useState2[1];
|
|
1234
|
-
var _useState3 = useState(false),
|
|
1235
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
1236
|
-
isUpdateAlertOpen = _useState4[0],
|
|
1237
|
-
setIsUpdateAlertOpen = _useState4[1];
|
|
1238
|
-
var inputRef = useRef(null);
|
|
1239
|
-
var _useTranslation = useTranslation(),
|
|
1240
|
-
t = _useTranslation.t;
|
|
1241
|
-
var history = useHistory();
|
|
1242
|
-
var filtersPayload = buildSegmentsPayload(filters, childrenKeys);
|
|
1243
|
-
var _getQueryParams = getQueryParams(),
|
|
1244
|
-
segmentId = _getQueryParams.segmentId;
|
|
1245
|
-
var _useShowSegment = useShowSegment(segmentId, {
|
|
1246
|
-
enabled: isNotNil(segmentId)
|
|
1247
|
-
}),
|
|
1248
|
-
_useShowSegment$data = _useShowSegment.data,
|
|
1249
|
-
selectedSegment = _useShowSegment$data === void 0 ? {} : _useShowSegment$data;
|
|
1250
|
-
var _useCreateSegment = useCreateSegment(),
|
|
1251
|
-
createSegment = _useCreateSegment.mutate,
|
|
1252
|
-
isCreating = _useCreateSegment.isLoading;
|
|
1253
|
-
var _useUpdateSegment = useUpdateSegment(),
|
|
1254
|
-
updateSegment = _useUpdateSegment.mutate,
|
|
1255
|
-
isUpdating = _useUpdateSegment.isLoading;
|
|
1256
|
-
var isSubmitting = isCreating || isUpdating;
|
|
1257
|
-
var handleUpdate = function handleUpdate() {
|
|
1258
|
-
return updateSegment({
|
|
1259
|
-
id: segmentId,
|
|
1260
|
-
payload: {
|
|
1261
|
-
filters: filtersPayload
|
|
1262
|
-
}
|
|
1263
|
-
}, {
|
|
1264
|
-
onSuccess: function onSuccess() {
|
|
1265
|
-
return setIsUpdateAlertOpen(false);
|
|
1266
|
-
}
|
|
1267
|
-
});
|
|
1268
|
-
};
|
|
1269
|
-
var handleCreateSuccess = function handleCreateSuccess(_ref2) {
|
|
1270
|
-
var _filters$;
|
|
1271
|
-
var _ref2$segment = _ref2.segment,
|
|
1272
|
-
id = _ref2$segment.id,
|
|
1273
|
-
filters = _ref2$segment.filters;
|
|
1274
|
-
history.push({
|
|
1275
|
-
search: buildUrlFromSegment({
|
|
1276
|
-
columns: columns,
|
|
1277
|
-
filters: (_filters$ = filters[0]) === null || _filters$ === void 0 ? void 0 : _filters$.conditions,
|
|
1278
|
-
id: id
|
|
1279
|
-
})
|
|
1280
|
-
});
|
|
1281
|
-
setIsSavePaneOpen(false);
|
|
1282
|
-
};
|
|
1283
|
-
var handleSubmit = function handleSubmit(_ref3) {
|
|
1284
|
-
var name = _ref3.name;
|
|
1285
|
-
return createSegment({
|
|
1286
|
-
name: name,
|
|
1287
|
-
entity: entity,
|
|
1288
|
-
filters: filtersPayload
|
|
1289
|
-
}, {
|
|
1290
|
-
onSuccess: handleCreateSuccess
|
|
1291
|
-
});
|
|
1292
|
-
};
|
|
1293
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, isNil(segmentId) ? /*#__PURE__*/React.createElement(Button, {
|
|
1294
|
-
disabled: hasOnlyKeywordFilter(filters),
|
|
1295
|
-
label: t("neetoFilters.segments.saveAsSegment"),
|
|
1296
|
-
style: "secondary",
|
|
1297
|
-
onClick: function onClick() {
|
|
1298
|
-
setIsFilterPaneOpen(false);
|
|
1299
|
-
setIsSavePaneOpen(true);
|
|
1300
|
-
}
|
|
1301
|
-
}) : /*#__PURE__*/React.createElement(Dropdown$2, {
|
|
1302
|
-
buttonStyle: "secondary",
|
|
1303
|
-
label: t("neetoFilters.segments.saveSegment")
|
|
1304
|
-
}, /*#__PURE__*/React.createElement(Menu, null, /*#__PURE__*/React.createElement(MenuItem.Button, {
|
|
1305
|
-
isDisabled: equals(filtersPayload, selectedSegment === null || selectedSegment === void 0 ? void 0 : selectedSegment.filters),
|
|
1306
|
-
onClick: setIsUpdateAlertOpen
|
|
1307
|
-
}, t("neetoFilters.segments.saveSegment")), /*#__PURE__*/React.createElement(MenuItem.Button, {
|
|
1308
|
-
onClick: function onClick() {
|
|
1309
|
-
setIsFilterPaneOpen(false);
|
|
1310
|
-
setIsSavePaneOpen(true);
|
|
1311
|
-
}
|
|
1312
|
-
}, t("neetoFilters.segments.saveAsNewSegment")))), /*#__PURE__*/React.createElement(Pane$1, {
|
|
1313
|
-
initialFocusRef: inputRef,
|
|
1314
|
-
isOpen: isSavePaneOpen,
|
|
1315
|
-
onClose: function onClose() {
|
|
1316
|
-
return setIsSavePaneOpen(false);
|
|
1317
|
-
}
|
|
1318
|
-
}, /*#__PURE__*/React.createElement(Pane$1.Header, null, /*#__PURE__*/React.createElement(Typography, {
|
|
1319
|
-
style: "h2",
|
|
1320
|
-
weight: "semibold"
|
|
1321
|
-
}, t("neetoFilters.segments.addNewSegment"))), /*#__PURE__*/React.createElement(Form, {
|
|
1322
|
-
className: "w-full",
|
|
1323
|
-
formProps: {
|
|
1324
|
-
noValidate: true
|
|
1325
|
-
},
|
|
1326
|
-
formikProps: {
|
|
1327
|
-
initialValues: {
|
|
1328
|
-
name: ""
|
|
1329
|
-
},
|
|
1330
|
-
validateOnChange: true,
|
|
1331
|
-
validateOnBlur: true,
|
|
1332
|
-
validationSchema: buildSegmentsValidationSchema(defaultSegmentName),
|
|
1333
|
-
onSubmit: handleSubmit
|
|
1334
|
-
}
|
|
1335
|
-
}, /*#__PURE__*/React.createElement(Pane$1.Body, null, /*#__PURE__*/React.createElement(Input, {
|
|
1336
|
-
className: "w-full",
|
|
1337
|
-
label: t("neetoFilters.segments.name"),
|
|
1338
|
-
name: "name",
|
|
1339
|
-
placeholder: t("neetoFilters.segments.segmentName"),
|
|
1340
|
-
ref: inputRef
|
|
1341
|
-
})), /*#__PURE__*/React.createElement(Pane$1.Footer, {
|
|
1342
|
-
className: "flex items-center space-x-2"
|
|
1343
|
-
}, /*#__PURE__*/React.createElement(ActionBlock, {
|
|
1344
|
-
cancelButtonProps: {
|
|
1345
|
-
onClick: function onClick() {
|
|
1346
|
-
return setIsSavePaneOpen(false);
|
|
1347
|
-
},
|
|
1348
|
-
disabled: false
|
|
1349
|
-
},
|
|
1350
|
-
submitButtonProps: {
|
|
1351
|
-
disabled: isSubmitting,
|
|
1352
|
-
loading: isSubmitting
|
|
1353
|
-
}
|
|
1354
|
-
})))), /*#__PURE__*/React.createElement(Alert, {
|
|
1355
|
-
isOpen: isUpdateAlertOpen,
|
|
1356
|
-
isSubmitting: isUpdating,
|
|
1357
|
-
message: t("neetoFilters.segments.updateSegmentMessage"),
|
|
1358
|
-
submitButtonLabel: t("neetoFilters.common.update"),
|
|
1359
|
-
title: t("neetoFilters.segments.updateSegment"),
|
|
1360
|
-
onClose: function onClose() {
|
|
1361
|
-
return setIsUpdateAlertOpen(false);
|
|
1362
|
-
},
|
|
1363
|
-
onSubmit: handleUpdate
|
|
1364
|
-
}));
|
|
1365
|
-
};
|
|
1366
|
-
|
|
1367
|
-
function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
1368
|
-
function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
1369
|
-
var Bar = function Bar(_ref) {
|
|
1370
|
-
var entity = _ref.entity,
|
|
1371
|
-
className = _ref.className,
|
|
1372
|
-
_ref$columns = _ref.columns,
|
|
1373
|
-
columns = _ref$columns === void 0 ? [] : _ref$columns,
|
|
1374
|
-
_ref$keyword = _ref.keyword,
|
|
1375
|
-
keyword = _ref$keyword === void 0 ? {
|
|
1376
|
-
node: "",
|
|
1377
|
-
value: "",
|
|
1378
|
-
setValue: noop$1
|
|
1379
|
-
} : _ref$keyword,
|
|
1380
|
-
_ref$setIsPaneOpen = _ref.setIsPaneOpen,
|
|
1381
|
-
setIsPaneOpen = _ref$setIsPaneOpen === void 0 ? identity : _ref$setIsPaneOpen,
|
|
1382
|
-
_ref$childrenKeys = _ref.childrenKeys,
|
|
1383
|
-
childrenKeys = _ref$childrenKeys === void 0 ? [] : _ref$childrenKeys,
|
|
1384
|
-
_ref$defaultSegmentNa = _ref.defaultSegmentName,
|
|
1385
|
-
defaultSegmentName = _ref$defaultSegmentNa === void 0 ? t$1("neetoFilters.common.allResults") : _ref$defaultSegmentNa;
|
|
1386
|
-
return function () {
|
|
1387
|
-
var _useTranslation = useTranslation(),
|
|
1388
|
-
t = _useTranslation.t;
|
|
1389
|
-
var initialRenderRef = useRef(true);
|
|
1390
|
-
var searchParams = useQueryParams({
|
|
1391
|
-
toCamelCase: false
|
|
1392
|
-
});
|
|
1393
|
-
var keywordValue = searchParams[SEARCH_TERM_KEY] || "";
|
|
1394
|
-
var keywordFilter = _objectSpread$2(_objectSpread$2({
|
|
1395
|
-
type: "text",
|
|
1396
|
-
rule: "contains",
|
|
1397
|
-
label: t("neetoFilters.common.searchTerm")
|
|
1398
|
-
}, keyword), {}, {
|
|
1399
|
-
key: SEARCH_TERM_KEY,
|
|
1400
|
-
value: keywordValue
|
|
1401
|
-
});
|
|
1402
|
-
var filters = buildFiltersFromSearchParams(isKeywordFilterPresent(keywordFilter) && isNotEmpty(keywordValue) ? [keywordFilter].concat(_toConsumableArray(columns)) : columns);
|
|
1403
|
-
var nonHiddenFilters = removeBy({
|
|
1404
|
-
hidden: true
|
|
1405
|
-
}, filters);
|
|
1406
|
-
var history = useHistory();
|
|
1407
|
-
var handleSubmit = function handleSubmit(newFilters, isClearAll) {
|
|
1408
|
-
var params = buildUrlFromFilters(_objectSpread$2({
|
|
1409
|
-
columns: columns,
|
|
1410
|
-
filters: isKeywordFilterPresent(keywordFilter) && isNotEmpty(getSearchTermFromUrl()) ? [].concat(_toConsumableArray(newFilters), [keywordFilter]) : newFilters
|
|
1411
|
-
}, isClearAll && {
|
|
1412
|
-
isClearAll: true,
|
|
1413
|
-
childrenKeys: childrenKeys
|
|
1414
|
-
}));
|
|
1415
|
-
history.push({
|
|
1416
|
-
search: params
|
|
1417
|
-
});
|
|
1418
|
-
};
|
|
1419
|
-
var handleDelete = function handleDelete(key) {
|
|
1420
|
-
if (key === SEARCH_TERM_KEY) {
|
|
1421
|
-
var params = omit([SEARCH_TERM_KEY], getSnakeCasedQueryParams());
|
|
1422
|
-
var pathname = window.location.pathname;
|
|
1423
|
-
history.push(buildUrl(pathname, params));
|
|
1424
|
-
return;
|
|
1425
|
-
}
|
|
1426
|
-
if (childrenKeys.includes(key)) {
|
|
1427
|
-
var _params = omit([key], getSnakeCasedQueryParams());
|
|
1428
|
-
var _pathname = window.location.pathname;
|
|
1429
|
-
history.push(buildUrl(_pathname, _params));
|
|
1430
|
-
}
|
|
1431
|
-
var newFilters = removeBy({
|
|
1432
|
-
key: key
|
|
1433
|
-
}, filters);
|
|
1434
|
-
handleSubmit(newFilters);
|
|
1435
|
-
};
|
|
1436
|
-
var handleClearAll = function handleClearAll() {
|
|
1437
|
-
var params = isKeywordFilterPresent(keywordFilter) ? omit([SEARCH_TERM_KEY], getSnakeCasedQueryParams()) : getSnakeCasedQueryParams();
|
|
1438
|
-
var pathname = window.location.pathname;
|
|
1439
|
-
history.push(buildUrl(pathname, params));
|
|
1440
|
-
handleSubmit([], true);
|
|
1441
|
-
};
|
|
1442
|
-
var childrenFiltersApplied = childrenKeys.some(function (key) {
|
|
1443
|
-
return has(key, searchParams);
|
|
1444
|
-
});
|
|
1445
|
-
var hideClearButton = nonHiddenFilters.every(function (_ref2) {
|
|
1446
|
-
var defaultValue = _ref2.defaultValue,
|
|
1447
|
-
isClearable = _ref2.isClearable;
|
|
1448
|
-
return defaultValue && !isClearable;
|
|
1449
|
-
}) && !childrenFiltersApplied;
|
|
1450
|
-
useEffect(function () {
|
|
1451
|
-
if (initialRenderRef.current) {
|
|
1452
|
-
initialRenderRef.current = false;
|
|
1453
|
-
return noop$1;
|
|
1454
|
-
}
|
|
1455
|
-
var handler = setTimeout(function () {
|
|
1456
|
-
handleSubmit(filters);
|
|
1457
|
-
}, 500);
|
|
1458
|
-
return function () {
|
|
1459
|
-
return clearTimeout(handler);
|
|
1460
|
-
};
|
|
1461
|
-
}, [keywordValue]);
|
|
1462
|
-
if (isEmpty(nonHiddenFilters) && !childrenFiltersApplied) return null;
|
|
1463
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
1464
|
-
className: classnames("neeto-filters-bar", _defineProperty({}, className, className))
|
|
1465
|
-
}, nonHiddenFilters.map(function (filter) {
|
|
1466
|
-
var _filter$suffixCompone;
|
|
1467
|
-
return /*#__PURE__*/React.createElement(React.Fragment, {
|
|
1468
|
-
key: filter.key
|
|
1469
|
-
}, /*#__PURE__*/React.createElement(Block, {
|
|
1470
|
-
filter: filter,
|
|
1471
|
-
handleDelete: handleDelete,
|
|
1472
|
-
setIsPaneOpen: setIsPaneOpen
|
|
1473
|
-
}), (_filter$suffixCompone = filter.suffixComponent) === null || _filter$suffixCompone === void 0 ? void 0 : _filter$suffixCompone.call(filter), /*#__PURE__*/React.createElement("div", {
|
|
1474
|
-
className: "neeto-filters-bar--separator"
|
|
1475
|
-
}));
|
|
1476
|
-
}), childrenKeys.filter(function (childKey) {
|
|
1477
|
-
return has(childKey, searchParams);
|
|
1478
|
-
}).map(function (childKey) {
|
|
1479
|
-
return /*#__PURE__*/React.createElement(React.Fragment, {
|
|
1480
|
-
key: childKey
|
|
1481
|
-
}, /*#__PURE__*/React.createElement(ChildBlock, {
|
|
1482
|
-
childKey: childKey,
|
|
1483
|
-
handleDelete: handleDelete,
|
|
1484
|
-
setIsPaneOpen: setIsPaneOpen
|
|
1485
|
-
}), /*#__PURE__*/React.createElement("div", {
|
|
1486
|
-
className: "neeto-filters-bar--separator"
|
|
1487
|
-
}));
|
|
1488
|
-
}), isNotNil(entity) && /*#__PURE__*/React.createElement(Segment, {
|
|
1489
|
-
childrenKeys: childrenKeys,
|
|
1490
|
-
columns: columns,
|
|
1491
|
-
defaultSegmentName: defaultSegmentName,
|
|
1492
|
-
entity: entity,
|
|
1493
|
-
filters: filters,
|
|
1494
|
-
setIsFilterPaneOpen: setIsPaneOpen
|
|
1495
|
-
}), !hideClearButton && /*#__PURE__*/React.createElement(Button, {
|
|
1496
|
-
"data-cy": "neeto-filters-bar-clear-btn",
|
|
1497
|
-
label: t("neetoFilters.common.clearFilters"),
|
|
1498
|
-
style: "text",
|
|
1499
|
-
onClick: handleClearAll
|
|
1500
|
-
}));
|
|
1501
|
-
}();
|
|
1502
|
-
};
|
|
1503
|
-
|
|
1504
|
-
function _extends$1() {
|
|
1505
|
-
_extends$1 = Object.assign ? Object.assign.bind() : function (target) {
|
|
1506
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
1507
|
-
var source = arguments[i];
|
|
1508
|
-
for (var key in source) {
|
|
1509
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
1510
|
-
target[key] = source[key];
|
|
1511
|
-
}
|
|
1512
|
-
}
|
|
1513
|
-
}
|
|
1514
|
-
return target;
|
|
1515
|
-
};
|
|
1516
|
-
return _extends$1.apply(this, arguments);
|
|
1517
|
-
}
|
|
1518
|
-
|
|
1519
|
-
function _objectWithoutPropertiesLoose$1(source, excluded) {
|
|
1520
|
-
if (source == null) return {};
|
|
1521
|
-
var target = {};
|
|
1522
|
-
var sourceKeys = Object.keys(source);
|
|
1523
|
-
var key, i;
|
|
1524
|
-
for (i = 0; i < sourceKeys.length; i++) {
|
|
1525
|
-
key = sourceKeys[i];
|
|
1526
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
1527
|
-
target[key] = source[key];
|
|
1528
|
-
}
|
|
1529
|
-
return target;
|
|
1530
|
-
}
|
|
1531
|
-
|
|
1532
|
-
function _objectWithoutProperties(source, excluded) {
|
|
1533
|
-
if (source == null) return {};
|
|
1534
|
-
var target = _objectWithoutPropertiesLoose$1(source, excluded);
|
|
1535
|
-
var key, i;
|
|
1536
|
-
if (Object.getOwnPropertySymbols) {
|
|
1537
|
-
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
1538
|
-
for (i = 0; i < sourceSymbolKeys.length; i++) {
|
|
1539
|
-
key = sourceSymbolKeys[i];
|
|
1540
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
1541
|
-
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
1542
|
-
target[key] = source[key];
|
|
1543
|
-
}
|
|
1544
|
-
}
|
|
1545
|
-
return target;
|
|
1546
|
-
}
|
|
1547
|
-
|
|
1548
|
-
var Portal = function Portal(_ref) {
|
|
1549
|
-
var children = _ref.children,
|
|
1550
|
-
_ref$rootId = _ref.rootId,
|
|
1551
|
-
rootId = _ref$rootId === void 0 ? "neeto-filters-portal" : _ref$rootId,
|
|
1552
|
-
_ref$element = _ref.element,
|
|
1553
|
-
element = _ref$element === void 0 ? "div" : _ref$element;
|
|
1554
|
-
var target = useRef(null);
|
|
1555
|
-
useEffect(function () {
|
|
1556
|
-
var container = document.getElementById(rootId);
|
|
1557
|
-
if (!container) {
|
|
1558
|
-
container = document.createElement(element);
|
|
1559
|
-
container.setAttribute("id", rootId);
|
|
1560
|
-
document.body.appendChild(container);
|
|
1561
|
-
}
|
|
1562
|
-
container.appendChild(target.current);
|
|
1563
|
-
return function () {
|
|
1564
|
-
target.current.remove();
|
|
1565
|
-
if (isEmpty(container.childNodes)) {
|
|
1566
|
-
container.remove();
|
|
1567
|
-
}
|
|
1568
|
-
};
|
|
1569
|
-
}, [rootId]);
|
|
1570
|
-
if (!target.current) {
|
|
1571
|
-
target.current = document.createElement(element);
|
|
1572
|
-
}
|
|
1573
|
-
return /*#__PURE__*/createPortal(children, target.current);
|
|
1574
|
-
};
|
|
1575
|
-
|
|
1576
|
-
function _extends() {
|
|
1577
|
-
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
1578
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
1579
|
-
var source = arguments[i];
|
|
1580
|
-
for (var key in source) {
|
|
1581
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
1582
|
-
target[key] = source[key];
|
|
1583
|
-
}
|
|
1584
|
-
}
|
|
1585
|
-
}
|
|
1586
|
-
return target;
|
|
1587
|
-
};
|
|
1588
|
-
return _extends.apply(this, arguments);
|
|
1589
|
-
}
|
|
1590
|
-
|
|
1591
|
-
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
1592
|
-
if (source == null) return {};
|
|
1593
|
-
var target = {};
|
|
1594
|
-
var sourceKeys = Object.keys(source);
|
|
1595
|
-
var key, i;
|
|
1596
|
-
for (i = 0; i < sourceKeys.length; i++) {
|
|
1597
|
-
key = sourceKeys[i];
|
|
1598
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
1599
|
-
target[key] = source[key];
|
|
1600
|
-
}
|
|
1601
|
-
return target;
|
|
1602
|
-
}
|
|
1603
|
-
|
|
1604
|
-
function _setPrototypeOf(o, p) {
|
|
1605
|
-
_setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
|
|
1606
|
-
o.__proto__ = p;
|
|
1607
|
-
return o;
|
|
1608
|
-
};
|
|
1609
|
-
return _setPrototypeOf(o, p);
|
|
1610
|
-
}
|
|
1611
|
-
|
|
1612
|
-
function _inheritsLoose(subClass, superClass) {
|
|
1613
|
-
subClass.prototype = Object.create(superClass.prototype);
|
|
1614
|
-
subClass.prototype.constructor = subClass;
|
|
1615
|
-
_setPrototypeOf(subClass, superClass);
|
|
1616
|
-
}
|
|
1617
|
-
|
|
1618
|
-
/**
|
|
1619
|
-
* Checks if a given element has a CSS class.
|
|
1620
|
-
*
|
|
1621
|
-
* @param element the element
|
|
1622
|
-
* @param className the CSS class name
|
|
1623
|
-
*/
|
|
1624
|
-
function hasClass(element, className) {
|
|
1625
|
-
if (element.classList) return !!className && element.classList.contains(className);
|
|
1626
|
-
return (" " + (element.className.baseVal || element.className) + " ").indexOf(" " + className + " ") !== -1;
|
|
1627
|
-
}
|
|
1628
|
-
|
|
1629
|
-
/**
|
|
1630
|
-
* Adds a CSS class to a given element.
|
|
1631
|
-
*
|
|
1632
|
-
* @param element the element
|
|
1633
|
-
* @param className the CSS class name
|
|
1634
|
-
*/
|
|
1635
|
-
|
|
1636
|
-
function addClass(element, className) {
|
|
1637
|
-
if (element.classList) element.classList.add(className);else if (!hasClass(element, className)) if (typeof element.className === 'string') element.className = element.className + " " + className;else element.setAttribute('class', (element.className && element.className.baseVal || '') + " " + className);
|
|
1638
|
-
}
|
|
1639
|
-
|
|
1640
|
-
function replaceClassName(origClass, classToRemove) {
|
|
1641
|
-
return origClass.replace(new RegExp("(^|\\s)" + classToRemove + "(?:\\s|$)", 'g'), '$1').replace(/\s+/g, ' ').replace(/^\s*|\s*$/g, '');
|
|
1642
|
-
}
|
|
1643
|
-
/**
|
|
1644
|
-
* Removes a CSS class from a given element.
|
|
1645
|
-
*
|
|
1646
|
-
* @param element the element
|
|
1647
|
-
* @param className the CSS class name
|
|
1648
|
-
*/
|
|
1649
|
-
|
|
1650
|
-
|
|
1651
|
-
function removeClass$1(element, className) {
|
|
1652
|
-
if (element.classList) {
|
|
1653
|
-
element.classList.remove(className);
|
|
1654
|
-
} else if (typeof element.className === 'string') {
|
|
1655
|
-
element.className = replaceClassName(element.className, className);
|
|
1656
|
-
} else {
|
|
1657
|
-
element.setAttribute('class', replaceClassName(element.className && element.className.baseVal || '', className));
|
|
1658
|
-
}
|
|
1659
|
-
}
|
|
1660
|
-
|
|
1661
|
-
var config = {
|
|
1662
|
-
disabled: false
|
|
1663
|
-
};
|
|
1664
|
-
|
|
1665
|
-
var TransitionGroupContext = React.createContext(null);
|
|
1666
|
-
|
|
1667
|
-
var forceReflow = function forceReflow(node) {
|
|
1668
|
-
return node.scrollTop;
|
|
1669
|
-
};
|
|
1670
|
-
|
|
1671
|
-
var UNMOUNTED = 'unmounted';
|
|
1672
|
-
var EXITED = 'exited';
|
|
1673
|
-
var ENTERING = 'entering';
|
|
1674
|
-
var ENTERED = 'entered';
|
|
1675
|
-
var EXITING = 'exiting';
|
|
1676
|
-
/**
|
|
1677
|
-
* The Transition component lets you describe a transition from one component
|
|
1678
|
-
* state to another _over time_ with a simple declarative API. Most commonly
|
|
1679
|
-
* it's used to animate the mounting and unmounting of a component, but can also
|
|
1680
|
-
* be used to describe in-place transition states as well.
|
|
1681
|
-
*
|
|
1682
|
-
* ---
|
|
1683
|
-
*
|
|
1684
|
-
* **Note**: `Transition` is a platform-agnostic base component. If you're using
|
|
1685
|
-
* transitions in CSS, you'll probably want to use
|
|
1686
|
-
* [`CSSTransition`](https://reactcommunity.org/react-transition-group/css-transition)
|
|
1687
|
-
* instead. It inherits all the features of `Transition`, but contains
|
|
1688
|
-
* additional features necessary to play nice with CSS transitions (hence the
|
|
1689
|
-
* name of the component).
|
|
1690
|
-
*
|
|
1691
|
-
* ---
|
|
1692
|
-
*
|
|
1693
|
-
* By default the `Transition` component does not alter the behavior of the
|
|
1694
|
-
* component it renders, it only tracks "enter" and "exit" states for the
|
|
1695
|
-
* components. It's up to you to give meaning and effect to those states. For
|
|
1696
|
-
* example we can add styles to a component when it enters or exits:
|
|
1697
|
-
*
|
|
1698
|
-
* ```jsx
|
|
1699
|
-
* import { Transition } from 'react-transition-group';
|
|
1700
|
-
*
|
|
1701
|
-
* const duration = 300;
|
|
1702
|
-
*
|
|
1703
|
-
* const defaultStyle = {
|
|
1704
|
-
* transition: `opacity ${duration}ms ease-in-out`,
|
|
1705
|
-
* opacity: 0,
|
|
1706
|
-
* }
|
|
1707
|
-
*
|
|
1708
|
-
* const transitionStyles = {
|
|
1709
|
-
* entering: { opacity: 1 },
|
|
1710
|
-
* entered: { opacity: 1 },
|
|
1711
|
-
* exiting: { opacity: 0 },
|
|
1712
|
-
* exited: { opacity: 0 },
|
|
1713
|
-
* };
|
|
1714
|
-
*
|
|
1715
|
-
* const Fade = ({ in: inProp }) => (
|
|
1716
|
-
* <Transition in={inProp} timeout={duration}>
|
|
1717
|
-
* {state => (
|
|
1718
|
-
* <div style={{
|
|
1719
|
-
* ...defaultStyle,
|
|
1720
|
-
* ...transitionStyles[state]
|
|
1721
|
-
* }}>
|
|
1722
|
-
* I'm a fade Transition!
|
|
1723
|
-
* </div>
|
|
1724
|
-
* )}
|
|
1725
|
-
* </Transition>
|
|
1726
|
-
* );
|
|
1727
|
-
* ```
|
|
1728
|
-
*
|
|
1729
|
-
* There are 4 main states a Transition can be in:
|
|
1730
|
-
* - `'entering'`
|
|
1731
|
-
* - `'entered'`
|
|
1732
|
-
* - `'exiting'`
|
|
1733
|
-
* - `'exited'`
|
|
1734
|
-
*
|
|
1735
|
-
* Transition state is toggled via the `in` prop. When `true` the component
|
|
1736
|
-
* begins the "Enter" stage. During this stage, the component will shift from
|
|
1737
|
-
* its current transition state, to `'entering'` for the duration of the
|
|
1738
|
-
* transition and then to the `'entered'` stage once it's complete. Let's take
|
|
1739
|
-
* the following example (we'll use the
|
|
1740
|
-
* [useState](https://reactjs.org/docs/hooks-reference.html#usestate) hook):
|
|
1741
|
-
*
|
|
1742
|
-
* ```jsx
|
|
1743
|
-
* function App() {
|
|
1744
|
-
* const [inProp, setInProp] = useState(false);
|
|
1745
|
-
* return (
|
|
1746
|
-
* <div>
|
|
1747
|
-
* <Transition in={inProp} timeout={500}>
|
|
1748
|
-
* {state => (
|
|
1749
|
-
* // ...
|
|
1750
|
-
* )}
|
|
1751
|
-
* </Transition>
|
|
1752
|
-
* <button onClick={() => setInProp(true)}>
|
|
1753
|
-
* Click to Enter
|
|
1754
|
-
* </button>
|
|
1755
|
-
* </div>
|
|
1756
|
-
* );
|
|
1757
|
-
* }
|
|
1758
|
-
* ```
|
|
1759
|
-
*
|
|
1760
|
-
* When the button is clicked the component will shift to the `'entering'` state
|
|
1761
|
-
* and stay there for 500ms (the value of `timeout`) before it finally switches
|
|
1762
|
-
* to `'entered'`.
|
|
1763
|
-
*
|
|
1764
|
-
* When `in` is `false` the same thing happens except the state moves from
|
|
1765
|
-
* `'exiting'` to `'exited'`.
|
|
1766
|
-
*/
|
|
1767
|
-
|
|
1768
|
-
var Transition = /*#__PURE__*/function (_React$Component) {
|
|
1769
|
-
_inheritsLoose(Transition, _React$Component);
|
|
1770
|
-
|
|
1771
|
-
function Transition(props, context) {
|
|
1772
|
-
var _this;
|
|
1773
|
-
|
|
1774
|
-
_this = _React$Component.call(this, props, context) || this;
|
|
1775
|
-
var parentGroup = context; // In the context of a TransitionGroup all enters are really appears
|
|
1776
|
-
|
|
1777
|
-
var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;
|
|
1778
|
-
var initialStatus;
|
|
1779
|
-
_this.appearStatus = null;
|
|
1780
|
-
|
|
1781
|
-
if (props.in) {
|
|
1782
|
-
if (appear) {
|
|
1783
|
-
initialStatus = EXITED;
|
|
1784
|
-
_this.appearStatus = ENTERING;
|
|
1785
|
-
} else {
|
|
1786
|
-
initialStatus = ENTERED;
|
|
1787
|
-
}
|
|
1788
|
-
} else {
|
|
1789
|
-
if (props.unmountOnExit || props.mountOnEnter) {
|
|
1790
|
-
initialStatus = UNMOUNTED;
|
|
1791
|
-
} else {
|
|
1792
|
-
initialStatus = EXITED;
|
|
1793
|
-
}
|
|
1794
|
-
}
|
|
1795
|
-
|
|
1796
|
-
_this.state = {
|
|
1797
|
-
status: initialStatus
|
|
1798
|
-
};
|
|
1799
|
-
_this.nextCallback = null;
|
|
1800
|
-
return _this;
|
|
1801
|
-
}
|
|
1802
|
-
|
|
1803
|
-
Transition.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {
|
|
1804
|
-
var nextIn = _ref.in;
|
|
1805
|
-
|
|
1806
|
-
if (nextIn && prevState.status === UNMOUNTED) {
|
|
1807
|
-
return {
|
|
1808
|
-
status: EXITED
|
|
1809
|
-
};
|
|
1810
|
-
}
|
|
1811
|
-
|
|
1812
|
-
return null;
|
|
1813
|
-
} // getSnapshotBeforeUpdate(prevProps) {
|
|
1814
|
-
// let nextStatus = null
|
|
1815
|
-
// if (prevProps !== this.props) {
|
|
1816
|
-
// const { status } = this.state
|
|
1817
|
-
// if (this.props.in) {
|
|
1818
|
-
// if (status !== ENTERING && status !== ENTERED) {
|
|
1819
|
-
// nextStatus = ENTERING
|
|
1820
|
-
// }
|
|
1821
|
-
// } else {
|
|
1822
|
-
// if (status === ENTERING || status === ENTERED) {
|
|
1823
|
-
// nextStatus = EXITING
|
|
1824
|
-
// }
|
|
1825
|
-
// }
|
|
1826
|
-
// }
|
|
1827
|
-
// return { nextStatus }
|
|
1828
|
-
// }
|
|
1829
|
-
;
|
|
1830
|
-
|
|
1831
|
-
var _proto = Transition.prototype;
|
|
1832
|
-
|
|
1833
|
-
_proto.componentDidMount = function componentDidMount() {
|
|
1834
|
-
this.updateStatus(true, this.appearStatus);
|
|
1835
|
-
};
|
|
1836
|
-
|
|
1837
|
-
_proto.componentDidUpdate = function componentDidUpdate(prevProps) {
|
|
1838
|
-
var nextStatus = null;
|
|
1839
|
-
|
|
1840
|
-
if (prevProps !== this.props) {
|
|
1841
|
-
var status = this.state.status;
|
|
1842
|
-
|
|
1843
|
-
if (this.props.in) {
|
|
1844
|
-
if (status !== ENTERING && status !== ENTERED) {
|
|
1845
|
-
nextStatus = ENTERING;
|
|
1846
|
-
}
|
|
1847
|
-
} else {
|
|
1848
|
-
if (status === ENTERING || status === ENTERED) {
|
|
1849
|
-
nextStatus = EXITING;
|
|
1850
|
-
}
|
|
1851
|
-
}
|
|
1852
|
-
}
|
|
1853
|
-
|
|
1854
|
-
this.updateStatus(false, nextStatus);
|
|
1855
|
-
};
|
|
1856
|
-
|
|
1857
|
-
_proto.componentWillUnmount = function componentWillUnmount() {
|
|
1858
|
-
this.cancelNextCallback();
|
|
1859
|
-
};
|
|
1860
|
-
|
|
1861
|
-
_proto.getTimeouts = function getTimeouts() {
|
|
1862
|
-
var timeout = this.props.timeout;
|
|
1863
|
-
var exit, enter, appear;
|
|
1864
|
-
exit = enter = appear = timeout;
|
|
1865
|
-
|
|
1866
|
-
if (timeout != null && typeof timeout !== 'number') {
|
|
1867
|
-
exit = timeout.exit;
|
|
1868
|
-
enter = timeout.enter; // TODO: remove fallback for next major
|
|
1869
|
-
|
|
1870
|
-
appear = timeout.appear !== undefined ? timeout.appear : enter;
|
|
1871
|
-
}
|
|
1872
|
-
|
|
1873
|
-
return {
|
|
1874
|
-
exit: exit,
|
|
1875
|
-
enter: enter,
|
|
1876
|
-
appear: appear
|
|
1877
|
-
};
|
|
1878
|
-
};
|
|
1879
|
-
|
|
1880
|
-
_proto.updateStatus = function updateStatus(mounting, nextStatus) {
|
|
1881
|
-
if (mounting === void 0) {
|
|
1882
|
-
mounting = false;
|
|
1883
|
-
}
|
|
1884
|
-
|
|
1885
|
-
if (nextStatus !== null) {
|
|
1886
|
-
// nextStatus will always be ENTERING or EXITING.
|
|
1887
|
-
this.cancelNextCallback();
|
|
1888
|
-
|
|
1889
|
-
if (nextStatus === ENTERING) {
|
|
1890
|
-
if (this.props.unmountOnExit || this.props.mountOnEnter) {
|
|
1891
|
-
var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this); // https://github.com/reactjs/react-transition-group/pull/749
|
|
1892
|
-
// With unmountOnExit or mountOnEnter, the enter animation should happen at the transition between `exited` and `entering`.
|
|
1893
|
-
// To make the animation happen, we have to separate each rendering and avoid being processed as batched.
|
|
1894
|
-
|
|
1895
|
-
if (node) forceReflow(node);
|
|
1896
|
-
}
|
|
1897
|
-
|
|
1898
|
-
this.performEnter(mounting);
|
|
1899
|
-
} else {
|
|
1900
|
-
this.performExit();
|
|
1901
|
-
}
|
|
1902
|
-
} else if (this.props.unmountOnExit && this.state.status === EXITED) {
|
|
1903
|
-
this.setState({
|
|
1904
|
-
status: UNMOUNTED
|
|
1905
|
-
});
|
|
1906
|
-
}
|
|
1907
|
-
};
|
|
1908
|
-
|
|
1909
|
-
_proto.performEnter = function performEnter(mounting) {
|
|
1910
|
-
var _this2 = this;
|
|
1911
|
-
|
|
1912
|
-
var enter = this.props.enter;
|
|
1913
|
-
var appearing = this.context ? this.context.isMounting : mounting;
|
|
1914
|
-
|
|
1915
|
-
var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM.findDOMNode(this), appearing],
|
|
1916
|
-
maybeNode = _ref2[0],
|
|
1917
|
-
maybeAppearing = _ref2[1];
|
|
1918
|
-
|
|
1919
|
-
var timeouts = this.getTimeouts();
|
|
1920
|
-
var enterTimeout = appearing ? timeouts.appear : timeouts.enter; // no enter animation skip right to ENTERED
|
|
1921
|
-
// if we are mounting and running this it means appear _must_ be set
|
|
1922
|
-
|
|
1923
|
-
if (!mounting && !enter || config.disabled) {
|
|
1924
|
-
this.safeSetState({
|
|
1925
|
-
status: ENTERED
|
|
1926
|
-
}, function () {
|
|
1927
|
-
_this2.props.onEntered(maybeNode);
|
|
1928
|
-
});
|
|
1929
|
-
return;
|
|
1930
|
-
}
|
|
1931
|
-
|
|
1932
|
-
this.props.onEnter(maybeNode, maybeAppearing);
|
|
1933
|
-
this.safeSetState({
|
|
1934
|
-
status: ENTERING
|
|
1935
|
-
}, function () {
|
|
1936
|
-
_this2.props.onEntering(maybeNode, maybeAppearing);
|
|
1937
|
-
|
|
1938
|
-
_this2.onTransitionEnd(enterTimeout, function () {
|
|
1939
|
-
_this2.safeSetState({
|
|
1940
|
-
status: ENTERED
|
|
1941
|
-
}, function () {
|
|
1942
|
-
_this2.props.onEntered(maybeNode, maybeAppearing);
|
|
1943
|
-
});
|
|
1944
|
-
});
|
|
1945
|
-
});
|
|
1946
|
-
};
|
|
1947
|
-
|
|
1948
|
-
_proto.performExit = function performExit() {
|
|
1949
|
-
var _this3 = this;
|
|
1950
|
-
|
|
1951
|
-
var exit = this.props.exit;
|
|
1952
|
-
var timeouts = this.getTimeouts();
|
|
1953
|
-
var maybeNode = this.props.nodeRef ? undefined : ReactDOM.findDOMNode(this); // no exit animation skip right to EXITED
|
|
1954
|
-
|
|
1955
|
-
if (!exit || config.disabled) {
|
|
1956
|
-
this.safeSetState({
|
|
1957
|
-
status: EXITED
|
|
1958
|
-
}, function () {
|
|
1959
|
-
_this3.props.onExited(maybeNode);
|
|
1960
|
-
});
|
|
1961
|
-
return;
|
|
1962
|
-
}
|
|
1963
|
-
|
|
1964
|
-
this.props.onExit(maybeNode);
|
|
1965
|
-
this.safeSetState({
|
|
1966
|
-
status: EXITING
|
|
1967
|
-
}, function () {
|
|
1968
|
-
_this3.props.onExiting(maybeNode);
|
|
1969
|
-
|
|
1970
|
-
_this3.onTransitionEnd(timeouts.exit, function () {
|
|
1971
|
-
_this3.safeSetState({
|
|
1972
|
-
status: EXITED
|
|
1973
|
-
}, function () {
|
|
1974
|
-
_this3.props.onExited(maybeNode);
|
|
1975
|
-
});
|
|
1976
|
-
});
|
|
1977
|
-
});
|
|
1978
|
-
};
|
|
1979
|
-
|
|
1980
|
-
_proto.cancelNextCallback = function cancelNextCallback() {
|
|
1981
|
-
if (this.nextCallback !== null) {
|
|
1982
|
-
this.nextCallback.cancel();
|
|
1983
|
-
this.nextCallback = null;
|
|
1984
|
-
}
|
|
1985
|
-
};
|
|
1986
|
-
|
|
1987
|
-
_proto.safeSetState = function safeSetState(nextState, callback) {
|
|
1988
|
-
// This shouldn't be necessary, but there are weird race conditions with
|
|
1989
|
-
// setState callbacks and unmounting in testing, so always make sure that
|
|
1990
|
-
// we can cancel any pending setState callbacks after we unmount.
|
|
1991
|
-
callback = this.setNextCallback(callback);
|
|
1992
|
-
this.setState(nextState, callback);
|
|
1993
|
-
};
|
|
1994
|
-
|
|
1995
|
-
_proto.setNextCallback = function setNextCallback(callback) {
|
|
1996
|
-
var _this4 = this;
|
|
1997
|
-
|
|
1998
|
-
var active = true;
|
|
1999
|
-
|
|
2000
|
-
this.nextCallback = function (event) {
|
|
2001
|
-
if (active) {
|
|
2002
|
-
active = false;
|
|
2003
|
-
_this4.nextCallback = null;
|
|
2004
|
-
callback(event);
|
|
2005
|
-
}
|
|
2006
|
-
};
|
|
2007
|
-
|
|
2008
|
-
this.nextCallback.cancel = function () {
|
|
2009
|
-
active = false;
|
|
2010
|
-
};
|
|
2011
|
-
|
|
2012
|
-
return this.nextCallback;
|
|
2013
|
-
};
|
|
2014
|
-
|
|
2015
|
-
_proto.onTransitionEnd = function onTransitionEnd(timeout, handler) {
|
|
2016
|
-
this.setNextCallback(handler);
|
|
2017
|
-
var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this);
|
|
2018
|
-
var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener;
|
|
2019
|
-
|
|
2020
|
-
if (!node || doesNotHaveTimeoutOrListener) {
|
|
2021
|
-
setTimeout(this.nextCallback, 0);
|
|
2022
|
-
return;
|
|
2023
|
-
}
|
|
2024
|
-
|
|
2025
|
-
if (this.props.addEndListener) {
|
|
2026
|
-
var _ref3 = this.props.nodeRef ? [this.nextCallback] : [node, this.nextCallback],
|
|
2027
|
-
maybeNode = _ref3[0],
|
|
2028
|
-
maybeNextCallback = _ref3[1];
|
|
2029
|
-
|
|
2030
|
-
this.props.addEndListener(maybeNode, maybeNextCallback);
|
|
2031
|
-
}
|
|
2032
|
-
|
|
2033
|
-
if (timeout != null) {
|
|
2034
|
-
setTimeout(this.nextCallback, timeout);
|
|
2035
|
-
}
|
|
2036
|
-
};
|
|
2037
|
-
|
|
2038
|
-
_proto.render = function render() {
|
|
2039
|
-
var status = this.state.status;
|
|
2040
|
-
|
|
2041
|
-
if (status === UNMOUNTED) {
|
|
2042
|
-
return null;
|
|
2043
|
-
}
|
|
2044
|
-
|
|
2045
|
-
var _this$props = this.props,
|
|
2046
|
-
children = _this$props.children;
|
|
2047
|
-
_this$props.in;
|
|
2048
|
-
_this$props.mountOnEnter;
|
|
2049
|
-
_this$props.unmountOnExit;
|
|
2050
|
-
_this$props.appear;
|
|
2051
|
-
_this$props.enter;
|
|
2052
|
-
_this$props.exit;
|
|
2053
|
-
_this$props.timeout;
|
|
2054
|
-
_this$props.addEndListener;
|
|
2055
|
-
_this$props.onEnter;
|
|
2056
|
-
_this$props.onEntering;
|
|
2057
|
-
_this$props.onEntered;
|
|
2058
|
-
_this$props.onExit;
|
|
2059
|
-
_this$props.onExiting;
|
|
2060
|
-
_this$props.onExited;
|
|
2061
|
-
_this$props.nodeRef;
|
|
2062
|
-
var childProps = _objectWithoutPropertiesLoose(_this$props, ["children", "in", "mountOnEnter", "unmountOnExit", "appear", "enter", "exit", "timeout", "addEndListener", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "nodeRef"]);
|
|
2063
|
-
|
|
2064
|
-
return (
|
|
2065
|
-
/*#__PURE__*/
|
|
2066
|
-
// allows for nested Transitions
|
|
2067
|
-
React.createElement(TransitionGroupContext.Provider, {
|
|
2068
|
-
value: null
|
|
2069
|
-
}, typeof children === 'function' ? children(status, childProps) : React.cloneElement(React.Children.only(children), childProps))
|
|
2070
|
-
);
|
|
2071
|
-
};
|
|
2072
|
-
|
|
2073
|
-
return Transition;
|
|
2074
|
-
}(React.Component);
|
|
2075
|
-
|
|
2076
|
-
Transition.contextType = TransitionGroupContext;
|
|
2077
|
-
Transition.propTypes = {}; // Name the function so it is clearer in the documentation
|
|
2078
|
-
|
|
2079
|
-
function noop() {}
|
|
2080
|
-
|
|
2081
|
-
Transition.defaultProps = {
|
|
2082
|
-
in: false,
|
|
2083
|
-
mountOnEnter: false,
|
|
2084
|
-
unmountOnExit: false,
|
|
2085
|
-
appear: false,
|
|
2086
|
-
enter: true,
|
|
2087
|
-
exit: true,
|
|
2088
|
-
onEnter: noop,
|
|
2089
|
-
onEntering: noop,
|
|
2090
|
-
onEntered: noop,
|
|
2091
|
-
onExit: noop,
|
|
2092
|
-
onExiting: noop,
|
|
2093
|
-
onExited: noop
|
|
2094
|
-
};
|
|
2095
|
-
Transition.UNMOUNTED = UNMOUNTED;
|
|
2096
|
-
Transition.EXITED = EXITED;
|
|
2097
|
-
Transition.ENTERING = ENTERING;
|
|
2098
|
-
Transition.ENTERED = ENTERED;
|
|
2099
|
-
Transition.EXITING = EXITING;
|
|
2100
|
-
var Transition$1 = Transition;
|
|
2101
|
-
|
|
2102
|
-
var _addClass = function addClass$1(node, classes) {
|
|
2103
|
-
return node && classes && classes.split(' ').forEach(function (c) {
|
|
2104
|
-
return addClass(node, c);
|
|
2105
|
-
});
|
|
2106
|
-
};
|
|
2107
|
-
|
|
2108
|
-
var removeClass = function removeClass(node, classes) {
|
|
2109
|
-
return node && classes && classes.split(' ').forEach(function (c) {
|
|
2110
|
-
return removeClass$1(node, c);
|
|
2111
|
-
});
|
|
2112
|
-
};
|
|
2113
|
-
/**
|
|
2114
|
-
* A transition component inspired by the excellent
|
|
2115
|
-
* [ng-animate](https://docs.angularjs.org/api/ngAnimate) library, you should
|
|
2116
|
-
* use it if you're using CSS transitions or animations. It's built upon the
|
|
2117
|
-
* [`Transition`](https://reactcommunity.org/react-transition-group/transition)
|
|
2118
|
-
* component, so it inherits all of its props.
|
|
2119
|
-
*
|
|
2120
|
-
* `CSSTransition` applies a pair of class names during the `appear`, `enter`,
|
|
2121
|
-
* and `exit` states of the transition. The first class is applied and then a
|
|
2122
|
-
* second `*-active` class in order to activate the CSS transition. After the
|
|
2123
|
-
* transition, matching `*-done` class names are applied to persist the
|
|
2124
|
-
* transition state.
|
|
2125
|
-
*
|
|
2126
|
-
* ```jsx
|
|
2127
|
-
* function App() {
|
|
2128
|
-
* const [inProp, setInProp] = useState(false);
|
|
2129
|
-
* return (
|
|
2130
|
-
* <div>
|
|
2131
|
-
* <CSSTransition in={inProp} timeout={200} classNames="my-node">
|
|
2132
|
-
* <div>
|
|
2133
|
-
* {"I'll receive my-node-* classes"}
|
|
2134
|
-
* </div>
|
|
2135
|
-
* </CSSTransition>
|
|
2136
|
-
* <button type="button" onClick={() => setInProp(true)}>
|
|
2137
|
-
* Click to Enter
|
|
2138
|
-
* </button>
|
|
2139
|
-
* </div>
|
|
2140
|
-
* );
|
|
2141
|
-
* }
|
|
2142
|
-
* ```
|
|
2143
|
-
*
|
|
2144
|
-
* When the `in` prop is set to `true`, the child component will first receive
|
|
2145
|
-
* the class `example-enter`, then the `example-enter-active` will be added in
|
|
2146
|
-
* the next tick. `CSSTransition` [forces a
|
|
2147
|
-
* reflow](https://github.com/reactjs/react-transition-group/blob/5007303e729a74be66a21c3e2205e4916821524b/src/CSSTransition.js#L208-L215)
|
|
2148
|
-
* between before adding the `example-enter-active`. This is an important trick
|
|
2149
|
-
* because it allows us to transition between `example-enter` and
|
|
2150
|
-
* `example-enter-active` even though they were added immediately one after
|
|
2151
|
-
* another. Most notably, this is what makes it possible for us to animate
|
|
2152
|
-
* _appearance_.
|
|
2153
|
-
*
|
|
2154
|
-
* ```css
|
|
2155
|
-
* .my-node-enter {
|
|
2156
|
-
* opacity: 0;
|
|
2157
|
-
* }
|
|
2158
|
-
* .my-node-enter-active {
|
|
2159
|
-
* opacity: 1;
|
|
2160
|
-
* transition: opacity 200ms;
|
|
2161
|
-
* }
|
|
2162
|
-
* .my-node-exit {
|
|
2163
|
-
* opacity: 1;
|
|
2164
|
-
* }
|
|
2165
|
-
* .my-node-exit-active {
|
|
2166
|
-
* opacity: 0;
|
|
2167
|
-
* transition: opacity 200ms;
|
|
2168
|
-
* }
|
|
2169
|
-
* ```
|
|
2170
|
-
*
|
|
2171
|
-
* `*-active` classes represent which styles you want to animate **to**, so it's
|
|
2172
|
-
* important to add `transition` declaration only to them, otherwise transitions
|
|
2173
|
-
* might not behave as intended! This might not be obvious when the transitions
|
|
2174
|
-
* are symmetrical, i.e. when `*-enter-active` is the same as `*-exit`, like in
|
|
2175
|
-
* the example above (minus `transition`), but it becomes apparent in more
|
|
2176
|
-
* complex transitions.
|
|
2177
|
-
*
|
|
2178
|
-
* **Note**: If you're using the
|
|
2179
|
-
* [`appear`](http://reactcommunity.org/react-transition-group/transition#Transition-prop-appear)
|
|
2180
|
-
* prop, make sure to define styles for `.appear-*` classes as well.
|
|
2181
|
-
*/
|
|
2182
|
-
|
|
2183
|
-
|
|
2184
|
-
var CSSTransition = /*#__PURE__*/function (_React$Component) {
|
|
2185
|
-
_inheritsLoose(CSSTransition, _React$Component);
|
|
2186
|
-
|
|
2187
|
-
function CSSTransition() {
|
|
2188
|
-
var _this;
|
|
2189
|
-
|
|
2190
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
2191
|
-
args[_key] = arguments[_key];
|
|
2192
|
-
}
|
|
2193
|
-
|
|
2194
|
-
_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
|
|
2195
|
-
_this.appliedClasses = {
|
|
2196
|
-
appear: {},
|
|
2197
|
-
enter: {},
|
|
2198
|
-
exit: {}
|
|
2199
|
-
};
|
|
2200
|
-
|
|
2201
|
-
_this.onEnter = function (maybeNode, maybeAppearing) {
|
|
2202
|
-
var _this$resolveArgument = _this.resolveArguments(maybeNode, maybeAppearing),
|
|
2203
|
-
node = _this$resolveArgument[0],
|
|
2204
|
-
appearing = _this$resolveArgument[1];
|
|
2205
|
-
|
|
2206
|
-
_this.removeClasses(node, 'exit');
|
|
2207
|
-
|
|
2208
|
-
_this.addClass(node, appearing ? 'appear' : 'enter', 'base');
|
|
2209
|
-
|
|
2210
|
-
if (_this.props.onEnter) {
|
|
2211
|
-
_this.props.onEnter(maybeNode, maybeAppearing);
|
|
2212
|
-
}
|
|
2213
|
-
};
|
|
2214
|
-
|
|
2215
|
-
_this.onEntering = function (maybeNode, maybeAppearing) {
|
|
2216
|
-
var _this$resolveArgument2 = _this.resolveArguments(maybeNode, maybeAppearing),
|
|
2217
|
-
node = _this$resolveArgument2[0],
|
|
2218
|
-
appearing = _this$resolveArgument2[1];
|
|
2219
|
-
|
|
2220
|
-
var type = appearing ? 'appear' : 'enter';
|
|
2221
|
-
|
|
2222
|
-
_this.addClass(node, type, 'active');
|
|
2223
|
-
|
|
2224
|
-
if (_this.props.onEntering) {
|
|
2225
|
-
_this.props.onEntering(maybeNode, maybeAppearing);
|
|
2226
|
-
}
|
|
2227
|
-
};
|
|
2228
|
-
|
|
2229
|
-
_this.onEntered = function (maybeNode, maybeAppearing) {
|
|
2230
|
-
var _this$resolveArgument3 = _this.resolveArguments(maybeNode, maybeAppearing),
|
|
2231
|
-
node = _this$resolveArgument3[0],
|
|
2232
|
-
appearing = _this$resolveArgument3[1];
|
|
2233
|
-
|
|
2234
|
-
var type = appearing ? 'appear' : 'enter';
|
|
2235
|
-
|
|
2236
|
-
_this.removeClasses(node, type);
|
|
2237
|
-
|
|
2238
|
-
_this.addClass(node, type, 'done');
|
|
2239
|
-
|
|
2240
|
-
if (_this.props.onEntered) {
|
|
2241
|
-
_this.props.onEntered(maybeNode, maybeAppearing);
|
|
2242
|
-
}
|
|
2243
|
-
};
|
|
2244
|
-
|
|
2245
|
-
_this.onExit = function (maybeNode) {
|
|
2246
|
-
var _this$resolveArgument4 = _this.resolveArguments(maybeNode),
|
|
2247
|
-
node = _this$resolveArgument4[0];
|
|
2248
|
-
|
|
2249
|
-
_this.removeClasses(node, 'appear');
|
|
2250
|
-
|
|
2251
|
-
_this.removeClasses(node, 'enter');
|
|
2252
|
-
|
|
2253
|
-
_this.addClass(node, 'exit', 'base');
|
|
2254
|
-
|
|
2255
|
-
if (_this.props.onExit) {
|
|
2256
|
-
_this.props.onExit(maybeNode);
|
|
2257
|
-
}
|
|
2258
|
-
};
|
|
2259
|
-
|
|
2260
|
-
_this.onExiting = function (maybeNode) {
|
|
2261
|
-
var _this$resolveArgument5 = _this.resolveArguments(maybeNode),
|
|
2262
|
-
node = _this$resolveArgument5[0];
|
|
2263
|
-
|
|
2264
|
-
_this.addClass(node, 'exit', 'active');
|
|
2265
|
-
|
|
2266
|
-
if (_this.props.onExiting) {
|
|
2267
|
-
_this.props.onExiting(maybeNode);
|
|
2268
|
-
}
|
|
2269
|
-
};
|
|
2270
|
-
|
|
2271
|
-
_this.onExited = function (maybeNode) {
|
|
2272
|
-
var _this$resolveArgument6 = _this.resolveArguments(maybeNode),
|
|
2273
|
-
node = _this$resolveArgument6[0];
|
|
2274
|
-
|
|
2275
|
-
_this.removeClasses(node, 'exit');
|
|
2276
|
-
|
|
2277
|
-
_this.addClass(node, 'exit', 'done');
|
|
2278
|
-
|
|
2279
|
-
if (_this.props.onExited) {
|
|
2280
|
-
_this.props.onExited(maybeNode);
|
|
2281
|
-
}
|
|
2282
|
-
};
|
|
2283
|
-
|
|
2284
|
-
_this.resolveArguments = function (maybeNode, maybeAppearing) {
|
|
2285
|
-
return _this.props.nodeRef ? [_this.props.nodeRef.current, maybeNode] // here `maybeNode` is actually `appearing`
|
|
2286
|
-
: [maybeNode, maybeAppearing];
|
|
2287
|
-
};
|
|
2288
|
-
|
|
2289
|
-
_this.getClassNames = function (type) {
|
|
2290
|
-
var classNames = _this.props.classNames;
|
|
2291
|
-
var isStringClassNames = typeof classNames === 'string';
|
|
2292
|
-
var prefix = isStringClassNames && classNames ? classNames + "-" : '';
|
|
2293
|
-
var baseClassName = isStringClassNames ? "" + prefix + type : classNames[type];
|
|
2294
|
-
var activeClassName = isStringClassNames ? baseClassName + "-active" : classNames[type + "Active"];
|
|
2295
|
-
var doneClassName = isStringClassNames ? baseClassName + "-done" : classNames[type + "Done"];
|
|
2296
|
-
return {
|
|
2297
|
-
baseClassName: baseClassName,
|
|
2298
|
-
activeClassName: activeClassName,
|
|
2299
|
-
doneClassName: doneClassName
|
|
2300
|
-
};
|
|
2301
|
-
};
|
|
2302
|
-
|
|
2303
|
-
return _this;
|
|
2304
|
-
}
|
|
2305
|
-
|
|
2306
|
-
var _proto = CSSTransition.prototype;
|
|
2307
|
-
|
|
2308
|
-
_proto.addClass = function addClass(node, type, phase) {
|
|
2309
|
-
var className = this.getClassNames(type)[phase + "ClassName"];
|
|
2310
|
-
|
|
2311
|
-
var _this$getClassNames = this.getClassNames('enter'),
|
|
2312
|
-
doneClassName = _this$getClassNames.doneClassName;
|
|
2313
|
-
|
|
2314
|
-
if (type === 'appear' && phase === 'done' && doneClassName) {
|
|
2315
|
-
className += " " + doneClassName;
|
|
2316
|
-
} // This is to force a repaint,
|
|
2317
|
-
// which is necessary in order to transition styles when adding a class name.
|
|
2318
|
-
|
|
2319
|
-
|
|
2320
|
-
if (phase === 'active') {
|
|
2321
|
-
if (node) forceReflow(node);
|
|
2322
|
-
}
|
|
2323
|
-
|
|
2324
|
-
if (className) {
|
|
2325
|
-
this.appliedClasses[type][phase] = className;
|
|
2326
|
-
|
|
2327
|
-
_addClass(node, className);
|
|
2328
|
-
}
|
|
2329
|
-
};
|
|
2330
|
-
|
|
2331
|
-
_proto.removeClasses = function removeClasses(node, type) {
|
|
2332
|
-
var _this$appliedClasses$ = this.appliedClasses[type],
|
|
2333
|
-
baseClassName = _this$appliedClasses$.base,
|
|
2334
|
-
activeClassName = _this$appliedClasses$.active,
|
|
2335
|
-
doneClassName = _this$appliedClasses$.done;
|
|
2336
|
-
this.appliedClasses[type] = {};
|
|
2337
|
-
|
|
2338
|
-
if (baseClassName) {
|
|
2339
|
-
removeClass(node, baseClassName);
|
|
2340
|
-
}
|
|
2341
|
-
|
|
2342
|
-
if (activeClassName) {
|
|
2343
|
-
removeClass(node, activeClassName);
|
|
2344
|
-
}
|
|
2345
|
-
|
|
2346
|
-
if (doneClassName) {
|
|
2347
|
-
removeClass(node, doneClassName);
|
|
2348
|
-
}
|
|
2349
|
-
};
|
|
2350
|
-
|
|
2351
|
-
_proto.render = function render() {
|
|
2352
|
-
var _this$props = this.props;
|
|
2353
|
-
_this$props.classNames;
|
|
2354
|
-
var props = _objectWithoutPropertiesLoose(_this$props, ["classNames"]);
|
|
2355
|
-
|
|
2356
|
-
return /*#__PURE__*/React.createElement(Transition$1, _extends({}, props, {
|
|
2357
|
-
onEnter: this.onEnter,
|
|
2358
|
-
onEntered: this.onEntered,
|
|
2359
|
-
onEntering: this.onEntering,
|
|
2360
|
-
onExit: this.onExit,
|
|
2361
|
-
onExiting: this.onExiting,
|
|
2362
|
-
onExited: this.onExited
|
|
2363
|
-
}));
|
|
2364
|
-
};
|
|
2365
|
-
|
|
2366
|
-
return CSSTransition;
|
|
2367
|
-
}(React.Component);
|
|
2368
|
-
|
|
2369
|
-
CSSTransition.defaultProps = {
|
|
2370
|
-
classNames: ''
|
|
2371
|
-
};
|
|
2372
|
-
CSSTransition.propTypes = {};
|
|
2373
|
-
var CSSTransition$1 = CSSTransition;
|
|
2374
|
-
|
|
2375
|
-
var Body = function Body(_ref) {
|
|
2376
|
-
var children = _ref.children,
|
|
2377
|
-
_ref$className = _ref.className,
|
|
2378
|
-
className = _ref$className === void 0 ? "" : _ref$className,
|
|
2379
|
-
_ref$hasFooter = _ref.hasFooter,
|
|
2380
|
-
hasFooter = _ref$hasFooter === void 0 ? true : _ref$hasFooter;
|
|
2381
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
2382
|
-
className: classnames("neeto-filters-slider__body neeto-ui-flex neeto-ui-flex-col neeto-ui-items-start neeto-ui-justify-start", _defineProperty({
|
|
2383
|
-
"neeto-filters-slider__body--has-footer": hasFooter
|
|
2384
|
-
}, className, className))
|
|
2385
|
-
}, children);
|
|
2386
|
-
};
|
|
2387
|
-
|
|
2388
|
-
var SIZES = {
|
|
2389
|
-
xsmall: "xsmall",
|
|
2390
|
-
small: "small",
|
|
2391
|
-
large: "large"
|
|
2392
|
-
};
|
|
2393
|
-
|
|
2394
|
-
var Footer = function Footer(_ref) {
|
|
2395
|
-
var children = _ref.children,
|
|
2396
|
-
_ref$className = _ref.className,
|
|
2397
|
-
className = _ref$className === void 0 ? "" : _ref$className;
|
|
2398
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
2399
|
-
className: classnames("neeto-filters-slider__footer neeto-ui-shadow-m neeto-ui-flex neeto-ui-items-center", className)
|
|
2400
|
-
}, children);
|
|
2401
|
-
};
|
|
2402
|
-
|
|
2403
|
-
var Header = function Header(_ref) {
|
|
2404
|
-
var _ref$children = _ref.children,
|
|
2405
|
-
children = _ref$children === void 0 ? "" : _ref$children,
|
|
2406
|
-
className = _ref.className;
|
|
2407
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
2408
|
-
className: classnames("neeto-filters-slider__header", className)
|
|
2409
|
-
}, children);
|
|
2410
|
-
};
|
|
2411
|
-
|
|
2412
|
-
var _excluded$1 = ["size", "isOpen", "onClose", "className", "children"];
|
|
2413
|
-
var Slider = function Slider(_ref) {
|
|
2414
|
-
var _ref$size = _ref.size,
|
|
2415
|
-
size = _ref$size === void 0 ? SIZES.xsmall : _ref$size,
|
|
2416
|
-
isOpen = _ref.isOpen,
|
|
2417
|
-
onClose = _ref.onClose,
|
|
2418
|
-
_ref$className = _ref.className,
|
|
2419
|
-
className = _ref$className === void 0 ? "" : _ref$className,
|
|
2420
|
-
children = _ref.children,
|
|
2421
|
-
otherProps = _objectWithoutProperties(_ref, _excluded$1);
|
|
2422
|
-
useHotkeys(SHORTCUTS.closePane.sequence, onClose, {
|
|
2423
|
-
mode: "global"
|
|
2424
|
-
});
|
|
2425
|
-
return /*#__PURE__*/React.createElement(Portal, {
|
|
2426
|
-
rootId: "neeto-filters-portal"
|
|
2427
|
-
}, /*#__PURE__*/React.createElement(CSSTransition$1, {
|
|
2428
|
-
unmountOnExit: true,
|
|
2429
|
-
appear: isOpen,
|
|
2430
|
-
classNames: "neeto-filters-slider",
|
|
2431
|
-
"in": isOpen,
|
|
2432
|
-
timeout: 300
|
|
2433
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
2434
|
-
className: "neeto-filters-slider__pane"
|
|
2435
|
-
}, /*#__PURE__*/React.createElement("div", _extends$1({
|
|
2436
|
-
className: classnames("neeto-filters-slider__wrapper", _defineProperty({
|
|
2437
|
-
"neeto-filters-slider__wrapper--xsmall": size === SIZES.xsmall,
|
|
2438
|
-
"neeto-filters-slider__wrapper--small": size === SIZES.small,
|
|
2439
|
-
"neeto-filters-slider__wrapper--large": size === SIZES.large
|
|
2440
|
-
}, className, className))
|
|
2441
|
-
}, otherProps), /*#__PURE__*/React.createElement(Button, {
|
|
2442
|
-
"aria-label": "Close",
|
|
2443
|
-
className: "neeto-filters-slider__close",
|
|
2444
|
-
"data-cy": "neeto-filters-close-button",
|
|
2445
|
-
"data-testid": "close-button",
|
|
2446
|
-
icon: Close,
|
|
2447
|
-
size: "small",
|
|
2448
|
-
style: "text",
|
|
2449
|
-
onClick: onClose
|
|
2450
|
-
}), children))));
|
|
2451
|
-
};
|
|
2452
|
-
Slider.Header = Header;
|
|
2453
|
-
Slider.Body = Body;
|
|
2454
|
-
Slider.Footer = Footer;
|
|
2455
|
-
|
|
2456
|
-
var useFilters = function useFilters(_ref) {
|
|
2457
|
-
var onFiltersChange = _ref.onFiltersChange,
|
|
2458
|
-
columns = _ref.columns,
|
|
2459
|
-
keywordFilter = _ref.keywordFilter,
|
|
2460
|
-
onSelectorsChange = _ref.onSelectorsChange;
|
|
2461
|
-
var _useTransition = useTransition(),
|
|
2462
|
-
_useTransition2 = _slicedToArray(_useTransition, 2);
|
|
2463
|
-
_useTransition2[0];
|
|
2464
|
-
var startTransition = _useTransition2[1];
|
|
2465
|
-
var initialRender = useRef(true);
|
|
2466
|
-
var prevFilters = useRef([]);
|
|
2467
|
-
var location = useLocation();
|
|
2468
|
-
var filters = buildFiltersFromSearchParams(columns, false);
|
|
2469
|
-
var history = useHistory();
|
|
2470
|
-
var defaultValuesOfColumns = JSON.stringify(pluck("defaultValue", columns));
|
|
2471
|
-
var handlePrecenseOfDefaultFilters = function handlePrecenseOfDefaultFilters(defaultFilters) {
|
|
2472
|
-
var params = buildUrlFromFilters({
|
|
2473
|
-
columns: columns,
|
|
2474
|
-
filters: isKeywordFilterPresent(keywordFilter) && isNotEmpty(getSearchTermFromUrl()) ? [].concat(_toConsumableArray(defaultFilters), [keywordFilter]) : defaultFilters
|
|
2475
|
-
});
|
|
2476
|
-
history.replace({
|
|
2477
|
-
search: params
|
|
2478
|
-
});
|
|
2479
|
-
};
|
|
2480
|
-
var handleFiltersChange = function handleFiltersChange(filtersPayload) {
|
|
2481
|
-
startTransition(function () {
|
|
2482
|
-
onFiltersChange(buildFiltersPayload(filtersPayload.filter(function (filter) {
|
|
2483
|
-
return !isNil(filter.node);
|
|
2484
|
-
})));
|
|
2485
|
-
});
|
|
2486
|
-
};
|
|
2487
|
-
|
|
2488
|
-
//This function sends the updated filters to host via callbacks.
|
|
2489
|
-
var sendUpdatedFilters = function sendUpdatedFilters() {
|
|
2490
|
-
if (compareFilters(append(keywordFilter, filters), prevFilters.current)) {
|
|
2491
|
-
return;
|
|
2492
|
-
}
|
|
2493
|
-
var newFilters = buildFiltersFromSearchParams(columns);
|
|
2494
|
-
var filtersPayload = isKeywordFilterPresent(keywordFilter) && isNotEmpty(getSearchTermFromUrl()) ? append(keywordFilter, newFilters) : newFilters;
|
|
2495
|
-
handleFiltersChange(filtersPayload);
|
|
2496
|
-
onSelectorsChange(buildSelectorsFromURL(columns));
|
|
2497
|
-
};
|
|
2498
|
-
var handleChangesInURL = function handleChangesInURL() {
|
|
2499
|
-
var defaultFilters = buildDefaultFilters(columns, filters);
|
|
2500
|
-
var searchParams = getSnakeCasedQueryParams();
|
|
2501
|
-
var keys = pluck("key", append(keywordFilter, columns));
|
|
2502
|
-
if (keys.every(function (key) {
|
|
2503
|
-
return isNil(searchParams[key]);
|
|
2504
|
-
}) && !isEmpty(defaultFilters)) {
|
|
2505
|
-
history.replace({
|
|
2506
|
-
search: buildUrlFromFilters({
|
|
2507
|
-
columns: columns,
|
|
2508
|
-
filters: concat(defaultFilters, filters)
|
|
2509
|
-
})
|
|
2510
|
-
});
|
|
2511
|
-
filters = buildFiltersFromSearchParams(columns, false);
|
|
2512
|
-
}
|
|
2513
|
-
};
|
|
2514
|
-
useEffect(function () {
|
|
2515
|
-
if (initialRender.current) {
|
|
2516
|
-
initialRender.current = false;
|
|
2517
|
-
var keywordValue = getSearchTermFromUrl();
|
|
2518
|
-
var defaultFilters = buildDefaultFilters(columns, filters);
|
|
2519
|
-
isNotEmpty(defaultFilters) && handlePrecenseOfDefaultFilters(defaultFilters);
|
|
2520
|
-
prevFilters.current = append(mergeRight(keywordFilter, {
|
|
2521
|
-
value: keywordValue
|
|
2522
|
-
}), filters);
|
|
2523
|
-
} else {
|
|
2524
|
-
handleChangesInURL();
|
|
2525
|
-
sendUpdatedFilters();
|
|
2526
|
-
prevFilters.current = append(keywordFilter, filters);
|
|
2527
|
-
}
|
|
2528
|
-
}, [location.search, defaultValuesOfColumns]);
|
|
2529
|
-
return filters;
|
|
2530
|
-
};
|
|
2531
|
-
|
|
2532
|
-
var buildDropdownValue = function buildDropdownValue(_ref) {
|
|
2533
|
-
var defaultType = _ref.defaultType,
|
|
2534
|
-
filter = _ref.filter,
|
|
2535
|
-
options = _ref.options;
|
|
2536
|
-
if (!filter) return null;
|
|
2537
|
-
if (isMulti(defaultType)) {
|
|
2538
|
-
return options.filter(function (_ref2) {
|
|
2539
|
-
var value = _ref2.value;
|
|
2540
|
-
return filter.value.includes(value);
|
|
2541
|
-
});
|
|
2542
|
-
}
|
|
2543
|
-
return findBy({
|
|
2544
|
-
value: filter.value
|
|
2545
|
-
}, options);
|
|
2546
|
-
};
|
|
2547
|
-
var buildSingleTimeValue = function buildSingleTimeValue(filter) {
|
|
2548
|
-
var _findBy2;
|
|
2549
|
-
if (!filter) return null;
|
|
2550
|
-
return (_findBy2 = findBy({
|
|
2551
|
-
value: filter.value
|
|
2552
|
-
}, TIME_OPTIONS)) !== null && _findBy2 !== void 0 ? _findBy2 : last(TIME_OPTIONS);
|
|
2553
|
-
};
|
|
2554
|
-
var getOtherProps = function getOtherProps(props) {
|
|
2555
|
-
return omit(["key", "node", "label", "type", "values", "model", "showRuleSelector"], props);
|
|
2556
|
-
};
|
|
2557
|
-
var buildDropdownOptions = function buildDropdownOptions(_ref3) {
|
|
2558
|
-
var defaultType = _ref3.defaultType,
|
|
2559
|
-
filter = _ref3.filter,
|
|
2560
|
-
options = _ref3.options;
|
|
2561
|
-
options = options.map(modify("value", function (value) {
|
|
2562
|
-
return value === null || value === void 0 ? void 0 : value.toString();
|
|
2563
|
-
}));
|
|
2564
|
-
if (!filter) return options;
|
|
2565
|
-
if (isMulti(defaultType)) {
|
|
2566
|
-
var selectedOptions = filter.value.map(function (value) {
|
|
2567
|
-
return findBy({
|
|
2568
|
-
value: value
|
|
2569
|
-
}, options) || toLabelAndValue(value);
|
|
2570
|
-
});
|
|
2571
|
-
var nonSelectedOptions = options.filter(function (option) {
|
|
2572
|
-
return !filter.value.includes(option.value);
|
|
2573
|
-
});
|
|
2574
|
-
return concat(selectedOptions, nonSelectedOptions);
|
|
2575
|
-
}
|
|
2576
|
-
if (!findBy({
|
|
2577
|
-
value: filter.value
|
|
2578
|
-
}, options)) {
|
|
2579
|
-
return append(toLabelAndValue(filter.value), options);
|
|
2580
|
-
}
|
|
2581
|
-
return options;
|
|
2582
|
-
};
|
|
2583
|
-
var initializeDateRule = function initializeDateRule(filter) {
|
|
2584
|
-
return filter ? findBy({
|
|
2585
|
-
value: filter === null || filter === void 0 ? void 0 : filter.value
|
|
2586
|
-
}, DATE_OPTIONS) || findDateOption(filter, DATE_OPTIONS) : {};
|
|
2587
|
-
};
|
|
2588
|
-
var getDateValue = function getDateValue(value, rule) {
|
|
2589
|
-
if (isEmpty(value) || isNil(value)) {
|
|
2590
|
-
return null;
|
|
2591
|
-
}
|
|
2592
|
-
if (rule.value === "custom-date-range") {
|
|
2593
|
-
return value;
|
|
2594
|
-
}
|
|
2595
|
-
return rule.value === "before" ? dayjs(value[1]).add(1, "day") : dayjs(value[0]).subtract(1, "day");
|
|
2596
|
-
};
|
|
2597
|
-
var findDateOption = function findDateOption(filter, options) {
|
|
2598
|
-
var value = filter.value;
|
|
2599
|
-
var isBeforeOrAfter = dayjs(value[1]).diff(dayjs(value[0]), "year") >= 90;
|
|
2600
|
-
if (not(isBeforeOrAfter)) {
|
|
2601
|
-
return last(options);
|
|
2602
|
-
}
|
|
2603
|
-
var currentMoment = dayjs();
|
|
2604
|
-
var diffWithStart = Math.abs(currentMoment.diff(dayjs(value[0]), "year"));
|
|
2605
|
-
var diffWithEnd = Math.abs(currentMoment.diff(dayjs(value[1]), "year"));
|
|
2606
|
-
return diffWithStart < diffWithEnd ? findBy({
|
|
2607
|
-
value: "after"
|
|
2608
|
-
}, options) : findBy({
|
|
2609
|
-
value: "before"
|
|
2610
|
-
}, options);
|
|
2611
|
-
};
|
|
2612
|
-
var buildDateValues = function buildDateValues(dates, selectedRule) {
|
|
2613
|
-
if (selectedRule.value === "after") {
|
|
2614
|
-
return [dates.add(1, "day"), dates.add(100, "year")];
|
|
2615
|
-
} else if (selectedRule.value === "before") {
|
|
2616
|
-
return [dates.subtract(100, "year"), dates.subtract(1, "day")];
|
|
2617
|
-
}
|
|
2618
|
-
return dates;
|
|
2619
|
-
};
|
|
2620
|
-
var buildHelpIconProps = function buildHelpIconProps(helpIconProps) {
|
|
2621
|
-
return mergeDeepRight(DEFAULT_HELP_ICON_PROPS, helpIconProps);
|
|
2622
|
-
};
|
|
2623
|
-
|
|
2624
|
-
var Boolean = function Boolean(_ref) {
|
|
2625
|
-
var column = _ref.column,
|
|
2626
|
-
filter = _ref.filter,
|
|
2627
|
-
handleApplyFilter = _ref.handleApplyFilter,
|
|
2628
|
-
autoFocus = _ref.autoFocus;
|
|
2629
|
-
var key = column.key,
|
|
2630
|
-
_column$defaultType = column.defaultType,
|
|
2631
|
-
defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
|
|
2632
|
-
label = column.label,
|
|
2633
|
-
values = column.values,
|
|
2634
|
-
_column$helpIconProps = column.helpIconProps,
|
|
2635
|
-
helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
|
|
2636
|
-
var options = isNil(values) || isEmpty(values) ? DEFAULT_BOOLEAN_OPTIONS : values;
|
|
2637
|
-
var otherProps = getOtherProps(column);
|
|
2638
|
-
var value = buildDropdownValue({
|
|
2639
|
-
defaultType: defaultType,
|
|
2640
|
-
filter: filter,
|
|
2641
|
-
options: options
|
|
2642
|
-
});
|
|
2643
|
-
var _useTranslation = useTranslation(),
|
|
2644
|
-
t = _useTranslation.t;
|
|
2645
|
-
var handleChange = function handleChange(option) {
|
|
2646
|
-
if (isEmpty(option) || isNil(option)) {
|
|
2647
|
-
handleApplyFilter({
|
|
2648
|
-
_delete: true
|
|
2649
|
-
});
|
|
2650
|
-
return;
|
|
2651
|
-
}
|
|
2652
|
-
var updatedFilter = buildUpdatedFilter({
|
|
2653
|
-
column: column,
|
|
2654
|
-
defaultType: defaultType,
|
|
2655
|
-
option: option
|
|
2656
|
-
});
|
|
2657
|
-
handleApplyFilter(updatedFilter);
|
|
2658
|
-
};
|
|
2659
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
2660
|
-
className: "neeto-filters-pane-filter__item-wrapper"
|
|
2661
|
-
}, /*#__PURE__*/React.createElement(Select, _extends$1({
|
|
2662
|
-
autoFocus: autoFocus,
|
|
2663
|
-
label: label,
|
|
2664
|
-
options: options,
|
|
2665
|
-
value: value,
|
|
2666
|
-
isClearable: true
|
|
2667
|
-
}, isNotEmpty(helpIconProps) && {
|
|
2668
|
-
labelProps: {
|
|
2669
|
-
helpIconProps: buildHelpIconProps(helpIconProps)
|
|
2670
|
-
}
|
|
2671
|
-
}, {
|
|
2672
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-filter"),
|
|
2673
|
-
strategy: "fixed",
|
|
2674
|
-
placeholder: t("neetoFilters.messages.selectOption", {
|
|
2675
|
-
resource: label
|
|
2676
|
-
}),
|
|
2677
|
-
onChange: handleChange
|
|
2678
|
-
}, otherProps)));
|
|
2679
|
-
};
|
|
2680
|
-
var Boolean$1 = /*#__PURE__*/React.memo(Boolean);
|
|
2681
|
-
|
|
2682
|
-
var Datetime = function Datetime(_ref) {
|
|
2683
|
-
var column = _ref.column,
|
|
2684
|
-
filter = _ref.filter,
|
|
2685
|
-
handleApplyFilter = _ref.handleApplyFilter,
|
|
2686
|
-
autoFocus = _ref.autoFocus;
|
|
2687
|
-
var _useState = useState(initializeDateRule(filter)),
|
|
2688
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
2689
|
-
selectedRule = _useState2[0],
|
|
2690
|
-
setSelectedRule = _useState2[1];
|
|
2691
|
-
var _useTranslation = useTranslation(),
|
|
2692
|
-
t = _useTranslation.t;
|
|
2693
|
-
var key = column.key,
|
|
2694
|
-
_column$defaultType = column.defaultType,
|
|
2695
|
-
defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
|
|
2696
|
-
label = column.label,
|
|
2697
|
-
_column$helpIconProps = column.helpIconProps,
|
|
2698
|
-
helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
|
|
2699
|
-
var isDatePickerShown = filter && isCustomDateRange(filter.value);
|
|
2700
|
-
var otherProps = getOtherProps(column);
|
|
2701
|
-
var handleChange = function handleChange(option) {
|
|
2702
|
-
if (isEmpty(option) || isNil(option)) {
|
|
2703
|
-
handleApplyFilter({
|
|
2704
|
-
_delete: true
|
|
2705
|
-
});
|
|
2706
|
-
setSelectedRule({});
|
|
2707
|
-
return;
|
|
2708
|
-
}
|
|
2709
|
-
setSelectedRule(option);
|
|
2710
|
-
var updatedFilter = buildUpdatedFilter({
|
|
2711
|
-
column: column,
|
|
2712
|
-
defaultType: defaultType,
|
|
2713
|
-
option: option
|
|
2714
|
-
});
|
|
2715
|
-
handleApplyFilter(updatedFilter);
|
|
2716
|
-
};
|
|
2717
|
-
var handleDateRangeChange = function handleDateRangeChange(dates) {
|
|
2718
|
-
if (isEmpty(dates) || isNil(dates)) {
|
|
2719
|
-
handleApplyFilter({
|
|
2720
|
-
_delete: true
|
|
2721
|
-
});
|
|
2722
|
-
setSelectedRule({});
|
|
2723
|
-
return;
|
|
2724
|
-
}
|
|
2725
|
-
var updatedFilter = buildUpdatedFilter({
|
|
2726
|
-
column: column,
|
|
2727
|
-
defaultType: defaultType,
|
|
2728
|
-
option: {
|
|
2729
|
-
value: pluck("$d", buildDateValues(dates, selectedRule)).map(function (date) {
|
|
2730
|
-
return date.toISOString();
|
|
2731
|
-
})
|
|
2732
|
-
}
|
|
2733
|
-
});
|
|
2734
|
-
handleApplyFilter(updatedFilter);
|
|
2735
|
-
};
|
|
2736
|
-
useEffect(function () {
|
|
2737
|
-
isNil(filter) && setSelectedRule({});
|
|
2738
|
-
}, [filter]);
|
|
2739
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
2740
|
-
className: "neeto-filters-pane-filter__item-wrapper"
|
|
2741
|
-
}, /*#__PURE__*/React.createElement(Select, _extends$1({
|
|
2742
|
-
autoFocus: autoFocus,
|
|
2743
|
-
label: label,
|
|
2744
|
-
isClearable: true,
|
|
2745
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-filter"),
|
|
2746
|
-
options: DATE_OPTIONS,
|
|
2747
|
-
strategy: "fixed",
|
|
2748
|
-
value: selectedRule,
|
|
2749
|
-
placeholder: t("neetoFilters.messages.selectResource", {
|
|
2750
|
-
resource: label
|
|
2751
|
-
})
|
|
2752
|
-
}, isNotEmpty(helpIconProps) && {
|
|
2753
|
-
labelProps: {
|
|
2754
|
-
helpIconProps: buildHelpIconProps(helpIconProps)
|
|
2755
|
-
}
|
|
2756
|
-
}, {
|
|
2757
|
-
onChange: handleChange
|
|
2758
|
-
})), isDatePickerShown && /*#__PURE__*/React.createElement(DatePicker, _extends$1({
|
|
2759
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-date-range"),
|
|
2760
|
-
getPopupContainer: prop("parentNode"),
|
|
2761
|
-
type: (selectedRule === null || selectedRule === void 0 ? void 0 : selectedRule.value) === "custom-date-range" ? "range" : "date",
|
|
2762
|
-
value: getDateValue(filter === null || filter === void 0 ? void 0 : filter.value, selectedRule),
|
|
2763
|
-
onChange: handleDateRangeChange
|
|
2764
|
-
}, otherProps)));
|
|
2765
|
-
};
|
|
2766
|
-
var Datetime$1 = /*#__PURE__*/React.memo(Datetime);
|
|
2767
|
-
|
|
2768
|
-
var Dropdown = function Dropdown(_ref) {
|
|
2769
|
-
var column = _ref.column,
|
|
2770
|
-
filter = _ref.filter,
|
|
2771
|
-
handleApplyFilter = _ref.handleApplyFilter,
|
|
2772
|
-
autoFocus = _ref.autoFocus;
|
|
2773
|
-
var key = column.key,
|
|
2774
|
-
label = column.label,
|
|
2775
|
-
values = column.values,
|
|
2776
|
-
defaultValue = column.defaultValue,
|
|
2777
|
-
_column$defaultType = column.defaultType,
|
|
2778
|
-
defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
|
|
2779
|
-
_column$isClearable = column.isClearable,
|
|
2780
|
-
isClearable = _column$isClearable === void 0 ? true : _column$isClearable,
|
|
2781
|
-
_column$helpIconProps = column.helpIconProps,
|
|
2782
|
-
helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
|
|
2783
|
-
var otherProps = getOtherProps(column);
|
|
2784
|
-
var options = buildDropdownOptions({
|
|
2785
|
-
defaultType: defaultType,
|
|
2786
|
-
filter: filter,
|
|
2787
|
-
options: values
|
|
2788
|
-
});
|
|
2789
|
-
var value = buildDropdownValue({
|
|
2790
|
-
defaultType: defaultType,
|
|
2791
|
-
filter: filter,
|
|
2792
|
-
options: options
|
|
2793
|
-
});
|
|
2794
|
-
var _useTranslation = useTranslation(),
|
|
2795
|
-
t = _useTranslation.t;
|
|
2796
|
-
var handleChange = function handleChange(option) {
|
|
2797
|
-
if (isEmpty(option) || isNil(option)) {
|
|
2798
|
-
handleApplyFilter({
|
|
2799
|
-
_delete: true
|
|
2800
|
-
});
|
|
2801
|
-
return;
|
|
2802
|
-
}
|
|
2803
|
-
var updatedFilter = buildUpdatedFilter({
|
|
2804
|
-
column: column,
|
|
2805
|
-
defaultType: defaultType,
|
|
2806
|
-
option: option
|
|
2807
|
-
});
|
|
2808
|
-
handleApplyFilter(updatedFilter);
|
|
2809
|
-
};
|
|
2810
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
2811
|
-
className: "neeto-filters-pane-filter__item-wrapper"
|
|
2812
|
-
}, /*#__PURE__*/React.createElement(Select, _extends$1({
|
|
2813
|
-
autoFocus: autoFocus,
|
|
2814
|
-
label: label,
|
|
2815
|
-
options: options,
|
|
2816
|
-
value: value,
|
|
2817
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-filter"),
|
|
2818
|
-
isClearable: !defaultValue && isClearable,
|
|
2819
|
-
isMulti: isMulti(defaultType),
|
|
2820
|
-
strategy: "fixed",
|
|
2821
|
-
placeholder: t("neetoFilters.messages.selectResource", {
|
|
2822
|
-
resource: label
|
|
2823
|
-
})
|
|
2824
|
-
}, isNotEmpty(helpIconProps) && {
|
|
2825
|
-
labelProps: {
|
|
2826
|
-
helpIconProps: buildHelpIconProps(helpIconProps)
|
|
2827
|
-
}
|
|
2828
|
-
}, {
|
|
2829
|
-
onChange: handleChange
|
|
2830
|
-
}, otherProps)));
|
|
2831
|
-
};
|
|
2832
|
-
var Dropdown$1 = /*#__PURE__*/React.memo(Dropdown);
|
|
2833
|
-
|
|
2834
|
-
var SingleDatetime = function SingleDatetime(_ref) {
|
|
2835
|
-
var column = _ref.column,
|
|
2836
|
-
filter = _ref.filter,
|
|
2837
|
-
filters = _ref.filters,
|
|
2838
|
-
handleApplyFilter = _ref.handleApplyFilter,
|
|
2839
|
-
autoFocus = _ref.autoFocus;
|
|
2840
|
-
var _useState = useState(function () {
|
|
2841
|
-
return findBy({
|
|
2842
|
-
value: filter === null || filter === void 0 ? void 0 : filter.rule
|
|
2843
|
-
}, SINGLE_DATE_OPTIONS) || SINGLE_DATE_OPTIONS[0];
|
|
2844
|
-
}),
|
|
2845
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
2846
|
-
selectedRule = _useState2[0],
|
|
2847
|
-
setSelectedRule = _useState2[1];
|
|
2848
|
-
var key = column.key,
|
|
2849
|
-
_column$defaultType = column.defaultType,
|
|
2850
|
-
defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
|
|
2851
|
-
label = column.label,
|
|
2852
|
-
_column$helpIconProps = column.helpIconProps,
|
|
2853
|
-
helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
|
|
2854
|
-
var otherProps = getOtherProps(column);
|
|
2855
|
-
var datePickerType = selectedRule.value === "between" ? "range" : "date";
|
|
2856
|
-
var value = filter === null || filter === void 0 ? void 0 : filter.value;
|
|
2857
|
-
|
|
2858
|
-
// Reset states when "Clear filters" button is clicked.
|
|
2859
|
-
useEffect(function () {
|
|
2860
|
-
if (!isEmpty(filters)) return;
|
|
2861
|
-
setSelectedRule(SINGLE_DATE_OPTIONS[0]);
|
|
2862
|
-
}, [filters]);
|
|
2863
|
-
var handleRuleChange = function handleRuleChange(ruleOption) {
|
|
2864
|
-
setSelectedRule(ruleOption);
|
|
2865
|
-
|
|
2866
|
-
// Clear value if switched between incompatable types
|
|
2867
|
-
var updateValue = value;
|
|
2868
|
-
if (datePickerType === "range" && ruleOption.value !== "between" || datePickerType === "date" && ruleOption.value === "between") {
|
|
2869
|
-
updateValue = "";
|
|
2870
|
-
}
|
|
2871
|
-
var updatedFilter = buildUpdatedFilter({
|
|
2872
|
-
column: column,
|
|
2873
|
-
defaultType: defaultType,
|
|
2874
|
-
option: {},
|
|
2875
|
-
rule: ruleOption.value,
|
|
2876
|
-
value: updateValue
|
|
2877
|
-
});
|
|
2878
|
-
handleApplyFilter(updatedFilter);
|
|
2879
|
-
};
|
|
2880
|
-
var handleChange = function handleChange(dates) {
|
|
2881
|
-
if (isEmpty(dates) || isNil(dates)) {
|
|
2882
|
-
handleApplyFilter({
|
|
2883
|
-
_delete: true
|
|
2884
|
-
});
|
|
2885
|
-
return;
|
|
2886
|
-
}
|
|
2887
|
-
var value = datePickerType === "range" ? pluck("$d", dates).map(function (date) {
|
|
2888
|
-
return date.toISOString();
|
|
2889
|
-
}) : dates["$d"];
|
|
2890
|
-
var updatedFilter = buildUpdatedFilter({
|
|
2891
|
-
column: column,
|
|
2892
|
-
defaultType: defaultType,
|
|
2893
|
-
option: {},
|
|
2894
|
-
rule: selectedRule.value,
|
|
2895
|
-
value: value
|
|
2896
|
-
});
|
|
2897
|
-
handleApplyFilter(updatedFilter);
|
|
2898
|
-
};
|
|
2899
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
2900
|
-
className: "neeto-filters-pane-filter__item-wrapper"
|
|
2901
|
-
}, /*#__PURE__*/React.createElement(Select, _extends$1({
|
|
2902
|
-
label: label,
|
|
2903
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-filter-rule"),
|
|
2904
|
-
defaultValue: SINGLE_DATE_OPTIONS[0],
|
|
2905
|
-
options: SINGLE_DATE_OPTIONS,
|
|
2906
|
-
strategy: "fixed",
|
|
2907
|
-
value: selectedRule
|
|
2908
|
-
}, isNotEmpty(helpIconProps) && {
|
|
2909
|
-
labelProps: {
|
|
2910
|
-
helpIconProps: buildHelpIconProps(helpIconProps)
|
|
2911
|
-
}
|
|
2912
|
-
}, {
|
|
2913
|
-
onChange: handleRuleChange
|
|
2914
|
-
})), /*#__PURE__*/React.createElement(DatePicker, _extends$1({
|
|
2915
|
-
autoFocus: autoFocus,
|
|
2916
|
-
value: value,
|
|
2917
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-filter"),
|
|
2918
|
-
getPopupContainer: prop("parentNode"),
|
|
2919
|
-
type: datePickerType,
|
|
2920
|
-
onChange: handleChange
|
|
2921
|
-
}, otherProps)));
|
|
2922
|
-
};
|
|
2923
|
-
|
|
2924
|
-
var SingleTime = function SingleTime(_ref) {
|
|
2925
|
-
var column = _ref.column,
|
|
2926
|
-
filter = _ref.filter,
|
|
2927
|
-
filters = _ref.filters,
|
|
2928
|
-
handleApplyFilter = _ref.handleApplyFilter,
|
|
2929
|
-
autoFocus = _ref.autoFocus;
|
|
2930
|
-
var _useState = useState(function () {
|
|
2931
|
-
return findBy({
|
|
2932
|
-
value: filter === null || filter === void 0 ? void 0 : filter.rule
|
|
2933
|
-
}, SINGLE_TIME_OPTIONS) || SINGLE_TIME_OPTIONS[0];
|
|
2934
|
-
}),
|
|
2935
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
2936
|
-
selectedRule = _useState2[0],
|
|
2937
|
-
setSelectedRule = _useState2[1];
|
|
2938
|
-
var key = column.key,
|
|
2939
|
-
_column$defaultType = column.defaultType,
|
|
2940
|
-
defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
|
|
2941
|
-
label = column.label,
|
|
2942
|
-
_column$helpIconProps = column.helpIconProps,
|
|
2943
|
-
helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
|
|
2944
|
-
var otherProps = getOtherProps(column);
|
|
2945
|
-
var timePickerType = selectedRule.value === "between" ? "range" : "time";
|
|
2946
|
-
var value = filter === null || filter === void 0 ? void 0 : filter.value;
|
|
2947
|
-
useEffect(function () {
|
|
2948
|
-
if (!isEmpty(filters)) return;
|
|
2949
|
-
setSelectedRule(SINGLE_TIME_OPTIONS[0]);
|
|
2950
|
-
}, [filters]);
|
|
2951
|
-
var handleRuleChange = function handleRuleChange(ruleOption) {
|
|
2952
|
-
setSelectedRule(ruleOption);
|
|
2953
|
-
|
|
2954
|
-
// Clear value if switched between incompatible types
|
|
2955
|
-
var updateValue = value;
|
|
2956
|
-
if (timePickerType === "range" && ruleOption.value !== "between" || timePickerType === "time" && ruleOption.value === "between") {
|
|
2957
|
-
updateValue = "";
|
|
2958
|
-
}
|
|
2959
|
-
var updatedFilter = buildUpdatedFilter({
|
|
2960
|
-
column: column,
|
|
2961
|
-
defaultType: defaultType,
|
|
2962
|
-
option: {},
|
|
2963
|
-
rule: ruleOption.value,
|
|
2964
|
-
value: updateValue
|
|
2965
|
-
});
|
|
2966
|
-
handleApplyFilter(updatedFilter);
|
|
2967
|
-
};
|
|
2968
|
-
var handleChange = function handleChange(times) {
|
|
2969
|
-
var value = timePickerType === "range" ? pluck("$d", times).map(function (time) {
|
|
2970
|
-
return time.toISOString();
|
|
2971
|
-
}) : times["$d"].toISOString();
|
|
2972
|
-
var updatedFilter = buildUpdatedFilter({
|
|
2973
|
-
column: column,
|
|
2974
|
-
defaultType: defaultType,
|
|
2975
|
-
option: {},
|
|
2976
|
-
rule: selectedRule.value,
|
|
2977
|
-
value: value
|
|
2978
|
-
});
|
|
2979
|
-
handleApplyFilter(updatedFilter);
|
|
2980
|
-
};
|
|
2981
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
2982
|
-
className: "neeto-filters-pane-filter__item-wrapper"
|
|
2983
|
-
}, /*#__PURE__*/React.createElement(Select, _extends$1({
|
|
2984
|
-
label: label,
|
|
2985
|
-
defaultValue: SINGLE_TIME_OPTIONS[0],
|
|
2986
|
-
options: SINGLE_TIME_OPTIONS,
|
|
2987
|
-
strategy: "fixed",
|
|
2988
|
-
value: selectedRule
|
|
2989
|
-
}, isNotEmpty(helpIconProps) && {
|
|
2990
|
-
labelProps: {
|
|
2991
|
-
helpIconProps: buildHelpIconProps(helpIconProps)
|
|
2992
|
-
}
|
|
2993
|
-
}, {
|
|
2994
|
-
onChange: handleRuleChange
|
|
2995
|
-
})), /*#__PURE__*/React.createElement(TimePicker, _extends$1({
|
|
2996
|
-
autoFocus: autoFocus,
|
|
2997
|
-
value: value,
|
|
2998
|
-
use12Hours: true,
|
|
2999
|
-
className: "w-full",
|
|
3000
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-filter"),
|
|
3001
|
-
format: "h:mm A",
|
|
3002
|
-
getPopupContainer: prop("parentNode"),
|
|
3003
|
-
type: timePickerType,
|
|
3004
|
-
onChange: handleChange
|
|
3005
|
-
}, otherProps)));
|
|
3006
|
-
};
|
|
3007
|
-
|
|
3008
|
-
var Text = function Text(_ref) {
|
|
3009
|
-
var column = _ref.column,
|
|
3010
|
-
filter = _ref.filter,
|
|
3011
|
-
filters = _ref.filters,
|
|
3012
|
-
handleApplyFilter = _ref.handleApplyFilter,
|
|
3013
|
-
autoFocus = _ref.autoFocus,
|
|
3014
|
-
onClose = _ref.onClose;
|
|
3015
|
-
var key = column.key,
|
|
3016
|
-
_column$defaultType = column.defaultType,
|
|
3017
|
-
defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
|
|
3018
|
-
label = column.label,
|
|
3019
|
-
_column$showRuleSelec = column.showRuleSelector,
|
|
3020
|
-
showRuleSelector = _column$showRuleSelec === void 0 ? false : _column$showRuleSelec,
|
|
3021
|
-
_column$helpIconProps = column.helpIconProps,
|
|
3022
|
-
helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
|
|
3023
|
-
var otherProps = getOtherProps(column);
|
|
3024
|
-
var ruleOptions = buildRuleOptions({
|
|
3025
|
-
defaultType: defaultType
|
|
3026
|
-
});
|
|
3027
|
-
var inputType = defaultType === "text" || defaultType === "custom.text" ? "text" : "number";
|
|
3028
|
-
var _useState = useState(filter === null || filter === void 0 ? void 0 : filter.value),
|
|
3029
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
3030
|
-
inputValue = _useState2[0],
|
|
3031
|
-
setInputValue = _useState2[1];
|
|
3032
|
-
var _useState3 = useState(function () {
|
|
3033
|
-
return findBy({
|
|
3034
|
-
value: filter === null || filter === void 0 ? void 0 : filter.rule
|
|
3035
|
-
}, ruleOptions) || ruleOptions[0];
|
|
3036
|
-
}),
|
|
3037
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
3038
|
-
selectedRule = _useState4[0],
|
|
3039
|
-
setSelectedRule = _useState4[1];
|
|
3040
|
-
var debouncedInputValue = useDebounce(inputValue);
|
|
3041
|
-
var _useTranslation = useTranslation(),
|
|
3042
|
-
t = _useTranslation.t;
|
|
3043
|
-
var handleUpdateAndApplyFilter = function handleUpdateAndApplyFilter() {
|
|
3044
|
-
var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : debouncedInputValue;
|
|
3045
|
-
var rule = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : selectedRule;
|
|
3046
|
-
if (equals(filter === null || filter === void 0 ? void 0 : filter.value, value) && equals(selectedRule, rule)) return;
|
|
3047
|
-
var updatedFilter = buildUpdatedFilter({
|
|
3048
|
-
column: column,
|
|
3049
|
-
defaultType: defaultType,
|
|
3050
|
-
option: {},
|
|
3051
|
-
rule: rule.value,
|
|
3052
|
-
value: value.trim()
|
|
3053
|
-
});
|
|
3054
|
-
handleApplyFilter(updatedFilter);
|
|
3055
|
-
};
|
|
3056
|
-
var handleKeydown = function handleKeydown(e) {
|
|
3057
|
-
if (!(e.key === "Enter")) return;
|
|
3058
|
-
handleUpdateAndApplyFilter(inputValue);
|
|
3059
|
-
onClose();
|
|
3060
|
-
};
|
|
3061
|
-
var handleRuleChange = function handleRuleChange(ruleOption) {
|
|
3062
|
-
setSelectedRule(ruleOption);
|
|
3063
|
-
if (!debouncedInputValue) return;
|
|
3064
|
-
handleUpdateAndApplyFilter(debouncedInputValue, ruleOption);
|
|
3065
|
-
};
|
|
3066
|
-
|
|
3067
|
-
// Reset states when "Clear filters" button is clicked.
|
|
3068
|
-
useEffect(function () {
|
|
3069
|
-
(isEmpty(filters) || isNil(filter)) && setInputValue("");
|
|
3070
|
-
}, [filter]);
|
|
3071
|
-
useEffect(function () {
|
|
3072
|
-
if (!debouncedInputValue) {
|
|
3073
|
-
!isUndefinedOrEmpty(filter) && handleApplyFilter({
|
|
3074
|
-
_delete: true
|
|
3075
|
-
});
|
|
3076
|
-
return;
|
|
3077
|
-
}
|
|
3078
|
-
handleUpdateAndApplyFilter();
|
|
3079
|
-
}, [debouncedInputValue]);
|
|
3080
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
3081
|
-
className: "neeto-filters-pane-filter__item-wrapper"
|
|
3082
|
-
}, showRuleSelector && /*#__PURE__*/React.createElement(Select, _extends$1({
|
|
3083
|
-
label: label,
|
|
3084
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-filter-rule"),
|
|
3085
|
-
defaultValue: ruleOptions[0],
|
|
3086
|
-
options: ruleOptions,
|
|
3087
|
-
strategy: "fixed",
|
|
3088
|
-
value: selectedRule,
|
|
3089
|
-
onChange: handleRuleChange
|
|
3090
|
-
}, isNotEmpty(helpIconProps) && {
|
|
3091
|
-
labelProps: {
|
|
3092
|
-
helpIconProps: buildHelpIconProps(helpIconProps)
|
|
3093
|
-
}
|
|
3094
|
-
})), /*#__PURE__*/React.createElement(Input$1, _extends$1({
|
|
3095
|
-
autoFocus: autoFocus,
|
|
3096
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-filter"),
|
|
3097
|
-
label: !showRuleSelector && label,
|
|
3098
|
-
type: inputType,
|
|
3099
|
-
value: inputValue
|
|
3100
|
-
}, isNotEmpty(helpIconProps) && {
|
|
3101
|
-
labelProps: {
|
|
3102
|
-
helpIconProps: buildHelpIconProps(helpIconProps)
|
|
3103
|
-
}
|
|
3104
|
-
}, {
|
|
3105
|
-
placeholder: t("neetoFilters.messages.enterResource", {
|
|
3106
|
-
resource: label
|
|
3107
|
-
}),
|
|
3108
|
-
onChange: function onChange(event) {
|
|
3109
|
-
return setInputValue(event.target.value);
|
|
3110
|
-
},
|
|
3111
|
-
onKeyDown: handleKeydown
|
|
3112
|
-
}, otherProps)));
|
|
3113
|
-
};
|
|
3114
|
-
|
|
3115
|
-
var Time = function Time(_ref) {
|
|
3116
|
-
var column = _ref.column,
|
|
3117
|
-
filter = _ref.filter,
|
|
3118
|
-
handleApplyFilter = _ref.handleApplyFilter,
|
|
3119
|
-
autoFocus = _ref.autoFocus;
|
|
3120
|
-
var key = column.key,
|
|
3121
|
-
_column$defaultType = column.defaultType,
|
|
3122
|
-
defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
|
|
3123
|
-
label = column.label,
|
|
3124
|
-
_column$helpIconProps = column.helpIconProps,
|
|
3125
|
-
helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
|
|
3126
|
-
var otherProps = getOtherProps(column);
|
|
3127
|
-
var value = buildSingleTimeValue(filter);
|
|
3128
|
-
var isCustomTimeRangeShown = filter && isCustomTimeRange(filter.value);
|
|
3129
|
-
var _useTranslation = useTranslation(),
|
|
3130
|
-
t = _useTranslation.t;
|
|
3131
|
-
var handleChange = function handleChange(option) {
|
|
3132
|
-
if (isEmpty(option) || isNil(option)) {
|
|
3133
|
-
handleApplyFilter({
|
|
3134
|
-
_delete: true
|
|
3135
|
-
});
|
|
3136
|
-
return;
|
|
3137
|
-
}
|
|
3138
|
-
var updatedFilter = buildUpdatedFilter({
|
|
3139
|
-
column: column,
|
|
3140
|
-
defaultType: defaultType,
|
|
3141
|
-
option: option
|
|
3142
|
-
});
|
|
3143
|
-
handleApplyFilter(updatedFilter);
|
|
3144
|
-
};
|
|
3145
|
-
var handleTimeRangeChange = function handleTimeRangeChange(times) {
|
|
3146
|
-
var updatedFilter = buildUpdatedFilter({
|
|
3147
|
-
column: column,
|
|
3148
|
-
defaultType: defaultType,
|
|
3149
|
-
option: {
|
|
3150
|
-
value: pluck("$d", times).map(function (time) {
|
|
3151
|
-
return time.toISOString();
|
|
3152
|
-
})
|
|
3153
|
-
}
|
|
3154
|
-
});
|
|
3155
|
-
handleApplyFilter(updatedFilter);
|
|
3156
|
-
};
|
|
3157
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
3158
|
-
className: "neeto-filters-pane-filter__item-wrapper"
|
|
3159
|
-
}, /*#__PURE__*/React.createElement(Select, _extends$1({
|
|
3160
|
-
autoFocus: autoFocus,
|
|
3161
|
-
label: label,
|
|
3162
|
-
value: value,
|
|
3163
|
-
isClearable: true,
|
|
3164
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-filter"),
|
|
3165
|
-
options: TIME_OPTIONS,
|
|
3166
|
-
strategy: "fixed",
|
|
3167
|
-
placeholder: t("neetoFilters.messages.selectResource", {
|
|
3168
|
-
resource: label
|
|
3169
|
-
})
|
|
3170
|
-
}, isNotEmpty(helpIconProps) && {
|
|
3171
|
-
labelProps: {
|
|
3172
|
-
helpIconProps: buildHelpIconProps(helpIconProps)
|
|
3173
|
-
}
|
|
3174
|
-
}, {
|
|
3175
|
-
onChange: handleChange
|
|
3176
|
-
})), isCustomTimeRangeShown && /*#__PURE__*/React.createElement(TimePicker, _extends$1({
|
|
3177
|
-
use12Hours: true,
|
|
3178
|
-
"data-cy": "neeto-filters-".concat(hyphenate(key), "-date-range"),
|
|
3179
|
-
format: "h:mm A",
|
|
3180
|
-
getPopupContainer: prop("parentNode"),
|
|
3181
|
-
type: "range",
|
|
3182
|
-
value: filter.value,
|
|
3183
|
-
onChange: handleTimeRangeChange
|
|
3184
|
-
}, otherProps)));
|
|
3185
|
-
};
|
|
3186
|
-
var Time$1 = /*#__PURE__*/React.memo(Time);
|
|
3187
|
-
|
|
3188
|
-
var Item = function Item(_ref) {
|
|
3189
|
-
var column = _ref.column,
|
|
3190
|
-
filters = _ref.filters,
|
|
3191
|
-
onChange = _ref.onChange,
|
|
3192
|
-
autoFocus = _ref.autoFocus,
|
|
3193
|
-
onClose = _ref.onClose;
|
|
3194
|
-
var key = column.key,
|
|
3195
|
-
_column$defaultType = column.defaultType,
|
|
3196
|
-
defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType;
|
|
3197
|
-
var filter = useMemo(function () {
|
|
3198
|
-
return findBy({
|
|
3199
|
-
key: key
|
|
3200
|
-
}, filters);
|
|
3201
|
-
}, [filters, key]);
|
|
3202
|
-
var handleApplyFilter = function handleApplyFilter(updatedFilter) {
|
|
3203
|
-
if (updatedFilter._delete) onChange(removeBy({
|
|
3204
|
-
key: key
|
|
3205
|
-
}, filters));else if (!filter) onChange(append(updatedFilter, filters));else onChange(replaceBy({
|
|
3206
|
-
key: key
|
|
3207
|
-
}, updatedFilter, filters));
|
|
3208
|
-
};
|
|
3209
|
-
if (isText(defaultType) || isDigit(defaultType)) {
|
|
3210
|
-
return /*#__PURE__*/React.createElement(Text, {
|
|
3211
|
-
autoFocus: autoFocus,
|
|
3212
|
-
column: column,
|
|
3213
|
-
filter: filter,
|
|
3214
|
-
filters: filters,
|
|
3215
|
-
handleApplyFilter: handleApplyFilter,
|
|
3216
|
-
onClose: onClose
|
|
3217
|
-
});
|
|
3218
|
-
}
|
|
3219
|
-
if (isDate(defaultType)) {
|
|
3220
|
-
return /*#__PURE__*/React.createElement(Datetime$1, {
|
|
3221
|
-
autoFocus: autoFocus,
|
|
3222
|
-
column: column,
|
|
3223
|
-
filter: filter,
|
|
3224
|
-
handleApplyFilter: handleApplyFilter
|
|
3225
|
-
});
|
|
3226
|
-
}
|
|
3227
|
-
if (isTime(defaultType)) {
|
|
3228
|
-
return /*#__PURE__*/React.createElement(Time$1, {
|
|
3229
|
-
autoFocus: autoFocus,
|
|
3230
|
-
column: column,
|
|
3231
|
-
filter: filter,
|
|
3232
|
-
handleApplyFilter: handleApplyFilter
|
|
3233
|
-
});
|
|
3234
|
-
}
|
|
3235
|
-
if (isSingleDate(defaultType)) {
|
|
3236
|
-
return /*#__PURE__*/React.createElement(SingleDatetime, {
|
|
3237
|
-
autoFocus: autoFocus,
|
|
3238
|
-
column: column,
|
|
3239
|
-
filter: filter,
|
|
3240
|
-
filters: filters,
|
|
3241
|
-
handleApplyFilter: handleApplyFilter
|
|
3242
|
-
});
|
|
3243
|
-
}
|
|
3244
|
-
if (isSingleTime(defaultType)) {
|
|
3245
|
-
return /*#__PURE__*/React.createElement(SingleTime, {
|
|
3246
|
-
autoFocus: autoFocus,
|
|
3247
|
-
column: column,
|
|
3248
|
-
filter: filter,
|
|
3249
|
-
filters: filters,
|
|
3250
|
-
handleApplyFilter: handleApplyFilter
|
|
3251
|
-
});
|
|
3252
|
-
}
|
|
3253
|
-
if (isBoolean(defaultType) || isCheckbox(defaultType)) {
|
|
3254
|
-
return /*#__PURE__*/React.createElement(Boolean$1, {
|
|
3255
|
-
autoFocus: autoFocus,
|
|
3256
|
-
column: column,
|
|
3257
|
-
filter: filter,
|
|
3258
|
-
handleApplyFilter: handleApplyFilter
|
|
3259
|
-
});
|
|
3260
|
-
}
|
|
3261
|
-
return /*#__PURE__*/React.createElement(Dropdown$1, {
|
|
3262
|
-
autoFocus: autoFocus,
|
|
3263
|
-
column: column,
|
|
3264
|
-
filter: filter,
|
|
3265
|
-
handleApplyFilter: handleApplyFilter
|
|
3266
|
-
});
|
|
3267
|
-
};
|
|
3268
|
-
|
|
3269
|
-
var _excluded = ["size", "isOpen", "onClose", "columns", "onChange", "isSearchable", "keyword", "onSelectorsChange", "childrenKeys", "children"];
|
|
3270
|
-
function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3271
|
-
function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
3272
|
-
var Pane = function Pane(_ref) {
|
|
3273
|
-
var size = _ref.size,
|
|
3274
|
-
isOpen = _ref.isOpen,
|
|
3275
|
-
onClose = _ref.onClose,
|
|
3276
|
-
columns = _ref.columns,
|
|
3277
|
-
onChange = _ref.onChange,
|
|
3278
|
-
isSearchable = _ref.isSearchable,
|
|
3279
|
-
keyword = _ref.keyword,
|
|
3280
|
-
onSelectorsChange = _ref.onSelectorsChange,
|
|
3281
|
-
_ref$childrenKeys = _ref.childrenKeys,
|
|
3282
|
-
childrenKeys = _ref$childrenKeys === void 0 ? [] : _ref$childrenKeys,
|
|
3283
|
-
children = _ref.children,
|
|
3284
|
-
otherProps = _objectWithoutProperties(_ref, _excluded);
|
|
3285
|
-
var searchParams = useQueryParams({
|
|
3286
|
-
toCamelCase: false
|
|
3287
|
-
});
|
|
3288
|
-
var _useState = useState(""),
|
|
3289
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
3290
|
-
searchTerm = _useState2[0],
|
|
3291
|
-
setSearchTerm = _useState2[1];
|
|
3292
|
-
var history = useHistory();
|
|
3293
|
-
var _useTranslation = useTranslation(),
|
|
3294
|
-
t = _useTranslation.t;
|
|
3295
|
-
columns = useMemo(function () {
|
|
3296
|
-
return getColumnsWithStandardizedType(columns);
|
|
3297
|
-
}, [columns]);
|
|
3298
|
-
var _buildFilteredColumns = buildFilteredColumns({
|
|
3299
|
-
searchTerm: searchTerm,
|
|
3300
|
-
columns: columns
|
|
3301
|
-
}),
|
|
3302
|
-
_buildFilteredColumns2 = _buildFilteredColumns.groupedColumns,
|
|
3303
|
-
groupedColumns = _buildFilteredColumns2 === void 0 ? [] : _buildFilteredColumns2,
|
|
3304
|
-
_buildFilteredColumns3 = _buildFilteredColumns.ungroupedColumns,
|
|
3305
|
-
ungroupedColumns = _buildFilteredColumns3 === void 0 ? [] : _buildFilteredColumns3;
|
|
3306
|
-
var keywordFilter = _objectSpread$1(_objectSpread$1({
|
|
3307
|
-
type: "text",
|
|
3308
|
-
rule: "contains",
|
|
3309
|
-
label: t("neetoFilters.common.searchTerm")
|
|
3310
|
-
}, keyword), {}, {
|
|
3311
|
-
key: SEARCH_TERM_KEY,
|
|
3312
|
-
value: searchParams[SEARCH_TERM_KEY] || ""
|
|
3313
|
-
});
|
|
3314
|
-
var filters = useFilters({
|
|
3315
|
-
onFiltersChange: onChange,
|
|
3316
|
-
columns: columns,
|
|
3317
|
-
keywordFilter: keywordFilter,
|
|
3318
|
-
onSelectorsChange: onSelectorsChange
|
|
3319
|
-
});
|
|
3320
|
-
var handleChange = function handleChange(newFilters) {
|
|
3321
|
-
var isClearAll = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
3322
|
-
var params = buildUrlFromFilters(_objectSpread$1({
|
|
3323
|
-
columns: columns,
|
|
3324
|
-
filters: isKeywordFilterPresent(keywordFilter) && isNotEmpty(getSearchTermFromUrl()) ? [].concat(_toConsumableArray(newFilters), [keywordFilter]) : newFilters
|
|
3325
|
-
}, isClearAll && {
|
|
3326
|
-
isClearAll: true,
|
|
3327
|
-
childrenKeys: childrenKeys
|
|
3328
|
-
}));
|
|
3329
|
-
history.push({
|
|
3330
|
-
search: params
|
|
3331
|
-
});
|
|
3332
|
-
};
|
|
3333
|
-
var handleClearAll = function handleClearAll() {
|
|
3334
|
-
var params = isKeywordFilterPresent(keywordFilter) ? omit([SEARCH_TERM_KEY], getSnakeCasedQueryParams()) : getSnakeCasedQueryParams();
|
|
3335
|
-
var pathname = window.location.pathname;
|
|
3336
|
-
history.push(buildUrl(pathname, params));
|
|
3337
|
-
handleChange([], true);
|
|
3338
|
-
};
|
|
3339
|
-
var handleClearTermAndClose = function handleClearTermAndClose() {
|
|
3340
|
-
setSearchTerm("");
|
|
3341
|
-
onClose();
|
|
3342
|
-
};
|
|
3343
|
-
var handleClose = function handleClose() {
|
|
3344
|
-
columns.forEach(function (_ref2) {
|
|
3345
|
-
var key = _ref2.key;
|
|
3346
|
-
var filter = findBy({
|
|
3347
|
-
key: key
|
|
3348
|
-
}, filters);
|
|
3349
|
-
if ((filter === null || filter === void 0 ? void 0 : filter.value) === "") delete searchParams[key];
|
|
3350
|
-
});
|
|
3351
|
-
handleClearTermAndClose();
|
|
3352
|
-
};
|
|
3353
|
-
var isClearFiltersDisabled = !filters.some(function (_ref3) {
|
|
3354
|
-
var value = _ref3.value,
|
|
3355
|
-
defaultValue = _ref3.defaultValue;
|
|
3356
|
-
return isPresent(value) && value !== defaultValue;
|
|
3357
|
-
}) && !childrenKeys.some(function (key) {
|
|
3358
|
-
return searchParams[key];
|
|
3359
|
-
});
|
|
3360
|
-
return /*#__PURE__*/React.createElement(Portal, {
|
|
3361
|
-
rootId: "neeto-filters-portal"
|
|
3362
|
-
}, /*#__PURE__*/React.createElement(Slider, _extends$1({
|
|
3363
|
-
isOpen: isOpen,
|
|
3364
|
-
size: size,
|
|
3365
|
-
onClose: handleClose
|
|
3366
|
-
}, otherProps), /*#__PURE__*/React.createElement(Slider.Header, {
|
|
3367
|
-
className: "neeto-filters-pane-filter__header",
|
|
3368
|
-
"data-cy": "neeto-filters-pane-header"
|
|
3369
|
-
}, /*#__PURE__*/React.createElement(Typography, {
|
|
3370
|
-
style: "h2",
|
|
3371
|
-
weight: "semibold"
|
|
3372
|
-
}, t("neetoFilters.common.filters"))), /*#__PURE__*/React.createElement(Slider.Body, {
|
|
3373
|
-
className: "neeto-filters-pane-filter__body neeto-ui-pt-2"
|
|
3374
|
-
}, isSearchable && /*#__PURE__*/React.createElement(Search, {
|
|
3375
|
-
"data-cy": "neeto-filters-column-search",
|
|
3376
|
-
placeholder: t("neetoFilters.messages.searchResources", {
|
|
3377
|
-
resources: t("neetoFilters.common.filters")
|
|
3378
|
-
}),
|
|
3379
|
-
onSearch: function onSearch(value) {
|
|
3380
|
-
return setSearchTerm(value);
|
|
3381
|
-
}
|
|
3382
|
-
}), ungroupedColumns.map(function (column) {
|
|
3383
|
-
return /*#__PURE__*/React.createElement(Item, {
|
|
3384
|
-
column: column,
|
|
3385
|
-
filters: filters,
|
|
3386
|
-
autoFocus: column.key === isOpen,
|
|
3387
|
-
key: column.key,
|
|
3388
|
-
onChange: handleChange,
|
|
3389
|
-
onClose: handleClearTermAndClose
|
|
3390
|
-
});
|
|
3391
|
-
}), isPresent(groupedColumns) && /*#__PURE__*/React.createElement(Accordion, {
|
|
3392
|
-
defaultActiveKey: groupedColumns.findIndex(function (_ref4) {
|
|
3393
|
-
var columns = _ref4.columns;
|
|
3394
|
-
return existsBy({
|
|
3395
|
-
key: isOpen
|
|
3396
|
-
}, columns);
|
|
3397
|
-
})
|
|
3398
|
-
}, groupedColumns.map(function (_ref5) {
|
|
3399
|
-
var group = _ref5.group,
|
|
3400
|
-
columns = _ref5.columns;
|
|
3401
|
-
return /*#__PURE__*/React.createElement(Accordion.Item, {
|
|
3402
|
-
className: "accordion_item",
|
|
3403
|
-
key: group,
|
|
3404
|
-
title: group
|
|
3405
|
-
}, columns.map(function (column) {
|
|
3406
|
-
return /*#__PURE__*/React.createElement(Item, {
|
|
3407
|
-
column: column,
|
|
3408
|
-
filters: filters,
|
|
3409
|
-
autoFocus: column.key === isOpen,
|
|
3410
|
-
key: column.key,
|
|
3411
|
-
onChange: handleChange,
|
|
3412
|
-
onClose: handleClearTermAndClose
|
|
3413
|
-
});
|
|
3414
|
-
}));
|
|
3415
|
-
})), isEmpty(ungroupedColumns) && isEmpty(groupedColumns) && /*#__PURE__*/React.createElement(Typography, {
|
|
3416
|
-
style: "body2"
|
|
3417
|
-
}, t("neetoFilters.messages.noResourcesFound", {
|
|
3418
|
-
resources: t("neetoFilters.common.columns")
|
|
3419
|
-
})), children), /*#__PURE__*/React.createElement(Slider.Footer, {
|
|
3420
|
-
className: "neeto-filters-pane-filter__footer"
|
|
3421
|
-
}, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
|
|
3422
|
-
"data-cy": "neeto-filters-done-btn",
|
|
3423
|
-
label: t("neetoFilters.common.done"),
|
|
3424
|
-
onClick: handleClearTermAndClose
|
|
3425
|
-
}), /*#__PURE__*/React.createElement(Button, {
|
|
3426
|
-
"data-cy": "neeto-filters-clear-btn",
|
|
3427
|
-
disabled: isClearFiltersDisabled,
|
|
3428
|
-
label: t("neetoFilters.common.clearFilters"),
|
|
3429
|
-
style: "text",
|
|
3430
|
-
onClick: handleClearAll
|
|
3431
|
-
})))));
|
|
3432
|
-
};
|
|
3433
|
-
|
|
3434
|
-
var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r.prepend?"prepend":"append",d=!0===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t[u]={}),a=t[u]&&t[u][s]?t[u][s]:t[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}
|
|
3435
|
-
|
|
3436
|
-
var css = ".neeto-filters-bar{align-items:center;display:flex;flex-wrap:wrap}.neeto-filters-bar__block{border-radius:var(--neeto-ui-rounded);display:flex;gap:4px;margin:4px 0;max-width:384px;overflow:hidden;padding:4px 8px;position:relative;transition:var(--neeto-ui-transition);white-space:nowrap}.neeto-filters-bar__block p:first-child{color:rgb(var(--neeto-ui-gray-700))}.neeto-filters-bar__block-close{background-image:linear-gradient(90deg,rgba(var(--neeto-ui-gray-200),.5) 0,rgba(var(--neeto-ui-gray-200),1) 25%);color:rgb(var(--neeto-ui-gray-800));opacity:0;padding:8px;position:absolute;right:0;top:0;transition:var(--neeto-ui-transition)}.neeto-filters-bar__block:active,.neeto-filters-bar__block:hover{background-color:rgb(var(--neeto-ui-gray-200));cursor:pointer}.neeto-filters-bar__block:active .neeto-filters-bar__block-close,.neeto-filters-bar__block:hover .neeto-filters-bar__block-close{border-radius:var(--neeto-ui-rounded);color:rgb(var(--neeto-ui-black));opacity:1}.neeto-filters-bar__block:focus{box-shadow:0 0 0 3px rgba(var(--neeto-ui-gray-800),15%);outline:none}.neeto-filters-bar--separator{align-self:stretch;border-left:1px solid rgb(var(--neeto-ui-gray-400));margin:12px 8px}.neeto-filters-slider__pane{border-radius:12px 0 0 12px;position:fixed;right:0;top:0;z-index:99998}.neeto-filters-slider__wrapper{background-color:rgb(var(--neeto-ui-white));box-shadow:var(--neeto-ui-shadow-m);height:100vh;max-width:100%;transform:translateX(100%);transition:all .3s}.neeto-filters-slider__wrapper--xsmall{width:360px}.neeto-filters-slider__wrapper--small{width:480px}.neeto-filters-slider__wrapper--large{width:50vw}@media screen and (max-width:767px){.neeto-filters-slider__wrapper{width:100vw}}.neeto-filters-slider__close{position:absolute!important;right:24px;top:24px}.neeto-filters-slider__header{padding:24px 60px 24px 24px;width:100%}.neeto-filters-slider__body{font-size:var(--neeto-ui-text-sm);height:calc(100vh - var(--neeto-ui-pane-header-height));overflow-y:auto;padding:0 24px;width:100%}.neeto-filters-slider__body.neeto-filters-slider__body--has-footer{height:calc(100vh - var(--neeto-ui-pane-header-height) - var(--neeto-ui-pane-footer-height))}.neeto-filters-slider__footer{background-color:rgb(var(--neeto-ui-white));min-height:var(--neeto-ui-pane-footer-height);padding:24px;width:100%}.neeto-filters-slider__footer.neeto-filters-slider__footer__absolute{bottom:0;left:0;position:absolute;width:100%}.neeto-filters-slider-enter .neeto-filters-slider__wrapper{transform:translateX(100%)}.neeto-filters-slider-enter-active .neeto-filters-slider__wrapper,.neeto-filters-slider-enter-done .neeto-filters-slider__wrapper{transform:translateX(0)}.neeto-filters-slider-exit .neeto-filters-slider__wrapper,.neeto-filters-slider-exit-active .neeto-filters-slider__wrapper{transform:translateX(100%)}.neeto-filters-pane-filter__body{align-items:stretch!important;gap:20px}.neeto-filters-pane-filter__body>*{flex-grow:0!important}.neeto-filters-pane-filter__body p{text-align:center}.neeto-filters-pane-filter__body .neeto-filters-pane-filter__item-wrapper{display:flex;flex-direction:column;gap:8px}.neeto-filters-pane-filter__body .accordion_item .neeto-filters-pane-filter__item-wrapper{margin-top:16px}.neeto-filters-pane-filter__body .accordion_item .neeto-filters-pane-filter__item-wrapper:first-of-type{margin-top:0}.neeto-filters-pane-filter__body .accordion_item:first-of-type .neeto-ui-accordion__item{padding-top:0}.neeto-filters-pane-filter__body .neeto-ui-accordion__wrapper--last-item{border-bottom:thin solid rgb(var(--neeto-ui-gray-300))}.neeto-filters-pane-filter__footer{justify-content:space-between}.neeto-filters-pane-filter__footer div{display:flex;gap:8px}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImFwcC9qYXZhc2NyaXB0L3NyYy9zdHlsZXNoZWV0cy9jb21wb25lbnRzL19iYXIuc2NzcyIsImFwcC9qYXZhc2NyaXB0L3NyYy9zdHlsZXNoZWV0cy9pbmRleC5zY3NzIiwiYXBwL2phdmFzY3JpcHQvc3JjL3N0eWxlc2hlZXRzL2NvbXBvbmVudHMvX3NsaWRlci5zY3NzIiwiYXBwL2phdmFzY3JpcHQvc3JjL3N0eWxlc2hlZXRzL2Fic3RyYWN0cy9fbWl4aW5zLnNjc3MiLCJhcHAvamF2YXNjcmlwdC9zcmMvc3R5bGVzaGVldHMvY29tcG9uZW50cy9fZmlsdGVycy5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLG1CQUdFLGtCQUFBLENBRkEsWUFBQSxDQUNBLGNDRUYsQ0RDRSwwQkFLRSxxQ0FBQSxDQUhBLFlBQUEsQ0FFQSxPQUFBLENBR0EsWUFBQSxDQUNBLGVBQUEsQ0FFQSxlQUFBLENBVEEsZUFBQSxDQUVBLGlCQUFBLENBR0EscUNBQUEsQ0FHQSxrQkNFSixDRENJLHdDQUNFLG1DQ0NOLENERUksZ0NBUUUsZ0hBQUEsQ0FGQSxtQ0FBQSxDQURBLFNBQUEsQ0FEQSxXQUFBLENBSEEsaUJBQUEsQ0FFQSxPQUFBLENBREEsS0FBQSxDQUtBLHFDQ0NOLENET0ksaUVBRUUsOENBQUEsQ0FDQSxjQ05OLENEUU0saUlBR0UscUNBQUEsQ0FEQSxnQ0FBQSxDQURBLFNDSlIsQ0RVSSxnQ0FFRSx1REFBQSxDQURBLFlDUE4sQ0RZRSw4QkFHRSxrQkFBQSxDQUZBLG1EQUFBLENBQ0EsZUNUSixDQzlDRSw0QkFJRSwyQkFBQSxDQUhBLGNBQUEsQ0FFQSxPQUFBLENBREEsS0FBQSxDQUdBLGFEaURKLENDL0NFLCtCQUdFLDJDQUFBLENBQ0EsbUNBQUEsQ0FGQSxZQUFBLENBREEsY0FBQSxDQUtBLDBCQUFBLENBQ0Esa0JEZ0RKLENDOUNJLHVDQUNFLFdEZ0ROLENDN0NJLHNDQUNFLFdEK0NOLENDNUNJLHNDQUNFLFVEOENOLENFMURJLG9DRE5GLCtCQXNCSSxXRDhDSixDQUNGLENDNUNFLDZCQUNFLDJCQUFBLENBRUEsVUFBQSxDQURBLFFEK0NKLENDM0NFLDhCQUdFLDJCQUFBLENBRkEsVUQrQ0osQ0MxQ0UsNEJBSUUsaUNBQUEsQ0FGQSx1REFBQSxDQUdBLGVBQUEsQ0FGQSxjQUFBLENBRkEsVURnREosQ0MxQ0ksbUVBQ0UsNEZENENOLENDckNFLDhCQUdFLDJDQUFBLENBQ0EsNkNBQUEsQ0FGQSxZQUFBLENBREEsVUQwQ0osQ0NyQ0kscUVBSUUsUUFBQSxDQURBLE1BQUEsQ0FEQSxpQkFBQSxDQURBLFVEMENOLENDL0JFLDJEQUNFLDBCRGtDSixDQzdCRSxrSUFDRSx1QkRpQ0osQ0N4QkUsMkhBQ0UsMEJEK0JKLENHN0hFLGlDQUNFLDZCQUFBLENBQ0EsUUhnSUosQ0c5SEksbUNBQ0UscUJIZ0lOLENHN0hJLG1DQUNFLGlCSCtITixDRzVISSwwRUFDRSxZQUFBLENBQ0EscUJBQUEsQ0FDQSxPSDhITixDRzFITSwwRkFDRSxlSDRIUixDRzFIUSx3R0FDRSxZSDRIVixDR3hIUSx5RkFDRSxhSDBIVixDR3RISSx5RUFDRSxzREh3SE4sQ0dwSEUsbUNBQ0UsNkJIc0hKLENHcEhJLHVDQUNFLFlBQUEsQ0FDQSxPSHNITiIsInNvdXJjZXNDb250ZW50IjpbIi5uZWV0by1maWx0ZXJzLWJhciB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtd3JhcDogd3JhcDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcblxuICAmX19ibG9jayB7XG4gICAgcGFkZGluZzogNHB4IDhweDtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBnYXA6IDRweDtcbiAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1uZWV0by11aS1yb3VuZGVkKTtcbiAgICB0cmFuc2l0aW9uOiB2YXIoLS1uZWV0by11aS10cmFuc2l0aW9uKTtcbiAgICBtYXJnaW46IDRweCAwO1xuICAgIG1heC13aWR0aDogMzg0cHg7XG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuXG4gICAgcDpmaXJzdC1jaGlsZCB7XG4gICAgICBjb2xvcjogcmdiKHZhcigtLW5lZXRvLXVpLWdyYXktNzAwKSk7XG4gICAgfVxuXG4gICAgJi1jbG9zZSB7XG4gICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICB0b3A6IDA7XG4gICAgICByaWdodDogMDtcbiAgICAgIHBhZGRpbmc6IDhweDtcbiAgICAgIG9wYWNpdHk6IDA7XG4gICAgICBjb2xvcjogcmdiKHZhcigtLW5lZXRvLXVpLWdyYXktODAwKSk7XG4gICAgICB0cmFuc2l0aW9uOiB2YXIoLS1uZWV0by11aS10cmFuc2l0aW9uKTtcbiAgICAgIGJhY2tncm91bmQtaW1hZ2U6IGxpbmVhci1ncmFkaWVudChcbiAgICAgICAgOTBkZWcsXG4gICAgICAgIHJnYmEodmFyKC0tbmVldG8tdWktZ3JheS0yMDApLCAwLjUpIDAlLFxuICAgICAgICByZ2JhKHZhcigtLW5lZXRvLXVpLWdyYXktMjAwKSwgMSkgMjUlXG4gICAgICApO1xuICAgIH1cblxuICAgICY6aG92ZXIsXG4gICAgJjphY3RpdmUge1xuICAgICAgYmFja2dyb3VuZC1jb2xvcjogcmdiKHZhcigtLW5lZXRvLXVpLWdyYXktMjAwKSk7XG4gICAgICBjdXJzb3I6IHBvaW50ZXI7XG5cbiAgICAgIC5uZWV0by1maWx0ZXJzLWJhcl9fYmxvY2stY2xvc2Uge1xuICAgICAgICBvcGFjaXR5OiAxO1xuICAgICAgICBjb2xvcjogcmdiKHZhcigtLW5lZXRvLXVpLWJsYWNrKSk7XG4gICAgICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLW5lZXRvLXVpLXJvdW5kZWQpO1xuICAgICAgfVxuICAgIH1cblxuICAgICY6Zm9jdXMge1xuICAgICAgb3V0bGluZTogbm9uZTtcbiAgICAgIGJveC1zaGFkb3c6IDAgMCAwIDNweCByZ2JhKHZhcigtLW5lZXRvLXVpLWdyYXktODAwKSwgMTUlKTtcbiAgICB9XG4gIH1cblxuICAmLS1zZXBhcmF0b3Ige1xuICAgIGJvcmRlci1sZWZ0OiAxcHggc29saWQgcmdiKHZhcigtLW5lZXRvLXVpLWdyYXktNDAwKSk7XG4gICAgbWFyZ2luOiAxMnB4IDhweDtcbiAgICBhbGlnbi1zZWxmOiBzdHJldGNoO1xuICB9XG59XG4iLCIubmVldG8tZmlsdGVycy1iYXIge1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LXdyYXA6IHdyYXA7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG59XG4ubmVldG8tZmlsdGVycy1iYXJfX2Jsb2NrIHtcbiAgcGFkZGluZzogNHB4IDhweDtcbiAgZGlzcGxheTogZmxleDtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBnYXA6IDRweDtcbiAgYm9yZGVyLXJhZGl1czogdmFyKC0tbmVldG8tdWktcm91bmRlZCk7XG4gIHRyYW5zaXRpb246IHZhcigtLW5lZXRvLXVpLXRyYW5zaXRpb24pO1xuICBtYXJnaW46IDRweCAwO1xuICBtYXgtd2lkdGg6IDM4NHB4O1xuICB3aGl0ZS1zcGFjZTogbm93cmFwO1xuICBvdmVyZmxvdzogaGlkZGVuO1xufVxuLm5lZXRvLWZpbHRlcnMtYmFyX19ibG9jayBwOmZpcnN0LWNoaWxkIHtcbiAgY29sb3I6IHJnYih2YXIoLS1uZWV0by11aS1ncmF5LTcwMCkpO1xufVxuLm5lZXRvLWZpbHRlcnMtYmFyX19ibG9jay1jbG9zZSB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAwO1xuICByaWdodDogMDtcbiAgcGFkZGluZzogOHB4O1xuICBvcGFjaXR5OiAwO1xuICBjb2xvcjogcmdiKHZhcigtLW5lZXRvLXVpLWdyYXktODAwKSk7XG4gIHRyYW5zaXRpb246IHZhcigtLW5lZXRvLXVpLXRyYW5zaXRpb24pO1xuICBiYWNrZ3JvdW5kLWltYWdlOiBsaW5lYXItZ3JhZGllbnQoOTBkZWcsIHJnYmEodmFyKC0tbmVldG8tdWktZ3JheS0yMDApLCAwLjUpIDAlLCByZ2JhKHZhcigtLW5lZXRvLXVpLWdyYXktMjAwKSwgMSkgMjUlKTtcbn1cbi5uZWV0by1maWx0ZXJzLWJhcl9fYmxvY2s6aG92ZXIsIC5uZWV0by1maWx0ZXJzLWJhcl9fYmxvY2s6YWN0aXZlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiKHZhcigtLW5lZXRvLXVpLWdyYXktMjAwKSk7XG4gIGN1cnNvcjogcG9pbnRlcjtcbn1cbi5uZWV0by1maWx0ZXJzLWJhcl9fYmxvY2s6aG92ZXIgLm5lZXRvLWZpbHRlcnMtYmFyX19ibG9jay1jbG9zZSwgLm5lZXRvLWZpbHRlcnMtYmFyX19ibG9jazphY3RpdmUgLm5lZXRvLWZpbHRlcnMtYmFyX19ibG9jay1jbG9zZSB7XG4gIG9wYWNpdHk6IDE7XG4gIGNvbG9yOiByZ2IodmFyKC0tbmVldG8tdWktYmxhY2spKTtcbiAgYm9yZGVyLXJhZGl1czogdmFyKC0tbmVldG8tdWktcm91bmRlZCk7XG59XG4ubmVldG8tZmlsdGVycy1iYXJfX2Jsb2NrOmZvY3VzIHtcbiAgb3V0bGluZTogbm9uZTtcbiAgYm94LXNoYWRvdzogMCAwIDAgM3B4IHJnYmEodmFyKC0tbmVldG8tdWktZ3JheS04MDApLCAxNSUpO1xufVxuLm5lZXRvLWZpbHRlcnMtYmFyLS1zZXBhcmF0b3Ige1xuICBib3JkZXItbGVmdDogMXB4IHNvbGlkIHJnYih2YXIoLS1uZWV0by11aS1ncmF5LTQwMCkpO1xuICBtYXJnaW46IDEycHggOHB4O1xuICBhbGlnbi1zZWxmOiBzdHJldGNoO1xufVxuXG4ubmVldG8tZmlsdGVycy1zbGlkZXJfX3BhbmUge1xuICBwb3NpdGlvbjogZml4ZWQ7XG4gIHRvcDogMDtcbiAgcmlnaHQ6IDA7XG4gIGJvcmRlci1yYWRpdXM6IDEycHggMHB4IDBweCAxMnB4O1xuICB6LWluZGV4OiA5OTk5ODtcbn1cbi5uZWV0by1maWx0ZXJzLXNsaWRlcl9fd3JhcHBlciB7XG4gIG1heC13aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAxMDB2aDtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiKHZhcigtLW5lZXRvLXVpLXdoaXRlKSk7XG4gIGJveC1zaGFkb3c6IHZhcigtLW5lZXRvLXVpLXNoYWRvdy1tKTtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKDEwMCUpO1xuICB0cmFuc2l0aW9uOiBhbGwgMC4zcztcbn1cbi5uZWV0by1maWx0ZXJzLXNsaWRlcl9fd3JhcHBlci0teHNtYWxsIHtcbiAgd2lkdGg6IDM2MHB4O1xufVxuLm5lZXRvLWZpbHRlcnMtc2xpZGVyX193cmFwcGVyLS1zbWFsbCB7XG4gIHdpZHRoOiA0ODBweDtcbn1cbi5uZWV0by1maWx0ZXJzLXNsaWRlcl9fd3JhcHBlci0tbGFyZ2Uge1xuICB3aWR0aDogNTB2dztcbn1cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2N3B4KSB7XG4gIC5uZWV0by1maWx0ZXJzLXNsaWRlcl9fd3JhcHBlciB7XG4gICAgd2lkdGg6IDEwMHZ3O1xuICB9XG59XG4ubmVldG8tZmlsdGVycy1zbGlkZXJfX2Nsb3NlIHtcbiAgcG9zaXRpb246IGFic29sdXRlICFpbXBvcnRhbnQ7XG4gIHRvcDogMjRweDtcbiAgcmlnaHQ6IDI0cHg7XG59XG4ubmVldG8tZmlsdGVycy1zbGlkZXJfX2hlYWRlciB7XG4gIHdpZHRoOiAxMDAlO1xuICBwYWRkaW5nOiAyNHB4O1xuICBwYWRkaW5nLXJpZ2h0OiA2MHB4O1xufVxuLm5lZXRvLWZpbHRlcnMtc2xpZGVyX19ib2R5IHtcbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogY2FsYygxMDB2aCAtIHZhcigtLW5lZXRvLXVpLXBhbmUtaGVhZGVyLWhlaWdodCkpO1xuICBwYWRkaW5nOiAwIDI0cHg7XG4gIGZvbnQtc2l6ZTogdmFyKC0tbmVldG8tdWktdGV4dC1zbSk7XG4gIG92ZXJmbG93LXk6IGF1dG87XG59XG4ubmVldG8tZmlsdGVycy1zbGlkZXJfX2JvZHkubmVldG8tZmlsdGVycy1zbGlkZXJfX2JvZHktLWhhcy1mb290ZXIge1xuICBoZWlnaHQ6IGNhbGMoMTAwdmggLSB2YXIoLS1uZWV0by11aS1wYW5lLWhlYWRlci1oZWlnaHQpIC0gdmFyKC0tbmVldG8tdWktcGFuZS1mb290ZXItaGVpZ2h0KSk7XG59XG4ubmVldG8tZmlsdGVycy1zbGlkZXJfX2Zvb3RlciB7XG4gIHdpZHRoOiAxMDAlO1xuICBwYWRkaW5nOiAyNHB4O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2IodmFyKC0tbmVldG8tdWktd2hpdGUpKTtcbiAgbWluLWhlaWdodDogdmFyKC0tbmVldG8tdWktcGFuZS1mb290ZXItaGVpZ2h0KTtcbn1cbi5uZWV0by1maWx0ZXJzLXNsaWRlcl9fZm9vdGVyLm5lZXRvLWZpbHRlcnMtc2xpZGVyX19mb290ZXJfX2Fic29sdXRlIHtcbiAgd2lkdGg6IDEwMCU7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgbGVmdDogMDtcbiAgYm90dG9tOiAwO1xufVxuXG4ubmVldG8tZmlsdGVycy1zbGlkZXItZW50ZXIgLm5lZXRvLWZpbHRlcnMtc2xpZGVyX193cmFwcGVyIHtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKDEwMCUpO1xufVxuXG4ubmVldG8tZmlsdGVycy1zbGlkZXItZW50ZXItYWN0aXZlIC5uZWV0by1maWx0ZXJzLXNsaWRlcl9fd3JhcHBlcixcbi5uZWV0by1maWx0ZXJzLXNsaWRlci1lbnRlci1kb25lIC5uZWV0by1maWx0ZXJzLXNsaWRlcl9fd3JhcHBlciB7XG4gIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgwKTtcbn1cblxuLm5lZXRvLWZpbHRlcnMtc2xpZGVyLWV4aXQgLm5lZXRvLWZpbHRlcnMtc2xpZGVyX193cmFwcGVyIHtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKDEwMCUpO1xufVxuXG4ubmVldG8tZmlsdGVycy1zbGlkZXItZXhpdC1hY3RpdmUgLm5lZXRvLWZpbHRlcnMtc2xpZGVyX193cmFwcGVyIHtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKDEwMCUpO1xufVxuXG4ubmVldG8tZmlsdGVycy1wYW5lLWZpbHRlcl9fYm9keSB7XG4gIGFsaWduLWl0ZW1zOiBzdHJldGNoICFpbXBvcnRhbnQ7XG4gIGdhcDogMjBweDtcbn1cbi5uZWV0by1maWx0ZXJzLXBhbmUtZmlsdGVyX19ib2R5ID4gKiB7XG4gIGZsZXgtZ3JvdzogMCAhaW1wb3J0YW50O1xufVxuLm5lZXRvLWZpbHRlcnMtcGFuZS1maWx0ZXJfX2JvZHkgcCB7XG4gIHRleHQtYWxpZ246IGNlbnRlcjtcbn1cbi5uZWV0by1maWx0ZXJzLXBhbmUtZmlsdGVyX19ib2R5IC5uZWV0by1maWx0ZXJzLXBhbmUtZmlsdGVyX19pdGVtLXdyYXBwZXIge1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBnYXA6IDhweDtcbn1cbi5uZWV0by1maWx0ZXJzLXBhbmUtZmlsdGVyX19ib2R5IC5hY2NvcmRpb25faXRlbSAubmVldG8tZmlsdGVycy1wYW5lLWZpbHRlcl9faXRlbS13cmFwcGVyIHtcbiAgbWFyZ2luLXRvcDogMTZweDtcbn1cbi5uZWV0by1maWx0ZXJzLXBhbmUtZmlsdGVyX19ib2R5IC5hY2NvcmRpb25faXRlbSAubmVldG8tZmlsdGVycy1wYW5lLWZpbHRlcl9faXRlbS13cmFwcGVyOmZpcnN0LW9mLXR5cGUge1xuICBtYXJnaW4tdG9wOiAwO1xufVxuLm5lZXRvLWZpbHRlcnMtcGFuZS1maWx0ZXJfX2JvZHkgLmFjY29yZGlvbl9pdGVtOmZpcnN0LW9mLXR5cGUgLm5lZXRvLXVpLWFjY29yZGlvbl9faXRlbSB7XG4gIHBhZGRpbmctdG9wOiAwO1xufVxuLm5lZXRvLWZpbHRlcnMtcGFuZS1maWx0ZXJfX2JvZHkgLm5lZXRvLXVpLWFjY29yZGlvbl9fd3JhcHBlci0tbGFzdC1pdGVtIHtcbiAgYm9yZGVyLWJvdHRvbTogdGhpbiBzb2xpZCByZ2IodmFyKC0tbmVldG8tdWktZ3JheS0zMDApKTtcbn1cbi5uZWV0by1maWx0ZXJzLXBhbmUtZmlsdGVyX19mb290ZXIge1xuICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG59XG4ubmVldG8tZmlsdGVycy1wYW5lLWZpbHRlcl9fZm9vdGVyIGRpdiB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGdhcDogOHB4O1xufSIsIi5uZWV0by1maWx0ZXJzLXNsaWRlciB7XG4gICZfX3BhbmUge1xuICAgIHBvc2l0aW9uOiBmaXhlZDtcbiAgICB0b3A6IDA7XG4gICAgcmlnaHQ6IDA7XG4gICAgYm9yZGVyLXJhZGl1czogMTJweCAwcHggMHB4IDEycHg7XG4gICAgei1pbmRleDogOTk5OTg7XG4gIH1cbiAgJl9fd3JhcHBlciB7XG4gICAgbWF4LXdpZHRoOiAxMDAlO1xuICAgIGhlaWdodDogMTAwdmg7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogcmdiKHZhcigtLW5lZXRvLXVpLXdoaXRlKSk7XG4gICAgYm94LXNoYWRvdzogdmFyKC0tbmVldG8tdWktc2hhZG93LW0pO1xuXG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKDEwMCUpO1xuICAgIHRyYW5zaXRpb246IGFsbCAwLjNzO1xuXG4gICAgJi0teHNtYWxsIHtcbiAgICAgIHdpZHRoOiAzNjBweDtcbiAgICB9XG5cbiAgICAmLS1zbWFsbCB7XG4gICAgICB3aWR0aDogNDgwcHg7XG4gICAgfVxuXG4gICAgJi0tbGFyZ2Uge1xuICAgICAgd2lkdGg6IDUwdnc7XG4gICAgfVxuXG4gICAgQGluY2x1ZGUgdmlld3BvcnQobW9iKSB7XG4gICAgICB3aWR0aDogMTAwdnc7XG4gICAgfVxuICB9XG4gICZfX2Nsb3NlIHtcbiAgICBwb3NpdGlvbjogYWJzb2x1dGUgIWltcG9ydGFudDtcbiAgICB0b3A6IDI0cHg7XG4gICAgcmlnaHQ6IDI0cHg7XG4gIH1cblxuICAmX19oZWFkZXIge1xuICAgIHdpZHRoOiAxMDAlO1xuICAgIHBhZGRpbmc6IDI0cHg7XG4gICAgcGFkZGluZy1yaWdodDogNjBweDtcbiAgfVxuXG4gICZfX2JvZHkge1xuICAgIHdpZHRoOiAxMDAlO1xuICAgIGhlaWdodDogY2FsYygxMDB2aCAtIHZhcigtLW5lZXRvLXVpLXBhbmUtaGVhZGVyLWhlaWdodCkpO1xuICAgIHBhZGRpbmc6IDAgMjRweDtcbiAgICBmb250LXNpemU6IHZhcigtLW5lZXRvLXVpLXRleHQtc20pO1xuICAgIG92ZXJmbG93LXk6IGF1dG87XG5cbiAgICAmLm5lZXRvLWZpbHRlcnMtc2xpZGVyX19ib2R5LS1oYXMtZm9vdGVyIHtcbiAgICAgIGhlaWdodDogY2FsYyhcbiAgICAgICAgMTAwdmggLSB2YXIoLS1uZWV0by11aS1wYW5lLWhlYWRlci1oZWlnaHQpIC1cbiAgICAgICAgICB2YXIoLS1uZWV0by11aS1wYW5lLWZvb3Rlci1oZWlnaHQpXG4gICAgICApO1xuICAgIH1cbiAgfVxuXG4gICZfX2Zvb3RlciB7XG4gICAgd2lkdGg6IDEwMCU7XG4gICAgcGFkZGluZzogMjRweDtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2IodmFyKC0tbmVldG8tdWktd2hpdGUpKTtcbiAgICBtaW4taGVpZ2h0OiB2YXIoLS1uZWV0by11aS1wYW5lLWZvb3Rlci1oZWlnaHQpO1xuXG4gICAgJi5uZWV0by1maWx0ZXJzLXNsaWRlcl9fZm9vdGVyX19hYnNvbHV0ZSB7XG4gICAgICB3aWR0aDogMTAwJTtcbiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgIGxlZnQ6IDA7XG4gICAgICBib3R0b206IDA7XG4gICAgfVxuICB9XG59XG5cbi8vIENTUyB0cmFuc2l0aW9uIGdyb3VwXG5cbi5uZWV0by1maWx0ZXJzLXNsaWRlci1lbnRlciB7XG4gIC5uZWV0by1maWx0ZXJzLXNsaWRlcl9fd3JhcHBlciB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKDEwMCUpO1xuICB9XG59XG4ubmVldG8tZmlsdGVycy1zbGlkZXItZW50ZXItYWN0aXZlLFxuLm5lZXRvLWZpbHRlcnMtc2xpZGVyLWVudGVyLWRvbmUge1xuICAubmVldG8tZmlsdGVycy1zbGlkZXJfX3dyYXBwZXIge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgwKTtcbiAgfVxufVxuLm5lZXRvLWZpbHRlcnMtc2xpZGVyLWV4aXQge1xuICAubmVldG8tZmlsdGVycy1zbGlkZXJfX3dyYXBwZXIge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgxMDAlKTtcbiAgfVxufVxuLm5lZXRvLWZpbHRlcnMtc2xpZGVyLWV4aXQtYWN0aXZlIHtcbiAgLm5lZXRvLWZpbHRlcnMtc2xpZGVyX193cmFwcGVyIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoMTAwJSk7XG4gIH1cbn1cbiIsIkBtaXhpbiB2aWV3cG9ydCgkbWVkaWEpIHtcbiAgQGlmICRtZWRpYT09ZGVzayB7XG4gICAgQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTIwMHB4KSB7XG4gICAgICBAY29udGVudDtcbiAgICB9XG4gIH0gQGVsc2UgaWYgJG1lZGlhPT10YWItbWluIHtcbiAgICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAxMDI0cHgpIHtcbiAgICAgIEBjb250ZW50O1xuICAgIH1cbiAgfSBAZWxzZSBpZiAkbWVkaWE9PXRhYi1vbmx5IHtcbiAgICBAbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjhweCkgYW5kIChtYXgtd2lkdGg6IDEwMjNweCkge1xuICAgICAgQGNvbnRlbnQ7XG4gICAgfVxuICB9IEBlbHNlIGlmICRtZWRpYT09bW9iIHtcbiAgICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjdweCkge1xuICAgICAgQGNvbnRlbnQ7XG4gICAgfVxuICB9IEBlbHNlIGlmICRtZWRpYT09eHMtbW9iIHtcbiAgICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA0NzlweCkge1xuICAgICAgQGNvbnRlbnQ7XG4gICAgfVxuICB9XG59XG4iLCIubmVldG8tZmlsdGVycy1wYW5lLWZpbHRlciB7XG4gICZfX2JvZHkge1xuICAgIGFsaWduLWl0ZW1zOiBzdHJldGNoICFpbXBvcnRhbnQ7XG4gICAgZ2FwOiAyMHB4O1xuXG4gICAgPiAqIHtcbiAgICAgIGZsZXgtZ3JvdzogMCAhaW1wb3J0YW50O1xuICAgIH1cblxuICAgIHAge1xuICAgICAgdGV4dC1hbGlnbjogY2VudGVyO1xuICAgIH1cblxuICAgIC5uZWV0by1maWx0ZXJzLXBhbmUtZmlsdGVyX19pdGVtLXdyYXBwZXIge1xuICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgICBnYXA6IDhweDtcbiAgICB9XG5cbiAgICAuYWNjb3JkaW9uX2l0ZW0ge1xuICAgICAgLm5lZXRvLWZpbHRlcnMtcGFuZS1maWx0ZXJfX2l0ZW0td3JhcHBlciB7XG4gICAgICAgIG1hcmdpbi10b3A6IDE2cHg7XG5cbiAgICAgICAgJjpmaXJzdC1vZi10eXBlIHtcbiAgICAgICAgICBtYXJnaW4tdG9wOiAwO1xuICAgICAgICB9XG4gICAgICB9XG4gICAgICAmOmZpcnN0LW9mLXR5cGUge1xuICAgICAgICAubmVldG8tdWktYWNjb3JkaW9uX19pdGVtIHtcbiAgICAgICAgICBwYWRkaW5nLXRvcDogMDtcbiAgICAgICAgfVxuICAgICAgfVxuICAgIH1cbiAgICAubmVldG8tdWktYWNjb3JkaW9uX193cmFwcGVyLS1sYXN0LWl0ZW0ge1xuICAgICAgYm9yZGVyLWJvdHRvbTogdGhpbiBzb2xpZCByZ2IodmFyKC0tbmVldG8tdWktZ3JheS0zMDApKTtcbiAgICB9XG4gIH1cblxuICAmX19mb290ZXIge1xuICAgIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcblxuICAgIGRpdiB7XG4gICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgZ2FwOiA4cHg7XG4gICAgfVxuICB9XG59XG4iXX0= */";
|
|
3437
|
-
n(css,{});
|
|
3438
|
-
|
|
3439
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3440
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
3441
|
-
var Filters = withT(function (_ref) {
|
|
3442
|
-
var t = _ref.t,
|
|
3443
|
-
size = _ref.size,
|
|
3444
|
-
_ref$isOpen = _ref.isOpen,
|
|
3445
|
-
isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
|
|
3446
|
-
_ref$setIsOpen = _ref.setIsOpen,
|
|
3447
|
-
setIsOpen = _ref$setIsOpen === void 0 ? identity : _ref$setIsOpen,
|
|
3448
|
-
_ref$columns = _ref.columns,
|
|
3449
|
-
columns = _ref$columns === void 0 ? [] : _ref$columns,
|
|
3450
|
-
_ref$onChange = _ref.onChange,
|
|
3451
|
-
onChange = _ref$onChange === void 0 ? identity : _ref$onChange,
|
|
3452
|
-
_ref$buttonProps = _ref.buttonProps,
|
|
3453
|
-
buttonProps = _ref$buttonProps === void 0 ? {} : _ref$buttonProps,
|
|
3454
|
-
_ref$paneProps = _ref.paneProps,
|
|
3455
|
-
paneProps = _ref$paneProps === void 0 ? {} : _ref$paneProps,
|
|
3456
|
-
_ref$isSearchable = _ref.isSearchable,
|
|
3457
|
-
isSearchable = _ref$isSearchable === void 0 ? false : _ref$isSearchable,
|
|
3458
|
-
className = _ref.className,
|
|
3459
|
-
_ref$onSelectorsChang = _ref.onSelectorsChange,
|
|
3460
|
-
onSelectorsChange = _ref$onSelectorsChang === void 0 ? noop$1 : _ref$onSelectorsChang,
|
|
3461
|
-
_ref$keyword = _ref.keyword,
|
|
3462
|
-
keyword = _ref$keyword === void 0 ? {
|
|
3463
|
-
node: "",
|
|
3464
|
-
value: "",
|
|
3465
|
-
setValue: noop$1
|
|
3466
|
-
} : _ref$keyword,
|
|
3467
|
-
childrenKeys = _ref.childrenKeys,
|
|
3468
|
-
children = _ref.children;
|
|
3469
|
-
return /*#__PURE__*/React.createElement("span", {
|
|
3470
|
-
className: classnames(_defineProperty({}, className, className))
|
|
3471
|
-
}, /*#__PURE__*/React.createElement(Button, _extends$1({
|
|
3472
|
-
"data-cy": "neeto-filters-toggle-btn",
|
|
3473
|
-
label: t("neetoFilters.common.filter"),
|
|
3474
|
-
style: "secondary",
|
|
3475
|
-
onClick: function onClick() {
|
|
3476
|
-
return setIsOpen(true);
|
|
3477
|
-
}
|
|
3478
|
-
}, buttonProps)), /*#__PURE__*/React.createElement(Pane, _extends$1({
|
|
3479
|
-
onClose: function onClose() {
|
|
3480
|
-
return setIsOpen(false);
|
|
3481
|
-
}
|
|
3482
|
-
}, _objectSpread({
|
|
3483
|
-
childrenKeys: childrenKeys,
|
|
3484
|
-
columns: columns,
|
|
3485
|
-
isOpen: isOpen,
|
|
3486
|
-
isSearchable: isSearchable,
|
|
3487
|
-
keyword: keyword,
|
|
3488
|
-
onChange: onChange,
|
|
3489
|
-
onSelectorsChange: onSelectorsChange,
|
|
3490
|
-
size: size
|
|
3491
|
-
}, paneProps)), children));
|
|
3492
|
-
});
|
|
3493
|
-
|
|
3494
|
-
var DeleteAlert = function DeleteAlert(_ref) {
|
|
3495
|
-
var isOpen = _ref.isOpen,
|
|
3496
|
-
onClose = _ref.onClose,
|
|
3497
|
-
segment = _ref.segment,
|
|
3498
|
-
columns = _ref.columns;
|
|
3499
|
-
var _useTranslation = useTranslation(),
|
|
3500
|
-
t = _useTranslation.t;
|
|
3501
|
-
var history = useHistory();
|
|
3502
|
-
var _getQueryParams = getQueryParams(),
|
|
3503
|
-
segmentId = _getQueryParams.segmentId;
|
|
3504
|
-
var _useDestroySegment = useDestroySegment(),
|
|
3505
|
-
deleteSegment = _useDestroySegment.mutate,
|
|
3506
|
-
isDeleting = _useDestroySegment.isLoading;
|
|
3507
|
-
var handleClearAll = function handleClearAll() {
|
|
3508
|
-
var params = buildUrlFromFilters({
|
|
3509
|
-
columns: columns,
|
|
3510
|
-
filters: [],
|
|
3511
|
-
isClearAll: true
|
|
3512
|
-
});
|
|
3513
|
-
history.push({
|
|
3514
|
-
search: params
|
|
3515
|
-
});
|
|
3516
|
-
};
|
|
3517
|
-
var handleDelete = function handleDelete() {
|
|
3518
|
-
equals(segment.id, segmentId) && handleClearAll();
|
|
3519
|
-
deleteSegment(segment.id, {
|
|
3520
|
-
onSuccess: onClose
|
|
3521
|
-
});
|
|
3522
|
-
};
|
|
3523
|
-
return /*#__PURE__*/React.createElement(Alert, {
|
|
3524
|
-
isOpen: isOpen,
|
|
3525
|
-
onClose: onClose,
|
|
3526
|
-
isSubmitting: isDeleting,
|
|
3527
|
-
submitButtonLabel: t("neetoFilters.common.delete"),
|
|
3528
|
-
title: t("neetoFilters.segments.deleteAlertTitle"),
|
|
3529
|
-
message: /*#__PURE__*/React.createElement(Trans, {
|
|
3530
|
-
i18nKey: "neetoFilters.segments.deleteAlertMessage",
|
|
3531
|
-
values: {
|
|
3532
|
-
entity: segment.name
|
|
3533
|
-
}
|
|
3534
|
-
}),
|
|
3535
|
-
onSubmit: handleDelete
|
|
3536
|
-
});
|
|
3537
|
-
};
|
|
3538
|
-
|
|
3539
|
-
var Card = function Card(_ref) {
|
|
3540
|
-
var segment = _ref.segment,
|
|
3541
|
-
columns = _ref.columns,
|
|
3542
|
-
defaultSegmentName = _ref.defaultSegmentName;
|
|
3543
|
-
var _useState = useState(false),
|
|
3544
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
3545
|
-
isEditing = _useState2[0],
|
|
3546
|
-
setIsEditing = _useState2[1];
|
|
3547
|
-
var _useState3 = useState(false),
|
|
3548
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
3549
|
-
isDeleteAlertOpen = _useState4[0],
|
|
3550
|
-
setIsDeleteAlertOpen = _useState4[1];
|
|
3551
|
-
var _useTranslation = useTranslation(),
|
|
3552
|
-
t = _useTranslation.t;
|
|
3553
|
-
var Menu = Dropdown$2.Menu,
|
|
3554
|
-
MenuItem = Dropdown$2.MenuItem;
|
|
3555
|
-
var _useUpdateSegment = useUpdateSegment(),
|
|
3556
|
-
updateSegment = _useUpdateSegment.mutate;
|
|
3557
|
-
var handleRename = function handleRename(values) {
|
|
3558
|
-
return updateSegment({
|
|
3559
|
-
id: segment.id,
|
|
3560
|
-
payload: values
|
|
3561
|
-
}, {
|
|
3562
|
-
onSuccess: function onSuccess() {
|
|
3563
|
-
return setIsEditing(false);
|
|
3564
|
-
}
|
|
3565
|
-
});
|
|
3566
|
-
};
|
|
3567
|
-
return /*#__PURE__*/React.createElement(Form, {
|
|
3568
|
-
className: "neeto-ui-rounded-md flex w-full items-center justify-between border p-2",
|
|
3569
|
-
formProps: {
|
|
3570
|
-
noValidate: true
|
|
3571
|
-
},
|
|
3572
|
-
formikProps: {
|
|
3573
|
-
initialValues: segment,
|
|
3574
|
-
validateOnChange: true,
|
|
3575
|
-
validateOnBlur: true,
|
|
3576
|
-
validationSchema: buildSegmentsValidationSchema(defaultSegmentName),
|
|
3577
|
-
onSubmit: handleRename,
|
|
3578
|
-
enableReinitialize: true
|
|
3579
|
-
}
|
|
3580
|
-
}, function (_ref2) {
|
|
3581
|
-
var resetForm = _ref2.resetForm;
|
|
3582
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, isEditing ? /*#__PURE__*/React.createElement(FormikInlineInput, {
|
|
3583
|
-
autoFocus: true,
|
|
3584
|
-
nakedInput: true,
|
|
3585
|
-
handleCancel: function handleCancel() {
|
|
3586
|
-
return setIsEditing(false);
|
|
3587
|
-
},
|
|
3588
|
-
name: "name",
|
|
3589
|
-
placeholder: t("neetoFilters.segments.name")
|
|
3590
|
-
}) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Typography, {
|
|
3591
|
-
style: "body2"
|
|
3592
|
-
}, segment.name), /*#__PURE__*/React.createElement(Dropdown$2, {
|
|
3593
|
-
buttonStyle: "text",
|
|
3594
|
-
disabled: isNotPresent(segment.id),
|
|
3595
|
-
icon: MenuHorizontal,
|
|
3596
|
-
size: "small"
|
|
3597
|
-
}, /*#__PURE__*/React.createElement(Menu, null, /*#__PURE__*/React.createElement(MenuItem.Button, {
|
|
3598
|
-
onClick: function onClick() {
|
|
3599
|
-
setIsEditing(true);
|
|
3600
|
-
resetForm();
|
|
3601
|
-
}
|
|
3602
|
-
}, t("neetoFilters.common.rename")), /*#__PURE__*/React.createElement(MenuItem.Button, {
|
|
3603
|
-
onClick: function onClick() {
|
|
3604
|
-
return setIsDeleteAlertOpen(true);
|
|
3605
|
-
}
|
|
3606
|
-
}, t("neetoFilters.common.delete"))))), /*#__PURE__*/React.createElement(DeleteAlert, {
|
|
3607
|
-
columns: columns,
|
|
3608
|
-
segment: segment,
|
|
3609
|
-
isOpen: isDeleteAlertOpen,
|
|
3610
|
-
onClose: function onClose() {
|
|
3611
|
-
return setIsDeleteAlertOpen(false);
|
|
3612
|
-
}
|
|
3613
|
-
}));
|
|
3614
|
-
});
|
|
3615
|
-
};
|
|
3616
|
-
var Card$1 = /*#__PURE__*/React.memo(Card);
|
|
3617
|
-
|
|
3618
|
-
var ManagePane = function ManagePane(_ref) {
|
|
3619
|
-
var isOpen = _ref.isOpen,
|
|
3620
|
-
onClose = _ref.onClose,
|
|
3621
|
-
entity = _ref.entity,
|
|
3622
|
-
columns = _ref.columns,
|
|
3623
|
-
defaultSegmentName = _ref.defaultSegmentName;
|
|
3624
|
-
var _useState = useState(""),
|
|
3625
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
3626
|
-
searchTerm = _useState2[0],
|
|
3627
|
-
setSearchTerm = _useState2[1];
|
|
3628
|
-
var inputRef = useRef(null);
|
|
3629
|
-
var _useTranslation = useTranslation(),
|
|
3630
|
-
t = _useTranslation.t;
|
|
3631
|
-
var debouncedSearchTerm = useDebounce(searchTerm);
|
|
3632
|
-
var _useFetchSegments = useFetchSegments({
|
|
3633
|
-
entity: entity,
|
|
3634
|
-
searchTerm: debouncedSearchTerm
|
|
3635
|
-
}),
|
|
3636
|
-
_useFetchSegments$dat = _useFetchSegments.data,
|
|
3637
|
-
segments = _useFetchSegments$dat === void 0 ? [] : _useFetchSegments$dat,
|
|
3638
|
-
isLoading = _useFetchSegments.isLoading;
|
|
3639
|
-
return /*#__PURE__*/React.createElement(Pane$1, {
|
|
3640
|
-
isOpen: isOpen,
|
|
3641
|
-
onClose: onClose,
|
|
3642
|
-
initialFocusRef: inputRef
|
|
3643
|
-
}, /*#__PURE__*/React.createElement(Pane$1.Header, null, /*#__PURE__*/React.createElement(Typography, {
|
|
3644
|
-
style: "h2"
|
|
3645
|
-
}, t("neetoFilters.segments.manageSegments"))), /*#__PURE__*/React.createElement(Pane$1.Body, {
|
|
3646
|
-
className: "max-h-full gap-4 overflow-scroll"
|
|
3647
|
-
}, /*#__PURE__*/React.createElement(Search, {
|
|
3648
|
-
className: "w-full flex-grow-0",
|
|
3649
|
-
placeholder: t("neetoFilters.segments.searchSegments"),
|
|
3650
|
-
ref: inputRef,
|
|
3651
|
-
onSearch: function onSearch(value) {
|
|
3652
|
-
return setSearchTerm(value);
|
|
3653
|
-
}
|
|
3654
|
-
}), isLoading ? /*#__PURE__*/React.createElement(Spinner, {
|
|
3655
|
-
className: "mx-auto mt-4"
|
|
3656
|
-
}) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Card$1, {
|
|
3657
|
-
segment: {
|
|
3658
|
-
name: defaultSegmentName
|
|
3659
|
-
}
|
|
3660
|
-
}), isEmpty(segments) ? /*#__PURE__*/React.createElement(Typography, {
|
|
3661
|
-
className: "mx-auto",
|
|
3662
|
-
style: "body2"
|
|
3663
|
-
}, t("neetoFilters.segments.noSegmentsFound")) : segments.map(function (segment) {
|
|
3664
|
-
return /*#__PURE__*/React.createElement(Card$1, {
|
|
3665
|
-
columns: columns,
|
|
3666
|
-
defaultSegmentName: defaultSegmentName,
|
|
3667
|
-
segment: segment,
|
|
3668
|
-
key: segment.id
|
|
3669
|
-
});
|
|
3670
|
-
}))));
|
|
3671
|
-
};
|
|
3672
|
-
|
|
3673
|
-
var ITEMS_MAX_COUNT = 20;
|
|
3674
|
-
|
|
3675
|
-
var MenuBlocks = function MenuBlocks(_ref) {
|
|
3676
|
-
var entity = _ref.entity,
|
|
3677
|
-
columns = _ref.columns,
|
|
3678
|
-
defaultSegmentName = _ref.defaultSegmentName;
|
|
3679
|
-
var _useState = useState(false),
|
|
3680
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
3681
|
-
showAll = _useState2[0],
|
|
3682
|
-
setShowAll = _useState2[1];
|
|
3683
|
-
var history = useHistory();
|
|
3684
|
-
var _useTranslation = useTranslation(),
|
|
3685
|
-
t = _useTranslation.t;
|
|
3686
|
-
var _getQueryParams = getQueryParams(),
|
|
3687
|
-
segmentId = _getQueryParams.segmentId;
|
|
3688
|
-
var appliedFilters = buildFiltersFromURL(columns);
|
|
3689
|
-
var _useFetchSegments = useFetchSegments({
|
|
3690
|
-
entity: entity
|
|
3691
|
-
}),
|
|
3692
|
-
_useFetchSegments$dat = _useFetchSegments.data,
|
|
3693
|
-
segments = _useFetchSegments$dat === void 0 ? [] : _useFetchSegments$dat,
|
|
3694
|
-
isLoading = _useFetchSegments.isLoading;
|
|
3695
|
-
var clearAppliedFilters = function clearAppliedFilters() {
|
|
3696
|
-
var _filters$, _filters$2;
|
|
3697
|
-
var filters = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : appliedFilters;
|
|
3698
|
-
history.push({
|
|
3699
|
-
search: buildUrlFromFilters({
|
|
3700
|
-
columns: columns,
|
|
3701
|
-
filters: [],
|
|
3702
|
-
isClearAll: true,
|
|
3703
|
-
childrenKeys: ((_filters$ = filters[0]) === null || _filters$ === void 0 ? void 0 : _filters$.conditions) && pluck("key", filterBy({
|
|
3704
|
-
node: "children"
|
|
3705
|
-
}, (_filters$2 = filters[0]) === null || _filters$2 === void 0 ? void 0 : _filters$2.conditions))
|
|
3706
|
-
})
|
|
3707
|
-
});
|
|
3708
|
-
};
|
|
3709
|
-
var applySelectedSegment = function applySelectedSegment(_ref2) {
|
|
3710
|
-
var _filters$3;
|
|
3711
|
-
var id = _ref2.id,
|
|
3712
|
-
filters = _ref2.filters;
|
|
3713
|
-
history.push({
|
|
3714
|
-
search: buildUrlFromSegment({
|
|
3715
|
-
columns: columns,
|
|
3716
|
-
filters: (_filters$3 = filters[0]) === null || _filters$3 === void 0 ? void 0 : _filters$3.conditions,
|
|
3717
|
-
id: id
|
|
3718
|
-
})
|
|
3719
|
-
});
|
|
3720
|
-
};
|
|
3721
|
-
var handleSelectSegment = function handleSelectSegment(_ref3) {
|
|
3722
|
-
var id = _ref3.id,
|
|
3723
|
-
filters = _ref3.filters;
|
|
3724
|
-
return equals(id, segmentId) ? clearAppliedFilters(filters) : applySelectedSegment({
|
|
3725
|
-
id: id,
|
|
3726
|
-
filters: filters
|
|
3727
|
-
});
|
|
3728
|
-
};
|
|
3729
|
-
if (isLoading) {
|
|
3730
|
-
return /*#__PURE__*/React.createElement(Spinner, null);
|
|
3731
|
-
}
|
|
3732
|
-
if (isEmpty(segments)) {
|
|
3733
|
-
return /*#__PURE__*/React.createElement(Typography, {
|
|
3734
|
-
style: "body2"
|
|
3735
|
-
}, t("neetoFilters.segments.noSegmentsFound"));
|
|
3736
|
-
}
|
|
3737
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, segments.length > ITEMS_MAX_COUNT && /*#__PURE__*/React.createElement(Button, {
|
|
3738
|
-
icon: Down,
|
|
3739
|
-
style: "link",
|
|
3740
|
-
label: showAll ? t("neetoFilters.segments.showLess") : t("neetoFilters.segments.showMoreNumbers", {
|
|
3741
|
-
entity: segments.length - ITEMS_MAX_COUNT
|
|
3742
|
-
}),
|
|
3743
|
-
onClick: function onClick() {
|
|
3744
|
-
return setShowAll(function (open) {
|
|
3745
|
-
return !open;
|
|
3746
|
-
});
|
|
3747
|
-
}
|
|
3748
|
-
}), /*#__PURE__*/React.createElement(MenuBar.Block, {
|
|
3749
|
-
active: isEmpty(appliedFilters),
|
|
3750
|
-
label: defaultSegmentName,
|
|
3751
|
-
onClick: clearAppliedFilters
|
|
3752
|
-
}), segments.slice(0, showAll ? segments.length : ITEMS_MAX_COUNT).map(function (segment) {
|
|
3753
|
-
return /*#__PURE__*/React.createElement(MenuBar.Block, {
|
|
3754
|
-
active: segment.id === segmentId,
|
|
3755
|
-
count: segment.count,
|
|
3756
|
-
key: segment.id,
|
|
3757
|
-
label: segment.name,
|
|
3758
|
-
onClick: function onClick() {
|
|
3759
|
-
return handleSelectSegment(segment);
|
|
3760
|
-
}
|
|
3761
|
-
});
|
|
3762
|
-
}));
|
|
3763
|
-
};
|
|
3764
|
-
var MenuBlocks$1 = /*#__PURE__*/React.memo(MenuBlocks);
|
|
3765
|
-
|
|
3766
|
-
var Segments = function Segments(_ref) {
|
|
3767
|
-
var entity = _ref.entity,
|
|
3768
|
-
columns = _ref.columns,
|
|
3769
|
-
_ref$setIsFilterPaneO = _ref.setIsFilterPaneOpen,
|
|
3770
|
-
setIsFilterPaneOpen = _ref$setIsFilterPaneO === void 0 ? noop$1 : _ref$setIsFilterPaneO,
|
|
3771
|
-
_ref$defaultSegmentNa = _ref.defaultSegmentName,
|
|
3772
|
-
defaultSegmentName = _ref$defaultSegmentNa === void 0 ? t$1("neetoFilters.common.allResults") : _ref$defaultSegmentNa;
|
|
3773
|
-
return function () {
|
|
3774
|
-
var _useState = useState(false),
|
|
3775
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
3776
|
-
isSegmentsPaneOpen = _useState2[0],
|
|
3777
|
-
setIsSegmentsPaneOpen = _useState2[1];
|
|
3778
|
-
var _useTranslation = useTranslation(),
|
|
3779
|
-
t = _useTranslation.t;
|
|
3780
|
-
var iconProps = [{
|
|
3781
|
-
icon: Settings,
|
|
3782
|
-
onClick: function onClick() {
|
|
3783
|
-
setIsFilterPaneOpen(false);
|
|
3784
|
-
setIsSegmentsPaneOpen(true);
|
|
3785
|
-
},
|
|
3786
|
-
tooltipProps: {
|
|
3787
|
-
content: t("neetoFilters.segments.manageSegments"),
|
|
3788
|
-
position: "top"
|
|
3789
|
-
}
|
|
3790
|
-
}];
|
|
3791
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(MenuBar.SubTitle, {
|
|
3792
|
-
iconProps: iconProps
|
|
3793
|
-
}, /*#__PURE__*/React.createElement(Typography, {
|
|
3794
|
-
component: "h4",
|
|
3795
|
-
style: "h5",
|
|
3796
|
-
textTransform: "uppercase",
|
|
3797
|
-
weight: "bold"
|
|
3798
|
-
}, t("neetoFilters.common.segments"))), /*#__PURE__*/React.createElement(MenuBlocks$1, {
|
|
3799
|
-
columns: columns,
|
|
3800
|
-
defaultSegmentName: defaultSegmentName,
|
|
3801
|
-
entity: entity
|
|
3802
|
-
}), /*#__PURE__*/React.createElement(ManagePane, {
|
|
3803
|
-
columns: columns,
|
|
3804
|
-
defaultSegmentName: defaultSegmentName,
|
|
3805
|
-
entity: entity,
|
|
3806
|
-
isOpen: isSegmentsPaneOpen,
|
|
3807
|
-
onClose: function onClose() {
|
|
3808
|
-
return setIsSegmentsPaneOpen(false);
|
|
3809
|
-
}
|
|
3810
|
-
}));
|
|
3811
|
-
}();
|
|
3812
|
-
};
|
|
3813
|
-
var index = /*#__PURE__*/React.memo(Segments);
|
|
3814
|
-
|
|
3815
|
-
export { Bar, Filters, index as Segments, buildFilterColumnsFromFields, buildFiltersFromURL, buildSelectorsFromURL, buildUrlFromFilters, buildUrlFromSegment, useDestroySegment, useFetchSegments, useUpdateSegment };
|
|
3816
|
-
//# sourceMappingURL=index.js.map
|