@wix/design-system 1.161.0 → 1.163.0

package/dist/cjs/Palette/Palette.st.css.js

@@ -5,7 +5,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_161_0_Palette";
+var _namespace_ = "wds_1_163_0_Palette";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_161_0_Palette__root","fillPreview":"wds_1_161_0_Palette__fillPreview"};
+module.exports.classes = {"root":"wds_1_163_0_Palette__root","fillPreview":"wds_1_163_0_Palette__fillPreview"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/Popover/Popover.st.css.js

@@ -7,7 +7,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_161_0_Popover";
+var _namespace_ = "wds_1_163_0_Popover";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -15,7 +15,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_161_0_Popover__root","content":"wds_1_161_0_Popover__content","arrow":"wds_1_161_0_Popover__arrow","element":"wds_1_161_0_Popover__element","animationEnter":"wds_1_161_0_Popover__animationEnter","animationEnterActive":"wds_1_161_0_Popover__animationEnterActive","animationExit":"wds_1_161_0_Popover__animationExit","animationExitActive":"wds_1_161_0_Popover__animationExitActive"};
+module.exports.classes = {"root":"wds_1_163_0_Popover__root","content":"wds_1_163_0_Popover__content","arrow":"wds_1_163_0_Popover__arrow","element":"wds_1_163_0_Popover__element","animationEnter":"wds_1_163_0_Popover__animationEnter","animationEnterActive":"wds_1_163_0_Popover__animationEnterActive","animationExit":"wds_1_163_0_Popover__animationExit","animationExitActive":"wds_1_163_0_Popover__animationExitActive"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/PopoverMenu/PopoverMenu.st.css.js

@@ -7,7 +7,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_161_0_PopoverMenu";
+var _namespace_ = "wds_1_163_0_PopoverMenu";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -15,7 +15,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_161_0_PopoverMenu__root","listItem":"wds_1_161_0_PopoverMenu__listItem"};
+module.exports.classes = {"root":"wds_1_163_0_PopoverMenu__root","listItem":"wds_1_163_0_PopoverMenu__listItem"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/PopoverNext/PopoverNext.driver.js

@@ -0,0 +1,87 @@
+"use strict";
+
+exports.__esModule = true;
+exports.popoverNextLegacyDriverFactory = void 0;
+var getPopoverDataHook = element => element && element.getAttribute('data-hook') || undefined;
+var _getTriggerElement = element => element && element.querySelector("[data-hook=\"".concat(getPopoverDataHook(element), "-trigger\"]"));
+var _getContentElement = element => element && element.querySelector("[data-hook=\"".concat(getPopoverDataHook(element), "-content\"]"));
+
+//TODO: update when implemented
+var _getArrowElement = element => element && element.querySelectorAll('[data-hook="popover-arrow"]')[0];
+
+/** @deprecated use popoverNextUniDriverFactory instead */
+var popoverNextLegacyDriverFactory = _ref => {
+  var {
+    element,
+    eventTrigger
+  } = _ref;
+  return {
+    /** Whether the element exists or not */
+    exists: () => !!element,
+    /** Returns the target element (`<Popover.Trigger/>`)
+     * @deprecated
+     * Use getTriggerElement
+    */
+    getTargetElement: () => _getTriggerElement(element),
+    /**  Returns the trigger element (`<Popover.Trigger/>`) */
+    getTriggerElement: () => _getTriggerElement(element),
+    /** Returns the content element (`<Popover.Content/>`) */
+    getContentElement: () => _getContentElement(element),
+    /** Returns the arrow element
+     * @todo not yet implemented
+    */
+    getArrowElement: () => _getArrowElement(element),
+    /** Returns `true` whether the target element (`<Popover.Trigger/>`) exists
+     * @deprecated - use isTriggerElementExists
+    */
+    isTargetElementExists: () => !!_getTriggerElement(element),
+    /** Returns `true` whether the target element (`<Popover.Trigger/>`) exists */
+    isTriggerElementExists: () => !!_getTriggerElement(element),
+    /** Returns `true` whether the content element (`<Popover.Content/>`) exists */
+    isContentElementExists: () => !!_getContentElement(element),
+    /** Trigger `mouseEnter` on the element */
+    mouseEnter: () => element && eventTrigger.mouseEnter(element),
+    /** Trigger `mouseLeave` on the element */
+    mouseLeave: () => element && eventTrigger.mouseLeave(element),
+    /** Click on the element */
+    click: () => {
+      var triggerElement = _getTriggerElement(element);
+      if (triggerElement) {
+        eventTrigger.click(triggerElement);
+      }
+    },
+    /** Click outside the element */
+    clickOutside: () => {
+      document.dispatchEvent(new Event('mousedown'));
+      document.dispatchEvent(new Event('mouseup'));
+    },
+    /** Returns the arrow offset */
+    getArrowOffset: () => {
+      var _getArrowElement2;
+      // @ts-ignore
+      var {
+        top,
+        left,
+        right,
+        bottom
+      } = (_getArrowElement2 = _getArrowElement(element)) == null ? void 0 : _getArrowElement2.style;
+      return {
+        top,
+        left,
+        right,
+        bottom
+      };
+    },
+    /** Returns the element's inline styles
+     * @deprecated
+    */
+    // @ts-ignore
+    inlineStyles: () => element == null ? void 0 : element.style,
+    /** Returns the element's id
+     * @deprecated
+    */
+    getElementId: () => element == null ? void 0 : element.id
+  };
+};
+exports.popoverNextLegacyDriverFactory = popoverNextLegacyDriverFactory;
+//# sourceMappingURL=PopoverNext.driver.js.map

package/dist/cjs/PopoverNext/PopoverNext.driver.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getPopoverDataHook","element","getAttribute","undefined","getTriggerElement","querySelector","concat","getContentElement","getArrowElement","querySelectorAll","popoverNextLegacyDriverFactory","_ref","eventTrigger","exists","getTargetElement","isTargetElementExists","isTriggerElementExists","isContentElementExists","mouseEnter","mouseLeave","click","triggerElement","clickOutside","document","dispatchEvent","Event","getArrowOffset","_getArrowElement2","top","left","right","bottom","style","inlineStyles","getElementId","id","exports"],"sources":["../../../src/PopoverNext/PopoverNext.driver.ts"],"sourcesContent":["import type { Simulate } from 'react-dom/test-utils';\n\nconst getPopoverDataHook = (element: Element | undefined) =>\n  element && element.getAttribute('data-hook') || undefined\n\nconst getTriggerElement = (element?: Element) =>\n  element && element.querySelector(`[data-hook=\"${getPopoverDataHook(element)}-trigger\"]`);\n\n\nconst getContentElement = (element: Element | undefined) =>\n  element && element.querySelector(`[data-hook=\"${getPopoverDataHook(element)}-content\"]`);\n\n//TODO: update when implemented\nconst getArrowElement = (element?: Element) =>\n  element && element.querySelectorAll('[data-hook=\"popover-arrow\"]')[0];\n\n/** @deprecated use popoverNextUniDriverFactory instead */\nexport const popoverNextLegacyDriverFactory = ({\n  element,\n  eventTrigger,\n}: {\n  element: Element | undefined;\n  eventTrigger: typeof Simulate;\n}) => ({\n  /** Whether the element exists or not */\n  exists: () => !!element,\n\n  /** Returns the target element (`<Popover.Trigger/>`)\n   * @deprecated\n   * Use getTriggerElement\n  */\n  getTargetElement: () => getTriggerElement(element),\n\n  /**  Returns the trigger element (`<Popover.Trigger/>`) */\n  getTriggerElement: () => getTriggerElement(element),\n\n  /** Returns the content element (`<Popover.Content/>`) */\n  getContentElement: () => getContentElement(element),\n\n  /** Returns the arrow element\n   * @todo not yet implemented\n  */\n  getArrowElement: () => getArrowElement(element),\n\n  /** Returns `true` whether the target element (`<Popover.Trigger/>`) exists\n   * @deprecated - use isTriggerElementExists\n  */\n  isTargetElementExists: () => !!getTriggerElement(element),\n\n    /** Returns `true` whether the target element (`<Popover.Trigger/>`) exists */\n  isTriggerElementExists: () => !!getTriggerElement(element),\n\n  /** Returns `true` whether the content element (`<Popover.Content/>`) exists */\n  isContentElementExists: () => !!getContentElement(element),\n\n  /** Trigger `mouseEnter` on the element */\n  mouseEnter: () => element && eventTrigger.mouseEnter(element),\n\n  /** Trigger `mouseLeave` on the element */\n  mouseLeave: () => element && eventTrigger.mouseLeave(element),\n\n  /** Click on the element */\n  click: () => {\n    const triggerElement = getTriggerElement(element);\n    if (triggerElement) {\n      eventTrigger.click(triggerElement);\n    }\n  },\n  /** Click outside the element */\n  clickOutside: () => {\n    document.dispatchEvent(new Event('mousedown'));\n    document.dispatchEvent(new Event('mouseup'));\n  },\n\n  /** Returns the arrow offset */\n  getArrowOffset: () => {\n    // @ts-ignore\n    const { top, left, right, bottom } = getArrowElement(element)?.style;\n    return { top, left, right, bottom };\n  },\n\n  /** Returns the element's inline styles\n   * @deprecated\n  */\n  // @ts-ignore\n  inlineStyles: () => element?.style,\n\n  /** Returns the element's id\n   * @deprecated\n  */\n  getElementId: () => element?.id,\n});\n\nexport type PopoverDriver = ReturnType<typeof popoverNextLegacyDriverFactory>;\n"],"mappings":";;;;AAEA,IAAMA,kBAAkB,GAAIC,OAA4B,IACtDA,OAAO,IAAIA,OAAO,CAACC,YAAY,CAAC,WAAW,CAAC,IAAIC,SAAS;AAE3D,IAAMC,kBAAiB,GAAIH,OAAiB,IAC1CA,OAAO,IAAIA,OAAO,CAACI,aAAa,iBAAAC,MAAA,CAAgBN,kBAAkB,CAACC,OAAO,CAAC,gBAAY,CAAC;AAG1F,IAAMM,kBAAiB,GAAIN,OAA4B,IACrDA,OAAO,IAAIA,OAAO,CAACI,aAAa,iBAAAC,MAAA,CAAgBN,kBAAkB,CAACC,OAAO,CAAC,gBAAY,CAAC;;AAE1F;AACA,IAAMO,gBAAe,GAAIP,OAAiB,IACxCA,OAAO,IAAIA,OAAO,CAACQ,gBAAgB,CAAC,6BAA6B,CAAC,CAAC,CAAC,CAAC;;AAEvE;AACO,IAAMC,8BAA8B,GAAGC,IAAA;EAAA,IAAC;IAC7CV,OAAO;IACPW;EAIF,CAAC,GAAAD,IAAA;EAAA,OAAM;IACL;IACAE,MAAM,EAAEA,CAAA,KAAM,CAAC,CAACZ,OAAO;IAEvB;AACF;AACA;AACA;IACEa,gBAAgB,EAAEA,CAAA,KAAMV,kBAAiB,CAACH,OAAO,CAAC;IAElD;IACAG,iBAAiB,EAAEA,CAAA,KAAMA,kBAAiB,CAACH,OAAO,CAAC;IAEnD;IACAM,iBAAiB,EAAEA,CAAA,KAAMA,kBAAiB,CAACN,OAAO,CAAC;IAEnD;AACF;AACA;IACEO,eAAe,EAAEA,CAAA,KAAMA,gBAAe,CAACP,OAAO,CAAC;IAE/C;AACF;AACA;IACEc,qBAAqB,EAAEA,CAAA,KAAM,CAAC,CAACX,kBAAiB,CAACH,OAAO,CAAC;IAEvD;IACFe,sBAAsB,EAAEA,CAAA,KAAM,CAAC,CAACZ,kBAAiB,CAACH,OAAO,CAAC;IAE1D;IACAgB,sBAAsB,EAAEA,CAAA,KAAM,CAAC,CAACV,kBAAiB,CAACN,OAAO,CAAC;IAE1D;IACAiB,UAAU,EAAEA,CAAA,KAAMjB,OAAO,IAAIW,YAAY,CAACM,UAAU,CAACjB,OAAO,CAAC;IAE7D;IACAkB,UAAU,EAAEA,CAAA,KAAMlB,OAAO,IAAIW,YAAY,CAACO,UAAU,CAAClB,OAAO,CAAC;IAE7D;IACAmB,KAAK,EAAEA,CAAA,KAAM;MACX,IAAMC,cAAc,GAAGjB,kBAAiB,CAACH,OAAO,CAAC;MACjD,IAAIoB,cAAc,EAAE;QAClBT,YAAY,CAACQ,KAAK,CAACC,cAAc,CAAC;MACpC;IACF,CAAC;IACD;IACAC,YAAY,EAAEA,CAAA,KAAM;MAClBC,QAAQ,CAACC,aAAa,CAAC,IAAIC,KAAK,CAAC,WAAW,CAAC,CAAC;MAC9CF,QAAQ,CAACC,aAAa,CAAC,IAAIC,KAAK,CAAC,SAAS,CAAC,CAAC;IAC9C,CAAC;IAED;IACAC,cAAc,EAAEA,CAAA,KAAM;MAAA,IAAAC,iBAAA;MACpB;MACA,IAAM;QAAEC,GAAG;QAAEC,IAAI;QAAEC,KAAK;QAAEC;MAAO,CAAC,IAAAJ,iBAAA,GAAGnB,gBAAe,CAACP,OAAO,CAAC,qBAAxB0B,iBAAA,CAA0BK,KAAK;MACpE,OAAO;QAAEJ,GAAG;QAAEC,IAAI;QAAEC,KAAK;QAAEC;MAAO,CAAC;IACrC,CAAC;IAED;AACF;AACA;IACE;IACAE,YAAY,EAAEA,CAAA,KAAMhC,OAAO,oBAAPA,OAAO,CAAE+B,KAAK;IAElC;AACF;AACA;IACEE,YAAY,EAAEA,CAAA,KAAMjC,OAAO,oBAAPA,OAAO,CAAEkC;EAC/B,CAAC;AAAA,CAAC;AAACC,OAAA,CAAA1B,8BAAA,GAAAA,8BAAA","ignoreList":[]}

package/dist/cjs/PopoverNext/PopoverNext.st.css.js

@@ -4,7 +4,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_161_0_PopoverNext";
+var _namespace_ = "wds_1_163_0_PopoverNext";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,7 +12,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_161_0_PopoverNext__root"};
+module.exports.classes = {"root":"wds_1_163_0_PopoverNext__root"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/PopoverNext/PopoverNext.story.js

@@ -7,7 +7,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _react = _interopRequireWildcard(require("react"));
 var _Box = _interopRequireDefault(require("../Box"));
 var _PopoverNext = _interopRequireDefault(require("./PopoverNext"));
-var _DatePickerNext = _interopRequireDefault(require("./components/DatePickerNext/DatePickerNext"));
 var _DatePicker = _interopRequireDefault(require("../DatePicker"));
 var _2 = require("..");
 var _PopoverNext2 = require("./PopoverNext.constants");
@@ -34,7 +33,7 @@ var Template = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 27,
+      lineNumber: 26,
       columnNumber: 5
     }
   }, /*#__PURE__*/_react.default.createElement(_2.Popover, (0, _extends2.default)({
@@ -45,28 +44,28 @@ var Template = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 28,
+      lineNumber: 27,
       columnNumber: 7
     }
   }), /*#__PURE__*/_react.default.createElement(_2.Popover.Element, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 34,
+      lineNumber: 33,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement("button", {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 35,
+      lineNumber: 34,
       columnNumber: 11
     }
   }, "Native button with old")), /*#__PURE__*/_react.default.createElement(_2.Popover.Content, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 37,
+      lineNumber: 36,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement(_Box.default, {
@@ -74,7 +73,7 @@ var Template = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 38,
+      lineNumber: 37,
       columnNumber: 11
     }
   }, "Content"))), /*#__PURE__*/_react.default.createElement(_PopoverNext.default, (0, _extends2.default)({}, common, {
@@ -83,28 +82,28 @@ var Template = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 41,
+      lineNumber: 40,
       columnNumber: 7
     }
   }), /*#__PURE__*/_react.default.createElement(_PopoverNext.default.Trigger, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 46,
+      lineNumber: 45,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement("button", {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 47,
+      lineNumber: 46,
       columnNumber: 11
     }
   }, "Native button with new")), /*#__PURE__*/_react.default.createElement(_PopoverNext.default.Content, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 49,
+      lineNumber: 48,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement(_Box.default, {
@@ -112,7 +111,7 @@ var Template = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 50,
+      lineNumber: 49,
       columnNumber: 11
     }
   }, "Content"))));
