@ikas/core 1.0.6 → 1.0.8

package/dist/index168.js

@@ -1,288 +1,25 @@
-import i from "react";
-import p from "./index151.js";
-import { isValidHex as f } from "./index163.js";
-import h from "./index212.js";
-import "./index152.js";
-import "./index153.js";
-import { EditableInput as s } from "./index154.js";
-import "./index155.js";
-import "./index156.js";
-import "./index157.js";
-import "./index159.js";
-import u from "./index213.js";
-var g = /* @__PURE__ */ (function() {
-  function n(l, r) {
-    for (var t = 0; t < r.length; t++) {
-      var e = r[t];
-      e.enumerable = e.enumerable || !1, e.configurable = !0, "value" in e && (e.writable = !0), Object.defineProperty(l, e.key, e);
+import o from "react";
+import a from "./index143.js";
+var s = function(e) {
+  var t = e.hsl, r = a({
+    default: {
+      picker: {
+        width: "12px",
+        height: "12px",
+        borderRadius: "6px",
+        boxShadow: "inset 0 0 0 1px #fff",
+        transform: "translate(-6px, -6px)"
+      }
+    },
+    "black-outline": {
+      picker: {
+        boxShadow: "inset 0 0 0 1px #000"
+      }
     }
-  }
-  return function(l, r, t) {
-    return r && n(l.prototype, r), t && n(l, t), l;
-  };
-})();
-function c(n, l) {
-  if (!(n instanceof l))
-    throw new TypeError("Cannot call a class as a function");
-}
-function b(n, l) {
-  if (!n)
-    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
-  return l && (typeof l == "object" || typeof l == "function") ? l : n;
-}
-function m(n, l) {
-  if (typeof l != "function" && l !== null)
-    throw new TypeError("Super expression must either be null or a function, not " + typeof l);
-  n.prototype = Object.create(l && l.prototype, { constructor: { value: n, enumerable: !1, writable: !0, configurable: !0 } }), l && (Object.setPrototypeOf ? Object.setPrototypeOf(n, l) : n.__proto__ = l);
-}
-var v = (function(n) {
-  m(l, n);
-  function l(r) {
-    c(this, l);
-    var t = b(this, (l.__proto__ || Object.getPrototypeOf(l)).call(this));
-    return t.toggleViews = function() {
-      t.state.view === "hex" ? t.setState({ view: "rgb" }) : t.state.view === "rgb" ? t.setState({ view: "hsl" }) : t.state.view === "hsl" && (t.props.hsl.a === 1 ? t.setState({ view: "hex" }) : t.setState({ view: "rgb" }));
-    }, t.handleChange = function(e, o) {
-      e.hex ? f(e.hex) && t.props.onChange({
-        hex: e.hex,
-        source: "hex"
-      }, o) : e.r || e.g || e.b ? t.props.onChange({
-        r: e.r || t.props.rgb.r,
-        g: e.g || t.props.rgb.g,
-        b: e.b || t.props.rgb.b,
-        source: "rgb"
-      }, o) : e.a ? (e.a < 0 ? e.a = 0 : e.a > 1 && (e.a = 1), t.props.onChange({
-        h: t.props.hsl.h,
-        s: t.props.hsl.s,
-        l: t.props.hsl.l,
-        a: Math.round(e.a * 100) / 100,
-        source: "rgb"
-      }, o)) : (e.h || e.s || e.l) && (typeof e.s == "string" && e.s.includes("%") && (e.s = e.s.replace("%", "")), typeof e.l == "string" && e.l.includes("%") && (e.l = e.l.replace("%", "")), e.s == 1 ? e.s = 0.01 : e.l == 1 && (e.l = 0.01), t.props.onChange({
-        h: e.h || t.props.hsl.h,
-        s: Number(h(e.s) ? t.props.hsl.s : e.s),
-        l: Number(h(e.l) ? t.props.hsl.l : e.l),
-        source: "hsl"
-      }, o));
-    }, t.showHighlight = function(e) {
-      e.currentTarget.style.background = "#eee";
-    }, t.hideHighlight = function(e) {
-      e.currentTarget.style.background = "transparent";
-    }, r.hsl.a !== 1 && r.view === "hex" ? t.state = {
-      view: "rgb"
-    } : t.state = {
-      view: r.view
-    }, t;
-  }
-  return g(l, [{
-    key: "render",
-    value: function() {
-      var t = this, e = p({
-        default: {
-          wrap: {
-            paddingTop: "16px",
-            display: "flex"
-          },
-          fields: {
-            flex: "1",
-            display: "flex",
-            marginLeft: "-6px"
-          },
-          field: {
-            paddingLeft: "6px",
-            width: "100%"
-          },
-          alpha: {
-            paddingLeft: "6px",
-            width: "100%"
-          },
-          toggle: {
-            width: "32px",
-            textAlign: "right",
-            position: "relative"
-          },
-          icon: {
-            marginRight: "-4px",
-            marginTop: "12px",
-            cursor: "pointer",
-            position: "relative"
-          },
-          iconHighlight: {
-            position: "absolute",
-            width: "24px",
-            height: "28px",
-            background: "#eee",
-            borderRadius: "4px",
-            top: "10px",
-            left: "12px",
-            display: "none"
-          },
-          input: {
-            fontSize: "11px",
-            color: "#333",
-            width: "100%",
-            borderRadius: "2px",
-            border: "none",
-            boxShadow: "inset 0 0 0 1px #dadada",
-            height: "21px",
-            textAlign: "center"
-          },
-          label: {
-            textTransform: "uppercase",
-            fontSize: "11px",
-            lineHeight: "11px",
-            color: "#969696",
-            textAlign: "center",
-            display: "block",
-            marginTop: "12px"
-          },
-          svg: {
-            fill: "#333",
-            width: "24px",
-            height: "24px",
-            border: "1px transparent solid",
-            borderRadius: "5px"
-          }
-        },
-        disableAlpha: {
-          alpha: {
-            display: "none"
-          }
-        }
-      }, this.props, this.state), o = void 0;
-      return this.state.view === "hex" ? o = i.createElement(
-        "div",
-        { style: e.fields, className: "flexbox-fix" },
-        i.createElement(
-          "div",
-          { style: e.field },
-          i.createElement(s, {
-            style: { input: e.input, label: e.label },
-            label: "hex",
-            value: this.props.hex,
-            onChange: this.handleChange
-          })
-        )
-      ) : this.state.view === "rgb" ? o = i.createElement(
-        "div",
-        { style: e.fields, className: "flexbox-fix" },
-        i.createElement(
-          "div",
-          { style: e.field },
-          i.createElement(s, {
-            style: { input: e.input, label: e.label },
-            label: "r",
-            value: this.props.rgb.r,
-            onChange: this.handleChange
-          })
-        ),
-        i.createElement(
-          "div",
-          { style: e.field },
-          i.createElement(s, {
-            style: { input: e.input, label: e.label },
-            label: "g",
-            value: this.props.rgb.g,
-            onChange: this.handleChange
-          })
-        ),
-        i.createElement(
-          "div",
-          { style: e.field },
-          i.createElement(s, {
-            style: { input: e.input, label: e.label },
-            label: "b",
-            value: this.props.rgb.b,
-            onChange: this.handleChange
-          })
-        ),
-        i.createElement(
-          "div",
-          { style: e.alpha },
-          i.createElement(s, {
-            style: { input: e.input, label: e.label },
-            label: "a",
-            value: this.props.rgb.a,
-            arrowOffset: 0.01,
-            onChange: this.handleChange
-          })
-        )
-      ) : this.state.view === "hsl" && (o = i.createElement(
-        "div",
-        { style: e.fields, className: "flexbox-fix" },
-        i.createElement(
-          "div",
-          { style: e.field },
-          i.createElement(s, {
-            style: { input: e.input, label: e.label },
-            label: "h",
-            value: Math.round(this.props.hsl.h),
-            onChange: this.handleChange
-          })
-        ),
-        i.createElement(
-          "div",
-          { style: e.field },
-          i.createElement(s, {
-            style: { input: e.input, label: e.label },
-            label: "s",
-            value: Math.round(this.props.hsl.s * 100) + "%",
-            onChange: this.handleChange
-          })
-        ),
-        i.createElement(
-          "div",
-          { style: e.field },
-          i.createElement(s, {
-            style: { input: e.input, label: e.label },
-            label: "l",
-            value: Math.round(this.props.hsl.l * 100) + "%",
-            onChange: this.handleChange
-          })
-        ),
-        i.createElement(
-          "div",
-          { style: e.alpha },
-          i.createElement(s, {
-            style: { input: e.input, label: e.label },
-            label: "a",
-            value: this.props.hsl.a,
-            arrowOffset: 0.01,
-            onChange: this.handleChange
-          })
-        )
-      )), i.createElement(
-        "div",
-        { style: e.wrap, className: "flexbox-fix" },
-        o,
-        i.createElement(
-          "div",
-          { style: e.toggle },
-          i.createElement(
-            "div",
-            { style: e.icon, onClick: this.toggleViews, ref: function(a) {
-              return t.icon = a;
-            } },
-            i.createElement(u, {
-              style: e.svg,
-              onMouseOver: this.showHighlight,
-              onMouseEnter: this.showHighlight,
-              onMouseOut: this.hideHighlight
-            })
-          )
-        )
-      );
-    }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function(t, e) {
-      return t.hsl.a !== 1 && e.view === "hex" ? { view: "rgb" } : null;
-    }
-  }]), l;
-})(i.Component);
-v.defaultProps = {
-  view: "hex"
+  }, { "black-outline": t.l > 0.5 });
+  return o.createElement("div", { style: r.picker });
 };
 export {
-  v as ChromeFields,
-  v as default
+  s as PhotoshopPointerCircle,
+  s as default
 };

package/dist/index169.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react"),o=require("./index151.cjs");var e=function(){var r=o.default({default:{picker:{width:"12px",height:"12px",borderRadius:"6px",transform:"translate(-6px, -1px)",backgroundColor:"rgb(248, 248, 248)",boxShadow:"0 1px 4px 0 rgba(0, 0, 0, 0.37)"}}});return t.createElement("div",{style:r.picker})};exports.ChromePointer=e;exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react"),n=require("./index143.cjs");var r=function(){var e=n.default({default:{triangle:{width:0,height:0,borderStyle:"solid",borderWidth:"4px 0 4px 6px",borderColor:"transparent transparent transparent #fff",position:"absolute",top:"1px",left:"1px"},triangleBorder:{width:0,height:0,borderStyle:"solid",borderWidth:"5px 0 5px 8px",borderColor:"transparent transparent transparent #555"},left:{Extend:"triangleBorder",transform:"translate(-13px, -4px)"},leftInside:{Extend:"triangle",transform:"translate(-8px, -5px)"},right:{Extend:"triangleBorder",transform:"translate(20px, -14px) rotate(180deg)"},rightInside:{Extend:"triangle",transform:"translate(-8px, -5px)"}}});return t.createElement("div",{style:e.pointer},t.createElement("div",{style:e.left},t.createElement("div",{style:e.leftInside})),t.createElement("div",{style:e.right},t.createElement("div",{style:e.rightInside})))};exports.PhotoshopPointerCircle=r;exports.default=r;

package/dist/index169.js

@@ -1,21 +1,59 @@
 import e from "react";
-import t from "./index151.js";
-var i = function() {
-  var r = t({
+import r from "./index143.js";
+var l = function() {
+  var t = r({
     default: {
-      picker: {
-        width: "12px",
-        height: "12px",
-        borderRadius: "6px",
-        transform: "translate(-6px, -1px)",
-        backgroundColor: "rgb(248, 248, 248)",
-        boxShadow: "0 1px 4px 0 rgba(0, 0, 0, 0.37)"
+      triangle: {
+        width: 0,
+        height: 0,
+        borderStyle: "solid",
+        borderWidth: "4px 0 4px 6px",
+        borderColor: "transparent transparent transparent #fff",
+        position: "absolute",
+        top: "1px",
+        left: "1px"
+      },
+      triangleBorder: {
+        width: 0,
+        height: 0,
+        borderStyle: "solid",
+        borderWidth: "5px 0 5px 8px",
+        borderColor: "transparent transparent transparent #555"
+      },
+      left: {
+        Extend: "triangleBorder",
+        transform: "translate(-13px, -4px)"
+      },
+      leftInside: {
+        Extend: "triangle",
+        transform: "translate(-8px, -5px)"
+      },
+      right: {
+        Extend: "triangleBorder",
+        transform: "translate(20px, -14px) rotate(180deg)"
+      },
+      rightInside: {
+        Extend: "triangle",
+        transform: "translate(-8px, -5px)"
       }
     }
   });
-  return e.createElement("div", { style: r.picker });
+  return e.createElement(
+    "div",
+    { style: t.pointer },
+    e.createElement(
+      "div",
+      { style: t.left },
+      e.createElement("div", { style: t.leftInside })
+    ),
+    e.createElement(
+      "div",
+      { style: t.right },
+      e.createElement("div", { style: t.rightInside })
+    )
+  );
 };
 export {
-  i as ChromePointer,
-  i as default
+  l as PhotoshopPointerCircle,
+  l as default
 };

package/dist/index17.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),s=require("react"),ce=require("mobx-react-lite"),c=require("mobx"),a=require("@ikas/ui"),y=require("./index3.cjs"),x=require("./index14.cjs"),ue=require("./index15.cjs"),he=require("./index56.cjs"),U=require("./index57.cjs"),de=require("./index18.cjs"),pe=require("./index58.cjs"),fe=require("./index59.cjs"),ve=require("./index60.cjs"),u=require("./index5.cjs"),me=require("./index61.cjs"),ge=require("./index62.cjs"),be=require("./index63.cjs");function xe(V){var _;const{dataTableViewModel:n,filterManagerModel:e,customFilterSearchLeftContent:E,customFilterSearchRightContent:S,searchProps:l,style:J,isVisibleSelectedView:K,customSelectedContent:z,getClonedFilterManager:d,setSelectedData:v,filterPopoverPlacement:W}=V,[H,T]=s.useState(!1),[G,j]=s.useState(!1),[Q,w]=s.useState(!1),[p,N]=s.useState(null),[m,g]=s.useState(null),[k,b]=s.useState(!1),[X,h]=s.useState(!1),[A,P]=s.useState(!1),[I,C]=s.useState(!1),[Y,R]=s.useState(!1),[Z,q]=s.useState(!0),B=s.useRef(!1);s.useEffect(()=>{e&&!B.current&&(N(new x.FilterManager(e.toConfig())),g(structuredClone(c.toJS(e.activeFilterTab))),B.current=!0)},[e]),s.useEffect(()=>{if(!e||!p)return;const r=c.reaction(()=>e.filters,()=>{p&&p.setFiltersFrom(e)}),i=c.reaction(()=>e.activeFilterTabIndex,()=>{g(structuredClone(c.toJS(e.activeFilterTab)))});return()=>{r(),i()}},[e,p]);const $=s.useMemo(()=>l!=null&&l.onChange?!0:n?n.isLocal?!!n.searchIndex:!!n.onSearch:!1,[n,l==null?void 0:l.onChange]),M=s.useMemo(()=>(l==null?void 0:l.placeholder)||(n==null?void 0:n.searchPlaceholder)||u.coreTranslations.datatable.searchTable,[l==null?void 0:l.placeholder,n==null?void 0:n.searchPlaceholder]),ee=(l==null?void 0:l.value)||(n==null?void 0:n.searchKeyword),te=(l==null?void 0:l.isLoading)||(n==null?void 0:n.showLoader),re=s.useCallback(r=>{l!=null&&l.onChange?l.onChange(r):n==null||n.onSearchKeywordChange(r)},[l,n]),F=s.useCallback(c.action((r,i)=>{if(r&&e){const f=new x.FilterManager(e.toConfig());N(f),d==null||d(f)}if(e&&i){const f=i.displayedFilterTabs[i.activeFilterTabIndex].filterRows.filter(o=>{var D;const ie=(D=e.filters.find(oe=>{var O;return oe.key===((O=o.filterValue)==null?void 0:O.key)}))==null?void 0:D.type;return!!(Array.isArray(o.filterValue.value)&&o.filterValue.value.length||o.filterValue.value&&typeof o.filterValue.value=="object"&&!Array.isArray(o.filterValue.value)&&"dateRange"in o.filterValue.value||ie===ue.FilterType.NUMBER_INPUT)});e.displayedFilterTabs[e.activeFilterTabIndex].filterRows=f,e.onApplyClick()}T(r),r||d==null||d(null)}),[e,d]),ne=s.useCallback(c.action(r=>{h(!1),b(!1),(e==null?void 0:e.activeFilterTab.id)!==r&&(e!=null&&e.activeFilterTab&&e.activeFilterTab.id!==x.ALL_TAB_UUID&&(e.activeFilterTab.filterRows=structuredClone(c.toJS((m==null?void 0:m.filterRows)||[]))),v==null||v([]),e==null||e.onFilterTabClick(r),T(!1),w(!1),q(!1),setTimeout(()=>{q(!0)},0))}),[e,m,v]),le=s.useCallback(c.action(()=>{e&&(e.activeFilterTab.filterRows=[],e.hasChange=!0,w(!0),e.notifyChange())}),[e]),se=()=>{var r,i;return e?!e.isAllTabSelected&&Q&&e.hasChange&&!((r=e.activeTabFilterRows)!=null&&r.length)?t.jsx(a.Button,{variant:"primary-ghost",onClick:()=>e.onFilterTabDelete(),children:u.coreTranslations.datatable.saveChanges}):(i=e.activeTabFilterRows)!=null&&i.length?t.jsxs(t.Fragment,{children:[e.isAllTabSelected&&!!e.onTabSave&&t.jsx(a.Popover,{trigger:"click",onOpenChange:j,placement:"bottom",open:G,content:t.jsx(U.SaveFilterPopover,{model:e,onCancel:j}),popoverContentStyle:{padding:0},children:t.jsx(a.Button,{variant:"primary-ghost",children:u.coreTranslations.common.actions.save})}),!e.isAllTabSelected&&e.hasChange&&t.jsx(a.Button,{variant:"primary-ghost",onClick:()=>{g(structuredClone(c.toJS(e.activeFilterTab))),e.onFilterTabSave(e.activeFilterTab.title)},children:u.coreTranslations.datatable.saveChanges})]}):null:null},ae=s.useMemo(()=>!e||!k?null:t.jsxs("div",{className:"py-1.5 min-w-[180px]",children:[t.jsx(a.Popover,{trigger:"click",onOpenChange:r=>P(r),open:A,content:t.jsx(U.SaveFilterPopover,{model:e,isEdit:!0,onCancel:r=>{r||(P(!1),setTimeout(()=>{h(!1)},0))},onTabSave:()=>{g(structuredClone(c.toJS(e.activeFilterTab))),setTimeout(()=>{h(!1)},0)}}),placement:"right",popoverContentStyle:{padding:0},showArrow:!1,children:t.jsx(a.Button,{variant:"ghost",className:"w-full h-10 px-3 justify-start text-sm font-normal text-gray-blue-9 hover:bg-gray-blue-1 hover:text-gray-blue-9 border-0",children:u.coreTranslations.datatable.changeFilterName})}),!!e.onSortChange&&t.jsx(a.Button,{variant:"ghost",className:"w-full h-10 px-3 justify-start text-sm font-normal text-gray-blue-9 hover:bg-gray-blue-1 hover:text-gray-blue-9 border-0",onClick:()=>{h(!1),R(!0)},children:u.coreTranslations.datatable.filterSort}),t.jsx(a.Popover,{trigger:"click",onOpenChange:r=>C(r),open:I,content:t.jsx(pe.DeleteFilterPopover,{model:e,onCancel:r=>{r||(C(!1),setTimeout(()=>{h(!1)},0))},onDelete:()=>{C(!1),setTimeout(()=>{h(!1)},0)}}),placement:"right",popoverContentStyle:{padding:0},showArrow:!1,children:t.jsx(a.Button,{variant:"ghost",className:"w-full h-10 px-3 justify-start text-sm font-normal text-error hover:bg-gray-blue-1 hover:text-error border-0",children:u.coreTranslations.datatable.deleteFilter})})]}),[e,k,A,I]),L=(()=>{if(!e||e.displayedFilterTabs.length<=1)return null;const r=e.activeFilterTab.id;return e.displayedFilterTabs.map(i=>{const f=i.id===r&&i.id!==x.ALL_TAB_UUID;return{key:i.id,tab:Z&&f?t.jsx(a.Popover,{trigger:"click",content:ae,open:X,onOpenChange:o=>{o&&e.hasChange||(o&&b(!0),setTimeout(()=>{h(o)},0))},placement:"bottomLeft",popoverContentStyle:{padding:"0 6px"},showArrow:!1,align:{offset:[0,5]},children:t.jsxs("div",{className:"flex items-center gap-1.5 h-full",onContextMenu:o=>{o.preventDefault(),e.hasChange||(b(!0),h(!0))},onClick:()=>{e.hasChange||(b(!0),h(!0))},children:[i.title,t.jsx(a.Tooltip,{title:e.hasChange?u.coreTranslations.datatable.pleaseSaveChanges:null,children:t.jsx("span",{className:y.cn("inline-flex items-center",e.hasChange?"cursor-not-allowed":"cursor-pointer"),style:{opacity:e.hasChange?.5:1},children:t.jsx(me.default,{className:"h-3 w-3 text-gray-blue-6"})})})]})}):t.jsx("div",{className:"flex items-center gap-1.5 h-full",children:i.title}),children:null}})})();return t.jsxs("div",{className:"ikas-datatable-filter-search sticky left-0 z-[5] w-full flex flex-col",style:J,children:[t.jsxs("div",{className:y.cn("flex flex-col",!(e!=null&&e.activeTabFilterRows.length)&&"mb-4"),children:[L&&e&&t.jsx("div",{className:y.cn(e.animateTabsOnLoad&&"overflow-hidden animate-tabs-appear"),children:t.jsx(a.SimpleTabs,{items:L,activeKey:e.activeFilterTab.id,onChange:ne,size:"sm",className:"[&_[role=tablist]]:border-b-0 [&_[role=tablist]]:gap-6 [&_[role=tab]]:text-sm [&_[role=tab]]:h-8"})}),t.jsxs("div",{className:"flex items-center justify-between gap-2 filter-and-search",children:[t.jsxs("div",{className:"flex items-center gap-2 flex-1 min-w-0 filter-and-search__left",children:[K?z:null,$&&t.jsx("div",{className:"w-[300px] flex-shrink-0",children:t.jsx(a.SearchInput,{placeholder:M,value:ee||"",onChange:re,isLoading:!!te})}),!!e&&!!e.showFilterButton&&!!p&&t.jsx(a.Popover,{trigger:"click",content:t.jsx(he.FilterPopoverContent,{model:p,originalModel:e,onHidePopoverContent:F,onPopoverApplyClick:F}),open:H,onOpenChange:r=>F(r),placement:W||"bottom",popoverContentStyle:{padding:0},children:t.jsxs(a.Button,{icon:t.jsx(ge.default,{className:"h-4 w-4 -mr-0.5 text-gray-blue"}),children:[t.jsx("span",{className:"text-gray-blue-9",children:u.coreTranslations.common.field.filter}),!!((_=e.activeTabFilterRows)!=null&&_.length)&&t.jsxs("span",{className:"text-gray-blue-6 ml-0.5",children:["(",e.activeTabFilterRows.length,")"]})]})}),se(),E]}),(!!S||!!(n!=null&&n.hasArrangableColumn))&&t.jsxs("div",{className:"flex items-center gap-2 filter-and-search__right",children:[S,(n==null?void 0:n.hasArrangableColumn)&&t.jsx(a.Popover,{trigger:"click",placement:"bottomRight",content:t.jsx(ve.ArrangableColumnsPopoverContent,{model:n}),popoverContentStyle:{padding:0},children:t.jsx(a.Button,{square:!0,icon:t.jsx(be.default,{className:"h-4 w-4 text-gray-blue"})})})]})]})]}),!!e&&!!e.activeTabFilterRows.length&&t.jsxs("div",{className:"flex gap-1 mt-3 mb-4 overflow-x-auto flex-wrap",children:[e.activeTabFilterRows.map(r=>t.jsx(de.FilterInfoTag,{filterRow:r,model:e},r.rowId)),t.jsx("span",{className:"inline-flex items-center min-h-[24px] px-[5px] py-0.5 text-xs leading-[18px] font-medium bg-white rounded text-[var(--purple)] cursor-pointer select-none",onClick:le,children:u.coreTranslations.datatable.clear})]}),!!e&&t.jsx(fe.FilterSortModal,{model:e,open:Y,onClose:()=>R(!1)})]})}const Ce=ce.observer(xe);exports.FilterAndSearch=Ce;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),a=require("react"),ce=require("mobx-react-lite"),c=require("mobx"),s=require("@ikas/ui"),y=require("./index3.cjs"),g=require("./index14.cjs"),ue=require("./index15.cjs"),he=require("./index58.cjs"),U=require("./index59.cjs"),de=require("./index18.cjs"),pe=require("./index60.cjs"),fe=require("./index61.cjs"),ve=require("./index62.cjs"),u=require("./index5.cjs"),me=require("./index63.cjs"),xe=require("./index64.cjs"),be=require("./index65.cjs");function ge(V){var _;const{dataTableViewModel:n,filterManagerModel:e,customFilterSearchLeftContent:E,customFilterSearchRightContent:S,searchProps:l,style:J,isVisibleSelectedView:K,customSelectedContent:z,getClonedFilterManager:d,setSelectedData:v,filterPopoverPlacement:W}=V,[H,T]=a.useState(!1),[G,j]=a.useState(!1),[Q,w]=a.useState(!1),[p,N]=a.useState(null),[m,x]=a.useState(null),[k,b]=a.useState(!1),[X,h]=a.useState(!1),[A,P]=a.useState(!1),[I,C]=a.useState(!1),[Y,R]=a.useState(!1),[Z,q]=a.useState(!0),B=a.useRef(!1);a.useEffect(()=>{e&&!B.current&&(N(new g.FilterManager(e.toConfig())),x(structuredClone(c.toJS(e.activeFilterTab))),B.current=!0)},[e]),a.useEffect(()=>{if(!e||!p)return;const r=c.reaction(()=>e.filters,()=>{p&&p.setFiltersFrom(e)}),i=c.reaction(()=>e.activeFilterTabIndex,()=>{x(structuredClone(c.toJS(e.activeFilterTab)))});return()=>{r(),i()}},[e,p]);const $=a.useMemo(()=>l!=null&&l.onChange?!0:n?n.isLocal?!!n.searchIndex:!!n.onSearch:!1,[n,l==null?void 0:l.onChange]),M=a.useMemo(()=>(l==null?void 0:l.placeholder)||(n==null?void 0:n.searchPlaceholder)||u.coreTranslations.datatable.searchTable,[l==null?void 0:l.placeholder,n==null?void 0:n.searchPlaceholder]),ee=(l==null?void 0:l.value)||(n==null?void 0:n.searchKeyword),te=(l==null?void 0:l.isLoading)||(n==null?void 0:n.showLoader),re=a.useCallback(r=>{l!=null&&l.onChange?l.onChange(r):n==null||n.onSearchKeywordChange(r)},[l,n]),F=a.useCallback(c.action((r,i)=>{if(r&&e){const f=new g.FilterManager(e.toConfig());N(f),d==null||d(f)}if(e&&i){const f=i.displayedFilterTabs[i.activeFilterTabIndex].filterRows.filter(o=>{var D;const ie=(D=e.filters.find(oe=>{var O;return oe.key===((O=o.filterValue)==null?void 0:O.key)}))==null?void 0:D.type;return!!(Array.isArray(o.filterValue.value)&&o.filterValue.value.length||o.filterValue.value&&typeof o.filterValue.value=="object"&&!Array.isArray(o.filterValue.value)&&"dateRange"in o.filterValue.value||ie===ue.FilterType.NUMBER_INPUT)});e.displayedFilterTabs[e.activeFilterTabIndex].filterRows=f,e.onApplyClick()}T(r),r||d==null||d(null)}),[e,d]),ne=a.useCallback(c.action(r=>{h(!1),b(!1),(e==null?void 0:e.activeFilterTab.id)!==r&&(e!=null&&e.activeFilterTab&&e.activeFilterTab.id!==g.ALL_TAB_UUID&&(e.activeFilterTab.filterRows=structuredClone(c.toJS((m==null?void 0:m.filterRows)||[]))),v==null||v([]),e==null||e.onFilterTabClick(r),T(!1),w(!1),q(!1),setTimeout(()=>{q(!0)},0))}),[e,m,v]),le=a.useCallback(c.action(()=>{e&&(e.activeFilterTab.filterRows=[],e.hasChange=!0,w(!0),e.notifyChange())}),[e]),ae=()=>{var r,i;return e?!e.isAllTabSelected&&Q&&e.hasChange&&!((r=e.activeTabFilterRows)!=null&&r.length)?t.jsx(s.Button,{variant:"primary-ghost",onClick:()=>e.onFilterTabDelete(),children:u.coreTranslations.datatable.saveChanges}):(i=e.activeTabFilterRows)!=null&&i.length?t.jsxs(t.Fragment,{children:[e.isAllTabSelected&&!!e.onTabSave&&t.jsx(s.Popover,{trigger:"click",onOpenChange:j,placement:"bottom",open:G,content:t.jsx(U.SaveFilterPopover,{model:e,onCancel:j}),popoverContentStyle:{padding:0},children:t.jsx(s.Button,{variant:"primary-ghost",children:u.coreTranslations.common.actions.save})}),!e.isAllTabSelected&&e.hasChange&&t.jsx(s.Button,{variant:"primary-ghost",onClick:()=>{x(structuredClone(c.toJS(e.activeFilterTab))),e.onFilterTabSave(e.activeFilterTab.title)},children:u.coreTranslations.datatable.saveChanges})]}):null:null},se=a.useMemo(()=>!e||!k?null:t.jsxs("div",{className:"py-1.5 min-w-[180px]",children:[t.jsx(s.Popover,{trigger:"click",onOpenChange:r=>P(r),open:A,content:t.jsx(U.SaveFilterPopover,{model:e,isEdit:!0,onCancel:r=>{r||(P(!1),setTimeout(()=>{h(!1)},0))},onTabSave:()=>{x(structuredClone(c.toJS(e.activeFilterTab))),setTimeout(()=>{h(!1)},0)}}),placement:"right",popoverContentStyle:{padding:0},showArrow:!1,children:t.jsx(s.Button,{variant:"text",className:"w-full h-10 px-3 justify-start text-sm font-normal text-gray-blue-9 hover:bg-gray-blue-1 hover:text-gray-blue-9 border-0",children:u.coreTranslations.datatable.changeFilterName})}),!!e.onSortChange&&t.jsx(s.Button,{variant:"text",className:"w-full h-10 px-3 justify-start text-sm font-normal text-gray-blue-9 hover:bg-gray-blue-1 hover:text-gray-blue-9 border-0",onClick:()=>{h(!1),R(!0)},children:u.coreTranslations.datatable.filterSort}),t.jsx(s.Popover,{trigger:"click",onOpenChange:r=>C(r),open:I,content:t.jsx(pe.DeleteFilterPopover,{model:e,onCancel:r=>{r||(C(!1),setTimeout(()=>{h(!1)},0))},onDelete:()=>{C(!1),setTimeout(()=>{h(!1)},0)}}),placement:"right",popoverContentStyle:{padding:0},showArrow:!1,children:t.jsx(s.Button,{variant:"text",className:"w-full h-10 px-3 justify-start text-sm font-normal text-error hover:bg-gray-blue-1 hover:text-error border-0",children:u.coreTranslations.datatable.deleteFilter})})]}),[e,k,A,I]),L=(()=>{if(!e||e.displayedFilterTabs.length<=1)return null;const r=e.activeFilterTab.id;return e.displayedFilterTabs.map(i=>{const f=i.id===r&&i.id!==g.ALL_TAB_UUID;return{key:i.id,tab:Z&&f?t.jsx(s.Popover,{trigger:"click",content:se,open:X,onOpenChange:o=>{o&&e.hasChange||(o&&b(!0),setTimeout(()=>{h(o)},0))},placement:"bottomLeft",popoverContentStyle:{padding:"0 6px"},showArrow:!1,align:{offset:[0,5]},children:t.jsxs("div",{className:"flex items-center gap-1.5 h-full",onContextMenu:o=>{o.preventDefault(),e.hasChange||(b(!0),h(!0))},onClick:()=>{e.hasChange||(b(!0),h(!0))},children:[i.title,t.jsx(s.Tooltip,{title:e.hasChange?u.coreTranslations.datatable.pleaseSaveChanges:null,children:t.jsx("span",{className:y.cn("inline-flex items-center",e.hasChange?"cursor-not-allowed":"cursor-pointer"),style:{opacity:e.hasChange?.5:1},children:t.jsx(me.default,{className:"h-3 w-3 text-gray-blue-6"})})})]})}):t.jsx("div",{className:"flex items-center gap-1.5 h-full",children:i.title}),children:null}})})();return t.jsxs("div",{className:"ikas-datatable-filter-search sticky left-0 z-[5] w-full flex flex-col",style:J,children:[t.jsxs("div",{className:y.cn("flex flex-col",!(e!=null&&e.activeTabFilterRows.length)&&"mb-4"),children:[L&&e&&t.jsx("div",{className:y.cn(e.animateTabsOnLoad&&"overflow-hidden animate-tabs-appear"),children:t.jsx(s.SimpleTabs,{items:L,activeKey:e.activeFilterTab.id,onChange:ne,size:"sm",className:"[&_[role=tablist]]:border-b-0 [&_[role=tablist]]:gap-6 [&_[role=tab]]:text-sm [&_[role=tab]]:h-8"})}),t.jsxs("div",{className:"flex items-center justify-between gap-2 filter-and-search",children:[t.jsxs("div",{className:"flex items-center gap-2 flex-1 min-w-0 filter-and-search__left",children:[K?z:null,$&&t.jsx("div",{className:"w-[300px] flex-shrink-0",children:t.jsx(s.SearchInput,{placeholder:M,value:ee||"",onChange:re,isLoading:!!te})}),!!e&&!!e.showFilterButton&&!!p&&t.jsx(s.Popover,{trigger:"click",content:t.jsx(he.FilterPopoverContent,{model:p,originalModel:e,onHidePopoverContent:F,onPopoverApplyClick:F}),open:H,onOpenChange:r=>F(r),placement:W||"bottom",popoverContentStyle:{padding:0},children:t.jsxs(s.Button,{icon:t.jsx(xe.default,{className:"h-4 w-4 -mr-0.5 text-gray-blue"}),children:[t.jsx("span",{className:"text-gray-blue-9",children:u.coreTranslations.common.field.filter}),!!((_=e.activeTabFilterRows)!=null&&_.length)&&t.jsxs("span",{className:"text-gray-blue-6 ml-0.5",children:["(",e.activeTabFilterRows.length,")"]})]})}),ae(),E]}),(!!S||!!(n!=null&&n.hasArrangableColumn))&&t.jsxs("div",{className:"flex items-center gap-2 filter-and-search__right",children:[S,(n==null?void 0:n.hasArrangableColumn)&&t.jsx(s.Popover,{trigger:"click",placement:"bottomRight",content:t.jsx(ve.ArrangableColumnsPopoverContent,{model:n}),popoverContentStyle:{padding:0},children:t.jsx(s.Button,{square:!0,icon:t.jsx(be.default,{className:"h-4 w-4 text-gray-blue"})})})]})]})]}),!!e&&!!e.activeTabFilterRows.length&&t.jsxs("div",{className:"flex gap-1 mt-3 mb-4 overflow-x-auto flex-wrap",children:[e.activeTabFilterRows.map(r=>t.jsx(de.FilterInfoTag,{filterRow:r,model:e},r.rowId)),t.jsx("span",{className:"inline-flex items-center min-h-[24px] px-[5px] py-0.5 text-xs leading-[18px] font-medium bg-white rounded text-[var(--purple)] cursor-pointer select-none",onClick:le,children:u.coreTranslations.datatable.clear})]}),!!e&&t.jsx(fe.FilterSortModal,{model:e,open:Y,onClose:()=>R(!1)})]})}const Ce=ce.observer(ge);exports.FilterAndSearch=Ce;

package/dist/index17.js

@@ -1,21 +1,21 @@
 import { jsxs as o, jsx as t, Fragment as ge } from "react/jsx-runtime";
-import { useState as s, useRef as be, useEffect as W, useMemo as S, useCallback as y } from "react";
+import { useState as s, useRef as be, useEffect as W, useMemo as S, useCallback as x } from "react";
 import { observer as Ce } from "mobx-react-lite";
 import { toJS as v, reaction as q, action as w } from "mobx";
-import { Popover as d, Button as h, Tooltip as Fe, SimpleTabs as ye, SearchInput as xe } from "@ikas/ui";
+import { Popover as d, Button as p, Tooltip as Fe, SimpleTabs as xe, SearchInput as ye } from "@ikas/ui";
 import { cn as N } from "./index3.js";
 import { FilterManager as H, ALL_TAB_UUID as J } from "./index14.js";
 import { FilterType as Te } from "./index15.js";
-import { FilterPopoverContent as Se } from "./index56.js";
-import { SaveFilterPopover as G } from "./index57.js";
+import { FilterPopoverContent as Se } from "./index58.js";
+import { SaveFilterPopover as G } from "./index59.js";
 import { FilterInfoTag as we } from "./index18.js";
-import { DeleteFilterPopover as Ne } from "./index58.js";
-import { FilterSortModal as ke } from "./index59.js";
-import { ArrangableColumnsPopoverContent as Ae } from "./index60.js";
+import { DeleteFilterPopover as Ne } from "./index60.js";
+import { FilterSortModal as ke } from "./index61.js";
+import { ArrangableColumnsPopoverContent as Ae } from "./index62.js";
 import { coreTranslations as c } from "./index5.js";
-import Ie from "./index61.js";
-import Re from "./index62.js";
-import Pe from "./index63.js";
+import Ie from "./index63.js";
+import Re from "./index64.js";
+import Pe from "./index65.js";
 function De(Q) {
   var E;
   const {
@@ -27,10 +27,10 @@ function De(Q) {
     style: Y,
     isVisibleSelectedView: Z,
     customSelectedContent: $,
-    getClonedFilterManager: p,
+    getClonedFilterManager: h,
     setSelectedData: g,
     filterPopoverPlacement: M
-  } = Q, [ee, A] = s(!1), [te, I] = s(!1), [re, R] = s(!1), [f, P] = s(null), [b, C] = s(null), [D, F] = s(!1), [le, m] = s(!1), [_, L] = s(!1), [O, x] = s(!1), [ie, V] = s(!1), [ne, j] = s(!0), B = be(!1);
+  } = Q, [ee, A] = s(!1), [te, I] = s(!1), [re, R] = s(!1), [f, P] = s(null), [b, C] = s(null), [D, F] = s(!1), [le, m] = s(!1), [_, L] = s(!1), [O, y] = s(!1), [ie, V] = s(!1), [ne, j] = s(!0), B = be(!1);
   W(() => {
     e && !B.current && (P(
       new H(e.toConfig())
@@ -59,19 +59,19 @@ function De(Q) {
   const ae = S(() => i != null && i.onChange ? !0 : l ? l.isLocal ? !!l.searchIndex : !!l.onSearch : !1, [l, i == null ? void 0 : i.onChange]), oe = S(
     () => (i == null ? void 0 : i.placeholder) || (l == null ? void 0 : l.searchPlaceholder) || c.datatable.searchTable,
     [i == null ? void 0 : i.placeholder, l == null ? void 0 : l.searchPlaceholder]
-  ), se = (i == null ? void 0 : i.value) || (l == null ? void 0 : l.searchKeyword), ce = (i == null ? void 0 : i.isLoading) || (l == null ? void 0 : l.showLoader), me = y(
+  ), se = (i == null ? void 0 : i.value) || (l == null ? void 0 : l.searchKeyword), ce = (i == null ? void 0 : i.isLoading) || (l == null ? void 0 : l.showLoader), me = x(
     (r) => {
       i != null && i.onChange ? i.onChange(r) : l == null || l.onSearchKeywordChange(r);
     },
     [i, l]
-  ), T = y(
+  ), T = x(
     w(
       (r, n) => {
         if (r && e) {
           const u = new H(
             e.toConfig()
           );
-          P(u), p == null || p(u);
+          P(u), h == null || h(u);
         }
         if (e && n) {
           const u = n.displayedFilterTabs[n.activeFilterTabIndex].filterRows.filter((a) => {
@@ -86,11 +86,11 @@ function De(Q) {
           });
           e.displayedFilterTabs[e.activeFilterTabIndex].filterRows = u, e.onApplyClick();
         }
-        A(r), r || p == null || p(null);
+        A(r), r || h == null || h(null);
       }
     ),
-    [e, p]
-  ), he = y(
+    [e, h]
+  ), pe = x(
     w((r) => {
       m(!1), F(!1), (e == null ? void 0 : e.activeFilterTab.id) !== r && (e != null && e.activeFilterTab && e.activeFilterTab.id !== J && (e.activeFilterTab.filterRows = structuredClone(
         v((b == null ? void 0 : b.filterRows) || [])
@@ -99,7 +99,7 @@ function De(Q) {
       }, 0));
     }),
     [e, b, g]
-  ), pe = y(
+  ), he = x(
     w(() => {
       e && (e.activeFilterTab.filterRows = [], e.hasChange = !0, R(!0), e.notifyChange());
     }),
@@ -107,7 +107,7 @@ function De(Q) {
   ), fe = () => {
     var r, n;
     return e ? !e.isAllTabSelected && re && e.hasChange && !((r = e.activeTabFilterRows) != null && r.length) ? /* @__PURE__ */ t(
-      h,
+      p,
       {
         variant: "primary-ghost",
         onClick: () => e.onFilterTabDelete(),
@@ -129,11 +129,11 @@ function De(Q) {
             }
           ),
           popoverContentStyle: { padding: 0 },
-          children: /* @__PURE__ */ t(h, { variant: "primary-ghost", children: c.common.actions.save })
+          children: /* @__PURE__ */ t(p, { variant: "primary-ghost", children: c.common.actions.save })
         }
       ),
       !e.isAllTabSelected && e.hasChange && /* @__PURE__ */ t(
-        h,
+        p,
         {
           variant: "primary-ghost",
           onClick: () => {
@@ -177,9 +177,9 @@ function De(Q) {
         popoverContentStyle: { padding: 0 },
         showArrow: !1,
         children: /* @__PURE__ */ t(
-          h,
+          p,
           {
-            variant: "ghost",
+            variant: "text",
             className: "w-full h-10 px-3 justify-start text-sm font-normal text-gray-blue-9 hover:bg-gray-blue-1 hover:text-gray-blue-9 border-0",
             children: c.datatable.changeFilterName
           }
@@ -187,9 +187,9 @@ function De(Q) {
       }
     ),
     !!e.onSortChange && /* @__PURE__ */ t(
-      h,
+      p,
       {
-        variant: "ghost",
+        variant: "text",
         className: "w-full h-10 px-3 justify-start text-sm font-normal text-gray-blue-9 hover:bg-gray-blue-1 hover:text-gray-blue-9 border-0",
         onClick: () => {
           m(!1), V(!0);
@@ -201,19 +201,19 @@ function De(Q) {
       d,
       {
         trigger: "click",
-        onOpenChange: (r) => x(r),
+        onOpenChange: (r) => y(r),
         open: O,
         content: /* @__PURE__ */ t(
           Ne,
           {
             model: e,
             onCancel: (r) => {
-              r || (x(!1), setTimeout(() => {
+              r || (y(!1), setTimeout(() => {
                 m(!1);
               }, 0));
             },
             onDelete: () => {
-              x(!1), setTimeout(() => {
+              y(!1), setTimeout(() => {
                 m(!1);
               }, 0);
             }
@@ -223,9 +223,9 @@ function De(Q) {
         popoverContentStyle: { padding: 0 },
         showArrow: !1,
         children: /* @__PURE__ */ t(
-          h,
+          p,
           {
-            variant: "ghost",
+            variant: "text",
             className: "w-full h-10 px-3 justify-start text-sm font-normal text-error hover:bg-gray-blue-1 hover:text-error border-0",
             children: c.datatable.deleteFilter
           }
@@ -321,11 +321,11 @@ function De(Q) {
                     e.animateTabsOnLoad && "overflow-hidden animate-tabs-appear"
                   ),
                   children: /* @__PURE__ */ t(
-                    ye,
+                    xe,
                     {
                       items: U,
                       activeKey: e.activeFilterTab.id,
-                      onChange: he,
+                      onChange: pe,
                       size: "sm",
                       className: "[&_[role=tablist]]:border-b-0 [&_[role=tablist]]:gap-6 [&_[role=tab]]:text-sm [&_[role=tab]]:h-8"
                     }
@@ -336,7 +336,7 @@ function De(Q) {
                 /* @__PURE__ */ o("div", { className: "flex items-center gap-2 flex-1 min-w-0 filter-and-search__left", children: [
                   Z ? $ : null,
                   ae && /* @__PURE__ */ t("div", { className: "w-[300px] flex-shrink-0", children: /* @__PURE__ */ t(
-                    xe,
+                    ye,
                     {
                       placeholder: oe,
                       value: se || "",
@@ -362,7 +362,7 @@ function De(Q) {
                       placement: M || "bottom",
                       popoverContentStyle: { padding: 0 },
                       children: /* @__PURE__ */ o(
-                        h,
+                        p,
                         {
                           icon: /* @__PURE__ */ t(Re, { className: "h-4 w-4 -mr-0.5 text-gray-blue" }),
                           children: [
@@ -395,7 +395,7 @@ function De(Q) {
                       ),
                       popoverContentStyle: { padding: 0 },
                       children: /* @__PURE__ */ t(
-                        h,
+                        p,
                         {
                           square: !0,
                           icon: /* @__PURE__ */ t(Pe, { className: "h-4 w-4 text-gray-blue" })
@@ -421,7 +421,7 @@ function De(Q) {
             "span",
             {
               className: "inline-flex items-center min-h-[24px] px-[5px] py-0.5 text-xs leading-[18px] font-medium bg-white rounded text-[var(--purple)] cursor-pointer select-none",
-              onClick: pe,
+              onClick: he,
               children: c.datatable.clear
             }
           )

package/dist/index170.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react"),i=require("./index151.cjs");var e=function(){var r=i.default({default:{picker:{width:"12px",height:"12px",borderRadius:"6px",boxShadow:"inset 0 0 0 1px #fff",transform:"translate(-6px, -6px)"}}});return t.createElement("div",{style:r.picker})};exports.ChromePointerCircle=e;exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react"),u=require("./index143.cjs");var e=function(t){var o=t.onClick,i=t.label,n=t.children,r=t.active,a=u.default({default:{button:{backgroundImage:"linear-gradient(-180deg, #FFFFFF 0%, #E6E6E6 100%)",border:"1px solid #878787",borderRadius:"2px",height:"20px",boxShadow:"0 1px 0 0 #EAEAEA",fontSize:"14px",color:"#000",lineHeight:"20px",textAlign:"center",marginBottom:"10px",cursor:"pointer"}},active:{button:{boxShadow:"0 0 0 1px #878787"}}},{active:r});return l.createElement("div",{style:a.button,onClick:o},i||n)};exports.PhotoshopButton=e;exports.default=e;