se-design 0.0.111 → 0.0.113

package/dist/index148.js

@@ -0,0 +1,55 @@
+/*
+object-assign
+(c) Sindre Sorhus
+@license MIT
+*/
+var f, i;
+function p() {
+  if (i) return f;
+  i = 1;
+  var u = Object.getOwnPropertySymbols, b = Object.prototype.hasOwnProperty, l = Object.prototype.propertyIsEnumerable;
+  function O(n) {
+    if (n == null)
+      throw new TypeError("Object.assign cannot be called with null or undefined");
+    return Object(n);
+  }
+  function j() {
+    try {
+      if (!Object.assign)
+        return !1;
+      var n = new String("abc");
+      if (n[5] = "de", Object.getOwnPropertyNames(n)[0] === "5")
+        return !1;
+      for (var s = {}, r = 0; r < 10; r++)
+        s["_" + String.fromCharCode(r)] = r;
+      var a = Object.getOwnPropertyNames(s).map(function(e) {
+        return s[e];
+      });
+      if (a.join("") !== "0123456789")
+        return !1;
+      var t = {};
+      return "abcdefghijklmnopqrst".split("").forEach(function(e) {
+        t[e] = e;
+      }), Object.keys(Object.assign({}, t)).join("") === "abcdefghijklmnopqrst";
+    } catch (e) {
+      return !1;
+    }
+  }
+  return f = j() ? Object.assign : function(n, s) {
+    for (var r, a = O(n), t, e = 1; e < arguments.length; e++) {
+      r = Object(arguments[e]);
+      for (var c in r)
+        b.call(r, c) && (a[c] = r[c]);
+      if (u) {
+        t = u(r);
+        for (var o = 0; o < t.length; o++)
+          l.call(r, t[o]) && (a[t[o]] = r[t[o]]);
+      }
+    }
+    return a;
+  }, f;
+}
+export {
+  p as __require
+};
+//# sourceMappingURL=index148.js.map