@@ -135,7 +134,7 @@ var ComparisionTemplate = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 70,
+      lineNumber: 69,
       columnNumber: 5
     }
   });
@@ -147,7 +146,7 @@ var ComparisionTemplate = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 74,
+      lineNumber: 73,
       columnNumber: 5
     }
   }, /*#__PURE__*/_react.default.createElement(_PopoverNext.default, (0, _extends2.default)({
@@ -157,28 +156,28 @@ var ComparisionTemplate = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 75,
+      lineNumber: 74,
       columnNumber: 7
     }
   }), /*#__PURE__*/_react.default.createElement(_PopoverNext.default.Trigger, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 76,
+      lineNumber: 75,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement("button", {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 77,
+      lineNumber: 76,
       columnNumber: 11
     }
   }, "Native button with next")), /*#__PURE__*/_react.default.createElement(_PopoverNext.default.Content, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 79,
+      lineNumber: 78,
       columnNumber: 9
     }
   }, content, random)), /*#__PURE__*/_react.default.createElement(_2.Popover, (0, _extends2.default)({
@@ -187,28 +186,28 @@ var ComparisionTemplate = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 84,
+      lineNumber: 83,
       columnNumber: 7
     }
   }), /*#__PURE__*/_react.default.createElement(_2.Popover.Element, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 85,
+      lineNumber: 84,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement("button", {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 86,
+      lineNumber: 85,
       columnNumber: 11
     }
   }, "Native button with old")), /*#__PURE__*/_react.default.createElement(_2.Popover.Content, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 88,
+      lineNumber: 87,
       columnNumber: 9
     }
   }, content, random)));
