@cakemail-org/ui-components-v2 2.0.59 → 2.0.60

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.
Files changed (5) hide show
  1. package/dist/cjs/components/filterBar/types.d.ts +11 -8
  2. package/dist/cjs/index.js +20 -18
  3. package/dist/esm/components/filterBar/types.d.ts +11 -8
  4. package/dist/esm/index.js +20 -18
  5. package/package.json +1 -1
package/dist/cjs/components/filterBar/types.d.ts CHANGED
@@ -20,14 +20,18 @@ export type TFilterBar = {
20
20
  })[];
21
21
  dropMenuProps?: {
22
22
  tabs?: Pick<TSubNavItem, "name" | "text" | "disabled">[];
23
- actions?: {
24
- tab: string;
25
- text: string;
26
- onClick: TButtonClick;
27
- }[];
28
- emptyTexts?: TFilterBarText[];
29
- titles?: TFilterBarText[];
30
23
  disabledTabs?: string[];
24
+ options?: {
25
+ [tabName: string]: {
26
+ action?: {
27
+ text: string;
28
+ onClick: TButtonClick;
29
+ };
30
+ emptyText?: TFilterBarText;
31
+ title?: TFilterBarText;
32
+ disableLocalSearch?: boolean;
33
+ };
34
+ };
31
35
  };
32
36
  replacePartial?: boolean;
33
37
  onSearchUpdate?: ({ value, tab }: TFilterBarSearchUpdate) => void;