package/dist/index148.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index148.js","sources":["../node_modules/object-assign/index.js"],"sourcesContent":["/*\nobject-assign\n(c) Sindre Sorhus\n@license MIT\n*/\n\n'use strict';\n/* eslint-disable no-unused-vars */\nvar getOwnPropertySymbols = Object.getOwnPropertySymbols;\nvar hasOwnProperty = Object.prototype.hasOwnProperty;\nvar propIsEnumerable = Object.prototype.propertyIsEnumerable;\n\nfunction toObject(val) {\n\tif (val === null || val === undefined) {\n\t\tthrow new TypeError('Object.assign cannot be called with null or undefined');\n\t}\n\n\treturn Object(val);\n}\n\nfunction shouldUseNative() {\n\ttry {\n\t\tif (!Object.assign) {\n\t\t\treturn false;\n\t\t}\n\n\t\t// Detect buggy property enumeration order in older V8 versions.\n\n\t\t// https://bugs.chromium.org/p/v8/issues/detail?id=4118\n\t\tvar test1 = new String('abc');  // eslint-disable-line no-new-wrappers\n\t\ttest1[5] = 'de';\n\t\tif (Object.getOwnPropertyNames(test1)[0] === '5') {\n\t\t\treturn false;\n\t\t}\n\n\t\t// https://bugs.chromium.org/p/v8/issues/detail?id=3056\n\t\tvar test2 = {};\n\t\tfor (var i = 0; i < 10; i++) {\n\t\t\ttest2['_' + String.fromCharCode(i)] = i;\n\t\t}\n\t\tvar order2 = Object.getOwnPropertyNames(test2).map(function (n) {\n\t\t\treturn test2[n];\n\t\t});\n\t\tif (order2.join('') !== '0123456789') {\n\t\t\treturn false;\n\t\t}\n\n\t\t// https://bugs.chromium.org/p/v8/issues/detail?id=3056\n\t\tvar test3 = {};\n\t\t'abcdefghijklmnopqrst'.split('').forEach(function (letter) {\n\t\t\ttest3[letter] = letter;\n\t\t});\n\t\tif (Object.keys(Object.assign({}, test3)).join('') !==\n\t\t\t\t'abcdefghijklmnopqrst') {\n\t\t\treturn false;\n\t\t}\n\n\t\treturn true;\n\t} catch (err) {\n\t\t// We don't expect any of the above to throw, but better to be safe.\n\t\treturn false;\n\t}\n}\n\nmodule.exports = shouldUseNative() ? Object.assign : function (target, source) {\n\tvar from;\n\tvar to = toObject(target);\n\tvar symbols;\n\n\tfor (var s = 1; s < arguments.length; s++) {\n\t\tfrom = Object(arguments[s]);\n\n\t\tfor (var key in from) {\n\t\t\tif (hasOwnProperty.call(from, key)) {\n\t\t\t\tto[key] = from[key];\n\t\t\t}\n\t\t}\n\n\t\tif (getOwnPropertySymbols) {\n\t\t\tsymbols = getOwnPropertySymbols(from);\n\t\t\tfor (var i = 0; i < symbols.length; i++) {\n\t\t\t\tif (propIsEnumerable.call(from, symbols[i])) {\n\t\t\t\t\tto[symbols[i]] = from[symbols[i]];\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\treturn to;\n};\n"],"names":["getOwnPropertySymbols","hasOwnProperty","propIsEnumerable","toObject","val","shouldUseNative","test1","test2","i","order2","n","test3","letter","err","objectAssign","target","source","from","to","symbols","s","key"],"mappings":";;;;;;;;;AAQA,MAAIA,IAAwB,OAAO,uBAC/BC,IAAiB,OAAO,UAAU,gBAClCC,IAAmB,OAAO,UAAU;AAExC,WAASC,EAASC,GAAK;AACtB,QAAIA,KAAQ;AACX,YAAM,IAAI,UAAU,uDAAuD;AAG5E,WAAO,OAAOA,CAAG;AAAA;AAGlB,WAASC,IAAkB;AAC1B,QAAI;AACH,UAAI,CAAC,OAAO;AACX,eAAO;AAMR,UAAIC,IAAQ,IAAI,OAAO,KAAK;AAE5B,UADAA,EAAM,CAAC,IAAI,MACP,OAAO,oBAAoBA,CAAK,EAAE,CAAC,MAAM;AAC5C,eAAO;AAKR,eADIC,IAAQ,CAAE,GACLC,IAAI,GAAGA,IAAI,IAAIA;AACvB,QAAAD,EAAM,MAAM,OAAO,aAAaC,CAAC,CAAC,IAAIA;AAEvC,UAAIC,IAAS,OAAO,oBAAoBF,CAAK,EAAE,IAAI,SAAUG,GAAG;AAC/D,eAAOH,EAAMG,CAAC;AAAA,MACjB,CAAG;AACD,UAAID,EAAO,KAAK,EAAE,MAAM;AACvB,eAAO;AAIR,UAAIE,IAAQ,CAAE;AAId,aAHA,uBAAuB,MAAM,EAAE,EAAE,QAAQ,SAAUC,GAAQ;AAC1D,QAAAD,EAAMC,CAAM,IAAIA;AAAA,MACnB,CAAG,GACG,OAAO,KAAK,OAAO,OAAO,CAAE,GAAED,CAAK,CAAC,EAAE,KAAK,EAAE,MAC/C;AAAA,IAKF,SAAQE,GAAK;AAEb,aAAO;AAAA;;AAIT,SAAAC,IAAiBT,EAAe,IAAK,OAAO,SAAS,SAAUU,GAAQC,GAAQ;AAK9E,aAJIC,GACAC,IAAKf,EAASY,CAAM,GACpBI,GAEKC,IAAI,GAAGA,IAAI,UAAU,QAAQA,KAAK;AAC1C,MAAAH,IAAO,OAAO,UAAUG,CAAC,CAAC;AAE1B,eAASC,KAAOJ;AACf,QAAIhB,EAAe,KAAKgB,GAAMI,CAAG,MAChCH,EAAGG,CAAG,IAAIJ,EAAKI,CAAG;AAIpB,UAAIrB,GAAuB;AAC1B,QAAAmB,IAAUnB,EAAsBiB,CAAI;AACpC,iBAAST,IAAI,GAAGA,IAAIW,EAAQ,QAAQX;AACnC,UAAIN,EAAiB,KAAKe,GAAME,EAAQX,CAAC,CAAC,MACzCU,EAAGC,EAAQX,CAAC,CAAC,IAAIS,EAAKE,EAAQX,CAAC,CAAC;AAAA;;AAMpC,WAAOU;AAAA,EACP;;","x_google_ignoreList":[0]}

package/dist/index149.js

@@ -0,0 +1,11 @@
+var e, r;
+function _() {
+  if (r) return e;
+  r = 1;
+  var t = "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";
+  return e = t, e;
+}
+export {
+  _ as __require
+};
+//# sourceMappingURL=index149.js.map

package/dist/index149.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index149.js","sources":["../node_modules/prop-types/lib/ReactPropTypesSecret.js"],"sourcesContent":["/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n'use strict';\n\nvar ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';\n\nmodule.exports = ReactPropTypesSecret;\n"],"names":["ReactPropTypesSecret","ReactPropTypesSecret_1"],"mappings":";;;;AASA,MAAIA,IAAuB;AAE3B,SAAAC,IAAiBD;;","x_google_ignoreList":[0]}

package/dist/index150.js

@@ -0,0 +1,8 @@
+var r, e;
+function a() {
+  return e || (e = 1, r = Function.call.bind(Object.prototype.hasOwnProperty)), r;
+}
+export {
+  a as __require
+};
+//# sourceMappingURL=index150.js.map

package/dist/index150.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index150.js","sources":["../node_modules/prop-types/lib/has.js"],"sourcesContent":["module.exports = Function.call.bind(Object.prototype.hasOwnProperty);\n"],"names":["has"],"mappings":";;sBAAAA,IAAiB,SAAS,KAAK,KAAK,OAAO,UAAU,cAAc;;","x_google_ignoreList":[0]}

package/dist/index151.js

@@ -0,0 +1,55 @@
+import { __require as E } from "./index149.js";
+import { __require as _ } from "./index150.js";
+var f, v;
+function P() {
+  if (v) return f;
+  v = 1;
+  var o = function() {
+  };
+  if (process.env.NODE_ENV !== "production") {
+    var y = E(), t = {}, d = _();
+    o = function(n) {
+      var a = "Warning: " + n;
+      typeof console != "undefined" && console.error(a);
+      try {
+        throw new Error(a);
+      } catch (i) {
+      }
+    };
+  }
+  function u(n, a, i, s, c) {
+    if (process.env.NODE_ENV !== "production") {
+      for (var e in n)
+        if (d(n, e)) {
+          var r;
+          try {
+            if (typeof n[e] != "function") {
+              var h = Error(
+                (s || "React class") + ": " + i + " type `" + e + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof n[e] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`."
+              );
+              throw h.name = "Invariant Violation", h;
+            }
+            r = n[e](a, e, s, i, null, y);
+          } catch (l) {
+            r = l;
+          }
+          if (r && !(r instanceof Error) && o(
+            (s || "React class") + ": type specification of " + i + " `" + e + "` is invalid; the type checker function must return `null` or an `Error` but returned a " + typeof r + ". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."
+          ), r instanceof Error && !(r.message in t)) {
+            t[r.message] = !0;
+            var p = c ? c() : "";
+            o(
+              "Failed " + i + " type: " + r.message + (p != null ? p : "")
+            );
+          }
+        }
+    }
+  }
+  return u.resetWarningCache = function() {
+    process.env.NODE_ENV !== "production" && (t = {});
+  }, f = u, f;
+}
+export {
+  P as __require
+};
+//# sourceMappingURL=index151.js.map

package/dist/index151.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index151.js","sources":["../node_modules/prop-types/checkPropTypes.js"],"sourcesContent":["/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n'use strict';\n\nvar printWarning = function() {};\n\nif (process.env.NODE_ENV !== 'production') {\n  var ReactPropTypesSecret = require('./lib/ReactPropTypesSecret');\n  var loggedTypeFailures = {};\n  var has = require('./lib/has');\n\n  printWarning = function(text) {\n    var message = 'Warning: ' + text;\n    if (typeof console !== 'undefined') {\n      console.error(message);\n    }\n    try {\n      // --- Welcome to debugging React ---\n      // This error was thrown as a convenience so that you can use this stack\n      // to find the callsite that caused this warning to fire.\n      throw new Error(message);\n    } catch (x) { /**/ }\n  };\n}\n\n/**\n * Assert that the values match with the type specs.\n * Error messages are memorized and will only be shown once.\n *\n * @param {object} typeSpecs Map of name to a ReactPropType\n * @param {object} values Runtime values that need to be type-checked\n * @param {string} location e.g. \"prop\", \"context\", \"child context\"\n * @param {string} componentName Name of the component for error messages.\n * @param {?Function} getStack Returns the component stack.\n * @private\n */\nfunction checkPropTypes(typeSpecs, values, location, componentName, getStack) {\n  if (process.env.NODE_ENV !== 'production') {\n    for (var typeSpecName in typeSpecs) {\n      if (has(typeSpecs, typeSpecName)) {\n        var error;\n        // Prop type validation may throw. In case they do, we don't want to\n        // fail the render phase where it didn't fail before. So we log it.\n        // After these have been cleaned up, we'll let them throw.\n        try {\n          // This is intentionally an invariant that gets caught. It's the same\n          // behavior as without this statement except with a better message.\n          if (typeof typeSpecs[typeSpecName] !== 'function') {\n            var err = Error(\n              (componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' +\n              'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' +\n              'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.'\n            );\n            err.name = 'Invariant Violation';\n            throw err;\n          }\n          error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret);\n        } catch (ex) {\n          error = ex;\n        }\n        if (error && !(error instanceof Error)) {\n          printWarning(\n            (componentName || 'React class') + ': type specification of ' +\n            location + ' `' + typeSpecName + '` is invalid; the type checker ' +\n            'function must return `null` or an `Error` but returned a ' + typeof error + '. ' +\n            'You may have forgotten to pass an argument to the type checker ' +\n            'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' +\n            'shape all require an argument).'\n          );\n        }\n        if (error instanceof Error && !(error.message in loggedTypeFailures)) {\n          // Only monitor this failure once because there tends to be a lot of the\n          // same error.\n          loggedTypeFailures[error.message] = true;\n\n          var stack = getStack ? getStack() : '';\n\n          printWarning(\n            'Failed ' + location + ' type: ' + error.message + (stack != null ? stack : '')\n          );\n        }\n      }\n    }\n  }\n}\n\n/**\n * Resets warning cache when testing.\n *\n * @private\n */\ncheckPropTypes.resetWarningCache = function() {\n  if (process.env.NODE_ENV !== 'production') {\n    loggedTypeFailures = {};\n  }\n}\n\nmodule.exports = checkPropTypes;\n"],"names":["printWarning","ReactPropTypesSecret","require$$0","loggedTypeFailures","has","require$$1","text","message","x","checkPropTypes","typeSpecs","values","location","componentName","getStack","typeSpecName","error","err","ex","stack","checkPropTypes_1"],"mappings":";;;;;;AASA,MAAIA,IAAe,WAAW;AAAA,EAAE;AAEhC,MAAI,QAAQ,IAAI,aAAa,cAAc;AACzC,QAAIC,IAAuBC,EAAqC,GAC5DC,IAAqB,CAAE,GACvBC,IAAMC,EAAoB;AAE9B,IAAAL,IAAe,SAASM,GAAM;AAC5B,UAAIC,IAAU,cAAcD;AAC5B,MAAI,OAAO,WAAY,eACrB,QAAQ,MAAMC,CAAO;AAEvB,UAAI;AAIF,cAAM,IAAI,MAAMA,CAAO;AAAA,MACxB,SAAQC,GAAG;AAAA,MAAA;AAAA,IACb;AAAA;AAcH,WAASC,EAAeC,GAAWC,GAAQC,GAAUC,GAAeC,GAAU;AAC5E,QAAI,QAAQ,IAAI,aAAa;AAC3B,eAASC,KAAgBL;AACvB,YAAIN,EAAIM,GAAWK,CAAY,GAAG;AAChC,cAAIC;AAIJ,cAAI;AAGF,gBAAI,OAAON,EAAUK,CAAY,KAAM,YAAY;AACjD,kBAAIE,IAAM;AAAA,iBACPJ,KAAiB,iBAAiB,OAAOD,IAAW,YAAYG,IAAe,+FACC,OAAOL,EAAUK,CAAY,IAAI;AAAA,cAEnH;AACD,oBAAAE,EAAI,OAAO,uBACLA;AAAA;AAER,YAAAD,IAAQN,EAAUK,CAAY,EAAEJ,GAAQI,GAAcF,GAAeD,GAAU,MAAMX,CAAoB;AAAA,UAC1G,SAAQiB,GAAI;AACX,YAAAF,IAAQE;AAAA;AAYV,cAVIF,KAAS,EAAEA,aAAiB,UAC9BhB;AAAA,aACGa,KAAiB,iBAAiB,6BACnCD,IAAW,OAAOG,IAAe,6FAC6B,OAAOC,IAAQ;AAAA,UAI9E,GAECA,aAAiB,SAAS,EAAEA,EAAM,WAAWb,IAAqB;AAGpE,YAAAA,EAAmBa,EAAM,OAAO,IAAI;AAEpC,gBAAIG,IAAQL,IAAWA,EAAQ,IAAK;AAEpC,YAAAd;AAAA,cACE,YAAYY,IAAW,YAAYI,EAAM,WAAWG,KAAS,OAAOA,IAAQ;AAAA,YAC7E;AAAA;;;;AAYX,SAAAV,EAAe,oBAAoB,WAAW;AAC5C,IAAI,QAAQ,IAAI,aAAa,iBAC3BN,IAAqB,CAAE;AAAA,KAI3BiB,IAAiBX;;","x_google_ignoreList":[0]}

package/dist/index152.js

@@ -0,0 +1,5 @@
+var r = {};
+export {
+  r as __exports
+};
+//# sourceMappingURL=index152.js.map

package/dist/index152.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index152.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/index153.js

@@ -0,0 +1,5 @@
+var e = {};
+export {
+  e as __exports
+};
+//# sourceMappingURL=index153.js.map

package/dist/index153.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index153.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/index16.js

@@ -1,7 +1,7 @@
-var B = Object.defineProperty;
+var I = Object.defineProperty;
 var i = Object.getOwnPropertySymbols;
 var w = Object.prototype.hasOwnProperty, y = Object.prototype.propertyIsEnumerable;
-var h = (e, o, t) => o in e ? B(e, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[o] = t, C = (e, o) => {
+var h = (e, o, t) => o in e ? I(e, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[o] = t, C = (e, o) => {
   for (var t in o || (o = {}))
     w.call(o, t) && h(e, t, o[t]);
   if (i)
@@ -18,7 +18,7 @@ var P = (e, o) => {
       o.indexOf(r) < 0 && y.call(e, r) && (t[r] = e[r]);
   return t;
 };
-import k, { forwardRef as I, useState as E, useRef as x, useEffect as R, useImperativeHandle as N } from "react";
+import k, { forwardRef as N, useState as E, useRef as x, useEffect as R, useImperativeHandle as q } from "react";
 function u() {
   return u = Object.assign ? Object.assign.bind() : function(e) {
     for (var o = 1; o < arguments.length; o++) {
@@ -28,8 +28,8 @@ function u() {
     return e;
   }, u.apply(null, arguments);
 }
-const J = /* @__PURE__ */ I((q, j) => {
-  var m = q, {
+const K = /* @__PURE__ */ N((A, D) => {
+  var m = A, {
     className: e = "",
     automationId: o = "",
     position: t = "bottom-center",
@@ -38,8 +38,9 @@ const J = /* @__PURE__ */ I((q, j) => {
     renderPopoverContents: H,
     renderPopoverSrcElement: L,
     onPopoverToggle: d,
-    isPopoverOpen: a
-  } = m, _ = P(m, [
+    isPopoverOpen: a,
+    disabled: _ = !1
+  } = m, j = P(m, [
     "className",
     "automationId",
     "position",
@@ -48,31 +49,32 @@ const J = /* @__PURE__ */ I((q, j) => {
     "renderPopoverContents",
     "renderPopoverSrcElement",
     "onPopoverToggle",
-    "isPopoverOpen"
+    "isPopoverOpen",
+    "disabled"
   ]);
-  const [l, c] = E(!1), [D, g] = E(t), p = x(null), f = x(null);
+  const [l, c] = E(!1), [X, g] = E(t), p = x(null), f = x(null);
   R(() => {
     if (d && d(l), l)
-      return document.body.addEventListener("click", b), X(), () => document.body.removeEventListener("click", b);
+      return document.body.addEventListener("click", b), $(), () => document.body.removeEventListener("click", b);
   }, [l]), R(() => {
     c(a != null ? a : !1);
   }, [a]);
-  const X = () => {
+  const $ = () => {
     if (!f.current) return;
     const n = f.current.getBoundingClientRect(), s = window.innerHeight;
     (n == null ? void 0 : n.bottom) > s ? g(t.includes("left") ? "top-left" : t.includes("right") ? "top-right" : "top-center") : (n == null ? void 0 : n.top) < 0 && g(t.includes("left") ? "bottom-left" : t.includes("right") ? "bottom-right" : "bottom-center");
   }, b = (n) => {
     const s = p.current;
     if (!s) return;
-    const z = n.target;
-    s.contains(z) || c(!1);
+    const B = n.target;
+    s.contains(B) || c(!1);
   }, v = () => {
     c((n) => !n);
   };
-  N(j, () => ({
+  q(D, () => ({
     togglePopover: v
   }), []);
-  const $ = {
+  const z = {
     "bottom-left": {
       left: "0",
       top: "100%"
@@ -101,11 +103,11 @@ const J = /* @__PURE__ */ I((q, j) => {
     }
   };
   return /* @__PURE__ */ k.createElement("div", u({
-    className: "se-design-popover-wrapper cursor-pointer relative" + (e.length > 0 ? ` ${e}` : "") + (l ? " open" : ""),
+    className: "se-design-popover-wrapper cursor-pointer relative" + (e.length > 0 ? ` ${e}` : "") + (l ? " open" : "") + (_ ? " opacity-50 cursor-not-allowed pointer-events-none" : ""),
     ref: p,
     onClick: v,
     "data-automation-id": o
-  }, _), L({
+  }, j), L({
     displayPopover: l
   }), l && /* @__PURE__ */ k.createElement("div", {
     className: `popover-content absolute shadow-md border rounded-md z-[1000] ${S == "full" ? "w-full" : "w-max"}`,
@@ -113,7 +115,7 @@ const J = /* @__PURE__ */ I((q, j) => {
       borderColor: "var(--color-gray-200)",
       color: "var(--color-gray-900)",
       backgroundColor: "var(--color-white)"
-    }, $[D]),
+    }, z[X]),
     onClick: (n) => n.stopPropagation(),
     ref: f,
     "data-automation-id": r
@@ -122,6 +124,6 @@ const J = /* @__PURE__ */ I((q, j) => {
   })));
 });
 export {
-  J as Popover
+  K as Popover
 };
 //# sourceMappingURL=index16.js.map

package/dist/index16.js.map

@@ -1 +1 @@
-{"version":3,"file":"index16.js","sources":["../src/components/Popover/index.tsx"],"sourcesContent":["import React, { useState, useRef, ReactNode, useEffect, forwardRef, ForwardedRef, useImperativeHandle } from 'react';\n\nexport interface PopoverHandle {\n  togglePopover: () => void;\n}\n\nexport interface PopoverProps {\n  className?: string;\n  automationId?: string;\n  popoverContentAutomationId?: string;\n  renderPopoverContents: (props: { closePopoverCb: () => void }) => ReactNode;\n  renderPopoverSrcElement: (props: { displayPopover: boolean }) => ReactNode;\n  position?: 'bottom-center' | 'bottom-left' | 'bottom-right' | 'top-center' | 'top-left' | 'top-right';\n  onPopoverToggle?: (displayPopover: boolean) => void;\n  contentWidth?: 'full' | 'max';\n  isPopoverOpen?: boolean;\n}\n\nexport const Popover = forwardRef<PopoverHandle, PopoverProps>(\n  (\n    {\n      className = '',\n      automationId = '',\n      position = 'bottom-center',\n      popoverContentAutomationId = '',\n      contentWidth = 'max',\n      renderPopoverContents,\n      renderPopoverSrcElement,\n      onPopoverToggle,\n      isPopoverOpen,\n      ...props\n    },\n    ref: ForwardedRef<PopoverHandle>\n  ) => {\n    const [displayPopover, setDisplayPopover] = useState(false);\n    const [popoverPosition, setPopoverPosition] = useState(position);\n    const srcElementRef = useRef<HTMLDivElement>(null);\n    const popoverContentRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n      if (onPopoverToggle) {\n        onPopoverToggle(displayPopover);\n      }\n      if (displayPopover) {\n        document.body.addEventListener('click', clickListener);\n        checkPopoverPosition();\n        return () => document.body.removeEventListener('click', clickListener);\n      }\n    }, [displayPopover]);\n\n    useEffect(() => {\n      setDisplayPopover(isPopoverOpen ?? false);\n    }, [isPopoverOpen]);\n\n    //Function to check popover position\n    const checkPopoverPosition = () => {\n      if (!popoverContentRef.current) return;\n\n      const popoverRect = popoverContentRef.current.getBoundingClientRect();\n      const viewportHeight = window.innerHeight;\n\n      if (popoverRect?.bottom > viewportHeight) {\n        setPopoverPosition(\n          position.includes('left') ? 'top-left' : position.includes('right') ? 'top-right' : 'top-center'\n        );\n      } else if (popoverRect?.top < 0) {\n        // If popover extends beyond top of viewport, switch to bottom position\n        setPopoverPosition(\n          position.includes('left') ? 'bottom-left' : position.includes('right') ? 'bottom-right' : 'bottom-center'\n        );\n      }\n    };\n\n    const clickListener = (event: MouseEvent) => {\n      const currentDropRef = srcElementRef.current;\n      if (!currentDropRef) return;\n\n      const target = event.target as Node;\n      const isSourcePopover = currentDropRef.contains(target);\n      // if clicked source is parent or the popover-content, do not toggle dropdown.\n      if (!isSourcePopover) {\n        setDisplayPopover(false);\n      }\n    };\n\n    const togglePopover = () => {\n      setDisplayPopover((displayPopover) => !displayPopover);\n    };\n\n    useImperativeHandle(ref, () => ({ togglePopover }), []);\n\n    const popoverContentStyle = {\n      'bottom-left': { left: '0', top: '100%' },\n      'bottom-right': { right: '0', top: '100%' },\n      'bottom-center': { left: '50%', transform: 'translateX(-50%)', top: '100%' },\n      'top-left': { left: '0', bottom: '100%' },\n      'top-right': { right: '0', bottom: '100%' },\n      'top-center': { left: '50%', transform: 'translateX(-50%)', bottom: '100%' }\n    };\n\n    return (\n      <div\n        className={\n          'se-design-popover-wrapper cursor-pointer relative' +\n          (className.length > 0 ? ` ${className}` : '') +\n          (displayPopover ? ' open' : '')\n        }\n        ref={srcElementRef}\n        onClick={togglePopover}\n        data-automation-id={automationId}\n        {...props}\n      >\n        {renderPopoverSrcElement({ displayPopover })}\n\n        {displayPopover && (\n          <div\n            className={`popover-content absolute shadow-md border rounded-md z-[1000] ${contentWidth == 'full' ? 'w-full' : 'w-max'}`}\n            style={{\n              borderColor: 'var(--color-gray-200)',\n              color: 'var(--color-gray-900)',\n              backgroundColor: 'var(--color-white)',\n              ...popoverContentStyle[popoverPosition]\n            }}\n            onClick={(e) => e.stopPropagation()}\n            ref={popoverContentRef}\n            data-automation-id={popoverContentAutomationId}\n          >\n            {renderPopoverContents({ closePopoverCb: () => setDisplayPopover(false) })}\n          </div>\n        )}\n      </div>\n    );\n  }\n);\n"],"names":["Popover","_a","ref","_b","className","automationId","position","popoverContentAutomationId","contentWidth","renderPopoverContents","renderPopoverSrcElement","onPopoverToggle","isPopoverOpen","props","displayPopover","setDisplayPopover","useState","popoverPosition","setPopoverPosition","srcElementRef","useRef","popoverContentRef","useEffect","body","addEventListener","clickListener","checkPopoverPosition","document","removeEventListener","current","popoverRect","getBoundingClientRect","viewportHeight","window","innerHeight","bottom","includes","top","event","currentDropRef","target","contains","togglePopover","useImperativeHandle","popoverContentStyle","left","right","transform","React","createElement","_extends","length","onClick","style","__spreadValues","borderColor","color","backgroundColor","e","stopPropagation","closePopoverCb"],"mappings":"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"}
+{"version":3,"file":"index16.js","sources":["../src/components/Popover/index.tsx"],"sourcesContent":["import React, { useState, useRef, ReactNode, useEffect, forwardRef, ForwardedRef, useImperativeHandle } from 'react';\n\nexport interface PopoverHandle {\n  togglePopover: () => void;\n}\n\nexport interface PopoverProps {\n  className?: string;\n  automationId?: string;\n  popoverContentAutomationId?: string;\n  renderPopoverContents: (props: { closePopoverCb: () => void }) => ReactNode;\n  renderPopoverSrcElement: (props: { displayPopover: boolean }) => ReactNode;\n  position?: 'bottom-center' | 'bottom-left' | 'bottom-right' | 'top-center' | 'top-left' | 'top-right';\n  onPopoverToggle?: (displayPopover: boolean) => void;\n  contentWidth?: 'full' | 'max';\n  isPopoverOpen?: boolean;\n  disabled?: boolean;\n}\n\nexport const Popover = forwardRef<PopoverHandle, PopoverProps>(\n  (\n    {\n      className = '',\n      automationId = '',\n      position = 'bottom-center',\n      popoverContentAutomationId = '',\n      contentWidth = 'max',\n      renderPopoverContents,\n      renderPopoverSrcElement,\n      onPopoverToggle,\n      isPopoverOpen,\n      disabled = false,\n      ...props\n    },\n    ref: ForwardedRef<PopoverHandle>\n  ) => {\n    const [displayPopover, setDisplayPopover] = useState(false);\n    const [popoverPosition, setPopoverPosition] = useState(position);\n    const srcElementRef = useRef<HTMLDivElement>(null);\n    const popoverContentRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n      if (onPopoverToggle) {\n        onPopoverToggle(displayPopover);\n      }\n      if (displayPopover) {\n        document.body.addEventListener('click', clickListener);\n        checkPopoverPosition();\n        return () => document.body.removeEventListener('click', clickListener);\n      }\n    }, [displayPopover]);\n\n    useEffect(() => {\n      setDisplayPopover(isPopoverOpen ?? false);\n    }, [isPopoverOpen]);\n\n    //Function to check popover position\n    const checkPopoverPosition = () => {\n      if (!popoverContentRef.current) return;\n\n      const popoverRect = popoverContentRef.current.getBoundingClientRect();\n      const viewportHeight = window.innerHeight;\n\n      if (popoverRect?.bottom > viewportHeight) {\n        setPopoverPosition(\n          position.includes('left') ? 'top-left' : position.includes('right') ? 'top-right' : 'top-center'\n        );\n      } else if (popoverRect?.top < 0) {\n        // If popover extends beyond top of viewport, switch to bottom position\n        setPopoverPosition(\n          position.includes('left') ? 'bottom-left' : position.includes('right') ? 'bottom-right' : 'bottom-center'\n        );\n      }\n    };\n\n    const clickListener = (event: MouseEvent) => {\n      const currentDropRef = srcElementRef.current;\n      if (!currentDropRef) return;\n\n      const target = event.target as Node;\n      const isSourcePopover = currentDropRef.contains(target);\n      // if clicked source is parent or the popover-content, do not toggle dropdown.\n      if (!isSourcePopover) {\n        setDisplayPopover(false);\n      }\n    };\n\n    const togglePopover = () => {\n      setDisplayPopover((displayPopover) => !displayPopover);\n    };\n\n    useImperativeHandle(ref, () => ({ togglePopover }), []);\n\n    const popoverContentStyle = {\n      'bottom-left': { left: '0', top: '100%' },\n      'bottom-right': { right: '0', top: '100%' },\n      'bottom-center': { left: '50%', transform: 'translateX(-50%)', top: '100%' },\n      'top-left': { left: '0', bottom: '100%' },\n      'top-right': { right: '0', bottom: '100%' },\n      'top-center': { left: '50%', transform: 'translateX(-50%)', bottom: '100%' }\n    };\n\n    return (\n      <div\n        className={\n          'se-design-popover-wrapper cursor-pointer relative' +\n          (className.length > 0 ? ` ${className}` : '') +\n          (displayPopover ? ' open' : '') +\n          (disabled ? ' opacity-50 cursor-not-allowed pointer-events-none' : '')\n        }\n        ref={srcElementRef}\n        onClick={togglePopover}\n        data-automation-id={automationId}\n        {...props}\n      >\n        {renderPopoverSrcElement({ displayPopover })}\n\n        {displayPopover && (\n          <div\n            className={`popover-content absolute shadow-md border rounded-md z-[1000] ${contentWidth == 'full' ? 'w-full' : 'w-max'}`}\n            style={{\n              borderColor: 'var(--color-gray-200)',\n              color: 'var(--color-gray-900)',\n              backgroundColor: 'var(--color-white)',\n              ...popoverContentStyle[popoverPosition]\n            }}\n            onClick={(e) => e.stopPropagation()}\n            ref={popoverContentRef}\n            data-automation-id={popoverContentAutomationId}\n          >\n            {renderPopoverContents({ closePopoverCb: () => setDisplayPopover(false) })}\n          </div>\n        )}\n      </div>\n    );\n  }\n);\n"],"names":["Popover","_a","ref","_b","className","automationId","position","popoverContentAutomationId","contentWidth","renderPopoverContents","renderPopoverSrcElement","onPopoverToggle","isPopoverOpen","disabled","props","displayPopover","setDisplayPopover","useState","popoverPosition","setPopoverPosition","srcElementRef","useRef","popoverContentRef","useEffect","body","addEventListener","clickListener","checkPopoverPosition","document","removeEventListener","current","popoverRect","getBoundingClientRect","viewportHeight","window","innerHeight","bottom","includes","top","event","currentDropRef","target","contains","togglePopover","useImperativeHandle","popoverContentStyle","left","right","transform","React","createElement","_extends","length","onClick","style","__spreadValues","borderColor","color","backgroundColor","e","stopPropagation","closePopoverCb"],"mappings":"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"}

package/dist/index17.js

@@ -23,7 +23,7 @@ const s = (g) => {
     "className"
   ]);
   return /* @__PURE__ */ l.createElement("header", {
-    className: `se-design-header ${e} sticky top-0 h-[35px] w-full z-[1000] bg-gradient-to-r from-[#3A91DA] to-[#2A5092] flex justify-between items-center ${(r == null ? void 0 : r.type) === "fixed" ? "fixed left-0 right-0 top-0" : ""}`
+    className: `se-design-header ${e} sticky top-0 h-[40px] w-full z-[1000] bg-gradient-to-r from-[#3A91DA] to-[#2A5092] flex justify-between items-center ${(r == null ? void 0 : r.type) === "fixed" ? "fixed left-0 right-0 top-0" : ""}`
   }, t && /* @__PURE__ */ l.createElement(l.Fragment, null, t), m && /* @__PURE__ */ l.createElement(l.Fragment, null, m), a && /* @__PURE__ */ l.createElement(l.Fragment, null, a));
 };
 export {

package/dist/index17.js.map

@@ -1 +1 @@
-{"version":3,"file":"index17.js","sources":["../src/components/Header/index.tsx"],"sourcesContent":["import React, { FC } from 'react';\n\nexport interface HeaderProps {\n  leftContainer?: React.ReactNode;\n  centerContainer?: React.ReactNode;\n  rightContainer?: React.ReactNode;\n  type?: string;\n  className?: string;\n}\n\nexport const Header: FC<HeaderProps> = ({\n  leftContainer,\n  centerContainer,\n  rightContainer,\n  className,\n  ...props\n}) => {\n  return (\n    <header className={`se-design-header ${className} sticky top-0 h-[35px] w-full z-[1000] bg-gradient-to-r from-[#3A91DA] to-[#2A5092] flex justify-between items-center ${\n      props?.type === 'fixed' ? 'fixed left-0 right-0 top-0' : ''\n    }`}>\n      {leftContainer && <>{leftContainer}</>}\n      {centerContainer && <>{centerContainer}</>}\n      {rightContainer && <>{rightContainer}</>}\n    </header>\n  );\n};\n"],"names":["Header","_a","_b","leftContainer","centerContainer","rightContainer","className","props","React","createElement","type","Fragment"],"mappings":";;;;;;;;;;;;AAUO,MAAMA,IAA0BA,CAACC,MAMlC;AANkC,MAAAC,IAAAD,GACtCE;AAAAA,mBAAAA;AAAAA,IACAC,iBAAAA;AAAAA,IACAC,gBAAAA;AAAAA,IACAC,WAAAA;AAAAA,MAJsCJ,GAKnCK,IAAAA,EALmCL,GAKnCK;AAAAA,IAJHJ;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA;AAIEE,SAAAA,gBAAAA,EAAAC,cAAA,UAAA;AAAA,IAAQH,WAAW,oBAAoBA,CAAS,0HAC9CC,KAAAA,gBAAAA,EAAOG,UAAS,UAAU,+BAA+B,EAAE;AAAA,EAC1D,GACAP,KAAiBK,gBAAAA,EAAAC,cAAAD,EAAAG,UAAA,MAAGR,CAAgB,GACpCC,KAAmBK,gBAAAA,EAAAA,cAAAD,EAAAG,UAAGP,MAAAA,CAAkB,GACxCC,KAAkBG,gBAAAA,EAAAC,cAAAD,EAAAG,UAAGN,MAAAA,CAAiB,CACjC;AAEZ;"}
+{"version":3,"file":"index17.js","sources":["../src/components/Header/index.tsx"],"sourcesContent":["import React, { FC } from 'react';\n\nexport interface HeaderProps {\n  leftContainer?: React.ReactNode;\n  centerContainer?: React.ReactNode;\n  rightContainer?: React.ReactNode;\n  type?: string;\n  className?: string;\n}\n\nexport const Header: FC<HeaderProps> = ({\n  leftContainer,\n  centerContainer,\n  rightContainer,\n  className,\n  ...props\n}) => {\n  return (\n    <header className={`se-design-header ${className} sticky top-0 h-[40px] w-full z-[1000] bg-gradient-to-r from-[#3A91DA] to-[#2A5092] flex justify-between items-center ${\n      props?.type === 'fixed' ? 'fixed left-0 right-0 top-0' : ''\n    }`}>\n      {leftContainer && <>{leftContainer}</>}\n      {centerContainer && <>{centerContainer}</>}\n      {rightContainer && <>{rightContainer}</>}\n    </header>\n  );\n};\n"],"names":["Header","_a","_b","leftContainer","centerContainer","rightContainer","className","props","React","createElement","type","Fragment"],"mappings":";;;;;;;;;;;;AAUO,MAAMA,IAA0BA,CAACC,MAMlC;AANkC,MAAAC,IAAAD,GACtCE;AAAAA,mBAAAA;AAAAA,IACAC,iBAAAA;AAAAA,IACAC,gBAAAA;AAAAA,IACAC,WAAAA;AAAAA,MAJsCJ,GAKnCK,IAAAA,EALmCL,GAKnCK;AAAAA,IAJHJ;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA;AAIEE,SAAAA,gBAAAA,EAAAC,cAAA,UAAA;AAAA,IAAQH,WAAW,oBAAoBA,CAAS,0HAC9CC,KAAAA,gBAAAA,EAAOG,UAAS,UAAU,+BAA+B,EAAE;AAAA,EAC1D,GACAP,KAAiBK,gBAAAA,EAAAC,cAAAD,EAAAG,UAAA,MAAGR,CAAgB,GACpCC,KAAmBK,gBAAAA,EAAAA,cAAAD,EAAAG,UAAGP,MAAAA,CAAkB,GACxCC,KAAkBG,gBAAAA,EAAAC,cAAAD,EAAAG,UAAGN,MAAAA,CAAiB,CACjC;AAEZ;"}

package/dist/index22.js

@@ -1,54 +1,58 @@
-var $ = Object.defineProperty, P = Object.defineProperties;
-var I = Object.getOwnPropertyDescriptors;
-var g = Object.getOwnPropertySymbols;
-var O = Object.prototype.hasOwnProperty, R = Object.prototype.propertyIsEnumerable;
-var E = (e, t, l) => t in e ? $(e, t, { enumerable: !0, configurable: !0, writable: !0, value: l }) : e[t] = l, S = (e, t) => {
+var I = Object.defineProperty, O = Object.defineProperties;
+var R = Object.getOwnPropertyDescriptors;
+var b = Object.getOwnPropertySymbols;
+var T = Object.prototype.hasOwnProperty, _ = Object.prototype.propertyIsEnumerable;
+var C = (e, t, l) => t in e ? I(e, t, { enumerable: !0, configurable: !0, writable: !0, value: l }) : e[t] = l, E = (e, t) => {
   for (var l in t || (t = {}))
-    O.call(t, l) && E(e, l, t[l]);
-  if (g)
-    for (var l of g(t))
-      R.call(t, l) && E(e, l, t[l]);
+    T.call(t, l) && C(e, l, t[l]);
+  if (b)
+    for (var l of b(t))
+      _.call(t, l) && C(e, l, t[l]);
   return e;
-}, b = (e, t) => P(e, I(t));
-import c, { useState as x, useRef as T, useEffect as _ } from "react";
-import { Popover as j } from "./index16.js";
-import { Icon as C } from "./index4.js";
-const z = (e) => {
-  const [t, l] = x(!1), [r, f] = x(() => (e == null ? void 0 : e.defaultSelectedValue) || {}), v = T(null), {
+}, S = (e, t) => O(e, R(t));
+import c, { useState as x, useRef as j, useEffect as B } from "react";
+import { Popover as J } from "./index16.js";
+import { Icon as D } from "./index4.js";
+const F = (e) => {
+  const [t, l] = x(!1), [r, f] = x(() => (e == null ? void 0 : e.defaultSelectedValue) || {}), v = j(null), {
     selectBy: m = "",
     optionsUniqueBy: d = "",
-    displaySelected: D = !1,
+    displaySelected: h = !1,
     dropDownOptions: i,
-    defaultText: y = "Select"
+    defaultText: y = "Select",
+    iconColor: g = "var(--color-gray-700)",
+    disabled: s = !1
   } = e;
-  _(() => {
+  B(() => {
     f((e == null ? void 0 : e.defaultSelectedValue) || {});
   }, [e == null ? void 0 : e.defaultSelectedValue]);
-  const h = (n) => {
+  const N = (n) => {
     var a, o;
     f(n), (a = v.current) == null || a.togglePopover(), (o = e == null ? void 0 : e.onOptionClick) == null || o.call(e, n);
   }, w = (n) => e != null && e.renderOptionChip ? e == null ? void 0 : e.renderOptionChip(n) : /* @__PURE__ */ c.createElement("span", {
     className: "option-chip"
-  }, n[m] || y), s = (n) => {
-    const a = n[m], o = r[m] || y, V = d != null && d.length ? n[d] == r[d] : !0, u = D && a === o && V;
+  }, n[m] || y), k = (n) => {
+    const a = n[m], o = r[m] || y, P = d != null && d.length ? n[d] == r[d] : !0, u = h && a === o && P;
     return /* @__PURE__ */ c.createElement("div", {
       key: `$drop-option-${a}`,
       className: `option px-3 py-2 hover:bg-gray-100 cursor-pointer flex items-center justify-between ${u ? "selected" : ""}`,
-      onClick: () => h(n)
-    }, w(b(S({}, n), {
+      onClick: () => N(n)
+    }, w(S(E({}, n), {
       isOptionSelected: u
-    })), u && /* @__PURE__ */ c.createElement(C, {
-      name: "checkmark"
+    })), u && /* @__PURE__ */ c.createElement(D, {
+      name: "checkmark",
+      stroke: g
     }));
-  }, N = () => /* @__PURE__ */ c.createElement("div", {
+  }, $ = () => /* @__PURE__ */ c.createElement("div", {
     className: "dropdown-content dropdown-options"
-  }, i == null ? void 0 : i.map((n) => s(n))), k = () => {
-    const a = `dropdown-src-element flex px-3 py-2 border rounded-md ${t ? "border-[var(--color-gray-900)]" : "border-[var(--color-gray-200)]"}`;
+  }, i == null ? void 0 : i.map((n) => k(n))), V = () => {
+    const a = `dropdown-src-element flex px-3 py-2 border rounded-md ${t ? "border-[var(--color-gray-900)]" : "border-[var(--color-gray-200)]"} `;
     return /* @__PURE__ */ c.createElement("div", {
       className: a
-    }, w(r), /* @__PURE__ */ c.createElement(C, {
-      name: "down",
-      className: `ml-auto ${t ? "rotate-180" : ""} transition-transform`
+    }, w(r), /* @__PURE__ */ c.createElement(D, {
+      name: "chevron-down",
+      className: `ml-auto ${t ? "rotate-180" : ""} transition-transform`,
+      stroke: g
     }));
   };
   return /* @__PURE__ */ c.createElement("div", {
@@ -57,16 +61,18 @@ const z = (e) => {
   }, (e == null ? void 0 : e.label) && /* @__PURE__ */ c.createElement("div", {
     className: "se-design-dropdown-label mb-[3px] text-[var(--color-gray-700)] text-sm"
   }, e == null ? void 0 : e.label), /* @__PURE__ */ c.createElement("div", {
-    style: e == null ? void 0 : e.style
-  }, /* @__PURE__ */ c.createElement(j, {
+    style: e == null ? void 0 : e.style,
+    className: `${s ? "bg-[var(--color-gray-200)] rounded-md cursor-not-allowed" : ""}`
+  }, /* @__PURE__ */ c.createElement(J, {
     ref: v,
-    renderPopoverContents: N,
+    renderPopoverContents: $,
     contentWidth: "full",
-    renderPopoverSrcElement: k,
-    onPopoverToggle: (n) => l(n)
+    renderPopoverSrcElement: V,
+    onPopoverToggle: (n) => l(n),
+    disabled: s
   })));
 };
 export {
-  z as Dropdown
+  F as Dropdown
 };
 //# sourceMappingURL=index22.js.map

package/dist/index22.js.map

@@ -1 +1 @@
-{"version":3,"file":"index22.js","sources":["../src/components/Dropdown/index.tsx"],"sourcesContent":["import React, { FC, useState, useRef, useEffect } from 'react';\n\nimport { Popover, PopoverHandle } from 'src/components/Popover';\nimport { Icon } from 'components/Icon';\n\ntype DropdownValue = {\n  [key: string]: any;\n};\n\ntype DropdownProps = {\n  label?: string;\n  type: 'select';\n  dropDownOptions?: DropdownValue[];\n  defaultText?: string;\n  selectBy?: string;\n  optionsUniqueBy?: string;\n  displaySelected?: boolean;\n  defaultSelectedValue?: DropdownValue;\n  onOptionClick?: (selectedValue: DropdownValue) => void;\n  style?: React.CSSProperties;\n  renderOptionChip?: (option: DropdownValue) => React.ReactNode;\n  className?: string;\n};\n\nexport const Dropdown: FC<DropdownProps> = (props) => {\n  const [isDropDownOpen, setIsDropDownOpen] = useState(false);\n  const [selectedDropDownValue, setSelectedDropDownValue] = useState<DropdownValue>(\n    () => props?.defaultSelectedValue || {}\n  );\n  const popoverRef = useRef<HTMLDivElement & PopoverHandle>(null);\n\n  const {\n    selectBy = '',\n    optionsUniqueBy = '',\n    displaySelected = false,\n    dropDownOptions,\n    defaultText = 'Select'\n  } = props;\n\n  useEffect(() => {\n    setSelectedDropDownValue(props?.defaultSelectedValue || {});\n  }, [props?.defaultSelectedValue]);\n\n  const handleDropDownOptionClick = (dropDownOption: any) => {\n    setSelectedDropDownValue(dropDownOption);\n    popoverRef.current?.togglePopover();\n    props?.onOptionClick?.(dropDownOption);\n  };\n\n  const optionChip = (option: DropdownValue) => {\n    if (props?.renderOptionChip) {\n      return props?.renderOptionChip(option);\n    }\n    return <span className={`option-chip`}>{option[selectBy] || defaultText}</span>;\n  };\n\n  const dropDownOptionJsx = (dropDownOption: DropdownValue) => {\n    const optionTxt = dropDownOption[selectBy];\n    const dropDownSelectedValue = selectedDropDownValue[selectBy] || defaultText;\n    const selectByUniqueId = optionsUniqueBy?.length\n      ? dropDownOption[optionsUniqueBy] == selectedDropDownValue[optionsUniqueBy]\n      : true;\n    const isOptionSelected = displaySelected && optionTxt === dropDownSelectedValue && selectByUniqueId;\n    return (\n      <div\n        key={`$drop-option-${optionTxt}`}\n        className={`option px-3 py-2 hover:bg-gray-100 cursor-pointer flex items-center justify-between ${isOptionSelected ? 'selected' : ''}`}\n        onClick={() => handleDropDownOptionClick(dropDownOption)}\n      >\n        {optionChip({ ...dropDownOption, isOptionSelected })}\n        {isOptionSelected && <Icon name=\"checkmark\" />}\n      </div>\n    );\n  };\n\n  const renderDropdownContents = () => {\n    return (\n      <div className=\"dropdown-content dropdown-options\">\n        {dropDownOptions?.map((dropDownOption) => dropDownOptionJsx(dropDownOption))}\n      </div>\n    );\n  };\n\n  const renderDropdownSelect = () => {\n    const borderColor = isDropDownOpen ? 'border-[var(--color-gray-900)]' : 'border-[var(--color-gray-200)]';\n    const dropDownSelectClass = `dropdown-src-element flex px-3 py-2 border rounded-md ${borderColor}`;\n\n    return (\n      <div className={dropDownSelectClass}>\n        {optionChip(selectedDropDownValue)}\n        <Icon name=\"down\" className={`ml-auto ${isDropDownOpen ? 'rotate-180' : ''} transition-transform`} />\n      </div>\n    );\n  };\n\n  return (\n    <div className={`se-design-dropdown-container ${props?.className}`} style={props?.style}>\n      {props?.label && (\n        <div className=\"se-design-dropdown-label mb-[3px] text-[var(--color-gray-700)] text-sm\">{props?.label}</div>\n      )}\n      <div style={props?.style}>\n        <Popover\n          ref={popoverRef}\n          renderPopoverContents={renderDropdownContents}\n          contentWidth={'full'}\n          renderPopoverSrcElement={renderDropdownSelect}\n          onPopoverToggle={(value) => setIsDropDownOpen(value)}\n        />\n      </div>\n    </div>\n  );\n};\n"],"names":["React__default","useState","useRef","useEffect","Popover","Icon","Dropdown","props","isDropDownOpen","setIsDropDownOpen","selectedDropDownValue","setSelectedDropDownValue","defaultSelectedValue","popoverRef","selectBy","optionsUniqueBy","displaySelected","dropDownOptions","defaultText","handleDropDownOptionClick","dropDownOption","_a","_b","current","togglePopover","onOptionClick","optionChip","option","renderOptionChip","React","createElement","className","dropDownOptionJsx","optionTxt","dropDownSelectedValue","selectByUniqueId","length","isOptionSelected","key","onClick","__spreadProps","__spreadValues","name","renderDropdownContents","map","renderDropdownSelect","dropDownSelectClass","style","label","ref","renderPopoverContents","contentWidth","renderPopoverSrcElement","onPopoverToggle","value"],"mappings":"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"}
+{"version":3,"file":"index22.js","sources":["../src/components/Dropdown/index.tsx"],"sourcesContent":["import React, { FC, useState, useRef, useEffect } from 'react';\n\nimport { Popover, PopoverHandle } from 'src/components/Popover';\nimport { Icon } from 'components/Icon';\n\ntype DropdownValue = {\n  [key: string]: any;\n};\n\ntype DropdownProps = {\n  label?: string;\n  type: 'select';\n  dropDownOptions?: DropdownValue[];\n  defaultText?: string;\n  selectBy?: string;\n  optionsUniqueBy?: string;\n  displaySelected?: boolean;\n  defaultSelectedValue?: DropdownValue;\n  onOptionClick?: (selectedValue: DropdownValue) => void;\n  style?: React.CSSProperties;\n  renderOptionChip?: (option: DropdownValue) => React.ReactNode;\n  className?: string;\n  iconColor?: string;\n  disabled?: boolean;\n};\n\nexport const Dropdown: FC<DropdownProps> = (props) => {\n  const [isDropDownOpen, setIsDropDownOpen] = useState(false);\n  const [selectedDropDownValue, setSelectedDropDownValue] = useState<DropdownValue>(\n    () => props?.defaultSelectedValue || {}\n  );\n  const popoverRef = useRef<HTMLDivElement & PopoverHandle>(null);\n\n  const {\n    selectBy = '',\n    optionsUniqueBy = '',\n    displaySelected = false,\n    dropDownOptions,\n    defaultText = 'Select',\n    iconColor = 'var(--color-gray-700)',\n    disabled = false,\n  } = props;\n\n  useEffect(() => {\n    setSelectedDropDownValue(props?.defaultSelectedValue || {});\n  }, [props?.defaultSelectedValue]);\n\n  const handleDropDownOptionClick = (dropDownOption: any) => {\n    setSelectedDropDownValue(dropDownOption);\n    popoverRef.current?.togglePopover();\n    props?.onOptionClick?.(dropDownOption);\n  };\n\n  const optionChip = (option: DropdownValue) => {\n    if (props?.renderOptionChip) {\n      return props?.renderOptionChip(option);\n    }\n    return <span className={`option-chip`}>{option[selectBy] || defaultText}</span>;\n  };\n\n  const dropDownOptionJsx = (dropDownOption: DropdownValue) => {\n    const optionTxt = dropDownOption[selectBy];\n    const dropDownSelectedValue = selectedDropDownValue[selectBy] || defaultText;\n    const selectByUniqueId = optionsUniqueBy?.length\n      ? dropDownOption[optionsUniqueBy] == selectedDropDownValue[optionsUniqueBy]\n      : true;\n    const isOptionSelected = displaySelected && optionTxt === dropDownSelectedValue && selectByUniqueId;\n    return (\n      <div\n        key={`$drop-option-${optionTxt}`}\n        className={`option px-3 py-2 hover:bg-gray-100 cursor-pointer flex items-center justify-between ${isOptionSelected ? 'selected' : ''}`}\n        onClick={() => handleDropDownOptionClick(dropDownOption)}\n      >\n        {optionChip({ ...dropDownOption, isOptionSelected })}\n        {isOptionSelected && <Icon name=\"checkmark\" stroke={iconColor} />}\n      </div>\n    );\n  };\n\n  const renderDropdownContents = () => {\n    return (\n      <div className=\"dropdown-content dropdown-options\">\n        {dropDownOptions?.map((dropDownOption) => dropDownOptionJsx(dropDownOption))}\n      </div>\n    );\n  };\n\n  const renderDropdownSelect = () => {\n    const borderColor = isDropDownOpen ? 'border-[var(--color-gray-900)]' : 'border-[var(--color-gray-200)]';\n    const dropDownSelectClass = `dropdown-src-element flex px-3 py-2 border rounded-md ${borderColor} `;\n\n    return (\n      <div className={dropDownSelectClass}>\n        {optionChip(selectedDropDownValue)}\n        <Icon\n          name=\"chevron-down\"\n          className={`ml-auto ${isDropDownOpen ? 'rotate-180' : ''} transition-transform`}\n          stroke={iconColor}\n        />\n      </div>\n    );\n  };\n\n  return (\n    <div className={`se-design-dropdown-container ${props?.className}`} style={props?.style}>\n      {props?.label && (\n        <div className=\"se-design-dropdown-label mb-[3px] text-[var(--color-gray-700)] text-sm\">{props?.label}</div>\n      )}\n      <div style={props?.style} className={`${disabled ? 'bg-[var(--color-gray-200)] rounded-md cursor-not-allowed' : ''}`}>\n        <Popover\n          ref={popoverRef}\n          renderPopoverContents={renderDropdownContents}\n          contentWidth={'full'}\n          renderPopoverSrcElement={renderDropdownSelect}\n          onPopoverToggle={(value) => setIsDropDownOpen(value)}\n          disabled={disabled}\n        />\n      </div>\n    </div>\n  );\n};\n"],"names":["React__default","useState","useRef","useEffect","Popover","Icon","Dropdown","props","isDropDownOpen","setIsDropDownOpen","selectedDropDownValue","setSelectedDropDownValue","defaultSelectedValue","popoverRef","selectBy","optionsUniqueBy","displaySelected","dropDownOptions","defaultText","iconColor","disabled","handleDropDownOptionClick","dropDownOption","_a","_b","current","togglePopover","onOptionClick","optionChip","option","renderOptionChip","React","createElement","className","dropDownOptionJsx","optionTxt","dropDownSelectedValue","selectByUniqueId","length","isOptionSelected","key","onClick","__spreadProps","__spreadValues","name","stroke","renderDropdownContents","map","renderDropdownSelect","dropDownSelectClass","style","label","ref","renderPopoverContents","contentWidth","renderPopoverSrcElement","onPopoverToggle","value"],"mappings":"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"}

package/dist/index26.js

@@ -1,33 +1,65 @@
-import r, { useState as u, useEffect as a } from "react";
-const x = ({
-  defaultActiveTab: o,
-  tabs: c,
-  onTabChange: s
+import r, { useState as g, useEffect as E } from "react";
+import { Icon as k } from "./index4.js";
+import { Dropdown as N } from "./index22.js";
+/* empty css         */
+const b = ({
+  defaultActiveTab: c,
+  tabs: o,
+  onTabChange: n,
+  primaryTabCount: a = 0
 }) => {
-  const m = o || (c[0] ? c[0].id : ""), [n, t] = u(m);
-  a(() => {
-    t(o || "");
-  }, [o]);
-  const v = (e) => {
-    t(e == null ? void 0 : e.id), s == null || s(e == null ? void 0 : e.id);
-  }, i = (e, l) => e.id === l;
+  const x = c || (o[0] ? o[0].id : ""), [l, m] = g(x), [v, p] = g(!1), u = a || (o == null ? void 0 : o.length), w = o.slice(0, u), t = o.slice(u), s = t.find((e) => e.id === l);
+  E(() => {
+    m(c || "");
+  }, [c]);
+  const i = (e) => {
+    m(e == null ? void 0 : e.id), n == null || n(e == null ? void 0 : e.id);
+  }, f = (e, d) => e.id === d;
   return /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement("div", {
-    className: "se-design-tabs flex items-center gap-4"
-  }, c.map((e) => {
-    const l = n === e.id, d = e.disabled;
+    className: "se-design-tabs flex items-center relative border rounded-md border-[var(--color-gray-200)] w-fit"
+  }, w.map((e) => {
+    const d = l === e.id, y = e.disabled;
     return /* @__PURE__ */ r.createElement("div", {
       key: e.label,
-      onClick: () => !d && v(e),
-      className: `text-base ${d ? "text-[var(--color-gray-400)] cursor-not-allowed" : l ? "text-[var(--color-gray-900)] font-bold hover:cursor-pointer" : "text-[var(--color-gray-700)] font-normal hover:text-[var(--color-gray-900)] cursor-pointer"}`
+      onClick: () => !y && i(e),
+      className: `text-base px-3 py-0.5 border-l first:border-l-0 border-[var(--color-gray-200)] ${y ? "text-[var(--color-gray-400)] cursor-not-allowed" : d ? "text-[var(--color-blue-500)] bg-[var(--color-blue-100)] font-medium hover:cursor-pointer" : "text-[var(--color-gray-700)] font-normal hover:text-[var(--color-gray-900)] cursor-pointer"}`
     }, e.label);
-  })), /* @__PURE__ */ r.createElement("div", {
+  }), t.length > 0 && /* @__PURE__ */ r.createElement("div", {
+    className: "relative"
+  }, /* @__PURE__ */ r.createElement("div", {
+    className: `cursor-pointer text-base text-[var(--color-gray-700)] border-l border-[var(--color-gray-200)] py-0.5 px-1.5 ${s ? "bg-[var(--color-blue-100)]" : ""}`
+  }, s ? /* @__PURE__ */ r.createElement(N, {
+    defaultSelectedValue: s,
+    defaultText: "Select",
+    displaySelected: !0,
+    dropDownOptions: t,
+    optionsUniqueBy: "id",
+    selectBy: "label",
+    className: "se-design-tabs-dropdown",
+    type: "select",
+    onOptionClick: (e) => {
+      i(e);
+    },
+    iconColor: "var(--color-blue-500)"
+  }) : /* @__PURE__ */ r.createElement(k, {
+    name: "kebab-menu",
+    onClick: () => p(!v)
+  })), v && /* @__PURE__ */ r.createElement("div", {
+    className: "absolute top-full left-0 mt-1 bg-white border border-[var(--color-gray-200)] min-w-[165px] w-max shadow-lg rounded-md z-10"
+  }, t.map((e) => /* @__PURE__ */ r.createElement("div", {
+    key: e.label,
+    onClick: () => {
+      i(e), p(!1);
+    },
+    className: `px-4 py-2 cursor-pointer hover:bg-gray-100 ${l === e.id ? "text-[var(--color-gray-900)] font-bold" : "text-[var(--color-gray-700)]"}`
+  }, e.label))))), /* @__PURE__ */ r.createElement("div", {
     className: "se-design-tabs-content"
-  }, c.map((e) => /* @__PURE__ */ r.createElement("div", {
+  }, o.map((e) => /* @__PURE__ */ r.createElement("div", {
     key: e.id,
-    className: `tab-content ${i(e, n) ? "block" : "hidden"}`
-  }, i(e, n) && (e == null ? void 0 : e.renderTabContent) && (e == null ? void 0 : e.renderTabContent(e))))));
+    className: `tab-content ${f(e, l) ? "block" : "hidden"}`
+  }, f(e, l) && (e == null ? void 0 : e.renderTabContent) && (e == null ? void 0 : e.renderTabContent(e))))));
 };
 export {
-  x as Tabs
+  b as Tabs
 };
 //# sourceMappingURL=index26.js.map