@@ -239,8 +238,6 @@ var commonDatePickerProps = {
     zIndex: 1000
   }
 };
-
-// TODO: remove once DatePicker is refactored to use PopoverNext
 var DatePickersTemplate = () => /*#__PURE__*/_react.default.createElement(_Box.default, {
   gap: 2,
   paddingTop: 50,
@@ -248,7 +245,7 @@ var DatePickersTemplate = () => /*#__PURE__*/_react.default.createElement(_Box.d
   __self: void 0,
   __source: {
     fileName: _jsxFileName,
-    lineNumber: 125,
+    lineNumber: 123,
     columnNumber: 3
   }
 }, /*#__PURE__*/_react.default.createElement(_DatePicker.default, (0, _extends2.default)({
@@ -257,16 +254,7 @@ var DatePickersTemplate = () => /*#__PURE__*/_react.default.createElement(_Box.d
   __self: void 0,
   __source: {
     fileName: _jsxFileName,
-    lineNumber: 126,
-    columnNumber: 5
-  }
-})), /*#__PURE__*/_react.default.createElement(_DatePickerNext.default, (0, _extends2.default)({
-  placeholderText: "new"
-}, commonDatePickerProps, {
-  __self: void 0,
-  __source: {
-    fileName: _jsxFileName,
-    lineNumber: 127,
+    lineNumber: 124,
     columnNumber: 5
   }
 })));
@@ -287,7 +275,7 @@ var ScrollableContent = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 140,
+      lineNumber: 137,
       columnNumber: 5
     }
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -301,7 +289,7 @@ var ScrollableContent = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 148,
+      lineNumber: 145,
       columnNumber: 7
     }
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -311,7 +299,7 @@ var ScrollableContent = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 157,
+      lineNumber: 154,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement(_Box.default, {
@@ -323,7 +311,7 @@ var ScrollableContent = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 158,
+      lineNumber: 155,
       columnNumber: 11
     }
   }, /*#__PURE__*/_react.default.createElement(_2.Popover, (0, _extends2.default)({
@@ -333,28 +321,28 @@ var ScrollableContent = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 165,
+      lineNumber: 162,
       columnNumber: 13
     }
   }), /*#__PURE__*/_react.default.createElement(_2.Popover.Element, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 166,
+      lineNumber: 163,
       columnNumber: 15
     }
   }, /*#__PURE__*/_react.default.createElement("button", {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 167,
+      lineNumber: 164,
       columnNumber: 17
     }
   }, "I am an plain Button")), /*#__PURE__*/_react.default.createElement(_2.Popover.Content, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 169,
+      lineNumber: 166,
       columnNumber: 15
     }
   }, /*#__PURE__*/_react.default.createElement(_Box.default, {
@@ -363,7 +351,7 @@ var ScrollableContent = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 170,
+      lineNumber: 167,
       columnNumber: 17
     }
   }, "Old popover Content"))), /*#__PURE__*/_react.default.createElement(_PopoverNext.default, (0, _extends2.default)({}, sameProps, {
@@ -371,28 +359,28 @@ var ScrollableContent = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 176,
+      lineNumber: 173,
       columnNumber: 13
     }
   }), /*#__PURE__*/_react.default.createElement(_PopoverNext.default.Trigger, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 177,
+      lineNumber: 174,
       columnNumber: 15
     }
   }, /*#__PURE__*/_react.default.createElement("button", {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 178,
+      lineNumber: 175,
       columnNumber: 17
     }
   }, "Popover trigger")), /*#__PURE__*/_react.default.createElement(_PopoverNext.default.Content, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 180,
+      lineNumber: 177,
       columnNumber: 15
     }
   }, /*#__PURE__*/_react.default.createElement(_Box.default, {
@@ -401,7 +389,7 @@ var ScrollableContent = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 181,
+      lineNumber: 178,
       columnNumber: 17
     }
   }, "New popover Content")))))));