@@ -50,5 +54,4 @@ export type TFilterBarFilterTerm = {
50
54
  export type TFilterBarText = {
51
55
  text?: string;
52
56
  desc?: string;
53
- tab: string;
54
57
  };
package/dist/cjs/index.js CHANGED
@@ -8748,13 +8748,13 @@ var css_248z$9 = ".filter-bar-component-v2 {\n background: var(--cloud, #F4F4F4
8748
8748
  styleInject(css_248z$9);
8749
8749
 
8750
8750
  function FilterBar(_a) {
8751
- var _b, _c, _d, _e, _f;
8751
+ var _b, _c, _d, _e, _f, _g, _h, _j;
8752
8752
  var operatorOptions = _a.operatorOptions, initOperatorValue = _a.initOperatorValue, operatorValue = _a.operatorValue, onSave = _a.onSave, saveTxt = _a.saveTxt, onClear = _a.onClear, clearTxt = _a.clearTxt, onUpdate = _a.onUpdate, onSearchUpdate = _a.onSearchUpdate, loading = _a.loading, addFilterTxt = _a.addFilterTxt, filterTerms = _a.filterTerms, initFilterTerms = _a.initFilterTerms, dropMenuOptions = _a.dropMenuOptions, dropMenuProps = _a.dropMenuProps, replacePartial = _a.replacePartial;
8753
- var _g = React.useState(false), showSearch = _g[0], setShowSearch = _g[1];
8754
- var _h = React.useState(""), search = _h[0], setSearch = _h[1];
8755
- var _j = React.useState((_c = (_b = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.tabs) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.name), selectedTab = _j[0], setSelectedTab = _j[1];
8756
- var _k = React.useState(filterTerms !== undefined ? filterTerms : initFilterTerms !== undefined ? initFilterTerms : []), filterTermState = _k[0], setFilterTermState = _k[1];
8757
- var _l = React.useState(operatorValue !== undefined ? operatorValue : initOperatorValue !== undefined ? initOperatorValue : exports.EOperatorTypes.and), operatorState = _l[0], setOperatorState = _l[1];
8753
+ var _k = React.useState(false), showSearch = _k[0], setShowSearch = _k[1];
8754
+ var _l = React.useState(""), search = _l[0], setSearch = _l[1];
8755
+ var _m = React.useState((_c = (_b = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.tabs) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.name), selectedTab = _m[0], setSelectedTab = _m[1];
8756
+ var _o = React.useState(filterTerms !== undefined ? filterTerms : initFilterTerms !== undefined ? initFilterTerms : []), filterTermState = _o[0], setFilterTermState = _o[1];
8757
+ var _p = React.useState(operatorValue !== undefined ? operatorValue : initOperatorValue !== undefined ? initOperatorValue : exports.EOperatorTypes.and), operatorState = _p[0], setOperatorState = _p[1];
8758
8758
  var cFilterTerms = filterTerms !== undefined ? filterTerms : filterTermState;
8759
8759
  var cOperatorValue = operatorValue !== undefined ? operatorValue : operatorState;
8760
8760
  React.useEffect(handleSearchFocus, [showSearch]);
@@ -8824,23 +8824,26 @@ function FilterBar(_a) {
8824
8824
  function handleFilterSets(event, item) {
8825
8825
  setSelectedTab(item.name);
8826
8826
  }
8827
- // Filter out current pills & search
8828
- dropMenuOptions = dropMenuOptions === null || dropMenuOptions === void 0 ? void 0 : dropMenuOptions.filter(function (i) {
8829
- var _a, _b;
8830
- var item = (_a = cFilterTerms.find(function (cF) { return i.value === cF.value; })) === null || _a === void 0 ? void 0 : _a.value;
8831
- return (i.value !== item || i.value == null) && ((_b = i.value) === null || _b === void 0 ? void 0 : _b.includes(search));
8832
- });
8833
8827
  //Filter current set
8834
8828
  dropMenuOptions = dropMenuOptions === null || dropMenuOptions === void 0 ? void 0 : dropMenuOptions.filter(function (i) {
8835
8829
  return i.tab === selectedTab;
8836
8830
  });
8831
+ // Filter out current pills & search
8832
+ dropMenuOptions = dropMenuOptions === null || dropMenuOptions === void 0 ? void 0 : dropMenuOptions.filter(function (i) {
8833
+ var _a, _b, _c, _d;
8834
+ if ((_b = (_a = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.options) === null || _a === void 0 ? void 0 : _a[i.tab || ""]) === null || _b === void 0 ? void 0 : _b.disableLocalSearch) {
8835
+ return true;
8836
+ }
8837
+ var item = (_c = cFilterTerms.find(function (cF) { return i.value === cF.value; })) === null || _c === void 0 ? void 0 : _c.value;
8838
+ return (i.value !== item || i.value == null) && ((_d = i.value) === null || _d === void 0 ? void 0 : _d.includes(search));
8839
+ });
8837
8840
  //set onClick
8838
8841
  dropMenuOptions = dropMenuOptions === null || dropMenuOptions === void 0 ? void 0 : dropMenuOptions.map(function (i) {
8839
8842
  var _a;
8840
8843
  return __assign(__assign({}, i), { disabled: (_a = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.disabledTabs) === null || _a === void 0 ? void 0 : _a.includes(i.tab), onClick: function () { handleDropMenuClick(i === null || i === void 0 ? void 0 : i.value); } });
8841
8844
  });
8842
8845
  if (dropMenuOptions && (dropMenuOptions === null || dropMenuOptions === void 0 ? void 0 : dropMenuOptions.length) > 0) {
8843
- var foundTitle = (_d = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.titles) === null || _d === void 0 ? void 0 : _d.find(function (title) { return selectedTab === title.tab; });
8846
+ var foundTitle = (_e = (_d = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.options) === null || _d === void 0 ? void 0 : _d[selectedTab || ""]) === null || _e === void 0 ? void 0 : _e.title;
8844
8847
  if (foundTitle) {
8845
8848
  dropMenuOptions.unshift({
8846
8849
  tab: selectedTab || "partial",
@@ -8851,7 +8854,7 @@ function FilterBar(_a) {
8851
8854
  }
8852
8855
  }
8853
8856
  if (dropMenuOptions && (dropMenuOptions === null || dropMenuOptions === void 0 ? void 0 : dropMenuOptions.length) === 0) {
8854
- var foundEmptyText = (_e = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.emptyTexts) === null || _e === void 0 ? void 0 : _e.find(function (text) { return selectedTab === text.tab; });
8857
+ var foundEmptyText = (_g = (_f = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.options) === null || _f === void 0 ? void 0 : _f[selectedTab || ""]) === null || _g === void 0 ? void 0 : _g.emptyText;
8855
8858
  if (foundEmptyText) {
8856
8859
  dropMenuOptions.push({
8857
8860
  tab: selectedTab || "partial",
@@ -8861,7 +8864,7 @@ function FilterBar(_a) {
8861
8864
  });
8862
8865
  }
8863
8866
  }
8864
- var currentActionSet = (_f = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.actions) === null || _f === void 0 ? void 0 : _f.find(function (action) { return selectedTab === action.tab; });
8867
+ var currentAction = (_j = (_h = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.options) === null || _h === void 0 ? void 0 : _h[selectedTab || ""]) === null || _j === void 0 ? void 0 : _j.action;
8865
8868
  if (dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.tabs) {
8866
8869
  dropMenuProps.tabs = dropMenuProps.tabs.map(function (t) {
8867
8870
  var _a;
@@ -8880,15 +8883,14 @@ function FilterBar(_a) {
8880
8883
  React.createElement(material.Stack, { className: "dropMenuContainer" },
8881
8884
  (dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.tabs) && dropMenuProps.tabs.length > 1 && React.createElement(SubNav, { initialSelected: selectedTab, items: dropMenuProps.tabs, onClick: handleFilterSets }),
8882
8885
  React.createElement(DropMenu, { inlineMenu: true, options: dropMenuOptions }),
8883
- currentActionSet && React.createElement(Button, { color: "cloud", onClick: currentActionSet.onClick }, currentActionSet.text)))),
8886
+ currentAction && React.createElement(Button, { color: "cloud", onClick: currentAction.onClick }, currentAction.text)))),
8884
8887
  !showSearch &&
8885
8888
  React.createElement(material.Link, { color: "secondary", onClick: handleShowSearch, alignItems: "center", justifyContent: "center", display: "flex", gap: 3 },
8886
8889
  React.createElement(Icon, { name: "Add18", color: "secondary" }),
8887
8890
  " ",
8888
8891
  addFilterTxt)),
8889
8892
  React.createElement(material.Stack, { direction: "row", className: "pillContainer ".concat(cFilterTerms.length === 0 ? "empty" : ""), alignItems: "center", justifyContent: "flex-start", flex: 1, gap: 2 }, cFilterTerms.map(function (term) {
8890
- var _a;
8891
- var isDisabled = (_a = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.disabledTabs) === null || _a === void 0 ? void 0 : _a.includes(String(term.tab));
8893
+ var isDisabled = Object.keys((dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.options) || {}).includes(String(term.tab));
8892
8894
  var isPartial = term.tab === "partial";
8893
8895
  return React.createElement(Chip, { className: isDisabled ? "disabled" : "", label: isPartial ? React.createElement(React.Fragment, null,
8894
8896
  " ",
package/dist/esm/components/filterBar/types.d.ts CHANGED
@@ -20,14 +20,18 @@ export type TFilterBar = {
20
20
  })[];
21
21
  dropMenuProps?: {
22
22
  tabs?: Pick<TSubNavItem, "name" | "text" | "disabled">[];
23
- actions?: {
24
- tab: string;
25
- text: string;
26
- onClick: TButtonClick;
27
- }[];
28
- emptyTexts?: TFilterBarText[];
29
- titles?: TFilterBarText[];
30
23
  disabledTabs?: string[];
24
+ options?: {
25
+ [tabName: string]: {
26
+ action?: {
27
+ text: string;
28
+ onClick: TButtonClick;
29
+ };
30
+ emptyText?: TFilterBarText;
31
+ title?: TFilterBarText;
32
+ disableLocalSearch?: boolean;
33
+ };
34
+ };
31
35
  };
32
36
  replacePartial?: boolean;
33
37
  onSearchUpdate?: ({ value, tab }: TFilterBarSearchUpdate) => void;
@@ -50,5 +54,4 @@ export type TFilterBarFilterTerm = {
50
54
  export type TFilterBarText = {
51
55
  text?: string;
52
56
  desc?: string;
53
- tab: string;
54
57
  };
package/dist/esm/index.js CHANGED
@@ -8728,13 +8728,13 @@ var css_248z$9 = ".filter-bar-component-v2 {\n background: var(--cloud, #F4F4F4
8728
8728
  styleInject(css_248z$9);
8729
8729
 
8730
8730
  function FilterBar(_a) {
8731
- var _b, _c, _d, _e, _f;
8731
+ var _b, _c, _d, _e, _f, _g, _h, _j;
8732
8732
  var operatorOptions = _a.operatorOptions, initOperatorValue = _a.initOperatorValue, operatorValue = _a.operatorValue, onSave = _a.onSave, saveTxt = _a.saveTxt, onClear = _a.onClear, clearTxt = _a.clearTxt, onUpdate = _a.onUpdate, onSearchUpdate = _a.onSearchUpdate, loading = _a.loading, addFilterTxt = _a.addFilterTxt, filterTerms = _a.filterTerms, initFilterTerms = _a.initFilterTerms, dropMenuOptions = _a.dropMenuOptions, dropMenuProps = _a.dropMenuProps, replacePartial = _a.replacePartial;
8733
- var _g = useState(false), showSearch = _g[0], setShowSearch = _g[1];
8734
- var _h = useState(""), search = _h[0], setSearch = _h[1];
8735
- var _j = useState((_c = (_b = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.tabs) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.name), selectedTab = _j[0], setSelectedTab = _j[1];
8736
- var _k = useState(filterTerms !== undefined ? filterTerms : initFilterTerms !== undefined ? initFilterTerms : []), filterTermState = _k[0], setFilterTermState = _k[1];
8737
- var _l = useState(operatorValue !== undefined ? operatorValue : initOperatorValue !== undefined ? initOperatorValue : EOperatorTypes.and), operatorState = _l[0], setOperatorState = _l[1];
8733
+ var _k = useState(false), showSearch = _k[0], setShowSearch = _k[1];
8734
+ var _l = useState(""), search = _l[0], setSearch = _l[1];
8735
+ var _m = useState((_c = (_b = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.tabs) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.name), selectedTab = _m[0], setSelectedTab = _m[1];
8736
+ var _o = useState(filterTerms !== undefined ? filterTerms : initFilterTerms !== undefined ? initFilterTerms : []), filterTermState = _o[0], setFilterTermState = _o[1];
8737
+ var _p = useState(operatorValue !== undefined ? operatorValue : initOperatorValue !== undefined ? initOperatorValue : EOperatorTypes.and), operatorState = _p[0], setOperatorState = _p[1];
8738
8738
  var cFilterTerms = filterTerms !== undefined ? filterTerms : filterTermState;
8739
8739
  var cOperatorValue = operatorValue !== undefined ? operatorValue : operatorState;
8740
8740
  useEffect(handleSearchFocus, [showSearch]);
@@ -8804,23 +8804,26 @@ function FilterBar(_a) {
8804
8804
  function handleFilterSets(event, item) {
8805
8805
  setSelectedTab(item.name);
8806
8806
  }
8807
- // Filter out current pills & search
8808
- dropMenuOptions = dropMenuOptions === null || dropMenuOptions === void 0 ? void 0 : dropMenuOptions.filter(function (i) {
8809
- var _a, _b;
8810
- var item = (_a = cFilterTerms.find(function (cF) { return i.value === cF.value; })) === null || _a === void 0 ? void 0 : _a.value;
8811
- return (i.value !== item || i.value == null) && ((_b = i.value) === null || _b === void 0 ? void 0 : _b.includes(search));
8812
- });
8813
8807
  //Filter current set
8814
8808
  dropMenuOptions = dropMenuOptions === null || dropMenuOptions === void 0 ? void 0 : dropMenuOptions.filter(function (i) {
8815
8809
  return i.tab === selectedTab;
8816
8810
  });
8811
+ // Filter out current pills & search
8812
+ dropMenuOptions = dropMenuOptions === null || dropMenuOptions === void 0 ? void 0 : dropMenuOptions.filter(function (i) {
8813
+ var _a, _b, _c, _d;
8814
+ if ((_b = (_a = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.options) === null || _a === void 0 ? void 0 : _a[i.tab || ""]) === null || _b === void 0 ? void 0 : _b.disableLocalSearch) {
8815
+ return true;
8816
+ }
8817
+ var item = (_c = cFilterTerms.find(function (cF) { return i.value === cF.value; })) === null || _c === void 0 ? void 0 : _c.value;
8818
+ return (i.value !== item || i.value == null) && ((_d = i.value) === null || _d === void 0 ? void 0 : _d.includes(search));
8819
+ });
8817
8820
  //set onClick
8818
8821
  dropMenuOptions = dropMenuOptions === null || dropMenuOptions === void 0 ? void 0 : dropMenuOptions.map(function (i) {
8819
8822
  var _a;
8820
8823
  return __assign(__assign({}, i), { disabled: (_a = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.disabledTabs) === null || _a === void 0 ? void 0 : _a.includes(i.tab), onClick: function () { handleDropMenuClick(i === null || i === void 0 ? void 0 : i.value); } });
8821
8824
  });
8822
8825
  if (dropMenuOptions && (dropMenuOptions === null || dropMenuOptions === void 0 ? void 0 : dropMenuOptions.length) > 0) {
8823
- var foundTitle = (_d = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.titles) === null || _d === void 0 ? void 0 : _d.find(function (title) { return selectedTab === title.tab; });
8826
+ var foundTitle = (_e = (_d = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.options) === null || _d === void 0 ? void 0 : _d[selectedTab || ""]) === null || _e === void 0 ? void 0 : _e.title;
8824
8827
  if (foundTitle) {
8825
8828
  dropMenuOptions.unshift({
8826
8829
  tab: selectedTab || "partial",
@@ -8831,7 +8834,7 @@ function FilterBar(_a) {
8831
8834
  }
8832
8835
  }
8833
8836
  if (dropMenuOptions && (dropMenuOptions === null || dropMenuOptions === void 0 ? void 0 : dropMenuOptions.length) === 0) {
8834
- var foundEmptyText = (_e = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.emptyTexts) === null || _e === void 0 ? void 0 : _e.find(function (text) { return selectedTab === text.tab; });
8837
+ var foundEmptyText = (_g = (_f = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.options) === null || _f === void 0 ? void 0 : _f[selectedTab || ""]) === null || _g === void 0 ? void 0 : _g.emptyText;
8835
8838
  if (foundEmptyText) {
8836
8839
  dropMenuOptions.push({
8837
8840
  tab: selectedTab || "partial",
@@ -8841,7 +8844,7 @@ function FilterBar(_a) {
8841
8844
  });
8842
8845
  }
8843
8846
  }
8844
- var currentActionSet = (_f = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.actions) === null || _f === void 0 ? void 0 : _f.find(function (action) { return selectedTab === action.tab; });
8847
+ var currentAction = (_j = (_h = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.options) === null || _h === void 0 ? void 0 : _h[selectedTab || ""]) === null || _j === void 0 ? void 0 : _j.action;
8845
8848
  if (dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.tabs) {
8846
8849
  dropMenuProps.tabs = dropMenuProps.tabs.map(function (t) {
8847
8850
  var _a;
@@ -8860,15 +8863,14 @@ function FilterBar(_a) {
8860
8863
  React__default.createElement(Stack$1, { className: "dropMenuContainer" },
8861
8864
  (dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.tabs) && dropMenuProps.tabs.length > 1 && React__default.createElement(SubNav, { initialSelected: selectedTab, items: dropMenuProps.tabs, onClick: handleFilterSets }),
8862
8865
  React__default.createElement(DropMenu, { inlineMenu: true, options: dropMenuOptions }),
8863
- currentActionSet && React__default.createElement(Button, { color: "cloud", onClick: currentActionSet.onClick }, currentActionSet.text)))),
8866
+ currentAction && React__default.createElement(Button, { color: "cloud", onClick: currentAction.onClick }, currentAction.text)))),
8864
8867
  !showSearch &&
8865
8868
  React__default.createElement(Link, { color: "secondary", onClick: handleShowSearch, alignItems: "center", justifyContent: "center", display: "flex", gap: 3 },
8866
8869
  React__default.createElement(Icon, { name: "Add18", color: "secondary" }),
8867
8870
  " ",
8868
8871
  addFilterTxt)),
8869
8872
  React__default.createElement(Stack$1, { direction: "row", className: "pillContainer ".concat(cFilterTerms.length === 0 ? "empty" : ""), alignItems: "center", justifyContent: "flex-start", flex: 1, gap: 2 }, cFilterTerms.map(function (term) {
8870
- var _a;
8871
- var isDisabled = (_a = dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.disabledTabs) === null || _a === void 0 ? void 0 : _a.includes(String(term.tab));
8873
+ var isDisabled = Object.keys((dropMenuProps === null || dropMenuProps === void 0 ? void 0 : dropMenuProps.options) || {}).includes(String(term.tab));
8872
8874
  var isPartial = term.tab === "partial";
8873
8875
  return React__default.createElement(Chip, { className: isDisabled ? "disabled" : "", label: isPartial ? React__default.createElement(React__default.Fragment, null,
8874
8876
  " ",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cakemail-org/ui-components-v2",
3
- "version": "2.0.59",
3
+ "version": "2.0.60",
4
4
  "description": "ui library kit made with material UI",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",