@@ -410,7 +398,7 @@ var ScrollableTemplate = () => /*#__PURE__*/_react.default.createElement(Scrolla
   __self: void 0,
   __source: {
     fileName: _jsxFileName,
-    lineNumber: 194,
+    lineNumber: 191,
     columnNumber: 3
   }
 });
@@ -428,7 +416,7 @@ var ScrollableWrapper = _ref => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 199,
+      lineNumber: 196,
       columnNumber: 5
     }
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -440,7 +428,7 @@ var ScrollableWrapper = _ref => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 206,
+      lineNumber: 203,
       columnNumber: 7
     }
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -450,7 +438,7 @@ var ScrollableWrapper = _ref => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 213,
+      lineNumber: 210,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement(_Box.default, {
@@ -461,7 +449,7 @@ var ScrollableWrapper = _ref => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 214,
+      lineNumber: 211,
       columnNumber: 11
     }
   }, children))));
@@ -481,7 +469,7 @@ var ScrollableContainer = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 240,
+      lineNumber: 237,
       columnNumber: 5
     }
   }, /*#__PURE__*/_react.default.createElement(ScrollableWrapper, {
@@ -489,7 +477,7 @@ var ScrollableContainer = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 241,
+      lineNumber: 238,
       columnNumber: 7
     }
   }, /*#__PURE__*/_react.default.createElement(_PopoverNext.default, (0, _extends2.default)({}, commonProps, {
@@ -499,28 +487,28 @@ var ScrollableContainer = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 242,
+      lineNumber: 239,
       columnNumber: 9
     }
   }), /*#__PURE__*/_react.default.createElement(_PopoverNext.default.Trigger, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 248,
+      lineNumber: 245,
       columnNumber: 11
     }
   }, /*#__PURE__*/_react.default.createElement("button", {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 249,
+      lineNumber: 246,
       columnNumber: 13
     }
   }, "Popover trigger")), /*#__PURE__*/_react.default.createElement(_PopoverNext.default.Content, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 251,
+      lineNumber: 248,
       columnNumber: 11
     }
   }, /*#__PURE__*/_react.default.createElement(_Box.default, {
@@ -530,7 +518,7 @@ var ScrollableContainer = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 252,
+      lineNumber: 249,
       columnNumber: 13
     }
   }, "Content")))), /*#__PURE__*/_react.default.createElement(ScrollableWrapper, {
@@ -538,7 +526,7 @@ var ScrollableContainer = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 259,
+      lineNumber: 256,
       columnNumber: 7
     }
   }, /*#__PURE__*/_react.default.createElement(_2.Popover, (0, _extends2.default)({}, commonProps, {
@@ -547,28 +535,28 @@ var ScrollableContainer = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 260,
+      lineNumber: 257,
       columnNumber: 9
     }
   }), /*#__PURE__*/_react.default.createElement(_2.Popover.Element, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 265,
+      lineNumber: 262,
       columnNumber: 11
     }
   }, /*#__PURE__*/_react.default.createElement("button", {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 266,
+      lineNumber: 263,
       columnNumber: 13
     }
   }, "Popover trigger")), /*#__PURE__*/_react.default.createElement(_2.Popover.Content, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 268,
+      lineNumber: 265,
       columnNumber: 11
     }
   }, /*#__PURE__*/_react.default.createElement(_Box.default, {
@@ -578,7 +566,7 @@ var ScrollableContainer = () => {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 269,
+      lineNumber: 266,
       columnNumber: 13
     }
   }, "Content")))));
@@ -587,7 +575,7 @@ var ScrollableScrollParentTemplate = () => /*#__PURE__*/_react.default.createEle
   __self: void 0,
   __source: {
     fileName: _jsxFileName,
-    lineNumber: 281,
+    lineNumber: 278,
     columnNumber: 11
   }
 });
@@ -596,7 +584,7 @@ var Basic = exports.Basic = {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 284,
+      lineNumber: 281,
       columnNumber: 17
     }
   })
@@ -607,7 +595,7 @@ var Comparision = exports.Comparision = {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 289,
+      lineNumber: 286,
       columnNumber: 17
     }
   })